From 4cebc5ffcad734e51ba984d9348adae6a6a03786 Mon Sep 17 00:00:00 2001
From: Owen Wattenmaker <owen.wattenmaker@colorado.edu>
Date: Wed, 5 Jun 2024 09:24:31 -1000
Subject: [PATCH] Replace instances of 'getTextWidth' with 'measureText' (#290)

Co-authored-by: Eli Zibin <1131641+zibs@users.noreply.github.com>
---
 .changeset/serious-yaks-visit.md               | 6 ++++++
 example/app/stock-price.tsx                    | 2 +-
 lib/src/cartesian/components/CartesianAxis.tsx | 4 ++--
 lib/src/cartesian/utils/transformInputData.ts  | 2 +-
 4 files changed, 10 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/serious-yaks-visit.md

diff --git a/.changeset/serious-yaks-visit.md b/.changeset/serious-yaks-visit.md
new file mode 100644
index 00000000..870ae25c
--- /dev/null
+++ b/.changeset/serious-yaks-visit.md
@@ -0,0 +1,6 @@
+---
+"example": patch
+"victory-native": patch
+---
+
+Replace getTextWidth with measureText
diff --git a/example/app/stock-price.tsx b/example/app/stock-price.tsx
index 3805f377..d89fd49a 100644
--- a/example/app/stock-price.tsx
+++ b/example/app/stock-price.tsx
@@ -380,7 +380,7 @@ const ActiveValueIndicator = ({
     () => "$" + activeValue.value.toFixed(2),
   );
   const activeValueWidth = useDerivedValue(
-    () => font?.getTextWidth(activeValueDisplay.value) || 0,
+    () => font?.measureText(activeValueDisplay.value).width || 0,
   );
   const activeValueX = useDerivedValue(
     () => xPosition.value - activeValueWidth.value / 2,
diff --git a/lib/src/cartesian/components/CartesianAxis.tsx b/lib/src/cartesian/components/CartesianAxis.tsx
index 24578837..aef08d3f 100644
--- a/lib/src/cartesian/components/CartesianAxis.tsx
+++ b/lib/src/cartesian/components/CartesianAxis.tsx
@@ -125,7 +125,7 @@ export const CartesianAxis = <
     : yScale.ticks(yTicks);
   const yAxisNodes = yTicksNormalized.map((tick) => {
     const contentY = formatYLabel(tick as never);
-    const labelWidth = font?.getTextWidth?.(contentY) ?? 0;
+    const labelWidth = font?.measureText?.(contentY).width ?? 0;
     const labelY = yScale(tick) + fontSize / 3;
     const labelX = (() => {
       // left, outset
@@ -178,7 +178,7 @@ export const CartesianAxis = <
   const xAxisNodes = xTicksNormalized.map((tick) => {
     const val = isNumericalData ? tick : ix[tick];
     const contentX = formatXLabel(val as never);
-    const labelWidth = font?.getTextWidth?.(contentX) ?? 0;
+    const labelWidth = font?.measureText?.(contentX).width ?? 0;
     const labelX = xScale(tick) - (labelWidth ?? 0) / 2;
     const canFitLabelContent =
       yAxisPosition === "left" ? labelX + labelWidth < x2r : x1r < labelX;
diff --git a/lib/src/cartesian/utils/transformInputData.ts b/lib/src/cartesian/utils/transformInputData.ts
index b56dbc0f..8b5f145a 100644
--- a/lib/src/cartesian/utils/transformInputData.ts
+++ b/lib/src/cartesian/utils/transformInputData.ts
@@ -183,7 +183,7 @@ export const transformInputData = <
   // Else, we find min / max of y values across all yKeys, and use that for y range instead.
   const ixMin = asNumber(domain?.x?.[0] ?? tickDomainsX?.[0] ?? ixNum.at(0)),
     ixMax = asNumber(domain?.x?.[1] ?? tickDomainsX?.[1] ?? ixNum.at(-1));
-  const topYLabelWidth = axisOptions?.font?.getTextWidth(topYLabel) ?? 0;
+  const topYLabelWidth = axisOptions?.font?.measureText(topYLabel).width ?? 0;
   // Determine our x-output range based on yAxis/label options
   const oRange: [number, number] = (() => {
     const yTickCount =