@rogieking/figui3 8.9.33 → 8.9.34

package/.cursor/skills/fig-lab/SKILL.md

@@ -59,7 +59,7 @@ Shared:
 | `propskit-text` | `#propskit-text` | `fig-input-text` | `type`, `readonly` |
 | `propskit-number` | `#propskit-number` | `fig-input-number` | `min`, `max`, `step`, `precision`, `units`, `steppers` |
 | `propskit-slider` | `#propskit-slider` | `fig-slider` | `type` range/hue/delta/stepper/opacity; `elastic` default true |
-| `propskit-wheel` | `#propskit-wheel` | `fig-input-wheel` + optional `fig-input-number` | Labeled scrubber with `label`, `text`, `precision`, `units`, `default`/reset, `size`, and `variant`; units stay on the wrapper/number field and the effective step is applied to the wheel |
+| `propskit-wheel` | `#propskit-wheel` | `fig-input-wheel` + optional `fig-input-number` | Labeled scrubber with `label`, `text`, `spin`, `precision`, `units`, `default`/reset, `size`, and `variant`; units stay on the wrapper/number field and the effective step is applied to the wheel |
 | `propskit-position` | `#propskit-position` | two numbers | `x`, `y`, `units="percent"` |
 | `propskit-color-point` | `#propskit-color-point` | color + position | JSON `value`; `collapsible`, `open` |
 | `propskit-point-radius` | `#propskit-point-radius` | position + radius | JSON `value` |
@@ -99,7 +99,7 @@ Rich select (requires editor):
 |---|---|---|
 | `fig-canvas-control` | `#canvas-control` | Overlay on a positioned parent. `type`: `point` (default), `color`, `point-radius`, `point-radius-angle`, `point-point`. `value` JSON `{x,y,radius?,angle?,x2?,y2?}`. `snapping="modifier\|true\|false"`, `name`, `tooltips`, `color` |
 | `fig-input-angle` | `#angle` | Dial + optional text. `text`, `dial` default true, `rotations`, `min`/`max`/`units` |
-| `fig-input-wheel` | `#input-wheel` | Standalone SVG tick + handle scrubber. Numeric `value`, optional `min`/`max`, `step` default 1, `elastic` default true, `disabled` |
+| `fig-input-wheel` | `#input-wheel` | Standalone SVG tick + handle scrubber. Numeric `value`, optional `min`/`max`, `step` default 1, `spin` and `elastic` default true, `disabled` |
 | `fig-reorder` | `#reorder` | `display:contents` wrapper; drag-reorders **direct children**. `axis="vertical\|horizontal"`, `handle` CSS selector when rows contain nested controls. Event: `reorder` `{ oldIndex, newIndex, item }` |
 
 ```html

package/.cursor/skills/fig-lab/reference.md

@@ -37,9 +37,9 @@ Inner `fig-slider` still needs `min` / `max` / `step` / `value` as forwarded att
 
 Standalone interactive SVG tick + handle scrubber in the lab bundle.
 
-- Attrs: `value` (default `0`), `step` (default `1`), optional `min`/`max`, `elastic` (default true), `disabled`
+- Attrs: `value` (default `0`), `step` (default `1`), optional `min`/`max`, `spin` (default true), `elastic` (default true), `disabled`
 - Props: `value`, `min`, `max`, `step`
-- Methods: `focus()`, `beginScrub()`, `updateScrub()`, `endScrub()`
+- Methods: `focus()`, `spinTo(value)`, `beginScrub()`, `updateScrub()`, `endScrub()`
 - Events: numeric `input` and `change`, bubbling and composed
 - ARIA value text is numeric
 - Not supported: `units`, `text`, `precision`, `label`, `size`, `variant`, `default`/reset, or a number field
@@ -51,7 +51,7 @@ Standalone interactive SVG tick + handle scrubber in the lab bundle.
 
 ## `propskit-wheel`
 
-Composes `fig-input-wheel` with an optional `fig-input-number`. It retains `label`, `text`, `precision`, `units`, `default`/reset, `size`, and `variant`. Units and time aliases are wrapper/number-field behavior: normalized `s` defaults to step `0.1` and precision `2`, normalized `ms` defaults to step `100` and precision `0`, and other units default to step `1` and precision `0`. The wrapper applies the effective step and unit-aware `aria-valuetext` to the child wheel, but never sets child `units`.
+Composes `fig-input-wheel` with an optional `fig-input-number`. It retains `label`, `text`, `spin`, `precision`, `units`, `default`/reset, `size`, and `variant`. Set `spin="false"` to update the value and number field while leaving wheel ticks stationary. Units and time aliases are wrapper/number-field behavior: normalized `s` defaults to step `0.1` and precision `2`, normalized `ms` defaults to step `100` and precision `0`, and other units default to step `1` and precision `0`. The wrapper applies the effective step and unit-aware `aria-valuetext` to the child wheel, but never sets child `units`.
 
 ```html
 <propskit-wheel label="Duration" value="1.5" units="seconds"></propskit-wheel>

package/README.md

@@ -568,12 +568,13 @@ A standalone interactive SVG tick-and-handle control for scrubbing numeric value
 |---|---|---|---|
 | `value` | number | `0` | Current numeric value |
 | `step` | number | `1` | Scrub increment |
+| `spin` | boolean/string | `true` | Keep ticks synchronized to `value`; set `"false"` to leave them stationary |
 | `min` | number | — | Inclusive lower bound; omit for no minimum |
 | `max` | number | — | Inclusive upper bound; omit for no maximum |
 | `elastic` | boolean/string | `true` | Resisted drag and spring return; set `"false"` to disable |
 | `disabled` | boolean | `false` | Disable interaction |
 
-The `value`, `min`, `max`, and `step` properties mirror their attributes. `aria-valuetext` is numeric. `focus()`, `beginScrub()`, `updateScrub()`, and `endScrub()` expose the interaction lifecycle for imperative integrations.
+The `value`, `min`, `max`, and `step` properties mirror their attributes. `aria-valuetext` is numeric. `spinTo(value)` animates to a new value when `spin` is enabled. `focus()`, `beginScrub()`, `updateScrub()`, and `endScrub()` expose the interaction lifecycle for imperative integrations.
 
 **Events:** numeric `input` while scrubbing and `change` on commit. Both bubble across shadow boundaries.
 
@@ -603,6 +604,7 @@ Omitted `label` renders `"Value"`. If `label` is set, including `label=""`, that
 | `step` | number | `1`; `0.1` (`s`) / `100` (`ms`) | Drag, keyboard, and mouse wheel increment |
 | `precision` | number | `0`; `2` (`s`) / `0` (`ms`) | Displayed decimal places on the optional number field |
 | `elastic` | boolean/string | `true` | Resisted handle movement, edge stretch, and spring return while scrubbing; set `"false"` to disable |
+| `spin` | boolean/string | `true` | Keep wheel ticks synchronized to `value`; set `"false"` to update only the value and number field |
 | `text` | boolean/string | `true` | Include the editable `fig-input-number`; set `"false"` for only `fig-input-wheel` |
 | `size` | string | default | Set to `"small"` for the compact layout |
 | `default` | number/string | initial `value` | Right-click reset target |
@@ -615,6 +617,7 @@ Omitted `label` renders `"Value"`. If `label` is set, including `label=""`, that
 <propskit-wheel label="Duration" value="1.5" default="0" units="seconds"></propskit-wheel>
 <propskit-wheel label="Delay" value="240" default="0" min="0" max="1000" units="ms"></propskit-wheel>
 <propskit-wheel label="Frames" value="12" text="false"></propskit-wheel>
+<propskit-wheel label="Amount" value="12" spin="false"></propskit-wheel>
 ```
 
 ---

package/dist/fig-lab.js

@@ -1,3 +1,3 @@
-function L(J,Q){if(!customElements.get(J))customElements.define(J,Q)}function Y(J,Q){return J.hasAttribute(Q)&&J.getAttribute(Q)!=="false"}var QJ="http://www.w3.org/2000/svg";function ZJ(J,Q){let Z=($)=>{if($===null||$===void 0||$===!1)return;if(Array.isArray($)){$.forEach(Z);return}J.append($ instanceof Node?$:String($))};return Z(Q),J}function $J(J,Q={}){for(let[Z,$]of Object.entries(Q)){if($===null||$===void 0||$===!1)continue;if(Z==="className")if(J.namespaceURI===QJ)J.setAttribute("class",String($));else J.className=String($);else if($===!0)J.setAttribute(Z,"");else J.setAttribute(Z,String($))}return J}function P(J,Q,Z){let $=document.createElement(J);return $J($,Q),ZJ($,Z)}function A(J,Q,Z){let $=document.createElementNS(QJ,J);return $J($,Q),ZJ($,Z)}function r(J,Q){let Z=Y(J,"disabled");for(let $ of Q)$?.toggleAttribute("disabled",Z)}function HJ(J,Q,Z){let $=Number(Q),j=Number(Z),_=Number.isFinite($)?Math.max(0,Math.min(1,$)):Number.isFinite(j)?Math.max(0,Math.min(100,j))/100:1,X=Number.isFinite(j)?Math.max(0,Math.min(100,j)):Math.round(_*100);return{color:J,alpha:_,opacity:X}}var t=new WeakMap;function V(J){let Q=t.get(J);if(!Q){let Z=document.createElement("fig-menu");Z.setAttribute("position","bottom left"),Z.setAttribute("offset","0 0");let $=document.createElement("fig-menu-item");$.setAttribute("value","reset-default"),$.textContent="Reset",Z.appendChild($);let j=0,_=()=>{if(j)clearTimeout(j),j=0;window.removeEventListener("pointerup",X,!0),window.removeEventListener("pointercancel",X,!0)},X=()=>{_();let O=Q?.point;if(O)Z.showAt?.(O.x,O.y)};Q={menu:Z,point:null,clearPendingOpen:_,handleContextMenu:(O)=>{if(Y(J,"disabled")||O.target?.closest?.("fig-menu"))return;O.preventDefault(),O.stopPropagation(),O.stopImmediatePropagation?.(),Q.point={x:O.clientX,y:O.clientY},_(),window.addEventListener("pointerup",X,{once:!0,capture:!0}),window.addEventListener("pointercancel",X,{once:!0,capture:!0}),j=window.setTimeout(X,180)},handleChange:(O)=>{if(O.stopPropagation(),O.detail?.value==="reset-default")J.resetToDefault?.()}},t.set(J,Q)}if(Q.menu.parentElement!==J)J.appendChild(Q.menu);J.removeEventListener("contextmenu",Q.handleContextMenu),J.addEventListener("contextmenu",Q.handleContextMenu),Q.menu.removeEventListener("change",Q.handleChange),Q.menu.addEventListener("change",Q.handleChange)}function D(J){let Q=t.get(J);if(!Q)return;Q.clearPendingOpen(),J.removeEventListener("contextmenu",Q.handleContextMenu),Q.menu.removeEventListener("change",Q.handleChange)}function p(J,Q){for(let Z of["input","change"])J.dispatchEvent(new CustomEvent(Z,{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}function g(J,Q){if(typeof J==="boolean"||typeof Q==="boolean")return Boolean(J)===Boolean(Q);return String(J??"")===String(Q??"")}function n(J,Q){let Z=($)=>{if(Array.isArray($))return $.map(Z);if($&&typeof $==="object")return Object.keys($).sort().reduce((j,_)=>{return j[_]=Z($[_]),j},{});return $};try{let $=typeof J==="string"?JSON.parse(J):J,j=typeof Q==="string"?JSON.parse(Q):Q;return JSON.stringify(Z($))===JSON.stringify(Z(j))}catch{return g(J,Q)}}function RJ(J,Q,Z=0.179){if(!J||!Q)return null;let $=document.createElement("span");$.style.cssText="position:absolute;visibility:hidden;pointer-events:none;color:"+Q,J.appendChild($);let j=getComputedStyle($).color;$.remove();let _=j.match(/[\d.]+/g)?.slice(0,3).map(Number),X=j.startsWith("rgb")?_:j.startsWith("color(srgb")&&_?_.map((M)=>M*255):null;if(!X||X.length<3||X.some(Number.isNaN))return null;let[q,B,O]=X.map((M)=>{let k=M/255;return k<=0.04045?k/12.92:((k+0.055)/1.055)**2.4});return 0.2126*q+0.7152*B+0.0722*O<=Z?"light":"dark"}var e=0;function jJ(J="fig-lab"){return e+=1,`${J}-${e}`}class _J extends HTMLElement{}L("fig-ai-prompt",_J);class XJ extends HTMLElement{}L("fig-ai-context",XJ);class BJ extends HTMLElement{}L("fig-chat-message",BJ);class qJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=null;#G=null;#X=this.#L.bind(this);#_=this.#P.bind(this);#q=this.#N.bind(this);static get observedAttributes(){return["src","name","value","removable","disabled"]}connectedCallback(){if(!this.#Q)this.#B();this.#$.removeEventListener("click",this.#X),this.#$.addEventListener("click",this.#X),this.#O(),this.#Y()}disconnectedCallback(){this.#$?.removeEventListener("click",this.#X),this.#k()}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Q)return;this.#Y()}#B(){this.#Z=document.createElement("fig-tooltip"),this.#Z.className="fig-attachment-tooltip",this.#Q=document.createElement("fig-image"),this.#Q.setAttribute("aspect-ratio","1/1"),this.#Q.setAttribute("fit","cover"),this.#Q.setAttribute("full",""),this.#J=document.createElement("span"),this.#J.className="fig-attachment-fallback",this.#J.setAttribute("aria-hidden","true"),this.#j=document.createElement("fig-tooltip"),this.#j.className="fig-attachment-remove-tooltip",this.#j.setAttribute("text","Remove attachment"),this.#$=document.createElement("fig-button"),this.#$.className="fig-attachment-remove",this.#$.setAttribute("variant","overlay"),this.#$.setAttribute("size","small"),this.#$.setAttribute("icon","");let J=document.createElement("fig-icon");J.setAttribute("name","close"),J.setAttribute("size","small"),this.#$.append(J),this.#j.append(this.#$),this.#Q.append(this.#J),this.#Z.append(this.#Q),this.replaceChildren(this.#Z,this.#j),this.#$.addEventListener("click",this.#X),this.#O()}#O(){let J=this.#Q?.mediaEl;if(!J||J===this.#G)return;this.#k(),this.#G=J,this.#G.addEventListener("load",this.#_),this.#G.addEventListener("error",this.#q)}#k(){if(!this.#G)return;this.#G.removeEventListener("load",this.#_),this.#G.removeEventListener("error",this.#q),this.#G=null}#Y(){let J=this.getAttribute("src")||"",Q=this.getAttribute("name")||"Attachment",Z=!this.hasAttribute("removable")||Y(this,"removable"),$=Y(this,"disabled");if(this.#Z.setAttribute("text",Q),this.#Q.setAttribute("alt",Q),J)this.#Q.setAttribute("src",J);else this.#Q.removeAttribute("src");if(this.#O(),this.#J.textContent=this.#M(Q),this.#$.hidden=!Z,this.#$.toggleAttribute("disabled",$),this.#$.setAttribute("aria-label",`Remove ${Q}`),this.toggleAttribute("data-fallback",!J),$)this.setAttribute("aria-disabled","true");else this.removeAttribute("aria-disabled")}#M(J){let Q=J.split(/[\\/]/).pop()||"",Z=Q.lastIndexOf(".");return(Z>0&&Z<Q.length-1?Q.slice(Z+1).toUpperCase():"FILE").slice(0,4)}#P(){if(this.getAttribute("src"))this.removeAttribute("data-fallback")}#N(){this.setAttribute("data-fallback","")}#L(J){if(J.stopPropagation(),Y(this,"disabled")||this.hasAttribute("removable")&&!Y(this,"removable"))return;this.dispatchEvent(new CustomEvent("remove",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.getAttribute("value"),name:this.getAttribute("name")||"",src:this.getAttribute("src")||"",attachment:this}}))}}L("fig-attachment",qJ);class OJ extends HTMLElement{#Z=null;connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","list"),this.setAttribute("data-generated-role","");if(this.#Q(),!this.#Z)this.#Z=new MutationObserver(()=>this.#Q()),this.#Z.observe(this,{childList:!0})}disconnectedCallback(){this.#Z?.disconnect(),this.#Z=null}#Q(){for(let J of this.querySelectorAll(":scope > fig-attachment"))if(!J.hasAttribute("role"))J.setAttribute("role","listitem"),J.setAttribute("data-generated-role","")}}L("fig-attachments",OJ);class YJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=!1;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#B=Y(this,"checked");let Q=Array.from(this.childNodes).filter((q)=>q.nodeType!==Node.TEXT_NODE||Boolean(q.textContent?.trim())).find((q)=>q.nodeType===Node.ELEMENT_NODE&&q.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-segmented-control"),_=document.createElement("fig-segment"),X=document.createElement("fig-segment");j.setAttribute("sizing","equal"),_.setAttribute("value","off"),_.textContent="Off",X.setAttribute("value","on"),X.textContent="On",j.append(_,X),Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#Y(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","checked","value","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#J.setAttribute("value",Y(this,"checked")?"on":"off"),this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value==="on";this.toggleAttribute("checked",Z);let $={checked:Z,value:this.getAttribute("value")??""};this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-segmented-control, fig-menu"))return;let Q=this.#J?.value==="on"?"off":"on";this.#J?.querySelector(`fig-segment[value="${Q}"]`)?.click()}get checked(){return this.#J?this.#J.value==="on":Y(this,"checked")}set checked(J){let Q=Boolean(J);if(this.toggleAttribute("checked",Q),this.#J)this.#J.value=Q?"on":"off"}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){this.setAttribute("value",J??"")}get defaultValue(){return this.hasAttribute("default")?Y(this,"default"):this.#B}get isDefault(){return this.checked===this.defaultValue}resetToDefault(){let J=this.defaultValue;this.checked=J,p(this,{checked:J,value:this.getAttribute("value")??""})}focus(J){(this.#J?.querySelector("fig-segment[selected]")||this.#J?.querySelector("fig-segment"))?.focus(J)}}L("propskit-switch",YJ);function w(J){let Q=String(J??"").trim();if(/^#[0-9a-fA-F]{8}$/.test(Q))return{color:Q.slice(0,7),alpha:parseInt(Q.slice(7,9),16)/255};if(/^#[0-9a-fA-F]{6}$/.test(Q))return{color:Q,alpha:1};if(/^#[0-9a-fA-F]{3}$/.test(Q))return{color:`#${Q[1]}${Q[1]}${Q[2]}${Q[2]}${Q[3]}${Q[3]}`,alpha:1};return{color:Q||"#D9D9D9",alpha:1}}function VJ(J){let{color:Q,alpha:Z}=w(J);return JSON.stringify({type:"solid",color:Q,alpha:Z})}function a(J){return`url("${String(J).replace(/\\/g,"\\\\").replace(/"/g,"\\\"")}")`}function fJ(J){let Q=String(J??"").trim();if(!Q||Q.startsWith("{")||Q.startsWith("#"))return!1;if(Q.startsWith("data:video/"))return!0;try{let Z=new URL(Q,"https://fig.local").pathname;return/\.(mp4|webm|mov|m4v|ogv)$/i.test(Z)}catch{return/\.(mp4|webm|mov|m4v|ogv)(?:[?#]|$)/i.test(Q)}}function CJ(J){return{type:"video",video:{url:J,scaleMode:"fill",scale:50}}}function x(J){if(J&&typeof J==="object")return J;let Q=String(J??"").trim();if(!Q)return{type:"solid",color:"#D9D9D9",alpha:1};if(Q.startsWith("{"))try{let Z=JSON.parse(Q);if(Z&&typeof Z==="object")return Z}catch{}if(Q.startsWith("#")){let{color:Z,alpha:$}=w(Q);return{type:"solid",color:Z,alpha:$}}if(fJ(Q))return CJ(Q);return{type:"solid",color:"#D9D9D9",alpha:1}}function v(J){if(J==null)return"";return typeof J==="string"?J:JSON.stringify(J)}function AJ(J){if(!J)return"";let Q=[...J.stops||[]].sort((Z,$)=>(Z.position??0)-($.position??0)).map((Z)=>`${Z.color} ${Z.position??0}%`).join(", ");if(!Q)return"";switch(J.type){case"radial":return`radial-gradient(circle, ${Q})`;case"angular":return`conic-gradient(from ${J.angle||0}deg, ${Q})`;default:return`linear-gradient(${J.angle??180}deg, ${Q})`}}function JJ(J,Q){switch(J?.type){case"solid":return J.color||"";case"gradient":return J.css||AJ(J.gradient)||"";case"image":return J.image?.url?a(J.image.url):"";case"video":return J.video?.poster?a(J.video.poster):"";case"webcam":return J.webcam?.snapshot?a(J.webcam.snapshot):"";default:return J?.swatchBackground||J?.background||J?.css||Q?.getAttribute("swatch-background")||""}}function EJ(J){if(!J||typeof J!=="object")return null;if(J.type==="image")return J.image;if(J.type==="video")return J.video;if(J.type==="webcam")return J.webcam;return null}function DJ(J){let Q=EJ(J),Z=Number(Q?.scale);switch(Q?.scaleMode){case"fit":return{size:"contain",position:"center"};case"tile":return{size:`${Number.isFinite(Z)?Z:50}%`,position:"top left"};case"fill":case"crop":return{size:"cover",position:"center"};default:return J?.type==="webcam"||J?.type==="image"||J?.type==="video"?{size:"cover",position:"center"}:null}}function IJ(J){switch(J?.type){case"solid":{if(Number.isFinite(J.alpha))return J.alpha;if(Number.isFinite(J.opacity))return J.opacity/100;return 1}case"gradient":return J.gradient?.opacity??J.opacity??1;case"image":return J.image?.opacity??1;case"video":return J.video?.opacity??1;case"webcam":return J.webcam?.opacity??1;default:return J?.opacity??J?.alpha??1}}class GJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=this.#H.bind(this);#O=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#k();if(this.#Y(),this.#L(),this.#U(),this.#O===null)this.#O=this.getAttribute("default")??this.getAttribute("value")??"";if(this.removeEventListener("click",this.#B),this.addEventListener("click",this.#B),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#Y();if(Z)this.#L()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#K(),this.removeEventListener("click",this.#B),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#Y()}#k(){let J=Array.from(this.childNodes).filter((X)=>X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())),Q=J.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-fill-picker"),_=document.createElement("fig-swatch");j.anchorElement=this,j.append(_),_.setAttribute("tabindex","0");for(let X of J)if(X!==Q)j.appendChild(X);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#$=Boolean(Q),this.replaceChildren(Z)}#Y(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Color")}#M(){return w(this.getAttribute("value"))}#P(){let{color:J,alpha:Q}=this.#M();return JSON.stringify({type:"solid",color:J,alpha:Q})}#N(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","text","default","value","mode","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#L(){if(!this.#J)return;let J=this.#N(),Q=new Set(J);for(let _ of this.#X)if(!Q.has(_))this.#J.removeAttribute(_);for(let _ of J)this.#J.setAttribute(_,this.getAttribute(_)??"");this.#J.setAttribute("mode","solid");let Z=this.#P();if(this.#J.getAttribute("value")!==Z)this.#J.setAttribute("value",Z);let{color:$,alpha:j}=this.#M();if(this.#j)this.#j.setAttribute("background",$),this.#j.setAttribute("alpha",String(j));this.#X=Q}#U(){if(!this.#J)return;this.#_??=this.#z.bind(this,"input"),this.#q??=this.#z.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q)}#K(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q)}#T(J){let Q=J instanceof CustomEvent&&J.detail!==void 0?J.detail:void 0;if(typeof Q==="string"&&Q)return w(Q).color;if(Q&&typeof Q==="object"){if(typeof Q.color==="string"&&Q.color)return Q.color;if(typeof Q.value==="string"&&Q.value)return w(Q.value).color;if(typeof Q.hex==="string"&&Q.hex)return Q.hex}let Z=this.#J?.value;if(Z&&typeof Z==="object"&&typeof Z.color==="string")return Z.color;if(typeof Z==="string"&&Z)return w(Z).color;return this.#M().color}#F(J,Q){let Z=J instanceof CustomEvent&&J.detail&&typeof J.detail==="object"?J.detail:void 0,$=Number.isFinite(Z?.alpha)?Math.max(0,Math.min(1,Number(Z.alpha))):this.#M().alpha;return{color:Q,alpha:$,opacity:Math.round($*100)}}#z(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#T(Q),$=this.#F(Q,Z),j=$.alpha<0.996078431372549?Math.round($.alpha*255).toString(16).padStart(2,"0"):"",_=`${$.color.slice(0,7)}${j}`;this.setAttribute("value",_);let X=this.#P();if(this.#J&&this.#J.getAttribute("value")!==X)this.#J.setAttribute("value",X);if(this.#j)this.#j.setAttribute("background",$.color),this.#j.setAttribute("alpha",String($.alpha));this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#H(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.open?.()}get value(){return this.getAttribute("value")??this.#J?.value??this.#J?.getAttribute("value")??""}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value");return}let Q=String(J);this.setAttribute("value",Q),this.#S(Q)}#S(J){if(!this.#J)return;let Q=VJ(J);if(this.#J.getAttribute("value")===Q)this.#J.removeAttribute("value");if(this.#J.setAttribute("value",Q),this.#j){let Z=w(J);this.#j.setAttribute("background",Z.color),this.#j.setAttribute("alpha",String(Z.alpha))}}#V(){return this.getAttribute("default")??this.#O??""}get defaultValue(){return String(this.#V())}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.setAttribute("value",J),this.#S(J),this.dispatchEvent(new CustomEvent("input",{detail:J,bubbles:!0,cancelable:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:J,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){let Q=this.querySelector("fig-swatch");if(Q instanceof HTMLElement)Q.focus(J)}}L("propskit-color",GJ);class MJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=this.#R.bind(this);#O=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#k();if(this.#Y(),this.#F(),this.#z(),this.#O===null)this.#O=this.getAttribute("default")??this.getAttribute("value")??"";if(this.removeEventListener("click",this.#B),this.addEventListener("click",this.#B),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#Y();if(Z)this.#F()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#H(),this.removeEventListener("click",this.#B),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#Y()}#k(){let J=Array.from(this.childNodes).filter((X)=>X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())),Q=J.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-fill-picker"),_=document.createElement("fig-swatch");j.anchorElement=this,j.append(_),_.setAttribute("tabindex","0");for(let X of J)if(X!==Q)j.appendChild(X);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#$=Boolean(Q),this.replaceChildren(Z)}#Y(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Fill")}#M(){return x(this.getAttribute("value"))}#P(){return v(this.#M())}#N(){let J=this.#M()?.type;if(!J)return null;return this.querySelector(`[slot="mode-${J}"]`)}#L(){let J=this.#J?.value;if(J&&typeof J==="object")return J;if(typeof J==="string"&&J)return x(J);return null}#U(J){let Q=this.#L();if(!J||typeof J!=="object")return J;if(J.type!=="webcam")return J;let Z=J.webcam?.snapshot||Q?.webcam?.snapshot;if(!Z||J.webcam?.snapshot)return J;return{...J,webcam:{...Q?.webcam&&typeof Q.webcam==="object"?Q.webcam:{},...J.webcam,snapshot:Z}}}#K(J=this.#M()){if(!this.#j)return;let Q=this.#U(J),Z=JJ(Q,this.#N());if(!Z)Z=JJ(this.#L(),this.#N());if(!Z){let j=this.#j.getAttribute("background")??"";if(j.startsWith("url("))Z=j}this.#j.setAttribute("background",Z),this.#j.setAttribute("alpha",String(IJ(Q)));let $=DJ(Q||J);if($)this.#j.style.setProperty("--swatch-bg-size",$.size),this.#j.style.setProperty("--swatch-bg-position",$.position)}#T(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","text","default","value","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#F(){if(!this.#J)return;let J=this.#T(),Q=new Set(J);for(let $ of this.#X)if(!Q.has($))this.#J.removeAttribute($);for(let $ of J)this.#J.setAttribute($,this.getAttribute($)??"");let Z=this.#P();if(this.#J.getAttribute("value")!==Z)this.#J.setAttribute("value",Z);this.#K(),this.#X=Q}#z(){if(!this.#J)return;this.#_??=this.#V.bind(this,"input"),this.#q??=this.#V.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q)}#H(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q)}#S(J){let Q=J instanceof CustomEvent&&J.detail!==void 0?J.detail:void 0;if(Q&&typeof Q==="object")return Q;if(typeof Q==="string"&&Q)return x(Q);let Z=this.#J?.value;if(Z&&typeof Z==="object")return Z;if(typeof Z==="string"&&Z)return x(Z);return this.#M()}#V(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#U(this.#S(Q)),$=v(Z);if(this.setAttribute("value",$),this.#J&&this.#J.getAttribute("value")!==$)this.#J.setAttribute("value",$);this.#K(Z),this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}#R(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.open?.()}get value(){return this.getAttribute("value")??v(this.#J?.value)??""}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value"),this.#K({type:"solid",color:"",alpha:1});return}let Q=v(typeof J==="string"?x(J):J);this.setAttribute("value",Q),this.#I(Q)}#I(J){if(!this.#J)return;let Q=v(x(J));if(this.#J.getAttribute("value")===Q)this.#J.removeAttribute("value");this.#J.setAttribute("value",Q),this.#K(x(Q))}#w(){return this.getAttribute("default")??this.#O??""}get defaultValue(){return String(this.#w())}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.setAttribute("value",J),this.#I(J);let Q=x(J);this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0,cancelable:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){let Q=this.querySelector("fig-swatch");if(Q instanceof HTMLElement)Q.focus(J)}}L("propskit-fill",MJ);class kJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#K.bind(this);#B=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.#B===null)this.#B=this.getAttribute("default")??this.getAttribute("value")??JSON.stringify(this.#J?.value??{});if(this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){let Q=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())).find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-gradient");j.anchorElement=this,Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Gradient")}#Y(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J){let $=this.getAttribute(Z)??"";if(Z==="value"&&this.#J.getAttribute("value")===$)continue;this.#J.setAttribute(Z,$)}if(!this.hasAttribute("edit"))this.#J.setAttribute("edit","picker");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#U.bind(this,"input"),this.#_??=this.#U.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J){let Q=J instanceof CustomEvent&&J.detail&&typeof J.detail==="object"?J.detail:this.#J?.value;if(!Q||typeof Q!=="object")return this.value;return JSON.stringify(Q)}#U(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#L(Q);this.setAttribute("value",Z);let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#K(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-input-gradient, fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.querySelector?.("fig-fill-picker")?.open?.()}get value(){return this.getAttribute("value")??JSON.stringify(this.#J?.value??{})}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value");return}let Q=typeof J==="object"?JSON.stringify(J):String(J);if(this.setAttribute("value",Q),this.#J&&this.#J.getAttribute("value")!==Q)this.#J.setAttribute("value",Q)}get defaultValue(){return this.getAttribute("default")??this.#B??""}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J;let Q=this.#J?.value;p(this,Q)}focus(J){this.#J?.focus(J)}}L("propskit-gradient",kJ);class m extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=null;#O=this.#f.bind(this);#k=this.#w.bind(this);#Y=!1;#M=null;static get observedAttributes(){return["label","direction","aria-label","options","value"]}static#P(){return["fig-select","fig-select-options","fig-select-option"].every((J)=>{let Q=customElements.get(J);return typeof Q==="function"&&Q.prototype instanceof HTMLElement})}static#N(J){let Q=J||"";if(Q.startsWith("["))try{let $=JSON.parse(Q);return Array.isArray($)?$:[]}catch{}let Z=Q.includes(`
+function L(J,Q){if(!customElements.get(J))customElements.define(J,Q)}function Y(J,Q){return J.hasAttribute(Q)&&J.getAttribute(Q)!=="false"}var QJ="http://www.w3.org/2000/svg";function ZJ(J,Q){let Z=($)=>{if($===null||$===void 0||$===!1)return;if(Array.isArray($)){$.forEach(Z);return}J.append($ instanceof Node?$:String($))};return Z(Q),J}function $J(J,Q={}){for(let[Z,$]of Object.entries(Q)){if($===null||$===void 0||$===!1)continue;if(Z==="className")if(J.namespaceURI===QJ)J.setAttribute("class",String($));else J.className=String($);else if($===!0)J.setAttribute(Z,"");else J.setAttribute(Z,String($))}return J}function P(J,Q,Z){let $=document.createElement(J);return $J($,Q),ZJ($,Z)}function A(J,Q,Z){let $=document.createElementNS(QJ,J);return $J($,Q),ZJ($,Z)}function r(J,Q){let Z=Y(J,"disabled");for(let $ of Q)$?.toggleAttribute("disabled",Z)}function HJ(J,Q,Z){let $=Number(Q),j=Number(Z),_=Number.isFinite($)?Math.max(0,Math.min(1,$)):Number.isFinite(j)?Math.max(0,Math.min(100,j))/100:1,X=Number.isFinite(j)?Math.max(0,Math.min(100,j)):Math.round(_*100);return{color:J,alpha:_,opacity:X}}var t=new WeakMap;function V(J){let Q=t.get(J);if(!Q){let Z=document.createElement("fig-menu");Z.setAttribute("position","bottom left"),Z.setAttribute("offset","0 0");let $=document.createElement("fig-menu-item");$.setAttribute("value","reset-default"),$.textContent="Reset",Z.appendChild($);let j=0,_=()=>{if(j)clearTimeout(j),j=0;window.removeEventListener("pointerup",X,!0),window.removeEventListener("pointercancel",X,!0)},X=()=>{_();let O=Q?.point;if(O)Z.showAt?.(O.x,O.y)};Q={menu:Z,point:null,clearPendingOpen:_,handleContextMenu:(O)=>{if(Y(J,"disabled")||O.target?.closest?.("fig-menu"))return;O.preventDefault(),O.stopPropagation(),O.stopImmediatePropagation?.(),Q.point={x:O.clientX,y:O.clientY},_(),window.addEventListener("pointerup",X,{once:!0,capture:!0}),window.addEventListener("pointercancel",X,{once:!0,capture:!0}),j=window.setTimeout(X,180)},handleChange:(O)=>{if(O.stopPropagation(),O.detail?.value==="reset-default")J.resetToDefault?.()}},t.set(J,Q)}if(Q.menu.parentElement!==J)J.appendChild(Q.menu);J.removeEventListener("contextmenu",Q.handleContextMenu),J.addEventListener("contextmenu",Q.handleContextMenu),Q.menu.removeEventListener("change",Q.handleChange),Q.menu.addEventListener("change",Q.handleChange)}function D(J){let Q=t.get(J);if(!Q)return;Q.clearPendingOpen(),J.removeEventListener("contextmenu",Q.handleContextMenu),Q.menu.removeEventListener("change",Q.handleChange)}function p(J,Q){for(let Z of["input","change"])J.dispatchEvent(new CustomEvent(Z,{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}function g(J,Q){if(typeof J==="boolean"||typeof Q==="boolean")return Boolean(J)===Boolean(Q);return String(J??"")===String(Q??"")}function n(J,Q){let Z=($)=>{if(Array.isArray($))return $.map(Z);if($&&typeof $==="object")return Object.keys($).sort().reduce((j,_)=>{return j[_]=Z($[_]),j},{});return $};try{let $=typeof J==="string"?JSON.parse(J):J,j=typeof Q==="string"?JSON.parse(Q):Q;return JSON.stringify(Z($))===JSON.stringify(Z(j))}catch{return g(J,Q)}}function RJ(J,Q,Z=0.179){if(!J||!Q)return null;let $=document.createElement("span");$.style.cssText="position:absolute;visibility:hidden;pointer-events:none;color:"+Q,J.appendChild($);let j=getComputedStyle($).color;$.remove();let _=j.match(/[\d.]+/g)?.slice(0,3).map(Number),X=j.startsWith("rgb")?_:j.startsWith("color(srgb")&&_?_.map((M)=>M*255):null;if(!X||X.length<3||X.some(Number.isNaN))return null;let[q,B,O]=X.map((M)=>{let k=M/255;return k<=0.04045?k/12.92:((k+0.055)/1.055)**2.4});return 0.2126*q+0.7152*B+0.0722*O<=Z?"light":"dark"}var e=0;function jJ(J="fig-lab"){return e+=1,`${J}-${e}`}class _J extends HTMLElement{}L("fig-ai-prompt",_J);class XJ extends HTMLElement{}L("fig-ai-context",XJ);class BJ extends HTMLElement{}L("fig-chat-message",BJ);class qJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=null;#G=null;#X=this.#L.bind(this);#_=this.#P.bind(this);#q=this.#N.bind(this);static get observedAttributes(){return["src","name","value","removable","disabled"]}connectedCallback(){if(!this.#Q)this.#B();this.#$.removeEventListener("click",this.#X),this.#$.addEventListener("click",this.#X),this.#O(),this.#Y()}disconnectedCallback(){this.#$?.removeEventListener("click",this.#X),this.#k()}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Q)return;this.#Y()}#B(){this.#Z=document.createElement("fig-tooltip"),this.#Z.className="fig-attachment-tooltip",this.#Q=document.createElement("fig-image"),this.#Q.setAttribute("aspect-ratio","1/1"),this.#Q.setAttribute("fit","cover"),this.#Q.setAttribute("full",""),this.#J=document.createElement("span"),this.#J.className="fig-attachment-fallback",this.#J.setAttribute("aria-hidden","true"),this.#j=document.createElement("fig-tooltip"),this.#j.className="fig-attachment-remove-tooltip",this.#j.setAttribute("text","Remove attachment"),this.#$=document.createElement("fig-button"),this.#$.className="fig-attachment-remove",this.#$.setAttribute("variant","overlay"),this.#$.setAttribute("size","small"),this.#$.setAttribute("icon","");let J=document.createElement("fig-icon");J.setAttribute("name","close"),J.setAttribute("size","small"),this.#$.append(J),this.#j.append(this.#$),this.#Q.append(this.#J),this.#Z.append(this.#Q),this.replaceChildren(this.#Z,this.#j),this.#$.addEventListener("click",this.#X),this.#O()}#O(){let J=this.#Q?.mediaEl;if(!J||J===this.#G)return;this.#k(),this.#G=J,this.#G.addEventListener("load",this.#_),this.#G.addEventListener("error",this.#q)}#k(){if(!this.#G)return;this.#G.removeEventListener("load",this.#_),this.#G.removeEventListener("error",this.#q),this.#G=null}#Y(){let J=this.getAttribute("src")||"",Q=this.getAttribute("name")||"Attachment",Z=!this.hasAttribute("removable")||Y(this,"removable"),$=Y(this,"disabled");if(this.#Z.setAttribute("text",Q),this.#Q.setAttribute("alt",Q),J)this.#Q.setAttribute("src",J);else this.#Q.removeAttribute("src");if(this.#O(),this.#J.textContent=this.#M(Q),this.#$.hidden=!Z,this.#$.toggleAttribute("disabled",$),this.#$.setAttribute("aria-label",`Remove ${Q}`),this.toggleAttribute("data-fallback",!J),$)this.setAttribute("aria-disabled","true");else this.removeAttribute("aria-disabled")}#M(J){let Q=J.split(/[\\/]/).pop()||"",Z=Q.lastIndexOf(".");return(Z>0&&Z<Q.length-1?Q.slice(Z+1).toUpperCase():"FILE").slice(0,4)}#P(){if(this.getAttribute("src"))this.removeAttribute("data-fallback")}#N(){this.setAttribute("data-fallback","")}#L(J){if(J.stopPropagation(),Y(this,"disabled")||this.hasAttribute("removable")&&!Y(this,"removable"))return;this.dispatchEvent(new CustomEvent("remove",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.getAttribute("value"),name:this.getAttribute("name")||"",src:this.getAttribute("src")||"",attachment:this}}))}}L("fig-attachment",qJ);class OJ extends HTMLElement{#Z=null;connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","list"),this.setAttribute("data-generated-role","");if(this.#Q(),!this.#Z)this.#Z=new MutationObserver(()=>this.#Q()),this.#Z.observe(this,{childList:!0})}disconnectedCallback(){this.#Z?.disconnect(),this.#Z=null}#Q(){for(let J of this.querySelectorAll(":scope > fig-attachment"))if(!J.hasAttribute("role"))J.setAttribute("role","listitem"),J.setAttribute("data-generated-role","")}}L("fig-attachments",OJ);class YJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=!1;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#B=Y(this,"checked");let Q=Array.from(this.childNodes).filter((q)=>q.nodeType!==Node.TEXT_NODE||Boolean(q.textContent?.trim())).find((q)=>q.nodeType===Node.ELEMENT_NODE&&q.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-segmented-control"),_=document.createElement("fig-segment"),X=document.createElement("fig-segment");j.setAttribute("sizing","equal"),_.setAttribute("value","off"),_.textContent="Off",X.setAttribute("value","on"),X.textContent="On",j.append(_,X),Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#Y(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","checked","value","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#J.setAttribute("value",Y(this,"checked")?"on":"off"),this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value==="on";this.toggleAttribute("checked",Z);let $={checked:Z,value:this.getAttribute("value")??""};this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-segmented-control, fig-menu"))return;let Q=this.#J?.value==="on"?"off":"on";this.#J?.querySelector(`fig-segment[value="${Q}"]`)?.click()}get checked(){return this.#J?this.#J.value==="on":Y(this,"checked")}set checked(J){let Q=Boolean(J);if(this.toggleAttribute("checked",Q),this.#J)this.#J.value=Q?"on":"off"}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){this.setAttribute("value",J??"")}get defaultValue(){return this.hasAttribute("default")?Y(this,"default"):this.#B}get isDefault(){return this.checked===this.defaultValue}resetToDefault(){let J=this.defaultValue;this.checked=J,p(this,{checked:J,value:this.getAttribute("value")??""})}focus(J){(this.#J?.querySelector("fig-segment[selected]")||this.#J?.querySelector("fig-segment"))?.focus(J)}}L("propskit-switch",YJ);function w(J){let Q=String(J??"").trim();if(/^#[0-9a-fA-F]{8}$/.test(Q))return{color:Q.slice(0,7),alpha:parseInt(Q.slice(7,9),16)/255};if(/^#[0-9a-fA-F]{6}$/.test(Q))return{color:Q,alpha:1};if(/^#[0-9a-fA-F]{3}$/.test(Q))return{color:`#${Q[1]}${Q[1]}${Q[2]}${Q[2]}${Q[3]}${Q[3]}`,alpha:1};return{color:Q||"#D9D9D9",alpha:1}}function VJ(J){let{color:Q,alpha:Z}=w(J);return JSON.stringify({type:"solid",color:Q,alpha:Z})}function a(J){return`url("${String(J).replace(/\\/g,"\\\\").replace(/"/g,"\\\"")}")`}function fJ(J){let Q=String(J??"").trim();if(!Q||Q.startsWith("{")||Q.startsWith("#"))return!1;if(Q.startsWith("data:video/"))return!0;try{let Z=new URL(Q,"https://fig.local").pathname;return/\.(mp4|webm|mov|m4v|ogv)$/i.test(Z)}catch{return/\.(mp4|webm|mov|m4v|ogv)(?:[?#]|$)/i.test(Q)}}function CJ(J){return{type:"video",video:{url:J,scaleMode:"fill",scale:50}}}function x(J){if(J&&typeof J==="object")return J;let Q=String(J??"").trim();if(!Q)return{type:"solid",color:"#D9D9D9",alpha:1};if(Q.startsWith("{"))try{let Z=JSON.parse(Q);if(Z&&typeof Z==="object")return Z}catch{}if(Q.startsWith("#")){let{color:Z,alpha:$}=w(Q);return{type:"solid",color:Z,alpha:$}}if(fJ(Q))return CJ(Q);return{type:"solid",color:"#D9D9D9",alpha:1}}function v(J){if(J==null)return"";return typeof J==="string"?J:JSON.stringify(J)}function AJ(J){if(!J)return"";let Q=[...J.stops||[]].sort((Z,$)=>(Z.position??0)-($.position??0)).map((Z)=>`${Z.color} ${Z.position??0}%`).join(", ");if(!Q)return"";switch(J.type){case"radial":return`radial-gradient(circle, ${Q})`;case"angular":return`conic-gradient(from ${J.angle||0}deg, ${Q})`;default:return`linear-gradient(${J.angle??180}deg, ${Q})`}}function JJ(J,Q){switch(J?.type){case"solid":return J.color||"";case"gradient":return J.css||AJ(J.gradient)||"";case"image":return J.image?.url?a(J.image.url):"";case"video":return J.video?.poster?a(J.video.poster):"";case"webcam":return J.webcam?.snapshot?a(J.webcam.snapshot):"";default:return J?.swatchBackground||J?.background||J?.css||Q?.getAttribute("swatch-background")||""}}function EJ(J){if(!J||typeof J!=="object")return null;if(J.type==="image")return J.image;if(J.type==="video")return J.video;if(J.type==="webcam")return J.webcam;return null}function DJ(J){let Q=EJ(J),Z=Number(Q?.scale);switch(Q?.scaleMode){case"fit":return{size:"contain",position:"center"};case"tile":return{size:`${Number.isFinite(Z)?Z:50}%`,position:"top left"};case"fill":case"crop":return{size:"cover",position:"center"};default:return J?.type==="webcam"||J?.type==="image"||J?.type==="video"?{size:"cover",position:"center"}:null}}function IJ(J){switch(J?.type){case"solid":{if(Number.isFinite(J.alpha))return J.alpha;if(Number.isFinite(J.opacity))return J.opacity/100;return 1}case"gradient":return J.gradient?.opacity??J.opacity??1;case"image":return J.image?.opacity??1;case"video":return J.video?.opacity??1;case"webcam":return J.webcam?.opacity??1;default:return J?.opacity??J?.alpha??1}}class GJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=this.#H.bind(this);#O=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#k();if(this.#Y(),this.#L(),this.#U(),this.#O===null)this.#O=this.getAttribute("default")??this.getAttribute("value")??"";if(this.removeEventListener("click",this.#B),this.addEventListener("click",this.#B),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#Y();if(Z)this.#L()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#K(),this.removeEventListener("click",this.#B),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#Y()}#k(){let J=Array.from(this.childNodes).filter((X)=>X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())),Q=J.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-fill-picker"),_=document.createElement("fig-swatch");j.anchorElement=this,j.append(_),_.setAttribute("tabindex","0");for(let X of J)if(X!==Q)j.appendChild(X);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#$=Boolean(Q),this.replaceChildren(Z)}#Y(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Color")}#M(){return w(this.getAttribute("value"))}#P(){let{color:J,alpha:Q}=this.#M();return JSON.stringify({type:"solid",color:J,alpha:Q})}#N(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","text","default","value","mode","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#L(){if(!this.#J)return;let J=this.#N(),Q=new Set(J);for(let _ of this.#X)if(!Q.has(_))this.#J.removeAttribute(_);for(let _ of J)this.#J.setAttribute(_,this.getAttribute(_)??"");this.#J.setAttribute("mode","solid");let Z=this.#P();if(this.#J.getAttribute("value")!==Z)this.#J.setAttribute("value",Z);let{color:$,alpha:j}=this.#M();if(this.#j)this.#j.setAttribute("background",$),this.#j.setAttribute("alpha",String(j));this.#X=Q}#U(){if(!this.#J)return;this.#_??=this.#W.bind(this,"input"),this.#q??=this.#W.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q)}#K(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q)}#T(J){let Q=J instanceof CustomEvent&&J.detail!==void 0?J.detail:void 0;if(typeof Q==="string"&&Q)return w(Q).color;if(Q&&typeof Q==="object"){if(typeof Q.color==="string"&&Q.color)return Q.color;if(typeof Q.value==="string"&&Q.value)return w(Q.value).color;if(typeof Q.hex==="string"&&Q.hex)return Q.hex}let Z=this.#J?.value;if(Z&&typeof Z==="object"&&typeof Z.color==="string")return Z.color;if(typeof Z==="string"&&Z)return w(Z).color;return this.#M().color}#F(J,Q){let Z=J instanceof CustomEvent&&J.detail&&typeof J.detail==="object"?J.detail:void 0,$=Number.isFinite(Z?.alpha)?Math.max(0,Math.min(1,Number(Z.alpha))):this.#M().alpha;return{color:Q,alpha:$,opacity:Math.round($*100)}}#W(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#T(Q),$=this.#F(Q,Z),j=$.alpha<0.996078431372549?Math.round($.alpha*255).toString(16).padStart(2,"0"):"",_=`${$.color.slice(0,7)}${j}`;this.setAttribute("value",_);let X=this.#P();if(this.#J&&this.#J.getAttribute("value")!==X)this.#J.setAttribute("value",X);if(this.#j)this.#j.setAttribute("background",$.color),this.#j.setAttribute("alpha",String($.alpha));this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#H(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.open?.()}get value(){return this.getAttribute("value")??this.#J?.value??this.#J?.getAttribute("value")??""}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value");return}let Q=String(J);this.setAttribute("value",Q),this.#S(Q)}#S(J){if(!this.#J)return;let Q=VJ(J);if(this.#J.getAttribute("value")===Q)this.#J.removeAttribute("value");if(this.#J.setAttribute("value",Q),this.#j){let Z=w(J);this.#j.setAttribute("background",Z.color),this.#j.setAttribute("alpha",String(Z.alpha))}}#V(){return this.getAttribute("default")??this.#O??""}get defaultValue(){return String(this.#V())}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.setAttribute("value",J),this.#S(J),this.dispatchEvent(new CustomEvent("input",{detail:J,bubbles:!0,cancelable:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:J,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){let Q=this.querySelector("fig-swatch");if(Q instanceof HTMLElement)Q.focus(J)}}L("propskit-color",GJ);class MJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=this.#R.bind(this);#O=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#k();if(this.#Y(),this.#F(),this.#W(),this.#O===null)this.#O=this.getAttribute("default")??this.getAttribute("value")??"";if(this.removeEventListener("click",this.#B),this.addEventListener("click",this.#B),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#Y();if(Z)this.#F()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#H(),this.removeEventListener("click",this.#B),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#Y()}#k(){let J=Array.from(this.childNodes).filter((X)=>X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())),Q=J.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-fill-picker"),_=document.createElement("fig-swatch");j.anchorElement=this,j.append(_),_.setAttribute("tabindex","0");for(let X of J)if(X!==Q)j.appendChild(X);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#$=Boolean(Q),this.replaceChildren(Z)}#Y(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Fill")}#M(){return x(this.getAttribute("value"))}#P(){return v(this.#M())}#N(){let J=this.#M()?.type;if(!J)return null;return this.querySelector(`[slot="mode-${J}"]`)}#L(){let J=this.#J?.value;if(J&&typeof J==="object")return J;if(typeof J==="string"&&J)return x(J);return null}#U(J){let Q=this.#L();if(!J||typeof J!=="object")return J;if(J.type!=="webcam")return J;let Z=J.webcam?.snapshot||Q?.webcam?.snapshot;if(!Z||J.webcam?.snapshot)return J;return{...J,webcam:{...Q?.webcam&&typeof Q.webcam==="object"?Q.webcam:{},...J.webcam,snapshot:Z}}}#K(J=this.#M()){if(!this.#j)return;let Q=this.#U(J),Z=JJ(Q,this.#N());if(!Z)Z=JJ(this.#L(),this.#N());if(!Z){let j=this.#j.getAttribute("background")??"";if(j.startsWith("url("))Z=j}this.#j.setAttribute("background",Z),this.#j.setAttribute("alpha",String(IJ(Q)));let $=DJ(Q||J);if($)this.#j.style.setProperty("--swatch-bg-size",$.size),this.#j.style.setProperty("--swatch-bg-position",$.position)}#T(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","text","default","value","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#F(){if(!this.#J)return;let J=this.#T(),Q=new Set(J);for(let $ of this.#X)if(!Q.has($))this.#J.removeAttribute($);for(let $ of J)this.#J.setAttribute($,this.getAttribute($)??"");let Z=this.#P();if(this.#J.getAttribute("value")!==Z)this.#J.setAttribute("value",Z);this.#K(),this.#X=Q}#W(){if(!this.#J)return;this.#_??=this.#V.bind(this,"input"),this.#q??=this.#V.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q)}#H(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q)}#S(J){let Q=J instanceof CustomEvent&&J.detail!==void 0?J.detail:void 0;if(Q&&typeof Q==="object")return Q;if(typeof Q==="string"&&Q)return x(Q);let Z=this.#J?.value;if(Z&&typeof Z==="object")return Z;if(typeof Z==="string"&&Z)return x(Z);return this.#M()}#V(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#U(this.#S(Q)),$=v(Z);if(this.setAttribute("value",$),this.#J&&this.#J.getAttribute("value")!==$)this.#J.setAttribute("value",$);this.#K(Z),this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}#R(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.open?.()}get value(){return this.getAttribute("value")??v(this.#J?.value)??""}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value"),this.#K({type:"solid",color:"",alpha:1});return}let Q=v(typeof J==="string"?x(J):J);this.setAttribute("value",Q),this.#I(Q)}#I(J){if(!this.#J)return;let Q=v(x(J));if(this.#J.getAttribute("value")===Q)this.#J.removeAttribute("value");this.#J.setAttribute("value",Q),this.#K(x(Q))}#w(){return this.getAttribute("default")??this.#O??""}get defaultValue(){return String(this.#w())}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.setAttribute("value",J),this.#I(J);let Q=x(J);this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0,cancelable:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){let Q=this.querySelector("fig-swatch");if(Q instanceof HTMLElement)Q.focus(J)}}L("propskit-fill",MJ);class kJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#K.bind(this);#B=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.#B===null)this.#B=this.getAttribute("default")??this.getAttribute("value")??JSON.stringify(this.#J?.value??{});if(this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){let Q=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())).find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-gradient");j.anchorElement=this,Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Gradient")}#Y(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J){let $=this.getAttribute(Z)??"";if(Z==="value"&&this.#J.getAttribute("value")===$)continue;this.#J.setAttribute(Z,$)}if(!this.hasAttribute("edit"))this.#J.setAttribute("edit","picker");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#U.bind(this,"input"),this.#_??=this.#U.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J){let Q=J instanceof CustomEvent&&J.detail&&typeof J.detail==="object"?J.detail:this.#J?.value;if(!Q||typeof Q!=="object")return this.value;return JSON.stringify(Q)}#U(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#L(Q);this.setAttribute("value",Z);let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#K(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-input-gradient, fig-fill-picker, fig-swatch"))return;this.focus(),this.#J?.querySelector?.("fig-fill-picker")?.open?.()}get value(){return this.getAttribute("value")??JSON.stringify(this.#J?.value??{})}set value(J){if(J===null||J===void 0||J===""){this.removeAttribute("value"),this.#J?.removeAttribute("value");return}let Q=typeof J==="object"?JSON.stringify(J):String(J);if(this.setAttribute("value",Q),this.#J&&this.#J.getAttribute("value")!==Q)this.#J.setAttribute("value",Q)}get defaultValue(){return this.getAttribute("default")??this.#B??""}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J;let Q=this.#J?.value;p(this,Q)}focus(J){this.#J?.focus(J)}}L("propskit-gradient",kJ);class m extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=null;#X=new Set;#_=null;#q=null;#B=null;#O=this.#f.bind(this);#k=this.#w.bind(this);#Y=!1;#M=null;static get observedAttributes(){return["label","direction","aria-label","options","value"]}static#P(){return["fig-select","fig-select-options","fig-select-option"].every((J)=>{let Q=customElements.get(J);return typeof Q==="function"&&Q.prototype instanceof HTMLElement})}static#N(J){let Q=J||"";if(Q.startsWith("["))try{let $=JSON.parse(Q);return Array.isArray($)?$:[]}catch{}let Z=Q.includes(`
 `)?`
-`:",";return Q.split(Z).map(($)=>$.trim()).filter(Boolean)}static#L(J){if(J&&typeof J==="object")return String(J.value??J.label??"");return String(J??"")}static#U(J){if(J&&typeof J==="object")return String(J.label??J.value??"");return String(J??"")}connectedCallback(){if(!this.#Z)this.#K();if(this.#T(),this.#H(),this.#S(),this.removeEventListener("click",this.#O),this.addEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),this.addEventListener("pointerdown",this.#k,!0),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;let j=$.attributeName;if(j==="label"||j==="direction"||j==="aria-label")Q=!0;else Z=!0}if(Q)this.#T();if(Z)this.#H()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#V(),this.removeEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label"){this.#T();return}if(J==="options"||J==="value")this.#H()}#K(){this.#M=this.getAttribute("value")??"";let J=this.querySelector(":scope > label"),Q=this.querySelector(":scope > fig-select-options"),Z=document.createElement("fig-field"),$=J||document.createElement("label");this.#j=m.#P();let j=document.createElement(this.#j?"fig-select":"fig-dropdown");if(j.setAttribute("full",""),this.#j&&Q)j.append(Q);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#$=Boolean(J),this.replaceChildren(Z)}#T(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Select"),this.#J.setAttribute("full","")}#F(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","full","default","variant"]);if(!this.#j)J.add("options");return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#z(){if(!this.#J||this.#j)return;let J=m.#N(this.getAttribute("options"));for(let Z of[...this.#J.children])if(Z.localName==="option"||Z.localName==="optgroup")Z.remove();for(let Z of J){let $=document.createElement("option");$.value=m.#L(Z),$.textContent=m.#U(Z),this.#J.appendChild($)}let Q=this.getAttribute("value");if(Q!=null){let Z=()=>{if(this.#J?.setAttribute("value",Q),this.#J&&"value"in this.#J)this.#J.value=Q};Z(),queueMicrotask(Z)}}#H(){if(!this.#J)return;if(!this.#j)this.#z();let J=this.#F().sort((Z,$)=>{if(Z==="options")return-1;if($==="options")return 1;if(Z==="value")return 1;if($==="value")return-1;return 0}),Q=new Set(J);for(let Z of this.#X)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#X=Q}#S(){if(!this.#J)return;if(this.#_??=this.#R.bind(this,"input"),this.#q??=this.#R.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q),this.#j)this.#B??=this.#R.bind(this,"optionhover"),this.#J.addEventListener("optionhover",this.#B)}#V(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q);if(this.#B)this.#J.removeEventListener("optionhover",this.#B)}#R(J,Q){if(Q.target!==this.#J)return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value??"";if(J!=="optionhover")this.setAttribute("value",String(Z));let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:Z;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#I(){if(!this.#J||!this.#j)return!1;if(this.#J.open)return!0;let J=this.#J.shadowRoot?.querySelector('dialog[is="fig-popup"]');return Boolean(J?.open||J?.matches?.(":open"))}#w(J){if(!(J.target instanceof Element))return;if(J.target.closest("fig-menu"))return;if(J.target.closest("fig-select, fig-dropdown")){this.#Y=!1;return}if(!this.#j)return;this.#Y=this.#I()}#f(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-select, fig-dropdown")){this.#Y=!1;return}if(!this.#J||Y(this.#J,"disabled")){this.#Y=!1;return}if(this.#J.focus(),!this.#j)return;if(this.#Y||this.#I()){this.#Y=!1,this.#J.open=!1;return}this.#J.open=!0}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0)this.removeAttribute("value");else this.setAttribute("value",String(J))}get defaultValue(){return this.getAttribute("default")??this.#M??""}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(this.value=J,this.#J)this.#J.value=J;p(this,J)}focus(J){this.#J?.focus(J)}}L("propskit-select",m);class NJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){this.#B=this.getAttribute("value")??"";let J=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())),Q=J.find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-text");for(let _ of J)if(_!==Q)j.appendChild(_);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Text")}#Y(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","multiline","resizable","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value??"";this.setAttribute("value",String(Z));let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:Z;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-text, fig-menu"))return;this.focus()}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0){if(this.removeAttribute("value"),this.#J)this.#J.value=""}else{let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}}get defaultValue(){return this.getAttribute("default")??this.#B??""}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,J)}focus(J){this.#J?.focus(J)}}L("propskit-text",NJ);class PJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=null;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#B=this.getAttribute("value")??this.getAttribute("min")??"0";let J=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())),Q=J.find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-number");Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z);for(let _ of J)if(_!==Q)j.appendChild(_)}#k(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#Y(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;if(this.#J?.value!==void 0)this.setAttribute("value",String(this.#J.value));this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu"))return;this.focus()}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0||J===""){if(this.removeAttribute("value"),this.#J)this.#J.value=""}else{let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}}get defaultValue(){return this.getAttribute("default")??this.#B??"0"}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,this.#J?.value??J)}focus(J){this.#J?.focus(J)}}L("propskit-number",PJ);class LJ extends HTMLElement{static observedAttributes=["x","y","default","label","units","disabled","size"];#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=!1;#X=this.#z.bind(this,"input");#_=this.#z.bind(this,"change");#q=this.#H.bind(this);connectedCallback(){if(!this.#$)this.#j=this.#O(),this.#Y(this.#j),this.#$=!0;if(!this.#Z)this.#P();this.#N(),this.#L(),this.#T(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this)}disconnectedCallback(){this.#F(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if((J==="x"||J==="y")&&!this.#G)this.#L();else if(J==="label")this.#N();else if(J==="units")this.#U();else if(J==="disabled")this.#K()}#B(J,Q=50){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(){let J=this.getAttribute("x"),Q=this.getAttribute("y");return{x:J===null||!J.trim()?50:this.#B(J,50),y:Q===null||!Q.trim()?50:this.#B(Q,50)}}#k(J){if(typeof J!=="string"||!J.trim())return null;try{let Q=JSON.parse(J);if(!Q||typeof Q!=="object"||Array.isArray(Q))return null;return{x:this.#B(Q.x,this.#j?.x??50),y:this.#B(Q.y,this.#j?.y??50)}}catch{return null}}#Y(J){let Q=this.#O(),Z={x:this.#B(J?.x,Q.x),y:this.#B(J?.y,Q.y)};return this.#G=!0,this.setAttribute("x",String(Z.x)),this.setAttribute("y",String(Z.y)),this.#G=!1,Z}#M(J,Q){let Z=document.createElement("fig-input-number");if(Z.setAttribute("data-propskit-position-axis",J),Z.setAttribute("value",String(Q)),Z.setAttribute("min","0"),Z.setAttribute("max","100"),Z.setAttribute("step","1"),Z.setAttribute("precision","2"),this.units==="percent")Z.setAttribute("units","%");Z.setAttribute("aria-label",`${J.toUpperCase()} position`);let $=document.createElement("span");if($.setAttribute("slot","prepend"),$.textContent=J.toUpperCase(),Z.append($),Y(this,"disabled"))Z.setAttribute("disabled","");return Z}#P(){let J=this.#O(),Q=document.createElement("fig-field");Q.className="propskit-position-row",Q.setAttribute("direction","horizontal");let Z=document.createElement("label"),$=this.#M("x",J.x),j=this.#M("y",J.y);Q.append(Z,$,j),this.#Z=Q,this.#Q=$,this.#J=j,this.replaceChildren(Q),V(this)}#N(){let J=this.#Z?.querySelector(":scope > label");if(!J)return;let Q=this.getAttribute("label");J.textContent=Q?.trim()||"Position"}#L(){let J=this.#O();this.#Q?.setAttribute("value",String(J.x)),this.#J?.setAttribute("value",String(J.y)),this.#U(),this.#K()}#U(){let J=this.units==="percent"?"%":null;for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J)Q.setAttribute("units",J);else Q.removeAttribute("units")}}#K(){let J=Y(this,"disabled");this.#Q?.toggleAttribute("disabled",J),this.#J?.toggleAttribute("disabled",J)}#T(){this.#F(),this.#Q?.addEventListener("input",this.#X),this.#Q?.addEventListener("change",this.#_),this.#J?.addEventListener("input",this.#X),this.#J?.addEventListener("change",this.#_)}#F(){this.#Q?.removeEventListener("input",this.#X),this.#Q?.removeEventListener("change",this.#_),this.#J?.removeEventListener("input",this.#X),this.#J?.removeEventListener("change",this.#_)}#z(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q.currentTarget?.getAttribute("data-propskit-position-axis");if(Z!=="x"&&Z!=="y")return;let $=this.value;$[Z]=this.#B(Q.currentTarget.value,$[Z]);let j=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{...j,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#H(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu"))return;this.focus()}get x(){return this.#O().x}set x(J){this.setAttribute("x",String(this.#B(J,50)))}get y(){return this.#O().y}set y(J){this.setAttribute("y",String(this.#B(J,50)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#O()}}set value(J){let Q=this.#Y(J);this.#L(Q)}get defaultValue(){return this.#k(this.getAttribute("default"))||{...this.#j||{x:50,y:50}}}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,{...J,units:this.units})}focus(J){this.#Q?.focus(J)}}L("propskit-position",LJ);class UJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#K.bind(this,"input");#_=this.#K.bind(this,"change");#q=this.#T.bind(this);connectedCallback(){if(!this.#j)this.#Y(this.#k()),this.#j=!0;if(!this.#Z)this.#M();this.#P(),this.#N(),this.#L(),this.#U(this.#k()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#Y(this.#k());this.#U($)}return}if(J==="size"){this.#N();return}if(J==="disabled"){this.#L();return}this.#P()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),color:typeof Q.color==="string"&&Q.color.trim()?Q.color.trim():"#D9D9D9"}}#k(){return this.#O(this.getAttribute("value"))}#Y(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#M(){let J=this.#k(),Q=document.createElement("fig-group"),Z=document.createElement("propskit-color"),$=document.createElement("propskit-position");Q.setAttribute("compact",""),Z.setAttribute("label","Color"),Z.setAttribute("value",J.color),Z.setAttribute("data-propskit-color-point-control","color"),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),$.setAttribute("units","percent"),$.setAttribute("data-propskit-color-point-control","position"),this.#Z=Q,this.#Q=Z,this.#J=$,this.#P(),this.#N(),this.#L(),Q.append(Z,$),this.replaceChildren(Q)}#P(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#N(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#L(){r(this,[this.#Q,this.#J])}#U(J){let Q=this.#O(J);if(this.#Q)this.#Q.value=Q.color;if(this.#J)this.#J.value={x:Q.x,y:Q.y}}#K(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-color-point-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-color-point-control");if(j==="color")$.color=Z.value||Z.getAttribute("value");else if(j==="position")$.x=this.#B(Z.value?.x,$.x),$.y=this.#B(Z.value?.y,$.y);else return;let _=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,units:"percent"},bubbles:!0,cancelable:!0,composed:!0}))}#T(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get value(){return{...this.#k()}}set value(J){let Q=this.#Y(J);this.#U(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-color-point",UJ);class KJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#H.bind(this,"input");#_=this.#H.bind(this,"change");#q=this.#S.bind(this);connectedCallback(){if(!this.#j)this.#M(this.#Y()),this.#j=!0;if(!this.#Z)this.#N();this.#L(),this.#U(),this.#K(),this.#T(),this.#F(this.#Y()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#M(this.#Y());this.#F($)}return}if(J==="size"){this.#U();return}if(J==="units"){this.#K();return}if(J==="disabled"){this.#T();return}this.#L()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){if(typeof J==="string"&&J.trim().endsWith("%")){let Q=Number.parseFloat(J);if(Number.isFinite(Q))return`${Q}%`}return this.#B(J,0)}#k(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),radius:this.#O(Q.radius)}}#Y(){return this.#k(this.getAttribute("value"))}#M(J){let Q=this.#k(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#P(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#N(){let J=this.#Y(),Q=this.#P(J.radius),Z=document.createElement("fig-group"),$=document.createElement("propskit-position"),j=document.createElement("propskit-number");if(Z.setAttribute("compact",""),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),this.hasAttribute("units"))$.setAttribute("units",this.units);if($.setAttribute("data-propskit-point-radius-control","position"),j.setAttribute("label","Radius"),j.setAttribute("value",String(Q.value)),this.units==="percent")j.setAttribute("units","%");j.setAttribute("units-disallow",""),j.setAttribute("min","0"),j.setAttribute("precision","2"),j.setAttribute("data-propskit-point-radius-control","radius"),this.#Z=Z,this.#Q=$,this.#J=j,this.#L(),this.#U(),this.#T(),Z.append($,j),this.replaceChildren(Z)}#L(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#U(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#K(){if(this.hasAttribute("units"))this.#Q?.setAttribute("units",this.units);else this.#Q?.removeAttribute("units");if(this.units==="percent")this.#J?.setAttribute("units","%");else this.#J?.removeAttribute("units")}#T(){r(this,[this.#Q,this.#J])}#F(J){let Q=this.#k(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#P(Q.radius);this.#J.value=Z.value}}#z(J,Q){let Z=this.#P(Q).value,$=this.#B(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#H(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-radius-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-point-radius-control");if(j==="position")$.x=this.#B(Z.value?.x,$.x),$.y=this.#B(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#z(Z,$.radius);else return;let _=this.#M($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#P(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#S(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#Y()}}set value(J){let Q=this.#M(J);this.#F(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-radius",KJ);class SJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=!1;#X=!1;#_=this.#S.bind(this,"input");#q=this.#S.bind(this,"change");#B=this.#V.bind(this);connectedCallback(){if(!this.#$)this.#P(this.#M()),this.#$=!0;if(!this.#Z)this.#L();this.#U(),this.#K(),this.#T(),this.#F(),this.#z(this.#M()),this.removeEventListener("input",this.#_),this.addEventListener("input",this.#_),this.removeEventListener("change",this.#q),this.addEventListener("change",this.#q),this.removeEventListener("openchange",this.#B),this.addEventListener("openchange",this.#B)}disconnectedCallback(){this.removeEventListener("input",this.#_),this.removeEventListener("change",this.#q),this.removeEventListener("openchange",this.#B)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if(J==="value"){if(!this.#G){let $=this.#P(this.#M());this.#z($)}return}if(J==="size"){this.#K();return}if(J==="units"){this.#T();return}if(J==="disabled"){this.#F();return}this.#U()}#O(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#k(J){if(typeof J==="string"&&J.trim().endsWith("%")){let Q=Number.parseFloat(J);if(Number.isFinite(Q))return`${Q}%`}return this.#O(J,0)}#Y(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#O(Q.x,50),y:this.#O(Q.y,50),radius:this.#k(Q.radius),angle:this.#O(Q.angle,0)}}#M(){return this.#Y(this.getAttribute("value"))}#P(J){let Q=this.#Y(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#G=!0,this.setAttribute("value",Z),this.#G=!1,Q}#N(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#L(){let J=this.#M(),Q=this.#N(J.radius),Z=document.createElement("fig-group"),$=document.createElement("propskit-position"),j=document.createElement("propskit-number"),_=document.createElement("propskit-number");if(Z.setAttribute("compact",""),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),this.hasAttribute("units"))$.setAttribute("units",this.units);if($.setAttribute("data-propskit-point-radius-angle-control","position"),j.setAttribute("label","Radius"),j.setAttribute("value",String(Q.value)),this.units==="percent")j.setAttribute("units","%");j.setAttribute("units-disallow",""),j.setAttribute("min","0"),j.setAttribute("precision","2"),j.setAttribute("data-propskit-point-radius-angle-control","radius"),_.setAttribute("label","Angle"),_.setAttribute("value",String(J.angle)),_.setAttribute("units","°"),_.setAttribute("units-disallow",""),_.setAttribute("precision","1"),_.setAttribute("data-propskit-point-radius-angle-control","angle"),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#U(),this.#K(),this.#F(),Z.append($,j,_),this.replaceChildren(Z)}#U(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#K(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J,this.#j]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#T(){if(this.hasAttribute("units"))this.#Q?.setAttribute("units",this.units);else this.#Q?.removeAttribute("units");if(this.units==="percent")this.#J?.setAttribute("units","%");else this.#J?.removeAttribute("units")}#F(){r(this,[this.#Q,this.#J,this.#j])}#z(J){let Q=this.#Y(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#N(Q.radius);this.#J.value=Z.value}if(this.#j)this.#j.value=Q.angle}#H(J,Q){let Z=this.#N(Q).value,$=this.#O(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#S(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-radius-angle-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-point-radius-angle-control");if(j==="position")$.x=this.#O(Z.value?.x,$.x),$.y=this.#O(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#H(Z,$.radius);else if(j==="angle")$.angle=this.#O(Z.value,$.angle);else return;let _=this.#P($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#N(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#V(J){if(J.target!==this.#Z||this.#X)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#X=!0,this.setAttribute("open",String(Q)),this.#X=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#M()}}set value(J){let Q=this.#P(J);this.#z(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-radius-angle",SJ);class TJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#F.bind(this,"input");#_=this.#F.bind(this,"change");#q=this.#z.bind(this);connectedCallback(){if(!this.#j)this.#Y(this.#k()),this.#j=!0;if(!this.#Z)this.#P();this.#N(),this.#L(),this.#U(),this.#K(),this.#T(this.#k()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#Y(this.#k());this.#T($)}return}if(J==="size"){this.#L();return}if(J==="units"){this.#U();return}if(J==="disabled"){this.#K();return}this.#N()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),x2:this.#B(Q.x2,75),y2:this.#B(Q.y2,75)}}#k(){return this.#O(this.getAttribute("value"))}#Y(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#M(J,Q,Z,$){let j=document.createElement("propskit-position");if(j.setAttribute("label",J),j.setAttribute("x",String(Z)),j.setAttribute("y",String($)),this.hasAttribute("units"))j.setAttribute("units",this.units);return j.setAttribute("data-propskit-point-point-control",Q),j}#P(){let J=this.#k(),Q=document.createElement("fig-group"),Z=this.#M("Start","start",J.x,J.y),$=this.#M("End","end",J.x2,J.y2);Q.setAttribute("compact",""),this.#Z=Q,this.#Q=Z,this.#J=$,this.#N(),this.#L(),this.#K(),Q.append(Z,$),this.replaceChildren(Q)}#N(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#L(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#U(){for(let J of[this.#Q,this.#J]){if(!J)continue;if(this.hasAttribute("units"))J.setAttribute("units",this.units);else J.removeAttribute("units")}}#K(){r(this,[this.#Q,this.#J])}#T(J){let Q=this.#O(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J)this.#J.value={x:Q.x2,y:Q.y2}}#F(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-point-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.value,_=Z.getAttribute("data-propskit-point-point-control");if(_==="start")$.x=this.#B(j?.x,$.x),$.y=this.#B(j?.y,$.y);else if(_==="end")$.x2=this.#B(j?.x,$.x2),$.y2=this.#B(j?.y,$.y2);else return;let X=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{...X,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#z(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#k()}}set value(J){let Q=this.#Y(J);this.#T(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-point",TJ);class o extends HTMLElement{static observedAttributes=["name","open","show-reset","disabled","size"];static#Z=["propskit-color","propskit-fill","propskit-gradient","propskit-number","propskit-position","propskit-color-point","propskit-point-radius","propskit-point-radius-angle","propskit-point-point","propskit-select","propskit-slider","propskit-switch","propskit-text","propskit-wheel","propskit-oscillator"].join(",");#Q=null;#J=null;#j=null;#$=null;#G=0;#X=()=>this.#B();connectedCallback(){this.#V(),this.#N(),this.#L(),this.#_(),requestAnimationFrame(()=>{this.#T()})}disconnectedCallback(){if(this.#q(),this.#G)cancelAnimationFrame(this.#G),this.#G=0;this.#Q?.removeEventListener("click",this.#k),this.#Q?.removeEventListener("keydown",this.#Y),this.#j?.querySelector("fig-button")?.removeEventListener("click",this.#M)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="open"){this.#Q?.setAttribute("aria-expanded",String(this.open));return}if(J==="show-reset"){this.#H(),this.#T();return}if(J==="disabled"){this.#N();return}if(J==="size"){this.#L();return}this.#V()}get open(){let J=this.getAttribute("open");return J!==null&&J!=="false"}set open(J){let Q=this.open;if(J)this.setAttribute("open","true");else this.setAttribute("open","false");if(this.#Q?.setAttribute("aria-expanded",String(!!J)),Q!==!!J)this.dispatchEvent(new CustomEvent("openchange",{detail:{open:!!J},bubbles:!0}))}get showReset(){let J=this.getAttribute("show-reset");if(J===null)return!0;return J!=="false"}set showReset(J){if(J)this.setAttribute("show-reset","true");else this.setAttribute("show-reset","false")}get dirty(){return this.hasAttribute("data-dirty")&&this.getAttribute("data-dirty")!=="false"}resetProperties(){this.#z()}#_(){if(this.removeEventListener("input",this.#X,!0),this.removeEventListener("change",this.#X,!0),this.addEventListener("input",this.#X,!0),this.addEventListener("change",this.#X,!0),!this.#$)this.#$=new MutationObserver(()=>{this.#N(),this.#L(),this.#B()});this.#$.disconnect(),this.#$.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","checked","default","x","y"]})}#q(){this.removeEventListener("input",this.#X,!0),this.removeEventListener("change",this.#X,!0),this.#$?.disconnect()}#B(){if(this.#G)return;this.#G=requestAnimationFrame(()=>{this.#G=0,this.#T()})}#O(J){return J instanceof Element&&Boolean(J.closest(".propskit-group-reset, .propskit-group-reset-tooltip"))}#k=(J)=>{if(Y(this,"disabled"))return;if(this.#O(J.target))return;J.stopPropagation(),this.open=!this.open};#Y=(J)=>{if(Y(this,"disabled"))return;if(this.#O(J.target))return;if(J.key!=="Enter"&&J.key!==" ")return;J.preventDefault(),J.stopPropagation(),this.open=!this.open};#M=(J)=>{if(J.preventDefault(),J.stopPropagation(),Y(this,"disabled"))return;this.#z()};#P(){return[...this.querySelectorAll(o.#Z)].filter((J)=>J.closest("propskit-group")===this&&!J.parentElement?.closest(o.#Z))}#N(){let J=Y(this,"disabled");for(let Q of this.#P())if(J){if(!Y(Q,"disabled"))Q.setAttribute("disabled",""),Q.setAttribute("data-propskit-group-disabled","")}else if(Q.hasAttribute("data-propskit-group-disabled"))Q.removeAttribute("disabled"),Q.removeAttribute("data-propskit-group-disabled");this.#Q?.setAttribute("aria-disabled",String(J)),this.#Q?.setAttribute("tabindex",J?"-1":"0"),this.#j?.querySelector("fig-button")?.toggleAttribute("disabled",J)}#L(){let J=this.getAttribute("size")==="small";for(let Q of this.#P()){let Z=Q.hasAttribute("data-propskit-group-size");if(J&&!Q.hasAttribute("size"))Q.setAttribute("data-propskit-group-size",""),Q.setAttribute("size","small");else if(J&&Z&&Q.getAttribute("size")!=="small")Q.setAttribute("size","small");else if(!J&&Z)Q.removeAttribute("size"),Q.removeAttribute("data-propskit-group-size")}}#U(J){return J.isDefault===!1}#K(){for(let J of this.#P())if(this.#U(J))return!0;return!1}#T(){if(this.#K())this.setAttribute("data-dirty","");else this.removeAttribute("data-dirty");this.#H()}#F(J){if(typeof J.resetToDefault==="function")J.resetToDefault()}#z(){for(let J of this.#P())this.#F(J);this.#T(),this.dispatchEvent(new CustomEvent("reset",{bubbles:!0,composed:!0}))}#H(){if(!this.showReset){this.#j?.setAttribute("hidden","");return}this.#S(),this.#j?.removeAttribute("hidden")}#S(){if(!this.#Q||!this.showReset)return;let J=this.#Q.querySelector(":scope > .propskit-group-reset-tooltip");if(!J){J=document.createElement("fig-tooltip"),J.className="propskit-group-reset-tooltip",J.setAttribute("text","Reset properties");let Q=document.createElement("fig-button");Q.className="propskit-group-reset",Q.setAttribute("variant","ghost"),Q.setAttribute("icon",""),Q.setAttribute("aria-label","Reset properties");let Z=document.createElement("fig-icon");Z.setAttribute("name","reset"),Q.appendChild(Z),J.appendChild(Q),this.#Q.appendChild(J),Q.addEventListener("click",this.#M)}else{let Q=J.querySelector("fig-button");Q?.removeEventListener("click",this.#M),Q?.addEventListener("click",this.#M)}this.#j=J}#V(){let Q=this.getAttribute("name")||"Group",Z=this.querySelector(":scope > fig-header");if(Z)this.#Q=Z;else if(!this.#Q||!this.#Q.dataset.generated||this.#Q.parentElement!==this)this.#Q=document.createElement("fig-header"),this.#Q.setAttribute("borderless",""),this.#Q.dataset.generated="true",this.prepend(this.#Q);let $=this.#Q.querySelector(":scope > h3"),j=this.#Q.querySelector(":scope > fig-button.propskit-group-disclosure");if(!$&&j){if($=j.querySelector(":scope > h3"),$)this.#Q.insertBefore($,j);j.remove()}if(!$)$=document.createElement("h3"),this.#Q.prepend($);let _=$.querySelector(":scope > button.propskit-group-disclosure");if(_){while(_.firstChild)$.insertBefore(_.firstChild,_);_.remove()}if(!$.id)$.id=jJ("propskit-group");if(this.#Q.dataset.generated){let X=$.querySelector(".propskit-group-chevron");if($.textContent=Q,X)$.prepend(X)}if(!this.hasAttribute("role"))this.setAttribute("role","group");if(!this.hasAttribute("aria-label")&&!this.hasAttribute("aria-labelledby"))this.setAttribute("aria-labelledby",$.id);if(!$.querySelector(".propskit-group-chevron")){let X=document.createElement("fig-icon");X.setAttribute("name","chevron"),X.setAttribute("size","small"),X.className="propskit-group-chevron",$.prepend(X)}if(this.#J=$.querySelector(".propskit-group-chevron"),this.#H(),this.#Q.setAttribute("role","button"),this.#N(),this.#Q.setAttribute("aria-expanded",String(this.open)),this.#Q.removeEventListener("click",this.#k),this.#Q.addEventListener("click",this.#k),this.#Q.removeEventListener("keydown",this.#Y),this.#Q.addEventListener("keydown",this.#Y),!this.hasAttribute("open"))this.setAttribute("open","false"),this.#Q.setAttribute("aria-expanded","false")}}L("propskit-group",o);class FJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=0;#_=0;#q=null;#B=null;#O=0;#k=null;#Y=null;#M=!1;#P=0;#N=null;#L=0;#U=null;#K=null;#T=0;#F=0;#z=!1;#H=!1;#S=0;#V=null;#R=null;#I=this.#jJ.bind(this);#w=this.#n.bind(this);#f=this.#NJ.bind(this);#E=this.#MJ.bind(this);#p=this.#kJ.bind(this);#D=this.#o.bind(this);#c=this.#UJ.bind(this);#b=this.#TJ.bind(this);#C=this.#FJ.bind(this);#W=this.#d.bind(this);#v=new Set(["variant","color","text","full","elastic","size","name","class","data-wave-index","data-active","data-elastic-dragging","default","style"]);static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#x();if(this.#m(),this.#g(),this.#JJ(),this.#t(),this.removeEventListener("pointerdown",this.#I,{capture:!0}),this.addEventListener("pointerdown",this.#I,{capture:!0,passive:!0}),this.removeEventListener("pointerdown",this.#E,{capture:!0}),this.addEventListener("pointerdown",this.#E,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.addEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#W,!0),this.addEventListener("click",this.#W,!0),this.#B?.removeEventListener("change",this.#C),this.#B?.addEventListener("change",this.#C),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J)if($.type==="attributes"){if($.attributeName==="value"){this.#s();continue}if($.attributeName==="color"){Z=!0;continue}if($.attributeName&&this.#v.has($.attributeName))continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#m();if(Z)this.#g(),this.#t()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){if(this.#$?.disconnect(),this.#X)cancelAnimationFrame(this.#X),this.#X=0;if(this.#_)cancelAnimationFrame(this.#_),this.#_=0;this.#e(),this.#$J(),clearTimeout(this.#S),this.#S=0,this.#_J(),this.#OJ(),this.#LJ(),this.#QJ(),this.removeEventListener("pointerdown",this.#I,{capture:!0}),this.removeEventListener("pointerdown",this.#E,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#W,!0),this.#B?.removeEventListener("change",this.#C)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#m()}#x(){let J=(this.getAttribute("type")||"range").toLowerCase();this.#Y=this.getAttribute("value")??this.getAttribute("default")??(J==="delta"?"0":this.getAttribute("min")??"0");let Q=Array.from(this.childNodes).filter((X)=>{return X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())}),Z=Q.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),$=document.createElement("fig-field"),j=Z||document.createElement("label"),_=document.createElement("fig-slider");_.setAttribute("text","true");for(let X of this.#l()){let q=this.getAttribute(X);_.setAttribute(X,q??"")}$.append(j,_),this.#Z=$,this.#Q=j,this.#J=_,this.#j=Boolean(Z),this.replaceChildren($),this.#y();for(let X of Q){if(X===Z)continue;this.#J.appendChild(X)}}#y(){let J=document.createElement("fig-menu");J.setAttribute("position","bottom left"),J.setAttribute("offset","0 0");let Q=document.createElement("fig-menu-item");Q.setAttribute("value","reset-default"),Q.textContent="Reset",J.appendChild(Q),J.addEventListener("change",this.#C),this.#B=J,this.appendChild(J)}#m(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()===""){if(this.#Q.parentElement===this.#Z)this.#Q.remove()}else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#g(){if(!this.#J)return;let J=this.#l(),Q=new Set(J.filter(($)=>$!=="text"&&$!=="value"));for(let $ of this.#G)if(!Q.has($))this.#J.removeAttribute($);for(let $ of J){if($==="text"||$==="value")continue;let j=this.getAttribute($)??"";if(this.#J.getAttribute($)!==j)this.#J.setAttribute($,j)}this.#J.removeAttribute("variant"),this.#J.removeAttribute("color"),this.#J.removeAttribute("transform"),this.#J.removeAttribute("full"),this.#J.setAttribute("text","true");let Z=(this.getAttribute("type")||"range").toLowerCase();if(Z==="delta"){let $=Number(this.#J.min),j=Number(this.#J.max),_=Number.isFinite($)&&Number.isFinite(j)?$+(j-$)/2:0;this.#J.setAttribute("default",String(_))}else this.#J.removeAttribute("default");if(Z==="stepper")this.#J.setAttribute("step",this.getAttribute("step")??"10");else if(!this.hasAttribute("step"))this.#J.removeAttribute("step");if(Z==="opacity")this.#J.style.setProperty("--color",this.getAttribute("color")||"var(--figma-color-bg-secondary)");else this.#J.style.removeProperty("--color");this.#a(Z),this.#G=Q,this.#s(),this.#ZJ()}#a(J){let Q=this.#J?.querySelector("fig-input-number");if(!(J==="hue"||J==="opacity"&&this.hasAttribute("color"))){Q?.removeAttribute("theme"),this.style.removeProperty("--propskit-slider-filled-text-color");return}let $=Number(this.#J?.min),j=Number(this.#J?.max),_=Number(this.#J?.value),X=Number.isFinite($)&&Number.isFinite(j)&&j>$&&Number.isFinite(_)?Math.max(0,Math.min(1,(_-$)/(j-$))):0,q=this.getAttribute("color"),B=J==="hue"?`hsl(${X*360}deg 100% 50%)`:`color-mix(in srgb, ${q} ${X*100}%, var(--figma-color-bg-secondary))`,O=getComputedStyle(this).colorScheme.trim().toLowerCase()==="dark",G=RJ(this.#J,B,J==="hue"?0.35:O?0.2:0.35);if(G){Q?.setAttribute("theme",G);let M=G==="light"&&O||G==="dark"&&!O;this.style.setProperty("--propskit-slider-filled-text-color",M?"var(--figma-color-text)":"var(--figma-color-text-oninverse)")}else Q?.removeAttribute("theme"),this.style.removeProperty("--propskit-slider-filled-text-color")}#A(){if(!this.#J)return;let J=Number(this.#J.min),Q=Number(this.#J.max),Z=Number(this.#J.value),$=Number.isFinite(J)&&Number.isFinite(Q)&&Q>J&&Number.isFinite(Z)?Math.max(0,Math.min(1,(Z-J)/(Q-J))):0;this.style.setProperty("--propskit-slider-complete",String($)),this.#a((this.getAttribute("type")||"range").toLowerCase())}#s(){if(!this.#J)return;let J=this.hasAttribute("value")?this.getAttribute("value")??"":this.#Y??"";if(String(this.#J.value)!==J)this.#J.value=J;this.#A()}#l(){let J=new Set(["label","direction","oninput","onchange","steppers"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!this.#v.has(Q))}#ZJ(){if(this.#X)cancelAnimationFrame(this.#X);this.#X=requestAnimationFrame(()=>{this.#X=0,this.#u(),this.#h()})}#t(){if(this.#_)cancelAnimationFrame(this.#_);this.#_=requestAnimationFrame(()=>{this.#_=0,this.#h()})}#h(){let J=this.#J?.querySelector('input[type="range"]'),Q=this.#J?.querySelector("fig-input-number input");if(J!==this.#q)this.#GJ(J);if(J){J.removeAttribute("tabindex"),J.removeAttribute("aria-hidden");let Z=this.getAttribute("aria-label")||this.#Q?.textContent?.trim()||"Slider";if(!J.hasAttribute("aria-label")&&!J.hasAttribute("aria-labelledby"))J.setAttribute("aria-label",Z)}if(Q)Q.removeAttribute("tabindex"),Q.removeAttribute("aria-hidden")}#d(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#H&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#H=!1;return}this.#YJ()}#YJ(){requestAnimationFrame(()=>{requestAnimationFrame(()=>{if(this.isConnected&&!Y(this,"disabled"))this.focus()})})}#GJ(J){if(this.#LJ(),this.#q=J,!this.#q)return;this.#q.addEventListener("dblclick",this.#c,{capture:!0})}#LJ(){if(!this.#q)return;this.#q.removeEventListener("dblclick",this.#c,{capture:!0}),this.#q=null}#UJ(J){J.preventDefault(),J.stopImmediatePropagation(),this.#WJ()}#MJ(J){if(J.button!==0||J.altKey||Y(this,"disabled")||!(J.target instanceof Element))return;let Q=J.target.closest("fig-input-number input");if(!Q||Q===document.activeElement)return;J.preventDefault(),J.stopImmediatePropagation(),this.#$J(),this.#K=J.pointerId,this.#T=J.clientX,this.#F=J.clientY,this.#z=!1,window.addEventListener("pointermove",this.#p),window.addEventListener("pointerup",this.#D,{once:!0}),window.addEventListener("pointercancel",this.#D,{once:!0}),window.addEventListener("blur",this.#D,{once:!0})}#kJ(J){if(J.pointerId!==this.#K)return;if(J.buttons===0){this.#o(J);return}if(!this.#z){if(Math.hypot(J.clientX-this.#T,J.clientY-this.#F)<4)return;this.#z=!0,this.setAttribute("data-number-scrubbing","")}this.#BJ(this.#HJ(J),"input")}#o(J){if(J?.pointerId!==void 0&&this.#K!==null&&J.pointerId!==this.#K)return;let Q=this.#z;if(this.#$J(),Q){this.#BJ(this.#J?.value,"change"),this.#H=!0,clearTimeout(this.#S),this.#S=window.setTimeout(()=>{this.#H=!1,this.#S=0},0),this.#YJ();return}this.#J?.querySelector("fig-input-number input")?.focus()}#$J(){window.removeEventListener("pointermove",this.#p),window.removeEventListener("pointerup",this.#D),window.removeEventListener("pointercancel",this.#D),window.removeEventListener("blur",this.#D),this.#K=null,this.#z=!1,this.removeAttribute("data-number-scrubbing")}#jJ(J){if(J.button!==0||Y(this,"disabled"))return;if(this.getAttribute("elastic")==="false")return;if(J.target?.closest?.("fig-input-number"))return;let Q=this.#J?.querySelector('input[type="range"]')??this.#q;if(!Q)return;this.#_J(),this.#OJ(),this.#q=Q,this.#M=!0,this.#U=J.pointerId,this.#P=this.#zJ();let Z=Q.getBoundingClientRect(),$=this.getBoundingClientRect();this.#N={left:Z.left,right:Z.right,width:Z.width},this.#L=$.width,window.addEventListener("pointermove",this.#w,{passive:!0}),window.addEventListener("pointerup",this.#f,{once:!0}),window.addEventListener("pointercancel",this.#f,{once:!0}),window.addEventListener("blur",this.#f,{once:!0})}#n(J){if(!this.#M)return;if(J.pointerId!==this.#U)return;if(J.buttons===0){this.#NJ(J);return}this.#r(J.clientX)}#NJ(J){if(J?.pointerId!==void 0&&this.#U!==null&&J.pointerId!==this.#U)return;let Q=J?.type==="pointerup"||J?.type==="pointermove"&&J.buttons===0;if(this.#_J(),this.#OJ(),Q)this.#YJ()}#_J(){window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f),this.#M=!1,this.#U=null}#TJ(J){if(Y(this,"disabled"))return;J.preventDefault(),J.stopPropagation(),J.stopImmediatePropagation(),this.#e(),this.#KJ(J.clientX,J.clientY)}#KJ(J,Q){let Z=!1,$=0,j=()=>{if(Z)return;Z=!0,window.clearTimeout($),window.removeEventListener("pointerup",j,!0),window.removeEventListener("pointercancel",j,!0),requestAnimationFrame(()=>{this.#B?.showAt?.(J,Q)})};window.addEventListener("pointerup",j,{once:!0,capture:!0}),window.addEventListener("pointercancel",j,{once:!0,capture:!0}),$=window.setTimeout(j,180)}#FJ(J){if(J.stopPropagation(),J.detail?.value!=="reset-default")return;this.#WJ()}#e(){if(this.#O)clearTimeout(this.#O),this.#O=0;this.#k=null}#zJ(){let J=getComputedStyle(this).getPropertyValue("--propskit-slider-elastic-distance").trim();if(J.includes("var(")||!J.endsWith("px")){let Z=document.createElement("div");Object.assign(Z.style,{position:"absolute",visibility:"hidden",pointerEvents:"none",width:"var(--propskit-slider-elastic-distance)"}),this.appendChild(Z),J=getComputedStyle(Z).width,Z.remove()}let Q=Number.parseFloat(J);return Number.isFinite(Q)?Math.max(0,Q):0}#r(J){let Q=this.#N;if(!Q||!this.#P){this.#OJ();return}let Z=J<Q.left?J-Q.left:J>Q.right?J-Q.right:0;if(!Z){this.#XJ();return}let $=Math.max(-this.#P,Math.min(this.#P,Z*0.5)),j=Math.abs($),_=this.#L?(this.#L+j)/this.#L:1;this.dataset.elasticDragging="true",this.style.setProperty("--propskit-slider-elastic-size",`${j}px`),this.style.setProperty("--propskit-slider-elastic-scale",`${_}`),this.style.setProperty("--propskit-slider-elastic-origin",$<0?"right center":"left center")}#OJ(){this.#XJ(),this.#P=0,this.#N=null,this.#L=0,this.#U=null}#XJ(){this.removeAttribute("data-elastic-dragging"),this.style.removeProperty("--propskit-slider-elastic-size"),this.style.removeProperty("--propskit-slider-elastic-scale")}#HJ(J){let Q=this.#q;if(!Q)return this.#J?.value??"";let Z=Q.getBoundingClientRect(),$=Z.width?Math.min(1,Math.max(0,(J.clientX-Z.left)/Z.width)):0,j=Number(Q.min||0),_=Number(Q.max||100),X=Q.step==="any"?0:Number(Q.step||1),q=j+(_-j)*$;if(!X)return String(q);let B=Math.round((q-j)/X)*X+j,O=Math.max(0,`${X}`.split(".")[1]?.length||0);return String(Number(B.toFixed(O)))}#SJ(){return this.getAttribute("default")??this.#Y??this.#q?.min??"0"}#WJ(){this.#e(),this.#BJ(this.#SJ(),"input"),this.#BJ(this.#SJ(),"change")}#BJ(J,Q){if(!this.#J||J===null||J===void 0)return;this.#J.value=J,this.setAttribute("value",String(this.#J.value)),this.dispatchEvent(new CustomEvent(Q,{detail:this.#J.value,bubbles:!0,cancelable:!0,composed:!0}))}#u(){if(!this.#J)return;let J=this.#J.querySelector("fig-input-number");if(!J)return;if(!(this.hasAttribute("steppers")&&this.getAttribute("steppers")!=="false")){J.removeAttribute("steppers");return}let Z=this.getAttribute("steppers");J.setAttribute("steppers",Z??"")}#JJ(){if(!this.#J)return;if(!this.#V)this.#V=this.#qJ.bind(this,"input");if(!this.#R)this.#R=this.#qJ.bind(this,"change");this.#J.addEventListener("input",this.#V),this.#J.addEventListener("change",this.#R)}#QJ(){if(!this.#J)return;if(this.#V)this.#J.removeEventListener("input",this.#V);if(this.#R)this.#J.removeEventListener("change",this.#R)}#qJ(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;if(J==="change")this.#OJ();let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;if(this.#J?.value!==void 0){let $=String(this.#J.value);if(this.getAttribute("value")!==$)this.setAttribute("value",$)}this.#A(),this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){this.#h();let Q=this.#J?.querySelector('input[type="range"]');Q?.setAttribute("data-propskit-focus-called",""),Q?.focus(J)}get value(){return this.getAttribute("value")??this.#J?.value??""}set value(J){if(J===null||J===void 0||J===""){if(this.removeAttribute("value"),this.#J)this.#J.value="";return}let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}get defaultValue(){return this.#SJ()}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){this.#WJ()}}L("propskit-slider",FJ);class E extends HTMLElement{static#Z=33;static#Q=60;static#J=0.55;static#j="fig-input-wheel-dragging";#$=null;#G=null;#X=null;#_=null;#q=null;#B=null;#O=null;#k=0;#Y=0;#M=0;#P=0;#N=0;#L=null;#U=!1;#K=null;#T=0;#F=0;#z=null;#H=0;#S=0;#V=null;#R=0;#I=this.#LJ.bind(this);#w=this.#UJ.bind(this);#f=this.#kJ.bind(this);#E=this.#TJ.bind(this);#p=this.#KJ.bind(this);static get observedAttributes(){return["value","disabled","step","min","max","elastic"]}connectedCallback(){if(!this.#$)this.#D();if(this.#ZJ(),this.#s(),this.#YJ(),this.#L?.disconnect(),globalThis.ResizeObserver)this.#L=new ResizeObserver((J)=>{let Q=J.at(-1)?.contentRect;if(Q)this.#t(Q.width,Q.height)}),this.#L.observe(this);this.#h()}disconnectedCallback(){if(this.#L?.disconnect(),this.#M)cancelAnimationFrame(this.#M);this.#M=0,this.#e(),this.#GJ(),this.#o()}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if(J==="disabled")this.#ZJ();if(J==="value"&&!this.#U)this.#s();if(J==="step")this.#l(),this.#h();if(J==="min"||J==="max")this.#A(this.#W())}#D(){if(this.#$=this,this.#G=this,this.#X=this,this.setAttribute("role","spinbutton"),!this.hasAttribute("aria-label")&&!this.hasAttribute("aria-labelledby"))this.setAttribute("aria-label","Value");this.setAttribute("tabindex","0");let J=A("svg",{className:"fig-input-wheel-svg","aria-hidden":"true"}),Q=P("div",{className:"fig-input-wheel-handle"});this.#_=J,this.replaceChildren(J,Q);let Z=document.createElement("div");Z.setAttribute("aria-hidden","true"),Z.style.cssText="position:absolute;visibility:hidden;pointer-events:none;left:0;top:0";let $=document.createElement("div");$.style.height="var(--fig-input-wheel-tick-height)";let j=document.createElement("div");j.style.height="var(--fig-input-wheel-tick-height-min)";let _=document.createElement("div");_.style.width="var(--fig-input-wheel-tick-width)";let X=document.createElement("div");X.style.width="var(--fig-input-wheel-tick-width-min)",Z.append($,j,_,X),this.append(Z),this.#O={maxEl:$,minEl:j,maxWidthEl:_,minWidthEl:X},this.#c()}#c(){if(!this.#_||this.#q)return;this.#q=A("path",{className:"fig-input-wheel-tick"}),this.#_.append(this.#q)}#b(){if(this.#B)return this.#B;return this.#B={maxH:this.#O?.maxEl.getBoundingClientRect().height||8,minH:this.#O?.minEl.getBoundingClientRect().height||4,maxW:this.#O?.maxWidthEl.getBoundingClientRect().width||2,minW:this.#O?.minWidthEl.getBoundingClientRect().width||1},this.#B}#C(){if(this.hasAttribute("step")){let J=Number(this.getAttribute("step"));if(J>0)return J}return 1}#W(){let J=Number(this.getAttribute("value")??0);return Number.isFinite(J)?J:0}#v(J){if(!this.hasAttribute(J))return null;let Q=this.getAttribute(J);if(Q===null||Q.trim()==="")return null;let Z=Number(Q);return Number.isFinite(Z)?Z:null}#x(){return this.#v("min")}#y(){return this.#v("max")}#m(J,Q){if(Q===null||Q===void 0||Q===""){this.removeAttribute(J);return}let Z=Number(Q);if(!Number.isFinite(Z)){this.removeAttribute(J);return}this.setAttribute(J,String(Z))}#g(J){let Q=J,Z=this.#x(),$=this.#y();if(Z!==null)Q=Math.max(Z,Q);if($!==null)Q=Math.min($,Q);return Q}#a(J){let Q=this.#C();if(Q<=0)return J;let Z=this.#x()??0,$=Math.round((J-Z)/Q)*Q+Z;return Number($.toPrecision(15))}#A(J,{snap:Q=!1,emit:Z=null}={}){let $=Q?this.#a(J):J;$=this.#g($);let j=String($);if(this.getAttribute("value")!==j)this.setAttribute("value",j);if(this.#l($),this.#h(),Z)this.dispatchEvent(new CustomEvent(Z,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#s(){let J=this.#W(),Q=this.#g(J);if(Q!==J||this.getAttribute("value")!==String(Q)){this.#A(Q);return}this.#l(J),this.#h()}#l(J=this.#W()){if(!this.#X)return;let Q=this.#x(),Z=this.#y();if(this.#X.setAttribute("aria-valuenow",String(J)),this.#X.setAttribute("aria-valuetext",String(J)),Q===null)this.#X.removeAttribute("aria-valuemin");else this.#X.setAttribute("aria-valuemin",String(Q));if(Z===null)this.#X.removeAttribute("aria-valuemax");else this.#X.setAttribute("aria-valuemax",String(Z))}#ZJ(){let J=Y(this,"disabled");if(!this.#X)return;if(J){if(this.#U)this.#o();this.#e(),this.setAttribute("aria-disabled","true"),this.#X.setAttribute("tabindex","-1"),this.#X.setAttribute("aria-disabled","true")}else this.removeAttribute("aria-disabled"),this.#X.setAttribute("tabindex","0"),this.#X.removeAttribute("aria-disabled")}#t(J,Q){if(!this.#_||J<1||Q<1)return;if(J===this.#k&&Q===this.#Y)return;this.#k=J,this.#Y=Q,this.#B=null,this.#_.setAttribute("viewBox",`0 0 ${J} ${Q}`),this.#_.setAttribute("width",String(J)),this.#_.setAttribute("height",String(Q)),this.#h()}#h(){if(this.#M)return;this.#M=requestAnimationFrame(()=>{if(!this.isConnected){this.#M=0;return}if(this.#k<1||this.#Y<1){let J=this.#X?.getBoundingClientRect();if(J)this.#t(J.width,J.height)}this.#d(),this.#M=0})}#d(){if(!this.#q)return;let J=this.#k,Q=this.#Y;if(J<1||Q<1)return;let Z=this.#z??this.#W(),$=360/E.#Z,j=this.#C(),_=this.#x()??0,X=(Z-_)/j*$,q=E.#J,B=J/2,O=Q/2,{maxH:G,minH:M,maxW:k,minW:U}=this.#b(),N=E.#Q,T=Math.max(J/2,1),F=T*0.84,H=[];for(let z=0;z<E.#Z;z+=1){let S=X+z*$;if(S=((S+180)%360+360)%360-180,S<-N||S>=N)continue;let R=S*Math.PI/180,W=B+F*Math.sin(R)/(1-q*Math.cos(R)),f=Math.min(1,Math.abs(W-B)/Math.max(T,1)),I=Math.cos(f*Math.PI*0.5),C=M+(G-M)*I,l=U+(k-U)*I,s=C/2,b=l/2,y=O-s,c=O+s,d=W-b,i=W+b;H.push(`M ${W} ${y} Q ${i} ${y} ${i} ${y+b} V ${c-b} Q ${i} ${c} ${W} ${c} Q ${d} ${c} ${d} ${c-b} V ${y+b} Q ${d} ${y} ${W} ${y} Z`)}this.#q.setAttribute("d",H.join(" "))}#YJ(){this.#$?.addEventListener("pointerdown",this.#I),this.#X?.addEventListener("wheel",this.#E,{passive:!1}),this.#X?.addEventListener("keydown",this.#p)}#GJ(){this.#$?.removeEventListener("pointerdown",this.#I),this.#X?.removeEventListener("wheel",this.#E),this.#X?.removeEventListener("keydown",this.#p),window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f)}#LJ(J){if(Y(this,"disabled"))return;if(J.button!==0)return;if(J.preventDefault(),!this.beginScrub(J))return;this.#$?.setPointerCapture?.(J.pointerId),window.addEventListener("pointermove",this.#w),window.addEventListener("pointerup",this.#f),window.addEventListener("pointercancel",this.#f)}beginScrub(J={}){if(Y(this,"disabled"))return!1;let Q=typeof J==="number"?J:Number(J?.clientX??J?.x);if(!Number.isFinite(Q))return!1;this.#e(),this.#U=!0,this.#K=J&&typeof J==="object"&&J.pointerId!==void 0?J.pointerId:null,this.#T=Q;let Z=J&&typeof J==="object"?Number(J.startValue):Number.NaN;return this.#F=Number.isFinite(Z)?this.#g(Z):this.#W(),this.#$J(),this.setAttribute("data-fig-input-wheel-active",""),document.body.classList.add(E.#j),this.focus(),!0}updateScrub(J,Q){if(!this.#U)return this.#W();let Z=typeof J==="number"?J:Number(J?.clientX??J?.x);if(!Number.isFinite(Z))return this.#W();let $=Q??(typeof J==="object"&&J?.shiftKey?10:1);return this.#MJ(Z,$),this.#W()}endScrub(J=!0){if(!this.#U)return this.#W();if(J&&this.#W()!==this.#F)this.#A(this.#W(),{snap:!0,emit:"change"});return this.#o(),this.#W()}#UJ(J){if(!this.#U)return;if(this.#K!==null&&J.pointerId!==this.#K)return;this.updateScrub(J)}#MJ(J,Q=1){let Z=this.#X?.clientWidth||1,$=E.#Z*(E.#Q*2/360),j=this.#C()*$,_=(J-this.#T)*(j/Z)*Q,X=this.#g(this.#F+_);this.#z=X,this.#A(X,{snap:!0,emit:"input"}),this.#n(J)}#kJ(J){if(!this.#U)return;if(this.#K!==null&&J.pointerId!==this.#K)return;this.endScrub()}#o(){this.#U=!1,this.#K=null,this.#z=null,this.removeAttribute("data-fig-input-wheel-active"),document.body.classList.remove(E.#j),this.#NJ(),window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),this.#h()}#$J(){if(this.#NJ(),this.getAttribute("elastic")==="false")return;this.#H=this.#jJ("--fig-input-wheel-handle-drag-max"),this.#S=this.#jJ("--fig-input-wheel-elastic-distance");let J=this.#X?.getBoundingClientRect();if(J)this.#V={left:J.left,right:J.right};this.#R=this.getBoundingClientRect().width}#jJ(J){let Q=getComputedStyle(this).getPropertyValue(J).trim();if(Q.includes("var(")||!Q.endsWith("px")){let $=document.createElement("div");Object.assign($.style,{position:"absolute",visibility:"hidden",pointerEvents:"none",width:`var(${J})`}),this.appendChild($),Q=getComputedStyle($).width,$.remove()}let Z=Number.parseFloat(Q);return Number.isFinite(Z)?Math.max(0,Z):0}#n(J){if(!this.#H&&!this.#S){this.#_J();return}let Q=J-this.#T;if(!Q){this.#_J();return}let Z=this.#H*Math.tanh(Q/Math.max(1,this.#H*3));this.setAttribute("data-fig-input-wheel-elastic-dragging",""),this.style.setProperty("--fig-input-wheel-handle-drag-offset",`${Z}px`);let $=this.#V,j=$?J<$.left?J-$.left:J>$.right?J-$.right:0:0;if(!j||!this.#S){this.style.removeProperty("--fig-input-wheel-elastic-scale"),this.style.removeProperty("--fig-input-wheel-elastic-origin");return}let _=Math.min(this.#S,Math.abs(j)*0.5),X=this.#R?(this.#R+_)/this.#R:1;this.style.setProperty("--fig-input-wheel-elastic-scale",`${X}`),this.style.setProperty("--fig-input-wheel-elastic-origin",j<0?"right center":"left center")}#NJ(){this.#_J(),this.#H=0,this.#S=0,this.#V=null,this.#R=0}#_J(){this.removeAttribute("data-fig-input-wheel-elastic-dragging"),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.style.removeProperty("--fig-input-wheel-elastic-scale"),this.style.removeProperty("--fig-input-wheel-elastic-origin")}#TJ(J){if(Y(this,"disabled"))return;J.preventDefault();let Q=J.deltaY===0?Math.sign(J.deltaX):Math.sign(J.deltaY);if(!Q)return;let Z=J.shiftKey?10:1;this.#A(this.#W()+this.#C()*Z*Q,{snap:!0,emit:"input"}),this.#A(this.#W(),{emit:"change"})}#KJ(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number"))return;if(J.key==="Home"){let _=this.#x();if(_===null)return;J.preventDefault(),this.#A(_,{snap:!0,emit:"input"}),this.#A(this.#W(),{emit:"change"});return}if(J.key==="End"){let _=this.#y();if(_===null)return;J.preventDefault(),this.#A(_,{snap:!0,emit:"input"}),this.#A(this.#W(),{emit:"change"});return}if(!["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(J.key))return;J.preventDefault();let Z=J.key==="ArrowRight"||J.key==="ArrowUp"?1:-1,$=J.shiftKey?10:1,j=this.#W();this.#A(j+this.#C()*$*Z,{snap:!0,emit:"input"}),this.#FJ(j,this.#W(),Z,$),this.#A(this.#W(),{emit:"change"})}#FJ(J,Q,Z,$){if(J===Q||globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches){this.#e();return}if(this.#P)cancelAnimationFrame(this.#P),this.#P=0;clearTimeout(this.#N),this.#N=0,this.removeAttribute("data-fig-input-wheel-keyboard-settling");let j=this.#z??J,_=Number.parseFloat(this.style.getPropertyValue("--fig-input-wheel-handle-drag-offset"))||0,X=$>1?120:90,q=performance.now(),B=this.getAttribute("elastic")!=="false";this.setAttribute("data-fig-input-wheel-keyboard-moving","");let O=(G)=>{let M=Math.min(1,(G-q)/X);if(this.#z=j+(Q-j)*M,B){let k=Math.sin(M*Math.PI/2),U=_+(Z*4-_)*k;this.style.setProperty("--fig-input-wheel-handle-drag-offset",`${U}px`)}if(this.#d(),M<1){this.#P=requestAnimationFrame(O);return}this.#P=0,this.#z=null,this.removeAttribute("data-fig-input-wheel-keyboard-moving"),this.setAttribute("data-fig-input-wheel-keyboard-settling",""),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.#N=window.setTimeout(()=>{this.removeAttribute("data-fig-input-wheel-keyboard-settling"),this.#N=0},140),this.#h()};this.#P=requestAnimationFrame(O)}#e(){if(this.#P)cancelAnimationFrame(this.#P),this.#P=0;if(clearTimeout(this.#N),this.#N=0,this.#z=null,this.removeAttribute("data-fig-input-wheel-keyboard-moving"),this.removeAttribute("data-fig-input-wheel-keyboard-settling"),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.isConnected)this.#h()}get value(){return this.getAttribute("value")??"0"}set value(J){if(J===null||J===void 0||J===""){this.#A(0);return}let Q=Number(J);this.#A(Number.isFinite(Q)?Q:0)}get min(){return this.#x()}set min(J){this.#m("min",J)}get max(){return this.#y()}set max(J){this.#m("max",J)}get step(){return this.#C()}focus(J){HTMLElement.prototype.focus.call(this,J)}}L("fig-input-wheel",E);class u extends HTMLElement{static#Z=new Set(["label","size","disabled","variant","elastic","text","default","class","style","id","oninput","onchange"]);static get observedAttributes(){return["label","units","value","disabled","step","precision","min","max","elastic","text"]}#Q=null;#J=null;#j=null;#$=null;#G=!1;#X=null;#_=null;#q=new Set;#B=null;#O=null;#k=0;#Y=0;#M=0;#P=!1;#N=!1;#L=0;#U=this.#A.bind(this,"input");#K=this.#A.bind(this,"change");#T=this.#s.bind(this,"input");#F=this.#s.bind(this,"change");#z=this.#l.bind(this);#H=this.#ZJ.bind(this);#S=this.#t.bind(this);#V=this.#d.bind(this);connectedCallback(){if(!this.#Q)this.#R();if(this.#I(),this.#w(),this.#E(),this.#x(),this.#y(),V(this),this.#X?.disconnect(),this.#X=new MutationObserver((J)=>{if(J.some(({type:Q,attributeName:Z})=>Q==="attributes"&&Z&&!u.#Z.has(Z)&&!u.observedAttributes.includes(Z)&&!Z.startsWith("data-")))this.#x()}),this.#X.observe(this,{attributes:!0}),this.#_?.disconnect(),this.#_=new MutationObserver(()=>{this.#p()}),this.#J)this.#_.observe(this.#J,{attributes:!0,attributeFilter:["style","data-fig-input-wheel-elastic-dragging"]});this.#p()}disconnectedCallback(){this.#X?.disconnect(),this.#_?.disconnect(),this.#_=null,this.#D(),this.#m(),this.#h(),clearTimeout(this.#L),this.#L=0,this.#J?.endScrub(!1),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Q)return;if(J==="label")this.#I();if(J==="text")this.#w();if(["units","value","disabled","step","min","max","elastic"].includes(J))this.#E();if(["units","value","disabled","step","precision","min","max"].includes(J))this.#x()}#R(){this.#B=this.getAttribute("value")??"0";let J=Array.from(this.childNodes).filter((q)=>q.nodeType!==Node.TEXT_NODE||Boolean(q.textContent?.trim())),Q=J.find((q)=>q.nodeType===Node.ELEMENT_NODE&&q.matches("label")),Z=P("div",{className:"propskit-wheel-surface"}),$=Q||document.createElement("label"),j=document.createElement("fig-input-wheel"),_=document.createElement("fig-input-number"),X=jJ("propskit-wheel-label");$.id=X,j.setAttribute("aria-labelledby",X),_.setAttribute("aria-labelledby",X),Z.append($,j,_),this.#Q=Z,this.#J=j,this.#j=$,this.#$=_,this.#G=Boolean(Q),this.replaceChildren(Z);for(let q of J)if(q!==Q)_.appendChild(q)}#I(){if(!this.#j)return;if(!this.#G)this.#j.textContent=this.hasAttribute("label")?this.getAttribute("label")??"":"Value";this.toggleAttribute("data-label-empty",!(this.#j.textContent??"").trim())}#w(){if(!this.#Q||!this.#$)return;let J=this.getAttribute("text")!=="false",Q=this.#$.parentElement===this.#Q;if(J&&!Q)this.#Q.append(this.#$);else if(!J&&Q)this.#$.remove()}#f(J){if(!this.#J)return;if(this.hasAttribute(J))this.#J.setAttribute(J,this.getAttribute(J)??"");else this.#J.removeAttribute(J)}#E(){if(!this.#J)return;this.#J.removeAttribute("units");for(let Q of["min","max","elastic"])this.#f(Q);if(this.hasAttribute("step"))this.#f("step");else this.#J.setAttribute("step",String(this.#C()));this.#J.toggleAttribute("disabled",Y(this,"disabled")),this.#J.value=this.getAttribute("value")??"0";let J=this.#J.value;if(this.getAttribute("value")!==J)this.setAttribute("value",J);if(this.#$?.getAttribute("value")!==J)this.#$?.setAttribute("value",J);this.#v()}#p(){if(!this.#J)return;if(!this.#J.hasAttribute("data-fig-input-wheel-elastic-dragging")){this.#D();return}this.toggleAttribute("data-propskit-wheel-elastic-dragging",!0),this.style.setProperty("--propskit-wheel-elastic-scale",this.#J.style.getPropertyValue("--fig-input-wheel-elastic-scale")||"1"),this.style.setProperty("--propskit-wheel-elastic-origin",this.#J.style.getPropertyValue("--fig-input-wheel-elastic-origin")||"left center")}#D(){this.removeAttribute("data-propskit-wheel-elastic-dragging"),this.style.removeProperty("--propskit-wheel-elastic-scale"),this.style.removeProperty("--propskit-wheel-elastic-origin")}#c(){return this.getAttributeNames().filter((J)=>!u.#Z.has(J)&&!u.observedAttributes.includes(J)&&!J.startsWith("data-"))}#b(){let J=(this.getAttribute("units")||"").trim(),Q=J.toLowerCase();if(Q==="ms"||Q==="millisecond"||Q==="milliseconds")return"ms";if(Q==="s"||Q==="second"||Q==="seconds")return"s";return J}#C(){let J=this.#b();if(J==="s")return 0.1;if(J==="ms")return 100;return 1}#W(){return this.#b()==="s"?2:0}#v(){if(!this.#J)return;let J=Number(this.#J.value),Q=this.#b();this.#J.setAttribute("aria-valuetext",Q?`${J} ${Q==="s"?"seconds":Q==="ms"?"milliseconds":Q}`:String(J))}#x(){if(!this.#$||!this.#J)return;let J=this.#c(),Q=new Set(J);for(let $ of this.#q)if(!Q.has($))this.#$.removeAttribute($);for(let $ of J)this.#$.setAttribute($,this.getAttribute($)??"");let Z=this.#b();if(Z)this.#$.setAttribute("units",Z);else this.#$.removeAttribute("units");if(this.#$.setAttribute("step",String(this.#J.step)),this.hasAttribute("precision"))this.#$.setAttribute("precision",this.getAttribute("precision")??"");else this.#$.setAttribute("precision",String(this.#W()));for(let $ of["min","max"]){let j=this.#J[$];if(j===null)this.#$.removeAttribute($);else this.#$.setAttribute($,String(j))}this.#$.toggleAttribute("disabled",Y(this,"disabled")),this.#$.setAttribute("value",this.#J.value),this.#q=Q}#y(){this.#m(),this.#J?.addEventListener("input",this.#U),this.#J?.addEventListener("change",this.#K),this.#$?.addEventListener("input",this.#T),this.#$?.addEventListener("change",this.#F),this.addEventListener("pointerdown",this.#z,{capture:!0}),this.addEventListener("click",this.#V,!0)}#m(){this.#J?.removeEventListener("input",this.#U),this.#J?.removeEventListener("change",this.#K),this.#$?.removeEventListener("input",this.#T),this.#$?.removeEventListener("change",this.#F),this.removeEventListener("pointerdown",this.#z,{capture:!0}),this.removeEventListener("click",this.#V,!0)}#g(J){let Q=Number(J);if(!this.#J){let $=Number.isFinite(Q)?Q:0;return this.setAttribute("value",String($)),$}this.#J.value=Number.isFinite(Q)?Q:0;let Z=this.#J.value;if(this.getAttribute("value")!==Z)this.setAttribute("value",Z);if(this.#$?.getAttribute("value")!==Z)this.#$?.setAttribute("value",Z);return this.#v(),Number(Z)}#a(J,Q){this.dispatchEvent(new CustomEvent(J,{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}#A(J,Q){Q.stopImmediatePropagation();let Z=this.#g(Q.detail);this.#a(J,Z)}#s(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#$?.value,$=this.#g(Z);this.#a(J,$)}#l(J){if(J.button!==0||J.altKey||Y(this,"disabled")||!(J.target instanceof Element))return;let Q=J.target.closest("fig-input-number input");if(!Q||Q===document.activeElement)return;J.preventDefault(),J.stopImmediatePropagation(),this.#h(),this.#O=J.pointerId,this.#k=J.clientX,this.#Y=J.clientY,this.#M=Number(this.#J?.value??0),window.addEventListener("pointermove",this.#H),window.addEventListener("pointerup",this.#S,{once:!0}),window.addEventListener("pointercancel",this.#S,{once:!0}),window.addEventListener("blur",this.#S,{once:!0})}#ZJ(J){if(J.pointerId!==this.#O)return;if(J.buttons===0){this.#t(J);return}if(!this.#P){if(Math.hypot(J.clientX-this.#k,J.clientY-this.#Y)<4)return;this.#P=!0,this.setAttribute("data-number-scrubbing",""),this.#J?.beginScrub({clientX:this.#k,pointerId:J.pointerId,startValue:this.#M})}this.#J?.updateScrub(J)}#t(J){if(J?.pointerId!==void 0&&this.#O!==null&&J.pointerId!==this.#O)return;let Q=this.#P;if(this.#h(),Q){this.#J?.endScrub(),this.#N=!0,clearTimeout(this.#L),this.#L=window.setTimeout(()=>{this.#N=!1,this.#L=0},0),requestAnimationFrame(()=>this.#J?.focus());return}this.#$?.querySelector("input")?.focus()}#h(){window.removeEventListener("pointermove",this.#H),window.removeEventListener("pointerup",this.#S),window.removeEventListener("pointercancel",this.#S),window.removeEventListener("blur",this.#S),this.#O=null,this.#P=!1,this.removeAttribute("data-number-scrubbing")}#d(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#N&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#N=!1;return}if(!(J.target instanceof Element)||!J.target.closest("fig-input-wheel"))this.#J?.focus()}get value(){return this.getAttribute("value")??this.#J?.value??"0"}set value(J){let Q=Number(J);this.#g(Number.isFinite(Q)?Q:0)}get min(){return this.#J?.min??null}set min(J){if(J===null||J===void 0||J==="")this.removeAttribute("min");else{let Q=Number(J);if(Number.isFinite(Q))this.setAttribute("min",String(Q));else this.removeAttribute("min")}}get max(){return this.#J?.max??null}set max(J){if(J===null||J===void 0||J==="")this.removeAttribute("max");else{let Q=Number(J);if(Number.isFinite(Q))this.setAttribute("max",String(Q));else this.removeAttribute("max")}}get defaultValue(){return this.getAttribute("default")??this.#B??"0"}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=Number(this.defaultValue),Q=this.#g(Number.isFinite(J)?J:0);p(this,Q)}focus(J){this.#J?.focus(J)}}L("propskit-wheel",u);class zJ extends HTMLElement{static observedAttributes=["type","value","color","name","tooltips","disabled","drag-surface","snapping"];#Z=50;#Q=50;#J=75;#j=75;#$=0;#G=!1;#X=0;#_=null;#q=null;#B=null;#O=null;#k=null;#Y=null;#M=null;#P=null;#N=null;#L=!1;#U=!1;#K=!1;#T=!1;#F=null;#z="";#H="";#S=null;#V=null;#R=null;#I="";#w="";#f=null;#E=null;#p=null;get#D(){return this.getAttribute("type")||"point"}get#c(){return this.#D==="point-radius"||this.#D==="point-radius-angle"}get#b(){return this.#D==="point-radius-angle"}get#C(){return this.#D==="point-point"}get#W(){return this.#D==="point-radius-angle"||this.#D==="point-point"}get#v(){let J=this.getAttribute("tooltips");return J===null||J!=="false"}get#x(){let J=this.getAttribute("snapping");if(J===null)return"false";let Q=J.trim().toLowerCase();if(Q==="modifier")return"modifier";if(Q===""||Q==="true")return"true";return"false"}#y(J){let Q=this.#x;if(Q==="true")return!0;if(Q==="modifier")return!!J;return!1}get#m(){let J=this.getAttribute("name");if(J)return J.split(",")[0].trim();return`${Math.round(this.#Z)}%, ${Math.round(this.#Q)}%`}get#g(){let J=this.getAttribute("name");if(J){let Q=J.split(",");if(Q.length>1)return Q[1].trim()}return`${Math.round(this.#J)}%, ${Math.round(this.#j)}%`}get#a(){return this.getAttribute("drag-surface")||"parent"}get#A(){let J=this.#a;if(J==="parent")return this.parentElement;return this.closest(J)}get#s(){let J=this.#a;if(J==="parent"){let Q=this.parentElement;if(Q)return Q.setAttribute("data-fig-canvas-control-surface",""),"[data-fig-canvas-control-surface]"}return J}#l(J){if(this.#G)return this.#$/100*J;return this.#$}#ZJ(){if(this.#G)return`Radius ${Math.round(this.#$)}%`;return`Radius ${Math.round(this.#$)}`}connectedCallback(){this.#t(),this.#h()}disconnectedCallback(){this.#VJ(),this.#AJ(),this.#GJ(),this.#kJ(),document.body.classList.remove("fig-lab-move-active"),document.body.classList.remove("fig-lab-rotate-active")}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"&&!this.#L&&!this.#U&&!this.#K&&!this.#T)if(this.#t(),this.#_)this.#u();else this.#h();if(J==="type")this.#VJ(),this.#t(),this.#h();if(J==="color"&&this.#_)if(Z)this.#_.setAttribute("color",Z);else this.#_.removeAttribute("color");if(J==="disabled")this.#VJ(),this.#h();if(J==="tooltips")this.#h();if(J==="snapping"&&this.#_){if(this.#_.setAttribute("drag-snapping",Z||"false"),this.#q)this.#q.setAttribute("drag-snapping",Z||"false")}if(J==="name"){if(this.#Y)this.#Y.setAttribute("text",this.#m);if(this.#M)this.#M.setAttribute("text",this.#g)}}#t(){let J=this.getAttribute("value");if(!J)return;try{let Q=JSON.parse(J);if(typeof Q.x==="number")this.#Z=Q.x;if(typeof Q.y==="number")this.#Q=Q.y;if(Q.radius!==void 0){let Z=String(Q.radius);if(Z.endsWith("%"))this.#G=!0,this.#$=parseFloat(Z);else this.#G=!1,this.#$=parseFloat(Z);if(!Number.isFinite(this.#$))this.#$=0}if(typeof Q.angle==="number")this.#X=Q.angle;if(typeof Q.x2==="number")this.#J=Q.x2;if(typeof Q.y2==="number")this.#j=Q.y2;if(this.#D==="color"&&typeof Q.color==="string"&&Q.color.trim()&&this.getAttribute("color")!==Q.color.trim())this.setAttribute("color",Q.color.trim())}catch{}}get value(){let J={x:this.#Z,y:this.#Q};if(this.#D==="color"){let Q=this.getAttribute("color")||this.#_?.getAttribute("color");if(Q)J.color=Q}if(this.#c)J.radius=this.#G?`${this.#$}%`:this.#$;if(this.#b)J.angle=this.#X;if(this.#C)J.x2=this.#J,J.y2=this.#j;return J}set value(J){if(typeof J==="object")this.setAttribute("value",JSON.stringify(J));else if(typeof J==="string")this.setAttribute("value",J)}#h(){this.#VJ(),this.replaceChildren(),this.#_=null,this.#q=null,this.#B=null,this.#O=null,this.#k=null,this.#Y=null,this.#M=null,this.#P=null,this.#N=null;let J=Y(this,"disabled"),Q=this.#D,Z=this.#v,$=this.#s,j=document.createElement("fig-handle");if(j.setAttribute("drag","true"),j.setAttribute("drag-surface",$),j.setAttribute("drag-axes","x,y"),j.setAttribute("drag-snapping",this.#x),j.setAttribute("value",`${this.#Z}% ${this.#Q}%`),J)j.setAttribute("disabled","");if(Q==="color"){j.setAttribute("type","color");let _=this.getAttribute("color");if(_)j.setAttribute("color",_)}else j.setAttribute("type","canvas");if(this.#C)j.setAttribute("hit-area","12 circle"),j.setAttribute("hit-area-mode","delegate");if(this.#_=j,this.#c)this.#_J();if(this.#W)this.#TJ();if(Z){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#m),_.appendChild(j),this.appendChild(_),this.#Y=_}else this.appendChild(j);if(this.#b)this.#FJ(J,Z,$);if(this.#C)this.#e(J,Z,$);this.#d(this.#_),this.#d(this.#B),this.#d(this.#q),this.#fJ(),this.#jJ(),requestAnimationFrame(()=>this.#u())}#d(J){if(!J)return;J.addEventListener("pointerdown",(Q)=>{if(Q.target?.classList?.contains("fig-handle-hit-area")&&J.querySelector(".fig-handle-hit-area"))this.#MJ(Q,J);else this.#YJ(Q)},{capture:!0})}#YJ(J){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#F===null)this.#z=document.body.style.getPropertyValue("cursor"),this.#H=document.body.style.getPropertyPriority("cursor");if(this.#F=J?.pointerId??-1,document.body.classList.add("fig-lab-move-active"),document.body.style.setProperty("cursor","var(--fig-lab-cursor-move)","important"),!this.#S)this.#S=(Q)=>{if(Q?.pointerId!==void 0&&this.#F!==null&&Q.pointerId!==this.#F)return;if(Q?.type==="blur")this.#GJ();else requestAnimationFrame(()=>this.#GJ())};window.addEventListener("pointerup",this.#S),window.addEventListener("pointercancel",this.#S),window.addEventListener("blur",this.#S)}#GJ(){if(this.#F===null)return;if(document.body.classList.remove("fig-lab-move-active"),this.#z)document.body.style.setProperty("cursor",this.#z,this.#H);else document.body.style.removeProperty("cursor");if(this.#F=null,this.#z="",this.#H="",this.#S)window.removeEventListener("pointerup",this.#S),window.removeEventListener("pointercancel",this.#S),window.removeEventListener("blur",this.#S)}#LJ(J){if(!J)return 0;if(J===this.#B)return this.#X;if(!this.#C)return 0;let Q=this.#SJ();return J===this.#_?Q+180:Q}#UJ(){if(this.#V===null)return;let J=this.#r(this.#LJ(this.#R));document.body.style.setProperty("--fig-lab-cursor-rotate",J),document.body.style.setProperty("cursor",J,"important")}#MJ(J,Q){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#V===null)this.#I=document.body.style.getPropertyValue("cursor"),this.#w=document.body.style.getPropertyPriority("cursor");if(this.#V=J?.pointerId??-1,this.#R=Q,document.body.classList.add("fig-lab-rotate-active"),this.#UJ(),!this.#f)this.#f=(Z)=>{if(Z?.pointerId!==void 0&&this.#V!==null&&Z.pointerId!==this.#V)return;if(Z?.type==="blur")this.#kJ();else requestAnimationFrame(()=>this.#kJ())};window.addEventListener("pointerup",this.#f),window.addEventListener("pointercancel",this.#f),window.addEventListener("blur",this.#f)}#kJ(){if(this.#V===null)return;if(document.body.classList.remove("fig-lab-rotate-active"),document.body.style.removeProperty("--fig-lab-cursor-rotate"),this.#I)document.body.style.setProperty("cursor",this.#I,this.#w);else document.body.style.removeProperty("cursor");if(this.#V=null,this.#R=null,this.#I="",this.#w="",this.#f)window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f)}#o(J,Q,Z,$){if(!J)return;let j=()=>!!$?.(),_=()=>{let B=Q();if(!B)return;B.removeAttribute("show"),B.hidePopup?.()},X=()=>{if(j()){_();return}let B=Q();if(!B)return;if(Z)B.setAttribute("text",Z());B.setAttribute("show","true"),B.showPopup?.()},q=()=>{_()};J.addEventListener("pointerenter",X),J.addEventListener("pointerleave",q)}#$J(){return this.#L||this.#U||this.#K||this.#T}#jJ(){if(this.#_)this.#o(this.#_,()=>this.#Y,()=>this.#m,()=>this.#$J()||!!this.#_?.querySelector("fig-color-tip"));if(this.#B)this.#o(this.#B,()=>this.#N,()=>`Angle ${Math.round(this.#X)}°`,()=>this.#$J());if(this.#q)this.#o(this.#q,()=>this.#M,()=>this.#g,()=>this.#$J());if(this.#O){let J=this.#O.querySelector(".fig-canvas-control-radius-hit");this.#NJ(J||this.#O)}if(this.#D==="color"&&this.#_&&this.#Y)new MutationObserver(()=>{if(this.#_?.querySelector("fig-color-tip"))this.#Y?.removeAttribute("show"),this.#Y?.hidePopup?.()}).observe(this.#_,{childList:!0,subtree:!0})}#n(J,Q){let Z=this.#P;if(!Z?.popup)return;let $=Q-8;Z.popup.anchor={getBoundingClientRect:()=>({left:J,top:$,right:J,bottom:$,width:0,height:0,x:J,y:$})},Z.popup.queueReposition?.()}#NJ(J){if(!J)return;J.addEventListener("pointerenter",(Q)=>{let Z=this.#P;if(!Z)return;Z.setAttribute("text",this.#ZJ()),Z.setAttribute("show","true"),Z.showPopup?.(),this.#n(Q.clientX,Q.clientY)}),J.addEventListener("pointermove",(Q)=>{if(this.#K)return;this.#n(Q.clientX,Q.clientY)}),J.addEventListener("pointerleave",()=>{if(this.#K)return;let Q=this.#P;if(!Q)return;Q.removeAttribute("show")})}#_J(){let Q=document.createElementNS("http://www.w3.org/2000/svg","svg");Q.classList.add("fig-canvas-control-radius"),Q.setAttribute("overflow","visible");let Z=document.createElementNS("http://www.w3.org/2000/svg","circle");Z.classList.add("fig-canvas-control-radius-hit"),Q.appendChild(Z);let $=document.createElementNS("http://www.w3.org/2000/svg","circle");$.classList.add("fig-canvas-control-radius-halo"),Q.appendChild($);let j=document.createElementNS("http://www.w3.org/2000/svg","circle");if(Q.appendChild(j),this.#O=Q,this.#v){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#ZJ()),_.appendChild(Q),this.appendChild(_),this.#P=_}else this.appendChild(Q);this.#i(Z)}#TJ(){let Q=document.createElementNS("http://www.w3.org/2000/svg","svg");if(Q.classList.add("fig-canvas-control-angle-svg"),Q.setAttribute("overflow","visible"),Q.style.position="absolute",Q.style.pointerEvents="none",this.#C){let j=document.createElementNS("http://www.w3.org/2000/svg","line");j.classList.add("fig-canvas-control-angle-line-hit"),j.setAttribute("stroke","transparent"),j.setAttribute("stroke-width","12"),j.setAttribute("stroke-linecap","round"),j.style.pointerEvents="stroke",Q.appendChild(j),this.#KJ(j)}let Z=document.createElementNS("http://www.w3.org/2000/svg","line");Z.classList.add("fig-canvas-control-angle-line-halo"),Q.appendChild(Z);let $=document.createElementNS("http://www.w3.org/2000/svg","line");$.classList.add("fig-canvas-control-angle-line"),Q.appendChild($),this.#k=Q,this.appendChild(Q)}#KJ(J){J.addEventListener("pointerdown",(Q)=>{if(Y(this,"disabled"))return;Q.preventDefault(),Q.stopPropagation();let Z=this.#A;if(!Z)return;let{clientX:$,clientY:j}=Q,_=this.#Z,X=this.#Q,q=this.#J,B=this.#j;this.#L=!0,this.#U=!0,document.body.classList.add("fig-lab-move-active"),J.style.pointerEvents="none";let O=(M)=>{let k=Z.getBoundingClientRect(),U=k.width>0?(M.clientX-$)/k.width*100:0,N=k.height>0?(M.clientY-j)/k.height*100:0,T=-Math.min(_,q),F=100-Math.max(_,q),H=-Math.min(X,B),z=100-Math.max(X,B),S=Math.max(T,Math.min(F,U)),R=Math.max(H,Math.min(z,N));this.#Z=_+S,this.#Q=X+R,this.#J=q+S,this.#j=B+R,this.#u(),this.#JJ()},G=this.#CJ((M)=>{if(document.body.classList.remove("fig-lab-move-active"),J.style.pointerEvents="stroke",this.#L=!1,this.#U=!1,M)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",O,{signal:G.signal}),window.addEventListener("pointerup",()=>G.finish(!0),{signal:G.signal}),window.addEventListener("pointercancel",()=>G.finish(!1),{signal:G.signal})})}#FJ(J,Q,Z){let $=document.createElement("fig-handle");if($.setAttribute("type","canvas"),$.setAttribute("drag","true"),$.setAttribute("drag-surface",Z),$.setAttribute("drag-axes","x,y"),$.setAttribute("size","small"),$.setAttribute("hit-area","12 circle"),$.setAttribute("hit-area-mode","delegate"),J)$.setAttribute("disabled","");if(this.#B=$,Q){let j=document.createElement("fig-tooltip");j.setAttribute("action","manual"),j.setAttribute("theme","canvas"),j.setAttribute("pointer","false"),j.setAttribute("text",`${Math.round(this.#X)}°`),j.appendChild($),this.appendChild(j),this.#N=j}else this.appendChild($)}#e(J,Q,Z){let $=document.createElement("fig-handle");if($.setAttribute("type","canvas"),$.setAttribute("drag","true"),$.setAttribute("drag-surface",Z),$.setAttribute("drag-axes","x,y"),$.setAttribute("drag-snapping",this.#x),$.setAttribute("hit-area","12 circle"),$.setAttribute("hit-area-mode","delegate"),$.setAttribute("value",`${this.#J}% ${this.#j}%`),J)$.setAttribute("disabled","");if(this.#q=$,Q){let j=document.createElement("fig-tooltip");j.setAttribute("action","manual"),j.setAttribute("theme","canvas"),j.setAttribute("pointer","false"),j.setAttribute("text",this.#g),j.appendChild($),this.appendChild(j),this.#M=j}else this.appendChild($)}#zJ(J){return`url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='rotate(${Math.round(J)} 16 16)'%3E%3Cg filter='url(%23f)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.1212 16.9998L11.5607 17.4394C12.1465 18.0252 12.1464 18.975 11.5606 19.5607C10.9748 20.1465 10.0251 20.1465 9.4393 19.5606L6.4393 16.5604C5.85354 15.9746 5.85357 15.0249 6.43938 14.4391L9.43938 11.4393C10.0252 10.8535 10.9749 10.8536 11.5607 11.4394C12.1465 12.0252 12.1464 12.9749 11.5606 13.5607L11.1215 13.9998L20.8786 13.9999L20.4394 13.5607C19.8536 12.9749 19.8535 12.0252 20.4393 11.4394C21.0251 10.8536 21.9749 10.8536 22.5606 11.4394L25.5606 14.4393C25.842 14.7206 26 15.1021 26 15.4999C26 15.8978 25.842 16.2793 25.5607 16.5606L22.5607 19.5607C21.9749 20.1465 21.0251 20.1465 20.4393 19.5607C19.8536 18.9749 19.8535 18.0252 20.4393 17.4394L20.8788 16.9999L11.1212 16.9998Z' fill='white'/%3E%3C/g%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.8536 12.1465C11.0488 12.3417 11.0488 12.6583 10.8535 12.8536L8.70715 14.9998L23.2929 14.9999L21.1465 12.8536C20.9512 12.6583 20.9512 12.3417 21.1464 12.1465C21.3417 11.9512 21.6583 11.9512 21.8535 12.1465L24.8535 15.1464C24.9473 15.2402 25 15.3673 25 15.4999C25 15.6326 24.9473 15.7597 24.8536 15.8535L21.8536 18.8536C21.6583 19.0488 21.3417 19.0488 21.1465 18.8536C20.9512 18.6583 20.9512 18.3417 21.1464 18.1465L23.2929 15.9999L8.70705 15.9998L10.8536 18.1465C11.0488 18.3417 11.0488 18.6583 10.8535 18.8536C10.6583 19.0488 10.3417 19.0488 10.1464 18.8535L7.14643 15.8533C6.95118 15.658 6.95119 15.3415 7.14646 15.1462L10.1465 12.1464C10.3417 11.9512 10.6583 11.9512 10.8536 12.1465Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='f' x='3' y='9' width='26' height='15' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='a'/%3E%3CfeColorMatrix in='SourceAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='b'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='1.5'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3CfeBlend in2='a' result='c'/%3E%3CfeBlend in='SourceGraphic' in2='c'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E") 16 16, nwse-resize`}#r(J){return`url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='rotate(${Math.round(J-45)} 16 16)'%3E%3Cg filter='url(%23f)'%3E%3Cpath d='M12.5607 22.4393L12.0216 21.9002C17.1558 21.2216 21.2216 17.1558 21.9002 12.0216L22.4393 12.5607C23.0251 13.1464 23.9749 13.1464 24.5607 12.5607C25.1464 11.9749 25.1464 11.0251 24.5607 10.4393L21.5607 7.43934C20.9749 6.85355 20.0251 6.85355 19.4393 7.43934L16.4393 10.4393C15.8536 11.0251 15.8536 11.9749 16.4393 12.5607C17.0251 13.1464 17.9749 13.1464 18.5607 12.5607L18.8056 12.3157C18.1013 15.5527 15.5527 18.1013 12.3157 18.8056L12.5607 18.5607C13.1464 17.9749 13.1464 17.0251 12.5607 16.4393C11.9749 15.8536 11.0251 15.8536 10.4393 16.4393L7.43934 19.4393C6.85356 20.0251 6.85356 20.9749 7.43934 21.5607L10.4393 24.5607C11.0251 25.1464 11.9749 25.1464 12.5607 24.5607C13.1464 23.9749 13.1464 23.0251 12.5607 22.4393Z' fill='white'/%3E%3C/g%3E%3Cpath d='M23.8536 11.8536C23.6583 12.0488 23.3417 12.0488 23.1464 11.8536L21 9.70711V10.5C21 16.299 16.299 21 10.5 21H9.70711L11.8536 23.1464C12.0488 23.3417 12.0488 23.6583 11.8536 23.8536C11.6583 24.0488 11.3417 24.0488 11.1464 23.8536L8.14645 20.8536C7.95119 20.6583 7.95119 20.3417 8.14645 20.1464L11.1464 17.1464C11.3417 16.9512 11.6583 16.9512 11.8536 17.1464C12.0488 17.3417 12.0488 17.6583 11.8536 17.8536L9.70711 20H10.5C15.7467 20 20 15.7467 20 10.5V9.70711L17.8536 11.8536C17.6583 12.0488 17.3417 12.0488 17.1464 11.8536C16.9512 11.6583 16.9512 11.3417 17.1464 11.1464L20.1464 8.14645C20.3417 7.95119 20.6583 7.95119 20.8536 8.14645L23.8536 11.1464C24.0488 11.3417 24.0488 11.6583 23.8536 11.8536Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='f' x='4' y='5' width='24' height='24' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='a'/%3E%3CfeColorMatrix in='SourceAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='b'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='1.5'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3CfeBlend in2='a' result='c'/%3E%3CfeBlend in='SourceGraphic' in2='c'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E") 16 16, pointer`}#OJ(J,Q){if(!J)return;J.style.setProperty("cursor",Q,"important")}#XJ(J,Q){if(!J)return;let Z=J.querySelector(".fig-handle-hit-area");if(!Z)return;if(Z.setAttribute("data-cursor","rotate"),this.#OJ(Z,this.#r(Q)),this.#R===J)this.#UJ()}#HJ(){if(!this.#B||!this.#b)return;this.#XJ(this.#B,this.#X)}#SJ(){return Math.atan2(this.#j-this.#Q,this.#J-this.#Z)*180/Math.PI}#WJ(){if(!this.#C)return;let J=this.#SJ();this.#_?.style.removeProperty("cursor"),this.#q?.style.removeProperty("cursor"),this.#XJ(this.#_,J+180),this.#XJ(this.#q,J)}#BJ(J,Q,Z,$){J.style.setProperty("--fig-handle-position-translate","-50% -50%"),J.style.left=`${Q/100*$.width}px`,J.style.top=`${Z/100*$.height}px`}#u(){let J=this.#A;if(!J||!this.#_)return;let Q=J.getBoundingClientRect();if(this.#BJ(this.#_,this.#Z,this.#Q,Q),this.#O){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#l(Q.width),_=this.#O,X=Math.max(j*2,1);_.style.position="absolute",_.style.width=`${X}px`,_.style.height=`${X}px`,_.style.left=`${Z-j}px`,_.style.top=`${$-j}px`,_.setAttribute("viewBox",`0 0 ${X} ${X}`);let q=_.querySelectorAll("circle");for(let B of q)B.setAttribute("cx",String(j)),B.setAttribute("cy",String(j)),B.setAttribute("r",String(Math.max(j-1,0)))}if(this.#k&&this.#W){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j,_;if(this.#C)j=this.#J/100*Q.width,_=this.#j/100*Q.height;else{let B=this.#l(Q.width),O=this.#X*Math.PI/180;j=Z+B*Math.cos(O),_=$+B*Math.sin(O)}let X=this.#k;X.style.width=`${Q.width}px`,X.style.height=`${Q.height}px`,X.style.left="0",X.style.top="0",X.setAttribute("viewBox",`0 0 ${Q.width} ${Q.height}`);let q=X.querySelectorAll(".fig-canvas-control-angle-line, .fig-canvas-control-angle-line-halo, .fig-canvas-control-angle-line-hit");for(let B of q)B.setAttribute("x1",String(Z)),B.setAttribute("y1",String($)),B.setAttribute("x2",String(j)),B.setAttribute("y2",String(_))}if(this.#B&&this.#b){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#l(Q.width),_=this.#X*Math.PI/180,X=Z+j*Math.cos(_),q=$+j*Math.sin(_),B=Q.width>0?X/Q.width*100:0,O=Q.height>0?q/Q.height*100:0;this.#BJ(this.#B,B,O,Q)}if(this.#q&&this.#C)this.#BJ(this.#q,this.#J,this.#j,Q);this.#HJ(),this.#WJ()}#JJ(J=this.value){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:J}))}#QJ(J=this.value){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:J}))}#qJ(J){return{...this.value,...HJ(J.color,J.alpha,J.opacity)}}#PJ(){this.setAttribute("value",JSON.stringify(this.value))}#fJ(){if(!this.#_)return;if(this.#_.addEventListener("input",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#_.getAttribute("color")||J.detail.color),this.#JJ(this.#qJ(J.detail));return}this.#L=!0;let Q=J.detail?.px??this.#Z/100,Z=J.detail?.py??this.#Q/100;if(this.#Z=Math.round(Math.max(0,Math.min(100,Q*100))),this.#Q=Math.round(Math.max(0,Math.min(100,Z*100))),this.#Y)this.#Y.removeAttribute("show"),this.#Y.hidePopup?.();this.#u(),this.#JJ()}),this.#_.addEventListener("change",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#_.getAttribute("color")||J.detail.color),this.#QJ(this.#qJ(J.detail));return}let Q=J.detail?.px??this.#Z/100,Z=J.detail?.py??this.#Q/100;if(this.#Z=Math.round(Math.max(0,Math.min(100,Q*100))),this.#Q=Math.round(Math.max(0,Math.min(100,Z*100))),this.#Y)this.#Y.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#L=!1})}),this.#B)this.#B.addEventListener("input",(J)=>{J.stopPropagation();let Q=this.#A;if(!Q)return;this.#T=!0,this.classList.add("fig-canvas-control-ring-active");let Z=Q.getBoundingClientRect(),$=this.#Z/100*Z.width,j=this.#Q/100*Z.height,_=J.detail?.x??0,X=J.detail?.y??0,q=this.#B.offsetWidth/2,B=this.#B.offsetHeight/2,O=_+q-$,G=X+B-j,M=Math.atan2(G,O)*180/Math.PI;if(this.#y(J.detail?.shiftKey))M=Math.round(M/15)*15;this.#X=M;let k=Math.sqrt(O*O+G*G);if(this.#y(J.detail?.shiftKey)){let U=this.#G?5:10;if(this.#G){let N=k/Z.width*100;N=Math.round(N/U)*U,k=N/100*Z.width}else k=Math.round(k/U)*U}if(this.#G)this.#$=Math.max(0,k/Z.width*100);else this.#$=Math.max(0,k);if(this.#N)this.#N.setAttribute("text",`Angle ${Math.round(this.#X)}°`),this.#N.setAttribute("show","true"),this.#N.showPopup?.();this.#u(),this.#JJ()}),this.#B.addEventListener("change",(J)=>{if(J.stopPropagation(),this.classList.remove("fig-canvas-control-ring-active"),this.#N)this.#N.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#T=!1})}),this.#B.addEventListener("hitareadown",(J)=>{J.stopPropagation();let Q=J.detail?.originalEvent;if(!Q)return;Q.preventDefault();let Z=this.#A;if(!Z)return;if(this.#T=!0,this.classList.add("fig-canvas-control-ring-active"),this.#B.setAttribute("selected",""),this.#N)this.#N.setAttribute("show","true"),this.#N.showPopup?.();let $=(_)=>{let X=Z.getBoundingClientRect(),q=this.#Z/100*X.width,B=this.#Q/100*X.height,O=_.clientX-X.left-q,G=_.clientY-X.top-B,M=Math.atan2(G,O)*180/Math.PI;if(this.#y(_.shiftKey))M=Math.round(M/15)*15;if(this.#X=M,this.#N)this.#N.setAttribute("text",`Angle ${Math.round(M)}°`);this.#u(),this.#JJ()},j=this.#CJ((_)=>{if(this.#T=!1,this.classList.remove("fig-canvas-control-ring-active"),this.#B.removeAttribute("selected"),this.#N)this.#N.removeAttribute("show");if(_)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",$,{signal:j.signal}),window.addEventListener("pointerup",()=>j.finish(!0),{signal:j.signal}),window.addEventListener("pointercancel",()=>j.finish(!1),{signal:j.signal})});if(this.#q)this.#q.addEventListener("input",(J)=>{J.stopPropagation(),this.#U=!0;let Q=J.detail?.px??this.#J/100,Z=J.detail?.py??this.#j/100;if(this.#J=Math.round(Math.max(0,Math.min(100,Q*100))),this.#j=Math.round(Math.max(0,Math.min(100,Z*100))),this.#M)this.#M.removeAttribute("show"),this.#M.hidePopup?.();this.#u(),this.#JJ()}),this.#q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#M)this.#M.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#U=!1})}),this.#RJ(this.#_,!0),this.#RJ(this.#q,!1)}#RJ(J,Q){if(!J)return;J.addEventListener("hitareadown",(Z)=>{Z.stopPropagation();let $=Z.detail?.originalEvent;if(!$)return;$.preventDefault();let j=this.#A;if(!j)return;this.#L=!0;let _=j.getBoundingClientRect(),X=Q?this.#J:this.#Z,q=Q?this.#j:this.#Q,B=Q?this.#Z:this.#J,O=Q?this.#Q:this.#j,G=X/100*_.width,M=q/100*_.height,k=B/100*_.width,U=O/100*_.height,N=Math.sqrt((k-G)**2+(U-M)**2),T=Q?this.#Y:this.#M;if(T)T.removeAttribute("show"),T.hidePopup?.();let F=(z)=>{let S=j.getBoundingClientRect(),R=X/100*S.width,W=q/100*S.height,f=z.clientX-S.left-R,I=z.clientY-S.top-W,C=Math.atan2(I,f);if(this.#y(z.shiftKey))C=Math.round(C*180/Math.PI/15)*15*Math.PI/180;let l=R+N*Math.cos(C),s=W+N*Math.sin(C),b=Math.max(0,Math.min(100,l/S.width*100)),y=Math.max(0,Math.min(100,s/S.height*100));if(Q)this.#Z=b,this.#Q=y;else this.#J=b,this.#j=y;this.#u(),this.#JJ()},H=this.#CJ((z)=>{if(this.#L=!1,T)T.removeAttribute("show");if(z)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",F,{signal:H.signal}),window.addEventListener("pointerup",()=>H.finish(!0),{signal:H.signal}),window.addEventListener("pointercancel",()=>H.finish(!1),{signal:H.signal})})}#i(J){if(!J)return;J.addEventListener("pointermove",(Z)=>{if(this.#K)return;let $=this.#A;if(!$)return;let j=$.getBoundingClientRect(),_=this.#Z/100*j.width,X=this.#Q/100*j.height,q=Math.atan2(Z.clientY-j.top-X,Z.clientX-j.left-_)*180/Math.PI;this.#OJ(J,this.#zJ(q))});let Q=(Z)=>{if(Y(this,"disabled"))return;Z.preventDefault(),Z.stopPropagation(),this.#K=!0,this.classList.add("fig-canvas-control-ring-active");let $=this.#A;if(!$)return;if(this.#P)this.#P.setAttribute("show","true"),this.#P.showPopup?.(),this.#n(Z.clientX,Z.clientY);if(this.#N)this.#N.removeAttribute("show"),this.#N.hidePopup?.();let j=this.#B?.style.pointerEvents,_=this.#B?.querySelector(".fig-handle-hit-area"),X=_?.style.pointerEvents;if(this.#B)this.#B.style.pointerEvents="none";if(_)_.style.pointerEvents="none";let q=document.body.style.cursor;J.style.pointerEvents="none";let B=$.getBoundingClientRect(),O=this.#Z/100*B.width,G=this.#Q/100*B.height,M=Math.atan2(Z.clientY-B.top-G,Z.clientX-B.left-O)*180/Math.PI,k=Math.round(M);document.body.style.cursor=this.#zJ(k);let U=(T)=>{let F=$.getBoundingClientRect(),H=this.#Z/100*F.width,z=this.#Q/100*F.height,S=T.clientX-F.left-H,R=T.clientY-F.top-z,W=Math.round(Math.atan2(R,S)*180/Math.PI);if(W!==k)k=W,document.body.style.cursor=this.#zJ(W);let f=Math.sqrt(S*S+R*R);if(this.#y(T.shiftKey)){let I=this.#G?5:10;if(this.#G){let C=f/F.width*100;C=Math.round(C/I)*I,f=C/100*F.width}else f=Math.round(f/I)*I}if(this.#G)this.#$=Math.max(0,f/F.width*100);else this.#$=Math.max(0,f);if(this.#P)this.#P.setAttribute("text",this.#ZJ()),this.#n(T.clientX,T.clientY);this.#u(),this.#JJ()},N=this.#CJ((T)=>{if(this.#K=!1,this.classList.remove("fig-canvas-control-ring-active"),J.style.pointerEvents="",this.#B)this.#B.style.pointerEvents=j??"";if(_)_.style.pointerEvents=X??"";if(document.body.style.cursor=q,this.#P)this.#P.removeAttribute("show");if(T)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",U,{signal:N.signal}),window.addEventListener("pointerup",()=>N.finish(!0),{signal:N.signal}),window.addEventListener("pointercancel",()=>N.finish(!1),{signal:N.signal})};J.addEventListener("pointerdown",Q),this._radiusDragCleanup=()=>J.removeEventListener("pointerdown",Q)}#AJ(){if(this._radiusDragCleanup)this._radiusDragCleanup(),this._radiusDragCleanup=null}#CJ(J){this.#VJ();let Q=new AbortController,Z=!1,$=(j=!1)=>{if(Z)return;if(Z=!0,Q.abort(),this.#E===Q)this.#E=null,this.#p=null;J(j)};return this.#E=Q,this.#p=$,{signal:Q.signal,finish:$}}#VJ(){this.#p?.(!1),this.#E?.abort(),this.#E=null,this.#p=null}}L("fig-canvas-control",zJ);class K extends HTMLElement{#Z=[K.#R()];#Q=0;#J=2;#j=240;#$=120;#G={min:-1,max:1};#X=null;#_=null;#q=null;#B=null;#O=0;#k=null;#Y=null;#M=null;#P=null;#N=[];#L=[];#U=[];#K=[];#T=new Set;#F=null;#z=null;#H=null;#S=null;#V=null;static TYPES=[{name:"Wave",value:"sine"},{name:"Square",value:"square"},{name:"Sawtooth",value:"sawtooth"},{name:"Triangle",value:"triangle"}];static#R(J="sine"){return{type:J,frequency:1,amplitude:1,phase:0,offset:0}}static get observedAttributes(){return["value","precision","aspect-ratio","edit","disabled"]}connectedCallback(){if(this.#V===null)this.#V=this.getAttribute("default")??this.getAttribute("value")??JSON.stringify({waves:[K.#R()]});this.#J=this.#I("precision",2),this.#D(this.getAttribute("value")),this.#p(),this.#s(),this.#UJ(),V(this)}disconnectedCallback(){if(this.#u(),this.#_J(),this.#F)this.#F.disconnect(),this.#F=null;D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"){if(this.#D(Z),this.isConnected)this.#s();return}if(J==="precision"){if(this.#J=this.#I("precision",2),this.isConnected)this.#qJ();return}if(J==="aspect-ratio"){if(this.#p(),this.#_)this.#n();return}if(J==="edit"||J==="disabled"){if(this.isConnected)this.#s()}}get value(){return JSON.stringify(this.data)}set value(J){this.setAttribute("value",typeof J==="object"&&J!==null?JSON.stringify(J):J)}get defaultValue(){return this.getAttribute("default")??this.#V??""}get isDefault(){let J=this.#c(this.defaultValue);if(!J)return!1;return JSON.stringify(this.data.waves)===JSON.stringify(J.map((Q)=>this.#C(Q)))}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J,this.#i("input"),this.#i("change")}get data(){return{waves:this.#Z.map((J)=>this.#C(J))}}get preset(){let J=this.#W;return K.TYPES.find((Q)=>Q.value===J.type)?.name}#I(J,Q){let Z=Number.parseInt(this.getAttribute(J)||"",10);return Number.isFinite(Z)?Math.max(0,Math.min(100,Z)):Q}#w(J,Q=!1){let Z=this.getAttribute(J);if(Z===null)return Q;let $=Z.trim().toLowerCase();if($===""||$==="true")return!0;if($==="false")return!1;return!0}#f(){return this.getAttribute("edit")!=="false"}#E(){return this.#w("disabled",!1)}#p(){let J=this.getAttribute("aspect-ratio")||"2 / 1";this.style.setProperty("--aspect-ratio",J)}#D(J){let Q=this.#c(J);if(!Q)return!1;if(this.#Z=Q,!this.#Z.length)this.#Z=[K.#R()];return this.#Q=Math.min(this.#Q,this.#Z.length-1),!0}#c(J){if(!J)return null;let Q=null;if(typeof J==="string")try{Q=JSON.parse(J)}catch{return null}else if(typeof J==="object")Q=J;if(!Q)return null;return(Array.isArray(Q)?Q:Array.isArray(Q.waves)?Q.waves:[Q]).map(($)=>this.#b($))}#b(J={}){return{type:this.#v(J.type),frequency:this.#x(J.frequency,1,0.1,16),amplitude:this.#x(J.amplitude,1,-4,4),phase:this.#x(J.phase,0,-360,360),offset:this.#x(J.offset,0,-4,4)}}#C(J){return{type:J.type,frequency:this.#y(J.frequency),amplitude:this.#y(J.amplitude),phase:this.#y(J.phase),offset:this.#y(J.offset)}}get#W(){if(!this.#Z[this.#Q])this.#Q=0;return this.#Z[this.#Q]||K.#R()}#v(J){let Q=String(J||"").toLowerCase();return K.TYPES.some((Z)=>Z.value===Q)?Q:"sine"}#x(J,Q,Z,$){let j=Number.parseFloat(J);if(!Number.isFinite(j))return Q;return Math.min($,Math.max(Z,j))}#y(J){let Q=10**this.#J;return Math.round(J*Q)/Q}static#m(J){return K.TYPES.find((Q)=>Q.value===J)?.name||"Wave"}static#g(J,Q=24){let j=Q-10,_="";for(let X=0;X<=32;X++){let q=X/32,B=K.#A(J,q),O=5+q*j,G=5+(1-(B+1)/2)*j;_+=`${X===0?"M":"L"}${O.toFixed(1)},${G.toFixed(1)}`}return _}static#a(J,Q=24){return A("svg",{width:Q,height:Q,viewBox:`0 0 ${Q} ${Q}`,fill:"none"},A("path",{d:K.#g(J,Q),stroke:"currentColor","stroke-width":"1","stroke-linecap":"round","stroke-linejoin":"round"}))}static waveIcon(J,Q=24){let Z=K.#g(J,Q);return`<svg width="${Q}" height="${Q}" viewBox="0 0 ${Q} ${Q}" fill="none"><path d="${Z}" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg>`}static#A(J,Q,Z=0){let $=Q+Z/360,j=$-Math.floor($),_=$*Math.PI*2;switch(J){case"square":return Math.sin(_)>=0?1:-1;case"sawtooth":return j*2-1;case"triangle":return 1-Math.abs(j*4-2);default:return Math.sin(_)}}#s(){if(this.#u(),this.#_J(),this.replaceChildren(...this.#ZJ()),this.#YJ(),this.#MJ(),this.#n(),this.#zJ(),!this.#E())this.#NJ();V(this)}#l(J,Q){return A("foreignObject",{className:`propskit-oscillator-handle propskit-oscillator-${J}-handle`,"data-handle":J,width:"20",height:"20"},P("div",{className:"propskit-oscillator-handle-inner"},P("fig-tooltip",{text:Q},P("fig-handle",{size:"small",type:"minimal","aria-label":`Oscillator ${J} handle`}))))}#ZJ(){let J=this.#f()&&!this.#E(),Q=[A("rect",{className:"propskit-oscillator-bounds",x:"0",y:"0",width:this.#j,height:this.#$}),A("line",{className:"propskit-oscillator-baseline"}),A("path",{className:"propskit-oscillator-path"}),A("circle",{className:"propskit-oscillator-playhead"})];if(J)Q.push(this.#l("amplitude","Amplitude"),this.#l("frequency","Frequency"));let Z=A("svg",{viewBox:`0 0 ${this.#j} ${this.#$}`,className:"propskit-oscillator-svg"},Q),$=[P("div",{className:"propskit-oscillator-svg-container"},Z)];if(this.#f())$.push(P("div",{className:"propskit-oscillator-waves"},this.#Z.map((j,_)=>this.#t(j,_,!J))));return $}#t(J,Q,Z){let $=Z||this.#Z.length<=1,j=Q===this.#Q,_=K.#m(J.type),X=P("fig-tooltip",{text:"Remove form"},P("fig-button",{className:"propskit-oscillator-remove-button",variant:"ghost",icon:!0,"data-wave-index":Q,"aria-label":"Remove form",disabled:$},P("fig-icon",{name:"minus"}))),q=P("fig-header",{borderless:!0},[P("h3",{},_),X,this.#h(Z,Q)]),B=P("div",{className:"propskit-oscillator-fields","data-wave-index":Q,"data-active":j},[this.#d(Q,"frequency","Frequency",0.1,16,0.1,""),this.#d(Q,"amplitude","Amplitude",-4,4,0.1,""),this.#d(Q,"phase","Phase",-360,360,1,"°"),this.#d(Q,"offset","Offset",-4,4,0.1,"")]);return P("fig-group",{className:"propskit-oscillator-wave",collapsible:!0,borderless:!0,compact:"true",open:this.#T.has(Q)?"true":"false","data-wave-index":Q},[q,B])}#h(J,Q){let Z=P("fig-tooltip",{text:"Add form"},P("fig-button",{className:"propskit-oscillator-add-type-button",variant:"ghost",icon:!0,"fig-menu-trigger":!0,"aria-label":"Add form",disabled:J},P("fig-icon",{name:"plus"}))),$=K.TYPES.map((j)=>P("fig-menu-item",{value:j.value},[K.#a(j.value,24),P("span",{},j.name)]));return P("fig-menu",{className:"propskit-oscillator-add-type",position:"bottom right","data-wave-index":Q,disabled:J},[Z,$])}#d(J,Q,Z,$,j,_,X){let q=this.#Z[J]||K.#R(),B=Q==="amplitude"||Q==="offset";return P("propskit-slider",{className:"propskit-oscillator-field",label:Z,direction:"horizontal",name:Q,"data-wave-index":J,value:this.#y(q[Q]),min:$,max:j,step:_,precision:this.#J,elastic:"false",type:B?"delta":null,default:B?"0":null,units:X||null,disabled:this.#E()})}#YJ(){this.#_=this.querySelector(".propskit-oscillator-svg"),this.#q=this.querySelector(".propskit-oscillator-path"),this.#B=this.querySelector(".propskit-oscillator-playhead"),this.#k=this.querySelector(".propskit-oscillator-baseline"),this.#Y=this.querySelector(".propskit-oscillator-bounds"),this.#M=this.querySelector('[data-handle="amplitude"]'),this.#P=this.querySelector('[data-handle="frequency"]'),this.#L=Array.from(this.querySelectorAll(".propskit-oscillator-wave-type")),this.#N=Array.from(this.querySelectorAll("propskit-slider[name]")),this.#K=Array.from(this.querySelectorAll("fig-group.propskit-oscillator-wave")),this.#U=Array.from(this.querySelectorAll(".propskit-oscillator-fields"))}#GJ(J){let Q=new Set;for(let Z of this.#T)if(Z<J)Q.add(Z);else if(Z>J)Q.add(Z-1);this.#T=Q}#LJ(J){let Q=new Set;for(let Z of this.#T)Q.add(Z>=J?Z+1:Z);Q.add(J),this.#T=Q}#UJ(){if(this.#F||!window.ResizeObserver)return;this.#F=new ResizeObserver(()=>{if(this.#MJ())this.#n()}),this.#F.observe(this)}#MJ(){if(!this.#_)return!1;let J=this.#_.getBoundingClientRect(),Q=Math.max(1,Math.round(J.width||240)),Z=Math.max(1,Math.round(J.height||120)),$=Q!==this.#j||Z!==this.#$;return this.#j=Q,this.#$=Z,this.#_.setAttribute("viewBox",`0 0 ${Q} ${Z}`),$}#kJ(){let J=1,Q=256;for(let Z=0;Z<=Q;Z++)J=Math.max(J,Math.abs(this.#jJ(Z/Q)));return{min:-J,max:J}}#o(J){let{min:Q,max:Z}=this.#G;return this.#$-(J-Q)/(Z-Q)*this.#$}#$J(J){let{min:Q,max:Z}=this.#G;return Q+(1-J/this.#$)*(Z-Q)}#jJ(J){return this.#Z.reduce((Q,Z)=>{let $=J*Z.frequency,j=K.#A(Z.type,$,Z.phase);return Q+Z.offset+j*Z.amplitude},0)}#n(){if(!this.#_||!this.#q)return;if(this.#MJ(),this.#G=this.#kJ(),this.#Y)this.#Y.setAttribute("width",this.#j),this.#Y.setAttribute("height",this.#$);let J=Math.max(...this.#Z.map((_)=>_.frequency)),Z=this.#Z.some((_)=>_.type==="square"||_.type==="sawtooth")?Math.max(192,Math.ceil(J*64)):Math.max(96,Math.ceil(J*64)),$="";for(let _=0;_<=Z;_++){let X=_/Z,q=X*this.#j,B=this.#o(this.#jJ(X));$+=`${_===0?"M":"L"}${q.toFixed(1)},${B.toFixed(1)}`}this.#q.setAttribute("d",$);let j=this.#o(0);this.#k?.setAttribute("x1","0"),this.#k?.setAttribute("y1",j),this.#k?.setAttribute("x2",this.#j),this.#k?.setAttribute("y2",j),this.#KJ()}#NJ(){if(this.#O||!this.#B)return;let J=(Q)=>{if(!this.isConnected||!this.#B){this.#O=0;return}this.#TJ(Q%1000/1000),this.#O=requestAnimationFrame(J)};this.#O=requestAnimationFrame(J)}#_J(){if(!this.#O)return;cancelAnimationFrame(this.#O),this.#O=0}#TJ(J){if(!this.#B)return;let Q=J*this.#j,Z=this.#o(this.#jJ(J));this.#B.setAttribute("cx",Q.toFixed(1)),this.#B.setAttribute("cy",Z.toFixed(1))}#KJ(){let Q=this.#W,Z=this.#FJ(),$=Math.max(8,Math.min(this.#j-8,this.#j/Q.frequency)),j=this.#o(this.#jJ(Z/this.#j)),_=this.#o(this.#jJ($/this.#j));this.#e(this.#M,Z,j,8),this.#e(this.#P,$,_,8)}#FJ(){let J=this.#W,Q=J.phase/360,Z=Math.max(0.1,J.frequency),$=0.25;if(J.type==="triangle")$=0.5;if(J.type==="sawtooth")$=1;let j=($-Q)/Z;while(j<0)j+=1/Z;while(j>1)j-=1/Z;if(j<0||j>1||!Number.isFinite(j))j=0.25;return Math.max(8,Math.min(this.#j-8,j*this.#j))}#e(J,Q,Z,$){if(!J)return;J.setAttribute("x",Q-$),J.setAttribute("y",Z-$),J.setAttribute("width",$*2),J.setAttribute("height",$*2)}#zJ(){if(!this.#f()||this.#E())return;for(let Q of this.#L)Q.addEventListener("change",(Z)=>{if(this.#E())return;let $=this.#r(Q);this.#XJ($),this.#Z[$].type=this.#v(Z.detail??Z.target?.value),this.#qJ(),this.#i("input"),this.#i("change")});for(let Q of this.#N)Q.addEventListener("input",(Z)=>{Z.stopPropagation(),this.#z=Q;try{this.#HJ(this.#r(Q),Q.getAttribute("name"),Z.detail??Z.currentTarget?.value??Z.target?.value,"input")}finally{this.#z=null}}),Q.addEventListener("change",(Z)=>{Z.stopPropagation(),this.#HJ(this.#r(Q),Q.getAttribute("name"),Z.detail??Z.currentTarget?.value??Z.target?.value,"change")});for(let Q of this.#K)Q.addEventListener("pointerdown",()=>{this.#XJ(this.#r(Q))}),Q.addEventListener("focusin",()=>{this.#XJ(this.#r(Q))}),Q.addEventListener("openchange",(Z)=>{let $=this.#r(Q);if(Z.detail?.open)this.#T.add($);else this.#T.delete($)});for(let Q of this.querySelectorAll(".propskit-oscillator-add-type")){let Z=($)=>{$.stopPropagation()};Q.addEventListener("pointerdown",Z),Q.addEventListener("click",Z),Q.addEventListener("change",($)=>{if($.target!==Q)return;if(this.#E())return;let _=this.#r(Q)+1,X=this.#v($.detail?.value??Q.value);this.#Z.splice(_,0,K.#R(X)),this.#LJ(_),this.#Q=_,this.#s(),this.#i("input"),this.#i("change")})}for(let Q of this.querySelectorAll(".propskit-oscillator-add-type-button")){let Z=($)=>{$.stopPropagation()};Q.addEventListener("pointerdown",Z),Q.addEventListener("click",Z),Q.closest("fig-tooltip")?.addEventListener("pointerdown",Z),Q.closest("fig-tooltip")?.addEventListener("click",Z)}for(let Q of this.querySelectorAll(".propskit-oscillator-remove-button"))Q.addEventListener("pointerdown",(Z)=>{Z.stopPropagation()}),Q.addEventListener("click",(Z)=>{if(Z.stopPropagation(),this.#E()||this.#Z.length<=1)return;let $=this.#r(Q);this.#Z.splice($,1),this.#GJ($),this.#Q=Math.min(this.#Q,this.#Z.length-1),this.#s(),this.#i("input"),this.#i("change")});for(let Q of[this.#M,this.#P])this.#OJ(Q);this.querySelector(".propskit-oscillator-svg-container")?.addEventListener("pointerdown",(Q)=>{if(this.#E())return;if(Q.target?.closest?.(".propskit-oscillator-handle, fig-handle"))return;this.#BJ(Q,"offset")})}#r(J){let Q=Number.parseInt(J?.getAttribute("data-wave-index")||"",10);return Number.isFinite(Q)?Math.min(this.#Z.length-1,Math.max(0,Q)):0}#OJ(J){let Q=J?.querySelector("fig-handle"),Z=J?.getAttribute("data-handle");if(!Q||!Z)return;Q.addEventListener("pointerdown",($)=>{if(this.#E())return;$.preventDefault(),$.stopImmediatePropagation(),this.#BJ($,Z)},{capture:!0}),Q.addEventListener("keydown",($)=>{if(this.#E())return;if(!["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes($.key))return;if(!this.#SJ($,Z))return;$.preventDefault(),$.stopImmediatePropagation()},{capture:!0})}#XJ(J){let Q=Math.min(this.#Z.length-1,Math.max(0,J));if(Q===this.#Q)return;this.#Q=Q,this.#RJ(),this.#KJ()}#HJ(J,Q,Z,$){if(this.#E())return;this.#XJ(J);let j=Number.parseFloat(Z);if(!Number.isFinite(j)){if($==="change")this.#fJ();return}this.#Z[J]=this.#b({...this.#Z[J],[Q]:j}),this.#qJ({skipFieldSync:$=="input"}),this.#i($)}#SJ(J,Q){let Z=J.shiftKey?0.5:0.1,$=this.#W;switch(Q){case"amplitude":if(J.key==="ArrowUp")$.amplitude+=Z;else if(J.key==="ArrowDown")$.amplitude-=Z;else if(J.key==="Home")$.amplitude=-4;else if(J.key==="End")$.amplitude=4;else return!1;break;case"offset":if(J.key==="ArrowUp")$.offset+=Z;else if(J.key==="ArrowDown")$.offset-=Z;else if(J.key==="Home")$.offset=-4;else if(J.key==="End")$.offset=4;else return!1;break;case"frequency":if(J.key==="ArrowLeft")$.frequency-=Z;else if(J.key==="ArrowRight")$.frequency+=Z;else if(J.key==="Home")$.frequency=0.1;else if(J.key==="End")$.frequency=16;else return!1;break;default:return!1}return this.#Z[this.#Q]=this.#b($),this.#qJ(),this.#i("input"),this.#i("change"),!0}#WJ(J){let Q=this.#_?.getScreenCTM();if(!Q)return{x:0,y:0};let Z=Q.inverse();return{x:Z.a*J.clientX+Z.c*J.clientY+Z.e,y:Z.b*J.clientX+Z.d*J.clientY+Z.f}}#BJ(J,Q){this.#u(),this.#X=Q,this.#_?.classList.add("dragging");let Z=Q==="frequency"?"ew-resize":Q==="amplitude"?"ns-resize":"",$=document.body.style.cursor;if(Z)document.body.style.cursor=Z;let j=(q)=>{if(!this.#X)return;let B=this.#WJ(q),O=this.#W;if(Q==="frequency"){let G=Math.max(1,Math.min(this.#j,B.x));O.frequency=this.#j/G}else if(Q==="offset"){let G=this.#x(B.x/this.#j,0,0,1),M=this.#QJ(O,G);O.offset=this.#$J(B.y)-this.#JJ(this.#Q,G)-M*O.amplitude}else if(Q==="amplitude"){let G=this.#x(B.x/this.#j,0,0,1),M=this.#QJ(O,G),k=this.#$J(B.y)-this.#JJ(this.#Q,G)-O.offset;O.amplitude=Math.abs(M)<0.001?O.amplitude:k/M}this.#Z[this.#Q]=this.#b(O),this.#qJ(),this.#i("input")},_=new AbortController,X=(q=!1)=>{if(this.#X=null,this.#_?.classList.remove("dragging"),Z)document.body.style.cursor=$;if(_.abort(),this.#H===_)this.#H=null,this.#S=null;if(q)this.#i("change")};this.#H=_,this.#S=X,document.addEventListener("pointermove",j,{signal:_.signal}),document.addEventListener("pointerup",()=>X(!0),{signal:_.signal}),document.addEventListener("pointercancel",()=>X(!1),{signal:_.signal}),window.addEventListener("blur",()=>X(!1),{signal:_.signal})}#u(){this.#S?.(!1),this.#H?.abort(),this.#H=null,this.#S=null,this.#X=null,this.#_?.classList.remove("dragging")}#JJ(J,Q){return this.#Z.reduce((Z,$,j)=>{if(j===J)return Z;let _=Q*$.frequency,X=K.#A($.type,_,$.phase);return Z+$.offset+X*$.amplitude},0)}#QJ(J,Q){return K.#A(J.type,Q*J.frequency,J.phase)}#qJ({skipFieldSync:J=!1}={}){if(this.#PJ(),!J)this.#fJ();this.#RJ(),this.#n()}#PJ(){for(let J of this.#L){let Q=this.#r(J);J.value=this.#Z[Q]?.type||"sine"}}#fJ(){for(let J of this.#N){if(J===this.#z)continue;let Q=this.#r(J),Z=J.getAttribute("name"),$=this.#y(this.#Z[Q]?.[Z]??0),j=J.querySelector("fig-slider");if(j)j.value=$;else J.setAttribute("value",String($))}}#RJ(){for(let J of this.#U)if(this.#r(J)===this.#Q)J.setAttribute("data-active","");else J.removeAttribute("data-active")}#i(J){this.dispatchEvent(new CustomEvent(J,{bubbles:!0,detail:{value:this.value,data:this.data,preset:K.#m(this.#W.type)}}))}}L("propskit-oscillator",K);class WJ extends HTMLElement{#Z;#Q;#J=null;#j;#$;#G;#X;#_;#q;#B;#O=null;#k=null;constructor(){super();this.angle=0,this.#Z=1,this.#Q=0,this.isDragging=!1,this.isShiftHeld=!1,this.handle=null,this.angleInput=null,this.plane=null,this.units="°",this.min=null,this.max=null,this.dial=!0,this.showRotations=!1,this.rotationSpan=null,this.#j=this.#w.bind(this),this.#$=this.#v.bind(this),this.#G=this.#x.bind(this),this.#X=this.#g.bind(this),this.#_=this.#a.bind(this),this.#q=this.#f.bind(this),this.#B=this.#m.bind(this)}connectedCallback(){requestAnimationFrame(()=>{if(!this.isConnected)return;this.precision=this.getAttribute("precision")||1,this.precision=parseInt(this.precision),this.text=this.getAttribute("text")==="true";let J=this.getAttribute("units")||"°";if(J==="deg")J="°";if(this.units=J,this.min=this.hasAttribute("min")?Number(this.getAttribute("min")):null,this.max=this.hasAttribute("max")?Number(this.getAttribute("max")):null,this.dial=this.#M("dial",!0),this.showRotations=this.#P(),this.#Y(),this.#R(),this.#W(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision))})}disconnectedCallback(){this.#y(),this.#I()}#Y(){this.#y(),this.#I();let J=this.#z(),Q=this.#L(),Z=this.getAttribute("aria-label")||this.getAttribute("name")||"Angle",$=this.min??this.#S(0),j=this.max??this.#S(360),_=[];if(this.dial)_.push(P("div",{className:"fig-input-angle-plane",role:"slider",tabindex:Q?"-1":"0","aria-label":Z,"aria-valuemin":$,"aria-valuemax":j,"aria-valuenow":this.angle,"aria-valuetext":`${this.angle.toFixed(this.precision)}${this.units}`,"aria-disabled":Q?"true":null},P("div",{className:"fig-input-angle-handle"})));if(this.text)_.push(P("fig-input-number",{name:"angle",step:J,value:this.angle,min:this.min,max:this.max,units:this.units,"aria-label":Z,disabled:Q},this.showRotations?P("span",{slot:"append",className:"fig-input-angle-rotations"}):null));this.replaceChildren(..._)}#M(J,Q=!1){let Z=this.getAttribute(J);if(Z===null)return Q;let $=Z.trim().toLowerCase();if($===""||$==="true")return!0;if($==="false")return!1;return!0}#P(){if(this.hasAttribute("rotations"))return this.#M("rotations",!1);if(this.hasAttribute("show-rotations"))return this.#M("show-rotations",!1);return!1}#N(){let J=Math.abs(this.#H(this.angle));return Math.floor(J/360)}#L(){return Y(this,"disabled")}#U(J){let Q=Number(J);if(!Number.isFinite(Q))return this.angle;if(this.min!==null&&Number.isFinite(this.min))Q=Math.max(this.min,Q);if(this.max!==null&&Number.isFinite(this.max))Q=Math.min(this.max,Q);return Q}#K(J,{reflect:Q=!0}={}){let Z=this.#U(J);if(this.angle=Z,this.#E(),Q){let $=String(Z);if(this.getAttribute("value")!==$)this.setAttribute("value",$)}if(this.#W(),this.angleInput)this.angleInput.value=Z.toFixed(this.precision);this.#T(),this.#F()}#T(){if(!this.plane)return;this.plane.setAttribute("aria-valuenow",String(this.angle)),this.plane.setAttribute("aria-valuetext",`${this.angle.toFixed(this.precision)}${this.units}`)}#F(){if(!this.rotationSpan)return;let J=this.#N();if(J>1)this.rotationSpan.textContent=`×${J}`,this.rotationSpan.style.display="";else this.rotationSpan.textContent="",this.rotationSpan.style.display="none"}#z(){switch(this.units){case"rad":return 0.01;case"turn":return 0.001;default:return 0.1}}#H(J){switch(this.units){case"rad":return J*180/Math.PI;case"turn":return J*360;default:return J}}#S(J){switch(this.units){case"rad":return J*Math.PI/180;case"turn":return J/360;default:return J}}#V(J,Q,Z){let $;switch(Q){case"rad":$=J*180/Math.PI;break;case"turn":$=J*360;break;default:$=J}switch(Z){case"rad":return $*Math.PI/180;case"turn":return $/360;default:return $}}#R(){if(this.handle=this.querySelector(".fig-input-angle-handle"),this.plane=this.querySelector(".fig-input-angle-plane"),this.angleInput=this.querySelector("fig-input-number[name='angle']"),this.rotationSpan=this.querySelector(".fig-input-angle-rotations"),this.#F(),this.plane?.addEventListener("mousedown",this.#$),this.plane?.addEventListener("touchstart",this.#G),this.plane?.addEventListener("keydown",this.#B),window.addEventListener("keydown",this.#X),window.addEventListener("keyup",this.#_),this.text&&this.angleInput)this.angleInput.addEventListener("input",this.#q),this.angleInput.addEventListener("change",this.#q);this.addEventListener("change",this.#j,!0)}#I(){if(this.plane?.removeEventListener("mousedown",this.#$),this.plane?.removeEventListener("touchstart",this.#G),this.plane?.removeEventListener("keydown",this.#B),window.removeEventListener("keydown",this.#X),window.removeEventListener("keyup",this.#_),this.text&&this.angleInput)this.angleInput.removeEventListener("input",this.#q),this.angleInput.removeEventListener("change",this.#q);this.removeEventListener("change",this.#j,!0)}#w(J){if(!J.target?.matches?.("input"))return;let Z=J.target.value.match(/^(-?\d*\.?\d+)\s*(turn|rad|deg|°)$/i);if(Z){let $=parseFloat(Z[1]),j=Z[2].toLowerCase();if(j==="deg")j="°";if(j!==this.units){let _=this.#V($,j,this.units);J.target.value=String(_)}}}#f(J){if(J.stopPropagation(),this.#L())return;if(this.#K(Number(J.target.value)),J.type==="change")this.#C();else this.#b()}#E(){let Q=this.#H(this.angle)*Math.PI/180;this.#Z=Math.cos(Q),this.#Q=Math.sin(Q)}#p(J){if(!this.isShiftHeld)return J;let Q=45;return Math.round(J/Q)*Q}#D(J){let Q=this.plane.getBoundingClientRect(),Z=Q.left+Q.width/2,$=Q.top+Q.height/2,j=J.clientX-Z,_=J.clientY-$;return Math.atan2(_,j)*180/Math.PI}#c(J){let Z=(this.#D(J)%360+360)%360;if(Z=this.#p(Z),this.min!==null||this.max!==null)this.angle=this.#U(this.#S(Z));else if(this.#J===null){this.#J=Z;let _=(this.#H(this.angle)%360+360)%360,X=Z-_;if(X>180)X-=360;if(X<-180)X+=360;this.angle=this.#U(this.angle+this.#S(X))}else{let j=Z-this.#J;if(j>180)j-=360;if(j<-180)j+=360;this.angle=this.#U(this.angle+this.#S(j)),this.#J=Z}if(this.#E(),this.setAttribute("value",String(this.angle)),this.#W(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#F(),this.#T(),this.#b()}#b(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0,detail:{value:this.value,angle:this.angle}}))}#C(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,detail:{value:this.value,angle:this.angle}}))}#W(){if(this.handle){let Q=this.#H(this.angle)*Math.PI/180,Z=this.plane.offsetWidth/2-this.handle.offsetWidth/2,$=Math.cos(Q)*Z,j=Math.sin(Q)*Z;this.handle.style.transform=`translate(${$}px, ${j}px)`}}#v(J){if(this.#L()||J.button!==0)return;this.#y(),this.isDragging=!0,this.#J=null,this.#c(J);let Q=(j)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#c(j)},Z=new AbortController,$=(j=!1)=>{if(this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),Z.abort(),this.#O===Z)this.#O=null,this.#k=null;if(j)this.#C()};this.#O=Z,this.#k=$,window.addEventListener("mousemove",Q,{signal:Z.signal}),window.addEventListener("mouseup",()=>$(!0),{signal:Z.signal}),window.addEventListener("blur",()=>$(!1),{signal:Z.signal})}#x(J){if(this.#L())return;J.preventDefault(),this.#y(),this.isDragging=!0,this.#J=null,this.#c(J.touches[0]);let Q=(j)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#c(j.touches[0])},Z=new AbortController,$=(j=!1)=>{if(this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),Z.abort(),this.#O===Z)this.#O=null,this.#k=null;if(j)this.#C()};this.#O=Z,this.#k=$,window.addEventListener("touchmove",Q,{signal:Z.signal}),window.addEventListener("touchend",()=>$(!0),{signal:Z.signal}),window.addEventListener("touchcancel",()=>$(!1),{signal:Z.signal})}#y(){this.#k?.(!1),this.#O?.abort(),this.#O=null,this.#k=null,this.isDragging=!1,this.#J=null,this.plane?.classList.remove("dragging")}#m(J){if(this.#L())return;let Q=this.#z()*(J.shiftKey?10:1),Z=this.angle;if(J.key==="ArrowLeft"||J.key==="ArrowDown")Z-=Q;else if(J.key==="ArrowRight"||J.key==="ArrowUp")Z+=Q;else if(J.key==="Home")Z=this.min??this.#S(0);else if(J.key==="End")Z=this.max??this.#S(360);else return;J.preventDefault(),J.stopPropagation(),this.#K(Z),this.#b(),this.#C()}#g(J){if(J.key==="Shift")this.isShiftHeld=!0}#a(J){if(J.key==="Shift")this.isShiftHeld=!1}focus(){this.plane?.focus()}static get observedAttributes(){return["value","precision","text","min","max","units","dial","rotations","show-rotations","disabled","aria-label","name"]}get value(){return this.angle}get adjacent(){return this.#Z}get opposite(){return this.#Q}set value(J){if(isNaN(J)){console.error("Invalid value: must be a number.");return}this.#K(Number(J))}attributeChangedCallback(J,Q,Z){switch(J){case"value":if(this.isDragging)break;if(Z!==null)this.#K(Number(Z),{reflect:!1});break;case"precision":this.precision=parseInt(Z);break;case"text":if(Z!==Q){if(this.text=Z?.toLowerCase()==="true",this.isConnected)this.#Y(),this.#R(),this.#W()}break;case"dial":if(this.dial=this.#M("dial",!0),this.isConnected)this.#Y(),this.#R(),this.#W();break;case"units":{let $=Z||"°";if($==="deg")$="°";if(this.units=$,this.isConnected)this.#Y(),this.#R(),this.#W();break}case"min":if(this.min=Z!==null?Number(Z):null,this.#K(this.angle),this.isConnected)this.#Y(),this.#R(),this.#W();break;case"max":if(this.max=Z!==null?Number(Z):null,this.#K(this.angle),this.isConnected)this.#Y(),this.#R(),this.#W();break;case"disabled":if(this.#y(),this.isConnected)this.#Y(),this.#R(),this.#W();break;case"aria-label":case"name":if(this.isConnected)this.#Y(),this.#R(),this.#W();break;case"rotations":case"show-rotations":if(this.showRotations=this.#P(),this.isConnected)this.#Y(),this.#R(),this.#W();break}}}L("fig-input-angle",WJ);class h extends HTMLElement{static observedAttributes=["axis","handle","disabled"];static#Z=6;static#Q=['[draggable]:not([draggable="false"])','img:not([draggable="false"])','a[href]:not([draggable="false"])','input[type="range"]',"fig-handle","fig-slider","fig-input-number","fig-input-gradient","fig-easing-curve","fig-input-angle","fig-input-wheel","fig-input-joystick","fig-canvas-control","propskit-color-point","propskit-number","propskit-point-point","propskit-point-radius","propskit-point-radius-angle","propskit-position","propskit-slider","propskit-oscillator"];#J=null;#j=new Map;#$=null;#G=null;#X=null;connectedCallback(){if(this.style.display="contents",!this.hasAttribute("role"))this.setAttribute("role","list");if(!this.hasAttribute("aria-label"))this.setAttribute("aria-label","Reorderable list");this.#T(),this.#k(),this.#J=new MutationObserver(()=>this.#k()),this.#J.observe(this,{childList:!0})}disconnectedCallback(){this.#J?.disconnect(),this.#J=null,this.#C(),this.#W(),this.#p(),this.#X?.remove(),this.#X=null}attributeChangedCallback(){if(this.isConnected){if(this.#_)this.#W();this.#k()}}get#_(){return this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"}get#q(){return(this.getAttribute("axis")||"vertical").trim().toLowerCase()==="horizontal"?"horizontal":"vertical"}get#B(){return(this.getAttribute("handle")||"").trim()}#O(){return[...this.children].filter((J)=>J.nodeType===Node.ELEMENT_NODE&&!J.hasAttribute("data-reorder-live"))}#k(){let J=this.#O(),Q=new Set(J);for(let[Z,$]of this.#j)if(!Q.has(Z))$.target.removeEventListener("pointerdown",$.onPointerDown,!0),$.target.removeEventListener("keydown",$.onKeyDown),this.#K($),this.#j.delete(Z);if(this.#P(J),this.#Y(J),this.#_||J.length<2){this.#C();return}for(let Z of J){let $=this.#L(Z),j=this.#j.get(Z);if(j&&j.target===$)continue;if(j)j.target.removeEventListener("pointerdown",j.onPointerDown,!0),this.#j.delete(Z);if(!$)continue;this.#U(Z,$)}this.#N(J),this.#M(J)}#Y(J){for(let Q of J)if(Q.removeAttribute("data-reorder-item"),Q.hasAttribute("data-reorder-generated-role"))Q.removeAttribute("role"),Q.removeAttribute("data-reorder-generated-role")}#M(J){for(let Q of J)if(Q.setAttribute("data-reorder-item",""),!Q.hasAttribute("role"))Q.setAttribute("role","listitem"),Q.setAttribute("data-reorder-generated-role","")}#P(J){for(let Q of J)Q.querySelectorAll("[data-reorder-handle]").forEach((Z)=>{Z.removeAttribute("data-reorder-handle"),Z.removeAttribute("aria-roledescription")})}#N(J){if(!this.#B)return;for(let Q of J){let Z=Q.querySelector(this.#B);if(Z)Z.setAttribute("data-reorder-handle",""),Z.setAttribute("aria-roledescription","reorder handle")}}#L(J){if(this.#B)return J.querySelector(this.#B);return J}#U(J,Q){let Z=(B)=>{if(this.#_||this.#O().length<2)return;if(B.button!==0)return;if(!this.#B&&this.#z(B.target,J))return;this.#V(B,J,Q)},$=Q.getAttribute("tabindex"),j=Q.getAttribute("aria-label"),_=Q.getAttribute("role"),X=J.getAttribute("aria-label")||J.textContent?.trim().replace(/\s+/g," ").slice(0,80)||"item";if(Q.setAttribute("tabindex","0"),Q.setAttribute("aria-label",`Move ${X}`),Q!==J&&!Q.hasAttribute("role"))Q.setAttribute("role","button");let q=(B)=>{if(this.#_)return;let O=this.#q==="horizontal",G=O?"ArrowLeft":"ArrowUp",M=O?"ArrowRight":"ArrowDown";if(B.key!==G&&B.key!==M&&B.key!=="Home"&&B.key!=="End")return;B.preventDefault(),B.stopPropagation();let k=this.#O(),U=k.indexOf(J),N=U;if(B.key===G)N=Math.max(0,U-1);else if(B.key===M)N=Math.min(k.length-1,U+1);else if(B.key==="Home")N=0;else if(B.key==="End")N=k.length-1;if(N===U){this.#F(`${X}, position ${U+1} of ${k.length}`);return}this.#c(J,N),this.#k(),this.#L(J)?.focus(),this.dispatchEvent(new CustomEvent("reorder",{bubbles:!0,detail:{oldIndex:U,newIndex:N,item:J}})),this.#F(`${X}, position ${N+1} of ${k.length}`)};Q.addEventListener("pointerdown",Z,!0),Q.addEventListener("keydown",q),this.#j.set(J,{target:Q,onPointerDown:Z,onKeyDown:q,originalTabIndex:$,originalAriaLabel:j,originalRole:_})}#K(J){let{target:Q,originalTabIndex:Z,originalAriaLabel:$,originalRole:j}=J;if(Z===null)Q.removeAttribute("tabindex");else Q.setAttribute("tabindex",Z);if($===null)Q.removeAttribute("aria-label");else Q.setAttribute("aria-label",$);if(j===null)Q.removeAttribute("role");else Q.setAttribute("role",j)}#T(){if(this.#X?.isConnected)return;let J=document.createElement("span");J.setAttribute("data-reorder-live",""),J.setAttribute("role","status"),J.setAttribute("aria-live","polite"),J.setAttribute("aria-atomic","true"),Object.assign(J.style,{position:"absolute",width:"1px",height:"1px",padding:"0",margin:"-1px",overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",border:"0"}),this.#X=J,document.body.appendChild(J)}#F(J){if(!this.#X)return;this.#X.textContent="",requestAnimationFrame(()=>{if(this.#X)this.#X.textContent=J})}#z(J,Q){let Z=J;while(Z&&Z!==Q){if(Z instanceof Element){for(let $ of h.#Q)if(Z.matches($))return!0}Z=Z.parentElement}return!1}static#H="fig-reorder-dragging";static#S(J){document.body.classList.toggle(h.#H,J)}#V(J,Q,Z){this.#W();let $={item:Q,target:Z,pointerId:J.pointerId,oldIndex:this.#O().indexOf(Q),targetIndex:this.#O().indexOf(Q),startX:J.clientX,startY:J.clientY,active:!1,onMove:null,onUp:null,onKeyDown:null};$.onMove=(j)=>{if(j.pointerId!==$.pointerId)return;let _=j.clientX-$.startX,X=j.clientY-$.startY;if(!$.active){if(_*_+X*X<h.#Z*h.#Z)return;$.active=!0,J.preventDefault(),J.stopPropagation(),Q.classList.add("dragging"),h.#S(!0);try{Z.setPointerCapture($.pointerId)}catch{}}j.preventDefault();let q=this.#q==="horizontal"?j.clientX:j.clientY,B=this.#R(q);$.targetIndex=B,this.#E(B,Q)},$.onKeyDown=(j)=>{if(j.key!=="Escape"||!$.active)return;j.preventDefault(),this.#b($,!0)},$.onUp=(j)=>{if(j.pointerId!==$.pointerId)return;this.#b($,j.type==="pointercancel")},this.#$=$,window.addEventListener("pointermove",$.onMove),window.addEventListener("pointerup",$.onUp),window.addEventListener("pointercancel",$.onUp),window.addEventListener("keydown",$.onKeyDown)}#R(J){let Q=this.#O(),Z=this.#q==="horizontal";for(let $=0;$<Q.length;$++){let j=Q[$].getBoundingClientRect(),_=Z?j.left+j.width/2:j.top+j.height/2;if(J<_)return $}return Q.length}#I(J,Q){let Z=this.#O(),$=Z.indexOf(J);if($===-1)return!1;let j=Math.max(0,Math.min(Q,Z.length));if(Q===$)return!1;if(j>=Z.length&&$===Z.length-1)return!1;return!0}#w(J){if(!J.length)return null;let Q=1/0,Z=-1/0,$=1/0,j=-1/0;for(let _ of J){let X=_.getBoundingClientRect();Q=Math.min(Q,X.left),Z=Math.max(Z,X.right),$=Math.min($,X.top),j=Math.max(j,X.bottom)}return{left:Q,top:$,width:Z-Q,height:j-$}}#f(){if(this.#G)return this.#G;let J=document.createElement("div");return J.className="fig-reorder-indicator",J.setAttribute("data-axis",this.#q),document.body.appendChild(J),this.#G=J,J}#E(J,Q){let Z=this.#O();if(!this.#I(Q,J)){this.#p();return}let $=this.#w(Z);if(!$){this.#p();return}let j=this.#f();if(j.setAttribute("data-axis",this.#q),this.#q==="horizontal"){let X;if(J<=0)X=Z[0].getBoundingClientRect().left;else if(J>=Z.length)X=Z[Z.length-1].getBoundingClientRect().right;else X=Z[J].getBoundingClientRect().left;j.style.left=`${X-1}px`,j.style.top=`${$.top}px`,j.style.width="2px",j.style.height=`${$.height}px`;return}let _;if(J<=0)_=Z[0].getBoundingClientRect().top;else if(J>=Z.length)_=Z[Z.length-1].getBoundingClientRect().bottom;else _=Z[J].getBoundingClientRect().top;j.style.left=`${$.left}px`,j.style.top=`${_-1}px`,j.style.width=`${$.width}px`,j.style.height="2px"}#p(){this.#G?.remove(),this.#G=null}#D(J,Q){let Z=this.#O(),$=Math.max(0,Math.min(Q,Z.length));if($>=Z.length){if(Z[Z.length-1]!==J)this.appendChild(J);return}let j=Z[$];if(j!==J)this.insertBefore(J,j)}#c(J,Q){let $=this.#O().filter((j)=>j!==J)[Q]??null;if($)this.insertBefore(J,$);else this.appendChild(J)}#b(J,Q){let{item:Z,oldIndex:$,active:j,onMove:_,onUp:X,onKeyDown:q}=J;if(window.removeEventListener("pointermove",_),window.removeEventListener("pointerup",X),window.removeEventListener("pointercancel",X),window.removeEventListener("keydown",q),j){if(!Q){this.#D(Z,J.targetIndex);let B=this.#O().indexOf(Z);if(B!==-1&&B!==$){this.dispatchEvent(new CustomEvent("reorder",{bubbles:!0,detail:{oldIndex:$,newIndex:B,item:Z}}));let O=Z.getAttribute("aria-label")||Z.textContent?.trim().replace(/\s+/g," ").slice(0,80)||"item";this.#F(`${O}, position ${B+1} of ${this.#O().length}`)}}}if(Z.classList.remove("dragging"),h.#S(!1),this.#p(),this.#$===J)this.#$=null}#C(){for(let[,J]of this.#j)J.target.removeEventListener("pointerdown",J.onPointerDown,!0),J.target.removeEventListener("keydown",J.onKeyDown),this.#K(J);this.#j.clear()}#W(){if(!this.#$)return;this.#b(this.#$,!0)}}L("fig-reorder",h);
+`:",";return Q.split(Z).map(($)=>$.trim()).filter(Boolean)}static#L(J){if(J&&typeof J==="object")return String(J.value??J.label??"");return String(J??"")}static#U(J){if(J&&typeof J==="object")return String(J.label??J.value??"");return String(J??"")}connectedCallback(){if(!this.#Z)this.#K();if(this.#T(),this.#H(),this.#S(),this.removeEventListener("click",this.#O),this.addEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),this.addEventListener("pointerdown",this.#k,!0),V(this),!this.#G)this.#G=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;let j=$.attributeName;if(j==="label"||j==="direction"||j==="aria-label")Q=!0;else Z=!0}if(Q)this.#T();if(Z)this.#H()});this.#G.observe(this,{attributes:!0})}disconnectedCallback(){this.#G?.disconnect(),this.#V(),this.removeEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label"){this.#T();return}if(J==="options"||J==="value")this.#H()}#K(){this.#M=this.getAttribute("value")??"";let J=this.querySelector(":scope > label"),Q=this.querySelector(":scope > fig-select-options"),Z=document.createElement("fig-field"),$=J||document.createElement("label");this.#j=m.#P();let j=document.createElement(this.#j?"fig-select":"fig-dropdown");if(j.setAttribute("full",""),this.#j&&Q)j.append(Q);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#$=Boolean(J),this.replaceChildren(Z)}#T(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#$)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Select"),this.#J.setAttribute("full","")}#F(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","full","default","variant"]);if(!this.#j)J.add("options");return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#W(){if(!this.#J||this.#j)return;let J=m.#N(this.getAttribute("options"));for(let Z of[...this.#J.children])if(Z.localName==="option"||Z.localName==="optgroup")Z.remove();for(let Z of J){let $=document.createElement("option");$.value=m.#L(Z),$.textContent=m.#U(Z),this.#J.appendChild($)}let Q=this.getAttribute("value");if(Q!=null){let Z=()=>{if(this.#J?.setAttribute("value",Q),this.#J&&"value"in this.#J)this.#J.value=Q};Z(),queueMicrotask(Z)}}#H(){if(!this.#J)return;if(!this.#j)this.#W();let J=this.#F().sort((Z,$)=>{if(Z==="options")return-1;if($==="options")return 1;if(Z==="value")return 1;if($==="value")return-1;return 0}),Q=new Set(J);for(let Z of this.#X)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#X=Q}#S(){if(!this.#J)return;if(this.#_??=this.#R.bind(this,"input"),this.#q??=this.#R.bind(this,"change"),this.#J.addEventListener("input",this.#_),this.#J.addEventListener("change",this.#q),this.#j)this.#B??=this.#R.bind(this,"optionhover"),this.#J.addEventListener("optionhover",this.#B)}#V(){if(!this.#J)return;if(this.#_)this.#J.removeEventListener("input",this.#_);if(this.#q)this.#J.removeEventListener("change",this.#q);if(this.#B)this.#J.removeEventListener("optionhover",this.#B)}#R(J,Q){if(Q.target!==this.#J)return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value??"";if(J!=="optionhover")this.setAttribute("value",String(Z));let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:Z;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#I(){if(!this.#J||!this.#j)return!1;if(this.#J.open)return!0;let J=this.#J.shadowRoot?.querySelector('dialog[is="fig-popup"]');return Boolean(J?.open||J?.matches?.(":open"))}#w(J){if(!(J.target instanceof Element))return;if(J.target.closest("fig-menu"))return;if(J.target.closest("fig-select, fig-dropdown")){this.#Y=!1;return}if(!this.#j)return;this.#Y=this.#I()}#f(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-menu"))return;if(J.target instanceof Element&&J.target.closest("fig-select, fig-dropdown")){this.#Y=!1;return}if(!this.#J||Y(this.#J,"disabled")){this.#Y=!1;return}if(this.#J.focus(),!this.#j)return;if(this.#Y||this.#I()){this.#Y=!1,this.#J.open=!1;return}this.#J.open=!0}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0)this.removeAttribute("value");else this.setAttribute("value",String(J))}get defaultValue(){return this.getAttribute("default")??this.#M??""}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(this.value=J,this.#J)this.#J.value=J;p(this,J)}focus(J){this.#J?.focus(J)}}L("propskit-select",m);class NJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction"||$.attributeName==="aria-label")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){this.#B=this.getAttribute("value")??"";let J=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())),Q=J.find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-text");for(let _ of J)if(_!==Q)j.appendChild(_);Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z)}#k(){if(!this.#Z||!this.#Q||!this.#J)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal"),this.#J.setAttribute("aria-label",this.getAttribute("aria-label")||this.#Q.textContent?.trim()||"Text")}#Y(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","multiline","resizable","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#J?.value??"";this.setAttribute("value",String(Z));let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:Z;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-text, fig-menu"))return;this.focus()}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0){if(this.removeAttribute("value"),this.#J)this.#J.value=""}else{let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}}get defaultValue(){return this.getAttribute("default")??this.#B??""}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,J)}focus(J){this.#J?.focus(J)}}L("propskit-text",NJ);class PJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=null;#_=null;#q=this.#U.bind(this);#B=null;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#M(),this.#P(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J){if($.type!=="attributes")continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#k();if(Z)this.#M()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){this.#$?.disconnect(),this.#N(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#B=this.getAttribute("value")??this.getAttribute("min")??"0";let J=Array.from(this.childNodes).filter((_)=>_.nodeType!==Node.TEXT_NODE||Boolean(_.textContent?.trim())),Q=J.find((_)=>_.nodeType===Node.ELEMENT_NODE&&_.matches("label")),Z=document.createElement("fig-field"),$=Q||document.createElement("label"),j=document.createElement("fig-input-number");Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z);for(let _ of J)if(_!==Q)j.appendChild(_)}#k(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()==="")this.#Q.remove();else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#Y(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","default","variant"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#M(){if(!this.#J)return;let J=this.#Y(),Q=new Set(J);for(let Z of this.#G)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#G=Q}#P(){if(!this.#J)return;this.#X??=this.#L.bind(this,"input"),this.#_??=this.#L.bind(this,"change"),this.#J.addEventListener("input",this.#X),this.#J.addEventListener("change",this.#_)}#N(){if(!this.#J)return;if(this.#X)this.#J.removeEventListener("input",this.#X);if(this.#_)this.#J.removeEventListener("change",this.#_)}#L(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;if(this.#J?.value!==void 0)this.setAttribute("value",String(this.#J.value));this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}#U(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu"))return;this.focus()}get value(){return this.#J?.value??this.getAttribute("value")??""}set value(J){if(J===null||J===void 0||J===""){if(this.removeAttribute("value"),this.#J)this.#J.value=""}else{let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}}get defaultValue(){return this.getAttribute("default")??this.#B??"0"}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,this.#J?.value??J)}focus(J){this.#J?.focus(J)}}L("propskit-number",PJ);class LJ extends HTMLElement{static observedAttributes=["x","y","default","label","units","disabled","size"];#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=!1;#X=this.#W.bind(this,"input");#_=this.#W.bind(this,"change");#q=this.#H.bind(this);connectedCallback(){if(!this.#$)this.#j=this.#O(),this.#Y(this.#j),this.#$=!0;if(!this.#Z)this.#P();this.#N(),this.#L(),this.#T(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),V(this)}disconnectedCallback(){this.#F(),this.removeEventListener("click",this.#q),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if((J==="x"||J==="y")&&!this.#G)this.#L();else if(J==="label")this.#N();else if(J==="units")this.#U();else if(J==="disabled")this.#K()}#B(J,Q=50){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(){let J=this.getAttribute("x"),Q=this.getAttribute("y");return{x:J===null||!J.trim()?50:this.#B(J,50),y:Q===null||!Q.trim()?50:this.#B(Q,50)}}#k(J){if(typeof J!=="string"||!J.trim())return null;try{let Q=JSON.parse(J);if(!Q||typeof Q!=="object"||Array.isArray(Q))return null;return{x:this.#B(Q.x,this.#j?.x??50),y:this.#B(Q.y,this.#j?.y??50)}}catch{return null}}#Y(J){let Q=this.#O(),Z={x:this.#B(J?.x,Q.x),y:this.#B(J?.y,Q.y)};return this.#G=!0,this.setAttribute("x",String(Z.x)),this.setAttribute("y",String(Z.y)),this.#G=!1,Z}#M(J,Q){let Z=document.createElement("fig-input-number");if(Z.setAttribute("data-propskit-position-axis",J),Z.setAttribute("value",String(Q)),Z.setAttribute("min","0"),Z.setAttribute("max","100"),Z.setAttribute("step","1"),Z.setAttribute("precision","2"),this.units==="percent")Z.setAttribute("units","%");Z.setAttribute("aria-label",`${J.toUpperCase()} position`);let $=document.createElement("span");if($.setAttribute("slot","prepend"),$.textContent=J.toUpperCase(),Z.append($),Y(this,"disabled"))Z.setAttribute("disabled","");return Z}#P(){let J=this.#O(),Q=document.createElement("fig-field");Q.className="propskit-position-row",Q.setAttribute("direction","horizontal");let Z=document.createElement("label"),$=this.#M("x",J.x),j=this.#M("y",J.y);Q.append(Z,$,j),this.#Z=Q,this.#Q=$,this.#J=j,this.replaceChildren(Q),V(this)}#N(){let J=this.#Z?.querySelector(":scope > label");if(!J)return;let Q=this.getAttribute("label");J.textContent=Q?.trim()||"Position"}#L(){let J=this.#O();this.#Q?.setAttribute("value",String(J.x)),this.#J?.setAttribute("value",String(J.y)),this.#U(),this.#K()}#U(){let J=this.units==="percent"?"%":null;for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J)Q.setAttribute("units",J);else Q.removeAttribute("units")}}#K(){let J=Y(this,"disabled");this.#Q?.toggleAttribute("disabled",J),this.#J?.toggleAttribute("disabled",J)}#T(){this.#F(),this.#Q?.addEventListener("input",this.#X),this.#Q?.addEventListener("change",this.#_),this.#J?.addEventListener("input",this.#X),this.#J?.addEventListener("change",this.#_)}#F(){this.#Q?.removeEventListener("input",this.#X),this.#Q?.removeEventListener("change",this.#_),this.#J?.removeEventListener("input",this.#X),this.#J?.removeEventListener("change",this.#_)}#W(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q.currentTarget?.getAttribute("data-propskit-position-axis");if(Z!=="x"&&Z!=="y")return;let $=this.value;$[Z]=this.#B(Q.currentTarget.value,$[Z]);let j=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{...j,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#H(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu"))return;this.focus()}get x(){return this.#O().x}set x(J){this.setAttribute("x",String(this.#B(J,50)))}get y(){return this.#O().y}set y(J){this.setAttribute("y",String(this.#B(J,50)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#O()}}set value(J){let Q=this.#Y(J);this.#L(Q)}get defaultValue(){return this.#k(this.getAttribute("default"))||{...this.#j||{x:50,y:50}}}get isDefault(){return n(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,p(this,{...J,units:this.units})}focus(J){this.#Q?.focus(J)}}L("propskit-position",LJ);class UJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#K.bind(this,"input");#_=this.#K.bind(this,"change");#q=this.#T.bind(this);connectedCallback(){if(!this.#j)this.#Y(this.#k()),this.#j=!0;if(!this.#Z)this.#M();this.#P(),this.#N(),this.#L(),this.#U(this.#k()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#Y(this.#k());this.#U($)}return}if(J==="size"){this.#N();return}if(J==="disabled"){this.#L();return}this.#P()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),color:typeof Q.color==="string"&&Q.color.trim()?Q.color.trim():"#D9D9D9"}}#k(){return this.#O(this.getAttribute("value"))}#Y(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#M(){let J=this.#k(),Q=document.createElement("fig-group"),Z=document.createElement("propskit-color"),$=document.createElement("propskit-position");Q.setAttribute("compact",""),Z.setAttribute("label","Color"),Z.setAttribute("value",J.color),Z.setAttribute("data-propskit-color-point-control","color"),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),$.setAttribute("units","percent"),$.setAttribute("data-propskit-color-point-control","position"),this.#Z=Q,this.#Q=Z,this.#J=$,this.#P(),this.#N(),this.#L(),Q.append(Z,$),this.replaceChildren(Q)}#P(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#N(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#L(){r(this,[this.#Q,this.#J])}#U(J){let Q=this.#O(J);if(this.#Q)this.#Q.value=Q.color;if(this.#J)this.#J.value={x:Q.x,y:Q.y}}#K(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-color-point-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-color-point-control");if(j==="color")$.color=Z.value||Z.getAttribute("value");else if(j==="position")$.x=this.#B(Z.value?.x,$.x),$.y=this.#B(Z.value?.y,$.y);else return;let _=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,units:"percent"},bubbles:!0,cancelable:!0,composed:!0}))}#T(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get value(){return{...this.#k()}}set value(J){let Q=this.#Y(J);this.#U(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-color-point",UJ);class KJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#H.bind(this,"input");#_=this.#H.bind(this,"change");#q=this.#S.bind(this);connectedCallback(){if(!this.#j)this.#M(this.#Y()),this.#j=!0;if(!this.#Z)this.#N();this.#L(),this.#U(),this.#K(),this.#T(),this.#F(this.#Y()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#M(this.#Y());this.#F($)}return}if(J==="size"){this.#U();return}if(J==="units"){this.#K();return}if(J==="disabled"){this.#T();return}this.#L()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){if(typeof J==="string"&&J.trim().endsWith("%")){let Q=Number.parseFloat(J);if(Number.isFinite(Q))return`${Q}%`}return this.#B(J,0)}#k(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),radius:this.#O(Q.radius)}}#Y(){return this.#k(this.getAttribute("value"))}#M(J){let Q=this.#k(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#P(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#N(){let J=this.#Y(),Q=this.#P(J.radius),Z=document.createElement("fig-group"),$=document.createElement("propskit-position"),j=document.createElement("propskit-number");if(Z.setAttribute("compact",""),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),this.hasAttribute("units"))$.setAttribute("units",this.units);if($.setAttribute("data-propskit-point-radius-control","position"),j.setAttribute("label","Radius"),j.setAttribute("value",String(Q.value)),this.units==="percent")j.setAttribute("units","%");j.setAttribute("units-disallow",""),j.setAttribute("min","0"),j.setAttribute("precision","2"),j.setAttribute("data-propskit-point-radius-control","radius"),this.#Z=Z,this.#Q=$,this.#J=j,this.#L(),this.#U(),this.#T(),Z.append($,j),this.replaceChildren(Z)}#L(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#U(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#K(){if(this.hasAttribute("units"))this.#Q?.setAttribute("units",this.units);else this.#Q?.removeAttribute("units");if(this.units==="percent")this.#J?.setAttribute("units","%");else this.#J?.removeAttribute("units")}#T(){r(this,[this.#Q,this.#J])}#F(J){let Q=this.#k(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#P(Q.radius);this.#J.value=Z.value}}#W(J,Q){let Z=this.#P(Q).value,$=this.#B(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#H(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-radius-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-point-radius-control");if(j==="position")$.x=this.#B(Z.value?.x,$.x),$.y=this.#B(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#W(Z,$.radius);else return;let _=this.#M($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#P(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#S(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#Y()}}set value(J){let Q=this.#M(J);this.#F(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-radius",KJ);class SJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=null;#$=!1;#G=!1;#X=!1;#_=this.#S.bind(this,"input");#q=this.#S.bind(this,"change");#B=this.#V.bind(this);connectedCallback(){if(!this.#$)this.#P(this.#M()),this.#$=!0;if(!this.#Z)this.#L();this.#U(),this.#K(),this.#T(),this.#F(),this.#W(this.#M()),this.removeEventListener("input",this.#_),this.addEventListener("input",this.#_),this.removeEventListener("change",this.#q),this.addEventListener("change",this.#q),this.removeEventListener("openchange",this.#B),this.addEventListener("openchange",this.#B)}disconnectedCallback(){this.removeEventListener("input",this.#_),this.removeEventListener("change",this.#q),this.removeEventListener("openchange",this.#B)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if(J==="value"){if(!this.#G){let $=this.#P(this.#M());this.#W($)}return}if(J==="size"){this.#K();return}if(J==="units"){this.#T();return}if(J==="disabled"){this.#F();return}this.#U()}#O(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#k(J){if(typeof J==="string"&&J.trim().endsWith("%")){let Q=Number.parseFloat(J);if(Number.isFinite(Q))return`${Q}%`}return this.#O(J,0)}#Y(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#O(Q.x,50),y:this.#O(Q.y,50),radius:this.#k(Q.radius),angle:this.#O(Q.angle,0)}}#M(){return this.#Y(this.getAttribute("value"))}#P(J){let Q=this.#Y(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#G=!0,this.setAttribute("value",Z),this.#G=!1,Q}#N(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#L(){let J=this.#M(),Q=this.#N(J.radius),Z=document.createElement("fig-group"),$=document.createElement("propskit-position"),j=document.createElement("propskit-number"),_=document.createElement("propskit-number");if(Z.setAttribute("compact",""),$.setAttribute("label","Position"),$.setAttribute("x",String(J.x)),$.setAttribute("y",String(J.y)),this.hasAttribute("units"))$.setAttribute("units",this.units);if($.setAttribute("data-propskit-point-radius-angle-control","position"),j.setAttribute("label","Radius"),j.setAttribute("value",String(Q.value)),this.units==="percent")j.setAttribute("units","%");j.setAttribute("units-disallow",""),j.setAttribute("min","0"),j.setAttribute("precision","2"),j.setAttribute("data-propskit-point-radius-angle-control","radius"),_.setAttribute("label","Angle"),_.setAttribute("value",String(J.angle)),_.setAttribute("units","°"),_.setAttribute("units-disallow",""),_.setAttribute("precision","1"),_.setAttribute("data-propskit-point-radius-angle-control","angle"),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=_,this.#U(),this.#K(),this.#F(),Z.append($,j,_),this.replaceChildren(Z)}#U(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#K(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J,this.#j]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#T(){if(this.hasAttribute("units"))this.#Q?.setAttribute("units",this.units);else this.#Q?.removeAttribute("units");if(this.units==="percent")this.#J?.setAttribute("units","%");else this.#J?.removeAttribute("units")}#F(){r(this,[this.#Q,this.#J,this.#j])}#W(J){let Q=this.#Y(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#N(Q.radius);this.#J.value=Z.value}if(this.#j)this.#j.value=Q.angle}#H(J,Q){let Z=this.#N(Q).value,$=this.#O(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#S(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-radius-angle-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.getAttribute("data-propskit-point-radius-angle-control");if(j==="position")$.x=this.#O(Z.value?.x,$.x),$.y=this.#O(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#H(Z,$.radius);else if(j==="angle")$.angle=this.#O(Z.value,$.angle);else return;let _=this.#P($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#N(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#V(J){if(J.target!==this.#Z||this.#X)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#X=!0,this.setAttribute("open",String(Q)),this.#X=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#M()}}set value(J){let Q=this.#P(J);this.#W(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-radius-angle",SJ);class TJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#$=!1;#G=!1;#X=this.#F.bind(this,"input");#_=this.#F.bind(this,"change");#q=this.#W.bind(this);connectedCallback(){if(!this.#j)this.#Y(this.#k()),this.#j=!0;if(!this.#Z)this.#P();this.#N(),this.#L(),this.#U(),this.#K(),this.#T(this.#k()),this.removeEventListener("input",this.#X),this.addEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.addEventListener("change",this.#_),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#X),this.removeEventListener("change",this.#_),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#$){let $=this.#Y(this.#k());this.#T($)}return}if(J==="size"){this.#L();return}if(J==="units"){this.#U();return}if(J==="disabled"){this.#K();return}this.#N()}#B(J,Q){let Z=Number(J);return Number.isFinite(Z)?Z:Q}#O(J){let Q=J;if(typeof J==="string")try{Q=JSON.parse(J)}catch{Q=null}if(!Q||typeof Q!=="object"||Array.isArray(Q))Q={};return{x:this.#B(Q.x,50),y:this.#B(Q.y,50),x2:this.#B(Q.x2,75),y2:this.#B(Q.y2,75)}}#k(){return this.#O(this.getAttribute("value"))}#Y(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#$=!0,this.setAttribute("value",Z),this.#$=!1,Q}#M(J,Q,Z,$){let j=document.createElement("propskit-position");if(j.setAttribute("label",J),j.setAttribute("x",String(Z)),j.setAttribute("y",String($)),this.hasAttribute("units"))j.setAttribute("units",this.units);return j.setAttribute("data-propskit-point-point-control",Q),j}#P(){let J=this.#k(),Q=document.createElement("fig-group"),Z=this.#M("Start","start",J.x,J.y),$=this.#M("End","end",J.x2,J.y2);Q.setAttribute("compact",""),this.#Z=Q,this.#Q=Z,this.#J=$,this.#N(),this.#L(),this.#K(),Q.append(Z,$),this.replaceChildren(Q)}#N(){if(!this.#Z)return;this.#Z.setAttribute("compact","");let J=this.getAttribute("label")?.trim();if(J)this.#Z.setAttribute("name",J);else this.#Z.removeAttribute("name");if(this.#Z.toggleAttribute("collapsible",this.collapsible),this.collapsible)this.#Z.setAttribute("open",String(this.open));else this.#Z.removeAttribute("open")}#L(){let J=this.getAttribute("size");for(let Q of[this.#Q,this.#J]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#U(){for(let J of[this.#Q,this.#J]){if(!J)continue;if(this.hasAttribute("units"))J.setAttribute("units",this.units);else J.removeAttribute("units")}}#K(){r(this,[this.#Q,this.#J])}#T(J){let Q=this.#O(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J)this.#J.value={x:Q.x2,y:Q.y2}}#F(J,Q){if(Q.target===this)return;let Z=Q.target?.closest?.("[data-propskit-point-point-control]");if(!Z||!this.contains(Z))return;if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let $=this.value,j=Z.value,_=Z.getAttribute("data-propskit-point-point-control");if(_==="start")$.x=this.#B(j?.x,$.x),$.y=this.#B(j?.y,$.y);else if(_==="end")$.x2=this.#B(j?.x,$.x2),$.y2=this.#B(j?.y,$.y2);else return;let X=this.#Y($);this.dispatchEvent(new CustomEvent(J,{detail:{...X,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#W(J){if(J.target!==this.#Z||this.#G)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#G=!0,this.setAttribute("open",String(Q)),this.#G=!1,this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0,composed:!0}))}get collapsible(){let J=this.getAttribute("collapsible");return J===null||J!=="false"}set collapsible(J){this.setAttribute("collapsible",String(Boolean(J)))}get open(){let J=this.getAttribute("open");return J===null||J!=="false"}set open(J){this.setAttribute("open",String(Boolean(J)))}get units(){return this.getAttribute("units")?.trim().toLowerCase()==="percent"?"percent":"none"}set units(J){this.setAttribute("units",String(J).trim().toLowerCase()==="none"?"none":"percent")}get value(){return{...this.#k()}}set value(J){let Q=this.#Y(J);this.#T(Q)}focus(J){this.#Q?.focus(J)}}L("propskit-point-point",TJ);class o extends HTMLElement{static observedAttributes=["name","open","show-reset","disabled","size"];static#Z=["propskit-color","propskit-fill","propskit-gradient","propskit-number","propskit-position","propskit-color-point","propskit-point-radius","propskit-point-radius-angle","propskit-point-point","propskit-select","propskit-slider","propskit-switch","propskit-text","propskit-wheel","propskit-oscillator"].join(",");#Q=null;#J=null;#j=null;#$=null;#G=0;#X=()=>this.#B();connectedCallback(){this.#V(),this.#N(),this.#L(),this.#_(),requestAnimationFrame(()=>{this.#T()})}disconnectedCallback(){if(this.#q(),this.#G)cancelAnimationFrame(this.#G),this.#G=0;this.#Q?.removeEventListener("click",this.#k),this.#Q?.removeEventListener("keydown",this.#Y),this.#j?.querySelector("fig-button")?.removeEventListener("click",this.#M)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="open"){this.#Q?.setAttribute("aria-expanded",String(this.open));return}if(J==="show-reset"){this.#H(),this.#T();return}if(J==="disabled"){this.#N();return}if(J==="size"){this.#L();return}this.#V()}get open(){let J=this.getAttribute("open");return J!==null&&J!=="false"}set open(J){let Q=this.open;if(J)this.setAttribute("open","true");else this.setAttribute("open","false");if(this.#Q?.setAttribute("aria-expanded",String(!!J)),Q!==!!J)this.dispatchEvent(new CustomEvent("openchange",{detail:{open:!!J},bubbles:!0}))}get showReset(){let J=this.getAttribute("show-reset");if(J===null)return!0;return J!=="false"}set showReset(J){if(J)this.setAttribute("show-reset","true");else this.setAttribute("show-reset","false")}get dirty(){return this.hasAttribute("data-dirty")&&this.getAttribute("data-dirty")!=="false"}resetProperties(){this.#W()}#_(){if(this.removeEventListener("input",this.#X,!0),this.removeEventListener("change",this.#X,!0),this.addEventListener("input",this.#X,!0),this.addEventListener("change",this.#X,!0),!this.#$)this.#$=new MutationObserver(()=>{this.#N(),this.#L(),this.#B()});this.#$.disconnect(),this.#$.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","checked","default","x","y"]})}#q(){this.removeEventListener("input",this.#X,!0),this.removeEventListener("change",this.#X,!0),this.#$?.disconnect()}#B(){if(this.#G)return;this.#G=requestAnimationFrame(()=>{this.#G=0,this.#T()})}#O(J){return J instanceof Element&&Boolean(J.closest(".propskit-group-reset, .propskit-group-reset-tooltip"))}#k=(J)=>{if(Y(this,"disabled"))return;if(this.#O(J.target))return;J.stopPropagation(),this.open=!this.open};#Y=(J)=>{if(Y(this,"disabled"))return;if(this.#O(J.target))return;if(J.key!=="Enter"&&J.key!==" ")return;J.preventDefault(),J.stopPropagation(),this.open=!this.open};#M=(J)=>{if(J.preventDefault(),J.stopPropagation(),Y(this,"disabled"))return;this.#W()};#P(){return[...this.querySelectorAll(o.#Z)].filter((J)=>J.closest("propskit-group")===this&&!J.parentElement?.closest(o.#Z))}#N(){let J=Y(this,"disabled");for(let Q of this.#P())if(J){if(!Y(Q,"disabled"))Q.setAttribute("disabled",""),Q.setAttribute("data-propskit-group-disabled","")}else if(Q.hasAttribute("data-propskit-group-disabled"))Q.removeAttribute("disabled"),Q.removeAttribute("data-propskit-group-disabled");this.#Q?.setAttribute("aria-disabled",String(J)),this.#Q?.setAttribute("tabindex",J?"-1":"0"),this.#j?.querySelector("fig-button")?.toggleAttribute("disabled",J)}#L(){let J=this.getAttribute("size")==="small";for(let Q of this.#P()){let Z=Q.hasAttribute("data-propskit-group-size");if(J&&!Q.hasAttribute("size"))Q.setAttribute("data-propskit-group-size",""),Q.setAttribute("size","small");else if(J&&Z&&Q.getAttribute("size")!=="small")Q.setAttribute("size","small");else if(!J&&Z)Q.removeAttribute("size"),Q.removeAttribute("data-propskit-group-size")}}#U(J){return J.isDefault===!1}#K(){for(let J of this.#P())if(this.#U(J))return!0;return!1}#T(){if(this.#K())this.setAttribute("data-dirty","");else this.removeAttribute("data-dirty");this.#H()}#F(J){if(typeof J.resetToDefault==="function")J.resetToDefault()}#W(){for(let J of this.#P())this.#F(J);this.#T(),this.dispatchEvent(new CustomEvent("reset",{bubbles:!0,composed:!0}))}#H(){if(!this.showReset){this.#j?.setAttribute("hidden","");return}this.#S(),this.#j?.removeAttribute("hidden")}#S(){if(!this.#Q||!this.showReset)return;let J=this.#Q.querySelector(":scope > .propskit-group-reset-tooltip");if(!J){J=document.createElement("fig-tooltip"),J.className="propskit-group-reset-tooltip",J.setAttribute("text","Reset properties");let Q=document.createElement("fig-button");Q.className="propskit-group-reset",Q.setAttribute("variant","ghost"),Q.setAttribute("icon",""),Q.setAttribute("aria-label","Reset properties");let Z=document.createElement("fig-icon");Z.setAttribute("name","reset"),Q.appendChild(Z),J.appendChild(Q),this.#Q.appendChild(J),Q.addEventListener("click",this.#M)}else{let Q=J.querySelector("fig-button");Q?.removeEventListener("click",this.#M),Q?.addEventListener("click",this.#M)}this.#j=J}#V(){let Q=this.getAttribute("name")||"Group",Z=this.querySelector(":scope > fig-header");if(Z)this.#Q=Z;else if(!this.#Q||!this.#Q.dataset.generated||this.#Q.parentElement!==this)this.#Q=document.createElement("fig-header"),this.#Q.setAttribute("borderless",""),this.#Q.dataset.generated="true",this.prepend(this.#Q);let $=this.#Q.querySelector(":scope > h3"),j=this.#Q.querySelector(":scope > fig-button.propskit-group-disclosure");if(!$&&j){if($=j.querySelector(":scope > h3"),$)this.#Q.insertBefore($,j);j.remove()}if(!$)$=document.createElement("h3"),this.#Q.prepend($);let _=$.querySelector(":scope > button.propskit-group-disclosure");if(_){while(_.firstChild)$.insertBefore(_.firstChild,_);_.remove()}if(!$.id)$.id=jJ("propskit-group");if(this.#Q.dataset.generated){let X=$.querySelector(".propskit-group-chevron");if($.textContent=Q,X)$.prepend(X)}if(!this.hasAttribute("role"))this.setAttribute("role","group");if(!this.hasAttribute("aria-label")&&!this.hasAttribute("aria-labelledby"))this.setAttribute("aria-labelledby",$.id);if(!$.querySelector(".propskit-group-chevron")){let X=document.createElement("fig-icon");X.setAttribute("name","chevron"),X.setAttribute("size","small"),X.className="propskit-group-chevron",$.prepend(X)}if(this.#J=$.querySelector(".propskit-group-chevron"),this.#H(),this.#Q.setAttribute("role","button"),this.#N(),this.#Q.setAttribute("aria-expanded",String(this.open)),this.#Q.removeEventListener("click",this.#k),this.#Q.addEventListener("click",this.#k),this.#Q.removeEventListener("keydown",this.#Y),this.#Q.addEventListener("keydown",this.#Y),!this.hasAttribute("open"))this.setAttribute("open","false"),this.#Q.setAttribute("aria-expanded","false")}}L("propskit-group",o);class FJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#$=null;#G=new Set;#X=0;#_=0;#q=null;#B=null;#O=0;#k=null;#Y=null;#M=!1;#P=0;#N=null;#L=0;#U=null;#K=null;#T=0;#F=0;#W=!1;#H=!1;#S=0;#V=null;#R=null;#I=this.#jJ.bind(this);#w=this.#e.bind(this);#f=this.#NJ.bind(this);#E=this.#MJ.bind(this);#p=this.#kJ.bind(this);#D=this.#o.bind(this);#c=this.#UJ.bind(this);#b=this.#FJ.bind(this);#C=this.#SJ.bind(this);#z=this.#d.bind(this);#v=new Set(["variant","color","text","full","elastic","size","name","class","data-wave-index","data-active","data-elastic-dragging","default","style"]);static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#x();if(this.#m(),this.#g(),this.#JJ(),this.#t(),this.removeEventListener("pointerdown",this.#I,{capture:!0}),this.addEventListener("pointerdown",this.#I,{capture:!0,passive:!0}),this.removeEventListener("pointerdown",this.#E,{capture:!0}),this.addEventListener("pointerdown",this.#E,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.addEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#z,!0),this.addEventListener("click",this.#z,!0),this.#B?.removeEventListener("change",this.#C),this.#B?.addEventListener("change",this.#C),!this.#$)this.#$=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J)if($.type==="attributes"){if($.attributeName==="value"){this.#s();continue}if($.attributeName==="color"){Z=!0;continue}if($.attributeName&&this.#v.has($.attributeName))continue;if($.attributeName==="label"||$.attributeName==="direction")Q=!0;else Z=!0}if(Q)this.#m();if(Z)this.#g(),this.#t()});this.#$.observe(this,{attributes:!0})}disconnectedCallback(){if(this.#$?.disconnect(),this.#X)cancelAnimationFrame(this.#X),this.#X=0;if(this.#_)cancelAnimationFrame(this.#_),this.#_=0;this.#n(),this.#$J(),clearTimeout(this.#S),this.#S=0,this.#_J(),this.#OJ(),this.#LJ(),this.#QJ(),this.removeEventListener("pointerdown",this.#I,{capture:!0}),this.removeEventListener("pointerdown",this.#E,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#z,!0),this.#B?.removeEventListener("change",this.#C)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#m()}#x(){let J=(this.getAttribute("type")||"range").toLowerCase();this.#Y=this.getAttribute("value")??this.getAttribute("default")??(J==="delta"?"0":this.getAttribute("min")??"0");let Q=Array.from(this.childNodes).filter((X)=>{return X.nodeType!==Node.TEXT_NODE||Boolean(X.textContent?.trim())}),Z=Q.find((X)=>X.nodeType===Node.ELEMENT_NODE&&X.matches("label")),$=document.createElement("fig-field"),j=Z||document.createElement("label"),_=document.createElement("fig-slider");_.setAttribute("text","true");for(let X of this.#l()){let q=this.getAttribute(X);_.setAttribute(X,q??"")}$.append(j,_),this.#Z=$,this.#Q=j,this.#J=_,this.#j=Boolean(Z),this.replaceChildren($),this.#y();for(let X of Q){if(X===Z)continue;this.#J.appendChild(X)}}#y(){let J=document.createElement("fig-menu");J.setAttribute("position","bottom left"),J.setAttribute("offset","0 0");let Q=document.createElement("fig-menu-item");Q.setAttribute("value","reset-default"),Q.textContent="Reset",J.appendChild(Q),J.addEventListener("change",this.#C),this.#B=J,this.appendChild(J)}#m(){if(!this.#Z||!this.#Q)return;let J=this.hasAttribute("label"),Q=this.getAttribute("label");if(J&&(Q??"").trim()===""){if(this.#Q.parentElement===this.#Z)this.#Q.remove()}else{if(!this.#j)this.#Q.textContent=J?Q??"":"Label";if(this.#Q.parentElement!==this.#Z)this.#Z.prepend(this.#Q)}this.#Z.setAttribute("direction",this.getAttribute("direction")||"horizontal")}#g(){if(!this.#J)return;let J=this.#l(),Q=new Set(J.filter(($)=>$!=="text"&&$!=="value"));for(let $ of this.#G)if(!Q.has($))this.#J.removeAttribute($);for(let $ of J){if($==="text"||$==="value")continue;let j=this.getAttribute($)??"";if(this.#J.getAttribute($)!==j)this.#J.setAttribute($,j)}this.#J.removeAttribute("variant"),this.#J.removeAttribute("color"),this.#J.removeAttribute("transform"),this.#J.removeAttribute("full"),this.#J.setAttribute("text","true");let Z=(this.getAttribute("type")||"range").toLowerCase();if(Z==="delta"){let $=Number(this.#J.min),j=Number(this.#J.max),_=Number.isFinite($)&&Number.isFinite(j)?$+(j-$)/2:0;this.#J.setAttribute("default",String(_))}else this.#J.removeAttribute("default");if(Z==="stepper")this.#J.setAttribute("step",this.getAttribute("step")??"10");else if(!this.hasAttribute("step"))this.#J.removeAttribute("step");if(Z==="opacity")this.#J.style.setProperty("--color",this.getAttribute("color")||"var(--figma-color-bg-secondary)");else this.#J.style.removeProperty("--color");this.#a(Z),this.#G=Q,this.#s(),this.#ZJ()}#a(J){let Q=this.#J?.querySelector("fig-input-number");if(!(J==="hue"||J==="opacity"&&this.hasAttribute("color"))){Q?.removeAttribute("theme"),this.style.removeProperty("--propskit-slider-filled-text-color");return}let $=Number(this.#J?.min),j=Number(this.#J?.max),_=Number(this.#J?.value),X=Number.isFinite($)&&Number.isFinite(j)&&j>$&&Number.isFinite(_)?Math.max(0,Math.min(1,(_-$)/(j-$))):0,q=this.getAttribute("color"),B=J==="hue"?`hsl(${X*360}deg 100% 50%)`:`color-mix(in srgb, ${q} ${X*100}%, var(--figma-color-bg-secondary))`,O=getComputedStyle(this).colorScheme.trim().toLowerCase()==="dark",G=RJ(this.#J,B,J==="hue"?0.35:O?0.2:0.35);if(G){Q?.setAttribute("theme",G);let M=G==="light"&&O||G==="dark"&&!O;this.style.setProperty("--propskit-slider-filled-text-color",M?"var(--figma-color-text)":"var(--figma-color-text-oninverse)")}else Q?.removeAttribute("theme"),this.style.removeProperty("--propskit-slider-filled-text-color")}#A(){if(!this.#J)return;let J=Number(this.#J.min),Q=Number(this.#J.max),Z=Number(this.#J.value),$=Number.isFinite(J)&&Number.isFinite(Q)&&Q>J&&Number.isFinite(Z)?Math.max(0,Math.min(1,(Z-J)/(Q-J))):0;this.style.setProperty("--propskit-slider-complete",String($)),this.#a((this.getAttribute("type")||"range").toLowerCase())}#s(){if(!this.#J)return;let J=this.hasAttribute("value")?this.getAttribute("value")??"":this.#Y??"";if(String(this.#J.value)!==J)this.#J.value=J;this.#A()}#l(){let J=new Set(["label","direction","oninput","onchange","steppers"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!this.#v.has(Q))}#ZJ(){if(this.#X)cancelAnimationFrame(this.#X);this.#X=requestAnimationFrame(()=>{this.#X=0,this.#u(),this.#h()})}#t(){if(this.#_)cancelAnimationFrame(this.#_);this.#_=requestAnimationFrame(()=>{this.#_=0,this.#h()})}#h(){let J=this.#J?.querySelector('input[type="range"]'),Q=this.#J?.querySelector("fig-input-number input");if(J!==this.#q)this.#GJ(J);if(J){J.removeAttribute("tabindex"),J.removeAttribute("aria-hidden");let Z=this.getAttribute("aria-label")||this.#Q?.textContent?.trim()||"Slider";if(!J.hasAttribute("aria-label")&&!J.hasAttribute("aria-labelledby"))J.setAttribute("aria-label",Z)}if(Q)Q.removeAttribute("tabindex"),Q.removeAttribute("aria-hidden")}#d(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#H&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#H=!1;return}this.#YJ()}#YJ(){requestAnimationFrame(()=>{requestAnimationFrame(()=>{if(this.isConnected&&!Y(this,"disabled"))this.focus()})})}#GJ(J){if(this.#LJ(),this.#q=J,!this.#q)return;this.#q.addEventListener("dblclick",this.#c,{capture:!0})}#LJ(){if(!this.#q)return;this.#q.removeEventListener("dblclick",this.#c,{capture:!0}),this.#q=null}#UJ(J){J.preventDefault(),J.stopImmediatePropagation(),this.#WJ()}#MJ(J){if(J.button!==0||J.altKey||Y(this,"disabled")||!(J.target instanceof Element))return;let Q=J.target.closest("fig-input-number input");if(!Q||Q===document.activeElement)return;J.preventDefault(),J.stopImmediatePropagation(),this.#$J(),this.#K=J.pointerId,this.#T=J.clientX,this.#F=J.clientY,this.#W=!1,window.addEventListener("pointermove",this.#p),window.addEventListener("pointerup",this.#D,{once:!0}),window.addEventListener("pointercancel",this.#D,{once:!0}),window.addEventListener("blur",this.#D,{once:!0})}#kJ(J){if(J.pointerId!==this.#K)return;if(J.buttons===0){this.#o(J);return}if(!this.#W){if(Math.hypot(J.clientX-this.#T,J.clientY-this.#F)<4)return;this.#W=!0,this.setAttribute("data-number-scrubbing","")}this.#BJ(this.#HJ(J),"input")}#o(J){if(J?.pointerId!==void 0&&this.#K!==null&&J.pointerId!==this.#K)return;let Q=this.#W;if(this.#$J(),Q){this.#BJ(this.#J?.value,"change"),this.#H=!0,clearTimeout(this.#S),this.#S=window.setTimeout(()=>{this.#H=!1,this.#S=0},0),this.#YJ();return}this.#J?.querySelector("fig-input-number input")?.focus()}#$J(){window.removeEventListener("pointermove",this.#p),window.removeEventListener("pointerup",this.#D),window.removeEventListener("pointercancel",this.#D),window.removeEventListener("blur",this.#D),this.#K=null,this.#W=!1,this.removeAttribute("data-number-scrubbing")}#jJ(J){if(J.button!==0||Y(this,"disabled"))return;if(this.getAttribute("elastic")==="false")return;if(J.target?.closest?.("fig-input-number"))return;let Q=this.#J?.querySelector('input[type="range"]')??this.#q;if(!Q)return;this.#_J(),this.#OJ(),this.#q=Q,this.#M=!0,this.#U=J.pointerId,this.#P=this.#zJ();let Z=Q.getBoundingClientRect(),$=this.getBoundingClientRect();this.#N={left:Z.left,right:Z.right,width:Z.width},this.#L=$.width,window.addEventListener("pointermove",this.#w,{passive:!0}),window.addEventListener("pointerup",this.#f,{once:!0}),window.addEventListener("pointercancel",this.#f,{once:!0}),window.addEventListener("blur",this.#f,{once:!0})}#e(J){if(!this.#M)return;if(J.pointerId!==this.#U)return;if(J.buttons===0){this.#NJ(J);return}this.#r(J.clientX)}#NJ(J){if(J?.pointerId!==void 0&&this.#U!==null&&J.pointerId!==this.#U)return;let Q=J?.type==="pointerup"||J?.type==="pointermove"&&J.buttons===0;if(this.#_J(),this.#OJ(),Q)this.#YJ()}#_J(){window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f),this.#M=!1,this.#U=null}#FJ(J){if(Y(this,"disabled"))return;J.preventDefault(),J.stopPropagation(),J.stopImmediatePropagation(),this.#n(),this.#KJ(J.clientX,J.clientY)}#KJ(J,Q){let Z=!1,$=0,j=()=>{if(Z)return;Z=!0,window.clearTimeout($),window.removeEventListener("pointerup",j,!0),window.removeEventListener("pointercancel",j,!0),requestAnimationFrame(()=>{this.#B?.showAt?.(J,Q)})};window.addEventListener("pointerup",j,{once:!0,capture:!0}),window.addEventListener("pointercancel",j,{once:!0,capture:!0}),$=window.setTimeout(j,180)}#SJ(J){if(J.stopPropagation(),J.detail?.value!=="reset-default")return;this.#WJ()}#n(){if(this.#O)clearTimeout(this.#O),this.#O=0;this.#k=null}#zJ(){let J=getComputedStyle(this).getPropertyValue("--propskit-slider-elastic-distance").trim();if(J.includes("var(")||!J.endsWith("px")){let Z=document.createElement("div");Object.assign(Z.style,{position:"absolute",visibility:"hidden",pointerEvents:"none",width:"var(--propskit-slider-elastic-distance)"}),this.appendChild(Z),J=getComputedStyle(Z).width,Z.remove()}let Q=Number.parseFloat(J);return Number.isFinite(Q)?Math.max(0,Q):0}#r(J){let Q=this.#N;if(!Q||!this.#P){this.#OJ();return}let Z=J<Q.left?J-Q.left:J>Q.right?J-Q.right:0;if(!Z){this.#XJ();return}let $=Math.max(-this.#P,Math.min(this.#P,Z*0.5)),j=Math.abs($),_=this.#L?(this.#L+j)/this.#L:1;this.dataset.elasticDragging="true",this.style.setProperty("--propskit-slider-elastic-size",`${j}px`),this.style.setProperty("--propskit-slider-elastic-scale",`${_}`),this.style.setProperty("--propskit-slider-elastic-origin",$<0?"right center":"left center")}#OJ(){this.#XJ(),this.#P=0,this.#N=null,this.#L=0,this.#U=null}#XJ(){this.removeAttribute("data-elastic-dragging"),this.style.removeProperty("--propskit-slider-elastic-size"),this.style.removeProperty("--propskit-slider-elastic-scale")}#HJ(J){let Q=this.#q;if(!Q)return this.#J?.value??"";let Z=Q.getBoundingClientRect(),$=Z.width?Math.min(1,Math.max(0,(J.clientX-Z.left)/Z.width)):0,j=Number(Q.min||0),_=Number(Q.max||100),X=Q.step==="any"?0:Number(Q.step||1),q=j+(_-j)*$;if(!X)return String(q);let B=Math.round((q-j)/X)*X+j,O=Math.max(0,`${X}`.split(".")[1]?.length||0);return String(Number(B.toFixed(O)))}#TJ(){return this.getAttribute("default")??this.#Y??this.#q?.min??"0"}#WJ(){this.#n(),this.#BJ(this.#TJ(),"input"),this.#BJ(this.#TJ(),"change")}#BJ(J,Q){if(!this.#J||J===null||J===void 0)return;this.#J.value=J,this.setAttribute("value",String(this.#J.value)),this.dispatchEvent(new CustomEvent(Q,{detail:this.#J.value,bubbles:!0,cancelable:!0,composed:!0}))}#u(){if(!this.#J)return;let J=this.#J.querySelector("fig-input-number");if(!J)return;if(!(this.hasAttribute("steppers")&&this.getAttribute("steppers")!=="false")){J.removeAttribute("steppers");return}let Z=this.getAttribute("steppers");J.setAttribute("steppers",Z??"")}#JJ(){if(!this.#J)return;if(!this.#V)this.#V=this.#qJ.bind(this,"input");if(!this.#R)this.#R=this.#qJ.bind(this,"change");this.#J.addEventListener("input",this.#V),this.#J.addEventListener("change",this.#R)}#QJ(){if(!this.#J)return;if(this.#V)this.#J.removeEventListener("input",this.#V);if(this.#R)this.#J.removeEventListener("change",this.#R)}#qJ(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;if(J==="change")this.#OJ();let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#J?.value;if(this.#J?.value!==void 0){let $=String(this.#J.value);if(this.getAttribute("value")!==$)this.setAttribute("value",$)}this.#A(),this.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){this.#h();let Q=this.#J?.querySelector('input[type="range"]');Q?.setAttribute("data-propskit-focus-called",""),Q?.focus(J)}get value(){return this.getAttribute("value")??this.#J?.value??""}set value(J){if(J===null||J===void 0||J===""){if(this.removeAttribute("value"),this.#J)this.#J.value="";return}let Q=String(J);if(this.setAttribute("value",Q),this.#J)this.#J.value=Q}get defaultValue(){return this.#TJ()}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){this.#WJ()}}L("propskit-slider",FJ);class E extends HTMLElement{static#Z=33;static#Q=60;static#J=0.55;static#j="fig-input-wheel-dragging";#$=null;#G=null;#X=null;#_=null;#q=null;#B=null;#O=null;#k=0;#Y=0;#M=0;#P=0;#N=0;#L=null;#U=!1;#K=null;#T=0;#F=0;#W=null;#H=0;#S=0;#V=null;#R=0;#I=this.#LJ.bind(this);#w=this.#UJ.bind(this);#f=this.#kJ.bind(this);#E=this.#FJ.bind(this);#p=this.#KJ.bind(this);static get observedAttributes(){return["value","disabled","step","min","max","spin","elastic"]}connectedCallback(){if(!this.#$)this.#D();if(this.#ZJ(),this.#s(),this.#YJ(),this.#L?.disconnect(),globalThis.ResizeObserver)this.#L=new ResizeObserver((J)=>{let Q=J.at(-1)?.contentRect;if(Q)this.#t(Q.width,Q.height)}),this.#L.observe(this);this.#h()}disconnectedCallback(){if(this.#L?.disconnect(),this.#M)cancelAnimationFrame(this.#M);this.#M=0,this.#n(),this.#GJ(),this.#o()}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#$)return;if(J==="disabled")this.#ZJ();if(J==="value"&&!this.#U)this.#s();if(J==="step")this.#l(),this.#h();if(J==="spin")this.#h();if(J==="min"||J==="max")this.#A(this.#z())}#D(){if(this.#$=this,this.#G=this,this.#X=this,this.setAttribute("role","spinbutton"),!this.hasAttribute("aria-label")&&!this.hasAttribute("aria-labelledby"))this.setAttribute("aria-label","Value");this.setAttribute("tabindex","0");let J=A("svg",{className:"fig-input-wheel-svg","aria-hidden":"true"}),Q=P("div",{className:"fig-input-wheel-handle"});this.#_=J,this.replaceChildren(J,Q);let Z=document.createElement("div");Z.setAttribute("aria-hidden","true"),Z.style.cssText="position:absolute;visibility:hidden;pointer-events:none;left:0;top:0";let $=document.createElement("div");$.style.height="var(--fig-input-wheel-tick-height)";let j=document.createElement("div");j.style.height="var(--fig-input-wheel-tick-height-min)";let _=document.createElement("div");_.style.width="var(--fig-input-wheel-tick-width)";let X=document.createElement("div");X.style.width="var(--fig-input-wheel-tick-width-min)",Z.append($,j,_,X),this.append(Z),this.#O={maxEl:$,minEl:j,maxWidthEl:_,minWidthEl:X},this.#c()}#c(){if(!this.#_||this.#q)return;this.#q=A("path",{className:"fig-input-wheel-tick"}),this.#_.append(this.#q)}#b(){if(this.#B)return this.#B;return this.#B={maxH:this.#O?.maxEl.getBoundingClientRect().height||8,minH:this.#O?.minEl.getBoundingClientRect().height||4,maxW:this.#O?.maxWidthEl.getBoundingClientRect().width||2,minW:this.#O?.minWidthEl.getBoundingClientRect().width||1},this.#B}#C(){if(this.hasAttribute("step")){let J=Number(this.getAttribute("step"));if(J>0)return J}return 1}#z(){let J=Number(this.getAttribute("value")??0);return Number.isFinite(J)?J:0}#v(J){if(!this.hasAttribute(J))return null;let Q=this.getAttribute(J);if(Q===null||Q.trim()==="")return null;let Z=Number(Q);return Number.isFinite(Z)?Z:null}#x(){return this.#v("min")}#y(){return this.#v("max")}#m(J,Q){if(Q===null||Q===void 0||Q===""){this.removeAttribute(J);return}let Z=Number(Q);if(!Number.isFinite(Z)){this.removeAttribute(J);return}this.setAttribute(J,String(Z))}#g(J){let Q=J,Z=this.#x(),$=this.#y();if(Z!==null)Q=Math.max(Z,Q);if($!==null)Q=Math.min($,Q);return Q}#a(J){let Q=this.#C();if(Q<=0)return J;let Z=this.#x()??0,$=Math.round((J-Z)/Q)*Q+Z;return Number($.toPrecision(15))}#A(J,{snap:Q=!1,emit:Z=null}={}){let $=Q?this.#a(J):J;$=this.#g($);let j=String($);if(this.getAttribute("value")!==j)this.setAttribute("value",j);if(this.#l($),this.#h(),Z)this.dispatchEvent(new CustomEvent(Z,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#s(){let J=this.#z(),Q=this.#g(J);if(Q!==J||this.getAttribute("value")!==String(Q)){this.#A(Q);return}this.#l(J),this.#h()}#l(J=this.#z()){if(!this.#X)return;let Q=this.#x(),Z=this.#y();if(this.#X.setAttribute("aria-valuenow",String(J)),this.#X.setAttribute("aria-valuetext",String(J)),Q===null)this.#X.removeAttribute("aria-valuemin");else this.#X.setAttribute("aria-valuemin",String(Q));if(Z===null)this.#X.removeAttribute("aria-valuemax");else this.#X.setAttribute("aria-valuemax",String(Z))}#ZJ(){let J=Y(this,"disabled");if(!this.#X)return;if(J){if(this.#U)this.#o();this.#n(),this.setAttribute("aria-disabled","true"),this.#X.setAttribute("tabindex","-1"),this.#X.setAttribute("aria-disabled","true")}else this.removeAttribute("aria-disabled"),this.#X.setAttribute("tabindex","0"),this.#X.removeAttribute("aria-disabled")}#t(J,Q){if(!this.#_||J<1||Q<1)return;if(J===this.#k&&Q===this.#Y)return;this.#k=J,this.#Y=Q,this.#B=null,this.#_.setAttribute("viewBox",`0 0 ${J} ${Q}`),this.#_.setAttribute("width",String(J)),this.#_.setAttribute("height",String(Q)),this.#h()}#h(){if(this.#M)return;this.#M=requestAnimationFrame(()=>{if(!this.isConnected){this.#M=0;return}if(this.#k<1||this.#Y<1){let J=this.#X?.getBoundingClientRect();if(J)this.#t(J.width,J.height)}this.#d(),this.#M=0})}#d(){if(!this.#q)return;let J=this.#k,Q=this.#Y;if(J<1||Q<1)return;let Z=this.getAttribute("spin")==="false"?this.#x()??0:this.#W??this.#z(),$=360/E.#Z,j=this.#C(),_=this.#x()??0,X=(Z-_)/j*$,q=E.#J,B=J/2,O=Q/2,{maxH:G,minH:M,maxW:k,minW:U}=this.#b(),N=E.#Q,T=Math.max(J/2,1),F=T*0.84,H=[];for(let z=0;z<E.#Z;z+=1){let S=X+z*$;if(S=((S+180)%360+360)%360-180,S<-N||S>=N)continue;let R=S*Math.PI/180,W=B+F*Math.sin(R)/(1-q*Math.cos(R)),f=Math.min(1,Math.abs(W-B)/Math.max(T,1)),I=Math.cos(f*Math.PI*0.5),C=M+(G-M)*I,l=U+(k-U)*I,s=C/2,b=l/2,y=O-s,c=O+s,d=W-b,i=W+b;H.push(`M ${W} ${y} Q ${i} ${y} ${i} ${y+b} V ${c-b} Q ${i} ${c} ${W} ${c} Q ${d} ${c} ${d} ${c-b} V ${y+b} Q ${d} ${y} ${W} ${y} Z`)}this.#q.setAttribute("d",H.join(" "))}#YJ(){this.#$?.addEventListener("pointerdown",this.#I),this.#X?.addEventListener("wheel",this.#E,{passive:!1}),this.#X?.addEventListener("keydown",this.#p)}#GJ(){this.#$?.removeEventListener("pointerdown",this.#I),this.#X?.removeEventListener("wheel",this.#E),this.#X?.removeEventListener("keydown",this.#p),window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f)}#LJ(J){if(Y(this,"disabled"))return;if(J.button!==0)return;if(J.preventDefault(),!this.beginScrub(J))return;this.#$?.setPointerCapture?.(J.pointerId),window.addEventListener("pointermove",this.#w),window.addEventListener("pointerup",this.#f),window.addEventListener("pointercancel",this.#f)}beginScrub(J={}){if(Y(this,"disabled"))return!1;let Q=typeof J==="number"?J:Number(J?.clientX??J?.x);if(!Number.isFinite(Q))return!1;this.#n(),this.#U=!0,this.#K=J&&typeof J==="object"&&J.pointerId!==void 0?J.pointerId:null,this.#T=Q;let Z=J&&typeof J==="object"?Number(J.startValue):Number.NaN;return this.#F=Number.isFinite(Z)?this.#g(Z):this.#z(),this.#$J(),this.setAttribute("data-fig-input-wheel-active",""),document.body.classList.add(E.#j),this.focus(),!0}updateScrub(J,Q){if(!this.#U)return this.#z();let Z=typeof J==="number"?J:Number(J?.clientX??J?.x);if(!Number.isFinite(Z))return this.#z();let $=Q??(typeof J==="object"&&J?.shiftKey?10:1);return this.#MJ(Z,$),this.#z()}endScrub(J=!0){if(!this.#U)return this.#z();if(J&&this.#z()!==this.#F)this.#A(this.#z(),{snap:!0,emit:"change"});return this.#o(),this.#z()}#UJ(J){if(!this.#U)return;if(this.#K!==null&&J.pointerId!==this.#K)return;this.updateScrub(J)}#MJ(J,Q=1){let Z=this.#X?.clientWidth||1,$=E.#Z*(E.#Q*2/360),j=this.#C()*$,_=(J-this.#T)*(j/Z)*Q,X=this.#g(this.#F+_);this.#W=X,this.#A(X,{snap:!0,emit:"input"}),this.#e(J)}#kJ(J){if(!this.#U)return;if(this.#K!==null&&J.pointerId!==this.#K)return;this.endScrub()}#o(){this.#U=!1,this.#K=null,this.#W=null,this.removeAttribute("data-fig-input-wheel-active"),document.body.classList.remove(E.#j),this.#NJ(),window.removeEventListener("pointermove",this.#w),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),this.#h()}#$J(){if(this.#NJ(),this.getAttribute("elastic")==="false")return;this.#H=this.#jJ("--fig-input-wheel-handle-drag-max"),this.#S=this.#jJ("--fig-input-wheel-elastic-distance");let J=this.#X?.getBoundingClientRect();if(J)this.#V={left:J.left,right:J.right};this.#R=this.getBoundingClientRect().width}#jJ(J){let Q=getComputedStyle(this).getPropertyValue(J).trim();if(Q.includes("var(")||!Q.endsWith("px")){let $=document.createElement("div");Object.assign($.style,{position:"absolute",visibility:"hidden",pointerEvents:"none",width:`var(${J})`}),this.appendChild($),Q=getComputedStyle($).width,$.remove()}let Z=Number.parseFloat(Q);return Number.isFinite(Z)?Math.max(0,Z):0}#e(J){if(!this.#H&&!this.#S){this.#_J();return}let Q=J-this.#T;if(!Q){this.#_J();return}let Z=this.#H*Math.tanh(Q/Math.max(1,this.#H*3));this.setAttribute("data-fig-input-wheel-elastic-dragging",""),this.style.setProperty("--fig-input-wheel-handle-drag-offset",`${Z}px`);let $=this.#V,j=$?J<$.left?J-$.left:J>$.right?J-$.right:0:0;if(!j||!this.#S){this.style.removeProperty("--fig-input-wheel-elastic-scale"),this.style.removeProperty("--fig-input-wheel-elastic-origin");return}let _=Math.min(this.#S,Math.abs(j)*0.5),X=this.#R?(this.#R+_)/this.#R:1;this.style.setProperty("--fig-input-wheel-elastic-scale",`${X}`),this.style.setProperty("--fig-input-wheel-elastic-origin",j<0?"right center":"left center")}#NJ(){this.#_J(),this.#H=0,this.#S=0,this.#V=null,this.#R=0}#_J(){this.removeAttribute("data-fig-input-wheel-elastic-dragging"),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.style.removeProperty("--fig-input-wheel-elastic-scale"),this.style.removeProperty("--fig-input-wheel-elastic-origin")}#FJ(J){if(Y(this,"disabled"))return;J.preventDefault();let Q=J.deltaY===0?Math.sign(J.deltaX):Math.sign(J.deltaY);if(!Q)return;let Z=J.shiftKey?10:1;this.#A(this.#z()+this.#C()*Z*Q,{snap:!0,emit:"input"}),this.#A(this.#z(),{emit:"change"})}#KJ(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number"))return;if(J.key==="Home"){let _=this.#x();if(_===null)return;J.preventDefault(),this.#A(_,{snap:!0,emit:"input"}),this.#A(this.#z(),{emit:"change"});return}if(J.key==="End"){let _=this.#y();if(_===null)return;J.preventDefault(),this.#A(_,{snap:!0,emit:"input"}),this.#A(this.#z(),{emit:"change"});return}if(!["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(J.key))return;J.preventDefault();let Z=J.key==="ArrowRight"||J.key==="ArrowUp"?1:-1,$=J.shiftKey?10:1,j=this.#z();this.#A(j+this.#C()*$*Z,{snap:!0,emit:"input"}),this.#SJ(j,this.#z(),Z,$),this.#A(this.#z(),{emit:"change"})}#SJ(J,Q,Z,$,j=!0){if(J===Q||globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches){this.#n();return}if(this.#P)cancelAnimationFrame(this.#P),this.#P=0;clearTimeout(this.#N),this.#N=0,this.removeAttribute("data-fig-input-wheel-keyboard-settling");let _=this.#W??J,X=Number.parseFloat(this.style.getPropertyValue("--fig-input-wheel-handle-drag-offset"))||0,q=$>1?120:90,B=performance.now(),O=j&&this.getAttribute("elastic")!=="false";this.setAttribute("data-fig-input-wheel-keyboard-moving","");let G=(M)=>{let k=Math.min(1,(M-B)/q);if(this.#W=_+(Q-_)*k,O){let U=Math.sin(k*Math.PI/2),N=X+(Z*4-X)*U;this.style.setProperty("--fig-input-wheel-handle-drag-offset",`${N}px`)}if(this.#d(),k<1){this.#P=requestAnimationFrame(G);return}this.#P=0,this.#W=null,this.removeAttribute("data-fig-input-wheel-keyboard-moving"),this.setAttribute("data-fig-input-wheel-keyboard-settling",""),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.#N=window.setTimeout(()=>{this.removeAttribute("data-fig-input-wheel-keyboard-settling"),this.#N=0},140),this.#h()};this.#P=requestAnimationFrame(G)}#n(){if(this.#P)cancelAnimationFrame(this.#P),this.#P=0;if(clearTimeout(this.#N),this.#N=0,this.#W=null,this.removeAttribute("data-fig-input-wheel-keyboard-moving"),this.removeAttribute("data-fig-input-wheel-keyboard-settling"),this.style.removeProperty("--fig-input-wheel-handle-drag-offset"),this.isConnected)this.#h()}get value(){return this.getAttribute("value")??"0"}set value(J){if(J===null||J===void 0||J===""){this.#A(0);return}let Q=Number(J);this.#A(Number.isFinite(Q)?Q:0)}spinTo(J){let Q=this.#z();this.value=J;let Z=this.#z();if(this.getAttribute("spin")==="false")return this.#n(),Z;let $=Math.sign(Z-Q);return this.#SJ(Q,Z,$,Math.abs(Z-Q)>this.#C()?10:1,!1),Z}get min(){return this.#x()}set min(J){this.#m("min",J)}get max(){return this.#y()}set max(J){this.#m("max",J)}get step(){return this.#C()}focus(J){HTMLElement.prototype.focus.call(this,J)}}L("fig-input-wheel",E);class u extends HTMLElement{static#Z=new Set(["label","size","disabled","variant","elastic","spin","text","default","class","style","id","oninput","onchange"]);static get observedAttributes(){return["label","units","value","disabled","step","precision","min","max","elastic","spin","text"]}#Q=null;#J=null;#j=null;#$=null;#G=!1;#X=null;#_=null;#q=new Set;#B=null;#O=null;#k=0;#Y=0;#M=0;#P=!1;#N=!1;#L=0;#U=this.#A.bind(this,"input");#K=this.#A.bind(this,"change");#T=this.#s.bind(this,"input");#F=this.#s.bind(this,"change");#W=this.#l.bind(this);#H=this.#ZJ.bind(this);#S=this.#t.bind(this);#V=this.#d.bind(this);connectedCallback(){if(!this.#Q)this.#R();if(this.#I(),this.#w(),this.#E(),this.#x(),this.#y(),V(this),this.#X?.disconnect(),this.#X=new MutationObserver((J)=>{if(J.some(({type:Q,attributeName:Z})=>Q==="attributes"&&Z&&!u.#Z.has(Z)&&!u.observedAttributes.includes(Z)&&!Z.startsWith("data-")))this.#x()}),this.#X.observe(this,{attributes:!0}),this.#_?.disconnect(),this.#_=new MutationObserver(()=>{this.#p()}),this.#J)this.#_.observe(this.#J,{attributes:!0,attributeFilter:["style","data-fig-input-wheel-elastic-dragging"]});this.#p()}disconnectedCallback(){this.#X?.disconnect(),this.#_?.disconnect(),this.#_=null,this.#D(),this.#m(),this.#h(),clearTimeout(this.#L),this.#L=0,this.#J?.endScrub(!1),D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Q)return;if(J==="label")this.#I();if(J==="text")this.#w();if(["units","value","disabled","step","min","max","elastic","spin"].includes(J))this.#E();if(["units","value","disabled","step","precision","min","max"].includes(J))this.#x()}#R(){this.#B=this.getAttribute("value")??"0";let J=Array.from(this.childNodes).filter((q)=>q.nodeType!==Node.TEXT_NODE||Boolean(q.textContent?.trim())),Q=J.find((q)=>q.nodeType===Node.ELEMENT_NODE&&q.matches("label")),Z=P("div",{className:"propskit-wheel-surface"}),$=Q||document.createElement("label"),j=document.createElement("fig-input-wheel"),_=document.createElement("fig-input-number"),X=jJ("propskit-wheel-label");$.id=X,j.setAttribute("aria-labelledby",X),_.setAttribute("aria-labelledby",X),Z.append($,j,_),this.#Q=Z,this.#J=j,this.#j=$,this.#$=_,this.#G=Boolean(Q),this.replaceChildren(Z);for(let q of J)if(q!==Q)_.appendChild(q)}#I(){if(!this.#j)return;if(!this.#G)this.#j.textContent=this.hasAttribute("label")?this.getAttribute("label")??"":"Value";this.toggleAttribute("data-label-empty",!(this.#j.textContent??"").trim())}#w(){if(!this.#Q||!this.#$)return;let J=this.getAttribute("text")!=="false",Q=this.#$.parentElement===this.#Q;if(J&&!Q)this.#Q.append(this.#$);else if(!J&&Q)this.#$.remove()}#f(J){if(!this.#J)return;if(this.hasAttribute(J))this.#J.setAttribute(J,this.getAttribute(J)??"");else this.#J.removeAttribute(J)}#E(){if(!this.#J)return;this.#J.removeAttribute("units");for(let Q of["min","max","elastic","spin"])this.#f(Q);if(this.hasAttribute("step"))this.#f("step");else this.#J.setAttribute("step",String(this.#C()));this.#J.toggleAttribute("disabled",Y(this,"disabled")),this.#J.value=this.getAttribute("value")??"0";let J=this.#J.value;if(this.getAttribute("value")!==J)this.setAttribute("value",J);if(this.#$?.getAttribute("value")!==J)this.#$?.setAttribute("value",J);this.#v()}#p(){if(!this.#J)return;if(!this.#J.hasAttribute("data-fig-input-wheel-elastic-dragging")){this.#D();return}this.toggleAttribute("data-propskit-wheel-elastic-dragging",!0),this.style.setProperty("--propskit-wheel-elastic-scale",this.#J.style.getPropertyValue("--fig-input-wheel-elastic-scale")||"1"),this.style.setProperty("--propskit-wheel-elastic-origin",this.#J.style.getPropertyValue("--fig-input-wheel-elastic-origin")||"left center")}#D(){this.removeAttribute("data-propskit-wheel-elastic-dragging"),this.style.removeProperty("--propskit-wheel-elastic-scale"),this.style.removeProperty("--propskit-wheel-elastic-origin")}#c(){return this.getAttributeNames().filter((J)=>!u.#Z.has(J)&&!u.observedAttributes.includes(J)&&!J.startsWith("data-"))}#b(){let J=(this.getAttribute("units")||"").trim(),Q=J.toLowerCase();if(Q==="ms"||Q==="millisecond"||Q==="milliseconds")return"ms";if(Q==="s"||Q==="second"||Q==="seconds")return"s";return J}#C(){let J=this.#b();if(J==="s")return 0.1;if(J==="ms")return 100;return 1}#z(){return this.#b()==="s"?2:0}#v(){if(!this.#J)return;let J=Number(this.#J.value),Q=this.#b();this.#J.setAttribute("aria-valuetext",Q?`${J} ${Q==="s"?"seconds":Q==="ms"?"milliseconds":Q}`:String(J))}#x(){if(!this.#$||!this.#J)return;let J=this.#c(),Q=new Set(J);for(let $ of this.#q)if(!Q.has($))this.#$.removeAttribute($);for(let $ of J)this.#$.setAttribute($,this.getAttribute($)??"");let Z=this.#b();if(Z)this.#$.setAttribute("units",Z);else this.#$.removeAttribute("units");if(this.#$.setAttribute("step",String(this.#J.step)),this.hasAttribute("precision"))this.#$.setAttribute("precision",this.getAttribute("precision")??"");else this.#$.setAttribute("precision",String(this.#z()));for(let $ of["min","max"]){let j=this.#J[$];if(j===null)this.#$.removeAttribute($);else this.#$.setAttribute($,String(j))}this.#$.toggleAttribute("disabled",Y(this,"disabled")),this.#$.setAttribute("value",this.#J.value),this.#q=Q}#y(){this.#m(),this.#J?.addEventListener("input",this.#U),this.#J?.addEventListener("change",this.#K),this.#$?.addEventListener("input",this.#T),this.#$?.addEventListener("change",this.#F),this.addEventListener("pointerdown",this.#W,{capture:!0}),this.addEventListener("click",this.#V,!0)}#m(){this.#J?.removeEventListener("input",this.#U),this.#J?.removeEventListener("change",this.#K),this.#$?.removeEventListener("input",this.#T),this.#$?.removeEventListener("change",this.#F),this.removeEventListener("pointerdown",this.#W,{capture:!0}),this.removeEventListener("click",this.#V,!0)}#g(J,{spin:Q=!1}={}){let Z=Number(J);if(!this.#J){let _=Number.isFinite(Z)?Z:0;return this.setAttribute("value",String(_)),_}let $=Number.isFinite(Z)?Z:0;if(Q)this.#J.spinTo($);else this.#J.value=$;let j=this.#J.value;if(this.getAttribute("value")!==j)this.setAttribute("value",j);if(this.#$?.getAttribute("value")!==j)this.#$?.setAttribute("value",j);return this.#v(),Number(j)}#a(J,Q){this.dispatchEvent(new CustomEvent(J,{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}#A(J,Q){Q.stopImmediatePropagation();let Z=this.#g(Q.detail);this.#a(J,Z)}#s(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:this.#$?.value,$=this.#g(Z,{spin:J==="input"});this.#a(J,$)}#l(J){if(J.button!==0||J.altKey||Y(this,"disabled")||!(J.target instanceof Element))return;let Q=J.target.closest("fig-input-number input");if(!Q||Q===document.activeElement)return;J.preventDefault(),J.stopImmediatePropagation(),this.#h(),this.#O=J.pointerId,this.#k=J.clientX,this.#Y=J.clientY,this.#M=Number(this.#J?.value??0),window.addEventListener("pointermove",this.#H),window.addEventListener("pointerup",this.#S,{once:!0}),window.addEventListener("pointercancel",this.#S,{once:!0}),window.addEventListener("blur",this.#S,{once:!0})}#ZJ(J){if(J.pointerId!==this.#O)return;if(J.buttons===0){this.#t(J);return}if(!this.#P){if(Math.hypot(J.clientX-this.#k,J.clientY-this.#Y)<4)return;this.#P=!0,this.setAttribute("data-number-scrubbing",""),this.#J?.beginScrub({clientX:this.#k,pointerId:J.pointerId,startValue:this.#M})}this.#J?.updateScrub(J)}#t(J){if(J?.pointerId!==void 0&&this.#O!==null&&J.pointerId!==this.#O)return;let Q=this.#P;if(this.#h(),Q){this.#J?.endScrub(),this.#N=!0,clearTimeout(this.#L),this.#L=window.setTimeout(()=>{this.#N=!1,this.#L=0},0),requestAnimationFrame(()=>this.#J?.focus());return}this.#$?.querySelector("input")?.focus()}#h(){window.removeEventListener("pointermove",this.#H),window.removeEventListener("pointerup",this.#S),window.removeEventListener("pointercancel",this.#S),window.removeEventListener("blur",this.#S),this.#O=null,this.#P=!1,this.removeAttribute("data-number-scrubbing")}#d(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#N&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#N=!1;return}if(!(J.target instanceof Element)||!J.target.closest("fig-input-wheel"))this.#J?.focus()}get value(){return this.getAttribute("value")??this.#J?.value??"0"}set value(J){let Q=Number(J);this.#g(Number.isFinite(Q)?Q:0)}get min(){return this.#J?.min??null}set min(J){if(J===null||J===void 0||J==="")this.removeAttribute("min");else{let Q=Number(J);if(Number.isFinite(Q))this.setAttribute("min",String(Q));else this.removeAttribute("min")}}get max(){return this.#J?.max??null}set max(J){if(J===null||J===void 0||J==="")this.removeAttribute("max");else{let Q=Number(J);if(Number.isFinite(Q))this.setAttribute("max",String(Q));else this.removeAttribute("max")}}get defaultValue(){return this.getAttribute("default")??this.#B??"0"}get isDefault(){return g(this.value,this.defaultValue)}resetToDefault(){let J=Number(this.defaultValue),Q=this.#g(Number.isFinite(J)?J:0);p(this,Q)}focus(J){this.#J?.focus(J)}}L("propskit-wheel",u);class zJ extends HTMLElement{static observedAttributes=["type","value","color","name","tooltips","disabled","drag-surface","snapping"];#Z=50;#Q=50;#J=75;#j=75;#$=0;#G=!1;#X=0;#_=null;#q=null;#B=null;#O=null;#k=null;#Y=null;#M=null;#P=null;#N=null;#L=!1;#U=!1;#K=!1;#T=!1;#F=null;#W="";#H="";#S=null;#V=null;#R=null;#I="";#w="";#f=null;#E=null;#p=null;get#D(){return this.getAttribute("type")||"point"}get#c(){return this.#D==="point-radius"||this.#D==="point-radius-angle"}get#b(){return this.#D==="point-radius-angle"}get#C(){return this.#D==="point-point"}get#z(){return this.#D==="point-radius-angle"||this.#D==="point-point"}get#v(){let J=this.getAttribute("tooltips");return J===null||J!=="false"}get#x(){let J=this.getAttribute("snapping");if(J===null)return"false";let Q=J.trim().toLowerCase();if(Q==="modifier")return"modifier";if(Q===""||Q==="true")return"true";return"false"}#y(J){let Q=this.#x;if(Q==="true")return!0;if(Q==="modifier")return!!J;return!1}get#m(){let J=this.getAttribute("name");if(J)return J.split(",")[0].trim();return`${Math.round(this.#Z)}%, ${Math.round(this.#Q)}%`}get#g(){let J=this.getAttribute("name");if(J){let Q=J.split(",");if(Q.length>1)return Q[1].trim()}return`${Math.round(this.#J)}%, ${Math.round(this.#j)}%`}get#a(){return this.getAttribute("drag-surface")||"parent"}get#A(){let J=this.#a;if(J==="parent")return this.parentElement;return this.closest(J)}get#s(){let J=this.#a;if(J==="parent"){let Q=this.parentElement;if(Q)return Q.setAttribute("data-fig-canvas-control-surface",""),"[data-fig-canvas-control-surface]"}return J}#l(J){if(this.#G)return this.#$/100*J;return this.#$}#ZJ(){if(this.#G)return`Radius ${Math.round(this.#$)}%`;return`Radius ${Math.round(this.#$)}`}connectedCallback(){this.#t(),this.#h()}disconnectedCallback(){this.#VJ(),this.#AJ(),this.#GJ(),this.#kJ(),document.body.classList.remove("fig-lab-move-active"),document.body.classList.remove("fig-lab-rotate-active")}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"&&!this.#L&&!this.#U&&!this.#K&&!this.#T)if(this.#t(),this.#_)this.#u();else this.#h();if(J==="type")this.#VJ(),this.#t(),this.#h();if(J==="color"&&this.#_)if(Z)this.#_.setAttribute("color",Z);else this.#_.removeAttribute("color");if(J==="disabled")this.#VJ(),this.#h();if(J==="tooltips")this.#h();if(J==="snapping"&&this.#_){if(this.#_.setAttribute("drag-snapping",Z||"false"),this.#q)this.#q.setAttribute("drag-snapping",Z||"false")}if(J==="name"){if(this.#Y)this.#Y.setAttribute("text",this.#m);if(this.#M)this.#M.setAttribute("text",this.#g)}}#t(){let J=this.getAttribute("value");if(!J)return;try{let Q=JSON.parse(J);if(typeof Q.x==="number")this.#Z=Q.x;if(typeof Q.y==="number")this.#Q=Q.y;if(Q.radius!==void 0){let Z=String(Q.radius);if(Z.endsWith("%"))this.#G=!0,this.#$=parseFloat(Z);else this.#G=!1,this.#$=parseFloat(Z);if(!Number.isFinite(this.#$))this.#$=0}if(typeof Q.angle==="number")this.#X=Q.angle;if(typeof Q.x2==="number")this.#J=Q.x2;if(typeof Q.y2==="number")this.#j=Q.y2;if(this.#D==="color"&&typeof Q.color==="string"&&Q.color.trim()&&this.getAttribute("color")!==Q.color.trim())this.setAttribute("color",Q.color.trim())}catch{}}get value(){let J={x:this.#Z,y:this.#Q};if(this.#D==="color"){let Q=this.getAttribute("color")||this.#_?.getAttribute("color");if(Q)J.color=Q}if(this.#c)J.radius=this.#G?`${this.#$}%`:this.#$;if(this.#b)J.angle=this.#X;if(this.#C)J.x2=this.#J,J.y2=this.#j;return J}set value(J){if(typeof J==="object")this.setAttribute("value",JSON.stringify(J));else if(typeof J==="string")this.setAttribute("value",J)}#h(){this.#VJ(),this.replaceChildren(),this.#_=null,this.#q=null,this.#B=null,this.#O=null,this.#k=null,this.#Y=null,this.#M=null,this.#P=null,this.#N=null;let J=Y(this,"disabled"),Q=this.#D,Z=this.#v,$=this.#s,j=document.createElement("fig-handle");if(j.setAttribute("drag","true"),j.setAttribute("drag-surface",$),j.setAttribute("drag-axes","x,y"),j.setAttribute("drag-snapping",this.#x),j.setAttribute("value",`${this.#Z}% ${this.#Q}%`),J)j.setAttribute("disabled","");if(Q==="color"){j.setAttribute("type","color");let _=this.getAttribute("color");if(_)j.setAttribute("color",_)}else j.setAttribute("type","canvas");if(this.#C)j.setAttribute("hit-area","12 circle"),j.setAttribute("hit-area-mode","delegate");if(this.#_=j,this.#c)this.#_J();if(this.#z)this.#FJ();if(Z){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#m),_.appendChild(j),this.appendChild(_),this.#Y=_}else this.appendChild(j);if(this.#b)this.#SJ(J,Z,$);if(this.#C)this.#n(J,Z,$);this.#d(this.#_),this.#d(this.#B),this.#d(this.#q),this.#fJ(),this.#jJ(),requestAnimationFrame(()=>this.#u())}#d(J){if(!J)return;J.addEventListener("pointerdown",(Q)=>{if(Q.target?.classList?.contains("fig-handle-hit-area")&&J.querySelector(".fig-handle-hit-area"))this.#MJ(Q,J);else this.#YJ(Q)},{capture:!0})}#YJ(J){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#F===null)this.#W=document.body.style.getPropertyValue("cursor"),this.#H=document.body.style.getPropertyPriority("cursor");if(this.#F=J?.pointerId??-1,document.body.classList.add("fig-lab-move-active"),document.body.style.setProperty("cursor","var(--fig-lab-cursor-move)","important"),!this.#S)this.#S=(Q)=>{if(Q?.pointerId!==void 0&&this.#F!==null&&Q.pointerId!==this.#F)return;if(Q?.type==="blur")this.#GJ();else requestAnimationFrame(()=>this.#GJ())};window.addEventListener("pointerup",this.#S),window.addEventListener("pointercancel",this.#S),window.addEventListener("blur",this.#S)}#GJ(){if(this.#F===null)return;if(document.body.classList.remove("fig-lab-move-active"),this.#W)document.body.style.setProperty("cursor",this.#W,this.#H);else document.body.style.removeProperty("cursor");if(this.#F=null,this.#W="",this.#H="",this.#S)window.removeEventListener("pointerup",this.#S),window.removeEventListener("pointercancel",this.#S),window.removeEventListener("blur",this.#S)}#LJ(J){if(!J)return 0;if(J===this.#B)return this.#X;if(!this.#C)return 0;let Q=this.#TJ();return J===this.#_?Q+180:Q}#UJ(){if(this.#V===null)return;let J=this.#r(this.#LJ(this.#R));document.body.style.setProperty("--fig-lab-cursor-rotate",J),document.body.style.setProperty("cursor",J,"important")}#MJ(J,Q){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#V===null)this.#I=document.body.style.getPropertyValue("cursor"),this.#w=document.body.style.getPropertyPriority("cursor");if(this.#V=J?.pointerId??-1,this.#R=Q,document.body.classList.add("fig-lab-rotate-active"),this.#UJ(),!this.#f)this.#f=(Z)=>{if(Z?.pointerId!==void 0&&this.#V!==null&&Z.pointerId!==this.#V)return;if(Z?.type==="blur")this.#kJ();else requestAnimationFrame(()=>this.#kJ())};window.addEventListener("pointerup",this.#f),window.addEventListener("pointercancel",this.#f),window.addEventListener("blur",this.#f)}#kJ(){if(this.#V===null)return;if(document.body.classList.remove("fig-lab-rotate-active"),document.body.style.removeProperty("--fig-lab-cursor-rotate"),this.#I)document.body.style.setProperty("cursor",this.#I,this.#w);else document.body.style.removeProperty("cursor");if(this.#V=null,this.#R=null,this.#I="",this.#w="",this.#f)window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f)}#o(J,Q,Z,$){if(!J)return;let j=()=>!!$?.(),_=()=>{let B=Q();if(!B)return;B.removeAttribute("show"),B.hidePopup?.()},X=()=>{if(j()){_();return}let B=Q();if(!B)return;if(Z)B.setAttribute("text",Z());B.setAttribute("show","true"),B.showPopup?.()},q=()=>{_()};J.addEventListener("pointerenter",X),J.addEventListener("pointerleave",q)}#$J(){return this.#L||this.#U||this.#K||this.#T}#jJ(){if(this.#_)this.#o(this.#_,()=>this.#Y,()=>this.#m,()=>this.#$J()||!!this.#_?.querySelector("fig-color-tip"));if(this.#B)this.#o(this.#B,()=>this.#N,()=>`Angle ${Math.round(this.#X)}°`,()=>this.#$J());if(this.#q)this.#o(this.#q,()=>this.#M,()=>this.#g,()=>this.#$J());if(this.#O){let J=this.#O.querySelector(".fig-canvas-control-radius-hit");this.#NJ(J||this.#O)}if(this.#D==="color"&&this.#_&&this.#Y)new MutationObserver(()=>{if(this.#_?.querySelector("fig-color-tip"))this.#Y?.removeAttribute("show"),this.#Y?.hidePopup?.()}).observe(this.#_,{childList:!0,subtree:!0})}#e(J,Q){let Z=this.#P;if(!Z?.popup)return;let $=Q-8;Z.popup.anchor={getBoundingClientRect:()=>({left:J,top:$,right:J,bottom:$,width:0,height:0,x:J,y:$})},Z.popup.queueReposition?.()}#NJ(J){if(!J)return;J.addEventListener("pointerenter",(Q)=>{let Z=this.#P;if(!Z)return;Z.setAttribute("text",this.#ZJ()),Z.setAttribute("show","true"),Z.showPopup?.(),this.#e(Q.clientX,Q.clientY)}),J.addEventListener("pointermove",(Q)=>{if(this.#K)return;this.#e(Q.clientX,Q.clientY)}),J.addEventListener("pointerleave",()=>{if(this.#K)return;let Q=this.#P;if(!Q)return;Q.removeAttribute("show")})}#_J(){let Q=document.createElementNS("http://www.w3.org/2000/svg","svg");Q.classList.add("fig-canvas-control-radius"),Q.setAttribute("overflow","visible");let Z=document.createElementNS("http://www.w3.org/2000/svg","circle");Z.classList.add("fig-canvas-control-radius-hit"),Q.appendChild(Z);let $=document.createElementNS("http://www.w3.org/2000/svg","circle");$.classList.add("fig-canvas-control-radius-halo"),Q.appendChild($);let j=document.createElementNS("http://www.w3.org/2000/svg","circle");if(Q.appendChild(j),this.#O=Q,this.#v){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#ZJ()),_.appendChild(Q),this.appendChild(_),this.#P=_}else this.appendChild(Q);this.#i(Z)}#FJ(){let Q=document.createElementNS("http://www.w3.org/2000/svg","svg");if(Q.classList.add("fig-canvas-control-angle-svg"),Q.setAttribute("overflow","visible"),Q.style.position="absolute",Q.style.pointerEvents="none",this.#C){let j=document.createElementNS("http://www.w3.org/2000/svg","line");j.classList.add("fig-canvas-control-angle-line-hit"),j.setAttribute("stroke","transparent"),j.setAttribute("stroke-width","12"),j.setAttribute("stroke-linecap","round"),j.style.pointerEvents="stroke",Q.appendChild(j),this.#KJ(j)}let Z=document.createElementNS("http://www.w3.org/2000/svg","line");Z.classList.add("fig-canvas-control-angle-line-halo"),Q.appendChild(Z);let $=document.createElementNS("http://www.w3.org/2000/svg","line");$.classList.add("fig-canvas-control-angle-line"),Q.appendChild($),this.#k=Q,this.appendChild(Q)}#KJ(J){J.addEventListener("pointerdown",(Q)=>{if(Y(this,"disabled"))return;Q.preventDefault(),Q.stopPropagation();let Z=this.#A;if(!Z)return;let{clientX:$,clientY:j}=Q,_=this.#Z,X=this.#Q,q=this.#J,B=this.#j;this.#L=!0,this.#U=!0,document.body.classList.add("fig-lab-move-active"),J.style.pointerEvents="none";let O=(M)=>{let k=Z.getBoundingClientRect(),U=k.width>0?(M.clientX-$)/k.width*100:0,N=k.height>0?(M.clientY-j)/k.height*100:0,T=-Math.min(_,q),F=100-Math.max(_,q),H=-Math.min(X,B),z=100-Math.max(X,B),S=Math.max(T,Math.min(F,U)),R=Math.max(H,Math.min(z,N));this.#Z=_+S,this.#Q=X+R,this.#J=q+S,this.#j=B+R,this.#u(),this.#JJ()},G=this.#CJ((M)=>{if(document.body.classList.remove("fig-lab-move-active"),J.style.pointerEvents="stroke",this.#L=!1,this.#U=!1,M)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",O,{signal:G.signal}),window.addEventListener("pointerup",()=>G.finish(!0),{signal:G.signal}),window.addEventListener("pointercancel",()=>G.finish(!1),{signal:G.signal})})}#SJ(J,Q,Z){let $=document.createElement("fig-handle");if($.setAttribute("type","canvas"),$.setAttribute("drag","true"),$.setAttribute("drag-surface",Z),$.setAttribute("drag-axes","x,y"),$.setAttribute("size","small"),$.setAttribute("hit-area","12 circle"),$.setAttribute("hit-area-mode","delegate"),J)$.setAttribute("disabled","");if(this.#B=$,Q){let j=document.createElement("fig-tooltip");j.setAttribute("action","manual"),j.setAttribute("theme","canvas"),j.setAttribute("pointer","false"),j.setAttribute("text",`${Math.round(this.#X)}°`),j.appendChild($),this.appendChild(j),this.#N=j}else this.appendChild($)}#n(J,Q,Z){let $=document.createElement("fig-handle");if($.setAttribute("type","canvas"),$.setAttribute("drag","true"),$.setAttribute("drag-surface",Z),$.setAttribute("drag-axes","x,y"),$.setAttribute("drag-snapping",this.#x),$.setAttribute("hit-area","12 circle"),$.setAttribute("hit-area-mode","delegate"),$.setAttribute("value",`${this.#J}% ${this.#j}%`),J)$.setAttribute("disabled","");if(this.#q=$,Q){let j=document.createElement("fig-tooltip");j.setAttribute("action","manual"),j.setAttribute("theme","canvas"),j.setAttribute("pointer","false"),j.setAttribute("text",this.#g),j.appendChild($),this.appendChild(j),this.#M=j}else this.appendChild($)}#zJ(J){return`url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='rotate(${Math.round(J)} 16 16)'%3E%3Cg filter='url(%23f)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.1212 16.9998L11.5607 17.4394C12.1465 18.0252 12.1464 18.975 11.5606 19.5607C10.9748 20.1465 10.0251 20.1465 9.4393 19.5606L6.4393 16.5604C5.85354 15.9746 5.85357 15.0249 6.43938 14.4391L9.43938 11.4393C10.0252 10.8535 10.9749 10.8536 11.5607 11.4394C12.1465 12.0252 12.1464 12.9749 11.5606 13.5607L11.1215 13.9998L20.8786 13.9999L20.4394 13.5607C19.8536 12.9749 19.8535 12.0252 20.4393 11.4394C21.0251 10.8536 21.9749 10.8536 22.5606 11.4394L25.5606 14.4393C25.842 14.7206 26 15.1021 26 15.4999C26 15.8978 25.842 16.2793 25.5607 16.5606L22.5607 19.5607C21.9749 20.1465 21.0251 20.1465 20.4393 19.5607C19.8536 18.9749 19.8535 18.0252 20.4393 17.4394L20.8788 16.9999L11.1212 16.9998Z' fill='white'/%3E%3C/g%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.8536 12.1465C11.0488 12.3417 11.0488 12.6583 10.8535 12.8536L8.70715 14.9998L23.2929 14.9999L21.1465 12.8536C20.9512 12.6583 20.9512 12.3417 21.1464 12.1465C21.3417 11.9512 21.6583 11.9512 21.8535 12.1465L24.8535 15.1464C24.9473 15.2402 25 15.3673 25 15.4999C25 15.6326 24.9473 15.7597 24.8536 15.8535L21.8536 18.8536C21.6583 19.0488 21.3417 19.0488 21.1465 18.8536C20.9512 18.6583 20.9512 18.3417 21.1464 18.1465L23.2929 15.9999L8.70705 15.9998L10.8536 18.1465C11.0488 18.3417 11.0488 18.6583 10.8535 18.8536C10.6583 19.0488 10.3417 19.0488 10.1464 18.8535L7.14643 15.8533C6.95118 15.658 6.95119 15.3415 7.14646 15.1462L10.1465 12.1464C10.3417 11.9512 10.6583 11.9512 10.8536 12.1465Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='f' x='3' y='9' width='26' height='15' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='a'/%3E%3CfeColorMatrix in='SourceAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='b'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='1.5'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3CfeBlend in2='a' result='c'/%3E%3CfeBlend in='SourceGraphic' in2='c'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E") 16 16, nwse-resize`}#r(J){return`url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='rotate(${Math.round(J-45)} 16 16)'%3E%3Cg filter='url(%23f)'%3E%3Cpath d='M12.5607 22.4393L12.0216 21.9002C17.1558 21.2216 21.2216 17.1558 21.9002 12.0216L22.4393 12.5607C23.0251 13.1464 23.9749 13.1464 24.5607 12.5607C25.1464 11.9749 25.1464 11.0251 24.5607 10.4393L21.5607 7.43934C20.9749 6.85355 20.0251 6.85355 19.4393 7.43934L16.4393 10.4393C15.8536 11.0251 15.8536 11.9749 16.4393 12.5607C17.0251 13.1464 17.9749 13.1464 18.5607 12.5607L18.8056 12.3157C18.1013 15.5527 15.5527 18.1013 12.3157 18.8056L12.5607 18.5607C13.1464 17.9749 13.1464 17.0251 12.5607 16.4393C11.9749 15.8536 11.0251 15.8536 10.4393 16.4393L7.43934 19.4393C6.85356 20.0251 6.85356 20.9749 7.43934 21.5607L10.4393 24.5607C11.0251 25.1464 11.9749 25.1464 12.5607 24.5607C13.1464 23.9749 13.1464 23.0251 12.5607 22.4393Z' fill='white'/%3E%3C/g%3E%3Cpath d='M23.8536 11.8536C23.6583 12.0488 23.3417 12.0488 23.1464 11.8536L21 9.70711V10.5C21 16.299 16.299 21 10.5 21H9.70711L11.8536 23.1464C12.0488 23.3417 12.0488 23.6583 11.8536 23.8536C11.6583 24.0488 11.3417 24.0488 11.1464 23.8536L8.14645 20.8536C7.95119 20.6583 7.95119 20.3417 8.14645 20.1464L11.1464 17.1464C11.3417 16.9512 11.6583 16.9512 11.8536 17.1464C12.0488 17.3417 12.0488 17.6583 11.8536 17.8536L9.70711 20H10.5C15.7467 20 20 15.7467 20 10.5V9.70711L17.8536 11.8536C17.6583 12.0488 17.3417 12.0488 17.1464 11.8536C16.9512 11.6583 16.9512 11.3417 17.1464 11.1464L20.1464 8.14645C20.3417 7.95119 20.6583 7.95119 20.8536 8.14645L23.8536 11.1464C24.0488 11.3417 24.0488 11.6583 23.8536 11.8536Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='f' x='4' y='5' width='24' height='24' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='a'/%3E%3CfeColorMatrix in='SourceAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='b'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='1.5'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3CfeBlend in2='a' result='c'/%3E%3CfeBlend in='SourceGraphic' in2='c'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E") 16 16, pointer`}#OJ(J,Q){if(!J)return;J.style.setProperty("cursor",Q,"important")}#XJ(J,Q){if(!J)return;let Z=J.querySelector(".fig-handle-hit-area");if(!Z)return;if(Z.setAttribute("data-cursor","rotate"),this.#OJ(Z,this.#r(Q)),this.#R===J)this.#UJ()}#HJ(){if(!this.#B||!this.#b)return;this.#XJ(this.#B,this.#X)}#TJ(){return Math.atan2(this.#j-this.#Q,this.#J-this.#Z)*180/Math.PI}#WJ(){if(!this.#C)return;let J=this.#TJ();this.#_?.style.removeProperty("cursor"),this.#q?.style.removeProperty("cursor"),this.#XJ(this.#_,J+180),this.#XJ(this.#q,J)}#BJ(J,Q,Z,$){J.style.setProperty("--fig-handle-position-translate","-50% -50%"),J.style.left=`${Q/100*$.width}px`,J.style.top=`${Z/100*$.height}px`}#u(){let J=this.#A;if(!J||!this.#_)return;let Q=J.getBoundingClientRect();if(this.#BJ(this.#_,this.#Z,this.#Q,Q),this.#O){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#l(Q.width),_=this.#O,X=Math.max(j*2,1);_.style.position="absolute",_.style.width=`${X}px`,_.style.height=`${X}px`,_.style.left=`${Z-j}px`,_.style.top=`${$-j}px`,_.setAttribute("viewBox",`0 0 ${X} ${X}`);let q=_.querySelectorAll("circle");for(let B of q)B.setAttribute("cx",String(j)),B.setAttribute("cy",String(j)),B.setAttribute("r",String(Math.max(j-1,0)))}if(this.#k&&this.#z){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j,_;if(this.#C)j=this.#J/100*Q.width,_=this.#j/100*Q.height;else{let B=this.#l(Q.width),O=this.#X*Math.PI/180;j=Z+B*Math.cos(O),_=$+B*Math.sin(O)}let X=this.#k;X.style.width=`${Q.width}px`,X.style.height=`${Q.height}px`,X.style.left="0",X.style.top="0",X.setAttribute("viewBox",`0 0 ${Q.width} ${Q.height}`);let q=X.querySelectorAll(".fig-canvas-control-angle-line, .fig-canvas-control-angle-line-halo, .fig-canvas-control-angle-line-hit");for(let B of q)B.setAttribute("x1",String(Z)),B.setAttribute("y1",String($)),B.setAttribute("x2",String(j)),B.setAttribute("y2",String(_))}if(this.#B&&this.#b){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#l(Q.width),_=this.#X*Math.PI/180,X=Z+j*Math.cos(_),q=$+j*Math.sin(_),B=Q.width>0?X/Q.width*100:0,O=Q.height>0?q/Q.height*100:0;this.#BJ(this.#B,B,O,Q)}if(this.#q&&this.#C)this.#BJ(this.#q,this.#J,this.#j,Q);this.#HJ(),this.#WJ()}#JJ(J=this.value){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:J}))}#QJ(J=this.value){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:J}))}#qJ(J){return{...this.value,...HJ(J.color,J.alpha,J.opacity)}}#PJ(){this.setAttribute("value",JSON.stringify(this.value))}#fJ(){if(!this.#_)return;if(this.#_.addEventListener("input",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#_.getAttribute("color")||J.detail.color),this.#JJ(this.#qJ(J.detail));return}this.#L=!0;let Q=J.detail?.px??this.#Z/100,Z=J.detail?.py??this.#Q/100;if(this.#Z=Math.round(Math.max(0,Math.min(100,Q*100))),this.#Q=Math.round(Math.max(0,Math.min(100,Z*100))),this.#Y)this.#Y.removeAttribute("show"),this.#Y.hidePopup?.();this.#u(),this.#JJ()}),this.#_.addEventListener("change",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#_.getAttribute("color")||J.detail.color),this.#QJ(this.#qJ(J.detail));return}let Q=J.detail?.px??this.#Z/100,Z=J.detail?.py??this.#Q/100;if(this.#Z=Math.round(Math.max(0,Math.min(100,Q*100))),this.#Q=Math.round(Math.max(0,Math.min(100,Z*100))),this.#Y)this.#Y.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#L=!1})}),this.#B)this.#B.addEventListener("input",(J)=>{J.stopPropagation();let Q=this.#A;if(!Q)return;this.#T=!0,this.classList.add("fig-canvas-control-ring-active");let Z=Q.getBoundingClientRect(),$=this.#Z/100*Z.width,j=this.#Q/100*Z.height,_=J.detail?.x??0,X=J.detail?.y??0,q=this.#B.offsetWidth/2,B=this.#B.offsetHeight/2,O=_+q-$,G=X+B-j,M=Math.atan2(G,O)*180/Math.PI;if(this.#y(J.detail?.shiftKey))M=Math.round(M/15)*15;this.#X=M;let k=Math.sqrt(O*O+G*G);if(this.#y(J.detail?.shiftKey)){let U=this.#G?5:10;if(this.#G){let N=k/Z.width*100;N=Math.round(N/U)*U,k=N/100*Z.width}else k=Math.round(k/U)*U}if(this.#G)this.#$=Math.max(0,k/Z.width*100);else this.#$=Math.max(0,k);if(this.#N)this.#N.setAttribute("text",`Angle ${Math.round(this.#X)}°`),this.#N.setAttribute("show","true"),this.#N.showPopup?.();this.#u(),this.#JJ()}),this.#B.addEventListener("change",(J)=>{if(J.stopPropagation(),this.classList.remove("fig-canvas-control-ring-active"),this.#N)this.#N.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#T=!1})}),this.#B.addEventListener("hitareadown",(J)=>{J.stopPropagation();let Q=J.detail?.originalEvent;if(!Q)return;Q.preventDefault();let Z=this.#A;if(!Z)return;if(this.#T=!0,this.classList.add("fig-canvas-control-ring-active"),this.#B.setAttribute("selected",""),this.#N)this.#N.setAttribute("show","true"),this.#N.showPopup?.();let $=(_)=>{let X=Z.getBoundingClientRect(),q=this.#Z/100*X.width,B=this.#Q/100*X.height,O=_.clientX-X.left-q,G=_.clientY-X.top-B,M=Math.atan2(G,O)*180/Math.PI;if(this.#y(_.shiftKey))M=Math.round(M/15)*15;if(this.#X=M,this.#N)this.#N.setAttribute("text",`Angle ${Math.round(M)}°`);this.#u(),this.#JJ()},j=this.#CJ((_)=>{if(this.#T=!1,this.classList.remove("fig-canvas-control-ring-active"),this.#B.removeAttribute("selected"),this.#N)this.#N.removeAttribute("show");if(_)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",$,{signal:j.signal}),window.addEventListener("pointerup",()=>j.finish(!0),{signal:j.signal}),window.addEventListener("pointercancel",()=>j.finish(!1),{signal:j.signal})});if(this.#q)this.#q.addEventListener("input",(J)=>{J.stopPropagation(),this.#U=!0;let Q=J.detail?.px??this.#J/100,Z=J.detail?.py??this.#j/100;if(this.#J=Math.round(Math.max(0,Math.min(100,Q*100))),this.#j=Math.round(Math.max(0,Math.min(100,Z*100))),this.#M)this.#M.removeAttribute("show"),this.#M.hidePopup?.();this.#u(),this.#JJ()}),this.#q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#M)this.#M.removeAttribute("show");this.#u(),this.#PJ(),this.#QJ(),requestAnimationFrame(()=>{this.#U=!1})}),this.#RJ(this.#_,!0),this.#RJ(this.#q,!1)}#RJ(J,Q){if(!J)return;J.addEventListener("hitareadown",(Z)=>{Z.stopPropagation();let $=Z.detail?.originalEvent;if(!$)return;$.preventDefault();let j=this.#A;if(!j)return;this.#L=!0;let _=j.getBoundingClientRect(),X=Q?this.#J:this.#Z,q=Q?this.#j:this.#Q,B=Q?this.#Z:this.#J,O=Q?this.#Q:this.#j,G=X/100*_.width,M=q/100*_.height,k=B/100*_.width,U=O/100*_.height,N=Math.sqrt((k-G)**2+(U-M)**2),T=Q?this.#Y:this.#M;if(T)T.removeAttribute("show"),T.hidePopup?.();let F=(z)=>{let S=j.getBoundingClientRect(),R=X/100*S.width,W=q/100*S.height,f=z.clientX-S.left-R,I=z.clientY-S.top-W,C=Math.atan2(I,f);if(this.#y(z.shiftKey))C=Math.round(C*180/Math.PI/15)*15*Math.PI/180;let l=R+N*Math.cos(C),s=W+N*Math.sin(C),b=Math.max(0,Math.min(100,l/S.width*100)),y=Math.max(0,Math.min(100,s/S.height*100));if(Q)this.#Z=b,this.#Q=y;else this.#J=b,this.#j=y;this.#u(),this.#JJ()},H=this.#CJ((z)=>{if(this.#L=!1,T)T.removeAttribute("show");if(z)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",F,{signal:H.signal}),window.addEventListener("pointerup",()=>H.finish(!0),{signal:H.signal}),window.addEventListener("pointercancel",()=>H.finish(!1),{signal:H.signal})})}#i(J){if(!J)return;J.addEventListener("pointermove",(Z)=>{if(this.#K)return;let $=this.#A;if(!$)return;let j=$.getBoundingClientRect(),_=this.#Z/100*j.width,X=this.#Q/100*j.height,q=Math.atan2(Z.clientY-j.top-X,Z.clientX-j.left-_)*180/Math.PI;this.#OJ(J,this.#zJ(q))});let Q=(Z)=>{if(Y(this,"disabled"))return;Z.preventDefault(),Z.stopPropagation(),this.#K=!0,this.classList.add("fig-canvas-control-ring-active");let $=this.#A;if(!$)return;if(this.#P)this.#P.setAttribute("show","true"),this.#P.showPopup?.(),this.#e(Z.clientX,Z.clientY);if(this.#N)this.#N.removeAttribute("show"),this.#N.hidePopup?.();let j=this.#B?.style.pointerEvents,_=this.#B?.querySelector(".fig-handle-hit-area"),X=_?.style.pointerEvents;if(this.#B)this.#B.style.pointerEvents="none";if(_)_.style.pointerEvents="none";let q=document.body.style.cursor;J.style.pointerEvents="none";let B=$.getBoundingClientRect(),O=this.#Z/100*B.width,G=this.#Q/100*B.height,M=Math.atan2(Z.clientY-B.top-G,Z.clientX-B.left-O)*180/Math.PI,k=Math.round(M);document.body.style.cursor=this.#zJ(k);let U=(T)=>{let F=$.getBoundingClientRect(),H=this.#Z/100*F.width,z=this.#Q/100*F.height,S=T.clientX-F.left-H,R=T.clientY-F.top-z,W=Math.round(Math.atan2(R,S)*180/Math.PI);if(W!==k)k=W,document.body.style.cursor=this.#zJ(W);let f=Math.sqrt(S*S+R*R);if(this.#y(T.shiftKey)){let I=this.#G?5:10;if(this.#G){let C=f/F.width*100;C=Math.round(C/I)*I,f=C/100*F.width}else f=Math.round(f/I)*I}if(this.#G)this.#$=Math.max(0,f/F.width*100);else this.#$=Math.max(0,f);if(this.#P)this.#P.setAttribute("text",this.#ZJ()),this.#e(T.clientX,T.clientY);this.#u(),this.#JJ()},N=this.#CJ((T)=>{if(this.#K=!1,this.classList.remove("fig-canvas-control-ring-active"),J.style.pointerEvents="",this.#B)this.#B.style.pointerEvents=j??"";if(_)_.style.pointerEvents=X??"";if(document.body.style.cursor=q,this.#P)this.#P.removeAttribute("show");if(T)this.#PJ(),this.#QJ()});window.addEventListener("pointermove",U,{signal:N.signal}),window.addEventListener("pointerup",()=>N.finish(!0),{signal:N.signal}),window.addEventListener("pointercancel",()=>N.finish(!1),{signal:N.signal})};J.addEventListener("pointerdown",Q),this._radiusDragCleanup=()=>J.removeEventListener("pointerdown",Q)}#AJ(){if(this._radiusDragCleanup)this._radiusDragCleanup(),this._radiusDragCleanup=null}#CJ(J){this.#VJ();let Q=new AbortController,Z=!1,$=(j=!1)=>{if(Z)return;if(Z=!0,Q.abort(),this.#E===Q)this.#E=null,this.#p=null;J(j)};return this.#E=Q,this.#p=$,{signal:Q.signal,finish:$}}#VJ(){this.#p?.(!1),this.#E?.abort(),this.#E=null,this.#p=null}}L("fig-canvas-control",zJ);class K extends HTMLElement{#Z=[K.#R()];#Q=0;#J=2;#j=240;#$=120;#G={min:-1,max:1};#X=null;#_=null;#q=null;#B=null;#O=0;#k=null;#Y=null;#M=null;#P=null;#N=[];#L=[];#U=[];#K=[];#T=new Set;#F=null;#W=null;#H=null;#S=null;#V=null;static TYPES=[{name:"Wave",value:"sine"},{name:"Square",value:"square"},{name:"Sawtooth",value:"sawtooth"},{name:"Triangle",value:"triangle"}];static#R(J="sine"){return{type:J,frequency:1,amplitude:1,phase:0,offset:0}}static get observedAttributes(){return["value","precision","aspect-ratio","edit","disabled"]}connectedCallback(){if(this.#V===null)this.#V=this.getAttribute("default")??this.getAttribute("value")??JSON.stringify({waves:[K.#R()]});this.#J=this.#I("precision",2),this.#D(this.getAttribute("value")),this.#p(),this.#s(),this.#UJ(),V(this)}disconnectedCallback(){if(this.#u(),this.#_J(),this.#F)this.#F.disconnect(),this.#F=null;D(this)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"){if(this.#D(Z),this.isConnected)this.#s();return}if(J==="precision"){if(this.#J=this.#I("precision",2),this.isConnected)this.#qJ();return}if(J==="aspect-ratio"){if(this.#p(),this.#_)this.#e();return}if(J==="edit"||J==="disabled"){if(this.isConnected)this.#s()}}get value(){return JSON.stringify(this.data)}set value(J){this.setAttribute("value",typeof J==="object"&&J!==null?JSON.stringify(J):J)}get defaultValue(){return this.getAttribute("default")??this.#V??""}get isDefault(){let J=this.#c(this.defaultValue);if(!J)return!1;return JSON.stringify(this.data.waves)===JSON.stringify(J.map((Q)=>this.#C(Q)))}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J,this.#i("input"),this.#i("change")}get data(){return{waves:this.#Z.map((J)=>this.#C(J))}}get preset(){let J=this.#z;return K.TYPES.find((Q)=>Q.value===J.type)?.name}#I(J,Q){let Z=Number.parseInt(this.getAttribute(J)||"",10);return Number.isFinite(Z)?Math.max(0,Math.min(100,Z)):Q}#w(J,Q=!1){let Z=this.getAttribute(J);if(Z===null)return Q;let $=Z.trim().toLowerCase();if($===""||$==="true")return!0;if($==="false")return!1;return!0}#f(){return this.getAttribute("edit")!=="false"}#E(){return this.#w("disabled",!1)}#p(){let J=this.getAttribute("aspect-ratio")||"2 / 1";this.style.setProperty("--aspect-ratio",J)}#D(J){let Q=this.#c(J);if(!Q)return!1;if(this.#Z=Q,!this.#Z.length)this.#Z=[K.#R()];return this.#Q=Math.min(this.#Q,this.#Z.length-1),!0}#c(J){if(!J)return null;let Q=null;if(typeof J==="string")try{Q=JSON.parse(J)}catch{return null}else if(typeof J==="object")Q=J;if(!Q)return null;return(Array.isArray(Q)?Q:Array.isArray(Q.waves)?Q.waves:[Q]).map(($)=>this.#b($))}#b(J={}){return{type:this.#v(J.type),frequency:this.#x(J.frequency,1,0.1,16),amplitude:this.#x(J.amplitude,1,-4,4),phase:this.#x(J.phase,0,-360,360),offset:this.#x(J.offset,0,-4,4)}}#C(J){return{type:J.type,frequency:this.#y(J.frequency),amplitude:this.#y(J.amplitude),phase:this.#y(J.phase),offset:this.#y(J.offset)}}get#z(){if(!this.#Z[this.#Q])this.#Q=0;return this.#Z[this.#Q]||K.#R()}#v(J){let Q=String(J||"").toLowerCase();return K.TYPES.some((Z)=>Z.value===Q)?Q:"sine"}#x(J,Q,Z,$){let j=Number.parseFloat(J);if(!Number.isFinite(j))return Q;return Math.min($,Math.max(Z,j))}#y(J){let Q=10**this.#J;return Math.round(J*Q)/Q}static#m(J){return K.TYPES.find((Q)=>Q.value===J)?.name||"Wave"}static#g(J,Q=24){let j=Q-10,_="";for(let X=0;X<=32;X++){let q=X/32,B=K.#A(J,q),O=5+q*j,G=5+(1-(B+1)/2)*j;_+=`${X===0?"M":"L"}${O.toFixed(1)},${G.toFixed(1)}`}return _}static#a(J,Q=24){return A("svg",{width:Q,height:Q,viewBox:`0 0 ${Q} ${Q}`,fill:"none"},A("path",{d:K.#g(J,Q),stroke:"currentColor","stroke-width":"1","stroke-linecap":"round","stroke-linejoin":"round"}))}static waveIcon(J,Q=24){let Z=K.#g(J,Q);return`<svg width="${Q}" height="${Q}" viewBox="0 0 ${Q} ${Q}" fill="none"><path d="${Z}" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg>`}static#A(J,Q,Z=0){let $=Q+Z/360,j=$-Math.floor($),_=$*Math.PI*2;switch(J){case"square":return Math.sin(_)>=0?1:-1;case"sawtooth":return j*2-1;case"triangle":return 1-Math.abs(j*4-2);default:return Math.sin(_)}}#s(){if(this.#u(),this.#_J(),this.replaceChildren(...this.#ZJ()),this.#YJ(),this.#MJ(),this.#e(),this.#zJ(),!this.#E())this.#NJ();V(this)}#l(J,Q){return A("foreignObject",{className:`propskit-oscillator-handle propskit-oscillator-${J}-handle`,"data-handle":J,width:"20",height:"20"},P("div",{className:"propskit-oscillator-handle-inner"},P("fig-tooltip",{text:Q},P("fig-handle",{size:"small",type:"minimal","aria-label":`Oscillator ${J} handle`}))))}#ZJ(){let J=this.#f()&&!this.#E(),Q=[A("rect",{className:"propskit-oscillator-bounds",x:"0",y:"0",width:this.#j,height:this.#$}),A("line",{className:"propskit-oscillator-baseline"}),A("path",{className:"propskit-oscillator-path"}),A("circle",{className:"propskit-oscillator-playhead"})];if(J)Q.push(this.#l("amplitude","Amplitude"),this.#l("frequency","Frequency"));let Z=A("svg",{viewBox:`0 0 ${this.#j} ${this.#$}`,className:"propskit-oscillator-svg"},Q),$=[P("div",{className:"propskit-oscillator-svg-container"},Z)];if(this.#f())$.push(P("div",{className:"propskit-oscillator-waves"},this.#Z.map((j,_)=>this.#t(j,_,!J))));return $}#t(J,Q,Z){let $=Z||this.#Z.length<=1,j=Q===this.#Q,_=K.#m(J.type),X=P("fig-tooltip",{text:"Remove form"},P("fig-button",{className:"propskit-oscillator-remove-button",variant:"ghost",icon:!0,"data-wave-index":Q,"aria-label":"Remove form",disabled:$},P("fig-icon",{name:"minus"}))),q=P("fig-header",{borderless:!0},[P("h3",{},_),X,this.#h(Z,Q)]),B=P("div",{className:"propskit-oscillator-fields","data-wave-index":Q,"data-active":j},[this.#d(Q,"frequency","Frequency",0.1,16,0.1,""),this.#d(Q,"amplitude","Amplitude",-4,4,0.1,""),this.#d(Q,"phase","Phase",-360,360,1,"°"),this.#d(Q,"offset","Offset",-4,4,0.1,"")]);return P("fig-group",{className:"propskit-oscillator-wave",collapsible:!0,borderless:!0,compact:"true",open:this.#T.has(Q)?"true":"false","data-wave-index":Q},[q,B])}#h(J,Q){let Z=P("fig-tooltip",{text:"Add form"},P("fig-button",{className:"propskit-oscillator-add-type-button",variant:"ghost",icon:!0,"fig-menu-trigger":!0,"aria-label":"Add form",disabled:J},P("fig-icon",{name:"plus"}))),$=K.TYPES.map((j)=>P("fig-menu-item",{value:j.value},[K.#a(j.value,24),P("span",{},j.name)]));return P("fig-menu",{className:"propskit-oscillator-add-type",position:"bottom right","data-wave-index":Q,disabled:J},[Z,$])}#d(J,Q,Z,$,j,_,X){let q=this.#Z[J]||K.#R(),B=Q==="amplitude"||Q==="offset";return P("propskit-slider",{className:"propskit-oscillator-field",label:Z,direction:"horizontal",name:Q,"data-wave-index":J,value:this.#y(q[Q]),min:$,max:j,step:_,precision:this.#J,elastic:"false",type:B?"delta":null,default:B?"0":null,units:X||null,disabled:this.#E()})}#YJ(){this.#_=this.querySelector(".propskit-oscillator-svg"),this.#q=this.querySelector(".propskit-oscillator-path"),this.#B=this.querySelector(".propskit-oscillator-playhead"),this.#k=this.querySelector(".propskit-oscillator-baseline"),this.#Y=this.querySelector(".propskit-oscillator-bounds"),this.#M=this.querySelector('[data-handle="amplitude"]'),this.#P=this.querySelector('[data-handle="frequency"]'),this.#L=Array.from(this.querySelectorAll(".propskit-oscillator-wave-type")),this.#N=Array.from(this.querySelectorAll("propskit-slider[name]")),this.#K=Array.from(this.querySelectorAll("fig-group.propskit-oscillator-wave")),this.#U=Array.from(this.querySelectorAll(".propskit-oscillator-fields"))}#GJ(J){let Q=new Set;for(let Z of this.#T)if(Z<J)Q.add(Z);else if(Z>J)Q.add(Z-1);this.#T=Q}#LJ(J){let Q=new Set;for(let Z of this.#T)Q.add(Z>=J?Z+1:Z);Q.add(J),this.#T=Q}#UJ(){if(this.#F||!window.ResizeObserver)return;this.#F=new ResizeObserver(()=>{if(this.#MJ())this.#e()}),this.#F.observe(this)}#MJ(){if(!this.#_)return!1;let J=this.#_.getBoundingClientRect(),Q=Math.max(1,Math.round(J.width||240)),Z=Math.max(1,Math.round(J.height||120)),$=Q!==this.#j||Z!==this.#$;return this.#j=Q,this.#$=Z,this.#_.setAttribute("viewBox",`0 0 ${Q} ${Z}`),$}#kJ(){let J=1,Q=256;for(let Z=0;Z<=Q;Z++)J=Math.max(J,Math.abs(this.#jJ(Z/Q)));return{min:-J,max:J}}#o(J){let{min:Q,max:Z}=this.#G;return this.#$-(J-Q)/(Z-Q)*this.#$}#$J(J){let{min:Q,max:Z}=this.#G;return Q+(1-J/this.#$)*(Z-Q)}#jJ(J){return this.#Z.reduce((Q,Z)=>{let $=J*Z.frequency,j=K.#A(Z.type,$,Z.phase);return Q+Z.offset+j*Z.amplitude},0)}#e(){if(!this.#_||!this.#q)return;if(this.#MJ(),this.#G=this.#kJ(),this.#Y)this.#Y.setAttribute("width",this.#j),this.#Y.setAttribute("height",this.#$);let J=Math.max(...this.#Z.map((_)=>_.frequency)),Z=this.#Z.some((_)=>_.type==="square"||_.type==="sawtooth")?Math.max(192,Math.ceil(J*64)):Math.max(96,Math.ceil(J*64)),$="";for(let _=0;_<=Z;_++){let X=_/Z,q=X*this.#j,B=this.#o(this.#jJ(X));$+=`${_===0?"M":"L"}${q.toFixed(1)},${B.toFixed(1)}`}this.#q.setAttribute("d",$);let j=this.#o(0);this.#k?.setAttribute("x1","0"),this.#k?.setAttribute("y1",j),this.#k?.setAttribute("x2",this.#j),this.#k?.setAttribute("y2",j),this.#KJ()}#NJ(){if(this.#O||!this.#B)return;let J=(Q)=>{if(!this.isConnected||!this.#B){this.#O=0;return}this.#FJ(Q%1000/1000),this.#O=requestAnimationFrame(J)};this.#O=requestAnimationFrame(J)}#_J(){if(!this.#O)return;cancelAnimationFrame(this.#O),this.#O=0}#FJ(J){if(!this.#B)return;let Q=J*this.#j,Z=this.#o(this.#jJ(J));this.#B.setAttribute("cx",Q.toFixed(1)),this.#B.setAttribute("cy",Z.toFixed(1))}#KJ(){let Q=this.#z,Z=this.#SJ(),$=Math.max(8,Math.min(this.#j-8,this.#j/Q.frequency)),j=this.#o(this.#jJ(Z/this.#j)),_=this.#o(this.#jJ($/this.#j));this.#n(this.#M,Z,j,8),this.#n(this.#P,$,_,8)}#SJ(){let J=this.#z,Q=J.phase/360,Z=Math.max(0.1,J.frequency),$=0.25;if(J.type==="triangle")$=0.5;if(J.type==="sawtooth")$=1;let j=($-Q)/Z;while(j<0)j+=1/Z;while(j>1)j-=1/Z;if(j<0||j>1||!Number.isFinite(j))j=0.25;return Math.max(8,Math.min(this.#j-8,j*this.#j))}#n(J,Q,Z,$){if(!J)return;J.setAttribute("x",Q-$),J.setAttribute("y",Z-$),J.setAttribute("width",$*2),J.setAttribute("height",$*2)}#zJ(){if(!this.#f()||this.#E())return;for(let Q of this.#L)Q.addEventListener("change",(Z)=>{if(this.#E())return;let $=this.#r(Q);this.#XJ($),this.#Z[$].type=this.#v(Z.detail??Z.target?.value),this.#qJ(),this.#i("input"),this.#i("change")});for(let Q of this.#N)Q.addEventListener("input",(Z)=>{Z.stopPropagation(),this.#W=Q;try{this.#HJ(this.#r(Q),Q.getAttribute("name"),Z.detail??Z.currentTarget?.value??Z.target?.value,"input")}finally{this.#W=null}}),Q.addEventListener("change",(Z)=>{Z.stopPropagation(),this.#HJ(this.#r(Q),Q.getAttribute("name"),Z.detail??Z.currentTarget?.value??Z.target?.value,"change")});for(let Q of this.#K)Q.addEventListener("pointerdown",()=>{this.#XJ(this.#r(Q))}),Q.addEventListener("focusin",()=>{this.#XJ(this.#r(Q))}),Q.addEventListener("openchange",(Z)=>{let $=this.#r(Q);if(Z.detail?.open)this.#T.add($);else this.#T.delete($)});for(let Q of this.querySelectorAll(".propskit-oscillator-add-type")){let Z=($)=>{$.stopPropagation()};Q.addEventListener("pointerdown",Z),Q.addEventListener("click",Z),Q.addEventListener("change",($)=>{if($.target!==Q)return;if(this.#E())return;let _=this.#r(Q)+1,X=this.#v($.detail?.value??Q.value);this.#Z.splice(_,0,K.#R(X)),this.#LJ(_),this.#Q=_,this.#s(),this.#i("input"),this.#i("change")})}for(let Q of this.querySelectorAll(".propskit-oscillator-add-type-button")){let Z=($)=>{$.stopPropagation()};Q.addEventListener("pointerdown",Z),Q.addEventListener("click",Z),Q.closest("fig-tooltip")?.addEventListener("pointerdown",Z),Q.closest("fig-tooltip")?.addEventListener("click",Z)}for(let Q of this.querySelectorAll(".propskit-oscillator-remove-button"))Q.addEventListener("pointerdown",(Z)=>{Z.stopPropagation()}),Q.addEventListener("click",(Z)=>{if(Z.stopPropagation(),this.#E()||this.#Z.length<=1)return;let $=this.#r(Q);this.#Z.splice($,1),this.#GJ($),this.#Q=Math.min(this.#Q,this.#Z.length-1),this.#s(),this.#i("input"),this.#i("change")});for(let Q of[this.#M,this.#P])this.#OJ(Q);this.querySelector(".propskit-oscillator-svg-container")?.addEventListener("pointerdown",(Q)=>{if(this.#E())return;if(Q.target?.closest?.(".propskit-oscillator-handle, fig-handle"))return;this.#BJ(Q,"offset")})}#r(J){let Q=Number.parseInt(J?.getAttribute("data-wave-index")||"",10);return Number.isFinite(Q)?Math.min(this.#Z.length-1,Math.max(0,Q)):0}#OJ(J){let Q=J?.querySelector("fig-handle"),Z=J?.getAttribute("data-handle");if(!Q||!Z)return;Q.addEventListener("pointerdown",($)=>{if(this.#E())return;$.preventDefault(),$.stopImmediatePropagation(),this.#BJ($,Z)},{capture:!0}),Q.addEventListener("keydown",($)=>{if(this.#E())return;if(!["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes($.key))return;if(!this.#TJ($,Z))return;$.preventDefault(),$.stopImmediatePropagation()},{capture:!0})}#XJ(J){let Q=Math.min(this.#Z.length-1,Math.max(0,J));if(Q===this.#Q)return;this.#Q=Q,this.#RJ(),this.#KJ()}#HJ(J,Q,Z,$){if(this.#E())return;this.#XJ(J);let j=Number.parseFloat(Z);if(!Number.isFinite(j)){if($==="change")this.#fJ();return}this.#Z[J]=this.#b({...this.#Z[J],[Q]:j}),this.#qJ({skipFieldSync:$=="input"}),this.#i($)}#TJ(J,Q){let Z=J.shiftKey?0.5:0.1,$=this.#z;switch(Q){case"amplitude":if(J.key==="ArrowUp")$.amplitude+=Z;else if(J.key==="ArrowDown")$.amplitude-=Z;else if(J.key==="Home")$.amplitude=-4;else if(J.key==="End")$.amplitude=4;else return!1;break;case"offset":if(J.key==="ArrowUp")$.offset+=Z;else if(J.key==="ArrowDown")$.offset-=Z;else if(J.key==="Home")$.offset=-4;else if(J.key==="End")$.offset=4;else return!1;break;case"frequency":if(J.key==="ArrowLeft")$.frequency-=Z;else if(J.key==="ArrowRight")$.frequency+=Z;else if(J.key==="Home")$.frequency=0.1;else if(J.key==="End")$.frequency=16;else return!1;break;default:return!1}return this.#Z[this.#Q]=this.#b($),this.#qJ(),this.#i("input"),this.#i("change"),!0}#WJ(J){let Q=this.#_?.getScreenCTM();if(!Q)return{x:0,y:0};let Z=Q.inverse();return{x:Z.a*J.clientX+Z.c*J.clientY+Z.e,y:Z.b*J.clientX+Z.d*J.clientY+Z.f}}#BJ(J,Q){this.#u(),this.#X=Q,this.#_?.classList.add("dragging");let Z=Q==="frequency"?"ew-resize":Q==="amplitude"?"ns-resize":"",$=document.body.style.cursor;if(Z)document.body.style.cursor=Z;let j=(q)=>{if(!this.#X)return;let B=this.#WJ(q),O=this.#z;if(Q==="frequency"){let G=Math.max(1,Math.min(this.#j,B.x));O.frequency=this.#j/G}else if(Q==="offset"){let G=this.#x(B.x/this.#j,0,0,1),M=this.#QJ(O,G);O.offset=this.#$J(B.y)-this.#JJ(this.#Q,G)-M*O.amplitude}else if(Q==="amplitude"){let G=this.#x(B.x/this.#j,0,0,1),M=this.#QJ(O,G),k=this.#$J(B.y)-this.#JJ(this.#Q,G)-O.offset;O.amplitude=Math.abs(M)<0.001?O.amplitude:k/M}this.#Z[this.#Q]=this.#b(O),this.#qJ(),this.#i("input")},_=new AbortController,X=(q=!1)=>{if(this.#X=null,this.#_?.classList.remove("dragging"),Z)document.body.style.cursor=$;if(_.abort(),this.#H===_)this.#H=null,this.#S=null;if(q)this.#i("change")};this.#H=_,this.#S=X,document.addEventListener("pointermove",j,{signal:_.signal}),document.addEventListener("pointerup",()=>X(!0),{signal:_.signal}),document.addEventListener("pointercancel",()=>X(!1),{signal:_.signal}),window.addEventListener("blur",()=>X(!1),{signal:_.signal})}#u(){this.#S?.(!1),this.#H?.abort(),this.#H=null,this.#S=null,this.#X=null,this.#_?.classList.remove("dragging")}#JJ(J,Q){return this.#Z.reduce((Z,$,j)=>{if(j===J)return Z;let _=Q*$.frequency,X=K.#A($.type,_,$.phase);return Z+$.offset+X*$.amplitude},0)}#QJ(J,Q){return K.#A(J.type,Q*J.frequency,J.phase)}#qJ({skipFieldSync:J=!1}={}){if(this.#PJ(),!J)this.#fJ();this.#RJ(),this.#e()}#PJ(){for(let J of this.#L){let Q=this.#r(J);J.value=this.#Z[Q]?.type||"sine"}}#fJ(){for(let J of this.#N){if(J===this.#W)continue;let Q=this.#r(J),Z=J.getAttribute("name"),$=this.#y(this.#Z[Q]?.[Z]??0),j=J.querySelector("fig-slider");if(j)j.value=$;else J.setAttribute("value",String($))}}#RJ(){for(let J of this.#U)if(this.#r(J)===this.#Q)J.setAttribute("data-active","");else J.removeAttribute("data-active")}#i(J){this.dispatchEvent(new CustomEvent(J,{bubbles:!0,detail:{value:this.value,data:this.data,preset:K.#m(this.#z.type)}}))}}L("propskit-oscillator",K);class WJ extends HTMLElement{#Z;#Q;#J=null;#j;#$;#G;#X;#_;#q;#B;#O=null;#k=null;constructor(){super();this.angle=0,this.#Z=1,this.#Q=0,this.isDragging=!1,this.isShiftHeld=!1,this.handle=null,this.angleInput=null,this.plane=null,this.units="°",this.min=null,this.max=null,this.dial=!0,this.showRotations=!1,this.rotationSpan=null,this.#j=this.#w.bind(this),this.#$=this.#v.bind(this),this.#G=this.#x.bind(this),this.#X=this.#g.bind(this),this.#_=this.#a.bind(this),this.#q=this.#f.bind(this),this.#B=this.#m.bind(this)}connectedCallback(){requestAnimationFrame(()=>{if(!this.isConnected)return;this.precision=this.getAttribute("precision")||1,this.precision=parseInt(this.precision),this.text=this.getAttribute("text")==="true";let J=this.getAttribute("units")||"°";if(J==="deg")J="°";if(this.units=J,this.min=this.hasAttribute("min")?Number(this.getAttribute("min")):null,this.max=this.hasAttribute("max")?Number(this.getAttribute("max")):null,this.dial=this.#M("dial",!0),this.showRotations=this.#P(),this.#Y(),this.#R(),this.#z(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision))})}disconnectedCallback(){this.#y(),this.#I()}#Y(){this.#y(),this.#I();let J=this.#W(),Q=this.#L(),Z=this.getAttribute("aria-label")||this.getAttribute("name")||"Angle",$=this.min??this.#S(0),j=this.max??this.#S(360),_=[];if(this.dial)_.push(P("div",{className:"fig-input-angle-plane",role:"slider",tabindex:Q?"-1":"0","aria-label":Z,"aria-valuemin":$,"aria-valuemax":j,"aria-valuenow":this.angle,"aria-valuetext":`${this.angle.toFixed(this.precision)}${this.units}`,"aria-disabled":Q?"true":null},P("div",{className:"fig-input-angle-handle"})));if(this.text)_.push(P("fig-input-number",{name:"angle",step:J,value:this.angle,min:this.min,max:this.max,units:this.units,"aria-label":Z,disabled:Q},this.showRotations?P("span",{slot:"append",className:"fig-input-angle-rotations"}):null));this.replaceChildren(..._)}#M(J,Q=!1){let Z=this.getAttribute(J);if(Z===null)return Q;let $=Z.trim().toLowerCase();if($===""||$==="true")return!0;if($==="false")return!1;return!0}#P(){if(this.hasAttribute("rotations"))return this.#M("rotations",!1);if(this.hasAttribute("show-rotations"))return this.#M("show-rotations",!1);return!1}#N(){let J=Math.abs(this.#H(this.angle));return Math.floor(J/360)}#L(){return Y(this,"disabled")}#U(J){let Q=Number(J);if(!Number.isFinite(Q))return this.angle;if(this.min!==null&&Number.isFinite(this.min))Q=Math.max(this.min,Q);if(this.max!==null&&Number.isFinite(this.max))Q=Math.min(this.max,Q);return Q}#K(J,{reflect:Q=!0}={}){let Z=this.#U(J);if(this.angle=Z,this.#E(),Q){let $=String(Z);if(this.getAttribute("value")!==$)this.setAttribute("value",$)}if(this.#z(),this.angleInput)this.angleInput.value=Z.toFixed(this.precision);this.#T(),this.#F()}#T(){if(!this.plane)return;this.plane.setAttribute("aria-valuenow",String(this.angle)),this.plane.setAttribute("aria-valuetext",`${this.angle.toFixed(this.precision)}${this.units}`)}#F(){if(!this.rotationSpan)return;let J=this.#N();if(J>1)this.rotationSpan.textContent=`×${J}`,this.rotationSpan.style.display="";else this.rotationSpan.textContent="",this.rotationSpan.style.display="none"}#W(){switch(this.units){case"rad":return 0.01;case"turn":return 0.001;default:return 0.1}}#H(J){switch(this.units){case"rad":return J*180/Math.PI;case"turn":return J*360;default:return J}}#S(J){switch(this.units){case"rad":return J*Math.PI/180;case"turn":return J/360;default:return J}}#V(J,Q,Z){let $;switch(Q){case"rad":$=J*180/Math.PI;break;case"turn":$=J*360;break;default:$=J}switch(Z){case"rad":return $*Math.PI/180;case"turn":return $/360;default:return $}}#R(){if(this.handle=this.querySelector(".fig-input-angle-handle"),this.plane=this.querySelector(".fig-input-angle-plane"),this.angleInput=this.querySelector("fig-input-number[name='angle']"),this.rotationSpan=this.querySelector(".fig-input-angle-rotations"),this.#F(),this.plane?.addEventListener("mousedown",this.#$),this.plane?.addEventListener("touchstart",this.#G),this.plane?.addEventListener("keydown",this.#B),window.addEventListener("keydown",this.#X),window.addEventListener("keyup",this.#_),this.text&&this.angleInput)this.angleInput.addEventListener("input",this.#q),this.angleInput.addEventListener("change",this.#q);this.addEventListener("change",this.#j,!0)}#I(){if(this.plane?.removeEventListener("mousedown",this.#$),this.plane?.removeEventListener("touchstart",this.#G),this.plane?.removeEventListener("keydown",this.#B),window.removeEventListener("keydown",this.#X),window.removeEventListener("keyup",this.#_),this.text&&this.angleInput)this.angleInput.removeEventListener("input",this.#q),this.angleInput.removeEventListener("change",this.#q);this.removeEventListener("change",this.#j,!0)}#w(J){if(!J.target?.matches?.("input"))return;let Z=J.target.value.match(/^(-?\d*\.?\d+)\s*(turn|rad|deg|°)$/i);if(Z){let $=parseFloat(Z[1]),j=Z[2].toLowerCase();if(j==="deg")j="°";if(j!==this.units){let _=this.#V($,j,this.units);J.target.value=String(_)}}}#f(J){if(J.stopPropagation(),this.#L())return;if(this.#K(Number(J.target.value)),J.type==="change")this.#C();else this.#b()}#E(){let Q=this.#H(this.angle)*Math.PI/180;this.#Z=Math.cos(Q),this.#Q=Math.sin(Q)}#p(J){if(!this.isShiftHeld)return J;let Q=45;return Math.round(J/Q)*Q}#D(J){let Q=this.plane.getBoundingClientRect(),Z=Q.left+Q.width/2,$=Q.top+Q.height/2,j=J.clientX-Z,_=J.clientY-$;return Math.atan2(_,j)*180/Math.PI}#c(J){let Z=(this.#D(J)%360+360)%360;if(Z=this.#p(Z),this.min!==null||this.max!==null)this.angle=this.#U(this.#S(Z));else if(this.#J===null){this.#J=Z;let _=(this.#H(this.angle)%360+360)%360,X=Z-_;if(X>180)X-=360;if(X<-180)X+=360;this.angle=this.#U(this.angle+this.#S(X))}else{let j=Z-this.#J;if(j>180)j-=360;if(j<-180)j+=360;this.angle=this.#U(this.angle+this.#S(j)),this.#J=Z}if(this.#E(),this.setAttribute("value",String(this.angle)),this.#z(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#F(),this.#T(),this.#b()}#b(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0,detail:{value:this.value,angle:this.angle}}))}#C(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,detail:{value:this.value,angle:this.angle}}))}#z(){if(this.handle){let Q=this.#H(this.angle)*Math.PI/180,Z=this.plane.offsetWidth/2-this.handle.offsetWidth/2,$=Math.cos(Q)*Z,j=Math.sin(Q)*Z;this.handle.style.transform=`translate(${$}px, ${j}px)`}}#v(J){if(this.#L()||J.button!==0)return;this.#y(),this.isDragging=!0,this.#J=null,this.#c(J);let Q=(j)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#c(j)},Z=new AbortController,$=(j=!1)=>{if(this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),Z.abort(),this.#O===Z)this.#O=null,this.#k=null;if(j)this.#C()};this.#O=Z,this.#k=$,window.addEventListener("mousemove",Q,{signal:Z.signal}),window.addEventListener("mouseup",()=>$(!0),{signal:Z.signal}),window.addEventListener("blur",()=>$(!1),{signal:Z.signal})}#x(J){if(this.#L())return;J.preventDefault(),this.#y(),this.isDragging=!0,this.#J=null,this.#c(J.touches[0]);let Q=(j)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#c(j.touches[0])},Z=new AbortController,$=(j=!1)=>{if(this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),Z.abort(),this.#O===Z)this.#O=null,this.#k=null;if(j)this.#C()};this.#O=Z,this.#k=$,window.addEventListener("touchmove",Q,{signal:Z.signal}),window.addEventListener("touchend",()=>$(!0),{signal:Z.signal}),window.addEventListener("touchcancel",()=>$(!1),{signal:Z.signal})}#y(){this.#k?.(!1),this.#O?.abort(),this.#O=null,this.#k=null,this.isDragging=!1,this.#J=null,this.plane?.classList.remove("dragging")}#m(J){if(this.#L())return;let Q=this.#W()*(J.shiftKey?10:1),Z=this.angle;if(J.key==="ArrowLeft"||J.key==="ArrowDown")Z-=Q;else if(J.key==="ArrowRight"||J.key==="ArrowUp")Z+=Q;else if(J.key==="Home")Z=this.min??this.#S(0);else if(J.key==="End")Z=this.max??this.#S(360);else return;J.preventDefault(),J.stopPropagation(),this.#K(Z),this.#b(),this.#C()}#g(J){if(J.key==="Shift")this.isShiftHeld=!0}#a(J){if(J.key==="Shift")this.isShiftHeld=!1}focus(){this.plane?.focus()}static get observedAttributes(){return["value","precision","text","min","max","units","dial","rotations","show-rotations","disabled","aria-label","name"]}get value(){return this.angle}get adjacent(){return this.#Z}get opposite(){return this.#Q}set value(J){if(isNaN(J)){console.error("Invalid value: must be a number.");return}this.#K(Number(J))}attributeChangedCallback(J,Q,Z){switch(J){case"value":if(this.isDragging)break;if(Z!==null)this.#K(Number(Z),{reflect:!1});break;case"precision":this.precision=parseInt(Z);break;case"text":if(Z!==Q){if(this.text=Z?.toLowerCase()==="true",this.isConnected)this.#Y(),this.#R(),this.#z()}break;case"dial":if(this.dial=this.#M("dial",!0),this.isConnected)this.#Y(),this.#R(),this.#z();break;case"units":{let $=Z||"°";if($==="deg")$="°";if(this.units=$,this.isConnected)this.#Y(),this.#R(),this.#z();break}case"min":if(this.min=Z!==null?Number(Z):null,this.#K(this.angle),this.isConnected)this.#Y(),this.#R(),this.#z();break;case"max":if(this.max=Z!==null?Number(Z):null,this.#K(this.angle),this.isConnected)this.#Y(),this.#R(),this.#z();break;case"disabled":if(this.#y(),this.isConnected)this.#Y(),this.#R(),this.#z();break;case"aria-label":case"name":if(this.isConnected)this.#Y(),this.#R(),this.#z();break;case"rotations":case"show-rotations":if(this.showRotations=this.#P(),this.isConnected)this.#Y(),this.#R(),this.#z();break}}}L("fig-input-angle",WJ);class h extends HTMLElement{static observedAttributes=["axis","handle","disabled"];static#Z=6;static#Q=['[draggable]:not([draggable="false"])','img:not([draggable="false"])','a[href]:not([draggable="false"])','input[type="range"]',"fig-handle","fig-slider","fig-input-number","fig-input-gradient","fig-easing-curve","fig-input-angle","fig-input-wheel","fig-input-joystick","fig-canvas-control","propskit-color-point","propskit-number","propskit-point-point","propskit-point-radius","propskit-point-radius-angle","propskit-position","propskit-slider","propskit-oscillator"];#J=null;#j=new Map;#$=null;#G=null;#X=null;connectedCallback(){if(this.style.display="contents",!this.hasAttribute("role"))this.setAttribute("role","list");if(!this.hasAttribute("aria-label"))this.setAttribute("aria-label","Reorderable list");this.#T(),this.#k(),this.#J=new MutationObserver(()=>this.#k()),this.#J.observe(this,{childList:!0})}disconnectedCallback(){this.#J?.disconnect(),this.#J=null,this.#C(),this.#z(),this.#p(),this.#X?.remove(),this.#X=null}attributeChangedCallback(){if(this.isConnected){if(this.#_)this.#z();this.#k()}}get#_(){return this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"}get#q(){return(this.getAttribute("axis")||"vertical").trim().toLowerCase()==="horizontal"?"horizontal":"vertical"}get#B(){return(this.getAttribute("handle")||"").trim()}#O(){return[...this.children].filter((J)=>J.nodeType===Node.ELEMENT_NODE&&!J.hasAttribute("data-reorder-live"))}#k(){let J=this.#O(),Q=new Set(J);for(let[Z,$]of this.#j)if(!Q.has(Z))$.target.removeEventListener("pointerdown",$.onPointerDown,!0),$.target.removeEventListener("keydown",$.onKeyDown),this.#K($),this.#j.delete(Z);if(this.#P(J),this.#Y(J),this.#_||J.length<2){this.#C();return}for(let Z of J){let $=this.#L(Z),j=this.#j.get(Z);if(j&&j.target===$)continue;if(j)j.target.removeEventListener("pointerdown",j.onPointerDown,!0),this.#j.delete(Z);if(!$)continue;this.#U(Z,$)}this.#N(J),this.#M(J)}#Y(J){for(let Q of J)if(Q.removeAttribute("data-reorder-item"),Q.hasAttribute("data-reorder-generated-role"))Q.removeAttribute("role"),Q.removeAttribute("data-reorder-generated-role")}#M(J){for(let Q of J)if(Q.setAttribute("data-reorder-item",""),!Q.hasAttribute("role"))Q.setAttribute("role","listitem"),Q.setAttribute("data-reorder-generated-role","")}#P(J){for(let Q of J)Q.querySelectorAll("[data-reorder-handle]").forEach((Z)=>{Z.removeAttribute("data-reorder-handle"),Z.removeAttribute("aria-roledescription")})}#N(J){if(!this.#B)return;for(let Q of J){let Z=Q.querySelector(this.#B);if(Z)Z.setAttribute("data-reorder-handle",""),Z.setAttribute("aria-roledescription","reorder handle")}}#L(J){if(this.#B)return J.querySelector(this.#B);return J}#U(J,Q){let Z=(B)=>{if(this.#_||this.#O().length<2)return;if(B.button!==0)return;if(!this.#B&&this.#W(B.target,J))return;this.#V(B,J,Q)},$=Q.getAttribute("tabindex"),j=Q.getAttribute("aria-label"),_=Q.getAttribute("role"),X=J.getAttribute("aria-label")||J.textContent?.trim().replace(/\s+/g," ").slice(0,80)||"item";if(Q.setAttribute("tabindex","0"),Q.setAttribute("aria-label",`Move ${X}`),Q!==J&&!Q.hasAttribute("role"))Q.setAttribute("role","button");let q=(B)=>{if(this.#_)return;let O=this.#q==="horizontal",G=O?"ArrowLeft":"ArrowUp",M=O?"ArrowRight":"ArrowDown";if(B.key!==G&&B.key!==M&&B.key!=="Home"&&B.key!=="End")return;B.preventDefault(),B.stopPropagation();let k=this.#O(),U=k.indexOf(J),N=U;if(B.key===G)N=Math.max(0,U-1);else if(B.key===M)N=Math.min(k.length-1,U+1);else if(B.key==="Home")N=0;else if(B.key==="End")N=k.length-1;if(N===U){this.#F(`${X}, position ${U+1} of ${k.length}`);return}this.#c(J,N),this.#k(),this.#L(J)?.focus(),this.dispatchEvent(new CustomEvent("reorder",{bubbles:!0,detail:{oldIndex:U,newIndex:N,item:J}})),this.#F(`${X}, position ${N+1} of ${k.length}`)};Q.addEventListener("pointerdown",Z,!0),Q.addEventListener("keydown",q),this.#j.set(J,{target:Q,onPointerDown:Z,onKeyDown:q,originalTabIndex:$,originalAriaLabel:j,originalRole:_})}#K(J){let{target:Q,originalTabIndex:Z,originalAriaLabel:$,originalRole:j}=J;if(Z===null)Q.removeAttribute("tabindex");else Q.setAttribute("tabindex",Z);if($===null)Q.removeAttribute("aria-label");else Q.setAttribute("aria-label",$);if(j===null)Q.removeAttribute("role");else Q.setAttribute("role",j)}#T(){if(this.#X?.isConnected)return;let J=document.createElement("span");J.setAttribute("data-reorder-live",""),J.setAttribute("role","status"),J.setAttribute("aria-live","polite"),J.setAttribute("aria-atomic","true"),Object.assign(J.style,{position:"absolute",width:"1px",height:"1px",padding:"0",margin:"-1px",overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",border:"0"}),this.#X=J,document.body.appendChild(J)}#F(J){if(!this.#X)return;this.#X.textContent="",requestAnimationFrame(()=>{if(this.#X)this.#X.textContent=J})}#W(J,Q){let Z=J;while(Z&&Z!==Q){if(Z instanceof Element){for(let $ of h.#Q)if(Z.matches($))return!0}Z=Z.parentElement}return!1}static#H="fig-reorder-dragging";static#S(J){document.body.classList.toggle(h.#H,J)}#V(J,Q,Z){this.#z();let $={item:Q,target:Z,pointerId:J.pointerId,oldIndex:this.#O().indexOf(Q),targetIndex:this.#O().indexOf(Q),startX:J.clientX,startY:J.clientY,active:!1,onMove:null,onUp:null,onKeyDown:null};$.onMove=(j)=>{if(j.pointerId!==$.pointerId)return;let _=j.clientX-$.startX,X=j.clientY-$.startY;if(!$.active){if(_*_+X*X<h.#Z*h.#Z)return;$.active=!0,J.preventDefault(),J.stopPropagation(),Q.classList.add("dragging"),h.#S(!0);try{Z.setPointerCapture($.pointerId)}catch{}}j.preventDefault();let q=this.#q==="horizontal"?j.clientX:j.clientY,B=this.#R(q);$.targetIndex=B,this.#E(B,Q)},$.onKeyDown=(j)=>{if(j.key!=="Escape"||!$.active)return;j.preventDefault(),this.#b($,!0)},$.onUp=(j)=>{if(j.pointerId!==$.pointerId)return;this.#b($,j.type==="pointercancel")},this.#$=$,window.addEventListener("pointermove",$.onMove),window.addEventListener("pointerup",$.onUp),window.addEventListener("pointercancel",$.onUp),window.addEventListener("keydown",$.onKeyDown)}#R(J){let Q=this.#O(),Z=this.#q==="horizontal";for(let $=0;$<Q.length;$++){let j=Q[$].getBoundingClientRect(),_=Z?j.left+j.width/2:j.top+j.height/2;if(J<_)return $}return Q.length}#I(J,Q){let Z=this.#O(),$=Z.indexOf(J);if($===-1)return!1;let j=Math.max(0,Math.min(Q,Z.length));if(Q===$)return!1;if(j>=Z.length&&$===Z.length-1)return!1;return!0}#w(J){if(!J.length)return null;let Q=1/0,Z=-1/0,$=1/0,j=-1/0;for(let _ of J){let X=_.getBoundingClientRect();Q=Math.min(Q,X.left),Z=Math.max(Z,X.right),$=Math.min($,X.top),j=Math.max(j,X.bottom)}return{left:Q,top:$,width:Z-Q,height:j-$}}#f(){if(this.#G)return this.#G;let J=document.createElement("div");return J.className="fig-reorder-indicator",J.setAttribute("data-axis",this.#q),document.body.appendChild(J),this.#G=J,J}#E(J,Q){let Z=this.#O();if(!this.#I(Q,J)){this.#p();return}let $=this.#w(Z);if(!$){this.#p();return}let j=this.#f();if(j.setAttribute("data-axis",this.#q),this.#q==="horizontal"){let X;if(J<=0)X=Z[0].getBoundingClientRect().left;else if(J>=Z.length)X=Z[Z.length-1].getBoundingClientRect().right;else X=Z[J].getBoundingClientRect().left;j.style.left=`${X-1}px`,j.style.top=`${$.top}px`,j.style.width="2px",j.style.height=`${$.height}px`;return}let _;if(J<=0)_=Z[0].getBoundingClientRect().top;else if(J>=Z.length)_=Z[Z.length-1].getBoundingClientRect().bottom;else _=Z[J].getBoundingClientRect().top;j.style.left=`${$.left}px`,j.style.top=`${_-1}px`,j.style.width=`${$.width}px`,j.style.height="2px"}#p(){this.#G?.remove(),this.#G=null}#D(J,Q){let Z=this.#O(),$=Math.max(0,Math.min(Q,Z.length));if($>=Z.length){if(Z[Z.length-1]!==J)this.appendChild(J);return}let j=Z[$];if(j!==J)this.insertBefore(J,j)}#c(J,Q){let $=this.#O().filter((j)=>j!==J)[Q]??null;if($)this.insertBefore(J,$);else this.appendChild(J)}#b(J,Q){let{item:Z,oldIndex:$,active:j,onMove:_,onUp:X,onKeyDown:q}=J;if(window.removeEventListener("pointermove",_),window.removeEventListener("pointerup",X),window.removeEventListener("pointercancel",X),window.removeEventListener("keydown",q),j){if(!Q){this.#D(Z,J.targetIndex);let B=this.#O().indexOf(Z);if(B!==-1&&B!==$){this.dispatchEvent(new CustomEvent("reorder",{bubbles:!0,detail:{oldIndex:$,newIndex:B,item:Z}}));let O=Z.getAttribute("aria-label")||Z.textContent?.trim().replace(/\s+/g," ").slice(0,80)||"item";this.#F(`${O}, position ${B+1} of ${this.#O().length}`)}}}if(Z.classList.remove("dragging"),h.#S(!1),this.#p(),this.#$===J)this.#$=null}#C(){for(let[,J]of this.#j)J.target.removeEventListener("pointerdown",J.onPointerDown,!0),J.target.removeEventListener("keydown",J.onKeyDown),this.#K(J);this.#j.clear()}#z(){if(!this.#$)return;this.#b(this.#$,!0)}}L("fig-reorder",h);

package/fig-lab.js

@@ -5552,6 +5552,7 @@ figLabDefineElement("propskit-slider", PropskitSlider);
  * @attr {number} min - Inclusive lower bound. Omitted = unbounded below.
  * @attr {number} max - Inclusive upper bound. Omitted = unbounded above.
  * @attr {number} step - Increment. Defaults to 1.
+ * @attr {boolean|string} spin - Keeps ticks synchronized to value. Defaults to true.
  * @attr {boolean|string} elastic - Enables resisted handle movement. Defaults to true.
  * @attr {boolean|string} disabled - Disables interaction and focus.
  * @fires input - Numeric composed event during interaction.
@@ -5598,6 +5599,7 @@ class FigInputWheel extends HTMLElement {
       "step",
       "min",
       "max",
+      "spin",
       "elastic",
     ];
   }
@@ -5637,6 +5639,7 @@ class FigInputWheel extends HTMLElement {
       this.#syncWheelAria();
       this.#queueWheelLayout();
     }
+    if (name === "spin") this.#queueWheelLayout();
     if (name === "min" || name === "max") {
       this.#commitValue(this.#numericValue());
     }
@@ -5865,7 +5868,10 @@ class FigInputWheel extends HTMLElement {
     const height = this.#wheelHeight;
     if (width < 1 || height < 1) return;
 
-    const value = this.#visualValue ?? this.#numericValue();
+    const value =
+      this.getAttribute("spin") === "false"
+        ? (this.#boundMin() ?? 0)
+        : (this.#visualValue ?? this.#numericValue());
     const tickStep = 360 / FigInputWheel.#TICK_COUNT;
     const step = this.#step();
     const base = this.#boundMin() ?? 0;
@@ -6186,7 +6192,13 @@ class FigInputWheel extends HTMLElement {
     this.#commitValue(this.#numericValue(), { emit: "change" });
   }
 
-  #animateKeyboardMovement(from, to, direction, multiplier) {
+  #animateKeyboardMovement(
+    from,
+    to,
+    direction,
+    multiplier,
+    animateHandle = true,
+  ) {
     if (
       from === to ||
       globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches
@@ -6209,13 +6221,14 @@ class FigInputWheel extends HTMLElement {
       ) || 0;
     const duration = multiplier > 1 ? 120 : 90;
     const startedAt = performance.now();
-    const animateHandle = this.getAttribute("elastic") !== "false";
+    const shouldAnimateHandle =
+      animateHandle && this.getAttribute("elastic") !== "false";
     this.setAttribute("data-fig-input-wheel-keyboard-moving", "");
 
     const frame = (now) => {
       const progress = Math.min(1, (now - startedAt) / duration);
       this.#visualValue = visualFrom + (to - visualFrom) * progress;
-      if (animateHandle) {
+      if (shouldAnimateHandle) {
         const eased = Math.sin((progress * Math.PI) / 2);
         const offset = handleFrom + (direction * 4 - handleFrom) * eased;
         this.style.setProperty(
@@ -6272,6 +6285,25 @@ class FigInputWheel extends HTMLElement {
     this.#commitValue(Number.isFinite(parsed) ? parsed : 0);
   }
 
+  spinTo(nextValue) {
+    const previousValue = this.#numericValue();
+    this.value = nextValue;
+    const value = this.#numericValue();
+    if (this.getAttribute("spin") === "false") {
+      this.#stopKeyboardAnimation();
+      return value;
+    }
+    const direction = Math.sign(value - previousValue);
+    this.#animateKeyboardMovement(
+      previousValue,
+      value,
+      direction,
+      Math.abs(value - previousValue) > this.#step() ? 10 : 1,
+      false,
+    );
+    return value;
+  }
+
   get min() {
     return this.#boundMin();
   }
@@ -6304,6 +6336,7 @@ figLabDefineElement("fig-input-wheel", FigInputWheel);
  * @attr {string} label - Field label. Defaults to "Value".
  * @attr {string} default - Reset target.
  * @attr {number} precision - Number field display decimals.
+ * @attr {boolean|string} spin - Keeps wheel ticks synchronized to value. Defaults to true.
  * @attr {boolean|string} text - Shows the number field. Defaults to true.
  * @attr {string} size - Set to "small" for compact sizing.
  * @attr {string} variant - Set to "minimal" for compact chrome.
@@ -6317,6 +6350,7 @@ class PropskitWheel extends HTMLElement {
     "disabled",
     "variant",
     "elastic",
+    "spin",
     "text",
     "default",
     "class",
@@ -6337,6 +6371,7 @@ class PropskitWheel extends HTMLElement {
       "min",
       "max",
       "elastic",
+      "spin",
       "text",
     ];
   }
@@ -6421,9 +6456,16 @@ class PropskitWheel extends HTMLElement {
     if (name === "label") this.#syncLabel();
     if (name === "text") this.#syncText();
     if (
-      ["units", "value", "disabled", "step", "min", "max", "elastic"].includes(
-        name,
-      )
+      [
+        "units",
+        "value",
+        "disabled",
+        "step",
+        "min",
+        "max",
+        "elastic",
+        "spin",
+      ].includes(name)
     ) {
       this.#syncPrimitive();
     }
@@ -6500,7 +6542,7 @@ class PropskitWheel extends HTMLElement {
   #syncPrimitive() {
     if (!this.#wheel) return;
     this.#wheel.removeAttribute("units");
-    for (const name of ["min", "max", "elastic"]) {
+    for (const name of ["min", "max", "elastic", "spin"]) {
       this.#mirrorAttribute(name);
     }
     if (this.hasAttribute("step")) this.#mirrorAttribute("step");
@@ -6660,14 +6702,16 @@ class PropskitWheel extends HTMLElement {
     this.removeEventListener("click", this.#boundClick, true);
   }
 
-  #setSynchronizedValue(value) {
+  #setSynchronizedValue(value, { spin = false } = {}) {
     const parsed = Number(value);
     if (!this.#wheel) {
       const normalized = Number.isFinite(parsed) ? parsed : 0;
       this.setAttribute("value", String(normalized));
       return normalized;
     }
-    this.#wheel.value = Number.isFinite(parsed) ? parsed : 0;
+    const nextValue = Number.isFinite(parsed) ? parsed : 0;
+    if (spin) this.#wheel.spinTo(nextValue);
+    else this.#wheel.value = nextValue;
     const normalized = this.#wheel.value;
     if (this.getAttribute("value") !== normalized) {
       this.setAttribute("value", normalized);
@@ -6703,7 +6747,7 @@ class PropskitWheel extends HTMLElement {
       event instanceof CustomEvent && event.detail !== undefined
         ? event.detail
         : this.#input?.value;
-    const value = this.#setSynchronizedValue(raw);
+    const value = this.#setSynchronizedValue(raw, { spin: type === "input" });
     this.#emit(type, value);
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rogieking/figui3",
-  "version": "8.9.33",
+  "version": "8.9.34",
   "description": "A lightweight web components library for building Figma plugin and widget UIs with native look and feel",
   "author": "Rogie King",
   "license": "SEE LICENSE IN LICENSE",