@dynatrace/strato-components 3.7.1 → 3.8.0

package/charts/xy-chart-adoption/histogram/HistogramToXY.js

@@ -34,12 +34,13 @@ var import_build_y_axes_config = require("./utils/build-y-axes-config.js");
 var import_define_axis_id = require("./utils/define-axis-id.js");
 var import_derive_xychart_props_from_config = require("./utils/derive-xychart-props-from-config.js");
 var import_format_csv = require("./utils/format-csv.js");
+var import_useBehavioralTrackingProps = require("../../../core/hooks/useBehavioralTrackingProps.js");
 var import_download = require("../../../core/utils/download.js");
 var import_get_chart_states_template = require("../../core/components/chart-states/utils/get-chart-states-template.js");
 var import_constants = require("../../core/constants.js");
 var import_useHistogramChartConfig = require("../../histogram/hooks/useHistogramChartConfig.js");
 var import_XYChartRoot = require("../../xy-chart/XYChartRoot.js");
-const getAnnotationField = (d, key) => d[key];
+var import_render_xy_annotations = require("../shared/utils/render-xy-annotations.js");
 const HistogramToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
   const {
     data: propsData,
@@ -60,6 +61,7 @@ const HistogramToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
     onZoomChange,
     infiniteZoom
   } = props;
+  const [behaviorTrackingProps] = (0, import_useBehavioralTrackingProps.useBehavioralTrackingProps)(props);
   const config = (0, import_useHistogramChartConfig.useHistogramChartConfig)(children, {
     colorPalette,
     truncationMode,
@@ -123,6 +125,8 @@ const HistogramToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
       "data-dtrum-allow": dataDtrumAllow,
       truncationMode: config.truncationMode,
       __downloadDataCallback: downloadDataCallback,
+      "data-dt-component": "HistogramChart",
+      ...behaviorTrackingProps,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Tooltip, { _variant: tooltipVariant }),
         errorState && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.ErrorState, { children: errorState }),
@@ -196,50 +200,10 @@ const HistogramToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
         )),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Toolbar, { hidden: !toolbarEnabled, placement: toolbarPlacement }),
         toolbarIntents?.map((intentProps, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Intent, { ...intentProps }, index)),
-        annotations && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-          import_XYChartRoot.XYChart.Annotations,
-          {
-            data: (0, import_transformer_annotations_to_xy.transformHistogramAnnotationsToXY)(annotations.tracks),
-            xAxisId,
-            showLabels: annotations.showLabels,
-            fixedTracks: annotations.visibleTracksLimit,
-            annotationsActions: annotations.annotationsActions,
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                import_XYChartRoot.XYChartAnnotations.Track,
-                {
-                  trackIdAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackId,
-                  labelAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackLabel,
-                  colorAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackColor,
-                  hidden: (d) => getAnnotationField(d, import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackHidden),
-                  symbol: (d) => getAnnotationField(d, import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackSymbol),
-                  indicatorsDisplay: (d) => getAnnotationField(
-                    d,
-                    import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackIndicators
-                  )
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                import_XYChartRoot.XYChartAnnotations.Marker,
-                {
-                  startAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerStart,
-                  endAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerEnd,
-                  trackByAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.trackId,
-                  titleAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerTitle,
-                  descriptionAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerDescription,
-                  colorAccessor: import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerColor,
-                  hidden: (d) => getAnnotationField(d, import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerHidden),
-                  symbol: (d) => getAnnotationField(d, import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerSymbol),
-                  indicatorsDisplay: (d) => getAnnotationField(
-                    d,
-                    import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerIndicators
-                  ),
-                  priority: (d) => getAnnotationField(d, import_transformer_annotations_to_xy.ANNOTATIONS_KEYS.markerPriority)
-                }
-              ),
-              annotations.tooltip?.template && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChartAnnotations.Tooltip, { hidden: annotations.tooltip.hidden, children: annotations.tooltip.template })
-            ]
-          }
+        annotations && (0, import_render_xy_annotations.renderXYAnnotations)(
+          (0, import_transformer_annotations_to_xy.transformHistogramAnnotationsToXY)(annotations.tracks),
+          xAxisId,
+          annotations
         )
       ]
     }

