@graphysdk/react-renderer 1.8.1-beta.1786354953172 → 1.8.1-beta.1786366143449

package/dist/editable.mjs

@@ -1,33 +1,33 @@
-import { B as _e, D as he, E as Pt, F as It, I as xt, L as ke, M as es, N as T, Q as Tt, S as J, V as se, Z as At, b as M, c as Lt, d as W, et as Nt, f as ge, h as Cn, i as Ot, k as Me, l as Et, m as _t, n as F, o as Sn, p as Ae, r as kt, rt as B, s as Mt, t as Rt, tt as G, u as ve, v as Dt, x as X, y as Se } from "./history-chords-DdGqrRWz.js";
-import { g as zt } from "./font-values-CPxYeqns.js";
-import { AddAnnotationCommand as ye, AddHighlightCommand as Ft, BORDER_RADIUS_TOKENS as We, CONSTANT_VARIABLES as Ht, DEFAULT_BAR_BORDER_RADIUS as Vt, DEFAULT_POINT_SIZE as Kt, DEFAULT_STROKE_WIDTH as Gt, DIFFERENCE_ARROW_DEFAULTS as Bt, MAX_BAR_WIDTH as Ut, MIN_BAR_WIDTH as qt, RESTING_HOVER_STATE as yn, RemoveAnnotationCommand as Re, RemoveHighlightCommand as Wt, SetAppearanceCornerRadiusCommand as $t, SetAppearanceTextScaleCommand as Zt, SetAxisLabelCommand as Xt, SetAxisPositionCommand as jt, SetAxisTickModeCommand as Yt, SetAxisTicksVisibilityCommand as Qt, SetAxisVisibilityCommand as Jt, SetBarBorderRadiusCommand as er, SetBarWidthCommand as nr, SetContentCaptionCommand as tr, SetContentSourceCommand as rr, SetContentSubtitleCommand as ar, SetContentTitleCommand as or, SetDataLabelsFormatCommand as ir, SetGridLineStyleCommand as lr, SetGridLineWidthCommand as sr, SetGridVisibilityCommand as cr, SetHeadlineCompareWithCommand as dr, SetHeadlinePositionCommand as hr, SetHeadlineShowCommand as $e, SetHeadlineSizeCommand as ur, SetHighlightDimStyleCommand as mr, SetLegendAlignCommand as pr, SetLegendDisplayCommand as gr, SetLegendPositionCommand as vr, SetLineInterpolationCommand as fr, SetLineMissingValuesCommand as br, SetLineWidthCommand as Ze, SetNumberFormatAbbreviationCommand as Cr, SetNumberFormatDecimalsCommand as Xe, SetPointSizeCommand as Sr, SetPolarInnerRadiusCommand as yr, SetPolarStartAngleCommand as wr, SetScaleDomainCommand as pe, SetScaleReverseCommand as Pr, SetScaleTransformCommand as Ir, SetScaleZeroCommand as je, ToggleCategoryLabelsCommand as xr, ToggleContentVisibilityCommand as we, ToggleDataLabelsCommand as Tr, ToggleLineFillCommand as Ar, ToggleLinePointsVisibilityCommand as Lr, ToggleStackTotalsCommand as Nr, UpdateAnnotationCommand as wn, areAnchorsEqual as Pn, areEndpointsComparable as Or, buildEditMenuTriggerRegion as Er, buildLayerStyleAddress as _r, buildObservationAnchor as kr, buildObservationPredicate as Mr, canAnchorDirectLabels as Rr, canPlaceDataLabels as Dr, createObservationAnchorParser as zr, createStyleResolver as Fr, extractVariableName as Hr, filterLayersByGeoms as Le, findHighlightsAtObservation as Vr, findLayerByGeom as In, findObservationAttachment as Kr, findStyleRule as Gr, formatDifferenceLabel as Br, getColor as Ur, hasMultipleGroups as qr, inferDifferenceArrowEndpoints as Wr, isCompanionLayer as xn, isObservationAttachmentKind as $r, isPointWithinEditMenuTrigger as Tn, isSafeUrl as Zr, projectAnchorToPanel as Xr, readHighlightDimStyle as jr, resolveComparisonBasis as Yr, resolveObservationPoint as Ne, stepDifferenceArrowEndpoint as Qr, toPanelCursor as De } from "@graphysdk/viz-engine";
-import { createContext as ue, useCallback as fe, useContext as ae, useEffect as z, useId as de, useMemo as O, useRef as be, useState as $ } from "react";
-import { Fragment as q, jsx as n, jsxs as p } from "react/jsx-runtime";
-import { useShallow as ze } from "zustand/react/shallow";
-import { createPortal as Jr } from "react-dom";
+import { B as _e, D as he, E as It, F as Tt, I as At, L as Re, M as Ss, N as A, Q as Lt, S as J, V as se, Z as Ot, b as I, c as Nt, d as q, et as kt, f as ge, h as Sn, i as Mt, k as De, l as Et, m as _t, n as R, o as wn, p as Le, r as Rt, rt as G, s as Dt, t as zt, tt as K, u as ve, v as Ht, x as j, y as Se } from "./history-chords-C4ubfbkC.js";
+import { g as Vt } from "./font-values-CPxYeqns.js";
+import { AddAnnotationCommand as we, AddHighlightCommand as Ft, BORDER_RADIUS_TOKENS as Ze, CONSTANT_VARIABLES as Bt, DEFAULT_BAR_BORDER_RADIUS as Kt, DEFAULT_POINT_SIZE as Gt, DEFAULT_STROKE_WIDTH as Ut, DIFFERENCE_ARROW_DEFAULTS as Wt, MAX_BAR_WIDTH as qt, MIN_BAR_WIDTH as $t, RESTING_HOVER_STATE as xn, RemoveAnnotationCommand as ze, RemoveHighlightCommand as Zt, SetAppearanceCornerRadiusCommand as jt, SetAppearanceTextScaleCommand as Xt, SetAxisLabelCommand as Yt, SetAxisPositionCommand as Qt, SetAxisTickModeCommand as Jt, SetAxisTicksVisibilityCommand as er, SetAxisVisibilityCommand as nr, SetBarBorderRadiusCommand as tr, SetBarWidthCommand as rr, SetChartTypeCommand as ar, SetContentCaptionCommand as or, SetContentSourceCommand as ir, SetContentSubtitleCommand as lr, SetContentTitleCommand as sr, SetDataLabelsFormatCommand as cr, SetGridLineStyleCommand as dr, SetGridLineWidthCommand as hr, SetGridVisibilityCommand as ur, SetHeadlineCompareWithCommand as mr, SetHeadlinePositionCommand as pr, SetHeadlineShowCommand as je, SetHeadlineSizeCommand as gr, SetHighlightDimStyleCommand as vr, SetLegendAlignCommand as fr, SetLegendDisplayCommand as Cr, SetLegendPositionCommand as br, SetLineInterpolationCommand as yr, SetLineMissingValuesCommand as Sr, SetLineWidthCommand as Xe, SetNumberFormatAbbreviationCommand as wr, SetNumberFormatDecimalsCommand as Ye, SetPointSizeCommand as xr, SetPolarInnerRadiusCommand as Pr, SetPolarStartAngleCommand as Ir, SetScaleDomainCommand as pe, SetScaleReverseCommand as Tr, SetScaleTransformCommand as Ar, SetScaleZeroCommand as Qe, ToggleCategoryLabelsCommand as Lr, ToggleContentVisibilityCommand as xe, ToggleDataLabelsCommand as Or, ToggleLineFillCommand as Nr, ToggleLinePointsVisibilityCommand as kr, ToggleStackTotalsCommand as Mr, UpdateAnnotationCommand as Pn, areAnchorsEqual as In, areEndpointsComparable as Er, buildEditMenuTriggerRegion as _r, buildLayerStyleAddress as Rr, buildObservationAnchor as Dr, buildObservationPredicate as zr, canAnchorDirectLabels as Hr, canPlaceDataLabels as Vr, createObservationAnchorParser as Fr, createStyleResolver as Br, extractVariableName as Kr, filterLayersByGeoms as Oe, findHighlightsAtObservation as Gr, findLayerByGeom as Tn, findObservationAttachment as Ur, findStyleRule as Wr, formatDifferenceLabel as qr, getColor as $r, hasMultipleGroups as Zr, inferDifferenceArrowEndpoints as jr, isCompanionLayer as An, isObservationAttachmentKind as Xr, isPointWithinEditMenuTrigger as Ln, isSafeUrl as Yr, projectAnchorToPanel as Qr, readChartType as Jr, readHighlightDimStyle as ea, resolveComparisonBasis as na, resolveObservationPoint as Ne, stepDifferenceArrowEndpoint as ta, toPanelCursor as He } from "@graphysdk/viz-engine";
+import { createContext as ue, useCallback as fe, useContext as ae, useEffect as V, useId as de, useMemo as k, useRef as Ce, useState as $ } from "react";
+import { Fragment as W, jsx as n, jsxs as m } from "react/jsx-runtime";
+import { useShallow as Ve } from "zustand/react/shallow";
+import { createPortal as ra } from "react-dom";
 import re from "clsx";
-import { assignInlineVars as An } from "@vanilla-extract/dynamic";
-import { Menu as k } from "@base-ui/react/menu";
-import { Menu as j } from "@base-ui/react";
+import { assignInlineVars as On } from "@vanilla-extract/dynamic";
+import { Menu as _ } from "@base-ui/react/menu";
+import { Menu as X } from "@base-ui/react";
 import { Accordion as le } from "@base-ui/react/accordion";
-import { NumberField as Ye } from "@base-ui/react/number-field";
-import { Radio as Ln } from "@base-ui/react/radio";
-import { RadioGroup as Nn } from "@base-ui/react/radio-group";
+import { NumberField as Je } from "@base-ui/react/number-field";
+import { Radio as Nn } from "@base-ui/react/radio";
+import { RadioGroup as kn } from "@base-ui/react/radio-group";
 import { Select as U } from "@base-ui/react/select";
 import { Slider as oe } from "@base-ui/react/slider";
