Adding a formatter to `options` causes the donut chart to not update

[tormodAase]

If I have an options object inside a component, with a label formatter, the chart will not update.

In my project this started happening after bumping apexcharts to 4.6.0, but in codepen it seems like it doesn't matter which version of apexcharts you use.

const options = {
    tooltip: {
      enabled: false
    },
    colors: ["red", "grey"],
    plotOptions: {
      pie: {
        donut: {
          size: "46%",
          labels: {
            show: true,
            total: {
              show: true,
              label: "",
              //adding this will enable the bug
              formatter: () => {
                return "Any formatter will enable the bug";
              }
            }
          }
        }
      }
    },
    legend: {
      show: false
    }
  };

apexcharts version: 4.7.0
react-apexcharts version: 1.7.0

https://codepen.io/tormodaase/pen/raaJbYB

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[akreienbring]

Same here (I think)!

    tooltip: {
      fillSeriesColor: false,
      shared: true,
      intersect: false,
      /*
      y: {
        formatter: (value) => {
          if (typeof value !== 'undefined') {
            return fWh(value);
          }
          return value;
        },
      },
      */
    },

With the formatter the pie / donut chart stops rerendering. The only solution for me is to force a rerender by adding a key property

  <ApexChart
    // TODO: key forces a rerender. Currently not working with react-apexcharts v1.7.0
    // key={series}
    type="pie"
    series={values}
    options={options}
    width="100%"
    height={280}
  />

I'm using react v19.1.0