@graphysdk/react-renderer 2.0.0-beta.1788536263128 → 2.0.0-beta.1788545088004

package/dist/{history-chords-DSpKFVIF.js → history-chords-DPxkZyE9.js}

@@ -1,15 +1,15 @@
 import { a as Vr, c as oa, f as x, i as aa, l as Ur, n as Qr, o as ia, r as sa, s as Yr, t as la, u as Kr } from "./dev.utils-HBVa4Fj9.js";
-import { ANNOTATION_TOOLTIP_MARKER_GAP as ca, AXIS_KEYS as Vt, CachedTextMeasurer as ur, DATA_LABEL_POSITIONS as da, DATA_LABEL_ROLES as ua, DEFAULT_GEOM_COLOR as zr, DEFAULT_HOVER_AFFORDANCE_COLOR as vt, GROUP_VARIABLES as ce, HeuristicTextMeasurer as ha, HoverEngine as va, InternalError as ga, LayoutCompiler as fa, POLAR_RIM_LABEL_GAP_PX as pa, RESTING_HOVER_STATE as st, TAU as hr, alignUnitFractions as jr, areAnchorsEqual as ma, areEditMenuTriggersEqual as Aa, areEndpointsComparable as vr, arePointerRegionListsEqual as ya, buildAverageLineSymbols as xa, buildCalloutHitRegions as ba, buildColumnKey as Ut, buildDataLabelsContent as wa, buildFontString as Sa, buildLayerIntroPlan as ka, buildLayerYValueFormatter as Ra, buildPinnedNumberValueFormatter as Ca, buildPolarBarArcPath as ge, buildSliceGroupKey as Qt, buildTooltipContent as Ea, compositeColor as Pa, computeArrow as Ba, computeDifferenceArrow as Ia, computeDirectLabelsLayout as Ta, computeLineBoxHeight as fe, computePanelBorderPaths as La, computePanelBorderSizes as Na, countLayerGeoms as Ma, createAreaPathGenerators as Xr, createHeadlineItemRows as qr, createLineFillAreaGenerator as Fa, createLinePathGenerator as Jr, createSegmentYReader as Da, createStableCellKeyGenerator as Ha, createStableKeyGenerator as oe, createStyleResolver as gt, findAnnotation as Oa, findPointerRegion as gr, formatHeadline as Ga, formatLegends as Wa, formatRuleValue as Va, getAestheticFromScaleAestheticKey as Ce, getAlpha as Zr, getAngleExtent as Yt, getBarRectBounds as Ke, getBoundingRect as $r, getChromeDashArray as ft, getColor as _r, getDashArray as Ee, getDifferenceArrowLabelBox as Ua, getGroup as pt, getHoverGuideLineProps as Qa, getHoverGuideRectProps as Ya, getInsetTileRect as en, getPolarHoverGuideArcProps as Ka, getRadiusExtent as mt, getRuleDashPattern as za, getShapeAnnotationStroke as ja, getSize as Xa, getStackRole as qa, getUnionExtent as Ja, getX as q, getXMax as Za, getY as te, getYMax as tn, isAnnotationMovable as $a, isDefined as rn, isFullTurnSweep as nn, isSafeUrl as Kt, orderPointerRegions as _a, paintsInDonutHole as ei, pickReadableTextColor as on, placeCallouts as ti, polarToUnit as ri, positionToAngle as ni, prepareAreaObservations as an, prepareLineObservations as sn, projectAnchorToPanel as Qe, projectRegionToPanel as zt, readAnchoredObservation as oi, resolveArrowAnnotationStyle as ai, resolveArrowColor as ii, resolveAxisLabelStyle as si, resolveBarBorderRadiusPx as ln, resolveBarBorderTreatment as ze, resolveBarCornerRadiiPx as li, resolveCalloutAnnotationStyle as ci, resolveDataLabelStyle as di, resolveDeferredAnchors as ui, resolveDifferenceArrowAnnotationStyle as hi, resolveDirectLabelStyle as vi, resolveGraphChromeStyle as cn, resolveGridLineStyle as Lt, resolveHeadlineFigure as dn, resolveHeadlineItemStyle as at, resolveHeadlinePlacement as gi, resolveHeadlineStyle as un, resolveImageAnnotationStyle as fi, resolveLegendItemStyle as pi, resolveLegendStyle as mi, resolvePanelBorderStyle as hn, resolvePolarBarCornerRadiusUnit as vn, resolveRuleLabelStyle as Ai, resolveShapeAnnotationStyle as gn, resolveTextAnnotationStyle as yi, resolveTickLabelStyle as xi, resolveTickLineStyle as bi, resolveTooltipStyle as wi, toFontSpec as z, toPanelCursor as Si, toPercent as k, toViewBoxX as fn, toViewBoxY as pn, truncateToWidth as ki } from "@graphysdk/viz-engine";
-import { Fragment as jt, createContext as U, memo as Z, useCallback as se, useContext as D, useEffect as F, useId as V, useMemo as A, useRef as T, useState as O, useSyncExternalStore as Ri } from "react";
+import { ANNOTATION_TOOLTIP_MARKER_GAP as ca, AXIS_KEYS as Vt, CachedTextMeasurer as ur, DATA_LABEL_POSITIONS as da, DATA_LABEL_ROLES as ua, DEFAULT_GEOM_COLOR as zr, DEFAULT_HOVER_AFFORDANCE_COLOR as vt, GROUP_VARIABLES as ce, HeuristicTextMeasurer as ha, HoverEngine as va, InternalError as ga, LayoutCompiler as fa, POLAR_RIM_LABEL_GAP_PX as pa, RESTING_HOVER_STATE as st, TAU as hr, alignUnitFractions as jr, areAnchorsEqual as ma, areEditMenuTriggersEqual as Aa, areEndpointsComparable as vr, arePointerRegionListsEqual as ya, buildAverageLineSymbols as xa, buildCalloutHitRegions as ba, buildColumnKey as Ut, buildDataLabelsContent as wa, buildFontString as Sa, buildLayerIntroPlan as ka, buildLayerYValueFormatter as Ra, buildPinnedNumberValueFormatter as Ca, buildPolarBarArcPath as ge, buildSliceGroupKey as Qt, buildTooltipContent as Ea, compositeColor as Pa, computeArrow as Ba, computeDifferenceArrow as Ia, computeDirectLabelsLayout as Ta, computeLineBoxHeight as fe, computePanelBorderPaths as La, computePanelBorderSizes as Na, countLayerGeoms as Ma, createAreaPathGenerators as Xr, createHeadlineItemRows as qr, createLineFillAreaGenerator as Fa, createLinePathGenerator as Jr, createSegmentYReader as Da, createStableCellKeyGenerator as Oa, createStableKeyGenerator as oe, createStyleResolver as gt, findAnnotation as Ha, findPointerRegion as gr, formatHeadline as Ga, formatLegends as Wa, formatRuleValue as Va, getAestheticFromScaleAestheticKey as Ce, getAlpha as Zr, getAngleExtent as Yt, getBarRectBounds as Ke, getBoundingRect as $r, getChromeDashArray as ft, getColor as _r, getDashArray as Ee, getDifferenceArrowLabelBox as Ua, getGroup as pt, getHoverGuideLineProps as Qa, getHoverGuideRectProps as Ya, getInsetTileRect as en, getPolarHoverGuideArcProps as Ka, getRadiusExtent as mt, getRuleDashPattern as za, getShapeAnnotationStroke as ja, getSize as Xa, getStackRole as qa, getUnionExtent as Ja, getX as q, getXMax as Za, getY as te, getYMax as tn, isAnnotationMovable as $a, isDefined as rn, isFullTurnSweep as nn, isSafeUrl as Kt, orderPointerRegions as _a, paintsInDonutHole as ei, pickReadableTextColor as on, placeCallouts as ti, polarToUnit as ri, positionToAngle as ni, prepareAreaObservations as an, prepareLineObservations as sn, projectAnchorToPanel as Qe, projectRegionToPanel as zt, readAnchoredObservation as oi, resolveArrowAnnotationStyle as ai, resolveArrowColor as ii, resolveAxisLabelStyle as si, resolveBarBorderRadiusPx as ln, resolveBarBorderTreatment as ze, resolveBarCornerRadiiPx as li, resolveCalloutAnnotationStyle as ci, resolveDataLabelStyle as di, resolveDeferredAnchors as ui, resolveDifferenceArrowAnnotationStyle as hi, resolveDirectLabelStyle as vi, resolveGraphChromeStyle as cn, resolveGridLineStyle as Lt, resolveHeadlineFigure as dn, resolveHeadlineItemStyle as at, resolveHeadlinePlacement as gi, resolveHeadlineStyle as un, resolveImageAnnotationStyle as fi, resolveLegendItemStyle as pi, resolveLegendStyle as mi, resolvePanelBorderStyle as hn, resolvePolarBarCornerRadiusUnit as vn, resolveRuleLabelStyle as Ai, resolveShapeAnnotationStyle as gn, resolveTextAnnotationStyle as yi, resolveTickLabelStyle as xi, resolveTickLineStyle as bi, resolveTooltipStyle as wi, toFontSpec as z, toPanelCursor as Si, toPercent as k, toViewBoxX as fn, toViewBoxY as pn, truncateToWidth as ki } from "@graphysdk/viz-engine";
+import { Fragment as jt, createContext as U, memo as Z, useCallback as se, useContext as D, useEffect as M, useId as V, useMemo as A, useRef as I, useState as H, useSyncExternalStore as Ri } from "react";
 import { Fragment as B, jsx as s, jsxs as w } from "react/jsx-runtime";
 import { useStore as je } from "zustand";
