@graphysdk/react-renderer 0.0.1-plugins.9 → 1.8.1-beta.1786025839240

package/LICENSE.md

@@ -0,0 +1,17 @@
+# License
+
+This software is available under any of the following licenses, at your option,
+depending on which one's conditions you meet:
+
+- **PolyForm Noncommercial 1.0.0** — for noncommercial use (personal,
+  charitable, educational, research, government).
+  See [licenses/PolyForm-NonCommercial-1.0.0.md](licenses/PolyForm-NonCommercial-1.0.0.md)
+
+- **PolyForm Small Business 1.0.0** — free commercial use for organizations
+  under the size thresholds defined in the license.
+  See [licenses/PolyForm-Small-Business-1.0.0.md](licenses/PolyForm-Small-Business-1.0.0.md)
+
+- **PolyForm Free Trial 1.0.0** — a 32-day evaluation for anyone else.
+  See [licenses/PolyForm-Free-Trial-1.0.0.md](licenses/PolyForm-Free-Trial-1.0.0.md)
+
+For commercial use beyond these terms, contact [hello@graphy.dev](mailto:hello@graphy.dev) or visit [https://graphy.dev](https://graphy.dev).

package/README.md

@@ -1,3 +1,42 @@
-pnpm build --filter=@graphysdk/viz-engine --filter=@graphysdk/react-renderer
-pnpm --filter @graphysdk/viz-engine publish --tag plugins --access restricted --no-git-checks
-pnpm --filter @graphysdk/react-renderer publish --tag plugins --access restricted --no-git-checks
+# @graphysdk/react-renderer
+
+React renderer for `@graphysdk/viz-engine`. Paints a compiled Graphy chart in the browser.
+
+## Docs
+
+- [Provider and renderer](https://docs.graphy.dev/sdk-next/rendering/provider-and-renderer)
+- [Quickstart](https://docs.graphy.dev/sdk-next/quickstart) — recommended starting point via `@graphysdk/react`
+
+## Recommended entry
+
+For most apps, install **`@graphysdk/react`** instead. That package re-exports this renderer and turns the provenance mark **on by default**.
+
+Use `@graphysdk/react-renderer` directly when you want the neutral layer (mark **off** by default) or are building your own opinionated wrapper.
+
+## Install
+
+```bash
+pnpm add @graphysdk/react-renderer @graphysdk/viz-engine
+```
+
+## Usage
+
+```tsx
+import { GraphProvider, GraphRenderer } from '@graphysdk/react-renderer';
+import { createSpec, pipe, geom, scale } from '@graphysdk/viz-engine';
+
+const input = pipe(createSpec({ x: 'month', y: 'revenue' }), geom.bar(), scale.x(), scale.y());
+
+export function Chart({ data }) {
+  return (
+    <GraphProvider data={data} input={input}>
+      <GraphRenderer />
+    </GraphProvider>
+  );
+}
+```
+
+## Entry points
+
+- **`@graphysdk/react-renderer`** — read-only surface: `GraphProvider`, `GraphRenderer`, hooks, slots, theme, and types
+- **`@graphysdk/react-renderer/editable`** — editing surface: `EditableGraphRenderer`, `EditorPanel`, and related controls

package/dist/editable.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./editable.css');const c=require("./history-chords-C81ObHa3.cjs"),yt=require("./font-values-F2fq9P-M.cjs");let x=require("@graphysdk/viz-engine"),p=require("react"),t=require("react/jsx-runtime"),Q=require("zustand/react/shallow"),wt=require("react-dom"),O=require("clsx");O=c.__toESM(O,1);let Se=require("@vanilla-extract/dynamic"),P=require("@base-ui/react/menu"),N=require("@base-ui/react"),K=require("@base-ui/react/accordion"),le=require("@base-ui/react/number-field"),ye=require("@base-ui/react/radio"),we=require("@base-ui/react/radio-group"),E=require("@base-ui/react/select"),H=require("@base-ui/react/slider"),ce=require("@base-ui/react/switch"),It=require("@base-ui/react/input");var Pt="data-graphy-chart-chrome",Tt="data-graphy-chart-menu",Ie={[Tt]:""},U=e=>({[Pt]:e}),Pe=(e,n)=>e instanceof Element&&e.closest(`[data-graphy-chart-chrome="${CSS.escape(n)}"]`)!==null,At=e=>e instanceof Element&&e.closest("[data-graphy-chart-menu]")!==null,_t=e=>e instanceof Element&&e.closest("[data-graphy-chart-chrome]")!==null,G=(e,n,r)=>e instanceof Node&&(n.contains(e)||Pe(e,r)),Et="cml7ha0",Te=(0,p.createContext)(null),Mt=({children:e})=>{const{chartId:n}=c.useGraphContext(),[r]=(0,p.useState)(c.resolvePortalContainer),[o,a]=(0,p.useState)(null);return r===null?null:(0,t.jsxs)(t.Fragment,{children:[(0,wt.createPortal)((0,t.jsx)("div",{ref:a,className:Et,...U(n)}),r),(0,t.jsx)(Te.Provider,{value:o,children:e})]})},ee=()=>(0,p.useContext)(Te),Ae=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{fill:"currentColor",fillOpacity:".8",d:"M2.333 3h11.334v8.667c-2 0-4 .333-5.667 2.333-2-2-3.667-2.333-5.667-2.333z",opacity:".12"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:".8",fillRule:"evenodd",d:"M3.325 3.156a.836.836 0 0 0-.836.836v6.832c0 .462.375.836.836.836h2.131a.5.5 0 0 1 .352.145L8 13.975l2.193-2.17a.5.5 0 0 1 .352-.145h2.13a.84.84 0 0 0 .836-.836V3.992a.84.84 0 0 0-.836-.836zm-1.836.836c0-1.014.822-1.836 1.836-1.836h9.35c1.015 0 1.836.825 1.836 1.836v6.832a1.84 1.84 0 0 1-1.836 1.836H10.75l-2.398 2.374a.5.5 0 0 1-.704 0L5.25 12.66H3.325a1.836 1.836 0 0 1-1.836-1.836z",clipRule:"evenodd"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:".8",fillRule:"evenodd",d:"M8 4.505a.5.5 0 0 1 .5.5v2.172h2.171a.5.5 0 0 1 0 1H8.5v2.171a.5.5 0 0 1-1 0V8.177H5.329a.5.5 0 0 1 0-1H7.5V5.005a.5.5 0 0 1 .5-.5",clipRule:"evenodd"})]});var _e="efjmb40",Ee="efjmb41",R="efjmb42",F="efjmb43",Nt="efjmb44",Ot="efjmb45",Lt=new Set(["item-press","escape-key","outside-press","close-press","sibling-open","trigger-press"]),te=({label:e,icon:n,onOpened:r,children:o})=>{const a=ee(),[s,i]=(0,p.useState)(!1),d=(l,u)=>{l?(i(!0),r?.()):Lt.has(u.reason)&&i(!1)};return(0,t.jsxs)(N.Menu.SubmenuRoot,{open:s,onOpenChange:d,children:[(0,t.jsx)(kt,{label:e,icon:n}),(0,t.jsx)(N.Menu.Portal,{container:a,children:(0,t.jsx)(c.PortalThemeProvider,{children:(0,t.jsx)(N.Menu.Positioner,{side:"right",align:"start",sideOffset:4,className:_e,...Ie,children:(0,t.jsx)(N.Menu.Popup,{className:Ee,children:o})})})})]})},kt=({label:e,icon:n})=>(0,t.jsxs)(N.Menu.SubmenuTrigger,{className:R,openOnHover:!1,children:[n,(0,t.jsx)("span",{className:F,children:e}),(0,t.jsx)("span",{className:Ot,children:(0,t.jsx)(c.ChevronDownIcon,{size:"sm"})})]}),Rt="_1qe7q450",Ft="_1qe7q451",Dt="_1qe7q452",zt=({label:e,placeholder:n,addLabel:r,at:o,onRequestClose:a})=>{const s=(0,p.useRef)(null),[i,d]=(0,p.useState)(""),{dispatch:l}=c.useGraphCommands(),u=i.trim(),h=()=>{u.length!==0&&(l(new x.AddAnnotationCommand({kind:"comment",annotation:{at:o,content:Ht(u)}})),a())},m=f=>{f.key==="Enter"&&(f.preventDefault(),h()),f.key!=="Escape"&&f.stopPropagation()},g=f=>{d(f.target.value)},v=()=>{requestAnimationFrame(()=>s.current?.focus())};return(0,t.jsx)(te,{label:e,icon:(0,t.jsx)(Ae,{}),onOpened:v,children:(0,t.jsxs)("div",{className:Rt,children:[(0,t.jsx)("input",{ref:s,className:Ft,value:i,placeholder:n,onChange:g,onKeyDown:m}),(0,t.jsx)("button",{type:"button",className:Dt,disabled:u.length===0,onClick:h,children:r})]})})},Ht=e=>({type:"doc",content:[{type:"paragraph",content:[{type:"text",text:e}]}]}),qt=e=>(0,t.jsx)(c.Icon,{viewBox:"0 0 15 14",...e,children:(0,t.jsx)("path",{d:"M14.0146 5.20703C14.2118 5.40459 14.2121 5.72447 14.0146 5.92187L12.3291 7.6084C12.2343 7.70313 12.1047 7.75579 11.9707 7.75586C11.8369 7.75573 11.708 7.70291 11.6133 7.6084L9.92773 5.92187C9.73024 5.72438 9.73031 5.40457 9.92773 5.20703C10.1253 5.0095 10.445 5.0095 10.6426 5.20703L11.4658 6.03027L11.4658 1.68652L7.75586 1.68652L7.75586 12.6455C7.75563 12.9246 7.5291 13.1512 7.25 13.1514L2.5293 13.1514C2.2501 13.1514 2.02367 12.9247 2.02344 12.6455L2.02344 5.00781C0.868958 4.77348 0.000106647 3.7528 -1.10559e-07 2.5293C-4.95071e-08 1.13259 1.13261 9.74645e-05 2.5293 -5.23256e-07C3.92588 0.000220668 5.05859 1.13267 5.05859 2.5293C5.05849 3.75251 4.1892 4.77219 3.03516 5.00684L3.03516 12.1396L6.74414 12.1396L6.74414 1.18066C6.74414 0.901394 6.97076 0.674939 7.25 0.674804L11.9707 0.674805C12.2499 0.674939 12.4766 0.901394 12.4766 1.18066L12.4766 6.03027L13.2998 5.20703C13.4973 5.0095 13.8171 5.0095 14.0146 5.20703ZM4.04687 2.5293C4.04687 1.69137 3.36717 1.01194 2.5293 1.01172C1.69132 1.01182 1.01172 1.6913 1.01172 2.5293C1.01184 3.36719 1.6914 4.04678 2.5293 4.04687C3.36709 4.04665 4.04675 3.36712 4.04687 2.5293ZM14.5 11.2969C14.4998 12.6935 13.3673 13.8262 11.9707 13.8262C10.5742 13.826 9.4416 12.6934 9.44141 11.2969C9.44141 9.90018 10.574 8.7677 11.9707 8.76758C13.3675 8.76758 14.5 9.90011 14.5 11.2969ZM13.4883 11.2969C13.4883 10.4588 12.8088 9.7793 11.9707 9.7793C11.1327 9.77942 10.4531 10.4589 10.4531 11.2969C10.4533 12.1347 11.1329 12.8143 11.9707 12.8145C12.8086 12.8145 13.4881 12.1348 13.4883 11.2969Z",fill:"currentColor",fillOpacity:"0.8"})}),Kt="relative-difference",Gt=({label:e,layer:n,at:r,onRequestClose:o})=>{const{dispatch:a}=c.useGraphCommands(),s=c.useCompiledSelector(l=>l.coordSystem),i=(0,p.useMemo)(()=>(0,x.inferDifferenceArrowEndpoints)({layer:n,at:r,coordSystem:s}),[n,r,s]);if(i===null)return null;const d=()=>{a(new x.AddAnnotationCommand({kind:"differenceArrow",annotation:{...x.DIFFERENCE_ARROW_DEFAULTS,...i,label:Kt}})),o()};return(0,t.jsxs)(P.Menu.Item,{className:R,onClick:d,children:[(0,t.jsx)(qt,{}),(0,t.jsx)("span",{className:F,children:e})]})};function Bt(e,n){if(e.type==="polar"&&!Vt(n))return[{scope:"series",labelKey:"pieSlice"}];const r=(0,x.hasMultipleGroups)(n.data,n.mapping);switch(n.geom){case"bar":{const o=[{scope:"data-point",labelKey:"bar"}];if(r){const a=n.position==="stack"||n.position==="fill";o.push({scope:"x-value",labelKey:a?"barStack":"barGroup"}),o.push({scope:"series",labelKey:"barSeries"})}return o}case"line":case"area":{const o=[{scope:"data-point",labelKey:"linePoint"}];return r&&o.push({scope:"series",labelKey:"lineSeries"}),o}case"point":{const o=[{scope:"data-point",labelKey:"scatterPoint"}];return r&&o.push({scope:"series",labelKey:"scatterSeries"}),o}default:return[]}}var Vt=e=>{const n=(0,x.extractVariableName)(e.mapping.x);return n!==null&&n!==x.CONSTANT_VARIABLES.x},Ut=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"3.2",height:"7.704",y:"8.296",fill:"currentColor",fillOpacity:"0.3",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"4.741",x:"8.533",y:"11.259",fill:"currentColor",fillOpacity:"0.3",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"11.259",x:"4.267",y:"4.741",fill:"currentColor",fillOpacity:"0.8",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"16",x:"12.8",fill:"currentColor",fillOpacity:"0.3",rx:".533"})]}),Zt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"3.2",height:"7.704",y:"8.296",fill:"currentColor",fillOpacity:"0.8",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"4.741",x:"8.533",y:"11.259",fill:"currentColor",fillOpacity:"0.3",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"11.259",x:"4.267",y:"4.741",fill:"currentColor",fillOpacity:"0.8",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"16",x:"12.8",fill:"currentColor",fillOpacity:"0.3",rx:".533"})]}),Wt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"3.2",height:"7.704",y:"8.296",fill:"currentColor",fillOpacity:"0.3",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"4.741",x:"8.533",y:"11.259",fill:"currentColor",fillOpacity:"0.3",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"11.259",x:"4.267",y:"4.741",fill:"currentColor",fillOpacity:"0.8",rx:".533"}),(0,t.jsx)("rect",{width:"3.2",height:"16",x:"12.8",fill:"currentColor",fillOpacity:".8",rx:".533"})]}),$t=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{fill:"currentColor",fillOpacity:"0.3",d:"M0 13.037h4.267v2.445a.52.52 0 0 1-.519.518H.518A.52.52 0 0 1 0 15.482zM0 7.037c0-.286.232-.518.519-.518h3.23c.286 0 .518.232.518.518v5.408H0z"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:".8",d:"M5.867 7.704h4.266v7.778a.52.52 0 0 1-.518.518h-3.23a.52.52 0 0 1-.518-.518zM5.867 7.111h4.266V4.074a.52.52 0 0 0-.518-.518h-3.23a.52.52 0 0 0-.518.518z"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:"0.3",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"})]}),Xt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeOpacity:".8",strokeWidth:"1.163",d:"m-1.618 15.96 9.118-5.3 11 2.34"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:"0.6",stroke:"currentColor",strokeOpacity:"0.3",d:"M8 13a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z"}),(0,t.jsx)("rect",{width:"9.795",height:"6",x:"3",y:"2",fill:"currentColor",fillOpacity:"0.3",rx:"1.513"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:".8",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"})]}),Yt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{stroke:"currentColor",strokeOpacity:"0.8",strokeLinecap:"round",strokeLinejoin:"bevel",strokeWidth:".993",d:"M1.5 12 6 6.5l4 3.5 4-5.5"}),(0,t.jsx)("circle",{cx:"1.493",cy:"11.993",r:".993",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("circle",{cx:"5.993",cy:"6.493",r:".993",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("circle",{cx:"9.993",cy:"9.993",r:".993",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("circle",{cx:"13.993",cy:"4.493",r:".993",fill:"currentColor",fillOpacity:"0.8"})]}),Jt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"16",height:"16",fill:"currentColor",fillOpacity:"0.3",rx:"8"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:"0.8",d:"m7.999 16 .412-.01A8 8 0 0 0 8 0z"}),(0,t.jsx)("path",{fill:"currentColor",fillOpacity:"0.6",d:"M15.999 8a8 8 0 0 1-7.588 7.989l-.412.01V8z"})]}),Qt=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 3.598 7.215)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 6.681 11.327)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 9.251 7.215)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:".8",rx:"1.028",transform:"matrix(-1 0 0 1 10.28 2.59)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 13.877 6.187)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 2.056 12.869)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 15.933 .533)"})]}),en=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:".8",rx:"1.028",transform:"matrix(-1 0 0 1 3.598 7.215)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:".8",rx:"1.028",transform:"matrix(-1 0 0 1 6.681 11.327)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 9.251 7.215)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:".8",rx:"1.028",transform:"matrix(-1 0 0 1 10.28 2.59)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 13.877 6.187)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 2.056 12.869)"}),(0,t.jsx)("rect",{width:"2.056",height:"2.056",fill:"currentColor",fillOpacity:"0.3",rx:"1.028",transform:"matrix(-1 0 0 1 15.933 .533)"})]}),tn={bar:Ut,barGroup:Zt,barStack:$t,barSeries:Wt,linePoint:Xt,lineSeries:Yt,scatterPoint:Qt,scatterSeries:en,pieSlice:Jt},Me=({labelKey:e})=>{const n=tn[e];return(0,t.jsx)(n,{})},Ne=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{opacity:"0.12",d:"M15 4.66667L12.3333 2L2.33334 12L5.00001 14.6667L15 4.66667Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{d:"M5.01683 15.3331C4.84407 15.3343 4.67292 15.2997 4.51421 15.2314C4.3555 15.1632 4.21268 15.0627 4.09476 14.9365L3.88656 14.7283L3.62877 14.8968L3.19253 15.3331H0L2.24072 13.0923L2.03251 12.8445C1.89423 12.7191 1.78392 12.566 1.70875 12.3952C1.63359 12.2244 1.59526 12.0396 1.59626 11.853C1.59579 11.6818 1.63078 11.5124 1.69904 11.3554C1.76729 11.1984 1.86733 11.0573 1.99285 10.9409L11.2036 1.73012C11.3215 1.60384 11.4643 1.5034 11.623 1.43514C11.7817 1.36688 11.9529 1.33228 12.1257 1.33353C12.2969 1.33245 12.4665 1.36716 12.6236 1.43546C12.7807 1.50375 12.9218 1.60412 13.0378 1.73012L15.1496 3.92126C15.2748 4.03899 15.3745 4.1811 15.4427 4.33882C15.5108 4.49654 15.546 4.66655 15.546 4.83837C15.546 5.01019 15.5108 5.1802 15.4427 5.33792C15.3745 5.49564 15.2748 5.63774 15.1496 5.75548L5.93889 14.9662C5.81806 15.0866 5.67403 15.1812 5.51552 15.2443C5.35702 15.3074 5.18736 15.3376 5.01683 15.3331ZM2.48858 11.9125L5.01683 14.4407L9.47843 9.97913L6.95019 7.4608L2.48858 11.9125ZM7.68388 6.72712L10.2022 9.24544L14.644 4.80367L12.1257 2.28534L7.68388 6.72712Z",fill:"currentColor",fillOpacity:"0.8"})]}),nn=({label:e,options:n,onSelect:r})=>{const o=c.useI18n();return(0,t.jsx)(te,{label:e,icon:(0,t.jsx)(Ne,{}),children:n.map(a=>(0,t.jsxs)(N.Menu.Item,{className:R,onClick:()=>r(a.scope),children:[(0,t.jsx)(Me,{labelKey:a.labelKey}),(0,t.jsx)("span",{className:F,children:o(`graph.annotations.highlights.labels.${a.labelKey}`)})]},a.scope))})},rn=({label:e,layer:n,observation:r,highlights:o,onRequestClose:a})=>{const s=c.useI18n(),{dispatch:i}=c.useGraphCommands(),d=c.useCompiledSelector(v=>v.coordSystem),l=(0,p.useMemo)(()=>(0,x.buildObservationPredicate)(n,r),[n,r]),u=(0,p.useMemo)(()=>Bt(d,n),[d,n]),h=(0,p.useMemo)(()=>{const v=new Set(o.map(f=>f.scope));return u.filter(f=>!v.has(f.scope))},[u,o]),[m]=h;if(l===null||m===void 0)return null;const g=v=>{i(new x.AddHighlightCommand({predicate:l,scope:v,layerId:n.id})),a()};if(h.length===1){const v=u.length===1?e:s("graph.annotations.baseMenu.highlightWithLabel",{label:s(`graph.annotations.highlights.labels.${m.labelKey}`)});return(0,t.jsxs)(N.Menu.Item,{className:R,onClick:()=>g(m.scope),children:[(0,t.jsx)(Me,{labelKey:m.labelKey}),(0,t.jsx)("span",{className:F,children:v})]})}return(0,t.jsx)(nn,{label:e,options:h,onSelect:g})},an="_1aafi1g0",on="_1aafi1g1",Oe=({children:e})=>(0,t.jsxs)("span",{className:an,"aria-hidden":"true",children:[e,(0,t.jsx)("span",{className:on})]}),sn=({label:e,highlights:n,onRequestClose:r})=>{const{dispatch:o}=c.useGraphCommands(),a=n.at(-1);if(a===void 0)return null;const s=()=>{o(new x.RemoveHighlightCommand({id:a.id})),r()};return(0,t.jsxs)(P.Menu.Item,{className:R,onClick:s,children:[(0,t.jsx)(Oe,{children:(0,t.jsx)(Ne,{})}),(0,t.jsx)("span",{className:F,children:e})]})},ln=(e,n)=>{const r=c.useCompiledSelector(a=>a.spec.highlights),o=c.useCompiledSelector(a=>a.config.parsingLocale);return(0,p.useMemo)(()=>(0,x.findHighlightsAtObservation)({layer:e,highlights:r,observation:n,parsingLocale:o}),[e,r,n,o])},Le=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{opacity:"0.12",d:"M13.5948 4.29016C13.8724 6.22367 12.5301 8.01618 10.5966 8.29384C8.66309 8.57151 6.87058 7.22918 6.59292 5.29567C6.31525 3.36216 7.65758 1.56965 9.59109 1.29198C11.5246 1.01432 13.3171 2.35665 13.5948 4.29016Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M5.71886 3.51052C6.25611 1.3626 8.43287 0.0568985 10.5808 0.594151C12.7287 1.1314 14.0344 3.30817 13.4972 5.45609C13.0316 7.31748 11.3347 8.54637 9.49237 8.49145L7.50898 12.492C7.46485 12.581 7.40179 12.6548 7.32702 12.7108C7.20005 12.8073 7.03703 12.8532 6.87248 12.8303C6.80957 12.822 6.74697 12.8038 6.68687 12.7749C6.39369 12.6342 6.26689 12.2915 6.3923 11.9963L7.63393 7.97371C6.10249 7.10872 5.27136 5.29962 5.71886 3.51052ZM10.2785 1.80253C8.79799 1.4322 7.29756 2.33222 6.92723 3.81277C6.55691 5.29332 7.45692 6.79375 8.93747 7.16408C10.418 7.5344 11.9185 6.63439 12.2888 5.15384C12.6591 3.67329 11.7591 2.17285 10.2785 1.80253Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{d:"M5.42977 11.1572C5.70072 11.104 5.8772 10.8411 5.82393 10.5702C5.77067 10.2992 5.50784 10.1227 5.23688 10.176C4.31848 10.3565 3.57421 10.6423 3.04695 11.0266C2.51409 11.4149 2.16666 11.936 2.16666 12.557C2.16666 13.0322 2.41215 13.4327 2.74425 13.7433C3.07553 14.0531 3.52776 14.3091 4.04484 14.5137C5.08193 14.9239 6.48048 15.1666 7.99999 15.1666C9.5195 15.1666 10.9181 14.9239 11.9551 14.5137C12.4722 14.3091 12.9244 14.0531 13.2557 13.7433C13.5878 13.4327 13.8333 13.0322 13.8333 12.557C13.8333 11.936 13.4859 11.4149 12.953 11.0266C12.4258 10.6423 11.6815 10.3565 10.7631 10.176C10.4921 10.1227 10.2293 10.2992 10.176 10.5702C10.1228 10.8411 10.2993 11.104 10.5702 11.1572C11.4079 11.3219 11.997 11.5672 12.364 11.8347C12.7255 12.0981 12.8333 12.3496 12.8333 12.557C12.8333 12.6643 12.7803 12.8187 12.5727 13.013C12.3642 13.2079 12.0354 13.4065 11.5873 13.5838C10.6941 13.9371 9.426 14.1666 7.99999 14.1666C6.57398 14.1666 5.30586 13.9371 4.41267 13.5838C3.9646 13.4065 3.63578 13.2079 3.4273 13.013C3.21964 12.8187 3.16666 12.6643 3.16666 12.557C3.16666 12.3496 3.2745 12.0981 3.63595 11.8347C4.00299 11.5672 4.59206 11.3219 5.42977 11.1572Z",fill:"currentColor",fillOpacity:"0.8"})]}),cn=({label:e,at:n,onRequestClose:r})=>{const{dispatch:o}=c.useGraphCommands(),a=()=>{o(new x.AddAnnotationCommand({kind:"pinnedNumber",annotation:{at:n}})),r()};return(0,t.jsxs)(P.Menu.Item,{className:R,onClick:a,children:[(0,t.jsx)(Le,{}),(0,t.jsx)("span",{className:F,children:e})]})},ke=e=>(0,t.jsxs)(c.Icon,{viewBox:"0 0 16 16",...e,children:[(0,t.jsx)("path",{opacity:"0.12",d:"M1.33334 8.00016C1.33334 4.31826 4.31811 1.3335 8.00001 1.3335C11.6819 1.3335 14.6667 4.31826 14.6667 8.00016C14.6667 11.6821 11.6819 14.6668 8.00001 14.6668C4.31811 14.6668 1.33334 11.6821 1.33334 8.00016Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{d:"M5.7328 9.69963C5.56696 9.47884 5.25352 9.43429 5.03273 9.60013C4.81193 9.76598 4.76739 10.0794 4.93323 10.3002C5.63175 11.2302 6.74548 11.8333 7.99993 11.8333C9.25438 11.8333 10.3681 11.2302 11.0666 10.3002C11.2325 10.0794 11.1879 9.76598 10.9671 9.60013C10.7463 9.43429 10.4329 9.47884 10.2671 9.69963C9.74929 10.3889 8.92657 10.8333 7.99993 10.8333C7.07329 10.8333 6.25057 10.3889 5.7328 9.69963Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{d:"M6.66668 6.66658C6.66668 7.03478 6.3682 7.33325 6.00001 7.33325C5.63182 7.33325 5.33334 7.03478 5.33334 6.66658C5.33334 6.29839 5.63182 5.99992 6.00001 5.99992C6.3682 5.99992 6.66668 6.29839 6.66668 6.66658Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{d:"M10 7.33325C10.3682 7.33325 10.6667 7.03478 10.6667 6.66658C10.6667 6.29839 10.3682 5.99992 10 5.99992C9.63182 5.99992 9.33334 6.29839 9.33334 6.66658C9.33334 7.03478 9.63182 7.33325 10 7.33325Z",fill:"currentColor",fillOpacity:"0.8"}),(0,t.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M8.00001 0.833252C4.04197 0.833252 0.833344 4.04188 0.833344 7.99992C0.833344 11.958 4.04197 15.1666 8.00001 15.1666C11.9581 15.1666 15.1667 11.958 15.1667 7.99992C15.1667 4.04188 11.9581 0.833252 8.00001 0.833252ZM14.1667 7.99992C14.1667 11.4057 11.4058 14.1666 8.00001 14.1666C4.59425 14.1666 1.83334 11.4057 1.83334 7.99992C1.83334 4.59416 4.59425 1.83325 8.00001 1.83325C11.4058 1.83325 14.1667 4.59416 14.1667 7.99992Z",fill:"currentColor",fillOpacity:"0.8"})]}),Re={pinnedNumber:{icon:Le,labelKey:"graph.annotations.baseMenu.unpinNumber"},comment:{icon:Ae,labelKey:"graph.annotations.baseMenu.removeAnnotation"},sticker:{icon:ke,labelKey:"graph.annotations.baseMenu.removeSticker"},image:null},dn=e=>(0,x.isObservationAttachmentKind)(e.kind)&&Re[e.kind]!==null,un=({attachment:e,onRequestClose:n})=>{const r=c.useI18n(),{dispatch:o}=c.useGraphCommands(),{icon:a,labelKey:s}=Re[e.kind],i=()=>{o(new x.RemoveAnnotationCommand({id:e.annotation.id})),n()};return(0,t.jsxs)(P.Menu.Item,{className:R,onClick:i,children:[(0,t.jsx)(Oe,{children:(0,t.jsx)(a,{})}),(0,t.jsx)("span",{className:F,children:r(s)})]})},hn="ceeojg0",mn="ceeojg1",pn="ceeojg2",vn=({label:e,at:n,onRequestClose:r})=>{const{dispatch:o}=c.useGraphCommands(),a=s=>{o(new x.AddAnnotationCommand({kind:"sticker",annotation:{at:{anchorType:"observation",...n},sticker:s}})),r()};return(0,t.jsx)(te,{label:e,icon:(0,t.jsx)(ke,{}),children:(0,t.jsx)("div",{className:hn,children:Object.entries(c.STICKER_ASSETS).map(([s,i])=>(0,t.jsx)(N.Menu.Item,{className:mn,"aria-label":s,onClick:()=>a(s),children:(0,t.jsx)("img",{className:pn,src:i.src,alt:s})},s))})})},xn=({interaction:e,panelOrigin:n})=>{const r=c.useEditorStore(),o=c.useEditorState(s=>s.menuTrigger);if(e.kind!=="menu"||o===null)return null;const a=()=>{r.getState().releaseInteraction("menu")};return(0,t.jsx)(gn,{trigger:{x:n.x+o.center.x,y:n.y+o.center.y,radius:o.radius},layer:e.anchor.layer,at:e.anchor.at,observation:e.anchor.observation,onClose:a})},gn=({trigger:e,layer:n,at:r,observation:o,onClose:a})=>{const s=c.useI18n(),i=ee(),d=c.useCompiledSelector(C=>C.spec.annotations),l=c.useCompiledSelector(C=>C.config.parsingLocale),u=Cn(),{x:h,y:m,radius:g}=e,v=(0,p.useMemo)(()=>fn(h,m,g),[h,m,g]),f=(0,x.findObservationAttachment)(d,r,(0,p.useMemo)(()=>(0,x.createObservationAnchorParser)(n,l),[n,l])),I=f!==null&&dn(f)?f:null,S=ln(n,o),b=(C,y)=>{!C&&bn(y.reason)&&a()};return(0,t.jsx)(P.Menu.Root,{open:u,modal:!1,onOpenChange:b,children:(0,t.jsx)(P.Menu.Portal,{container:i,children:(0,t.jsx)(c.PortalThemeProvider,{children:(0,t.jsx)(P.Menu.Positioner,{anchor:v,side:"right",align:"start",sideOffset:8,className:_e,...Ie,children:(0,t.jsxs)(P.Menu.Popup,{className:Ee,"data-testid":"observation-menu",children:[I!==null&&(0,t.jsx)(un,{attachment:I,onRequestClose:a}),(0,t.jsx)(sn,{label:s("graph.annotations.baseMenu.removeHighlight"),highlights:S,onRequestClose:a}),(0,t.jsx)(P.Menu.Separator,{className:Nt}),I===null&&(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(cn,{label:s("graph.annotations.baseMenu.pinNumber"),at:r,onRequestClose:a}),(0,t.jsx)(zt,{label:s("graph.annotations.baseMenu.annotate"),placeholder:s("graph.annotations.textMenu.placeholder"),addLabel:s("graph.annotations.textMenu.addButton"),at:r,onRequestClose:a}),(0,t.jsx)(vn,{label:s("graph.annotations.baseMenu.addSticker"),at:r,onRequestClose:a})]}),n.highlight!==null&&(0,t.jsx)(rn,{label:s("graph.annotations.baseMenu.highlight"),layer:n,observation:o,highlights:S,onRequestClose:a}),(0,t.jsx)(Gt,{label:s("graph.annotations.baseMenu.differenceArrow"),layer:n,at:r,onRequestClose:a})]})})})})})},fn=(e,n,r)=>({getBoundingClientRect:()=>new DOMRect(e-r,n-r,r*2,r*2)}),Cn=()=>{const[e,n]=(0,p.useState)(!1);return(0,p.useEffect)(()=>{n(!0)},[]),e},bn=e=>e==="outside-press"||e==="escape-key"||e==="item-press",jn=()=>{const e=c.useGraphSelection();return Fe(e)},Fe=e=>{if(e.length!==1)return null;const[n]=e;return n?.kind==="annotation"?n.id:null},Sn=e=>(0,t.jsx)(c.Icon,{...e,children:(0,t.jsxs)("g",{stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",children:[(0,t.jsx)("path",{d:"M4 9h16m-4-4 4 4"}),(0,t.jsx)("path",{d:"M20 15H4m4 4-4-4"})]})}),yn=e=>(0,t.jsx)(c.Icon,{...e,children:(0,t.jsxs)("g",{stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",children:[(0,t.jsx)("path",{d:"M4 7h16"}),(0,t.jsx)("path",{d:"M10 11v6M14 11v6"}),(0,t.jsx)("path",{d:"M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12"}),(0,t.jsx)("path",{d:"M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2"})]})}),wn={kind:"chrome-popup"},In="var(--q7gcrz0)",Pn="var(--q7gcrz1)",Tn="q7gcrz2",An="q7gcrz3";var _n="q7gcrz5",En="q7gcrz6",Mn="q7gcrz7",Nn="q7gcrz8",De="q7gcrz9",On="q7gcrza";var de="q7gcrzd q7gcrzc",ze="q7gcrze q7gcrzc",Ln=["absolute-difference","relative-difference","proportion"],ue=["absolute-difference","relative-difference"],kn=["relative-difference","proportion"],Rn={"absolute-difference":"graph.annotations.differenceArrowToolbar.labelKind.absoluteDifference","relative-difference":"graph.annotations.differenceArrowToolbar.labelKind.relativeDifference",proportion:"graph.annotations.differenceArrowToolbar.labelKind.proportion"},Fn=e=>{const{formattingLocale:n}=c.useGraphContext(),r=c.useCompiledSelector(a=>a.config.parsingLocale),o=n??r;return(0,p.useMemo)(()=>{const a=(0,x.areEndpointsComparable)(e.start,e.end);return Ln.filter(s=>a||!ue.includes(s)||s===e.label).map(s=>({kind:s,nameKey:Rn[s],preview:(0,x.formatDifferenceLabel)({locale:o,kind:s,startValue:e.start.measurementValue,endValue:e.end.measurementValue,valueFormat:e.start.valueFormat}),isPickable:a||!ue.includes(s),isSuspect:kn.includes(s)&&e.start.measurementValue===0}))},[e,o])},q=8,Dn=({labelBox:e,panelRect:n,frameWidth:r,frameHeight:o})=>{const a=n.y+e.y,s=a+e.height,i=a-8-36,d=s+8,l=zn(q,i>=q?i:d,o-q-36),u=q;return{top:l,left:u,available:Math.max(0,r-q*2),centre:n.x+e.x+e.width/2-u}},zn=(e,n,r)=>Math.max(e,Math.min(n,r)),W=[{id:"small",nameKey:"graph.annotations.differenceArrowToolbar.size.small"},{id:"medium",nameKey:"graph.annotations.differenceArrowToolbar.size.medium"},{id:"large",nameKey:"graph.annotations.differenceArrowToolbar.size.large"}],Hn=({arrow:e,labelBox:n,panelRect:r,frameWidth:o,frameHeight:a,frameElement:s})=>{const i=c.useI18n(),{chartId:d,commands:l}=c.useGraphContext(),u=c.useEditorStore(),[h,m]=(0,p.useState)(null),g=Fn(e),v=Dn({labelBox:n,panelRect:r,frameWidth:o,frameHeight:a}),f=(b,C)=>{l.dispatch(new x.UpdateAnnotationCommand({kind:"differenceArrow",id:e.id,patch:b}),C)};(0,p.useEffect)(()=>()=>l.seal(),[l]),(0,p.useEffect)(()=>{const{claimInteraction:b,releaseInteraction:C}=u.getState();return h===null?C("chrome-popup"):b(wn),()=>C("chrome-popup")},[u,h]);const I=b=>{m(b?"color":null),b||l.seal()},S=()=>{l.dispatch(new x.RemoveAnnotationCommand({id:e.id})),s.focus({preventScroll:!0})};return(0,t.jsx)("div",{className:Tn,style:{top:v.top,left:v.left,width:v.available},children:(0,t.jsxs)(c.FloatingToolbar.Root,{"aria-label":i("graph.annotations.differenceArrowToolbar.label"),className:An,"data-testid":"difference-arrow-toolbar",...U(d),style:(0,Se.assignInlineVars)({[In]:`${v.centre}px`,[Pn]:`${v.available}px`}),children:[(0,t.jsx)(qn,{options:g,current:e.label,isOpen:h==="labelKind",onOpenChange:b=>m(b?"labelKind":null),onPick:b=>{f({label:b}),m(null)}}),(0,t.jsx)(c.FloatingToolbar.Separator,{}),(0,t.jsx)(c.FloatingToolbar.ColorPicker,{color:e.color,label:i("graph.annotations.differenceArrowToolbar.color"),onChange:b=>f({color:b},{transient:!0}),isOpen:h==="color",onOpenChange:I,popupAttributes:U(d),children:(0,t.jsx)("span",{className:En,style:{background:e.color??"transparent"}})}),(0,t.jsx)(Kn,{current:e.size,isOpen:h==="size",onOpenChange:b=>m(b?"size":null),onPick:b=>{f({size:b}),m(null)}}),(0,t.jsx)(c.FloatingToolbar.Separator,{}),(0,t.jsx)(c.FloatingToolbar.Button,{"aria-label":i("graph.annotations.differenceArrowToolbar.swap"),className:de,onClick:()=>f({start:e.end.anchor,end:e.start.anchor}),children:(0,t.jsx)(Sn,{size:"sm",title:""})}),(0,t.jsx)(c.FloatingToolbar.Button,{"aria-label":i("graph.annotations.differenceArrowToolbar.remove"),className:de,onClick:S,children:(0,t.jsx)(yn,{size:"sm",title:""})})]})})},qn=({options:e,current:n,isOpen:r,onOpenChange:o,onPick:a})=>{const s=c.useI18n(),i=e.find(l=>l.kind===n),d=e.some(l=>l.isPickable&&l.kind!==n);return(0,t.jsxs)(P.Menu.Root,{open:r,modal:!1,onOpenChange:o,children:[(0,t.jsxs)(P.Menu.Trigger,{render:(0,t.jsx)(c.FloatingToolbar.Button,{}),"aria-label":s("graph.annotations.differenceArrowToolbar.labelKind.ariaLabel"),className:ze,disabled:!d,onMouseDown:l=>l.preventDefault(),children:[(0,t.jsx)("span",{className:_n,children:i===void 0?"":s(i.nameKey)}),i!==void 0&&(0,t.jsxs)("span",{className:"q7gcrz4",children:["(",i.preview,")"]}),(0,t.jsx)(c.ChevronDownIcon,{size:"sm"})]}),(0,t.jsx)(He,{children:e.map(l=>(0,t.jsxs)(P.Menu.Item,{className:De,"data-selected":l.kind===n,disabled:!l.isPickable,onClick:()=>a(l.kind),children:[(0,t.jsx)("span",{children:s(l.nameKey)}),(l.isSuspect||!l.isPickable)&&(0,t.jsx)("span",{"aria-label":s(l.isPickable?"graph.annotations.differenceArrowToolbar.labelKind.suspectValue":"graph.annotations.differenceArrowToolbar.labelKind.incomparableEnds"),className:"q7gcrzb",role:"img",children:"⚠"}),(0,t.jsx)("span",{className:On,children:l.preview})]},l.kind))})]})},Kn=({current:e,isOpen:n,onOpenChange:r,onPick:o})=>{const a=c.useI18n(),s=W.find(i=>i.id===e)??W[0];return(0,t.jsxs)(P.Menu.Root,{open:n,modal:!1,onOpenChange:r,children:[(0,t.jsxs)(P.Menu.Trigger,{render:(0,t.jsx)(c.FloatingToolbar.Button,{}),"aria-label":a("graph.annotations.differenceArrowToolbar.size.ariaLabel"),className:ze,onMouseDown:i=>i.preventDefault(),children:[(0,t.jsx)("span",{children:s===void 0?"":a(s.nameKey)}),(0,t.jsx)(c.ChevronDownIcon,{size:"sm"})]}),(0,t.jsx)(He,{children:W.map(i=>(0,t.jsx)(P.Menu.Item,{className:De,"data-selected":i.id===e,onClick:()=>o(i.id),children:a(i.nameKey)},i.id))})]})},He=({children:e})=>{const{chartId:n}=c.useGraphContext();return(0,t.jsx)(P.Menu.Portal,{container:c.resolvePortalContainer(),children:(0,t.jsx)(c.PortalThemeProvider,{children:(0,t.jsx)(P.Menu.Positioner,{side:"bottom",align:"start",sideOffset:6,className:Mn,children:(0,t.jsx)(P.Menu.Popup,{className:Nn,onMouseDown:r=>r.preventDefault(),...U(n),children:e})})})})};var Gn="ydgo3h0",Bn="ydgo3h1",Vn="ydgo3h2",qe=e=>e==="start"?"end":"start",Ke=({dispatch:e,arrow:n,endpoint:r,anchor:o})=>{(0,x.areAnchorsEqual)(o,n[r].anchor)||e(new x.UpdateAnnotationCommand({kind:"differenceArrow",id:n.id,patch:{[r]:o}}))},Un=({clientPoint:e,panelOrigin:n,panelRect:r,engine:o,layers:a,coordSystem:s,resolver:i,fixedAnchor:d,align:l})=>{const u=Zn({x:e.x-n.x,y:e.y-n.y},r),{primary:h}=o.query((0,x.toPanelCursor)(u,r));if(h===null)return null;const m=a.find(v=>v.id===h.layerId);if(m===void 0)return null;const g=(0,x.resolveObservationPoint)({resolver:i,layer:m,observation:h.observation,coordSystem:s,align:l});return g===null||(0,x.areAnchorsEqual)(g.anchor,d)?null:g},Zn=(e,n)=>({x:Math.max(0,Math.min(e.x,n.width)),y:Math.max(0,Math.min(e.y,n.height))}),Wn=class{constructor(e){this.params=e,this.listeners=new AbortController,this.pendingEvent=null,this.scheduledFrame=null,this.hasMoved=!1,this.hasPublished=!1,this.handleMove=n=>{n.pointerId===this.params.pointerId&&(this.pendingEvent=n,this.hasMoved=!0,this.scheduledFrame===null&&(this.scheduledFrame=requestAnimationFrame(this.runFrame)))},this.handleUp=n=>{n.pointerId===this.params.pointerId&&(this.pendingEvent=n,this.finish(!0))},this.handleLost=n=>{n.pointerId===this.params.pointerId&&this.finish(!1)},this.runFrame=()=>{this.scheduledFrame=null;const n=this.pendingEvent;if(this.pendingEvent=null,n===null)return;const{editorStore:r,engine:o,anchorResolver:a,endpoint:s,readInputs:i}=this.params,{arrow:d,panelOrigin:l,panelRect:u,layers:h,coordSystem:m}=i(),g=r.getState();if(this.hasPublished&&c.readDraggedEndpointFor(c.readStanding(g,"endpoint-drag"),d.id,s)===null)return;const v=Un({clientPoint:{x:n.clientX,y:n.clientY},panelOrigin:l,panelRect:u,engine:o,layers:h,coordSystem:m,resolver:a,fixedAnchor:d[qe(s)].anchor,align:d[s].anchor.align});v!==null&&this.publish(v)}}start(){const{handle:e}=this.params,{signal:n}=this.listeners;e.addEventListener("pointermove",this.handleMove,{signal:n}),e.addEventListener("pointerup",this.handleUp,{signal:n}),e.addEventListener("lostpointercapture",this.handleLost,{signal:n})}finish(e){this.params.onSettled(),this.listeners.abort(),this.cancelFrame(),e&&this.hasMoved&&this.runFrame(),this.pendingEvent=null;const{editorStore:n,endpoint:r,readInputs:o,dispatch:a}=this.params,{arrow:s}=o(),i=n.getState(),d=c.readDraggedEndpointFor(c.readStanding(i,"endpoint-drag"),s.id,r);d!==null&&(i.releaseInteraction("endpoint-drag"),e&&Ke({dispatch:a,arrow:s,endpoint:r,anchor:d.point.anchor}))}publish(e){const{editorStore:n,readInputs:r,endpoint:o}=this.params;n.getState().claimInteraction({kind:"endpoint-drag",annotationId:r().arrow.id,endpoint:o,point:e}),this.hasPublished=!0}cancelFrame(){this.scheduledFrame!==null&&(cancelAnimationFrame(this.scheduledFrame),this.scheduledFrame=null)}},$n=({arrow:e,panelOrigin:n,panelRect:r})=>{const{commands:o,anchorResolver:a}=c.useGraphContext(),{engine:s}=c.useHoverContext(),i=c.useEditorStore(),d=c.useLatestRef({arrow:e,panelOrigin:n,panelRect:r,...c.useCompiledSelector((0,Q.useShallow)(u=>({layers:u.layers,coordSystem:u.coordSystem})))}),l=(0,p.useRef)(null);return(0,p.useEffect)(()=>()=>l.current?.finish(!1),[]),(0,p.useCallback)(u=>({onClick:h=>h.stopPropagation(),onPointerDown:h=>{if(h.button!==0||l.current!==null)return;try{h.currentTarget.setPointerCapture(h.pointerId)}catch{return}h.currentTarget.focus({preventScroll:!0}),h.preventDefault();const m=new Wn({handle:h.currentTarget,pointerId:h.pointerId,endpoint:u,readInputs:()=>d.current,editorStore:i,engine:s,anchorResolver:a,dispatch:o.dispatch,onSettled:()=>{l.current=null}});l.current=m,m.start()}}),[d,i,s,a,o])},Xn=[" ","Enter"],Yn=({arrow:e})=>{const{commands:n,anchorResolver:r}=c.useGraphContext(),o=c.useEditorStore(),{layers:a,coordSystem:s,mainAxis:i}=c.useCompiledSelector((0,Q.useShallow)(l=>({layers:l.layers,coordSystem:l.coordSystem,mainAxis:l.coordSystem.type==="cartesian"?l.coordSystem.mainAxis:"x"}))),d=e.id;return(0,p.useEffect)(()=>()=>{const l=o.getState();c.readStanding(l,"endpoint-drag")?.annotationId===d&&l.releaseInteraction("endpoint-drag")},[o,d]),(0,p.useCallback)(l=>({onKeyDown:u=>{if(u.altKey||u.ctrlKey||u.metaKey||u.shiftKey)return;const h=o.getState(),m=c.readDraggedEndpointFor(c.readStanding(h,"endpoint-drag"),e.id,l);if(Xn.includes(u.key)){if(u.preventDefault(),u.repeat)return;if(m===null)return h.claimInteraction({kind:"endpoint-drag",annotationId:e.id,endpoint:l,point:e[l]});h.releaseInteraction("endpoint-drag"),Ke({dispatch:n.dispatch,arrow:e,endpoint:l,anchor:m.point.anchor});return}if(m===null)return;const g=Jn(u.key,i);if(g===null)return;u.preventDefault();const v=Qn({arrow:e,endpoint:l,from:m.point.anchor,move:g,layers:a,coordSystem:s,resolver:r});v!==null&&h.claimInteraction({kind:"endpoint-drag",annotationId:e.id,endpoint:l,point:v})}}),[e,o,n,r,a,s,i])},Jn=(e,n)=>{const r=e==="ArrowUp"||e==="ArrowDown";return!r&&!(e==="ArrowLeft"||e==="ArrowRight")?null:{axis:n==="x"===r?"cross":"main",step:e==="ArrowDown"||e==="ArrowRight"?1:-1}},Qn=({arrow:e,endpoint:n,from:r,move:o,layers:a,coordSystem:s,resolver:i})=>{const d=a.find(u=>u.id===r.layerId);if(d===void 0)return null;const l=(0,x.stepDifferenceArrowEndpoint)({layer:d,from:r,partner:e[qe(n)].anchor,axis:o.axis,step:o.step,canLandOn:u=>(0,x.resolveObservationPoint)({resolver:i,layer:d,observation:u,coordSystem:s,align:e[n].anchor.align})!==null});return l===null?null:(0,x.resolveObservationPoint)({resolver:i,layer:d,observation:l.observation,coordSystem:s,align:e[n].anchor.align})},er=e=>{const n=jn();return n===null?null:(0,t.jsx)(tr,{annotationId:n,...e})},tr=({annotationId:e,...n})=>{const r=c.useDifferenceArrowGeometries(),o=(0,p.useMemo)(()=>r.find(a=>a.id===e),[r,e]);return o===void 0?null:(0,t.jsx)(nr,{committedArrow:o.committedArrow,committedLabelBox:o.committedLabelBox,labelBox:o.labelBox,start:o.start,end:o.end,isDragged:o.isDragged,...n})},nr=({committedArrow:e,committedLabelBox:n,labelBox:r,start:o,end:a,panelRect:s,panelOrigin:i,frameRect:d,frameElement:l,isDragged:u})=>{const h=$n({arrow:e,panelOrigin:i,panelRect:s}),m=Yn({arrow:e});return(0,t.jsxs)("div",{"data-testid":"difference-arrow-selection",children:[!u&&(0,t.jsx)(Hn,{arrow:e,labelBox:n,panelRect:s,frameWidth:d.width,frameHeight:d.height,frameElement:l}),(0,t.jsx)("div",{"aria-hidden":"true",className:Vn,"data-testid":"difference-arrow-selection-label",style:{left:s.x+r.x-2,top:s.y+r.y-2,width:r.width+4,height:r.height+4}}),(0,t.jsx)(he,{endpoint:"start",point:o,panelRect:s,dragHandlers:h("start"),keyboardHandlers:m("start")}),(0,t.jsx)(he,{endpoint:"end",point:a,panelRect:s,dragHandlers:h("end"),keyboardHandlers:m("end")})]})},he=({endpoint:e,point:n,panelRect:r,dragHandlers:o,keyboardHandlers:a})=>(0,t.jsx)("div",{className:Gn,"data-testid":"difference-arrow-selection-handle","data-endpoint":e,role:"button",style:{left:r.x+n.x,top:r.y+n.y},tabIndex:0,...o,...a,children:(0,t.jsx)("span",{"aria-hidden":"true",className:Bn})}),rr=e=>(0,t.jsx)(c.Icon,{...e,children:(0,t.jsxs)("g",{stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",children:[(0,t.jsx)("path",{d:"M12 5v14"}),(0,t.jsx)("path",{d:"M5 12h14"})]})}),ar="var(--_1tyillx0)",or={rest:.5,hovered:.75,open:1};var sr="_1tyillx1",ir={rest:"_1tyillx2",hovered:"_1tyillx3",open:"_1tyillx4"},lr="_1tyillx5",cr={closed:"_1tyillx6",open:"_1tyillx7"},dr=({interaction:e,panelRect:n})=>{const r=c.useEditorStore(),o=c.useCompiledSelector(d=>d.coordSystem),a=e.kind==="trigger"||e.kind==="menu"?e.anchor:null,s=ur(e),i=(0,p.useMemo)(()=>{if(a===null)return null;const d=(0,x.projectAnchorToPanel)(a.position,n,o);return{center:d,radius:19*or[s],target:{kind:"observation",cursor:(0,x.toPanelCursor)(d,n)}}},[a,n,o,s]);return(0,p.useEffect)(()=>{r.getState().setMenuTrigger(i)},[r,i]),(0,p.useEffect)(()=>()=>r.getState().setMenuTrigger(null),[r]),a===null||i===null?null:(0,t.jsx)("div",{"aria-hidden":"true","data-testid":"observation-menu-trigger","data-state":s,className:(0,O.default)(sr,ir[s]),style:{left:n.x+i.center.x,top:n.y+i.center.y,...(0,Se.assignInlineVars)({[ar]:a.color??yt.vars.border50})},children:(0,t.jsx)("span",{className:(0,O.default)(lr,cr[s==="open"?"open":"closed"]),children:(0,t.jsx)(rr,{size:"lg"})})})},ur=e=>e.kind==="menu"?"open":e.kind==="trigger"&&e.isEngaged?"hovered":"rest",hr='button:not([disabled]):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])',mr=(e,n)=>{const{chartId:r}=c.useGraphContext(),o=c.useEditorStore();(0,p.useEffect)(()=>{if(n===null)return;const a=s=>{if(s.key!=="Tab"||s.defaultPrevented||!G(s.target,e,r)||o.getState().standingInteraction?.kind==="chrome-popup")return;const i=[...n.querySelectorAll(hr)];if(i.length===0)return;s.preventDefault();const d=i.findIndex(l=>l===document.activeElement);i[d===-1?s.shiftKey?i.length-1:0:(d+(s.shiftKey?-1:1)+i.length)%i.length]?.focus()};return document.addEventListener("keydown",a),()=>document.removeEventListener("keydown",a)},[e,n,r,o])},pr=e=>{const{selectionStore:n,chartId:r}=c.useGraphContext();(0,p.useEffect)(()=>{let o=null;const a=()=>{e.focus({preventScroll:!0})},s=d=>{const{selection:l,clearSelection:u}=n.getState();l.length!==0&&(G(d.target,e,r)||u())},i=d=>{n.getState().selection.length!==0&&G(d.target,e,r)&&d.relatedTarget===null&&(o!==null&&cancelAnimationFrame(o),o=requestAnimationFrame(()=>{o=null,document.hasFocus()&&(G(document.activeElement,e,r)||n.getState().clearSelection())}))};return e.addEventListener("pointerdown",a),document.addEventListener("focusin",s),document.addEventListener("focusout",i),()=>{o!==null&&cancelAnimationFrame(o),e.removeEventListener("pointerdown",a),document.removeEventListener("focusin",s),document.removeEventListener("focusout",i)}},[e,n,r])},vr=e=>{const{selectionStore:n,commands:r,chartId:o}=c.useGraphContext(),a=c.useEditorStore(),s=(0,p.useCallback)(d=>{const{selection:l}=n.getState(),u=Fe(l);u!==null&&(d.preventDefault(),r.dispatch(new x.RemoveAnnotationCommand({id:u})),e.focus({preventScroll:!0}))},[e,r,n]),i=(0,p.useCallback)(d=>{const l=a.getState();switch(l.standingInteraction?.kind){case"endpoint-drag":l.releaseInteraction("endpoint-drag");return;case"chrome-popup":return;case"menu":l.releaseInteraction("menu");return;default:if(Pe(d.target,o)){e.focus({preventScroll:!0});return}n.getState().clearSelection();return}},[a,n,e,o]);(0,p.useEffect)(()=>{const d=l=>{if(G(l.target,e,o)&&!xr(l.target)&&!At(l.target))switch(l.key){case"Escape":return i(l);case"Delete":case"Backspace":return s(l);default:return}};return document.addEventListener("keydown",d),()=>document.removeEventListener("keydown",d)},[e,s,i,o])},xr=e=>e instanceof HTMLElement&&(e.isContentEditable||e instanceof HTMLInputElement||e instanceof HTMLTextAreaElement),gr=`[${c.EDIT_TARGET_KIND_ATTRIBUTE}]`,Ge=(e,n,r)=>{if(typeof document.elementsFromPoint!="function")return null;const o=document.elementsFromPoint(e,n);return fr(o,r)},fr=(e,n)=>{for(const r of e){const o=r.closest(gr);if(o===null||!n.contains(o))continue;const a=Cr(o);if(a!==null)return a}return null},Cr=e=>{const n=e.getAttribute(c.EDIT_TARGET_KIND_ATTRIBUTE);if(n!=="annotation")return null;const r=e.getAttribute(c.EDIT_TARGET_ID_ATTRIBUTE);return r===null||r===""?null:{kind:n,id:r}},br=()=>{const e=c.useHoverState(a=>a.hover.primary),{layers:n,coordSystem:r}=c.useCompiledSelector((0,Q.useShallow)(a=>({layers:a.layers,coordSystem:a.coordSystem}))),{anchorResolver:o}=c.useGraphContext();return(0,p.useMemo)(()=>{if(e===null)return null;const a=n.find(d=>d.id===e.layerId);if(a===void 0)return null;const s=o.resolve(a.geom,e.observation,{coordSystem:r,position:a.position,purpose:"pin"});if(s===null)return null;const i=(0,x.buildObservationAnchor)(a,e.observation);return i===null?null:{position:s,color:(0,x.getColor)(e.observation),layer:a,at:i,observation:e.observation}},[e,n,r,o])},jr={kind:"idle"},Be=()=>{const e=c.useEditorState(o=>o.standingInteraction),n=c.useEditorState(o=>o.chromeUnderPointer),r=br();return(0,p.useMemo)(()=>e!==null?e:r===null?jr:{kind:"trigger",anchor:r,isEngaged:n==="menu-trigger"},[e,r,n])},Sr=(e,n)=>{const r=c.useEditorStore(),o=c.useLatestRef(n);(0,p.useEffect)(()=>{let a=null,s=null;const i=m=>{const{menuTrigger:g}=r.getState();return g===null?null:(0,x.isPointWithinEditMenuTrigger)(m,g)?"menu-trigger":null},d=()=>{a=null;const m=s;if(s=null,m===null)return;const g=o.current,v=r.getState();v.setChromeUnderPointer(i({x:m.x-g.x,y:m.y-g.y})),v.standingInteraction?.kind!=="menu"&&v.setEditTargetUnderPointer(Ge(m.x,m.y,e))},l=()=>{const m=r.getState();m.setChromeUnderPointer(null),m.setEditTargetUnderPointer(null)},u=m=>{s={x:m.clientX,y:m.clientY},a===null&&(a=requestAnimationFrame(d))},h=()=>{s=null,a!==null&&(cancelAnimationFrame(a),a=null),l()};return e.addEventListener("pointermove",u),e.addEventListener("pointerleave",h),()=>{a!==null&&cancelAnimationFrame(a),e.removeEventListener("pointermove",u),e.removeEventListener("pointerleave",h),l()}},[e,r,o])},me="editor",pe=[],yr=(e,n,r,o)=>{const a=Be(),{store:s}=c.useHoverContext(),i=c.useGraphSelection().length>0,d=c.useEditorState(h=>h.menuTrigger),l=a.kind==="menu",u=(0,p.useMemo)(()=>d===null?pe:[(0,x.buildEditMenuTriggerRegion)(d)],[d]);Sr(e,n),wr(a,e,n,r),pr(e),vr(e),mr(e,o),(0,p.useEffect)(()=>(s.getState().publishPointerRegions(me,u),()=>s.getState().publishPointerRegions(me,pe)),[s,u]),(0,p.useEffect)(()=>(s.getState().setPointerSuspended(l||i),()=>s.getState().setPointerSuspended(!1)),[s,l,i]),(0,p.useEffect)(()=>{if(!i)return;const h=s.getState();h.setHoverState(x.RESTING_HOVER_STATE),h.setTooltipAnchor(null)},[s,i])},wr=(e,n,r,o)=>{const a=c.useEditorStore(),{selectionStore:s}=c.useGraphContext(),{store:i,engine:d}=c.useHoverContext(),l=c.useLatestRef(e),u=c.useLatestRef(r),h=c.useLatestRef(o);(0,p.useEffect)(()=>{const m=b=>{const{menuTrigger:C}=a.getState();return C===null?!1:(0,x.isPointWithinEditMenuTrigger)(ve(b,u.current),C)},g=b=>{if(m(b)||s.getState().selection.length>0)return;const C=h.current,y=ve(b,u.current),T=Ir(y,C)?d.query((0,x.toPanelCursor)(y,C)):x.RESTING_HOVER_STATE;i.getState().setHoverState(T)};let v=!1;const f=()=>{v=l.current.kind==="menu"},I=b=>{const C=Ge(b.clientX,b.clientY,n),y=s.getState();if(C===null){y.clearSelection();return}y.setSelection([C])},S=b=>{if(_t(b.target))return;const{claimInteraction:C,releaseInteraction:y}=a.getState(),T=m(b);if(!T||v){y("menu"),T||I(b),v&&g(b);return}const B=l.current;B.kind==="trigger"&&C({kind:"menu",anchor:B.anchor})};return document.addEventListener("pointerdown",f,!0),document.addEventListener("click",S),()=>{document.removeEventListener("pointerdown",f,!0),document.removeEventListener("click",S)}},[a,s,n,l,i,d,u,h])},ve=(e,n)=>({x:e.clientX-n.x,y:e.clientY-n.y}),Ir=(e,n)=>e.x>=0&&e.x<=n.width&&e.y>=0&&e.y<=n.height,Pr=({frameElement:e,panelRect:n})=>{const{measureRef:r,screenRect:o}=c.useElementScreenRect(),a=c.useEditorStore();return(0,p.useEffect)(()=>(r(e),()=>r(null)),[r,e]),(0,p.useEffect)(()=>()=>a.getState().releaseInteraction("menu"),[a]),o===null?null:(0,t.jsx)(Mt,{children:(0,t.jsx)(Tr,{frameElement:e,frameRect:o,panelRect:n})})},Tr=({frameElement:e,frameRect:n,panelRect:r})=>{const o=(0,p.useMemo)(()=>({x:n.left+r.x,y:n.top+r.y}),[n.left,n.top,r.x,r.y]),[a,s]=(0,p.useState)(null);return yr(e,o,r,a),(0,t.jsx)(Ar,{frameElement:e,frameRect:n,panelOrigin:o,panelRect:r,boxRef:s})},Ar=({frameElement:e,frameRect:n,panelOrigin:r,panelRect:o,boxRef:a})=>{const s=ee(),i=Be();return(0,t.jsx)(c.OverlayPortal,{rect:n,zIndex:c.Z_INDEX.editorOverlay,container:s,"data-testid":"editor-overlay",boxRef:a,children:(0,t.jsxs)(c.PortalThemeProvider,{children:[(0,t.jsx)(er,{panelRect:o,panelOrigin:r,frameRect:n,frameElement:e}),(0,t.jsx)(dr,{interaction:i,panelRect:o}),(0,t.jsx)(xn,{interaction:i,panelOrigin:r})]})})},_r=({slots:e,...n})=>(0,t.jsx)(c.EditorProvider,{children:(0,t.jsx)(c.GraphRenderer,{slots:(0,p.useMemo)(()=>({EditorSurface:Pr,...e}),[e]),...n})}),Ve=(0,p.createContext)(null),Ue=({labelId:e,controlId:n,children:r})=>{const o=(0,p.useMemo)(()=>{let a=null;return{labelId:e,controlId:n,claimControlId:s=>(a??=s,a===s)}},[e,n]);return(0,t.jsx)(Ve.Provider,{value:o,children:r})},L=({id:e,ariaLabel:n,ariaLabelledBy:r},o=!0)=>{const a=(0,p.useContext)(Ve),s=(0,p.useId)(),[i]=(0,p.useState)(()=>o?a?.claimControlId(s)??!1:!1),d=e??(i?a?.controlId:void 0),l=r??(n===void 0?a?.labelId:void 0);return{...d!==void 0&&{id:d},...n!==void 0&&{"aria-label":n},...l!==void 0&&{"aria-labelledby":l}}};var Er={default:"woi4bh4 woi4bh3",tile:"woi4bh5 woi4bh3"},Ze=({label:e,icon:n,onClick:r,variant:o="default",isDisabled:a,ariaLabel:s,ariaLabelledBy:i,id:d})=>{const l=L({id:d,ariaLabel:s,ariaLabelledBy:i}),u=o==="tile";return(0,t.jsxs)("button",{type:"button",className:Er[o],disabled:a,onClick:r,...l,children:[n!==void 0&&(0,t.jsx)("span",{className:"woi4bh0",children:n}),e!==void 0&&(0,t.jsx)("span",{className:u?"woi4bh2":"woi4bh1",children:e})]})},ne=(0,p.createContext)(null),_=()=>{const e=(0,p.useContext)(ne);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},We=({children:e,onKeyDown:n,...r})=>{const o=(0,p.useContext)(ne),a=s=>{if(n?.(s),!o||s.defaultPrevented)return;const i=c.resolveHistoryStep(s.nativeEvent);i&&(s.preventDefault(),i==="undo"?o.undo():o.redo())};return(0,t.jsx)("div",{onKeyDown:a,...r,children:e})},$e="keyboard",Z=e=>{const n=(0,p.useRef)(!1),r=(0,p.useRef)(!1),o=()=>{n.current=!1,r.current&&(r.current=!1,e?.())};return{commitAfterChange:()=>{if(n.current){r.current=!0;return}e?.()},commitUnlessHeldKey:a=>{if(a){r.current=!0;return}e?.()},gestureHandlers:{onKeyDown:()=>{n.current=!0},onKeyUp:o,onBlur:a=>{a.relatedTarget instanceof Node&&a.currentTarget.contains(a.relatedTarget)||o()}}}},Mr="eh8dvc0",Nr="eh8dvc1 uz3g760",Or="eh8dvc2 uz3g761";var Xe=({value:e,onChange:n,onCommit:r,min:o,max:a,step:s,prefix:i,suffix:d,isDisabled:l,hasError:u,ariaLabel:h,ariaLabelledBy:m,id:g})=>{const v=L({id:g,ariaLabel:h,ariaLabelledBy:m}),{commitUnlessHeldKey:f,gestureHandlers:I}=Z(r);return(0,t.jsx)(le.NumberField.Root,{className:Mr,value:e,onValueChange:S=>n(S),onValueCommitted:(S,b)=>{f(b.reason===$e)},min:o,max:a,step:s,disabled:l,children:(0,t.jsxs)(We,{className:Nr,"data-error":u===!0,"data-disabled":l===!0?"":void 0,children:[i!==void 0&&(0,t.jsx)("span",{className:"eh8dvc3",children:i}),(0,t.jsx)(le.NumberField.Input,{className:Or,...I,"aria-invalid":u===!0?!0:void 0,...v}),d!==void 0&&(0,t.jsx)("span",{className:"eh8dvc3",children:d})]})})},Lr="_1b7s5f0",z={1:"_1b7s5f1",2:"_1b7s5f2",3:"_1b7s5f3",4:"_1b7s5f4",5:"_1b7s5f5",6:"_1b7s5f6"},kr="_1b7s5f7";var Rr=6,Ye=({options:e,value:n,onChange:r,onCommit:o,columns:a,itemLayout:s="tile",isDisabled:i,ariaLabel:d,ariaLabelledBy:l,id:u})=>{const h=L({id:u,ariaLabel:d,ariaLabelledBy:l}),m=s==="swatch",{commitAfterChange:g,gestureHandlers:v}=Z(o);return(0,t.jsx)(we.RadioGroup,{className:(0,O.default)(Lr,Fr(a??e.length)),value:n,onValueChange:f=>{r(f),g()},...v,disabled:i,...h,children:e.map(f=>(0,t.jsxs)(ye.Radio.Root,{value:f.value,disabled:f.isDisabled,className:(0,O.default)(kr,m&&"_1b7s5f8"),"aria-label":m?f.label:void 0,children:[f.icon,!m&&(0,t.jsx)("span",{className:"_1b7s5f9",children:f.label})]},f.value))})},Fr=e=>{switch(Math.min(Math.max(Math.round(e),1),Rr)){case 1:return z[1];case 2:return z[2];case 3:return z[3];case 4:return z[4];case 5:return z[5];default:return z[6]}},Dr="_1g5x15w0 uz3g760",zr="_1g5x15w1",Hr="_1g5x15w2",xe="_1g5x15w3",qr="_1g5x15w4",Kr="_1g5x15w5",Gr="_1g5x15w6",Br="_1g5x15w7";var Je=({options:e,value:n,onChange:r,placeholder:o,isDisabled:a,hasError:s,ariaLabel:i,ariaLabelledBy:d,id:l})=>{const u=L({id:l,ariaLabel:i,ariaLabelledBy:d});return(0,t.jsxs)(E.Select.Root,{value:n,onValueChange:h=>h!==null&&r(h),disabled:a,items:e.map(h=>({value:h.value,label:h.label})),children:[(0,t.jsxs)(E.Select.Trigger,{className:Dr,"data-error":s===!0,...u,children:[(0,t.jsx)(E.Select.Value,{className:zr,children:h=>Vr(e,h,o)}),(0,t.jsx)(E.Select.Icon,{className:xe,children:(0,t.jsx)(c.ChevronDownIcon,{size:"sm"})})]}),(0,t.jsx)(E.Select.Portal,{container:c.resolvePortalContainer(),children:(0,t.jsx)(c.PortalThemeProvider,{children:(0,t.jsx)(E.Select.Positioner,{className:qr,sideOffset:4,alignItemWithTrigger:!1,children:(0,t.jsx)(E.Select.Popup,{className:Kr,children:e.map(h=>(0,t.jsxs)(E.Select.Item,{value:h.value,disabled:h.isDisabled,className:Gr,children:[h.icon,(0,t.jsxs)("span",{className:Br,children:[(0,t.jsx)(E.Select.ItemText,{children:h.label}),h.description!==void 0&&(0,t.jsx)("span",{className:"_1g5x15w8",children:h.description})]}),(0,t.jsx)(E.Select.ItemIndicator,{className:xe,children:(0,t.jsx)(c.CheckIcon,{size:"sm"})})]},h.value))})})})})]})},Vr=(e,n,r)=>n===null?(0,t.jsx)("span",{className:Hr,children:r}):Ur(e,n),Ur=(e,n)=>e.find(r=>r.value===n)?.label??n,Zr="vod76w0",Wr="vod76w1",$r="vod76w2",Xr="vod76w3",Yr="vod76w4",Jr="vod76w5";var Qe=({value:e,onChange:n,onCommit:r,min:o,max:a,step:s,suffix:i,formatValue:d,isDisabled:l,ariaLabel:u,ariaLabelledBy:h})=>{const m=L({ariaLabel:u,ariaLabelledBy:h},!1),g=Qr(e,i,d),{commitUnlessHeldKey:v,gestureHandlers:f}=Z(r);return(0,t.jsxs)("div",{className:Zr,children:[(0,t.jsx)(H.Slider.Root,{className:Wr,value:e,onValueChange:I=>n(I),onValueCommitted:(I,S)=>{v(S.reason===$e)},min:o,max:a,step:s,disabled:l,children:(0,t.jsx)(H.Slider.Control,{className:$r,children:(0,t.jsxs)(H.Slider.Track,{className:Xr,children:[(0,t.jsx)(H.Slider.Indicator,{className:Yr}),(0,t.jsx)(H.Slider.Thumb,{className:Jr,...f,...m})]})})}),g!==null&&(0,t.jsx)("span",{className:"vod76w6",children:g})]})},Qr=(e,n,r)=>r!==void 0?r(e):n!==void 0?`${e}${n}`:null,ea="_1hyrlw60",ta="_1hyrlw61",et=({isChecked:e,onChange:n,isDisabled:r,ariaLabel:o,ariaLabelledBy:a,id:s})=>{const i=L({id:s,ariaLabel:o,ariaLabelledBy:a});return(0,t.jsx)(ce.Switch.Root,{checked:e,onCheckedChange:d=>n(d),disabled:r,className:ea,...i,children:(0,t.jsx)(ce.Switch.Thumb,{className:ta})})},na="uz3g761",ra="tpcnun0 uz3g760",tt=({value:e,onChange:n,onCommit:r,placeholder:o,isDisabled:a,hasError:s,ariaLabel:i,ariaLabelledBy:d,id:l})=>{const u=L({id:l,ariaLabel:i,ariaLabelledBy:d});return(0,t.jsx)(We,{className:ra,"data-error":s===!0,children:(0,t.jsx)(It.Input,{className:na,value:e,onValueChange:h=>n(h),onBlur:r,placeholder:o,disabled:a,"aria-invalid":s===!0?!0:void 0,...u})})},aa="cnu9yl0",oa="cnu9yl1";var nt=({options:e,value:n,onChange:r,onCommit:o,itemLayout:a="inline",isDisabled:s,ariaLabel:i,ariaLabelledBy:d,id:l})=>{const u=L({id:l,ariaLabel:i,ariaLabelledBy:d}),h=a==="stacked",{commitAfterChange:m,gestureHandlers:g}=Z(o);return(0,t.jsx)(we.RadioGroup,{className:aa,value:n,onValueChange:v=>{r(v),m()},...g,disabled:s,...u,children:e.map(v=>(0,t.jsxs)(ye.Radio.Root,{value:v.value,disabled:v.isDisabled,className:(0,O.default)(oa,h&&"cnu9yl2"),"aria-label":sa(v,h),children:[v.icon,rt(v,h)&&(0,t.jsx)("span",{className:"cnu9yl3",children:v.label})]},v.value))})},rt=(e,n)=>e.icon===void 0||n,sa=(e,n)=>{if(!rt(e,n))return e.label},at={ToggleGroup:nt,Switch:et,Slider:Qe,RadioGrid:Ye,Button:Ze,TextField:tt,NumberField:Xe,Select:Je},ot=(0,p.createContext)(at),ia=({controls:e,children:n})=>{const r=(0,p.useMemo)(()=>({...at,...e}),[e]);return(0,t.jsx)(ot.Provider,{value:r,children:n})},A=()=>(0,p.useContext)(ot),la="_12lhx9e0",ca=({children:e})=>(0,t.jsx)("div",{className:la,children:e}),da="_139ohwv0",k=({children:e})=>(0,t.jsx)("div",{className:da,children:e}),st=(0,p.createContext)(null),ua=st.Provider,it=()=>{const e=(0,p.useContext)(st);if(!e)throw new Error("A section must be rendered inside <EditorPanel.Root>.");return e},ha="_1jlczkt0",lt="data-graphy-editor-panel",ma={List:k,Grid:ca},pa=({handle:e,children:n,controls:r,defaultExpandedSection:o=void 0,className:a})=>{const s=c.useGraphHandle(e),[i,d]=(0,p.useState)(()=>o?[o]:[]),l=(0,p.useMemo)(()=>({expandSection:u=>d([u]),collapseAllSections:()=>d([])}),[]);return(0,t.jsx)(ne.Provider,{value:s,children:(0,t.jsx)(ia,{controls:r,children:(0,t.jsx)(ua,{value:l,children:(0,t.jsx)(K.Accordion.Root,{[lt]:"",className:(0,O.default)(ha,a),value:i,onValueChange:u=>d(u),children:n})})})})},re={Root:pa,Controls:ma},ge={stack:"pr583x0",grid:"pr583x1"},fe="pr583x2",va="pr583x3",w=({label:e,layout:n="grid",children:r})=>{const o=(0,p.useId)(),a=(0,p.useId)();return e===void 0?(0,t.jsx)("div",{className:ge[n],children:(0,t.jsx)("div",{className:fe,children:r})}):(0,t.jsxs)("div",{className:ge[n],children:[(0,t.jsx)("label",{id:o,htmlFor:a,className:va,children:e}),(0,t.jsx)("div",{className:fe,children:(0,t.jsx)(Ue,{labelId:o,controlId:a,children:r})})]})},xa=e=>(0,t.jsx)(c.Icon,{...e,children:(0,t.jsx)("g",{stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",children:(0,t.jsx)("path",{d:"m9 6 6 6-6 6"})})}),ae="_40zvwv0",oe="_40zvwv1",ga="_40zvwv2",ct="_40zvwv3",fa="_40zvwv4 _40zvwv3";var Ca="_40zvwv6";var ba="_40zvwv8",M=({title:e,layout:n="fixed",preview:r,accessory:o,onOpenChange:a,children:s})=>n==="collapsible"?(0,t.jsx)(Sa,{title:e,preview:r,accessory:o,onOpenChange:a,children:s}):n==="inline"&&r===void 0?(0,t.jsx)(ja,{title:e,accessory:o,children:s}):(0,t.jsxs)("div",{className:ae,children:[(0,t.jsxs)("div",{className:oe,children:[(0,t.jsx)("span",{className:ct,children:e}),r!==void 0&&(0,t.jsx)("span",{className:"_40zvwv5",children:r}),o!==void 0&&(0,t.jsx)("span",{className:"_40zvwv7",children:o})]}),(0,t.jsx)("div",{children:s})]}),ja=({title:e,accessory:n,children:r})=>{const o=(0,p.useId)(),a=(0,p.useId)();return(0,t.jsx)("div",{className:ae,children:(0,t.jsxs)("div",{className:oe,children:[(0,t.jsx)("label",{id:o,htmlFor:a,className:fa,children:e}),(0,t.jsx)("span",{className:Ca,children:(0,t.jsx)(Ue,{labelId:o,controlId:a,children:r})}),n!==void 0&&(0,t.jsx)("span",{className:"_40zvwv7",children:n})]})})},Sa=({title:e,preview:n,accessory:r,onOpenChange:o,children:a})=>{const s=c.useI18n();return(0,t.jsxs)(K.Accordion.Item,{value:e,className:ae,onOpenChange:o,children:[(0,t.jsxs)(K.Accordion.Header,{className:oe,render:(0,t.jsx)("div",{}),children:[(0,t.jsx)(K.Accordion.Trigger,{className:ga,"aria-label":s("editor.accessibility.toggleSection",{title:e})}),(0,t.jsx)("span",{className:ct,children:e}),n!==void 0&&(0,t.jsx)("span",{className:"_40zvwv5",children:n}),r!==void 0&&(0,t.jsx)("span",{className:"_40zvwv7",children:r}),(0,t.jsx)("span",{className:ba,children:(0,t.jsx)(xa,{size:"sm"})})]}),(0,t.jsx)(K.Accordion.Panel,{children:(0,t.jsx)("div",{children:a})})]})},ya=({title:e,isChecked:n,onToggle:r,isDisabled:o,preview:a,children:s})=>{const{expandSection:i,collapseAllSections:d}=it(),{Switch:l}=A(),u=m=>{r(m),m?i(e):d()},h=m=>{m&&!n&&o!==!0&&r(!0)};return(0,t.jsx)(M,{title:e,layout:"collapsible",preview:a,onOpenChange:h,accessory:(0,t.jsx)(l,{isChecked:n,onChange:u,isDisabled:o,ariaLabel:e}),children:s})},Ce={x:["bottom","top"],y:["left","right"]},wa={left:"editor.axesPanel.position.left",right:"editor.axesPanel.position.right",top:"editor.axesPanel.position.top",bottom:"editor.axesPanel.position.bottom"},Ia={x:"editor.axesPanel.mainAxisSection.xAxis",y:"editor.axesPanel.mainAxisSection.yAxis"},X=({axis:e,title:n,layout:r="collapsible",preview:o})=>{const a=_(),s=c.useHandleCompiled(a),i=c.useI18n(),{NumberField:d,Switch:l,ToggleGroup:u}=A();if(!s)return null;const h=s.config.axes[e],m=s.scales[e],g=m?.spec,v=g?.scaleType==="continuous"?g:void 0,f=g!==void 0&&"reverse"in g?g:void 0,I=g?.scaleType==="continuous"||g?.scaleType==="datetime",S=v!==void 0&&s.layers.some(j=>j.geom==="bar"),b=v?.transform==="log",C=v?.domainMax??null,y=Pa(v),T=(j,D)=>j.map(V=>({value:V,label:D(V)})),B=Ce[e].map(j=>({value:j,label:i(wa[j])})),vt=T(["auto","edges"],j=>i(j==="edges"?"editor.axesPanel.labelMode.edges":"editor.axesPanel.labelMode.auto")),xt=T(["linear","log"],j=>i(j==="log"?"editor.axesPanel.scale.log":"editor.axesPanel.scale.auto")),gt=T(["auto","zero","custom"],j=>i(j==="zero"?"editor.axesPanel.startFrom.zero":j==="custom"?"editor.axesPanel.startFrom.custom":"editor.axesPanel.startFrom.auto")),ft=T(["auto","custom"],j=>i(j==="custom"?"editor.axesPanel.endAt.custom":"editor.axesPanel.endAt.auto")),Ct=T(["no","yes"],j=>i(j==="yes"?"editor.axesPanel.yesNo.yes":"editor.axesPanel.yesNo.no")),ie=j=>{a.commands.dispatch(new x.SetScaleDomainCommand({scaledAesthetic:e,...j}),{transient:!0})},bt=j=>{if(v){if(j==="custom"){v.zero&&a.commands.dispatch(new x.SetScaleZeroCommand({scaledAesthetic:e,zero:!1})),a.commands.dispatch(new x.SetScaleDomainCommand({scaledAesthetic:e,domainMin:be(m?.domain,"start")}));return}v.domainMin!==null&&a.commands.dispatch(new x.SetScaleDomainCommand({scaledAesthetic:e,domainMin:null})),a.commands.dispatch(new x.SetScaleZeroCommand({scaledAesthetic:e,zero:j==="zero"}))}},jt=j=>{const D=j==="custom"?be(m?.domain,"end"):null;a.commands.dispatch(new x.SetScaleDomainCommand({scaledAesthetic:e,domainMax:D}))},St=j=>{const D=Ce[e].find(V=>V===j);D&&a.commands.dispatch(new x.SetAxisPositionCommand({axis:e,position:D}))};return(0,t.jsx)(M,{title:n??i(Ia[e]),layout:r,preview:o,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:i("editor.axesPanel.controls.visible"),children:(0,t.jsx)(l,{isChecked:h.isVisible,onChange:j=>a.commands.dispatch(new x.SetAxisVisibilityCommand({axis:e,isVisible:j}))})}),I&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.labels"),children:(0,t.jsx)(u,{value:h.ticks.mode,options:vt,onChange:j=>a.commands.dispatch(new x.SetAxisTickModeCommand({axis:e,tickMode:j==="edges"?"edges":"auto"}))})}),v&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.position"),children:(0,t.jsx)(u,{value:h.position,options:B,onChange:St})}),f!==void 0&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.reverse"),children:(0,t.jsx)(u,{value:f.reverse===!0?"yes":"no",options:Ct,onChange:j=>a.commands.dispatch(new x.SetScaleReverseCommand({scaledAesthetic:e,reverse:j==="yes"}))})}),v&&!S&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.scale"),children:(0,t.jsx)(u,{value:b?"log":"linear",options:xt,onChange:j=>a.commands.dispatch(new x.SetScaleTransformCommand({scaledAesthetic:e,transform:j==="log"?"log":"linear"}))})}),v&&!b&&(0,t.jsxs)(t.Fragment,{children:[!S&&(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(w,{label:i("editor.axesPanel.controls.startFrom"),children:(0,t.jsx)(u,{value:y,options:gt,onChange:bt})}),y==="custom"&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.value"),children:(0,t.jsx)(d,{value:v.domainMin??null,onChange:j=>j!==null&&ie({domainMin:j}),onCommit:a.commands.seal})})]}),(0,t.jsx)(w,{label:i("editor.axesPanel.controls.endAt"),children:(0,t.jsx)(u,{value:C===null?"auto":"custom",options:ft,onChange:jt})}),C!==null&&(0,t.jsx)(w,{label:i("editor.axesPanel.controls.value"),children:(0,t.jsx)(d,{value:C,onChange:j=>j!==null&&ie({domainMax:j}),onCommit:a.commands.seal})})]})]})})},Pa=e=>e===void 0?"auto":e.domainMin!==null&&e.domainMin!==void 0?"custom":e.zero===!0?"zero":"auto",be=(e,n)=>{const r=n==="start"?e?.[0]:e?.[e.length-1];return typeof r=="number"?r:0},se=({value:e,onChange:n})=>{const r=_(),o=c.useI18n(),{TextField:a}=A(),s=e!==null&&typeof e!="string",i=d=>n(d===""?null:d);return(0,t.jsx)(w,{label:o("editor.elementsPanel.contentValue"),children:(0,t.jsx)(a,{value:typeof e=="string"?e:"",onChange:i,onCommit:r.commands.seal,isDisabled:s})})},dt=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{Switch:i}=A();if(!a)return null;const d=a.config.content;return(0,t.jsx)(M,{title:e??s("editor.elementsPanel.footerSection.caption"),layout:n,preview:r,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:s("editor.elementsPanel.contentVisible"),children:(0,t.jsx)(i,{isChecked:d.isCaptionVisible,onChange:l=>o.commands.dispatch(new x.ToggleContentVisibilityCommand({slot:"caption",isVisible:l}))})}),(0,t.jsx)(se,{value:d.caption,onChange:l=>o.commands.dispatch(new x.SetContentCaptionCommand({caption:l}),{transient:!0})})]})})},je=/^[a-z][a-z\d+.-]*:/i,Ta={},ut=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{Switch:i}=A();if(!a)return null;const d=a.config.content;return(0,t.jsx)(M,{title:e??s("editor.elementsPanel.sourceSection.title"),layout:n,preview:r,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:s("editor.elementsPanel.contentVisible"),children:(0,t.jsx)(i,{isChecked:d.isSourceVisible,onChange:l=>o.commands.dispatch(new x.ToggleContentVisibilityCommand({slot:"source",isVisible:l}))})}),(0,t.jsx)(Aa,{source:d.source??Ta})]})})},Aa=({source:e})=>{const n=_(),r=c.useI18n(),{TextField:o}=A(),a=i=>{const d=(i.label??"")!==""||(i.url??"")!=="";n.commands.dispatch(new x.SetContentSourceCommand({source:d?i:null}),{transient:!0})},s=()=>{const i=e.url??"";i!==""&&!je.test(i)&&a({...e,url:`https://${i}`}),n.commands.seal()};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(w,{label:r("editor.elementsPanel.sourceSection.url"),children:(0,t.jsx)(o,{value:e.url??"",onChange:i=>a({...e,url:i}),onCommit:s,hasError:je.test(e.url??"")&&!(0,x.isSafeUrl)(e.url)})}),(0,t.jsx)(w,{label:r("editor.elementsPanel.sourceSection.name"),children:(0,t.jsx)(o,{value:e.label??"",onChange:i=>a({...e,label:i}),onCommit:n.commands.seal})})]})},ht=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{Switch:i}=A();if(!a)return null;const d=a.config.content;return(0,t.jsx)(M,{title:e??s("editor.elementsPanel.headerSection.subtitle"),layout:n,preview:r,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:s("editor.elementsPanel.contentVisible"),children:(0,t.jsx)(i,{isChecked:d.isSubtitleVisible,onChange:l=>o.commands.dispatch(new x.ToggleContentVisibilityCommand({slot:"subtitle",isVisible:l}))})}),(0,t.jsx)(se,{value:d.subtitle,onChange:l=>o.commands.dispatch(new x.SetContentSubtitleCommand({subtitle:l}),{transient:!0})})]})})},Y=[.8,1,1.2,1.4,1.6,1.8,2,2.5,3,4],_a=Y.length/2,mt=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{RadioGrid:i}=A();if(!a)return null;const{textScale:d}=a.config.appearance,l=m=>s("editor.elementsPanel.textSizeSection.scaleFormat",{value:`${m}`}),u=Y.map(m=>({value:`${m}`,label:l(m)})),h=m=>{const g=Y.find(v=>`${v}`===m);g!==void 0&&o.commands.dispatch(new x.SetAppearanceTextScaleCommand({textScale:g}))};return(0,t.jsx)(M,{title:e??s("editor.elementsPanel.textSizeSection.title"),layout:n,preview:r??l(d),children:(0,t.jsx)(i,{value:`${d}`,options:u,columns:_a,onChange:h,ariaLabel:s("editor.elementsPanel.textSizeSection.title")})})},pt=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{Switch:i}=A();if(!a)return null;const d=a.config.content;return(0,t.jsx)(M,{title:e??s("editor.elementsPanel.headerSection.toggleTitle"),layout:n,preview:r,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:s("editor.elementsPanel.contentVisible"),children:(0,t.jsx)(i,{isChecked:d.isTitleVisible,onChange:l=>o.commands.dispatch(new x.ToggleContentVisibilityCommand({slot:"title",isVisible:l}))})}),(0,t.jsx)(se,{value:d.title,onChange:l=>o.commands.dispatch(new x.SetContentTitleCommand({title:l}),{transient:!0})})]})})},Ea=({children:e,...n})=>(0,t.jsx)(re.Root,{...n,children:e??(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(pt,{}),(0,t.jsx)(ht,{}),(0,t.jsx)(dt,{}),(0,t.jsx)(ut,{}),(0,t.jsx)(mt,{})]})}),Ma=({children:e,...n})=>(0,t.jsx)(re.Root,{...n,children:e??(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(X,{axis:"x"}),(0,t.jsx)(X,{axis:"y"})]})}),$=["top","bottom","left","right","none"],Na=({positions:e,title:n,layout:r="collapsible",preview:o})=>{const a=_(),s=c.useHandleCompiled(a),i=c.useI18n(),{ToggleGroup:d}=A();if(!s)return null;const l=s.config.legend.position,u=e??$,h=s.guides.legends[0]?.position??"none",m=l==="auto"?h:l,g=$.filter(S=>S===m||u.includes(S)).map(S=>({value:S,label:i(`editor.graphPanel.legendSection.${S}`)})),v=S=>{const b=$.find(C=>C===S);b&&a.commands.dispatch(new x.SetLegendPositionCommand({position:b}))},f=n??i("editor.graphPanel.legendSection.title"),I=g.find(S=>S.value===m)?.label;return(0,t.jsx)(M,{title:f,layout:r,preview:o??I,children:(0,t.jsx)(k,{children:(0,t.jsx)(w,{label:i("editor.axesPanel.controls.position"),layout:"stack",children:(0,t.jsx)(d,{value:m,options:g,onChange:v})})})})},Oa="k",La=2,ka=5,J=[{value:"k",labelKey:"thousands"},{value:"m",labelKey:"millions"},{value:"b",labelKey:"billions"}],Ra=["auto","none"],Fa=({title:e,layout:n="collapsible",preview:r})=>{const o=_(),a=c.useHandleCompiled(o),s=c.useI18n(),{NumberField:i,ToggleGroup:d}=A();if(!a)return null;const{abbreviation:l,decimals:u}=a.config.numberFormat,h=Da(l)!==void 0,m=u!=="auto",g=C=>C.map(y=>({value:y,label:s(`editor.graphPanel.numberFormat.options.${y}`)})),v=J.map(({value:C,labelKey:y})=>({value:C,label:s(`common.abbreviations.${y}`)})),f=C=>{o.commands.dispatch(new x.SetNumberFormatAbbreviationCommand({abbreviation:C}))},I=C=>{const y=Ra.find(T=>T===C);f(y??Oa)},S=C=>{const y=J.find(T=>T.value===C);y&&f(y.value)},b=C=>{o.commands.dispatch(new x.SetNumberFormatDecimalsCommand({decimals:C==="custom"?La:"auto"}))};return(0,t.jsx)(M,{title:e??s("editor.graphPanel.numberFormatSection.title"),layout:n,preview:r,children:(0,t.jsxs)(k,{children:[(0,t.jsx)(w,{label:s("editor.graphPanel.numberFormat.abbreviationLabel"),children:(0,t.jsx)(d,{value:h?"custom":l,options:g(["auto","none","custom"]),onChange:I})}),h&&(0,t.jsx)(w,{label:s("editor.graphPanel.numberFormat.valueLabel"),children:(0,t.jsx)(d,{value:l,options:v,onChange:S})}),(0,t.jsx)(w,{label:s("editor.graphPanel.numberFormat.decimalPlacesLabel"),children:(0,t.jsx)(d,{value:m?"custom":"auto",options:g(["auto","custom"]),onChange:b})}),m&&(0,t.jsx)(w,{label:s("editor.graphPanel.numberFormat.valueLabel"),children:(0,t.jsx)(i,{value:u,min:0,max:ka,onChange:C=>{C!==null&&o.commands.dispatch(new x.SetNumberFormatDecimalsCommand({decimals:C}),{transient:!0})},onCommit:o.commands.seal})})]})})},Da=e=>J.find(n=>n.value===e);exports.AxesPanel=Ma;exports.AxisSection=X;exports.Button=Ze;exports.CaptionSection=dt;exports.EditableGraphRenderer=_r;exports.EditorPanel=re;exports.ElementsPanel=Ea;exports.IntlProvider=c.IntlProvider;exports.LegendSection=Na;exports.NumberField=Xe;exports.NumberFormatSection=Fa;exports.PANEL_ROOT_ATTRIBUTE=lt;exports.RadioGrid=Ye;exports.Row=w;exports.Section=M;exports.Select=Je;exports.Slider=Qe;exports.SourceSection=ut;exports.SubtitleSection=ht;exports.Switch=et;exports.TextField=tt;exports.TextSizeSection=mt;exports.TitleSection=pt;exports.ToggleGroup=nt;exports.ToggledSection=ya;exports.useControls=A;exports.usePanelExpansion=it;exports.usePanelGraph=_;

package/dist/editable.css

@@ -0,0 +1 @@
+.cml7ha0{display:contents}.efjmb40{z-index:var(--graphy-z-index-editor-popover)}.efjmb41{min-inline-size:180px;padding:var(--graphy-space-xs);background:var(--graphy-overlay-background);border:1px solid var(--graphy-border-10);border-radius:var(--graphy-radii-md);box-shadow:var(--graphy-elevation-md);color:var(--graphy-text-primary);transform-origin:var(--transform-origin);outline:none;flex-direction:column;transition:transform .15s ease-out,opacity .15s ease-out;display:flex}.efjmb41[data-starting-style]{opacity:0;transform:scale(.92)}.efjmb42{align-items:center;gap:var(--graphy-space-sm);padding:var(--graphy-space-sm) var(--graphy-space-md);border-radius:var(--graphy-radii-sm);cursor:pointer;color:var(--graphy-text-primary);font:var(--graphy-font-menu-item-label);-webkit-user-select:none;user-select:none;outline:none;display:flex}.efjmb42[data-highlighted],.efjmb42[data-popup-open]{background:var(--graphy-toolbar-button-background-color-hovered)}.efjmb42[data-disabled]{opacity:.4;cursor:default}.efjmb43{white-space:nowrap;flex:1}.efjmb44{block-size:1px;margin-block:var(--graphy-space-xs);background:var(--graphy-border-10)}.efjmb44:first-child,.efjmb44:last-child{display:none}.efjmb45{opacity:.6;flex-shrink:0;transform:rotate(-90deg)}@media (prefers-reduced-motion:reduce){.efjmb41{transition:none}}._1qe7q450{gap:var(--graphy-space-sm);padding:var(--graphy-space-xs);flex-direction:column;min-inline-size:200px;display:flex}._1qe7q451{padding:var(--graphy-space-sm) var(--graphy-space-md);border:1px solid var(--graphy-border-10);border-radius:var(--graphy-radii-sm);background:var(--graphy-overlay-background);color:var(--graphy-text-primary);font:var(--graphy-font-menu-item-label);outline:none}._1qe7q452{padding:var(--graphy-space-sm) var(--graphy-space-md);-webkit-appearance:none;appearance:none;border-radius:var(--graphy-radii-sm);background:var(--graphy-grey-70);color:var(--graphy-grey-0);font:var(--graphy-font-menu-item-label);cursor:pointer;border:none;align-self:flex-start}._1qe7q452:disabled{opacity:.4;cursor:default}._1aafi1g0{flex-shrink:0;display:inline-flex;position:relative}._1aafi1g1{background:var(--graphy-alert);border-radius:1px;block-size:2px;inline-size:80%;position:absolute;top:50%;transform:translate(-50%,-50%)rotate(45deg)}._1aafi1g1:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:50%}._1aafi1g1:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:50%}._1aafi1g1:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:50%}._1aafi1g1:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:50%}.ceeojg0{gap:var(--graphy-space-xs);padding:var(--graphy-space-xs);grid-template-columns:repeat(5,1fr);display:grid}.ceeojg1{block-size:36px;inline-size:36px;padding:var(--graphy-space-xs);-webkit-appearance:none;appearance:none;border-radius:var(--graphy-radii-sm);cursor:pointer;background:0 0;border:none;outline:none;justify-content:center;align-items:center;display:flex}.ceeojg1:hover,.ceeojg1[data-highlighted]{background:var(--graphy-toolbar-button-background-color-hovered)}.ceeojg2{object-fit:contain;block-size:100%;inline-size:100%}.q7gcrz2{pointer-events:none;position:absolute}.q7gcrz3{box-sizing:border-box;pointer-events:auto;block-size:36px;max-inline-size:100%;transform:translateX(clamp(0px, calc(var(--q7gcrz0) - 50%), calc(var(--q7gcrz1) - 100%)));position:absolute;top:0}.q7gcrz3:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.q7gcrz3:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.q7gcrz3:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.q7gcrz3:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.q7gcrz4{color:var(--graphy-text-secondary);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}.q7gcrz5{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;overflow:hidden}.q7gcrz6{border:1px solid var(--graphy-border-100);box-sizing:border-box;border-radius:50%;block-size:16px;inline-size:16px}.q7gcrz7{z-index:var(--graphy-z-index-editor-popover)}.q7gcrz8{min-inline-size:200px;padding:var(--graphy-space-xs);background:var(--graphy-overlay-background);border:1px solid var(--graphy-border-10);border-radius:var(--graphy-radii-md);box-shadow:var(--graphy-elevation-md);color:var(--graphy-text-primary);outline:none;flex-direction:column;display:flex}.q7gcrz9{align-items:center;gap:var(--graphy-space-sm);padding:var(--graphy-space-sm) var(--graphy-space-md);border-radius:var(--graphy-radii-sm);cursor:pointer;color:var(--graphy-text-primary);font:var(--graphy-font-menu-item-label);-webkit-user-select:none;user-select:none;outline:none;display:flex}.q7gcrz9[data-highlighted]{background:var(--graphy-toolbar-button-background-color-hovered)}.q7gcrz9[data-selected=true]{background:var(--graphy-toolbar-button-background-color-selected)}.q7gcrz9[data-disabled]{cursor:default;opacity:.5}.q7gcrza{color:var(--graphy-text-secondary);font-variant-numeric:tabular-nums;margin-inline-start:auto}.q7gcrzb{color:var(--graphy-alert)}.q7gcrzc{justify-content:center;align-items:center;gap:var(--graphy-space-xs);block-size:28px;padding:0 var(--graphy-space-sm);background:var(--graphy-toolbar-button-background-color);border-radius:var(--graphy-radii-md);cursor:pointer;color:var(--graphy-text-primary);font:var(--graphy-font-button);white-space:nowrap;border:none;display:inline-flex}.q7gcrzc:hover:not(:disabled){background:var(--graphy-toolbar-button-background-color-hovered)}.q7gcrzc[data-popup-open]{background:var(--graphy-toolbar-button-background-color-selected)}.q7gcrzc:disabled{cursor:default;opacity:.5}.q7gcrzd{inline-size:28px;padding:0}.q7gcrze{min-inline-size:0}.uz3g760{align-items:center;gap:var(--graphy-space-xs);inline-size:100%;block-size:var(--graphy-editor-control-height);min-inline-size:0;padding:0 var(--graphy-space-sm);background:var(--graphy-raised-background);border:1px solid var(--graphy-border-10);border-radius:var(--graphy-radii-md);color:var(--graphy-text-primary);font:var(--graphy-font-editor-control-value);text-align:start;transition:border-color .1s cubic-bezier(.55,.085,.68,.53),background .1s cubic-bezier(.55,.085,.68,.53);display:inline-flex}.uz3g760:hover:not(:disabled){border-color:var(--graphy-border-50)}.uz3g760:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand)}.uz3g760:has(:focus-visible){box-shadow:inset 0 0 0 2px var(--graphy-brand)}.uz3g760[data-popup-open]{border-color:var(--graphy-border-50)}.uz3g760[data-error=true]:not(:disabled){border-color:var(--graphy-alert)}.uz3g760:disabled{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.uz3g760:has(:disabled){color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.uz3g760[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.uz3g761{min-inline-size:0;color:inherit;font:inherit;background:0 0;border:none;outline:none;flex:1;padding:0}.uz3g761::placeholder{color:var(--graphy-text-disabled)}.uz3g761:disabled{cursor:not-allowed}.ydgo3h0{pointer-events:auto;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;margin-top:-12px;margin-left:-12px;display:flex;position:absolute}.ydgo3h0:active{cursor:grabbing}.ydgo3h0:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand);outline:none}.ydgo3h1{box-sizing:border-box;background:var(--graphy-graph-background);border:2px solid var(--graphy-annotation-frame-border-color);border-radius:50%;width:10px;height:10px}.ydgo3h2{box-sizing:border-box;border:2px solid var(--graphy-annotation-frame-border-color);border-radius:6px;position:absolute}._1tyillx1{background:var(--graphy-overlay-background);width:32px;height:32px;color:var(--graphy-edit-menu-trigger-icon-color);outline:3px solid var(--_1tyillx0);filter:drop-shadow(0 4px 4px #0e0e3414)drop-shadow(0 0 4px #0f0f181f);pointer-events:none;border-radius:50%;justify-content:center;align-items:center;margin-top:-16px;margin-left:-16px;transition:transform .25s linear;display:flex;position:absolute}._1tyillx2{transform:scale(.5)}._1tyillx3{transform:scale(.75)}._1tyillx4{transform:scale(1)}._1tyillx5{transition:transform .25s linear;display:flex}._1tyillx6{transform:rotate(0)}._1tyillx7{transform:rotate(45deg)}@media (prefers-reduced-motion:reduce){._1tyillx1,._1tyillx5{transition:none}}.woi4bh0{flex-shrink:0;display:inline-flex}.woi4bh1{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;overflow:hidden}.woi4bh2{text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.woi4bh3{justify-content:center;align-items:center;gap:var(--graphy-space-xs);min-inline-size:0;block-size:var(--graphy-editor-control-height);padding:0 var(--graphy-space-sm);border-radius:var(--graphy-radii-md);cursor:pointer;font:var(--graphy-font-editor-control-value);border:1px solid #0000;transition:background .1s cubic-bezier(.55,.085,.68,.53),border-color .1s cubic-bezier(.55,.085,.68,.53),color .1s cubic-bezier(.55,.085,.68,.53);display:inline-flex}.woi4bh3:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand)}.woi4bh3:active:not(:disabled){background:var(--graphy-sunken-background)}.woi4bh3:disabled{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.woi4bh4{background:var(--graphy-raised-background);border-color:var(--graphy-border-10);inline-size:100%;color:var(--graphy-text-primary)}.woi4bh4:hover:not(:disabled){border-color:var(--graphy-border-50)}.woi4bh5{block-size:auto;min-block-size:68px;inline-size:100%;padding:var(--graphy-space-sm);background:var(--graphy-raised-background);color:var(--graphy-text-secondary);border-color:#0000;flex-direction:column}.woi4bh5:hover:not(:disabled){color:var(--graphy-text-primary)}.eh8dvc0{inline-size:100%;min-inline-size:0;display:flex}.eh8dvc1{cursor:text}.eh8dvc2{text-align:end;font-variant-numeric:tabular-nums}.eh8dvc3{color:var(--graphy-text-secondary);font:var(--graphy-font-editor-caption);-webkit-user-select:none;user-select:none;flex-shrink:0}._1b7s5f0{gap:var(--graphy-space-xs);inline-size:100%;display:grid}._1b7s5f1{grid-template-columns:repeat(1,minmax(0,1fr))}._1b7s5f2{grid-template-columns:repeat(2,minmax(0,1fr))}._1b7s5f3{grid-template-columns:repeat(3,minmax(0,1fr))}._1b7s5f4{grid-template-columns:repeat(4,minmax(0,1fr))}._1b7s5f5{grid-template-columns:repeat(5,minmax(0,1fr))}._1b7s5f6{grid-template-columns:repeat(6,minmax(0,1fr))}._1b7s5f7{justify-content:center;align-items:center;gap:var(--graphy-space-xxs);min-block-size:48px;padding:var(--graphy-space-xs);background:var(--graphy-raised-background);border-radius:var(--graphy-radii-md);cursor:pointer;color:var(--graphy-text-secondary);font-size:var(--graphy-font-size-xxs);border:1px solid #0000;flex-direction:column;transition:color .1s cubic-bezier(.55,.085,.68,.53),border-color .1s cubic-bezier(.55,.085,.68,.53),background .1s cubic-bezier(.55,.085,.68,.53);display:inline-flex}._1b7s5f7:hover:not([data-disabled]){color:var(--graphy-text-primary)}._1b7s5f7:active:not([data-disabled]){background:var(--graphy-sunken-background)}._1b7s5f7[data-checked]{border-color:var(--graphy-brand);color:var(--graphy-text-primary)}._1b7s5f7:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand)}._1b7s5f7[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}._1b7s5f8{min-block-size:0;padding:var(--graphy-space-xs)}._1b7s5f9{text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}._1g5x15w0{cursor:pointer}._1g5x15w1{white-space:nowrap;text-overflow:ellipsis;flex:1;min-inline-size:0;overflow:hidden}._1g5x15w2{color:var(--graphy-text-disabled)}._1g5x15w3{color:var(--graphy-icon-secondary);flex-shrink:0;align-items:center;display:flex}._1g5x15w4{z-index:var(--graphy-z-index-toolbar-popover)}._1g5x15w5{gap:var(--graphy-space-xxs);max-block-size:min(320px, var(--available-height));padding:var(--graphy-space-xs);background:var(--graphy-overlay-background);border:1px solid var(--graphy-border-10);border-radius:var(--graphy-radii-md);box-shadow:var(--graphy-elevation-md);color:var(--graphy-text-primary);outline:none;flex-direction:column;display:flex;overflow-y:auto}._1g5x15w6{align-items:center;gap:var(--graphy-space-sm);padding:var(--graphy-space-xs) var(--graphy-space-sm);border-radius:var(--graphy-radii-sm);cursor:pointer;color:var(--graphy-text-primary);font:var(--graphy-font-editor-control-value);-webkit-user-select:none;user-select:none;outline:none;transition:background .1s cubic-bezier(.55,.085,.68,.53),color .1s cubic-bezier(.55,.085,.68,.53);display:flex}._1g5x15w6[data-highlighted],._1g5x15w6[data-selected]{background:var(--graphy-raised-background)}._1g5x15w6[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}._1g5x15w7{gap:var(--graphy-space-xxs);flex-direction:column;min-inline-size:0;display:flex}._1g5x15w8{color:var(--graphy-text-secondary);font:var(--graphy-font-select-description)}.vod76w0{align-items:center;gap:var(--graphy-space-sm);inline-size:100%;display:flex}.vod76w1{min-inline-size:0;block-size:var(--graphy-editor-control-height);flex:1;padding-inline-start:11px;padding-inline-end:11px}.vod76w1[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.vod76w2{cursor:pointer;align-items:center;block-size:100%;inline-size:100%;display:flex}.vod76w2[data-disabled]{cursor:not-allowed}.vod76w3{background:var(--graphy-border-10);border-radius:999px;block-size:4px;inline-size:100%}.vod76w4{background:color-mix(in srgb, transparent, var(--graphy-brand) 50%);border-radius:999px;block-size:100%;transition:background .1s cubic-bezier(.55,.085,.68,.53)}.vod76w1:not([data-disabled]):hover .vod76w4{background:var(--graphy-brand)}.vod76w1:has(:focus-visible) .vod76w4{background:var(--graphy-brand)}.vod76w4[data-dragging]{background:var(--graphy-brand)}.vod76w5{background:var(--graphy-grey-100);border:1px solid var(--graphy-border-50);block-size:14px;inline-size:14px;box-shadow:var(--graphy-elevation-xs);cursor:grab;border-radius:50%;transition:border-color .1s cubic-bezier(.55,.085,.68,.53),box-shadow .1s cubic-bezier(.55,.085,.68,.53)}.vod76w1:not([data-disabled]):hover .vod76w5,.vod76w5[data-dragging]{border-color:var(--graphy-border-100);box-shadow:0 0 0 4px color-mix(in srgb, transparent, var(--graphy-brand) 20%), var(--graphy-elevation-xs)}.vod76w5:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand), var(--graphy-elevation-xs)}.vod76w5[data-dragging]{cursor:grabbing;transition:none}.vod76w6{min-inline-size:40px;color:var(--graphy-text-secondary);font:var(--graphy-font-editor-control-value);text-align:end;font-variant-numeric:tabular-nums;flex-shrink:0}._1hyrlw60{pointer-events:auto;background:var(--graphy-border-10);cursor:pointer;border:none;border-radius:999px;flex-shrink:0;block-size:20px;inline-size:36px;padding:0;transition:background .12s;position:relative}._1hyrlw60[data-checked]{background:color-mix(in srgb, transparent, var(--graphy-brand) 50%)}._1hyrlw60:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand)}._1hyrlw60[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}._1hyrlw61{block-size:16px;inline-size:16px;margin:var(--graphy-space-xxs);background:var(--graphy-grey-100);box-shadow:var(--graphy-elevation-xs);border-radius:50%;transition:translate .12s,background .12s;display:block}._1hyrlw61[data-checked]{background:var(--graphy-brand);translate:16px}.tpcnun0{cursor:text}.cnu9yl0{inline-size:100%;padding:var(--graphy-space-xxs);gap:var(--graphy-space-xxs);background:var(--graphy-sunken-background);border-radius:var(--graphy-radii-md);display:flex}.cnu9yl1{justify-content:center;align-items:center;gap:var(--graphy-space-xs);min-inline-size:0;block-size:calc(var(--graphy-editor-control-height) - var(--graphy-space-xxs) * 2);padding:0 var(--graphy-space-sm);border-radius:var(--graphy-radii-sm);cursor:pointer;color:var(--graphy-text-secondary);font:var(--graphy-font-editor-control-value);white-space:nowrap;background:0 0;border:none;flex:auto;transition:color .1s cubic-bezier(.55,.085,.68,.53),background .1s cubic-bezier(.55,.085,.68,.53),box-shadow .1s cubic-bezier(.55,.085,.68,.53);display:inline-flex}.cnu9yl1:hover:not([data-disabled]):not([data-checked]){color:var(--graphy-text-primary)}.cnu9yl1:active:not([data-disabled]):not([data-checked]){background:var(--graphy-raised-background)}.cnu9yl1[data-checked]{background:var(--graphy-default-background);box-shadow:var(--graphy-elevation-xs);color:var(--graphy-text-primary)}.cnu9yl1:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand)}.cnu9yl1[data-checked]:focus-visible{box-shadow:inset 0 0 0 2px var(--graphy-brand), var(--graphy-elevation-xs)}.cnu9yl1[data-disabled]{color:var(--graphy-text-disabled);cursor:not-allowed;opacity:.6}.cnu9yl2{gap:var(--graphy-space-xs);block-size:auto;min-block-size:34px;padding-block:var(--graphy-space-sm);font-size:var(--graphy-font-size-xxs);flex-direction:column;padding-inline-start:0;padding-inline-end:0}.cnu9yl3{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;max-inline-size:100%;overflow:hidden}._12lhx9e0{align-items:center;gap:var(--graphy-space-sm);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}._139ohwv0{gap:var(--graphy-space-md);flex-direction:column;display:flex}._1jlczkt0{background:var(--graphy-default-background);inline-size:100%;color:var(--graphy-text-primary);font-family:var(--graphy-font-family-default);font-weight:var(--graphy-font-weight-medium);-webkit-user-select:none;user-select:none;flex-direction:column;font-size:10px;display:flex;overflow:hidden auto}.pr583x0{gap:var(--graphy-space-xxs);flex-direction:column;display:flex}.pr583x1{align-items:center;gap:var(--graphy-space-sm);min-block-size:var(--graphy-editor-control-height);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.pr583x2{justify-content:flex-end;inline-size:100%;min-inline-size:0;display:flex}.pr583x3{color:var(--graphy-text-secondary);font:var(--graphy-font-editor-control-label);line-height:var(--graphy-editor-control-height);cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0}._40zvwv0{padding-block:var(--graphy-space-md);flex-direction:column;display:flex}._40zvwv0+._40zvwv0{border-block-start:1px solid var(--graphy-border-10)}._40zvwv1{align-items:center;gap:var(--graphy-space-xl);min-block-size:36px;inline-size:100%;display:flex;position:relative}._40zvwv2{border-radius:var(--graphy-radii-sm);cursor:pointer;background:0 0;border:none;padding:0;position:absolute;top:0;bottom:0;left:0;right:0}._40zvwv3{pointer-events:none;color:var(--graphy-text-primary);font:var(--graphy-font-editor-section-title);flex-shrink:0;position:relative}._40zvwv4{pointer-events:auto;cursor:pointer;-webkit-user-select:none;user-select:none}._40zvwv5{pointer-events:none;white-space:nowrap;text-overflow:ellipsis;text-align:end;min-inline-size:0;color:var(--graphy-text-secondary);font:var(--graphy-font-editor-caption);line-height:var(--graphy-font-line-height-sm);flex:1;position:relative;overflow:hidden}._40zvwv6{flex:1;justify-content:flex-end;min-inline-size:0;display:flex;position:relative}._40zvwv7{color:var(--graphy-icon-primary);flex-shrink:0;align-items:center;margin-inline-start:auto;display:inline-flex;position:relative}._40zvwv8{pointer-events:none;inline-size:var(--graphy-editor-control-height);block-size:var(--graphy-editor-control-height);border-radius:var(--graphy-radii-md);color:var(--graphy-text-disabled);background:0 0;flex-shrink:0;justify-content:center;align-items:center;margin-inline-start:auto;transition:background .1s cubic-bezier(.55,.085,.68,.53),rotate .1s cubic-bezier(.55,.085,.68,.53);display:inline-flex;position:relative}._40zvwv7+._40zvwv8{margin-inline-start:0}._40zvwv0[data-open] ._40zvwv8{background:var(--graphy-raised-background);rotate:90deg}._40zvwv2:focus-visible~._40zvwv8{box-shadow:inset 0 0 0 2px var(--graphy-brand)}@media (prefers-reduced-motion:reduce){._40zvwv8{transition:none}}