package/charts/xy-chart-adoption/histogram/transformer-annotations-to-xy.d.ts

@@ -1,20 +1,4 @@
 import type { AnnotationsTrackConfig } from '../../core/components/annotations/types/annotations-track-props.js';
 import type { XYChartData } from '../../xy-chart/types/xy-chart.js';
-export declare const ANNOTATIONS_KEYS: {
-    readonly trackId: "__annotationsTrackId";
-    readonly trackLabel: "__annotationsTrackLabel";
-    readonly trackColor: "__annotationsTrackColor";
-    readonly trackHidden: "__annotationsTrackHidden";
-    readonly trackSymbol: "__annotationsTrackSymbol";
-    readonly trackIndicators: "__annotationsTrackIndicators";
-    readonly markerStart: "__annotationsMarkerStart";
-    readonly markerEnd: "__annotationsMarkerEnd";
-    readonly markerTitle: "__annotationsMarkerTitle";
-    readonly markerDescription: "__annotationsMarkerDescription";
-    readonly markerColor: "__annotationsMarkerColor";
-    readonly markerHidden: "__annotationsMarkerHidden";
-    readonly markerSymbol: "__annotationsMarkerSymbol";
-    readonly markerIndicators: "__annotationsMarkerIndicators";
-    readonly markerPriority: "__annotationsMarkerPriority";
-};
+export { ANNOTATIONS_KEYS } from '../shared/utils/render-xy-annotations.js';
 export declare const transformHistogramAnnotationsToXY: (tracks: AnnotationsTrackConfig[]) => XYChartData[];

package/charts/xy-chart-adoption/histogram/transformer-annotations-to-xy.js

@@ -17,27 +17,12 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var transformer_annotations_to_xy_exports = {};
 __export(transformer_annotations_to_xy_exports, {
-  ANNOTATIONS_KEYS: () => ANNOTATIONS_KEYS,
+  ANNOTATIONS_KEYS: () => import_render_xy_annotations2.ANNOTATIONS_KEYS,
   transformHistogramAnnotationsToXY: () => transformHistogramAnnotationsToXY
 });
 module.exports = __toCommonJS(transformer_annotations_to_xy_exports);
