1.5.0 - Update Node to 24.11.0 (LTS)

• update Node to 24.11.0 (LTS)

1.4.0 - Improve charts to use on interactive dashboard

• feat: improve charts to use on the interactive dashboards
• feat: apply resize to all charts through ref to improve user experience when resizing the screen width
• chore: set all charts legends with the same gap
• chore: update general dependencies

Charts improved:

• Area Chart and Vertical Bar Chart: now allows to stack multiple series

1.3.0 - Migrate styled-components to @emotion

• migrate styled-components to @emotion/react;
• update dependencies.

1.2.9 - Apply eslint rule-of-hooks

• apply eslint react-hooks/rules-of-hooks

1.2.8 - Fix Save as Image file name for Donut Chart

• adjust save image file name for Donut Chart

1.2.7 - Implement new eslint rules for design-system

• apply design-system eslint rules, except for .spec files

1.2.6 - Adjust Gauge Chart icons container size

• adjust Gauge Chart icons container to align the content

1.2.5 - Improve Charts

• improve charts to be able to apply tree-shaking on echarts imports
• charts improved: AreaChart, AudiometryChart, CoordinateLineChart, DivergingStackedBarChart, DonutChart, ForecastAreaChart, GaugeChart, HorizontalBarChart, MultipurposeChart, PictorialChart, PieChart, PyramidBarChart, PyramidChart, RadarChart, StackedBarChart and VerticalBarChart

1.2.4 - Improve Line Chart

• improve LineChart to be able to apply tree-shaking on echarts imports

1.2.3 - Implement Gauge Chart

• implement Gauge Chart;

How to use:

<GaugeChart
/* the chart data */
    data={[
        {
            value: 0.7,
            name: 'Eficiência'
        }
    ]}
 /* the chart limits and colors. The total value of the limits must be '1' */
    colorLine={[
        [0.25, red[200]],
        [0.5, orange[400]],
        [0.75, amber[200]],
        [1, green[100]]
    ]}
 /* the chart labels. If not passed, defaults as empty. */
    axisLabel={[
        { limit: 0.875, label: 'Ótimo' },
        { limit: 0.625, label: 'Médio' },
        { limit: 0.375, label: 'Ruim' },
        { limit: 0.125, label: 'Péssimo' }
    ]}
 /* the chart legend below. If not passed, defaults as empty. */
    legendData={[
        { icon: <IconLocalHospital />, legend: 42 },
        { icon: <IconPerson />, legend: 71 },
        { icon: <IconRestore />, legend: 77 },
        { icon: <IconWaterDrop />, legend: 76 },
        { icon: <IconVisibility />, legend: 79 }
    ]}
 /* the chart legend value to condition the red/green circle color. If not passed, defaults to 75. */
    legendValue={70}
 /* the chart axis width. If not passed, defaults to 75. */
    axisLineWidth={75}
 /* the chart title font-size. If not passed, defaults to 30. */
    titleFontSize={30}
 /* the chart detail font-size. If not passed, defaults to 24. */
    detailFontSize={24}
 /* the chart height. If not passed, defaults to 400. */
    height={400}
 /* the chart tooltip. If not passed, defaults to empty. */
    tooltip={{
        label: 'Otimização',
        labelComplement: 0.95
    }}
 /* the chart toolbox. If not passed, defaults to empty. */
    toolboxTooltip={{ saveAsImage: { title: 'Salvar como Imagem' } }}
/>