@oliasoft-open-source/charts-library 5.15.0-beta-1 → 5.15.0-beta-2

package/dist/index.js

@@ -19877,7 +19877,7 @@ var isGreaterThanMin = (value, min) => {
 * @param {boolean} [hasMultiAxes] - optional, false by default
 * @return {string} - e.g. x if chart has singular axes; x, x2 - in case of multiple axes
 */
-var generateAxisId = (axisType, index = 0, hasMultiAxes = false) => {
+var generateAxisId$1 = (axisType, index = 0, hasMultiAxes = false) => {
 	return `${axisType}${hasMultiAxes && index !== 0 ? index + 1 : ""}`;
 };
 /**
@@ -19987,7 +19987,7 @@ var useChartFunctions = ({ chartRef, state, options, dispatch }) => {
 			if (!axes[axisType] || !axes[axisType]?.length) return [];
 			else return axes[axisType].map((axisObj, index) => {
 				return {
-					id: generateAxisId(axisType, index, axes[axisType].length > 1),
+					id: generateAxisId$1(axisType, index, axes[axisType].length > 1),
 					label: axisObj?.label || ""
 				};
 			});
@@ -20801,48 +20801,33 @@ var formatAxisLabelNumbers = (tickValue, ticks) => {
 	});
 };
 //#endregion
-//#region src/components/line-chart/utils/get-line-chart-scales.ts
-var getLineChartAxis = (options, axisType, state, currentScales, i = 0) => {
-	const axisData = currentScales || options.axes[axisType][0] || {};
-	const stateAxis = state?.axes.filter((axis) => axis?.id?.startsWith(axisType))[i];
-	const axisKey = generateAxisId(axisType, i, true);
-	const scaleConfigFromProps = options?.scales?.[axisKey];
+//#region src/components/common/helpers/get-cartesian-scale-options.ts
+var isNumericScale = (scaleType) => {
+	return scaleType === ScaleType.Linear || scaleType === ScaleType.Logarithmic;
+};
+var getGridLines = (gridLines) => {
+	return gridLines && typeof gridLines === "object" ? gridLines : {};
+};
+var getCartesianScaleOptions = ({ axisData, scaleType, scaleConfigFromProps, display, beginAtZero, reverse, suggestedMax, suggestedMin, min, max, additionalStepSize, useStepSize = true, stacked, numericTickCallback }) => {
 	const ticksConfigFromProps = scaleConfigFromProps?.ticks;
 	const titleConfigFromProps = scaleConfigFromProps?.title;
-	const { additionalAxesOptions } = options;
-	const scaleType = scaleConfigFromProps?.type ?? additionalAxesOptions.chartScaleType;
-	const getTicks = () => {
-		const isLogarithmic = scaleType === ScaleType.Logarithmic;
-		const isNumericScale = scaleType === ScaleType.Linear || scaleType === ScaleType.Logarithmic;
-		const ticksFormattingCallback = (tick, _, ticks) => {
-			const tickValue = Number(tick);
-			return isLogarithmic ? LOGARITHMIC_STEPS.includes(tickValue) ? formatAxisLabelNumbers(tickValue, ticks) : "" : formatAxisLabelNumbers(tickValue, ticks);
-		};
-		return {
-			...isNumericScale && !isLogarithmic ? { stepSize: axisData.stepSize ?? (axisType === AxisType.Y ? additionalAxesOptions.stepSize : null) } : {},
-			...isNumericScale ? { callback: ticksFormattingCallback } : {},
-			includeBounds: false,
-			...ticksConfigFromProps,
-			font: {
-				size: 12,
-				...ticksConfigFromProps?.font
-			}
-		};
-	};
+	const titleText = axisData?.label || (typeof axisData?.unit === "string" ? axisData.unit : void 0);
+	const stepSize = useStepSize && isNumericScale(scaleType) && scaleType !== ScaleType.Logarithmic ? { stepSize: axisData?.stepSize ?? additionalStepSize } : {};
 	return {
-		display: true,
+		...display !== void 0 ? { display } : {},
 		type: scaleType,
-		position: axisData.position,
-		beginAtZero: additionalAxesOptions.beginAtZero,
-		reverse: axisType === AxisType.Y ? additionalAxesOptions.reverse : false,
-		suggestedMax: additionalAxesOptions.suggestedMax,
-		suggestedMin: additionalAxesOptions.suggestedMin,
-		min: stateAxis?.min ?? additionalAxesOptions?.range?.[axisType]?.min,
-		max: stateAxis?.max ?? additionalAxesOptions?.range?.[axisType]?.max,
+		position: axisData?.position,
+		beginAtZero,
+		reverse,
+		suggestedMax,
+		suggestedMin,
+		min,
+		max,
+		...stacked !== void 0 ? { stacked } : {},
 		...scaleConfigFromProps,
 		title: {
-			display: Boolean(axisData.label?.length),
-			text: axisData.label,
+			display: Boolean(titleText?.length),
+			text: titleText,
 			padding: 0,
 			...titleConfigFromProps,
 			font: {
@@ -20850,20 +20835,57 @@ var getLineChartAxis = (options, axisType, state, currentScales, i = 0) => {
 				...titleConfigFromProps?.font
 			}
 		},
-		ticks: getTicks(),
+		ticks: {
+			...stepSize,
+			...isNumericScale(scaleType) && numericTickCallback ? { callback: numericTickCallback } : {},
+			includeBounds: false,
+			...ticksConfigFromProps,
+			font: {
+				size: 12,
+				...ticksConfigFromProps?.font
+			}
+		},
 		grid: {
-			...axisData.gridLines,
+			...getGridLines(axisData?.gridLines),
 			...scaleConfigFromProps?.grid
 		}
 	};
 };
+//#endregion
+//#region src/components/line-chart/utils/get-line-chart-scales.ts
+var getLineChartAxis = (options, axisType, state, currentScales, i = 0) => {
+	const axisData = currentScales || options.axes[axisType][0] || {};
+	const stateAxis = state?.axes.filter((axis) => axis?.id?.startsWith(axisType))[i];
+	const axisKey = generateAxisId$1(axisType, i, true);
+	const scaleConfigFromProps = options?.scales?.[axisKey];
+	const { additionalAxesOptions } = options;
+	const scaleType = scaleConfigFromProps?.type ?? additionalAxesOptions.chartScaleType;
+	const ticksFormattingCallback = (tick, _, ticks) => {
+		const tickValue = Number(tick);
+		return scaleType === ScaleType.Logarithmic ? LOGARITHMIC_STEPS.includes(tickValue) ? formatAxisLabelNumbers(tickValue, ticks) : "" : formatAxisLabelNumbers(tickValue, ticks);
+	};
+	return getCartesianScaleOptions({
+		axisData,
+		scaleType,
+		scaleConfigFromProps,
+		display: true,
+		beginAtZero: additionalAxesOptions.beginAtZero,
+		reverse: axisType === AxisType.Y ? additionalAxesOptions.reverse : false,
+		suggestedMax: additionalAxesOptions.suggestedMax,
+		suggestedMin: additionalAxesOptions.suggestedMin,
+		min: stateAxis?.min ?? additionalAxesOptions?.range?.[axisType]?.min,
+		max: stateAxis?.max ?? additionalAxesOptions?.range?.[axisType]?.max,
+		additionalStepSize: axisType === AxisType.Y ? additionalAxesOptions.stepSize : null,
+		numericTickCallback: ticksFormattingCallback
+	});
+};
 var getLineChartAxes = (options, axisType, state) => {
 	return options.axes[axisType].reduce((acc, curr, i) => {
 		const axisData = curr;
 		axisData.color = curr.color || COLORS[i] || generateRandomColor(COLORS);
 		axisData.position = curr.position || getAxisPosition(axisType, i);
 		const axis = getLineChartAxis(options, axisType, state, axisData, i);
-		const axisId = generateAxisId(axisType, i, true);
+		const axisId = generateAxisId$1(axisType, i, true);
 		return {
 			...acc,
 			[axisId]: axis
@@ -38851,67 +38873,42 @@ var getStackedOptions = (axisType, { stacked, stackedX, stackedY }) => {
 	else if (axisType === AxisType.Y) return stackedY ?? stacked;
 	return stacked;
 };
-var getBarChartAxis = ({ chart, axisType = AxisType.X, currentScale, i }) => {
+var generateAxisId = (axisType, index = 0) => {
+	return index === 0 ? axisType : `${axisType}${index + 1}`;
+};
+var getBarChartAxis = ({ chart, axisType = AxisType.X, currentScale, i = 0 }) => {
 	const { data, options } = chart ?? {};
 	const isDirectionVertical = isVertical(options.direction);
 	const axisData = currentScale || options?.axes?.[axisType]?.[0];
 	const isDirectionCompatibleWithAxisType = isDirectionVertical && axisType === AxisType.Y || !isDirectionVertical && axisType === AxisType.X;
-	const grid = axisData?.gridLines || {};
-	const getScaleType = () => {
+	const axisKey = generateAxisId(axisType, i);
+	const scaleConfigFromProps = options?.scales?.[axisKey];
+	const getDefaultScaleType = () => {
 		const scaleType = data.labels ? ScaleType.Category : ScaleType.Linear;
 		return axisType === (isDirectionVertical ? AxisType.X : AxisType.Y) ? scaleType : options?.additionalAxesOptions?.chartScaleType;
 	};
+	const scaleType = scaleConfigFromProps?.type ?? getDefaultScaleType();
 	const getReverse = () => {
 		return axisType === (isDirectionVertical ? AxisType.Y : AxisType.X) ? options?.additionalAxesOptions?.reverse : false;
 	};
-	const axisKey = `${i === 0 ? axisType : axisType + i}`;
-	const titleConfigFromProps = options?.scales?.[axisKey]?.title;
-	const getTicks = () => {
-		const additionalAxesOptions = options?.additionalAxesOptions;
-		const ticksConfigFromProps = options?.scales?.[axisKey]?.ticks;
-		const isLogarithmic = isDirectionCompatibleWithAxisType && additionalAxesOptions?.chartScaleType === ScaleType.Logarithmic;
-		const ticksFormattingCallback = (tick, _, ticks) => {
-			return isLogarithmic ? LOGARITHMIC_STEPS.includes(Number(tick)) ? formatAxisLabelNumbers(tick, ticks) : "" : formatAxisLabelNumbers(tick, ticks);
-		};
-		return {
-			...!isLogarithmic ? { stepSize: axisData.stepSize ?? (axisType === AxisType.Y ? additionalAxesOptions?.stepSize : null) } : {},
-			...additionalAxesOptions?.chartScaleType === ScaleType.Logarithmic ? { callback: ticksFormattingCallback } : {},
-			includeBounds: false,
-			...ticksConfigFromProps,
-			font: {
-				size: 12,
-				...ticksConfigFromProps?.font
-			}
-		};
+	const ticksFormattingCallback = (tick, _, ticks) => {
+		return isDirectionCompatibleWithAxisType && scaleType === ScaleType.Logarithmic ? LOGARITHMIC_STEPS.includes(Number(tick)) ? formatAxisLabelNumbers(tick, ticks) : "" : formatAxisLabelNumbers(tick, ticks);
 	};
-	return {
-		type: getScaleType(),
-		position: axisData?.position,
+	return getCartesianScaleOptions({
+		axisData,
+		scaleType,
+		scaleConfigFromProps,
 		beginAtZero: options?.additionalAxesOptions?.beginAtZero,
 		reverse: getReverse(),
 		suggestedMax: options?.additionalAxesOptions?.suggestedMax,
 		suggestedMin: options?.additionalAxesOptions?.suggestedMin,
 		min: isDirectionCompatibleWithAxisType ? options?.additionalAxesOptions?.min : void 0,
 		max: isDirectionCompatibleWithAxisType ? options?.additionalAxesOptions?.max : void 0,
-		title: {
-			display: axisData?.label?.length || axisData?.unit?.length,
-			text: axisData?.label || axisData?.unit,
-			padding: 0,
-			...titleConfigFromProps,
-			font: {
-				size: 12,
-				...titleConfigFromProps?.font
-			}
-		},
-		ticks: getTicks(),
-		grid: { ...grid },
-		stacked: getStackedOptions(axisType, options?.additionalAxesOptions)
-	};
+		additionalStepSize: axisType === AxisType.Y ? options?.additionalAxesOptions?.stepSize : null,
+		stacked: getStackedOptions(axisType, options?.additionalAxesOptions),
+		numericTickCallback: ticksFormattingCallback
+	});
 };
-/**
-* @param {IBarChartData} chart - chart data
-* @param {'x'|'y'} axisType
-*/
 var getBarChartAxes = (chart, axisType) => {
 	return (chart?.options?.axes?.[axisType] || []).reduce((acc, curr, i) => {
 		const axisData = curr;
@@ -38920,9 +38917,10 @@ var getBarChartAxes = (chart, axisType) => {
 		const axis = getBarChartAxis({
 			chart,
 			axisType,
-			currentScale: axisData
+			currentScale: axisData,
+			i
 		});
-		const axisId = i === 0 ? axisType : `${axisType}${i + 1}`;
+		const axisId = generateAxisId(axisType, i);
 		return {
 			...acc,
 			[axisId]: axis
@@ -39186,6 +39184,7 @@ var normalizeBarOptions = (options = {}) => ({
 	chartStyling: defaultChartStyling$1(options?.chartStyling),
 	tooltip: defaultTooltip$1(options?.tooltip),
 	graph: defaultGraph$1(options?.graph),
+	scales: options?.scales ?? {},
 	annotations: defaultAnnotations$1(options?.annotations),
 	legend: defaultLegend$1(options?.legend),
 	chartOptions: defaultChartOptions$1(options?.chartOptions),
@@ -39214,7 +39213,7 @@ var getDefaultProps$1 = (props) => {
 };
 //#endregion
 //#region src/components/bar-chart/bar-chart.tsx
-Chart$1.register(LinearScale, PointElement, LineElement, CategoryScale, LogarithmicScale, BarElement, plugin_legend, plugin_tooltip, plugin_title, index, plugin$1, plugin, annotation, import_chartjs_plugin_dragdata_min.default);
+Chart$1.register(LinearScale, PointElement, LineElement, CategoryScale, LogarithmicScale, TimeScale, TimeSeriesScale, BarElement, plugin_legend, plugin_tooltip, plugin_title, index, plugin$1, plugin, annotation, import_chartjs_plugin_dragdata_min.default);
 var BarChart = (props) => {
 	setDefaultTheme();
 	const chartRef = useRef(null);
@@ -39325,46 +39324,23 @@ var getScatterChartAxis = ({ options, axisType = AxisType.X, currentScale }) =>
 	const isDirectionVertical = isVertical(options.direction);
 	const axisData = currentScale || options?.axes?.[axisType]?.[0];
 	const isDirectionCompatibleWithAxisType = isDirectionVertical && axisType === AxisType.Y || !isDirectionVertical && axisType === AxisType.X;
-	const grid = axisData?.gridLines || {};
-	const ticksConfigFromProps = options?.scales?.[axisType]?.ticks;
-	const titleConfigFromProps = options?.scales?.[axisType]?.title;
+	const scaleConfigFromProps = options?.scales?.[axisType];
+	const scaleType = scaleConfigFromProps?.type ?? options?.additionalAxesOptions?.chartScaleType ?? ScaleType.Linear;
 	const getReverse = () => {
 		return axisType === (isDirectionVertical ? AxisType.Y : AxisType.X) ? options?.additionalAxesOptions?.reverse : false;
 	};
-	const getTicks = () => {
-		const additionalAxesOptions = options?.additionalAxesOptions;
-		return {
-			stepSize: axisData?.stepSize ?? (axisType === AxisType.Y ? additionalAxesOptions?.stepSize : void 0),
-			includeBounds: false,
-			...ticksConfigFromProps,
-			font: {
-				size: 12,
-				...ticksConfigFromProps?.font
-			}
-		};
-	};
-	return {
-		type: ScaleType.Linear,
-		position: axisData?.position,
+	return getCartesianScaleOptions({
+		axisData,
+		scaleType,
+		scaleConfigFromProps,
 		beginAtZero: options?.additionalAxesOptions?.beginAtZero,
 		reverse: getReverse(),
 		suggestedMax: options?.additionalAxesOptions?.suggestedMax,
 		suggestedMin: options?.additionalAxesOptions?.suggestedMin,
 		min: isDirectionCompatibleWithAxisType ? options?.additionalAxesOptions?.min : void 0,
 		max: isDirectionCompatibleWithAxisType ? options?.additionalAxesOptions?.max : void 0,
-		title: {
-			display: !!axisData?.label?.length || !!axisData?.unit?.length,
-			text: axisData?.label || axisData?.unit,
-			padding: 0,
-			...titleConfigFromProps,
-			font: {
-				size: 12,
-				...titleConfigFromProps?.font
-			}
-		},
-		ticks: getTicks(),
-		grid: { ...grid }
-	};
+		additionalStepSize: axisType === AxisType.Y ? options?.additionalAxesOptions?.stepSize : null
+	});
 };
 var getScatterChartScales = (options) => {
 	return {
@@ -39528,6 +39504,7 @@ var defaultAxes = (axes) => ({
 	y: axes?.y ?? [{}]
 });
 var defaultAdditionalAxesOptions = (options) => ({
+	chartScaleType: options?.chartScaleType || "linear",
 	reverse: options?.reverse ?? false,
 	stacked: options?.stacked ?? false,
 	beginAtZero: options?.beginAtZero ?? true,
@@ -39545,6 +39522,7 @@ var normalizeScatterOptions = (options = {}) => ({
 	chartStyling: defaultChartStyling(options?.chartStyling),
 	tooltip: defaultTooltip(options?.tooltip),
 	graph: defaultGraph(options?.graph),
+	scales: options?.scales ?? {},
 	legend: defaultLegend(options?.legend),
 	annotations: defaultAnnotations(options?.annotations),
 	chartOptions: defaultChartOptions(options?.chartOptions),
@@ -39651,7 +39629,7 @@ var scatter_chart_module_default = {
 };
 //#endregion
 //#region src/components/scatter-chart/scatter-chart.tsx
-Chart$1.register(LinearScale, PointElement, CategoryScale, plugin_legend, plugin_tooltip, plugin_title, plugin$1, plugin, annotation, gradientBackgroundPlugin);
+Chart$1.register(LinearScale, PointElement, CategoryScale, TimeScale, TimeSeriesScale, plugin_legend, plugin_tooltip, plugin_title, plugin$1, plugin, annotation, gradientBackgroundPlugin);
 var ScatterChart = (props) => {
 	setDefaultTheme();
 	const chartRef = useRef(null);

package/dist/src/components/bar-chart/utils/get-bar-chart-scales.d.ts

@@ -1,3 +1,4 @@
 import { IBarDefaultProps } from '../bar-chart.interface';
-declare const getBarChartScales: (chart: IBarDefaultProps) => any;
+import { ICommonScaleOptions } from '../../common/common.interface';
+declare const getBarChartScales: (chart: IBarDefaultProps) => Record<string, ICommonScaleOptions>;
 export default getBarChartScales;

package/dist/src/components/bar-chart/utils/use-bar-chart-options.d.ts

@@ -17,7 +17,7 @@ export declare const useBarChartOptions: ({ chart, chartRef, }: IUseBarChartOpti
         mode: ChartHoverMode;
         intersect: boolean;
     };
-    scales: any;
+    scales: Record<string, import('../../common/common.interface').ICommonScaleOptions>;
     plugins: {
         title: {
             display: boolean;

package/dist/src/components/common/common.interface.d.ts

@@ -150,15 +150,15 @@ export interface ICommonTooltip {
     callbacks?: ICommonTooltipCallbacks;
 }
 export interface ICommonAdditionalAxesOptions {
-    chartScaleType?: 'linear' | 'logarithmic';
+    chartScaleType?: 'linear' | 'logarithmic' | 'time' | 'timeseries';
     reverse?: boolean;
     beginAtZero?: boolean;
     stepSize?: number;
     stacked?: boolean;
     suggestedMin?: number;
     suggestedMax?: number;
-    min?: number;
-    max?: number;
+    min?: number | string;
+    max?: number | string;
 }
 export interface ICommonAnnotation {
     showLabel?: boolean;

package/dist/src/components/common/helpers/get-cartesian-scale-options.d.ts

@@ -0,0 +1,27 @@
+import { Tick } from 'chart.js';
+import { ICommonScaleOptions, UnusedParameter } from '../common.interface';
+type TScaleType = NonNullable<ICommonScaleOptions['type']>;
+interface IGetCartesianScaleOptionsParams {
+    axisData?: {
+        gridLines?: unknown;
+        label?: string;
+        position?: unknown;
+        stepSize?: number;
+        unit?: unknown;
+    };
+    scaleType?: TScaleType;
+    scaleConfigFromProps?: ICommonScaleOptions;
+    display?: boolean;
+    beginAtZero?: boolean;
+    reverse?: boolean;
+    suggestedMax?: number | string;
+    suggestedMin?: number | string;
+    min?: number | string;
+    max?: number | string;
+    additionalStepSize?: number | null;
+    useStepSize?: boolean;
+    stacked?: boolean;
+    numericTickCallback?: (tick: string | number, unused: UnusedParameter, ticks: Tick[]) => unknown;
+}
+export declare const getCartesianScaleOptions: ({ axisData, scaleType, scaleConfigFromProps, display, beginAtZero, reverse, suggestedMax, suggestedMin, min, max, additionalStepSize, useStepSize, stacked, numericTickCallback, }: IGetCartesianScaleOptionsParams) => ICommonScaleOptions;
+export {};