-const ANNOTATIONS_KEYS = {
-  trackId: "__annotationsTrackId",
-  trackLabel: "__annotationsTrackLabel",
-  trackColor: "__annotationsTrackColor",
-  trackHidden: "__annotationsTrackHidden",
-  trackSymbol: "__annotationsTrackSymbol",
-  trackIndicators: "__annotationsTrackIndicators",
-  markerStart: "__annotationsMarkerStart",
-  markerEnd: "__annotationsMarkerEnd",
-  markerTitle: "__annotationsMarkerTitle",
-  markerDescription: "__annotationsMarkerDescription",
-  markerColor: "__annotationsMarkerColor",
-  markerHidden: "__annotationsMarkerHidden",
-  markerSymbol: "__annotationsMarkerSymbol",
-  markerIndicators: "__annotationsMarkerIndicators",
-  markerPriority: "__annotationsMarkerPriority"
-};
+var import_render_xy_annotations = require("../shared/utils/render-xy-annotations.js");
+var import_render_xy_annotations2 = require("../shared/utils/render-xy-annotations.js");
 const transformHistogramAnnotationsToXY = (tracks) => {
   const data = [];
   tracks.forEach((track, trackIndex) => {
@@ -46,21 +31,21 @@ const transformHistogramAnnotationsToXY = (tracks) => {
     track.markers.forEach((marker) => {
       const histogramMarker = marker;
       data.push({
-        [ANNOTATIONS_KEYS.trackId]: trackId,
-        [ANNOTATIONS_KEYS.trackLabel]: histogramTrack.label,
-        [ANNOTATIONS_KEYS.trackColor]: histogramTrack.color,
-        [ANNOTATIONS_KEYS.trackHidden]: histogramTrack.hidden,
-        [ANNOTATIONS_KEYS.trackSymbol]: histogramTrack.symbol,
-        [ANNOTATIONS_KEYS.trackIndicators]: histogramTrack.indicatorsDisplay,
-        [ANNOTATIONS_KEYS.markerStart]: histogramMarker.start,
-        [ANNOTATIONS_KEYS.markerEnd]: histogramMarker.end,
-        [ANNOTATIONS_KEYS.markerTitle]: histogramMarker.title,
-        [ANNOTATIONS_KEYS.markerDescription]: histogramMarker.description,
-        [ANNOTATIONS_KEYS.markerColor]: histogramMarker.color,
-        [ANNOTATIONS_KEYS.markerHidden]: histogramMarker.hidden,
-        [ANNOTATIONS_KEYS.markerSymbol]: histogramMarker.symbol,
-        [ANNOTATIONS_KEYS.markerIndicators]: histogramMarker.indicatorsDisplay,
-        [ANNOTATIONS_KEYS.markerPriority]: histogramMarker.priority
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackId]: trackId,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackLabel]: histogramTrack.label,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackColor]: histogramTrack.color,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackHidden]: histogramTrack.hidden,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackSymbol]: histogramTrack.symbol,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.trackIndicators]: histogramTrack.indicatorsDisplay,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerStart]: histogramMarker.start,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerEnd]: histogramMarker.end,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerTitle]: histogramMarker.title,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerDescription]: histogramMarker.description,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerColor]: histogramMarker.color,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerHidden]: histogramMarker.hidden,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerSymbol]: histogramMarker.symbol,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerIndicators]: histogramMarker.indicatorsDisplay,
+        [import_render_xy_annotations.ANNOTATIONS_KEYS.markerPriority]: histogramMarker.priority
       });
     });
   });

package/charts/xy-chart-adoption/shared/types/legacy-props.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Temporary config for toggling legacy chart implementation.
+ * Do not use.
+ * @public
+ */
+export interface _XYChartLegacyProps {
+    /**
+     * This is only intended to be used internally!
+     */
+    __useLegacy?: boolean;
+}

package/charts/xy-chart-adoption/shared/types/legacy-props.js

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var legacy_props_exports = {};
+module.exports = __toCommonJS(legacy_props_exports);

package/charts/xy-chart-adoption/shared/utils/render-xy-annotations.d.ts

@@ -0,0 +1,27 @@
+import type { AnnotationsTooltipConfig } from '../../../core/components/annotations/components/tooltip/types/annotations-tooltip-props.js';
+import type { AnnotationsActionsHandler } from '../../../core/components/annotations/types/annotations.js';
+import type { XYChartData } from '../../../xy-chart/types/xy-chart.js';
+export declare const ANNOTATIONS_KEYS: {
+    readonly trackId: "__annotationsTrackId";
+    readonly trackLabel: "__annotationsTrackLabel";
+    readonly trackColor: "__annotationsTrackColor";
+    readonly trackHidden: "__annotationsTrackHidden";
+    readonly trackSymbol: "__annotationsTrackSymbol";
+    readonly trackIndicators: "__annotationsTrackIndicators";
+    readonly markerStart: "__annotationsMarkerStart";
+    readonly markerEnd: "__annotationsMarkerEnd";
+    readonly markerTitle: "__annotationsMarkerTitle";
+    readonly markerDescription: "__annotationsMarkerDescription";
+    readonly markerColor: "__annotationsMarkerColor";
+    readonly markerHidden: "__annotationsMarkerHidden";
+    readonly markerSymbol: "__annotationsMarkerSymbol";
+    readonly markerIndicators: "__annotationsMarkerIndicators";
+    readonly markerPriority: "__annotationsMarkerPriority";
+};
+export type XYAnnotationsConfig = {
+    showLabels?: boolean;
+    visibleTracksLimit?: number;
+    annotationsActions?: AnnotationsActionsHandler;
+    tooltip?: AnnotationsTooltipConfig;
+};
+export declare const renderXYAnnotations: (data: XYChartData[], xAxisId: string, config: XYAnnotationsConfig) => import("react/jsx-runtime").JSX.Element;

