import { type ScaleBand, type ScaleLinear, type ScaleOrdinal, ScaleQuantize, type ScaleSymLog, ScaleThreshold, type ScaleTime } from 'd3-scale'; import type { PropsWithChildren, ReactElement } from 'react'; import type { ConvertibleUnit, FormatOptions, Unit } from '@dynatrace-sdk/units'; import type { BaseDatapoint, DotDatapoint, XYAccessorDataTypes, XYChartCategoricalAxisProps, XYChartChartLegendProps, XYChartColorPalette, XYChartData, XYChartDotSeriesActionItem, XYChartDotSeriesProps, XYChartLinearAxisInternalProps, XYChartLogAxisInternalProps, XYChartProps, XYChartRectSeriesActionItem, XYChartRectSeriesProps, XYChartThresholdDynamicData, XYChartThresholdProps, XYChartThresholdStaticData, XYChartTimeAxisProps, XYChartToolbarProps, XYChartXAxisPosition, XYChartXAxisProps, XYChartYAxisPosition, XYChartYAxisProps } from './xy-chart.js'; import type { TickLabelLayout } from '../../core/components/axes/types.js'; import type { CanvasShapeType } from '../../core/components/canvas/utils/shapes/symbol-canvas.js'; import type { THRESHOLD_BAR_THICKNESS } from '../../core/components/threshold-bar/types/constants.js'; import { ChartUnit } from '../../core/types/chart-unit.js'; import type { ColorToken } from '../../core/types/color-palette.js'; import type { DateTimeFormatter, Formatter, FormatterWithPrecision } from '../../core/types/formatter.js'; import type { ZoomChangeHandler } from '../../core/types/interactions.js'; import type { MinMax } from '../../core/types/min-max.js'; import { XYChartAnnotationsConfigProps } from '../context/XYChartAnnotationsConfig.context.js'; export type ChartInteractionsInternal = { zoom: boolean; pan: boolean; infinite: boolean; } & ({ initial?: [Date, Date]; current?: [Date, Date]; } | { initial?: [number, number]; current?: [number, number]; }); /** * @internal * axis slot config */ export type XYChartAxisInternal = XYChartAxisInternalProps & { tickLabelLayout: TickLabelLayout; formatter?: Formatter | FormatOptions; unit?: ChartUnit; } & ({ coordinate: 'x'; position: XYChartXAxisPosition; interactions: ChartInteractionsInternal; onZoomChange: ZoomChangeHandler; } | { coordinate: 'y'; position: XYChartYAxisPosition; interactions: Record, false> & { initial?: undefined; current?: undefined; }; onZoomChange: ZoomChangeHandler; }); /** * @internal * xychart axis props */ export type XYChartAxisInternalProps = XYChartLinearAxisInternalProps | XYChartLogAxisInternalProps | XYChartCategoricalAxisProps | XYChartTimeAxisProps; export interface XYChartSeriesBaseInternal { id: SeriesId; } /** * @internal * rect series slot config */ export interface XYChartRectSeriesInternal extends XYChartRectSeriesProps, XYChartSeriesBaseInternal { type: typeof RECT_VARIANT; } /** * @internal * Dot series slot config */ export type XYChartDotSeriesInternal = XYChartDotSeriesProps & XYChartSeriesBaseInternal & { type: typeof DOT_VARIANT; }; /** * @internal * series variant type */ export type XYChartVariantsInternal = XYChartRectSeriesInternal | XYChartDotSeriesInternal; export type AnyXYChartScale = ScaleSymLog | ScaleLinear | ScaleTime | ScaleBand; /** The color scale for the xy chart */ export type XYChartColorScale = ScaleQuantize | ScaleOrdinal | ScaleThreshold; /** The id for the axis */ export type AxisId = string; /** The id for the series */ export type SeriesId = string; /** * @internal * Props that represent the extracted slots of the xy chart */ export interface XYChartSlots { rectSeries: XYChartRectSeriesProps[]; dotSeries: XYChartDotSeriesProps[]; yAxes: XYChartYAxisProps[]; xAxes: XYChartXAxisProps[]; legend: XYChartChartLegendProps; toolbar: XYChartToolbarProps; thresholds: XYChartThresholdProps[]; annotations?: XYChartAnnotationsConfigProps; } export interface XYChartInternals { rectSeries: XYChartRectSeriesInternal[]; dotSeries: XYChartDotSeriesInternal[]; axes: XYChartAxisInternal[]; thresholds: XYChartThresholdsInternal; } export type XYChartThresholdsInternal = { thresholds: []; none: true; offset: { left: 0; right: 0; }; } | { thresholds: XYChartThresholdsPropsInternal; none: false; offset: { left: typeof THRESHOLD_BAR_THICKNESS | 0; right: typeof THRESHOLD_BAR_THICKNESS | 0; }; }; type XYChartThresholdPropsInternal = { id: string; data: XYChartThresholdStaticData; color: string; position: XYChartYAxisPosition; label?: string; strokeOnly?: boolean; yAxisId: string; }; export type XYChartThresholdDynamicPropsInternal = { xAxisId: string; data: XYChartThresholdDynamicData[]; } & Omit; export type XYChartThresholdStaticPropsInternal = XYChartThresholdPropsInternal; export type XYChartThresholdsPropsInternal = (XYChartThresholdDynamicPropsInternal | XYChartThresholdStaticPropsInternal)[]; export interface XYChartVisibleAxesScales { top: AnyXYChartScale | undefined; bottom: AnyXYChartScale | undefined; left: AnyXYChartScale | undefined; right: AnyXYChartScale | undefined; } export interface XYChartVisibleAxesConfig { top: XYChartAxisInternal | undefined; bottom: XYChartAxisInternal | undefined; left: XYChartAxisInternal | undefined; right: XYChartAxisInternal | undefined; } /** * @internal * XYCharts that can be used in exported/imported configuration */ export type ExportableXYChartProps = Pick; /** * @internal * Category unique name */ export type CategoryName = string; /** * @internal * * min/max map by Axis Id filled in the data processing loop */ export type AxisIdToScaleDomain = Map>; /** * @internal * * min/max map by Axis Id with only valid axis and */ export type AxisIdToCurrentScaleDomain = Map; /** * @internal * * Formatter map by Axis Id */ export type AxisIdToFormatter = Map; /** * @internal * * min/max OR categories value by Series Id filled in the data processing loop */ export type RectSeriesIdToValueScaleDomain = Map>; export interface SeriesPropsWithAxes { seriesProps: XYChartVariantsInternal; xAxis: XYChartAxisInternal; yAxis: XYChartAxisInternal; } export type XYValueAccessorDataTypes = number | string | undefined | null; export interface RectDatapointInternal extends BaseDatapoint { x1?: XYAccessorDataTypes; y1?: XYAccessorDataTypes; value: XYValueAccessorDataTypes; } export type XYChartSeriesWithDatapoints = RectSeriesWithDatapoints | DotSeriesWithDatapoints; export interface RectSeriesWithDatapoints { id: SeriesId; type: typeof RECT_VARIANT; data: RectDatapointInternal[]; xAxisId: string; yAxisId: string; } export interface DotSeriesWithDatapoints { id: SeriesId; type: typeof DOT_VARIANT; data: DotDatapoint[]; xAxisId: string; yAxisId: string; } export type BaseMetadata = { xAxis: XYChartAxisInternal; yAxis: XYChartAxisInternal; colorPalette: XYChartColorPalette; }; export interface RectMetadata extends BaseMetadata { valueMin: XYChartRectSeriesProps['valueMin']; valueMax: XYChartRectSeriesProps['valueMax']; valueAccessor: string; valueType?: LegendType; valueAccessorLabel?: XYChartRectSeriesProps['valueAccessorLabel']; valueFormatter?: Formatter | FormatOptions; valueUnit?: ChartUnit; actions?: (datapoint: XYChartRectSeriesActionItem) => ReactElement; } export interface DotMetadata extends BaseMetadata { name: string; color: ColorToken; shape?: CanvasShapeType; actions?: (datapoint: XYChartDotSeriesActionItem) => ReactElement; } export type RectSeriesToMetadata = WeakMap; export type DotSeriesToMetadata = WeakMap; export type DatapointMetadata = { isGap: boolean; }; export type WeakMapDatapoints = WeakMap; /** * @internal */ export type SeriesPaths = { x0: string[] | undefined; x1?: string[] | undefined; y0: string[] | undefined; y1?: string[] | undefined; value?: string[] | undefined; }; /** * @internal */ interface SeriesPropsWithPath extends SeriesPropsWithAxes { paths: SeriesPaths; } /** * @internal */ export type XYChartDataWithCorrespondingSeries = { data: XYChartData[]; series: SeriesPropsWithPath[]; }; /** * @internal * The range legend type for the xy chart */ export declare const RANGE_LEGEND_TYPE: "range"; /** * @internal * The categorical legend type for the xy chart */ export declare const CATEGORICAL_LEGEND_TYPE: "categorical"; export declare const RECT_VARIANT: "rect"; export declare const DOT_VARIANT: "dot"; export declare const DOT_ID = "some_id"; export declare const RECT_ID = "some_id"; export type LegendType = typeof RANGE_LEGEND_TYPE | typeof CATEGORICAL_LEGEND_TYPE; export type SeriesVariantType = typeof RECT_VARIANT | typeof DOT_VARIANT; export {};