@rogieking/figui3 8.2.0 → 8.2.1

package/dist/fig-lab.js

@@ -1,6 +1,6 @@
 function M(J,Q){if(!customElements.get(J))customElements.define(J,Q)}function Y(J,Q){return J.hasAttribute(Q)&&J.getAttribute(Q)!=="false"}function x(J,Q){let Z=Y(J,"disabled");for(let $ of Q)$?.toggleAttribute("disabled",Z)}function XJ(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 w=new WeakMap;function T(J){let Q=w.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 q=Q?.point;if(q)Z.showAt?.(q.x,q.y)};Q={menu:Z,point:null,clearPendingOpen:_,handleContextMenu:(q)=>{if(Y(J,"disabled")||q.target?.closest?.("fig-menu"))return;q.preventDefault(),q.stopPropagation(),q.stopImmediatePropagation?.(),Q.point={x:q.clientX,y:q.clientY},_(),window.addEventListener("pointerup",X,{once:!0,capture:!0}),window.addEventListener("pointercancel",X,{once:!0,capture:!0}),j=window.setTimeout(X,180)},handleChange:(q)=>{if(q.stopPropagation(),q.detail?.value==="reset-default")J.resetToDefault?.()}},w.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 f(J){let Q=w.get(J);if(!Q)return;Q.clearPendingOpen(),J.removeEventListener("contextmenu",Q.handleContextMenu),Q.menu.removeEventListener("change",Q.handleChange)}function I(J,Q){for(let Z of["input","change"])J.dispatchEvent(new CustomEvent(Z,{detail:Q,bubbles:!0,cancelable:!0,composed:!0}))}function b(J,Q){if(typeof J==="boolean"||typeof Q==="boolean")return Boolean(J)===Boolean(Q);return String(J??"")===String(Q??"")}function m(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 b(J,Q)}}function BJ(J,Q){if(!J||!Q)return null;let Z=document.createElement("span");Z.style.cssText="position:absolute;visibility:hidden;pointer-events:none;color:"+Q,J.appendChild(Z);let $=getComputedStyle(Z).color;if(Z.remove(),!$.startsWith("rgb"))return null;let j=$.match(/[\d.]+/g)?.slice(0,3).map(Number);if(!j||j.length<3||j.some(Number.isNaN))return null;let[_,X,O]=j.map((q)=>{let G=q/255;return G<=0.04045?G/12.92:((G+0.055)/1.055)**2.4});return 0.2126*_+0.7152*X+0.0722*O<=0.179?"light":"dark"}var c=0;function qJ(J="fig-lab"){return c+=1,`${J}-${c}`}class u extends HTMLElement{}M("fig-ai-prompt",u);class v extends HTMLElement{}M("fig-chat-message",v);class s extends HTMLElement{#Z=null;#Q=null;#J=null;#j=null;#X=null;#Y=null;#B=this.#M.bind(this);#$=this.#U.bind(this);#q=this.#P.bind(this);static get observedAttributes(){return["src","name","value","removable","disabled"]}connectedCallback(){if(!this.#Q)this.#_();this.#X.removeEventListener("click",this.#B),this.#X.addEventListener("click",this.#B),this.#O(),this.#G()}disconnectedCallback(){this.#X?.removeEventListener("click",this.#B),this.#k()}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Q)return;this.#G()}#_(){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.#X=document.createElement("fig-button"),this.#X.className="fig-attachment-remove",this.#X.setAttribute("variant","overlay"),this.#X.setAttribute("size","small"),this.#X.setAttribute("icon","");let J=document.createElement("fig-icon");J.setAttribute("name","close"),J.setAttribute("size","small"),this.#X.append(J),this.#j.append(this.#X),this.#Q.append(this.#J),this.#Z.append(this.#Q),this.replaceChildren(this.#Z,this.#j),this.#X.addEventListener("click",this.#B),this.#O()}#O(){let J=this.#Q?.mediaEl;if(!J||J===this.#Y)return;this.#k(),this.#Y=J,this.#Y.addEventListener("load",this.#$),this.#Y.addEventListener("error",this.#q)}#k(){if(!this.#Y)return;this.#Y.removeEventListener("load",this.#$),this.#Y.removeEventListener("error",this.#q),this.#Y=null}#G(){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.#N(Q),this.#X.hidden=!Z,this.#X.toggleAttribute("disabled",$),this.#X.setAttribute("aria-label",`Remove ${Q}`),this.toggleAttribute("data-fallback",!J),$)this.setAttribute("aria-disabled","true");else this.removeAttribute("aria-disabled")}#N(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)}#U(){if(this.getAttribute("src"))this.removeAttribute("data-fallback")}#P(){this.setAttribute("data-fallback","")}#M(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}}))}}M("fig-attachment",s);class o 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","")}}M("fig-attachments",o);class r extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#K.bind(this);#_=!1;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#_=Y(this,"checked");let Q=Array.from(this.childNodes).filter((O)=>O.nodeType!==Node.TEXT_NODE||Boolean(O.textContent?.trim())).find((O)=>O.nodeType===Node.ELEMENT_NODE&&O.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")}#G(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","checked","value","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)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.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#M.bind(this,"input"),this.#$??=this.#M.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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}))}#K(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.#_}get isDefault(){return this.checked===this.defaultValue}resetToDefault(){let J=this.defaultValue;this.checked=J,I(this,{checked:J,value:this.getAttribute("value")??""})}focus(J){(this.#J?.querySelector("fig-segment[selected]")||this.#J?.querySelector("fig-segment"))?.focus(J)}}M("propskit-switch",r);class l extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#L.bind(this);#_=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.#_===null)this.#_=this.getAttribute("default")??this.getAttribute("value")??"";if(this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){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-color");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()||"Color")}#G(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","text","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)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,$)}this.#J.setAttribute("text","true"),this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#K.bind(this,"input"),this.#$??=this.#K.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(J){let Q=J instanceof CustomEvent&&J.detail!==void 0?J.detail:void 0;if(typeof Q==="string"&&Q)return Q;if(Q&&typeof Q==="object"){if(typeof Q.value==="string"&&Q.value)return Q.value;if(typeof Q.hex==="string"&&Q.hex)return Q.hex;if(typeof Q.color==="string"&&Q.color)return Q.color}if(typeof this.#J?.value==="string"&&this.#J.value)return this.#J.value;return this.#J?.getAttribute("value")??""}#K(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#M(Q);if(this.setAttribute("value",Z),this.#J&&this.#J.getAttribute("value")!==Z)this.#J.setAttribute("value",Z);let $=Q instanceof CustomEvent&&Q.detail!==void 0?Q.detail:Z;this.dispatchEvent(new CustomEvent(J,{detail:$,bubbles:!0,cancelable:!0,composed:!0}))}#L(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-color, fig-menu"))return;this.focus()}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);if(this.setAttribute("value",Q),this.#J&&this.#J.getAttribute("value")!==Q)this.#J.setAttribute("value",Q)}#z(J){if(!this.#J)return;if(this.#J.getAttribute("value")===J)this.#J.removeAttribute("value");this.#J.setAttribute("value",J)}#S(){return this.getAttribute("default")??this.#_??""}get defaultValue(){return String(this.#S())}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.setAttribute("value",J),this.#z(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){this.#J?.querySelector("input:not([tabindex='-1'])")?.focus(J)}}M("propskit-color",l);class d extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#L.bind(this);#_=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.#_===null)this.#_=this.getAttribute("default")??this.getAttribute("value")??JSON.stringify(this.#J?.value??{});if(this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(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");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")}#G(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)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","true");this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#K.bind(this,"input"),this.#$??=this.#K.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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)}#K(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;let Z=this.#M(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}))}#L(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-gradient, fig-menu"))return;this.focus()}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.#_??""}get isDefault(){return m(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J;let Q=this.#J?.value;I(this,Q)}focus(J){this.#J?.focus(J)}}M("propskit-gradient",d);class A extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=null;#B=new Set;#$=null;#q=null;#_=null;#O=this.#H.bind(this);#k=this.#A.bind(this);#G=!1;#N=null;static get observedAttributes(){return["label","direction","aria-label","options","value"]}static#U(){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#P(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#M(J){if(J&&typeof J==="object")return String(J.value??J.label??"");return String(J??"")}static#K(J){if(J&&typeof J==="object")return String(J.label??J.value??"");return String(J??"")}connectedCallback(){if(!this.#Z)this.#L();if(this.#z(),this.#W(),this.#F(),this.removeEventListener("click",this.#O),this.addEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),this.addEventListener("pointerdown",this.#k,!0),T(this),!this.#Y)this.#Y=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.#z();if(Z)this.#W()});this.#Y.observe(this,{attributes:!0})}disconnectedCallback(){this.#Y?.disconnect(),this.#V(),this.removeEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label"){this.#z();return}if(J==="options"||J==="value")this.#W()}#L(){this.#N=this.getAttribute("value")??"";let J=this.querySelector(":scope > label"),Q=document.createElement("fig-field"),Z=J||document.createElement("label");this.#j=A.#U();let $=document.createElement(this.#j?"fig-select":"fig-dropdown");$.setAttribute("full",""),Q.append(Z,$),this.#Z=Q,this.#Q=Z,this.#J=$,this.#X=Boolean(J),this.replaceChildren(Q)}#z(){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.#X)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","")}#S(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","full","default"]);if(!this.#j)J.add("options");return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#T(){if(!this.#J||this.#j)return;let J=A.#P(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=A.#M(Z),$.textContent=A.#K(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)}}#W(){if(!this.#J)return;if(!this.#j)this.#T();let J=this.#S().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.#B)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#B=Q}#F(){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.#_??=this.#R.bind(this,"optionhover"),this.#J.addEventListener("optionhover",this.#_)}#V(){if(!this.#J)return;if(this.#$)this.#J.removeEventListener("input",this.#$);if(this.#q)this.#J.removeEventListener("change",this.#q);if(this.#_)this.#J.removeEventListener("optionhover",this.#_)}#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}))}#y(){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"))}#A(J){if(!(J.target instanceof Element))return;if(J.target.closest("fig-menu"))return;if(J.target.closest("fig-select, fig-dropdown")){this.#G=!1;return}if(!this.#j)return;this.#G=this.#y()}#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-select, fig-dropdown")){this.#G=!1;return}if(!this.#J||Y(this.#J,"disabled")){this.#G=!1;return}if(this.#J.focus(),!this.#j)return;if(this.#G||this.#y()){this.#G=!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.#N??""}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(this.value=J,this.#J)this.#J.value=J;I(this,J)}focus(J){this.#J?.focus(J)}}M("propskit-select",A);class i extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#K.bind(this);#_=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){this.#_=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")}#G(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","multiline","resizable","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#M.bind(this,"input"),this.#$??=this.#M.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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}))}#K(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.#_??""}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,J)}focus(J){this.#J?.focus(J)}}M("propskit-text",i);class a extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#K.bind(this);#_=null;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#_=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")}#G(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#M.bind(this,"input"),this.#$??=this.#M.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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}))}#K(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.#_??"0"}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,this.#J?.value??J)}focus(J){this.#J?.focus(J)}}M("propskit-number",a);class t extends HTMLElement{static observedAttributes=["x","y","default","label","units","disabled","size"];#Z=null;#Q=null;#J=null;#j=null;#X=!1;#Y=!1;#B=this.#T.bind(this,"input");#$=this.#T.bind(this,"change");#q=this.#W.bind(this);connectedCallback(){if(!this.#X)this.#j=this.#O(),this.#G(this.#j),this.#X=!0;if(!this.#Z)this.#U();this.#P(),this.#M(),this.#z(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this)}disconnectedCallback(){this.#S(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#X)return;if((J==="x"||J==="y")&&!this.#Y)this.#M();else if(J==="label")this.#P();else if(J==="units")this.#K();else if(J==="disabled")this.#L()}#_(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.#_(J,50),y:Q===null||!Q.trim()?50:this.#_(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.#_(Q.x,this.#j?.x??50),y:this.#_(Q.y,this.#j?.y??50)}}catch{return null}}#G(J){let Q=this.#O(),Z={x:this.#_(J?.x,Q.x),y:this.#_(J?.y,Q.y)};return this.#Y=!0,this.setAttribute("x",String(Z.x)),this.setAttribute("y",String(Z.y)),this.#Y=!1,Z}#N(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}#U(){let J=this.#O(),Q=document.createElement("fig-field");Q.className="propskit-position-row",Q.setAttribute("direction","horizontal");let Z=document.createElement("label"),$=this.#N("x",J.x),j=this.#N("y",J.y);Q.append(Z,$,j),this.#Z=Q,this.#Q=$,this.#J=j,this.replaceChildren(Q),T(this)}#P(){let J=this.#Z?.querySelector(":scope > label");if(!J)return;let Q=this.getAttribute("label");J.textContent=Q?.trim()||"Position"}#M(){let J=this.#O();this.#Q?.setAttribute("value",String(J.x)),this.#J?.setAttribute("value",String(J.y)),this.#K(),this.#L()}#K(){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")}}#L(){let J=Y(this,"disabled");this.#Q?.toggleAttribute("disabled",J),this.#J?.toggleAttribute("disabled",J)}#z(){this.#S(),this.#Q?.addEventListener("input",this.#B),this.#Q?.addEventListener("change",this.#$),this.#J?.addEventListener("input",this.#B),this.#J?.addEventListener("change",this.#$)}#S(){this.#Q?.removeEventListener("input",this.#B),this.#Q?.removeEventListener("change",this.#$),this.#J?.removeEventListener("input",this.#B),this.#J?.removeEventListener("change",this.#$)}#T(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.#_(Q.currentTarget.value,$[Z]);let j=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{...j,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#W(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.#_(J,50)))}get y(){return this.#O().y}set y(J){this.setAttribute("y",String(this.#_(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.#G(J);this.#M(Q)}get defaultValue(){return this.#k(this.getAttribute("default"))||{...this.#j||{x:50,y:50}}}get isDefault(){return m(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,{...J,units:this.units})}focus(J){this.#Q?.focus(J)}}M("propskit-position",t);class n extends HTMLElement{static observedAttributes=["label","collapsible","open","size","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#L.bind(this,"input");#$=this.#L.bind(this,"change");#q=this.#z.bind(this);connectedCallback(){if(!this.#j)this.#G(this.#k()),this.#j=!0;if(!this.#Z)this.#N();this.#U(),this.#P(),this.#M(),this.#K(this.#k()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#G(this.#k());this.#K($)}return}if(J==="size"){this.#P();return}if(J==="disabled"){this.#M();return}this.#U()}#_(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.#_(Q.x,50),y:this.#_(Q.y,50),color:typeof Q.color==="string"&&Q.color.trim()?Q.color.trim():"#D9D9D9"}}#k(){return this.#O(this.getAttribute("value"))}#G(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#N(){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.#U(),this.#P(),this.#M(),Q.append(Z,$),this.replaceChildren(Q)}#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")}#P(){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)}}#M(){x(this,[this.#Q,this.#J])}#K(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}}#L(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.#_(Z.value?.x,$.x),$.y=this.#_(Z.value?.y,$.y);else return;let _=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,units:"percent"},bubbles:!0,cancelable:!0,composed:!0}))}#z(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G(J);this.#K(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-color-point",n);class e extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#W.bind(this,"input");#$=this.#W.bind(this,"change");#q=this.#F.bind(this);connectedCallback(){if(!this.#j)this.#N(this.#G()),this.#j=!0;if(!this.#Z)this.#P();this.#M(),this.#K(),this.#L(),this.#z(),this.#S(this.#G()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#N(this.#G());this.#S($)}return}if(J==="size"){this.#K();return}if(J==="units"){this.#L();return}if(J==="disabled"){this.#z();return}this.#M()}#_(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.#_(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.#_(Q.x,50),y:this.#_(Q.y,50),radius:this.#O(Q.radius)}}#G(){return this.#k(this.getAttribute("value"))}#N(J){let Q=this.#k(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#U(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#P(){let J=this.#G(),Q=this.#U(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.#M(),this.#K(),this.#z(),Z.append($,j),this.replaceChildren(Z)}#M(){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]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#L(){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")}#z(){x(this,[this.#Q,this.#J])}#S(J){let Q=this.#k(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#U(Q.radius);this.#J.value=Z.value}}#T(J,Q){let Z=this.#U(Q).value,$=this.#_(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#W(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.#_(Z.value?.x,$.x),$.y=this.#_(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#T(Z,$.radius);else return;let _=this.#N($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#U(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#F(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G()}}set value(J){let Q=this.#N(J);this.#S(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-radius",e);class JJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=null;#X=!1;#Y=!1;#B=!1;#$=this.#F.bind(this,"input");#q=this.#F.bind(this,"change");#_=this.#V.bind(this);connectedCallback(){if(!this.#X)this.#U(this.#N()),this.#X=!0;if(!this.#Z)this.#M();this.#K(),this.#L(),this.#z(),this.#S(),this.#T(this.#N()),this.removeEventListener("input",this.#$),this.addEventListener("input",this.#$),this.removeEventListener("change",this.#q),this.addEventListener("change",this.#q),this.removeEventListener("openchange",this.#_),this.addEventListener("openchange",this.#_)}disconnectedCallback(){this.removeEventListener("input",this.#$),this.removeEventListener("change",this.#q),this.removeEventListener("openchange",this.#_)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#X)return;if(J==="value"){if(!this.#Y){let $=this.#U(this.#N());this.#T($)}return}if(J==="size"){this.#L();return}if(J==="units"){this.#z();return}if(J==="disabled"){this.#S();return}this.#K()}#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)}#G(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)}}#N(){return this.#G(this.getAttribute("value"))}#U(J){let Q=this.#G(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#Y=!0,this.setAttribute("value",Z),this.#Y=!1,Q}#P(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#M(){let J=this.#N(),Q=this.#P(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.#K(),this.#L(),this.#S(),Z.append($,j,_),this.replaceChildren(Z)}#K(){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,this.#j]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#z(){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")}#S(){x(this,[this.#Q,this.#J,this.#j])}#T(J){let Q=this.#G(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}if(this.#j)this.#j.value=Q.angle}#W(J,Q){let Z=this.#P(Q).value,$=this.#O(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#F(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.#W(Z,$.radius);else if(j==="angle")$.angle=this.#O(Z.value,$.angle);else return;let _=this.#U($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#P(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#V(J){if(J.target!==this.#Z||this.#B)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#B=!0,this.setAttribute("open",String(Q)),this.#B=!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.#N()}}set value(J){let Q=this.#U(J);this.#T(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-radius-angle",JJ);class QJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#S.bind(this,"input");#$=this.#S.bind(this,"change");#q=this.#T.bind(this);connectedCallback(){if(!this.#j)this.#G(this.#k()),this.#j=!0;if(!this.#Z)this.#U();this.#P(),this.#M(),this.#K(),this.#L(),this.#z(this.#k()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#G(this.#k());this.#z($)}return}if(J==="size"){this.#M();return}if(J==="units"){this.#K();return}if(J==="disabled"){this.#L();return}this.#P()}#_(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.#_(Q.x,50),y:this.#_(Q.y,50),x2:this.#_(Q.x2,75),y2:this.#_(Q.y2,75)}}#k(){return this.#O(this.getAttribute("value"))}#G(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#N(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}#U(){let J=this.#k(),Q=document.createElement("fig-group"),Z=this.#N("Start","start",J.x,J.y),$=this.#N("End","end",J.x2,J.y2);Q.setAttribute("compact",""),this.#Z=Q,this.#Q=Z,this.#J=$,this.#P(),this.#M(),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")}#M(){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(){for(let J of[this.#Q,this.#J]){if(!J)continue;if(this.hasAttribute("units"))J.setAttribute("units",this.units);else J.removeAttribute("units")}}#L(){x(this,[this.#Q,this.#J])}#z(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}}#S(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.#_(j?.x,$.x),$.y=this.#_(j?.y,$.y);else if(_==="end")$.x2=this.#_(j?.x,$.x2),$.y2=this.#_(j?.y,$.y2);else return;let X=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{...X,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#T(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G(J);this.#z(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-point",QJ);class h extends HTMLElement{static observedAttributes=["name","open","show-reset","disabled"];static#Z=["propskit-color","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-oscillator"].join(",");#Q=null;#J=null;#j=null;#X=null;#Y=0;#B=()=>this.#_();connectedCallback(){this.#F(),this.#P(),this.#$(),requestAnimationFrame(()=>{this.#L()})}disconnectedCallback(){if(this.#q(),this.#Y)cancelAnimationFrame(this.#Y),this.#Y=0;this.#Q?.removeEventListener("click",this.#k),this.#Q?.removeEventListener("keydown",this.#G),this.#j?.querySelector("fig-button")?.removeEventListener("click",this.#N)}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.#T(),this.#L();return}if(J==="disabled"){this.#P();return}this.#F()}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.#S()}#$(){if(this.removeEventListener("input",this.#B,!0),this.removeEventListener("change",this.#B,!0),this.addEventListener("input",this.#B,!0),this.addEventListener("change",this.#B,!0),!this.#X)this.#X=new MutationObserver(()=>{this.#P(),this.#_()});this.#X.disconnect(),this.#X.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","checked","default","x","y"]})}#q(){this.removeEventListener("input",this.#B,!0),this.removeEventListener("change",this.#B,!0),this.#X?.disconnect()}#_(){if(this.#Y)return;this.#Y=requestAnimationFrame(()=>{this.#Y=0,this.#L()})}#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};#G=(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};#N=(J)=>{if(J.preventDefault(),J.stopPropagation(),Y(this,"disabled"))return;this.#S()};#U(){return[...this.querySelectorAll(h.#Z)].filter((J)=>J.closest("propskit-group")===this&&!J.parentElement?.closest(h.#Z))}#P(){let J=Y(this,"disabled");for(let Q of this.#U())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)}#M(J){return J.isDefault===!1}#K(){for(let J of this.#U())if(this.#M(J))return!0;return!1}#L(){if(this.#K())this.setAttribute("data-dirty","");else this.removeAttribute("data-dirty");this.#T()}#z(J){if(typeof J.resetToDefault==="function")J.resetToDefault()}#S(){for(let J of this.#U())this.#z(J);this.#L(),this.dispatchEvent(new CustomEvent("reset",{bubbles:!0,composed:!0}))}#T(){if(!this.showReset){this.#j?.setAttribute("hidden","");return}this.#W(),this.#j?.removeAttribute("hidden")}#W(){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.#N)}else{let Q=J.querySelector("fig-button");Q?.removeEventListener("click",this.#N),Q?.addEventListener("click",this.#N)}this.#j=J}#F(){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=qJ("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.#T(),this.#Q.setAttribute("role","button"),this.#P(),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.#G),this.#Q.addEventListener("keydown",this.#G),!this.hasAttribute("open"))this.setAttribute("open","false"),this.#Q.setAttribute("aria-expanded","false")}}M("propskit-group",h);class ZJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=0;#$=0;#q=null;#_=null;#O=0;#k=null;#G=null;#N=!1;#U=0;#P=null;#M=0;#K=null;#L=null;#z=0;#S=0;#T=!1;#W=!1;#F=0;#V=null;#R=null;#y=this.#a.bind(this);#A=this.#YJ.bind(this);#H=this.#$J.bind(this);#C=this.#OJ.bind(this);#x=this.#zJ.bind(this);#f=this.#d.bind(this);#o=this.#SJ.bind(this);#b=this.#TJ.bind(this);#D=this.#FJ.bind(this);#I=this.#l.bind(this);#v=new Set(["variant","color","text","full","elastic","size","name","class","data-wave-index","data-active","data-elastic-dragging","style"]);static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#E();if(this.#r(),this.#u(),this.#p(),this.#BJ(),this.removeEventListener("pointerdown",this.#y,{capture:!0}),this.addEventListener("pointerdown",this.#y,{capture:!0,passive:!0}),this.removeEventListener("pointerdown",this.#C,{capture:!0}),this.addEventListener("pointerdown",this.#C,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.addEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#I,!0),this.addEventListener("click",this.#I,!0),this.#_?.removeEventListener("change",this.#D),this.#_?.addEventListener("change",this.#D),!this.#X)this.#X=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J)if($.type==="attributes"){if($.attributeName==="value"){this.#h();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.#r();if(Z)this.#u(),this.#BJ()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){if(this.#X?.disconnect(),this.#B)cancelAnimationFrame(this.#B),this.#B=0;if(this.#$)cancelAnimationFrame(this.#$),this.#$=0;this.#kJ(),this.#t(),clearTimeout(this.#F),this.#F=0,this.#GJ(),this.#n(),this.#qJ(),this.#s(),this.removeEventListener("pointerdown",this.#y,{capture:!0}),this.removeEventListener("pointerdown",this.#C,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#I,!0),this.#_?.removeEventListener("change",this.#D)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#r()}#E(){this.#G=this.getAttribute("value")??this.getAttribute("min")??"0";let J=Array.from(this.childNodes).filter((_)=>{return _.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-slider");j.setAttribute("text","true");for(let _ of this.#XJ()){let X=this.getAttribute(_);j.setAttribute(_,X??"")}Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z),this.#c();for(let _ of J){if(_===Q)continue;this.#J.appendChild(_)}}#c(){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.#D),this.#_=J,this.appendChild(J)}#r(){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")}#u(){if(!this.#J)return;let J=this.#XJ(),Q=new Set(J.filter(($)=>$!=="text"&&$!=="value"));for(let $ of this.#Y)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"||Z==="stepper")this.#J.setAttribute("default",this.getAttribute("default")??"50");else if(!this.hasAttribute("default"))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.#i(Z),this.#Y=Q,this.#h(),this.#UJ()}#i(J){let Q=this.#J?.querySelector("fig-input-number");if(!Q)return;if(J!=="opacity"||!this.hasAttribute("color")){Q.removeAttribute("theme");return}let Z=BJ(this.#J,this.getAttribute("color"));if(Z)Q.setAttribute("theme",Z);else Q.removeAttribute("theme")}#h(){if(!this.#J)return;let J=this.getAttribute("value")??"";if(String(this.#J.value)!==J)this.#J.value=J}#XJ(){let J=new Set(["label","direction","oninput","onchange","steppers"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!this.#v.has(Q))}#UJ(){if(this.#B)cancelAnimationFrame(this.#B);this.#B=requestAnimationFrame(()=>{this.#B=0,this.#_J(),this.#QJ()})}#BJ(){if(this.#$)cancelAnimationFrame(this.#$);this.#$=requestAnimationFrame(()=>{this.#$=0,this.#QJ()})}#QJ(){let J=this.#J?.querySelector('input[type="range"]'),Q=this.#J?.querySelector("fig-input-number input");if(J!==this.#q)this.#LJ(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")}#l(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#W&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#W=!1;return}this.#ZJ()}#ZJ(){requestAnimationFrame(()=>{requestAnimationFrame(()=>{if(this.isConnected&&!Y(this,"disabled"))this.focus()})})}#LJ(J){if(this.#qJ(),this.#q=J,!this.#q)return;this.#q.addEventListener("dblclick",this.#o,{capture:!0})}#qJ(){if(!this.#q)return;this.#q.removeEventListener("dblclick",this.#o,{capture:!0}),this.#q=null}#SJ(J){J.preventDefault(),J.stopImmediatePropagation(),this.#PJ()}#OJ(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.#t(),this.#L=J.pointerId,this.#z=J.clientX,this.#S=J.clientY,this.#T=!1,window.addEventListener("pointermove",this.#x),window.addEventListener("pointerup",this.#f,{once:!0}),window.addEventListener("pointercancel",this.#f,{once:!0}),window.addEventListener("blur",this.#f,{once:!0})}#zJ(J){if(J.pointerId!==this.#L)return;if(J.buttons===0){this.#d(J);return}if(!this.#T){if(Math.hypot(J.clientX-this.#z,J.clientY-this.#S)<4)return;this.#T=!0,this.setAttribute("data-number-scrubbing","")}this.#jJ(this.#NJ(J),"input")}#d(J){if(J?.pointerId!==void 0&&this.#L!==null&&J.pointerId!==this.#L)return;let Q=this.#T;if(this.#t(),Q){this.#jJ(this.#J?.value,"change"),this.#W=!0,clearTimeout(this.#F),this.#F=window.setTimeout(()=>{this.#W=!1,this.#F=0},0),this.#ZJ();return}this.#J?.querySelector("fig-input-number input")?.focus()}#t(){window.removeEventListener("pointermove",this.#x),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f),this.#L=null,this.#T=!1,this.removeAttribute("data-number-scrubbing")}#a(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.#GJ(),this.#n(),this.#q=Q,this.#N=!0,this.#K=J.pointerId,this.#U=this.#WJ();let Z=Q.getBoundingClientRect(),$=this.getBoundingClientRect();this.#P={left:Z.left,right:Z.right,width:Z.width},this.#M=$.width,window.addEventListener("pointermove",this.#A,{passive:!0}),window.addEventListener("pointerup",this.#H,{once:!0}),window.addEventListener("pointercancel",this.#H,{once:!0}),window.addEventListener("blur",this.#H,{once:!0})}#YJ(J){if(!this.#N)return;if(J.pointerId!==this.#K)return;if(J.buttons===0){this.#$J(J);return}this.#w(J.clientX)}#$J(J){if(J?.pointerId!==void 0&&this.#K!==null&&J.pointerId!==this.#K)return;let Q=J?.type==="pointerup"||J?.type==="pointermove"&&J.buttons===0;if(this.#GJ(),this.#n(),Q)this.#ZJ()}#GJ(){window.removeEventListener("pointermove",this.#A),window.removeEventListener("pointerup",this.#H),window.removeEventListener("pointercancel",this.#H),window.removeEventListener("blur",this.#H),this.#N=!1,this.#K=null}#TJ(J){if(Y(this,"disabled"))return;J.preventDefault(),J.stopPropagation(),J.stopImmediatePropagation(),this.#kJ(),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.#_?.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.#PJ()}#kJ(){if(this.#O)clearTimeout(this.#O),this.#O=0;this.#k=null}#WJ(){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}#w(J){let Q=this.#P;if(!Q||!this.#U){this.#n();return}let Z=J<Q.left?J-Q.left:J>Q.right?J-Q.right:0;if(!Z){this.#e();return}let $=Math.max(-this.#U,Math.min(this.#U,Z*0.5)),j=Math.abs($),_=this.#M?(this.#M+j)/this.#M: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")}#n(){this.#e(),this.#U=0,this.#P=null,this.#M=0,this.#K=null}#e(){this.removeAttribute("data-elastic-dragging"),this.style.removeProperty("--propskit-slider-elastic-size"),this.style.removeProperty("--propskit-slider-elastic-scale")}#NJ(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),O=j+(_-j)*$;if(!X)return String(O);let B=Math.round((O-j)/X)*X+j,q=Math.max(0,`${X}`.split(".")[1]?.length||0);return String(Number(B.toFixed(q)))}#MJ(){return this.getAttribute("default")??this.#J?.getAttribute("default")??this.#G??this.#q?.min??"0"}#PJ(){this.#kJ(),this.#jJ(this.#MJ(),"input"),this.#jJ(this.#MJ(),"change")}#jJ(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}))}#_J(){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??"")}#p(){if(!this.#J)return;if(!this.#V)this.#V=this.#g.bind(this,"input");if(!this.#R)this.#R=this.#g.bind(this,"change");this.#J.addEventListener("input",this.#V),this.#J.addEventListener("change",this.#R)}#s(){if(!this.#J)return;if(this.#V)this.#J.removeEventListener("input",this.#V);if(this.#R)this.#J.removeEventListener("change",this.#R)}#g(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;if(J==="change")this.#n();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.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){this.#QJ();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.#MJ()}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){this.#PJ()}}M("propskit-slider",ZJ);class $J extends HTMLElement{static observedAttributes=["type","value","color","name","tooltips","disabled","drag-surface","snapping"];#Z=50;#Q=50;#J=75;#j=75;#X=0;#Y=!1;#B=0;#$=null;#q=null;#_=null;#O=null;#k=null;#G=null;#N=null;#U=null;#P=null;#M=!1;#K=!1;#L=!1;#z=!1;#S=null;#T="";#W="";#F=null;#V=null;#R=null;#y="";#A="";#H=null;#C=null;#x=null;get#f(){return this.getAttribute("type")||"point"}get#o(){return this.#f==="point-radius"||this.#f==="point-radius-angle"}get#b(){return this.#f==="point-radius-angle"}get#D(){return this.#f==="point-point"}get#I(){return this.#f==="point-radius-angle"||this.#f==="point-point"}get#v(){let J=this.getAttribute("tooltips");return J===null||J!=="false"}get#E(){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"}#c(J){let Q=this.#E;if(Q==="true")return!0;if(Q==="modifier")return!!J;return!1}get#r(){let J=this.getAttribute("name");if(J)return J.split(",")[0].trim();return`${Math.round(this.#Z)}%, ${Math.round(this.#Q)}%`}get#u(){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#i(){return this.getAttribute("drag-surface")||"parent"}get#h(){let J=this.#i;if(J==="parent")return this.parentElement;return this.closest(J)}get#XJ(){let J=this.#i;if(J==="parent"){let Q=this.parentElement;if(Q)return Q.setAttribute("data-fig-canvas-control-surface",""),"[data-fig-canvas-control-surface]"}return J}#UJ(J){if(this.#Y)return this.#X/100*J;return this.#X}#BJ(){if(this.#Y)return`Radius ${Math.round(this.#X)}%`;return`Radius ${Math.round(this.#X)}`}connectedCallback(){this.#QJ(),this.#l()}disconnectedCallback(){this.#RJ(),this.#DJ(),this.#qJ(),this.#d(),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.#M&&!this.#K&&!this.#L&&!this.#z)if(this.#QJ(),this.#$)this.#p();else this.#l();if(J==="type")this.#RJ(),this.#QJ(),this.#l();if(J==="color"&&this.#$)if(Z)this.#$.setAttribute("color",Z);else this.#$.removeAttribute("color");if(J==="disabled")this.#RJ(),this.#l();if(J==="tooltips")this.#l();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.#G)this.#G.setAttribute("text",this.#r);if(this.#N)this.#N.setAttribute("text",this.#u)}}#QJ(){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.#Y=!0,this.#X=parseFloat(Z);else this.#Y=!1,this.#X=parseFloat(Z);if(!Number.isFinite(this.#X))this.#X=0}if(typeof Q.angle==="number")this.#B=Q.angle;if(typeof Q.x2==="number")this.#J=Q.x2;if(typeof Q.y2==="number")this.#j=Q.y2;if(this.#f==="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.#f==="color"){let Q=this.getAttribute("color")||this.#$?.getAttribute("color");if(Q)J.color=Q}if(this.#o)J.radius=this.#Y?`${this.#X}%`:this.#X;if(this.#b)J.angle=this.#B;if(this.#D)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)}#l(){this.#RJ(),this.innerHTML="",this.#$=null,this.#q=null,this.#_=null,this.#O=null,this.#k=null,this.#G=null,this.#N=null,this.#U=null,this.#P=null;let J=Y(this,"disabled"),Q=this.#f,Z=this.#v,$=this.#XJ,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.#E),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.#D)j.setAttribute("hit-area","12 circle"),j.setAttribute("hit-area-mode","delegate");if(this.#$=j,this.#o)this.#TJ();if(this.#I)this.#KJ();if(Z){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#r),_.appendChild(j),this.appendChild(_),this.#G=_}else this.appendChild(j);if(this.#b)this.#kJ(J,Z,$);if(this.#D)this.#WJ(J,Z,$);this.#ZJ(this.#$),this.#ZJ(this.#_),this.#ZJ(this.#q),this.#HJ(),this.#YJ(),requestAnimationFrame(()=>this.#p())}#ZJ(J){if(!J)return;J.addEventListener("pointerdown",(Q)=>{if(Q.target?.classList?.contains("fig-handle-hit-area")&&J.querySelector(".fig-handle-hit-area"))this.#zJ(Q,J);else this.#LJ(Q)},{capture:!0})}#LJ(J){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#S===null)this.#T=document.body.style.getPropertyValue("cursor"),this.#W=document.body.style.getPropertyPriority("cursor");if(this.#S=J?.pointerId??-1,document.body.classList.add("fig-lab-move-active"),document.body.style.setProperty("cursor","var(--fig-lab-cursor-move)","important"),!this.#F)this.#F=(Q)=>{if(Q?.pointerId!==void 0&&this.#S!==null&&Q.pointerId!==this.#S)return;if(Q?.type==="blur")this.#qJ();else requestAnimationFrame(()=>this.#qJ())};window.addEventListener("pointerup",this.#F),window.addEventListener("pointercancel",this.#F),window.addEventListener("blur",this.#F)}#qJ(){if(this.#S===null)return;if(document.body.classList.remove("fig-lab-move-active"),this.#T)document.body.style.setProperty("cursor",this.#T,this.#W);else document.body.style.removeProperty("cursor");if(this.#S=null,this.#T="",this.#W="",this.#F)window.removeEventListener("pointerup",this.#F),window.removeEventListener("pointercancel",this.#F),window.removeEventListener("blur",this.#F)}#SJ(J){if(!J)return 0;if(J===this.#_)return this.#B;if(!this.#D)return 0;let Q=this.#PJ();return J===this.#$?Q+180:Q}#OJ(){if(this.#V===null)return;let J=this.#n(this.#SJ(this.#R));document.body.style.setProperty("--fig-lab-cursor-rotate",J),document.body.style.setProperty("cursor",J,"important")}#zJ(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.#y=document.body.style.getPropertyValue("cursor"),this.#A=document.body.style.getPropertyPriority("cursor");if(this.#V=J?.pointerId??-1,this.#R=Q,document.body.classList.add("fig-lab-rotate-active"),this.#OJ(),!this.#H)this.#H=(Z)=>{if(Z?.pointerId!==void 0&&this.#V!==null&&Z.pointerId!==this.#V)return;if(Z?.type==="blur")this.#d();else requestAnimationFrame(()=>this.#d())};window.addEventListener("pointerup",this.#H),window.addEventListener("pointercancel",this.#H),window.addEventListener("blur",this.#H)}#d(){if(this.#V===null)return;if(document.body.classList.remove("fig-lab-rotate-active"),document.body.style.removeProperty("--fig-lab-cursor-rotate"),this.#y)document.body.style.setProperty("cursor",this.#y,this.#A);else document.body.style.removeProperty("cursor");if(this.#V=null,this.#R=null,this.#y="",this.#A="",this.#H)window.removeEventListener("pointerup",this.#H),window.removeEventListener("pointercancel",this.#H),window.removeEventListener("blur",this.#H)}#t(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?.()},O=()=>{_()};J.addEventListener("pointerenter",X),J.addEventListener("pointerleave",O)}#a(){return this.#M||this.#K||this.#L||this.#z}#YJ(){if(this.#$)this.#t(this.#$,()=>this.#G,()=>this.#r,()=>this.#a()||!!this.#$?.querySelector("fig-color-tip"));if(this.#_)this.#t(this.#_,()=>this.#P,()=>`Angle ${Math.round(this.#B)}°`,()=>this.#a());if(this.#q)this.#t(this.#q,()=>this.#N,()=>this.#u,()=>this.#a());if(this.#O){let J=this.#O.querySelector(".fig-canvas-control-radius-hit");this.#GJ(J||this.#O)}if(this.#f==="color"&&this.#$&&this.#G)new MutationObserver(()=>{if(this.#$?.querySelector("fig-color-tip"))this.#G?.removeAttribute("show"),this.#G?.hidePopup?.()}).observe(this.#$,{childList:!0,subtree:!0})}#$J(J,Q){let Z=this.#U;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?.()}#GJ(J){if(!J)return;J.addEventListener("pointerenter",(Q)=>{let Z=this.#U;if(!Z)return;Z.setAttribute("text",this.#BJ()),Z.setAttribute("show","true"),Z.showPopup?.(),this.#$J(Q.clientX,Q.clientY)}),J.addEventListener("pointermove",(Q)=>{if(this.#L)return;this.#$J(Q.clientX,Q.clientY)}),J.addEventListener("pointerleave",()=>{if(this.#L)return;let Q=this.#U;if(!Q)return;Q.removeAttribute("show")})}#TJ(){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.#BJ()),_.appendChild(Q),this.appendChild(_),this.#U=_}else this.appendChild(Q);this.#fJ(Z)}#KJ(){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.#D){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.#FJ(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)}#FJ(J){J.addEventListener("pointerdown",(Q)=>{if(Y(this,"disabled"))return;Q.preventDefault(),Q.stopPropagation();let Z=this.#h;if(!Z)return;let{clientX:$,clientY:j}=Q,_=this.#Z,X=this.#Q,O=this.#J,B=this.#j;this.#M=!0,this.#K=!0,document.body.classList.add("fig-lab-move-active"),J.style.pointerEvents="none";let q=(k)=>{let N=Z.getBoundingClientRect(),K=N.width>0?(k.clientX-$)/N.width*100:0,P=N.height>0?(k.clientY-j)/N.height*100:0,L=-Math.min(_,O),z=100-Math.max(_,O),F=-Math.min(X,B),W=100-Math.max(X,B),S=Math.max(L,Math.min(z,K)),R=Math.max(F,Math.min(W,P));this.#Z=_+S,this.#Q=X+R,this.#J=O+S,this.#j=B+R,this.#p(),this.#s()},G=this.#CJ((k)=>{if(document.body.classList.remove("fig-lab-move-active"),J.style.pointerEvents="stroke",this.#M=!1,this.#K=!1,k)this.#JJ(),this.#g()});window.addEventListener("pointermove",q,{signal:G.signal}),window.addEventListener("pointerup",()=>G.finish(!0),{signal:G.signal}),window.addEventListener("pointercancel",()=>G.finish(!1),{signal:G.signal})})}#kJ(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.#_=$,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.#B)}°`),j.appendChild($),this.appendChild(j),this.#P=j}else this.appendChild($)}#WJ(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.#E),$.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.#u),j.appendChild($),this.appendChild(j),this.#N=j}else this.appendChild($)}#w(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`}#n(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`}#e(J,Q){if(!J)return;J.style.setProperty("cursor",Q,"important")}#NJ(J,Q){if(!J)return;let Z=J.querySelector(".fig-handle-hit-area");if(!Z)return;if(Z.setAttribute("data-cursor","rotate"),this.#e(Z,this.#n(Q)),this.#R===J)this.#OJ()}#MJ(){if(!this.#_||!this.#b)return;this.#NJ(this.#_,this.#B)}#PJ(){return Math.atan2(this.#j-this.#Q,this.#J-this.#Z)*180/Math.PI}#jJ(){if(!this.#D)return;let J=this.#PJ();this.#$?.style.removeProperty("cursor"),this.#q?.style.removeProperty("cursor"),this.#NJ(this.#$,J+180),this.#NJ(this.#q,J)}#_J(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`}#p(){let J=this.#h;if(!J||!this.#$)return;let Q=J.getBoundingClientRect();if(this.#_J(this.#$,this.#Z,this.#Q,Q),this.#O){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#UJ(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 O=_.querySelectorAll("circle");for(let B of O)B.setAttribute("cx",String(j)),B.setAttribute("cy",String(j)),B.setAttribute("r",String(Math.max(j-1,0)))}if(this.#k&&this.#I){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j,_;if(this.#D)j=this.#J/100*Q.width,_=this.#j/100*Q.height;else{let B=this.#UJ(Q.width),q=this.#B*Math.PI/180;j=Z+B*Math.cos(q),_=$+B*Math.sin(q)}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 O=X.querySelectorAll(".fig-canvas-control-angle-line, .fig-canvas-control-angle-line-halo, .fig-canvas-control-angle-line-hit");for(let B of O)B.setAttribute("x1",String(Z)),B.setAttribute("y1",String($)),B.setAttribute("x2",String(j)),B.setAttribute("y2",String(_))}if(this.#_&&this.#b){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#UJ(Q.width),_=this.#B*Math.PI/180,X=Z+j*Math.cos(_),O=$+j*Math.sin(_),B=Q.width>0?X/Q.width*100:0,q=Q.height>0?O/Q.height*100:0;this.#_J(this.#_,B,q,Q)}if(this.#q&&this.#D)this.#_J(this.#q,this.#J,this.#j,Q);this.#MJ(),this.#jJ()}#s(J=this.value){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:J}))}#g(J=this.value){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:J}))}#VJ(J){return{...this.value,...XJ(J.color,J.alpha,J.opacity)}}#JJ(){this.setAttribute("value",JSON.stringify(this.value))}#HJ(){if(!this.#$)return;if(this.#$.addEventListener("input",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#$.getAttribute("color")||J.detail.color),this.#s(this.#VJ(J.detail));return}this.#M=!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.#G)this.#G.removeAttribute("show"),this.#G.hidePopup?.();this.#p(),this.#s()}),this.#$.addEventListener("change",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#$.getAttribute("color")||J.detail.color),this.#g(this.#VJ(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.#G)this.#G.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#M=!1})}),this.#_)this.#_.addEventListener("input",(J)=>{J.stopPropagation();let Q=this.#h;if(!Q)return;this.#z=!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,O=this.#_.offsetWidth/2,B=this.#_.offsetHeight/2,q=_+O-$,G=X+B-j,k=Math.atan2(G,q)*180/Math.PI;if(this.#c(J.detail?.shiftKey))k=Math.round(k/15)*15;this.#B=k;let N=Math.sqrt(q*q+G*G);if(this.#c(J.detail?.shiftKey)){let K=this.#Y?5:10;if(this.#Y){let P=N/Z.width*100;P=Math.round(P/K)*K,N=P/100*Z.width}else N=Math.round(N/K)*K}if(this.#Y)this.#X=Math.max(0,N/Z.width*100);else this.#X=Math.max(0,N);if(this.#P)this.#P.setAttribute("text",`Angle ${Math.round(this.#B)}°`),this.#P.setAttribute("show","true"),this.#P.showPopup?.();this.#p(),this.#s()}),this.#_.addEventListener("change",(J)=>{if(J.stopPropagation(),this.classList.remove("fig-canvas-control-ring-active"),this.#P)this.#P.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#z=!1})}),this.#_.addEventListener("hitareadown",(J)=>{J.stopPropagation();let Q=J.detail?.originalEvent;if(!Q)return;Q.preventDefault();let Z=this.#h;if(!Z)return;if(this.#z=!0,this.classList.add("fig-canvas-control-ring-active"),this.#_.setAttribute("selected",""),this.#P)this.#P.setAttribute("show","true"),this.#P.showPopup?.();let $=(_)=>{let X=Z.getBoundingClientRect(),O=this.#Z/100*X.width,B=this.#Q/100*X.height,q=_.clientX-X.left-O,G=_.clientY-X.top-B,k=Math.atan2(G,q)*180/Math.PI;if(this.#c(_.shiftKey))k=Math.round(k/15)*15;if(this.#B=k,this.#P)this.#P.setAttribute("text",`Angle ${Math.round(k)}°`);this.#p(),this.#s()},j=this.#CJ((_)=>{if(this.#z=!1,this.classList.remove("fig-canvas-control-ring-active"),this.#_.removeAttribute("selected"),this.#P)this.#P.removeAttribute("show");if(_)this.#JJ(),this.#g()});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.#K=!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.#N)this.#N.removeAttribute("show"),this.#N.hidePopup?.();this.#p(),this.#s()}),this.#q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#N)this.#N.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#K=!1})}),this.#m(this.#$,!0),this.#m(this.#q,!1)}#m(J,Q){if(!J)return;J.addEventListener("hitareadown",(Z)=>{Z.stopPropagation();let $=Z.detail?.originalEvent;if(!$)return;$.preventDefault();let j=this.#h;if(!j)return;this.#M=!0;let _=j.getBoundingClientRect(),X=Q?this.#J:this.#Z,O=Q?this.#j:this.#Q,B=Q?this.#Z:this.#J,q=Q?this.#Q:this.#j,G=X/100*_.width,k=O/100*_.height,N=B/100*_.width,K=q/100*_.height,P=Math.sqrt((N-G)**2+(K-k)**2),L=Q?this.#G:this.#N;if(L)L.removeAttribute("show"),L.hidePopup?.();let z=(W)=>{let S=j.getBoundingClientRect(),R=X/100*S.width,D=O/100*S.height,V=W.clientX-S.left-R,E=W.clientY-S.top-D,H=Math.atan2(E,V);if(this.#c(W.shiftKey))H=Math.round(H*180/Math.PI/15)*15*Math.PI/180;let jJ=R+P*Math.cos(H),_J=D+P*Math.sin(H),p=Math.max(0,Math.min(100,jJ/S.width*100)),g=Math.max(0,Math.min(100,_J/S.height*100));if(Q)this.#Z=p,this.#Q=g;else this.#J=p,this.#j=g;this.#p(),this.#s()},F=this.#CJ((W)=>{if(this.#M=!1,L)L.removeAttribute("show");if(W)this.#JJ(),this.#g()});window.addEventListener("pointermove",z,{signal:F.signal}),window.addEventListener("pointerup",()=>F.finish(!0),{signal:F.signal}),window.addEventListener("pointercancel",()=>F.finish(!1),{signal:F.signal})})}#fJ(J){if(!J)return;J.addEventListener("pointermove",(Z)=>{if(this.#L)return;let $=this.#h;if(!$)return;let j=$.getBoundingClientRect(),_=this.#Z/100*j.width,X=this.#Q/100*j.height,O=Math.atan2(Z.clientY-j.top-X,Z.clientX-j.left-_)*180/Math.PI;this.#e(J,this.#w(O))});let Q=(Z)=>{if(Y(this,"disabled"))return;Z.preventDefault(),Z.stopPropagation(),this.#L=!0,this.classList.add("fig-canvas-control-ring-active");let $=this.#h;if(!$)return;if(this.#U)this.#U.setAttribute("show","true"),this.#U.showPopup?.(),this.#$J(Z.clientX,Z.clientY);if(this.#P)this.#P.removeAttribute("show"),this.#P.hidePopup?.();let j=this.#_?.style.pointerEvents,_=this.#_?.querySelector(".fig-handle-hit-area"),X=_?.style.pointerEvents;if(this.#_)this.#_.style.pointerEvents="none";if(_)_.style.pointerEvents="none";let O=document.body.style.cursor;J.style.pointerEvents="none";let B=$.getBoundingClientRect(),q=this.#Z/100*B.width,G=this.#Q/100*B.height,k=Math.atan2(Z.clientY-B.top-G,Z.clientX-B.left-q)*180/Math.PI,N=Math.round(k);document.body.style.cursor=this.#w(N);let K=(L)=>{let z=$.getBoundingClientRect(),F=this.#Z/100*z.width,W=this.#Q/100*z.height,S=L.clientX-z.left-F,R=L.clientY-z.top-W,D=Math.round(Math.atan2(R,S)*180/Math.PI);if(D!==N)N=D,document.body.style.cursor=this.#w(D);let V=Math.sqrt(S*S+R*R);if(this.#c(L.shiftKey)){let E=this.#Y?5:10;if(this.#Y){let H=V/z.width*100;H=Math.round(H/E)*E,V=H/100*z.width}else V=Math.round(V/E)*E}if(this.#Y)this.#X=Math.max(0,V/z.width*100);else this.#X=Math.max(0,V);if(this.#U)this.#U.setAttribute("text",this.#BJ()),this.#$J(L.clientX,L.clientY);this.#p(),this.#s()},P=this.#CJ((L)=>{if(this.#L=!1,this.classList.remove("fig-canvas-control-ring-active"),J.style.pointerEvents="",this.#_)this.#_.style.pointerEvents=j??"";if(_)_.style.pointerEvents=X??"";if(document.body.style.cursor=O,this.#U)this.#U.removeAttribute("show");if(L)this.#JJ(),this.#g()});window.addEventListener("pointermove",K,{signal:P.signal}),window.addEventListener("pointerup",()=>P.finish(!0),{signal:P.signal}),window.addEventListener("pointercancel",()=>P.finish(!1),{signal:P.signal})};J.addEventListener("pointerdown",Q),this._radiusDragCleanup=()=>J.removeEventListener("pointerdown",Q)}#DJ(){if(this._radiusDragCleanup)this._radiusDragCleanup(),this._radiusDragCleanup=null}#CJ(J){this.#RJ();let Q=new AbortController,Z=!1,$=(j=!1)=>{if(Z)return;if(Z=!0,Q.abort(),this.#C===Q)this.#C=null,this.#x=null;J(j)};return this.#C=Q,this.#x=$,{signal:Q.signal,finish:$}}#RJ(){this.#x?.(!1),this.#C?.abort(),this.#C=null,this.#x=null}}M("fig-canvas-control",$J);class U extends HTMLElement{#Z=[U.#R()];#Q=0;#J=2;#j=240;#X=120;#Y={min:-1,max:1};#B=null;#$=null;#q=null;#_=null;#O=0;#k=null;#G=null;#N=null;#U=null;#P=[];#M=[];#K=[];#L=[];#z=new Set;#S=null;#T=null;#W=null;#F=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:[U.#R()]});this.#J=this.#y("precision",2),this.#f(this.getAttribute("value")),this.#x(),this.#h(),this.#SJ(),T(this)}disconnectedCallback(){if(this.#_J(),this.#GJ(),this.#S)this.#S.disconnect(),this.#S=null;f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"){if(this.#f(Z),this.isConnected)this.#h();return}if(J==="precision"){if(this.#J=this.#y("precision",2),this.isConnected)this.#g();return}if(J==="aspect-ratio"){if(this.#x(),this.#$)this.#YJ();return}if(J==="edit"||J==="disabled"){if(this.isConnected)this.#h()}}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.#o(this.defaultValue);if(!J)return!1;return JSON.stringify(this.data.waves)===JSON.stringify(J.map((Q)=>this.#D(Q)))}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J,this.#m("input"),this.#m("change")}get data(){return{waves:this.#Z.map((J)=>this.#D(J))}}get preset(){let J=this.#I;return U.TYPES.find((Q)=>Q.value===J.type)?.name}#y(J,Q){let Z=Number.parseInt(this.getAttribute(J)||"",10);return Number.isFinite(Z)?Math.max(0,Math.min(100,Z)):Q}#A(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}#H(){return this.getAttribute("edit")!=="false"}#C(){return this.#A("disabled",!1)}#x(){let J=this.getAttribute("aspect-ratio")||"2 / 1";this.style.setProperty("--aspect-ratio",J)}#f(J){let Q=this.#o(J);if(!Q)return!1;if(this.#Z=Q,!this.#Z.length)this.#Z=[U.#R()];return this.#Q=Math.min(this.#Q,this.#Z.length-1),!0}#o(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.#E(J.frequency,1,0.1,16),amplitude:this.#E(J.amplitude,1,-4,4),phase:this.#E(J.phase,0,-360,360),offset:this.#E(J.offset,0,-4,4)}}#D(J){return{type:J.type,frequency:this.#c(J.frequency),amplitude:this.#c(J.amplitude),phase:this.#c(J.phase),offset:this.#c(J.offset)}}get#I(){if(!this.#Z[this.#Q])this.#Q=0;return this.#Z[this.#Q]||U.#R()}#v(J){let Q=String(J||"").toLowerCase();return U.TYPES.some((Z)=>Z.value===Q)?Q:"sine"}#E(J,Q,Z,$){let j=Number.parseFloat(J);if(!Number.isFinite(j))return Q;return Math.min($,Math.max(Z,j))}#c(J){let Q=10**this.#J;return Math.round(J*Q)/Q}static#r(J){return String(J).replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}static#u(J){return U.TYPES.find((Q)=>Q.value===J)?.name||"Wave"}static waveIcon(J,Q=24){let j=Q-10,_="";for(let X=0;X<=32;X++){let O=X/32,B=U.#i(J,O),q=5+O*j,G=5+(1-(B+1)/2)*j;_+=`${X===0?"M":"L"}${q.toFixed(1)},${G.toFixed(1)}`}return`<svg width="${Q}" height="${Q}" viewBox="0 0 ${Q} ${Q}" fill="none"><path d="${_}" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg>`}static#i(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(_)}}#h(){if(this.#_J(),this.#GJ(),this.innerHTML=this.#XJ(),this.#ZJ(),this.#OJ(),this.#YJ(),this.#WJ(),!this.#C())this.#$J();T(this)}#XJ(){let J=this.#H()&&!this.#C(),Q=J?"":" disabled";return`<div class="propskit-oscillator-svg-container">
+`:",";return Q.split(Z).map(($)=>$.trim()).filter(Boolean)}static#M(J){if(J&&typeof J==="object")return String(J.value??J.label??"");return String(J??"")}static#K(J){if(J&&typeof J==="object")return String(J.label??J.value??"");return String(J??"")}connectedCallback(){if(!this.#Z)this.#L();if(this.#z(),this.#W(),this.#F(),this.removeEventListener("click",this.#O),this.addEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),this.addEventListener("pointerdown",this.#k,!0),T(this),!this.#Y)this.#Y=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.#z();if(Z)this.#W()});this.#Y.observe(this,{attributes:!0})}disconnectedCallback(){this.#Y?.disconnect(),this.#V(),this.removeEventListener("click",this.#O),this.removeEventListener("pointerdown",this.#k,!0),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label"){this.#z();return}if(J==="options"||J==="value")this.#W()}#L(){this.#N=this.getAttribute("value")??"";let J=this.querySelector(":scope > label"),Q=document.createElement("fig-field"),Z=J||document.createElement("label");this.#j=A.#U();let $=document.createElement(this.#j?"fig-select":"fig-dropdown");$.setAttribute("full",""),Q.append(Z,$),this.#Z=Q,this.#Q=Z,this.#J=$,this.#X=Boolean(J),this.replaceChildren(Q)}#z(){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.#X)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","")}#S(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","full","default"]);if(!this.#j)J.add("options");return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#T(){if(!this.#J||this.#j)return;let J=A.#P(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=A.#M(Z),$.textContent=A.#K(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)}}#W(){if(!this.#J)return;if(!this.#j)this.#T();let J=this.#S().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.#B)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#B=Q}#F(){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.#_??=this.#R.bind(this,"optionhover"),this.#J.addEventListener("optionhover",this.#_)}#V(){if(!this.#J)return;if(this.#$)this.#J.removeEventListener("input",this.#$);if(this.#q)this.#J.removeEventListener("change",this.#q);if(this.#_)this.#J.removeEventListener("optionhover",this.#_)}#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}))}#y(){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"))}#A(J){if(!(J.target instanceof Element))return;if(J.target.closest("fig-menu"))return;if(J.target.closest("fig-select, fig-dropdown")){this.#G=!1;return}if(!this.#j)return;this.#G=this.#y()}#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-select, fig-dropdown")){this.#G=!1;return}if(!this.#J||Y(this.#J,"disabled")){this.#G=!1;return}if(this.#J.focus(),!this.#j)return;if(this.#G||this.#y()){this.#G=!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.#N??""}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;if(this.value=J,this.#J)this.#J.value=J;I(this,J)}focus(J){this.#J?.focus(J)}}M("propskit-select",A);class i extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#K.bind(this);#_=null;static get observedAttributes(){return["label","direction","aria-label"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction"||J==="aria-label")this.#k()}#O(){this.#_=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")}#G(){let J=new Set(["label","direction","oninput","onchange","class","style","id","size","aria-label","multiline","resizable","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#M.bind(this,"input"),this.#$??=this.#M.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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}))}#K(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.#_??""}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,J)}focus(J){this.#J?.focus(J)}}M("propskit-text",i);class a extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=null;#$=null;#q=this.#K.bind(this);#_=null;static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#O();if(this.#k(),this.#N(),this.#U(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this),!this.#X)this.#X=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.#N()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){this.#X?.disconnect(),this.#P(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#k()}#O(){this.#_=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")}#G(){let J=new Set(["label","direction","size","oninput","onchange","class","style","id","default"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!Q.startsWith("data-"))}#N(){if(!this.#J)return;let J=this.#G(),Q=new Set(J);for(let Z of this.#Y)if(!Q.has(Z))this.#J.removeAttribute(Z);for(let Z of J)this.#J.setAttribute(Z,this.getAttribute(Z)??"");this.#Y=Q}#U(){if(!this.#J)return;this.#B??=this.#M.bind(this,"input"),this.#$??=this.#M.bind(this,"change"),this.#J.addEventListener("input",this.#B),this.#J.addEventListener("change",this.#$)}#P(){if(!this.#J)return;if(this.#B)this.#J.removeEventListener("input",this.#B);if(this.#$)this.#J.removeEventListener("change",this.#$)}#M(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}))}#K(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.#_??"0"}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,this.#J?.value??J)}focus(J){this.#J?.focus(J)}}M("propskit-number",a);class t extends HTMLElement{static observedAttributes=["x","y","default","label","units","disabled","size"];#Z=null;#Q=null;#J=null;#j=null;#X=!1;#Y=!1;#B=this.#T.bind(this,"input");#$=this.#T.bind(this,"change");#q=this.#W.bind(this);connectedCallback(){if(!this.#X)this.#j=this.#O(),this.#G(this.#j),this.#X=!0;if(!this.#Z)this.#U();this.#P(),this.#M(),this.#z(),this.removeEventListener("click",this.#q),this.addEventListener("click",this.#q),T(this)}disconnectedCallback(){this.#S(),this.removeEventListener("click",this.#q),f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#X)return;if((J==="x"||J==="y")&&!this.#Y)this.#M();else if(J==="label")this.#P();else if(J==="units")this.#K();else if(J==="disabled")this.#L()}#_(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.#_(J,50),y:Q===null||!Q.trim()?50:this.#_(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.#_(Q.x,this.#j?.x??50),y:this.#_(Q.y,this.#j?.y??50)}}catch{return null}}#G(J){let Q=this.#O(),Z={x:this.#_(J?.x,Q.x),y:this.#_(J?.y,Q.y)};return this.#Y=!0,this.setAttribute("x",String(Z.x)),this.setAttribute("y",String(Z.y)),this.#Y=!1,Z}#N(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}#U(){let J=this.#O(),Q=document.createElement("fig-field");Q.className="propskit-position-row",Q.setAttribute("direction","horizontal");let Z=document.createElement("label"),$=this.#N("x",J.x),j=this.#N("y",J.y);Q.append(Z,$,j),this.#Z=Q,this.#Q=$,this.#J=j,this.replaceChildren(Q),T(this)}#P(){let J=this.#Z?.querySelector(":scope > label");if(!J)return;let Q=this.getAttribute("label");J.textContent=Q?.trim()||"Position"}#M(){let J=this.#O();this.#Q?.setAttribute("value",String(J.x)),this.#J?.setAttribute("value",String(J.y)),this.#K(),this.#L()}#K(){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")}}#L(){let J=Y(this,"disabled");this.#Q?.toggleAttribute("disabled",J),this.#J?.toggleAttribute("disabled",J)}#z(){this.#S(),this.#Q?.addEventListener("input",this.#B),this.#Q?.addEventListener("change",this.#$),this.#J?.addEventListener("input",this.#B),this.#J?.addEventListener("change",this.#$)}#S(){this.#Q?.removeEventListener("input",this.#B),this.#Q?.removeEventListener("change",this.#$),this.#J?.removeEventListener("input",this.#B),this.#J?.removeEventListener("change",this.#$)}#T(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.#_(Q.currentTarget.value,$[Z]);let j=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{...j,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#W(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.#_(J,50)))}get y(){return this.#O().y}set y(J){this.setAttribute("y",String(this.#_(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.#G(J);this.#M(Q)}get defaultValue(){return this.#k(this.getAttribute("default"))||{...this.#j||{x:50,y:50}}}get isDefault(){return m(this.value,this.defaultValue)}resetToDefault(){let J=this.defaultValue;this.value=J,I(this,{...J,units:this.units})}focus(J){this.#Q?.focus(J)}}M("propskit-position",t);class n extends HTMLElement{static observedAttributes=["label","collapsible","open","size","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#L.bind(this,"input");#$=this.#L.bind(this,"change");#q=this.#z.bind(this);connectedCallback(){if(!this.#j)this.#G(this.#k()),this.#j=!0;if(!this.#Z)this.#N();this.#U(),this.#P(),this.#M(),this.#K(this.#k()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#G(this.#k());this.#K($)}return}if(J==="size"){this.#P();return}if(J==="disabled"){this.#M();return}this.#U()}#_(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.#_(Q.x,50),y:this.#_(Q.y,50),color:typeof Q.color==="string"&&Q.color.trim()?Q.color.trim():"#D9D9D9"}}#k(){return this.#O(this.getAttribute("value"))}#G(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#N(){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.#U(),this.#P(),this.#M(),Q.append(Z,$),this.replaceChildren(Q)}#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")}#P(){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)}}#M(){x(this,[this.#Q,this.#J])}#K(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}}#L(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.#_(Z.value?.x,$.x),$.y=this.#_(Z.value?.y,$.y);else return;let _=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,units:"percent"},bubbles:!0,cancelable:!0,composed:!0}))}#z(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G(J);this.#K(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-color-point",n);class e extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#W.bind(this,"input");#$=this.#W.bind(this,"change");#q=this.#F.bind(this);connectedCallback(){if(!this.#j)this.#N(this.#G()),this.#j=!0;if(!this.#Z)this.#P();this.#M(),this.#K(),this.#L(),this.#z(),this.#S(this.#G()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#N(this.#G());this.#S($)}return}if(J==="size"){this.#K();return}if(J==="units"){this.#L();return}if(J==="disabled"){this.#z();return}this.#M()}#_(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.#_(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.#_(Q.x,50),y:this.#_(Q.y,50),radius:this.#O(Q.radius)}}#G(){return this.#k(this.getAttribute("value"))}#N(J){let Q=this.#k(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#U(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#P(){let J=this.#G(),Q=this.#U(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.#M(),this.#K(),this.#z(),Z.append($,j),this.replaceChildren(Z)}#M(){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]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#L(){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")}#z(){x(this,[this.#Q,this.#J])}#S(J){let Q=this.#k(J);if(this.#Q)this.#Q.value={x:Q.x,y:Q.y};if(this.#J){let Z=this.#U(Q.radius);this.#J.value=Z.value}}#T(J,Q){let Z=this.#U(Q).value,$=this.#_(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#W(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.#_(Z.value?.x,$.x),$.y=this.#_(Z.value?.y,$.y);else if(j==="radius")$.radius=this.#T(Z,$.radius);else return;let _=this.#N($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#U(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#F(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G()}}set value(J){let Q=this.#N(J);this.#S(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-radius",e);class JJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=null;#X=!1;#Y=!1;#B=!1;#$=this.#F.bind(this,"input");#q=this.#F.bind(this,"change");#_=this.#V.bind(this);connectedCallback(){if(!this.#X)this.#U(this.#N()),this.#X=!0;if(!this.#Z)this.#M();this.#K(),this.#L(),this.#z(),this.#S(),this.#T(this.#N()),this.removeEventListener("input",this.#$),this.addEventListener("input",this.#$),this.removeEventListener("change",this.#q),this.addEventListener("change",this.#q),this.removeEventListener("openchange",this.#_),this.addEventListener("openchange",this.#_)}disconnectedCallback(){this.removeEventListener("input",this.#$),this.removeEventListener("change",this.#q),this.removeEventListener("openchange",this.#_)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#X)return;if(J==="value"){if(!this.#Y){let $=this.#U(this.#N());this.#T($)}return}if(J==="size"){this.#L();return}if(J==="units"){this.#z();return}if(J==="disabled"){this.#S();return}this.#K()}#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)}#G(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)}}#N(){return this.#G(this.getAttribute("value"))}#U(J){let Q=this.#G(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#Y=!0,this.setAttribute("value",Z),this.#Y=!1,Q}#P(J){let Q=typeof J==="string"&&J.trim().endsWith("%");return{value:Q?Number.parseFloat(J):J,units:Q?"%":"px"}}#M(){let J=this.#N(),Q=this.#P(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.#K(),this.#L(),this.#S(),Z.append($,j,_),this.replaceChildren(Z)}#K(){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,this.#j]){if(!Q)continue;if(J===null)Q.removeAttribute("size");else Q.setAttribute("size",J)}}#z(){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")}#S(){x(this,[this.#Q,this.#J,this.#j])}#T(J){let Q=this.#G(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}if(this.#j)this.#j.value=Q.angle}#W(J,Q){let Z=this.#P(Q).value,$=this.#O(J.value,Z);return(J.querySelector("fig-input-number")?.getAttribute("units")||J.getAttribute("units"))==="%"?`${$}%`:$}#F(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.#W(Z,$.radius);else if(j==="angle")$.angle=this.#O(Z.value,$.angle);else return;let _=this.#U($);this.dispatchEvent(new CustomEvent(J,{detail:{..._,radius:this.#P(_.radius).value,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#V(J){if(J.target!==this.#Z||this.#B)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#B=!0,this.setAttribute("open",String(Q)),this.#B=!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.#N()}}set value(J){let Q=this.#U(J);this.#T(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-radius-angle",JJ);class QJ extends HTMLElement{static observedAttributes=["label","collapsible","open","size","units","disabled","value"];#Z=null;#Q=null;#J=null;#j=!1;#X=!1;#Y=!1;#B=this.#S.bind(this,"input");#$=this.#S.bind(this,"change");#q=this.#T.bind(this);connectedCallback(){if(!this.#j)this.#G(this.#k()),this.#j=!0;if(!this.#Z)this.#U();this.#P(),this.#M(),this.#K(),this.#L(),this.#z(this.#k()),this.removeEventListener("input",this.#B),this.addEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.addEventListener("change",this.#$),this.removeEventListener("openchange",this.#q),this.addEventListener("openchange",this.#q)}disconnectedCallback(){this.removeEventListener("input",this.#B),this.removeEventListener("change",this.#$),this.removeEventListener("openchange",this.#q)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#j)return;if(J==="value"){if(!this.#X){let $=this.#G(this.#k());this.#z($)}return}if(J==="size"){this.#M();return}if(J==="units"){this.#K();return}if(J==="disabled"){this.#L();return}this.#P()}#_(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.#_(Q.x,50),y:this.#_(Q.y,50),x2:this.#_(Q.x2,75),y2:this.#_(Q.y2,75)}}#k(){return this.#O(this.getAttribute("value"))}#G(J){let Q=this.#O(J),Z=JSON.stringify(Q);if(this.getAttribute("value")===Z)return Q;return this.#X=!0,this.setAttribute("value",Z),this.#X=!1,Q}#N(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}#U(){let J=this.#k(),Q=document.createElement("fig-group"),Z=this.#N("Start","start",J.x,J.y),$=this.#N("End","end",J.x2,J.y2);Q.setAttribute("compact",""),this.#Z=Q,this.#Q=Z,this.#J=$,this.#P(),this.#M(),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")}#M(){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(){for(let J of[this.#Q,this.#J]){if(!J)continue;if(this.hasAttribute("units"))J.setAttribute("units",this.units);else J.removeAttribute("units")}}#L(){x(this,[this.#Q,this.#J])}#z(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}}#S(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.#_(j?.x,$.x),$.y=this.#_(j?.y,$.y);else if(_==="end")$.x2=this.#_(j?.x,$.x2),$.y2=this.#_(j?.y,$.y2);else return;let X=this.#G($);this.dispatchEvent(new CustomEvent(J,{detail:{...X,units:this.units},bubbles:!0,cancelable:!0,composed:!0}))}#T(J){if(J.target!==this.#Z||this.#Y)return;J.stopImmediatePropagation();let Q=Boolean(J.detail?.open);this.#Y=!0,this.setAttribute("open",String(Q)),this.#Y=!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.#G(J);this.#z(Q)}focus(J){this.#Q?.focus(J)}}M("propskit-point-point",QJ);class h extends HTMLElement{static observedAttributes=["name","open","show-reset","disabled"];static#Z=["propskit-color","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-oscillator"].join(",");#Q=null;#J=null;#j=null;#X=null;#Y=0;#B=()=>this.#_();connectedCallback(){this.#F(),this.#P(),this.#$(),requestAnimationFrame(()=>{this.#L()})}disconnectedCallback(){if(this.#q(),this.#Y)cancelAnimationFrame(this.#Y),this.#Y=0;this.#Q?.removeEventListener("click",this.#k),this.#Q?.removeEventListener("keydown",this.#G),this.#j?.querySelector("fig-button")?.removeEventListener("click",this.#N)}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.#T(),this.#L();return}if(J==="disabled"){this.#P();return}this.#F()}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.#S()}#$(){if(this.removeEventListener("input",this.#B,!0),this.removeEventListener("change",this.#B,!0),this.addEventListener("input",this.#B,!0),this.addEventListener("change",this.#B,!0),!this.#X)this.#X=new MutationObserver(()=>{this.#P(),this.#_()});this.#X.disconnect(),this.#X.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","checked","default","x","y"]})}#q(){this.removeEventListener("input",this.#B,!0),this.removeEventListener("change",this.#B,!0),this.#X?.disconnect()}#_(){if(this.#Y)return;this.#Y=requestAnimationFrame(()=>{this.#Y=0,this.#L()})}#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};#G=(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};#N=(J)=>{if(J.preventDefault(),J.stopPropagation(),Y(this,"disabled"))return;this.#S()};#U(){return[...this.querySelectorAll(h.#Z)].filter((J)=>J.closest("propskit-group")===this&&!J.parentElement?.closest(h.#Z))}#P(){let J=Y(this,"disabled");for(let Q of this.#U())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)}#M(J){return J.isDefault===!1}#K(){for(let J of this.#U())if(this.#M(J))return!0;return!1}#L(){if(this.#K())this.setAttribute("data-dirty","");else this.removeAttribute("data-dirty");this.#T()}#z(J){if(typeof J.resetToDefault==="function")J.resetToDefault()}#S(){for(let J of this.#U())this.#z(J);this.#L(),this.dispatchEvent(new CustomEvent("reset",{bubbles:!0,composed:!0}))}#T(){if(!this.showReset){this.#j?.setAttribute("hidden","");return}this.#W(),this.#j?.removeAttribute("hidden")}#W(){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.#N)}else{let Q=J.querySelector("fig-button");Q?.removeEventListener("click",this.#N),Q?.addEventListener("click",this.#N)}this.#j=J}#F(){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=qJ("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.#T(),this.#Q.setAttribute("role","button"),this.#P(),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.#G),this.#Q.addEventListener("keydown",this.#G),!this.hasAttribute("open"))this.setAttribute("open","false"),this.#Q.setAttribute("aria-expanded","false")}}M("propskit-group",h);class ZJ extends HTMLElement{#Z=null;#Q=null;#J=null;#j=!1;#X=null;#Y=new Set;#B=0;#$=0;#q=null;#_=null;#O=0;#k=null;#G=null;#N=!1;#U=0;#P=null;#M=0;#K=null;#L=null;#z=0;#S=0;#T=!1;#W=!1;#F=0;#V=null;#R=null;#y=this.#a.bind(this);#A=this.#YJ.bind(this);#H=this.#$J.bind(this);#C=this.#OJ.bind(this);#x=this.#zJ.bind(this);#f=this.#d.bind(this);#o=this.#SJ.bind(this);#b=this.#TJ.bind(this);#D=this.#FJ.bind(this);#I=this.#l.bind(this);#v=new Set(["variant","color","text","full","elastic","size","name","class","data-wave-index","data-active","data-elastic-dragging","style"]);static get observedAttributes(){return["label","direction"]}connectedCallback(){if(!this.#Z)this.#E();if(this.#r(),this.#u(),this.#p(),this.#BJ(),this.removeEventListener("pointerdown",this.#y,{capture:!0}),this.addEventListener("pointerdown",this.#y,{capture:!0,passive:!0}),this.removeEventListener("pointerdown",this.#C,{capture:!0}),this.addEventListener("pointerdown",this.#C,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.addEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#I,!0),this.addEventListener("click",this.#I,!0),this.#_?.removeEventListener("change",this.#D),this.#_?.addEventListener("change",this.#D),!this.#X)this.#X=new MutationObserver((J)=>{let Q=!1,Z=!1;for(let $ of J)if($.type==="attributes"){if($.attributeName==="value"){this.#h();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.#r();if(Z)this.#u(),this.#BJ()});this.#X.observe(this,{attributes:!0})}disconnectedCallback(){if(this.#X?.disconnect(),this.#B)cancelAnimationFrame(this.#B),this.#B=0;if(this.#$)cancelAnimationFrame(this.#$),this.#$=0;this.#kJ(),this.#t(),clearTimeout(this.#F),this.#F=0,this.#GJ(),this.#n(),this.#qJ(),this.#s(),this.removeEventListener("pointerdown",this.#y,{capture:!0}),this.removeEventListener("pointerdown",this.#C,{capture:!0}),this.removeEventListener("contextmenu",this.#b),this.removeEventListener("click",this.#I,!0),this.#_?.removeEventListener("change",this.#D)}attributeChangedCallback(J,Q,Z){if(Q===Z||!this.#Z)return;if(J==="label"||J==="direction")this.#r()}#E(){this.#G=this.getAttribute("value")??this.getAttribute("min")??"0";let J=Array.from(this.childNodes).filter((_)=>{return _.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-slider");j.setAttribute("text","true");for(let _ of this.#XJ()){let X=this.getAttribute(_);j.setAttribute(_,X??"")}Z.append($,j),this.#Z=Z,this.#Q=$,this.#J=j,this.#j=Boolean(Q),this.replaceChildren(Z),this.#c();for(let _ of J){if(_===Q)continue;this.#J.appendChild(_)}}#c(){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.#D),this.#_=J,this.appendChild(J)}#r(){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")}#u(){if(!this.#J)return;let J=this.#XJ(),Q=new Set(J.filter(($)=>$!=="text"&&$!=="value"));for(let $ of this.#Y)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"||Z==="stepper")this.#J.setAttribute("default",this.getAttribute("default")??"50");else if(!this.hasAttribute("default"))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.#i(Z),this.#Y=Q,this.#h(),this.#UJ()}#i(J){let Q=this.#J?.querySelector("fig-input-number");if(!Q)return;if(J!=="opacity"||!this.hasAttribute("color")){Q.removeAttribute("theme");return}let Z=BJ(this.#J,this.getAttribute("color"));if(Z)Q.setAttribute("theme",Z);else Q.removeAttribute("theme")}#h(){if(!this.#J||!this.hasAttribute("value"))return;let J=this.getAttribute("value")??"";if(String(this.#J.value)!==J)this.#J.value=J}#XJ(){let J=new Set(["label","direction","oninput","onchange","steppers"]);return this.getAttributeNames().filter((Q)=>!J.has(Q)&&!this.#v.has(Q))}#UJ(){if(this.#B)cancelAnimationFrame(this.#B);this.#B=requestAnimationFrame(()=>{this.#B=0,this.#_J(),this.#QJ()})}#BJ(){if(this.#$)cancelAnimationFrame(this.#$);this.#$=requestAnimationFrame(()=>{this.#$=0,this.#QJ()})}#QJ(){let J=this.#J?.querySelector('input[type="range"]'),Q=this.#J?.querySelector("fig-input-number input");if(J!==this.#q)this.#LJ(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")}#l(J){if(Y(this,"disabled"))return;if(J.target instanceof Element&&J.target.closest("fig-input-number, fig-menu")){if(this.#W&&J.target.closest("fig-input-number"))J.preventDefault(),J.stopImmediatePropagation(),this.#W=!1;return}this.#ZJ()}#ZJ(){requestAnimationFrame(()=>{requestAnimationFrame(()=>{if(this.isConnected&&!Y(this,"disabled"))this.focus()})})}#LJ(J){if(this.#qJ(),this.#q=J,!this.#q)return;this.#q.addEventListener("dblclick",this.#o,{capture:!0})}#qJ(){if(!this.#q)return;this.#q.removeEventListener("dblclick",this.#o,{capture:!0}),this.#q=null}#SJ(J){J.preventDefault(),J.stopImmediatePropagation(),this.#PJ()}#OJ(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.#t(),this.#L=J.pointerId,this.#z=J.clientX,this.#S=J.clientY,this.#T=!1,window.addEventListener("pointermove",this.#x),window.addEventListener("pointerup",this.#f,{once:!0}),window.addEventListener("pointercancel",this.#f,{once:!0}),window.addEventListener("blur",this.#f,{once:!0})}#zJ(J){if(J.pointerId!==this.#L)return;if(J.buttons===0){this.#d(J);return}if(!this.#T){if(Math.hypot(J.clientX-this.#z,J.clientY-this.#S)<4)return;this.#T=!0,this.setAttribute("data-number-scrubbing","")}this.#jJ(this.#NJ(J),"input")}#d(J){if(J?.pointerId!==void 0&&this.#L!==null&&J.pointerId!==this.#L)return;let Q=this.#T;if(this.#t(),Q){this.#jJ(this.#J?.value,"change"),this.#W=!0,clearTimeout(this.#F),this.#F=window.setTimeout(()=>{this.#W=!1,this.#F=0},0),this.#ZJ();return}this.#J?.querySelector("fig-input-number input")?.focus()}#t(){window.removeEventListener("pointermove",this.#x),window.removeEventListener("pointerup",this.#f),window.removeEventListener("pointercancel",this.#f),window.removeEventListener("blur",this.#f),this.#L=null,this.#T=!1,this.removeAttribute("data-number-scrubbing")}#a(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.#GJ(),this.#n(),this.#q=Q,this.#N=!0,this.#K=J.pointerId,this.#U=this.#WJ();let Z=Q.getBoundingClientRect(),$=this.getBoundingClientRect();this.#P={left:Z.left,right:Z.right,width:Z.width},this.#M=$.width,window.addEventListener("pointermove",this.#A,{passive:!0}),window.addEventListener("pointerup",this.#H,{once:!0}),window.addEventListener("pointercancel",this.#H,{once:!0}),window.addEventListener("blur",this.#H,{once:!0})}#YJ(J){if(!this.#N)return;if(J.pointerId!==this.#K)return;if(J.buttons===0){this.#$J(J);return}this.#w(J.clientX)}#$J(J){if(J?.pointerId!==void 0&&this.#K!==null&&J.pointerId!==this.#K)return;let Q=J?.type==="pointerup"||J?.type==="pointermove"&&J.buttons===0;if(this.#GJ(),this.#n(),Q)this.#ZJ()}#GJ(){window.removeEventListener("pointermove",this.#A),window.removeEventListener("pointerup",this.#H),window.removeEventListener("pointercancel",this.#H),window.removeEventListener("blur",this.#H),this.#N=!1,this.#K=null}#TJ(J){if(Y(this,"disabled"))return;J.preventDefault(),J.stopPropagation(),J.stopImmediatePropagation(),this.#kJ(),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.#_?.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.#PJ()}#kJ(){if(this.#O)clearTimeout(this.#O),this.#O=0;this.#k=null}#WJ(){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}#w(J){let Q=this.#P;if(!Q||!this.#U){this.#n();return}let Z=J<Q.left?J-Q.left:J>Q.right?J-Q.right:0;if(!Z){this.#e();return}let $=Math.max(-this.#U,Math.min(this.#U,Z*0.5)),j=Math.abs($),_=this.#M?(this.#M+j)/this.#M: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")}#n(){this.#e(),this.#U=0,this.#P=null,this.#M=0,this.#K=null}#e(){this.removeAttribute("data-elastic-dragging"),this.style.removeProperty("--propskit-slider-elastic-size"),this.style.removeProperty("--propskit-slider-elastic-scale")}#NJ(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),O=j+(_-j)*$;if(!X)return String(O);let B=Math.round((O-j)/X)*X+j,q=Math.max(0,`${X}`.split(".")[1]?.length||0);return String(Number(B.toFixed(q)))}#MJ(){return this.getAttribute("default")??this.#J?.getAttribute("default")??this.#G??this.#q?.min??"0"}#PJ(){this.#kJ(),this.#jJ(this.#MJ(),"input"),this.#jJ(this.#MJ(),"change")}#jJ(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}))}#_J(){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??"")}#p(){if(!this.#J)return;if(!this.#V)this.#V=this.#g.bind(this,"input");if(!this.#R)this.#R=this.#g.bind(this,"change");this.#J.addEventListener("input",this.#V),this.#J.addEventListener("change",this.#R)}#s(){if(!this.#J)return;if(this.#V)this.#J.removeEventListener("input",this.#V);if(this.#R)this.#J.removeEventListener("change",this.#R)}#g(J,Q){if(Q.stopImmediatePropagation(),Y(this,"disabled"))return;if(J==="change")this.#n();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.dispatchEvent(new CustomEvent(J,{detail:Z,bubbles:!0,cancelable:!0,composed:!0}))}focus(J){this.#QJ();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.#MJ()}get isDefault(){return b(this.value,this.defaultValue)}resetToDefault(){this.#PJ()}}M("propskit-slider",ZJ);class $J extends HTMLElement{static observedAttributes=["type","value","color","name","tooltips","disabled","drag-surface","snapping"];#Z=50;#Q=50;#J=75;#j=75;#X=0;#Y=!1;#B=0;#$=null;#q=null;#_=null;#O=null;#k=null;#G=null;#N=null;#U=null;#P=null;#M=!1;#K=!1;#L=!1;#z=!1;#S=null;#T="";#W="";#F=null;#V=null;#R=null;#y="";#A="";#H=null;#C=null;#x=null;get#f(){return this.getAttribute("type")||"point"}get#o(){return this.#f==="point-radius"||this.#f==="point-radius-angle"}get#b(){return this.#f==="point-radius-angle"}get#D(){return this.#f==="point-point"}get#I(){return this.#f==="point-radius-angle"||this.#f==="point-point"}get#v(){let J=this.getAttribute("tooltips");return J===null||J!=="false"}get#E(){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"}#c(J){let Q=this.#E;if(Q==="true")return!0;if(Q==="modifier")return!!J;return!1}get#r(){let J=this.getAttribute("name");if(J)return J.split(",")[0].trim();return`${Math.round(this.#Z)}%, ${Math.round(this.#Q)}%`}get#u(){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#i(){return this.getAttribute("drag-surface")||"parent"}get#h(){let J=this.#i;if(J==="parent")return this.parentElement;return this.closest(J)}get#XJ(){let J=this.#i;if(J==="parent"){let Q=this.parentElement;if(Q)return Q.setAttribute("data-fig-canvas-control-surface",""),"[data-fig-canvas-control-surface]"}return J}#UJ(J){if(this.#Y)return this.#X/100*J;return this.#X}#BJ(){if(this.#Y)return`Radius ${Math.round(this.#X)}%`;return`Radius ${Math.round(this.#X)}`}connectedCallback(){this.#QJ(),this.#l()}disconnectedCallback(){this.#RJ(),this.#DJ(),this.#qJ(),this.#d(),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.#M&&!this.#K&&!this.#L&&!this.#z)if(this.#QJ(),this.#$)this.#p();else this.#l();if(J==="type")this.#RJ(),this.#QJ(),this.#l();if(J==="color"&&this.#$)if(Z)this.#$.setAttribute("color",Z);else this.#$.removeAttribute("color");if(J==="disabled")this.#RJ(),this.#l();if(J==="tooltips")this.#l();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.#G)this.#G.setAttribute("text",this.#r);if(this.#N)this.#N.setAttribute("text",this.#u)}}#QJ(){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.#Y=!0,this.#X=parseFloat(Z);else this.#Y=!1,this.#X=parseFloat(Z);if(!Number.isFinite(this.#X))this.#X=0}if(typeof Q.angle==="number")this.#B=Q.angle;if(typeof Q.x2==="number")this.#J=Q.x2;if(typeof Q.y2==="number")this.#j=Q.y2;if(this.#f==="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.#f==="color"){let Q=this.getAttribute("color")||this.#$?.getAttribute("color");if(Q)J.color=Q}if(this.#o)J.radius=this.#Y?`${this.#X}%`:this.#X;if(this.#b)J.angle=this.#B;if(this.#D)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)}#l(){this.#RJ(),this.innerHTML="",this.#$=null,this.#q=null,this.#_=null,this.#O=null,this.#k=null,this.#G=null,this.#N=null,this.#U=null,this.#P=null;let J=Y(this,"disabled"),Q=this.#f,Z=this.#v,$=this.#XJ,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.#E),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.#D)j.setAttribute("hit-area","12 circle"),j.setAttribute("hit-area-mode","delegate");if(this.#$=j,this.#o)this.#TJ();if(this.#I)this.#KJ();if(Z){let _=document.createElement("fig-tooltip");_.setAttribute("action","manual"),_.setAttribute("theme","canvas"),_.setAttribute("pointer","false"),_.setAttribute("text",this.#r),_.appendChild(j),this.appendChild(_),this.#G=_}else this.appendChild(j);if(this.#b)this.#kJ(J,Z,$);if(this.#D)this.#WJ(J,Z,$);this.#ZJ(this.#$),this.#ZJ(this.#_),this.#ZJ(this.#q),this.#HJ(),this.#YJ(),requestAnimationFrame(()=>this.#p())}#ZJ(J){if(!J)return;J.addEventListener("pointerdown",(Q)=>{if(Q.target?.classList?.contains("fig-handle-hit-area")&&J.querySelector(".fig-handle-hit-area"))this.#zJ(Q,J);else this.#LJ(Q)},{capture:!0})}#LJ(J){if(Y(this,"disabled"))return;if(J?.button!==void 0&&J.button!==0)return;if(J?.isPrimary===!1)return;if(this.#S===null)this.#T=document.body.style.getPropertyValue("cursor"),this.#W=document.body.style.getPropertyPriority("cursor");if(this.#S=J?.pointerId??-1,document.body.classList.add("fig-lab-move-active"),document.body.style.setProperty("cursor","var(--fig-lab-cursor-move)","important"),!this.#F)this.#F=(Q)=>{if(Q?.pointerId!==void 0&&this.#S!==null&&Q.pointerId!==this.#S)return;if(Q?.type==="blur")this.#qJ();else requestAnimationFrame(()=>this.#qJ())};window.addEventListener("pointerup",this.#F),window.addEventListener("pointercancel",this.#F),window.addEventListener("blur",this.#F)}#qJ(){if(this.#S===null)return;if(document.body.classList.remove("fig-lab-move-active"),this.#T)document.body.style.setProperty("cursor",this.#T,this.#W);else document.body.style.removeProperty("cursor");if(this.#S=null,this.#T="",this.#W="",this.#F)window.removeEventListener("pointerup",this.#F),window.removeEventListener("pointercancel",this.#F),window.removeEventListener("blur",this.#F)}#SJ(J){if(!J)return 0;if(J===this.#_)return this.#B;if(!this.#D)return 0;let Q=this.#PJ();return J===this.#$?Q+180:Q}#OJ(){if(this.#V===null)return;let J=this.#n(this.#SJ(this.#R));document.body.style.setProperty("--fig-lab-cursor-rotate",J),document.body.style.setProperty("cursor",J,"important")}#zJ(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.#y=document.body.style.getPropertyValue("cursor"),this.#A=document.body.style.getPropertyPriority("cursor");if(this.#V=J?.pointerId??-1,this.#R=Q,document.body.classList.add("fig-lab-rotate-active"),this.#OJ(),!this.#H)this.#H=(Z)=>{if(Z?.pointerId!==void 0&&this.#V!==null&&Z.pointerId!==this.#V)return;if(Z?.type==="blur")this.#d();else requestAnimationFrame(()=>this.#d())};window.addEventListener("pointerup",this.#H),window.addEventListener("pointercancel",this.#H),window.addEventListener("blur",this.#H)}#d(){if(this.#V===null)return;if(document.body.classList.remove("fig-lab-rotate-active"),document.body.style.removeProperty("--fig-lab-cursor-rotate"),this.#y)document.body.style.setProperty("cursor",this.#y,this.#A);else document.body.style.removeProperty("cursor");if(this.#V=null,this.#R=null,this.#y="",this.#A="",this.#H)window.removeEventListener("pointerup",this.#H),window.removeEventListener("pointercancel",this.#H),window.removeEventListener("blur",this.#H)}#t(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?.()},O=()=>{_()};J.addEventListener("pointerenter",X),J.addEventListener("pointerleave",O)}#a(){return this.#M||this.#K||this.#L||this.#z}#YJ(){if(this.#$)this.#t(this.#$,()=>this.#G,()=>this.#r,()=>this.#a()||!!this.#$?.querySelector("fig-color-tip"));if(this.#_)this.#t(this.#_,()=>this.#P,()=>`Angle ${Math.round(this.#B)}°`,()=>this.#a());if(this.#q)this.#t(this.#q,()=>this.#N,()=>this.#u,()=>this.#a());if(this.#O){let J=this.#O.querySelector(".fig-canvas-control-radius-hit");this.#GJ(J||this.#O)}if(this.#f==="color"&&this.#$&&this.#G)new MutationObserver(()=>{if(this.#$?.querySelector("fig-color-tip"))this.#G?.removeAttribute("show"),this.#G?.hidePopup?.()}).observe(this.#$,{childList:!0,subtree:!0})}#$J(J,Q){let Z=this.#U;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?.()}#GJ(J){if(!J)return;J.addEventListener("pointerenter",(Q)=>{let Z=this.#U;if(!Z)return;Z.setAttribute("text",this.#BJ()),Z.setAttribute("show","true"),Z.showPopup?.(),this.#$J(Q.clientX,Q.clientY)}),J.addEventListener("pointermove",(Q)=>{if(this.#L)return;this.#$J(Q.clientX,Q.clientY)}),J.addEventListener("pointerleave",()=>{if(this.#L)return;let Q=this.#U;if(!Q)return;Q.removeAttribute("show")})}#TJ(){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.#BJ()),_.appendChild(Q),this.appendChild(_),this.#U=_}else this.appendChild(Q);this.#fJ(Z)}#KJ(){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.#D){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.#FJ(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)}#FJ(J){J.addEventListener("pointerdown",(Q)=>{if(Y(this,"disabled"))return;Q.preventDefault(),Q.stopPropagation();let Z=this.#h;if(!Z)return;let{clientX:$,clientY:j}=Q,_=this.#Z,X=this.#Q,O=this.#J,B=this.#j;this.#M=!0,this.#K=!0,document.body.classList.add("fig-lab-move-active"),J.style.pointerEvents="none";let q=(k)=>{let N=Z.getBoundingClientRect(),K=N.width>0?(k.clientX-$)/N.width*100:0,P=N.height>0?(k.clientY-j)/N.height*100:0,L=-Math.min(_,O),z=100-Math.max(_,O),F=-Math.min(X,B),W=100-Math.max(X,B),S=Math.max(L,Math.min(z,K)),R=Math.max(F,Math.min(W,P));this.#Z=_+S,this.#Q=X+R,this.#J=O+S,this.#j=B+R,this.#p(),this.#s()},G=this.#CJ((k)=>{if(document.body.classList.remove("fig-lab-move-active"),J.style.pointerEvents="stroke",this.#M=!1,this.#K=!1,k)this.#JJ(),this.#g()});window.addEventListener("pointermove",q,{signal:G.signal}),window.addEventListener("pointerup",()=>G.finish(!0),{signal:G.signal}),window.addEventListener("pointercancel",()=>G.finish(!1),{signal:G.signal})})}#kJ(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.#_=$,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.#B)}°`),j.appendChild($),this.appendChild(j),this.#P=j}else this.appendChild($)}#WJ(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.#E),$.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.#u),j.appendChild($),this.appendChild(j),this.#N=j}else this.appendChild($)}#w(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`}#n(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`}#e(J,Q){if(!J)return;J.style.setProperty("cursor",Q,"important")}#NJ(J,Q){if(!J)return;let Z=J.querySelector(".fig-handle-hit-area");if(!Z)return;if(Z.setAttribute("data-cursor","rotate"),this.#e(Z,this.#n(Q)),this.#R===J)this.#OJ()}#MJ(){if(!this.#_||!this.#b)return;this.#NJ(this.#_,this.#B)}#PJ(){return Math.atan2(this.#j-this.#Q,this.#J-this.#Z)*180/Math.PI}#jJ(){if(!this.#D)return;let J=this.#PJ();this.#$?.style.removeProperty("cursor"),this.#q?.style.removeProperty("cursor"),this.#NJ(this.#$,J+180),this.#NJ(this.#q,J)}#_J(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`}#p(){let J=this.#h;if(!J||!this.#$)return;let Q=J.getBoundingClientRect();if(this.#_J(this.#$,this.#Z,this.#Q,Q),this.#O){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#UJ(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 O=_.querySelectorAll("circle");for(let B of O)B.setAttribute("cx",String(j)),B.setAttribute("cy",String(j)),B.setAttribute("r",String(Math.max(j-1,0)))}if(this.#k&&this.#I){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j,_;if(this.#D)j=this.#J/100*Q.width,_=this.#j/100*Q.height;else{let B=this.#UJ(Q.width),q=this.#B*Math.PI/180;j=Z+B*Math.cos(q),_=$+B*Math.sin(q)}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 O=X.querySelectorAll(".fig-canvas-control-angle-line, .fig-canvas-control-angle-line-halo, .fig-canvas-control-angle-line-hit");for(let B of O)B.setAttribute("x1",String(Z)),B.setAttribute("y1",String($)),B.setAttribute("x2",String(j)),B.setAttribute("y2",String(_))}if(this.#_&&this.#b){let Z=this.#Z/100*Q.width,$=this.#Q/100*Q.height,j=this.#UJ(Q.width),_=this.#B*Math.PI/180,X=Z+j*Math.cos(_),O=$+j*Math.sin(_),B=Q.width>0?X/Q.width*100:0,q=Q.height>0?O/Q.height*100:0;this.#_J(this.#_,B,q,Q)}if(this.#q&&this.#D)this.#_J(this.#q,this.#J,this.#j,Q);this.#MJ(),this.#jJ()}#s(J=this.value){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:J}))}#g(J=this.value){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:J}))}#VJ(J){return{...this.value,...XJ(J.color,J.alpha,J.opacity)}}#JJ(){this.setAttribute("value",JSON.stringify(this.value))}#HJ(){if(!this.#$)return;if(this.#$.addEventListener("input",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#$.getAttribute("color")||J.detail.color),this.#s(this.#VJ(J.detail));return}this.#M=!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.#G)this.#G.removeAttribute("show"),this.#G.hidePopup?.();this.#p(),this.#s()}),this.#$.addEventListener("change",(J)=>{if(J.stopPropagation(),J.detail?.color){this.setAttribute("color",this.#$.getAttribute("color")||J.detail.color),this.#g(this.#VJ(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.#G)this.#G.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#M=!1})}),this.#_)this.#_.addEventListener("input",(J)=>{J.stopPropagation();let Q=this.#h;if(!Q)return;this.#z=!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,O=this.#_.offsetWidth/2,B=this.#_.offsetHeight/2,q=_+O-$,G=X+B-j,k=Math.atan2(G,q)*180/Math.PI;if(this.#c(J.detail?.shiftKey))k=Math.round(k/15)*15;this.#B=k;let N=Math.sqrt(q*q+G*G);if(this.#c(J.detail?.shiftKey)){let K=this.#Y?5:10;if(this.#Y){let P=N/Z.width*100;P=Math.round(P/K)*K,N=P/100*Z.width}else N=Math.round(N/K)*K}if(this.#Y)this.#X=Math.max(0,N/Z.width*100);else this.#X=Math.max(0,N);if(this.#P)this.#P.setAttribute("text",`Angle ${Math.round(this.#B)}°`),this.#P.setAttribute("show","true"),this.#P.showPopup?.();this.#p(),this.#s()}),this.#_.addEventListener("change",(J)=>{if(J.stopPropagation(),this.classList.remove("fig-canvas-control-ring-active"),this.#P)this.#P.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#z=!1})}),this.#_.addEventListener("hitareadown",(J)=>{J.stopPropagation();let Q=J.detail?.originalEvent;if(!Q)return;Q.preventDefault();let Z=this.#h;if(!Z)return;if(this.#z=!0,this.classList.add("fig-canvas-control-ring-active"),this.#_.setAttribute("selected",""),this.#P)this.#P.setAttribute("show","true"),this.#P.showPopup?.();let $=(_)=>{let X=Z.getBoundingClientRect(),O=this.#Z/100*X.width,B=this.#Q/100*X.height,q=_.clientX-X.left-O,G=_.clientY-X.top-B,k=Math.atan2(G,q)*180/Math.PI;if(this.#c(_.shiftKey))k=Math.round(k/15)*15;if(this.#B=k,this.#P)this.#P.setAttribute("text",`Angle ${Math.round(k)}°`);this.#p(),this.#s()},j=this.#CJ((_)=>{if(this.#z=!1,this.classList.remove("fig-canvas-control-ring-active"),this.#_.removeAttribute("selected"),this.#P)this.#P.removeAttribute("show");if(_)this.#JJ(),this.#g()});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.#K=!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.#N)this.#N.removeAttribute("show"),this.#N.hidePopup?.();this.#p(),this.#s()}),this.#q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#N)this.#N.removeAttribute("show");this.#p(),this.#JJ(),this.#g(),requestAnimationFrame(()=>{this.#K=!1})}),this.#m(this.#$,!0),this.#m(this.#q,!1)}#m(J,Q){if(!J)return;J.addEventListener("hitareadown",(Z)=>{Z.stopPropagation();let $=Z.detail?.originalEvent;if(!$)return;$.preventDefault();let j=this.#h;if(!j)return;this.#M=!0;let _=j.getBoundingClientRect(),X=Q?this.#J:this.#Z,O=Q?this.#j:this.#Q,B=Q?this.#Z:this.#J,q=Q?this.#Q:this.#j,G=X/100*_.width,k=O/100*_.height,N=B/100*_.width,K=q/100*_.height,P=Math.sqrt((N-G)**2+(K-k)**2),L=Q?this.#G:this.#N;if(L)L.removeAttribute("show"),L.hidePopup?.();let z=(W)=>{let S=j.getBoundingClientRect(),R=X/100*S.width,D=O/100*S.height,V=W.clientX-S.left-R,E=W.clientY-S.top-D,H=Math.atan2(E,V);if(this.#c(W.shiftKey))H=Math.round(H*180/Math.PI/15)*15*Math.PI/180;let jJ=R+P*Math.cos(H),_J=D+P*Math.sin(H),p=Math.max(0,Math.min(100,jJ/S.width*100)),g=Math.max(0,Math.min(100,_J/S.height*100));if(Q)this.#Z=p,this.#Q=g;else this.#J=p,this.#j=g;this.#p(),this.#s()},F=this.#CJ((W)=>{if(this.#M=!1,L)L.removeAttribute("show");if(W)this.#JJ(),this.#g()});window.addEventListener("pointermove",z,{signal:F.signal}),window.addEventListener("pointerup",()=>F.finish(!0),{signal:F.signal}),window.addEventListener("pointercancel",()=>F.finish(!1),{signal:F.signal})})}#fJ(J){if(!J)return;J.addEventListener("pointermove",(Z)=>{if(this.#L)return;let $=this.#h;if(!$)return;let j=$.getBoundingClientRect(),_=this.#Z/100*j.width,X=this.#Q/100*j.height,O=Math.atan2(Z.clientY-j.top-X,Z.clientX-j.left-_)*180/Math.PI;this.#e(J,this.#w(O))});let Q=(Z)=>{if(Y(this,"disabled"))return;Z.preventDefault(),Z.stopPropagation(),this.#L=!0,this.classList.add("fig-canvas-control-ring-active");let $=this.#h;if(!$)return;if(this.#U)this.#U.setAttribute("show","true"),this.#U.showPopup?.(),this.#$J(Z.clientX,Z.clientY);if(this.#P)this.#P.removeAttribute("show"),this.#P.hidePopup?.();let j=this.#_?.style.pointerEvents,_=this.#_?.querySelector(".fig-handle-hit-area"),X=_?.style.pointerEvents;if(this.#_)this.#_.style.pointerEvents="none";if(_)_.style.pointerEvents="none";let O=document.body.style.cursor;J.style.pointerEvents="none";let B=$.getBoundingClientRect(),q=this.#Z/100*B.width,G=this.#Q/100*B.height,k=Math.atan2(Z.clientY-B.top-G,Z.clientX-B.left-q)*180/Math.PI,N=Math.round(k);document.body.style.cursor=this.#w(N);let K=(L)=>{let z=$.getBoundingClientRect(),F=this.#Z/100*z.width,W=this.#Q/100*z.height,S=L.clientX-z.left-F,R=L.clientY-z.top-W,D=Math.round(Math.atan2(R,S)*180/Math.PI);if(D!==N)N=D,document.body.style.cursor=this.#w(D);let V=Math.sqrt(S*S+R*R);if(this.#c(L.shiftKey)){let E=this.#Y?5:10;if(this.#Y){let H=V/z.width*100;H=Math.round(H/E)*E,V=H/100*z.width}else V=Math.round(V/E)*E}if(this.#Y)this.#X=Math.max(0,V/z.width*100);else this.#X=Math.max(0,V);if(this.#U)this.#U.setAttribute("text",this.#BJ()),this.#$J(L.clientX,L.clientY);this.#p(),this.#s()},P=this.#CJ((L)=>{if(this.#L=!1,this.classList.remove("fig-canvas-control-ring-active"),J.style.pointerEvents="",this.#_)this.#_.style.pointerEvents=j??"";if(_)_.style.pointerEvents=X??"";if(document.body.style.cursor=O,this.#U)this.#U.removeAttribute("show");if(L)this.#JJ(),this.#g()});window.addEventListener("pointermove",K,{signal:P.signal}),window.addEventListener("pointerup",()=>P.finish(!0),{signal:P.signal}),window.addEventListener("pointercancel",()=>P.finish(!1),{signal:P.signal})};J.addEventListener("pointerdown",Q),this._radiusDragCleanup=()=>J.removeEventListener("pointerdown",Q)}#DJ(){if(this._radiusDragCleanup)this._radiusDragCleanup(),this._radiusDragCleanup=null}#CJ(J){this.#RJ();let Q=new AbortController,Z=!1,$=(j=!1)=>{if(Z)return;if(Z=!0,Q.abort(),this.#C===Q)this.#C=null,this.#x=null;J(j)};return this.#C=Q,this.#x=$,{signal:Q.signal,finish:$}}#RJ(){this.#x?.(!1),this.#C?.abort(),this.#C=null,this.#x=null}}M("fig-canvas-control",$J);class U extends HTMLElement{#Z=[U.#R()];#Q=0;#J=2;#j=240;#X=120;#Y={min:-1,max:1};#B=null;#$=null;#q=null;#_=null;#O=0;#k=null;#G=null;#N=null;#U=null;#P=[];#M=[];#K=[];#L=[];#z=new Set;#S=null;#T=null;#W=null;#F=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:[U.#R()]});this.#J=this.#y("precision",2),this.#f(this.getAttribute("value")),this.#x(),this.#h(),this.#SJ(),T(this)}disconnectedCallback(){if(this.#_J(),this.#GJ(),this.#S)this.#S.disconnect(),this.#S=null;f(this)}attributeChangedCallback(J,Q,Z){if(Q===Z)return;if(J==="value"){if(this.#f(Z),this.isConnected)this.#h();return}if(J==="precision"){if(this.#J=this.#y("precision",2),this.isConnected)this.#g();return}if(J==="aspect-ratio"){if(this.#x(),this.#$)this.#YJ();return}if(J==="edit"||J==="disabled"){if(this.isConnected)this.#h()}}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.#o(this.defaultValue);if(!J)return!1;return JSON.stringify(this.data.waves)===JSON.stringify(J.map((Q)=>this.#D(Q)))}resetToDefault(){let J=this.defaultValue;if(!J)return;this.value=J,this.#m("input"),this.#m("change")}get data(){return{waves:this.#Z.map((J)=>this.#D(J))}}get preset(){let J=this.#I;return U.TYPES.find((Q)=>Q.value===J.type)?.name}#y(J,Q){let Z=Number.parseInt(this.getAttribute(J)||"",10);return Number.isFinite(Z)?Math.max(0,Math.min(100,Z)):Q}#A(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}#H(){return this.getAttribute("edit")!=="false"}#C(){return this.#A("disabled",!1)}#x(){let J=this.getAttribute("aspect-ratio")||"2 / 1";this.style.setProperty("--aspect-ratio",J)}#f(J){let Q=this.#o(J);if(!Q)return!1;if(this.#Z=Q,!this.#Z.length)this.#Z=[U.#R()];return this.#Q=Math.min(this.#Q,this.#Z.length-1),!0}#o(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.#E(J.frequency,1,0.1,16),amplitude:this.#E(J.amplitude,1,-4,4),phase:this.#E(J.phase,0,-360,360),offset:this.#E(J.offset,0,-4,4)}}#D(J){return{type:J.type,frequency:this.#c(J.frequency),amplitude:this.#c(J.amplitude),phase:this.#c(J.phase),offset:this.#c(J.offset)}}get#I(){if(!this.#Z[this.#Q])this.#Q=0;return this.#Z[this.#Q]||U.#R()}#v(J){let Q=String(J||"").toLowerCase();return U.TYPES.some((Z)=>Z.value===Q)?Q:"sine"}#E(J,Q,Z,$){let j=Number.parseFloat(J);if(!Number.isFinite(j))return Q;return Math.min($,Math.max(Z,j))}#c(J){let Q=10**this.#J;return Math.round(J*Q)/Q}static#r(J){return String(J).replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}static#u(J){return U.TYPES.find((Q)=>Q.value===J)?.name||"Wave"}static waveIcon(J,Q=24){let j=Q-10,_="";for(let X=0;X<=32;X++){let O=X/32,B=U.#i(J,O),q=5+O*j,G=5+(1-(B+1)/2)*j;_+=`${X===0?"M":"L"}${q.toFixed(1)},${G.toFixed(1)}`}return`<svg width="${Q}" height="${Q}" viewBox="0 0 ${Q} ${Q}" fill="none"><path d="${_}" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"/></svg>`}static#i(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(_)}}#h(){if(this.#_J(),this.#GJ(),this.innerHTML=this.#XJ(),this.#ZJ(),this.#OJ(),this.#YJ(),this.#WJ(),!this.#C())this.#$J();T(this)}#XJ(){let J=this.#H()&&!this.#C(),Q=J?"":" disabled";return`<div class="propskit-oscillator-svg-container">
         <svg viewBox="0 0 ${this.#j} ${this.#X}" class="propskit-oscillator-svg">
           <rect class="propskit-oscillator-bounds" x="0" y="0" width="${this.#j}" height="${this.#X}"></rect>
           <line class="propskit-oscillator-baseline"></line>