package/charts/xy-chart-adoption/shared/utils/render-xy-annotations.js

@@ -0,0 +1,88 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var render_xy_annotations_exports = {};
+__export(render_xy_annotations_exports, {
+  ANNOTATIONS_KEYS: () => ANNOTATIONS_KEYS,
+  renderXYAnnotations: () => renderXYAnnotations
+});
+module.exports = __toCommonJS(render_xy_annotations_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_XYChartRoot = require("../../../xy-chart/XYChartRoot.js");
+const ANNOTATIONS_KEYS = {
+  trackId: "__annotationsTrackId",
+  trackLabel: "__annotationsTrackLabel",
+  trackColor: "__annotationsTrackColor",
+  trackHidden: "__annotationsTrackHidden",
+  trackSymbol: "__annotationsTrackSymbol",
+  trackIndicators: "__annotationsTrackIndicators",
+  markerStart: "__annotationsMarkerStart",
+  markerEnd: "__annotationsMarkerEnd",
+  markerTitle: "__annotationsMarkerTitle",
+  markerDescription: "__annotationsMarkerDescription",
+  markerColor: "__annotationsMarkerColor",
+  markerHidden: "__annotationsMarkerHidden",
+  markerSymbol: "__annotationsMarkerSymbol",
+  markerIndicators: "__annotationsMarkerIndicators",
+  markerPriority: "__annotationsMarkerPriority"
+};
+const getAnnotationField = (d, key) => d[key];
+const renderXYAnnotations = (data, xAxisId, config) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  import_XYChartRoot.XYChart.Annotations,
+  {
+    data,
+    xAxisId,
+    showLabels: config.showLabels,
+    fixedTracks: config.visibleTracksLimit,
+    annotationsActions: config.annotationsActions,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_XYChartRoot.XYChartAnnotations.Track,
+        {
+          trackIdAccessor: ANNOTATIONS_KEYS.trackId,
+          labelAccessor: ANNOTATIONS_KEYS.trackLabel,
+          colorAccessor: ANNOTATIONS_KEYS.trackColor,
+          hidden: (d) => getAnnotationField(d, ANNOTATIONS_KEYS.trackHidden),
+          symbol: (d) => getAnnotationField(d, ANNOTATIONS_KEYS.trackSymbol),
+          indicatorsDisplay: (d) => getAnnotationField(
+            d,
+            ANNOTATIONS_KEYS.trackIndicators
+          )
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_XYChartRoot.XYChartAnnotations.Marker,
+        {
+          startAccessor: ANNOTATIONS_KEYS.markerStart,
+          endAccessor: ANNOTATIONS_KEYS.markerEnd,
+          trackByAccessor: ANNOTATIONS_KEYS.trackId,
+          titleAccessor: ANNOTATIONS_KEYS.markerTitle,
+          descriptionAccessor: ANNOTATIONS_KEYS.markerDescription,
+          colorAccessor: ANNOTATIONS_KEYS.markerColor,
+          hidden: (d) => getAnnotationField(d, ANNOTATIONS_KEYS.markerHidden),
+          symbol: (d) => getAnnotationField(d, ANNOTATIONS_KEYS.markerSymbol),
+          indicatorsDisplay: (d) => getAnnotationField(
+            d,
+            ANNOTATIONS_KEYS.markerIndicators
+          ),
+          priority: (d) => getAnnotationField(d, ANNOTATIONS_KEYS.markerPriority)
+        }
+      ),
+      config.tooltip?.template && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChartAnnotations.Tooltip, { hidden: config.tooltip.hidden, children: config.tooltip.template })
+    ]
+  }
+);