-import { animate as ie, motion as H, useMotionValue as _, useReducedMotion as Ci, useTransform as tt } from "motion/react";
+import { animate as ie, motion as O, useMotionValue as _, useReducedMotion as Ci, useTransform as tt } from "motion/react";
 import { interpolatePath as Ei } from "d3-interpolate-path";
 import { useShallow as j } from "zustand/react/shallow";
 import { parseFontLength as Pi, parseFontWeight as Bi, parseUnitlessLineHeight as Ii } from "@graphysdk/viz-engine/graph-config";
 import { createStore as mn } from "zustand/vanilla";
 import { createPortal as An } from "react-dom";
-import Ye, { clsx as Oe } from "clsx";
+import Ye, { clsx as He } from "clsx";
 import Ti from "lodash-es/merge";
 import { IntlProvider as Li } from "react-intl";
 import { flip as Nt, offset as Mt, shift as Ft, useFloating as yn } from "@floating-ui/react-dom";
@@ -24,7 +24,7 @@ import './history-chords.css';var fr = Object.defineProperty, Mi = (e, t) => {
     });
   return t || fr(r, Symbol.toStringTag, { value: "Module" }), r;
 };
-typeof window < "u" && (window.__GRAPHY_SDK__ ??= {}, window.__GRAPHY_SDK__.reactRenderer = "2.0.0-beta.1788536263128");
+typeof window < "u" && (window.__GRAPHY_SDK__ ??= {}, window.__GRAPHY_SDK__.reactRenderer = "2.0.0-beta.1788545088004");
 var bn = U(null), G = () => {
   const e = D(bn);
   if (!e) throw new Error("useGraph* hooks must be used inside a <GraphProvider>");
@@ -33,7 +33,7 @@ var bn = U(null), G = () => {
   const { store: t } = G();
   return je(t, (r) => e(r.compiled));
 };
-function I(e) {
+function T(e) {
   const { colorScheme: t } = G();
   return A(() => gt({ colorScheme: t }).geomReaders(e), [e, t]);
 }
@@ -83,10 +83,10 @@ var wn = (e) => {
     x: (r.x + 1) / 2,
     y: (r.y + 1) / 2
   };
-}, Di = 2, Hi = 0.7, he = ({ hit: e, project: t = Xt }) => {
+}, Di = 2, Oi = 0.7, he = ({ hit: e, project: t = Xt }) => {
   const r = wn(e.layerId);
   if (!e.anchored) return null;
-  const n = r?.get("color", e.observation) ?? zr, o = (Zr(e.observation) ?? 1) * Hi, a = (r?.get("size", e.observation) ?? 8) / 2, i = r?.get("borderColor", e.observation, "hovered") ?? vt, l = t(e.x, e.y);
+  const n = r?.get("color", e.observation) ?? zr, o = (Zr(e.observation) ?? 1) * Oi, a = (r?.get("size", e.observation) ?? 8) / 2, i = r?.get("borderColor", e.observation, "hovered") ?? vt, l = t(e.x, e.y);
   return /* @__PURE__ */ s("circle", {
     cx: k(l.x),
     cy: k(l.y),
@@ -102,9 +102,9 @@ var wn = (e) => {
   stiffness: 500,
   damping: 60,
   mass: 1
-}, Oi = { duration: 0 }, qt = (e) => e ? ne : Oi, Dt = (e, t) => {
+}, Hi = { duration: 0 }, qt = (e) => e ? ne : Hi, Dt = (e, t) => {
   const r = _(e);
-  return F(() => {
+  return M(() => {
     const n = Ei(r.get(), e);
     ie(0, 1, {
       ...t,
@@ -133,12 +133,12 @@ var wn = (e) => {
   vectorEffect: "non-scaling-stroke"
 })] }), Wi = ({ fillPath: e, linePath: t, fill: r, fillOpacity: n, stroke: o, strokeWidth: a, strokeOpacity: i, strokeDasharray: l }) => {
   const c = Dt(e, ne), u = Dt(t, ne);
-  return /* @__PURE__ */ w("g", { children: [/* @__PURE__ */ s(H.path, {
+  return /* @__PURE__ */ w("g", { children: [/* @__PURE__ */ s(O.path, {
     d: c,
     fill: r,
     fillOpacity: n,
     stroke: "none"
-  }), /* @__PURE__ */ s(H.path, {
+  }), /* @__PURE__ */ s(O.path, {
     d: u,
     fill: "none",
     stroke: o,
@@ -172,7 +172,7 @@ var wn = (e) => {
   const r = V();
   return /* @__PURE__ */ w(B, { children: [/* @__PURE__ */ s("clipPath", {
     id: r,
-    children: /* @__PURE__ */ s(H.rect, {
+    children: /* @__PURE__ */ s(O.rect, {
       ...Ki(e.axis),
       transition: Vi(e)
     })
@@ -193,7 +193,7 @@ var wn = (e) => {
   initial: { height: 0 },
   animate: { height: pr }
 }, zi = Z(function({ layer: t, coordSystem: r, shouldAnimateTransitions: n, intro: o }) {
-  const a = o?.type === "wipe" ? o : null, { lineGenerator: i, areaGenerator: l } = A(() => Xr(r, t.params), [t.params, r]), c = I(t), u = A(() => {
+  const a = o?.type === "wipe" ? o : null, { lineGenerator: i, areaGenerator: l } = A(() => Xr(r, t.params), [t.params, r]), c = T(t), u = A(() => {
     const d = oe(t.data, t.mapping, t.id), v = [];
     return t.data.groupBy(ce.group).forEach((g) => {
       const h = an([...g], t.params.missingValues), f = l(h), m = i(h);
@@ -280,7 +280,7 @@ var wn = (e) => {
   const t = Xa(e);
   return rn(t) ? t / $i : Zi;
 }, es = ({ layer: e, coordSystem: t, primary: r, companions: n }) => {
-  const o = I(e), a = pt(r.observation), i = A(() => an([...e.data.filter(ce.group, "eq", a)], e.params.missingValues), [
+  const o = T(e), a = pt(r.observation), i = A(() => an([...e.data.filter(ce.group, "eq", a)], e.params.missingValues), [
     e.data,
     e.params.missingValues,
     a
@@ -363,15 +363,15 @@ var wn = (e) => {
       y: r
     };
   }
-}, Ht = (e, t, r) => {
-  const n = r === void 0 ? e.activeIntro : r, o = T(n ? Jt(n, t) : null), a = T(e.shouldAnimateTransitions);
+}, Ot = (e, t, r) => {
+  const n = r === void 0 ? e.activeIntro : r, o = I(n ? Jt(n, t) : null), a = I(e.shouldAnimateTransitions);
   return a.current = e.shouldAnimateTransitions, se(() => {
     const i = o.current;
     return o.current = null, i ?? qt(a.current);
   }, []);
 }, At = (e, t) => {
-  const r = T(!0);
-  F(() => {
+  const r = I(!0);
+  M(() => {
     r.current = !1;
   }, []);
   const n = r.current;
@@ -401,7 +401,7 @@ var wn = (e) => {
   width: e.width,
   height: 0
 }, rs = Z(function({ layer: t, coordSystem: r, shouldAnimateTransitions: n, intro: o }) {
-  const a = V(), i = I(t), l = At(o?.type === "grow" && (o.growAxis === "x" || o.growAxis === "y") ? o : null, n);
+  const a = V(), i = T(t), l = At(o?.type === "grow" && (o.growAxis === "x" || o.growAxis === "y") ? o : null, n);
   return /* @__PURE__ */ s(B, { children: A(() => {
     const c = oe(t.data, t.mapping, t.id), u = /* @__PURE__ */ new Map();
     for (const d of t.data) {
@@ -516,13 +516,13 @@ var wn = (e) => {
     ry: o.ry
   }, g = /* @__PURE__ */ s("clipPath", {
     id: r,
-    children: /* @__PURE__ */ s(H.rect, { ...v })
+    children: /* @__PURE__ */ s(O.rect, { ...v })
   });
   if (n.length === 1) {
     const [h] = n;
     return /* @__PURE__ */ w(B, { children: [g, /* @__PURE__ */ s("g", {
       clipPath: `url(#${r})`,
-      children: /* @__PURE__ */ s(H.rect, {
+      children: /* @__PURE__ */ s(O.rect, {
         ...v,
         fill: h?.fill,
         opacity: h?.opacity,
@@ -542,7 +542,7 @@ var wn = (e) => {
         animation: t,
         introKey: f
       }, f);
-    }), u && /* @__PURE__ */ s(H.rect, {
+    }), u && /* @__PURE__ */ s(O.rect, {
       ...v,
       fill: "none",
       stroke: a,
@@ -554,7 +554,7 @@ var wn = (e) => {
   const { isAnimated: l, activeIntro: c, shouldAnimateTransitions: u } = e;
   if (l) {
     const d = c ? En(i, c) : null;
-    return /* @__PURE__ */ s(H.rect, {
+    return /* @__PURE__ */ s(O.rect, {
       initial: d ? {
         x: k(d.x),
         y: k(d.y),
@@ -604,8 +604,8 @@ var wn = (e) => {
   strokeWidth: o,
   opacity: a
 }), as = (e, t, r) => {
-  const n = t.activeIntro ? En(e, t.activeIntro) : e, o = _(n.x), a = _(n.y), i = _(n.width), l = _(n.height), c = Ht(t, r);
-  return F(() => {
+  const n = t.activeIntro ? En(e, t.activeIntro) : e, o = _(n.x), a = _(n.y), i = _(n.width), l = _(n.height), c = Ot(t, r);
+  return M(() => {
     const u = c(), d = [
       ie(o, e.x, u),
       ie(a, e.y, u),
@@ -729,7 +729,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
     ]
   });
 }, cs = ({ layer: e, sourceLayer: t, coordSystem: r, panelRect: n }) => {
-  const o = I(t), a = A(() => Pn(t, r.mainAxis, o), [
+  const o = T(t), a = A(() => Pn(t, r.mainAxis, o), [
     t,
     r.mainAxis,
     o
@@ -746,7 +746,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   }
   return l;
 }, Ct = 3, ds = ({ layer: e, coordSystem: t, primary: r, panelRect: n }) => {
-  const o = I(e), a = V(), i = V(), l = V(), c = A(() => Pn(e, t.mainAxis, o), [
+  const o = T(e), a = V(), i = V(), l = V(), c = A(() => Pn(e, t.mainAxis, o), [
     e,
     t.mainAxis,
     o
@@ -756,7 +756,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
     borderRadius: m,
     mainAxis: t.mainAxis,
     bounds: g
-  }), b = ke(v, 0), R = ke(g, y), S = ke(yr(v, Ct), 0), P = ke(yr(g, Ct), y > 0 ? y + Ct : 0), E = o.get("color", r.observation), N = o.get("alpha", r.observation), M = o.get("borderColor", r.observation, "hovered") ?? vt, W = ze(f);
+  }), b = ke(v, 0), R = ke(g, y), S = ke(yr(v, Ct), 0), P = ke(yr(g, Ct), y > 0 ? y + Ct : 0), E = o.get("color", r.observation), N = o.get("alpha", r.observation), F = o.get("borderColor", r.observation, "hovered") ?? vt, W = ze(f);
   return /* @__PURE__ */ w("g", {
     "data-testid": "hovered-bar",
     children: [
@@ -778,7 +778,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
           clipPath: `url(#${a})`,
           children: /* @__PURE__ */ s("path", {
             d: S,
-            fill: M,
+            fill: F,
             "data-testid": "hovered-bar-border"
           })
         })
@@ -835,7 +835,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   }),
   renderHoverCompanions: () => null
 }, hs = Z(function({ layer: t, shouldAnimateTransitions: r, intro: n }) {
-  const o = n?.type === "wipe" ? n : null, a = A(() => Jr(t.params), [t.params]), i = A(() => Fa(t.params), [t.params]), l = I(t), c = A(() => {
+  const o = n?.type === "wipe" ? n : null, a = A(() => Jr(t.params), [t.params]), i = A(() => Fa(t.params), [t.params]), l = T(t), c = A(() => {
     const u = oe(t.data, t.mapping, t.id), d = [];
     return t.data.groupBy(ce.group).forEach((v) => {
       const g = sn([...v], t.params.missingValues), h = a(g);
@@ -941,7 +941,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   })] });
 }, fs = ({ pathData: e, color: t, strokeWidth: r, opacity: n, strokeDasharray: o }) => {
   const a = Dt(e, ne);
-  return /* @__PURE__ */ s(H.path, {
+  return /* @__PURE__ */ s(O.path, {
     d: a,
     fill: "none",
     stroke: t,
@@ -951,7 +951,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
     vectorEffect: "non-scaling-stroke"
   });
 }, ps = ({ layer: e, primary: t, companions: r }) => {
-  const n = I(e), o = pt(t.observation), a = A(() => sn([...e.data.filter(ce.group, "eq", o)], e.params.missingValues), [
+  const n = T(e), o = pt(t.observation), a = A(() => sn([...e.data.filter(ce.group, "eq", o)], e.params.missingValues), [
     e.data,
     e.params.missingValues,
     o
@@ -1013,7 +1013,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   const a = q(e), i = te(e);
   if (a === null || i === null) return null;
   const l = t(a, i), c = k(l.x), u = k(l.y), d = r.get("size", e) / 2, v = r.get("color", e), g = r.get("alpha", e), h = r.get("borderColor", e), f = r.get("borderWidth", e), { isAnimated: m, activeIntro: p, shouldAnimateTransitions: y } = n;
-  return m ? /* @__PURE__ */ s(H.circle, {
+  return m ? /* @__PURE__ */ s(O.circle, {
     initial: p ? {
       cx: c,
       cy: u,
@@ -1040,7 +1040,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
     strokeWidth: f
   });
 }, As = Z(function({ layer: t, shouldAnimateTransitions: r, intro: n }) {
-  const o = I(t), a = At(n?.type === "grow" && n.growAxis === "size" ? n : null, r);
+  const o = T(t), a = At(n?.type === "grow" && n.growAxis === "size" ? n : null, r);
   return A(() => {
     const i = a.activeIntro ? oe(t.data, t.mapping, t.id) : null, l = [];
     let c = 0;
@@ -1099,7 +1099,7 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   legendPillPaddingBlock: be(2),
   legendPillBorderWidth: be(1),
   headlineRowGap: be(2)
-}, He = {
+}, Oe = {
   panelOverlay: 5,
   textToolbar: 10,
   textToolbarTooltip: 20,
@@ -1119,10 +1119,10 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   radiiMd: "8px",
   radiiLg: "12px"
 }, Mn = {
-  zIndexToolbar: `${He.textToolbar}`,
-  zIndexToolbarTooltip: `${He.textToolbarTooltip}`,
-  zIndexToolbarPopover: `${He.textToolbarPopover}`,
-  zIndexEditorPopover: `${He.editorOverlayPopover}`
+  zIndexToolbar: `${Oe.textToolbar}`,
+  zIndexToolbarTooltip: `${Oe.textToolbarTooltip}`,
+  zIndexToolbarPopover: `${Oe.textToolbarPopover}`,
+  zIndexEditorPopover: `${Oe.editorOverlayPopover}`
 }, ws = 8, we = (e) => `${ws * e}px`, Fn = {
   spaceXxs: we(0.25),
   spaceXs: we(0.5),
@@ -1223,9 +1223,9 @@ var ss = "_1suo8ub0", Pn = (e, t, r) => {
   ...Vr,
   ...Ur,
   ...Yr
-}, Hn = (e, t) => e * 10 * t, On = (e, t) => ({
+}, On = (e, t) => e * 10 * t, Hn = (e, t) => ({
   family: e.family,
-  size: e.size.unit === "em" ? Hn(e.size.value, t) : e.size.value,
+  size: e.size.unit === "em" ? On(e.size.value, t) : e.size.value,
   weight: e.weight,
   style: e.style
 }), Es = (e, t = {}) => {
@@ -1391,14 +1391,14 @@ var Qn = U(Fs), Ds = ({ metrics: e, children: t }) => /* @__PURE__ */ s(Qn.Provi
 }), Ie = () => D(Qn), L = () => {
   const { colorScheme: e } = G(), t = C((r) => r.chrome);
   return A(() => gt({ colorScheme: e }).chromeReaders(t), [t, e]);
-}, Hs = (e) => {
+}, Os = (e) => {
   const t = L(), r = C((n) => n.config.appearance.textScale);
   return A(() => Ai(t, e, r), [
     t,
     e,
     r
   ]);
-}, Os = /\p{Emoji_Presentation}|\p{Emoji}\uFE0F/gu, Yn = "😀", Gs = class Kn {
+}, Hs = /\p{Emoji_Presentation}|\p{Emoji}\uFE0F/gu, Yn = "😀", Gs = class Kn {
   constructor() {
     this.emojiCorrections = /* @__PURE__ */ new Map(), this.currentFont = "";
     const t = new OffscreenCanvas(1, 1).getContext("2d");
@@ -1441,14 +1441,14 @@ var Qn = U(Fs), Ds = ({ metrics: e, children: t }) => /* @__PURE__ */ s(Qn.Provi
     return this.emojiCorrections.set(t, a), a;
   }
 }, ae = null, Ws = (e) => {
-  const t = e.match(Os);
+  const t = e.match(Hs);
   return t ? t.length : 0;
 }, Vs = (e) => {
   const t = Us();
   return t ? (t.style.font = e, t.getBoundingClientRect().width) : null;
 }, Us = () => typeof document > "u" ? null : (ae || (ae = document.createElement("span"), ae.style.position = "absolute", ae.style.visibility = "hidden", ae.style.whiteSpace = "nowrap", ae.style.left = "-9999px", ae.textContent = Yn, document.body.appendChild(ae)), ae), zn = U(null), Qs = ({ children: e, measurer: t }) => {
-  const [r, n] = O(null);
-  F(() => {
+  const [r, n] = H(null);
+  M(() => {
     if (t !== void 0) return;
     let a = !1;
     const i = () => {
@@ -1647,7 +1647,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
       })
     ]
   });
-  return i ? /* @__PURE__ */ s(H.svg, {
+  return i ? /* @__PURE__ */ s(O.svg, {
     initial: !1,
     transition: ne,
     x: v,
@@ -1676,7 +1676,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
       children: a
     })]
   });
-  return i ? /* @__PURE__ */ s(H.svg, {
+  return i ? /* @__PURE__ */ s(O.svg, {
     initial: !1,
     transition: ne,
     y: d,
@@ -1726,7 +1726,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   });
 }, gl = ({ strokeWidth: e, lineType: t, isHorizontalLine: r, position: n, lineColor: o, shouldAnimateTransitions: a }) => {
   const i = Xs(r, n), l = qs(t, e);
-  return a ? /* @__PURE__ */ s(H.line, {
+  return a ? /* @__PURE__ */ s(O.line, {
     initial: !1,
     transition: ne,
     animate: {
@@ -1747,11 +1747,11 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     vectorEffect: "non-scaling-stroke"
   });
 }, fl = Z(function({ layer: t, coordSystem: r, formattingLocale: n, shouldAnimateTransitions: o }) {
-  const a = pe(), i = de(), { guides: l, numberFormat: c, layers: u, colorScale: d } = C(j((M) => ({
-    guides: M.guides,
-    numberFormat: M.config.numberFormat,
-    layers: M.spec.layers,
-    colorScale: M.scales.color
+  const a = pe(), i = de(), { guides: l, numberFormat: c, layers: u, colorScale: d } = C(j((F) => ({
+    guides: F.guides,
+    numberFormat: F.config.numberFormat,
+    layers: F.spec.layers,
+    colorScale: F.scales.color
   }))), v = A(() => xa(u, d).get(t.id) ?? null, [
     u,
     d,
@@ -1766,11 +1766,11 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     c,
     n,
     t
-  ]), { fonts: f } = Ie(), m = Hs(t.id), p = A(() => z(m, f.familyDefault), [m, f.familyDefault]), y = A(() => h === null ? 0 : a.measureText(h, p).width, [
+  ]), { fonts: f } = Ie(), m = Os(t.id), p = A(() => z(m, f.familyDefault), [m, f.familyDefault]), y = A(() => h === null ? 0 : a.measureText(h, p).width, [
     h,
     p,
     a
-  ]), b = I(t), R = t.data.getFirst();
+  ]), b = T(t), R = t.data.getFirst();
   if (!R) return null;
   const S = b.get("color", R), P = on(S), E = js(t, r), N = E ? te(R) : q(R);
   return N === null ? null : /* @__PURE__ */ w("g", {
@@ -1809,8 +1809,8 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   renderHover: () => null,
   renderHoverCompanions: () => null
 }, ml = Z(function({ layer: t, shouldAnimateTransitions: r, intro: n }) {
-  const o = n?.type === "fade" ? n : null, a = I(t), i = A(() => {
-    const l = Ha(t.data, t.mapping, t.id), c = [];
+  const o = n?.type === "fade" ? n : null, a = T(t), i = A(() => {
+    const l = Oa(t.data, t.mapping, t.id), c = [];
     for (const u of t.data) {
       const d = en(u);
       d && _r(u) && c.push({
@@ -1829,13 +1829,13 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     a,
     r
   ]);
-  return o ? /* @__PURE__ */ s(H.g, {
+  return o ? /* @__PURE__ */ s(O.g, {
     initial: { opacity: 0 },
     animate: { opacity: 1 },
     transition: Ui(o),
     children: i
   }) : i;
-}), Al = ({ isAnimated: e, ...t }) => e ? /* @__PURE__ */ s(H.rect, {
+}), Al = ({ isAnimated: e, ...t }) => e ? /* @__PURE__ */ s(O.rect, {
   initial: !1,
   style: { transformBox: "view-box" },
   transition: ne,
@@ -1858,7 +1858,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   opacity: t.opacity,
   rx: 8
 }), De = 2, yl = ({ layer: e, primary: t, panelRect: r }) => {
-  const n = I(e), o = en(t.observation);
+  const n = T(e), o = en(t.observation);
   if (!o || !_r(t.observation)) return null;
   const a = n.get("color", t.observation), i = n.get("alpha", t.observation), l = n.get("borderColor", t.observation, "hovered") ?? vt, c = o.x * r.width, u = o.y * r.height, d = o.width * r.width, v = o.height * r.height;
   return /* @__PURE__ */ w("g", {
@@ -1910,13 +1910,13 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     "data-testid": "hovered-point",
     children: r
   }) : r;
-}, Ot = (e) => {
+}, Ht = (e) => {
   const [t, ...r] = e;
   if (!t) return "";
   const n = r.map((o) => `L ${o.x} ${o.y}`).join(" ");
   return `M ${t.x} ${t.y} ${n} Z`;
 }, bl = Z(function({ layer: t }) {
-  const r = I(t), n = A(() => {
+  const r = T(t), n = A(() => {
     const o = oe(t.data, t.mapping, t.id), a = [];
     return t.data.groupBy(ce.group).forEach((i) => {
       const l = [...i], c = qn(l);
@@ -1971,13 +1971,13 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   }
   if (t.length === 0) return null;
   t.sort((a, i) => a.angle - i.angle);
-  const r = t.map((a) => a.outer), n = t.map((a) => a.inner), o = Ot(r);
+  const r = t.map((a) => a.outer), n = t.map((a) => a.inner), o = Ht(r);
   return {
-    fillPath: n.some((a) => a.x !== 0 || a.y !== 0) ? `${o} ${Ot([...n].reverse())}` : o,
+    fillPath: n.some((a) => a.x !== 0 || a.y !== 0) ? `${o} ${Ht([...n].reverse())}` : o,
     outlinePath: o
   };
 }, wl = ({ layer: e, primary: t, companions: r }) => {
-  const n = I(e), o = pt(t.observation), a = A(() => qn([...e.data.filter(ce.group, "eq", o)]), [e.data, o]);
+  const n = T(e), o = pt(t.observation), a = A(() => qn([...e.data.filter(ce.group, "eq", o)]), [e.data, o]);
   if (!a) return null;
   const i = n.get("color", t.observation), l = n.get("alpha", t.observation), c = n.get("strokeAlpha", t.observation), u = n.get("strokeWidth", t.observation);
   return /* @__PURE__ */ w(B, { children: [
@@ -2041,7 +2041,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   strokeWidth: t,
   vectorEffect: "non-scaling-stroke"
 }), kl = Z(function({ layer: t, coordSystem: r, shouldAnimateTransitions: n, intro: o }) {
-  const a = V(), i = At(o?.type === "grow" && (o.growAxis === "angle" || o.growAxis === "radius") ? o : null, n), l = r.bandAxis !== "x", c = I(t), u = A(() => {
+  const a = V(), i = At(o?.type === "grow" && (o.growAxis === "angle" || o.growAxis === "radius") ? o : null, n), l = r.bandAxis !== "x", c = T(t), u = A(() => {
     const d = oe(t.data, t.mapping, t.id), v = /* @__PURE__ */ new Map();
     for (const g of t.data) {
       const h = d(g), { startAngle: f, endAngle: m } = Yt(g), { innerRadius: p, outerRadius: y } = mt(g);
@@ -2081,8 +2081,8 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     "data-geom": "bar",
     className: $,
     children: u.map((d, v) => {
-      const { borderColor: g, borderWidth: h, borderRadius: f, borderAlpha: m } = d.style, p = g !== void 0, y = ze(h), b = g === void 0 ? {} : Ge(g, y.separatorWidth), R = g === void 0 ? void 0 : Ge(g, y.outlineWidth), S = d.items.map((M) => {
-        const { key: W, ...K } = M;
+      const { borderColor: g, borderWidth: h, borderRadius: f, borderAlpha: m } = d.style, p = g !== void 0, y = ze(h), b = g === void 0 ? {} : Ge(g, y.separatorWidth), R = g === void 0 ? void 0 : Ge(g, y.outlineWidth), S = d.items.map((F) => {
+        const { key: W, ...K } = F;
         return i.isAnimated ? /* @__PURE__ */ s(Rl, {
           ...K,
           animation: i,
@@ -2145,11 +2145,11 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     innerRadius: h,
     outerRadius: f,
     cornerRadius: o
-  }) ?? ""), S = Ht(a, l, c);
-  F(() => {
+  }) ?? ""), S = Ot(a, l, c);
+  M(() => {
     const E = S(), N = [ie(m, e, E), ie(p, t, E)];
     return () => {
-      for (const M of N) M.stop();
+      for (const F of N) F.stop();
     };
   }, [
     m,
@@ -2158,11 +2158,11 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     t,
     S
   ]);
-  const P = Ht(a, l, u);
-  return F(() => {
+  const P = Ot(a, l, u);
+  return M(() => {
     const E = P(), N = [ie(y, r, E), ie(b, n, E)];
     return () => {
-      for (const M of N) M.stop();
+      for (const F of N) F.stop();
     };
   }, [
     y,
@@ -2170,7 +2170,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     r,
     n,
     P
-  ]), F(() => {
+  ]), M(() => {
     const E = () => {
       R.set(ge({
         startAngle: m.get(),
@@ -2186,9 +2186,9 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
       p,
       y,
       b
-    ].map((M) => M.on("change", E));
+    ].map((F) => F.on("change", E));
     return () => {
-      for (const M of N) M();
+      for (const F of N) F();
     };
   }, [
     m,
@@ -2200,7 +2200,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   ]), R;
 }, Rl = ({ pathProps: e, ...t }) => {
   const r = Jn(t);
-  return /* @__PURE__ */ s(H.path, {
+  return /* @__PURE__ */ s(O.path, {
     d: r,
     transition: ne,
     ...e
@@ -2210,10 +2210,10 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   return /* @__PURE__ */ w(B, { children: [
     /* @__PURE__ */ s("clipPath", {
       id: e,
-      children: /* @__PURE__ */ s(H.path, { d: a })
+      children: /* @__PURE__ */ s(O.path, { d: a })
     }),
     n,
-    t !== void 0 && /* @__PURE__ */ s(H.path, {
+    t !== void 0 && /* @__PURE__ */ s(O.path, {
       d: a,
       fill: "none",
       opacity: r,
@@ -2321,7 +2321,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     ]
   });
 }, Pl = ({ layer: e, sourceLayer: t, coordSystem: r }) => {
-  const n = I(t), o = A(() => Zn(t, r.bandAxis, n), [
+  const n = T(t), o = A(() => Zn(t, r.bandAxis, n), [
     t,
     r.bandAxis,
     n
@@ -2382,7 +2382,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   startSpoke: !e.startSpoke,
   endSpoke: !e.endSpoke
 }), Tl = ({ layer: e, coordSystem: t, primary: r }) => {
-  const n = I(e), o = $n(A(() => Zn(e, t.bandAxis, n), [
+  const n = T(e), o = $n(A(() => Zn(e, t.bandAxis, n), [
     e,
     t.bandAxis,
     n
@@ -2425,7 +2425,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   }),
   renderHoverCompanions: () => null
 }, Nl = Z(function({ layer: t }) {
-  const r = I(t), n = A(() => {
+  const r = T(t), n = A(() => {
     const o = oe(t.data, t.mapping, t.id), a = [];
     return t.data.groupBy(ce.group).forEach((i) => {
       const l = [...i], c = to(l);
@@ -2472,9 +2472,9 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
       point: J(n, o)
     });
   }
-  return t.length === 0 ? null : (t.sort((r, n) => r.angle - n.angle), Ot(t.map((r) => r.point)));
+  return t.length === 0 ? null : (t.sort((r, n) => r.angle - n.angle), Ht(t.map((r) => r.point)));
 }, Ml = ({ layer: e, primary: t, companions: r }) => {
-  const n = I(e), o = pt(t.observation), a = A(() => to([...e.data.filter(ce.group, "eq", o)]), [e.data, o]);
+  const n = T(e), o = pt(t.observation), a = A(() => to([...e.data.filter(ce.group, "eq", o)]), [e.data, o]);
   if (!a) return null;
   const i = n.get("color", t.observation), l = n.get("alpha", t.observation), c = n.get("strokeWidth", t.observation), u = Ee(n.get("lineType", t.observation));
   return /* @__PURE__ */ w(B, { children: [
@@ -2529,7 +2529,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     };
   }
 }, Dl = Z(function({ layer: t, shouldAnimateTransitions: r, intro: n }) {
-  const o = I(t), a = At(n?.type === "grow" && n.growAxis === "size" ? n : null, r);
+  const o = T(t), a = At(n?.type === "grow" && n.growAxis === "size" ? n : null, r);
   return A(() => {
     const i = a.activeIntro ? oe(t.data, t.mapping, t.id) : null, l = [];
     let c = 0;
@@ -2548,7 +2548,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
     o,
     a
   ]);
-}), Hl = {
+}), Ol = {
   geom: "point",
   coord: "polar",
   swatchShape: "circle",
@@ -2571,7 +2571,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
       y: 1 - o
     };
   }
-}, Ol = {
+}, Hl = {
   bar: {
     cartesian: us,
     polar: Ll
@@ -2586,7 +2586,7 @@ var el = "_2qyyu60", tl = 2, rl = 12, nl = 12, br = 1, wr = 2, ol = 4, Xe = (e)
   },
   point: {
     cartesian: ys,
-    polar: Hl
+    polar: Ol
   },
   rule: { cartesian: pl },
   tile: { cartesian: xl }
@@ -2615,12 +2615,12 @@ function Af(e, t) {
 }
 function Wl(e = []) {
   const t = {};
-  for (const [r, n] of Object.entries(Ol)) t[r] = { ...n };
+  for (const [r, n] of Object.entries(Hl)) t[r] = { ...n };
   for (const r of e) (t[r.geom] ??= {})[r.coord] = r;
   return (r, n) => t[r]?.[n] ?? null;
 }
 var Gt = (e) => {
-  const t = T(e);
+  const t = I(e);
   return t.current = e, t;
 }, Vl = () => {
   const e = /* @__PURE__ */ new Map();
@@ -2642,10 +2642,10 @@ var Gt = (e) => {
   const r = A(() => ({
     layers: e,
     coordSystem: t
-  }), [e, t]), n = T(null);
+  }), [e, t]), n = I(null);
   n.current === null && (n.current = new va(r));
-  const o = n.current, a = T(!1);
-  return F(() => {
+  const o = n.current, a = I(!1);
+  return M(() => {
     if (!a.current) {
       a.current = !0;
       return;
@@ -2656,7 +2656,7 @@ var Gt = (e) => {
   const { layers: t, coordSystem: r } = C(j((l) => ({
     layers: l.layers,
     coordSystem: l.coordSystem
-  }))), n = Ql(t, r), [o] = O(() => Vl()), a = T(null), i = T(null);
+  }))), n = Ql(t, r), [o] = H(() => Vl()), a = I(null), i = I(null);
   return i.current === null && (i.current = {
     engine: n,
     store: o,
@@ -2671,10 +2671,10 @@ var Gt = (e) => {
   return e;
 };
 function Kl(e, t) {
-  const { engine: r } = me(), n = T(t);
-  F(() => {
+  const { engine: r } = me(), n = I(t);
+  M(() => {
     n.current = t;
-  }, [t]), F(() => (r.registerHitTester(e, (o) => n.current(o)), () => r.unregisterHitTester(e)), [r, e]);
+  }, [t]), M(() => (r.registerHitTester(e, (o) => n.current(o)), () => r.unregisterHitTester(e)), [r, e]);
 }
 var zl = ({ hitTest: e, input: t }) => {
   const r = A(() => e(t), [e, t.layer.data]);
@@ -2691,15 +2691,15 @@ var zl = ({ hitTest: e, input: t }) => {
   },
   children: o
 }), r), Jl = ({ rect: e, children: t }) => {
-  const [r] = O(no);
+  const [r] = H(no);
   return /* @__PURE__ */ s(ql, {
     rect: e,
-    zIndex: He.panelOverlay,
+    zIndex: Oe.panelOverlay,
     container: r,
     children: t
   });
 }, Zl = (e, t) => {
-  const r = Gt(e), n = Gt(t), o = T(null), a = T(null), i = A(() => {
+  const r = Gt(e), n = Gt(t), o = I(null), a = I(null), i = A(() => {
     const l = () => {
       a.current !== null && (clearTimeout(a.current), a.current = null), o.current = null;
     }, c = () => {
@@ -2719,7 +2719,7 @@ var zl = ({ hitTest: e, input: t }) => {
       cancel: l
     };
   }, [r, n]);
-  return F(() => () => {
+  return M(() => () => {
     a.current !== null && clearTimeout(a.current);
   }, []), i;
 }, $l = {
@@ -2727,13 +2727,13 @@ var zl = ({ hitTest: e, input: t }) => {
   height: 0,
   isDefault: !0
 }, oo = ({ debounce: e = 0, onResize: t } = {}) => {
-  const [r, n] = O($l), o = T(null), a = Zl((u) => {
+  const [r, n] = H($l), o = I(null), a = Zl((u) => {
     const d = o.current;
     d && d.width === u.width && d.height === u.height || (o.current = {
       width: u.width,
       height: u.height
     }, t?.(u), n(u));
-  }, e), i = T(null), l = T(null), c = se((u) => {
+  }, e), i = I(null), l = I(null), c = se((u) => {
     i.current !== u && (i.current && l.current?.unobserve(i.current), i.current = u, u && (l.current ??= new ResizeObserver(([d]) => {
       if (!d) return;
       const v = Math.round(d.contentBoxSize[0]?.inlineSize ?? d.contentRect.width), g = Math.round(d.contentBoxSize[0]?.blockSize ?? d.contentRect.height);
@@ -2750,7 +2750,7 @@ var zl = ({ hitTest: e, input: t }) => {
   };
 };
 function _l() {
-  const [e, t] = O(null), r = T(null), n = T(null), o = T(null), a = se(() => {
+  const [e, t] = H(null), r = I(null), n = I(null), o = I(null), a = se(() => {
     o.current = null;
     const u = n.current;
     if (!u) return;
@@ -2771,7 +2771,7 @@ function _l() {
   }, [a]), { setElement: l } = oo({ onResize: i }), c = se((u) => {
     n.current = u, l(u), u && a();
   }, [l, a]);
-  return F(() => (window.addEventListener("scroll", i, !0), window.addEventListener("resize", i), () => {
+  return M(() => (window.addEventListener("scroll", i, !0), window.addEventListener("resize", i), () => {
     window.removeEventListener("scroll", i, !0), window.removeEventListener("resize", i), o.current !== null && cancelAnimationFrame(o.current);
   }), [i]), {
     measureRef: c,
@@ -2799,7 +2799,7 @@ function ec(e) {
 }
 var tc = ({ render: e, input: t }) => {
   const r = ec(t.layer.id), { measureRef: n, screenRect: o } = _l();
-  return F(() => () => r(null), [r]), /* @__PURE__ */ w(B, { children: [/* @__PURE__ */ s("rect", {
+  return M(() => () => r(null), [r]), /* @__PURE__ */ w(B, { children: [/* @__PURE__ */ s("rect", {
     ref: n,
     x: 0,
     y: 0,
@@ -3136,8 +3136,8 @@ var tc = ({ render: e, input: t }) => {
     case "doc":
       return /* @__PURE__ */ s(jt, { children: r }, t);
     case "heading": {
-      const n = Hc(e.attrs?.level);
-      return Oc(n, t, r, Pr(e.attrs));
+      const n = Oc(e.attrs?.level);
+      return Hc(n, t, r, Pr(e.attrs));
     }
     case "paragraph":
       return /* @__PURE__ */ s("p", {
@@ -3206,7 +3206,7 @@ var tc = ({ render: e, input: t }) => {
   n && (t.fontFamily = n);
   const o = Dc(e.fontSize);
   return o && (t.fontSize = o), Object.keys(t).length > 0 ? t : null;
-}, Dc = (e) => typeof e == "number" && Number.isFinite(e) ? `${e / 10}em` : xt(e), xt = (e) => typeof e == "string" && e.length > 0 ? e : void 0, Hc = (e) => typeof e != "number" ? 3 : e < 1 ? 1 : e > 3 ? 3 : Math.round(e), Oc = (e, t, r, n) => {
+}, Dc = (e) => typeof e == "number" && Number.isFinite(e) ? `${e / 10}em` : xt(e), xt = (e) => typeof e == "string" && e.length > 0 ? e : void 0, Oc = (e) => typeof e != "number" ? 3 : e < 1 ? 1 : e > 3 ? 3 : Math.round(e), Hc = (e, t, r, n) => {
   const o = ho(n);
   switch (e) {
     case 1:
@@ -3235,8 +3235,8 @@ function Ve(e) {
 }
 var Gc = "_19519k80";
 var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc = "_19519k87", Kc = "_19519k88", zc = (e) => {
-  const { overlayRef: t } = me(), r = T(null), [n, o] = O(!1), a = Gt(e);
-  return F(() => {
+  const { overlayRef: t } = me(), r = I(null), [n, o] = H(!1), a = Gt(e);
+  return M(() => {
     const i = t.current;
     if (!i) return;
     const l = (u) => {
@@ -3276,7 +3276,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     numberFormat: b.config.numberFormat,
     parsingLocale: b.config.parsingLocale,
     comments: b.annotations.comments
-  }))), { formattingLocale: t, colorScheme: r } = G(), n = Ve((b) => b.hover), o = Ve((b) => b.tooltipAnchor), a = Ve((b) => b.isPointerSuspended), i = ee("Tooltip", Zc), l = T(() => {
+  }))), { formattingLocale: t, colorScheme: r } = G(), n = Ve((b) => b.hover), o = Ve((b) => b.tooltipAnchor), a = Ve((b) => b.isPointerSuspended), i = ee("Tooltip", Zc), l = I(() => {
   }), { cursorRef: c, isInside: u } = zc(() => l.current()), d = A(() => Ea({
     ...e,
     hover: n,
@@ -3433,7 +3433,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     layers: i.layers,
     coordSystem: i.coordSystem,
     scales: i.scales
-  }))), [a] = O(() => id({
+  }))), [a] = H(() => id({
     layers: r,
     coordSystem: n,
     scales: o,
@@ -3444,7 +3444,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     children: t
   });
 }, od = () => {
-  const { introEndsAtMs: e } = D(er), [t] = O(() => sd(e) / 1e3);
+  const { introEndsAtMs: e } = D(er), [t] = H(() => sd(e) / 1e3);
   return t;
 }, ad = (e) => {
   const { plansByLayerId: t, coordKey: r } = D(er), n = C((o) => vo(o.coordSystem));
@@ -3579,7 +3579,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     default:
       return t;
   }
-}, md = (e) => e.fontSize * (e.lineHeight ?? xs), xo = (e) => e.reduce((t, r) => t + r, 0), Ad = (e, t) => On(e, t).size * e.lineHeight, yd = (e, t) => e ? t : 0, ht = (e, t, r) => {
+}, md = (e) => e.fontSize * (e.lineHeight ?? xs), xo = (e) => e.reduce((t, r) => t + r, 0), Ad = (e, t) => Hn(e, t).size * e.lineHeight, yd = (e, t) => e ? t : 0, ht = (e, t, r) => {
   if (r) {
     const n = Number(e.size);
     return Number.isFinite(n) && n > 0 ? n : 0;
@@ -3604,7 +3604,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
   });
   return Math.max(...f) + g;
 }, bd = ({ textMeasurer: e, tickLabelStyles: t, familyDefault: r }) => (n, o) => e.measureText(n, z(t[o], r)), wd = Object.freeze({}), Sd = ({ textMeasurer: e, textScale: t, metrics: r, overrides: n = wd }) => {
-  const o = go(), a = bt(), i = po(), l = tr(), c = rr(), u = mo(), d = L(), v = T(n);
+  const o = go(), a = bt(), i = po(), l = tr(), c = rr(), u = mo(), d = L(), v = I(n);
   return v.current = n, A(() => {
     if (!e) return null;
     const g = r.fonts.familyDefault, h = {
@@ -3719,7 +3719,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
   return e ?? t;
 }, Ir = 0.5, bo = U(/* @__PURE__ */ new Map()), wo = U(() => {
 }), So = U(/* @__PURE__ */ new Set()), Pd = ({ children: e }) => {
-  const [t, r] = O(() => /* @__PURE__ */ new Map()), [n] = O(() => /* @__PURE__ */ new Set()), o = T(/* @__PURE__ */ new Map()), a = se((i, l, c) => {
+  const [t, r] = H(() => /* @__PURE__ */ new Map()), [n] = H(() => /* @__PURE__ */ new Set()), o = I(/* @__PURE__ */ new Map()), a = se((i, l, c) => {
     const u = o.current.get(i) ?? /* @__PURE__ */ new Set();
     if (c !== null) {
       u.add(l), o.current.set(i, u), r((d) => Nd(d, i, c));
@@ -3738,8 +3738,8 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     })
   });
 }, Bd = () => D(bo), Id = () => D(wo), Td = (e) => {
-  const t = Id(), r = V(), n = T(null);
-  return F(() => {
+  const t = Id(), r = V(), n = I(null);
+  return M(() => {
     if (typeof ResizeObserver > "u") return;
     const o = n.current;
     if (o === null) return;
@@ -3766,7 +3766,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
   if (!e.has(t)) return e;
   const r = new Map(e);
   return r.delete(t), r;
-}, ko = "data-edit-kind", Fd = "data-edit-id", Dd = "observation", Hd = /* @__PURE__ */ new Set(["annotation"]), Od = (e) => Hd.has(e.kind), Gd = (e, t) => e === t ? !0 : e === null || t === null || e.kind !== t.kind ? !1 : e.id === t.id, qe = (e) => ({
+}, ko = "data-edit-kind", Fd = "data-edit-id", Dd = "observation", Od = /* @__PURE__ */ new Set(["annotation"]), Hd = (e) => Od.has(e.kind), Gd = (e, t) => e === t ? !0 : e === null || t === null || e.kind !== t.kind ? !1 : e.id === t.id, qe = (e) => ({
   [ko]: e.kind,
   [Fd]: e.id
 }), Wd = () => ({ [ko]: Dd }), yf = (e, t) => e !== null && e.annotationId === t ? e : null, Vd = (e, t) => e.annotationId === t.annotationId && e.translation.x === t.translation.x && e.translation.y === t.translation.y, xf = (e, t, r) => e !== null && e.annotationId === t && e.endpoint === r ? e : null, Ud = (e, t) => e.annotationId === t.annotationId && e.endpoint === t.endpoint && e.anchor.x === t.anchor.x && e.anchor.y === t.anchor.y, bf = (e, t, r) => e !== null && e.annotationId === t && e.endpoint === r ? e : null, Qd = (e, t) => e.annotationId === t.annotationId && e.endpoint === t.endpoint && ma(e.point.anchor, t.point.anchor), wf = (e, t) => e !== null && e.annotationId === t ? e : null, Yd = (e, t) => e.annotationId === t.annotationId && e.region.x === t.region.x && e.region.y === t.region.y && e.region.width === t.region.width && e.region.height === t.region.height, Sf = (e, t) => e !== null && e.annotationId === t ? e : null, Kd = (e, t) => e.annotationId === t.annotationId && e.at.x === t.at.x && e.width === t.width && e.shift === t.shift, Ue = ({ standingInteraction: e }, t) => e !== null && ve(e, t) ? e : null, zd = (e, t) => {
@@ -3807,7 +3807,7 @@ var Wc = "_19519k82", Vc = "_19519k83", Uc = "_19519k85", Qc = "_19519k86", Yc =
     editor: t
   } })
 })), nr = U(null), jd = Ro(), kf = ({ children: e }) => {
-  const [t] = O(() => Ro());
+  const [t] = H(() => Ro());
   return /* @__PURE__ */ s(nr.Provider, {
     value: t,
     children: e
@@ -4080,13 +4080,13 @@ var Cu = 22, Eu = ({ ref: e, headerRect: t, mode: r = "readonly", title: n, isTi
   md: 20,
   lg: 24,
   xl: 36
-}, Hu = {
+}, Ou = {
   primary: "asohov1 asohov0",
   secondary: "asohov2 asohov0"
 }, To = ({ children: e, title: t, variant: r = "primary", size: n = "sm", ...o }) => {
   const a = V(), i = Du[n];
   return /* @__PURE__ */ w("svg", {
-    className: Hu[r],
+    className: Ou[r],
     "aria-labelledby": t ? a : void 0,
     height: i,
     width: i,
@@ -4099,7 +4099,7 @@ var Cu = 22, Eu = ({ ref: e, headerRect: t, mode: r = "readonly", title: n, isTi
       children: t
     }), e]
   });
-}, Ou = (e) => /* @__PURE__ */ s(To, {
+}, Hu = (e) => /* @__PURE__ */ s(To, {
   ...e,
   children: /* @__PURE__ */ w("g", {
     stroke: "currentColor",
@@ -4130,7 +4130,7 @@ var Yu = ({ segment: e, itemStyle: t }) => {
   if (e.kind === "trendArrow") {
     const a = Lo(t, e.direction);
     return /* @__PURE__ */ s("div", {
-      className: Oe(Qu, e.direction === "down" && "n7clvo4"),
+      className: He(Qu, e.direction === "down" && "n7clvo4"),
       style: {
         color: a,
         backgroundColor: e.direction === "flat" ? Y(x.textPrimary, 0.1) : Y(a, 0.2)
@@ -4138,7 +4138,7 @@ var Yu = ({ segment: e, itemStyle: t }) => {
       children: e.direction === "flat" ? /* @__PURE__ */ s(Gu, {
         size: "xs",
         title: ""
-      }) : /* @__PURE__ */ s(Ou, {
+      }) : /* @__PURE__ */ s(Hu, {
         size: "xs",
         title: ""
       })
@@ -4362,7 +4362,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
     }
   }), /* @__PURE__ */ s("span", { children: e.formattedLabel })] });
 }, Sh = ({ hiddenPills: e, placement: t }) => {
-  const r = io(), [n, o] = O(!1), { refs: a, floatingStyles: i } = yn({
+  const r = io(), [n, o] = H(!1), { refs: a, floatingStyles: i } = yn({
     open: n,
     placement: t,
     middleware: [
@@ -4371,7 +4371,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
       Ft({ padding: 8 })
     ]
   });
-  F(() => {
+  M(() => {
     if (!n) return;
     const d = (g) => {
       const h = g.target;
@@ -4392,12 +4392,12 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   const l = t === "left" || t === "right", c = Math.min(e.length - 1, 2), u = Array.from({ length: c }, (d, v) => c - v);
   return /* @__PURE__ */ w(B, { children: [/* @__PURE__ */ w("div", {
     ref: a.setReference,
-    className: Oe(lh, {
+    className: He(lh, {
       [dh]: l,
       [ch]: !l
     }),
     children: [u.map((d) => /* @__PURE__ */ s("span", {
-      className: Oe(uh, {
+      className: He(uh, {
         [vh]: l,
         [hh]: !l
       }),
@@ -4405,7 +4405,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
       "aria-hidden": !0
     }, d)), /* @__PURE__ */ s("button", {
       type: "button",
-      className: Oe(gh, { [fh]: n }),
+      className: He(gh, { [fh]: n }),
       onClick: () => o((d) => !d),
       "aria-haspopup": "dialog",
       "aria-expanded": n,
@@ -4453,14 +4453,14 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
       visibleCount: v.length,
       hasOverflow: !1
     };
-    const S = z(c.item, i.fonts.familyDefault), P = fe(c.item), E = 2 * (c.item.paddingInline + c.item.borderWidth), N = 2 * (c.item.paddingBlock + c.item.borderWidth), M = (ye) => g ? Lh(ye, P, c.swatch.size, N) : Nr({
+    const S = z(c.item, i.fonts.familyDefault), P = fe(c.item), E = 2 * (c.item.paddingInline + c.item.borderWidth), N = 2 * (c.item.paddingBlock + c.item.borderWidth), F = (ye) => g ? Lh(ye, P, c.swatch.size, N) : Nr({
       label: ye.formattedLabel,
       swatchInlineSize: Nh(ye, c.swatch.size),
       textMeasurer: a,
       font: S,
       swatchGap: i.legendSwatchGap,
       horizontalChrome: E
-    }), W = v.map(M), K = On(i.fonts.legendLabel, o), Te = Ad(i.fonts.legendLabel, o), Ae = (g ? Te + i.legendPillVerticalChrome : Nr({
+    }), W = v.map(F), K = Hn(i.fonts.legendLabel, o), Te = Ad(i.fonts.legendLabel, o), Ae = (g ? Te + i.legendPillVerticalChrome : Nr({
       label: `+${v.length}`,
       swatchInlineSize: 0,
       textMeasurer: a,
@@ -4485,9 +4485,9 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
     c
   ]);
   if (v.length === 0) return null;
-  const p = v.slice(0, m.visibleCount), y = v.slice(m.visibleCount), b = m.hasOverflow && y.length > 0, R = Hh(c.item);
+  const p = v.slice(0, m.visibleCount), y = v.slice(m.visibleCount), b = m.hasOverflow && y.length > 0, R = Oh(c.item);
   return /* @__PURE__ */ w("div", {
-    className: Oe(Ph[f], Rh, {
+    className: He(Ph[f], Rh, {
       [Eh]: g,
       [Ch]: !g,
       [Bh[e === "left" ? "left" : "right"]]: g
@@ -4541,7 +4541,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
     case "right":
       return "left";
   }
-}, Hh = (e) => ({
+}, Oh = (e) => ({
   ...le(e),
   color: e.textColor,
   lineHeight: e.lineHeight,
@@ -4550,7 +4550,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   paddingInline: e.paddingInline,
   paddingBlock: e.paddingBlock,
   ...e.borderWidth > 0 ? { border: `${e.borderWidth}px solid ${e.borderColor}` } : {}
-}), Oh = Z(function({ formattedLegends: t, rects: r, textScale: n }) {
+}), Hh = Z(function({ formattedLegends: t, rects: r, textScale: n }) {
   const o = A(() => {
     const a = /* @__PURE__ */ new Map();
     for (const i of t) {
@@ -4690,12 +4690,12 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   "data-testid": "hover-guide",
   children: t
 }), Ef = (e, t, r) => {
-  for (const n of Object.values(Ho)) {
+  for (const n of Object.values(Oo)) {
     const o = n(e, t, r);
     if (o !== null) return o;
   }
   return null;
-}, Kh = (e) => Ho[e] !== void 0, zh = (e, t, r) => Do(e, r, t / 2), jh = (e, t) => {
+}, Kh = (e) => Oo[e] !== void 0, zh = (e, t, r) => Do(e, r, t / 2), jh = (e, t) => {
   const r = Qe(e.start, t), n = Qe(e.end, t);
   return r.x === n.x && r.y === n.y ? null : {
     shape: "segment",
@@ -4729,16 +4729,16 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
       height: n.height + r * 2
     }
   };
-}, Ho = {
+}, Oo = {
   text: ot((e) => e.textAnnotations, Xh),
   shape: ot((e) => e.shapes, (e, t) => zh(e.region, gn(t.chromeReaders, e.id).borderWidth, t.panel)),
   image: ot((e) => e.images, (e, t) => Do(e.region, t.panel)),
   arrow: ot((e) => e.arrows, (e, t) => jh(e, t.panel))
 }, qh = (e, t) => {
-  const r = Oa(e, t);
+  const r = Ha(e, t);
   return r !== null && Kh(r.kind) && $a(r);
 }, Jh = 200, Zh = ({ engine: e, store: t, overlayRef: r }) => {
-  F(() => {
+  M(() => {
     const n = r.current;
     if (!n) return;
     const o = $h(n, e), a = ev(n, e, t);
@@ -4822,7 +4822,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
 }, tv = ({ panelRect: e }) => {
   const { engine: t, store: r, overlayRef: n } = me(), o = ue((c) => {
     const u = c.editTargetUnderPointer;
-    return u !== null && Od(u);
+    return u !== null && Hd(u);
   }), a = ue((c) => {
     const u = c.editTargetUnderPointer;
     return u?.kind === "annotation" ? u.id : null;
@@ -4846,7 +4846,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   });
 }, rv = (e, t) => e ? "move" : t ? "pointer" : void 0, It = "data-hover-active", nv = (e) => {
   const { store: t } = me(), r = je(t, (n) => n.hover.primary !== null);
-  F(() => {
+  M(() => {
     const n = e.current;
     if (n)
       return r ? n.setAttribute(It, "true") : n.removeAttribute(It), () => {
@@ -4874,7 +4874,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
 }, Mr = (e, t, r, n) => {
   const o = [t, ...[...r].sort()].join("\0");
   e.has(o) || (e.add(o), console.warn(n));
-}, av = 16, Oo = ({ linePath: e, strokeWidth: t }) => /* @__PURE__ */ s("path", {
+}, av = 16, Ho = ({ linePath: e, strokeWidth: t }) => /* @__PURE__ */ s("path", {
   d: e,
   stroke: "transparent",
   strokeWidth: Math.max(t, av),
@@ -4897,7 +4897,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   return /* @__PURE__ */ w("g", {
     pointerEvents: r ? void 0 : "none",
     children: [
-      r && /* @__PURE__ */ s(Oo, {
+      r && /* @__PURE__ */ s(Ho, {
         linePath: e.linePath,
         strokeWidth: e.strokeWidth
       }),
@@ -5013,7 +5013,7 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   return /* @__PURE__ */ w("g", {
     pointerEvents: o ? void 0 : "none",
     children: [
-      o && /* @__PURE__ */ s(Oo, {
+      o && /* @__PURE__ */ s(Ho, {
         linePath: e,
         strokeWidth: n
       }),
@@ -5262,10 +5262,10 @@ var mh = "_1dw9dgx0", Ah = "#9ca3af", Bt = "\0", yh = (e, t) => {
   const e = L(), t = C((r) => r.config.appearance.textScale);
   return A(() => (r, n) => ci(e, r, n, t), [e, t]);
 }, Fv = "ph8bdc0";
-var Dv = "ph8bdc2", Hr = {
+var Dv = "ph8bdc2", Or = {
   hittable: "ph8bdc4 ph8bdc3",
   inert: "ph8bdc5 ph8bdc3"
-}, Hv = ({ cx: e, cy: t, color: r, style: n }) => {
+}, Ov = ({ cx: e, cy: t, color: r, style: n }) => {
   const o = yc(n.shadow);
   return /* @__PURE__ */ s("circle", {
     cx: e,
@@ -5279,7 +5279,7 @@ var Dv = "ph8bdc2", Hr = {
     }
   });
 };
-function Ov(e) {
+function Hv(e) {
   const t = pe(), { formattingLocale: r } = G(), n = Wo(), o = C(j((c) => ({
     pinnedNumbers: c.annotations.pinnedNumbers,
     comments: c.annotations.comments,
@@ -5317,11 +5317,11 @@ function Ov(e) {
     i
   ]);
 }
-var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o, n).width), Or = "callouts", Wv = ({ panelRect: e }) => {
+var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o, n).width), Hr = "callouts", Wv = ({ panelRect: e }) => {
   const { pinnedNumbers: t, comments: r } = C(j((h) => ({
     pinnedNumbers: h.annotations.pinnedNumbers,
     comments: h.annotations.comments
-  }))), n = C((h) => h.coordSystem), o = de(), a = Sn(), i = Wo(), l = Ov(e), { store: c } = me(), u = A(() => {
+  }))), n = C((h) => h.coordSystem), o = de(), a = Sn(), i = Wo(), l = Hv(e), { store: c } = me(), u = A(() => {
     const h = /* @__PURE__ */ new Map();
     for (const f of t) h.set(f.id, f.at);
     for (const f of r) h.set(f.id, f.at);
@@ -5340,10 +5340,10 @@ var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o
     r,
     i
   ]), g = A(() => ba(l, e), [l, e]);
-  return F(() => {
+  return M(() => {
     const h = c.getState();
-    return h.publishPointerRegions(Or, g), () => {
-      h.publishPointerRegions(Or, []);
+    return h.publishPointerRegions(Hr, g), () => {
+      h.publishPointerRegions(Hr, []);
     };
   }, [c, g]), t.length === 0 && r.length === 0 ? null : /* @__PURE__ */ s("svg", {
     x: e.x,
@@ -5367,7 +5367,7 @@ var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o
           height: h.miniRect.height,
           overflow: "visible",
           children: /* @__PURE__ */ w("div", {
-            className: y ? Hr.hittable : Hr.inert,
+            className: y ? Or.hittable : Or.inert,
             style: Uv(m.label),
             children: [h.kind === "pinned-number" && /* @__PURE__ */ s("span", {
               className: "ph8bdc1",
@@ -5384,7 +5384,7 @@ var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o
               children: h.text
             })]
           })
-        }), /* @__PURE__ */ s(Hv, {
+        }), /* @__PURE__ */ s(Ov, {
           cx: h.anchorPx.x,
           cy: h.anchorPx.y,
           color: Vv(m.marker, p),
@@ -5429,7 +5429,7 @@ var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o
 }, Kv = 3.2, zv = ({ panelRect: e }) => {
   const t = Je(e).stickers, r = C((o) => o.config.appearance.textScale);
   if (t.length === 0) return null;
-  const n = Hn(Kv, r);
+  const n = On(Kv, r);
   return /* @__PURE__ */ s("svg", {
     x: e.x,
     y: e.y,
@@ -5470,7 +5470,7 @@ var Gv = (e, t, r, n) => t !== "comment" ? r : ki(r, 140, (o) => e.measureText(o
   return r <= 0 ? /* @__PURE__ */ s("g", {
     ...t,
     children: e
-  }) : /* @__PURE__ */ s(H.g, {
+  }) : /* @__PURE__ */ s(O.g, {
     ...t,
     initial: { opacity: 0 },
     animate: { opacity: 1 },
@@ -5918,7 +5918,7 @@ var Yo = (e, t) => {
     ]
   });
 }, bg = ({ layer: e, coordSystem: t, shouldAnimateTransitions: r, isDimmed: n, dimStyle: o, formattingLocale: a }) => {
-  const i = de(), l = ad(e.id), { colorScheme: c } = G(), u = I(e), d = i(e.geom, t.type);
+  const i = de(), l = ad(e.id), { colorScheme: c } = G(), u = T(e), d = i(e.geom, t.type);
   if (d === null) return null;
   const v = yt(d.render);
   return v.overlay ? null : /* @__PURE__ */ s("g", {
@@ -5965,7 +5965,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     t,
     o,
     n
-  ]), { colorScheme: d } = G(), v = I(t), g = A(() => Da(t), [t]), h = A(() => Ra({
+  ]), { colorScheme: d } = G(), v = T(t), g = A(() => Da(t), [t]), h = A(() => Ra({
     layer: t,
     numberFormat: c,
     locale: l
@@ -6040,7 +6040,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     primary: v.hover.primary,
     group: v.hover.group,
     related: v.hover.related
-  }))), i = de(), { colorScheme: l } = G(), c = I(e);
+  }))), i = de(), { colorScheme: l } = G(), c = T(e);
   if (n === null) return null;
   const u = i(e.geom, t.type);
   if (u === null || Gl(u)) return null;
@@ -6062,7 +6062,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     styleReaders: c
   });
 }, Pg = (e) => {
-  const t = I(e);
+  const t = T(e);
   return A(() => {
     const [r] = e.data;
     return r === void 0 ? {
@@ -6086,7 +6086,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     className: Tg,
     "data-testid": "geom-layers",
     ...Wd(),
-    children: n.map((a) => /* @__PURE__ */ w(jt, { children: [/* @__PURE__ */ s(Hg, {
+    children: n.map((a) => /* @__PURE__ */ w(jt, { children: [/* @__PURE__ */ s(Og, {
       layer: a,
       coordSystem: o,
       shouldAnimateTransitions: e,
@@ -6104,7 +6104,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
 }, Dg = (e) => xn({
   ...e.opacity === void 0 ? {} : { [Bg]: String(e.opacity) },
   ...e.saturation === void 0 ? {} : { [Ig]: `saturate(${e.saturation})` }
-}), Hg = ({ layer: e, coordSystem: t, shouldAnimateTransitions: r, panelRect: n, formattingLocale: o }) => {
+}), Og = ({ layer: e, coordSystem: t, shouldAnimateTransitions: r, panelRect: n, formattingLocale: o }) => {
   const a = de(), i = A(() => a(e.geom, t.type), [
     a,
     e,
@@ -6115,7 +6115,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     shouldAnimateTransitions: r,
     formattingLocale: o,
     colorScheme: u,
-    styleReaders: I(e)
+    styleReaders: T(e)
   }, v = i ? yt(i.render) : null, g = e.spatialKind === "render-hit-test", h = Fg(e);
   return /* @__PURE__ */ w("g", {
     className: h,
@@ -6149,13 +6149,13 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
       })
     ]
   });
-}, Og = "_17uhij30", Gg = ({ formattedAxes: e, plotRect: t, panelBorder: r, panelFrameRect: n, panelRect: o, axisRects: a, axisLabelRects: i, shouldAnimateTransitions: l, formattingLocale: c, plotBottomY: u, isFooterChromeReserved: d, isEditable: v }) => {
-  const g = T(null);
+}, Hg = "_17uhij30", Gg = ({ formattedAxes: e, plotRect: t, panelBorder: r, panelFrameRect: n, panelRect: o, axisRects: a, axisLabelRects: i, shouldAnimateTransitions: l, formattingLocale: c, plotBottomY: u, isFooterChromeReserved: d, isEditable: v }) => {
+  const g = I(null);
   nv(g);
   const h = ee("Grid", ug), f = ee("AxisTicks", cg), m = ee("AxisLabel", dg), p = A(() => Wt(n, t), [n, t]), y = A(() => Wt(o, t), [o, t]), b = A(() => Gr(a, t), [a, t]), R = A(() => Gr(i, t), [i, t]);
   return /* @__PURE__ */ w("svg", {
     ref: g,
-    className: Og,
+    className: Hg,
     width: t.width,
     height: t.height,
     style: { transform: `translate(${t.x}px, ${t.y}px)` },
@@ -6248,16 +6248,23 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
   if (e <= 0 || Number.isNaN(e) || !Number.isFinite(e)) throw new ga({ message: `Expected ${t} to be a positive, finite number, but got ${e}.` });
   return e;
 }, Vg = ({ sizing: e, onResize: t, children: r }) => {
-  const n = oo({ onResize: t });
-  if (e.mode === "keepAspectRatio") {
-    const { intrinsicSize: a, canRender: i, outerStyles: l, innerStyles: c } = Ug(e, n.width, !n.isDefault);
+  const n = oo({ onResize: t }), o = I(!1);
+  if (M(() => {
+    e.mode === "responsive" && (n.isDefault || n.width > 0 && n.height > 0 || o.current || (o.current = !0, console.warn(`[graphy] ZERO_SIZE_CONTAINER: GraphRenderer measured ${n.width}×${n.height}; the chart will not paint until the host has a positive width and height.`)));
+  }, [
+    e.mode,
+    n.isDefault,
+    n.width,
+    n.height
+  ]), e.mode === "keepAspectRatio") {
+    const { intrinsicSize: i, canRender: l, outerStyles: c, innerStyles: u } = Ug(e, n.width, !n.isDefault);
     return /* @__PURE__ */ s("div", {
       ref: n.setElement,
-      style: l,
+      style: c,
       "data-testid": "graph-sizer",
-      children: i && /* @__PURE__ */ s("div", {
-        style: c,
-        children: r(a)
+      children: l && /* @__PURE__ */ s("div", {
+        style: u,
+        children: r(i)
       })
     });
   }
@@ -6273,7 +6280,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
       height: e.height
     })
   });
-  const o = !n.isDefault && n.width > 0 && n.height > 0;
+  const a = !n.isDefault && n.width > 0 && n.height > 0;
   return /* @__PURE__ */ s("div", {
     ref: n.setElement,
     style: {
@@ -6281,7 +6288,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
       height: "100%"
     },
     "data-testid": "graph-sizer",
-    children: o && r({
+    children: a && r({
       width: n.width,
       height: n.height
     })
@@ -6312,8 +6319,8 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     height: 0
   }
 }, Yg = () => {
-  const [e, t] = O(null), [r, n] = O(null), [o, a] = O(Tt);
-  return F(() => {
+  const [e, t] = H(null), [r, n] = H(null), [o, a] = H(Tt);
+  return M(() => {
     const i = () => {
       const c = e ? {
         width: e.offsetWidth,
@@ -6398,7 +6405,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     content: Q.config.content,
     overflowStrategy: Q.config.panel.overflow,
     layoutConfig: Q.config.layout
-  }))), R = Ci(), { intro: S, transitions: P } = A(() => nc(r, R ?? !1), [r, R]), { headerRef: E, footerRef: N, measurements: M } = Yg(), { formattingLocale: W, colorScheme: K, themeOverrides: Te } = G(), Ae = o === "editable", [ye, Ko] = O(null), ar = A(() => Un(K, Te), [K, Te]), zo = ee("Header", Eu), jo = ee("Footer", xu), Xo = ee("Legend", Oh), qo = ee("Headline", qu), Jo = ee("EditorSurface", zg), ir = A(() => Wa({
+  }))), R = Ci(), { intro: S, transitions: P } = A(() => nc(r, R ?? !1), [r, R]), { headerRef: E, footerRef: N, measurements: F } = Yg(), { formattingLocale: W, colorScheme: K, themeOverrides: Te } = G(), Ae = o === "editable", [ye, Ko] = H(null), ar = A(() => Un(K, Te), [K, Te]), zo = ee("Header", Eu), jo = ee("Footer", xu), Xo = ee("Legend", Hh), qo = ee("Headline", qu), Jo = ee("EditorSurface", zg), ir = A(() => Wa({
     legends: l,
     numberFormat: u,
     parsingLocale: d,
@@ -6455,7 +6462,7 @@ var Sg = 4, kg = ({ renderer: e, layer: t, matchedLayer: r, overlayCandidates: n
     parsingLocale: d,
     formattedLegends: ir,
     containerSize: Ne,
-    externalMeasurements: M,
+    externalMeasurements: F,
     headline: xe,
     formattingLocale: W,
     annotations: g,
@@ -6585,7 +6592,7 @@ export {
   zh as C,
   Qs as Ct,
   To as D,
-  He as Dt,
+  Oe as Dt,
   Gu as E,
   L as Et,
   ue as F,
@@ -6597,7 +6604,7 @@ export {
   Bd as K,
   Ue as L,
   vu as M,
-  I as Mt,
+  T as Mt,
   qd as N,
   C as Nt,
   Eu as O,
@@ -6621,7 +6628,7 @@ export {
   If as a,
   mc as at,
   ov as b,
-  Ol as bt,
+  Hl as bt,
   Yv as c,
   ec as ct,
   Pf as d,