-import { Switch as Qe } from "@base-ui/react/switch";
-import { Input as ea } from "@base-ui/react/input";
-import './editable.css';var na = "data-graphy-chart-chrome", ta = "data-graphy-chart-menu", On = { [ta]: "" }, Ce = (e) => ({ [na]: e }), En = (e, t) => e instanceof Element && e.closest(`[data-graphy-chart-chrome="${CSS.escape(t)}"]`) !== null, ra = (e) => e instanceof Element && e.closest("[data-graphy-chart-menu]") !== null, aa = (e) => e instanceof Element && e.closest("[data-graphy-chart-chrome]") !== null, ce = (e, t, i) => e instanceof Node && (t.contains(e) || En(e, i)), oa = "cml7ha0", _n = ue(null), ia = ({ children: e }) => {
-  const { chartId: t } = B(), [i] = $(ke), [r, a] = $(null);
-  return i === null ? null : /* @__PURE__ */ p(q, { children: [Jr(/* @__PURE__ */ n("div", {
-    ref: a,
-    className: oa,
-    ...Ce(t)
+import { Switch as en } from "@base-ui/react/switch";
+import { Input as aa } from "@base-ui/react/input";
+import './editable.css';var oa = "data-graphy-chart-chrome", ia = "data-graphy-chart-menu", Mn = { [ia]: "" }, be = (e) => ({ [oa]: e }), En = (e, t) => e instanceof Element && e.closest(`[data-graphy-chart-chrome="${CSS.escape(t)}"]`) !== null, la = (e) => e instanceof Element && e.closest("[data-graphy-chart-menu]") !== null, sa = (e) => e instanceof Element && e.closest("[data-graphy-chart-chrome]") !== null, ce = (e, t, i) => e instanceof Node && (t.contains(e) || En(e, i)), ca = "cml7ha0", _n = ue(null), da = ({ children: e }) => {
+  const { chartId: t } = G(), [i] = $(Re), [r, o] = $(null);
+  return i === null ? null : /* @__PURE__ */ m(W, { children: [ra(/* @__PURE__ */ n("div", {
+    ref: o,
+    className: ca,
+    ...be(t)
   }), i), /* @__PURE__ */ n(_n.Provider, {
     value: r,
     children: e
   })] });
-}, Fe = () => ae(_n), kn = (e) => /* @__PURE__ */ p(M, {
+}, Fe = () => ae(_n), Rn = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -53,39 +53,39 @@ import './editable.css';var na = "data-graphy-chart-chrome", ta = "data-graphy-c
     })
   ]
 });
-var Mn = "efjmb40", Rn = "efjmb41", ee = "efjmb42", ne = "efjmb43", la = "efjmb44", sa = "efjmb45", ca = /* @__PURE__ */ new Set([
+var Dn = "efjmb40", zn = "efjmb41", ee = "efjmb42", ne = "efjmb43", ha = "efjmb44", ua = "efjmb45", ma = /* @__PURE__ */ new Set([
   "item-press",
   "escape-key",
   "outside-press",
   "close-press",
   "sibling-open",
   "trigger-press"
-]), He = ({ label: e, icon: t, onOpened: i, children: r }) => {
-  const a = Fe(), [o, l] = $(!1), c = (s, u) => {
-    s ? (l(!0), i?.()) : ca.has(u.reason) && l(!1);
+]), Be = ({ label: e, icon: t, onOpened: i, children: r }) => {
+  const o = Fe(), [a, l] = $(!1), c = (s, u) => {
+    s ? (l(!0), i?.()) : ma.has(u.reason) && l(!1);
   };
-  return /* @__PURE__ */ p(j.SubmenuRoot, {
-    open: o,
+  return /* @__PURE__ */ m(X.SubmenuRoot, {
+    open: a,
     onOpenChange: c,
-    children: [/* @__PURE__ */ n(da, {
+    children: [/* @__PURE__ */ n(pa, {
       label: e,
       icon: t
-    }), /* @__PURE__ */ n(j.Portal, {
-      container: a,
-      children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(j.Positioner, {
+    }), /* @__PURE__ */ n(X.Portal, {
+      container: o,
+      children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(X.Positioner, {
         side: "right",
         align: "start",
         sideOffset: 4,
-        className: Mn,
-        ...On,
-        children: /* @__PURE__ */ n(j.Popup, {
-          className: Rn,
+        className: Dn,
+        ...Mn,
+        children: /* @__PURE__ */ n(X.Popup, {
+          className: zn,
           children: r
         })
       }) })
     })]
   });
-}, da = ({ label: e, icon: t }) => /* @__PURE__ */ p(j.SubmenuTrigger, {
+}, pa = ({ label: e, icon: t }) => /* @__PURE__ */ m(X.SubmenuTrigger, {
   className: ee,
   openOnHover: !1,
   children: [
@@ -95,31 +95,31 @@ var Mn = "efjmb40", Rn = "efjmb41", ee = "efjmb42", ne = "efjmb43", la = "efjmb4
       children: e
     }),
     /* @__PURE__ */ n("span", {
-      className: sa,
+      className: ua,
       children: /* @__PURE__ */ n(Se, { size: "sm" })
     })
   ]
-}), ha = "_1qe7q450", ua = "_1qe7q451", ma = "_1qe7q452", pa = ({ label: e, placeholder: t, addLabel: i, at: r, onRequestClose: a }) => {
-  const o = be(null), [l, c] = $(""), { dispatch: s } = J(), u = l.trim(), d = () => {
-    u.length !== 0 && (s(new ye({
+}), ga = "_1qe7q450", va = "_1qe7q451", fa = "_1qe7q452", Ca = ({ label: e, placeholder: t, addLabel: i, at: r, onRequestClose: o }) => {
+  const a = Ce(null), [l, c] = $(""), { dispatch: s } = J(), u = l.trim(), d = () => {
+    u.length !== 0 && (s(new we({
       kind: "comment",
       annotation: {
         at: r,
-        content: ga(u)
+        content: ba(u)
       }
-    })), a());
+    })), o());
   };
-  return /* @__PURE__ */ n(He, {
+  return /* @__PURE__ */ n(Be, {
     label: e,
-    icon: /* @__PURE__ */ n(kn, {}),
+    icon: /* @__PURE__ */ n(Rn, {}),
     onOpened: () => {
-      requestAnimationFrame(() => o.current?.focus());
+      requestAnimationFrame(() => a.current?.focus());
     },
-    children: /* @__PURE__ */ p("div", {
-      className: ha,
+    children: /* @__PURE__ */ m("div", {
+      className: ga,
       children: [/* @__PURE__ */ n("input", {
-        ref: o,
-        className: ua,
+        ref: a,
+        className: va,
         value: l,
         placeholder: t,
         onChange: (g) => {
@@ -130,14 +130,14 @@ var Mn = "efjmb40", Rn = "efjmb41", ee = "efjmb42", ne = "efjmb43", la = "efjmb4
         }
       }), /* @__PURE__ */ n("button", {
         type: "button",
-        className: ma,
+        className: fa,
         disabled: u.length === 0,
         onClick: d,
         children: i
       })]
     })
   });
-}, ga = (e) => ({
+}, ba = (e) => ({
   type: "doc",
   content: [{
     type: "paragraph",
@@ -146,7 +146,7 @@ var Mn = "efjmb40", Rn = "efjmb41", ee = "efjmb42", ne = "efjmb43", la = "efjmb4
       text: e
     }]
   }]
-}), va = (e) => /* @__PURE__ */ n(M, {
+}), ya = (e) => /* @__PURE__ */ n(I, {
   viewBox: "0 0 15 14",
   ...e,
   children: /* @__PURE__ */ n("path", {
@@ -154,42 +154,42 @@ var Mn = "efjmb40", Rn = "efjmb41", ee = "efjmb42", ne = "efjmb43", la = "efjmb4
     fill: "currentColor",
     fillOpacity: "0.8"
   })
-}), fa = "relative-difference", ba = ({ label: e, layer: t, at: i, onRequestClose: r }) => {
-  const { dispatch: a } = J(), o = G((s) => s.coordSystem), l = O(() => Wr({
+}), Sa = "relative-difference", wa = ({ label: e, layer: t, at: i, onRequestClose: r }) => {
+  const { dispatch: o } = J(), a = K((s) => s.coordSystem), l = k(() => jr({
     layer: t,
     at: i,
-    coordSystem: o
+    coordSystem: a
   }), [
     t,
     i,
-    o
+    a
   ]);
   if (l === null) return null;
   const c = () => {
-    a(new ye({
+    o(new we({
       kind: "differenceArrow",
       annotation: {
-        ...Bt,
+        ...Wt,
         ...l,
-        label: fa
+        label: Sa
       }
     })), r();
   };
-  return /* @__PURE__ */ p(k.Item, {
+  return /* @__PURE__ */ m(_.Item, {
     className: ee,
     onClick: c,
-    children: [/* @__PURE__ */ n(va, {}), /* @__PURE__ */ n("span", {
+    children: [/* @__PURE__ */ n(ya, {}), /* @__PURE__ */ n("span", {
       className: ne,
       children: e
     })]
   });
 };
-function Ca(e, t) {
-  if (e.type === "polar" && !Sa(t)) return [{
+function xa(e, t) {
+  if (e.type === "polar" && !Pa(t)) return [{
     scope: "series",
     labelKey: "pieSlice"
   }];
-  const i = qr(t.data, t.mapping);
+  const i = Zr(t.data, t.mapping);
   switch (t.geom) {
     case "bar": {
       const r = [{
@@ -197,10 +197,10 @@ function Ca(e, t) {
         labelKey: "bar"
       }];
       if (i) {
-        const a = t.position === "stack" || t.position === "fill";
+        const o = t.position === "stack" || t.position === "fill";
         r.push({
           scope: "x-value",
-          labelKey: a ? "barStack" : "barGroup"
+          labelKey: o ? "barStack" : "barGroup"
         }), r.push({
           scope: "series",
           labelKey: "barSeries"
@@ -233,10 +233,10 @@ function Ca(e, t) {
       return [];
   }
 }
-var Sa = (e) => {
-  const t = Hr(e.mapping.x);
-  return t !== null && t !== Ht.x;
-}, ya = (e) => /* @__PURE__ */ p(M, {
+var Pa = (e) => {
+  const t = Kr(e.mapping.x);
+  return t !== null && t !== Bt.x;
+}, Ia = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -275,7 +275,7 @@ var Sa = (e) => {
       rx: ".533"
     })
   ]
-}), wa = (e) => /* @__PURE__ */ p(M, {
+}), Ta = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -314,7 +314,7 @@ var Sa = (e) => {
       rx: ".533"
     })
   ]
-}), Pa = (e) => /* @__PURE__ */ p(M, {
+}), Aa = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -353,7 +353,7 @@ var Sa = (e) => {
       rx: ".533"
     })
   ]
-}), Ia = (e) => /* @__PURE__ */ p(M, {
+}), La = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -373,7 +373,7 @@ var Sa = (e) => {
       d: "M11.733 10.074H16v5.408a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.519-.518zM11.733 9.481H16V.52A.52.52 0 0 0 15.482 0h-3.23a.52.52 0 0 0-.519.519z"
     })
   ]
-}), xa = (e) => /* @__PURE__ */ p(M, {
+}), Oa = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -407,7 +407,7 @@ var Sa = (e) => {
       d: "M5.29 6.62a1.3 1.3 0 0 1-.424-.075 1 1 0 0 1-.373-.244 1.2 1.2 0 0 1-.262-.45 2.1 2.1 0 0 1-.096-.699q0-.389.082-.693.083-.304.238-.514a1.05 1.05 0 0 1 .374-.322q.22-.11.492-.11.285 0 .505.112a.973.973 0 0 1 .526.744h-.54a.5.5 0 0 0-.17-.277.5.5 0 0 0-.321-.105.54.54 0 0 0-.485.273q-.168.273-.17.75h.021a.8.8 0 0 1 .188-.223.92.92 0 0 1 .569-.195.91.91 0 0 1 .813.477q.125.222.123.509 0 .297-.136.536a1 1 0 0 1-.383.372 1.15 1.15 0 0 1-.571.134m-.003-.443a.54.54 0 0 0 .288-.078.57.57 0 0 0 .2-.211.6.6 0 0 0 .073-.299.6.6 0 0 0-.07-.294.54.54 0 0 0-.484-.285.55.55 0 0 0-.403.173.596.596 0 0 0 .108.914.53.53 0 0 0 .288.08M6.88 6.579v-.396l1.05-1.03q.15-.15.25-.27a1 1 0 0 0 .151-.229.6.6 0 0 0 .05-.236.432.432 0 0 0-.244-.405.6.6 0 0 0-.258-.056q-.15 0-.261.062a.43.43 0 0 0-.175.173.56.56 0 0 0-.06.267H6.86q0-.288.132-.5a.9.9 0 0 1 .362-.33q.231-.117.532-.117.303 0 .534.114.23.114.358.312a.8.8 0 0 1 .128.452.9.9 0 0 1-.065.334q-.065.164-.229.363-.162.2-.456.483l-.522.53v.021h1.318v.458zM10.57 6.62a1.3 1.3 0 0 1-.423-.075 1 1 0 0 1-.373-.244 1.2 1.2 0 0 1-.263-.45 2.1 2.1 0 0 1-.096-.699q0-.389.083-.693t.238-.514a1.05 1.05 0 0 1 .374-.322q.219-.11.492-.11.285 0 .505.112a.973.973 0 0 1 .526.744h-.54a.5.5 0 0 0-.17-.277.5.5 0 0 0-.322-.105.54.54 0 0 0-.484.273q-.168.273-.17.75h.02a.8.8 0 0 1 .188-.223.92.92 0 0 1 .569-.195.91.91 0 0 1 .814.477q.125.222.123.509 0 .297-.136.536a1 1 0 0 1-.383.372 1.15 1.15 0 0 1-.572.134m-.002-.443a.54.54 0 0 0 .288-.078.57.57 0 0 0 .2-.211.6.6 0 0 0 .073-.299.6.6 0 0 0-.071-.294.54.54 0 0 0-.483-.285.54.54 0 0 0-.403.173.597.597 0 0 0 .107.914.53.53 0 0 0 .289.08"
     })
   ]
-}), Ta = (e) => /* @__PURE__ */ p(M, {
+}), Na = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -448,7 +448,7 @@ var Sa = (e) => {
       fillOpacity: "0.8"
     })
   ]
-}), Aa = (e) => /* @__PURE__ */ p(M, {
+}), ka = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -470,7 +470,7 @@ var Sa = (e) => {
       d: "M15.999 8a8 8 0 0 1-7.588 7.989l-.412.01V8z"
     })
   ]
-}), La = (e) => /* @__PURE__ */ p(M, {
+}), Ma = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -531,7 +531,7 @@ var Sa = (e) => {
       transform: "matrix(-1 0 0 1 15.933 .533)"
     })
   ]
-}), Na = (e) => /* @__PURE__ */ p(M, {
+}), Ea = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -592,20 +592,20 @@ var Sa = (e) => {
       transform: "matrix(-1 0 0 1 15.933 .533)"
     })
   ]
-}), Oa = {
-  bar: ya,
-  barGroup: wa,
-  barStack: Ia,
-  barSeries: Pa,
-  linePoint: xa,
-  lineSeries: Ta,
-  scatterPoint: La,
-  scatterSeries: Na,
-  pieSlice: Aa
-}, Dn = ({ labelKey: e }) => {
-  const t = Oa[e];
+}), _a = {
+  bar: Ia,
+  barGroup: Ta,
+  barStack: La,
+  barSeries: Aa,
+  linePoint: Oa,
+  lineSeries: Na,
+  scatterPoint: Ma,
+  scatterSeries: Ea,
+  pieSlice: ka
+}, Hn = ({ labelKey: e }) => {
+  const t = _a[e];
   return /* @__PURE__ */ n(t, {});
-}, zn = (e) => /* @__PURE__ */ p(M, {
+}, Vn = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [/* @__PURE__ */ n("path", {
@@ -618,70 +618,70 @@ var Sa = (e) => {
     fill: "currentColor",
     fillOpacity: "0.8"
   })]
-}), Ea = ({ label: e, options: t, onSelect: i }) => {
-  const r = T();
-  return /* @__PURE__ */ n(He, {
+}), Ra = ({ label: e, options: t, onSelect: i }) => {
+  const r = A();
+  return /* @__PURE__ */ n(Be, {
     label: e,
-    icon: /* @__PURE__ */ n(zn, {}),
-    children: t.map((a) => /* @__PURE__ */ p(j.Item, {
+    icon: /* @__PURE__ */ n(Vn, {}),
+    children: t.map((o) => /* @__PURE__ */ m(X.Item, {
       className: ee,
-      onClick: () => i(a.scope),
-      children: [/* @__PURE__ */ n(Dn, { labelKey: a.labelKey }), /* @__PURE__ */ n("span", {
+      onClick: () => i(o.scope),
+      children: [/* @__PURE__ */ n(Hn, { labelKey: o.labelKey }), /* @__PURE__ */ n("span", {
         className: ne,
-        children: r(`graph.annotations.highlights.labels.${a.labelKey}`)
+        children: r(`graph.annotations.highlights.labels.${o.labelKey}`)
       })]
-    }, a.scope))
+    }, o.scope))
   });
-}, _a = ({ label: e, layer: t, observation: i, highlights: r, onRequestClose: a }) => {
-  const o = T(), { dispatch: l } = J(), c = G((m) => m.coordSystem), s = O(() => Mr(t, i), [t, i]), u = O(() => Ca(c, t), [c, t]), d = O(() => {
-    const m = new Set(r.map((g) => g.scope));
-    return u.filter((g) => !m.has(g.scope));
+}, Da = ({ label: e, layer: t, observation: i, highlights: r, onRequestClose: o }) => {
+  const a = A(), { dispatch: l } = J(), c = K((p) => p.coordSystem), s = k(() => zr(t, i), [t, i]), u = k(() => xa(c, t), [c, t]), d = k(() => {
+    const p = new Set(r.map((g) => g.scope));
+    return u.filter((g) => !p.has(g.scope));
   }, [u, r]), [h] = d;
   if (s === null || h === void 0) return null;
-  const v = (m) => {
+  const v = (p) => {
     l(new Ft({
       predicate: s,
-      scope: m,
+      scope: p,
       layerId: t.id
-    })), a();
+    })), o();
   };
   if (d.length === 1) {
-    const m = u.length === 1 ? e : o("graph.annotations.baseMenu.highlightWithLabel", { label: o(`graph.annotations.highlights.labels.${h.labelKey}`) });
-    return /* @__PURE__ */ p(j.Item, {
+    const p = u.length === 1 ? e : a("graph.annotations.baseMenu.highlightWithLabel", { label: a(`graph.annotations.highlights.labels.${h.labelKey}`) });
+    return /* @__PURE__ */ m(X.Item, {
       className: ee,
       onClick: () => v(h.scope),
-      children: [/* @__PURE__ */ n(Dn, { labelKey: h.labelKey }), /* @__PURE__ */ n("span", {
+      children: [/* @__PURE__ */ n(Hn, { labelKey: h.labelKey }), /* @__PURE__ */ n("span", {
         className: ne,
-        children: m
+        children: p
       })]
     });
   }
-  return /* @__PURE__ */ n(Ea, {
+  return /* @__PURE__ */ n(Ra, {
     label: e,
     options: d,
     onSelect: v
   });
-}, ka = "_1aafi1g0", Ma = "_1aafi1g1", Fn = ({ children: e }) => /* @__PURE__ */ p("span", {
-  className: ka,
+}, za = "_1aafi1g0", Ha = "_1aafi1g1", Fn = ({ children: e }) => /* @__PURE__ */ m("span", {
+  className: za,
   "aria-hidden": "true",
-  children: [e, /* @__PURE__ */ n("span", { className: Ma })]
-}), Ra = ({ label: e, highlights: t, onRequestClose: i }) => {
-  const { dispatch: r } = J(), a = t.at(-1);
-  if (a === void 0) return null;
-  const o = () => {
-    r(new Wt({ id: a.id })), i();
+  children: [e, /* @__PURE__ */ n("span", { className: Ha })]
+}), Va = ({ label: e, highlights: t, onRequestClose: i }) => {
+  const { dispatch: r } = J(), o = t.at(-1);
+  if (o === void 0) return null;
+  const a = () => {
+    r(new Zt({ id: o.id })), i();
   };
-  return /* @__PURE__ */ p(k.Item, {
+  return /* @__PURE__ */ m(_.Item, {
     className: ee,
-    onClick: o,
-    children: [/* @__PURE__ */ n(Fn, { children: /* @__PURE__ */ n(zn, {}) }), /* @__PURE__ */ n("span", {
+    onClick: a,
+    children: [/* @__PURE__ */ n(Fn, { children: /* @__PURE__ */ n(Vn, {}) }), /* @__PURE__ */ n("span", {
       className: ne,
       children: e
     })]
   });
-}, Da = (e, t) => {
-  const i = G((a) => a.spec.highlights), r = G((a) => a.config.parsingLocale);
-  return O(() => Vr({
+}, Fa = (e, t) => {
+  const i = K((o) => o.spec.highlights), r = K((o) => o.config.parsingLocale);
+  return k(() => Gr({
     layer: e,
     highlights: i,
     observation: t,
@@ -692,7 +692,7 @@ var Sa = (e) => {
     t,
     r
   ]);
-}, Hn = (e) => /* @__PURE__ */ p(M, {
+}, Bn = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -715,22 +715,22 @@ var Sa = (e) => {
       fillOpacity: "0.8"
     })
   ]
-}), za = ({ label: e, at: t, onRequestClose: i }) => {
-  const { dispatch: r } = J(), a = () => {
-    r(new ye({
+}), Ba = ({ label: e, at: t, onRequestClose: i }) => {
+  const { dispatch: r } = J(), o = () => {
+    r(new we({
       kind: "pinnedNumber",
       annotation: { at: t }
     })), i();
   };
-  return /* @__PURE__ */ p(k.Item, {
+  return /* @__PURE__ */ m(_.Item, {
     className: ee,
-    onClick: a,
-    children: [/* @__PURE__ */ n(Hn, {}), /* @__PURE__ */ n("span", {
+    onClick: o,
+    children: [/* @__PURE__ */ n(Bn, {}), /* @__PURE__ */ n("span", {
       className: ne,
       children: e
     })]
   });
-}, Vn = (e) => /* @__PURE__ */ p(M, {
+}, Kn = (e) => /* @__PURE__ */ m(I, {
   viewBox: "0 0 16 16",
   ...e,
   children: [
@@ -763,69 +763,69 @@ var Sa = (e) => {
       fillOpacity: "0.8"
     })
   ]
-}), Kn = {
+}), Gn = {
   pinnedNumber: {
-    icon: Hn,
+    icon: Bn,
     labelKey: "graph.annotations.baseMenu.unpinNumber"
   },
   comment: {
-    icon: kn,
+    icon: Rn,
     labelKey: "graph.annotations.baseMenu.removeAnnotation"
   },
   sticker: {
-    icon: Vn,
+    icon: Kn,
     labelKey: "graph.annotations.baseMenu.removeSticker"
   },
   image: null
-}, Fa = (e) => $r(e.kind) && Kn[e.kind] !== null, Ha = ({ attachment: e, onRequestClose: t }) => {
-  const i = T(), { dispatch: r } = J(), { icon: a, labelKey: o } = Kn[e.kind], l = () => {
-    r(new Re({ id: e.annotation.id })), t();
+}, Ka = (e) => Xr(e.kind) && Gn[e.kind] !== null, Ga = ({ attachment: e, onRequestClose: t }) => {
+  const i = A(), { dispatch: r } = J(), { icon: o, labelKey: a } = Gn[e.kind], l = () => {
+    r(new ze({ id: e.annotation.id })), t();
   };
-  return /* @__PURE__ */ p(k.Item, {
+  return /* @__PURE__ */ m(_.Item, {
     className: ee,
     onClick: l,
-    children: [/* @__PURE__ */ n(Fn, { children: /* @__PURE__ */ n(a, {}) }), /* @__PURE__ */ n("span", {
+    children: [/* @__PURE__ */ n(Fn, { children: /* @__PURE__ */ n(o, {}) }), /* @__PURE__ */ n("span", {
       className: ne,
-      children: i(o)
+      children: i(a)
     })]
   });
-}, Va = "ceeojg0", Ka = "ceeojg1", Ga = "ceeojg2", Ba = ({ label: e, at: t, onRequestClose: i }) => {
-  const { dispatch: r } = J(), a = (o) => {
-    r(new ye({
+}, Ua = "ceeojg0", Wa = "ceeojg1", qa = "ceeojg2", $a = ({ label: e, at: t, onRequestClose: i }) => {
+  const { dispatch: r } = J(), o = (a) => {
+    r(new we({
       kind: "sticker",
       annotation: {
         at: {
           anchorType: "observation",
           ...t
         },
-        sticker: o
+        sticker: a
       }
     })), i();
   };
-  return /* @__PURE__ */ n(He, {
+  return /* @__PURE__ */ n(Be, {
     label: e,
-    icon: /* @__PURE__ */ n(Vn, {}),
+    icon: /* @__PURE__ */ n(Kn, {}),
     children: /* @__PURE__ */ n("div", {
-      className: Va,
-      children: Object.entries(Mt).map(([o, l]) => /* @__PURE__ */ n(j.Item, {
-        className: Ka,
-        "aria-label": o,
-        onClick: () => a(o),
+      className: Ua,
+      children: Object.entries(Dt).map(([a, l]) => /* @__PURE__ */ n(X.Item, {
+        className: Wa,
+        "aria-label": a,
+        onClick: () => o(a),
         children: /* @__PURE__ */ n("img", {
-          className: Ga,
+          className: qa,
           src: l.src,
-          alt: o
+          alt: a
         })
-      }, o))
+      }, a))
     })
   });
-}, Ua = ({ interaction: e, panelOrigin: t }) => {
-  const i = W(), r = ve((o) => o.menuTrigger);
+}, Za = ({ interaction: e, panelOrigin: t }) => {
+  const i = q(), r = ve((a) => a.menuTrigger);
   if (e.kind !== "menu" || r === null) return null;
-  const a = () => {
+  const o = () => {
     i.getState().releaseInteraction("menu");
   };
-  return /* @__PURE__ */ n(qa, {
+  return /* @__PURE__ */ n(ja, {
     trigger: {
       x: t.x + r.center.x,
       y: t.y + r.center.y,
@@ -834,104 +834,104 @@ var Sa = (e) => {
     layer: e.anchor.layer,
     at: e.anchor.at,
     observation: e.anchor.observation,
-    onClose: a
+    onClose: o
   });
-}, qa = ({ trigger: e, layer: t, at: i, observation: r, onClose: a }) => {
-  const o = T(), l = Fe(), c = G((f) => f.spec.annotations), s = G((f) => f.config.parsingLocale), u = $a(), { x: d, y: h, radius: v } = e, m = O(() => Wa(d, h, v), [
+}, ja = ({ trigger: e, layer: t, at: i, observation: r, onClose: o }) => {
+  const a = A(), l = Fe(), c = K((f) => f.spec.annotations), s = K((f) => f.config.parsingLocale), u = Ya(), { x: d, y: h, radius: v } = e, p = k(() => Xa(d, h, v), [
     d,
     h,
     v
-  ]), g = Kr(c, i, O(() => zr(t, s), [t, s])), y = g !== null && Fa(g) ? g : null, I = Da(t, r), S = (f, P) => {
-    !f && Za(P.reason) && a();
+  ]), g = Ur(c, i, k(() => Fr(t, s), [t, s])), S = g !== null && Ka(g) ? g : null, P = Fa(t, r), y = (f, x) => {
+    !f && Qa(x.reason) && o();
   };
-  return /* @__PURE__ */ n(k.Root, {
+  return /* @__PURE__ */ n(_.Root, {
     open: u,
     modal: !1,
-    onOpenChange: S,
-    children: /* @__PURE__ */ n(k.Portal, {
+    onOpenChange: y,
+    children: /* @__PURE__ */ n(_.Portal, {
       container: l,
-      children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(k.Positioner, {
-        anchor: m,
+      children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(_.Positioner, {
+        anchor: p,
         side: "right",
         align: "start",
         sideOffset: 8,
-        className: Mn,
-        ...On,
-        children: /* @__PURE__ */ p(k.Popup, {
-          className: Rn,
+        className: Dn,
+        ...Mn,
+        children: /* @__PURE__ */ m(_.Popup, {
+          className: zn,
           "data-testid": "observation-menu",
           children: [
-            y !== null && /* @__PURE__ */ n(Ha, {
-              attachment: y,
-              onRequestClose: a
+            S !== null && /* @__PURE__ */ n(Ga, {
+              attachment: S,
+              onRequestClose: o
             }),
-            /* @__PURE__ */ n(Ra, {
-              label: o("graph.annotations.baseMenu.removeHighlight"),
-              highlights: I,
-              onRequestClose: a
+            /* @__PURE__ */ n(Va, {
+              label: a("graph.annotations.baseMenu.removeHighlight"),
+              highlights: P,
+              onRequestClose: o
             }),
-            /* @__PURE__ */ n(k.Separator, { className: la }),
-            y === null && /* @__PURE__ */ p(q, { children: [
-              /* @__PURE__ */ n(za, {
-                label: o("graph.annotations.baseMenu.pinNumber"),
+            /* @__PURE__ */ n(_.Separator, { className: ha }),
+            S === null && /* @__PURE__ */ m(W, { children: [
+              /* @__PURE__ */ n(Ba, {
+                label: a("graph.annotations.baseMenu.pinNumber"),
                 at: i,
-                onRequestClose: a
+                onRequestClose: o
               }),
-              /* @__PURE__ */ n(pa, {
-                label: o("graph.annotations.baseMenu.annotate"),
-                placeholder: o("graph.annotations.textMenu.placeholder"),
-                addLabel: o("graph.annotations.textMenu.addButton"),
+              /* @__PURE__ */ n(Ca, {
+                label: a("graph.annotations.baseMenu.annotate"),
+                placeholder: a("graph.annotations.textMenu.placeholder"),
+                addLabel: a("graph.annotations.textMenu.addButton"),
                 at: i,
-                onRequestClose: a
+                onRequestClose: o
               }),
-              /* @__PURE__ */ n(Ba, {
-                label: o("graph.annotations.baseMenu.addSticker"),
+              /* @__PURE__ */ n($a, {
+                label: a("graph.annotations.baseMenu.addSticker"),
                 at: i,
-                onRequestClose: a
+                onRequestClose: o
               })
             ] }),
-            t.highlight !== null && /* @__PURE__ */ n(_a, {
-              label: o("graph.annotations.baseMenu.highlight"),
+            t.highlight !== null && /* @__PURE__ */ n(Da, {
+              label: a("graph.annotations.baseMenu.highlight"),
               layer: t,
               observation: r,
-              highlights: I,
-              onRequestClose: a
+              highlights: P,
+              onRequestClose: o
             }),
-            /* @__PURE__ */ n(ba, {
-              label: o("graph.annotations.baseMenu.differenceArrow"),
+            /* @__PURE__ */ n(wa, {
+              label: a("graph.annotations.baseMenu.differenceArrow"),
               layer: t,
               at: i,
-              onRequestClose: a
+              onRequestClose: o
             })
           ]
         })
       }) })
     })
   });
-}, Wa = (e, t, i) => ({ getBoundingClientRect: () => new DOMRect(e - i, t - i, i * 2, i * 2) }), $a = () => {
+}, Xa = (e, t, i) => ({ getBoundingClientRect: () => new DOMRect(e - i, t - i, i * 2, i * 2) }), Ya = () => {
   const [e, t] = $(!1);
-  return z(() => {
+  return V(() => {
     t(!0);
   }, []), e;
-}, Za = (e) => e === "outside-press" || e === "escape-key" || e === "item-press", Xa = () => {
-  const e = Sn();
-  return Gn(e);
-}, Gn = (e) => {
+}, Qa = (e) => e === "outside-press" || e === "escape-key" || e === "item-press", Ja = () => {
+  const e = wn();
+  return Un(e);
+}, Un = (e) => {
   if (e.length !== 1) return null;
   const [t] = e;
   return t?.kind === "annotation" ? t.id : null;
-}, ja = (e) => /* @__PURE__ */ n(M, {
+}, eo = (e) => /* @__PURE__ */ n(I, {
   ...e,
-  children: /* @__PURE__ */ p("g", {
+  children: /* @__PURE__ */ m("g", {
     stroke: "currentColor",
     strokeWidth: 2,
     strokeLinecap: "round",
     strokeLinejoin: "round",
     children: [/* @__PURE__ */ n("path", { d: "M4 9h16m-4-4 4 4" }), /* @__PURE__ */ n("path", { d: "M20 15H4m4 4-4-4" })]
   })
-}), Ya = (e) => /* @__PURE__ */ n(M, {
+}), no = (e) => /* @__PURE__ */ n(I, {
   ...e,
-  children: /* @__PURE__ */ p("g", {
+  children: /* @__PURE__ */ m("g", {
     stroke: "currentColor",
     strokeWidth: 2,
     strokeLinecap: "round",
@@ -943,43 +943,43 @@ var Sa = (e) => {
       /* @__PURE__ */ n("path", { d: "M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2" })
     ]
   })
-}), Qa = { kind: "chrome-popup" }, Ja = "var(--q7gcrz0)", eo = "var(--q7gcrz1)", no = "q7gcrz2", to = "q7gcrz3";
-var ro = "q7gcrz5", ao = "q7gcrz6", oo = "q7gcrz7", io = "q7gcrz8", Bn = "q7gcrz9", lo = "q7gcrza";
-var Je = "q7gcrzd q7gcrzc", Un = "q7gcrze q7gcrzc", so = [
+}), to = { kind: "chrome-popup" }, ro = "var(--q7gcrz0)", ao = "var(--q7gcrz1)", oo = "q7gcrz2", io = "q7gcrz3";
+var lo = "q7gcrz5", so = "q7gcrz6", co = "q7gcrz7", ho = "q7gcrz8", Wn = "q7gcrz9", uo = "q7gcrza";
+var nn = "q7gcrzd q7gcrzc", qn = "q7gcrze q7gcrzc", mo = [
   "absolute-difference",
   "relative-difference",
   "proportion"
-], en = ["absolute-difference", "relative-difference"], co = ["relative-difference", "proportion"], ho = {
+], tn = ["absolute-difference", "relative-difference"], po = ["relative-difference", "proportion"], go = {
   "absolute-difference": "graph.annotations.differenceArrowToolbar.labelKind.absoluteDifference",
   "relative-difference": "graph.annotations.differenceArrowToolbar.labelKind.relativeDifference",
   proportion: "graph.annotations.differenceArrowToolbar.labelKind.proportion"
-}, uo = (e) => {
-  const { formattingLocale: t } = B(), i = G((a) => a.config.parsingLocale), r = t ?? i;
-  return O(() => {
-    const a = Or(e.start, e.end);
-    return so.filter((o) => a || !en.includes(o) || o === e.label).map((o) => ({
-      kind: o,
-      nameKey: ho[o],
-      preview: Br({
+}, vo = (e) => {
+  const { formattingLocale: t } = G(), i = K((o) => o.config.parsingLocale), r = t ?? i;
+  return k(() => {
+    const o = Er(e.start, e.end);
+    return mo.filter((a) => o || !tn.includes(a) || a === e.label).map((a) => ({
+      kind: a,
+      nameKey: go[a],
+      preview: qr({
         locale: r,
-        kind: o,
+        kind: a,
         startValue: e.start.measurementValue,
         endValue: e.end.measurementValue,
         valueFormat: e.start.valueFormat
       }),
-      isPickable: a || !en.includes(o),
-      isSuspect: co.includes(o) && e.start.measurementValue === 0
+      isPickable: o || !tn.includes(a),
+      isSuspect: po.includes(a) && e.start.measurementValue === 0
     }));
   }, [e, r]);
-}, ie = 8, mo = ({ labelBox: e, panelRect: t, frameWidth: i, frameHeight: r }) => {
-  const a = t.y + e.y, o = a + e.height, l = a - 8 - 36, c = o + 8, s = po(ie, l >= ie ? l : c, r - ie - 36), u = ie;
+}, ie = 8, fo = ({ labelBox: e, panelRect: t, frameWidth: i, frameHeight: r }) => {
+  const o = t.y + e.y, a = o + e.height, l = o - 8 - 36, c = a + 8, s = Co(ie, l >= ie ? l : c, r - ie - 36), u = ie;
   return {
     top: s,
     left: u,
     available: Math.max(0, i - ie * 2),
     centre: t.x + e.x + e.width / 2 - u
   };
-}, po = (e, t, i) => Math.max(e, Math.min(t, i)), xe = [
+}, Co = (e, t, i) => Math.max(e, Math.min(t, i)), Te = [
   {
     id: "small",
     nameKey: "graph.annotations.differenceArrowToolbar.size.small"
@@ -992,93 +992,93 @@ var Je = "q7gcrzd q7gcrzc", Un = "q7gcrze q7gcrzc", so = [
     id: "large",
     nameKey: "graph.annotations.differenceArrowToolbar.size.large"
   }
-], go = ({ arrow: e, labelBox: t, panelRect: i, frameWidth: r, frameHeight: a, frameElement: o }) => {
-  const l = T(), { chartId: c, commands: s } = B(), u = W(), [d, h] = $(null), v = uo(e), m = mo({
+], bo = ({ arrow: e, labelBox: t, panelRect: i, frameWidth: r, frameHeight: o, frameElement: a }) => {
+  const l = A(), { chartId: c, commands: s } = G(), u = q(), [d, h] = $(null), v = vo(e), p = fo({
     labelBox: t,
     panelRect: i,
     frameWidth: r,
-    frameHeight: a
-  }), g = (S, f) => {
-    s.dispatch(new wn({
+    frameHeight: o
+  }), g = (y, f) => {
+    s.dispatch(new Pn({
       kind: "differenceArrow",
       id: e.id,
-      patch: S
+      patch: y
     }), f);
   };
-  z(() => () => s.seal(), [s]), z(() => {
-    const { claimInteraction: S, releaseInteraction: f } = u.getState();
-    return d === null ? f("chrome-popup") : S(Qa), () => f("chrome-popup");
+  V(() => () => s.seal(), [s]), V(() => {
+    const { claimInteraction: y, releaseInteraction: f } = u.getState();
+    return d === null ? f("chrome-popup") : y(to), () => f("chrome-popup");
   }, [u, d]);
-  const y = (S) => {
-    h(S ? "color" : null), S || s.seal();
-  }, I = () => {
-    s.dispatch(new Re({ id: e.id })), o.focus({ preventScroll: !0 });
+  const S = (y) => {
+    h(y ? "color" : null), y || s.seal();
+  }, P = () => {
+    s.dispatch(new ze({ id: e.id })), a.focus({ preventScroll: !0 });
   };
   return /* @__PURE__ */ n("div", {
-    className: no,
+    className: oo,
     style: {
-      top: m.top,
-      left: m.left,
-      width: m.available
+      top: p.top,
+      left: p.left,
+      width: p.available
     },
-    children: /* @__PURE__ */ p(X.Root, {
+    children: /* @__PURE__ */ m(j.Root, {
       "aria-label": l("graph.annotations.differenceArrowToolbar.label"),
-      className: to,
+      className: io,
       "data-testid": "difference-arrow-toolbar",
-      ...Ce(c),
-      style: An({
-        [Ja]: `${m.centre}px`,
-        [eo]: `${m.available}px`
+      ...be(c),
+      style: On({
+        [ro]: `${p.centre}px`,
+        [ao]: `${p.available}px`
       }),
       children: [
-        /* @__PURE__ */ n(vo, {
+        /* @__PURE__ */ n(yo, {
           options: v,
           current: e.label,
           isOpen: d === "labelKind",
-          onOpenChange: (S) => h(S ? "labelKind" : null),
-          onPick: (S) => {
-            g({ label: S }), h(null);
+          onOpenChange: (y) => h(y ? "labelKind" : null),
+          onPick: (y) => {
+            g({ label: y }), h(null);
           }
         }),
-        /* @__PURE__ */ n(X.Separator, {}),
-        /* @__PURE__ */ n(X.ColorPicker, {
+        /* @__PURE__ */ n(j.Separator, {}),
+        /* @__PURE__ */ n(j.ColorPicker, {
           color: e.color,
           label: l("graph.annotations.differenceArrowToolbar.color"),
-          onChange: (S) => g({ color: S }, { transient: !0 }),
+          onChange: (y) => g({ color: y }, { transient: !0 }),
           isOpen: d === "color",
-          onOpenChange: y,
-          popupAttributes: Ce(c),
+          onOpenChange: S,
+          popupAttributes: be(c),
           children: /* @__PURE__ */ n("span", {
-            className: ao,
+            className: so,
             style: { background: e.color ?? "transparent" }
           })
         }),
-        /* @__PURE__ */ n(fo, {
+        /* @__PURE__ */ n(So, {
           current: e.size,
           isOpen: d === "size",
-          onOpenChange: (S) => h(S ? "size" : null),
-          onPick: (S) => {
-            g({ size: S }), h(null);
+          onOpenChange: (y) => h(y ? "size" : null),
+          onPick: (y) => {
+            g({ size: y }), h(null);
           }
         }),
-        /* @__PURE__ */ n(X.Separator, {}),
-        /* @__PURE__ */ n(X.Button, {
+        /* @__PURE__ */ n(j.Separator, {}),
+        /* @__PURE__ */ n(j.Button, {
           "aria-label": l("graph.annotations.differenceArrowToolbar.swap"),
-          className: Je,
+          className: nn,
           onClick: () => g({
             start: e.end.anchor,
             end: e.start.anchor
           }),
-          children: /* @__PURE__ */ n(ja, {
+          children: /* @__PURE__ */ n(eo, {
             size: "sm",
             title: ""
           })
         }),
-        /* @__PURE__ */ n(X.Button, {
+        /* @__PURE__ */ n(j.Button, {
           "aria-label": l("graph.annotations.differenceArrowToolbar.remove"),
-          className: Je,
-          onClick: I,
-          children: /* @__PURE__ */ n(Ya, {
+          className: nn,
+          onClick: P,
+          children: /* @__PURE__ */ n(no, {
             size: "sm",
             title: ""
           })
@@ -1086,24 +1086,24 @@ var Je = "q7gcrzd q7gcrzc", Un = "q7gcrze q7gcrzc", so = [
       ]
     })
   });
-}, vo = ({ options: e, current: t, isOpen: i, onOpenChange: r, onPick: a }) => {
-  const o = T(), l = e.find((s) => s.kind === t), c = e.some((s) => s.isPickable && s.kind !== t);
-  return /* @__PURE__ */ p(k.Root, {
+}, yo = ({ options: e, current: t, isOpen: i, onOpenChange: r, onPick: o }) => {
+  const a = A(), l = e.find((s) => s.kind === t), c = e.some((s) => s.isPickable && s.kind !== t);
+  return /* @__PURE__ */ m(_.Root, {
     open: i,
     modal: !1,
     onOpenChange: r,
-    children: [/* @__PURE__ */ p(k.Trigger, {
-      render: /* @__PURE__ */ n(X.Button, {}),
-      "aria-label": o("graph.annotations.differenceArrowToolbar.labelKind.ariaLabel"),
-      className: Un,
+    children: [/* @__PURE__ */ m(_.Trigger, {
+      render: /* @__PURE__ */ n(j.Button, {}),
+      "aria-label": a("graph.annotations.differenceArrowToolbar.labelKind.ariaLabel"),
+      className: qn,
       disabled: !c,
       onMouseDown: (s) => s.preventDefault(),
       children: [
         /* @__PURE__ */ n("span", {
-          className: ro,
-          children: l === void 0 ? "" : o(l.nameKey)
+          className: lo,
+          children: l === void 0 ? "" : a(l.nameKey)
         }),
-        l !== void 0 && /* @__PURE__ */ p("span", {
+        l !== void 0 && /* @__PURE__ */ m("span", {
           className: "q7gcrz4",
           children: [
             "(",
@@ -1113,89 +1113,89 @@ var Je = "q7gcrzd q7gcrzc", Un = "q7gcrze q7gcrzc", so = [
         }),
         /* @__PURE__ */ n(Se, { size: "sm" })
       ]
-    }), /* @__PURE__ */ n(qn, { children: e.map((s) => /* @__PURE__ */ p(k.Item, {
-      className: Bn,
+    }), /* @__PURE__ */ n($n, { children: e.map((s) => /* @__PURE__ */ m(_.Item, {
+      className: Wn,
       "data-selected": s.kind === t,
       disabled: !s.isPickable,
-      onClick: () => a(s.kind),
+      onClick: () => o(s.kind),
       children: [
-        /* @__PURE__ */ n("span", { children: o(s.nameKey) }),
+        /* @__PURE__ */ n("span", { children: a(s.nameKey) }),
         (s.isSuspect || !s.isPickable) && /* @__PURE__ */ n("span", {
-          "aria-label": o(s.isPickable ? "graph.annotations.differenceArrowToolbar.labelKind.suspectValue" : "graph.annotations.differenceArrowToolbar.labelKind.incomparableEnds"),
+          "aria-label": a(s.isPickable ? "graph.annotations.differenceArrowToolbar.labelKind.suspectValue" : "graph.annotations.differenceArrowToolbar.labelKind.incomparableEnds"),
           className: "q7gcrzb",
           role: "img",
           children: "⚠"
         }),
         /* @__PURE__ */ n("span", {
-          className: lo,
+          className: uo,
           children: s.preview
         })
       ]
     }, s.kind)) })]
   });
-}, fo = ({ current: e, isOpen: t, onOpenChange: i, onPick: r }) => {
-  const a = T(), o = xe.find((l) => l.id === e) ?? xe[0];
-  return /* @__PURE__ */ p(k.Root, {
+}, So = ({ current: e, isOpen: t, onOpenChange: i, onPick: r }) => {
+  const o = A(), a = Te.find((l) => l.id === e) ?? Te[0];
+  return /* @__PURE__ */ m(_.Root, {
     open: t,
     modal: !1,
     onOpenChange: i,
-    children: [/* @__PURE__ */ p(k.Trigger, {
-      render: /* @__PURE__ */ n(X.Button, {}),
-      "aria-label": a("graph.annotations.differenceArrowToolbar.size.ariaLabel"),
-      className: Un,
+    children: [/* @__PURE__ */ m(_.Trigger, {
+      render: /* @__PURE__ */ n(j.Button, {}),
+      "aria-label": o("graph.annotations.differenceArrowToolbar.size.ariaLabel"),
+      className: qn,
       onMouseDown: (l) => l.preventDefault(),
-      children: [/* @__PURE__ */ n("span", { children: o === void 0 ? "" : a(o.nameKey) }), /* @__PURE__ */ n(Se, { size: "sm" })]
-    }), /* @__PURE__ */ n(qn, { children: xe.map((l) => /* @__PURE__ */ n(k.Item, {
-      className: Bn,
+      children: [/* @__PURE__ */ n("span", { children: a === void 0 ? "" : o(a.nameKey) }), /* @__PURE__ */ n(Se, { size: "sm" })]
+    }), /* @__PURE__ */ n($n, { children: Te.map((l) => /* @__PURE__ */ n(_.Item, {
+      className: Wn,
       "data-selected": l.id === e,
       onClick: () => r(l.id),
-      children: a(l.nameKey)
+      children: o(l.nameKey)
     }, l.id)) })]
   });
-}, qn = ({ children: e }) => {
-  const { chartId: t } = B();
-  return /* @__PURE__ */ n(k.Portal, {
-    container: ke(),
-    children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(k.Positioner, {
+}, $n = ({ children: e }) => {
+  const { chartId: t } = G();
+  return /* @__PURE__ */ n(_.Portal, {
+    container: Re(),
+    children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(_.Positioner, {
       side: "bottom",
       align: "start",
       sideOffset: 6,
-      className: oo,
-      children: /* @__PURE__ */ n(k.Popup, {
-        className: io,
+      className: co,
+      children: /* @__PURE__ */ n(_.Popup, {
+        className: ho,
         onMouseDown: (i) => i.preventDefault(),
-        ...Ce(t),
+        ...be(t),
         children: e
       })
     }) })
   });
 };
-var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ? "end" : "start", $n = ({ dispatch: e, arrow: t, endpoint: i, anchor: r }) => {
-  Pn(r, t[i].anchor) || e(new wn({
+var wo = "ydgo3h0", xo = "ydgo3h1", Po = "ydgo3h2", Zn = (e) => e === "start" ? "end" : "start", jn = ({ dispatch: e, arrow: t, endpoint: i, anchor: r }) => {
+  In(r, t[i].anchor) || e(new Pn({
     kind: "differenceArrow",
     id: t.id,
     patch: { [i]: r }
   }));
-}, yo = ({ clientPoint: e, panelOrigin: t, panelRect: i, engine: r, layers: a, coordSystem: o, resolver: l, fixedAnchor: c, align: s }) => {
-  const u = wo({
+}, Io = ({ clientPoint: e, panelOrigin: t, panelRect: i, engine: r, layers: o, coordSystem: a, resolver: l, fixedAnchor: c, align: s }) => {
+  const u = To({
     x: e.x - t.x,
     y: e.y - t.y
-  }, i), { primary: d } = r.query(De(u, i));
+  }, i), { primary: d } = r.query(He(u, i));
   if (d === null) return null;
-  const h = a.find((m) => m.id === d.layerId);
+  const h = o.find((p) => p.id === d.layerId);
   if (h === void 0) return null;
   const v = Ne({
     resolver: l,
     layer: h,
     observation: d.observation,
-    coordSystem: o,
+    coordSystem: a,
     align: s
   });
-  return v === null || Pn(v.anchor, c) ? null : v;
-}, wo = (e, t) => ({
+  return v === null || In(v.anchor, c) ? null : v;
+}, To = (e, t) => ({
   x: Math.max(0, Math.min(e.x, t.width)),
   y: Math.max(0, Math.min(e.y, t.height))
-}), Po = class {
+}), Ao = class {
   constructor(e) {
     this.params = e, this.listeners = new AbortController(), this.pendingEvent = null, this.scheduledFrame = null, this.hasMoved = !1, this.hasPublished = !1, this.handleMove = (t) => {
       t.pointerId === this.params.pointerId && (this.pendingEvent = t, this.hasMoved = !0, this.scheduledFrame === null && (this.scheduledFrame = requestAnimationFrame(this.runFrame)));
@@ -1207,9 +1207,9 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
       this.scheduledFrame = null;
       const t = this.pendingEvent;
       if (this.pendingEvent = null, t === null) return;
-      const { editorStore: i, engine: r, anchorResolver: a, endpoint: o, readInputs: l } = this.params, { arrow: c, panelOrigin: s, panelRect: u, layers: d, coordSystem: h } = l(), v = i.getState();
-      if (this.hasPublished && Ae(ge(v, "endpoint-drag"), c.id, o) === null) return;
-      const m = yo({
+      const { editorStore: i, engine: r, anchorResolver: o, endpoint: a, readInputs: l } = this.params, { arrow: c, panelOrigin: s, panelRect: u, layers: d, coordSystem: h } = l(), v = i.getState();
+      if (this.hasPublished && Le(ge(v, "endpoint-drag"), c.id, a) === null) return;
+      const p = Io({
         clientPoint: {
           x: t.clientX,
           y: t.clientY
@@ -1219,11 +1219,11 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
         engine: r,
         layers: d,
         coordSystem: h,
-        resolver: a,
-        fixedAnchor: c[Wn(o)].anchor,
-        align: c[o].anchor.align
+        resolver: o,
+        fixedAnchor: c[Zn(a)].anchor,
+        align: c[a].anchor.align
       });
-      m !== null && this.publish(m);
+      p !== null && this.publish(p);
     };
   }
   start() {
@@ -1232,10 +1232,10 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
   }
   finish(e) {
     this.params.onSettled(), this.listeners.abort(), this.cancelFrame(), e && this.hasMoved && this.runFrame(), this.pendingEvent = null;
-    const { editorStore: t, endpoint: i, readInputs: r, dispatch: a } = this.params, { arrow: o } = r(), l = t.getState(), c = Ae(ge(l, "endpoint-drag"), o.id, i);
-    c !== null && (l.releaseInteraction("endpoint-drag"), e && $n({
-      dispatch: a,
-      arrow: o,
+    const { editorStore: t, endpoint: i, readInputs: r, dispatch: o } = this.params, { arrow: a } = r(), l = t.getState(), c = Le(ge(l, "endpoint-drag"), a.id, i);
+    c !== null && (l.releaseInteraction("endpoint-drag"), e && jn({
+      dispatch: o,
+      arrow: a,
       endpoint: i,
       anchor: c.point.anchor
     }));
@@ -1252,17 +1252,17 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
   cancelFrame() {
     this.scheduledFrame !== null && (cancelAnimationFrame(this.scheduledFrame), this.scheduledFrame = null);
   }
-}, Io = ({ arrow: e, panelOrigin: t, panelRect: i }) => {
-  const { commands: r, anchorResolver: a } = B(), { engine: o } = _e(), l = W(), c = se({
+}, Lo = ({ arrow: e, panelOrigin: t, panelRect: i }) => {
+  const { commands: r, anchorResolver: o } = G(), { engine: a } = _e(), l = q(), c = se({
     arrow: e,
     panelOrigin: t,
     panelRect: i,
-    ...G(ze((u) => ({
+    ...K(Ve((u) => ({
       layers: u.layers,
       coordSystem: u.coordSystem
     })))
-  }), s = be(null);
-  return z(() => () => s.current?.finish(!1), []), fe((u) => ({
+  }), s = Ce(null);
+  return V(() => () => s.current?.finish(!1), []), fe((u) => ({
     onClick: (d) => d.stopPropagation(),
     onPointerDown: (d) => {
       if (d.button !== 0 || s.current !== null) return;
@@ -1272,14 +1272,14 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
         return;
       }
       d.currentTarget.focus({ preventScroll: !0 }), d.preventDefault();
-      const h = new Po({
+      const h = new Ao({
         handle: d.currentTarget,
         pointerId: d.pointerId,
         endpoint: u,
         readInputs: () => c.current,
         editorStore: l,
-        engine: o,
-        anchorResolver: a,
+        engine: a,
+        anchorResolver: o,
         dispatch: r.dispatch,
         onSettled: () => {
           s.current = null;
@@ -1290,23 +1290,23 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
   }), [
     c,
     l,
-    o,
     a,
+    o,
     r
   ]);
-}, xo = [" ", "Enter"], To = ({ arrow: e }) => {
-  const { commands: t, anchorResolver: i } = B(), r = W(), { layers: a, coordSystem: o, mainAxis: l } = G(ze((s) => ({
+}, Oo = [" ", "Enter"], No = ({ arrow: e }) => {
+  const { commands: t, anchorResolver: i } = G(), r = q(), { layers: o, coordSystem: a, mainAxis: l } = K(Ve((s) => ({
     layers: s.layers,
     coordSystem: s.coordSystem,
     mainAxis: s.coordSystem.type === "cartesian" ? s.coordSystem.mainAxis : "x"
   }))), c = e.id;
-  return z(() => () => {
+  return V(() => () => {
     const s = r.getState();
     ge(s, "endpoint-drag")?.annotationId === c && s.releaseInteraction("endpoint-drag");
   }, [r, c]), fe((s) => ({ onKeyDown: (u) => {
     if (u.altKey || u.ctrlKey || u.metaKey || u.shiftKey) return;
-    const d = r.getState(), h = Ae(ge(d, "endpoint-drag"), e.id, s);
-    if (xo.includes(u.key)) {
+    const d = r.getState(), h = Le(ge(d, "endpoint-drag"), e.id, s);
+    if (Oo.includes(u.key)) {
       if (u.preventDefault(), u.repeat) return;
       if (h === null) return d.claimInteraction({
         kind: "endpoint-drag",
@@ -1314,7 +1314,7 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
         endpoint: s,
         point: e[s]
       });
-      d.releaseInteraction("endpoint-drag"), $n({
+      d.releaseInteraction("endpoint-drag"), jn({
         dispatch: t.dispatch,
         arrow: e,
         endpoint: s,
@@ -1323,53 +1323,53 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
       return;
     }
     if (h === null) return;
-    const v = Ao(u.key, l);
+    const v = ko(u.key, l);
     if (v === null) return;
     u.preventDefault();
-    const m = Lo({
+    const p = Mo({
       arrow: e,
       endpoint: s,
       from: h.point.anchor,
       move: v,
-      layers: a,
-      coordSystem: o,
+      layers: o,
+      coordSystem: a,
       resolver: i
     });
-    m !== null && d.claimInteraction({
+    p !== null && d.claimInteraction({
       kind: "endpoint-drag",
       annotationId: e.id,
       endpoint: s,
-      point: m
+      point: p
     });
   } }), [
     e,
     r,
     t,
     i,
-    a,
     o,
+    a,
     l
   ]);
-}, Ao = (e, t) => {
+}, ko = (e, t) => {
   const i = e === "ArrowUp" || e === "ArrowDown";
   return !i && !(e === "ArrowLeft" || e === "ArrowRight") ? null : {
     axis: t === "x" === i ? "cross" : "main",
     step: e === "ArrowDown" || e === "ArrowRight" ? 1 : -1
   };
-}, Lo = ({ arrow: e, endpoint: t, from: i, move: r, layers: a, coordSystem: o, resolver: l }) => {
-  const c = a.find((u) => u.id === i.layerId);
+}, Mo = ({ arrow: e, endpoint: t, from: i, move: r, layers: o, coordSystem: a, resolver: l }) => {
+  const c = o.find((u) => u.id === i.layerId);
   if (c === void 0) return null;
-  const s = Qr({
+  const s = ta({
     layer: c,
     from: i,
-    partner: e[Wn(t)].anchor,
+    partner: e[Zn(t)].anchor,
     axis: r.axis,
     step: r.step,
     canLandOn: (u) => Ne({
       resolver: l,
       layer: c,
       observation: u,
-      coordSystem: o,
+      coordSystem: a,
       align: e[t].anchor.align
     }) !== null
   });
@@ -1377,18 +1377,18 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
     resolver: l,
     layer: c,
     observation: s.observation,
-    coordSystem: o,
+    coordSystem: a,
     align: e[t].anchor.align
   });
-}, No = (e) => {
-  const t = Xa();
-  return t === null ? null : /* @__PURE__ */ n(Oo, {
+}, Eo = (e) => {
+  const t = Ja();
+  return t === null ? null : /* @__PURE__ */ n(_o, {
     annotationId: t,
     ...e
   });
-}, Oo = ({ annotationId: e, ...t }) => {
-  const i = Lt(), r = O(() => i.find((a) => a.id === e), [i, e]);
-  return r === void 0 ? null : /* @__PURE__ */ n(Eo, {
+}, _o = ({ annotationId: e, ...t }) => {
+  const i = Nt(), r = k(() => i.find((o) => o.id === e), [i, e]);
+  return r === void 0 ? null : /* @__PURE__ */ n(Ro, {
     committedArrow: r.committedArrow,
     committedLabelBox: r.committedLabelBox,
     labelBox: r.labelBox,
@@ -1397,52 +1397,52 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
     isDragged: r.isDragged,
     ...t
   });
-}, Eo = ({ committedArrow: e, committedLabelBox: t, labelBox: i, start: r, end: a, panelRect: o, panelOrigin: l, frameRect: c, frameElement: s, isDragged: u }) => {
-  const d = Io({
+}, Ro = ({ committedArrow: e, committedLabelBox: t, labelBox: i, start: r, end: o, panelRect: a, panelOrigin: l, frameRect: c, frameElement: s, isDragged: u }) => {
+  const d = Lo({
     arrow: e,
     panelOrigin: l,
-    panelRect: o
-  }), h = To({ arrow: e });
-  return /* @__PURE__ */ p("div", {
+    panelRect: a
+  }), h = No({ arrow: e });
+  return /* @__PURE__ */ m("div", {
     "data-testid": "difference-arrow-selection",
     children: [
-      !u && /* @__PURE__ */ n(go, {
+      !u && /* @__PURE__ */ n(bo, {
         arrow: e,
         labelBox: t,
-        panelRect: o,
+        panelRect: a,
         frameWidth: c.width,
         frameHeight: c.height,
         frameElement: s
       }),
       /* @__PURE__ */ n("div", {
         "aria-hidden": "true",
-        className: So,
+        className: Po,
         "data-testid": "difference-arrow-selection-label",
         style: {
-          left: o.x + i.x - 2,
-          top: o.y + i.y - 2,
+          left: a.x + i.x - 2,
+          top: a.y + i.y - 2,
           width: i.width + 4,
           height: i.height + 4
         }
       }),
-      /* @__PURE__ */ n(nn, {
+      /* @__PURE__ */ n(rn, {
         endpoint: "start",
         point: r,
-        panelRect: o,
+        panelRect: a,
         dragHandlers: d("start"),
         keyboardHandlers: h("start")
       }),
-      /* @__PURE__ */ n(nn, {
+      /* @__PURE__ */ n(rn, {
         endpoint: "end",
-        point: a,
-        panelRect: o,
+        point: o,
+        panelRect: a,
         dragHandlers: d("end"),
         keyboardHandlers: h("end")
       })
     ]
   });
-}, nn = ({ endpoint: e, point: t, panelRect: i, dragHandlers: r, keyboardHandlers: a }) => /* @__PURE__ */ n("div", {
-  className: bo,
+}, rn = ({ endpoint: e, point: t, panelRect: i, dragHandlers: r, keyboardHandlers: o }) => /* @__PURE__ */ n("div", {
+  className: wo,
   "data-testid": "difference-arrow-selection-handle",
   "data-endpoint": e,
   role: "button",
@@ -1452,93 +1452,93 @@ var bo = "ydgo3h0", Co = "ydgo3h1", So = "ydgo3h2", Wn = (e) => e === "start" ?
   },
   tabIndex: 0,
   ...r,
-  ...a,
+  ...o,
   children: /* @__PURE__ */ n("span", {
     "aria-hidden": "true",
-    className: Co
+    className: xo
   })
-}), _o = (e) => /* @__PURE__ */ n(M, {
+}), Do = (e) => /* @__PURE__ */ n(I, {
   ...e,
-  children: /* @__PURE__ */ p("g", {
+  children: /* @__PURE__ */ m("g", {
     stroke: "currentColor",
     strokeWidth: 2,
     strokeLinecap: "round",
     strokeLinejoin: "round",
     children: [/* @__PURE__ */ n("path", { d: "M12 5v14" }), /* @__PURE__ */ n("path", { d: "M5 12h14" })]
   })
-}), ko = "var(--_1tyillx0)", Mo = {
+}), zo = "var(--_1tyillx0)", Ho = {
   rest: 0.5,
   hovered: 0.75,
   open: 1
 };
-var Ro = "_1tyillx1", Do = {
+var Vo = "_1tyillx1", Fo = {
   rest: "_1tyillx2",
   hovered: "_1tyillx3",
   open: "_1tyillx4"
-}, zo = "_1tyillx5", Fo = {
+}, Bo = "_1tyillx5", Ko = {
   closed: "_1tyillx6",
   open: "_1tyillx7"
-}, Ho = ({ interaction: e, panelRect: t }) => {
-  const i = W(), r = G((c) => c.coordSystem), a = e.kind === "trigger" || e.kind === "menu" ? e.anchor : null, o = Vo(e), l = O(() => {
-    if (a === null) return null;
-    const c = Xr(a.position, t, r);
+}, Go = ({ interaction: e, panelRect: t }) => {
+  const i = q(), r = K((c) => c.coordSystem), o = e.kind === "trigger" || e.kind === "menu" ? e.anchor : null, a = Uo(e), l = k(() => {
+    if (o === null) return null;
+    const c = Qr(o.position, t, r);
     return {
       center: c,
-      radius: 19 * Mo[o],
+      radius: 19 * Ho[a],
       target: {
         kind: "observation",
-        cursor: De(c, t)
+        cursor: He(c, t)
       }
     };
   }, [
-    a,
+    o,
     t,
     r,
-    o
+    a
   ]);
-  return z(() => {
+  return V(() => {
     i.getState().setMenuTrigger(l);
-  }, [i, l]), z(() => () => i.getState().setMenuTrigger(null), [i]), a === null || l === null ? null : /* @__PURE__ */ n("div", {
+  }, [i, l]), V(() => () => i.getState().setMenuTrigger(null), [i]), o === null || l === null ? null : /* @__PURE__ */ n("div", {
     "aria-hidden": "true",
     "data-testid": "observation-menu-trigger",
-    "data-state": o,
-    className: re(Ro, Do[o]),
+    "data-state": a,
+    className: re(Vo, Fo[a]),
     style: {
       left: t.x + l.center.x,
       top: t.y + l.center.y,
-      ...An({ [ko]: a.color ?? zt.border50 })
+      ...On({ [zo]: o.color ?? Vt.border50 })
     },
     children: /* @__PURE__ */ n("span", {
-      className: re(zo, Fo[o === "open" ? "open" : "closed"]),
-      children: /* @__PURE__ */ n(_o, { size: "lg" })
+      className: re(Bo, Ko[a === "open" ? "open" : "closed"]),
+      children: /* @__PURE__ */ n(Do, { size: "lg" })
     })
   });
-}, Vo = (e) => e.kind === "menu" ? "open" : e.kind === "trigger" && e.isEngaged ? "hovered" : "rest", Ko = 'button:not([disabled]):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])', Go = (e, t) => {
-  const { chartId: i } = B(), r = W();
-  z(() => {
+}, Uo = (e) => e.kind === "menu" ? "open" : e.kind === "trigger" && e.isEngaged ? "hovered" : "rest", Wo = 'button:not([disabled]):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])', qo = (e, t) => {
+  const { chartId: i } = G(), r = q();
+  V(() => {
     if (t === null) return;
-    const a = (o) => {
-      if (o.key !== "Tab" || o.defaultPrevented || !ce(o.target, e, i) || r.getState().standingInteraction?.kind === "chrome-popup") return;
-      const l = [...t.querySelectorAll(Ko)];
+    const o = (a) => {
+      if (a.key !== "Tab" || a.defaultPrevented || !ce(a.target, e, i) || r.getState().standingInteraction?.kind === "chrome-popup") return;
+      const l = [...t.querySelectorAll(Wo)];
       if (l.length === 0) return;
-      o.preventDefault();
+      a.preventDefault();
       const c = l.findIndex((s) => s === document.activeElement);
-      l[c === -1 ? o.shiftKey ? l.length - 1 : 0 : (c + (o.shiftKey ? -1 : 1) + l.length) % l.length]?.focus();
+      l[c === -1 ? a.shiftKey ? l.length - 1 : 0 : (c + (a.shiftKey ? -1 : 1) + l.length) % l.length]?.focus();
     };
-    return document.addEventListener("keydown", a), () => document.removeEventListener("keydown", a);
+    return document.addEventListener("keydown", o), () => document.removeEventListener("keydown", o);
   }, [
     e,
     t,
     i,
     r
   ]);
-}, Bo = (e) => {
-  const { selectionStore: t, chartId: i } = B();
-  z(() => {
+}, $o = (e) => {
+  const { selectionStore: t, chartId: i } = G();
+  V(() => {
     let r = null;
-    const a = () => {
+    const o = () => {
       e.focus({ preventScroll: !0 });
-    }, o = (c) => {
+    }, a = (c) => {
       const { selection: s, clearSelection: u } = t.getState();
       s.length !== 0 && (ce(c.target, e, i) || u());
     }, l = (c) => {
@@ -1546,24 +1546,24 @@ var Ro = "_1tyillx1", Do = {
         r = null, document.hasFocus() && (ce(document.activeElement, e, i) || t.getState().clearSelection());
       }));
     };
-    return e.addEventListener("pointerdown", a), document.addEventListener("focusin", o), document.addEventListener("focusout", l), () => {
-      r !== null && cancelAnimationFrame(r), e.removeEventListener("pointerdown", a), document.removeEventListener("focusin", o), document.removeEventListener("focusout", l);
+    return e.addEventListener("pointerdown", o), document.addEventListener("focusin", a), document.addEventListener("focusout", l), () => {
+      r !== null && cancelAnimationFrame(r), e.removeEventListener("pointerdown", o), document.removeEventListener("focusin", a), document.removeEventListener("focusout", l);
     };
   }, [
     e,
     t,
     i
   ]);
-}, Uo = (e) => {
-  const { selectionStore: t, commands: i, chartId: r } = B(), a = W(), o = fe((c) => {
-    const { selection: s } = t.getState(), u = Gn(s);
-    u !== null && (c.preventDefault(), i.dispatch(new Re({ id: u })), e.focus({ preventScroll: !0 }));
+}, Zo = (e) => {
+  const { selectionStore: t, commands: i, chartId: r } = G(), o = q(), a = fe((c) => {
+    const { selection: s } = t.getState(), u = Un(s);
+    u !== null && (c.preventDefault(), i.dispatch(new ze({ id: u })), e.focus({ preventScroll: !0 }));
   }, [
     e,
     i,
     t
   ]), l = fe((c) => {
-    const s = a.getState();
+    const s = o.getState();
     switch (s.standingInteraction?.kind) {
       case "endpoint-drag":
         s.releaseInteraction("endpoint-drag");
@@ -1582,20 +1582,20 @@ var Ro = "_1tyillx1", Do = {
         return;
     }
   }, [
-    a,
+    o,
     t,
     e,
     r
   ]);
-  z(() => {
+  V(() => {
     const c = (s) => {
-      if (ce(s.target, e, r) && !qo(s.target) && !ra(s.target))
+      if (ce(s.target, e, r) && !jo(s.target) && !la(s.target))
         switch (s.key) {
           case "Escape":
             return l(s);
           case "Delete":
           case "Backspace":
-            return o(s);
+            return a(s);
           default:
             return;
         }
@@ -1603,50 +1603,50 @@ var Ro = "_1tyillx1", Do = {
     return document.addEventListener("keydown", c), () => document.removeEventListener("keydown", c);
   }, [
     e,
-    o,
+    a,
     l,
     r
   ]);
-}, qo = (e) => e instanceof HTMLElement && (e.isContentEditable || e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement), Wo = `[${Cn}]`, Zn = (e, t, i) => {
+}, jo = (e) => e instanceof HTMLElement && (e.isContentEditable || e instanceof HTMLInputElement || e instanceof HTMLTextAreaElement), Xo = `[${Sn}]`, Xn = (e, t, i) => {
   if (typeof document.elementsFromPoint != "function") return null;
   const r = document.elementsFromPoint(e, t);
-  return $o(r, i);
-}, $o = (e, t) => {
+  return Yo(r, i);
+}, Yo = (e, t) => {
   for (const i of e) {
-    const r = i.closest(Wo);
+    const r = i.closest(Xo);
     if (r === null || !t.contains(r)) continue;
-    const a = Zo(r);
-    if (a !== null) return a;
+    const o = Qo(r);
+    if (o !== null) return o;
   }
   return null;
-}, Zo = (e) => {
-  const t = e.getAttribute(Cn);
+}, Qo = (e) => {
+  const t = e.getAttribute(Sn);
   if (t !== "annotation") return null;
   const i = e.getAttribute(_t);
   return i === null || i === "" ? null : {
     kind: t,
     id: i
   };
-}, Xo = () => {
-  const e = Pt((a) => a.hover.primary), { layers: t, coordSystem: i } = G(ze((a) => ({
-    layers: a.layers,
-    coordSystem: a.coordSystem
-  }))), { anchorResolver: r } = B();
-  return O(() => {
+}, Jo = () => {
+  const e = It((o) => o.hover.primary), { layers: t, coordSystem: i } = K(Ve((o) => ({
+    layers: o.layers,
+    coordSystem: o.coordSystem
+  }))), { anchorResolver: r } = G();
+  return k(() => {
     if (e === null) return null;
-    const a = t.find((c) => c.id === e.layerId);
-    if (a === void 0) return null;
-    const o = r.resolve(a.geom, e.observation, {
+    const o = t.find((c) => c.id === e.layerId);
+    if (o === void 0) return null;
+    const a = r.resolve(o.geom, e.observation, {
       coordSystem: i,
-      position: a.position,
+      position: o.position,
       purpose: "pin"
     });
-    if (o === null) return null;
-    const l = kr(a, e.observation);
+    if (a === null) return null;
+    const l = Dr(o, e.observation);
     return l === null ? null : {
-      position: o,
-      color: Ur(e.observation),
-      layer: a,
+      position: a,
+      color: $r(e.observation),
+      layer: o,
       at: l,
       observation: e.observation
     };
@@ -1656,9 +1656,9 @@ var Ro = "_1tyillx1", Do = {
     i,
     r
   ]);
-}, jo = { kind: "idle" }, Xn = () => {
-  const e = ve((r) => r.standingInteraction), t = ve((r) => r.chromeUnderPointer), i = Xo();
-  return O(() => e !== null ? e : i === null ? jo : {
+}, ei = { kind: "idle" }, Yn = () => {
+  const e = ve((r) => r.standingInteraction), t = ve((r) => r.chromeUnderPointer), i = Jo();
+  return k(() => e !== null ? e : i === null ? ei : {
     kind: "trigger",
     anchor: i,
     isEngaged: t === "menu-trigger"
@@ -1667,92 +1667,92 @@ var Ro = "_1tyillx1", Do = {
     i,
     t
   ]);
-}, Yo = (e, t) => {
-  const i = W(), r = se(t);
-  z(() => {
-    let a = null, o = null;
+}, ni = (e, t) => {
+  const i = q(), r = se(t);
+  V(() => {
+    let o = null, a = null;
     const l = (h) => {
       const { menuTrigger: v } = i.getState();
-      return v === null ? null : Tn(h, v) ? "menu-trigger" : null;
+      return v === null ? null : Ln(h, v) ? "menu-trigger" : null;
     }, c = () => {
-      a = null;
-      const h = o;
-      if (o = null, h === null) return;
-      const v = r.current, m = i.getState();
-      m.setChromeUnderPointer(l({
+      o = null;
+      const h = a;
+      if (a = null, h === null) return;
+      const v = r.current, p = i.getState();
+      p.setChromeUnderPointer(l({
         x: h.x - v.x,
         y: h.y - v.y
-      })), m.standingInteraction?.kind !== "menu" && m.setEditTargetUnderPointer(Zn(h.x, h.y, e));
+      })), p.standingInteraction?.kind !== "menu" && p.setEditTargetUnderPointer(Xn(h.x, h.y, e));
     }, s = () => {
       const h = i.getState();
       h.setChromeUnderPointer(null), h.setEditTargetUnderPointer(null);
     }, u = (h) => {
-      o = {
+      a = {
         x: h.clientX,
         y: h.clientY
-      }, a === null && (a = requestAnimationFrame(c));
+      }, o === null && (o = requestAnimationFrame(c));
     }, d = () => {
-      o = null, a !== null && (cancelAnimationFrame(a), a = null), s();
+      a = null, o !== null && (cancelAnimationFrame(o), o = null), s();
     };
     return e.addEventListener("pointermove", u), e.addEventListener("pointerleave", d), () => {
-      a !== null && cancelAnimationFrame(a), e.removeEventListener("pointermove", u), e.removeEventListener("pointerleave", d), s();
+      o !== null && cancelAnimationFrame(o), e.removeEventListener("pointermove", u), e.removeEventListener("pointerleave", d), s();
     };
   }, [
     e,
     i,
     r
   ]);
-}, tn = "editor", rn = [], Qo = (e, t, i, r) => {
-  const a = Xn(), { store: o } = _e(), l = Sn().length > 0, c = ve((d) => d.menuTrigger), s = a.kind === "menu", u = O(() => c === null ? rn : [Er(c)], [c]);
-  Yo(e, t), Jo(a, e, t, i), Bo(e), Uo(e), Go(e, r), z(() => (o.getState().publishPointerRegions(tn, u), () => o.getState().publishPointerRegions(tn, rn)), [o, u]), z(() => (o.getState().setPointerSuspended(s || l), () => o.getState().setPointerSuspended(!1)), [
-    o,
+}, an = "editor", on = [], ti = (e, t, i, r) => {
+  const o = Yn(), { store: a } = _e(), l = wn().length > 0, c = ve((d) => d.menuTrigger), s = o.kind === "menu", u = k(() => c === null ? on : [_r(c)], [c]);
+  ni(e, t), ri(o, e, t, i), $o(e), Zo(e), qo(e, r), V(() => (a.getState().publishPointerRegions(an, u), () => a.getState().publishPointerRegions(an, on)), [a, u]), V(() => (a.getState().setPointerSuspended(s || l), () => a.getState().setPointerSuspended(!1)), [
+    a,
     s,
     l
-  ]), z(() => {
+  ]), V(() => {
     if (!l) return;
-    const d = o.getState();
-    d.setHoverState(yn), d.setTooltipAnchor(null);
-  }, [o, l]);
-}, Jo = (e, t, i, r) => {
-  const a = W(), { selectionStore: o } = B(), { store: l, engine: c } = _e(), s = se(e), u = se(i), d = se(r);
-  z(() => {
-    const h = (S) => {
-      const { menuTrigger: f } = a.getState();
-      return f === null ? !1 : Tn(an(S, u.current), f);
-    }, v = (S) => {
-      if (h(S) || o.getState().selection.length > 0) return;
-      const f = d.current, P = an(S, u.current), x = ei(P, f) ? c.query(De(P, f)) : yn;
-      l.getState().setHoverState(x);
+    const d = a.getState();
+    d.setHoverState(xn), d.setTooltipAnchor(null);
+  }, [a, l]);
+}, ri = (e, t, i, r) => {
+  const o = q(), { selectionStore: a } = G(), { store: l, engine: c } = _e(), s = se(e), u = se(i), d = se(r);
+  V(() => {
+    const h = (y) => {
+      const { menuTrigger: f } = o.getState();
+      return f === null ? !1 : Ln(ln(y, u.current), f);
+    }, v = (y) => {
+      if (h(y) || a.getState().selection.length > 0) return;
+      const f = d.current, x = ln(y, u.current), T = ai(x, f) ? c.query(He(x, f)) : xn;
+      l.getState().setHoverState(T);
     };
-    let m = !1;
+    let p = !1;
     const g = () => {
-      m = s.current.kind === "menu";
-    }, y = (S) => {
-      const f = Zn(S.clientX, S.clientY, t), P = o.getState();
+      p = s.current.kind === "menu";
+    }, S = (y) => {
+      const f = Xn(y.clientX, y.clientY, t), x = a.getState();
       if (f === null) {
-        P.clearSelection();
+        x.clearSelection();
         return;
       }
-      P.setSelection([f]);
-    }, I = (S) => {
-      if (aa(S.target)) return;
-      const { claimInteraction: f, releaseInteraction: P } = a.getState(), x = h(S);
-      if (!x || m) {
-        P("menu"), x || y(S), m && v(S);
+      x.setSelection([f]);
+    }, P = (y) => {
+      if (sa(y.target)) return;
+      const { claimInteraction: f, releaseInteraction: x } = o.getState(), T = h(y);
+      if (!T || p) {
+        x("menu"), T || S(y), p && v(y);
         return;
       }
-      const R = s.current;
-      R.kind === "trigger" && f({
+      const z = s.current;
+      z.kind === "trigger" && f({
         kind: "menu",
-        anchor: R.anchor
+        anchor: z.anchor
       });
     };
-    return document.addEventListener("pointerdown", g, !0), document.addEventListener("click", I), () => {
-      document.removeEventListener("pointerdown", g, !0), document.removeEventListener("click", I);
+    return document.addEventListener("pointerdown", g, !0), document.addEventListener("click", P), () => {
+      document.removeEventListener("pointerdown", g, !0), document.removeEventListener("click", P);
     };
   }, [
-    a,
     o,
+    a,
     t,
     s,
     l,
@@ -1760,18 +1760,18 @@ var Ro = "_1tyillx1", Do = {
     u,
     d
   ]);
-}, an = (e, t) => ({
+}, ln = (e, t) => ({
   x: e.clientX - t.x,
   y: e.clientY - t.y
-}), ei = (e, t) => e.x >= 0 && e.x <= t.width && e.y >= 0 && e.y <= t.height, ni = ({ frameElement: e, panelRect: t }) => {
-  const { measureRef: i, screenRect: r } = It(), a = W();
-  return z(() => (i(e), () => i(null)), [i, e]), z(() => () => a.getState().releaseInteraction("menu"), [a]), r === null ? null : /* @__PURE__ */ n(ia, { children: /* @__PURE__ */ n(ti, {
+}), ai = (e, t) => e.x >= 0 && e.x <= t.width && e.y >= 0 && e.y <= t.height, oi = ({ frameElement: e, panelRect: t }) => {
+  const { measureRef: i, screenRect: r } = Tt(), o = q();
+  return V(() => (i(e), () => i(null)), [i, e]), V(() => () => o.getState().releaseInteraction("menu"), [o]), r === null ? null : /* @__PURE__ */ n(da, { children: /* @__PURE__ */ n(ii, {
     frameElement: e,
     frameRect: r,
     panelRect: t
   }) });
-}, ti = ({ frameElement: e, frameRect: t, panelRect: i }) => {
-  const r = O(() => ({
+}, ii = ({ frameElement: e, frameRect: t, panelRect: i }) => {
+  const r = k(() => ({
     x: t.left + i.x,
     y: t.top + i.y
   }), [
@@ -1779,79 +1779,79 @@ var Ro = "_1tyillx1", Do = {
     t.top,
     i.x,
     i.y
-  ]), [a, o] = $(null);
-  return Qo(e, r, i, a), /* @__PURE__ */ n(ri, {
+  ]), [o, a] = $(null);
+  return ti(e, r, i, o), /* @__PURE__ */ n(li, {
     frameElement: e,
     frameRect: t,
     panelOrigin: r,
     panelRect: i,
-    boxRef: o
+    boxRef: a
   });
-}, ri = ({ frameElement: e, frameRect: t, panelOrigin: i, panelRect: r, boxRef: a }) => {
-  const o = Fe(), l = Xn();
-  return /* @__PURE__ */ n(xt, {
+}, li = ({ frameElement: e, frameRect: t, panelOrigin: i, panelRect: r, boxRef: o }) => {
+  const a = Fe(), l = Yn();
+  return /* @__PURE__ */ n(At, {
     rect: t,
-    zIndex: Tt.editorOverlay,
-    container: o,
+    zIndex: Lt.editorOverlay,
+    container: a,
     "data-testid": "editor-overlay",
-    boxRef: a,
-    children: /* @__PURE__ */ p(he, { children: [
-      /* @__PURE__ */ n(No, {
+    boxRef: o,
+    children: /* @__PURE__ */ m(he, { children: [
+      /* @__PURE__ */ n(Eo, {
         panelRect: r,
         panelOrigin: i,
         frameRect: t,
         frameElement: e
       }),
-      /* @__PURE__ */ n(Ho, {
+      /* @__PURE__ */ n(Go, {
         interaction: l,
         panelRect: r
       }),
-      /* @__PURE__ */ n(Ua, {
+      /* @__PURE__ */ n(Za, {
         interaction: l,
         panelOrigin: i
       })
     ] })
   });
-}, Ss = ({ slots: e, ...t }) => /* @__PURE__ */ n(Et, { children: /* @__PURE__ */ n(Ot, {
-  slots: O(() => ({
-    EditorSurface: ni,
+}, Bs = ({ slots: e, ...t }) => /* @__PURE__ */ n(Et, { children: /* @__PURE__ */ n(Mt, {
+  slots: k(() => ({
+    EditorSurface: oi,
     ...e
   }), [e]),
   ...t
-}) }), jn = ue(null), Yn = ({ labelId: e, controlId: t, children: i }) => {
-  const r = O(() => {
-    let a = null;
+}) }), Qn = ue(null), Jn = ({ labelId: e, controlId: t, children: i }) => {
+  const r = k(() => {
+    let o = null;
     return {
       labelId: e,
       controlId: t,
-      claimControlId: (o) => (a ??= o, a === o)
+      claimControlId: (a) => (o ??= a, o === a)
     };
   }, [e, t]);
-  return /* @__PURE__ */ n(jn.Provider, {
+  return /* @__PURE__ */ n(Qn.Provider, {
     value: r,
     children: i
   });
 }, Y = ({ id: e, ariaLabel: t, ariaLabelledBy: i }, r = !0) => {
-  const a = ae(jn), o = de(), [l] = $(() => r ? a?.claimControlId(o) ?? !1 : !1), c = e ?? (l ? a?.controlId : void 0), s = i ?? (t === void 0 ? a?.labelId : void 0);
+  const o = ae(Qn), a = de(), [l] = $(() => r ? o?.claimControlId(a) ?? !1 : !1), c = e ?? (l ? o?.controlId : void 0), s = i ?? (t === void 0 ? o?.labelId : void 0);
   return {
     ...c !== void 0 && { id: c },
     ...t !== void 0 && { "aria-label": t },
     ...s !== void 0 && { "aria-labelledby": s }
   };
 };
-var ai = {
+var si = {
   default: "woi4bh4 woi4bh3",
   tile: "woi4bh5 woi4bh3"
-}, oi = ({ label: e, icon: t, onClick: i, variant: r = "default", isDisabled: a, ariaLabel: o, ariaLabelledBy: l, id: c }) => {
+}, ci = ({ label: e, icon: t, onClick: i, variant: r = "default", isDisabled: o, ariaLabel: a, ariaLabelledBy: l, id: c }) => {
   const s = Y({
     id: c,
-    ariaLabel: o,
+    ariaLabel: a,
     ariaLabelledBy: l
   }), u = r === "tile";
-  return /* @__PURE__ */ p("button", {
+  return /* @__PURE__ */ m("button", {
     type: "button",
-    className: ai[r],
-    disabled: a,
+    className: si[r],
+    disabled: o,
     onClick: i,
     ...s,
     children: [t !== void 0 && /* @__PURE__ */ n("span", {
@@ -1862,23 +1862,23 @@ var ai = {
       children: e
     })]
   });
-}, Ve = ue(null), E = () => {
-  const e = ae(Ve);
+}, Ke = ue(null), M = () => {
+  const e = ae(Ke);
   if (!e) throw new Error("An editing section must sit inside an <EditorPanel.Root> bound to a graph — pass it a `handle`, or render the panel inside a <GraphProvider>.");
   return e;
-}, Qn = ({ children: e, onKeyDown: t, ...i }) => {
-  const r = ae(Ve);
+}, et = ({ children: e, onKeyDown: t, ...i }) => {
+  const r = ae(Ke);
   return /* @__PURE__ */ n("div", {
-    onKeyDown: (o) => {
-      if (t?.(o), !r || o.defaultPrevented) return;
-      const l = Rt(o.nativeEvent);
-      l && (o.preventDefault(), l === "undo" ? r.undo() : r.redo());
+    onKeyDown: (a) => {
+      if (t?.(a), !r || a.defaultPrevented) return;
+      const l = zt(a.nativeEvent);
+      l && (a.preventDefault(), l === "undo" ? r.undo() : r.redo());
     },
     ...i,
     children: e
   });
-}, Jn = "keyboard", Pe = (e) => {
-  const t = be(!1), i = be(!1), r = () => {
+}, nt = "keyboard", Pe = (e) => {
+  const t = Ce(!1), i = Ce(!1), r = () => {
     t.current = !1, i.current && (i.current = !1, e?.());
   };
   return {
@@ -1889,8 +1889,8 @@ var ai = {
       }
       e?.();
     },
-    commitUnlessHeldKey: (a) => {
-      if (a) {
+    commitUnlessHeldKey: (o) => {
+      if (o) {
         i.current = !0;
         return;
       }
@@ -1901,31 +1901,31 @@ var ai = {
         t.current = !0;
       },
       onKeyUp: r,
-      onBlur: (a) => {
-        a.relatedTarget instanceof Node && a.currentTarget.contains(a.relatedTarget) || r();
+      onBlur: (o) => {
+        o.relatedTarget instanceof Node && o.currentTarget.contains(o.relatedTarget) || r();
       }
     }
   };
-}, ii = "eh8dvc0", li = "eh8dvc1 uz3g760", si = "eh8dvc2 uz3g761";
-var ci = ({ value: e, onChange: t, onCommit: i, min: r, max: a, step: o, prefix: l, suffix: c, isDisabled: s, hasError: u, ariaLabel: d, ariaLabelledBy: h, id: v }) => {
-  const m = Y({
+}, di = "eh8dvc0", hi = "eh8dvc1 uz3g760", ui = "eh8dvc2 uz3g761";
+var mi = ({ value: e, onChange: t, onCommit: i, min: r, max: o, step: a, prefix: l, suffix: c, isDisabled: s, hasError: u, ariaLabel: d, ariaLabelledBy: h, id: v }) => {
+  const p = Y({
     id: v,
     ariaLabel: d,
     ariaLabelledBy: h
-  }), { commitUnlessHeldKey: g, gestureHandlers: y } = Pe(i);
-  return /* @__PURE__ */ n(Ye.Root, {
-    className: ii,
+  }), { commitUnlessHeldKey: g, gestureHandlers: S } = Pe(i);
+  return /* @__PURE__ */ n(Je.Root, {
+    className: di,
     value: e,
-    onValueChange: (I) => t(I),
-    onValueCommitted: (I, S) => {
-      g(S.reason === Jn);
+    onValueChange: (P) => t(P),
+    onValueCommitted: (P, y) => {
+      g(y.reason === nt);
     },
     min: r,
-    max: a,
-    step: o,
+    max: o,
+    step: a,
     disabled: s,
-    children: /* @__PURE__ */ p(Qn, {
-      className: li,
+    children: /* @__PURE__ */ m(et, {
+      className: hi,
       "data-error": u === !0,
       "data-disabled": s === !0 ? "" : void 0,
       children: [
@@ -1933,11 +1933,11 @@ var ci = ({ value: e, onChange: t, onCommit: i, min: r, max: a, step: o, prefix:
           className: "eh8dvc3",
           children: l
         }),
-        /* @__PURE__ */ n(Ye.Input, {
-          className: si,
-          ...y,
+        /* @__PURE__ */ n(Je.Input, {
+          className: ui,
+          ...S,
           "aria-invalid": u === !0 ? !0 : void 0,
-          ...m
+          ...p
         }),
         c !== void 0 && /* @__PURE__ */ n("span", {
           className: "eh8dvc3",
@@ -1946,33 +1946,33 @@ var ci = ({ value: e, onChange: t, onCommit: i, min: r, max: a, step: o, prefix:
       ]
     })
   });
-}, di = "_1b7s5f0", te = {
+}, pi = "_1b7s5f0", te = {
   1: "_1b7s5f1",
   2: "_1b7s5f2",
   3: "_1b7s5f3",
   4: "_1b7s5f4",
   5: "_1b7s5f5",
   6: "_1b7s5f6"
-}, hi = "_1b7s5f7";
-var ui = 6, mi = ({ options: e, value: t, onChange: i, onCommit: r, columns: a, itemLayout: o = "tile", isDisabled: l, ariaLabel: c, ariaLabelledBy: s, id: u }) => {
+}, gi = "_1b7s5f7";
+var vi = 6, fi = ({ options: e, value: t, onChange: i, onCommit: r, columns: o, itemLayout: a = "tile", isDisabled: l, ariaLabel: c, ariaLabelledBy: s, id: u }) => {
   const d = Y({
     id: u,
     ariaLabel: c,
     ariaLabelledBy: s
-  }), h = o === "swatch", { commitAfterChange: v, gestureHandlers: m } = Pe(r);
-  return /* @__PURE__ */ n(Nn, {
-    className: re(di, pi(a ?? e.length)),
+  }), h = a === "swatch", { commitAfterChange: v, gestureHandlers: p } = Pe(r);
+  return /* @__PURE__ */ n(kn, {
+    className: re(pi, Ci(o ?? e.length)),
     value: t,
     onValueChange: (g) => {
       i(g), v();
     },
-    ...m,
+    ...p,
     disabled: l,
     ...d,
-    children: e.map((g) => /* @__PURE__ */ p(Ln.Root, {
+    children: e.map((g) => /* @__PURE__ */ m(Nn.Root, {
       value: g.value,
       disabled: g.isDisabled,
-      className: re(hi, h && "_1b7s5f8"),
+      className: re(gi, h && "_1b7s5f8"),
       "aria-label": h ? g.label : void 0,
       children: [g.icon, !h && /* @__PURE__ */ n("span", {
         className: "_1b7s5f9",
@@ -1980,8 +1980,8 @@ var ui = 6, mi = ({ options: e, value: t, onChange: i, onCommit: r, columns: a,
       })]
     }, g.value))
   });
-}, pi = (e) => {
-  switch (Math.min(Math.max(Math.round(e), 1), ui)) {
+}, Ci = (e) => {
+  switch (Math.min(Math.max(Math.round(e), 1), vi)) {
     case 1:
       return te[1];
     case 2:
@@ -1995,56 +1995,56 @@ var ui = 6, mi = ({ options: e, value: t, onChange: i, onCommit: r, columns: a,
     default:
       return te[6];
   }
-}, gi = "_1g5x15w0 uz3g760", vi = "_1g5x15w1", fi = "_1g5x15w2", on = "_1g5x15w3", bi = "_1g5x15w4", Ci = "_1g5x15w5", Si = "_1g5x15w6", yi = "_1g5x15w7";
-var wi = ({ options: e, value: t, onChange: i, placeholder: r, isDisabled: a, hasError: o, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
+}, bi = "_1g5x15w0 uz3g760", yi = "_1g5x15w1", Si = "_1g5x15w2", sn = "_1g5x15w3", wi = "_1g5x15w4", xi = "_1g5x15w5", Pi = "_1g5x15w6", Ii = "_1g5x15w7";
+var Ti = ({ options: e, value: t, onChange: i, placeholder: r, isDisabled: o, hasError: a, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
   const u = Y({
     id: s,
     ariaLabel: l,
     ariaLabelledBy: c
   });
-  return /* @__PURE__ */ p(U.Root, {
+  return /* @__PURE__ */ m(U.Root, {
     value: t,
     onValueChange: (d) => d !== null && i(d),
-    disabled: a,
+    disabled: o,
     items: e.map((d) => ({
       value: d.value,
       label: d.label
     })),
-    children: [/* @__PURE__ */ p(U.Trigger, {
-      className: gi,
-      "data-error": o === !0,
+    children: [/* @__PURE__ */ m(U.Trigger, {
+      className: bi,
+      "data-error": a === !0,
       ...u,
       children: [/* @__PURE__ */ n(U.Value, {
-        className: vi,
-        children: (d) => Pi(e, d, r)
+        className: yi,
+        children: (d) => Ai(e, d, r)
       }), /* @__PURE__ */ n(U.Icon, {
-        className: on,
+        className: sn,
         children: /* @__PURE__ */ n(Se, { size: "sm" })
       })]
     }), /* @__PURE__ */ n(U.Portal, {
-      container: ke(),
+      container: Re(),
       children: /* @__PURE__ */ n(he, { children: /* @__PURE__ */ n(U.Positioner, {
-        className: bi,
+        className: wi,
         sideOffset: 4,
         alignItemWithTrigger: !1,
         children: /* @__PURE__ */ n(U.Popup, {
-          className: Ci,
-          children: e.map((d) => /* @__PURE__ */ p(U.Item, {
+          className: xi,
+          children: e.map((d) => /* @__PURE__ */ m(U.Item, {
             value: d.value,
             disabled: d.isDisabled,
-            className: Si,
+            className: Pi,
             children: [
               d.icon,
-              /* @__PURE__ */ p("span", {
-                className: yi,
+              /* @__PURE__ */ m("span", {
+                className: Ii,
                 children: [/* @__PURE__ */ n(U.ItemText, { children: d.label }), d.description !== void 0 && /* @__PURE__ */ n("span", {
                   className: "_1g5x15w8",
                   children: d.description
                 })]
               }),
               /* @__PURE__ */ n(U.ItemIndicator, {
-                className: on,
-                children: /* @__PURE__ */ n(Dt, { size: "sm" })
+                className: sn,
+                children: /* @__PURE__ */ n(Ht, { size: "sm" })
               })
             ]
           }, d.value))
@@ -2052,34 +2052,34 @@ var wi = ({ options: e, value: t, onChange: i, placeholder: r, isDisabled: a, ha
       }) })
     })]
   });
-}, Pi = (e, t, i) => t === null ? /* @__PURE__ */ n("span", {
-  className: fi,
+}, Ai = (e, t, i) => t === null ? /* @__PURE__ */ n("span", {
+  className: Si,
   children: i
-}) : Ii(e, t), Ii = (e, t) => e.find((i) => i.value === t)?.label ?? t, xi = "vod76w0", Ti = "vod76w1", Ai = "vod76w2", Li = "vod76w3", Ni = "vod76w4", Oi = "vod76w5";
-var Ei = ({ value: e, onChange: t, onCommit: i, min: r, max: a, step: o, suffix: l, formatValue: c, isDisabled: s, ariaLabel: u, ariaLabelledBy: d }) => {
+}) : Li(e, t), Li = (e, t) => e.find((i) => i.value === t)?.label ?? t, Oi = "vod76w0", Ni = "vod76w1", ki = "vod76w2", Mi = "vod76w3", Ei = "vod76w4", _i = "vod76w5";
+var Ri = ({ value: e, onChange: t, onCommit: i, min: r, max: o, step: a, suffix: l, formatValue: c, isDisabled: s, ariaLabel: u, ariaLabelledBy: d }) => {
   const h = Y({
     ariaLabel: u,
     ariaLabelledBy: d
-  }, !1), v = _i(e, l, c), { commitUnlessHeldKey: m, gestureHandlers: g } = Pe(i);
-  return /* @__PURE__ */ p("div", {
-    className: xi,
+  }, !1), v = Di(e, l, c), { commitUnlessHeldKey: p, gestureHandlers: g } = Pe(i);
+  return /* @__PURE__ */ m("div", {
+    className: Oi,
     children: [/* @__PURE__ */ n(oe.Root, {
-      className: Ti,
+      className: Ni,
       value: e,
-      onValueChange: (y) => t(y),
-      onValueCommitted: (y, I) => {
-        m(I.reason === Jn);
+      onValueChange: (S) => t(S),
+      onValueCommitted: (S, P) => {
+        p(P.reason === nt);
       },
       min: r,
-      max: a,
-      step: o,
+      max: o,
+      step: a,
       disabled: s,
       children: /* @__PURE__ */ n(oe.Control, {
-        className: Ai,
-        children: /* @__PURE__ */ p(oe.Track, {
-          className: Li,
-          children: [/* @__PURE__ */ n(oe.Indicator, { className: Ni }), /* @__PURE__ */ n(oe.Thumb, {
-            className: Oi,
+        className: ki,
+        children: /* @__PURE__ */ m(oe.Track, {
+          className: Mi,
+          children: [/* @__PURE__ */ n(oe.Indicator, { className: Ei }), /* @__PURE__ */ n(oe.Thumb, {
+            className: _i,
             ...g,
             ...h
           })]
@@ -2090,121 +2090,121 @@ var Ei = ({ value: e, onChange: t, onCommit: i, min: r, max: a, step: o, suffix:
       children: v
     })]
   });
-}, _i = (e, t, i) => i !== void 0 ? i(e) : t !== void 0 ? `${e}${t}` : null, ki = "_1hyrlw60", Mi = "_1hyrlw61", Ri = ({ isChecked: e, onChange: t, isDisabled: i, ariaLabel: r, ariaLabelledBy: a, id: o }) => {
+}, Di = (e, t, i) => i !== void 0 ? i(e) : t !== void 0 ? `${e}${t}` : null, zi = "_1hyrlw60", Hi = "_1hyrlw61", Vi = ({ isChecked: e, onChange: t, isDisabled: i, ariaLabel: r, ariaLabelledBy: o, id: a }) => {
   const l = Y({
-    id: o,
+    id: a,
     ariaLabel: r,
-    ariaLabelledBy: a
+    ariaLabelledBy: o
   });
-  return /* @__PURE__ */ n(Qe.Root, {
+  return /* @__PURE__ */ n(en.Root, {
     checked: e,
     onCheckedChange: (c) => t(c),
     disabled: i,
-    className: ki,
+    className: zi,
     ...l,
-    children: /* @__PURE__ */ n(Qe.Thumb, { className: Mi })
+    children: /* @__PURE__ */ n(en.Thumb, { className: Hi })
   });
-}, Di = "uz3g761", zi = "tpcnun0 uz3g760", Fi = ({ value: e, onChange: t, onCommit: i, placeholder: r, isDisabled: a, hasError: o, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
+}, Fi = "uz3g761", Bi = "tpcnun0 uz3g760", Ki = ({ value: e, onChange: t, onCommit: i, placeholder: r, isDisabled: o, hasError: a, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
   const u = Y({
     id: s,
     ariaLabel: l,
     ariaLabelledBy: c
   });
-  return /* @__PURE__ */ n(Qn, {
-    className: zi,
-    "data-error": o === !0,
-    children: /* @__PURE__ */ n(ea, {
-      className: Di,
+  return /* @__PURE__ */ n(et, {
+    className: Bi,
+    "data-error": a === !0,
+    children: /* @__PURE__ */ n(aa, {
+      className: Fi,
       value: e,
       onValueChange: (d) => t(d),
       onBlur: i,
       placeholder: r,
-      disabled: a,
-      "aria-invalid": o === !0 ? !0 : void 0,
+      disabled: o,
+      "aria-invalid": a === !0 ? !0 : void 0,
       ...u
     })
   });
-}, Hi = "cnu9yl0", Vi = "cnu9yl1";
-var Ki = ({ options: e, value: t, onChange: i, onCommit: r, itemLayout: a = "inline", isDisabled: o, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
+}, Gi = "cnu9yl0", Ui = "cnu9yl1";
+var Wi = ({ options: e, value: t, onChange: i, onCommit: r, itemLayout: o = "inline", isDisabled: a, ariaLabel: l, ariaLabelledBy: c, id: s }) => {
   const u = Y({
     id: s,
     ariaLabel: l,
     ariaLabelledBy: c
-  }), d = a === "stacked", { commitAfterChange: h, gestureHandlers: v } = Pe(r);
-  return /* @__PURE__ */ n(Nn, {
-    className: Hi,
+  }), d = o === "stacked", { commitAfterChange: h, gestureHandlers: v } = Pe(r);
+  return /* @__PURE__ */ n(kn, {
+    className: Gi,
     value: t,
-    onValueChange: (m) => {
-      i(m), h();
+    onValueChange: (p) => {
+      i(p), h();
     },
     ...v,
-    disabled: o,
+    disabled: a,
     ...u,
-    children: e.map((m) => /* @__PURE__ */ p(Ln.Root, {
-      value: m.value,
-      disabled: m.isDisabled,
-      className: re(Vi, d && "cnu9yl2"),
-      "aria-label": Gi(m, d),
-      children: [m.icon, et(m, d) && /* @__PURE__ */ n("span", {
+    children: e.map((p) => /* @__PURE__ */ m(Nn.Root, {
+      value: p.value,
+      disabled: p.isDisabled,
+      className: re(Ui, d && "cnu9yl2"),
+      "aria-label": qi(p, d),
+      children: [p.icon, tt(p, d) && /* @__PURE__ */ n("span", {
         className: "cnu9yl3",
-        children: m.label
+        children: p.label
       })]
-    }, m.value))
+    }, p.value))
   });
-}, et = (e, t) => e.icon === void 0 || t, Gi = (e, t) => {
-  if (!et(e, t))
+}, tt = (e, t) => e.icon === void 0 || t, qi = (e, t) => {
+  if (!tt(e, t))
     return e.label;
-}, nt = {
-  ToggleGroup: Ki,
-  Switch: Ri,
-  Slider: Ei,
-  RadioGrid: mi,
-  Button: oi,
-  TextField: Fi,
-  NumberField: ci,
-  Select: wi
-}, tt = ue(nt), Bi = ({ controls: e, children: t }) => {
-  const i = O(() => ({
-    ...nt,
+}, rt = {
+  ToggleGroup: Wi,
+  Switch: Vi,
+  Slider: Ri,
+  RadioGrid: fi,
+  Button: ci,
+  TextField: Ki,
+  NumberField: mi,
+  Select: Ti
+}, at = ue(rt), $i = ({ controls: e, children: t }) => {
+  const i = k(() => ({
+    ...rt,
     ...e
   }), [e]);
-  return /* @__PURE__ */ n(tt.Provider, {
+  return /* @__PURE__ */ n(at.Provider, {
     value: i,
     children: t
   });
-}, _ = () => ae(tt), Ui = "_12lhx9e0", qi = ({ children: e }) => /* @__PURE__ */ n("div", {
-  className: Ui,
+}, E = () => ae(at), Zi = "_12lhx9e0", ji = ({ children: e }) => /* @__PURE__ */ n("div", {
+  className: Zi,
   children: e
-}), Wi = "_139ohwv0", V = ({ children: e }) => /* @__PURE__ */ n("div", {
-  className: Wi,
+}), Xi = "_139ohwv0", F = ({ children: e }) => /* @__PURE__ */ n("div", {
+  className: Xi,
   children: e
-}), rt = ue(null), $i = rt.Provider, Zi = () => {
-  const e = ae(rt);
+}), ot = ue(null), Yi = ot.Provider, Qi = () => {
+  const e = ae(ot);
   if (!e) throw new Error("A section must be rendered inside <EditorPanel.Root>.");
   return e;
-}, Xi = "_1jlczkt0", ji = "data-graphy-editor-panel", Yi = {
-  List: V,
-  Grid: qi
+}, Ji = "_1jlczkt0", el = "data-graphy-editor-panel", nl = {
+  List: F,
+  Grid: ji
 };
-function Qi(e) {
+function tl(e) {
   if (e === void 0) return !1;
   const t = e.split(/\s+/);
   return t.includes("_1ii3bsb0") || t.includes("_1ii3bsb1");
 }
-var Ji = ({ handle: e, children: t, controls: i, defaultExpandedSection: r = void 0, className: a }) => {
-  const o = kt(e), { themeClass: l, inlineVarsStyle: c } = Me(), [s, u] = $(() => r ? [r] : []), d = O(() => ({
+var rl = ({ handle: e, children: t, controls: i, defaultExpandedSection: r = void 0, className: o }) => {
+  const a = Rt(e), { themeClass: l, inlineVarsStyle: c } = De(), [s, u] = $(() => r ? [r] : []), d = k(() => ({
     expandSection: (h) => u([h]),
     collapseAllSections: () => u([])
   }), []);
-  return /* @__PURE__ */ n(Ve.Provider, {
-    value: o,
-    children: /* @__PURE__ */ n(Bi, {
+  return /* @__PURE__ */ n(Ke.Provider, {
+    value: a,
+    children: /* @__PURE__ */ n($i, {
       controls: i,
-      children: /* @__PURE__ */ n($i, {
+      children: /* @__PURE__ */ n(Yi, {
         value: d,
         children: /* @__PURE__ */ n(le.Root, {
-          [ji]: "",
-          className: re(Xi, a, { [l]: !Qi(a) }),
+          [el]: "",
+          className: re(Ji, o, { [l]: !tl(o) }),
           style: c,
           value: s,
           onValueChange: (h) => u(h),
@@ -2213,37 +2213,37 @@ var Ji = ({ handle: e, children: t, controls: i, defaultExpandedSection: r = voi
       })
     })
   });
-}, at = {
-  Root: Ji,
-  Controls: Yi
-}, ln = {
+}, it = {
+  Root: rl,
+  Controls: nl
+}, cn = {
   stack: "pr583x0",
   grid: "pr583x1"
-}, sn = "pr583x2", el = "pr583x3", b = ({ label: e, layout: t = "grid", children: i }) => {
-  const r = de(), a = de();
+}, dn = "pr583x2", al = "pr583x3", C = ({ label: e, layout: t = "grid", children: i }) => {
+  const r = de(), o = de();
   return e === void 0 ? /* @__PURE__ */ n("div", {
-    className: ln[t],
+    className: cn[t],
     children: /* @__PURE__ */ n("div", {
-      className: sn,
+      className: dn,
       children: i
     })
-  }) : /* @__PURE__ */ p("div", {
-    className: ln[t],
+  }) : /* @__PURE__ */ m("div", {
+    className: cn[t],
     children: [/* @__PURE__ */ n("label", {
       id: r,
-      htmlFor: a,
-      className: el,
+      htmlFor: o,
+      className: al,
       children: e
     }), /* @__PURE__ */ n("div", {
-      className: sn,
-      children: /* @__PURE__ */ n(Yn, {
+      className: dn,
+      children: /* @__PURE__ */ n(Jn, {
         labelId: r,
-        controlId: a,
+        controlId: o,
         children: i
       })
     })]
   });
-}, nl = (e) => /* @__PURE__ */ n(M, {
+}, ol = (e) => /* @__PURE__ */ n(I, {
   ...e,
   children: /* @__PURE__ */ n("g", {
     stroke: "currentColor",
@@ -2252,25 +2252,25 @@ var Ji = ({ handle: e, children: t, controls: i, defaultExpandedSection: r = voi
     strokeLinejoin: "round",
     children: /* @__PURE__ */ n("path", { d: "m9 6 6 6-6 6" })
   })
-}), Ke = "_40zvwv0", Ge = "_40zvwv1", tl = "_40zvwv2", ot = "_40zvwv3", rl = "_40zvwv4 _40zvwv3";
-var al = "_40zvwv6";
-var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory: r, onOpenChange: a, children: o }) => t === "collapsible" ? /* @__PURE__ */ n(ll, {
+}), Ge = "_40zvwv0", Ue = "_40zvwv1", il = "_40zvwv2", lt = "_40zvwv3", ll = "_40zvwv4 _40zvwv3";
+var sl = "_40zvwv6";
+var cl = "_40zvwv8", D = ({ title: e, layout: t = "fixed", preview: i, accessory: r, onOpenChange: o, children: a }) => t === "collapsible" ? /* @__PURE__ */ n(hl, {
   title: e,
   preview: i,
   accessory: r,
-  onOpenChange: a,
-  children: o
-}) : t === "inline" && i === void 0 ? /* @__PURE__ */ n(il, {
+  onOpenChange: o,
+  children: a
+}) : t === "inline" && i === void 0 ? /* @__PURE__ */ n(dl, {
   title: e,
   accessory: r,
-  children: o
-}) : /* @__PURE__ */ p("div", {
-  className: Ke,
-  children: [/* @__PURE__ */ p("div", {
-    className: Ge,
+  children: a
+}) : /* @__PURE__ */ m("div", {
+  className: Ge,
+  children: [/* @__PURE__ */ m("div", {
+    className: Ue,
     children: [
       /* @__PURE__ */ n("span", {
-        className: ot,
+        className: lt,
         children: e
       }),
       i !== void 0 && /* @__PURE__ */ n("span", {
@@ -2282,25 +2282,25 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
         children: r
       })
     ]
-  }), /* @__PURE__ */ n("div", { children: o })]
-}), il = ({ title: e, accessory: t, children: i }) => {
-  const r = de(), a = de();
+  }), /* @__PURE__ */ n("div", { children: a })]
+}), dl = ({ title: e, accessory: t, children: i }) => {
+  const r = de(), o = de();
   return /* @__PURE__ */ n("div", {
-    className: Ke,
-    children: /* @__PURE__ */ p("div", {
-      className: Ge,
+    className: Ge,
+    children: /* @__PURE__ */ m("div", {
+      className: Ue,
       children: [
         /* @__PURE__ */ n("label", {
           id: r,
-          htmlFor: a,
-          className: rl,
+          htmlFor: o,
+          className: ll,
           children: e
         }),
         /* @__PURE__ */ n("span", {
-          className: al,
-          children: /* @__PURE__ */ n(Yn, {
+          className: sl,
+          children: /* @__PURE__ */ n(Jn, {
             labelId: r,
-            controlId: a,
+            controlId: o,
             children: i
           })
         }),
@@ -2311,22 +2311,22 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
       ]
     })
   });
-}, ll = ({ title: e, preview: t, accessory: i, onOpenChange: r, children: a }) => {
-  const o = T();
-  return /* @__PURE__ */ p(le.Item, {
+}, hl = ({ title: e, preview: t, accessory: i, onOpenChange: r, children: o }) => {
+  const a = A();
+  return /* @__PURE__ */ m(le.Item, {
     value: e,
-    className: Ke,
+    className: Ge,
     onOpenChange: r,
-    children: [/* @__PURE__ */ p(le.Header, {
-      className: Ge,
+    children: [/* @__PURE__ */ m(le.Header, {
+      className: Ue,
       render: /* @__PURE__ */ n("div", {}),
       children: [
         /* @__PURE__ */ n(le.Trigger, {
-          className: tl,
-          "aria-label": o("editor.accessibility.toggleSection", { title: e })
+          className: il,
+          "aria-label": a("editor.accessibility.toggleSection", { title: e })
         }),
         /* @__PURE__ */ n("span", {
-          className: ot,
+          className: lt,
           children: e
         }),
         t !== void 0 && /* @__PURE__ */ n("span", {
@@ -2338,18 +2338,18 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
           children: i
         }),
         /* @__PURE__ */ n("span", {
-          className: ol,
-          children: /* @__PURE__ */ n(nl, { size: "sm" })
+          className: cl,
+          children: /* @__PURE__ */ n(ol, { size: "sm" })
         })
       ]
-    }), /* @__PURE__ */ n(le.Panel, { children: /* @__PURE__ */ n("div", { children: a }) })]
+    }), /* @__PURE__ */ n(le.Panel, { children: /* @__PURE__ */ n("div", { children: o }) })]
   });
-}, ys = ({ title: e, isChecked: t, onToggle: i, isDisabled: r, preview: a, children: o }) => {
-  const { expandSection: l, collapseAllSections: c } = Zi(), { Switch: s } = _();
-  return /* @__PURE__ */ n(H, {
+}, Ks = ({ title: e, isChecked: t, onToggle: i, isDisabled: r, preview: o, children: a }) => {
+  const { expandSection: l, collapseAllSections: c } = Qi(), { Switch: s } = E();
+  return /* @__PURE__ */ n(D, {
     title: e,
     layout: "collapsible",
-    preview: a,
+    preview: o,
     onOpenChange: (h) => {
       h && !t && r !== !0 && i(!0);
     },
@@ -2361,286 +2361,286 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
       isDisabled: r,
       ariaLabel: e
     }),
-    children: o
+    children: a
   });
-}, sl = {
+}, ul = {
   horizontal: ["bottom", "top"],
   vertical: ["left", "right"]
-}, cl = {
+}, ml = {
   left: "editor.axesPanel.position.left",
   right: "editor.axesPanel.position.right",
   top: "editor.axesPanel.position.top",
   bottom: "editor.axesPanel.position.bottom"
-}, dl = {
+}, pl = {
   x: "editor.axesPanel.mainAxisSection.xAxis",
   y: "editor.axesPanel.mainAxisSection.yAxis"
-}, cn = ({ axis: e, title: t, layout: i = "collapsible", preview: r }) => {
-  const a = E(), o = F(a), l = T(), { NumberField: c, Switch: s, TextField: u, ToggleGroup: d } = _();
-  if (!o) return null;
-  const h = o.coordSystem.type === "polar" ? o.coordSystem.axisMapping[e].geometry : "linear", v = o.config.axes[e], m = o.scales[e], g = m?.spec, y = g?.scaleType === "continuous" ? g : void 0;
-  if (h === "circular" || h === "radial" && y === void 0) return null;
-  const I = g !== void 0 && "reverse" in g ? g : void 0, S = g?.scaleType === "continuous" || g?.scaleType === "datetime", f = e === "y" && y !== void 0 && o.layers.some((C) => C.yScaleType === "primary" && C.geom === "bar"), P = y?.transform === "log", x = y?.domainMax ?? null, R = hl(y), K = (C, Z) => C.map((me) => ({
+}, hn = ({ axis: e, title: t, layout: i = "collapsible", preview: r }) => {
+  const o = M(), a = R(o), l = A(), { NumberField: c, Switch: s, TextField: u, ToggleGroup: d } = E();
+  if (!a) return null;
+  const h = a.coordSystem.type === "polar" ? a.coordSystem.axisMapping[e].geometry : "linear", v = a.config.axes[e], p = a.scales[e], g = p?.spec, S = g?.scaleType === "continuous" ? g : void 0;
+  if (h === "circular" || h === "radial" && S === void 0) return null;
+  const P = g !== void 0 && "reverse" in g ? g : void 0, y = g?.scaleType === "continuous" || g?.scaleType === "datetime", f = e === "y" && S !== void 0 && a.layers.some((b) => b.yScaleType === "primary" && b.geom === "bar"), x = S?.transform === "log", T = S?.domainMax ?? null, z = gl(S), B = (b, Z) => b.map((me) => ({
     value: me,
     label: Z(me)
-  })), N = o.guides.axes.find((C) => C.scaleAestheticKey === e)?.position, D = sl[N === "bottom" || N === "top" || N === void 0 && e === "x" ? "horizontal" : "vertical"], A = o.guides.legends.drawn.some((C) => D.some((Z) => Z === C.position)), w = D.map((C) => ({
-    value: C,
-    label: l(cl[C])
-  })), L = K(["auto", "edges"], (C) => l(C === "edges" ? "editor.axesPanel.labelMode.edges" : "editor.axesPanel.labelMode.auto")), Q = K(["linear", "log"], (C) => l(C === "log" ? "editor.axesPanel.scale.log" : "editor.axesPanel.scale.auto")), ct = K([
+  })), N = a.guides.axes.find((b) => b.scaleAestheticKey === e)?.position, H = ul[N === "bottom" || N === "top" || N === void 0 && e === "x" ? "horizontal" : "vertical"], L = a.guides.legends.drawn.some((b) => H.some((Z) => Z === b.position)), w = H.map((b) => ({
+    value: b,
+    label: l(ml[b])
+  })), O = B(["auto", "edges"], (b) => l(b === "edges" ? "editor.axesPanel.labelMode.edges" : "editor.axesPanel.labelMode.auto")), Q = B(["linear", "log"], (b) => l(b === "log" ? "editor.axesPanel.scale.log" : "editor.axesPanel.scale.auto")), ht = B([
     "auto",
     "zero",
     "custom"
-  ], (C) => l(C === "zero" ? "editor.axesPanel.startFrom.zero" : C === "custom" ? "editor.axesPanel.startFrom.custom" : "editor.axesPanel.startFrom.auto")), dt = K(["auto", "custom"], (C) => l(C === "custom" ? "editor.axesPanel.endAt.custom" : "editor.axesPanel.endAt.auto")), ht = K(["no", "yes"], (C) => l(C === "yes" ? "editor.axesPanel.yesNo.yes" : "editor.axesPanel.yesNo.no")), ut = (C) => {
-    a.commands.dispatch(new Jt({
+  ], (b) => l(b === "zero" ? "editor.axesPanel.startFrom.zero" : b === "custom" ? "editor.axesPanel.startFrom.custom" : "editor.axesPanel.startFrom.auto")), ut = B(["auto", "custom"], (b) => l(b === "custom" ? "editor.axesPanel.endAt.custom" : "editor.axesPanel.endAt.auto")), mt = B(["no", "yes"], (b) => l(b === "yes" ? "editor.axesPanel.yesNo.yes" : "editor.axesPanel.yesNo.no")), pt = (b) => {
+    o.commands.dispatch(new nr({
       axis: e,
-      isVisible: C
+      isVisible: b
     }));
-  }, mt = (C) => {
-    a.commands.dispatch(new Xt({
+  }, gt = (b) => {
+    o.commands.dispatch(new Yt({
       axis: e,
-      label: C === "" ? null : C
+      label: b === "" ? null : b
     }), { transient: !0 });
-  }, pt = (C) => {
-    a.commands.dispatch(new Qt({
+  }, vt = (b) => {
+    o.commands.dispatch(new er({
       axis: e,
-      isVisible: C
+      isVisible: b
     }));
-  }, gt = (C) => {
-    a.commands.dispatch(new Yt({
+  }, ft = (b) => {
+    o.commands.dispatch(new Jt({
       axis: e,
-      tickMode: C === "edges" ? "edges" : "auto"
+      tickMode: b === "edges" ? "edges" : "auto"
     }));
-  }, vt = (C) => {
-    a.commands.dispatch(new Pr({
+  }, Ct = (b) => {
+    o.commands.dispatch(new Tr({
       scaledAesthetic: e,
-      reverse: C === "yes"
+      reverse: b === "yes"
     }));
-  }, ft = (C) => {
-    a.commands.dispatch(new Ir({
+  }, bt = (b) => {
+    o.commands.dispatch(new Ar({
       scaledAesthetic: e,
-      transform: C === "log" ? "log" : "linear"
+      transform: b === "log" ? "log" : "linear"
     }));
-  }, qe = (C) => {
-    a.commands.dispatch(new pe({
+  }, $e = (b) => {
+    o.commands.dispatch(new pe({
       scaledAesthetic: e,
-      ...C
+      ...b
     }), { transient: !0 });
-  }, bt = (C) => {
-    C !== null && qe({ domainMin: C });
-  }, Ct = (C) => {
-    C !== null && qe({ domainMax: C });
-  }, St = (C) => {
-    if (y) {
-      if (C === "custom") {
-        y.zero && a.commands.dispatch(new je({
+  }, yt = (b) => {
+    b !== null && $e({ domainMin: b });
+  }, St = (b) => {
+    b !== null && $e({ domainMax: b });
+  }, wt = (b) => {
+    if (S) {
+      if (b === "custom") {
+        S.zero && o.commands.dispatch(new Qe({
           scaledAesthetic: e,
           zero: !1
-        })), a.commands.dispatch(new pe({
+        })), o.commands.dispatch(new pe({
           scaledAesthetic: e,
-          domainMin: dn(m?.domain, "start")
+          domainMin: un(p?.domain, "start")
         }));
         return;
       }
-      y.domainMin !== null && a.commands.dispatch(new pe({
+      S.domainMin !== null && o.commands.dispatch(new pe({
         scaledAesthetic: e,
         domainMin: null
-      })), a.commands.dispatch(new je({
+      })), o.commands.dispatch(new Qe({
         scaledAesthetic: e,
-        zero: C === "zero"
+        zero: b === "zero"
       }));
     }
-  }, yt = (C) => {
-    const Z = C === "custom" ? dn(m?.domain, "end") : null;
-    a.commands.dispatch(new pe({
+  }, xt = (b) => {
+    const Z = b === "custom" ? un(p?.domain, "end") : null;
+    o.commands.dispatch(new pe({
       scaledAesthetic: e,
       domainMax: Z
     }));
-  }, wt = (C) => {
-    const Z = D.find((me) => me === C);
-    Z && a.commands.dispatch(new jt({
+  }, Pt = (b) => {
+    const Z = H.find((me) => me === b);
+    Z && o.commands.dispatch(new Qt({
       axis: e,
       position: Z
     }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: t ?? l(dl[e]),
+  return /* @__PURE__ */ n(D, {
+    title: t ?? l(pl[e]),
     layout: i,
     preview: r,
-    children: /* @__PURE__ */ p(V, { children: [
-      /* @__PURE__ */ n(b, {
+    children: /* @__PURE__ */ m(F, { children: [
+      /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.visible"),
         children: /* @__PURE__ */ n(s, {
           isChecked: v.isVisible,
-          onChange: ut
+          onChange: pt
         })
       }),
-      h === "linear" && /* @__PURE__ */ p(q, { children: [/* @__PURE__ */ n(b, {
+      h === "linear" && /* @__PURE__ */ m(W, { children: [/* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.title"),
         children: /* @__PURE__ */ n(u, {
           value: v.label ?? "",
-          onChange: mt,
-          onCommit: a.commands.seal
+          onChange: gt,
+          onCommit: o.commands.seal
         })
-      }), /* @__PURE__ */ n(b, {
+      }), /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.ticks"),
         children: /* @__PURE__ */ n(s, {
           isChecked: v.ticks.isVisible,
-          onChange: pt
+          onChange: vt
         })
       })] }),
-      S && /* @__PURE__ */ n(b, {
+      y && /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.labels"),
         children: /* @__PURE__ */ n(d, {
           value: v.ticks.mode,
-          options: L,
-          onChange: gt
+          options: O,
+          onChange: ft
         })
       }),
-      y && h === "linear" && !A && /* @__PURE__ */ n(b, {
+      S && h === "linear" && !L && /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.position"),
         children: /* @__PURE__ */ n(d, {
           value: N ?? v.position,
           options: w,
-          onChange: wt
+          onChange: Pt
         })
       }),
-      I !== void 0 && /* @__PURE__ */ n(b, {
+      P !== void 0 && /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.reverse"),
         children: /* @__PURE__ */ n(d, {
-          value: I.reverse === !0 ? "yes" : "no",
-          options: ht,
-          onChange: vt
+          value: P.reverse === !0 ? "yes" : "no",
+          options: mt,
+          onChange: Ct
         })
       }),
-      y && !f && /* @__PURE__ */ n(b, {
+      S && !f && /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.scale"),
         children: /* @__PURE__ */ n(d, {
-          value: P ? "log" : "linear",
+          value: x ? "log" : "linear",
           options: Q,
-          onChange: ft
+          onChange: bt
         })
       }),
-      y && !P && /* @__PURE__ */ p(q, { children: [
-        !f && /* @__PURE__ */ p(q, { children: [/* @__PURE__ */ n(b, {
+      S && !x && /* @__PURE__ */ m(W, { children: [
+        !f && /* @__PURE__ */ m(W, { children: [/* @__PURE__ */ n(C, {
           label: l("editor.axesPanel.controls.startFrom"),
           children: /* @__PURE__ */ n(d, {
-            value: R,
-            options: ct,
-            onChange: St
+            value: z,
+            options: ht,
+            onChange: wt
           })
-        }), R === "custom" && /* @__PURE__ */ n(b, {
+        }), z === "custom" && /* @__PURE__ */ n(C, {
           label: l("editor.axesPanel.controls.value"),
           children: /* @__PURE__ */ n(c, {
-            value: y.domainMin ?? null,
-            onChange: bt,
-            onCommit: a.commands.seal
+            value: S.domainMin ?? null,
+            onChange: yt,
+            onCommit: o.commands.seal
           })
         })] }),
-        /* @__PURE__ */ n(b, {
+        /* @__PURE__ */ n(C, {
           label: l("editor.axesPanel.controls.endAt"),
           children: /* @__PURE__ */ n(d, {
-            value: x === null ? "auto" : "custom",
-            options: dt,
-            onChange: yt
+            value: T === null ? "auto" : "custom",
+            options: ut,
+            onChange: xt
           })
         }),
-        x !== null && /* @__PURE__ */ n(b, {
+        T !== null && /* @__PURE__ */ n(C, {
           label: l("editor.axesPanel.controls.value"),
           children: /* @__PURE__ */ n(c, {
-            value: x,
-            onChange: Ct,
-            onCommit: a.commands.seal
+            value: T,
+            onChange: St,
+            onCommit: o.commands.seal
           })
         })
       ] })
     ] })
   });
-}, hl = (e) => e === void 0 ? "auto" : e.domainMin !== null && e.domainMin !== void 0 ? "custom" : e.zero === !0 ? "zero" : "auto", dn = (e, t) => {
+}, gl = (e) => e === void 0 ? "auto" : e.domainMin !== null && e.domainMin !== void 0 ? "custom" : e.zero === !0 ? "zero" : "auto", un = (e, t) => {
   const i = t === "start" ? e?.[0] : e?.[e.length - 1];
   return typeof i == "number" ? i : 0;
-}, Be = ({ value: e, onChange: t }) => {
-  const i = E(), r = T(), { TextField: a } = _(), o = e !== null && typeof e != "string", l = (c) => t(c === "" ? null : c);
-  return /* @__PURE__ */ n(b, {
+}, We = ({ value: e, onChange: t }) => {
+  const i = M(), r = A(), { TextField: o } = E(), a = e !== null && typeof e != "string", l = (c) => t(c === "" ? null : c);
+  return /* @__PURE__ */ n(C, {
     label: r("editor.elementsPanel.contentValue"),
-    children: /* @__PURE__ */ n(a, {
+    children: /* @__PURE__ */ n(o, {
       value: typeof e == "string" ? e : "",
       onChange: l,
       onCommit: i.commands.seal,
-      isDisabled: o
+      isDisabled: a
     })
   });
-}, ul = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Switch: l } = _();
-  if (!a) return null;
-  const c = a.config.content, s = (d) => {
-    r.commands.dispatch(new we({
+}, vl = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Switch: l } = E();
+  if (!o) return null;
+  const c = o.config.content, s = (d) => {
+    r.commands.dispatch(new xe({
       slot: "caption",
       isVisible: d
     }));
   }, u = (d) => {
-    r.commands.dispatch(new tr({ caption: d }), { transient: !0 });
+    r.commands.dispatch(new or({ caption: d }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.elementsPanel.footerSection.caption"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.elementsPanel.footerSection.caption"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.elementsPanel.contentVisible"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.elementsPanel.contentVisible"),
       children: /* @__PURE__ */ n(l, {
         isChecked: c.isCaptionVisible,
         onChange: s
       })
-    }), /* @__PURE__ */ n(Be, {
+    }), /* @__PURE__ */ n(We, {
       value: c.caption,
       onChange: u
     })] })
   });
-}, hn = /^[a-z][a-z\d+.-]*:/i, ml = {}, pl = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Switch: l } = _();
-  if (!a) return null;
-  const c = a.config.content, s = (u) => {
-    r.commands.dispatch(new we({
+}, mn = /^[a-z][a-z\d+.-]*:/i, fl = {}, Cl = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Switch: l } = E();
+  if (!o) return null;
+  const c = o.config.content, s = (u) => {
+    r.commands.dispatch(new xe({
       slot: "source",
       isVisible: u
     }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.elementsPanel.sourceSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.elementsPanel.sourceSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.elementsPanel.contentVisible"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.elementsPanel.contentVisible"),
       children: /* @__PURE__ */ n(l, {
         isChecked: c.isSourceVisible,
         onChange: s
       })
-    }), /* @__PURE__ */ n(gl, { source: c.source ?? ml })] })
+    }), /* @__PURE__ */ n(bl, { source: c.source ?? fl })] })
   });
-}, gl = ({ source: e }) => {
-  const t = E(), i = T(), { TextField: r } = _(), a = (s) => {
+}, bl = ({ source: e }) => {
+  const t = M(), i = A(), { TextField: r } = E(), o = (s) => {
     const u = (s.label ?? "") !== "" || (s.url ?? "") !== "";
-    t.commands.dispatch(new rr({ source: u ? s : null }), { transient: !0 });
-  }, o = () => {
+    t.commands.dispatch(new ir({ source: u ? s : null }), { transient: !0 });
+  }, a = () => {
     const s = e.url ?? "";
-    s !== "" && !hn.test(s) && a({
+    s !== "" && !mn.test(s) && o({
       ...e,
       url: `https://${s}`
     }), t.commands.seal();
-  }, l = (s) => a({
+  }, l = (s) => o({
     ...e,
     url: s
-  }), c = (s) => a({
+  }), c = (s) => o({
     ...e,
     label: s
   });
-  return /* @__PURE__ */ p(q, { children: [/* @__PURE__ */ n(b, {
+  return /* @__PURE__ */ m(W, { children: [/* @__PURE__ */ n(C, {
     label: i("editor.elementsPanel.sourceSection.url"),
     children: /* @__PURE__ */ n(r, {
       value: e.url ?? "",
       onChange: l,
-      onCommit: o,
-      hasError: hn.test(e.url ?? "") && !Zr(e.url)
+      onCommit: a,
+      hasError: mn.test(e.url ?? "") && !Yr(e.url)
     })
-  }), /* @__PURE__ */ n(b, {
+  }), /* @__PURE__ */ n(C, {
     label: i("editor.elementsPanel.sourceSection.name"),
     children: /* @__PURE__ */ n(r, {
       value: e.label ?? "",
@@ -2648,33 +2648,33 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
       onCommit: t.commands.seal
     })
   })] });
-}, vl = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Switch: l } = _();
-  if (!a) return null;
-  const c = a.config.content, s = (d) => {
-    r.commands.dispatch(new we({
+}, yl = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Switch: l } = E();
+  if (!o) return null;
+  const c = o.config.content, s = (d) => {
+    r.commands.dispatch(new xe({
       slot: "subtitle",
       isVisible: d
     }));
   }, u = (d) => {
-    r.commands.dispatch(new ar({ subtitle: d }), { transient: !0 });
+    r.commands.dispatch(new lr({ subtitle: d }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.elementsPanel.headerSection.subtitle"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.elementsPanel.headerSection.subtitle"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.elementsPanel.contentVisible"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.elementsPanel.contentVisible"),
       children: /* @__PURE__ */ n(l, {
         isChecked: c.isSubtitleVisible,
         onChange: s
       })
-    }), /* @__PURE__ */ n(Be, {
+    }), /* @__PURE__ */ n(We, {
       value: c.subtitle,
       onChange: u
     })] })
   });
-}, Oe = [
+}, ke = [
   0.8,
   1,
   1.2,
@@ -2685,95 +2685,95 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
   2.5,
   3,
   4
-], fl = Oe.length / 2, bl = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { RadioGrid: l } = _();
-  if (!a) return null;
-  const { textScale: c } = a.config.appearance, s = (h) => o("editor.elementsPanel.textSizeSection.scaleFormat", { value: `${h}` }), u = Oe.map((h) => ({
+], Sl = ke.length / 2, wl = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { RadioGrid: l } = E();
+  if (!o) return null;
+  const { textScale: c } = o.config.appearance, s = (h) => a("editor.elementsPanel.textSizeSection.scaleFormat", { value: `${h}` }), u = ke.map((h) => ({
     value: `${h}`,
     label: s(h)
   })), d = (h) => {
-    const v = Oe.find((m) => `${m}` === h);
-    v !== void 0 && r.commands.dispatch(new Zt({ textScale: v }));
+    const v = ke.find((p) => `${p}` === h);
+    v !== void 0 && r.commands.dispatch(new Xt({ textScale: v }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.elementsPanel.textSizeSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.elementsPanel.textSizeSection.title"),
     layout: t,
     preview: i ?? s(c),
     children: /* @__PURE__ */ n(l, {
       value: `${c}`,
       options: u,
-      columns: fl,
+      columns: Sl,
       onChange: d,
-      ariaLabel: o("editor.elementsPanel.textSizeSection.title")
+      ariaLabel: a("editor.elementsPanel.textSizeSection.title")
     })
   });
-}, Cl = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Switch: l } = _();
-  if (!a) return null;
-  const c = a.config.content, s = (d) => {
-    r.commands.dispatch(new we({
+}, xl = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Switch: l } = E();
+  if (!o) return null;
+  const c = o.config.content, s = (d) => {
+    r.commands.dispatch(new xe({
       slot: "title",
       isVisible: d
     }));
   }, u = (d) => {
-    r.commands.dispatch(new or({ title: d }), { transient: !0 });
+    r.commands.dispatch(new sr({ title: d }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.elementsPanel.headerSection.toggleTitle"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.elementsPanel.headerSection.toggleTitle"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.elementsPanel.contentVisible"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.elementsPanel.contentVisible"),
       children: /* @__PURE__ */ n(l, {
         isChecked: c.isTitleVisible,
         onChange: s
       })
-    }), /* @__PURE__ */ n(Be, {
+    }), /* @__PURE__ */ n(We, {
       value: c.title,
       onChange: u
     })] })
   });
-}, ws = ({ children: e, ...t }) => /* @__PURE__ */ n(at.Root, {
+}, Gs = ({ children: e, ...t }) => /* @__PURE__ */ n(it.Root, {
   ...t,
-  children: e ?? /* @__PURE__ */ p(q, { children: [
-    /* @__PURE__ */ n(Cl, {}),
+  children: e ?? /* @__PURE__ */ m(W, { children: [
+    /* @__PURE__ */ n(xl, {}),
+    /* @__PURE__ */ n(yl, {}),
     /* @__PURE__ */ n(vl, {}),
-    /* @__PURE__ */ n(ul, {}),
-    /* @__PURE__ */ n(pl, {}),
-    /* @__PURE__ */ n(bl, {})
+    /* @__PURE__ */ n(Cl, {}),
+    /* @__PURE__ */ n(wl, {})
   ] })
-}), Ps = ({ children: e, ...t }) => /* @__PURE__ */ n(at.Root, {
+}), Us = ({ children: e, ...t }) => /* @__PURE__ */ n(it.Root, {
   ...t,
-  children: e ?? /* @__PURE__ */ p(q, { children: [/* @__PURE__ */ n(cn, { axis: "x" }), /* @__PURE__ */ n(cn, { axis: "y" })] })
-}), Ie = (e) => `${e}px`, it = (e) => `${Math.round(e * 100)}%`, Sl = (e) => `${e}°`, yl = 24, un = ["dim", "desaturate"], Is = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Slider: l, ToggleGroup: c } = _();
-  if (!a) return null;
-  const { cornerRadius: s } = a.config.appearance, u = jr(a.spec), d = un.map((m) => ({
-    value: m,
-    label: o(m === "dim" ? "editor.highlighting.highlightStyle.tint" : "editor.highlighting.highlightStyle.grey")
-  })), h = (m) => {
-    r.commands.dispatch(new $t({ cornerRadius: m }), { transient: !0 });
-  }, v = (m) => {
-    const g = un.find((y) => y === m);
-    g && r.commands.dispatch(new mr({ dimStyle: g }));
+  children: e ?? /* @__PURE__ */ m(W, { children: [/* @__PURE__ */ n(hn, { axis: "x" }), /* @__PURE__ */ n(hn, { axis: "y" })] })
+}), Ie = (e) => `${e}px`, st = (e) => `${Math.round(e * 100)}%`, Pl = (e) => `${e}°`, Il = 24, pn = ["dim", "desaturate"], Ws = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Slider: l, ToggleGroup: c } = E();
+  if (!o) return null;
+  const { cornerRadius: s } = o.config.appearance, u = ea(o.spec), d = pn.map((p) => ({
+    value: p,
+    label: a(p === "dim" ? "editor.highlighting.highlightStyle.tint" : "editor.highlighting.highlightStyle.grey")
+  })), h = (p) => {
+    r.commands.dispatch(new jt({ cornerRadius: p }), { transient: !0 });
+  }, v = (p) => {
+    const g = pn.find((S) => S === p);
+    g && r.commands.dispatch(new vr({ dimStyle: g }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.colorPanel.appearanceSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.colorPanel.appearanceSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.colorPanel.borderSection.cornerRadius"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.colorPanel.borderSection.cornerRadius"),
       children: /* @__PURE__ */ n(l, {
         value: s,
         min: 0,
-        max: yl,
+        max: Il,
         step: 1,
         formatValue: Ie,
         onChange: h,
         onCommit: r.commands.seal
       })
-    }), /* @__PURE__ */ n(b, {
-      label: o("editor.colorPanel.appearanceSection.highlightStyle"),
+    }), /* @__PURE__ */ n(C, {
+      label: a("editor.colorPanel.appearanceSection.highlightStyle"),
       children: /* @__PURE__ */ n(c, {
         value: u,
         options: d,
@@ -2781,481 +2781,939 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
       })
     })] })
   });
-}, Ue = (e, t) => {
-  const { colorScheme: i } = Me();
-  return O(() => {
-    const r = e?.layers.find((a) => a.id === t);
-    return r === void 0 ? null : Fr({ colorScheme: i }).geomReaders(r);
+}, qe = (e, t) => {
+  const { colorScheme: i } = De();
+  return k(() => {
+    const r = e?.layers.find((o) => o.id === t);
+    return r === void 0 ? null : Br({ colorScheme: i }).geomReaders(r);
   }, [
     e,
     t,
     i
   ]);
-}, wl = 0.05, xs = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Slider: l, ToggleGroup: c } = _(), s = a ? In(a.spec.layers, "bar") : void 0, u = Ue(a, s?.id ?? null);
-  if (!a || !s || a.coordSystem.type === "polar" && a.coordSystem.bandAxis === null) return null;
-  const d = (m) => {
-    r.commands.dispatch(new nr({
+}, Tl = 0.05, qs = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Slider: l, ToggleGroup: c } = E(), s = o ? Tn(o.spec.layers, "bar") : void 0, u = qe(o, s?.id ?? null);
+  if (!o || !s || o.coordSystem.type === "polar" && o.coordSystem.bandAxis === null) return null;
+  const d = (p) => {
+    r.commands.dispatch(new rr({
       layerId: s.id,
-      width: m
+      width: p
     }), { transient: !0 });
-  }, h = (m) => {
-    const g = We.find((y) => y === m);
-    g && r.commands.dispatch(new er({
+  }, h = (p) => {
+    const g = Ze.find((S) => S === p);
+    g && r.commands.dispatch(new tr({
       layerId: s.id,
       borderRadius: g
     }));
-  }, v = We.map((m) => ({
-    value: m,
-    label: o(`editor.graphPanel.barSection.roundingOptions.${m}`)
+  }, v = Ze.map((p) => ({
+    value: p,
+    label: a(`editor.graphPanel.barSection.roundingOptions.${p}`)
   }));
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.graphPanel.barSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.barSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.barSection.thickness"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.barSection.thickness"),
       children: /* @__PURE__ */ n(l, {
         value: s.params.width,
-        min: qt,
-        max: Ut,
-        step: wl,
-        formatValue: it,
+        min: $t,
+        max: qt,
+        step: Tl,
+        formatValue: st,
         onChange: d,
         onCommit: r.commands.seal
       })
-    }), /* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.barSection.rounding"),
+    }), /* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.barSection.rounding"),
       layout: "stack",
       children: /* @__PURE__ */ n(c, {
-        value: u?.get("borderRadius") ?? Vt,
+        value: u?.get("borderRadius") ?? Kt,
         options: v,
         onChange: h
       })
     })] })
   });
-}, Ts = ({ layerId: e, title: t, layout: i = "collapsible", preview: r }) => {
-  const a = E(), o = F(a), l = T(), { Switch: c } = _();
-  if (!o) return null;
-  const s = e === void 0 ? o.spec.layers[0] : o.spec.layers.find((N) => N.id === e);
+}, $s = ({ layerId: e, title: t, layout: i = "collapsible", preview: r }) => {
+  const o = M(), a = R(o), l = A(), { Switch: c } = E();
+  if (!a) return null;
+  const s = e === void 0 ? a.spec.layers[0] : a.spec.layers.find((N) => N.id === e);
   if (!s) return null;
-  const { showDataLabels: u, format: d, showStackTotals: h, showCategoryLabels: v } = s.dataLabels, m = o.coordSystem.type === "polar", g = s.geom === "bar", y = s.position === "stack" || s.position === "fill", I = g && !m && s.position === "stack", S = g && (!m || u), f = g || s.geom === "area" && y;
-  if (!Dr(s.geom, o.coordSystem.type)) return null;
-  const P = (N) => {
-    const D = new Tr({
+  const { showDataLabels: u, format: d, showStackTotals: h, showCategoryLabels: v } = s.dataLabels, p = a.coordSystem.type === "polar", g = s.geom === "bar", S = s.position === "stack" || s.position === "fill", P = g && !p && s.position === "stack", y = g && (!p || u), f = g || s.geom === "area" && S;
+  if (!Vr(s.geom, a.coordSystem.type)) return null;
+  const x = (N) => {
+    const H = new Or({
       layerId: s.id,
       showDataLabels: N
     });
-    a.commands.dispatch(D);
-  }, x = (N) => {
-    const D = new ir({
+    o.commands.dispatch(H);
+  }, T = (N) => {
+    const H = new cr({
       layerId: s.id,
       format: N ? "percentage" : "absolute"
     });
-    a.commands.dispatch(D);
-  }, R = (N) => {
-    const D = new Nr({
+    o.commands.dispatch(H);
+  }, z = (N) => {
+    const H = new Mr({
       layerId: s.id,
       showStackTotals: N
     });
-    a.commands.dispatch(D);
-  }, K = (N) => {
-    const D = new xr({
+    o.commands.dispatch(H);
+  }, B = (N) => {
+    const H = new Lr({
       layerId: s.id,
       showCategoryLabels: N
     });
-    a.commands.dispatch(D);
+    o.commands.dispatch(H);
   };
-  return /* @__PURE__ */ n(H, {
+  return /* @__PURE__ */ n(D, {
     title: t ?? l("editor.graphPanel.graphOptionsSection.title"),
     layout: i,
     preview: r,
-    children: /* @__PURE__ */ p(V, { children: [
-      /* @__PURE__ */ n(b, {
+    children: /* @__PURE__ */ m(F, { children: [
+      /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.graphOptions.dataLabels"),
         children: /* @__PURE__ */ n(c, {
           isChecked: u,
-          onChange: P
+          onChange: x
         })
       }),
-      u && f && /* @__PURE__ */ n(b, {
+      u && f && /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.graphOptions.showPercentages"),
         children: /* @__PURE__ */ n(c, {
           isChecked: d === "percentage",
-          onChange: x
+          onChange: T
         })
       }),
-      I && /* @__PURE__ */ n(b, {
+      P && /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.graphOptions.stackTotals"),
         children: /* @__PURE__ */ n(c, {
           isChecked: h,
-          onChange: R
+          onChange: z
         })
       }),
-      S && /* @__PURE__ */ n(b, {
+      y && /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.graphOptions.categoryLabels"),
         children: /* @__PURE__ */ n(c, {
           isChecked: v,
-          onChange: K
+          onChange: B
         })
       })
     ] })
   });
-}, mn = [
+}, Al = (e) => /* @__PURE__ */ m(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: [/* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.8",
+    d: "M10.394 12.734 5.63 7.652 0 13.822V16h16V8.741z"
+  }), /* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.3",
+    d: "M5.744 5.565 0 11.826V8l5.744-6.957 4.718 2.087L16 0v6.957l-5.538 4z"
+  })]
+}), Ll = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    transform: "rotate(90 8 8)",
+    children: [
+      /* @__PURE__ */ n("rect", {
+        width: "3.2",
+        height: "7.704",
+        y: "8.296",
+        fill: "currentColor",
+        fillOpacity: "0.8",
+        rx: ".533"
+      }),
+      /* @__PURE__ */ n("rect", {
+        width: "3.2",
+        height: "11.259",
+        x: "4.267",
+        y: "4.741",
+        fill: "currentColor",
+        fillOpacity: "0.3",
+        rx: ".533"
+      }),
+      /* @__PURE__ */ n("rect", {
+        width: "3.2",
+        height: "4.741",
+        x: "8.533",
+        y: "11.259",
+        fill: "currentColor",
+        fillOpacity: "0.8",
+        rx: ".533"
+      }),
+      /* @__PURE__ */ n("rect", {
+        width: "3.2",
+        height: "16",
+        x: "12.8",
+        fill: "currentColor",
+        fillOpacity: "0.3",
+        rx: ".533"
+      })
+    ]
+  })
+}), Ol = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    transform: "rotate(90 8 8)",
+    children: [/* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.8",
+      d: "M0 13.037h4.267v2.445a.52.52 0 0 1-.519.518H.518A.52.52 0 0 1 0 15.482zM5.867 7.704h4.266v7.778a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.518-.518zM11.733 10.074H16v5.408a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.519-.518z"
+    }), /* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.3",
+      d: "M0 12.445h4.267V.52A.52.52 0 0 0 3.748 0H.518A.52.52 0 0 0 0 .519zM5.867 7.111h4.266V.52A.52.52 0 0 0 9.615 0h-3.23a.52.52 0 0 0-.518.519zM11.733 9.481H16V.52A.52.52 0 0 0 15.482 0h-3.23a.52.52 0 0 0-.519.519z"
+    })]
+  })
+}), Nl = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    transform: "rotate(90 8 8)",
+    children: [/* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.8",
+      d: "M0 13.037h4.267v2.445a.52.52 0 0 1-.519.518H.518A.52.52 0 0 1 0 15.482zM5.867 7.704h4.266v7.778a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.518-.518zM11.733 10.074H16v5.408a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.519-.518z"
+    }), /* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.3",
+      d: "M0 7.037c0-.286.232-.518.519-.518h3.23c.286 0 .518.232.518.518v5.408H0zM5.867 7.111h4.266V4.074a.52.52 0 0 0-.518-.518h-3.23a.52.52 0 0 0-.518.518zM11.733 9.481H16V.52A.52.52 0 0 0 15.482 0h-3.23a.52.52 0 0 0-.519.519z"
+    })]
+  })
+}), kl = (e) => /* @__PURE__ */ m(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: [
+    /* @__PURE__ */ n("rect", {
+      width: "3.2",
+      height: "7.704",
+      y: "8.296",
+      fill: "currentColor",
+      fillOpacity: "0.8",
+      rx: ".533"
+    }),
+    /* @__PURE__ */ n("rect", {
+      width: "3.2",
+      height: "11.259",
+      x: "4.267",
+      y: "4.741",
+      fill: "currentColor",
+      fillOpacity: "0.3",
+      rx: ".533"
+    }),
+    /* @__PURE__ */ n("rect", {
+      width: "3.2",
+      height: "4.741",
+      x: "8.533",
+      y: "11.259",
+      fill: "currentColor",
+      fillOpacity: "0.8",
+      rx: ".533"
+    }),
+    /* @__PURE__ */ n("rect", {
+      width: "3.2",
+      height: "16",
+      x: "12.8",
+      fill: "currentColor",
+      fillOpacity: "0.3",
+      rx: ".533"
+    })
+  ]
+}), Ml = (e) => /* @__PURE__ */ m(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: [/* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.8",
+    d: "M0 13.037h4.267v2.445a.52.52 0 0 1-.519.518H.518A.52.52 0 0 1 0 15.482zM5.867 7.704h4.266v7.778a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.518-.518zM11.733 10.074H16v5.408a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.519-.518z"
+  }), /* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.3",
+    d: "M0 12.445h4.267V.52A.52.52 0 0 0 3.748 0H.518A.52.52 0 0 0 0 .519zM5.867 7.111h4.266V.52A.52.52 0 0 0 9.615 0h-3.23a.52.52 0 0 0-.518.519zM11.733 9.481H16V.52A.52.52 0 0 0 15.482 0h-3.23a.52.52 0 0 0-.519.519z"
+  })]
+}), El = (e) => /* @__PURE__ */ m(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: [/* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.8",
+    d: "M0 13.037h4.267v2.445a.52.52 0 0 1-.519.518H.518A.52.52 0 0 1 0 15.482zM5.867 7.704h4.266v7.778a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.518-.518zM11.733 10.074H16v5.408a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.519-.518z"
+  }), /* @__PURE__ */ n("path", {
+    fill: "currentColor",
+    fillOpacity: "0.3",
+    d: "M0 7.037c0-.286.232-.518.519-.518h3.23c.286 0 .518.232.518.518v5.408H0zM5.867 7.111h4.266V4.074a.52.52 0 0 0-.518-.518h-3.23a.52.52 0 0 0-.518.518zM11.733 9.481H16V.52A.52.52 0 0 0 15.482 0h-3.23a.52.52 0 0 0-.519.519z"
+  })]
+}), _l = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "5",
+    transform: "rotate(-90 8 8)",
+    children: [
+      /* @__PURE__ */ n("circle", {
+        cx: "8",
+        cy: "8",
+        r: "5.5",
+        pathLength: "100",
+        strokeOpacity: "0.3"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "8",
+        cy: "8",
+        r: "5.5",
+        pathLength: "100",
+        strokeOpacity: "0.6",
+        strokeDasharray: "25 100"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "8",
+        cy: "8",
+        r: "5.5",
+        pathLength: "100",
+        strokeOpacity: "0.8",
+        strokeDasharray: "25 100",
+        strokeDashoffset: "-25"
+      })
+    ]
+  })
+}), Rl = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    fill: "currentColor",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".993",
+    children: [/* @__PURE__ */ m("g", {
+      fillOpacity: "0.3",
+      strokeOpacity: "0.3",
+      children: [
+        /* @__PURE__ */ n("path", {
+          fill: "none",
+          d: "M1.4 12.2 6 6.4l4.2 1.2 4.4-4.2"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "1.4",
+          cy: "12.2",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "6",
+          cy: "6.4",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "10.2",
+          cy: "7.6",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "14.6",
+          cy: "3.4",
+          r: ".9",
+          stroke: "none"
+        })
+      ]
+    }), /* @__PURE__ */ m("g", {
+      fillOpacity: "0.8",
+      strokeOpacity: "0.8",
+      children: [
+        /* @__PURE__ */ n("path", {
+          fill: "none",
+          d: "M1.4 5.6 6 11.4l4.2-1.2 4.4 1.2"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "1.4",
+          cy: "5.6",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "6",
+          cy: "11.4",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "10.2",
+          cy: "10.2",
+          r: ".9",
+          stroke: "none"
+        }),
+        /* @__PURE__ */ n("circle", {
+          cx: "14.6",
+          cy: "11.4",
+          r: ".9",
+          stroke: "none"
+        })
+      ]
+    })]
+  })
+}), Dl = (e) => /* @__PURE__ */ m(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: [
+    /* @__PURE__ */ n("rect", {
+      width: "16",
+      height: "16",
+      fill: "currentColor",
+      fillOpacity: "0.3",
+      rx: "8"
+    }),
+    /* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.6",
+      d: "m7.999 16 .412-.01A8 8 0 0 0 8 0z"
+    }),
+    /* @__PURE__ */ n("path", {
+      fill: "currentColor",
+      fillOpacity: "0.8",
+      d: "M15.999 8a8 8 0 0 1-7.588 7.989l-.412.01V8z"
+    })
+  ]
+}), zl = (e) => /* @__PURE__ */ n(I, {
+  viewBox: "0 0 16 16",
+  ...e,
+  children: /* @__PURE__ */ m("g", {
+    fill: "currentColor",
+    fillOpacity: "0.8",
+    children: [
+      /* @__PURE__ */ n("circle", {
+        cx: "1.028",
+        cy: "13.897",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "2.57",
+        cy: "8.243",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "5.653",
+        cy: "12.355",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "8.223",
+        cy: "8.243",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "9.252",
+        cy: "3.618",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "12.849",
+        cy: "7.215",
+        r: "1.028"
+      }),
+      /* @__PURE__ */ n("circle", {
+        cx: "14.905",
+        cy: "1.561",
+        r: "1.028"
+      })
+    ]
+  })
+}), Hl = 0.55, Me = [
+  {
+    name: "column",
+    icon: kl,
+    summary: {
+      coordType: "cartesian",
+      geom: "bar",
+      position: "dodge"
+    }
+  },
+  {
+    name: "columnStacked",
+    icon: El,
+    summary: {
+      coordType: "cartesian",
+      geom: "bar",
+      position: "stack"
+    }
+  },
+  {
+    name: "columnStackedFill",
+    icon: Ml,
+    summary: {
+      coordType: "cartesian",
+      geom: "bar",
+      position: "fill"
+    }
+  },
+  {
+    name: "bar",
+    icon: Ll,
+    summary: {
+      coordType: "flip",
+      geom: "bar",
+      position: "dodge"
+    }
+  },
+  {
+    name: "barStacked",
+    icon: Nl,
+    summary: {
+      coordType: "flip",
+      geom: "bar",
+      position: "stack"
+    }
+  },
+  {
+    name: "barStackedFill",
+    icon: Ol,
+    summary: {
+      coordType: "flip",
+      geom: "bar",
+      position: "fill"
+    }
+  },
+  {
+    name: "line",
+    icon: Rl,
+    summary: {
+      coordType: "cartesian",
+      geom: "line",
+      position: "identity"
+    }
+  },
+  {
+    name: "areaStacked",
+    icon: Al,
+    summary: {
+      coordType: "cartesian",
+      geom: "area",
+      position: "stack"
+    }
+  },
+  {
+    name: "scatter",
+    icon: zl,
+    summary: {
+      coordType: "cartesian",
+      geom: "point",
+      position: "identity"
+    }
+  },
+  {
+    name: "pie",
+    icon: Dl,
+    summary: {
+      coordType: "polar",
+      geom: "bar",
+      position: "fill",
+      theta: "y",
+      innerRadius: 0
+    }
+  },
+  {
+    name: "donut",
+    icon: _l,
+    summary: {
+      coordType: "polar",
+      geom: "bar",
+      position: "fill",
+      theta: "y",
+      innerRadius: Hl
+    }
+  }
+], Vl = 0.05, Fl = (e) => e === null ? null : Me.find((t) => Kl(t.summary, e)) ?? null, Bl = (e, t) => {
+  const { summary: i } = e;
+  return i.coordType !== "polar" || !ye(i.innerRadius) || t === null || t.coordType !== "polar" || !ye(t.innerRadius) ? i : {
+    ...i,
+    innerRadius: t.innerRadius
+  };
+}, Kl = (e, t) => e.coordType !== t.coordType || e.geom !== t.geom || e.position !== t.position ? !1 : e.coordType !== "polar" || t.coordType !== "polar" ? !0 : e.theta === t.theta && ye(e.innerRadius) === ye(t.innerRadius), ye = (e) => e >= Vl, Gl = 3, Zs = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { RadioGrid: l } = E(), c = k(() => Me.map(({ name: h, icon: v }) => ({
+    value: h,
+    label: a(`editor.graphTypes.${h}`),
+    icon: /* @__PURE__ */ n(v, { size: "md" })
+  })), [a]);
+  if (!o) return null;
+  const s = Jr(o.spec), u = Fl(s), d = (h) => {
+    const v = Me.find((p) => p.name === h);
+    v && r.commands.dispatch(new ar(Bl(v, s)));
+  };
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.graphTypeSection.title"),
+    layout: t,
+    preview: i ?? a(u === null ? "editor.graphTypes.combo" : `editor.graphTypes.${u.name}`),
+    children: /* @__PURE__ */ n(l, {
+      value: u?.name ?? "",
+      options: c,
+      columns: Gl,
+      onChange: d,
+      ariaLabel: a("editor.graphPanel.graphTypeSection.title")
+    })
+  });
+}, gn = [
   "solid",
   "dashed",
   "dotted"
-], Pl = Number.parseFloat(Nt.gridLineWidth), Il = 8, xl = 0, As = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Slider: l, Switch: c, ToggleGroup: s } = _(), { themeValues: u } = Me();
-  if (!a) return null;
-  const d = a.guides.axes.filter(Tl);
+], Ul = Number.parseFloat(kt.gridLineWidth), Wl = 8, ql = 0, js = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Slider: l, Switch: c, ToggleGroup: s } = E(), { themeValues: u } = De();
+  if (!o) return null;
+  const d = o.guides.axes.filter($l);
   if (d.length === 0) return null;
-  const h = a.coordSystem.type !== "polar", v = d.some((f) => f.gridVisible), m = a.config.axes.y.grid, g = mn.map((f) => ({
+  const h = o.coordSystem.type !== "polar", v = d.some((f) => f.gridVisible), p = o.config.axes.y.grid, g = gn.map((f) => ({
     value: f,
-    label: o(`editor.graphPanel.gridSection.lineStyles.${f}`)
-  })), y = (f) => (P) => {
-    r.commands.dispatch(new cr({
+    label: a(`editor.graphPanel.gridSection.lineStyles.${f}`)
+  })), S = (f) => (x) => {
+    r.commands.dispatch(new ur({
       axis: f,
-      isVisible: P
+      isVisible: x
     }));
-  }, I = (f) => {
-    const P = mn.find((x) => x === f);
-    P && r.commands.dispatch(new lr({
+  }, P = (f) => {
+    const x = gn.find((T) => T === f);
+    x && r.commands.dispatch(new dr({
       axis: "both",
-      lineStyle: P
+      lineStyle: x
     }));
-  }, S = (f) => {
-    r.commands.dispatch(new sr({
+  }, y = (f) => {
+    r.commands.dispatch(new hr({
       axis: "both",
       lineWidth: f
     }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.graphPanel.gridSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.gridSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [d.map((f) => /* @__PURE__ */ n(b, {
-      label: o(Al(f)),
+    children: /* @__PURE__ */ m(F, { children: [d.map((f) => /* @__PURE__ */ n(C, {
+      label: a(Zl(f)),
       children: /* @__PURE__ */ n(c, {
         isChecked: f.gridVisible,
-        onChange: y(f.scaleAestheticKey)
+        onChange: S(f.scaleAestheticKey)
       })
-    }, f.scaleAestheticKey)), h && v && /* @__PURE__ */ p(q, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.gridSection.gridStyle"),
+    }, f.scaleAestheticKey)), h && v && /* @__PURE__ */ m(W, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.gridSection.gridStyle"),
       children: /* @__PURE__ */ n(s, {
-        value: m.lineStyle,
+        value: p.lineStyle,
         options: g,
-        onChange: I
+        onChange: P
       })
-    }), /* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.gridSection.gridThickness"),
+    }), /* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.gridSection.gridThickness"),
       children: /* @__PURE__ */ n(l, {
-        value: m.lineWidth ?? At(u.gridLineWidth, Pl),
-        min: xl,
-        max: Il,
+        value: p.lineWidth ?? Ot(u.gridLineWidth, Ul),
+        min: ql,
+        max: Wl,
         step: 0.5,
         formatValue: Ie,
-        onChange: S,
+        onChange: y,
         onCommit: r.commands.seal
       })
     })] })] })
   });
-}, Tl = (e) => e.scaleAestheticKey === "x" || e.scaleAestheticKey === "y", Al = (e) => e.geometry === "radial" ? "editor.graphPanel.gridSection.rings" : e.geometry === "circular" ? "editor.graphPanel.gridSection.spokes" : e.scaleAestheticKey === "x" ? "editor.graphPanel.gridSection.verticalGridLines" : "editor.graphPanel.gridSection.horizontalGridLines", Ll = "total", lt = [
+}, $l = (e) => e.scaleAestheticKey === "x" || e.scaleAestheticKey === "y", Zl = (e) => e.geometry === "radial" ? "editor.graphPanel.gridSection.rings" : e.geometry === "circular" ? "editor.graphPanel.gridSection.spokes" : e.scaleAestheticKey === "x" ? "editor.graphPanel.gridSection.verticalGridLines" : "editor.graphPanel.gridSection.horizontalGridLines", jl = "total", ct = [
   "total",
   "average",
   "current"
-], Nl = ["total"], pn = ["previous", "first"], gn = [
+], Xl = ["total"], vn = ["previous", "first"], fn = [
   "auto",
   "small",
   "medium",
   "large"
-], Ls = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Switch: l, ToggleGroup: c } = _();
-  if (!a) return null;
-  const s = a.config.headline, u = s.show !== "none", d = a.coordSystem, h = d.type === "polar", v = d.type === "polar" && d.innerRadius > 0, m = a.layers.some((w) => w.summary.grandTotal !== void 0);
-  if (h && !m) return null;
-  const g = h ? Nl : lt, y = a.guides.headline, I = y?.kind === "perGroup" && y.items.some((w) => w.comparison !== null), S = g.map((w) => ({
+], Xs = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Switch: l, ToggleGroup: c } = E();
+  if (!o) return null;
+  const s = o.config.headline, u = s.show !== "none", d = o.coordSystem, h = d.type === "polar", v = d.type === "polar" && d.innerRadius > 0, p = o.layers.some((w) => w.summary.grandTotal !== void 0);
+  if (h && !p) return null;
+  const g = h ? Xl : ct, S = o.guides.headline, P = S?.kind === "perGroup" && S.items.some((w) => w.comparison !== null), y = g.map((w) => ({
     value: w,
-    label: o(`editor.graphPanel.headlineNumberSection.metrics.${w}`)
-  })), f = pn.map((w) => ({
+    label: a(`editor.graphPanel.headlineNumberSection.metrics.${w}`)
+  })), f = vn.map((w) => ({
     value: w,
-    label: o(`editor.graphPanel.headlineNumberSection.comparison.${w}`)
-  })), P = gn.map((w) => ({
+    label: a(`editor.graphPanel.headlineNumberSection.comparison.${w}`)
+  })), x = fn.map((w) => ({
     value: w,
-    label: o(w === "auto" ? "editor.graphPanel.numberFormat.options.auto" : `editor.graphPanel.headlineNumberSize.sizes.${w}`)
-  })), x = [{
+    label: a(w === "auto" ? "editor.graphPanel.numberFormat.options.auto" : `editor.graphPanel.headlineNumberSize.sizes.${w}`)
+  })), T = [{
     value: "above",
-    label: o("editor.graphPanel.headlineNumberSection.position.above")
+    label: a("editor.graphPanel.headlineNumberSection.position.above")
   }, {
     value: "center",
-    label: o("editor.graphPanel.headlineNumberSection.position.center")
-  }], R = (w) => {
-    r.commands.dispatch(new $e({ show: w ? Ll : "none" }));
-  }, K = (w) => {
-    const L = g.find((Q) => Q === w);
-    L && r.commands.dispatch(new $e({ show: L }));
+    label: a("editor.graphPanel.headlineNumberSection.position.center")
+  }], z = (w) => {
+    r.commands.dispatch(new je({ show: w ? jl : "none" }));
+  }, B = (w) => {
+    const O = g.find((Q) => Q === w);
+    O && r.commands.dispatch(new je({ show: O }));
   }, N = (w) => {
-    const L = pn.find((Q) => Q === w);
-    L && r.commands.dispatch(new dr({ compareWith: L }));
-  }, D = (w) => {
-    const L = gn.find((Q) => Q === w);
-    L && r.commands.dispatch(new ur({ size: L }));
-  }, A = (w) => {
-    r.commands.dispatch(new hr({ position: w === "center" ? "center" : "above" }));
+    const O = vn.find((Q) => Q === w);
+    O && r.commands.dispatch(new mr({ compareWith: O }));
+  }, H = (w) => {
+    const O = fn.find((Q) => Q === w);
+    O && r.commands.dispatch(new gr({ size: O }));
+  }, L = (w) => {
+    r.commands.dispatch(new pr({ position: w === "center" ? "center" : "above" }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.graphPanel.headlineNumberSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.headlineNumberSection.title"),
     layout: t,
-    preview: i ?? Ol(o, s.show),
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.headlineNumberSection.toggle"),
+    preview: i ?? Yl(a, s.show),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.headlineNumberSection.toggle"),
       children: /* @__PURE__ */ n(l, {
         isChecked: u,
-        onChange: R
+        onChange: z
       })
-    }), u && /* @__PURE__ */ p(q, { children: [
-      S.length > 1 && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.headlineNumberSection.metricLabel"),
+    }), u && /* @__PURE__ */ m(W, { children: [
+      y.length > 1 && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.headlineNumberSection.metricLabel"),
         layout: "stack",
         children: /* @__PURE__ */ n(c, {
           value: s.show,
-          options: S,
-          onChange: K
+          options: y,
+          onChange: B
         })
       }),
-      I && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.headlineNumberSection.compareWithLabel"),
+      P && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.headlineNumberSection.compareWithLabel"),
         layout: "stack",
         children: /* @__PURE__ */ n(c, {
-          value: Yr(s.compareWith),
+          value: na(s.compareWith),
           options: f,
           onChange: N
         })
       }),
-      /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.headlineNumberSize.sizeLabel"),
+      /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.headlineNumberSize.sizeLabel"),
         children: /* @__PURE__ */ n(c, {
           value: s.size,
-          options: P,
-          onChange: D
+          options: x,
+          onChange: H
         })
       }),
-      v && /* @__PURE__ */ n(b, {
-        label: o("editor.axesPanel.controls.position"),
+      v && /* @__PURE__ */ n(C, {
+        label: a("editor.axesPanel.controls.position"),
         children: /* @__PURE__ */ n(c, {
           value: s.position,
-          options: x,
-          onChange: A
+          options: T,
+          onChange: L
         })
       })
     ] })] })
   });
-}, Ol = (e, t) => {
-  const i = lt.find((r) => r === t);
+}, Yl = (e, t) => {
+  const i = ct.find((r) => r === t);
   return i && e(`editor.graphPanel.headlineNumberSection.metrics.${i}`);
-}, Te = [
+}, Ae = [
   "top",
   "bottom",
   "left",
   "right",
   "none"
-], vn = [
+], Cn = [
   "auto",
   "start",
   "center",
   "end"
-], fn = [
+], bn = [
   "auto",
   "pill",
   "direct"
-], Ns = ({ positions: e, title: t, layout: i = "collapsible", preview: r }) => {
-  const a = E(), o = F(a), l = T(), { ToggleGroup: c } = _();
-  if (!o) return null;
-  const s = o.config.legend.position, u = e ?? Te, d = o.guides.legends.drawn[0], h = Rr({
-    legendPosition: o.guides.legends.position,
-    coordSystem: o.coordSystem,
-    layers: o.layers
-  }), v = o.guides.headline?.kind === "perGroup", m = o.guides.colorGroups.length > 0;
-  if (s === "auto" && d === void 0 && !h && (v || !m)) return null;
-  const g = d?.position ?? "none", y = s === "auto" ? g : s, I = Te.filter((A) => A === y || u.includes(A)).map((A) => ({
-    value: A,
-    label: l(`editor.graphPanel.legendSection.${A}`)
-  })), S = (A) => {
-    const w = Te.find((L) => L === A);
-    w && a.commands.dispatch(new vr({ position: w }));
-  }, f = (A) => {
-    const w = vn.find((L) => L === A);
-    w && a.commands.dispatch(new pr({ align: w }));
-  }, P = (A) => {
-    const w = fn.find((L) => L === A);
-    w && a.commands.dispatch(new gr({ display: w }));
-  }, x = vn.map((A) => ({
-    value: A,
-    label: l(`editor.graphPanel.legendSection.align.${A}`)
-  })), R = fn.map((A) => ({
-    value: A,
-    label: l(`editor.graphPanel.legendSection.display.${A}`)
-  })), K = t ?? l("editor.graphPanel.legendSection.title"), N = I.find((A) => A.value === y)?.label, D = d !== void 0;
-  return /* @__PURE__ */ n(H, {
-    title: K,
+], Ys = ({ positions: e, title: t, layout: i = "collapsible", preview: r }) => {
+  const o = M(), a = R(o), l = A(), { ToggleGroup: c } = E();
+  if (!a) return null;
+  const s = a.config.legend.position, u = e ?? Ae, d = a.guides.legends.drawn[0], h = Hr({
+    legendPosition: a.guides.legends.position,
+    coordSystem: a.coordSystem,
+    layers: a.layers
+  }), v = a.guides.headline?.kind === "perGroup", p = a.guides.colorGroups.length > 0;
+  if (s === "auto" && d === void 0 && !h && (v || !p)) return null;
+  const g = d?.position ?? "none", S = s === "auto" ? g : s, P = Ae.filter((L) => L === S || u.includes(L)).map((L) => ({
+    value: L,
+    label: l(`editor.graphPanel.legendSection.${L}`)
+  })), y = (L) => {
+    const w = Ae.find((O) => O === L);
+    w && o.commands.dispatch(new br({ position: w }));
+  }, f = (L) => {
+    const w = Cn.find((O) => O === L);
+    w && o.commands.dispatch(new fr({ align: w }));
+  }, x = (L) => {
+    const w = bn.find((O) => O === L);
+    w && o.commands.dispatch(new Cr({ display: w }));
+  }, T = Cn.map((L) => ({
+    value: L,
+    label: l(`editor.graphPanel.legendSection.align.${L}`)
+  })), z = bn.map((L) => ({
+    value: L,
+    label: l(`editor.graphPanel.legendSection.display.${L}`)
+  })), B = t ?? l("editor.graphPanel.legendSection.title"), N = P.find((L) => L.value === S)?.label, H = d !== void 0;
+  return /* @__PURE__ */ n(D, {
+    title: B,
     layout: i,
     preview: r ?? N,
-    children: /* @__PURE__ */ p(V, { children: [
-      /* @__PURE__ */ n(b, {
+    children: /* @__PURE__ */ m(F, { children: [
+      /* @__PURE__ */ n(C, {
         label: l("editor.axesPanel.controls.position"),
         layout: "stack",
         children: /* @__PURE__ */ n(c, {
-          value: y,
-          options: I,
-          onChange: S
+          value: S,
+          options: P,
+          onChange: y
         })
       }),
-      D && /* @__PURE__ */ n(b, {
+      H && /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.legendSection.alignLabel"),
         layout: "stack",
         children: /* @__PURE__ */ n(c, {
-          value: o.config.legend.align,
-          options: x,
+          value: a.config.legend.align,
+          options: T,
           onChange: f
         })
       }),
-      h && /* @__PURE__ */ n(b, {
+      h && /* @__PURE__ */ n(C, {
         label: l("editor.graphPanel.legendSection.displayLabel"),
         layout: "stack",
         children: /* @__PURE__ */ n(c, {
-          value: o.config.legend.display,
-          options: R,
-          onChange: P
+          value: a.config.legend.display,
+          options: z,
+          onChange: x
         })
       })
     ] })
   });
-}, El = 1, _l = 20, kl = 0.5, st = ({ layerId: e }) => {
-  const t = E(), i = F(t), { Slider: r } = _(), a = Ue(i, e);
+}, Ql = 1, Jl = 20, es = 0.5, dt = ({ layerId: e }) => {
+  const t = M(), i = R(t), { Slider: r } = E(), o = qe(i, e);
   if (!i) return null;
-  const o = (l) => {
-    const c = new Sr({
+  const a = (l) => {
+    const c = new xr({
       layerId: e,
       size: l
     });
     t.commands.dispatch(c, { transient: !0 });
   };
   return /* @__PURE__ */ n(r, {
-    value: a?.get("size") ?? Kt,
-    min: El,
-    max: _l,
-    step: kl,
+    value: o?.get("size") ?? Gt,
+    min: Ql,
+    max: Jl,
+    step: es,
     formatValue: Ie,
-    onChange: o,
+    onChange: a,
     onCommit: t.commands.seal
   });
-}, Ml = 1, Rl = 10, Dl = 0.1, zl = [
+}, ns = 1, ts = 10, rs = 0.1, as = [
   "gap",
   "zero",
   "connect"
-], Os = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Select: l, Slider: c, Switch: s, ToggleGroup: u } = _(), d = a?.spec.layers ?? [], h = In(d, "line", "area"), v = Ue(a, h?.id ?? null);
-  if (!a || !h) return null;
-  const m = a.coordSystem.type === "polar", g = Vl(o, h), y = Hl(h, d), I = bn(a.spec, h.geom, "strokeWidth", h.id), S = typeof I == "number", f = h.geom === "line" ? h : void 0, P = [{
+], Qs = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Select: l, Slider: c, Switch: s, ToggleGroup: u } = E(), d = o?.spec.layers ?? [], h = Tn(d, "line", "area"), v = qe(o, h?.id ?? null);
+  if (!o || !h) return null;
+  const p = o.coordSystem.type === "polar", g = ls(a, h), S = is(h, d), P = yn(o.spec, h.geom, "strokeWidth", h.id), y = typeof P == "number", f = h.geom === "line" ? h : void 0, x = [{
     value: "auto",
-    label: o("editor.graphPanel.numberFormat.options.auto")
+    label: a("editor.graphPanel.numberFormat.options.auto")
   }, {
     value: "custom",
-    label: o("editor.graphPanel.numberFormat.options.custom")
-  }], x = (w) => {
-    r.commands.dispatch(new Lr({
+    label: a("editor.graphPanel.numberFormat.options.custom")
+  }], T = (w) => {
+    r.commands.dispatch(new kr({
       layerId: h.id,
       showPoints: w
     }));
-  }, R = (w) => {
-    f && r.commands.dispatch(new Ar({
+  }, z = (w) => {
+    f && r.commands.dispatch(new Nr({
       layerId: f.id,
       showFill: w
     }));
-  }, K = (w) => {
-    r.commands.dispatch(new fr({
+  }, B = (w) => {
+    r.commands.dispatch(new yr({
       layerId: h.id,
       interpolate: w ? "catmull-rom" : "linear"
     }));
   }, N = (w) => {
-    const L = v?.get("strokeWidth") ?? Gt;
-    r.commands.dispatch(new Ze({
+    const O = v?.get("strokeWidth") ?? Ut;
+    r.commands.dispatch(new Xe({
       layerId: h.id,
-      lineWidth: w === "custom" ? L : null
+      lineWidth: w === "custom" ? O : null
     }));
-  }, D = (w) => {
-    r.commands.dispatch(new Ze({
+  }, H = (w) => {
+    r.commands.dispatch(new Xe({
       layerId: h.id,
       lineWidth: w
     }), { transient: !0 });
-  }, A = (w) => {
-    const L = Fl(w);
-    L && r.commands.dispatch(new br({
+  }, L = (w) => {
+    const O = os(w);
+    O && r.commands.dispatch(new Sr({
       layerId: h.id,
-      missingValues: L
+      missingValues: O
     }));
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.fineTunePanel.lineStyleSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.fineTunePanel.lineStyleSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [
-      /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.graphOptions.showPoints"),
+    children: /* @__PURE__ */ m(F, { children: [
+      /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.graphOptions.showPoints"),
         children: /* @__PURE__ */ n(s, {
-          isChecked: y !== void 0,
-          onChange: x
+          isChecked: S !== void 0,
+          onChange: T
         })
       }),
-      y && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.pointSize.label"),
-        children: /* @__PURE__ */ n(st, { layerId: y.id })
+      S && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.pointSize.label"),
+        children: /* @__PURE__ */ n(dt, { layerId: S.id })
       }),
-      f && !m && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.graphOptions.lineFill"),
+      f && !p && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.graphOptions.lineFill"),
         children: /* @__PURE__ */ n(s, {
-          isChecked: bn(a.spec, "line", "fillAlpha", f.id) !== void 0,
-          onChange: R
+          isChecked: yn(o.spec, "line", "fillAlpha", f.id) !== void 0,
+          onChange: z
         })
       }),
-      !m && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.graphOptions.smoothLines"),
+      !p && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.graphOptions.smoothLines"),
         children: /* @__PURE__ */ n(s, {
           isChecked: h.params.interpolate === "catmull-rom",
-          onChange: K
+          onChange: B
         })
       }),
-      /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.lineThickness.label"),
+      /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.lineThickness.label"),
         children: /* @__PURE__ */ n(u, {
-          value: S ? "custom" : "auto",
-          options: P,
+          value: y ? "custom" : "auto",
+          options: x,
           onChange: N
         })
       }),
-      S && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.numberFormat.valueLabel"),
+      y && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.numberFormat.valueLabel"),
         children: /* @__PURE__ */ n(c, {
-          value: I,
-          min: Ml,
-          max: Rl,
-          step: Dl,
+          value: P,
+          min: ns,
+          max: ts,
+          step: rs,
           formatValue: Ie,
-          onChange: D,
+          onChange: H,
           onCommit: r.commands.seal
         })
       }),
-      !m && g.length > 1 && /* @__PURE__ */ n(b, {
-        label: o("editor.fineTunePanel.detailSection.missingValues"),
+      !p && g.length > 1 && /* @__PURE__ */ n(C, {
+        label: a("editor.fineTunePanel.detailSection.missingValues"),
         children: /* @__PURE__ */ n(l, {
           value: h.params.missingValues,
           options: g,
-          onChange: A
+          onChange: L
         })
       })
     ] })
   });
-}, Fl = (e) => zl.find((t) => t === e), bn = (e, t, i, r) => Gr(e.styles.overrides, _r(t, r))?.declarations?.[i], Hl = (e, t) => Le(t, "point").find((i) => xn(i, [e])), Vl = (e, t) => {
+}, os = (e) => as.find((t) => t === e), yn = (e, t, i, r) => Wr(e.styles.overrides, Rr(t, r))?.declarations?.[i], is = (e, t) => Oe(t, "point").find((i) => An(i, [e])), ls = (e, t) => {
   const i = [{
     value: "gap",
     label: e("editor.graphPanel.treatEmptyValues.leaveGap.label")
@@ -3267,7 +3725,7 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
     value: "connect",
     label: e("editor.graphPanel.treatEmptyValues.connectGaps.label")
   }), t.geom === "area" ? i.filter((r) => r.value !== "gap") : i;
-}, Kl = "k", Gl = 2, Bl = 0, Ul = 5, Ee = [
+}, ss = "k", cs = 2, ds = 0, hs = 5, Ee = [
   {
     value: "k",
     labelKey: "thousands"
@@ -3280,35 +3738,35 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
     value: "b",
     labelKey: "billions"
   }
-], ql = ["auto", "none"], Es = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { NumberField: l, ToggleGroup: c } = _();
-  if (!a) return null;
-  const { abbreviation: s, decimals: u } = a.config.numberFormat, d = Wl(s) !== void 0, h = u !== "auto", v = (P) => P.map((x) => ({
+], us = ["auto", "none"], Js = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { NumberField: l, ToggleGroup: c } = E();
+  if (!o) return null;
+  const { abbreviation: s, decimals: u } = o.config.numberFormat, d = ms(s) !== void 0, h = u !== "auto", v = (x) => x.map((T) => ({
+    value: T,
+    label: a(`editor.graphPanel.numberFormat.options.${T}`)
+  })), p = Ee.map(({ value: x, labelKey: T }) => ({
     value: x,
-    label: o(`editor.graphPanel.numberFormat.options.${x}`)
-  })), m = Ee.map(({ value: P, labelKey: x }) => ({
-    value: P,
-    label: o(`common.abbreviations.${x}`)
-  })), g = (P) => {
-    r.commands.dispatch(new Cr({ abbreviation: P }));
-  }, y = (P) => {
-    const x = ql.find((R) => R === P);
-    g(x ?? Kl);
-  }, I = (P) => {
-    const x = Ee.find((R) => R.value === P);
-    x && g(x.value);
-  }, S = (P) => {
-    r.commands.dispatch(new Xe({ decimals: P === "custom" ? Gl : "auto" }));
-  }, f = (P) => {
-    P !== null && r.commands.dispatch(new Xe({ decimals: P }), { transient: !0 });
+    label: a(`common.abbreviations.${T}`)
+  })), g = (x) => {
+    r.commands.dispatch(new wr({ abbreviation: x }));
+  }, S = (x) => {
+    const T = us.find((z) => z === x);
+    g(T ?? ss);
+  }, P = (x) => {
+    const T = Ee.find((z) => z.value === x);
+    T && g(T.value);
+  }, y = (x) => {
+    r.commands.dispatch(new Ye({ decimals: x === "custom" ? cs : "auto" }));
+  }, f = (x) => {
+    x !== null && r.commands.dispatch(new Ye({ decimals: x }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.graphPanel.numberFormatSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.numberFormatSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [
-      /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.numberFormat.abbreviationLabel"),
+    children: /* @__PURE__ */ m(F, { children: [
+      /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.numberFormat.abbreviationLabel"),
         children: /* @__PURE__ */ n(c, {
           value: d ? "custom" : s,
           options: v([
@@ -3316,84 +3774,84 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
             "none",
             "custom"
           ]),
-          onChange: y
+          onChange: S
         })
       }),
-      d && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.numberFormat.valueLabel"),
+      d && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.numberFormat.valueLabel"),
         children: /* @__PURE__ */ n(c, {
           value: s,
-          options: m,
-          onChange: I
+          options: p,
+          onChange: P
         })
       }),
-      /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.numberFormat.decimalPlacesLabel"),
+      /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.numberFormat.decimalPlacesLabel"),
         children: /* @__PURE__ */ n(c, {
           value: h ? "custom" : "auto",
           options: v(["auto", "custom"]),
-          onChange: S
+          onChange: y
         })
       }),
-      h && /* @__PURE__ */ n(b, {
-        label: o("editor.graphPanel.numberFormat.valueLabel"),
+      h && /* @__PURE__ */ n(C, {
+        label: a("editor.graphPanel.numberFormat.valueLabel"),
         children: /* @__PURE__ */ n(l, {
           value: u,
-          min: Bl,
-          max: Ul,
+          min: ds,
+          max: hs,
           onChange: f,
           onCommit: r.commands.seal
         })
       })
     ] })
   });
-}, Wl = (e) => Ee.find((t) => t.value === e), _s = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = F(E()), a = T();
+}, ms = (e) => Ee.find((t) => t.value === e), ec = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = R(M()), o = A();
   if (!r) return null;
-  const o = $l(r.spec.layers);
-  return o ? /* @__PURE__ */ n(H, {
-    title: e ?? a("editor.graphPanel.pointSize.label"),
+  const a = ps(r.spec.layers);
+  return a ? /* @__PURE__ */ n(D, {
+    title: e ?? o("editor.graphPanel.pointSize.label"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ n(V, { children: /* @__PURE__ */ n(b, {
-      label: a("editor.graphPanel.numberFormat.valueLabel"),
-      children: /* @__PURE__ */ n(st, { layerId: o.id })
+    children: /* @__PURE__ */ n(F, { children: /* @__PURE__ */ n(C, {
+      label: o("editor.graphPanel.numberFormat.valueLabel"),
+      children: /* @__PURE__ */ n(dt, { layerId: a.id })
     }) })
   }) : null;
-}, $l = (e) => {
-  const t = Le(e, "line", "area");
-  return Le(e, "point").find((i) => !xn(i, t));
-}, Zl = 0.9, Xl = 360, jl = 0.05, Yl = 15, ks = ({ title: e, layout: t = "collapsible", preview: i }) => {
-  const r = E(), a = F(r), o = T(), { Slider: l } = _();
-  if (!a || a.spec.coords.coordType !== "polar") return null;
-  const { innerRadius: c, startAngle: s } = a.spec.coords.params, u = (h) => {
-    r.commands.dispatch(new yr({ innerRadius: h }), { transient: !0 });
+}, ps = (e) => {
+  const t = Oe(e, "line", "area");
+  return Oe(e, "point").find((i) => !An(i, t));
+}, gs = 0.9, vs = 360, fs = 0.05, Cs = 15, nc = ({ title: e, layout: t = "collapsible", preview: i }) => {
+  const r = M(), o = R(r), a = A(), { Slider: l } = E();
+  if (!o || o.spec.coords.coordType !== "polar") return null;
+  const { innerRadius: c, startAngle: s } = o.spec.coords.params, u = (h) => {
+    r.commands.dispatch(new Pr({ innerRadius: h }), { transient: !0 });
   }, d = (h) => {
-    r.commands.dispatch(new wr({ startAngle: h }), { transient: !0 });
+    r.commands.dispatch(new Ir({ startAngle: h }), { transient: !0 });
   };
-  return /* @__PURE__ */ n(H, {
-    title: e ?? o("editor.graphPanel.polarSection.title"),
+  return /* @__PURE__ */ n(D, {
+    title: e ?? a("editor.graphPanel.polarSection.title"),
     layout: t,
     preview: i,
-    children: /* @__PURE__ */ p(V, { children: [/* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.polarSection.innerRadius"),
+    children: /* @__PURE__ */ m(F, { children: [/* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.polarSection.innerRadius"),
       children: /* @__PURE__ */ n(l, {
         value: c,
         min: 0,
-        max: Zl,
-        step: jl,
-        formatValue: it,
+        max: gs,
+        step: fs,
+        formatValue: st,
         onChange: u,
         onCommit: r.commands.seal
       })
-    }), /* @__PURE__ */ n(b, {
-      label: o("editor.graphPanel.polarSection.startAngle"),
+    }), /* @__PURE__ */ n(C, {
+      label: a("editor.graphPanel.polarSection.startAngle"),
       children: /* @__PURE__ */ n(l, {
         value: s,
         min: 0,
-        max: Xl - 1,
-        step: Yl,
-        formatValue: Sl,
+        max: vs - 1,
+        step: Cs,
+        formatValue: Pl,
         onChange: d,
         onCommit: r.commands.seal
       })
@@ -3401,40 +3859,41 @@ var ol = "_40zvwv8", H = ({ title: e, layout: t = "fixed", preview: i, accessory
   });
 };
 export {
-  Is as AppearanceSection,
-  Ps as AxesPanel,
-  cn as AxisSection,
-  xs as BarSection,
-  oi as Button,
-  ul as CaptionSection,
-  Ss as EditableGraphRenderer,
-  at as EditorPanel,
-  ws as ElementsPanel,
-  Ts as GraphOptionsSection,
-  As as GridSection,
-  Ls as HeadlineSection,
-  es as IntlProvider,
-  Ns as LegendSection,
-  Os as LineSection,
-  ci as NumberField,
-  Es as NumberFormatSection,
-  ji as PANEL_ROOT_ATTRIBUTE,
-  _s as PointSection,
-  ks as PolarSection,
-  mi as RadioGrid,
-  b as Row,
-  H as Section,
-  wi as Select,
-  Ei as Slider,
-  pl as SourceSection,
-  vl as SubtitleSection,
-  Ri as Switch,
-  Fi as TextField,
-  bl as TextSizeSection,
-  Cl as TitleSection,
-  Ki as ToggleGroup,
-  ys as ToggledSection,
-  _ as useControls,
-  Zi as usePanelExpansion,
-  E as usePanelGraph
+  Ws as AppearanceSection,
+  Us as AxesPanel,
+  hn as AxisSection,
+  qs as BarSection,
+  ci as Button,
+  vl as CaptionSection,
+  Bs as EditableGraphRenderer,
+  it as EditorPanel,
+  Gs as ElementsPanel,
+  $s as GraphOptionsSection,
+  Zs as GraphTypeSection,
+  js as GridSection,
+  Xs as HeadlineSection,
+  Ss as IntlProvider,
+  Ys as LegendSection,
+  Qs as LineSection,
+  mi as NumberField,
+  Js as NumberFormatSection,
+  el as PANEL_ROOT_ATTRIBUTE,
+  ec as PointSection,
+  nc as PolarSection,
+  fi as RadioGrid,
+  C as Row,
+  D as Section,
+  Ti as Select,
+  Ri as Slider,
+  Cl as SourceSection,
+  yl as SubtitleSection,
+  Vi as Switch,
+  Ki as TextField,
+  wl as TextSizeSection,
+  xl as TitleSection,
+  Wi as ToggleGroup,
+  Ks as ToggledSection,
+  E as useControls,
+  Qi as usePanelExpansion,
+  M as usePanelGraph
 };