package/charts/xy-chart-adoption/timeseries/TimeseriesToXY.d.ts

@@ -2,6 +2,7 @@ import { type TimeseriesChartRef } from './types/timeseries.js';
 export declare const TimeseriesToXY: (props: import("../../../index.js").StylingProps & import("../../../index.js").MaskingProps & {
     data?: import("../../index.js").Timeseries[];
     variant?: import("./types/timeseries.js").ChartVariant;
+    valueRepresentation?: import("../../index.js").ValueRepresentation;
     children?: import("react").ReactNode;
     loading?: boolean;
     height?: number | string;
@@ -13,4 +14,6 @@ export declare const TimeseriesToXY: (props: import("../../../index.js").Styling
     onZoomChange?: import("../../index.js").ZoomChangeHandler;
     infiniteZoom?: boolean;
     seriesActions?: import("./types/timeseries.js").TimeseriesSeriesActions;
+    gapPolicy?: import("../../index.js").TimeGapPolicy;
+    pointsDisplay?: import("../../index.js").PointsDisplay;
 } & import("react").RefAttributes<TimeseriesChartRef>) => import("react").ReactElement | null;

package/charts/xy-chart-adoption/timeseries/TimeseriesToXY.js

@@ -25,21 +25,28 @@ var import_react = require("react");
 var import_iterate_slots = require("./iterate-slots.js");
 var import_map_select_actions = require("./map-select-actions.js");
 var import_map_series_actions = require("./map-series-actions.js");
+var import_resolve_value_representation = require("./resolve-value-representation.js");
+var import_transformer_annotations_to_xy = require("./transformer-annotations-to-xy.js");
 var import_transformer_data_to_xy = require("./transformer-data-to-xy.js");
 var import_timeseries = require("./types/timeseries.js");
+var import_build_buckets = require("./utils/build-buckets.js");
 var import_build_timeseries_imperative_handle = require("./utils/build-timeseries-imperative-handle.js");
 var import_format_csv = require("./utils/download/format-csv.js");
+var import_map_axis_slots = require("./utils/map-axis-slots.js");
 var import_map_timeseries_to_xy_color_rules = require("./utils/map-timeseries-to-xy-color-rules.js");
 var import_render_series = require("./utils/render-series.js");
+var import_resolve_gap_policy = require("./utils/resolve-gap-policy.js");
 var import_download = require("../../../core/utils/download.js");
 var import_get_chart_states_template = require("../../core/components/chart-states/utils/get-chart-states-template.js");
 var import_constants = require("../../core/constants.js");
+var import_extract_behavior_tracking_props = require("../../core/utils/extract-behavior-tracking-props.js");
 var import_XYChartRoot = require("../../xy-chart/XYChartRoot.js");
-const slotData = (slots) => slots.map((s) => s.data);
+var import_render_xy_annotations = require("../shared/utils/render-xy-annotations.js");
 const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
   const {
     data = [],
     variant = import_timeseries.DEFAULT_VARIANT,
+    valueRepresentation: rootValueRepresentation,
     children,
     loading,
     className,
@@ -54,7 +61,9 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
     currentZoom,
     onZoomChange,
     infiniteZoom,
-    seriesActions
+    seriesActions,
+    gapPolicy,
+    pointsDisplay
   } = props;
   const {
     line,
@@ -67,25 +76,45 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
     selectActions,
     legend,
     intents,
-    colorRules
+    colorRules,
+    xAxis,
+    leftYAxis,
+    rightYAxis,
+    annotations,
+    toolbar,
+    deprecatedToolbar
   } = (0, import_iterate_slots.iterateSlots)(children);
+  const resolvedValueRepresentation = (0, import_resolve_value_representation.resolveValueRepresentation)(
+    rootValueRepresentation,
+    ...line.map((s) => s.valueRepresentation),
+    ...area.map((s) => s.valueRepresentation),
+    ...bar.map((s) => s.valueRepresentation)
+  );
   const { emptyState, errorState } = (0, import_get_chart_states_template.getChartStatesTemplates)(children);
-  const buckets = {
-    line: variant === "line" ? [...data, ...slotData(line)] : slotData(line),
-    area: variant === "area" ? [...data, ...slotData(area)] : slotData(area),
-    bar: variant === "bar" ? [...data, ...slotData(bar)] : slotData(bar),
-    band: slotData(band)
-  };
-  const order = [...shapePriority];
-  if (data.length > 0 && !order.includes(variant)) {
-    order.push(variant);
-  }
+  const {
+    buckets,
+    lineAreaBarData,
+    bandData,
+    allSeriesData,
+    gapPolicies,
+    order
+  } = (0, import_build_buckets.buildBuckets)(
+    data,
+    variant,
+    { line, area, bar, band, shapePriority },
+    pointsDisplay
+  );
   const result = (0, import_transformer_data_to_xy.transformTimeseriesDataToXYChart)(buckets, order);
-  const lineAreaBarSeries = [...buckets.line, ...buckets.area, ...buckets.bar];
-  const allSeries = [...lineAreaBarSeries, ...buckets.band];
-  const allColorRules = (0, import_map_timeseries_to_xy_color_rules.resolveTimeseriesColorRules)(allSeries, colorRules);
-  const mappedSeriesActions = seriesActions ? (0, import_map_series_actions.mapSeriesActionsToXY)(seriesActions, lineAreaBarSeries) : void 0;
-  const mappedBandActions = seriesActions ? (0, import_map_series_actions.mapBandSeriesActionsToXY)(seriesActions, buckets.band) : void 0;
+  const effectiveGapPolicy = (0, import_resolve_gap_policy.resolveGapPolicy)(gapPolicies, gapPolicy);
+  const allColorRules = (0, import_map_timeseries_to_xy_color_rules.resolveTimeseriesColorRules)(allSeriesData, colorRules);
+  const xAxisConfig = (0, import_map_axis_slots.mapXAxisSlot)(xAxis);
+  const { configuredAxes, renderedUnits } = (0, import_map_axis_slots.mapYAxisSlots)(
+    leftYAxis,
+    rightYAxis,
+    [...result.units]
+  );
+  const mappedSeriesActions = seriesActions ? (0, import_map_series_actions.mapSeriesActionsToXY)(seriesActions, lineAreaBarData) : void 0;
+  const mappedBandActions = seriesActions ? (0, import_map_series_actions.mapBandSeriesActionsToXY)(seriesActions, bandData) : void 0;
   const seriesForShape = (shape) => {
     switch (shape) {
       case "line":
@@ -113,7 +142,12 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
     []
   );
   const downloadDataCallback = () => {
-    const csvString = (0, import_format_csv.formatCSV)(buckets);
+    const csvString = (0, import_format_csv.formatCSV)({
+      line: buckets.line.map((s) => s.data),
+      area: buckets.area.map((s) => s.data),
+      bar: buckets.bar.map((s) => s.data),
+      band: bandData
+    });
     (0, import_download.downloadCSV)(csvString, import_constants.CSS_DOWNLOAD_FILENAME);
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
@@ -144,7 +178,7 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
                 return;
               }
               return selectActions(
-                (0, import_map_select_actions.mapSelectedSeriesToTimeseries)(selectedSeries, allSeries),
+                (0, import_map_select_actions.mapSelectedSeriesToTimeseries)(selectedSeries, allSeriesData),
                 (0, import_map_select_actions.mapSelectionDomainToTimeseries)(selectionDomain)
               );
             }
@@ -156,23 +190,25 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
             id: import_render_series.xAxisId,
             type: "time",
             position: "bottom",
-            min: "data-min",
-            max: "data-max",
+            min: xAxisConfig.min,
+            max: xAxisConfig.max,
+            label: xAxisConfig.label,
             disableZoom,
             disablePan,
             initialZoom,
             currentZoom,
             onZoomChange,
-            infiniteZoom
+            infiniteZoom,
+            gapPolicy: effectiveGapPolicy
           }
         ),
