TypeError: href.indexOf is not a function (it is undefined)

[Shasikhan]

Description

When using images in pie chart, Now app is crashing causing TypeError: href.indexOf is not a function (it is undefined).

It is working fine with below versions:

@shopify/react-native-skia: "1.7.6",
@wuba/react-native-echarts: "1.3.1",
echarts: "5.5.1"

But crashing when using latest version of @shopify/react-native-skia and @wuba/react-native-echarts

React Native Skia Version

1.11.2

React Native Version

0.76.6

Using New Architecture

• Enabled

Steps to Reproduce

When I use some image as background, it crashes, is workimng fine with older version of react native skia

Snack, Code Example, Screenshot, or Link to Repository

{ name: "Drops", type: "pie", radius: [isSmall ? 12 : "45%", isSmall ? 17 : "40%"], avoidLabelOverlap: false, label: { show: true, position: "center", fontSize: 16, fontWeight: "bold", formatter: isSmall ? dataValues.drops > 0 && dataValues.impPostDrops > 0 ? "{d|}" : dataValues.drops > 0 ? "{e|}" : "{f|}" : [ `{a|${trans("Todays")}}`, `{b|${dataValues.drops} + }{c|${dataValues.impPostDrops}}`, `{a|${trans("Drops")}}`, ].join("\n"), rich: { a: { color: "#0F7AC5", fontSize: 20, lineHeight: 32, }, b: { color: "#0F7AC5", fontWeight: "bold", fontSize: 26, lineHeight: 32, }, c: { color: "#57AC31", fontWeight: "bold", fontSize: 26, lineHeight: 32, }, d: { height: 25, width: 25, align: "left", backgroundColor: { image: require("app/assets/images/drop-filled-both.png"), }, }, e: { height: 24, width: 24, align: "left", backgroundColor: { image: require("app/assets/images/drop-filled-blue.png"), }, }, f: { height: 16, width: 18, align: "left", backgroundColor: { image: require("app/assets/images/drop-unfilled-2.png"), }, }, }, }, labelLine: { show: false, }, data: [ { value: (dataValues.drops / dataValues.totalDrops) * 100, name: "Drops", itemStyle: { color: "#0F7AC5", borderRadius: 50, }, }, { value: 100 - (dataValues.drops / dataValues.totalDrops) * 100, name: "", itemStyle: { color: "#fff", opacity: 1, }, }, ], emphasis: { disabled: true, }, },