import { type ReactNode, type JSX, type ReactElement } from 'react'; import type { ConvertibleUnit, FormatDateOptions, FormatOptions, Unit } from '@dynatrace-sdk/units'; import type { TruncationMode } from '../../../typography/text-ellipsis/TextEllipsis.js'; import type { IndicatorsDisplay } from '../../core/components/annotations/components/indicators/types.js'; import type { AnnotationsTooltipHandler } from '../../core/components/annotations/components/tooltip/types/annotations-tooltip-props.js'; import type { AnnotationsMarkerProps } from '../../core/components/annotations/types/annotations-marker-props.js'; import type { AnnotationsTrackProps } from '../../core/components/annotations/types/annotations-track-props.js'; import type { AnnotationsActionsHandler } from '../../core/components/annotations/types/annotations.js'; import type { TextOverflowOptions } from '../../core/components/annotations/types/marker.js'; import type { ColorPalette, CustomColorPalette } from '../../core/types/color-palette.js'; import type { MaxScaleBoundary, MinScaleBoundary } from '../../core/types/min-max-config.js'; /** * @public */ export type GanttSegmentData = Record & { start: number; end?: number; }; /** * Configuration object for the annotations header of the Gantt chart. * @public */ export type GanttAnnotationsHeaderConfig = { /** * Configuration for the tracks grouping related markers. */ tracks: GanttAnnotationsTrackConfig[]; /** * Height of the `AnnotationsChart`. If no height is defined, the height is determined based on its content. */ height?: string | number; /** * Text overflow handling option. */ textOverflow?: TextOverflowOptions; /** * Truncation mode for text overflow. */ truncateMode?: TruncationMode; /** * Template for the empty state. */ emptyState?: ReactNode; /** * Template for error state. */ errorState?: ReactNode | ((errorMessage: string) => JSX.Element); /** * Loading state of the gantt annotations header. */ loading?: boolean; } & ({ /** * Custom implementation for the tooltip that will be rendered when hovering over a marker. */ tooltip?: AnnotationsTooltipHandler; tooltipActions?: never; } | { tooltip?: never; /** * The annotations actions' handler, to provide a custom actions menu on the tooltip. */ tooltipActions?: AnnotationsActionsHandler; }); /** * The Gantt chart's annotations marker props. * Extends the base annotations marker props with indicator display control. * @public */ export type GanttAnnotationsMarkerProps = AnnotationsMarkerProps & { /** * Controls how the annotation indicator for this marker is displayed. Overrides the track-level setting. */ indicatorsDisplay?: IndicatorsDisplay; }; /** * Properties for the Gantt chart's annotations tracks. * @public */ export type GanttAnnotationsTrackConfig = Omit & { /** * The annotations marker props. Supporting numerical and time based data. */ markers: GanttAnnotationsMarkerProps[]; /** * Controls how annotation indicators for all markers in this track are displayed. Can be overridden per marker. * @defaultValue 'auto' */ indicatorsDisplay?: IndicatorsDisplay; }; /** * Options to format a currency (incl. locale and properties accepted by Intl.NumberFormat). * @public */ export interface GanttChartFormatterCurrencyOptions extends Omit { /** * The ISO 4217 currency code, such as 'USD' or 'EUR', to which the currency will be formatted. */ currency: Intl.NumberFormatOptions['currency']; /** * The locale according to which the currency will be formatted. */ locale?: string | string[]; /** * Shortens the number, e.g. 1500 → 1.5k */ abbreviate?: boolean; } /** * Formatter options for gantt chart values. * @public */ export type GanttChartFormatter = FormatOptions | FormatDateOptions | GanttChartFormatterCurrencyOptions; /** * Defined configuration options used in gantt chart. * @public */ export type GanttChartConfig = { /** * Axis configuration for the minimum value (`MinScaleBoundary`). */ min?: MinScaleBoundary; /** * Axis configuration for the maximum value (`MaxScaleBoundary`). */ max?: MaxScaleBoundary; /** * Whether the axis type is `numerical` or `time`. */ xAxisType?: 'numerical' | 'time'; /** * String accessor for the segment's name, which is displayed in the tooltip. */ nameAccessor: string; /** * String accessor for the segment's color. */ colorAccessor?: string; /** * The palette that contains the segment color mapping. */ colorPalette?: ColorPalette | CustomColorPalette; /** * Whether gaps between segments should receive a background. */ showBackground?: boolean; /** * Configuration for the `AnnotationsChart` that is placed atop the x-axis in the header. */ annotationsHeader?: GanttAnnotationsHeaderConfig; } & ({ tooltipActions?: never; /** * Custom tooltip implementation. The function provides the `segment`, * `row` and `parent` data as parameters. */ tooltip?: (segment: GanttSegmentData, row: GanttSegmentData[], parent?: GanttSegmentData[]) => ReactNode; } | { /** * Actions that should be displayed with the default tooltip. * The function provides the `segment`, `row` and `parent` data as parameters. */ tooltipActions?: (segment: GanttSegmentData, row: GanttSegmentData[], parent?: GanttSegmentData[]) => () => ReactElement; tooltip?: never; }) & { /** Allows formatter options from the `@dynatrace-sdk/units` package to be set. */ formatter?: GanttChartFormatter; };