-        [...result.units].map((unit, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        renderedUnits.map((unit, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_XYChartRoot.XYChart.YAxis,
           {
             id: (0, import_render_series.defineAxisId)(unit),
-            type: "numerical",
             unit,
-            position: index % 2 === 0 ? "left" : "right"
+            ...(0, import_map_axis_slots.mapYAxisSlotToProps)(index, configuredAxes[index]),
+            valueRepresentation: resolvedValueRepresentation
           },
           (0, import_render_series.defineAxisId)(unit)
         )),
@@ -184,7 +220,21 @@ const TimeseriesToXY = (0, import_react.forwardRef)((props, forwardedRef) => {
           },
           `${rule.comparator}-${rule.matchValue}-${rule.valueAccessor}`
         )),
-        intents.map((intentProps, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Intent, { ...intentProps }, index))
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_XYChartRoot.XYChart.Toolbar,
+          {
+            hidden: toolbar.hidden,
+            placement: toolbar.placement,
+            ...(0, import_extract_behavior_tracking_props.extractBehaviorTrackingProps)(toolbar)
+          }
+        ),
+        deprecatedToolbar.enabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Toolbar, { placement: deprecatedToolbar.placement }),
+        intents.map((intentProps, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.Intent, { ...intentProps }, index)),
+        annotations && (0, import_render_xy_annotations.renderXYAnnotations)(
+          (0, import_transformer_annotations_to_xy.transformTimeseriesAnnotationsToXY)(annotations.tracks),
+          import_render_series.xAxisId,
+          annotations
+        )
       ]
     }
   );

