import { default as default_2 } from 'react'; import { Feature } from 'geojson'; import { FeatureCollection } from 'geojson'; import { GeoJsonProperties } from 'geojson'; import { Geometry } from 'geojson'; import { JSX } from 'react'; import { MultiPolygon } from 'geojson'; import { Polygon } from 'geojson'; import { Position as Position_2 } from 'geojson'; import { ReactElement } from 'react'; import { RefObject } from 'react'; import type * as THREE from 'three'; import { Topology } from 'topojson-specification'; declare interface AdvancedDataSelectionDataType { label?: string; options: { label: string; dataConfiguration: { columnId: string[] | string; chartConfigId: string; }[]; graphSettings?: GraphSettingsDataType; }[]; ui?: 'select' | 'radio'; width?: string; defaultValue?: { label: string; dataConfiguration: { columnId: string[] | string; chartConfigId: string; }[]; graphSettings?: GraphSettingsDataType; }; } declare interface AggregationSettingsDataType { column: string; aggregationMethod?: 'sum' | 'average' | 'min' | 'max'; } declare interface AmbientLightConfig extends BaseLightConfig { type: 'ambient'; } declare interface AnimateDataType { duration: number; once: boolean; amount: 'some' | 'all' | number; } declare interface AnnotationSettingsDataType { text: string; maxWidth?: number; xCoordinate?: number | string; yCoordinate?: number | string; xOffset?: number; yOffset?: number; align?: 'center' | 'left' | 'right'; color?: string; fontWeight?: 'regular' | 'bold' | 'medium'; showConnector?: boolean | number; connectorRadius?: number; classNames?: { connector?: string; text?: string; }; styles?: { connector?: React.CSSProperties; text?: React.CSSProperties; }; } export declare function AreaChart(props: Props_59): JSX.Element; declare interface AreaChartDataType { date: number | string; y: number[]; data?: object; } declare interface AxesClassNameObject { gridLines?: string; labels?: string; title?: string; axis?: string; } declare interface AxesStyleObject { gridLines?: React.CSSProperties; labels?: React.CSSProperties; title?: React.CSSProperties; axis?: React.CSSProperties; } declare interface BarGraphDataType { label: string | number; date?: string | number; size?: number | null; color?: string | null; data?: object; } declare interface BaseLightConfig { type: string; color: number; intensity: number; } export declare function BasicStatCard(props: Props_60): JSX.Element; export declare function BeeSwarmChart(props: Props_29): JSX.Element; declare interface BeeSwarmChartDataType { label: string | number; position: number; group?: string | number; radius?: number; color?: string; data?: object; } export declare function BiVariateChoroplethMap(props: Props_46): JSX.Element | null; declare interface BivariateMapDataType { x?: number | null; y?: number | null; id: string; date?: string | number; data?: object; } export declare function BulletChart(props: Props_30): JSX.Element; declare interface BulletChartDataType { label: string | number; size?: number | null; target?: number | null; qualitativeRange?: number[] | null; date?: string | number; data?: object; } export declare function ButterflyChart(props: Props_31): JSX.Element; declare interface ButterflyChartDataType { label: string | number; leftBar?: number | null; rightBar?: number | null; date?: string | number; data?: object; } declare interface ChaptersDataType { dataSettings: DataSettingsDataType; graphSettings: GraphSettingsDataType; graphType: GraphType; graphDataConfiguration?: GraphConfigurationDataType[]; sections: SectionsDataType[]; } /** * Checks whether a given value is `null` or `undefined`. * * @param value - The value to check. * @returns `true` if the value is `null` or `undefined`, otherwise `false`. * * @example * checkIfNullOrUndefined(null); // true * checkIfNullOrUndefined(undefined); // true * checkIfNullOrUndefined(0); // false * checkIfNullOrUndefined(''); // false */ export declare function checkIfNullOrUndefined(value: any): boolean; export declare function ChoroplethMap(props: Props_47): JSX.Element; declare interface ChoroplethMapDataType { x?: number | string | null; id: string; date?: string | number; data?: object; } export declare function CirclePackingGraph(props: Props_32): JSX.Element; declare interface ClassNameObject { title?: string; footnote?: string; source?: string; description?: string; tooltip?: string; xAxis?: AxesClassNameObject; yAxis?: AxesClassNameObject; legend?: string; graphContainer?: string; graphObjectValues?: string; dataConnectors?: string; mouseOverLine?: string; regLine?: string; dataCards?: string; colorLegend?: string; modal?: string; area?: string; } declare type Color = 'azure' | 'blue' | 'green' | 'lime' | 'orange' | 'pink' | 'red' | 'teal' | 'violet' | 'yellow' | 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'background' | 'surface' | 'surface-2xs' | 'surface-xs' | 'surface-sm' | 'surface-md' | 'surface-lg' | 'surface-xl' | 'surface-2xl' | 'surface-3xl' | 'surface-4xl' | 'foreground' | 'sdg-1' | 'sdg-2' | 'sdg-3' | 'sdg-4' | 'sdg-5' | 'sdg-6' | 'sdg-7' | 'sdg-8' | 'sdg-9' | 'sdg-10' | 'sdg-11' | 'sdg-12' | 'sdg-13' | 'sdg-14' | 'sdg-15' | 'sdg-16' | 'sdg-17' | 'male' | 'female' | 'urban' | 'rural' | 'child' | 'adolescent' | 'young-adult' | 'adult' | 'older-adult'; export declare function ColorLegend(props: Props_22): JSX.Element; export declare function ColorLegendWithMouseOver(props: Props_23): JSX.Element; export declare const Colors: { gray: string; graphMainColor: string; primaryColors: { 'blue-100': string; 'blue-200': string; 'blue-300': string; 'blue-400': string; 'blue-500': string; 'blue-600': string; 'blue-700': string; }; genderColors: { male: string; female: string; }; locationColors: { urban: string; rural: string; }; alerts: { lightYellow: string; yellow: string; darkYellow: string; lightRed: string; red: string; darkRed: string; lightGreen: string; green: string; darkGreen: string; lightAzure: string; azure: string; darkAzure: string; }; sdgColors: { sdg1: string; sdg2: string; sdg3: string; sdg4: string; sdg5: string; sdg6: string; sdg7: string; sdg8: string; sdg9: string; sdg10: string; sdg11: string; sdg12: string; sdg13: string; sdg14: string; sdg15: string; sdg16: string; sdg17: string; }; light: { graphBackgroundColor: string; graphNoData: string; grays: { white: string; 'gray-100': string; 'gray-200': string; 'gray-300': string; 'gray-400': string; 'gray-500': string; 'gray-530': string; 'gray-560': string; 'gray-600': string; 'gray-700': string; black: string; }; categoricalColors: { colors: string[]; }; sequentialColors: { negativeColorsx02: string[]; negativeColorsx03: string[]; negativeColorsx04: string[]; negativeColorsx05: string[]; negativeColorsx06: string[]; negativeColorsx07: string[]; negativeColorsx08: string[]; negativeColorsx09: string[]; negativeColorsx10: string[]; positiveColorsx02: string[]; positiveColorsx03: string[]; positiveColorsx04: string[]; positiveColorsx05: string[]; positiveColorsx06: string[]; positiveColorsx07: string[]; positiveColorsx08: string[]; positiveColorsx09: string[]; positiveColorsx10: string[]; neutralColorsx02: string[]; neutralColorsx03: string[]; neutralColorsx04: string[]; neutralColorsx05: string[]; neutralColorsx06: string[]; neutralColorsx07: string[]; neutralColorsx08: string[]; neutralColorsx09: string[]; neutralColorsx10: string[]; }; divergentColors: { colorsx02: string[]; colorsx03: string[]; colorsx04: string[]; colorsx05: string[]; colorsx06: string[]; colorsx07: string[]; colorsx08: string[]; colorsx09: string[]; colorsx10: string[]; colorsx11: string[]; }; bivariateColors: { colors03x03: string[][]; colors04x04: string[][]; colors05x04: string[][]; colors04x05: string[][]; colors05x05: string[][]; }; }; dark: { graphBackgroundColor: string; graphNoData: string; grays: { white: string; 'gray-100': string; 'gray-200': string; 'gray-300': string; 'gray-400': string; 'gray-500': string; 'gray-530': string; 'gray-560': string; 'gray-600': string; 'gray-700': string; black: string; }; categoricalColors: { colors: string[]; }; sequentialColors: { negativeColorsx02: string[]; negativeColorsx03: string[]; negativeColorsx04: string[]; negativeColorsx05: string[]; negativeColorsx06: string[]; negativeColorsx07: string[]; negativeColorsx08: string[]; negativeColorsx09: string[]; negativeColorsx10: string[]; positiveColorsx02: string[]; positiveColorsx03: string[]; positiveColorsx04: string[]; positiveColorsx05: string[]; positiveColorsx06: string[]; positiveColorsx07: string[]; positiveColorsx08: string[]; positiveColorsx09: string[]; positiveColorsx10: string[]; neutralColorsx02: string[]; neutralColorsx03: string[]; neutralColorsx04: string[]; neutralColorsx05: string[]; neutralColorsx06: string[]; neutralColorsx07: string[]; neutralColorsx08: string[]; neutralColorsx09: string[]; neutralColorsx10: string[]; }; divergentColors: { colorsx02: string[]; colorsx03: string[]; colorsx04: string[]; colorsx05: string[]; colorsx06: string[]; colorsx07: string[]; colorsx08: string[]; colorsx09: string[]; colorsx10: string[]; colorsx11: string[]; }; bivariateColors: { colors03x03: string[][]; colors04x04: string[][]; colors05x04: string[][]; colors04x05: string[][]; colors05x05: string[][]; }; }; }; declare interface ColumnConfigurationDataType { column: string; delimiter?: string; } declare interface ConfigObject { noOfColumns?: number; columnGridBy: string; graphSettings?: GraphSettingsDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; graphType: Exclude; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; showCommonColorScale?: boolean; minGraphWidth?: number; minGraphHeight?: number; debugMode?: boolean; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; readableHeader?: { value: string; label: string; }[]; theme?: 'dark' | 'light'; } declare interface ConfigObject_2 { dashboardID?: string; dashboardLayout: DashboardLayoutDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; filterPosition?: 'top' | 'side'; debugMode?: boolean; theme?: 'dark' | 'light'; readableHeader?: { value: string; label: string; }[]; dataFilters?: DataFilterDataType[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface ConfigObject_3 { validateDataAndSettings?: boolean; dashboardID?: string; dashboardLayout: DashboardFromWideToLongFormatLayoutDataType; dataSettings: DataSettingsWideToLongDataType; debugMode?: boolean; theme?: 'dark' | 'light'; readableHeader?: { value: string; label: string; }[]; dataFilters?: DataFilterDataType[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface ConfigObject_4 { dashboardID?: string; dashboardLayout: PerformanceIntensiveDashboardLayoutDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; filterPosition?: 'top' | 'side'; debugMode?: boolean; theme?: 'dark' | 'light'; readableHeader?: { value: string; label: string; }[]; dataFilters?: DataFilterDataType[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface ConfigObject_5 { graphSettings?: GraphSettingsDataType; graphType: GeoHubGraphType; debugMode?: boolean; uiMode?: 'light' | 'normal'; } declare interface ConfigObject_6 { graphSettings?: GraphSettingsDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; graphType: ThreeDGraphType; noOfFiltersPerRow?: number; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; debugMode?: boolean; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; highlightDataPointSettings?: HighlightDataPointSettingsDataType; readableHeader?: { value: string; label: string; }[]; uiMode?: 'light' | 'normal'; } declare interface ConfigObject_7 { graphSettings?: GraphSettingsDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; graphType: GraphType; noOfFiltersPerRow?: number; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; debugMode?: boolean; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; highlightDataPointSettings?: HighlightDataPointSettingsDataType; readableHeader?: { value: string; label: string; }[]; uiMode?: 'light' | 'normal'; } /** * Converts a TopoJSON object to a GeoJSON object. * @param topoJson The TopoJSON object to convert. * @param key The key of the object to convert. * @returns The GeoJSON object. */ export declare function convertTopoJsonToGeoJson(topoJson: Topology, key?: string): FeatureCollection; export declare function convertTopoJsonUrlToGeoJson(url: string, key?: string): Promise>; declare interface CoordinatesProps { id: number; x: number; y: number; distanceFromCenter: number; } export declare function CopyTextButton(props: Props): JSX.Element; export declare function CsvDownloadButton(props: Props_2): JSX.Element; declare type CurveTypes = 'linear' | 'curve' | 'step' | 'stepAfter' | 'stepBefore'; declare interface CustomHighlightAreaSettingsDataType { coordinates: (number | string)[]; closePath?: boolean; style?: React.CSSProperties; className?: string; color?: string; strokeWidth?: number; } declare interface CustomHighlightAreaSettingsForScatterPlotDataType { coordinates: number[]; closePath?: boolean; style?: React.CSSProperties; className?: string; color?: string; strokeWidth?: number; } declare interface CustomLayerDataType { position: 'before' | 'after'; layer: React.ReactNode; } declare interface DashboardColumnDataType extends DashboardColumnDataWithoutGraphType { graphType: GraphType; } declare interface DashboardColumnDataWithoutGraphType { attachedFilter?: string; columnWidth?: number; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; settings?: GraphSettingsDataType; } declare type DashboardFromWideToLongFormatColumnDataType = { graphType: 'donutChart' | 'barChart' | 'unitChart' | 'treeMap' | 'circlePacking'; columnWidth?: number; dataFilters?: DataFilterDataType[]; settings?: any; graphDataConfiguration?: GraphConfigurationDataType[]; }; declare type DashboardFromWideToLongFormatLayoutDataType = { title?: string; description?: string; dropdownLabel?: string; padding?: string; backgroundColor?: string | boolean; language?: Languages; rows: { columns: DashboardFromWideToLongFormatColumnDataType[]; height?: number; }[]; }; declare interface DashboardLayoutDataType extends DashboardLayoutDataWithoutRowsType { rows: { columns: DashboardColumnDataType[]; height?: number; }[]; } declare interface DashboardLayoutDataWithoutRowsType { title?: string; description?: string; padding?: string; backgroundColor?: string | boolean; language?: Languages; } export declare function DataCards(props: Props_33): default_2.JSX.Element; declare interface DataFilterDataType { column: string; includeValues?: (string | number | boolean | null | undefined)[]; excludeValues?: (string | number | boolean | null | undefined)[]; } declare interface DataSelectionDataType { label?: string; allowedColumnIds: { value: string; label: string; graphSettings: GraphSettingsDataType; }[]; chartConfigId: string; ui?: 'select' | 'radio'; width?: string; } declare interface DataSettingsDataType { dataURL?: string | FileSettingsDataType[]; fileType?: 'csv' | 'json' | 'api'; delimiter?: string; columnsToArray?: ColumnConfigurationDataType[]; apiHeaders?: any; dataTransformation?: string; idColumnTitle?: string; data?: any; } declare interface DataSettingsWideToLongDataType { dataURL?: string | FileSettingsDataType[]; fileType?: 'csv' | 'json' | 'api'; delimiter?: string; data?: any; keyColumn: string; idColumnTitle?: string; dataTransformation?: string; apiHeaders?: any; } export declare function DataTable(props: Props_34): JSX.Element; declare interface DataTableColumnDataType { columnTitle?: string; columnId: string; sortable?: boolean; filterOptions?: string[]; chip?: boolean; chipColumnId?: string; chipColors?: { value: string; color: string; }[]; separator?: string; align?: 'left' | 'right' | 'center'; suffix?: string; prefix?: string; locale?: string; precision?: number; padZeros?: PadZerosTypes; columnWidth?: number; } export declare function DifferenceLineChart(props: Props_39): JSX.Element; declare interface DifferenceLineChartDataType { date: number | string; y1: number; y2: number; data?: object; } declare interface DirectionalLightConfig extends BaseLightConfig { type: 'directional'; target?: Position; castShadow?: boolean; shadow?: ShadowConfig; position?: Position | 'camera'; } declare interface DistributionMarkerDataType { type: 'median' | 'mean' | 'q1' | 'q3'; markerStyle?: React.CSSProperties; color?: string; strokeWidth?: number; relativeMarkerLength?: number; markerLabel?: { showType?: boolean; style?: React.CSSProperties; }; } export declare function DonutChart(props: Props_35): JSX.Element; declare interface DonutChartDataType { size: number; label: string; data?: object; } export declare function DotDensityMap(props: Props_48): JSX.Element; declare interface DotDensityMapDataType { lat: number; long: number; radius?: number; color?: string | number; label?: string | number; date?: string | number; data?: object; } export declare function DualAxisLineChart(props: Props_40): JSX.Element; declare interface DualAxisLineChartDataType { date: number | string; y1?: number | null; y2?: number | null; data?: object; } export declare function DumbbellChart(props: Props_36): JSX.Element; declare interface DumbbellChartDataType { x: (number | null)[]; label: string; date?: string | number; data?: object; } /** * Downloads CSV data as an Excel file with specified headers and column widths. * * The function converts JSON data (`csvData`) to an Excel sheet, adds headers, and applies custom column widths. * The resulting file is then downloaded using `file-saver` as an `.xlsx` file. * * @param csvData - The data to be exported as an Excel sheet, represented as an array of objects. * @param fileName - The name of the file to be downloaded (without extension). * @param headers - The headers for the Excel sheet. * @param xlsxHeader - The header data to be used for the Excel file (should match `headers`). * @param wscols - The column width configuration, where each item corresponds to a column. * * @example * const data = [{ name: 'Alice', age: 25 }, { name: 'Bob', age: 30 }]; * const headers = ['name', 'age']; * const xlsxHeader = { * name: "Full Name", * age: "Age", * }; * const columnWidths = [{ wch: 10 }, { wch: 5 }]; * excelDownload(data, 'user_data', headers, xlsxHeader, columnWidths); */ export declare const excelDownload: (csvData: any, fileName: string, headers: string[], xlsxHeader: { [key: string]: string; }, wscols: WsColInterface_2[]) => void; export declare function ExcelDownloadButton(props: Props_3): JSX.Element; /** * Fetches a CSV file from a URL, parses it, and applies transformations based on the provided configuration. * * @param dataURL - The URL of the CSV file to fetch. * @param dataTransformation - Optional Handlebars template for data transformation. * @param columnsToArray - Optional columns configuration to transform certain columns to arrays. * @param debugMode - Optional flag to log data to the console for debugging. * @param delimiter - Optional delimiter used in the CSV file (default is comma). * @param header - Optional flag to specify whether the CSV file contains headers (default is true). * * @returns A promise that resolves to the parsed and transformed data. * * @example * fetchAndParseCSV('https://example.com/data.csv', '{{data}}', [], true) * .then(parsedData => console.log(parsedData)) * .catch(error => console.error('Error:', error)); */ export declare function fetchAndParseCSV(dataURL: string, dataTransformation?: string, columnsToArray?: ColumnConfigurationDataType[], debugMode?: boolean, delimiter?: string, header?: boolean): Promise; /** * Parses CSV data from a string, applying optional transformations. * * @param data - The CSV data as a string. * @param dataTransformation - Optional Handlebars template for data transformation. * @param columnsToArray - Optional columns configuration to transform certain columns to arrays. * @param debugMode - Optional flag to log data to the console for debugging. * @param delimiter - Optional delimiter used in the CSV file (default is comma). * @param header - Optional flag to specify whether the CSV file contains headers (default is true). * * @returns A promise that resolves to the parsed and transformed data. */ export declare function fetchAndParseCSVFromTextBlob(data: string, dataTransformation?: string, columnsToArray?: ColumnConfigurationDataType[], debugMode?: boolean, delimiter?: string, header?: boolean): Promise; /** * Fetches and parses a JSON file from a URL, and applies optional transformations. * * @param dataURL - The URL of the JSON file to fetch. * @param columnsToArray - Optional columns configuration to transform certain columns to arrays. * @param dataTransformation - Optional Handlebars template for data transformation. * @param debugMode - Optional flag to log data to the console for debugging. * * @returns A promise that resolves to the parsed and transformed data. */ export declare function fetchAndParseJSON(dataURL: string, columnsToArray?: ColumnConfigurationDataType[], dataTransformation?: string, debugMode?: boolean): Promise; /** * Fetches and parses data from multiple sources (CSV, JSON, API), and merges the results. * * @param dataURL - An array of file settings containing URLs, column configurations, and other settings. * @param idColumnTitle - Optional title of the ID column to merge data sources by. * * @returns A promise that resolves to the merged data from all sources. */ export declare function fetchAndParseMultipleDataSources(dataURL: FileSettingsDataType[], idColumnTitle?: string): Promise; /** * Fetches and transforms data from an API, and applies optional transformations. * * @param requestURL - The URL of the API to fetch data from. * @param headers - Optional headers to include in the API request. * @param columnsToArray - Optional columns configuration to transform certain columns to arrays. * @param dataTransformation - Optional Handlebars template for data transformation. * @param debugMode - Optional flag to log data to the console for debugging. * * @returns A promise that resolves to the transformed data. */ export declare function fetchAndTransformDataFromAPI(requestURL: string, headers?: any, columnsToArray?: ColumnConfigurationDataType[], dataTransformation?: string, debugMode?: boolean): Promise; declare interface FileSettingsDataType { dataURL: string; idColumnName: string; fileType?: 'csv' | 'json' | 'api'; delimiter?: string; columnsToArray?: ColumnConfigurationDataType[]; apiHeaders?: any; dataTransformation?: string; } declare type FilterDataType = { column: string; label?: string; defaultValue?: string; excludeValues?: string[]; width?: string; }; declare type FilterUiSettingsDataType = { column: string; label?: string; singleSelect?: boolean; clearable?: boolean; defaultValue?: string[] | string | number | number[]; excludeValues?: string[]; allowSelectAll?: boolean; width?: string; ui?: 'select' | 'radio'; }; declare interface FogDataType { color: string; near: number; far: number; } export declare function FootNote(props: Props_66): default_2.JSX.Element | null; /** * Generates an embed link with custom query parameters. * @param link - The base URL. * @param params - An array of parameters to append. * @returns A URL string with encoded query parameters. */ export declare function generateEmbedLink(link: string, params: ParamsProps[]): string; /** * Generates an iframe HTML string using a base link and parameters. * @param link - The base URL. * @param params - Parameters to convert into query string. * @returns A string of iframe HTML. */ export declare function generateIframeCode(link: string, params: ParamsProps[]): string; /** For using these maps you will have to install [`maplibre`](https://maplibre.org/maplibre-gl-js/docs/#npm), [pmtiles](https://www.npmjs.com/package/pmtiles), [dnd-kit/core](https://www.npmjs.com/package/@dnd-kit/core), and [dnd-kit/modifier](https://www.npmjs.com/package/@dnd-kit/modifiers) package to your project */ export declare function GeoHubCompareMaps(props: Props_49): JSX.Element; export declare type GeoHubGraphType = 'geoHubCompareMap' | 'geoHubMap' | 'geoHubMapWithLayerSelection'; /** For using these maps you will have to install [`maplibre`](https://maplibre.org/maplibre-gl-js/docs/#npm) and [pmtiles](https://www.npmjs.com/package/pmtiles) package to your project */ export declare function GeoHubMap(props: Props_51): default_2.JSX.Element; /** For using these maps you will have to install [`maplibre`](https://maplibre.org/maplibre-gl-js/docs/#npm) and [pmtiles](https://www.npmjs.com/package/pmtiles) package to your project */ export declare function GeoHubMapWithLayerSelection(props: Props_50): JSX.Element; export declare function getCentroidCoordinates(multiPolygonFeature: Feature, centerLargestPolygon?: boolean): Position_2; /** * Returns a set of class break values based on Jenks natural breaks algorithm. * * If the dataset has fewer unique values than the number of steps, * it pads the array and slices out the first and last to get bins. * * @param data - Array of numeric values to classify. * @param noOfSteps - Number of classification steps (breaks). * * @returns An array of bin break values between min and max (excluding them). * * @example * getJenks([1, 2, 3, 10, 20, 30], 3); // e.g., [3, 10] */ export declare function getJenks(data: (number | null | undefined)[], noOfSteps: number): number[]; /** * Returns a mean for a set of number * * @param data - Array of numeric values * * @returns A number * * @example * getMean([1, 2, 3, 10, 20, 30]); // e.g., 11.166666666666666 */ export declare function getMean(data: (number | null | undefined)[]): number; /** * Returns a mean for a set of number * * @param data - Array of numeric values * * @returns A number * * @example * getMedian([1, 2, 3, 10, 20, 30]); // e.g., 6.5 */ export declare function getMedian(data: (number | null | undefined)[]): number; /** * Returns a mode for a set of number * * @param data - Array of numeric values * * @returns A number * * @example * getMode([1, 2, 3, 10, 20, 30]); // e.g., 1 */ export declare function getMode(data: (number | null | undefined)[]): number; /** * Returns a quantile for a set of number * * @param data - Array of numeric values * @param percentile - Percentile to calculate * * @returns A number * * @example * getPercentile([1, 2, 3, 10, 20, 30], 0.5); // e.g., 6.5 */ export declare function getPercentile(data: (number | null | undefined)[], percentile: number): number; /** * Returns the value at the given percentile from a numeric dataset. * * @param data - An array of numbers to compute the percentile from. * @param percentile - The desired percentile (0–100). * @returns The value at the specified percentile. * * @example * getPercentileValue([1, 3, 5, 7, 9], 50); // 5 */ export declare function getPercentileValue(data: number[], percentile: number): number; /** * Parses query parameters from the current browser URL. * * @returns An array of objects containing each query parameter and its value. * If a value contains the `~` delimiter, it will be returned as a string array. * * - Replaces `+` with spaces and `_` with `'`. * - Splits values by `~` to support array-style data. * * @example * getQueryParamsFromLink(); */ export declare function getQueryParamsFromLink(): { param: string; value: string | string[]; }[]; export declare const getScatteredCircleCoordinates: ({ outerRadius, noOfPoints, pointRadius, innerRadius, padding, noOfTicks, random, verticalRange, horizontalRange, angleRange, }: Props_69) => CoordinatesProps[]; /** * Returns a standard deviation for a set of number * * @param data - Array of numeric values * * @returns A number * * @example * getStandardDeviation([1, 2, 3, 10, 20, 30]); // e.g., 11.166666666666666 */ export declare function getStandardDeviation(data: (number | null | undefined)[]): number; /** * Returns a contrasting text color (`#000` or `#fff`) based on the given background color. * * @param bgColor - A background color string in either hex (e.g., `#ffffff`) or RGB format (e.g., `rgb(255,255,255)`). * @returns `'#000'` for light backgrounds, `'#fff'` for dark backgrounds. * * @example * getTextColorBasedOnBgColor('#000000'); // "#fff" * getTextColorBasedOnBgColor('rgb(255,255,255)'); // "#000" */ export declare const getTextColorBasedOnBgColor: (bgColor: string) => "#000" | "#fff"; /** * Extracts unique values from a specified column in a CSV dataset. * * If the column contains non-object values, it extracts the unique values from that column, sorts them, and returns them. * If the column contains object values (e.g., arrays), it flattens the values before extracting and returning the unique values. * * @param csvData - The CSV dataset, represented as an array of objects. * @param column - The column name from which to extract unique values. * * @returns An array of unique values from the specified column, sorted in ascending order. * * @example * const csvData = [{ name: 'Alice' }, { name: 'Bob' }, { name: 'Alice' }]; * getUniqValue(csvData, 'name'); // Returns: ['Alice', 'Bob'] */ export declare function getUniqValue(csvData: any, column: string): (string | number)[]; /** * Returns a variance for a set of number * * @param data - Array of numeric values * * @returns A number * * @example * getVariance([1, 2, 3, 10, 20, 30]); // e.g., 11.166666666666666 */ export declare function getVariance(data: (number | null | undefined)[]): number; declare interface GraphConfigurationDataType { columnId: string | string[]; chartConfigId: string; } export declare function GraphDescription(props: Props_67): default_2.JSX.Element | null; export declare function GraphFooter(props: Props_24): JSX.Element | null; export declare function GraphHeader(props: Props_25): JSX.Element; export declare const graphList: { graphName: string; graphID: string; availableInGriddedGraph: boolean; geoHubMapPresentation: boolean; availableInWideToLongFormat: boolean; }[]; declare interface GraphSettingsDataType { colors?: string | string[] | string[][]; orientation?: 'horizontal' | 'vertical'; axisTitles?: [string, string]; graphTitle?: string | React.ReactNode; labelOrder?: (string | number)[]; graphDescription?: string | React.ReactNode; footNote?: string | React.ReactNode; height?: number; width?: number; sources?: SourcesDataType[]; barPadding?: number; showTicks?: boolean; leftMargin?: number; rightMargin?: number; truncateBy?: number; colorDomain?: string[] | number[]; colorLegendTitle?: string; backgroundColor?: string | boolean; padding?: string; topMargin?: number; bottomMargin?: number; relativeHeight?: number; showColorScale?: boolean; maxValue?: number; minValue?: number; tooltip?: string | ((_d: any) => React.ReactNode); refValues?: ReferenceDataType[]; graphID?: string; highlightedDataPoints?: (string | number)[]; graphDownload?: boolean; sortData?: 'desc' | 'asc'; dataDownload?: boolean; maxRadiusValue?: number; leftBarTitle?: string; rightBarTitle?: string; barColors?: [string, string]; centerGap?: number; columnData?: DataTableColumnDataType[]; mainText?: string | { label: string; suffix?: string; prefix?: string; locale?: string; padZeros?: PadZerosTypes; precision?: number; } | ReactElement; subNote?: string; radius?: number; strokeWidth?: number; showValues?: boolean; scaleType?: ScaleDataType; showColumnLabels?: boolean | ((_d: string) => React.ReactNode); showRowLabels?: boolean | ((_d: string) => React.ReactNode); noDataColor?: string; fillContainer?: boolean; numberOfBins?: number; donutStrokeWidth?: number; barGraphLayout?: 'horizontal' | 'vertical'; graphType?: 'circlePacking' | 'treeMap' | 'barGraph' | 'donutChart'; donutColorDomain?: string[]; lineTitles?: [string, string]; noOfXTicks?: number | 'showAvailableOnly'; dateFormat?: string; lineColors?: string[]; sameAxes?: boolean; highlightAreaSettings?: HighlightAreaSettingsDataType[] | HighlightAreaSettingsForScatterPlotDataType[]; labels?: (string | number)[]; showColorLegendAtTop?: boolean; highlightedLines?: (string | number)[]; fillArea?: boolean | number; mapData?: FeatureCollection | string; xColorLegendTitle?: string; yColorLegendTitle?: string; xDomain?: [number, number, number, number]; yDomain?: [number, number, number, number]; scale?: number; centerPoint?: [number, number]; mapBorderWidth?: number; mapNoDataColor?: string; mapBorderColor?: string; isWorldMap?: boolean; zoomScaleExtend?: [number, number]; zoomTranslateExtend?: [[number, number], [number, number]]; highlightedIds?: string[]; mapProperty?: string; mapStyles?: [string, string]; center?: [number, number]; zoomLevel?: number; mapStyle?: string | { style: string; name: string; }[]; barTitle?: string; lineTitle?: string; barColor?: string; lineColor?: string; showLabels?: boolean | ((d: any) => React.ReactNode); xAxisTitle?: string; yAxisTitle?: string; refXValues?: ReferenceDataType[]; refYValues?: ReferenceDataType[]; customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; maxXValue?: number; minXValue?: number; maxYValue?: number; minYValue?: number; axisTitle?: [string, string]; year?: number | string; aggregationMethod?: 'count' | 'max' | 'min' | 'average' | 'sum'; stripType?: 'strip' | 'dot'; language?: Languages; animate?: boolean | AnimateDataType; highlightColor?: string; dotOpacity?: number; sortParameter?: number | 'diff' | 'total'; arrowConnector?: boolean; connectorStrokeWidth?: number; countOnly?: (string | number)[]; value?: number; gridSize?: number; unitPadding?: number; size?: number; totalNoOfDots?: number; showStrokeForWhiteDots?: boolean; note?: string; showNAColor?: boolean; minHeight?: number; autoPlay?: boolean; autoSort?: boolean; showOnlyActiveDate?: boolean; showDots?: boolean; diffAreaColors?: [string, string]; theme?: 'dark' | 'light'; uiMode?: 'light' | 'normal'; maxBarThickness?: number; minBarThickness?: number; maxNumberOfBars?: number; includeLayers?: string[]; excludeLayers?: string[]; layerSelection?: { layerID: string; name: string[]; }[]; annotations?: AnnotationSettingsDataType[]; regressionLine?: boolean | string; ariaLabel?: string; nodePadding?: number; nodeWidth?: number; highlightedSourceDataPoints?: string[]; highlightedTargetDataPoints?: string[]; defaultLinkOpacity?: number; sourceTitle?: string; targetTitle?: string; sortNodes?: 'asc' | 'desc' | 'mostReadable' | 'none'; sourceColors?: string[] | string; targetColors?: string[] | string; sourceColorDomain?: string[]; targetColorDomain?: string[]; showIntervalDots?: boolean; showIntervalValues?: boolean; intervalLineStrokeWidth?: number; intervalLineColors?: [string, string]; intervalAreaColor?: string; cardTemplate?: string | ((_d: any) => React.ReactNode); cardBackgroundColor?: string; legendMaxWidth?: string; cardFilters?: { column: string; label?: string; defaultValue?: string | number; excludeValues?: (string | number)[]; width?: string; }[]; cardSortingOptions?: { defaultValue?: string; options: { value: string; label: string; type: 'asc' | 'desc'; }[]; width?: string; }; cardSearchColumns?: string[]; cardMinWidth?: number; textBackground?: boolean; headingFontSize?: string; centerAlign?: boolean; verticalAlign?: 'center' | 'top' | 'bottom'; resetSelectionOnDoubleClick?: boolean; intervalAreaOpacity?: number; detailsOnClick?: string | ((_d: any) => React.ReactNode); valueColor?: string; labelColor?: string; noOfYTicks?: number; noOfTicks?: number; minDate?: string | number; maxDate?: string | number; colorLegendColors?: string[]; colorLegendDomain?: string[]; barAxisTitle?: string; allowDataDownloadOnDetail?: string | boolean; noOfItemsInAPage?: number; curveType?: CurveTypes; styles?: StyleObject; classNames?: ClassNameObject; mapProjection?: MapProjectionTypes; filterNA?: boolean; fillShape?: boolean; colorScaleMaxWidth?: string; axisLabels?: (string | number)[]; minWidth?: string; zoomInteraction?: ZoomInteractionTypes; layout?: 'primary' | 'secondary'; qualitativeRangeColors?: string[]; targetStyle?: 'background' | 'line'; targetColor?: 'string'; measureBarWidthFactor?: number; mapLegend?: string | React.ReactNode | MapLegendDataType[]; dimmedOpacity?: number; customLayers?: CustomLayerDataType[]; dashedLines?: (string | number)[]; dashSettings?: string[]; labelsToBeHidden?: (string | number)[]; autoRotate?: boolean; enableZoom?: boolean; globeMaterial?: any; atmosphereColor?: string; lineAxisTitle?: string; timeline?: TimelineDataType; naLabel?: string; globeOffset?: [number, number]; polygonAltitude?: number; atmosphereAltitude?: number; globeCurvatureResolution?: number; lights?: LightConfig[]; fogSetting?: FogDataType; showAxisLabels?: boolean; highlightedAltitude?: number; selectedId?: string; collapseColorScaleByDefault?: boolean; dotLegendTitle?: string; dotColor?: string; dotBorderColor?: string; mapColorLegendTitle?: string; choroplethScaleType?: Exclude; trackColor?: string; zoomAndCenterByHighlightedIds?: boolean; hideAxisLine?: boolean; projectionRotate?: [number, number] | [number, number, number]; rewindCoordinatesInMapData?: boolean; circularBoundary?: boolean; showDataMinMax?: boolean; showVoronoiTesselation?: boolean; mapOverlay?: MapOverlayDataType; useVoronoiInteraction?: boolean; numberDisplayOptions?: NumberFormatOptions; leftLineNumberDisplayOptions?: NumberFormatOptions; rightLineNumberDisplayOptions?: NumberFormatOptions; barNumberDisplayOptions?: NumberFormatOptions; lineNumberDisplayOptions?: NumberFormatOptions; xNumberDisplayOptions?: NumberFormatOptions; yNumberDisplayOptions?: NumberFormatOptions; defaultColor?: string; strictValuePosition?: boolean; gridIcon?: { width?: number; height?: number; d: string[]; }; showTotalValue?: boolean; labelPosition?: 'inside' | 'outside' | 'overlap'; dimmedNodeOpacity?: number; labelWidth?: number; highlightedLinks?: { source: string; target: string; }[]; minLabelSize?: number; minLabelHeight?: number; minLabelWidth?: number; minLabelRadius?: number; groupOrder?: (string | number)[]; showGroups?: boolean; distributionMarkers?: DistributionMarkerDataType[]; highlightSameLabelOnHover?: boolean; maxGroupThickness?: number; minGroupThickness?: number; groupPadding?: number; showCostalBorder?: boolean; showUNBorder?: boolean; showAksaiChinAsStriped?: boolean; isDisputedAreasInteractive?: boolean; repositionOverlappingLabels?: boolean; cornerRadius?: number; } export declare function GraphTitle(props: Props_68): default_2.JSX.Element | null; export declare type GraphType = GraphTypeForGriddedGraph; export declare type GraphTypeForGriddedGraph = 'barChart' | 'waterfallChart' | 'stackedBarChart' | 'groupedBarChart' | 'lineChart' | 'dualAxisLineChart' | 'multiLineChart' | 'multiLineAltChart' | 'differenceLineChart' | 'stackedAreaChart' | 'choroplethMap' | 'biVariateChoroplethMap' | 'hybridMap' | 'dotDensityMap' | 'donutChart' | 'slopeChart' | 'scatterPlot' | 'dumbbellChart' | 'treeMap' | 'circlePacking' | 'heatMap' | 'stripChart' | 'beeSwarmChart' | 'butterflyChart' | 'histogram' | 'sparkLine' | 'paretoChart' | 'dataTable' | 'statCard' | 'unitChart' | 'sankeyChart' | 'lineChartWithConfidenceInterval' | 'dataCards' | 'radarChart' | 'bulletChart'; export declare function GriddedGraphs(props: Props_6): JSX.Element; export declare function GriddedGraphsFromConfig(props: Props_7): JSX.Element; declare interface GroupedBarChartProps { /** Array of data objects */ data: GroupedBarGraphDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for different bars in the group */ colors?: string[]; /** Domain of colors for the graph */ colorDomain: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Value by which the label are truncated. Only applicable if showLabel is true */ truncateBy?: number; /** Track color (i.e. the color of the bars background) of the bar chart */ trackColor?: string; /** Toggles if data points which have all the values as undefined or null are filtered out. */ filterNA?: boolean; /** Parameter to sort the data. If a number is provided, it refers to the index of the size array to determine which value to sort by. If set to total, it sorts by the sum of all the values. */ sortParameter?: number | 'total'; /** Sorting order for data. This is overwritten by labelOrder prop. */ sortData?: 'asc' | 'desc'; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; showLabels?: boolean | ((_d: any) => React.ReactNode); /** Corner radius of the bars */ cornerRadius?: number; /** Toggle visibility of values */ showValues?: boolean; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Title for the bar axis */ barAxisTitle?: string; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } export declare function GroupedBarGraph(props: GroupedBarChartProps): JSX.Element; declare interface GroupedBarGraphDataType { label: string | number; size: (number | null)[]; date?: string | number; data?: object; } declare interface HeaderProps { label: string; key: string; } export declare function HeatMap(props: Props_37): JSX.Element; declare interface HeatMapDataType { row: string; column: string; value?: string | number; data?: object; } declare interface HighlightAreaSettingsDataType { coordinates: [number | string | null, number | string | null]; style?: React.CSSProperties; className?: string; color?: string; strokeWidth?: number; } declare interface HighlightAreaSettingsForScatterPlotDataType { coordinates: [number | null, number | null, number | null, number | null]; style?: React.CSSProperties; className?: string; color?: string; strokeWidth?: number; } declare type HighlightDataPointSettingsDataType = { column: string; label?: string; defaultValues?: (string | number)[]; excludeValues?: (string | number)[]; width?: string; }; export declare function Histogram(props: Props_38): JSX.Element; declare interface HistogramDataType { value: number; data?: object; } export declare function HybridMap(props: Props_52): JSX.Element; declare interface HybridMapDataType { lat?: number; long?: number; x?: number | string | null; id?: string; radius?: number; label?: string | number; date?: string | number; data?: object; } /** * Downloads an image of a specified HTML element as a PNG file. * * Uses `modern-screenshot` to capture the content of the `node` and converts it to a downloadable PNG image. * It removes elements with the class `undp-viz-download-button` from the clone to prevent them from appearing in the screenshot. * * @param node - The HTMLElement to capture and convert into an image. * @param filename - The desired filename for the downloaded image (without extension). * * @example * const element = document.getElementById('myElement'); * imageDownload(element, 'screenshot'); */ export declare function imageDownload(node: HTMLElement, filename: string): void; export declare function ImageDownloadButton(props: Props_4): JSX.Element; declare interface InfoBoxDataType { title?: string | React.ReactNode; description?: string | React.ReactNode; } declare type Languages = 'en' | 'ar' | 'az' | 'bn' | 'cy' | 'he' | 'hi' | 'ja' | 'ka' | 'km' | 'ko' | 'my' | 'ne' | 'zh' | 'custom'; declare type LightConfig = AmbientLightConfig | DirectionalLightConfig | PointLightConfig | SpotLightConfig; export declare function LinearColorLegend(props: Props_26): JSX.Element; declare interface LineChartDataType { date: number | string; y: number; data?: object; } export declare function LineChartWithConfidenceInterval(props: Props_42): JSX.Element; declare interface LineChartWithConfidenceIntervalDataType { date: number | string; y?: number | null; yMin?: number | null; yMax?: number | null; data?: object; } declare interface MapLegendDataType { mapStyleName: string; legend: string | React.ReactNode; } declare interface MapOverlayDataType { mapData: FeatureCollection | string; mapBorderWidth?: number; mapBorderColor?: string; } declare type MapProjectionTypes = 'mercator' | 'equalEarth' | 'naturalEarth' | 'orthographic'; export declare function MultiGraphDashboard(props: Props_8): JSX.Element; export declare function MultiGraphDashboardFromConfig(props: Props_9): JSX.Element; export declare function MultiGraphDashboardWideToLongFormat(props: Props_10): JSX.Element; export declare function MultiGraphDashboardWideToLongFormatFromConfig(props: Props_11): JSX.Element; export declare function MultiLineAltChart(props: Props_43): JSX.Element; declare interface MultiLineAltChartDataType { label: number | string; y: number | null; color?: string | number; date: string | number; data?: object; } export declare function MultiLineChart(props: Props_44): JSX.Element; declare interface MultiLineChartDataType { date: number | string; y: (number | null)[]; data?: object; } declare interface NumberFormatOptions { locale?: string; precision?: number; prefix?: string; suffix?: string; padZeros?: PadZerosTypes; } export declare function numberFormattingFunction(value: number | string | undefined | null, naLabel?: string, precision?: number, prefix?: string, suffix?: string, locale?: string, padZeros?: PadZerosTypes): string; declare type PadZerosTypes = 'all' | 'decimal' | 'none'; /** * Represents a parameter to be embedded in a URL. */ declare interface ParamsProps { id: string; value: string | boolean | number | string[] | number[]; } export declare function ParetoChart(props: Props_54): JSX.Element; declare interface ParetoChartDataType { label: number | string; bar?: number; line?: number; data?: object; } declare interface PerformanceIntensiveChaptersDataType { dataSettings: DataSettingsDataType; graphSettings: GraphSettingsDataType; graphType: GraphType | GeoHubGraphType | ThreeDGraphType; graphDataConfiguration?: GraphConfigurationDataType[]; sections: SectionsDataType[]; } declare interface PerformanceIntensiveDashboardColumnDataType extends DashboardColumnDataWithoutGraphType { graphType: GraphType | ThreeDGraphType | GeoHubGraphType; } declare interface PerformanceIntensiveDashboardLayoutDataType extends DashboardLayoutDataWithoutRowsType { rows: { columns: PerformanceIntensiveDashboardColumnDataType[]; height?: number; }[]; } export declare function PerformanceIntensiveMultiGraphDashboard(props: Props_12): JSX.Element; export declare function PerformanceIntensiveMultiGraphDashboardFromConfig(props: Props_13): JSX.Element; /** ScrollStory is a scrollytelling container component that reveals content step-by-step as the user scrolls through the page. */ export declare function PerformanceIntensiveScrollStory(props: Props_14): JSX.Element; declare interface PointLightConfig extends BaseLightConfig { type: 'point'; distance?: number; decay?: number; position?: Position | 'camera'; } declare interface Position { x: number; y: number; z: number; } declare interface Props { text: string; successMessage?: string; buttonColor?: Color; buttonText?: string; buttonSmall?: boolean; className?: string; } declare interface Props_10 { dashboardID?: string; dashboardLayout: DashboardFromWideToLongFormatLayoutDataType; dataSettings: DataSettingsWideToLongDataType; debugMode?: boolean; theme?: 'dark' | 'light'; readableHeader?: { value: string; label: string; }[]; dataFilters?: DataFilterDataType[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface Props_11 { config: string | ConfigObject_3; } declare interface Props_12 { dashboardID?: string; dashboardLayout: PerformanceIntensiveDashboardLayoutDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; dataFilters?: DataFilterDataType[]; debugMode?: boolean; theme?: 'dark' | 'light'; filterPosition?: 'top' | 'side'; readableHeader?: { value: string; label: string; }[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface Props_13 { config: string | ConfigObject_4; } declare interface Props_14 { /** Defines if the information is shown as overlay or on the side */ mode?: 'overlay' | 'side'; /** Defines the width of the info section */ infoWidth?: string; /** Defined the different chapters for the story and different sections within the story */ chapters: PerformanceIntensiveChaptersDataType[]; /** Position of info on the page */ infoPosition?: 'left' | 'right' | 'center'; /** Sets how much of the element (from 0 to 1) must be visible before it's considered in view and it trigger the animation in the scrollytelling */ visibilityThreshold?: number; /** Sets background color of the info box. */ infoBackgroundColor?: string; } declare interface Props_15 { graphSettings?: GraphSettingsDataType; graphType: GeoHubGraphType; debugMode?: boolean; uiMode?: 'light' | 'normal'; } declare interface Props_16 { config: string | ConfigObject_5; } declare interface Props_17 { graphSettings?: GraphSettingsDataType; readableHeader?: { value: string; label: string; }[]; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; highlightDataPointSettings?: HighlightDataPointSettingsDataType; noOfFiltersPerRow?: number; graphType: ThreeDGraphType; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; debugMode?: boolean; uiMode?: 'light' | 'normal'; updateFilters?: (_d: string) => void; } declare interface Props_18 { config: string | ConfigObject_6; } declare interface Props_19 { /** Defines if the information is shown as overlay or on the side */ mode?: 'overlay' | 'side'; /** Defines the width of the info section */ infoWidth?: string; /** Defined the different chapters for the story and different sections within the story */ chapters: ChaptersDataType[]; /** Position of info on the page */ infoPosition?: 'left' | 'right' | 'center'; /** Sets how much of the element (from 0 to 1) must be visible before it's considered in view and it trigger the animation in the scrollytelling */ visibilityThreshold?: number; /** Sets background color of the info box. */ infoBackgroundColor?: string; } declare interface Props_2 { buttonContent?: string | JSX.Element; buttonColor?: Color; csvData: any; fileName?: string; headers: HeaderProps[]; separator?: ',' | ';'; buttonSmall?: boolean; className?: string; } declare interface Props_20 { graphSettings?: GraphSettingsDataType; readableHeader?: { value: string; label: string; }[]; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; highlightDataPointSettings?: HighlightDataPointSettingsDataType; noOfFiltersPerRow?: number; graphType: GraphType; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; debugMode?: boolean; uiMode?: 'light' | 'normal'; updateFilters?: (_d: string) => void; } declare interface Props_21 { config: string | ConfigObject_7; } declare interface Props_22 { colors: string[]; colorDomain: (string | number)[]; dashedLines?: (string | number)[]; labelsToBeHidden?: (string | number)[]; colorLegendTitle?: string; showNAColor: boolean; width?: number; isCenter?: boolean; className?: string; } declare interface Props_23 { colors: string[]; colorDomain: (string | number)[]; colorLegendTitle?: string; showNAColor: boolean; setSelectedColor: (_d?: string) => void; width?: number; isCenter?: boolean; className?: string; } declare interface Props_24 { footNote?: string | React.ReactNode; sources?: SourcesDataType[]; width?: number; styles?: { footnote?: React.CSSProperties; source?: React.CSSProperties; }; classNames?: { footnote?: string; source?: string; }; } declare interface Props_25 { graphTitle?: string | React.ReactNode; graphDescription?: string | React.ReactNode; width?: number; graphDownload?: RefObject; dataDownload?: any; isDashboard?: boolean; styles?: { title?: React.CSSProperties; description?: React.CSSProperties; }; classNames?: { title?: string; description?: string; }; } declare interface Props_26 { colors: string[]; colorDomain: number[]; colorLegendTitle?: string; width?: number; className?: string; locale?: string; } declare interface Props_27 { colors: string[]; colorDomain: number[]; colorLegendTitle?: string; setSelectedColor: (_d?: string) => void; width?: number; naColor?: string; className?: string; showNAColor: boolean; locale?: string; naLabel: string; } declare interface Props_28 { /** Array of data objects */ data: BarGraphDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for bars */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Minimum thickness of bars */ minBarThickness?: number; /** Maximum number of bars shown in the graph */ maxNumberOfBars?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Value by which the label are truncated. Only applicable if showLabel is true */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; showLabels?: boolean | ((_d: any) => React.ReactNode); /** Toggle visibility of values */ showValues?: boolean; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Corner radius of the bars */ cornerRadius?: number; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Title for the bar axis */ barAxisTitle?: string; /** Sorting order for data. This is overwritten by labelOrder prop. */ sortData?: 'asc' | 'desc'; /** Track color (i.e. the color of the bars background) of the bar chart */ trackColor?: string; /** Toggles if data point which are undefined or has value null are filtered out. */ filterNA?: boolean; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_29 { /** Array of data objects */ data: BeeSwarmChartDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circle */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Custom order for . Only applicable of group is present in the data props */ groupOrder?: (string | number)[]; /** Maximum thickness of group. Only applicable of group is present in the data props */ maxGroupThickness?: number; /** Minimum thickness of group. Only applicable of group is present in the data props */ minGroupThickness?: number; /** Padding between groups. Only applicable of group is present in the data props*/ groupPadding?: number; /** Maximum value for the radius of the circle */ maxRadiusValue?: number; /** Minimum value for position of the circle */ minValue?: number; /** Maximum value for position of the circle */ maxValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of groups or defines what is shown in the group label */ showGroups?: boolean | ((_d: any) => React.ReactNode); /** Toggle visibility of values */ showTicks?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Value by which the label are truncated. Only applicable if showGroups is true */ truncateBy?: number; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Defines if the data point are locked exactly to their data value on the axis; if false, nodes are pulled toward their value but may drift when crowded */ strictValuePosition?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines if all the data points with same labels are highlighted on hover */ highlightSameLabelOnHover?: boolean; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Maximum radius of the circles */ radius?: number; /** Defines distribution markers shown as a line for data points. */ distributionMarkers?: DistributionMarkerDataType[]; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_3 { buttonContent?: string | JSX.Element; buttonColor?: Color; csvData: any; fileName?: string; headers: string[]; xlsxHeader: any; wscols: WsColInterface[]; buttonSmall?: boolean; className?: string; } declare interface Props_30 { /** Array of data objects */ data: BulletChartDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color for bars */ barColor?: string; /** Domain of colors for the qualitative range bars */ colorDomain?: string[]; /** Colors for the qualitative range bars */ qualitativeRangeColors?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Minimum thickness of bars */ minBarThickness?: number; /** Maximum number of bars shown in the graph */ maxNumberOfBars?: number; /** Prefix for values */ prefix?: string; /** Suffix for values */ suffix?: string; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of values */ showValues?: boolean; /** Defines the style of the target bar */ targetStyle?: 'background' | 'line'; /** Defines the color of the target bar */ targetColor?: string; /** Defines the thickness if the target is of style line */ targetLineThickness?: number; /** Defines the width of the measure bar in relation with available width */ measureBarWidthFactor?: number; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: Omit; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Title for the bar axis */ barAxisTitle?: string; /** Sorting order for data. This is overwritten by labelOrder prop. */ sortData?: 'asc' | 'desc'; /** Toggles if data point which are undefined or has value null are filtered out. */ filterNA?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_31 { /** Array of data objects */ data: ButterflyChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color for the left and right bars */ barColors?: [string, string]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Spacing between the left and right bars */ centerGap?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Title for the left bars */ leftBarTitle?: string; /** Title for the right bars */ rightBarTitle?: string; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_32 { /** Array of data objects */ data: TreeMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circle */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value mapped to the radius chart */ maxRadiusValue?: number; /** If true, the graph will be rendered in a circle layout */ circularBoundary?: boolean; /** Maximum radius of the circle */ radius?: number; /** Toggle visibility of labels or defines what is shown in the label */ showLabels?: boolean | ((_d: any) => React.ReactNode); /** Minimum radius of the circle for the label to be visible */ minLabelRadius?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_33 { /** Array of data objects */ data: object[]; /** Title of the graph */ graphTitle?: string | default_2.ReactNode; /** Description of the graph */ graphDescription?: string | default_2.ReactNode; /** Footnote for the graph */ footNote?: string | default_2.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Background color of each of the card */ cardBackgroundColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Html for each card. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data. */ cardTemplate: string | ((_d: any) => default_2.ReactNode); /** Allows users to add a dropdown menus, that can be used as filters in the graph. Each filter is an object that specifies the column to filter by, and the default value. All the filters are single select only. */ cardFilters?: FilterDataType[]; /** Allows users to add a dropdown menus, that can be used to sort the cards based on different columns. */ cardSortingOptions?: { defaultValue?: string; options: { value: string; label: string; type: 'asc' | 'desc'; }[]; width?: string; }; /** Adds a search bar to search the cards list. The array defines all the columns from the data where text is used to search from. */ cardSearchColumns?: string[]; /** Min width of the cards for responsiveness. */ cardMinWidth?: number; /** Add a button to download data object when viewing details. If true, data can be downloaded; if a string is provided, it specifies the button label. */ allowDataDownloadOnDetail?: string | boolean; /** Defines the number of items displayed per page. */ noOfItemsInAPage?: number; /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => default_2.ReactNode); /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Theme for the UI elements */ uiMode?: 'light' | 'normal'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_34 { /** Array of data objects. If the data have a object for ket `rowStyle` then that is use to style the row of the table. */ data: object[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Minimum width of the table as string in px */ minWidth?: string; /** Height of the graph */ height?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Column settings for each column shown in the table. */ columnData: DataTableColumnDataType[]; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_35 { /** Array of data objects */ data: DonutChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for each segment */ colors?: string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Radius of the donut chart */ radius?: number; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Max width of the color scale as a css property */ colorScaleMaxWidth?: string; /** Stroke width of the arcs and circle of the donut */ strokeWidth?: number; /** Sorting order for data. This is overwritten by labelOrder prop */ sortData?: 'asc' | 'desc'; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Large text at the center of the donut chart. If the type is an object then the text is the value in the data for the label mentioned in the object */ mainText?: string | { label: string; suffix?: string; prefix?: string; locale?: string; padZeros?: PadZerosTypes; precision?: number; } | ReactElement; /** Small text at the center of the donut chart */ subNote?: string; /** Track color (i.e. the color of the donut chart's background) of the donut chart */ trackColor?: string; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_36 { /** Array of data objects */ data: DumbbellChartDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for the circle */ colors?: string[]; /** Domain of colors for the graph */ colorDomain: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Minimum thickness of bars */ minBarThickness?: number; /** Maximum number of bars shown in the graph */ maxNumberOfBars?: number; /** Radius of the dots */ radius?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of values */ showValues?: boolean; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis. Only applicable to vertical charts. */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle if the is a arrow head at the end of the connector */ arrowConnector?: boolean; /** Toggle if the labels are repositioned to avoid overlapping. Only applicable to horizontal dumbbell charts. */ repositionOverlappingLabels?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Stroke width of the connector */ connectorStrokeWidth?: number; /** Title for the axis */ axisTitle?: string; /** Sorting order for data. If this is a number then data is sorted by value at that index x array in the data props. If this is diff then data is sorted by the difference of the last and first element in the x array in the data props. This is overwritten by labelOrder prop */ sortParameter?: number | 'diff'; /** Sorting order for data. This is overwritten by labelOrder prop. */ sortData?: 'asc' | 'desc'; /** Toggles if data points which have all the values as undefined or null are filtered out. */ filterNA?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_37 { /** Array of data objects */ data: HeatMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for cells */ colors?: string[]; /** Color where data is not available */ noDataColor?: string; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Toggles the background to fill the container. This only works if the width of the graph is defined. */ fillContainer?: boolean; /** Value by which the label are truncated. Only applicable if showLabel is true */ truncateBy?: number; /** Reference values for comparison */ /** Toggle visibility of labels in the column */ showColumnLabels?: boolean | ((_d: string) => React.ReactNode); /** Toggle visibility of labels in the row */ showRowLabels?: boolean | ((_d: string) => React.ReactNode); /** Scale for the colors in the cell */ scaleType?: ScaleDataType; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Domain for the colors in the cell. */ colorDomain: number[] | string[]; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_38 { /** Array of data objects */ data: HistogramDataType[]; /** Type of the graph for histogram */ graphType?: 'circlePacking' | 'treeMap' | 'barGraph' | 'donutChart'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors for visualization */ colors?: string[] | string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Maximum value for the chart */ maxValue?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of bins for the histogram */ numberOfBins?: number; /** Orientation of the bar graph. Only applicable if graphType is barGraph. */ barGraphLayout?: 'vertical' | 'horizontal'; /** Stroke width of the arcs and circle of the donut. Only applicable if graphType is donutChart. */ donutStrokeWidth?: number; /** Sorting order for data. This is overwritten by labelOrder prop */ sortData?: 'asc' | 'desc'; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis. Only applicable if `graphType` is `barGraph`. */ hideAxisLine?: boolean; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_39 { /** Array of data objects */ data: DifferenceLineChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for the 2 lines */ lineColors?: [string, string]; /** Array of colors to highlight the negative and positive difference between the lines */ diffAreaColors?: [string, string]; /** Toggle the visibility of color legend between the top of the graphs and next to the line */ showColorLegendAtTop?: boolean; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Labels for the lines */ labels: [string, string]; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Title for the Y-axis */ yAxisTitle?: string; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_4 { buttonContent?: string | JSX.Element; buttonColor?: Color; nodeID: string | RefObject; filename?: string; buttonSmall?: boolean; className?: string; } declare interface Props_40 { /** Array of data objects */ data: DualAxisLineChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for the 2 lines */ lineColors?: [string, string]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Controls the fill of the area under the line. If the type is number then the number is used to define the opacity of the fill. */ fillArea?: boolean | number; /** Stroke width of the line */ strokeWidth?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Enables same axis for the 2 lines */ sameAxes?: boolean; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Toggle visibility of labels of the axis. */ showAxisLabels?: boolean; /** Labels for the lines */ labels: [string, string]; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding for left line. */ leftLineNumberDisplayOptions?: NumberFormatOptions; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding for right line. */ rightLineNumberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_41 { /** Array of data objects */ data: LineChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors of the lines */ lineColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Title for the Y-axis */ yAxisTitle?: string; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Toggles the visibility of the regression line for the data. If the type is string then string is use to define the color of the line. */ regressionLine?: boolean | string; /** Curve type for the line */ curveType?: CurveTypes; /** Controls the fill of the area under the line. If the type is number then the number is used to define the opacity of the fill. */ fillArea?: boolean | number; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_42 { /** Array of data objects */ data: LineChartWithConfidenceIntervalDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors of the line */ lineColor?: string; /** Colors of the interval area */ intervalAreaColor?: string; /** Colors of the top and bottom lines of the interval */ intervalLineColors?: [string, string]; /** Colors for the legend */ colorLegendColors?: string[]; /** Domain of colors for the legend */ colorLegendDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of values of the interval area */ showIntervalValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Toggle visibility of dots on the line of te interval area */ showIntervalDots?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Stroke width of the lines of the interval area */ intervalLineStrokeWidth?: number; /** Opacity of the interval area */ intervalAreaOpacity?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Title for the Y-axis */ yAxisTitle?: string; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Toggles the visibility of the regression line for the data. If the type is string then string is use to define the color of the line. */ regressionLine?: boolean | string; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_43 { /** Array of data objects */ data: MultiLineAltChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for lines */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: (string | number)[]; /** Toggle the visibility of labels of the lines when highlighted or mouse hovered */ showLabels?: boolean; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Title for the Y-axis */ yAxisTitle?: string; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Toggle visibility of year labels on hover. */ showDateOnHover?: boolean; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Toggle interaction of Voronoi cells */ useVoronoiInteraction?: boolean; /** Toggle visibility of Voronoi tesselation. Should be used for debugging only */ showVoronoiTesselation?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedLines?: (string | number)[]; /** Defines if the labels should be shown for highlighted lines. */ showHighlightedLinesLabels?: boolean; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_44 { /** Array of data objects */ data: MultiLineChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors of the lines */ lineColors?: string[]; /** Toggle the visibility of color legend between the top of the graphs and next to the line */ showColorLegendAtTop?: boolean; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Array of labels of line which are dashed */ dashedLines?: (string | number)[]; /** Array of dash settings that define the dash style for the dashed line. If the length of the array is less than length of dashedLines then it loop around. */ dashSettings?: string[]; /** Defines which labels are hidden from the color scale and the graph */ labelsToBeHidden?: (string | number)[]; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Maximum value of the date for the chart */ maxDate?: string | number; /** Minimum value of the date for the chart */ minDate?: string | number; /** No. of ticks on the x-axis or use the value `showAvailableOnly` to show only year which are present in data */ noOfXTicks?: number | 'showAvailableOnly'; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Controls the fill of the area under the line. If the type is number then the number is used to define the opacity of the fill. */ fillArea?: boolean | number; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */ animate?: boolean | AnimateDataType; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Title for the Y-axis */ yAxisTitle?: string; /** Labels for the lines */ labels: (string | number)[]; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedLines?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_45 { /** Array of data objects */ data: LineChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors of the lines */ lineColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Toggles the visibility of the area below the line. If the type is number then the number is used to define the opacity of the area */ fillArea?: boolean | number; /** Curve type for the line */ curveType?: CurveTypes; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_46 { /** Array of data objects. */ data: BivariateMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors for the choropleth map. Array must be 5x5 */ colors?: string[][]; /** Title for the first color legend */ xColorLegendTitle?: string; /** Title for the second color legend */ yColorLegendTitle?: string; /** Domain of x-colors for the map */ xDomain?: number[]; /** Domain of y-colors for the map */ yDomain?: number[]; /** Color for the areas where data is no available */ mapNoDataColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Map data as an object in geoJson format or a url for geoJson */ mapData?: FeatureCollection | Topology | string; /** Detail if any other map needs to be overlayed over the main map */ mapOverlay?: MapOverlayDataType; /** Defines if the coordinates in the map data should be rewinded or not. Try to change this is the visualization shows countries as holes instead of shapes. */ rewindCoordinatesInMapData?: boolean; /** Scaling factor for the map. Multiplies the scale number to scale. */ scale?: number; /** Center point of the map */ centerPoint?: [number, number]; /** Controls the rotation of the map projection, in degrees, applied before rendering. Useful for shifting the antimeridian to focus the map on different regions */ projectionRotate?: [number, number] | [number, number, number]; /** Defines the zoom mode for the map */ zoomInteraction?: ZoomInteractionTypes; /** Stroke width of the regions in the map */ mapBorderWidth?: number; /** Stroke color of the regions in the map */ mapBorderColor?: string; /** Toggle if the UN border are shown. */ showUNBorder?: boolean; /** Toggle if the coastal border is shown. Only applicable if default world map is used */ showCostalBorder?: boolean; /** Toggle if the map is a world map */ isWorldMap?: boolean; /** Toggle if the disputed areas are interactive. The way it works is it check for a property name `iso3cd` in map shape data if it starts with 'x' then the area is considered disputed. */ isDisputedAreasInteractive?: boolean; /** Map projection type */ mapProjection?: MapProjectionTypes; /** Toggle if the map is centered and zoomed to the highlighted ids. */ zoomAndCenterByHighlightedIds?: boolean; /** Extend of the allowed zoom in the map */ zoomScaleExtend?: [number, number]; /** Extend of the allowed panning in the map */ zoomTranslateExtend?: [[number, number], [number, number]]; /** Countries or regions to be highlighted */ highlightedIds?: string[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Property in the property object in mapData geoJson object is used to match to the id in the data object */ mapProperty?: string; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Toggle if color scale is collapsed by default. */ collapseColorScaleByDefault?: boolean; /** Show Aksai Chin as striped */ showAksaiChinAsStriped?: boolean; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ xNumberDisplayOptions?: Omit; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ yNumberDisplayOptions?: Omit; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_47 { /** Array of data objects */ data: ChoroplethMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors for the choropleth map */ colors?: string[]; /** Domain of colors for the graph */ colorDomain?: number[] | string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color for the areas where data is no available */ mapNoDataColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Map data as an object in geoJson format or a url for geoJson */ mapData?: FeatureCollection | string; /** Detail if any other map needs to be overlayed over the main map */ mapOverlay?: MapOverlayDataType; /** Defines if the coordinates in the map data should be rewinded or not. Try to change this is the visualization shows countries as holes instead of shapes. */ rewindCoordinatesInMapData?: boolean; /** Scaling factor for the map. Multiplies the scale number to scale. */ scale?: number; /** Toggle if the map is centered and zoomed to the highlighted ids. */ zoomAndCenterByHighlightedIds?: boolean; /** Center point of the map */ centerPoint?: [number, number]; /** Controls the rotation of the map projection, in degrees, applied before rendering. Useful for shifting the antimeridian to focus the map on different regions */ projectionRotate?: [number, number] | [number, number, number]; /** Defines the zoom mode for the map */ zoomInteraction?: ZoomInteractionTypes; /** Stroke width of the regions in the map */ mapBorderWidth?: number; /** Stroke color of the regions in the map */ mapBorderColor?: string; /** Toggle if the UN border are shown. */ showUNBorder?: boolean; /** Toggle if the coastal border is shown. Only applicable if default world map is used */ showCostalBorder?: boolean; /** Toggle if the map is a world map */ isWorldMap?: boolean; /** Toggle if the disputed areas are interactive. The way it works is it check for a property name `iso3cd` in map shape data if it starts with 'x' then the area is considered disputed. */ isDisputedAreasInteractive?: boolean; /** Map projection type */ mapProjection?: MapProjectionTypes; /** Extend of the allowed zoom in the map */ zoomScaleExtend?: [number, number]; /** Extend of the allowed panning in the map */ zoomTranslateExtend?: [[number, number], [number, number]]; /** Countries or regions to be highlighted */ highlightedIds?: string[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Scale for the colors */ scaleType?: Exclude; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Toggle if color scale is collapsed by default. */ collapseColorScaleByDefault?: boolean; /** Property in the property object in mapData geoJson object is used to match to the id in the data object */ mapProperty?: string; /** Show Aksai Chin as striped */ showAksaiChinAsStriped?: boolean; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ numberDisplayOptions?: Omit; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_48 { /** Array of data objects */ data: DotDensityMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for the circle */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color for the areas where data is no available */ mapNoDataColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Maximum radius of the circle */ radius?: number; /** Map data as an object in geoJson format or a url for geoJson */ mapData?: FeatureCollection | string; /** Detail if any other map needs to be overlayed over the main map */ mapOverlay?: MapOverlayDataType; /** Defines if the coordinates in the map data should be rewinded or not. Try to change this is the visualization shows countries as holes instead of shapes. */ rewindCoordinatesInMapData?: boolean; /** Scaling factor for the map. Multiplies the scale number to scale. */ scale?: number; /** Center point of the map */ centerPoint?: [number, number]; /** Controls the rotation of the map projection, in degrees, applied before rendering. Useful for shifting the antimeridian to focus the map on different regions */ projectionRotate?: [number, number] | [number, number, number]; /** Defines the zoom mode for the map */ zoomInteraction?: ZoomInteractionTypes; /** Stroke width of the regions in the map */ mapBorderWidth?: number; /** Stroke color of the regions in the map */ mapBorderColor?: string; /** Toggle if the UN border are shown. */ showUNBorder?: boolean; /** Toggle if the coastal border is shown. Only applicable if default world map is used */ showCostalBorder?: boolean; /** Toggle if the map is a world map */ isWorldMap?: boolean; /** Map projection type */ mapProjection?: MapProjectionTypes; /** Extend of the allowed zoom in the map */ zoomScaleExtend?: [number, number]; /** Extend of the allowed panning in the map */ zoomTranslateExtend?: [[number, number], [number, number]]; /** Toggle visibility of labels */ showLabels?: boolean; /** Maximum value mapped to the radius chart */ maxRadiusValue?: number; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle if color scale is collapsed by default. */ collapseColorScaleByDefault?: boolean; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_49 { /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** URLs for mapStyles JSON user wants to compare */ mapStyles: [string, string]; /** Defines the legend for the map. mapLegend with type string is show as innerHTML. */ mapLegend?: string | React.ReactNode; /** Starting center point of the map */ center?: [number, number]; /** Starting zoom level of the map */ zoomLevel?: number; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_5 { buttonContent?: string | JSX.Element; buttonColor?: Color; nodeID: string | HTMLElement; filename?: string; buttonSmall?: boolean; className?: string; } declare interface Props_50 { /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** URL for mapStyle JSON */ mapStyle: string; /** Starting center point of the map */ center?: [number, number]; /** Starting zoom level of the map */ zoomLevel?: number; /** List of the layers that the user select and switch between sing a drop down */ layerSelection: { layerID: string[]; name: string; }[]; /** Defines the legend for the map. mapLegend is of type { mapStyleName: string; legend: string | React.ReactNode }[] where mapStyleName corresponds to the each name in the layerSelection. */ mapLegend?: MapLegendDataType[]; /** List of layer IDs to be excluded from the visualization */ excludeLayers?: string[]; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Theme for the UI elements */ uiMode?: 'light' | 'normal'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_51 { /** Title of the graph */ graphTitle?: string | default_2.ReactNode; /** Description of the graph */ graphDescription?: string | default_2.ReactNode; /** Footnote for the graph */ footNote?: string | default_2.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** URL for mapStyle JSON. If the type is string, otherwise it creates and dropdown and provide end user to select the map style they would like to */ mapStyle: string | { style: string; name: string; }[]; /** Defines the legend for the map. If the mapStyle is string, mapLegend can be string or ReactNode. mapLegend with type string is show as innerHTML. If the mapStyle is not string, mapLegend is of type { mapStyleName: string; legend: string | React.ReactNode }[] where mapStyleName corresponds to the each name in the mapStyle. */ mapLegend?: string | default_2.ReactNode | MapLegendDataType[]; /** Starting center point of the map */ center?: [number, number]; /** Starting zoom level of the map */ zoomLevel?: number; /** List of layer IDs to be included in the visualization. If this is present only these layers are included. */ includeLayers?: string[]; /** List of layer IDs to be excluded from the visualization */ excludeLayers?: string[]; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Theme for the UI elements */ uiMode?: 'light' | 'normal'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_52 { /** Array of data objects for dot density map*/ data: HybridMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for the circle */ colors?: string[]; /** Domain of colors for the graph for the choropleth map */ colorDomain?: number[] | string[]; /** Title for the legend for the dot density scale */ dotLegendTitle?: string; /** Title for the color legend for the color scale */ mapColorLegendTitle?: string; /** Color for the areas where data is no available */ mapNoDataColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Maximum radius of the circle */ radius?: number; /** Map data as an object in geoJson format or a url for geoJson */ mapData?: FeatureCollection | string; /** Detail if any other map needs to be overlayed over the main map */ mapOverlay?: MapOverlayDataType; /** Defines if the coordinates in the map data should be rewinded or not. Try to change this is the visualization shows countries as holes instead of shapes. */ rewindCoordinatesInMapData?: boolean; /** Scaling factor for the map. Multiplies the scale number to scale. */ scale?: number; /** Center point of the map */ centerPoint?: [number, number]; /** Controls the rotation of the map projection, in degrees, applied before rendering. Useful for shifting the antimeridian to focus the map on different regions */ projectionRotate?: [number, number] | [number, number, number]; /** Defines the zoom mode for the map */ zoomInteraction?: ZoomInteractionTypes; /** Stroke width of the regions in the map */ mapBorderWidth?: number; /** Stroke color of the regions in the map */ mapBorderColor?: string; /** Toggle if the UN border are shown. */ showUNBorder?: boolean; /** Toggle if the coastal border is shown. Only applicable if default world map is used */ showCostalBorder?: boolean; /** Color of the dots in the dot density map */ dotColor?: string; /** Border color of the dots in the dot density map */ dotBorderColor?: string; /** Color of the labels */ labelColor?: string; /** Toggle if the map is a world map */ isWorldMap?: boolean; /** Toggle if the disputed areas are interactive. The way it works is it check for a property name `iso3cd` in map shape data if it starts with 'x' then the area is considered disputed. */ isDisputedAreasInteractive?: boolean; /** Scale for the colors of the choropleth map */ choroplethScaleType?: Exclude; /** Map projection type */ mapProjection?: MapProjectionTypes; /** Extend of the allowed zoom in the map */ zoomScaleExtend?: [number, number]; /** Extend of the allowed panning in the map */ zoomTranslateExtend?: [[number, number], [number, number]]; /** Toggle visibility of labels */ showLabels?: boolean; /** Maximum value mapped to the radius chart */ maxRadiusValue?: number; /** Countries or regions to be highlighted */ highlightedIds?: string[]; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle if color scale is collapsed by default. */ collapseColorScaleByDefault?: boolean; /** Show Aksai Chin as striped */ showAksaiChinAsStriped?: boolean; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Property in the property object in mapData geoJson object is used to match to the id in the data object */ mapProperty?: string; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ numberDisplayOptions?: Omit; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_53 { /** Array of data objects */ data: ChoroplethMapDataType[]; /** Title of the graph */ graphTitle?: string | default_2.ReactNode; /** Description of the graph */ graphDescription?: string | default_2.ReactNode; /** Footnote for the graph */ footNote?: string | default_2.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors for the choropleth map. Make sure the the colors are in hex code, any other format can cause issues. */ colors?: string[]; /** Domain of colors for the graph */ colorDomain?: number[] | string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color for the areas where data is no available */ mapNoDataColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Map data as an object in geoJson format or a url for geoJson */ mapData?: any; /** Stroke color of the regions in the map */ mapBorderColor?: string; /** Center point of the map */ centerPoint?: [number, number]; /** Defines if the globe rotates automatically */ autoRotate?: number | boolean; /** Defines the material property applied to the sphere of the globe */ globeMaterial?: THREE.Material; /** Defines the lights for the 3D scene */ lights?: LightConfig[]; /** Defines the colo of the glow around the globe */ atmosphereColor?: string; /** Defines if the globe can be zoomed when scrolled */ enableZoom?: boolean; /** Position offset of the globe relative to the canvas center */ globeOffset?: [number, number]; /** Defines the camera distance from Earth. This helps in defining the default size of the globe. Smaller = closer camera therefore the globe is bigger) */ scale?: number; /** Defines the spacing between the country shape polygon with the sphere */ polygonAltitude?: number; /** Scale for the colors */ scaleType?: Exclude; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ numberDisplayOptions?: Omit; /** Toggle if color scale is collapsed by default. */ collapseColorScaleByDefault?: boolean; /** The max altitude of the atmosphere, in terms of globe radius units. */ atmosphereAltitude?: number; /** Resolution in angular degrees of the sphere curvature. The finer the resolution, the more the globe is fragmented into smaller faces to approximate the spheric surface, at the cost of performance. */ globeCurvatureResolution?: number; /** Defines fog settings for the scene. */ fogSettings?: FogDataType; /** Property in the property object in mapData geoJson object is used to match to the id in the data object */ mapProperty?: string; /** Countries or regions to be highlighted */ selectedId?: string; /** Countries or regions to be highlighted */ highlightedIds?: string[]; /** Defines the altitude of the highlighted countries or the countries on mouseover. */ highlightedAltitude?: number; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => default_2.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => default_2.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_54 { /** Array of data objects */ data: ParetoChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color of the bars */ barColor?: string; /** Color of the line */ lineColor?: string; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of values */ showValues?: boolean; /** Curve type for the line */ curveType?: CurveTypes; /** Enables same axis for bars and line */ sameAxes?: boolean; /** Toggle visibility of color scale. */ showColorScale?: boolean; /** Toggle visibility of labels of the axis. */ showAxisLabels?: boolean; /** Title for the bar axis */ barAxisTitle?: string; /** Title for the line axis */ lineAxisTitle?: string; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for lines controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ lineNumberDisplayOptions?: NumberFormatOptions; /** Configuration options for bars controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ barNumberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_55 { /** Array of data objects */ data: RadarChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for each line */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Radius of the radar chart */ radius?: number; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of dots on the line */ showDots?: boolean; /** Stroke width of the line */ strokeWidth?: number; /** Toggle is the shape is filled or not */ fillShape?: boolean; /** No. of ticks on the x-axis */ noOfTicks?: number; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedLines?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Labels for the axes */ axisLabels: (string | number)[]; /** Curve type for the line */ curveType?: 'linear' | 'curve'; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Configuration options for controlling number formatting, localization, precision, and zero padding. */ numberDisplayOptions?: Omit; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_56 { /** Array of data objects */ data: SankeyDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for source */ sourceColors?: string[] | string; /** Color or array of colors for targets */ targetColors?: string[] | string; /** Domain of colors for the source */ sourceColorDomain?: (string | number)[]; /** Domain of colors for the target */ targetColorDomain?: (string | number)[]; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Toggles the background to fill the container. This only works if the width of the graph is defined. */ fillContainer?: boolean; /** Padding between nodes */ nodePadding?: number; /** Thickness of each node */ nodeWidth?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Title of the source */ sourceTitle?: string; /** Title of the targets */ targetTitle?: string; /** Minimum height of the nodes for which labels and values are visible */ minLabelHeight?: number; /** Toggle visibility of labels or defines what is shown in the label */ showLabels?: boolean | ((_d: any) => React.ReactNode); /** Option to position the labels */ labelPosition?: 'inside' | 'outside' | 'overlap'; /** Defines the width of the labels if the `labelPosition` is set to `inside`*/ labelWidth?: number; /** Toggle visibility of values */ showValues?: boolean; /** Source to highlight. Use the label value from data to highlight the data point */ highlightedSourceDataPoints?: (string | number)[]; /** Targets to highlight. Use the label value from data to highlight the data point */ highlightedTargetDataPoints?: (string | number)[]; /** Links to highlight. Use the label value from data to highlight the data point */ highlightedLinks?: { source: string | number; target: string | number; }[]; /** Opacity of the links */ defaultLinkOpacity?: number; /** Color of the links. If the value is 'source' then the links will be colored based on the source color, if the value is 'target' then the links will be colored based on the target color, if the value is 'source-target' then the links will be colored based on the source and target color. A color can also be defined as hex code. */ linkColor?: string | 'source' | 'target' | 'source-target'; /** Opacity of the nodes when other nodes are highlighted or hovered. If no value is provided then it take the value of `defaultLinkOpacity` */ dimmedNodeOpacity?: number; /** Sorting order of the nodes */ sortNodes?: 'asc' | 'desc' | 'mostReadable' | 'none'; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content when user mouseover on the links. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_57 { /** Array of data objects */ data: ScatterPlotDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circle */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Color for circle if the label doesn't exist in `colorDomain`. */ fallbackColor?: string; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the x-axis */ maxXValue?: number; /** Minimum value for the x-axis */ minXValue?: number; /** Maximum value for the y-axis */ maxYValue?: number; /** Minimum value for the y-axis */ minYValue?: number; /** Maximum value mapped to the radius chart */ maxRadiusValue?: number; /** Reference values for comparison on x-axis */ refXValues?: ReferenceDataType[]; /** Reference values for comparison on y-axis */ refYValues?: ReferenceDataType[]; /** Number of ticks on the x-axis */ noOfXTicks?: number; /** Number of ticks on the y-axis */ noOfYTicks?: number; /** Maximum radius of the circle */ radius?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines if the data point labels should be shown for highlighted data points. */ showHighlightedDataPointsLabels?: boolean; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Title for the x-axis */ xAxisTitle?: string; /** Title for the y-axis */ yAxisTitle?: string; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsForScatterPlotDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsForScatterPlotDataType[]; /** Toggles the visibility of the regression line for the data. If the type is string then string is use to define the color of the line. */ regressionLine?: boolean | string; /** Color of the labels */ labelColor?: string; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ xNumberDisplayOptions?: NumberFormatOptions; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ yNumberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Toggle interaction of Voronoi cells */ useVoronoiInteraction?: boolean; /** Toggle visibility of Voronoi tesselation. Should be used for debugging only */ showVoronoiTesselation?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_58 { /** Array of data objects */ data: SlopeChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circles */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Toggles the background to fill the container. This only works if the width of the graph is defined. */ fillContainer?: boolean; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Radius of the circles */ radius?: number; /** Title for the two axis */ axisTitles?: [string, string]; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_59 { /** Array of data objects */ data: AreaChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** array of colors for different lines and areas */ colors?: string[]; /** Domain of colors for the graph */ colorDomain: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** No. of ticks on the x-axis */ noOfXTicks?: number; /** No. of ticks on the y-axis */ noOfYTicks?: number; /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format) */ dateFormat?: string; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Title for the Y-axis */ yAxisTitle?: string; /** Annotations on the chart */ annotations?: AnnotationSettingsDataType[]; /** Highlighted area(square) on the chart */ highlightAreaSettings?: HighlightAreaSettingsDataType[]; /** Highlighted area(custom shape) on the chart */ customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[]; /** Curve type for the line */ curveType?: CurveTypes; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_6 { noOfColumns?: number; columnGridBy: string; graphSettings?: GraphSettingsDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; graphType: Exclude; dataTransform?: { keyColumn: string; aggregationColumnsSetting?: AggregationSettingsDataType[]; }; showCommonColorScale?: boolean; dataFilters?: DataFilterDataType[]; graphDataConfiguration?: GraphConfigurationDataType[]; dataSelectionOptions?: DataSelectionDataType[]; advancedDataSelectionOptions?: AdvancedDataSelectionDataType[]; minGraphHeight?: number; minGraphWidth?: number; debugMode?: boolean; readableHeader?: { value: string; label: string; }[]; uiMode?: 'light' | 'normal'; theme?: 'dark' | 'light'; } declare interface Props_60 { /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Background color of the graph */ backgroundColor?: string | boolean; /** Defines the layout for the cards */ layout?: 'primary' | 'secondary'; /** Font size of the main text */ headingFontSize?: string; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Toggle the fill color of the main text. */ textBackground?: boolean; /** Toggle is the text is center aligned. */ centerAlign?: boolean; /** Vertical alignment of the main text */ verticalAlign?: 'center' | 'top' | 'bottom'; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Main text */ value: number | string; /** Sub text next to main text */ year?: number | string; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_61 { /** Array of data objects */ data: StatCardsFromDataSheetDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Background color of the graph */ backgroundColor?: string | boolean; /** Defines the layout for the cards */ layout?: 'primary' | 'secondary'; /** Font size of the main text */ headingFontSize?: string; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Toggle the fill color of the main text. */ textBackground?: boolean; /** Toggle is the text is center aligned. */ centerAlign?: boolean; /** Vertical alignment of the main text */ verticalAlign?: 'center' | 'top' | 'bottom'; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Sub text next to main text */ year?: number | string; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Data points that need to counted for aggregation. */ countOnly?: (string | number)[]; /** Method for aggregating the data to show as a single number in the card. If the data type of value in data object is string then only count is applicable. */ aggregationMethod?: 'count' | 'max' | 'min' | 'average' | 'sum'; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_62 { /** Array of data objects */ data: StripChartDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circles */ colors?: string | string[]; /** Color of the highlighted data points */ highlightColor?: string; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Custom order for groups. Only applicable of group is present in the data props */ groupOrder?: (string | number)[]; /** Maximum thickness of group. Only applicable of group is present in the data props */ maxGroupThickness?: number; /** Minimum thickness of group. Only applicable of group is present in the data props */ minGroupThickness?: number; /** Padding between groups. Only applicable of group is present in the data props*/ groupPadding?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Number of ticks on the axis */ noOfTicks?: number; /** Radius of the dots or width of the strips */ radius?: number; /** Opacity of each dot or strip */ dotOpacity?: number; /** Type of strip */ stripType?: 'strip' | 'dot'; /** Toggle visibility of groups or defines what is shown in the group label */ showGroups?: boolean | ((_d: any) => React.ReactNode); /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Value by which the label are truncated. Only applicable if showGroups is true */ truncateBy?: number; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines if all the data points with same labels are highlighted on hover */ highlightSameLabelOnHover?: boolean; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Toggles if the graph show the min and max value of the data. */ showDataMinMax?: boolean; /** Defines distribution markers shown as a line for data points. */ distributionMarkers?: DistributionMarkerDataType[]; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_63 { /** Array of data objects */ data: TreeMapDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for circle */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Maximum radius of the circle */ /** Toggle visibility of labels or defines what is shown in the label */ showLabels?: boolean | ((_d: any) => React.ReactNode); /** Minimum width of the label */ minLabelWidth?: number; /** Minimum height of the label */ minLabelHeight?: number; /** Toggle visibility of values */ showValues?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_64 { /** Array of data objects */ data: UnitChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Note with h2 tag just above the graph. Can be used to highlight text */ note?: string; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Colors of the highlighted circles */ colors?: string[]; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Size of the visualization */ size?: number; /** No. of grid icons in a single row */ gridSize?: number; /** Defines the `d` attribute values for the SVG paths used as grid icons. Each path should be designed for a 24px × 24px viewBox. The order of paths determines the rendering order. If no paths are provided, a circle icon is used as the default. */ gridIcon?: { width?: number; height?: number; d: string[]; }; /** Spacing between 2 grid icons */ unitPadding?: number; /** Total no. of grid icon that are rendered in the chart */ totalNoOfDots?: number; /** Toggle visibility of stroke for the unfilled grid icons. */ showStrokeForWhiteDots?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Toggle visibility of color scale */ showColorScale?: boolean; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_65 { /** Array of data objects */ data: WaterfallChartDataType[]; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Color or array of colors for bars */ colors?: string | string[]; /** Domain of colors for the graph */ colorDomain?: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Minimum thickness of bars */ minBarThickness?: number; /** Maximum number of bars shown in the graph */ maxNumberOfBars?: number; /** Maximum value for the chart */ maxValue?: number; /** Minimum value for the chart */ minValue?: number; /** Truncate labels by specified length */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels */ showLabels?: boolean; /** Toggle visibility of values */ showValues?: boolean; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Toggle visibility of NA color in the color scale. This is only applicable if the data props hae color parameter and showColorScale prop is true */ showNAColor?: boolean; /** Data points to highlight. Use the label value from data to highlight the data point */ highlightedDataPoints?: (string | number)[]; /** Defines the opacity of the non-highlighted data */ dimmedOpacity?: number; /** Title for the bar axis */ barAxisTitle?: string; /** Toggles if data point which are undefined or has value null are filtered out. */ filterNA?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } declare interface Props_66 { text: string | default_2.ReactNode; style?: default_2.CSSProperties; className?: string; } declare interface Props_67 { text: string | default_2.ReactNode; style?: default_2.CSSProperties; className?: string; } declare interface Props_68 { text: string | default_2.ReactNode; isDashboard?: boolean; style?: default_2.CSSProperties; className?: string; } declare interface Props_69 { noOfPoints: number; pointRadius?: number; outerRadius?: number; innerRadius?: number; padding?: number; noOfTicks?: number; random?: () => number; verticalRange?: [number, number]; horizontalRange?: [number, number]; angleRange?: [number, number]; } declare interface Props_7 { config: string | ConfigObject; } declare interface Props_8 { dashboardID?: string; dashboardLayout: DashboardLayoutDataType; dataSettings: DataSettingsDataType; filters?: FilterUiSettingsDataType[]; noOfFiltersPerRow?: number; dataFilters?: DataFilterDataType[]; debugMode?: boolean; theme?: 'dark' | 'light'; filterPosition?: 'top' | 'side'; readableHeader?: { value: string; label: string; }[]; uiMode?: 'light' | 'normal'; graphStyles?: StyleObject; graphClassNames?: ClassNameObject; } declare interface Props_9 { config: string | ConfigObject_2; } export declare function RadarChart(props: Props_55): JSX.Element; declare interface RadarChartDataType { values: number[]; label?: string | number; color?: string; data?: object; } declare interface ReferenceDataType { value: number | null; text: string; color?: string; styles?: { line?: React.CSSProperties; text?: React.CSSProperties; }; classNames?: { line?: string; text?: string; }; } /** * Removes statistical outliers from a numeric dataset based on standard deviation. * * @param data - The array of numbers to filter. * @param outlierThreshold - Optional multiplier for standard deviation (default: 2). * Values further than `threshold * stdDev` from the mean are considered outliers. * * @returns A filtered array with outliers removed. * * @example * removeOutliers([1, 2, 3, 100]); // [1, 2, 3] * removeOutliers([10, 12, 11, 13, 300], 1.5); // May remove 300 */ export declare function removeOutliers(data: number[], outlierThreshold?: number): number[]; export declare function SankeyChart(props: Props_56): JSX.Element; declare interface SankeyDataType { source: string | number; target: string | number; value: number; data?: object; } declare type ScaleDataType = 'categorical' | 'linear' | 'threshold'; export declare function ScatterPlot(props: Props_57): JSX.Element; declare interface ScatterPlotDataType { x?: number | null; y?: number | null; date?: string | number; radius?: number | null; color?: string | null; label: string | number; data?: object; } /** ScrollStory is a scrollytelling container component that reveals content step-by-step as the user scrolls through the page. This does not include GeoHub maps and 3-D graph; for those please use `PerformanceIntensiveScrollStory`. */ export declare function ScrollStory(props: Props_19): JSX.Element; declare interface SectionsDataType { graphSettings?: GraphSettingsDataType; graphDataConfiguration?: GraphConfigurationDataType[]; infoBox: InfoBoxDataType; } declare interface ShadowConfig { mapSize: { width: number; height: number; }; camera: { near: number; far: number; }; } export declare function SimpleBarGraph(props: Props_28): JSX.Element; export declare function SimpleLineChart(props: Props_41): JSX.Element; export declare function SingleGraphDashboard(props: Props_20): JSX.Element; export declare function SingleGraphDashboardFromConfig(props: Props_21): JSX.Element; export declare function SingleGraphDashboardGeoHubMaps(props: Props_15): JSX.Element; export declare function SingleGraphDashboardGeoHubMapsFromConfig(props: Props_16): JSX.Element; export declare function SingleGraphDashboardThreeDGraphs(props: Props_17): JSX.Element; export declare function SingleGraphDashboardThreeDGraphsFromConfig(props: Props_18): JSX.Element; export declare function SlopeChart(props: Props_58): JSX.Element; declare interface SlopeChartDataType { y1: number; y2: number; color?: string | number; label: string | number; data?: object; } export declare function Source(props: SourceProps): JSX.Element; declare interface SourceProps { sources: SourcesDataType[]; style?: React.CSSProperties; className?: string; } declare interface SourcesDataType { source: string; link?: string; } export declare function SparkLine(props: Props_45): JSX.Element; declare interface SpotLightConfig extends BaseLightConfig { type: 'spot'; target?: Position; distance?: number; angle?: number; penumbra?: number; decay?: number; castShadow?: boolean; shadow?: ShadowConfig; position?: Position | 'camera'; } declare interface StackedBarChartProps { /** Array of data objects */ data: GroupedBarGraphDataType[]; /** Orientation of the graph */ orientation?: 'vertical' | 'horizontal'; /** Title of the graph */ graphTitle?: string | React.ReactNode; /** Description of the graph */ graphDescription?: string | React.ReactNode; /** Footnote for the graph */ footNote?: string | React.ReactNode; /** Source data for the graph */ sources?: SourcesDataType[]; /** Accessibility label */ ariaLabel?: string; /** Array of colors for different bars in the group */ colors?: string[]; /** Domain of colors for the graph */ colorDomain: string[]; /** Title for the color legend */ colorLegendTitle?: string; /** Color of value labels */ valueColor?: string; /** Background color of the graph */ backgroundColor?: string | boolean; /** Custom styles for the graph. Each object should be a valid React CSS style object. */ styles?: StyleObject; /** Custom class names */ classNames?: ClassNameObject; /** Width of the graph */ width?: number; /** Height of the graph */ height?: number; /** Minimum height of the graph */ minHeight?: number; /** Relative height scaling factor. This overwrites the height props */ relativeHeight?: number; /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */ padding?: string; /** Left margin of the graph */ leftMargin?: number; /** Right margin of the graph */ rightMargin?: number; /** Top margin of the graph */ topMargin?: number; /** Bottom margin of the graph */ bottomMargin?: number; /** Padding between bars */ barPadding?: number; /** Maximum thickness of bars */ maxBarThickness?: number; /** Minimum thickness of bars */ minBarThickness?: number; /** Maximum number of bars shown in the graph */ maxNumberOfBars?: number; /** Maximum value for the chart */ maxValue?: number; /** Value by which the label are truncated. Only applicable if showLabels is true */ truncateBy?: number; /** Reference values for comparison */ refValues?: ReferenceDataType[]; /** Number of ticks on the axis */ noOfTicks?: number; /** Toggle visibility of labels or defines what is shown in the label */ showLabels?: boolean | ((_d: any) => React.ReactNode); /** Toggle visibility of values */ showValues?: boolean; /** Minimum size of the value to be visible. Default value depends on the orientation of the graph */ minLabelSize?: number; /** Corner radius of the bars */ cornerRadius?: number; /** Toggle visibility of the total value. If not defined it takes the value or `showValues` */ showTotalValue?: boolean; /** Custom order for labels */ labelOrder?: (string | number)[]; /** Toggle visibility of axis ticks */ showTicks?: boolean; /** Toggle visibility of axis line for the main axis */ hideAxisLine?: boolean; /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */ showColorScale?: boolean; /** Title for the bar axis */ barAxisTitle?: string; /** Defines how “NA” values should be displayed/labelled in the graph */ naLabel?: string; /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */ numberDisplayOptions?: NumberFormatOptions; /** Parameter to sort the data. If a number is provided, it refers to the index of the size array to determine which value to sort by. If set to total, it sorts by the sum of all the values. */ sortParameter?: number | 'total'; /** Sorting order for data. This is overwritten by labelOrder prop. */ sortData?: 'asc' | 'desc'; /** Toggles if data points which have all the values as undefined or null are filtered out. */ filterNA?: boolean; /** Toggles if the graph animates in when loaded. */ animate?: boolean | AnimateDataType; /** Optional SVG element or function that renders custom content behind or in front of the graph. */ customLayers?: CustomLayerDataType[]; /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */ timeline?: TimelineDataType; /** Enable graph download option as png */ graphDownload?: boolean; /** Enable data download option as a csv */ dataDownload?: boolean; /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */ resetSelectionOnDoubleClick?: boolean; /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ tooltip?: string | ((_d: any) => React.ReactNode); /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */ detailsOnClick?: string | ((_d: any) => React.ReactNode); /** Callback for mouse over event */ onSeriesMouseOver?: (_d: any) => void; /** Callback for mouse click event */ onSeriesMouseClick?: (_d: any) => void; /** Language setting */ language?: Languages; /** Color theme */ theme?: 'light' | 'dark'; /** Unique ID for the graph */ graphID?: string; } export declare function StackedBarGraph(props: StackedBarChartProps): JSX.Element; export declare function StatCardFromData(props: Props_61): JSX.Element; declare type StatCardsFromDataSheetDataType = { value: number | string; data?: object; }; export declare function StripChart(props: Props_62): JSX.Element; declare interface StripChartDataType { label: string | number; group?: string | number; position: number; color?: string; data?: object; } declare interface StyleObject { title?: React.CSSProperties; footnote?: React.CSSProperties; source?: React.CSSProperties; description?: React.CSSProperties; graphContainer?: React.CSSProperties; tooltip?: React.CSSProperties; xAxis?: AxesStyleObject; yAxis?: AxesStyleObject; graphObjectValues?: React.CSSProperties; dataConnectors?: React.CSSProperties; mouseOverLine?: React.CSSProperties; regLine?: React.CSSProperties; dataCards?: React.CSSProperties; modal?: React.CSSProperties; area?: React.CSSProperties; } /** * Downloads an SVG representation of a specified HTML element. * * Converts the HTML element into an SVG format using the `dom-to-svg` library, serializes it to a string, * and creates a downloadable `.svg` file. * * @param node - The HTMLElement to convert to SVG and download. * @param filename - The desired filename for the downloaded SVG file (without extension). * * @example * const element = document.getElementById('myElement'); * svgDownload(element, 'downloaded-svg'); */ export declare function svgDownload(node: HTMLElement, filename: string): void; export declare function SVGDownloadButton(props: Props_5): JSX.Element; /** For using these maps you will have to install [`three`](https://threejs.org/manual/) and [react-globe.gl](https://www.npmjs.com/package/react-globe.gl) package to your project */ export declare function ThreeDGlobe(props: Props_53): default_2.JSX.Element; declare type ThreeDGraphType = 'threeDGlobe'; export declare function ThresholdColorLegendWithMouseOver(props: Props_27): JSX.Element; declare interface TimelineDataType { autoplay: boolean; enabled: boolean; showOnlyActiveDate: boolean; speed?: number; dateFormat?: string; color?: Exclude; } /** * Transforms specified columns of the CSV data into arrays, splitting the string values based on a delimiter. * This function is useful for handling columns that contain multiple values separated by a delimiter, * and it converts them into arrays for further processing. * * @param csvData - The input CSV data, typically an array of objects where each object represents a row. * @param columnConfig - An optional array of column configuration objects specifying the columns to be transformed, * along with the delimiter used to split the values (defaults to ',' if not provided). * Each object should contain: * - `column`: The name of the column to transform. * - `delimiter`: The delimiter used to split the column values (optional, defaults to ','). * * @returns A new array of objects, where the specified columns are transformed into arrays of values, split by the delimiter. * * @example * const data = [ * { category: 'A', tags: 'apple, orange, banana' }, * { category: 'B', tags: 'grape, pear' } * ]; * const columnConfig = [ * { column: 'tags', delimiter: ', ' } * ]; * const transformedData = transformColumnsToArray(data, columnConfig); * console.log(transformedData); * // Output: * // [ * // { category: 'A', tags: ['apple', 'orange', 'banana'] }, * // { category: 'B', tags: ['grape', 'pear'] } * // ] */ export declare function transformColumnsToArray(csvData: any, columnConfig?: ColumnConfigurationDataType[]): any; /** * Transforms the data for aggregation based on a key column and specified aggregation settings. * It groups the data by unique values in the key column and applies the aggregation methods to each group. * * @param data - The input data to be aggregated. Can be an array of objects, where each object represents a data row. * @param keyColumn - The name of the column to group the data by (key column). * @param aggregationSettings - Optional settings for the aggregation, specifying the column and aggregation method (e.g., 'average', 'max', 'min', 'sum'). * Each setting can define a column and a corresponding aggregation method to apply to that column. * * @returns An array of objects where each object contains the aggregated values for each unique value in the key column. * Each object includes the key column value, count of occurrences, and the aggregated values for each specified column. * * @example * const data = [ * { category: 'A', value: 10, amount: 5 }, * { category: 'A', value: 20, amount: 10 }, * { category: 'B', value: 15, amount: 7 }, * ]; * const aggregationSettings = [ * { column: 'value', aggregationMethod: 'average' }, * { column: 'amount', aggregationMethod: 'sum' }, * ]; * const transformedData = transformDataForAggregation(data, 'category', aggregationSettings); * console.log(transformedData); * // Output: * // [ * // { category: 'A', count: 2, value: 15, amount: 15 }, * // { category: 'B', count: 1, value: 15, amount: 7 }, * // ] */ export declare function transformDataForAggregation(data: any, keyColumn: string, aggregationSettings?: AggregationSettingsDataType[]): any[]; /** * Transforms the input data into a format suitable for graph visualization based on the given graph type and configuration. * * The function formats the data according to the specified graph configuration and checks the validity of the configuration. * It also handles cases for graphs like "dataTable" and "dataCards" without additional processing, and it processes * more complex graphs (e.g., charts) with a specific configuration. * * @param data - The data to be transformed, typically an array of objects representing rows of data. * @param graph - The type of graph to transform the data for (e.g., lineChart, barChart, etc.). * @param config - An optional array of configuration objects that define how the data should be mapped to the graph. * Each object in the array should define column mappings and how data should be grouped or aggregated. * * @returns The transformed data in the format required by the graph. If no valid configuration is provided, or if * data is invalid, an error message is returned. * - If the graph type is "dataTable" or "dataCards", the original data is returned unchanged. * - If data is invalid, an error message will be returned. * * @throws {string} If the configuration is invalid or the data can't be processed, an error message is logged and * returned. * * @example * const graphData = [ * { category: 'A', value: 10 }, * { category: 'B', value: 15 }, * ]; * const graph = 'barChart'; * const config = [ * { columnId: 'category', chartConfigId: 'label' }, * { columnId: 'value', chartConfigId: 'size' }, * ]; * const transformedData = transformDataForGraph(graphData, graph, config); * console.log(transformedData); */ export declare function transformDataForGraph(data: any, graph: GraphType | ThreeDGraphType, config?: GraphConfigurationDataType[]): any; /** * Fetches data from a given URL or multiple data sources, processes it according to the specified graph configuration, * and formats it for use in a graph. * * This function supports different file types (CSV, JSON, and API), and can handle multiple data sources. It applies * any necessary data transformations and column formatting, then prepares the data for visualization in the specified graph. * * @param dataURL - The URL or array of data sources to fetch data from. If it's a string, it represents the URL to fetch data from. * If it's an array, it represents multiple data sources with different types (CSV, JSON, API). * @param dataConfiguration - The graph configuration data used to determine how the data should be formatted for the graph. * @param graph - The type of graph to be used (e.g., lineChart, barChart). * @param fileType - The type of the file being fetched. Can be 'csv', 'json', or 'api'. This parameter is ignored if `dataURL` is an array. * @param delimiter - The delimiter used in CSV files (default is ',' if not provided). * @param columnsToArray - Configuration for columns that need to be transformed into arrays (optional). * @param apiHeaders - Headers for the API request (optional). * @param dataTransformation - A Handlebars template used for transforming the data (optional). * @param idColumnTitle - The title of the ID column when merging multiple data sources (optional). * * @returns A Promise that resolves to the transformed data ready for the graph, or null if an error occurs. * * @throws {Error} Throws an error if the data fetching or processing fails. * * @example * const dataURL = 'https://example.com/data.json'; * const dataConfiguration = [ * { column: 'value', chartConfigId: 'size' }, * { column: 'category', chartConfigId: 'label' }, * ]; * const graph = 'barChart'; * transformDataForGraphFromFile(dataURL, dataConfiguration, graph, 'json') * .then(data => { * console.log('Formatted Data:', data); * }) * .catch(error => { * console.error('Error:', error); * }); */ export declare function transformDataForGraphFromFile(dataURL: string | FileSettingsDataType[], dataConfiguration: GraphConfigurationDataType[], graph: GraphType, fileType?: 'csv' | 'json' | 'api', delimiter?: string, columnsToArray?: ColumnConfigurationDataType[], apiHeaders?: any, dataTransformation?: string, idColumnTitle?: string): Promise; declare interface TreeMapDataType { label: string | number; size?: number | null; color?: string; data?: object; } export declare function TreeMapGraph(props: Props_63): JSX.Element; export declare function UnitChart(props: Props_64): JSX.Element | null; declare interface UnitChartDataType { label: number | string; value: number; data?: object; } export declare function WaterfallChart(props: Props_65): JSX.Element; declare interface WaterfallChartDataType { label: string | number; size?: number | null; color?: string | null; data?: object; } declare interface WsColInterface { wch: number; } declare interface WsColInterface_2 { wch: number; } declare type ZoomInteractionTypes = 'scroll' | 'ctrlScroll' | 'button' | 'noZoom'; export { }