import type { ReactElement, ReactNode } from 'react'; import type { ViewProps } from 'react-native'; import type { SegmentedBarColorToken } from './constants'; export interface SegmentedBarSeries { /** * Label of series. */ label: string; /** * Data of series. */ data: Data; } export type SegmentedBarData = Array>; export interface SegmentedBarStyleConfig { /** * Colors config per series. * Provide one entry per series in `data` matched by the `label` value (order-agnostic). * When provided, number of entries must match `data.length` and all data labels must have a corresponding entry, otherwise an error will be thrown. */ series?: Array<{ label: string; color: SegmentedBarColorToken; }>; } export interface SegmentedBarHeaderConfig { /** * Left header content. */ left?: string; /** * Right header content. */ right?: ReactNode; } export type SegmentedBarLegendDisplayValue = string | number | ReactElement; export interface SegmentedBarLegendConfig { /** * Optional values shown next to each series label. * * Entries are index-aligned with `data`. */ displayValues?: Array; } export interface ProgressSegmentedBarProps extends ViewProps { /** * Segmented data. * * Each segment value is treated as a percentage amount. * * Runtime validation: * - Throws if any segment value is negative. * - Values do not need to sum to 100; if the total exceeds 100, the bar will be fully filled and no remainder segment will be shown. */ data: SegmentedBarData; /** * Optional header content. */ headerConfig?: SegmentedBarHeaderConfig; /** * Optional text shown when there is no data. */ emptyText?: string; /** * Optional legend config. * If provided, the legend is rendered below the segmented bar. */ legendConfig?: SegmentedBarLegendConfig; /** * Custom style config to override series colors. */ styleConfig?: SegmentedBarStyleConfig; }