package/charts/xy-chart-adoption/timeseries/iterate-slots.d.ts

@@ -1,8 +1,12 @@
 import { type ReactNode } from 'react';
 import type { ChartVariantInternal, TimeseriesChartAreaProps, TimeseriesChartBandProps, TimeseriesChartBarProps, TimeseriesChartLineProps, TimeseriesSelectActions } from './types/timeseries.js';
+import type { AnnotationsSlotsConfig } from './utils/collect-annotations-slots.js';
 import { type IntentProps } from '../../../core/slots/Intent/Intent.js';
 import type { ColorRuleProps } from '../../core/types/color-rule.js';
 import type { LegendProps } from '../../core/types/legend.js';
+import type { TimeseriesChartXAxisProps } from '../../timeseries/slots/XAxis.js';
+import type { TimeseriesChartYAxisProps } from '../../timeseries/slots/YAxis.js';
+import type { TimeseriesChartToolbarConfig, TimeseriesChartToolbarSlotProps } from '../../timeseries/types/toolbar.js';
 export type SeriesSlots = {
     line: TimeseriesChartLineProps[];
     area: TimeseriesChartAreaProps[];
@@ -17,5 +21,11 @@ export type ConfigSlots = {
     legend: LegendProps | undefined;
     intents: IntentProps[];
     colorRules: ColorRuleProps[];
+    xAxis: TimeseriesChartXAxisProps | undefined;
+    leftYAxis: TimeseriesChartYAxisProps | undefined;
+    rightYAxis: TimeseriesChartYAxisProps | undefined;
+    annotations: AnnotationsSlotsConfig | undefined;
+    toolbar: TimeseriesChartToolbarSlotProps;
+    deprecatedToolbar: TimeseriesChartToolbarConfig;
 };
 export declare function iterateSlots(children: ReactNode): SeriesSlots & ConfigSlots;

package/charts/xy-chart-adoption/timeseries/iterate-slots.js

@@ -21,9 +21,12 @@ __export(iterate_slots_exports, {
 });
 module.exports = __toCommonJS(iterate_slots_exports);
 var import_react = require("react");
+var import_collect_annotations_slots = require("./utils/collect-annotations-slots.js");
 var import_Intent = require("../../../core/slots/Intent/Intent.js");
 var import_is_slot = require("../../../core/utils/is-slot.js");
 var import_ColorRule = require("../../core/slots/ColorRule.js");
+var import_ChartToolbar = require("../../core/slots/toolbar/ChartToolbar.js");
+var import_Annotations = require("../../timeseries/slots/annotations/Annotations.js");
 var import_Legend = require("../../timeseries/slots/Legend.js");
 var import_Pan = require("../../timeseries/slots/Pan.js");
 var import_Select = require("../../timeseries/slots/Select.js");
@@ -31,6 +34,9 @@ var import_Area = require("../../timeseries/slots/shapes/Area.js");
 var import_Band = require("../../timeseries/slots/shapes/Band.js");
 var import_Bar = require("../../timeseries/slots/shapes/Bar.js");
 var import_Line = require("../../timeseries/slots/shapes/Line.js");
+var import_Toolbar = require("../../timeseries/slots/Toolbar.js");
+var import_XAxis = require("../../timeseries/slots/XAxis.js");
+var import_YAxis = require("../../timeseries/slots/YAxis.js");
 var import_Zoom = require("../../timeseries/slots/Zoom.js");
 function iterateSlots(children) {
   const line = [];
@@ -44,6 +50,12 @@ function iterateSlots(children) {
   let legend;
   const intents = [];
   const colorRules = [];
+  let xAxis;
+  let leftYAxis;
+  let rightYAxis;
+  let annotations;
+  let toolbar = {};
+  let deprecatedToolbar = {};
   import_react.Children.forEach(children, (child) => {
     if ((0, import_is_slot.isSlot)(child, import_Line.Line)) {
       line.push(child.props);
@@ -79,6 +91,23 @@ function iterateSlots(children) {
       if ((0, import_ColorRule.isValidColorRule)(child.props)) {
         colorRules.push(child.props);
       }
+    } else if ((0, import_is_slot.isSlot)(child, import_Toolbar.Toolbar)) {
+      toolbar = child.props;
+    } else if ((0, import_is_slot.isSlot)(child, import_ChartToolbar.ChartToolbar)) {
+      deprecatedToolbar = {
+        enabled: true,
+        ...child.props
+      };
+    } else if ((0, import_is_slot.isSlot)(child, import_XAxis.XAxis)) {
+      xAxis = child.props;
+    } else if ((0, import_is_slot.isSlot)(child, import_YAxis.YAxis)) {
+      if (child.props.position === "right") {
+        rightYAxis = child.props;
+      } else {
+        leftYAxis = child.props;
+      }
+    } else if ((0, import_is_slot.isSlot)(child, import_Annotations.Annotations)) {
+      annotations = (0, import_collect_annotations_slots.collectAnnotationsSlots)(child.props);
     }
   });
   return {
@@ -92,6 +121,12 @@ function iterateSlots(children) {
     selectActions,
     legend,
     intents,
-    colorRules
+    colorRules,
+    xAxis,
+    leftYAxis,
+    rightYAxis,
+    annotations,
+    toolbar,
+    deprecatedToolbar
   };
 }

package/charts/xy-chart-adoption/timeseries/resolve-value-representation.d.ts

@@ -0,0 +1,6 @@
+import type { ValueRepresentation } from '../../core/types/scales.js';
+/**
+ * Resolves the effective valueRepresentation using "any-relative-wins":
+ * returns 'relative' if any value is 'relative', otherwise 'absolute'.
+ */
+export declare function resolveValueRepresentation(...values: (ValueRepresentation | undefined)[]): ValueRepresentation;