From 72d024b837fd10604714b455778ee5580dce2545 Mon Sep 17 00:00:00 2001 From: Mohamed Marrouchi Date: Thu, 6 Nov 2025 11:36:50 +0100 Subject: [PATCH] feat: add axis scale extra props --- .../ez-react/src/recipes/area/AreaChart.tsx | 23 +++++++++++++++++-- .../src/recipes/area/MultiAreaChart.tsx | 23 +++++++++++++++++-- .../ez-react/src/recipes/bar/BarChart.tsx | 12 +++++++++- .../src/recipes/column/ColumnChart.tsx | 12 +++++++++- .../src/recipes/column/LineColumnChart.tsx | 9 ++++++++ .../ez-react/src/recipes/line/LineChart.tsx | 23 +++++++++++++++++-- .../src/recipes/line/LineErrorMarginChart.tsx | 21 +++++++++++++++-- .../src/recipes/line/MultiLineChart.tsx | 23 +++++++++++++++++-- .../src/recipes/scatter/BubbleChart.tsx | 23 +++++++++++++++++-- .../src/recipes/scatter/ScatterChart.tsx | 23 +++++++++++++++++-- 10 files changed, 176 insertions(+), 16 deletions(-) diff --git a/packages/ez-react/src/recipes/area/AreaChart.tsx b/packages/ez-react/src/recipes/area/AreaChart.tsx index ceb35fd..373d1e6 100644 --- a/packages/ez-react/src/recipes/area/AreaChart.tsx +++ b/packages/ez-react/src/recipes/area/AreaChart.tsx @@ -12,6 +12,7 @@ import { AreaConfig, MarkerConfig, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -28,8 +29,8 @@ export interface AreaChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; - yAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfig & ScaleLinearDefinition; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; scopedSlots?: { @@ -95,6 +96,15 @@ export const AreaChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -103,6 +113,15 @@ export const AreaChart: FC = ({ direction: Direction.VERTICAL, domainKey: yAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/area/MultiAreaChart.tsx b/packages/ez-react/src/recipes/area/MultiAreaChart.tsx index 2e58bd8..2c1537d 100644 --- a/packages/ez-react/src/recipes/area/MultiAreaChart.tsx +++ b/packages/ez-react/src/recipes/area/MultiAreaChart.tsx @@ -21,6 +21,7 @@ import { AreaConfig, Direction, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import React, { FC, SVGAttributes } from 'react'; @@ -33,8 +34,9 @@ export interface MultiAreaChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; - yAxis?: AxisConfigMulti; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfigMulti & + ScaleLinearDefinition; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; scopedSlots?: { @@ -106,6 +108,15 @@ export const MultiAreaChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -114,6 +125,14 @@ export const MultiAreaChart: FC = ({ direction: Direction.VERTICAL, domain: activeDomain, nice: yAxis.nice || 0, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/bar/BarChart.tsx b/packages/ez-react/src/recipes/bar/BarChart.tsx index 0451c81..1d40802 100644 --- a/packages/ez-react/src/recipes/bar/BarChart.tsx +++ b/packages/ez-react/src/recipes/bar/BarChart.tsx @@ -9,6 +9,7 @@ import { GridConfig, Position, RawData, + ScaleLinearDefinition, ShapeClickEventHandler, } from 'eazychart-core/src/types'; import { Axis } from '@/components/scales/Axis'; @@ -28,7 +29,7 @@ export interface BarChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; yAxis?: AxisConfig; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; @@ -97,6 +98,15 @@ export const BarChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ diff --git a/packages/ez-react/src/recipes/column/ColumnChart.tsx b/packages/ez-react/src/recipes/column/ColumnChart.tsx index d35fbe3..a1fb72f 100644 --- a/packages/ez-react/src/recipes/column/ColumnChart.tsx +++ b/packages/ez-react/src/recipes/column/ColumnChart.tsx @@ -9,6 +9,7 @@ import { GridConfig, Position, RawData, + ScaleLinearDefinition, ShapeClickEventHandler, } from 'eazychart-core/src/types'; import { Axis } from '@/components/scales/Axis'; @@ -29,7 +30,7 @@ export interface ColumnChartProps extends SVGAttributes { grid?: GridConfig; isRTL?: boolean; xAxis?: AxisConfig; - yAxis?: AxisConfig; + yAxis?: AxisConfig & ScaleLinearDefinition; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; scopedSlots?: { @@ -103,6 +104,15 @@ export const ColumnChart: FC = ({ direction: Direction.VERTICAL, domainKey: yAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/column/LineColumnChart.tsx b/packages/ez-react/src/recipes/column/LineColumnChart.tsx index 23c788d..cbf7413 100644 --- a/packages/ez-react/src/recipes/column/LineColumnChart.tsx +++ b/packages/ez-react/src/recipes/column/LineColumnChart.tsx @@ -132,6 +132,15 @@ export const LineColumnChart: FC = ({ direction: Direction.VERTICAL, domainKey: yLineAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/line/LineChart.tsx b/packages/ez-react/src/recipes/line/LineChart.tsx index 539217a..e421252 100644 --- a/packages/ez-react/src/recipes/line/LineChart.tsx +++ b/packages/ez-react/src/recipes/line/LineChart.tsx @@ -12,6 +12,7 @@ import { LineConfig, MarkerConfig, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -28,8 +29,8 @@ export interface LineChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; - yAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfig & ScaleLinearDefinition; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; scopedSlots?: { @@ -95,6 +96,15 @@ export const LineChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -103,6 +113,15 @@ export const LineChart: FC = ({ direction: Direction.VERTICAL, domainKey: yAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/line/LineErrorMarginChart.tsx b/packages/ez-react/src/recipes/line/LineErrorMarginChart.tsx index 60a01b6..149e684 100644 --- a/packages/ez-react/src/recipes/line/LineErrorMarginChart.tsx +++ b/packages/ez-react/src/recipes/line/LineErrorMarginChart.tsx @@ -16,6 +16,7 @@ import { AreaData, AreaCurve, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -36,8 +37,8 @@ export interface LineErrorMarginChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; - yAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfig & ScaleLinearDefinition; dimensions?: Partial; errorMargins?: { positive: string; // in percent [0..1] @@ -124,6 +125,15 @@ export const LineErrorMarginChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -134,6 +144,13 @@ export const LineErrorMarginChart: FC = ({ nice: yAxis.nice || 0, minPadding: lowsestMarginValue, maxPadding: highestMarginValue, + domain: yAxis.domain, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/line/MultiLineChart.tsx b/packages/ez-react/src/recipes/line/MultiLineChart.tsx index dde0b6e..8988fce 100644 --- a/packages/ez-react/src/recipes/line/MultiLineChart.tsx +++ b/packages/ez-react/src/recipes/line/MultiLineChart.tsx @@ -13,6 +13,7 @@ import { MarkerConfig, AxisConfigMulti, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -33,8 +34,9 @@ export interface MultiLineChartProps extends SVGAttributes { padding?: ChartPadding; grid?: GridConfig; isRTL?: boolean; - xAxis?: AxisConfig; - yAxis?: AxisConfigMulti; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfigMulti & + ScaleLinearDefinition; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; scopedSlots?: { @@ -106,6 +108,15 @@ export const MultiLineChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -114,6 +125,14 @@ export const MultiLineChart: FC = ({ direction: Direction.VERTICAL, domain: activeDomain, nice: yAxis.nice || 0, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/scatter/BubbleChart.tsx b/packages/ez-react/src/recipes/scatter/BubbleChart.tsx index 9b4da3e..b20a323 100644 --- a/packages/ez-react/src/recipes/scatter/BubbleChart.tsx +++ b/packages/ez-react/src/recipes/scatter/BubbleChart.tsx @@ -11,6 +11,7 @@ import { Dimensions, BubbleConfig, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -26,8 +27,8 @@ export interface BubbleChartProps extends SVGAttributes { animationOptions?: AnimationOptions; padding?: ChartPadding; grid?: GridConfig; - xAxis?: AxisConfig; - yAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfig & ScaleLinearDefinition; isRTL?: boolean; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; @@ -89,6 +90,15 @@ export const BubbleChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -97,6 +107,15 @@ export const BubbleChart: FC = ({ direction: Direction.VERTICAL, domainKey: yAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} > diff --git a/packages/ez-react/src/recipes/scatter/ScatterChart.tsx b/packages/ez-react/src/recipes/scatter/ScatterChart.tsx index 8245ab9..534bee9 100644 --- a/packages/ez-react/src/recipes/scatter/ScatterChart.tsx +++ b/packages/ez-react/src/recipes/scatter/ScatterChart.tsx @@ -10,6 +10,7 @@ import { Dimensions, PointConfig, ShapeClickEventHandler, + ScaleLinearDefinition, } from 'eazychart-core/src/types'; import { TooltipProps, Tooltip } from '@/components/addons/tooltip/Tooltip'; import { Chart } from '@/components/Chart'; @@ -25,8 +26,8 @@ export interface ScatterChartProps extends SVGAttributes { animationOptions?: AnimationOptions; padding?: ChartPadding; grid?: GridConfig; - xAxis?: AxisConfig; - yAxis?: AxisConfig; + xAxis?: AxisConfig & ScaleLinearDefinition; + yAxis?: AxisConfig & ScaleLinearDefinition; isRTL?: boolean; dimensions?: Partial; onShapeClick?: ShapeClickEventHandler; @@ -86,6 +87,15 @@ export const ScatterChart: FC = ({ domainKey: xAxis.domainKey, nice: xAxis.nice || 0, reverse: isRTL, + domain: xAxis.domain, + maxPadding: xAxis.maxPadding, + minPadding: xAxis.minPadding, + max: xAxis.max, + min: xAxis.min, + softMax: xAxis.softMax, + softMin: xAxis.softMin, + roundRange: xAxis.roundRange, + clamp: xAxis.clamp, }, }} yScaleConfig={{ @@ -94,6 +104,15 @@ export const ScatterChart: FC = ({ direction: Direction.VERTICAL, domainKey: yAxis.domainKey, nice: yAxis.nice || 0, + domain: yAxis.domain, + maxPadding: yAxis.maxPadding, + minPadding: yAxis.minPadding, + max: yAxis.max, + min: yAxis.min, + softMax: yAxis.softMax, + softMin: yAxis.softMin, + roundRange: yAxis.roundRange, + clamp: yAxis.clamp, }, }} >