@rogieking/figui3 3.0.3 → 3.2.0

package/dist/fig.js

@@ -1,4 +1,4 @@
-var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @ungap/custom-elements-builtin@0.6.5 (ISC). */(function(Q,$,J){if(Q.importNode.length!=1||$.get("ungap-li"))return;var Z="extends";try{var _={};_[Z]="li";var j=HTMLLIElement,q=function(){return Reflect.construct(j,[],q)};if(q.prototype=J.create(j.prototype),$.define("ungap-li",q,_),!/is="ungap-li"/.test(new q().outerHTML))throw _}catch(K){(function(){var X="attributeChangedCallback",W="connectedCallback",L="disconnectedCallback",U=Element.prototype,G=J.assign,O=J.create,B=J.defineProperties,D=J.getOwnPropertyDescriptor,F=J.setPrototypeOf,P=$.define,E=$.get,M=$.upgrade,S=$.whenDefined,C=O(null),y=new WeakMap,T={childList:!0,subtree:!0};Reflect.ownKeys(self).filter(function(Y){return typeof Y=="string"&&/^HTML(?!Element)/.test(Y)}).forEach(function(Y){function N(){}var A=self[Y];F(N,A),(N.prototype=A.prototype).constructor=N,A={},A[Y]={value:N},B(self,A)}),new MutationObserver(u).observe(Q,T),o(Document.prototype,"importNode"),o(Node.prototype,"cloneNode"),B($,{define:{value:function(Y,N,A){if(Y=Y.toLowerCase(),A&&Z in A){C[Y]=G({},A,{Class:N});var k=A[Z]+'[is="'+Y+'"]',R=Q.querySelectorAll(k);for(var z=0,H=R.length;z<H;z++)w(R[z])}else P.apply($,arguments)}},get:{value:function(Y){return Y in C?C[Y].Class:E.call($,Y)}},upgrade:{value:function(Y){var N=g(Y);if(N&&!(Y instanceof N.Class))i(Y,N);else M.call($,Y)}},whenDefined:{value:function(Y){return Y in C?Promise.resolve():S.call($,Y)}}});var I=Q.createElement;B(Q,{createElement:{value:function(Y,N){var A=I.call(Q,Y);if(N&&"is"in N)A.setAttribute("is",N.is),$.upgrade(A);return A}}});var S0=D(U,"attachShadow").value,d=D(U,"innerHTML");B(U,{attachShadow:{value:function(){var Y=S0.apply(this,arguments);return new MutationObserver(u).observe(Y,T),Y}},innerHTML:{get:d.get,set:function(Y){if(d.set.call(this,Y),/\bis=("|')?[a-z0-9_-]+\1/i.test(Y))b(this,w)}}});function u(Y){for(var N=0,A=Y.length;N<A;N++){var k=Y[N],R=k.addedNodes,z=k.removedNodes;for(var H=0,v=R.length;H<v;H++)w(R[H]);for(var m=0,C0=z.length;m<C0;m++)r(z[m])}}function s(Y){for(var N=0,A=Y.length;N<A;N++){var k=Y[N],R=k.attributeName,z=k.oldValue,H=k.target,v=H.getAttribute(R);if(X in H&&!(z==v&&v==null))H[X](R,z,H.getAttribute(R),null)}}function r(Y){if(Y.nodeType!==1)return;var N=g(Y);if(N&&Y instanceof N.Class&&L in Y&&y.get(Y)!==L)y.set(Y,L),Promise.resolve(Y).then(P0);b(Y,r)}function g(Y){var N=Y.getAttribute("is");if(N){if(N=N.toLowerCase(),N in C)return C[N]}return null}function H0(Y){Y[W]()}function P0(Y){Y[L]()}function i(Y,N){var A=N.Class,k=A.observedAttributes||[];if(F(Y,A.prototype),k.length){new MutationObserver(s).observe(Y,{attributes:!0,attributeFilter:k,attributeOldValue:!0});var R=[];for(var z=0,H=k.length;z<H;z++)R.push({attributeName:k[z],oldValue:null,target:Y});s(R)}}function w(Y){if(Y.nodeType!==1)return;var N=g(Y);if(N){if(!(Y instanceof N.Class))i(Y,N);if(W in Y&&Y.isConnected&&y.get(Y)!==W)y.set(Y,W),Promise.resolve(Y).then(H0)}b(Y,w)}function b(Y,N){for(var A=Y.content,k=(A&&A.nodeType==11?A:Y).querySelectorAll("[is]"),R=0,z=k.length;R<z;R++)N(k[R])}function o(Y,N){var A=Y[N],k={};k[N]={value:function(){var R=A.apply(this,arguments);switch(R.nodeType){case 1:case 11:b(R,w)}return R}},B(Y,k)}})()}})(document,customElements,Object)});function I0(){if(typeof navigator==="undefined")return!1;const Q=navigator.userAgent||"",$=/\b(iPad|iPhone|iPod)\b/.test(Q)||/\bMacintosh\b/.test(Q)&&/\bMobile\b/.test(Q),J=/\bAppleWebKit\b/.test(Q)&&!/\b(Chrome|Chromium|Edg|OPR|SamsungBrowser)\b/.test(Q);return $||J}function y0(){if(typeof window==="undefined"||!window.customElements||typeof HTMLButtonElement==="undefined")return!1;const Q=`fig-builtin-probe-${Math.random().toString(36).slice(2)}`;class $ extends HTMLButtonElement{}try{return customElements.define(Q,$,{extends:"button"}),document.createElement("button",{is:Q})instanceof $}catch(J){return!1}}function c(Q,$,J){const Z=()=>{if(!customElements.get(Q))customElements.define(Q,$,J)};if(!t){Z();return}x0.then(Z).catch((_)=>{console.error(`[figui3] Failed to load customized built-in polyfill for "${Q}".`,_)})}function V(){return Date.now().toString(36)+Math.random().toString(36).substring(2)}function n(){let Q=1000;const $=document.querySelectorAll("*");for(let J of $){const Z=parseInt(getComputedStyle(J).zIndex,10);if(!isNaN(Z)&&Z>Q)Q=Z}return Q}var t=I0()&&!y0(),x0=(t?Promise.resolve().then(() => (l(),f0)):Promise.resolve()).then(()=>{}).catch((Q)=>{throw Q});class a extends HTMLElement{type;#Q;constructor(){super();this.attachShadow({mode:"open",delegatesFocus:!0})}connectedCallback(){this.type=this.getAttribute("type")||"button",this.shadowRoot.innerHTML=`
+var C0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=C0(()=>{/*! Vendored from @ungap/custom-elements-builtin@0.6.5 (ISC). */(function(Q,$,J){if(Q.importNode.length!=1||$.get("ungap-li"))return;var Z="extends";try{var _={};_[Z]="li";var j=HTMLLIElement,q=function(){return Reflect.construct(j,[],q)};if(q.prototype=J.create(j.prototype),$.define("ungap-li",q,_),!/is="ungap-li"/.test(new q().outerHTML))throw _}catch(K){(function(){var X="attributeChangedCallback",W="connectedCallback",L="disconnectedCallback",U=Element.prototype,G=J.assign,N=J.create,B=J.defineProperties,F=J.getOwnPropertyDescriptor,D=J.setPrototypeOf,S=$.define,E=$.get,M=$.upgrade,H=$.whenDefined,T=N(null),y=new WeakMap,C={childList:!0,subtree:!0};Reflect.ownKeys(self).filter(function(Y){return typeof Y=="string"&&/^HTML(?!Element)/.test(Y)}).forEach(function(Y){function O(){}var A=self[Y];D(O,A),(O.prototype=A.prototype).constructor=O,A={},A[Y]={value:O},B(self,A)}),new MutationObserver(s).observe(Q,C),o(Document.prototype,"importNode"),o(Node.prototype,"cloneNode"),B($,{define:{value:function(Y,O,A){if(Y=Y.toLowerCase(),A&&Z in A){T[Y]=G({},A,{Class:O});var k=A[Z]+'[is="'+Y+'"]',R=Q.querySelectorAll(k);for(var z=0,P=R.length;z<P;z++)w(R[z])}else S.apply($,arguments)}},get:{value:function(Y){return Y in T?T[Y].Class:E.call($,Y)}},upgrade:{value:function(Y){var O=g(Y);if(O&&!(Y instanceof O.Class))i(Y,O);else M.call($,Y)}},whenDefined:{value:function(Y){return Y in T?Promise.resolve():H.call($,Y)}}});var I=Q.createElement;B(Q,{createElement:{value:function(Y,O){var A=I.call(Q,Y);if(O&&"is"in O)A.setAttribute("is",O.is),$.upgrade(A);return A}}});var H0=F(U,"attachShadow").value,d=F(U,"innerHTML");B(U,{attachShadow:{value:function(){var Y=H0.apply(this,arguments);return new MutationObserver(s).observe(Y,C),Y}},innerHTML:{get:d.get,set:function(Y){if(d.set.call(this,Y),/\bis=("|')?[a-z0-9_-]+\1/i.test(Y))b(this,w)}}});function s(Y){for(var O=0,A=Y.length;O<A;O++){var k=Y[O],R=k.addedNodes,z=k.removedNodes;for(var P=0,v=R.length;P<v;P++)w(R[P]);for(var m=0,T0=z.length;m<T0;m++)r(z[m])}}function u(Y){for(var O=0,A=Y.length;O<A;O++){var k=Y[O],R=k.attributeName,z=k.oldValue,P=k.target,v=P.getAttribute(R);if(X in P&&!(z==v&&v==null))P[X](R,z,P.getAttribute(R),null)}}function r(Y){if(Y.nodeType!==1)return;var O=g(Y);if(O&&Y instanceof O.Class&&L in Y&&y.get(Y)!==L)y.set(Y,L),Promise.resolve(Y).then(S0);b(Y,r)}function g(Y){var O=Y.getAttribute("is");if(O){if(O=O.toLowerCase(),O in T)return T[O]}return null}function P0(Y){Y[W]()}function S0(Y){Y[L]()}function i(Y,O){var A=O.Class,k=A.observedAttributes||[];if(D(Y,A.prototype),k.length){new MutationObserver(u).observe(Y,{attributes:!0,attributeFilter:k,attributeOldValue:!0});var R=[];for(var z=0,P=k.length;z<P;z++)R.push({attributeName:k[z],oldValue:null,target:Y});u(R)}}function w(Y){if(Y.nodeType!==1)return;var O=g(Y);if(O){if(!(Y instanceof O.Class))i(Y,O);if(W in Y&&Y.isConnected&&y.get(Y)!==W)y.set(Y,W),Promise.resolve(Y).then(P0)}b(Y,w)}function b(Y,O){for(var A=Y.content,k=(A&&A.nodeType==11?A:Y).querySelectorAll("[is]"),R=0,z=k.length;R<z;R++)O(k[R])}function o(Y,O){var A=Y[O],k={};k[O]={value:function(){var R=A.apply(this,arguments);switch(R.nodeType){case 1:case 11:b(R,w)}return R}},B(Y,k)}})()}})(document,customElements,Object)});function I0(){if(typeof navigator==="undefined")return!1;const Q=navigator.userAgent||"",$=/\b(iPad|iPhone|iPod)\b/.test(Q)||/\bMacintosh\b/.test(Q)&&/\bMobile\b/.test(Q),J=/\bAppleWebKit\b/.test(Q)&&!/\b(Chrome|Chromium|Edg|OPR|SamsungBrowser)\b/.test(Q);return $||J}function y0(){if(typeof window==="undefined"||!window.customElements||typeof HTMLButtonElement==="undefined")return!1;const Q=`fig-builtin-probe-${Math.random().toString(36).slice(2)}`;class $ extends HTMLButtonElement{}try{return customElements.define(Q,$,{extends:"button"}),document.createElement("button",{is:Q})instanceof $}catch(J){return!1}}function c(Q,$,J){const Z=()=>{if(!customElements.get(Q))customElements.define(Q,$,J)};if(!t){Z();return}x0.then(Z).catch((_)=>{console.error(`[figui3] Failed to load customized built-in polyfill for "${Q}".`,_)})}function V(){return Date.now().toString(36)+Math.random().toString(36).substring(2)}function n(){let Q=1000;const $=document.querySelectorAll("*");for(let J of $){const Z=parseInt(getComputedStyle(J).zIndex,10);if(!isNaN(Z)&&Z>Q)Q=Z}return Q}var t=I0()&&!y0(),x0=(t?Promise.resolve().then(() => (l(),f0)):Promise.resolve()).then(()=>{}).catch((Q)=>{throw Q});class a extends HTMLElement{type;#Q;constructor(){super();this.attachShadow({mode:"open",delegatesFocus:!0})}connectedCallback(){this.type=this.getAttribute("type")||"button",this.shadowRoot.innerHTML=`
             <style>
                 button, button:hover, button:active {
                     padding: 0 var(--spacer-2);
@@ -32,7 +32,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
             <button type="${this.type}">
                 <slot></slot>
             </button>
-            `,this.#Q=this.hasAttribute("selected")&&this.getAttribute("selected")!=="false",requestAnimationFrame(()=>{this.button=this.shadowRoot.querySelector("button"),this.button.addEventListener("click",this.#$.bind(this)),this.button.addEventListener("focus",()=>{if(this.button.matches(":focus-visible"))this.setAttribute("data-focus-visible","")}),this.button.addEventListener("blur",()=>{this.removeAttribute("data-focus-visible")})})}get type(){return this.getAttribute("type")||"button"}set type(Q){this.setAttribute("type",Q)}get selected(){return this.#Q}set selected(Q){this.setAttribute("selected",Q)}#$(){if(this.type==="toggle")this.toggleAttribute("selected",!this.hasAttribute("selected"));if(this.type==="submit"){let Q=this.closest("form");if(Q)Q.submit()}if(this.type==="link"){const Q=this.getAttribute("href"),$=this.getAttribute("target");if(Q)if($)window.open(Q,$);else window.location.href=Q}}static get observedAttributes(){return["disabled","selected"]}attributeChangedCallback(Q,$,J){if(this.button)switch(this.button[Q]=J,Q){case"disabled":this.disabled=this.button.disabled=J!==null&&J!=="false";break;case"type":this.type=J,this.button.type=this.type,this.button.setAttribute("type",this.type);break;case"selected":this.#Q=J==="true";break}}}customElements.define("fig-button",a);class e extends HTMLElement{#Q="Menu";#$=null;#J;#_;#q=!1;#Z=null;get label(){return this.#Q}set label(Q){this.#Q=Q}constructor(){super();this.select=document.createElement("select"),this.optionsSlot=document.createElement("slot"),this.attachShadow({mode:"open"}),this.#J=this.#X.bind(this),this.#_=this.#O.bind(this)}#j(){if(typeof CSS==="undefined"||typeof CSS.supports!=="function")return!1;try{return CSS.supports("appearance: base-select")&&CSS.supports("selector(::picker(select))")}catch{return!1}}#K(){if(!(this.getAttribute("experimental")||"").split(/\s+/).filter(Boolean).includes("modern")||!this.#j()){this.#q=!1;return}const J=document.createElement("button");J.setAttribute("type","button"),J.setAttribute("aria-hidden","true");const Z=document.createElement("selectedcontent");J.appendChild(Z),this.select.appendChild(J),this.#q=!0,this.#Z=Z}#W(){if(!this.#Z)return;const Q=this.select.selectedOptions?.[0];if(!Q){this.#Z.textContent="";return}this.#Z.innerHTML=Q.innerHTML}#G(){this.select.addEventListener("input",this.#J),this.select.addEventListener("change",this.#_)}#Y(Q){if(!Q||!(Q instanceof Element))return!1;return!!Q.querySelector('fig-checkbox, fig-switch, input[type="checkbox"]')}#B(){if(typeof this.select.showPicker==="function")requestAnimationFrame(()=>{try{this.select.showPicker()}catch{}})}connectedCallback(){this.type=this.getAttribute("type")||"select",this.#Q=this.getAttribute("label")||this.#Q,this.select.setAttribute("aria-label",this.#Q),this.appendChild(this.select),this.shadowRoot.appendChild(this.optionsSlot),this.optionsSlot.addEventListener("slotchange",this.slotChange.bind(this)),this.#G()}slotChange(){while(this.select.firstChild)this.select.firstChild.remove();if(this.#K(),this.type==="dropdown"){const Q=document.createElement("option");Q.setAttribute("hidden","true"),Q.setAttribute("selected","true"),Q.selected=!0,this.select.appendChild(Q)}if(this.optionsSlot.assignedNodes().forEach((Q)=>{if(Q.nodeName==="OPTION"||Q.nodeName==="OPTGROUP")this.select.appendChild(Q.cloneNode(!0))}),this.#N(this.value),this.#W(),this.type==="dropdown")this.select.selectedIndex=-1}#X(Q){const $=Q.target.selectedOptions?.[0];if(this.#Y($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#B();return}const J=Q.target.value;if(this.type==="dropdown")this.#$=J;this.setAttribute("value",J),this.#W(),this.dispatchEvent(new CustomEvent("input",{detail:J,bubbles:!0,composed:!0}))}#O(Q){const $=Q.target.selectedOptions?.[0];if(this.#Y($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#B();return}const J=this.type==="dropdown"?this.#$:this.select.value;if(this.type==="dropdown")this.select.selectedIndex=-1;this.#W(),this.dispatchEvent(new CustomEvent("change",{detail:J,bubbles:!0,composed:!0}))}focus(){this.select.focus()}blur(){this.select.blur()}get value(){if(this.type==="dropdown")return this.#$;return this.select?.value}set value(Q){if(this.type==="dropdown")this.#$=Q;this.setAttribute("value",Q)}static get observedAttributes(){return["value","type","experimental"]}#N(Q){if(this.type==="dropdown")return;if(this.select)this.select.querySelectorAll("option").forEach(($,J)=>{if($.value===this.getAttribute("value"))this.select.selectedIndex=J});this.#W()}attributeChangedCallback(Q,$,J){if(Q==="value")this.#N(J);if(Q==="type")this.type=J;if(Q==="experimental")this.slotChange();if(Q==="label")this.#Q=J,this.select.setAttribute("aria-label",this.#Q)}}customElements.define("fig-dropdown",e);class x extends HTMLElement{static#Q=0;static#$=500;#J;#_;#q;#Z=!1;#j=null;#K=null;constructor(){super();this.action=this.getAttribute("action")||"hover";let Q=parseInt(this.getAttribute("delay"));this.delay=!isNaN(Q)?Q:500,this.#J=this.#U.bind(this),this.#_=this.hidePopupOutsideClick.bind(this)}connectedCallback(){this.setup(),this.setupEventListeners()}disconnectedCallback(){if(this.destroy(),document.removeEventListener("mousedown",this.#J,!0),this.#Y(),this.action==="click")document.body.removeEventListener("click",this.#_);if(clearTimeout(this.#q),this.action==="hover")this.removeEventListener("touchstart",this.#X),this.removeEventListener("touchmove",this.#O),this.removeEventListener("touchend",this.#N),this.removeEventListener("touchcancel",this.#L);else if(this.action==="click")this.removeEventListener("touchstart",this.showDelayedPopup)}setup(){this.style.display="contents"}render(){this.destroy();let Q=document.createElement("span");this.popup=document.createElement("span"),this.popup.setAttribute("class","fig-tooltip"),this.popup.setAttribute("role","tooltip");const $=V();if(this.popup.setAttribute("id",$),this.popup.style.position="fixed",this.popup.style.visibility="hidden",this.popup.style.display="inline-flex",this.popup.style.pointerEvents="none",this.popup.append(Q),Q.innerText=this.getAttribute("text"),this.firstElementChild)this.firstElementChild.setAttribute("aria-describedby",$);const J=this.closest("dialog");if(J&&J.open)J.append(this.popup);else document.body.append(this.popup);const Z=Q.childNodes[0];if(Z){const _=document.createRange();_.setStartBefore(Z),_.setEndAfter(Z);const j=_.getBoundingClientRect();Q.style.width=`${j.width}px`}}destroy(){if(this.#Y(),this.popup)this.popup.remove();if(this.action==="click")document.body.removeEventListener("click",this.#_)}isTouchDevice(){return"ontouchstart"in window||navigator.maxTouchPoints>0||navigator.msMaxTouchPoints>0}setupEventListeners(){if(this.action==="hover"){if(!this.isTouchDevice())this.addEventListener("pointerenter",this.showDelayedPopup.bind(this)),this.addEventListener("pointerleave",this.#B.bind(this));this.addEventListener("touchstart",this.#X.bind(this),{passive:!0}),this.addEventListener("touchmove",this.#O.bind(this),{passive:!0}),this.addEventListener("touchend",this.#N.bind(this),{passive:!0}),this.addEventListener("touchcancel",this.#L.bind(this),{passive:!0})}else if(this.action==="click")this.addEventListener("click",this.showDelayedPopup.bind(this)),document.body.addEventListener("click",this.#_),this.addEventListener("touchstart",this.showDelayedPopup.bind(this),{passive:!0});document.addEventListener("mousedown",this.#J,!0)}getOffset(){const Q={left:8,top:4,right:8,bottom:4},$=this.getAttribute("offset");if(!$)return Q;const[J,Z,_,j]=$.split(",").map(Number);return{left:isNaN(J)?Q.left:J,top:isNaN(Z)?Q.top:Z,right:isNaN(_)?Q.right:_,bottom:isNaN(j)?Q.bottom:j}}showDelayedPopup(){this.render(),clearTimeout(this.timeout);const $=Date.now()-x.#Q<x.#$?0:this.delay;this.timeout=setTimeout(this.showPopup.bind(this),$)}showPopup(){this.#W(),this.popup.style.opacity="1",this.popup.style.visibility="visible",this.popup.style.display="block",this.popup.style.pointerEvents="all",this.popup.style.zIndex=n()+1,this.isOpen=!0,x.#Q=Date.now(),this.#G()}#W(){if(!this.popup||!this.firstElementChild)return;const Q=this.firstElementChild.getBoundingClientRect(),$=this.popup.getBoundingClientRect(),J=this.getOffset();let Z=Q.top-$.height-J.top,_=Q.left+(Q.width-$.width)/2;if(this.popup.setAttribute("position","top"),Z<0)this.popup.setAttribute("position","bottom"),Z=Q.bottom+J.bottom;if(_<J.left)_=J.left;else if(_+$.width>window.innerWidth-J.right)_=window.innerWidth-$.width-J.right;const K=Q.left+Q.width/2-_;this.popup.style.setProperty("--beak-offset",`${K}px`),this.popup.style.top=`${Z}px`,this.popup.style.left=`${_}px`}hidePopup(){if(clearTimeout(this.timeout),clearTimeout(this.#q),this.#Y(),this.popup)this.popup.style.opacity="0",this.popup.style.display="block",this.popup.style.pointerEvents="none",this.destroy();this.isOpen=!1,x.#Q=Date.now()}#G(){this.#Y();const Q=this.firstElementChild;if(!Q)return;this.#j=new MutationObserver(()=>{if(this.#K)cancelAnimationFrame(this.#K);this.#K=requestAnimationFrame(()=>{this.#W()})}),this.#j.observe(Q,{attributes:!0,attributeFilter:["style","class","transform"]})}#Y(){if(this.#K)cancelAnimationFrame(this.#K),this.#K=null;if(this.#j)this.#j.disconnect(),this.#j=null}hidePopupOutsideClick(Q){if(this.isOpen&&!this.popup.contains(Q.target))this.hidePopup()}#B(Q){if(!this.#Z)this.hidePopup()}#X(Q){if(this.action==="hover")this.#Z=!0,clearTimeout(this.#q),this.showDelayedPopup()}#O(Q){if(this.action==="hover"&&this.#Z)clearTimeout(this.#q),this.#q=setTimeout(()=>{this.#Z=!1,this.hidePopup()},150)}#N(Q){if(this.action==="hover"&&this.#Z)clearTimeout(this.#q),this.#q=setTimeout(()=>{this.#Z=!1,this.hidePopup()},300)}#L(Q){if(this.action==="hover"&&this.#Z)this.#Z=!1,clearTimeout(this.#q),this.hidePopup()}static get observedAttributes(){return["action","delay","open"]}get open(){return this.hasAttribute("open")&&this.getAttribute("open")==="true"}set open(Q){this.setAttribute("open",Q)}attributeChangedCallback(Q,$,J){if(Q==="action")this.action=J;if(Q==="delay"){let Z=parseInt(J);this.delay=!isNaN(Z)?Z:500}if(Q==="open")if(J==="true")requestAnimationFrame(()=>{this.showDelayedPopup()});else requestAnimationFrame(()=>{this.hidePopup()})}#U(Q){if(!this.isOpen)return;const $=Q.target;if(this.popup&&this.popup.contains($))return;if($.tagName==="SELECT"||$.hasAttribute("popover")||$.closest("dialog"))this.hidePopup()}}customElements.define("fig-tooltip",x);class Q0 extends HTMLDialogElement{#Q=!1;#$=!1;#J={x:0,y:0};#_={x:0,y:0};#q;#Z;#j;#K=16;#W=!1;#G=3;constructor(){super();this.#q=this.#L.bind(this),this.#Z=this.#U.bind(this),this.#j=this.#D.bind(this)}connectedCallback(){this.modal=this.hasAttribute("modal")&&this.getAttribute("modal")!=="false",this.drag=this.hasAttribute("drag")&&this.getAttribute("drag")!=="false",requestAnimationFrame(()=>{this.#Y(),this.#X(),this.#B()})}disconnectedCallback(){this.#O()}#Y(){this.querySelectorAll("fig-button[close-dialog]").forEach((Q)=>{Q.removeEventListener("click",this.close),Q.addEventListener("click",this.close.bind(this))})}#B(){const Q=this.getAttribute("position")||"";this.style.position="fixed",this.style.transform="none",this.style.top="auto",this.style.bottom="auto",this.style.left="auto",this.style.right="auto",this.style.margin="0";const $=Q.includes("top"),J=Q.includes("bottom"),Z=Q.includes("left"),_=Q.includes("right"),j=Q.includes("center")&&!$&&!J,q=Q.includes("center")&&!Z&&!_;if($)this.style.top=`${this.#K}px`;else if(J)this.style.bottom=`${this.#K}px`;else if(j)this.style.top="0",this.style.bottom="0";if(Z)this.style.left=`${this.#K}px`;else if(_)this.style.right=`${this.#K}px`;else if(q)this.style.left="0",this.style.right="0";if(j&&q)this.style.margin="auto";else if(j)this.style.marginTop="auto",this.style.marginBottom="auto";else if(q)this.style.marginLeft="auto",this.style.marginRight="auto";this.#W=!0}#X(){if(this.drag){this.addEventListener("pointerdown",this.#q);const Q=this.getAttribute("handle"),$=Q?this.querySelector(Q):this.querySelector("fig-header, header");if($)$.style.cursor="grab"}}#O(){this.removeEventListener("pointerdown",this.#q),document.removeEventListener("pointermove",this.#Z),document.removeEventListener("pointerup",this.#j)}#N(Q){const $=["input","button","select","textarea","a","label","details","summary",'[contenteditable="true"]',"[tabindex]"],J=["FIG-HEADER","FIG-DIALOG","FIG-FIELD","FIG-TOOLTIP","FIG-CONTENT","FIG-TABS","FIG-TAB","FIG-POPOVER","FIG-SHIMMER","FIG-LAYER","FIG-FILL-PICKER"],Z=(j)=>$.some((q)=>j.matches?.(q))||j.tagName?.startsWith("FIG-")&&!J.includes(j.tagName);if(Z(Q))return!0;let _=Q.parentElement;while(_&&_!==this){if(Z(_))return!0;_=_.parentElement}return!1}#L(Q){if(!this.drag)return;if(this.#N(Q.target))return;const $=this.getAttribute("handle");if($&&$.trim()){const Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this.#$=!0,this.#J.x=Q.clientX,this.#J.y=Q.clientY;const J=this.getBoundingClientRect();this.#_.x=Q.clientX-J.left,this.#_.y=Q.clientY-J.top,document.addEventListener("pointermove",this.#Z),document.addEventListener("pointerup",this.#j)}#U(Q){if(this.#$&&!this.#Q){const $=Math.abs(Q.clientX-this.#J.x),J=Math.abs(Q.clientY-this.#J.y);if($>this.#G||J>this.#G){this.#Q=!0,this.#$=!1,this.setPointerCapture(Q.pointerId),this.style.cursor="grabbing";const Z=this.getBoundingClientRect();this.style.top=`${Z.top}px`,this.style.left=`${Z.left}px`,this.style.bottom="auto",this.style.right="auto",this.style.margin="0"}}if(!this.#Q)return;this.style.left=`${Q.clientX-this.#_.x}px`,this.style.top=`${Q.clientY-this.#_.y}px`,Q.preventDefault()}#D(Q){if(this.#Q)this.releasePointerCapture(Q.pointerId),this.style.cursor="";this.#Q=!1,this.#$=!1,document.removeEventListener("pointermove",this.#Z),document.removeEventListener("pointerup",this.#j),Q.preventDefault()}static get observedAttributes(){return["modal","drag","position","handle"]}attributeChangedCallback(Q,$,J){if(Q==="drag")if(this.drag=J!==null&&J!=="false",this.drag)this.#X();else{this.#O();const Z=this.querySelector("fig-header, header");if(Z)Z.style.cursor=""}if(Q==="position"&&this.#W)this.#B()}}c("fig-dialog",Q0,{extends:"dialog"});class $0 extends HTMLDialogElement{_anchorObserver=null;_contentObserver=null;_mutationObserver=null;_anchorTrackRAF=null;_lastAnchorRect=null;_isPopupActive=!1;_boundReposition;_boundScroll;_boundOutsidePointerDown;_rafId=null;_anchorRef=null;_isDragging=!1;_dragPending=!1;_dragStartPos={x:0,y:0};_dragOffset={x:0,y:0};_dragThreshold=3;_boundPointerDown;_boundPointerMove;_boundPointerUp;_wasDragged=!1;constructor(){super();this._boundReposition=this.queueReposition.bind(this),this._boundScroll=(Q)=>{if(this.open&&!this.contains(Q.target)&&this.shouldAutoReposition())this.queueReposition()},this._boundOutsidePointerDown=this.handleOutsidePointerDown.bind(this),this._boundPointerDown=this.handlePointerDown.bind(this),this._boundPointerMove=this.handlePointerMove.bind(this),this._boundPointerUp=this.handlePointerUp.bind(this)}ensureInitialized(){if(typeof this._anchorObserver==="undefined")this._anchorObserver=null;if(typeof this._contentObserver==="undefined")this._contentObserver=null;if(typeof this._mutationObserver==="undefined")this._mutationObserver=null;if(typeof this._anchorTrackRAF==="undefined")this._anchorTrackRAF=null;if(typeof this._lastAnchorRect==="undefined")this._lastAnchorRect=null;if(typeof this._isPopupActive==="undefined")this._isPopupActive=!1;if(typeof this._rafId==="undefined")this._rafId=null;if(typeof this._anchorRef==="undefined")this._anchorRef=null;if(typeof this._isDragging==="undefined")this._isDragging=!1;if(typeof this._dragPending==="undefined")this._dragPending=!1;if(typeof this._dragStartPos==="undefined")this._dragStartPos={x:0,y:0};if(typeof this._dragOffset==="undefined")this._dragOffset={x:0,y:0};if(typeof this._dragThreshold!=="number")this._dragThreshold=3;if(typeof this._wasDragged==="undefined")this._wasDragged=!1;if(typeof this._boundReposition!=="function")this._boundReposition=this.queueReposition.bind(this);if(typeof this._boundScroll!=="function")this._boundScroll=(Q)=>{if(this.open&&!this.contains(Q.target)&&this.shouldAutoReposition())this.queueReposition()};if(typeof this._boundOutsidePointerDown!=="function")this._boundOutsidePointerDown=this.handleOutsidePointerDown.bind(this);if(typeof this._boundPointerDown!=="function")this._boundPointerDown=this.handlePointerDown.bind(this);if(typeof this._boundPointerMove!=="function")this._boundPointerMove=this.handlePointerMove.bind(this);if(typeof this._boundPointerUp!=="function")this._boundPointerUp=this.handlePointerUp.bind(this)}static get observedAttributes(){return["open","anchor","position","offset","variant","theme","drag","handle","autoresize","viewport-margin"]}get open(){return this.hasAttribute("open")&&this.getAttribute("open")!=="false"}set open(Q){if(Q===!1||Q==="false"||Q===null){if(!this.open)return;this.removeAttribute("open");return}if(this.open)return;this.setAttribute("open","true")}get anchor(){return this._anchorRef??this.getAttribute("anchor")}set anchor(Q){if(Q instanceof Element)this._anchorRef=Q;else if(typeof Q==="string")this._anchorRef=null,this.setAttribute("anchor",Q);else this._anchorRef=null;if(this.open)this.queueReposition()}connectedCallback(){if(this.ensureInitialized(),!this.hasAttribute("position"))this.setAttribute("position","top center");if(!this.hasAttribute("role"))this.setAttribute("role","dialog");if(!this.hasAttribute("closedby"))this.setAttribute("closedby","any");if(this.drag=this.hasAttribute("drag")&&this.getAttribute("drag")!=="false",this.addEventListener("close",()=>{if(this.teardownObservers(),this.hasAttribute("open"))this.removeAttribute("open")}),requestAnimationFrame(()=>{this.setupDragListeners()}),this.open)this.showPopup();else this.hidePopup()}disconnectedCallback(){if(this.ensureInitialized(),this.teardownObservers(),this.removeDragListeners(),document.removeEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._rafId!==null)cancelAnimationFrame(this._rafId),this._rafId=null}attributeChangedCallback(Q,$,J){if(this.ensureInitialized(),$===J)return;if(Q==="open"){if(J===null||J==="false"){this.hidePopup();return}this.showPopup();return}if(Q==="drag"){if(this.drag=J!==null&&J!=="false",this.drag)this.setupDragListeners();else this.removeDragListeners();return}if(this.open)this.queueReposition(),this.setupObservers()}showPopup(){if(this._isPopupActive){this.queueReposition();return}if(this.style.position="fixed",this.style.inset="auto",this.style.margin="0",this.style.zIndex=String(n()+1),!super.open)try{this.show()}catch($){}this.setupObservers(),document.addEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._wasDragged=!1,this.queueReposition(),this._isPopupActive=!0;const Q=this.resolveAnchor();if(Q)Q.classList.add("has-popup-open")}hidePopup(){const Q=this.resolveAnchor();if(Q)Q.classList.remove("has-popup-open");if(this._isPopupActive=!1,this._wasDragged=!1,this.teardownObservers(),document.removeEventListener("pointerdown",this._boundOutsidePointerDown,!0),super.open)try{this.close()}catch($){}}get autoresize(){const Q=this.getAttribute("autoresize");return Q===null||Q!=="false"}setupObservers(){this.teardownObservers();const Q=this.resolveAnchor();if(Q&&"ResizeObserver"in window)this._anchorObserver=new ResizeObserver(this._boundReposition),this._anchorObserver.observe(Q);if(this.autoresize){if("ResizeObserver"in window)this._contentObserver=new ResizeObserver(this._boundReposition),this._contentObserver.observe(this);this._mutationObserver=new MutationObserver(this._boundReposition),this._mutationObserver.observe(this,{childList:!0,subtree:!0,characterData:!0})}window.addEventListener("resize",this._boundReposition),window.addEventListener("scroll",this._boundScroll,{capture:!0,passive:!0}),this.startAnchorTracking()}teardownObservers(){if(this._anchorObserver)this._anchorObserver.disconnect(),this._anchorObserver=null;if(this._contentObserver)this._contentObserver.disconnect(),this._contentObserver=null;if(this._mutationObserver)this._mutationObserver.disconnect(),this._mutationObserver=null;window.removeEventListener("resize",this._boundReposition),window.removeEventListener("scroll",this._boundScroll,{capture:!0,passive:!0}),this.stopAnchorTracking()}readRectSnapshot(Q){if(!Q)return null;const $=Q.getBoundingClientRect();return{x:$.x,y:$.y,width:$.width,height:$.height}}hasRectChanged(Q,$,J=0.25){if(!Q&&!$)return!1;if(!Q||!$)return!0;return Math.abs(Q.x-$.x)>J||Math.abs(Q.y-$.y)>J||Math.abs(Q.width-$.width)>J||Math.abs(Q.height-$.height)>J}startAnchorTracking(){if(this.stopAnchorTracking(),!this.open)return;const Q=()=>{if(!this.open){this._anchorTrackRAF=null;return}const $=this.resolveAnchor(),J=this.readRectSnapshot($),Z=this.shouldAutoReposition();if(Z&&this.hasRectChanged(this._lastAnchorRect,J))this._lastAnchorRect=J,this.queueReposition();else if(!Z)this._lastAnchorRect=J;this._anchorTrackRAF=requestAnimationFrame(Q)};this._lastAnchorRect=this.readRectSnapshot(this.resolveAnchor()),this._anchorTrackRAF=requestAnimationFrame(Q)}stopAnchorTracking(){if(this._anchorTrackRAF!==null)cancelAnimationFrame(this._anchorTrackRAF),this._anchorTrackRAF=null;this._lastAnchorRect=null}handleOutsidePointerDown(Q){if(!this.open||!super.open)return;const $=this.getAttribute("closedby");if($==="none"||$==="closerequest")return;const J=Q.target;if(!(J instanceof Node))return;if(this.contains(J))return;const Z=this.resolveAnchor();if(Z&&Z.contains(J))return;if(this.isInsideDescendantPopup(J))return;this.open=!1}isInsideDescendantPopup(Q){const $=Q.closest?.('dialog[is="fig-popup"]');if(!$||$===this)return!1;let J=$;const Z=new Set;while(J&&!Z.has(J)){Z.add(J);const _=J.anchor;if(!(_ instanceof Element))break;if(this.contains(_))return!0;J=_.closest?.('dialog[is="fig-popup"]')}return!1}setupDragListeners(){if(this.drag)this.addEventListener("pointerdown",this._boundPointerDown)}removeDragListeners(){this.removeEventListener("pointerdown",this._boundPointerDown),document.removeEventListener("pointermove",this._boundPointerMove),document.removeEventListener("pointerup",this._boundPointerUp)}isInteractiveElement(Q){const $=["input","button","select","textarea","a","label","details","summary",'[contenteditable="true"]',"[tabindex]"],J=["FIG-HEADER","FIG-DIALOG","FIG-POPUP","FIG-FIELD","FIG-TOOLTIP","FIG-CONTENT","FIG-TABS","FIG-TAB","FIG-POPOVER","FIG-SHIMMER","FIG-LAYER","FIG-FILL-PICKER"],Z=(j)=>$.some((q)=>j.matches?.(q))||j.tagName?.startsWith("FIG-")&&!J.includes(j.tagName);if(Z(Q))return!0;let _=Q.parentElement;while(_&&_!==this){if(Z(_))return!0;_=_.parentElement}return!1}handlePointerDown(Q){if(!this.drag)return;if(this.isInteractiveElement(Q.target))return;const $=this.getAttribute("handle");if($&&$.trim()){const Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this._dragPending=!0,this._dragStartPos.x=Q.clientX,this._dragStartPos.y=Q.clientY;const J=this.getBoundingClientRect();this._dragOffset.x=Q.clientX-J.left,this._dragOffset.y=Q.clientY-J.top,document.addEventListener("pointermove",this._boundPointerMove),document.addEventListener("pointerup",this._boundPointerUp)}handlePointerMove(Q){if(this._dragPending&&!this._isDragging){const $=Math.abs(Q.clientX-this._dragStartPos.x),J=Math.abs(Q.clientY-this._dragStartPos.y);if($>this._dragThreshold||J>this._dragThreshold){this._isDragging=!0,this._dragPending=!1,this._wasDragged=!0,this.setPointerCapture(Q.pointerId),this.style.cursor="grabbing";const Z=this.getBoundingClientRect();this.style.top=`${Z.top}px`,this.style.left=`${Z.left}px`,this.style.bottom="auto",this.style.right="auto",this.style.margin="0"}}if(!this._isDragging)return;this.style.left=`${Q.clientX-this._dragOffset.x}px`,this.style.top=`${Q.clientY-this._dragOffset.y}px`,Q.preventDefault()}handlePointerUp(Q){if(this._isDragging)this.releasePointerCapture(Q.pointerId),this.style.cursor="";this._isDragging=!1,this._dragPending=!1,document.removeEventListener("pointermove",this._boundPointerMove),document.removeEventListener("pointerup",this._boundPointerUp),Q.preventDefault()}resolveAnchor(){if(this._anchorRef)return this._anchorRef;const Q=this.getAttribute("anchor");if(!Q)return null;const $=this.parentElement;if($?.querySelector){const J=$.querySelector(Q);if(J&&!this.contains(J))return J}return document.querySelector(Q)}parsePosition(){const $=(this.getAttribute("position")||"top center").trim().toLowerCase().split(/\s+/).filter(Boolean),J=new Set(["top","center","bottom"]),Z=new Set(["left","center","right"]);let _="top",j="center",q=null;if($.length>=2){if(J.has($[0]))_=$[0];if(Z.has($[1]))j=$[1];return{vertical:_,horizontal:j,shorthand:q}}if($.length===1){const K=$[0];if(K==="top"||K==="bottom")_=K,q=K;else if(K==="left"||K==="right")j=K,q=K;else if(K==="center")_="center",j="center"}return{vertical:_,horizontal:j,shorthand:q}}normalizeOffsetToken(Q,$="0px"){if(!Q)return $;const J=Q.trim();if(!J)return $;if(/^-?\d+(\.\d+)?$/.test(J))return`${J}px`;return J}measureLengthPx(Q,$="x"){if(!Q)return 0;const J=this.normalizeOffsetToken(Q,"0px");if(J.endsWith("px")){const j=parseFloat(J);return Number.isFinite(j)?j:0}const Z=document.createElement("div");if(Z.style.position="fixed",Z.style.visibility="hidden",Z.style.pointerEvents="none",Z.style.left="0",Z.style.top="0",Z.style.margin="0",Z.style.padding="0",Z.style.border="0",$==="x")Z.style.width=J,Z.style.height="0";else Z.style.height=J,Z.style.width="0";document.body.appendChild(Z);const _=Z.getBoundingClientRect();return Z.remove(),$==="x"?_.width:_.height}parseOffset(){const $=(this.getAttribute("offset")||"0 0").trim().split(/\s+/).filter(Boolean),J=this.normalizeOffsetToken($[0],"0px"),Z=this.normalizeOffsetToken($[1],"0px");return{xToken:J,yToken:Z,xPx:this.measureLengthPx(J,"x"),yPx:this.measureLengthPx(Z,"y")}}parseViewportMargins(){const $=(this.getAttribute("viewport-margin")||"8").trim().split(/\s+/).map(Number).filter((Z)=>!Number.isNaN(Z));if($.length===0)return{top:8,right:8,bottom:8,left:8};if($.length===1)return{top:$[0],right:$[0],bottom:$[0],left:$[0]};if($.length===2)return{top:$[0],right:$[1],bottom:$[0],left:$[1]};if($.length===3)return{top:$[0],right:$[1],bottom:$[2],left:$[1]};return{top:$[0],right:$[1],bottom:$[2],left:$[3]}}getPlacementCandidates(Q,$,J){const Z={top:"bottom",bottom:"top",left:"right",right:"left",center:"center"};if(J){const j=J==="left"||J==="right"?["top","bottom"]:["left","right"];return[{v:Q,h:$,s:J},{v:Q,h:$,s:Z[J]},{v:Q,h:$,s:j[0]},{v:Q,h:$,s:j[1]}]}if(Q==="center")return[{v:"center",h:$,s:null},{v:"center",h:Z[$],s:null},{v:"top",h:$,s:null},{v:"bottom",h:$,s:null},{v:"top",h:Z[$],s:null},{v:"bottom",h:Z[$],s:null}];if($==="center")return[{v:Q,h:"center",s:null},{v:Z[Q],h:"center",s:null},{v:Q,h:"left",s:null},{v:Q,h:"right",s:null},{v:Z[Q],h:"left",s:null},{v:Z[Q],h:"right",s:null}];return[{v:Q,h:$,s:null},{v:Z[Q],h:$,s:null},{v:Q,h:Z[$],s:null},{v:Z[Q],h:Z[$],s:null}]}computeCoords(Q,$,J,Z,_,j){let q,K;if(j==="left"||j==="right")return K=j==="left"?Q.left-$.width-_.xPx:Q.right+_.xPx,q=Q.top,{top:q,left:K};if(j==="top"||j==="bottom")return q=j==="top"?Q.top-$.height-_.yPx:Q.bottom+_.yPx,K=Q.left,{top:q,left:K};if(J==="top")q=Q.top-$.height-_.yPx;else if(J==="bottom")q=Q.bottom+_.yPx;else q=Q.top+(Q.height-$.height)/2;if(J==="center")if(Z==="left")K=Q.left-$.width-_.xPx;else if(Z==="right")K=Q.right+_.xPx;else K=Q.left+(Q.width-$.width)/2;else if(Z==="left")K=Q.left+_.xPx;else if(Z==="right")K=Q.right-$.width-_.xPx;else K=Q.left+(Q.width-$.width)/2;return{top:q,left:K}}oppositeSide(Q){return{top:"bottom",bottom:"top",left:"right",right:"left"}[Q]||"bottom"}getPlacementSide(Q,$,J){if(J==="top")return"top";if(J==="bottom")return"bottom";if(J==="left")return"left";if(J==="right")return"right";if(Q!=="center")return Q;if($!=="center")return $;return"top"}updatePopoverBeak(Q,$,J,Z,_){if(this.getAttribute("variant")!=="popover"||!Q){this.style.removeProperty("--beak-offset"),this.removeAttribute("data-beak-side");return}const j=this.oppositeSide(_);this.setAttribute("data-beak-side",j);const q=Q.left+Q.width/2,K=Q.top+Q.height/2,X=this.getBoundingClientRect(),W=X.width>0&&X.height>0?X:$,L=W.left,U=W.top,G=10;let O;if(j==="top"||j==="bottom"){O=q-L;const B=G,D=Math.max(B,W.width-G);O=Math.min(D,Math.max(B,O))}else{O=K-U;const B=G,D=Math.max(B,W.height-G);O=Math.min(D,Math.max(B,O))}this.style.setProperty("--beak-offset",`${O}px`)}overflowScore(Q,$,J){const{innerWidth:Z,innerHeight:_}=window,j=Q.left+$.width,q=Q.top+$.height,K=Math.max(0,J.left-Q.left),X=Math.max(0,J.top-Q.top),W=Math.max(0,j-(Z-J.right)),L=Math.max(0,q-(_-J.bottom));return K+X+W+L}fits(Q,$,J){return this.overflowScore(Q,$,J)===0}clamp(Q,$,J){const{left:Z,top:_}=J,j=Math.max(J.left,window.innerWidth-$.width-J.right),q=Math.max(J.top,window.innerHeight-$.height-J.bottom);return{left:Math.min(j,Math.max(Z,Q.left)),top:Math.min(q,Math.max(_,Q.top))}}positionPopup(){if(!this.open||!super.open)return;const Q=this.getBoundingClientRect(),$=this.parseOffset(),{vertical:J,horizontal:Z,shorthand:_}=this.parsePosition(),j=this.resolveAnchor(),q=this.parseViewportMargins();if(!j){this.updatePopoverBeak(null,Q,0,0,"top");const O={left:q.left+(window.innerWidth-q.right-q.left-Q.width)/2,top:q.top+(window.innerHeight-q.bottom-q.top-Q.height)/2},B=this.clamp(O,Q,q);this.style.left=`${B.left}px`,this.style.top=`${B.top}px`;return}const K=j.getBoundingClientRect(),X=this.getPlacementCandidates(J,Z,_);let W=null,L="top",U=Number.POSITIVE_INFINITY;for(let{v:O,h:B,s:D}of X){const F=this.computeCoords(K,Q,O,B,$,D),P=this.getPlacementSide(O,B,D);if(D){const E=this.clamp(F,Q,q);if(D==="left"||D==="right"?F.left>=q.left&&F.left+Q.width<=window.innerWidth-q.right:F.top>=q.top&&F.top+Q.height<=window.innerHeight-q.bottom){this.style.left=`${E.left}px`,this.style.top=`${E.top}px`,this.updatePopoverBeak(K,Q,E.left,E.top,P);return}const S=this.overflowScore(F,Q,q);if(S<U)U=S,W=E,L=P}else{if(this.fits(F,Q,q)){this.style.left=`${F.left}px`,this.style.top=`${F.top}px`,this.updatePopoverBeak(K,Q,F.left,F.top,P);return}const E=this.overflowScore(F,Q,q);if(E<U)U=E,W=F,L=P}}const G=this.clamp(W||{left:0,top:0},Q,q);this.style.left=`${G.left}px`,this.style.top=`${G.top}px`,this.updatePopoverBeak(K,Q,G.left,G.top,L)}queueReposition(){if(!this.open||!this.shouldAutoReposition())return;if(this._rafId!==null)return;this._rafId=requestAnimationFrame(()=>{this._rafId=null,this.positionPopup()})}shouldAutoReposition(){if(!(this.drag&&this._wasDragged))return!0;return!this.resolveAnchor()}}c("fig-popup",$0,{extends:"dialog"});class J0 extends HTMLElement{#Q;constructor(){super();this.content=null,this.#Q=!1}connectedCallback(){this.setAttribute("label",this.innerText),this.setAttribute("role","tab"),this.setAttribute("tabindex","0"),this.addEventListener("click",this.handleClick.bind(this)),requestAnimationFrame(()=>{if(typeof this.getAttribute("content")==="string"){if(this.content=document.querySelector(this.getAttribute("content")),this.content)if(this.content.setAttribute("role","tabpanel"),this.#Q)this.content.style.display="block",this.setAttribute("aria-selected","true");else this.content.style.display="none",this.setAttribute("aria-selected","false")}})}get selected(){return this.#Q}set selected(Q){this.setAttribute("selected",Q?"true":"false")}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}handleClick(){if(this.selected=!0,this.content)this.content.style.display="block"}static get observedAttributes(){return["selected"]}attributeChangedCallback(Q,$,J){if(Q==="selected"){if(this.#Q=J!==null&&J!=="false",this.setAttribute("aria-selected",this.#Q?"true":"false"),this?.content)this.content.style.display=this.#Q?"block":"none"}}}customElements.define("fig-tab",J0);class Z0 extends HTMLElement{constructor(){super()}static get observedAttributes(){return["value","name","disabled"]}connectedCallback(){this.name=this.getAttribute("name")||"tabs",this.setAttribute("role","tablist"),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.#$.bind(this));const Q=this.getAttribute("value");if(Q)this.#J(Q);if(this.hasAttribute("disabled"))this.#Q(!0)}#Q(Q){this.querySelectorAll("fig-tab").forEach((J)=>{if(Q)J.setAttribute("disabled",""),J.setAttribute("aria-disabled","true"),J.setAttribute("tabindex","-1");else J.removeAttribute("disabled"),J.removeAttribute("aria-disabled"),J.setAttribute("tabindex","0")})}disconnectedCallback(){this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.#$)}#$(Q){const $=Array.from(this.querySelectorAll("fig-tab")),J=$.findIndex((_)=>_.hasAttribute("selected"));let Z=J;switch(Q.key){case"ArrowLeft":case"ArrowUp":Q.preventDefault(),Z=J>0?J-1:$.length-1;break;case"ArrowRight":case"ArrowDown":Q.preventDefault(),Z=J<$.length-1?J+1:0;break;case"Home":Q.preventDefault(),Z=0;break;case"End":Q.preventDefault(),Z=$.length-1;break;default:return}if(Z!==J&&$[Z])$.forEach((_)=>_.removeAttribute("selected")),this.selectedTab=$[Z],this.setAttribute("value",$[Z].getAttribute("value")||""),$[Z].focus()}get value(){return this.selectedTab?.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q)}#J(Q){const $=this.querySelectorAll("fig-tab");for(let J of $)if(J.getAttribute("value")===Q)this.selectedTab=J;else J.removeAttribute("selected")}attributeChangedCallback(Q,$,J){switch(Q){case"value":if(J!==$)this.#J(J);break;case"disabled":this.#Q(J!==null&&J!=="false");break}}handleClick(Q){if(this.hasAttribute("disabled"))return;const $=Q.target;if($.nodeName.toLowerCase()==="fig-tab"){const J=this.querySelectorAll("fig-tab");for(let Z of J)if(Z===$)this.selectedTab=Z,this.setAttribute("value",Z.getAttribute("value")||"");else Z.removeAttribute("selected")}}}customElements.define("fig-tabs",Z0);class _0 extends HTMLElement{#Q;#$;constructor(){super()}connectedCallback(){this.addEventListener("click",this.handleClick.bind(this))}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}handleClick(){const Q=this.closest("fig-segmented-control");if(Q&&Q.hasAttribute("disabled")&&Q.getAttribute("disabled")!=="false")return;this.setAttribute("selected","true")}get value(){return this.#Q}set value(Q){this.#Q=Q,this.setAttribute("value",Q)}get selected(){return this.#$}set selected(Q){this.#$=Q,this.setAttribute("selected",Q)}static get observedAttributes(){return["selected","value"]}attributeChangedCallback(Q,$,J){switch(Q){case"value":this.#Q=J;break;case"selected":this.#$=J;break}}}customElements.define("fig-segment",_0);class j0 extends HTMLElement{#Q=null;constructor(){super()}static get observedAttributes(){return["disabled"]}connectedCallback(){this.name=this.getAttribute("name")||"segmented-control",this.addEventListener("click",this.handleClick.bind(this)),this.#$(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),requestAnimationFrame(()=>{const Q=this.querySelectorAll("fig-segment");if(!Array.from(Q).some((J)=>J.hasAttribute("selected"))&&Q.length>0)this.selectedSegment=Q[0]})}get selectedSegment(){return this.#Q}set selectedSegment(Q){if(this.#Q)this.#Q.removeAttribute("selected");if(this.#Q=Q,Q)Q.setAttribute("selected","true")}handleClick(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;const $=Q.target.closest("fig-segment");if($){const J=this.querySelectorAll("fig-segment");for(let Z of J)if(Z===$)this.selectedSegment=Z;else Z.removeAttribute("selected")}}#$(Q){this.setAttribute("aria-disabled",Q?"true":"false"),this.querySelectorAll("fig-segment").forEach(($)=>{if(Q)$.setAttribute("disabled",""),$.setAttribute("aria-disabled","true");else $.removeAttribute("disabled"),$.removeAttribute("aria-disabled")})}attributeChangedCallback(Q,$,J){if(Q==="disabled"&&$!==J)this.#$(J!==null&&J!=="false")}}customElements.define("fig-segmented-control",j0);class q0 extends HTMLElement{#Q=!1;#$=!1;#J={range:{min:0,max:100,step:1},hue:{min:0,max:255,step:1},delta:{min:-100,max:100,step:1},stepper:{min:0,max:100,step:25},opacity:{min:0,max:100,step:0.1,color:"#FF0000"}};#_;#q;#Z;#j;constructor(){super();this.initialInnerHTML=this.innerHTML,this.#_=(Q)=>{Q.stopPropagation(),this.#D()},this.#q=(Q)=>{Q.stopPropagation(),this.#A()},this.#Z=(Q)=>{Q.stopPropagation(),this.#W()},this.#j=(Q)=>{Q.stopPropagation(),this.#M()}}#K(){const Q=this.getAttribute("value");this.type=this.getAttribute("type")||"range",this.variant=this.getAttribute("variant")||"default",this.text=this.hasAttribute("text")&&this.getAttribute("text")!=="false",this.units=this.getAttribute("units")||"",this.transform=Number(this.getAttribute("transform")||1),this.disabled=this.getAttribute("disabled")?!0:!1,this.precision=this.hasAttribute("precision")?Number(this.getAttribute("precision")):null,this.placeholder=this.getAttribute("placeholder")!==null?this.getAttribute("placeholder"):"##";const $=this.#J[this.type];if(this.min=Number(this.getAttribute("min")||$.min),this.max=Number(this.getAttribute("max")||$.max),this.step=Number(this.getAttribute("step")||$.step),this.color=this.getAttribute("color")||$?.color,this.default=this.hasAttribute("default")?this.getAttribute("default"):this.type==="delta"?0:this.min,this.#$=Q===null||typeof Q==="string"&&Q.trim()==="",this.value=this.#N(Q),this.color)this.style.setProperty("--color",this.color);let J="",Z=`<div class="fig-slider-input-container" role="group">
+            `,this.#Q=this.hasAttribute("selected")&&this.getAttribute("selected")!=="false",requestAnimationFrame(()=>{this.button=this.shadowRoot.querySelector("button"),this.button.addEventListener("click",this.#$.bind(this)),this.button.addEventListener("focus",()=>{if(this.button.matches(":focus-visible"))this.setAttribute("data-focus-visible","")}),this.button.addEventListener("blur",()=>{this.removeAttribute("data-focus-visible")})})}get type(){return this.getAttribute("type")||"button"}set type(Q){this.setAttribute("type",Q)}get selected(){return this.#Q}set selected(Q){this.setAttribute("selected",Q)}#$(){if(this.type==="toggle")this.toggleAttribute("selected",!this.hasAttribute("selected"));if(this.type==="submit"){let Q=this.closest("form");if(Q)Q.submit()}if(this.type==="link"){const Q=this.getAttribute("href"),$=this.getAttribute("target");if(Q)if($)window.open(Q,$);else window.location.href=Q}}static get observedAttributes(){return["disabled","selected"]}attributeChangedCallback(Q,$,J){if(this.button)switch(this.button[Q]=J,Q){case"disabled":this.disabled=this.button.disabled=J!==null&&J!=="false";break;case"type":this.type=J,this.button.type=this.type,this.button.setAttribute("type",this.type);break;case"selected":this.#Q=J==="true";break}}}customElements.define("fig-button",a);class e extends HTMLElement{#Q="Menu";#$=null;#J;#_;#q=!1;#Z=null;get label(){return this.#Q}set label(Q){this.#Q=Q}constructor(){super();this.select=document.createElement("select"),this.optionsSlot=document.createElement("slot"),this.attachShadow({mode:"open"}),this.#J=this.#W.bind(this),this.#_=this.#N.bind(this)}#j(){if(typeof CSS==="undefined"||typeof CSS.supports!=="function")return!1;try{return CSS.supports("appearance: base-select")&&CSS.supports("selector(::picker(select))")}catch{return!1}}#K(){if(!(this.getAttribute("experimental")||"").split(/\s+/).filter(Boolean).includes("modern")||!this.#j()){this.#q=!1;return}const J=document.createElement("button");J.setAttribute("type","button"),J.setAttribute("aria-hidden","true");const Z=document.createElement("selectedcontent");J.appendChild(Z),this.select.appendChild(J),this.#q=!0,this.#Z=Z}#X(){if(!this.#Z)return;const Q=this.select.selectedOptions?.[0];if(!Q){this.#Z.textContent="";return}this.#Z.innerHTML=Q.innerHTML}#Y(){this.select.addEventListener("input",this.#J),this.select.addEventListener("change",this.#_)}#G(Q){if(!Q||!(Q instanceof Element))return!1;return!!Q.querySelector('fig-checkbox, fig-switch, input[type="checkbox"]')}#B(){if(typeof this.select.showPicker==="function")requestAnimationFrame(()=>{try{this.select.showPicker()}catch{}})}connectedCallback(){this.type=this.getAttribute("type")||"select",this.#Q=this.getAttribute("label")||this.#Q,this.select.setAttribute("aria-label",this.#Q),this.appendChild(this.select),this.shadowRoot.appendChild(this.optionsSlot),this.optionsSlot.addEventListener("slotchange",this.slotChange.bind(this)),this.#Y()}slotChange(){while(this.select.firstChild)this.select.firstChild.remove();if(this.#K(),this.type==="dropdown"){const Q=document.createElement("option");Q.setAttribute("hidden","true"),Q.setAttribute("selected","true"),Q.selected=!0,this.select.appendChild(Q)}if(this.optionsSlot.assignedNodes().forEach((Q)=>{if(Q.nodeName==="OPTION"||Q.nodeName==="OPTGROUP")this.select.appendChild(Q.cloneNode(!0))}),this.#O(this.value),this.#X(),this.type==="dropdown")this.select.selectedIndex=-1}#W(Q){const $=Q.target.selectedOptions?.[0];if(this.#G($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#B();return}const J=Q.target.value;if(this.type==="dropdown")this.#$=J;this.setAttribute("value",J),this.#X(),this.dispatchEvent(new CustomEvent("input",{detail:J,bubbles:!0,composed:!0}))}#N(Q){const $=Q.target.selectedOptions?.[0];if(this.#G($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#B();return}const J=this.type==="dropdown"?this.#$:this.select.value;if(this.type==="dropdown")this.select.selectedIndex=-1;this.#X(),this.dispatchEvent(new CustomEvent("change",{detail:J,bubbles:!0,composed:!0}))}focus(){this.select.focus()}blur(){this.select.blur()}get value(){if(this.type==="dropdown")return this.#$;return this.select?.value}set value(Q){if(this.type==="dropdown")this.#$=Q;this.setAttribute("value",Q)}static get observedAttributes(){return["value","type","experimental"]}#O(Q){if(this.type==="dropdown")return;if(this.select)this.select.querySelectorAll("option").forEach(($,J)=>{if($.value===this.getAttribute("value"))this.select.selectedIndex=J});this.#X()}attributeChangedCallback(Q,$,J){if(Q==="value")this.#O(J);if(Q==="type")this.type=J;if(Q==="experimental")this.slotChange();if(Q==="label")this.#Q=J,this.select.setAttribute("aria-label",this.#Q)}}customElements.define("fig-dropdown",e);class x extends HTMLElement{static#Q=0;static#$=500;#J;#_;#q;#Z=!1;#j=null;#K=null;constructor(){super();this.action=this.getAttribute("action")||"hover";let Q=parseInt(this.getAttribute("delay"));this.delay=!isNaN(Q)?Q:500,this.#J=this.#U.bind(this),this.#_=this.hidePopupOutsideClick.bind(this)}connectedCallback(){this.setup(),this.setupEventListeners()}disconnectedCallback(){if(this.destroy(),document.removeEventListener("mousedown",this.#J,!0),this.#G(),this.action==="click")document.body.removeEventListener("click",this.#_);if(clearTimeout(this.#q),this.action==="hover")this.removeEventListener("touchstart",this.#W),this.removeEventListener("touchmove",this.#N),this.removeEventListener("touchend",this.#O),this.removeEventListener("touchcancel",this.#L);else if(this.action==="click")this.removeEventListener("touchstart",this.showDelayedPopup)}setup(){this.style.display="contents"}render(){this.destroy();let Q=document.createElement("span");this.popup=document.createElement("span"),this.popup.setAttribute("class","fig-tooltip"),this.popup.setAttribute("role","tooltip");const $=V();if(this.popup.setAttribute("id",$),this.popup.style.position="fixed",this.popup.style.visibility="hidden",this.popup.style.display="inline-flex",this.popup.style.pointerEvents="none",this.popup.append(Q),Q.innerText=this.getAttribute("text"),this.firstElementChild)this.firstElementChild.setAttribute("aria-describedby",$);const J=this.closest("dialog");if(J&&J.open)J.append(this.popup);else document.body.append(this.popup);const Z=Q.childNodes[0];if(Z){const _=document.createRange();_.setStartBefore(Z),_.setEndAfter(Z);const j=_.getBoundingClientRect();Q.style.width=`${j.width}px`}}destroy(){if(this.#G(),this.popup)this.popup.remove();if(this.action==="click")document.body.removeEventListener("click",this.#_)}isTouchDevice(){return"ontouchstart"in window||navigator.maxTouchPoints>0||navigator.msMaxTouchPoints>0}setupEventListeners(){if(this.action==="hover"){if(!this.isTouchDevice())this.addEventListener("pointerenter",this.showDelayedPopup.bind(this)),this.addEventListener("pointerleave",this.#B.bind(this));this.addEventListener("touchstart",this.#W.bind(this),{passive:!0}),this.addEventListener("touchmove",this.#N.bind(this),{passive:!0}),this.addEventListener("touchend",this.#O.bind(this),{passive:!0}),this.addEventListener("touchcancel",this.#L.bind(this),{passive:!0})}else if(this.action==="click")this.addEventListener("click",this.showDelayedPopup.bind(this)),document.body.addEventListener("click",this.#_),this.addEventListener("touchstart",this.showDelayedPopup.bind(this),{passive:!0});document.addEventListener("mousedown",this.#J,!0)}getOffset(){const Q={left:8,top:4,right:8,bottom:4},$=this.getAttribute("offset");if(!$)return Q;const[J,Z,_,j]=$.split(",").map(Number);return{left:isNaN(J)?Q.left:J,top:isNaN(Z)?Q.top:Z,right:isNaN(_)?Q.right:_,bottom:isNaN(j)?Q.bottom:j}}showDelayedPopup(){this.render(),clearTimeout(this.timeout);const $=Date.now()-x.#Q<x.#$?0:this.delay;this.timeout=setTimeout(this.showPopup.bind(this),$)}showPopup(){this.#X(),this.popup.style.opacity="1",this.popup.style.visibility="visible",this.popup.style.display="block",this.popup.style.pointerEvents="all",this.popup.style.zIndex=n()+1,this.isOpen=!0,x.#Q=Date.now(),this.#Y()}#X(){if(!this.popup||!this.firstElementChild)return;const Q=this.firstElementChild.getBoundingClientRect(),$=this.popup.getBoundingClientRect(),J=this.getOffset();let Z=Q.top-$.height-J.top,_=Q.left+(Q.width-$.width)/2;if(this.popup.setAttribute("position","top"),Z<0)this.popup.setAttribute("position","bottom"),Z=Q.bottom+J.bottom;if(_<J.left)_=J.left;else if(_+$.width>window.innerWidth-J.right)_=window.innerWidth-$.width-J.right;const K=Q.left+Q.width/2-_;this.popup.style.setProperty("--beak-offset",`${K}px`),this.popup.style.top=`${Z}px`,this.popup.style.left=`${_}px`}hidePopup(){if(clearTimeout(this.timeout),clearTimeout(this.#q),this.#G(),this.popup)this.popup.style.opacity="0",this.popup.style.display="block",this.popup.style.pointerEvents="none",this.destroy();this.isOpen=!1,x.#Q=Date.now()}#Y(){this.#G();const Q=this.firstElementChild;if(!Q)return;this.#j=new MutationObserver(()=>{if(this.#K)cancelAnimationFrame(this.#K);this.#K=requestAnimationFrame(()=>{this.#X()})}),this.#j.observe(Q,{attributes:!0,attributeFilter:["style","class","transform"]})}#G(){if(this.#K)cancelAnimationFrame(this.#K),this.#K=null;if(this.#j)this.#j.disconnect(),this.#j=null}hidePopupOutsideClick(Q){if(this.isOpen&&!this.popup.contains(Q.target))this.hidePopup()}#B(Q){if(!this.#Z)this.hidePopup()}#W(Q){if(this.action==="hover")this.#Z=!0,clearTimeout(this.#q),this.showDelayedPopup()}#N(Q){if(this.action==="hover"&&this.#Z)clearTimeout(this.#q),this.#q=setTimeout(()=>{this.#Z=!1,this.hidePopup()},150)}#O(Q){if(this.action==="hover"&&this.#Z)clearTimeout(this.#q),this.#q=setTimeout(()=>{this.#Z=!1,this.hidePopup()},300)}#L(Q){if(this.action==="hover"&&this.#Z)this.#Z=!1,clearTimeout(this.#q),this.hidePopup()}static get observedAttributes(){return["action","delay","open"]}get open(){return this.hasAttribute("open")&&this.getAttribute("open")==="true"}set open(Q){this.setAttribute("open",Q)}attributeChangedCallback(Q,$,J){if(Q==="action")this.action=J;if(Q==="delay"){let Z=parseInt(J);this.delay=!isNaN(Z)?Z:500}if(Q==="open")if(J==="true")requestAnimationFrame(()=>{this.showDelayedPopup()});else requestAnimationFrame(()=>{this.hidePopup()})}#U(Q){if(!this.isOpen)return;const $=Q.target;if(this.popup&&this.popup.contains($))return;if($.tagName==="SELECT"||$.hasAttribute("popover")||$.closest("dialog"))this.hidePopup()}}customElements.define("fig-tooltip",x);class Q0 extends HTMLDialogElement{#Q=!1;#$=!1;#J={x:0,y:0};#_={x:0,y:0};#q;#Z;#j;#K=16;#X=!1;#Y=3;constructor(){super();this.#q=this.#L.bind(this),this.#Z=this.#U.bind(this),this.#j=this.#F.bind(this)}connectedCallback(){this.modal=this.hasAttribute("modal")&&this.getAttribute("modal")!=="false",this.drag=this.hasAttribute("drag")&&this.getAttribute("drag")!=="false",requestAnimationFrame(()=>{this.#G(),this.#W(),this.#B()})}disconnectedCallback(){this.#N()}#G(){this.querySelectorAll("fig-button[close-dialog]").forEach((Q)=>{Q.removeEventListener("click",this.close),Q.addEventListener("click",this.close.bind(this))})}#B(){const Q=this.getAttribute("position")||"";this.style.position="fixed",this.style.transform="none",this.style.top="auto",this.style.bottom="auto",this.style.left="auto",this.style.right="auto",this.style.margin="0";const $=Q.includes("top"),J=Q.includes("bottom"),Z=Q.includes("left"),_=Q.includes("right"),j=Q.includes("center")&&!$&&!J,q=Q.includes("center")&&!Z&&!_;if($)this.style.top=`${this.#K}px`;else if(J)this.style.bottom=`${this.#K}px`;else if(j)this.style.top="0",this.style.bottom="0";if(Z)this.style.left=`${this.#K}px`;else if(_)this.style.right=`${this.#K}px`;else if(q)this.style.left="0",this.style.right="0";if(j&&q)this.style.margin="auto";else if(j)this.style.marginTop="auto",this.style.marginBottom="auto";else if(q)this.style.marginLeft="auto",this.style.marginRight="auto";this.#X=!0}#W(){if(this.drag){this.addEventListener("pointerdown",this.#q);const Q=this.getAttribute("handle"),$=Q?this.querySelector(Q):this.querySelector("fig-header, header");if($)$.style.cursor="grab"}}#N(){this.removeEventListener("pointerdown",this.#q),document.removeEventListener("pointermove",this.#Z),document.removeEventListener("pointerup",this.#j)}#O(Q){const $=["input","button","select","textarea","a","label","details","summary",'[contenteditable="true"]',"[tabindex]"],J=["FIG-HEADER","FIG-DIALOG","FIG-FIELD","FIG-TOOLTIP","FIG-CONTENT","FIG-TABS","FIG-TAB","FIG-POPOVER","FIG-SHIMMER","FIG-LAYER","FIG-FILL-PICKER"],Z=(j)=>$.some((q)=>j.matches?.(q))||j.tagName?.startsWith("FIG-")&&!J.includes(j.tagName);if(Z(Q))return!0;let _=Q.parentElement;while(_&&_!==this){if(Z(_))return!0;_=_.parentElement}return!1}#L(Q){if(!this.drag)return;if(this.#O(Q.target))return;const $=this.getAttribute("handle");if($&&$.trim()){const Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this.#$=!0,this.#J.x=Q.clientX,this.#J.y=Q.clientY;const J=this.getBoundingClientRect();this.#_.x=Q.clientX-J.left,this.#_.y=Q.clientY-J.top,document.addEventListener("pointermove",this.#Z),document.addEventListener("pointerup",this.#j)}#U(Q){if(this.#$&&!this.#Q){const $=Math.abs(Q.clientX-this.#J.x),J=Math.abs(Q.clientY-this.#J.y);if($>this.#Y||J>this.#Y){this.#Q=!0,this.#$=!1,this.setPointerCapture(Q.pointerId),this.style.cursor="grabbing";const Z=this.getBoundingClientRect();this.style.top=`${Z.top}px`,this.style.left=`${Z.left}px`,this.style.bottom="auto",this.style.right="auto",this.style.margin="0"}}if(!this.#Q)return;this.style.left=`${Q.clientX-this.#_.x}px`,this.style.top=`${Q.clientY-this.#_.y}px`,Q.preventDefault()}#F(Q){if(this.#Q)this.releasePointerCapture(Q.pointerId),this.style.cursor="";this.#Q=!1,this.#$=!1,document.removeEventListener("pointermove",this.#Z),document.removeEventListener("pointerup",this.#j),Q.preventDefault()}static get observedAttributes(){return["modal","drag","position","handle"]}attributeChangedCallback(Q,$,J){if(Q==="drag")if(this.drag=J!==null&&J!=="false",this.drag)this.#W();else{this.#N();const Z=this.querySelector("fig-header, header");if(Z)Z.style.cursor=""}if(Q==="position"&&this.#X)this.#B()}}c("fig-dialog",Q0,{extends:"dialog"});class $0 extends HTMLDialogElement{_anchorObserver=null;_contentObserver=null;_mutationObserver=null;_anchorTrackRAF=null;_lastAnchorRect=null;_isPopupActive=!1;_boundReposition;_boundScroll;_boundOutsidePointerDown;_rafId=null;_anchorRef=null;_isDragging=!1;_dragPending=!1;_dragStartPos={x:0,y:0};_dragOffset={x:0,y:0};_dragThreshold=3;_boundPointerDown;_boundPointerMove;_boundPointerUp;_wasDragged=!1;constructor(){super();this._boundReposition=this.queueReposition.bind(this),this._boundScroll=(Q)=>{if(this.open&&!this.contains(Q.target)&&this.shouldAutoReposition())this.queueReposition()},this._boundOutsidePointerDown=this.handleOutsidePointerDown.bind(this),this._boundPointerDown=this.handlePointerDown.bind(this),this._boundPointerMove=this.handlePointerMove.bind(this),this._boundPointerUp=this.handlePointerUp.bind(this)}ensureInitialized(){if(typeof this._anchorObserver==="undefined")this._anchorObserver=null;if(typeof this._contentObserver==="undefined")this._contentObserver=null;if(typeof this._mutationObserver==="undefined")this._mutationObserver=null;if(typeof this._anchorTrackRAF==="undefined")this._anchorTrackRAF=null;if(typeof this._lastAnchorRect==="undefined")this._lastAnchorRect=null;if(typeof this._isPopupActive==="undefined")this._isPopupActive=!1;if(typeof this._rafId==="undefined")this._rafId=null;if(typeof this._anchorRef==="undefined")this._anchorRef=null;if(typeof this._isDragging==="undefined")this._isDragging=!1;if(typeof this._dragPending==="undefined")this._dragPending=!1;if(typeof this._dragStartPos==="undefined")this._dragStartPos={x:0,y:0};if(typeof this._dragOffset==="undefined")this._dragOffset={x:0,y:0};if(typeof this._dragThreshold!=="number")this._dragThreshold=3;if(typeof this._wasDragged==="undefined")this._wasDragged=!1;if(typeof this._boundReposition!=="function")this._boundReposition=this.queueReposition.bind(this);if(typeof this._boundScroll!=="function")this._boundScroll=(Q)=>{if(this.open&&!this.contains(Q.target)&&this.shouldAutoReposition())this.queueReposition()};if(typeof this._boundOutsidePointerDown!=="function")this._boundOutsidePointerDown=this.handleOutsidePointerDown.bind(this);if(typeof this._boundPointerDown!=="function")this._boundPointerDown=this.handlePointerDown.bind(this);if(typeof this._boundPointerMove!=="function")this._boundPointerMove=this.handlePointerMove.bind(this);if(typeof this._boundPointerUp!=="function")this._boundPointerUp=this.handlePointerUp.bind(this)}static get observedAttributes(){return["open","anchor","position","offset","variant","theme","drag","handle","autoresize","viewport-margin"]}get open(){return this.hasAttribute("open")&&this.getAttribute("open")!=="false"}set open(Q){if(Q===!1||Q==="false"||Q===null){if(!this.open)return;this.removeAttribute("open");return}if(this.open)return;this.setAttribute("open","true")}get anchor(){return this._anchorRef??this.getAttribute("anchor")}set anchor(Q){if(Q instanceof Element)this._anchorRef=Q;else if(typeof Q==="string")this._anchorRef=null,this.setAttribute("anchor",Q);else this._anchorRef=null;if(this.open)this.queueReposition()}connectedCallback(){if(this.ensureInitialized(),!this.hasAttribute("position"))this.setAttribute("position","top center");if(!this.hasAttribute("role"))this.setAttribute("role","dialog");if(!this.hasAttribute("closedby"))this.setAttribute("closedby","any");if(this.drag=this.hasAttribute("drag")&&this.getAttribute("drag")!=="false",this.addEventListener("close",()=>{if(this.teardownObservers(),this.hasAttribute("open"))this.removeAttribute("open")}),requestAnimationFrame(()=>{this.setupDragListeners()}),this.open)this.showPopup();else this.hidePopup()}disconnectedCallback(){if(this.ensureInitialized(),this.teardownObservers(),this.removeDragListeners(),document.removeEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._rafId!==null)cancelAnimationFrame(this._rafId),this._rafId=null}attributeChangedCallback(Q,$,J){if(this.ensureInitialized(),$===J)return;if(Q==="open"){if(J===null||J==="false"){this.hidePopup();return}this.showPopup();return}if(Q==="drag"){if(this.drag=J!==null&&J!=="false",this.drag)this.setupDragListeners();else this.removeDragListeners();return}if(this.open)this.queueReposition(),this.setupObservers()}showPopup(){if(this._isPopupActive){this.queueReposition();return}if(this.style.position="fixed",this.style.inset="auto",this.style.margin="0",this.style.zIndex=String(n()+1),!super.open)try{this.show()}catch($){}this.setupObservers(),document.addEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._wasDragged=!1,this.queueReposition(),this._isPopupActive=!0;const Q=this.resolveAnchor();if(Q)Q.classList.add("has-popup-open")}hidePopup(){const Q=this.resolveAnchor();if(Q)Q.classList.remove("has-popup-open");if(this._isPopupActive=!1,this._wasDragged=!1,this.teardownObservers(),document.removeEventListener("pointerdown",this._boundOutsidePointerDown,!0),super.open)try{this.close()}catch($){}}get autoresize(){const Q=this.getAttribute("autoresize");return Q===null||Q!=="false"}setupObservers(){this.teardownObservers();const Q=this.resolveAnchor();if(Q&&"ResizeObserver"in window)this._anchorObserver=new ResizeObserver(this._boundReposition),this._anchorObserver.observe(Q);if(this.autoresize){if("ResizeObserver"in window)this._contentObserver=new ResizeObserver(this._boundReposition),this._contentObserver.observe(this);this._mutationObserver=new MutationObserver(this._boundReposition),this._mutationObserver.observe(this,{childList:!0,subtree:!0,characterData:!0})}window.addEventListener("resize",this._boundReposition),window.addEventListener("scroll",this._boundScroll,{capture:!0,passive:!0}),this.startAnchorTracking()}teardownObservers(){if(this._anchorObserver)this._anchorObserver.disconnect(),this._anchorObserver=null;if(this._contentObserver)this._contentObserver.disconnect(),this._contentObserver=null;if(this._mutationObserver)this._mutationObserver.disconnect(),this._mutationObserver=null;window.removeEventListener("resize",this._boundReposition),window.removeEventListener("scroll",this._boundScroll,{capture:!0,passive:!0}),this.stopAnchorTracking()}readRectSnapshot(Q){if(!Q)return null;const $=Q.getBoundingClientRect();return{x:$.x,y:$.y,width:$.width,height:$.height}}hasRectChanged(Q,$,J=0.25){if(!Q&&!$)return!1;if(!Q||!$)return!0;return Math.abs(Q.x-$.x)>J||Math.abs(Q.y-$.y)>J||Math.abs(Q.width-$.width)>J||Math.abs(Q.height-$.height)>J}startAnchorTracking(){if(this.stopAnchorTracking(),!this.open)return;const Q=()=>{if(!this.open){this._anchorTrackRAF=null;return}const $=this.resolveAnchor(),J=this.readRectSnapshot($),Z=this.shouldAutoReposition();if(Z&&this.hasRectChanged(this._lastAnchorRect,J))this._lastAnchorRect=J,this.queueReposition();else if(!Z)this._lastAnchorRect=J;this._anchorTrackRAF=requestAnimationFrame(Q)};this._lastAnchorRect=this.readRectSnapshot(this.resolveAnchor()),this._anchorTrackRAF=requestAnimationFrame(Q)}stopAnchorTracking(){if(this._anchorTrackRAF!==null)cancelAnimationFrame(this._anchorTrackRAF),this._anchorTrackRAF=null;this._lastAnchorRect=null}handleOutsidePointerDown(Q){if(!this.open||!super.open)return;const $=this.getAttribute("closedby");if($==="none"||$==="closerequest")return;const J=Q.target;if(!(J instanceof Node))return;if(this.contains(J))return;const Z=this.resolveAnchor();if(Z&&Z.contains(J))return;if(this.isInsideDescendantPopup(J))return;this.open=!1}isInsideDescendantPopup(Q){const $=Q.closest?.('dialog[is="fig-popup"]');if(!$||$===this)return!1;let J=$;const Z=new Set;while(J&&!Z.has(J)){Z.add(J);const _=J.anchor;if(!(_ instanceof Element))break;if(this.contains(_))return!0;J=_.closest?.('dialog[is="fig-popup"]')}return!1}setupDragListeners(){if(this.drag)this.addEventListener("pointerdown",this._boundPointerDown)}removeDragListeners(){this.removeEventListener("pointerdown",this._boundPointerDown),document.removeEventListener("pointermove",this._boundPointerMove),document.removeEventListener("pointerup",this._boundPointerUp)}isInteractiveElement(Q){const $=["input","button","select","textarea","a","label","details","summary",'[contenteditable="true"]',"[tabindex]"],J=["FIG-HEADER","FIG-DIALOG","FIG-POPUP","FIG-FIELD","FIG-TOOLTIP","FIG-CONTENT","FIG-TABS","FIG-TAB","FIG-POPOVER","FIG-SHIMMER","FIG-LAYER","FIG-FILL-PICKER"],Z=(j)=>$.some((q)=>j.matches?.(q))||j.tagName?.startsWith("FIG-")&&!J.includes(j.tagName);if(Z(Q))return!0;let _=Q.parentElement;while(_&&_!==this){if(Z(_))return!0;_=_.parentElement}return!1}handlePointerDown(Q){if(!this.drag)return;if(this.isInteractiveElement(Q.target))return;const $=this.getAttribute("handle");if($&&$.trim()){const Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this._dragPending=!0,this._dragStartPos.x=Q.clientX,this._dragStartPos.y=Q.clientY;const J=this.getBoundingClientRect();this._dragOffset.x=Q.clientX-J.left,this._dragOffset.y=Q.clientY-J.top,document.addEventListener("pointermove",this._boundPointerMove),document.addEventListener("pointerup",this._boundPointerUp)}handlePointerMove(Q){if(this._dragPending&&!this._isDragging){const $=Math.abs(Q.clientX-this._dragStartPos.x),J=Math.abs(Q.clientY-this._dragStartPos.y);if($>this._dragThreshold||J>this._dragThreshold){this._isDragging=!0,this._dragPending=!1,this._wasDragged=!0,this.setPointerCapture(Q.pointerId),this.style.cursor="grabbing";const Z=this.getBoundingClientRect();this.style.top=`${Z.top}px`,this.style.left=`${Z.left}px`,this.style.bottom="auto",this.style.right="auto",this.style.margin="0"}}if(!this._isDragging)return;this.style.left=`${Q.clientX-this._dragOffset.x}px`,this.style.top=`${Q.clientY-this._dragOffset.y}px`,Q.preventDefault()}handlePointerUp(Q){if(this._isDragging)this.releasePointerCapture(Q.pointerId),this.style.cursor="";this._isDragging=!1,this._dragPending=!1,document.removeEventListener("pointermove",this._boundPointerMove),document.removeEventListener("pointerup",this._boundPointerUp),Q.preventDefault()}resolveAnchor(){if(this._anchorRef)return this._anchorRef;const Q=this.getAttribute("anchor");if(!Q)return null;const $=this.parentElement;if($?.querySelector){const J=$.querySelector(Q);if(J&&!this.contains(J))return J}return document.querySelector(Q)}parsePosition(){const $=(this.getAttribute("position")||"top center").trim().toLowerCase().split(/\s+/).filter(Boolean),J=new Set(["top","center","bottom"]),Z=new Set(["left","center","right"]);let _="top",j="center",q=null;if($.length>=2){if(J.has($[0]))_=$[0];if(Z.has($[1]))j=$[1];return{vertical:_,horizontal:j,shorthand:q}}if($.length===1){const K=$[0];if(K==="top"||K==="bottom")_=K,q=K;else if(K==="left"||K==="right")j=K,q=K;else if(K==="center")_="center",j="center"}return{vertical:_,horizontal:j,shorthand:q}}normalizeOffsetToken(Q,$="0px"){if(!Q)return $;const J=Q.trim();if(!J)return $;if(/^-?\d+(\.\d+)?$/.test(J))return`${J}px`;return J}measureLengthPx(Q,$="x"){if(!Q)return 0;const J=this.normalizeOffsetToken(Q,"0px");if(J.endsWith("px")){const j=parseFloat(J);return Number.isFinite(j)?j:0}const Z=document.createElement("div");if(Z.style.position="fixed",Z.style.visibility="hidden",Z.style.pointerEvents="none",Z.style.left="0",Z.style.top="0",Z.style.margin="0",Z.style.padding="0",Z.style.border="0",$==="x")Z.style.width=J,Z.style.height="0";else Z.style.height=J,Z.style.width="0";document.body.appendChild(Z);const _=Z.getBoundingClientRect();return Z.remove(),$==="x"?_.width:_.height}parseOffset(){const $=(this.getAttribute("offset")||"0 0").trim().split(/\s+/).filter(Boolean),J=this.normalizeOffsetToken($[0],"0px"),Z=this.normalizeOffsetToken($[1],"0px");return{xToken:J,yToken:Z,xPx:this.measureLengthPx(J,"x"),yPx:this.measureLengthPx(Z,"y")}}parseViewportMargins(){const $=(this.getAttribute("viewport-margin")||"8").trim().split(/\s+/).map(Number).filter((Z)=>!Number.isNaN(Z));if($.length===0)return{top:8,right:8,bottom:8,left:8};if($.length===1)return{top:$[0],right:$[0],bottom:$[0],left:$[0]};if($.length===2)return{top:$[0],right:$[1],bottom:$[0],left:$[1]};if($.length===3)return{top:$[0],right:$[1],bottom:$[2],left:$[1]};return{top:$[0],right:$[1],bottom:$[2],left:$[3]}}getPlacementCandidates(Q,$,J){const Z={top:"bottom",bottom:"top",left:"right",right:"left",center:"center"};if(J){const j=J==="left"||J==="right"?["top","bottom"]:["left","right"];return[{v:Q,h:$,s:J},{v:Q,h:$,s:Z[J]},{v:Q,h:$,s:j[0]},{v:Q,h:$,s:j[1]}]}if(Q==="center")return[{v:"center",h:$,s:null},{v:"center",h:Z[$],s:null},{v:"top",h:$,s:null},{v:"bottom",h:$,s:null},{v:"top",h:Z[$],s:null},{v:"bottom",h:Z[$],s:null}];if($==="center")return[{v:Q,h:"center",s:null},{v:Z[Q],h:"center",s:null},{v:Q,h:"left",s:null},{v:Q,h:"right",s:null},{v:Z[Q],h:"left",s:null},{v:Z[Q],h:"right",s:null}];return[{v:Q,h:$,s:null},{v:Z[Q],h:$,s:null},{v:Q,h:Z[$],s:null},{v:Z[Q],h:Z[$],s:null}]}computeCoords(Q,$,J,Z,_,j){let q,K;if(j==="left"||j==="right")return K=j==="left"?Q.left-$.width-_.xPx:Q.right+_.xPx,q=Q.top,{top:q,left:K};if(j==="top"||j==="bottom")return q=j==="top"?Q.top-$.height-_.yPx:Q.bottom+_.yPx,K=Q.left,{top:q,left:K};if(J==="top")q=Q.top-$.height-_.yPx;else if(J==="bottom")q=Q.bottom+_.yPx;else q=Q.top+(Q.height-$.height)/2;if(J==="center")if(Z==="left")K=Q.left-$.width-_.xPx;else if(Z==="right")K=Q.right+_.xPx;else K=Q.left+(Q.width-$.width)/2;else if(Z==="left")K=Q.left+_.xPx;else if(Z==="right")K=Q.right-$.width-_.xPx;else K=Q.left+(Q.width-$.width)/2;return{top:q,left:K}}oppositeSide(Q){return{top:"bottom",bottom:"top",left:"right",right:"left"}[Q]||"bottom"}getPlacementSide(Q,$,J){if(J==="top")return"top";if(J==="bottom")return"bottom";if(J==="left")return"left";if(J==="right")return"right";if(Q!=="center")return Q;if($!=="center")return $;return"top"}updatePopoverBeak(Q,$,J,Z,_){if(this.getAttribute("variant")!=="popover"||!Q){this.style.removeProperty("--beak-offset"),this.removeAttribute("data-beak-side");return}const j=this.oppositeSide(_);this.setAttribute("data-beak-side",j);const q=Q.left+Q.width/2,K=Q.top+Q.height/2,X=this.getBoundingClientRect(),W=X.width>0&&X.height>0?X:$,L=W.left,U=W.top,G=10;let N;if(j==="top"||j==="bottom"){N=q-L;const B=G,F=Math.max(B,W.width-G);N=Math.min(F,Math.max(B,N))}else{N=K-U;const B=G,F=Math.max(B,W.height-G);N=Math.min(F,Math.max(B,N))}this.style.setProperty("--beak-offset",`${N}px`)}overflowScore(Q,$,J){const{innerWidth:Z,innerHeight:_}=window,j=Q.left+$.width,q=Q.top+$.height,K=Math.max(0,J.left-Q.left),X=Math.max(0,J.top-Q.top),W=Math.max(0,j-(Z-J.right)),L=Math.max(0,q-(_-J.bottom));return K+X+W+L}fits(Q,$,J){return this.overflowScore(Q,$,J)===0}clamp(Q,$,J){const{left:Z,top:_}=J,j=Math.max(J.left,window.innerWidth-$.width-J.right),q=Math.max(J.top,window.innerHeight-$.height-J.bottom);return{left:Math.min(j,Math.max(Z,Q.left)),top:Math.min(q,Math.max(_,Q.top))}}positionPopup(){if(!this.open||!super.open)return;const Q=this.getBoundingClientRect(),$=this.parseOffset(),{vertical:J,horizontal:Z,shorthand:_}=this.parsePosition(),j=this.resolveAnchor(),q=this.parseViewportMargins();if(!j){this.updatePopoverBeak(null,Q,0,0,"top");const N={left:q.left+(window.innerWidth-q.right-q.left-Q.width)/2,top:q.top+(window.innerHeight-q.bottom-q.top-Q.height)/2},B=this.clamp(N,Q,q);this.style.left=`${B.left}px`,this.style.top=`${B.top}px`;return}const K=j.getBoundingClientRect(),X=this.getPlacementCandidates(J,Z,_);let W=null,L="top",U=Number.POSITIVE_INFINITY;for(let{v:N,h:B,s:F}of X){const D=this.computeCoords(K,Q,N,B,$,F),S=this.getPlacementSide(N,B,F);if(F){const E=this.clamp(D,Q,q);if(F==="left"||F==="right"?D.left>=q.left&&D.left+Q.width<=window.innerWidth-q.right:D.top>=q.top&&D.top+Q.height<=window.innerHeight-q.bottom){this.style.left=`${E.left}px`,this.style.top=`${E.top}px`,this.updatePopoverBeak(K,Q,E.left,E.top,S);return}const H=this.overflowScore(D,Q,q);if(H<U)U=H,W=E,L=S}else{if(this.fits(D,Q,q)){this.style.left=`${D.left}px`,this.style.top=`${D.top}px`,this.updatePopoverBeak(K,Q,D.left,D.top,S);return}const E=this.overflowScore(D,Q,q);if(E<U)U=E,W=D,L=S}}const G=this.clamp(W||{left:0,top:0},Q,q);this.style.left=`${G.left}px`,this.style.top=`${G.top}px`,this.updatePopoverBeak(K,Q,G.left,G.top,L)}queueReposition(){if(!this.open||!this.shouldAutoReposition())return;if(this._rafId!==null)return;this._rafId=requestAnimationFrame(()=>{this._rafId=null,this.positionPopup()})}shouldAutoReposition(){if(!(this.drag&&this._wasDragged))return!0;return!this.resolveAnchor()}}c("fig-popup",$0,{extends:"dialog"});class J0 extends HTMLElement{#Q;constructor(){super();this.content=null,this.#Q=!1}connectedCallback(){this.setAttribute("label",this.innerText),this.setAttribute("role","tab"),this.setAttribute("tabindex","0"),this.addEventListener("click",this.handleClick.bind(this)),requestAnimationFrame(()=>{if(typeof this.getAttribute("content")==="string"){if(this.content=document.querySelector(this.getAttribute("content")),this.content)if(this.content.setAttribute("role","tabpanel"),this.#Q)this.content.style.display="block",this.setAttribute("aria-selected","true");else this.content.style.display="none",this.setAttribute("aria-selected","false")}})}get selected(){return this.#Q}set selected(Q){this.setAttribute("selected",Q?"true":"false")}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}handleClick(){if(this.selected=!0,this.content)this.content.style.display="block"}static get observedAttributes(){return["selected"]}attributeChangedCallback(Q,$,J){if(Q==="selected"){if(this.#Q=J!==null&&J!=="false",this.setAttribute("aria-selected",this.#Q?"true":"false"),this?.content)this.content.style.display=this.#Q?"block":"none"}}}customElements.define("fig-tab",J0);class Z0 extends HTMLElement{constructor(){super()}static get observedAttributes(){return["value","name","disabled"]}connectedCallback(){this.name=this.getAttribute("name")||"tabs",this.setAttribute("role","tablist"),this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.#$.bind(this));const Q=this.getAttribute("value");if(Q)this.#J(Q);if(this.hasAttribute("disabled"))this.#Q(!0)}#Q(Q){this.querySelectorAll("fig-tab").forEach((J)=>{if(Q)J.setAttribute("disabled",""),J.setAttribute("aria-disabled","true"),J.setAttribute("tabindex","-1");else J.removeAttribute("disabled"),J.removeAttribute("aria-disabled"),J.setAttribute("tabindex","0")})}disconnectedCallback(){this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.#$)}#$(Q){const $=Array.from(this.querySelectorAll("fig-tab")),J=$.findIndex((_)=>_.hasAttribute("selected"));let Z=J;switch(Q.key){case"ArrowLeft":case"ArrowUp":Q.preventDefault(),Z=J>0?J-1:$.length-1;break;case"ArrowRight":case"ArrowDown":Q.preventDefault(),Z=J<$.length-1?J+1:0;break;case"Home":Q.preventDefault(),Z=0;break;case"End":Q.preventDefault(),Z=$.length-1;break;default:return}if(Z!==J&&$[Z])$.forEach((_)=>_.removeAttribute("selected")),this.selectedTab=$[Z],this.setAttribute("value",$[Z].getAttribute("value")||""),$[Z].focus()}get value(){return this.selectedTab?.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q)}#J(Q){const $=this.querySelectorAll("fig-tab");for(let J of $)if(J.getAttribute("value")===Q)this.selectedTab=J;else J.removeAttribute("selected")}attributeChangedCallback(Q,$,J){switch(Q){case"value":if(J!==$)this.#J(J);break;case"disabled":this.#Q(J!==null&&J!=="false");break}}handleClick(Q){if(this.hasAttribute("disabled"))return;const $=Q.target;if($.nodeName.toLowerCase()==="fig-tab"){const J=this.querySelectorAll("fig-tab");for(let Z of J)if(Z===$)this.selectedTab=Z,this.setAttribute("value",Z.getAttribute("value")||"");else Z.removeAttribute("selected")}}}customElements.define("fig-tabs",Z0);class _0 extends HTMLElement{#Q;#$;constructor(){super()}connectedCallback(){this.addEventListener("click",this.handleClick.bind(this))}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}handleClick(){const Q=this.closest("fig-segmented-control");if(Q&&Q.hasAttribute("disabled")&&Q.getAttribute("disabled")!=="false")return;this.setAttribute("selected","true")}get value(){return this.#Q}set value(Q){this.#Q=Q,this.setAttribute("value",Q)}get selected(){return this.#$}set selected(Q){this.#$=Q,this.setAttribute("selected",Q)}static get observedAttributes(){return["selected","value"]}attributeChangedCallback(Q,$,J){switch(Q){case"value":this.#Q=J;break;case"selected":this.#$=J;break}}}customElements.define("fig-segment",_0);class j0 extends HTMLElement{#Q=null;#$=this.handleClick.bind(this);#J=null;constructor(){super()}static get observedAttributes(){return["disabled","value"]}connectedCallback(){this.name=this.getAttribute("name")||"segmented-control",this.addEventListener("click",this.#$),this.#Y(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),this.#X(),requestAnimationFrame(()=>{this.#K({enforceFallback:!0})})}disconnectedCallback(){this.removeEventListener("click",this.#$),this.#J?.disconnect(),this.#J=null}get selectedSegment(){return this.#Q}set selectedSegment(Q){const $=this.querySelectorAll("fig-segment");for(let J of $)if(J===Q)J.setAttribute("selected","true");else J.removeAttribute("selected");this.#Q=Q}get value(){return this.getAttribute("value")||""}set value(Q){if(Q===null||Q===void 0){this.removeAttribute("value");return}this.setAttribute("value",String(Q))}#_(Q){this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0}))}#q(Q){const $=Q.getAttribute("value");if($!==null){const J=$.trim();if(J.length>0)return J}return Q.textContent?.trim()||""}#Z(){const Q=this.querySelectorAll("fig-segment");for(let $ of Q)if($.hasAttribute("selected"))return $;return null}#j(Q){const $=String(Q??"").trim();if(!$)return!1;const J=this.querySelectorAll("fig-segment");for(let Z of J){const _=this.#q(Z);if(!_)continue;if(_===$)return this.selectedSegment=Z,!0}return!1}#K({enforceFallback:Q=!1}={}){const $=this.querySelectorAll("fig-segment");if($.length===0){this.#Q=null;return}const J=this.getAttribute("value"),Z=J?.trim()??"";if(J!==null){if(Z!==J){this.setAttribute("value",Z);return}if(Z&&this.#j(Z))return}const _=this.#Z();if(_){this.selectedSegment=_;return}if(Q)this.selectedSegment=$[0]}#X(){this.#J?.disconnect(),this.#J=new MutationObserver((Q)=>{let $=!1;for(let J of Q){if(J.type==="childList"){$=!0;break}if(J.type==="attributes"&&J.target instanceof HTMLElement&&J.target.tagName.toLowerCase()==="fig-segment"&&(J.attributeName==="value"||J.attributeName==="selected")){$=!0;break}if(J.type==="characterData"){$=!0;break}}if($)this.#Y(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),this.#K({enforceFallback:!0})}),this.#J.observe(this,{childList:!0,subtree:!0,characterData:!0,attributes:!0,attributeFilter:["value","selected"]})}handleClick(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;const $=Q.target.closest("fig-segment");if(!$||!this.contains($))return;const J=this.selectedSegment,Z=this.value;this.selectedSegment=$;const _=this.#q($);if(_)this.setAttribute("value",_);else this.removeAttribute("value");const j=this.value;if(J!==$||Z!==j)this.#_(j)}#Y(Q){this.setAttribute("aria-disabled",Q?"true":"false"),this.querySelectorAll("fig-segment").forEach(($)=>{if(Q)$.setAttribute("disabled",""),$.setAttribute("aria-disabled","true");else $.removeAttribute("disabled"),$.removeAttribute("aria-disabled")})}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="disabled"){this.#Y(J!==null&&J!=="false");return}if(Q==="value")this.#K({enforceFallback:!1})}}customElements.define("fig-segmented-control",j0);class q0 extends HTMLElement{#Q=!1;#$=!1;#J={range:{min:0,max:100,step:1},hue:{min:0,max:255,step:1},delta:{min:-100,max:100,step:1},stepper:{min:0,max:100,step:25},opacity:{min:0,max:100,step:0.1,color:"#FF0000"}};#_;#q;#Z;#j;constructor(){super();this.initialInnerHTML=this.innerHTML,this.#_=(Q)=>{Q.stopPropagation(),this.#F()},this.#q=(Q)=>{Q.stopPropagation(),this.#A()},this.#Z=(Q)=>{Q.stopPropagation(),this.#X()},this.#j=(Q)=>{Q.stopPropagation(),this.#M()}}#K(){const Q=this.getAttribute("value");this.type=this.getAttribute("type")||"range",this.variant=this.getAttribute("variant")||"default",this.text=this.hasAttribute("text")&&this.getAttribute("text")!=="false",this.units=this.getAttribute("units")||"",this.transform=Number(this.getAttribute("transform")||1),this.disabled=this.getAttribute("disabled")?!0:!1,this.precision=this.hasAttribute("precision")?Number(this.getAttribute("precision")):null,this.placeholder=this.getAttribute("placeholder")!==null?this.getAttribute("placeholder"):"##";const $=this.#J[this.type];if(this.min=Number(this.getAttribute("min")||$.min),this.max=Number(this.getAttribute("max")||$.max),this.step=Number(this.getAttribute("step")||$.step),this.color=this.getAttribute("color")||$?.color,this.default=this.hasAttribute("default")?this.getAttribute("default"):this.type==="delta"?0:this.min,this.#$=Q===null||typeof Q==="string"&&Q.trim()==="",this.value=this.#O(Q),this.color)this.style.setProperty("--color",this.color);let J="",Z=`<div class="fig-slider-input-container" role="group">
                 <input 
                     type="range"
                     ${this.text?'tabindex="-1"':""}
@@ -56,17 +56,17 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
                         value="${this.#$?"":this.value}"
                         ${this.units?`units="${this.units}"`:""}
                         ${this.precision!==null?`precision="${this.precision}"`:""}>
-                    </fig-input-number>`;else J=Z;this.innerHTML=J,requestAnimationFrame(()=>{if(this.input=this.querySelector("[type=range]"),this.inputContainer=this.querySelector(".fig-slider-input-container"),this.input.removeEventListener("input",this.#_),this.input.addEventListener("input",this.#_),this.input.removeEventListener("change",this.#q),this.input.addEventListener("change",this.#q),this.input.addEventListener("pointerdown",()=>{this.#Q=!0}),this.input.addEventListener("pointerup",()=>{this.#Q=!1}),this.default)this.style.setProperty("--default",this.#G(this.default));if(this.datalist=this.querySelector("datalist"),this.figInputNumber=this.querySelector("fig-input-number"),this.datalist)this.inputContainer.append(this.datalist),this.datalist.setAttribute("id",this.datalist.getAttribute("id")||V()),this.input.setAttribute("list",this.datalist.getAttribute("id"));else if(this.type==="stepper"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",V());let _=(this.max-this.min)/this.step+1;for(let j=0;j<_;j++){let q=document.createElement("option");q.setAttribute("value",this.min+j*this.step),this.datalist.append(q)}this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}else if(this.type==="delta"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",V());let _=document.createElement("option");_.setAttribute("value",this.default),this.datalist.append(_),this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}if(this.datalist){let _=this.datalist.querySelector(`option[value='${this.default}']`);if(_)_.setAttribute("default","true")}if(this.figInputNumber)this.figInputNumber.removeEventListener("input",this.#Z),this.figInputNumber.addEventListener("input",this.#Z),this.figInputNumber.removeEventListener("change",this.#j),this.figInputNumber.addEventListener("change",this.#j);this.#U()})}connectedCallback(){this.#K()}disconnectedCallback(){if(this.input)this.input.removeEventListener("input",this.#_),this.input.removeEventListener("change",this.#q);if(this.figInputNumber)this.figInputNumber.removeEventListener("input",this.#Z),this.figInputNumber.removeEventListener("change",this.#j)}#W(){if(this.figInputNumber){const Q=this.figInputNumber.value;this.#$=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";const $=this.#N(Q);this.value=$,this.input.value=String($),this.#U(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}}#G(Q){const{min:$,max:J}=this.#B(),Z=J-$;if(Z===0)return 0;return(Number(Q)-$)/Z}#Y(Q){if(Q===null||Q===void 0)return null;if(typeof Q==="string"&&Q.trim()==="")return null;const $=Number(Q);return Number.isFinite($)?$:null}#B(){let Q=this.#Y(this.min),$=this.#Y(this.max);if(Q===null)Q=0;if($===null)$=Q;if(Q>$)[Q,$]=[$,Q];return{min:Q,max:$}}#X(Q){const{min:$,max:J}=this.#B();return Math.min(J,Math.max($,Q))}#O(){if(this.type==="delta"){const $=this.#Y(this.default);if($!==null)return this.#X($);return this.#X(0)}const{min:Q}=this.#B();return Q}#N(Q){const $=this.#Y(Q);if($===null)return this.#O();return this.#X($)}#L(){let Q=this.#G(this.value);this.style.setProperty("--slider-complete",Q);let $=this.#G(this.default);this.style.setProperty("--default",$),this.style.setProperty("--unchanged",Q===$?1:0)}#U(){let Q=this.input.value;if(this.value=Q,this.#L(),this.input.setAttribute("aria-valuenow",Q),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#$?"":Q)}#D(){this.#$=!1,this.#U(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}#A(){this.#Q=!1,this.#$=!1,this.#U(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#M(){if(this.figInputNumber){const Q=this.figInputNumber.value;this.#$=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";const $=this.#N(Q);this.value=$,this.input.value=String($),this.#U(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}}static get observedAttributes(){return["value","step","min","max","type","variant","disabled","color","units","transform","text","placeholder","default","precision"]}focus(){this.input.focus()}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"color":this.color=J,this.style.setProperty("--color",this.color);break;case"disabled":if(this.disabled=this.input.disabled=J!==null&&J!=="false",this.figInputNumber)this.figInputNumber.disabled=this.disabled,this.figInputNumber.setAttribute("disabled",this.disabled);break;case"value":if(this.#Q)break;if(this.#$=J===null||typeof J==="string"&&J.trim()==="",this.value=this.#N(J),this.input.value=String(this.value),this.#U(),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#$?"":this.value);break;case"transform":if(this.transform=Number(J)||1,this.figInputNumber)this.figInputNumber.setAttribute("transform",this.transform);break;case"precision":if(this.precision=J!==null?Number(J):null,this.figInputNumber)if(this.precision!==null)this.figInputNumber.setAttribute("precision",this.precision);else this.figInputNumber.removeAttribute("precision");break;case"placeholder":if(this.placeholder=J!==null?J:"##",this.figInputNumber)this.figInputNumber.setAttribute("placeholder",this.placeholder);break;case"default":this.default=J!==null?J:this.type==="delta"?0:this.min,this.#L();break;case"min":case"max":case"step":case"type":case"variant":case"units":this[Q]=J,this.#K();break;case"text":this.text=J!==null&&J!=="false",this.#K();break;default:this[Q]=this.input[Q]=J,this.#U();break}}}customElements.define("fig-slider",q0);class K0 extends HTMLElement{#Q=!1;#$;#J;#_;#q;#Z;constructor(){super();this.#$=this.#W.bind(this),this.#J=this.#Y.bind(this),this.#_=this.#Y.bind(this),this.#q=this.#G.bind(this),this.#Z=(Q)=>{Q.stopPropagation(),this.#K(Q)}}connectedCallback(){if(this.multiline=this.hasAttribute("multiline")||!1,this.value=this.getAttribute("value")||"",this.type=this.getAttribute("type")||"text",this.placeholder=this.getAttribute("placeholder")||"",this.name=this.getAttribute("name")||null,this.readonly=this.hasAttribute("readonly")&&this.getAttribute("readonly")!=="false",this.type==="number"){if(this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.getAttribute("min"))this.input.setAttribute("min",String(this.min));if(this.getAttribute("max"))this.input.setAttribute("max",String(this.max));if(this.getAttribute("step"))this.input.setAttribute("step",String(this.step));if(this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));if(this.transform=Number(this.getAttribute("transform")||1),this.getAttribute("value"))this.value=Number(this.value)}let Q=`<input 
+                    </fig-input-number>`;else J=Z;this.innerHTML=J,requestAnimationFrame(()=>{if(this.input=this.querySelector("[type=range]"),this.inputContainer=this.querySelector(".fig-slider-input-container"),this.input.removeEventListener("input",this.#_),this.input.addEventListener("input",this.#_),this.input.removeEventListener("change",this.#q),this.input.addEventListener("change",this.#q),this.input.addEventListener("pointerdown",()=>{this.#Q=!0}),this.input.addEventListener("pointerup",()=>{this.#Q=!1}),this.default)this.style.setProperty("--default",this.#Y(this.default));if(this.datalist=this.querySelector("datalist"),this.figInputNumber=this.querySelector("fig-input-number"),this.datalist)this.inputContainer.append(this.datalist),this.datalist.setAttribute("id",this.datalist.getAttribute("id")||V()),this.input.setAttribute("list",this.datalist.getAttribute("id"));else if(this.type==="stepper"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",V());let _=(this.max-this.min)/this.step+1;for(let j=0;j<_;j++){let q=document.createElement("option");q.setAttribute("value",this.min+j*this.step),this.datalist.append(q)}this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}else if(this.type==="delta"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",V());let _=document.createElement("option");_.setAttribute("value",this.default),this.datalist.append(_),this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}if(this.datalist){let _=this.datalist.querySelector(`option[value='${this.default}']`);if(_)_.setAttribute("default","true")}if(this.figInputNumber)this.figInputNumber.removeEventListener("input",this.#Z),this.figInputNumber.addEventListener("input",this.#Z),this.figInputNumber.removeEventListener("change",this.#j),this.figInputNumber.addEventListener("change",this.#j);this.#U()})}connectedCallback(){this.#K()}disconnectedCallback(){if(this.input)this.input.removeEventListener("input",this.#_),this.input.removeEventListener("change",this.#q);if(this.figInputNumber)this.figInputNumber.removeEventListener("input",this.#Z),this.figInputNumber.removeEventListener("change",this.#j)}#X(){if(this.figInputNumber){const Q=this.figInputNumber.value;this.#$=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";const $=this.#O(Q);this.value=$,this.input.value=String($),this.#U(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}}#Y(Q){const{min:$,max:J}=this.#B(),Z=J-$;if(Z===0)return 0;return(Number(Q)-$)/Z}#G(Q){if(Q===null||Q===void 0)return null;if(typeof Q==="string"&&Q.trim()==="")return null;const $=Number(Q);return Number.isFinite($)?$:null}#B(){let Q=this.#G(this.min),$=this.#G(this.max);if(Q===null)Q=0;if($===null)$=Q;if(Q>$)[Q,$]=[$,Q];return{min:Q,max:$}}#W(Q){const{min:$,max:J}=this.#B();return Math.min(J,Math.max($,Q))}#N(){if(this.type==="delta"){const $=this.#G(this.default);if($!==null)return this.#W($);return this.#W(0)}const{min:Q}=this.#B();return Q}#O(Q){const $=this.#G(Q);if($===null)return this.#N();return this.#W($)}#L(){let Q=this.#Y(this.value);this.style.setProperty("--slider-complete",Q);let $=this.#Y(this.default);this.style.setProperty("--default",$),this.style.setProperty("--unchanged",Q===$?1:0)}#U(){let Q=this.input.value;if(this.value=Q,this.#L(),this.input.setAttribute("aria-valuenow",Q),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#$?"":Q)}#F(){this.#$=!1,this.#U(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}#A(){this.#Q=!1,this.#$=!1,this.#U(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#M(){if(this.figInputNumber){const Q=this.figInputNumber.value;this.#$=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";const $=this.#O(Q);this.value=$,this.input.value=String($),this.#U(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}}static get observedAttributes(){return["value","step","min","max","type","variant","disabled","color","units","transform","text","placeholder","default","precision"]}focus(){this.input.focus()}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"color":this.color=J,this.style.setProperty("--color",this.color);break;case"disabled":if(this.disabled=this.input.disabled=J!==null&&J!=="false",this.figInputNumber)this.figInputNumber.disabled=this.disabled,this.figInputNumber.setAttribute("disabled",this.disabled);break;case"value":if(this.#Q)break;if(this.#$=J===null||typeof J==="string"&&J.trim()==="",this.value=this.#O(J),this.input.value=String(this.value),this.#U(),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#$?"":this.value);break;case"transform":if(this.transform=Number(J)||1,this.figInputNumber)this.figInputNumber.setAttribute("transform",this.transform);break;case"precision":if(this.precision=J!==null?Number(J):null,this.figInputNumber)if(this.precision!==null)this.figInputNumber.setAttribute("precision",this.precision);else this.figInputNumber.removeAttribute("precision");break;case"placeholder":if(this.placeholder=J!==null?J:"##",this.figInputNumber)this.figInputNumber.setAttribute("placeholder",this.placeholder);break;case"default":this.default=J!==null?J:this.type==="delta"?0:this.min,this.#L();break;case"min":case"max":case"step":case"type":case"variant":case"units":this[Q]=J,this.#K();break;case"text":this.text=J!==null&&J!=="false",this.#K();break;default:this[Q]=this.input[Q]=J,this.#U();break}}}customElements.define("fig-slider",q0);class K0 extends HTMLElement{#Q=!1;#$;#J;#_;#q;#Z;constructor(){super();this.#$=this.#X.bind(this),this.#J=this.#G.bind(this),this.#_=this.#G.bind(this),this.#q=this.#Y.bind(this),this.#Z=(Q)=>{Q.stopPropagation(),this.#K(Q)}}connectedCallback(){if(this.multiline=this.hasAttribute("multiline")||!1,this.value=this.getAttribute("value")||"",this.type=this.getAttribute("type")||"text",this.placeholder=this.getAttribute("placeholder")||"",this.name=this.getAttribute("name")||null,this.readonly=this.hasAttribute("readonly")&&this.getAttribute("readonly")!=="false",this.type==="number"){if(this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.getAttribute("min"))this.input.setAttribute("min",String(this.min));if(this.getAttribute("max"))this.input.setAttribute("max",String(this.max));if(this.getAttribute("step"))this.input.setAttribute("step",String(this.step));if(this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));if(this.transform=Number(this.getAttribute("transform")||1),this.getAttribute("value"))this.value=Number(this.value)}let Q=`<input 
       type="${this.type}" 
       ${this.name?`name="${this.name}"`:""}
       placeholder="${this.placeholder}"
       value="${this.type==="number"?this.#j(this.value):this.value}" />`;if(this.multiline)Q=`<textarea  
-      placeholder="${this.placeholder}">${this.value}</textarea>`;requestAnimationFrame(()=>{let $=this.querySelector("[slot=append]"),J=this.querySelector("[slot=prepend]");if(this.innerHTML=Q,J)J.addEventListener("click",this.focus.bind(this)),this.prepend(J);if($)$.addEventListener("click",this.focus.bind(this)),this.append($);if(this.input=this.querySelector("input,textarea"),this.input.readOnly=this.readonly,this.type==="number"){if(this.getAttribute("min"))this.input.setAttribute("min",this.#j(this.min));if(this.getAttribute("max"))this.input.setAttribute("max",this.#j(this.max));if(this.getAttribute("step"))this.input.setAttribute("step",this.#j(this.step));this.addEventListener("pointerdown",this.#q)}this.input.removeEventListener("change",this.#Z),this.input.addEventListener("change",this.#Z)})}disconnectedCallback(){if(this.input)this.input.removeEventListener("change",this.#Z);this.removeEventListener("pointerdown",this.#q),window.removeEventListener("pointermove",this.#$),window.removeEventListener("pointerup",this.#J),window.removeEventListener("blur",this.#_)}focus(){this.input.focus()}#j(Q){if(Q==="")return"";let $=Number(Q)*(this.transform||1);return $=this.#X($),$}#K(Q){Q.stopPropagation();let $=Q.target.value,J=$;if(this.type==="number")$=$/(this.transform||1),$=this.#B($,!1),J=$*(this.transform||1);this.value=$,this.input.value=J,this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#W(Q){if(this.type!=="number")return;if(Q.buttons===0){this.#Y();return}let $=(this.step||1)*Q.movementX,J=Number(this.input.value);J=J/(this.transform||1)+$,J=this.#B(J,!1);let Z=J*(this.transform||1);J=this.#X(J),Z=this.#X(Z),this.value=J,this.input.value=Z,this.dispatchEvent(new CustomEvent("input",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}#G(Q){if(this.type!=="number")return;if(Q.altKey||Q.target.closest("[slot]"))this.#Q=!0,this.input.style.cursor=this.style.cursor=document.body.style.cursor="ew-resize",this.style.userSelect="none",window.addEventListener("pointermove",this.#$),window.addEventListener("pointerup",this.#J),window.addEventListener("blur",this.#_)}#Y(Q){if(this.type!=="number")return;this.#Q=!1,this.input.style.cursor=this.style.cursor=document.body.style.cursor="",this.style.userSelect="all",window.removeEventListener("pointermove",this.#$),window.removeEventListener("pointerup",this.#J),window.removeEventListener("blur",this.#_)}#B(Q,$=!0){let J=Q;if(this.type==="number"){if(J=Number(J),typeof this.min==="number")J=Math.max($?this.#j(this.min):this.min,J);if(typeof this.max==="number")J=Math.min($?this.#j(this.max):this.max,J);J=this.#X(J)}return J}#X(Q,$=2){const J=Math.round(Q*100)/100;return Number.isInteger(J)?J:J.toFixed($)}static get observedAttributes(){return["value","placeholder","label","disabled","readonly","type","step","min","max","transform","name"]}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"disabled":this.disabled=this.input.disabled=J!==null&&J!=="false";break;case"readonly":this.readonly=J!==null&&J!=="false",this.input.readOnly=this.readonly;break;case"transform":if(this.type==="number")this.transform=Number(J)||1,this.input.value=this.#j(this.value);break;case"value":if(this.#Q)break;let Z=J;if(this.type==="number")Z=this.#B(Z,!1),this.value=Z,this.input.value=this.#j(Z);else this.value=Z,this.input.value=Z;break;case"min":case"max":case"step":if(this[Q]=this.input[Q]=Number(J),this.input)this.input.setAttribute(Q,J);break;case"name":this[Q]=this.input[Q]=J,this.input.setAttribute("name",J);break;default:this[Q]=this.input[Q]=J;break}}}customElements.define("fig-input-text",K0);class X0 extends HTMLElement{#Q;#$;#J;#_;#q;#Z;#j;#K;#W;#G;#Y;#B;#X=!1;#O(){if(!this.input||this.input.type!=="number")return;["min","max","step"].forEach((Q)=>{const $=this.getAttribute(Q);if($===null||$===""){this.input.removeAttribute(Q),this.input[Q]="";return}this.input.setAttribute(Q,$),this.input[Q]=$})}constructor(){super();this.#Q=this.#F.bind(this),this.#$=this.#H.bind(this),this.#J=this.#H.bind(this),this.#_=this.#z.bind(this),this.#q=(Q)=>{Q.stopPropagation(),this.#P(Q)},this.#Z=(Q)=>{Q.stopPropagation(),this.#R(Q)},this.#j=(Q)=>{this.#D(Q)},this.#K=(Q)=>{this.#A(Q)},this.#W=(Q)=>{this.#M(Q)}}connectedCallback(){const Q=this.getAttribute("value");if(this.value=Q!==null&&Q!==""?Number(Q):"",this.placeholder=this.getAttribute("placeholder")||"",this.name=this.getAttribute("name")||null,this.#G=this.getAttribute("units")||"",this.#Y=this.getAttribute("unit-position")||"suffix",this.#B=this.hasAttribute("precision")?Number(this.getAttribute("precision")):2,this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));this.transform=Number(this.getAttribute("transform")||1);const $=this.hasAttribute("steppers")&&this.getAttribute("steppers")!=="false",J=$?"number":"text",Z=$?"":'inputmode="decimal"',_=$?this.#U(this.value):this.#L(this.value);let j=`<input 
+      placeholder="${this.placeholder}">${this.value}</textarea>`;requestAnimationFrame(()=>{let $=this.querySelector("[slot=append]"),J=this.querySelector("[slot=prepend]");if(this.innerHTML=Q,J)J.addEventListener("click",this.focus.bind(this)),this.prepend(J);if($)$.addEventListener("click",this.focus.bind(this)),this.append($);if(this.input=this.querySelector("input,textarea"),this.input.readOnly=this.readonly,this.type==="number"){if(this.getAttribute("min"))this.input.setAttribute("min",this.#j(this.min));if(this.getAttribute("max"))this.input.setAttribute("max",this.#j(this.max));if(this.getAttribute("step"))this.input.setAttribute("step",this.#j(this.step));this.addEventListener("pointerdown",this.#q)}this.input.removeEventListener("change",this.#Z),this.input.addEventListener("change",this.#Z)})}disconnectedCallback(){if(this.input)this.input.removeEventListener("change",this.#Z);this.removeEventListener("pointerdown",this.#q),window.removeEventListener("pointermove",this.#$),window.removeEventListener("pointerup",this.#J),window.removeEventListener("blur",this.#_)}focus(){this.input.focus()}#j(Q){if(Q==="")return"";let $=Number(Q)*(this.transform||1);return $=this.#W($),$}#K(Q){Q.stopPropagation();let $=Q.target.value,J=$;if(this.type==="number")$=$/(this.transform||1),$=this.#B($,!1),J=$*(this.transform||1);this.value=$,this.input.value=J,this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#X(Q){if(this.type!=="number")return;if(Q.buttons===0){this.#G();return}let $=(this.step||1)*Q.movementX,J=Number(this.input.value);J=J/(this.transform||1)+$,J=this.#B(J,!1);let Z=J*(this.transform||1);J=this.#W(J),Z=this.#W(Z),this.value=J,this.input.value=Z,this.dispatchEvent(new CustomEvent("input",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}#Y(Q){if(this.type!=="number")return;if(Q.altKey||Q.target.closest("[slot]"))this.#Q=!0,this.input.style.cursor=this.style.cursor=document.body.style.cursor="ew-resize",this.style.userSelect="none",window.addEventListener("pointermove",this.#$),window.addEventListener("pointerup",this.#J),window.addEventListener("blur",this.#_)}#G(Q){if(this.type!=="number")return;this.#Q=!1,this.input.style.cursor=this.style.cursor=document.body.style.cursor="",this.style.userSelect="all",window.removeEventListener("pointermove",this.#$),window.removeEventListener("pointerup",this.#J),window.removeEventListener("blur",this.#_)}#B(Q,$=!0){let J=Q;if(this.type==="number"){if(J=Number(J),typeof this.min==="number")J=Math.max($?this.#j(this.min):this.min,J);if(typeof this.max==="number")J=Math.min($?this.#j(this.max):this.max,J);J=this.#W(J)}return J}#W(Q,$=2){const J=Math.round(Q*100)/100;return Number.isInteger(J)?J:J.toFixed($)}static get observedAttributes(){return["value","placeholder","label","disabled","readonly","type","step","min","max","transform","name"]}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"disabled":this.disabled=this.input.disabled=J!==null&&J!=="false";break;case"readonly":this.readonly=J!==null&&J!=="false",this.input.readOnly=this.readonly;break;case"transform":if(this.type==="number")this.transform=Number(J)||1,this.input.value=this.#j(this.value);break;case"value":if(this.#Q)break;let Z=J;if(this.type==="number")Z=this.#B(Z,!1),this.value=Z,this.input.value=this.#j(Z);else this.value=Z,this.input.value=Z;break;case"min":case"max":case"step":if(this[Q]=this.input[Q]=Number(J),this.input)this.input.setAttribute(Q,J);break;case"name":this[Q]=this.input[Q]=J,this.input.setAttribute("name",J);break;default:this[Q]=this.input[Q]=J;break}}}customElements.define("fig-input-text",K0);class X0 extends HTMLElement{#Q;#$;#J;#_;#q;#Z;#j;#K;#X;#Y;#G;#B;#W=!1;#N(){if(!this.input||this.input.type!=="number")return;["min","max","step"].forEach((Q)=>{const $=this.getAttribute(Q);if($===null||$===""){this.input.removeAttribute(Q),this.input[Q]="";return}this.input.setAttribute(Q,$),this.input[Q]=$})}constructor(){super();this.#Q=this.#D.bind(this),this.#$=this.#P.bind(this),this.#J=this.#P.bind(this),this.#_=this.#z.bind(this),this.#q=(Q)=>{Q.stopPropagation(),this.#S(Q)},this.#Z=(Q)=>{Q.stopPropagation(),this.#R(Q)},this.#j=(Q)=>{this.#F(Q)},this.#K=(Q)=>{this.#A(Q)},this.#X=(Q)=>{this.#M(Q)}}connectedCallback(){const Q=this.getAttribute("value");if(this.value=Q!==null&&Q!==""?Number(Q):"",this.placeholder=this.getAttribute("placeholder")||"",this.name=this.getAttribute("name")||null,this.#Y=this.getAttribute("units")||"",this.#G=this.getAttribute("unit-position")||"suffix",this.#B=this.hasAttribute("precision")?Number(this.getAttribute("precision")):2,this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));this.transform=Number(this.getAttribute("transform")||1);const $=this.hasAttribute("steppers")&&this.getAttribute("steppers")!=="false",J=$?"number":"text",Z=$?"":'inputmode="decimal"',_=$?this.#U(this.value):this.#L(this.value);let j=`<input 
       type="${J}"
       ${Z}
       ${this.name?`name="${this.name}"`:""}
       placeholder="${this.placeholder}"
-      value="${_}" />`;requestAnimationFrame(()=>{let q=this.querySelector("[slot=append]"),K=this.querySelector("[slot=prepend]");if(this.innerHTML=j,K)K.addEventListener("click",this.focus.bind(this)),this.prepend(K);if(q)q.addEventListener("click",this.focus.bind(this)),this.append(q);if(this.input=this.querySelector("input"),this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));if(this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.#O(),this.hasAttribute("disabled")){const X=this.getAttribute("disabled");this.disabled=this.input.disabled=X!=="false"}this.addEventListener("pointerdown",this.#_),this.input.removeEventListener("change",this.#q),this.input.addEventListener("change",this.#q),this.input.removeEventListener("input",this.#Z),this.input.addEventListener("input",this.#Z),this.input.removeEventListener("focus",this.#j),this.input.addEventListener("focus",this.#j),this.input.removeEventListener("blur",this.#K),this.input.addEventListener("blur",this.#K),this.input.removeEventListener("keydown",this.#W),this.input.addEventListener("keydown",this.#W)})}disconnectedCallback(){if(this.input)this.input.removeEventListener("change",this.#q),this.input.removeEventListener("input",this.#Z),this.input.removeEventListener("focus",this.#j),this.input.removeEventListener("blur",this.#K),this.input.removeEventListener("keydown",this.#W);this.removeEventListener("pointerdown",this.#_),window.removeEventListener("pointermove",this.#Q),window.removeEventListener("pointerup",this.#$),window.removeEventListener("blur",this.#J)}focus(){this.input.focus()}#N(Q){if(!Q)return"";if(!this.#G){let Z=Q.replace(/[^\d.-]/g,"");const _=Z.split(".");if(_.length>2)Z=_[0]+"."+_.slice(1).join("");return Z}let $=Q.replace(this.#G,"").trim();$=$.replace(/[^\d.-]/g,"");const J=$.split(".");if(J.length>2)$=J[0]+"."+J.slice(1).join("");return $}#L(Q){if(Q===""||Q===null||Q===void 0)return"";let $=Number(Q)*(this.transform||1);if(isNaN($))return"";if($=this.#E($),!this.#G)return $.toString();if(this.#Y==="prefix")return this.#G+$;else return $+this.#G}#U(Q){if(Q===""||Q===null||Q===void 0)return"";let $=Number(Q)*(this.transform||1);return $=this.#E($),$.toString()}#D(Q){this.#X=!0,setTimeout(()=>{const $=Q.target.value;if($&&this.#G)if(this.#Y==="prefix")Q.target.setSelectionRange(this.#G.length,$.length);else{const J=$.indexOf(this.#G);if(J>-1)Q.target.setSelectionRange(0,J)}},0)}#A(Q){this.#X=!1;let $=this.#N(Q.target.value);if($!==""){let J=Number($)/(this.transform||1);J=this.#k(J,!1),this.value=J,Q.target.value=this.#L(this.value)}else this.value="",Q.target.value="";this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#M(Q){if(this.disabled)return;if(Q.key!=="ArrowUp"&&Q.key!=="ArrowDown")return;Q.preventDefault();const $=this.step||1,J=Q.shiftKey?10:1,Z=$*J*(Q.key==="ArrowUp"?1:-1);let _=this.#N(this.input.value),j=(_!==""?Number(_)/(this.transform||1):0)+Z;j=this.#k(j,!1),this.value=j,this.input.value=this.#L(this.value),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#R(Q){let $=this.#N(Q.target.value);if($!=="")this.value=Number($)/(this.transform||1);else this.value="";this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}#P(Q){Q.stopPropagation();let $=this.#N(Q.target.value);if($!==""){let J=Number($)/(this.transform||1);J=this.#k(J,!1),this.value=J,Q.target.value=this.#L(this.value)}else this.value="",Q.target.value="";this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#F(Q){if(this.disabled)return;if(Q.buttons===0){this.#H();return}let $=(this.step||1)*Q.movementX,J=this.#N(this.input.value),Z=Number(J)/(this.transform||1)+$;Z=this.#k(Z,!1),this.value=Z,this.input.value=this.#L(this.value),this.dispatchEvent(new CustomEvent("input",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}#z(Q){if(this.disabled)return;if(Q.altKey||Q.target.closest("[slot]"))this.#X=!0,this.input.style.cursor=this.style.cursor=document.body.style.cursor="ew-resize",this.style.userSelect="none",window.addEventListener("pointermove",this.#Q),window.addEventListener("pointerup",this.#$),window.addEventListener("blur",this.#J)}#H(Q){this.#X=!1,this.input.style.cursor=this.style.cursor=document.body.style.cursor="",this.style.userSelect="all",window.removeEventListener("pointermove",this.#Q),window.removeEventListener("pointerup",this.#$),window.removeEventListener("blur",this.#J)}#k(Q,$=!0){let J=Number(Q);if(isNaN(J))return"";if(typeof this.min==="number")J=Math.max(this.min,J);if(typeof this.max==="number")J=Math.min(this.max,J);return J=this.#E(J),J}#E(Q){const $=this.#B??2,J=Math.pow(10,$),Z=Math.round(Q*J)/J;return Number.isInteger(Z)?Z:parseFloat(Z.toFixed($))}static get observedAttributes(){return["value","placeholder","disabled","step","min","max","transform","name","units","unit-position","steppers","precision"]}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"disabled":this.disabled=this.input.disabled=J!==null&&J!=="false";break;case"units":this.#G=J||"",this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"unit-position":this.#Y=J||"suffix",this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"transform":this.transform=Number(J)||1,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"value":if(this.#X)break;let Z=J!==null&&J!==""?Number(J):"";if(Z!=="")Z=this.#k(Z,!1);this.value=Z,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"min":case"max":case"step":if(J===null||J===""){this[Q]=void 0,this.#O();break}this[Q]=Number(J),this.#O();break;case"steppers":{const _=J!==null&&J!=="false";if(this.input.type=_?"number":"text",_)this.input.removeAttribute("inputmode"),this.#O(),this.input.value=this.#U(this.value);else this.input.setAttribute("inputmode","decimal"),this.input.value=this.#L(this.value);break}case"precision":this.#B=J!==null?Number(J):2,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"name":this[Q]=this.input[Q]=J,this.input.setAttribute("name",J);break;default:this[Q]=this.input[Q]=J;break}}}customElements.define("fig-input-number",X0);class W0 extends HTMLElement{constructor(){super()}connectedCallback(){this.src=this.getAttribute("src"),this.name=this.getAttribute("name"),this.initials=this.getInitials(this.name),this.setAttribute("initials",this.initials),this.setSrc(this.src),requestAnimationFrame(()=>{this.img=this.querySelector("img")})}setSrc(Q){if(this.src=Q,Q)this.innerHTML=`<img src="${this.src}" ${this.name?`alt="${this.name}"`:""} />`}getInitials(Q){return Q?Q.split(" ").map(($)=>$[0]).join(""):""}static get observedAttributes(){return["src","href","name"]}attributeChangedCallback(Q,$,J){if(this[Q]=J,Q==="name")this.img?.setAttribute("alt",J),this.name=J,this.initials=this.getInitials(this.name),this.setAttribute("initials",this.initials);else if(Q==="src")this.src=J,this.setSrc(this.src)}}customElements.define("fig-avatar",W0);class Y0 extends HTMLElement{constructor(){super()}static get observedAttributes(){return["label"]}connectedCallback(){requestAnimationFrame(()=>{if(this.label=this.querySelector(":scope>label"),this.input=Array.from(this.childNodes).find((Q)=>Q.nodeName.toLowerCase().startsWith("fig-")),this.input&&this.label){this.label.addEventListener("click",this.focus.bind(this));let Q=this.input.getAttribute("id")||V();this.input.setAttribute("id",Q),this.label.setAttribute("for",Q)}})}attributeChangedCallback(Q,$,J){switch(Q){case"label":if(this.label)this.label.textContent=J;break}}focus(){this.input.focus()}}customElements.define("fig-field",Y0);class G0 extends HTMLElement{rgba;hex;alpha=100;#Q;#$;#J;#_;constructor(){super()}get picker(){return this.getAttribute("picker")||"native"}#q(){const Q={},$=this.getAttribute("experimental");if($)Q.experimental=$;for(let{name:J,value:Z}of this.attributes)if(J.startsWith("picker-")&&J!=="picker-anchor")Q[J.slice(7)]=Z;if(!Q["dialog-position"])Q["dialog-position"]="left";return Object.entries(Q).map(([J,Z])=>`${J}="${Z}"`).join(" ")}connectedCallback(){this.#Z(this.getAttribute("value"));const Q=this.picker==="figma",$=this.picker==="false",J=this.getAttribute("alpha")==="true",Z=this.#q();let _="";if(this.getAttribute("text")){let j=`<fig-input-text 
+      value="${_}" />`;requestAnimationFrame(()=>{let q=this.querySelector("[slot=append]"),K=this.querySelector("[slot=prepend]");if(this.innerHTML=j,K)K.addEventListener("click",this.focus.bind(this)),this.prepend(K);if(q)q.addEventListener("click",this.focus.bind(this)),this.append(q);if(this.input=this.querySelector("input"),this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));if(this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.#N(),this.hasAttribute("disabled")){const X=this.getAttribute("disabled");this.disabled=this.input.disabled=X!=="false"}this.addEventListener("pointerdown",this.#_),this.input.removeEventListener("change",this.#q),this.input.addEventListener("change",this.#q),this.input.removeEventListener("input",this.#Z),this.input.addEventListener("input",this.#Z),this.input.removeEventListener("focus",this.#j),this.input.addEventListener("focus",this.#j),this.input.removeEventListener("blur",this.#K),this.input.addEventListener("blur",this.#K),this.input.removeEventListener("keydown",this.#X),this.input.addEventListener("keydown",this.#X)})}disconnectedCallback(){if(this.input)this.input.removeEventListener("change",this.#q),this.input.removeEventListener("input",this.#Z),this.input.removeEventListener("focus",this.#j),this.input.removeEventListener("blur",this.#K),this.input.removeEventListener("keydown",this.#X);this.removeEventListener("pointerdown",this.#_),window.removeEventListener("pointermove",this.#Q),window.removeEventListener("pointerup",this.#$),window.removeEventListener("blur",this.#J)}focus(){this.input.focus()}#O(Q){if(!Q)return"";if(!this.#Y){let Z=Q.replace(/[^\d.-]/g,"");const _=Z.split(".");if(_.length>2)Z=_[0]+"."+_.slice(1).join("");return Z}let $=Q.replace(this.#Y,"").trim();$=$.replace(/[^\d.-]/g,"");const J=$.split(".");if(J.length>2)$=J[0]+"."+J.slice(1).join("");return $}#L(Q){if(Q===""||Q===null||Q===void 0)return"";let $=Number(Q)*(this.transform||1);if(isNaN($))return"";if($=this.#E($),!this.#Y)return $.toString();if(this.#G==="prefix")return this.#Y+$;else return $+this.#Y}#U(Q){if(Q===""||Q===null||Q===void 0)return"";let $=Number(Q)*(this.transform||1);return $=this.#E($),$.toString()}#F(Q){this.#W=!0,setTimeout(()=>{const $=Q.target.value;if($&&this.#Y)if(this.#G==="prefix")Q.target.setSelectionRange(this.#Y.length,$.length);else{const J=$.indexOf(this.#Y);if(J>-1)Q.target.setSelectionRange(0,J)}},0)}#A(Q){this.#W=!1;let $=this.#O(Q.target.value);if($!==""){let J=Number($)/(this.transform||1);J=this.#k(J,!1),this.value=J,Q.target.value=this.#L(this.value)}else this.value="",Q.target.value="";this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#M(Q){if(this.disabled)return;if(Q.key!=="ArrowUp"&&Q.key!=="ArrowDown")return;Q.preventDefault();const $=this.step||1,J=Q.shiftKey?10:1,Z=$*J*(Q.key==="ArrowUp"?1:-1);let _=this.#O(this.input.value),j=(_!==""?Number(_)/(this.transform||1):0)+Z;j=this.#k(j,!1),this.value=j,this.input.value=this.#L(this.value),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#R(Q){let $=this.#O(Q.target.value);if($!=="")this.value=Number($)/(this.transform||1);else this.value="";this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}#S(Q){Q.stopPropagation();let $=this.#O(Q.target.value);if($!==""){let J=Number($)/(this.transform||1);J=this.#k(J,!1),this.value=J,Q.target.value=this.#L(this.value)}else this.value="",Q.target.value="";this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#D(Q){if(this.disabled)return;if(Q.buttons===0){this.#P();return}let $=(this.step||1)*Q.movementX,J=this.#O(this.input.value),Z=Number(J)/(this.transform||1)+$;Z=this.#k(Z,!1),this.value=Z,this.input.value=this.#L(this.value),this.dispatchEvent(new CustomEvent("input",{bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}#z(Q){if(this.disabled)return;if(Q.altKey||Q.target.closest("[slot]"))this.#W=!0,this.input.style.cursor=this.style.cursor=document.body.style.cursor="ew-resize",this.style.userSelect="none",window.addEventListener("pointermove",this.#Q),window.addEventListener("pointerup",this.#$),window.addEventListener("blur",this.#J)}#P(Q){this.#W=!1,this.input.style.cursor=this.style.cursor=document.body.style.cursor="",this.style.userSelect="all",window.removeEventListener("pointermove",this.#Q),window.removeEventListener("pointerup",this.#$),window.removeEventListener("blur",this.#J)}#k(Q,$=!0){let J=Number(Q);if(isNaN(J))return"";if(typeof this.min==="number")J=Math.max(this.min,J);if(typeof this.max==="number")J=Math.min(this.max,J);return J=this.#E(J),J}#E(Q){const $=this.#B??2,J=Math.pow(10,$),Z=Math.round(Q*J)/J;return Number.isInteger(Z)?Z:parseFloat(Z.toFixed($))}static get observedAttributes(){return["value","placeholder","disabled","step","min","max","transform","name","units","unit-position","steppers","precision"]}attributeChangedCallback(Q,$,J){if(this.input)switch(Q){case"disabled":this.disabled=this.input.disabled=J!==null&&J!=="false";break;case"units":this.#Y=J||"",this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"unit-position":this.#G=J||"suffix",this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"transform":this.transform=Number(J)||1,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"value":if(this.#W)break;let Z=J!==null&&J!==""?Number(J):"";if(Z!=="")Z=this.#k(Z,!1);this.value=Z,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"min":case"max":case"step":if(J===null||J===""){this[Q]=void 0,this.#N();break}this[Q]=Number(J),this.#N();break;case"steppers":{const _=J!==null&&J!=="false";if(this.input.type=_?"number":"text",_)this.input.removeAttribute("inputmode"),this.#N(),this.input.value=this.#U(this.value);else this.input.setAttribute("inputmode","decimal"),this.input.value=this.#L(this.value);break}case"precision":this.#B=J!==null?Number(J):2,this.input.value=this.input.type==="number"?this.#U(this.value):this.#L(this.value);break;case"name":this[Q]=this.input[Q]=J,this.input.setAttribute("name",J);break;default:this[Q]=this.input[Q]=J;break}}}customElements.define("fig-input-number",X0);class W0 extends HTMLElement{constructor(){super()}connectedCallback(){this.src=this.getAttribute("src"),this.name=this.getAttribute("name"),this.initials=this.getInitials(this.name),this.setAttribute("initials",this.initials),this.setSrc(this.src),requestAnimationFrame(()=>{this.img=this.querySelector("img")})}setSrc(Q){if(this.src=Q,Q)this.innerHTML=`<img src="${this.src}" ${this.name?`alt="${this.name}"`:""} />`}getInitials(Q){return Q?Q.split(" ").map(($)=>$[0]).join(""):""}static get observedAttributes(){return["src","href","name"]}attributeChangedCallback(Q,$,J){if(this[Q]=J,Q==="name")this.img?.setAttribute("alt",J),this.name=J,this.initials=this.getInitials(this.name),this.setAttribute("initials",this.initials);else if(Q==="src")this.src=J,this.setSrc(this.src)}}customElements.define("fig-avatar",W0);class Y0 extends HTMLElement{constructor(){super()}static get observedAttributes(){return["label"]}connectedCallback(){requestAnimationFrame(()=>{if(this.label=this.querySelector(":scope>label"),this.input=Array.from(this.childNodes).find((Q)=>Q.nodeName.toLowerCase().startsWith("fig-")),this.input&&this.label){this.label.addEventListener("click",this.focus.bind(this));let Q=this.input.getAttribute("id")||V();this.input.setAttribute("id",Q),this.label.setAttribute("for",Q)}})}attributeChangedCallback(Q,$,J){switch(Q){case"label":if(this.label)this.label.textContent=J;break}}focus(){this.input.focus()}}customElements.define("fig-field",Y0);class G0 extends HTMLElement{rgba;hex;alpha=100;#Q;#$;#J;#_;constructor(){super()}get picker(){return this.getAttribute("picker")||"native"}#q(){const Q={},$=this.getAttribute("experimental");if($)Q.experimental=$;for(let{name:J,value:Z}of this.attributes)if(J.startsWith("picker-")&&J!=="picker-anchor")Q[J.slice(7)]=Z;if(!Q["dialog-position"])Q["dialog-position"]="left";return Object.entries(Q).map(([J,Z])=>`${J}="${Z}"`).join(" ")}connectedCallback(){this.#Z(this.getAttribute("value"));const Q=this.picker==="figma",$=this.picker==="false",J=this.getAttribute("alpha")==="true",Z=this.#q();let _="";if(this.getAttribute("text")){let j=`<fig-input-text 
         type="text"
         placeholder="000000"
         value="${this.hexOpaque.slice(1).toUpperCase()}">
@@ -81,7 +81,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
                 </fig-tooltip>`;let q="";if(!$)q=Q?`<fig-fill-picker mode="solid" ${Z} ${J?"":'alpha="false"'} value='{"type":"solid","color":"${this.hexOpaque}","opacity":${this.alpha}}'></fig-fill-picker>`:`<fig-chit background="${this.hexOpaque}" alpha="${this.rgba.a}"></fig-chit>`;_=`<div class="input-combo">
                 ${q}
                 ${j}
-            </div>`}else if($)_="";else _=Q?`<fig-fill-picker mode="solid" ${Z} ${J?"":'alpha="false"'} value='{"type":"solid","color":"${this.hexOpaque}","opacity":${this.alpha}}'></fig-fill-picker>`:`<fig-chit background="${this.hexOpaque}" alpha="${this.rgba.a}"></fig-chit>`;this.innerHTML=_,requestAnimationFrame(()=>{if(this.#Q=this.querySelector("fig-chit"),this.#$=this.querySelector("fig-fill-picker"),this.#J=this.querySelector("fig-input-text:not([type=number])"),this.#_=this.querySelector("fig-input-number"),this.#Q)this.#Q.disabled=this.hasAttribute("disabled"),this.#Q.addEventListener("input",this.#G.bind(this));if(this.#$){const j=this.getAttribute("picker-anchor");if(j==="self")this.#$.anchorElement=this;else if(j){const q=document.querySelector(j);if(q)this.#$.anchorElement=q}if(this.hasAttribute("disabled"))this.#$.setAttribute("disabled","");this.#$.addEventListener("input",this.#Y.bind(this)),this.#$.addEventListener("change",this.#W.bind(this))}if(this.#J){const j=this.rgbAlphaToHex(this.rgba,1);if(this.#J.value=j.slice(1).toUpperCase(),this.#Q)this.#Q.background=j;this.#J.addEventListener("input",this.#j.bind(this)),this.#J.addEventListener("change",this.#W.bind(this))}if(this.#_)this.#_.addEventListener("input",this.#K.bind(this)),this.#_.addEventListener("change",this.#W.bind(this))})}#Z(Q){if(this.rgba=this.convertToRGBA(Q),this.value=this.rgbAlphaToHex({r:isNaN(this.rgba.r)?0:this.rgba.r,g:isNaN(this.rgba.g)?0:this.rgba.g,b:isNaN(this.rgba.b)?0:this.rgba.b},this.rgba.a),this.hexWithAlpha=this.value.toUpperCase(),this.hexOpaque=this.hexWithAlpha.slice(0,7),Q.length>7)this.alpha=(this.rgba.a*100).toFixed(0);this.style.setProperty("--alpha",this.rgba.a)}#j(Q){Q.stopPropagation();let $=Q.target.value.replace("#","");if(this.#Z("#"+$),this.#_)this.#_.setAttribute("value",this.alpha);if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque);this.#B()}#K(Q){Q.stopPropagation();const $=Number(Q.target.value)||0,Z=Math.round($/100*255).toString(16).padStart(2,"0");if(this.#Z(this.hexOpaque+Z),this.#Q)this.#Q.setAttribute("alpha",this.rgba.a);if(this.#$)this.#$.setAttribute("value",JSON.stringify({type:"solid",color:this.hexOpaque,opacity:this.alpha}));this.#B()}#W(Q){Q.stopPropagation(),this.#X()}focus(){this.#Q.focus()}#G(Q){if(Q.stopPropagation(),this.#Z(Q.target.value),this.#J)this.#J.setAttribute("value",this.hexOpaque.slice(1).toUpperCase());this.#B()}#Y(Q){Q.stopPropagation();const $=Q.detail;if($&&$.color){let J=$.color;if($.alpha!==void 0){const Z=Math.round($.alpha*255).toString(16).padStart(2,"0");J=$.color+Z}if(this.#Z(J),this.#J)this.#J.setAttribute("value",this.hexOpaque.slice(1).toUpperCase());if(this.#_&&$.alpha!==void 0)this.#_.setAttribute("value",Math.round($.alpha*100));if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque),this.#Q.setAttribute("alpha",this.rgba.a);this.#B()}}#B(){const Q=new CustomEvent("input",{bubbles:!0,cancelable:!0});this.dispatchEvent(Q)}#X(){const Q=new CustomEvent("change",{bubbles:!0,cancelable:!0});this.dispatchEvent(Q)}static get observedAttributes(){return["value","style","mode","picker","experimental"]}get mode(){return this.getAttribute("mode")}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":if(this.#Z(J),this.#J)this.#J.setAttribute("value",this.value);if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque),this.#Q.setAttribute("alpha",this.rgba.a);if(this.#$)this.#$.setAttribute("value",JSON.stringify({type:"solid",color:this.hexOpaque,opacity:this.alpha}));if(this.#_)this.#_.setAttribute("value",this.alpha);break;case"mode":if(this.#$&&J)this.#$.setAttribute("mode",J);break;case"picker":break}}rgbAlphaToHex({r:Q,g:$,b:J},Z=1){Q=Math.max(0,Math.min(255,Math.round(Q))),$=Math.max(0,Math.min(255,Math.round($))),J=Math.max(0,Math.min(255,Math.round(J))),Z=Math.max(0,Math.min(1,Z));const _=Q.toString(16).padStart(2,"0"),j=$.toString(16).padStart(2,"0"),q=J.toString(16).padStart(2,"0");if(Z===1)return`#${_}${j}${q}`.toUpperCase();const X=Math.round(Z*255).toString(16).padStart(2,"0");return`#${_}${j}${q}${X}`.toUpperCase()}convertToRGBA(Q){let $,J,Z,_=1;if(Q.startsWith("#")){let j=Q.slice(1);if(j.length===8)_=parseInt(j.slice(6),16)/255,j=j.slice(0,6);$=parseInt(j.slice(0,2),16),J=parseInt(j.slice(2,4),16),Z=parseInt(j.slice(4,6),16)}else if(Q.startsWith("rgba")||Q.startsWith("rgb")){let j=Q.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)/);if(j)$=parseInt(j[1]),J=parseInt(j[2]),Z=parseInt(j[3]),_=j[4]?parseFloat(j[4]):1}else if(Q.startsWith("hsla")||Q.startsWith("hsl")){let j=Q.match(/hsla?\((\d+),\s*(\d+)%,\s*(\d+)%(?:,\s*(\d+(?:\.\d+)?))?\)/);if(j){let q=parseInt(j[1])/360,K=parseInt(j[2])/100,X=parseInt(j[3])/100;if(_=j[4]?parseFloat(j[4]):1,K===0)$=J=Z=X;else{let W=(G,O,B)=>{if(B<0)B+=1;if(B>1)B-=1;if(B<0.16666666666666666)return G+(O-G)*6*B;if(B<0.5)return O;if(B<0.6666666666666666)return G+(O-G)*(0.6666666666666666-B)*6;return G},L=X<0.5?X*(1+K):X+K-X*K,U=2*X-L;$=W(U,L,q+0.3333333333333333),J=W(U,L,q),Z=W(U,L,q-0.3333333333333333)}$=Math.round($*255),J=Math.round(J*255),Z=Math.round(Z*255)}}else return null;return{r:$,g:J,b:Z,a:_}}}customElements.define("fig-input-color",G0);class B0 extends HTMLElement{#Q="solid";#$;#J;#_;#q={color:"#D9D9D9",alpha:1};#Z={type:"linear",angle:180,stops:[{position:0,color:"#D9D9D9",opacity:100},{position:100,color:"#737373",opacity:100}]};#j={url:null,scaleMode:"fill",scale:50,opacity:1};#K={url:null,scaleMode:"fill",opacity:1};#W={snapshot:null,opacity:1};constructor(){super()}static get observedAttributes(){return["value","disabled","mode","experimental","alpha"]}connectedCallback(){this.#G(),this.#B()}#G(){const Q=this.getAttribute("value");if(!Q)return;try{const $=JSON.parse(Q);if($.type)this.#Q=$.type;switch(this.#Q){case"solid":if($.color)this.#q.color=$.color;if($.alpha!==void 0)this.#q.alpha=$.alpha;if($.opacity!==void 0)this.#q.alpha=$.opacity/100;break;case"gradient":if($.gradient)this.#Z={...this.#Z,...$.gradient};break;case"image":if($.image)this.#j={...this.#j,...$.image};break;case"video":if($.video)this.#K={...this.#K,...$.video};break;case"webcam":if($.webcam)this.#W={...this.#W,...$.webcam};if($.opacity!==void 0)this.#W.opacity=$.opacity;break}}catch($){if(Q.startsWith("#")){if(this.#Q="solid",this.#q.color=Q.slice(0,7),Q.length>7){const J=Q.slice(7,9);this.#q.alpha=parseInt(J,16)/255}}}}#Y(){const Q={},$=this.getAttribute("mode");if($)Q.mode=$;const J=this.getAttribute("experimental");if(J)Q.experimental=J;const Z=this.getAttribute("alpha");if(Z)Q.alpha=Z;for(let{name:_,value:j}of this.attributes)if(_.startsWith("picker-")&&_!=="picker-anchor")Q[_.slice(7)]=j;if(!Q["dialog-position"])Q["dialog-position"]="left";return Object.entries(Q).map(([_,j])=>`${_}="${j}"`).join(" ")}#B(){const Q=this.hasAttribute("disabled"),$=JSON.stringify(this.value),J=this.getAttribute("alpha")!=="false",Z=(q)=>J?`<fig-tooltip text="Opacity">
+            </div>`}else if($)_="";else _=Q?`<fig-fill-picker mode="solid" ${Z} ${J?"":'alpha="false"'} value='{"type":"solid","color":"${this.hexOpaque}","opacity":${this.alpha}}'></fig-fill-picker>`:`<fig-chit background="${this.hexOpaque}" alpha="${this.rgba.a}"></fig-chit>`;this.innerHTML=_,requestAnimationFrame(()=>{if(this.#Q=this.querySelector("fig-chit"),this.#$=this.querySelector("fig-fill-picker"),this.#J=this.querySelector("fig-input-text:not([type=number])"),this.#_=this.querySelector("fig-input-number"),this.#Q)this.#Q.disabled=this.hasAttribute("disabled"),this.#Q.addEventListener("input",this.#Y.bind(this));if(this.#$){const j=this.getAttribute("picker-anchor");if(j==="self")this.#$.anchorElement=this;else if(j){const q=document.querySelector(j);if(q)this.#$.anchorElement=q}if(this.hasAttribute("disabled"))this.#$.setAttribute("disabled","");this.#$.addEventListener("input",this.#G.bind(this)),this.#$.addEventListener("change",this.#X.bind(this))}if(this.#J){const j=this.rgbAlphaToHex(this.rgba,1);if(this.#J.value=j.slice(1).toUpperCase(),this.#Q)this.#Q.background=j;this.#J.addEventListener("input",this.#j.bind(this)),this.#J.addEventListener("change",this.#X.bind(this))}if(this.#_)this.#_.addEventListener("input",this.#K.bind(this)),this.#_.addEventListener("change",this.#X.bind(this))})}#Z(Q){if(this.rgba=this.convertToRGBA(Q),this.value=this.rgbAlphaToHex({r:isNaN(this.rgba.r)?0:this.rgba.r,g:isNaN(this.rgba.g)?0:this.rgba.g,b:isNaN(this.rgba.b)?0:this.rgba.b},this.rgba.a),this.hexWithAlpha=this.value.toUpperCase(),this.hexOpaque=this.hexWithAlpha.slice(0,7),Q.length>7)this.alpha=(this.rgba.a*100).toFixed(0);this.style.setProperty("--alpha",this.rgba.a)}#j(Q){Q.stopPropagation();let $=Q.target.value.replace("#","");if(this.#Z("#"+$),this.#_)this.#_.setAttribute("value",this.alpha);if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque);this.#B()}#K(Q){Q.stopPropagation();const $=Number(Q.target.value)||0,Z=Math.round($/100*255).toString(16).padStart(2,"0");if(this.#Z(this.hexOpaque+Z),this.#Q)this.#Q.setAttribute("alpha",this.rgba.a);if(this.#$)this.#$.setAttribute("value",JSON.stringify({type:"solid",color:this.hexOpaque,opacity:this.alpha}));this.#B()}#X(Q){Q.stopPropagation(),this.#W()}focus(){this.#Q.focus()}#Y(Q){if(Q.stopPropagation(),this.#Z(Q.target.value),this.#J)this.#J.setAttribute("value",this.hexOpaque.slice(1).toUpperCase());this.#B()}#G(Q){Q.stopPropagation();const $=Q.detail;if($&&$.color){let J=$.color;if($.alpha!==void 0){const Z=Math.round($.alpha*255).toString(16).padStart(2,"0");J=$.color+Z}if(this.#Z(J),this.#J)this.#J.setAttribute("value",this.hexOpaque.slice(1).toUpperCase());if(this.#_&&$.alpha!==void 0)this.#_.setAttribute("value",Math.round($.alpha*100));if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque),this.#Q.setAttribute("alpha",this.rgba.a);this.#B()}}#B(){const Q=new CustomEvent("input",{bubbles:!0,cancelable:!0});this.dispatchEvent(Q)}#W(){const Q=new CustomEvent("change",{bubbles:!0,cancelable:!0});this.dispatchEvent(Q)}static get observedAttributes(){return["value","style","mode","picker","experimental"]}get mode(){return this.getAttribute("mode")}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":if(this.#Z(J),this.#J)this.#J.setAttribute("value",this.value);if(this.#Q)this.#Q.setAttribute("background",this.hexOpaque),this.#Q.setAttribute("alpha",this.rgba.a);if(this.#$)this.#$.setAttribute("value",JSON.stringify({type:"solid",color:this.hexOpaque,opacity:this.alpha}));if(this.#_)this.#_.setAttribute("value",this.alpha);break;case"mode":if(this.#$&&J)this.#$.setAttribute("mode",J);break;case"picker":break}}rgbAlphaToHex({r:Q,g:$,b:J},Z=1){Q=Math.max(0,Math.min(255,Math.round(Q))),$=Math.max(0,Math.min(255,Math.round($))),J=Math.max(0,Math.min(255,Math.round(J))),Z=Math.max(0,Math.min(1,Z));const _=Q.toString(16).padStart(2,"0"),j=$.toString(16).padStart(2,"0"),q=J.toString(16).padStart(2,"0");if(Z===1)return`#${_}${j}${q}`.toUpperCase();const X=Math.round(Z*255).toString(16).padStart(2,"0");return`#${_}${j}${q}${X}`.toUpperCase()}convertToRGBA(Q){let $,J,Z,_=1;if(Q.startsWith("#")){let j=Q.slice(1);if(j.length===8)_=parseInt(j.slice(6),16)/255,j=j.slice(0,6);$=parseInt(j.slice(0,2),16),J=parseInt(j.slice(2,4),16),Z=parseInt(j.slice(4,6),16)}else if(Q.startsWith("rgba")||Q.startsWith("rgb")){let j=Q.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)/);if(j)$=parseInt(j[1]),J=parseInt(j[2]),Z=parseInt(j[3]),_=j[4]?parseFloat(j[4]):1}else if(Q.startsWith("hsla")||Q.startsWith("hsl")){let j=Q.match(/hsla?\((\d+),\s*(\d+)%,\s*(\d+)%(?:,\s*(\d+(?:\.\d+)?))?\)/);if(j){let q=parseInt(j[1])/360,K=parseInt(j[2])/100,X=parseInt(j[3])/100;if(_=j[4]?parseFloat(j[4]):1,K===0)$=J=Z=X;else{let W=(G,N,B)=>{if(B<0)B+=1;if(B>1)B-=1;if(B<0.16666666666666666)return G+(N-G)*6*B;if(B<0.5)return N;if(B<0.6666666666666666)return G+(N-G)*(0.6666666666666666-B)*6;return G},L=X<0.5?X*(1+K):X+K-X*K,U=2*X-L;$=W(U,L,q+0.3333333333333333),J=W(U,L,q),Z=W(U,L,q-0.3333333333333333)}$=Math.round($*255),J=Math.round(J*255),Z=Math.round(Z*255)}}else return null;return{r:$,g:J,b:Z,a:_}}}customElements.define("fig-input-color",G0);class B0 extends HTMLElement{#Q="solid";#$;#J;#_;#q={color:"#D9D9D9",alpha:1};#Z={type:"linear",angle:180,stops:[{position:0,color:"#D9D9D9",opacity:100},{position:100,color:"#737373",opacity:100}]};#j={url:null,scaleMode:"fill",scale:50,opacity:1};#K={url:null,scaleMode:"fill",opacity:1};#X={snapshot:null,opacity:1};constructor(){super()}static get observedAttributes(){return["value","disabled","mode","experimental","alpha"]}connectedCallback(){this.#Y(),this.#B()}#Y(){const Q=this.getAttribute("value");if(!Q)return;try{const $=JSON.parse(Q);if($.type)this.#Q=$.type;switch(this.#Q){case"solid":if($.color)this.#q.color=$.color;if($.alpha!==void 0)this.#q.alpha=$.alpha;if($.opacity!==void 0)this.#q.alpha=$.opacity/100;break;case"gradient":if($.gradient)this.#Z={...this.#Z,...$.gradient};break;case"image":if($.image)this.#j={...this.#j,...$.image};break;case"video":if($.video)this.#K={...this.#K,...$.video};break;case"webcam":if($.webcam)this.#X={...this.#X,...$.webcam};if($.opacity!==void 0)this.#X.opacity=$.opacity;break}}catch($){if(Q.startsWith("#")){if(this.#Q="solid",this.#q.color=Q.slice(0,7),Q.length>7){const J=Q.slice(7,9);this.#q.alpha=parseInt(J,16)/255}}}}#G(){const Q={},$=this.getAttribute("mode");if($)Q.mode=$;const J=this.getAttribute("experimental");if(J)Q.experimental=J;const Z=this.getAttribute("alpha");if(Z)Q.alpha=Z;for(let{name:_,value:j}of this.attributes)if(_.startsWith("picker-")&&_!=="picker-anchor")Q[_.slice(7)]=j;if(!Q["dialog-position"])Q["dialog-position"]="left";return Object.entries(Q).map(([_,j])=>`${_}="${j}"`).join(" ")}#B(){const Q=this.hasAttribute("disabled"),$=JSON.stringify(this.value),J=this.getAttribute("alpha")!=="false",Z=(q)=>J?`<fig-tooltip text="Opacity">
             <fig-input-number 
               class="fig-input-fill-opacity"
               placeholder="##" 
@@ -107,11 +107,11 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           <label class="fig-input-fill-label">Video</label>
           ${Z(Math.round((this.#K.opacity??1)*100))}`;break;case"webcam":_=`
           <label class="fig-input-fill-label">Webcam</label>
-          ${Z(Math.round((this.#W.opacity??1)*100))}`;break}const j=this.#Y();this.innerHTML=`
+          ${Z(Math.round((this.#X.opacity??1)*100))}`;break}const j=this.#G();this.innerHTML=`
       <div class="input-combo">
         <fig-fill-picker ${j} value='${$}' ${Q?"disabled":""}></fig-fill-picker>
         ${_}
-      </div>`,this.#X()}#X(){requestAnimationFrame(()=>{this.#$=this.querySelector("fig-fill-picker"),this.#J=this.querySelector(".fig-input-fill-opacity"),this.#_=this.querySelector(".fig-input-fill-hex");const Q=this.querySelector(".fig-input-fill-label");if(Q&&this.#$)Q.addEventListener("click",()=>{const $=this.#$.querySelector("fig-chit");if($)$.click()});if(this.#$){const $=this.getAttribute("picker-anchor");if(!$||$==="self")this.#$.anchorElement=this;else{const J=document.querySelector($);if(J)this.#$.anchorElement=J}this.#$.addEventListener("input",(J)=>{J.stopPropagation();const Z=J.detail;if(!Z)return;const _=Z.type,j=_!==this.#Q;switch(this.#Q=_,_){case"solid":this.#q.color=Z.color,this.#q.alpha=Z.alpha;break;case"gradient":if(Z.gradient)this.#Z=Z.gradient;break;case"image":if(Z.image)this.#j=Z.image;break;case"video":if(Z.video)this.#K=Z.video;break}if(j)this.#N();else this.#O();this.#D()}),this.#$.addEventListener("change",(J)=>{J.stopPropagation(),this.#A()})}if(this.#_)this.#_.addEventListener("input",($)=>{$.stopPropagation();const J="#"+$.target.value.replace("#","");this.#q.color=J,this.#L(),this.#D()}),this.#_.addEventListener("change",($)=>{$.stopPropagation(),this.#A()});if(this.#J)this.#J.addEventListener("input",($)=>{$.stopPropagation();const J=parseFloat($.target.value),Z=isNaN(J)?100:J,_=Z/100;switch(this.#Q){case"solid":this.#q.alpha=_;break;case"gradient":this.#Z.stops.forEach((j)=>{j.opacity=Z});break;case"image":this.#j.opacity=_;break;case"video":this.#K.opacity=_;break;case"webcam":this.#W.opacity=_;break}this.#L(),this.#U(_),this.#D()}),this.#J.addEventListener("change",($)=>{$.stopPropagation(),this.#A()})})}#O(){switch(this.#Q){case"solid":if(this.#_)this.#_.setAttribute("value",this.#q.color.slice(1).toUpperCase());if(this.#J)this.#J.setAttribute("value",Math.round(this.#q.alpha*100));break;case"gradient":{if(this.#J)this.#J.setAttribute("value",this.#Z.stops[0]?.opacity??100);const Q=this.querySelector(".fig-input-fill-label");if(Q){const $=this.#Z.type.charAt(0).toUpperCase()+this.#Z.type.slice(1);Q.textContent=$}break}case"image":if(this.#J)this.#J.setAttribute("value",Math.round((this.#j.opacity??1)*100));break;case"video":if(this.#J)this.#J.setAttribute("value",Math.round((this.#K.opacity??1)*100));break;case"webcam":if(this.#J)this.#J.setAttribute("value",Math.round((this.#W.opacity??1)*100));break}}#N(){const Q=this.hasAttribute("disabled"),$=this.querySelector(".input-combo");if(!$)return;const J=$.querySelector(".fig-input-fill-label"),Z=$.querySelector(".fig-input-fill-hex"),_=$.querySelector(".fig-input-fill-opacity"),j=$.querySelectorAll("fig-tooltip");J?.remove(),Z?.remove(),j.forEach((K)=>K.remove());let q="";switch(this.#Q){case"solid":q=`
+      </div>`,this.#W()}#W(){requestAnimationFrame(()=>{this.#$=this.querySelector("fig-fill-picker"),this.#J=this.querySelector(".fig-input-fill-opacity"),this.#_=this.querySelector(".fig-input-fill-hex");const Q=this.querySelector(".fig-input-fill-label");if(Q&&this.#$)Q.addEventListener("click",()=>{const $=this.#$.querySelector("fig-chit");if($)$.click()});if(this.#$){const $=this.getAttribute("picker-anchor");if(!$||$==="self")this.#$.anchorElement=this;else{const J=document.querySelector($);if(J)this.#$.anchorElement=J}this.#$.addEventListener("input",(J)=>{J.stopPropagation();const Z=J.detail;if(!Z)return;const _=Z.type,j=_!==this.#Q;switch(this.#Q=_,_){case"solid":this.#q.color=Z.color,this.#q.alpha=Z.alpha;break;case"gradient":if(Z.gradient)this.#Z=Z.gradient;break;case"image":if(Z.image)this.#j=Z.image;break;case"video":if(Z.video)this.#K=Z.video;break}if(j)this.#O();else this.#N();this.#F()}),this.#$.addEventListener("change",(J)=>{J.stopPropagation(),this.#A()})}if(this.#_)this.#_.addEventListener("input",($)=>{$.stopPropagation();const J="#"+$.target.value.replace("#","");this.#q.color=J,this.#L(),this.#F()}),this.#_.addEventListener("change",($)=>{$.stopPropagation(),this.#A()});if(this.#J)this.#J.addEventListener("input",($)=>{$.stopPropagation();const J=parseFloat($.target.value),Z=isNaN(J)?100:J,_=Z/100;switch(this.#Q){case"solid":this.#q.alpha=_;break;case"gradient":this.#Z.stops.forEach((j)=>{j.opacity=Z});break;case"image":this.#j.opacity=_;break;case"video":this.#K.opacity=_;break;case"webcam":this.#X.opacity=_;break}this.#L(),this.#U(_),this.#F()}),this.#J.addEventListener("change",($)=>{$.stopPropagation(),this.#A()})})}#N(){switch(this.#Q){case"solid":if(this.#_)this.#_.setAttribute("value",this.#q.color.slice(1).toUpperCase());if(this.#J)this.#J.setAttribute("value",Math.round(this.#q.alpha*100));break;case"gradient":{if(this.#J)this.#J.setAttribute("value",this.#Z.stops[0]?.opacity??100);const Q=this.querySelector(".fig-input-fill-label");if(Q){const $=this.#Z.type.charAt(0).toUpperCase()+this.#Z.type.slice(1);Q.textContent=$}break}case"image":if(this.#J)this.#J.setAttribute("value",Math.round((this.#j.opacity??1)*100));break;case"video":if(this.#J)this.#J.setAttribute("value",Math.round((this.#K.opacity??1)*100));break;case"webcam":if(this.#J)this.#J.setAttribute("value",Math.round((this.#X.opacity??1)*100));break}}#O(){const Q=this.hasAttribute("disabled"),$=this.querySelector(".input-combo");if(!$)return;const J=$.querySelector(".fig-input-fill-label"),Z=$.querySelector(".fig-input-fill-hex"),_=$.querySelector(".fig-input-fill-opacity"),j=$.querySelectorAll("fig-tooltip");J?.remove(),Z?.remove(),j.forEach((K)=>K.remove());let q="";switch(this.#Q){case"solid":q=`
           <fig-input-text 
             type="text"
             class="fig-input-fill-hex"
@@ -173,11 +173,11 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
               placeholder="##" 
               min="0"
               max="100"
-              value="${Math.round((this.#W.opacity??1)*100)}"
+              value="${Math.round((this.#X.opacity??1)*100)}"
               units="%"
               ${Q?"disabled":""}>
             </fig-input-number>
-          </fig-tooltip>`;break}$.insertAdjacentHTML("beforeend",q),requestAnimationFrame(()=>{this.#J=this.querySelector(".fig-input-fill-opacity"),this.#_=this.querySelector(".fig-input-fill-hex");const K=this.querySelector(".fig-input-fill-label");if(K&&this.#$)K.addEventListener("click",()=>{const X=this.#$.querySelector("fig-chit");if(X)X.click()});if(this.#_)this.#_.addEventListener("input",(X)=>{X.stopPropagation();const W="#"+X.target.value.replace("#","");this.#q.color=W,this.#L(),this.#D()}),this.#_.addEventListener("change",(X)=>{X.stopPropagation(),this.#A()});if(this.#J)this.#J.addEventListener("input",(X)=>{X.stopPropagation();const W=parseFloat(X.target.value),L=isNaN(W)?100:W,U=L/100;switch(this.#Q){case"solid":this.#q.alpha=U;break;case"gradient":this.#Z.stops.forEach((G)=>{G.opacity=L});break;case"image":this.#j.opacity=U;break;case"video":this.#K.opacity=U;break;case"webcam":this.#W.opacity=U;break}this.#L(),this.#U(U),this.#D()}),this.#J.addEventListener("change",(X)=>{X.stopPropagation(),this.#A()})})}#L(){if(this.#$)this.#$.setAttribute("value",JSON.stringify(this.value))}#U(Q){if(this.#$){const $=this.#$.querySelector("fig-chit");if($)$.setAttribute("alpha",Q)}}#D(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:this.value}))}#A(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.value}))}get value(){switch(this.#Q){case"solid":return{type:"solid",color:this.#q.color,alpha:this.#q.alpha,opacity:Math.round(this.#q.alpha*100)};case"gradient":return{type:"gradient",gradient:{...this.#Z}};case"image":return{type:"image",image:{...this.#j}};case"video":return{type:"video",video:{...this.#K}};case"webcam":return{type:"webcam",webcam:{...this.#W}};default:return{type:this.#Q}}}set value(Q){if(typeof Q==="string")this.setAttribute("value",Q);else this.setAttribute("value",JSON.stringify(Q))}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":const Z=this.#Q;if(this.#G(),this.#$)if(this.#Q!==Z)this.#B();else this.#L(),this.#O();break;case"disabled":if(this.#$)this.#B();break;case"mode":case"experimental":if(this.#$)if(J)this.#$.setAttribute(Q,J);else this.#$.removeAttribute(Q);break}}}customElements.define("fig-input-fill",B0);class h extends HTMLElement{#Q=null;#$;constructor(){super();this.input=document.createElement("input"),this.name=this.getAttribute("name")||"checkbox",this.input.value=this.getAttribute("value")||"",this.input.setAttribute("id",V()),this.input.setAttribute("name",this.name),this.input.setAttribute("type","checkbox"),this.input.setAttribute("role","checkbox"),this.#$=this.handleInput.bind(this)}connectedCallback(){const Q=this.querySelector(":scope > input");if(Q)this.input=Q;else if(!this.input.parentNode)this.append(this.input);if(this.input.checked=this.hasAttribute("checked")&&this.getAttribute("checked")!=="false",this.input.removeEventListener("change",this.#$),this.input.addEventListener("change",this.#$),this.hasAttribute("disabled"))this.input.disabled=!0;if(this.hasAttribute("indeterminate"))this.input.indeterminate=!0,this.input.setAttribute("indeterminate","true");const $=this.querySelector(":scope > label");if($)this.#Q=$,this.#Q.setAttribute("for",this.input.id);if(this.hasAttribute("label"))this.#J(),this.#Q.innerText=this.getAttribute("label");this.render()}static get observedAttributes(){return["disabled","label","checked","name","value","indeterminate"]}#J(){if(!this.#Q)this.#Q=document.createElement("label"),this.#Q.setAttribute("for",this.input.id);if(this.#Q&&!this.#Q.parentNode&&this.input.parentNode)this.input.after(this.#Q)}render(){}focus(){this.input.focus()}get value(){return this.input.value}set value(Q){this.input.value=Q,this.setAttribute("value",Q)}get checked(){return this.input.checked}set checked(Q){if(this.input.checked=Q,Q)this.setAttribute("checked","");else this.removeAttribute("checked")}disconnectedCallback(){this.input.removeEventListener("change",this.#$),this.input.remove()}attributeChangedCallback(Q,$,J){switch(Q){case"label":if(J)this.#J(),this.#Q.innerText=J;else if(this.#Q)this.#Q.remove(),this.#Q=null;break;case"checked":if(this.input.checked=this.hasAttribute("checked")&&this.getAttribute("checked")!=="false",this.input.checked&&this.hasAttribute("indeterminate"))this.removeAttribute("indeterminate");if(this.input.indeterminate=this.hasAttribute("indeterminate")&&this.getAttribute("indeterminate")!=="false"&&!this.input.checked,this.input.indeterminate)this.input.setAttribute("indeterminate","true");else this.input.removeAttribute("indeterminate");break;case"indeterminate":if(this.input.indeterminate=this.hasAttribute("indeterminate")&&this.getAttribute("indeterminate")!=="false"&&!this.input.checked,this.input.indeterminate)this.input.setAttribute("indeterminate","true");else this.input.removeAttribute("indeterminate");break;case"value":this.input.value=J;break;default:this.input[Q]=J,this.input.setAttribute(Q,J);break}}handleInput(Q){if(Q.stopPropagation(),this.input.indeterminate=!1,this.input.removeAttribute("indeterminate"),this.input.setAttribute("aria-checked",this.input.checked),this.input.checked)this.setAttribute("checked","");else this.removeAttribute("checked");this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,detail:{checked:this.input.checked,value:this.input.value}})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{checked:this.input.checked,value:this.input.value}}))}}customElements.define("fig-checkbox",h);class L0 extends h{constructor(){super();this.input.setAttribute("type","radio"),this.input.setAttribute("name",this.getAttribute("name")||"radio")}}customElements.define("fig-radio",L0);class U0 extends h{render(){this.input.setAttribute("class","switch"),this.input.setAttribute("role","switch")}}customElements.define("fig-switch",U0);class O0 extends HTMLDialogElement{_defaultOffset=16;_autoCloseTimer=null;constructor(){super()}getOffset(){return parseInt(this.getAttribute("offset")??this._defaultOffset)}connectedCallback(){if(typeof this._defaultOffset!=="number")this._defaultOffset=16;if(typeof this._autoCloseTimer==="undefined")this._autoCloseTimer=null;if(!this.hasAttribute("theme"))this.setAttribute("theme","dark");const Q=this.getAttribute("open")==="true"||this.getAttribute("open")==="";if(this.hasAttribute("open")&&!Q)this.removeAttribute("open");if(!Q)this.close();requestAnimationFrame(()=>{if(this.addCloseListeners(),this.applyPosition(),Q)this.showToast()})}disconnectedCallback(){this.clearAutoClose()}addCloseListeners(){this.querySelectorAll("[close-toast]").forEach((Q)=>{Q.removeEventListener("click",this.handleClose),Q.addEventListener("click",this.handleClose.bind(this))})}handleClose(){this.hideToast()}applyPosition(){this.style.position="fixed",this.style.margin="0",this.style.top="auto",this.style.bottom=`${this.getOffset()}px`,this.style.left="50%",this.style.right="auto",this.style.transform="translateX(-50%)"}startAutoClose(){this.clearAutoClose();const Q=parseInt(this.getAttribute("duration")??"5000");if(Q>0)this._autoCloseTimer=setTimeout(()=>{this.hideToast()},Q)}clearAutoClose(){if(this._autoCloseTimer)clearTimeout(this._autoCloseTimer),this._autoCloseTimer=null}showToast(){this.show(),this.applyPosition(),this.startAutoClose(),this.dispatchEvent(new CustomEvent("toast-show",{bubbles:!0}))}hideToast(){this.clearAutoClose(),this.close(),this.dispatchEvent(new CustomEvent("toast-hide",{bubbles:!0}))}static get observedAttributes(){return["duration","offset","open","theme"]}attributeChangedCallback(Q,$,J){if(Q==="offset")this.applyPosition();if(Q==="open")if(J!==null&&J!=="false")this.showToast();else this.hideToast()}}c("fig-toast",O0,{extends:"dialog"});class N0 extends HTMLElement{#Q=!1;#$=null;constructor(){super();this.#$=this.handleSelectInput.bind(this)}getOptionsFromAttribute(){return(this.getAttribute("options")||"").split(",")}connectedCallback(){const Q=Array.from(this.children).find((_)=>_.tagName==="FIG-DROPDOWN")||null;if(this.#Q=Q!==null,Q)Q.remove();this.options=this.getOptionsFromAttribute(),this.placeholder=this.getAttribute("placeholder")||"",this.value=this.getAttribute("value")||"";const $=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"",Z=this.#Q?"":`<fig-dropdown type="dropdown" ${J}>
+          </fig-tooltip>`;break}$.insertAdjacentHTML("beforeend",q),requestAnimationFrame(()=>{this.#J=this.querySelector(".fig-input-fill-opacity"),this.#_=this.querySelector(".fig-input-fill-hex");const K=this.querySelector(".fig-input-fill-label");if(K&&this.#$)K.addEventListener("click",()=>{const X=this.#$.querySelector("fig-chit");if(X)X.click()});if(this.#_)this.#_.addEventListener("input",(X)=>{X.stopPropagation();const W="#"+X.target.value.replace("#","");this.#q.color=W,this.#L(),this.#F()}),this.#_.addEventListener("change",(X)=>{X.stopPropagation(),this.#A()});if(this.#J)this.#J.addEventListener("input",(X)=>{X.stopPropagation();const W=parseFloat(X.target.value),L=isNaN(W)?100:W,U=L/100;switch(this.#Q){case"solid":this.#q.alpha=U;break;case"gradient":this.#Z.stops.forEach((G)=>{G.opacity=L});break;case"image":this.#j.opacity=U;break;case"video":this.#K.opacity=U;break;case"webcam":this.#X.opacity=U;break}this.#L(),this.#U(U),this.#F()}),this.#J.addEventListener("change",(X)=>{X.stopPropagation(),this.#A()})})}#L(){if(this.#$)this.#$.setAttribute("value",JSON.stringify(this.value))}#U(Q){if(this.#$){const $=this.#$.querySelector("fig-chit");if($)$.setAttribute("alpha",Q)}}#F(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:this.value}))}#A(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.value}))}get value(){switch(this.#Q){case"solid":return{type:"solid",color:this.#q.color,alpha:this.#q.alpha,opacity:Math.round(this.#q.alpha*100)};case"gradient":return{type:"gradient",gradient:{...this.#Z}};case"image":return{type:"image",image:{...this.#j}};case"video":return{type:"video",video:{...this.#K}};case"webcam":return{type:"webcam",webcam:{...this.#X}};default:return{type:this.#Q}}}set value(Q){if(typeof Q==="string")this.setAttribute("value",Q);else this.setAttribute("value",JSON.stringify(Q))}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":const Z=this.#Q;if(this.#Y(),this.#$)if(this.#Q!==Z)this.#B();else this.#L(),this.#N();break;case"disabled":if(this.#$)this.#B();break;case"mode":case"experimental":if(this.#$)if(J)this.#$.setAttribute(Q,J);else this.#$.removeAttribute(Q);break}}}customElements.define("fig-input-fill",B0);class h extends HTMLElement{#Q=null;#$;constructor(){super();this.input=document.createElement("input"),this.name=this.getAttribute("name")||"checkbox",this.input.value=this.getAttribute("value")||"",this.input.setAttribute("id",V()),this.input.setAttribute("name",this.name),this.input.setAttribute("type","checkbox"),this.input.setAttribute("role","checkbox"),this.#$=this.handleInput.bind(this)}connectedCallback(){const Q=this.querySelector(":scope > input");if(Q)this.input=Q;else if(!this.input.parentNode)this.append(this.input);if(this.input.checked=this.hasAttribute("checked")&&this.getAttribute("checked")!=="false",this.input.removeEventListener("change",this.#$),this.input.addEventListener("change",this.#$),this.hasAttribute("disabled"))this.input.disabled=!0;if(this.hasAttribute("indeterminate"))this.input.indeterminate=!0,this.input.setAttribute("indeterminate","true");const $=this.querySelector(":scope > label");if($)this.#Q=$,this.#Q.setAttribute("for",this.input.id);if(this.hasAttribute("label"))this.#J(),this.#Q.innerText=this.getAttribute("label");this.render()}static get observedAttributes(){return["disabled","label","checked","name","value","indeterminate"]}#J(){if(!this.#Q)this.#Q=document.createElement("label"),this.#Q.setAttribute("for",this.input.id);if(this.#Q&&!this.#Q.parentNode&&this.input.parentNode)this.input.after(this.#Q)}render(){}focus(){this.input.focus()}get value(){return this.input.value}set value(Q){this.input.value=Q,this.setAttribute("value",Q)}get checked(){return this.input.checked}set checked(Q){if(this.input.checked=Q,Q)this.setAttribute("checked","");else this.removeAttribute("checked")}disconnectedCallback(){this.input.removeEventListener("change",this.#$),this.input.remove()}attributeChangedCallback(Q,$,J){switch(Q){case"label":if(J)this.#J(),this.#Q.innerText=J;else if(this.#Q)this.#Q.remove(),this.#Q=null;break;case"checked":if(this.input.checked=this.hasAttribute("checked")&&this.getAttribute("checked")!=="false",this.input.checked&&this.hasAttribute("indeterminate"))this.removeAttribute("indeterminate");if(this.input.indeterminate=this.hasAttribute("indeterminate")&&this.getAttribute("indeterminate")!=="false"&&!this.input.checked,this.input.indeterminate)this.input.setAttribute("indeterminate","true");else this.input.removeAttribute("indeterminate");break;case"indeterminate":if(this.input.indeterminate=this.hasAttribute("indeterminate")&&this.getAttribute("indeterminate")!=="false"&&!this.input.checked,this.input.indeterminate)this.input.setAttribute("indeterminate","true");else this.input.removeAttribute("indeterminate");break;case"value":this.input.value=J;break;default:this.input[Q]=J,this.input.setAttribute(Q,J);break}}handleInput(Q){if(Q.stopPropagation(),this.input.indeterminate=!1,this.input.removeAttribute("indeterminate"),this.input.setAttribute("aria-checked",this.input.checked),this.input.checked)this.setAttribute("checked","");else this.removeAttribute("checked");this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,detail:{checked:this.input.checked,value:this.input.value}})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{checked:this.input.checked,value:this.input.value}}))}}customElements.define("fig-checkbox",h);class L0 extends h{constructor(){super();this.input.setAttribute("type","radio"),this.input.setAttribute("name",this.getAttribute("name")||"radio")}}customElements.define("fig-radio",L0);class U0 extends h{render(){this.input.setAttribute("class","switch"),this.input.setAttribute("role","switch")}}customElements.define("fig-switch",U0);class N0 extends HTMLDialogElement{_defaultOffset=16;_autoCloseTimer=null;constructor(){super()}getOffset(){return parseInt(this.getAttribute("offset")??this._defaultOffset)}connectedCallback(){if(typeof this._defaultOffset!=="number")this._defaultOffset=16;if(typeof this._autoCloseTimer==="undefined")this._autoCloseTimer=null;if(!this.hasAttribute("theme"))this.setAttribute("theme","dark");const Q=this.getAttribute("open")==="true"||this.getAttribute("open")==="";if(this.hasAttribute("open")&&!Q)this.removeAttribute("open");if(!Q)this.close();requestAnimationFrame(()=>{if(this.addCloseListeners(),this.applyPosition(),Q)this.showToast()})}disconnectedCallback(){this.clearAutoClose()}addCloseListeners(){this.querySelectorAll("[close-toast]").forEach((Q)=>{Q.removeEventListener("click",this.handleClose),Q.addEventListener("click",this.handleClose.bind(this))})}handleClose(){this.hideToast()}applyPosition(){this.style.position="fixed",this.style.margin="0",this.style.top="auto",this.style.bottom=`${this.getOffset()}px`,this.style.left="50%",this.style.right="auto",this.style.transform="translateX(-50%)"}startAutoClose(){this.clearAutoClose();const Q=parseInt(this.getAttribute("duration")??"5000");if(Q>0)this._autoCloseTimer=setTimeout(()=>{this.hideToast()},Q)}clearAutoClose(){if(this._autoCloseTimer)clearTimeout(this._autoCloseTimer),this._autoCloseTimer=null}showToast(){this.show(),this.applyPosition(),this.startAutoClose(),this.dispatchEvent(new CustomEvent("toast-show",{bubbles:!0}))}hideToast(){this.clearAutoClose(),this.close(),this.dispatchEvent(new CustomEvent("toast-hide",{bubbles:!0}))}static get observedAttributes(){return["duration","offset","open","theme"]}attributeChangedCallback(Q,$,J){if(Q==="offset")this.applyPosition();if(Q==="open")if(J!==null&&J!=="false")this.showToast();else this.hideToast()}}c("fig-toast",N0,{extends:"dialog"});class O0 extends HTMLElement{#Q=!1;#$=null;constructor(){super();this.#$=this.handleSelectInput.bind(this)}getOptionsFromAttribute(){return(this.getAttribute("options")||"").split(",")}connectedCallback(){const Q=Array.from(this.children).find((_)=>_.tagName==="FIG-DROPDOWN")||null;if(this.#Q=Q!==null,Q)Q.remove();this.options=this.getOptionsFromAttribute(),this.placeholder=this.getAttribute("placeholder")||"",this.value=this.getAttribute("value")||"";const $=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"",Z=this.#Q?"":`<fig-dropdown type="dropdown" ${J}>
                               ${this.options.map((_)=>`<option>${_}</option>`).join("")}
                             </fig-dropdown>`;this.innerHTML=`<div class="input-combo">
                         <fig-input-text placeholder="${this.placeholder}">
@@ -188,30 +188,30 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
 </svg>
                             ${Z}
                         </fig-button>
-                    </div>`,requestAnimationFrame(()=>{this.input=this.querySelector("fig-input-text");const _=this.querySelector("fig-button");if(this.#Q&&Q&&_){if(!Q.hasAttribute("type"))Q.setAttribute("type","dropdown");if($)Q.setAttribute("experimental",$);_.append(Q)}if(this.dropdown=this.querySelector("fig-dropdown"),this.dropdown?.removeEventListener("input",this.#$),this.dropdown?.addEventListener("input",this.#$),this.input)this.input.setAttribute("value",this.value);if(this.hasAttribute("disabled"))this.#J(!0)})}disconnectedCallback(){this.dropdown?.removeEventListener("input",this.#$)}handleSelectInput(Q){this.setAttribute("value",Q.target.closest("fig-dropdown").value)}handleInput(Q){this.value=this.input.value}static get observedAttributes(){return["options","placeholder","value","disabled","experimental"]}focus(){this.input.focus()}#J(Q){if(this.input)if(Q)this.input.setAttribute("disabled","");else this.input.removeAttribute("disabled");const $=this.querySelector("fig-button");if($)if(Q)$.setAttribute("disabled","");else $.removeAttribute("disabled")}attributeChangedCallback(Q,$,J){switch(Q){case"options":if(this.options=J.split(","),this.dropdown&&!this.#Q)this.dropdown.innerHTML=this.options.map((Z)=>`<option>${Z}</option>`).join("");break;case"placeholder":if(this.placeholder=J,this.input)this.input.setAttribute("placeholder",J);break;case"value":if(this.value=J,this.input)this.input.setAttribute("value",J);break;case"disabled":this.#J(J!==null&&J!=="false");break;case"experimental":if(this.dropdown){if(J)this.dropdown.setAttribute("experimental",J);else if(!this.#Q)this.dropdown.removeAttribute("experimental")}break}}}customElements.define("fig-combo-input",N0);class M0 extends HTMLElement{#Q="color";#$=null;#J=!1;constructor(){super();this.#$=this.#K.bind(this)}static get observedAttributes(){return["background","size","selected","disabled","alpha"]}connectedCallback(){this.#j(),this.#_()}#_(){const Q=this.getAttribute("alpha");if(Q!==null)this.style.setProperty("--alpha",Q);else this.style.removeProperty("--alpha")}#q(Q){if(!Q)return"color";const $=Q.toLowerCase();if($.includes("gradient"))return"gradient";if($.includes("url("))return"image";return"color"}#Z(Q){if(!Q)return"#D9D9D9";if(Q.startsWith("#"))return Q.slice(0,7);try{const $=document.createElement("canvas").getContext("2d");return $.fillStyle=Q,$.fillStyle}catch{return"#D9D9D9"}}#j(){const Q=this.getAttribute("background")||"#D9D9D9",$=this.#q(Q);if($!==this.#Q||!this.input){if(this.#Q=$,this.setAttribute("data-type",this.#Q),this.input)this.input.removeEventListener("input",this.#$);if(this.#Q==="color"){const J=this.#Z(Q);this.innerHTML=`<input type="color" value="${J}" />`,this.input=this.querySelector("input"),this.input.addEventListener("input",this.#$)}else this.innerHTML="",this.input=null}else if(this.#Q==="color"&&this.input){const J=this.#Z(Q);if(this.input.value!==J)this.input.value=J}this.style.setProperty("--chit-background",Q)}#K(Q){this.#J=!0,this.setAttribute("background",Q.target.value),this.#J=!1}get background(){return this.getAttribute("background")}set background(Q){this.setAttribute("background",Q)}focus(){this.input?.focus()}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="background"){if(this.#J){this.style.setProperty("--chit-background",J);return}this.#j()}else if(Q==="alpha")this.#_()}get alpha(){return this.getAttribute("alpha")}set alpha(Q){if(Q===null||Q===void 0)this.removeAttribute("alpha");else this.setAttribute("alpha",Q)}}customElements.define("fig-chit",M0);class E0 extends HTMLElement{#Q=null;#$=this.#K.bind(this);#J=this.#Z.bind(this);constructor(){super()}#_(){return`<fig-chit size="large" background="${this.src?`url(${this.src})`:"url()"}" disabled></fig-chit><div>${this.upload?`<fig-button variant="overlay" type="upload">
+                    </div>`,requestAnimationFrame(()=>{this.input=this.querySelector("fig-input-text");const _=this.querySelector("fig-button");if(this.#Q&&Q&&_){if(!Q.hasAttribute("type"))Q.setAttribute("type","dropdown");if($)Q.setAttribute("experimental",$);_.append(Q)}if(this.dropdown=this.querySelector("fig-dropdown"),this.dropdown?.removeEventListener("input",this.#$),this.dropdown?.addEventListener("input",this.#$),this.input)this.input.setAttribute("value",this.value);if(this.hasAttribute("disabled"))this.#J(!0)})}disconnectedCallback(){this.dropdown?.removeEventListener("input",this.#$)}handleSelectInput(Q){this.setAttribute("value",Q.target.closest("fig-dropdown").value)}handleInput(Q){this.value=this.input.value}static get observedAttributes(){return["options","placeholder","value","disabled","experimental"]}focus(){this.input.focus()}#J(Q){if(this.input)if(Q)this.input.setAttribute("disabled","");else this.input.removeAttribute("disabled");const $=this.querySelector("fig-button");if($)if(Q)$.setAttribute("disabled","");else $.removeAttribute("disabled")}attributeChangedCallback(Q,$,J){switch(Q){case"options":if(this.options=J.split(","),this.dropdown&&!this.#Q)this.dropdown.innerHTML=this.options.map((Z)=>`<option>${Z}</option>`).join("");break;case"placeholder":if(this.placeholder=J,this.input)this.input.setAttribute("placeholder",J);break;case"value":if(this.value=J,this.input)this.input.setAttribute("value",J);break;case"disabled":this.#J(J!==null&&J!=="false");break;case"experimental":if(this.dropdown){if(J)this.dropdown.setAttribute("experimental",J);else if(!this.#Q)this.dropdown.removeAttribute("experimental")}break}}}customElements.define("fig-combo-input",O0);class M0 extends HTMLElement{#Q="color";#$=null;#J=!1;constructor(){super();this.#$=this.#K.bind(this)}static get observedAttributes(){return["background","size","selected","disabled","alpha"]}connectedCallback(){this.#j(),this.#_()}#_(){const Q=this.getAttribute("alpha");if(Q!==null)this.style.setProperty("--alpha",Q);else this.style.removeProperty("--alpha")}#q(Q){if(!Q)return"color";const $=Q.toLowerCase();if($.includes("gradient"))return"gradient";if($.includes("url("))return"image";return"color"}#Z(Q){if(!Q)return"#D9D9D9";if(Q.startsWith("#"))return Q.slice(0,7);try{const $=document.createElement("canvas").getContext("2d");return $.fillStyle=Q,$.fillStyle}catch{return"#D9D9D9"}}#j(){const Q=this.getAttribute("background")||"#D9D9D9",$=this.#q(Q);if($!==this.#Q||!this.input){if(this.#Q=$,this.setAttribute("data-type",this.#Q),this.input)this.input.removeEventListener("input",this.#$);if(this.#Q==="color"){const J=this.#Z(Q);this.innerHTML=`<input type="color" value="${J}" />`,this.input=this.querySelector("input"),this.input.addEventListener("input",this.#$)}else this.innerHTML="",this.input=null}else if(this.#Q==="color"&&this.input){const J=this.#Z(Q);if(this.input.value!==J)this.input.value=J}this.style.setProperty("--chit-background",Q)}#K(Q){this.#J=!0,this.setAttribute("background",Q.target.value),this.#J=!1}get background(){return this.getAttribute("background")}set background(Q){this.setAttribute("background",Q)}focus(){this.input?.focus()}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="background"){if(this.#J){this.style.setProperty("--chit-background",J);return}this.#j()}else if(Q==="alpha")this.#_()}get alpha(){return this.getAttribute("alpha")}set alpha(Q){if(Q===null||Q===void 0)this.removeAttribute("alpha");else this.setAttribute("alpha",Q)}}customElements.define("fig-chit",M0);class E0 extends HTMLElement{#Q=null;#$=this.#K.bind(this);#J=this.#Z.bind(this);constructor(){super()}#_(){return`<fig-chit size="large" background="${this.src?`url(${this.src})`:"url()"}" disabled></fig-chit><div>${this.upload?`<fig-button variant="overlay" type="upload">
           ${this.label} 
           <input type="file" accept="image/*" />
         </fig-button>`:""} ${this.download?`<fig-button variant="overlay" icon="true" type="download">
             <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M17.5 13C17.7761 13 18 13.2239 18 13.5V16.5C18 17.3284 17.3284 18 16.5 18H7.5C6.67157 18 6 17.3284 6 16.5V13.5C6 13.2239 6.22386 13 6.5 13C6.77614 13 7 13.2239 7 13.5V16.5C7 16.7761 7.22386 17 7.5 17H16.5C16.7761 17 17 16.7761 17 16.5V13.5C17 13.2239 17.2239 13 17.5 13ZM12 6C12.2761 6 12.5 6.22386 12.5 6.5V12.293L14.6465 10.1465C14.8417 9.95122 15.1583 9.95122 15.3535 10.1465C15.5488 10.3417 15.5488 10.6583 15.3535 10.8535L12.3535 13.8535C12.2597 13.9473 12.1326 14 12 14C11.9006 14 11.8042 13.9704 11.7227 13.916L11.6465 13.8535L8.64648 10.8535C8.45122 10.6583 8.45122 10.3417 8.64648 10.1465C8.84175 9.95122 9.15825 9.95122 9.35352 10.1465L11.5 12.293V6.5C11.5 6.22386 11.7239 6 12 6Z" fill="black"/>
-</svg></fig-button>`:""}</div>`}connectedCallback(){this.#Q=this.getAttribute("src")||"",this.upload=this.hasAttribute("upload")&&this.getAttribute("upload")!=="false",this.download=this.hasAttribute("download")&&this.getAttribute("download")!=="false",this.label=this.getAttribute("label")||"Upload",this.size=this.getAttribute("size")||"small",this.innerHTML=this.#_(),this.#q();const Q=this.getAttribute("aspect-ratio");if(Q&&Q!=="auto")this.style.setProperty("--aspect-ratio",Q);const $=this.getAttribute("fit");if($)this.style.setProperty("--fit",$)}disconnectedCallback(){this.fileInput?.removeEventListener("change",this.#$),this.downloadButton?.removeEventListener("click",this.#J)}#q(){requestAnimationFrame(()=>{if(this.chit=this.querySelector("fig-chit"),this.upload)this.uploadButton=this.querySelector("fig-button[type='upload']"),this.fileInput=this.uploadButton?.querySelector("input"),this.fileInput?.removeEventListener("change",this.#$),this.fileInput?.addEventListener("change",this.#$);if(this.download)this.downloadButton=this.querySelector("fig-button[type='download']"),this.downloadButton?.removeEventListener("click",this.#J),this.downloadButton?.addEventListener("click",this.#J)})}#Z(){const Q=document.createElement("a");Q.href=this.blob,Q.download="image.png",Q.click()}async#j(Q){await new Promise(($)=>{this.image=new Image,this.image.crossOrigin="Anonymous",this.image.onload=async()=>{this.aspectRatio=this.image.width/this.image.height;const J=this.getAttribute("aspect-ratio");if(!J||J==="auto")this.style.setProperty("--aspect-ratio",`${this.image.width}/${this.image.height}`);this.dispatchEvent(new CustomEvent("loaded",{bubbles:!0,cancelable:!0,detail:{blob:this.blob,base64:this.base64}})),$();const Z=document.createElement("canvas"),_=Z.getContext("2d");Z.width=this.image.width,Z.height=this.image.height,_.drawImage(this.image,0,0),this.base64=Z.toDataURL(),Z.toBlob((j)=>{if(this.blob)URL.revokeObjectURL(this.blob);if(j)this.blob=URL.createObjectURL(j)})},this.image.src=Q})}async#K(Q){if(this.blob)URL.revokeObjectURL(this.blob);this.blob=URL.createObjectURL(Q.target.files[0]);const $=new FileReader;$.readAsDataURL(Q.target.files[0]),await new Promise((J)=>{$.onload=(Z)=>{this.base64=Z.target.result,J()}}),this.dispatchEvent(new CustomEvent("loaded",{bubbles:!0,cancelable:!0,detail:{blob:this.blob,base64:this.base64}})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0})),this.setAttribute("src",this.blob)}static get observedAttributes(){return["src","upload","download","aspect-ratio","fit"]}get src(){return this.#Q}set src(Q){this.#Q=Q,this.setAttribute("src",Q)}attributeChangedCallback(Q,$,J){if(Q==="src"){if(this.#Q=J,this.chit)this.chit.setAttribute("background",this.#Q?`url(${this.#Q})`:"");if(this.#Q)this.#j(this.#Q)}if(Q==="upload")this.upload=J!==null&&J!=="false",this.innerHTML=this.#_(),this.#q();if(Q==="download")this.download=J!==null&&J!=="false",this.innerHTML=this.#_(),this.#q();if(Q==="size")this.size=J;if(Q==="aspect-ratio"){if(J&&J!=="auto")this.style.setProperty("--aspect-ratio",J);else if(!J)this.style.removeProperty("--aspect-ratio")}if(Q==="fit")if(J)this.style.setProperty("--fit",J);else this.style.removeProperty("--fit")}}customElements.define("fig-image",E0);class f extends HTMLElement{#Q={x:0.42,y:0};#$={x:0.58,y:1};#J={stiffness:200,damping:15,mass:1};#_="bezier";#q=2;#Z=null;#j=null;#K=null;#W=null;#G=null;#Y=null;#B=null;#X=null;#O=null;#N=null;#L=null;#U=null;#D=0.8;#A=200;#M=200;#R=null;#P=null;#F=null;#z=3.625;#H=2;#k=3.625;#E=6;#C=16;#T=3;static PRESETS=[{group:null,name:"Linear",type:"bezier",value:[0,0,1,1]},{group:"Bezier",name:"Ease in",type:"bezier",value:[0.42,0,1,1]},{group:"Bezier",name:"Ease out",type:"bezier",value:[0,0,0.58,1]},{group:"Bezier",name:"Ease in and out",type:"bezier",value:[0.42,0,0.58,1]},{group:"Bezier",name:"Ease in back",type:"bezier",value:[0.6,-0.28,0.735,0.045]},{group:"Bezier",name:"Ease out back",type:"bezier",value:[0.175,0.885,0.32,1.275]},{group:"Bezier",name:"Ease in and out back",type:"bezier",value:[0.68,-0.55,0.265,1.55]},{group:"Bezier",name:"Custom bezier",type:"bezier",value:null},{group:"Spring",name:"Gentle",type:"spring",spring:{stiffness:120,damping:14,mass:1}},{group:"Spring",name:"Quick",type:"spring",spring:{stiffness:380,damping:20,mass:1}},{group:"Spring",name:"Bouncy",type:"spring",spring:{stiffness:250,damping:8,mass:1}},{group:"Spring",name:"Slow",type:"spring",spring:{stiffness:60,damping:11,mass:1}},{group:"Spring",name:"Custom spring",type:"spring",spring:null}];static get observedAttributes(){return["value","precision","aspect-ratio"]}connectedCallback(){this.#q=parseInt(this.getAttribute("precision")||"2"),this.#h(this.getAttribute("aspect-ratio"));const Q=this.getAttribute("value");if(Q)this.#w(Q);this.#L=this.#f(),this.#v(),this.#l()}disconnectedCallback(){if(this.#Z=null,this.#F)this.#F.disconnect(),this.#F=null}#h(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){if(this.#h(J),this.#j)this.#c(),this.#x();return}if(!this.#j)return;if(Q==="value"&&J){const Z=this.#_;if(this.#w(J),this.#L=this.#f(),Z!==this.#_)this.#v();else this.#x(),this.#s()}if(Q==="precision")this.#q=parseInt(J||"2")}get value(){if(this.#_==="spring"){const{stiffness:$,damping:J,mass:Z}=this.#J;return`spring(${$}, ${J}, ${Z})`}const Q=this.#q;return`${this.#Q.x.toFixed(Q)}, ${this.#Q.y.toFixed(Q)}, ${this.#$.x.toFixed(Q)}, ${this.#$.y.toFixed(Q)}`}get cssValue(){if(this.#_==="spring"){const $=this.#b(),Z=Math.max(1,Math.floor($.length/20)),_=[];for(let j=0;j<$.length;j+=Z)_.push($[j].value.toFixed(3));if($.length>0)_.push($[$.length-1].value.toFixed(3));return`linear(${_.join(", ")})`}const Q=this.#q;return`cubic-bezier(${this.#Q.x.toFixed(Q)}, ${this.#Q.y.toFixed(Q)}, ${this.#$.x.toFixed(Q)}, ${this.#$.y.toFixed(Q)})`}get preset(){return this.#L}set value(Q){this.setAttribute("value",Q)}#w(Q){const $=Q.match(/^spring\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)$/);if($){this.#_="spring",this.#J.stiffness=parseFloat($[1]),this.#J.damping=parseFloat($[2]),this.#J.mass=parseFloat($[3]);return}const J=Q.split(",").map((Z)=>parseFloat(Z.trim()));if(J.length>=4&&J.every((Z)=>!isNaN(Z)))this.#_="bezier",this.#Q.x=J[0],this.#Q.y=J[1],this.#$.x=J[2],this.#$.y=J[3]}#f(){if(this.#_==="bezier"){for(let $ of f.PRESETS){if($.type!=="bezier"||!$.value)continue;if(Math.abs(this.#Q.x-$.value[0])<0.001&&Math.abs(this.#Q.y-$.value[1])<0.001&&Math.abs(this.#$.x-$.value[2])<0.001&&Math.abs(this.#$.y-$.value[3])<0.001)return $.name}return"Custom bezier"}for(let $ of f.PRESETS){if($.type!=="spring"||!$.spring)continue;if(Math.abs(this.#J.stiffness-$.spring.stiffness)<0.001&&Math.abs(this.#J.damping-$.spring.damping)<0.001&&Math.abs(this.#J.mass-$.spring.mass)<0.001)return $.name}return"Custom spring"}#b(){const{stiffness:Q,damping:$,mass:J}=this.#J,j=[];let q=0,K=0;for(let X=0;X<=5;X+=0.004){const W=-Q*(q-1)-$*K;if(K+=W/J*0.004,q+=K*0.004,j.push({t:X,value:q}),X>0.1&&Math.abs(q-1)<0.0005&&Math.abs(K)<0.0005)break}return j}static#g(Q,$=24){const{stiffness:J,damping:Z,mass:_}=Q,K=[];let X=0,W=0;for(let E=0;E<=5;E+=0.004){const M=-J*(X-1)-Z*W;if(W+=M/_*0.004,X+=W*0.004,K.push({t:E,value:X}),E>0.1&&Math.abs(X-1)<0.001&&Math.abs(W)<0.001)break}const L=K[K.length-1].t||1;let U=1;for(let E of K)if(E.value>U)U=E.value;let G=0;for(let E of K)if(E.value<G)G=E.value;const O=Math.max(U-G,1),B=6,D=$-B*2,F=Math.max(1,Math.floor(K.length/30));let P="";for(let E=0;E<K.length;E+=F){const M=B+K[E].t/L*D,S=B+(1-(K[E].value-G)/O)*D;P+=(E===0?"M":"L")+M.toFixed(1)+","+S.toFixed(1)}return`<svg width="${$}" height="${$}" viewBox="0 0 ${$} ${$}" fill="none"><path d="${P}" stroke="currentColor" stroke-width="1" stroke-linecap="round" fill="none"/></svg>`}static curveIcon(Q,$,J,Z,_=24){const q=(_-12)/2,X=[],W=(M,S,C,y,T)=>{const I=1-T;return I*I*I*M+3*I*I*T*S+3*I*T*T*C+T*T*T*y};for(let M=0;M<=48;M++){const S=M/48;X.push({x:W(0,Q,J,1,S),y:W(0,$,Z,1,S)})}let L=1/0,U=-1/0,G=1/0,O=-1/0;for(let M of X){if(M.x<L)L=M.x;if(M.x>U)U=M.x;if(M.y<G)G=M.y;if(M.y>O)O=M.y}const B=Math.max(U-L,0.000001),D=Math.max(O-G,0.000001),F=(M)=>q+(M-L)/B*12,P=(M)=>q+(1-(M-G)/D)*12;let E="";for(let M=0;M<X.length;M++){const S=F(X[M].x),C=P(X[M].y);E+=`${M===0?"M":"L"}${S.toFixed(1)},${C.toFixed(1)}`}return`<svg width="${_}" height="${_}" viewBox="0 0 ${_} ${_}" fill="none"><path d="${E}" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>`}#v(){this.classList.toggle("spring-mode",this.#_==="spring"),this.classList.toggle("bezier-mode",this.#_!=="spring"),this.#u(),this.innerHTML=this.#d(),this.#o(),this.#c(),this.#x(),this.#Z0()}#m(){if(this.getAttribute("dropdown")!=="true")return"";let Q="",$=void 0;for(let J of f.PRESETS){if(J.group!==$){if($!==void 0)Q+="</optgroup>";if(J.group)Q+=`<optgroup label="${J.group}">`;$=J.group}let Z;if(J.type==="spring"){const j=J.spring||this.#J;Z=f.#g(j)}else{const j=J.value||[this.#Q.x,this.#Q.y,this.#$.x,this.#$.y];Z=f.curveIcon(...j)}const _=J.name===this.#L?" selected":"";Q+=`<option value="${J.name}"${_}>${Z} ${J.name}</option>`}if($)Q+="</optgroup>";return`<fig-dropdown class="fig-easing-curve-dropdown" full experimental="modern">${Q}</fig-dropdown>`}#d(){const $=this.#m();if(this.#_==="spring")return`${$}<div class="fig-easing-curve-svg-container"><svg viewBox="0 0 200 200" class="fig-easing-curve-svg">
+</svg></fig-button>`:""}</div>`}connectedCallback(){this.#Q=this.getAttribute("src")||"",this.upload=this.hasAttribute("upload")&&this.getAttribute("upload")!=="false",this.download=this.hasAttribute("download")&&this.getAttribute("download")!=="false",this.label=this.getAttribute("label")||"Upload",this.size=this.getAttribute("size")||"small",this.innerHTML=this.#_(),this.#q();const Q=this.getAttribute("aspect-ratio");if(Q&&Q!=="auto")this.style.setProperty("--aspect-ratio",Q);const $=this.getAttribute("fit");if($)this.style.setProperty("--fit",$)}disconnectedCallback(){this.fileInput?.removeEventListener("change",this.#$),this.downloadButton?.removeEventListener("click",this.#J)}#q(){requestAnimationFrame(()=>{if(this.chit=this.querySelector("fig-chit"),this.upload)this.uploadButton=this.querySelector("fig-button[type='upload']"),this.fileInput=this.uploadButton?.querySelector("input"),this.fileInput?.removeEventListener("change",this.#$),this.fileInput?.addEventListener("change",this.#$);if(this.download)this.downloadButton=this.querySelector("fig-button[type='download']"),this.downloadButton?.removeEventListener("click",this.#J),this.downloadButton?.addEventListener("click",this.#J)})}#Z(){const Q=document.createElement("a");Q.href=this.blob,Q.download="image.png",Q.click()}async#j(Q){await new Promise(($)=>{this.image=new Image,this.image.crossOrigin="Anonymous",this.image.onload=async()=>{this.aspectRatio=this.image.width/this.image.height;const J=this.getAttribute("aspect-ratio");if(!J||J==="auto")this.style.setProperty("--aspect-ratio",`${this.image.width}/${this.image.height}`);this.dispatchEvent(new CustomEvent("loaded",{bubbles:!0,cancelable:!0,detail:{blob:this.blob,base64:this.base64}})),$();const Z=document.createElement("canvas"),_=Z.getContext("2d");Z.width=this.image.width,Z.height=this.image.height,_.drawImage(this.image,0,0),this.base64=Z.toDataURL(),Z.toBlob((j)=>{if(this.blob)URL.revokeObjectURL(this.blob);if(j)this.blob=URL.createObjectURL(j)})},this.image.src=Q})}async#K(Q){if(this.blob)URL.revokeObjectURL(this.blob);this.blob=URL.createObjectURL(Q.target.files[0]);const $=new FileReader;$.readAsDataURL(Q.target.files[0]),await new Promise((J)=>{$.onload=(Z)=>{this.base64=Z.target.result,J()}}),this.dispatchEvent(new CustomEvent("loaded",{bubbles:!0,cancelable:!0,detail:{blob:this.blob,base64:this.base64}})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0})),this.setAttribute("src",this.blob)}static get observedAttributes(){return["src","upload","download","aspect-ratio","fit"]}get src(){return this.#Q}set src(Q){this.#Q=Q,this.setAttribute("src",Q)}attributeChangedCallback(Q,$,J){if(Q==="src"){if(this.#Q=J,this.chit)this.chit.setAttribute("background",this.#Q?`url(${this.#Q})`:"");if(this.#Q)this.#j(this.#Q)}if(Q==="upload")this.upload=J!==null&&J!=="false",this.innerHTML=this.#_(),this.#q();if(Q==="download")this.download=J!==null&&J!=="false",this.innerHTML=this.#_(),this.#q();if(Q==="size")this.size=J;if(Q==="aspect-ratio"){if(J&&J!=="auto")this.style.setProperty("--aspect-ratio",J);else if(!J)this.style.removeProperty("--aspect-ratio")}if(Q==="fit")if(J)this.style.setProperty("--fit",J);else this.style.removeProperty("--fit")}}customElements.define("fig-image",E0);class f extends HTMLElement{#Q={x:0.42,y:0};#$={x:0.58,y:1};#J={stiffness:200,damping:15,mass:1};#_="bezier";#q=2;#Z=null;#j=null;#K=null;#X=null;#Y=null;#G=null;#B=null;#W=null;#N=null;#O=null;#L=null;#U=null;#F=0.8;#A=200;#M=200;#R=null;#S=null;#D=null;#z=3.625;#P=2;#k=3.625;#E=6;#T=16;#C=3;static PRESETS=[{group:null,name:"Linear",type:"bezier",value:[0,0,1,1]},{group:"Bezier",name:"Ease in",type:"bezier",value:[0.42,0,1,1]},{group:"Bezier",name:"Ease out",type:"bezier",value:[0,0,0.58,1]},{group:"Bezier",name:"Ease in and out",type:"bezier",value:[0.42,0,0.58,1]},{group:"Bezier",name:"Ease in back",type:"bezier",value:[0.6,-0.28,0.735,0.045]},{group:"Bezier",name:"Ease out back",type:"bezier",value:[0.175,0.885,0.32,1.275]},{group:"Bezier",name:"Ease in and out back",type:"bezier",value:[0.68,-0.55,0.265,1.55]},{group:"Bezier",name:"Custom bezier",type:"bezier",value:null},{group:"Spring",name:"Gentle",type:"spring",spring:{stiffness:120,damping:14,mass:1}},{group:"Spring",name:"Quick",type:"spring",spring:{stiffness:380,damping:20,mass:1}},{group:"Spring",name:"Bouncy",type:"spring",spring:{stiffness:250,damping:8,mass:1}},{group:"Spring",name:"Slow",type:"spring",spring:{stiffness:60,damping:11,mass:1}},{group:"Spring",name:"Custom spring",type:"spring",spring:null}];static get observedAttributes(){return["value","precision","aspect-ratio"]}connectedCallback(){this.#q=parseInt(this.getAttribute("precision")||"2"),this.#h(this.getAttribute("aspect-ratio"));const Q=this.getAttribute("value");if(Q)this.#w(Q);this.#L=this.#f(),this.#v(),this.#l()}disconnectedCallback(){if(this.#Z=null,this.#D)this.#D.disconnect(),this.#D=null}#h(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){if(this.#h(J),this.#j)this.#c(),this.#x();return}if(!this.#j)return;if(Q==="value"&&J){const Z=this.#_;if(this.#w(J),this.#L=this.#f(),Z!==this.#_)this.#v();else this.#x(),this.#u()}if(Q==="precision")this.#q=parseInt(J||"2")}get value(){if(this.#_==="spring"){const{stiffness:$,damping:J,mass:Z}=this.#J;return`spring(${$}, ${J}, ${Z})`}const Q=this.#q;return`${this.#Q.x.toFixed(Q)}, ${this.#Q.y.toFixed(Q)}, ${this.#$.x.toFixed(Q)}, ${this.#$.y.toFixed(Q)}`}get cssValue(){if(this.#_==="spring"){const $=this.#b(),Z=Math.max(1,Math.floor($.length/20)),_=[];for(let j=0;j<$.length;j+=Z)_.push($[j].value.toFixed(3));if($.length>0)_.push($[$.length-1].value.toFixed(3));return`linear(${_.join(", ")})`}const Q=this.#q;return`cubic-bezier(${this.#Q.x.toFixed(Q)}, ${this.#Q.y.toFixed(Q)}, ${this.#$.x.toFixed(Q)}, ${this.#$.y.toFixed(Q)})`}get preset(){return this.#L}set value(Q){this.setAttribute("value",Q)}#w(Q){const $=Q.match(/^spring\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)$/);if($){this.#_="spring",this.#J.stiffness=parseFloat($[1]),this.#J.damping=parseFloat($[2]),this.#J.mass=parseFloat($[3]);return}const J=Q.split(",").map((Z)=>parseFloat(Z.trim()));if(J.length>=4&&J.every((Z)=>!isNaN(Z)))this.#_="bezier",this.#Q.x=J[0],this.#Q.y=J[1],this.#$.x=J[2],this.#$.y=J[3]}#f(){if(this.#_==="bezier"){for(let $ of f.PRESETS){if($.type!=="bezier"||!$.value)continue;if(Math.abs(this.#Q.x-$.value[0])<0.001&&Math.abs(this.#Q.y-$.value[1])<0.001&&Math.abs(this.#$.x-$.value[2])<0.001&&Math.abs(this.#$.y-$.value[3])<0.001)return $.name}return"Custom bezier"}for(let $ of f.PRESETS){if($.type!=="spring"||!$.spring)continue;if(Math.abs(this.#J.stiffness-$.spring.stiffness)<0.001&&Math.abs(this.#J.damping-$.spring.damping)<0.001&&Math.abs(this.#J.mass-$.spring.mass)<0.001)return $.name}return"Custom spring"}#b(){const{stiffness:Q,damping:$,mass:J}=this.#J,j=[];let q=0,K=0;for(let X=0;X<=5;X+=0.004){const W=-Q*(q-1)-$*K;if(K+=W/J*0.004,q+=K*0.004,j.push({t:X,value:q}),X>0.1&&Math.abs(q-1)<0.0005&&Math.abs(K)<0.0005)break}return j}static#g(Q,$=24){const{stiffness:J,damping:Z,mass:_}=Q,K=[];let X=0,W=0;for(let E=0;E<=5;E+=0.004){const M=-J*(X-1)-Z*W;if(W+=M/_*0.004,X+=W*0.004,K.push({t:E,value:X}),E>0.1&&Math.abs(X-1)<0.001&&Math.abs(W)<0.001)break}const L=K[K.length-1].t||1;let U=1;for(let E of K)if(E.value>U)U=E.value;let G=0;for(let E of K)if(E.value<G)G=E.value;const N=Math.max(U-G,1),B=6,F=$-B*2,D=Math.max(1,Math.floor(K.length/30));let S="";for(let E=0;E<K.length;E+=D){const M=B+K[E].t/L*F,H=B+(1-(K[E].value-G)/N)*F;S+=(E===0?"M":"L")+M.toFixed(1)+","+H.toFixed(1)}return`<svg width="${$}" height="${$}" viewBox="0 0 ${$} ${$}" fill="none"><path d="${S}" stroke="currentColor" stroke-width="1" stroke-linecap="round" fill="none"/></svg>`}static curveIcon(Q,$,J,Z,_=24){const q=(_-12)/2,X=[],W=(M,H,T,y,C)=>{const I=1-C;return I*I*I*M+3*I*I*C*H+3*I*C*C*T+C*C*C*y};for(let M=0;M<=48;M++){const H=M/48;X.push({x:W(0,Q,J,1,H),y:W(0,$,Z,1,H)})}let L=1/0,U=-1/0,G=1/0,N=-1/0;for(let M of X){if(M.x<L)L=M.x;if(M.x>U)U=M.x;if(M.y<G)G=M.y;if(M.y>N)N=M.y}const B=Math.max(U-L,0.000001),F=Math.max(N-G,0.000001),D=(M)=>q+(M-L)/B*12,S=(M)=>q+(1-(M-G)/F)*12;let E="";for(let M=0;M<X.length;M++){const H=D(X[M].x),T=S(X[M].y);E+=`${M===0?"M":"L"}${H.toFixed(1)},${T.toFixed(1)}`}return`<svg width="${_}" height="${_}" viewBox="0 0 ${_} ${_}" fill="none"><path d="${E}" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>`}#v(){this.classList.toggle("spring-mode",this.#_==="spring"),this.classList.toggle("bezier-mode",this.#_!=="spring"),this.#s(),this.innerHTML=this.#d(),this.#o(),this.#c(),this.#x(),this.#Z0()}#m(){if(this.getAttribute("dropdown")!=="true")return"";let Q="",$=void 0;for(let J of f.PRESETS){if(J.group!==$){if($!==void 0)Q+="</optgroup>";if(J.group)Q+=`<optgroup label="${J.group}">`;$=J.group}let Z;if(J.type==="spring"){const j=J.spring||this.#J;Z=f.#g(j)}else{const j=J.value||[this.#Q.x,this.#Q.y,this.#$.x,this.#$.y];Z=f.curveIcon(...j)}const _=J.name===this.#L?" selected":"";Q+=`<option value="${J.name}"${_}>${Z} ${J.name}</option>`}if($)Q+="</optgroup>";return`<fig-dropdown class="fig-easing-curve-dropdown" full experimental="modern">${Q}</fig-dropdown>`}#d(){const $=this.#m();if(this.#_==="spring")return`${$}<div class="fig-easing-curve-svg-container"><svg viewBox="0 0 200 200" class="fig-easing-curve-svg">
         <rect class="fig-easing-curve-bounds" x="0" y="0" width="200" height="200"/>
         <line class="fig-easing-curve-target" x1="0" y1="40" x2="200" y2="40"/>
         <line class="fig-easing-curve-diagonal" x1="0" y1="180" x2="0" y2="180"/>
         <path class="fig-easing-curve-path"/>
         <circle class="fig-easing-curve-handle" data-handle="bounce" r="${this.#k}"/>
-        <rect class="fig-easing-curve-duration-bar" data-handle="duration" width="${this.#E}" height="${this.#C}" rx="${this.#T}" ry="${this.#T}"/>
+        <rect class="fig-easing-curve-duration-bar" data-handle="duration" width="${this.#E}" height="${this.#T}" rx="${this.#C}" ry="${this.#C}"/>
       </svg></div>`;return`${$}<div class="fig-easing-curve-svg-container"><svg viewBox="0 0 200 200" class="fig-easing-curve-svg">
       <rect class="fig-easing-curve-bounds" x="0" y="0" width="200" height="200"/>
       <line class="fig-easing-curve-diagonal" x1="0" y1="200" x2="200" y2="0"/>
       <line class="fig-easing-curve-arm" data-arm="1"/>
       <line class="fig-easing-curve-arm" data-arm="2"/>
       <path class="fig-easing-curve-path"/>
-      <circle class="fig-easing-curve-endpoint" data-endpoint="start" r="${this.#H}"/>
-      <circle class="fig-easing-curve-endpoint" data-endpoint="end" r="${this.#H}"/>
+      <circle class="fig-easing-curve-endpoint" data-endpoint="start" r="${this.#P}"/>
+      <circle class="fig-easing-curve-endpoint" data-endpoint="end" r="${this.#P}"/>
       <circle class="fig-easing-curve-handle" data-handle="1" r="${this.#z}"/>
       <circle class="fig-easing-curve-handle" data-handle="2" r="${this.#z}"/>
-    </svg></div>`}#y(Q,$){const J=getComputedStyle(this).getPropertyValue(Q).trim();if(!J)return $;const Z=Number.parseFloat(J);return Number.isFinite(Z)?Z:$}#u(){this.#z=this.#y("--easing-bezier-handle-radius",this.#z),this.#H=this.#y("--easing-bezier-endpoint-radius",this.#H),this.#k=this.#y("--easing-spring-handle-radius",this.#k),this.#E=this.#y("--easing-duration-bar-width",this.#E),this.#C=this.#y("--easing-duration-bar-height",this.#C),this.#T=this.#y("--easing-duration-bar-radius",this.#T)}#o(){this.#j=this.querySelector(".fig-easing-curve-svg"),this.#K=this.querySelector(".fig-easing-curve-path"),this.#W=this.querySelector('[data-arm="1"]'),this.#G=this.querySelector('[data-arm="2"]'),this.#Y=this.querySelector('[data-handle="1"]')||this.querySelector('[data-handle="bounce"]'),this.#B=this.querySelector('[data-handle="2"]')||this.querySelector('[data-handle="duration"]'),this.#X=this.querySelector('[data-endpoint="start"]'),this.#O=this.querySelector('[data-endpoint="end"]'),this.#N=this.querySelector(".fig-easing-curve-dropdown"),this.#U=this.querySelector(".fig-easing-curve-target"),this.#R=this.querySelector(".fig-easing-curve-bounds"),this.#P=this.querySelector(".fig-easing-curve-diagonal")}#l(){if(this.#F||!window.ResizeObserver)return;this.#F=new ResizeObserver(()=>{if(this.#c())this.#x()}),this.#F.observe(this)}#c(){if(!this.#j)return!1;const Q=this.#j.getBoundingClientRect(),$=Math.max(1,Math.round(Q.width||200)),J=Math.max(1,Math.round(Q.height||200)),Z=$!==this.#A||J!==this.#M;return this.#A=$,this.#M=J,this.#j.setAttribute("viewBox",`0 0 ${$} ${J}`),Z}#p(Q,$){return{x:Q*this.#A,y:(1-$)*this.#M}}#t(Q,$){return{x:Q/this.#A,y:1-$/this.#M}}#i={minVal:0,maxVal:1.2,totalTime:1};#I(Q,$){const Z=this.#M-40,{minVal:_,maxVal:j}=this.#i,q=j-_||1;return{x:Q*this.#A,y:20+(1-($-_)/q)*Z}}#x(){if(this.#c(),this.#_==="spring")this.#Q0();else this.#n()}#n(){if(this.#R)this.#R.setAttribute("x","0"),this.#R.setAttribute("y","0"),this.#R.setAttribute("width",this.#A),this.#R.setAttribute("height",this.#M);if(this.#P)this.#P.setAttribute("x1","0"),this.#P.setAttribute("y1",this.#M),this.#P.setAttribute("x2",this.#A),this.#P.setAttribute("y2","0");const Q=this.#p(0,0),$=this.#p(this.#Q.x,this.#Q.y),J=this.#p(this.#$.x,this.#$.y),Z=this.#p(1,1);if(this.#K.setAttribute("d",`M${Q.x},${Q.y} C${$.x},${$.y} ${J.x},${J.y} ${Z.x},${Z.y}`),this.#W.setAttribute("x1",Q.x),this.#W.setAttribute("y1",Q.y),this.#W.setAttribute("x2",$.x),this.#W.setAttribute("y2",$.y),this.#G.setAttribute("x1",Z.x),this.#G.setAttribute("y1",Z.y),this.#G.setAttribute("x2",J.x),this.#G.setAttribute("y2",J.y),this.#Y.setAttribute("cx",$.x),this.#Y.setAttribute("cy",$.y),this.#B.setAttribute("cx",J.x),this.#B.setAttribute("cy",J.y),this.#X)this.#X.setAttribute("cx",Q.x),this.#X.setAttribute("cy",Q.y);if(this.#O)this.#O.setAttribute("cx",Z.x),this.#O.setAttribute("cy",Z.y)}#Q0(){if(this.#R)this.#R.setAttribute("x","0"),this.#R.setAttribute("y","0"),this.#R.setAttribute("width",this.#A),this.#R.setAttribute("height",this.#M);const Q=this.#b();if(!Q.length)return;const $=Q[Q.length-1].t||1;let J=0,Z=1;for(let B of Q){if(B.value<J)J=B.value;if(B.value>Z)Z=B.value}const _=Math.max(Math.abs(J-1),Math.abs(Z-1),0.01),j=0;this.#i={minVal:1-_-j,maxVal:1+_+j,totalTime:$};const q=Math.max(0.05,Math.min(0.95,this.#D));let K="";for(let B=0;B<Q.length;B++){const D=Q[B].t/$*q,F=this.#I(D,Q[B].value);K+=(B===0?"M":"L")+F.x.toFixed(1)+","+F.y.toFixed(1)}const X=this.#I(q,1),W=this.#I(1,1);if(K+=`L${X.x.toFixed(1)},${X.y.toFixed(1)} L${W.x.toFixed(1)},${W.y.toFixed(1)}`,this.#K.setAttribute("d",K),this.#U){const B=this.#I(0,1),D=this.#I(1,1);this.#U.setAttribute("x1",B.x),this.#U.setAttribute("y1",B.y),this.#U.setAttribute("x2",D.x),this.#U.setAttribute("y2",D.y)}const L=this.#$0(Q),U=L.t/$*q,G=this.#I(U,L.value);this.#Y.setAttribute("cx",G.x),this.#Y.setAttribute("cy",G.y);const O=this.#I(q,1);this.#B.setAttribute("x",O.x-this.#E/2),this.#B.setAttribute("y",O.y-this.#C/2)}#$0(Q){let $={t:0,value:1},J=!1;for(let Z of Q){if(Z.value>=0.99)J=!0;if(J&&Z.value>$.value)$={t:Z.t,value:Z.value}}return $}#s(){if(!this.#N)return;this.#N.value=this.#L,this.#S()}#r(Q,$,J){if(!Q)return;for(let Z of Q.querySelectorAll("option"))if(Z.value===$)Z.innerHTML=`${J} ${$}`}#S(){if(!this.#N)return;const Q=f.curveIcon(this.#Q.x,this.#Q.y,this.#$.x,this.#$.y),$=f.#g(this.#J);this.#r(this.#N,"Custom bezier",Q),this.#r(this.#N,"Custom spring",$),this.#r(this.#N.select,"Custom bezier",Q),this.#r(this.#N.select,"Custom spring",$)}#V(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{mode:this.#_,value:this.value,cssValue:this.cssValue,preset:this.#L}}))}#Z0(){if(this.#_==="bezier"){this.#Y.addEventListener("pointerdown",($)=>this.#a($,1)),this.#B.addEventListener("pointerdown",($)=>this.#a($,2));const Q=this.querySelector(".fig-easing-curve-svg-container");if(Q)Q.addEventListener("pointerdown",($)=>{if($.target?.closest?.(".fig-easing-curve-handle"))return;this.#a($,this.#_0($))})}else{this.#Y.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#e($,"bounce")}),this.#B.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#e($,"duration")});const Q=this.querySelector(".fig-easing-curve-svg-container");if(Q)Q.addEventListener("pointerdown",($)=>{if($.target?.closest?.(".fig-easing-curve-handle"))return;this.#e($,"duration")})}if(this.#N)this.#N.addEventListener("change",(Q)=>{const $=Q.detail,J=f.PRESETS.find((Z)=>Z.name===$);if(!J)return;if(J.type==="bezier"){if(J.value)this.#Q.x=J.value[0],this.#Q.y=J.value[1],this.#$.x=J.value[2],this.#$.y=J.value[3];if(this.#L=$,this.#_!=="bezier")this.#_="bezier",this.#v();else this.#x()}else if(J.type==="spring"){if(J.spring)this.#J={...J.spring};if(this.#L=$,this.#_!=="spring")this.#_="spring",this.#v();else this.#x()}this.#V("input"),this.#V("change")})}#J0(Q){const $=this.#j.getScreenCTM();if(!$)return{x:0,y:0};const J=$.inverse();return{x:J.a*Q.clientX+J.c*Q.clientY+J.e,y:J.b*Q.clientX+J.d*Q.clientY+J.f}}#_0(Q){return this.#J0(Q).x<=this.#A/2?1:2}#a(Q,$){Q.preventDefault(),this.#Z=$;const J=(_)=>{if(!this.#Z)return;const j=this.#J0(_),q=this.#t(j.x,j.y);if(q.x=Math.round(q.x*100)/100,q.y=Math.round(q.y*100)/100,q.x=Math.max(0,Math.min(1,q.x)),this.#Z===1)this.#Q.x=q.x,this.#Q.y=q.y;else this.#$.x=q.x,this.#$.y=q.y;this.#x(),this.#L=this.#f(),this.#s(),this.#V("input")},Z=()=>{this.#Z=null,document.removeEventListener("pointermove",J),document.removeEventListener("pointerup",Z),this.#V("change")};document.addEventListener("pointermove",J),document.addEventListener("pointerup",Z)}#e(Q,$){Q.preventDefault(),this.#Z=$;const J=this.#J.damping,Z=this.#J.stiffness,_=this.#D,j=Q.clientY,q=Q.clientX,K=(W)=>{if(!this.#Z)return;if($==="bounce"){const L=W.clientY-j;this.#J.damping=Math.max(1,Math.round(J+L*0.15))}else{const L=W.clientX-q;this.#D=Math.max(0.05,Math.min(0.95,_+L/200)),this.#J.stiffness=Math.max(10,Math.round(Z-L*1.5))}this.#x(),this.#L=this.#f(),this.#s(),this.#V("input")},X=()=>{this.#Z=null,document.removeEventListener("pointermove",K),document.removeEventListener("pointerup",X),this.#V("change")};document.addEventListener("pointermove",K),document.addEventListener("pointerup",X)}}customElements.define("fig-easing-curve",f);class A0 extends HTMLElement{#Q=0;#$=0;#J=0;#_=1;#q=!1;#Z=!1;#j=null;#K=null;#W=null;#G=null;#Y=[];#B={};static get observedAttributes(){return["value","precision","aspect-ratio","fields","perspective","perspective-origin","transform-origin","selected","drag"]}connectedCallback(){this.#_=parseInt(this.getAttribute("precision")||"1"),this.#X(this.getAttribute("aspect-ratio")),this.#O(this.getAttribute("perspective")),this.#N("--perspective-origin",this.getAttribute("perspective-origin")),this.#L(this.getAttribute("transform-origin")),this.#A(this.getAttribute("fields"));const Q=this.getAttribute("value");if(Q)this.#M(Q);this.#R(),this.#D(this.getAttribute("selected")),this.#U()}disconnectedCallback(){if(this.#q=!1,this.#W)window.removeEventListener("keydown",this.#W),window.removeEventListener("keyup",this.#G)}#X(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}#O(Q){if(Q&&Q.trim())this.style.setProperty("--perspective",Q.trim());else this.style.removeProperty("--perspective")}#N(Q,$){if($&&$.trim())this.style.setProperty(Q,$.trim());else this.style.removeProperty(Q)}#L(Q){if(!Q||!Q.trim()){this.style.removeProperty("--transform-origin");return}const $=Q.trim().split(/\s+/);if($.length===2)this.style.setProperty("--transform-origin",`${$[0]} ${$[1]} -50cqi`);else this.style.setProperty("--transform-origin",Q.trim())}#U(){if(!this.#K)return;this.#K.style.cursor=this.#E?"":"default"}#D(Q){if(!this.#j)return;const $=this.#j.querySelectorAll(".fig-3d-rotate-face"),J=Q?Q.trim().toLowerCase():"";for(let Z of $)Z.classList.toggle("selected",J!==""&&Z.classList.contains(J))}#A(Q){if(!Q||!Q.trim()){this.#Y=[];return}const $=["rotateX","rotateY","rotateZ"];this.#Y=Q.split(",").map((J)=>J.trim()).filter((J)=>$.includes(J))}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#X(J);return}if(Q==="perspective"){this.#O(J);return}if(Q==="perspective-origin"){this.#N("--perspective-origin",J);return}if(Q==="transform-origin"){this.#L(J);return}if(Q==="selected"){this.#D(J);return}if(Q==="drag"){this.#U();return}if(Q==="fields"){if(this.#A(J),this.#j)this.#R();return}if(!this.#j)return;if(Q==="value"&&J){if(this.#q)return;this.#M(J),this.#F(),this.#P()}if(Q==="precision")this.#_=parseInt(J||"1")}get value(){const Q=this.#_;return`rotateX(${this.#Q.toFixed(Q)}deg) rotateY(${this.#$.toFixed(Q)}deg) rotateZ(${this.#J.toFixed(Q)}deg)`}set value(Q){this.setAttribute("value",Q)}get rotateX(){return this.#Q}get rotateY(){return this.#$}get rotateZ(){return this.#J}#M(Q){const $=Q.match(/rotateX\(\s*(-?[\d.]+)\s*deg\s*\)/),J=Q.match(/rotateY\(\s*(-?[\d.]+)\s*deg\s*\)/),Z=Q.match(/rotateZ\(\s*(-?[\d.]+)\s*deg\s*\)/);if($)this.#Q=parseFloat($[1]);if(J)this.#$=parseFloat(J[1]);if(Z)this.#J=parseFloat(Z[1])}#R(){const Q={rotateX:"X",rotateY:"Y",rotateZ:"Z"},$={rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J},J=this.#Y.map((Z)=>`<fig-input-number
+    </svg></div>`}#y(Q,$){const J=getComputedStyle(this).getPropertyValue(Q).trim();if(!J)return $;const Z=Number.parseFloat(J);return Number.isFinite(Z)?Z:$}#s(){this.#z=this.#y("--easing-bezier-handle-radius",this.#z),this.#P=this.#y("--easing-bezier-endpoint-radius",this.#P),this.#k=this.#y("--easing-spring-handle-radius",this.#k),this.#E=this.#y("--easing-duration-bar-width",this.#E),this.#T=this.#y("--easing-duration-bar-height",this.#T),this.#C=this.#y("--easing-duration-bar-radius",this.#C)}#o(){this.#j=this.querySelector(".fig-easing-curve-svg"),this.#K=this.querySelector(".fig-easing-curve-path"),this.#X=this.querySelector('[data-arm="1"]'),this.#Y=this.querySelector('[data-arm="2"]'),this.#G=this.querySelector('[data-handle="1"]')||this.querySelector('[data-handle="bounce"]'),this.#B=this.querySelector('[data-handle="2"]')||this.querySelector('[data-handle="duration"]'),this.#W=this.querySelector('[data-endpoint="start"]'),this.#N=this.querySelector('[data-endpoint="end"]'),this.#O=this.querySelector(".fig-easing-curve-dropdown"),this.#U=this.querySelector(".fig-easing-curve-target"),this.#R=this.querySelector(".fig-easing-curve-bounds"),this.#S=this.querySelector(".fig-easing-curve-diagonal")}#l(){if(this.#D||!window.ResizeObserver)return;this.#D=new ResizeObserver(()=>{if(this.#c())this.#x()}),this.#D.observe(this)}#c(){if(!this.#j)return!1;const Q=this.#j.getBoundingClientRect(),$=Math.max(1,Math.round(Q.width||200)),J=Math.max(1,Math.round(Q.height||200)),Z=$!==this.#A||J!==this.#M;return this.#A=$,this.#M=J,this.#j.setAttribute("viewBox",`0 0 ${$} ${J}`),Z}#p(Q,$){return{x:Q*this.#A,y:(1-$)*this.#M}}#t(Q,$){return{x:Q/this.#A,y:1-$/this.#M}}#i={minVal:0,maxVal:1.2,totalTime:1};#I(Q,$){const Z=this.#M-40,{minVal:_,maxVal:j}=this.#i,q=j-_||1;return{x:Q*this.#A,y:20+(1-($-_)/q)*Z}}#x(){if(this.#c(),this.#_==="spring")this.#Q0();else this.#n()}#n(){if(this.#R)this.#R.setAttribute("x","0"),this.#R.setAttribute("y","0"),this.#R.setAttribute("width",this.#A),this.#R.setAttribute("height",this.#M);if(this.#S)this.#S.setAttribute("x1","0"),this.#S.setAttribute("y1",this.#M),this.#S.setAttribute("x2",this.#A),this.#S.setAttribute("y2","0");const Q=this.#p(0,0),$=this.#p(this.#Q.x,this.#Q.y),J=this.#p(this.#$.x,this.#$.y),Z=this.#p(1,1);if(this.#K.setAttribute("d",`M${Q.x},${Q.y} C${$.x},${$.y} ${J.x},${J.y} ${Z.x},${Z.y}`),this.#X.setAttribute("x1",Q.x),this.#X.setAttribute("y1",Q.y),this.#X.setAttribute("x2",$.x),this.#X.setAttribute("y2",$.y),this.#Y.setAttribute("x1",Z.x),this.#Y.setAttribute("y1",Z.y),this.#Y.setAttribute("x2",J.x),this.#Y.setAttribute("y2",J.y),this.#G.setAttribute("cx",$.x),this.#G.setAttribute("cy",$.y),this.#B.setAttribute("cx",J.x),this.#B.setAttribute("cy",J.y),this.#W)this.#W.setAttribute("cx",Q.x),this.#W.setAttribute("cy",Q.y);if(this.#N)this.#N.setAttribute("cx",Z.x),this.#N.setAttribute("cy",Z.y)}#Q0(){if(this.#R)this.#R.setAttribute("x","0"),this.#R.setAttribute("y","0"),this.#R.setAttribute("width",this.#A),this.#R.setAttribute("height",this.#M);const Q=this.#b();if(!Q.length)return;const $=Q[Q.length-1].t||1;let J=0,Z=1;for(let B of Q){if(B.value<J)J=B.value;if(B.value>Z)Z=B.value}const _=Math.max(Math.abs(J-1),Math.abs(Z-1),0.01),j=0;this.#i={minVal:1-_-j,maxVal:1+_+j,totalTime:$};const q=Math.max(0.05,Math.min(0.95,this.#F));let K="";for(let B=0;B<Q.length;B++){const F=Q[B].t/$*q,D=this.#I(F,Q[B].value);K+=(B===0?"M":"L")+D.x.toFixed(1)+","+D.y.toFixed(1)}const X=this.#I(q,1),W=this.#I(1,1);if(K+=`L${X.x.toFixed(1)},${X.y.toFixed(1)} L${W.x.toFixed(1)},${W.y.toFixed(1)}`,this.#K.setAttribute("d",K),this.#U){const B=this.#I(0,1),F=this.#I(1,1);this.#U.setAttribute("x1",B.x),this.#U.setAttribute("y1",B.y),this.#U.setAttribute("x2",F.x),this.#U.setAttribute("y2",F.y)}const L=this.#$0(Q),U=L.t/$*q,G=this.#I(U,L.value);this.#G.setAttribute("cx",G.x),this.#G.setAttribute("cy",G.y);const N=this.#I(q,1);this.#B.setAttribute("x",N.x-this.#E/2),this.#B.setAttribute("y",N.y-this.#T/2)}#$0(Q){let $={t:0,value:1},J=!1;for(let Z of Q){if(Z.value>=0.99)J=!0;if(J&&Z.value>$.value)$={t:Z.t,value:Z.value}}return $}#u(){if(!this.#O)return;this.#O.value=this.#L,this.#H()}#r(Q,$,J){if(!Q)return;for(let Z of Q.querySelectorAll("option"))if(Z.value===$)Z.innerHTML=`${J} ${$}`}#H(){if(!this.#O)return;const Q=f.curveIcon(this.#Q.x,this.#Q.y,this.#$.x,this.#$.y),$=f.#g(this.#J);this.#r(this.#O,"Custom bezier",Q),this.#r(this.#O,"Custom spring",$),this.#r(this.#O.select,"Custom bezier",Q),this.#r(this.#O.select,"Custom spring",$)}#V(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{mode:this.#_,value:this.value,cssValue:this.cssValue,preset:this.#L}}))}#Z0(){if(this.#_==="bezier"){this.#G.addEventListener("pointerdown",($)=>this.#a($,1)),this.#B.addEventListener("pointerdown",($)=>this.#a($,2));const Q=this.querySelector(".fig-easing-curve-svg-container");if(Q)Q.addEventListener("pointerdown",($)=>{if($.target?.closest?.(".fig-easing-curve-handle"))return;this.#a($,this.#_0($))})}else{this.#G.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#e($,"bounce")}),this.#B.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#e($,"duration")});const Q=this.querySelector(".fig-easing-curve-svg-container");if(Q)Q.addEventListener("pointerdown",($)=>{if($.target?.closest?.(".fig-easing-curve-handle"))return;this.#e($,"duration")})}if(this.#O)this.#O.addEventListener("change",(Q)=>{const $=Q.detail,J=f.PRESETS.find((Z)=>Z.name===$);if(!J)return;if(J.type==="bezier"){if(J.value)this.#Q.x=J.value[0],this.#Q.y=J.value[1],this.#$.x=J.value[2],this.#$.y=J.value[3];if(this.#L=$,this.#_!=="bezier")this.#_="bezier",this.#v();else this.#x()}else if(J.type==="spring"){if(J.spring)this.#J={...J.spring};if(this.#L=$,this.#_!=="spring")this.#_="spring",this.#v();else this.#x()}this.#V("input"),this.#V("change")})}#J0(Q){const $=this.#j.getScreenCTM();if(!$)return{x:0,y:0};const J=$.inverse();return{x:J.a*Q.clientX+J.c*Q.clientY+J.e,y:J.b*Q.clientX+J.d*Q.clientY+J.f}}#_0(Q){return this.#J0(Q).x<=this.#A/2?1:2}#a(Q,$){Q.preventDefault(),this.#Z=$;const J=(_)=>{if(!this.#Z)return;const j=this.#J0(_),q=this.#t(j.x,j.y);if(q.x=Math.round(q.x*100)/100,q.y=Math.round(q.y*100)/100,q.x=Math.max(0,Math.min(1,q.x)),this.#Z===1)this.#Q.x=q.x,this.#Q.y=q.y;else this.#$.x=q.x,this.#$.y=q.y;this.#x(),this.#L=this.#f(),this.#u(),this.#V("input")},Z=()=>{this.#Z=null,document.removeEventListener("pointermove",J),document.removeEventListener("pointerup",Z),this.#V("change")};document.addEventListener("pointermove",J),document.addEventListener("pointerup",Z)}#e(Q,$){Q.preventDefault(),this.#Z=$;const J=this.#J.damping,Z=this.#J.stiffness,_=this.#F,j=Q.clientY,q=Q.clientX,K=(W)=>{if(!this.#Z)return;if($==="bounce"){const L=W.clientY-j;this.#J.damping=Math.max(1,Math.round(J+L*0.15))}else{const L=W.clientX-q;this.#F=Math.max(0.05,Math.min(0.95,_+L/200)),this.#J.stiffness=Math.max(10,Math.round(Z-L*1.5))}this.#x(),this.#L=this.#f(),this.#u(),this.#V("input")},X=()=>{this.#Z=null,document.removeEventListener("pointermove",K),document.removeEventListener("pointerup",X),this.#V("change")};document.addEventListener("pointermove",K),document.addEventListener("pointerup",X)}}customElements.define("fig-easing-curve",f);class A0 extends HTMLElement{#Q=0;#$=0;#J=0;#_=1;#q=!1;#Z=!1;#j=null;#K=null;#X=null;#Y=null;#G=[];#B={};static get observedAttributes(){return["value","precision","aspect-ratio","fields","perspective","perspective-origin","transform-origin","selected","drag"]}connectedCallback(){this.#_=parseInt(this.getAttribute("precision")||"1"),this.#W(this.getAttribute("aspect-ratio")),this.#N(this.getAttribute("perspective")),this.#O("--perspective-origin",this.getAttribute("perspective-origin")),this.#L(this.getAttribute("transform-origin")),this.#A(this.getAttribute("fields"));const Q=this.getAttribute("value");if(Q)this.#M(Q);this.#R(),this.#F(this.getAttribute("selected")),this.#U()}disconnectedCallback(){if(this.#q=!1,this.#X)window.removeEventListener("keydown",this.#X),window.removeEventListener("keyup",this.#Y)}#W(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}#N(Q){if(Q&&Q.trim())this.style.setProperty("--perspective",Q.trim());else this.style.removeProperty("--perspective")}#O(Q,$){if($&&$.trim())this.style.setProperty(Q,$.trim());else this.style.removeProperty(Q)}#L(Q){if(!Q||!Q.trim()){this.style.removeProperty("--transform-origin");return}const $=Q.trim().split(/\s+/);if($.length===2)this.style.setProperty("--transform-origin",`${$[0]} ${$[1]} -50cqi`);else this.style.setProperty("--transform-origin",Q.trim())}#U(){if(!this.#K)return;this.#K.style.cursor=this.#E?"":"default"}#F(Q){if(!this.#j)return;const $=this.#j.querySelectorAll(".fig-3d-rotate-face"),J=Q?Q.trim().toLowerCase():"";for(let Z of $)Z.classList.toggle("selected",J!==""&&Z.classList.contains(J))}#A(Q){if(!Q||!Q.trim()){this.#G=[];return}const $=["rotateX","rotateY","rotateZ"];this.#G=Q.split(",").map((J)=>J.trim()).filter((J)=>$.includes(J))}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#W(J);return}if(Q==="perspective"){this.#N(J);return}if(Q==="perspective-origin"){this.#O("--perspective-origin",J);return}if(Q==="transform-origin"){this.#L(J);return}if(Q==="selected"){this.#F(J);return}if(Q==="drag"){this.#U();return}if(Q==="fields"){if(this.#A(J),this.#j)this.#R();return}if(!this.#j)return;if(Q==="value"&&J){if(this.#q)return;this.#M(J),this.#D(),this.#S()}if(Q==="precision")this.#_=parseInt(J||"1")}get value(){const Q=this.#_;return`rotateX(${this.#Q.toFixed(Q)}deg) rotateY(${this.#$.toFixed(Q)}deg) rotateZ(${this.#J.toFixed(Q)}deg)`}set value(Q){this.setAttribute("value",Q)}get rotateX(){return this.#Q}get rotateY(){return this.#$}get rotateZ(){return this.#J}#M(Q){const $=Q.match(/rotateX\(\s*(-?[\d.]+)\s*deg\s*\)/),J=Q.match(/rotateY\(\s*(-?[\d.]+)\s*deg\s*\)/),Z=Q.match(/rotateZ\(\s*(-?[\d.]+)\s*deg\s*\)/);if($)this.#Q=parseFloat($[1]);if(J)this.#$=parseFloat(J[1]);if(Z)this.#J=parseFloat(Z[1])}#R(){const Q={rotateX:"X",rotateY:"Y",rotateZ:"Z"},$={rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J},J=this.#G.map((Z)=>`<fig-input-number
             name="${Z}"
             step="1"
             precision="1"
@@ -229,9 +229,9 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           <div class="fig-3d-rotate-face bottom"></div>
         </div>
       </div>
-    </div>${J}`,this.#K=this.querySelector(".fig-3d-rotate-container"),this.#j=this.querySelector(".fig-3d-rotate-cube"),this.#B={};for(let Z of this.#Y){const _=this.querySelector(`fig-input-number[name="${Z}"]`);if(_){this.#B[Z]=_;const j=(q)=>{q.stopPropagation();const K=parseFloat(q.target.value);if(isNaN(K))return;if(Z==="rotateX")this.#Q=K;else if(Z==="rotateY")this.#$=K;else if(Z==="rotateZ")this.#J=K;this.#F(),this.#z(q.type)};_.addEventListener("input",j),_.addEventListener("change",j)}}this.#F(),this.#k()}#P(){const Q={rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J};for(let $ of this.#Y){const J=this.#B[$];if(J)J.setAttribute("value",Q[$].toFixed(this.#_))}}#F(){if(!this.#j)return;this.#j.style.transform=`rotateX(${this.#Q}deg) rotateY(${this.#$}deg) rotateZ(${this.#J}deg)`}#z(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{value:this.value,rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J}}))}#H(Q){if(!this.#Z)return Q;return Math.round(Q/15)*15}#k(){this.#K.addEventListener("pointerdown",(Q)=>this.#C(Q)),this.#W=(Q)=>{if(Q.key==="Shift")this.#Z=!0},this.#G=(Q)=>{if(Q.key==="Shift")this.#Z=!1},window.addEventListener("keydown",this.#W),window.addEventListener("keyup",this.#G)}get#E(){const Q=this.getAttribute("drag");return Q===null||Q.toLowerCase()!=="false"}#C(Q){if(!this.#E)return;Q.preventDefault(),this.#q=!0,this.#K.classList.add("dragging"),this.#K.setPointerCapture(Q.pointerId);const{clientX:$,clientY:J}=Q,Z=this.#Q,_=this.#$,j=(K)=>{if(!this.#q)return;if(K.buttons===0){q();return}const X=K.clientX-$,W=K.clientY-J;this.#$=this.#H(_+X*0.5),this.#Q=this.#H(Z-W*0.5),this.#F(),this.#P(),this.setAttribute("value",this.value),this.#z("input")},q=()=>{if(!this.#q)return;this.setAttribute("value",this.value),this.#q=!1,this.#K.classList.remove("dragging"),this.#K.removeEventListener("pointermove",j),this.#K.removeEventListener("pointerup",q),this.#K.removeEventListener("pointercancel",q),this.#K.removeEventListener("lostpointercapture",q),this.#z("change")};this.#K.addEventListener("pointermove",j),this.#K.addEventListener("pointerup",q),this.#K.addEventListener("pointercancel",q),this.#K.addEventListener("lostpointercapture",q)}}customElements.define("fig-3d-rotate",A0);class p extends HTMLElement{#Q=50;#$=50;#J=0;#_=null;#q=[];#Z=null;#j=null;#K=null;#W=!1;#G=!1;#Y=null;#B=null;#X=null;static SNAP_POINTS=[0,16.6667,33.3333,50,66.6667,83.3333,100];static get observedAttributes(){return["value","precision","aspect-ratio","drag","fields"]}connectedCallback(){this.#J=parseInt(this.getAttribute("precision")||"0"),this.#L(this.getAttribute("aspect-ratio")),this.#R(this.getAttribute("value")),this.#P(),this.#U(),this.#z()}disconnectedCallback(){this.#W=!1,this.#m()}get value(){const Q=this.#J;return`${this.#Q.toFixed(Q)}% ${this.#$.toFixed(Q)}%`}set value(Q){this.setAttribute("value",Q)}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#L(J);return}if(Q==="drag"){this.#U();return}if(Q==="fields"){this.#P(),this.#U(),this.#z();return}if(Q==="precision"){this.#J=parseInt(J||"0"),this.#F(),this.#z();return}if(Q==="value"){if(this.#G||this.#W)return;this.#R(J),this.#k(),this.#E(),this.#F()}}get#O(){const Q=this.getAttribute("drag");return Q===null||Q.toLowerCase()!=="false"}get#N(){const Q=this.getAttribute("fields");if(Q===null)return!1;return Q.toLowerCase()!=="false"}#L(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}#U(){if(!this.#_)return;this.#_.classList.toggle("drag-disabled",!this.#O)}#D(Q){return Math.max(0,Math.min(100,Q))}#A(Q,$){const J=(Q||"").trim().toLowerCase();if(!J)return $==="x"?this.#Q:this.#$;const Z=$==="x"?{left:0,center:50,right:100}:{top:0,center:50,bottom:100};if(J in Z)return Z[J];const _=Number.parseFloat(J.replace("%",""));if(Number.isFinite(_))return _;return $==="x"?this.#Q:this.#$}#M(Q){const $=Q.trim().replace(/,/g," ").split(/\s+/).filter(Boolean);if($.length<1)return;if($.length===1){const J=this.#A($[0],"x");this.#Q=J,this.#$=J;return}this.#Q=this.#A($[0],"x"),this.#$=this.#A($[1],"y")}#R(Q){const $=typeof Q==="string"?Q.trim():"";if(!$){this.#Q=50,this.#$=50;return}this.#M($)}#P(){const Q=Array.from({length:9},(_,j)=>{const q=j%3,K=Math.floor(j/3);return`<span class="origin-grid-cell" data-col="${q}" data-row="${K}">
+    </div>${J}`,this.#K=this.querySelector(".fig-3d-rotate-container"),this.#j=this.querySelector(".fig-3d-rotate-cube"),this.#B={};for(let Z of this.#G){const _=this.querySelector(`fig-input-number[name="${Z}"]`);if(_){this.#B[Z]=_;const j=(q)=>{q.stopPropagation();const K=parseFloat(q.target.value);if(isNaN(K))return;if(Z==="rotateX")this.#Q=K;else if(Z==="rotateY")this.#$=K;else if(Z==="rotateZ")this.#J=K;this.#D(),this.#z(q.type)};_.addEventListener("input",j),_.addEventListener("change",j)}}this.#D(),this.#k()}#S(){const Q={rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J};for(let $ of this.#G){const J=this.#B[$];if(J)J.setAttribute("value",Q[$].toFixed(this.#_))}}#D(){if(!this.#j)return;this.#j.style.transform=`rotateX(${this.#Q}deg) rotateY(${this.#$}deg) rotateZ(${this.#J}deg)`}#z(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{value:this.value,rotateX:this.#Q,rotateY:this.#$,rotateZ:this.#J}}))}#P(Q){if(!this.#Z)return Q;return Math.round(Q/15)*15}#k(){this.#K.addEventListener("pointerdown",(Q)=>this.#T(Q)),this.#X=(Q)=>{if(Q.key==="Shift")this.#Z=!0},this.#Y=(Q)=>{if(Q.key==="Shift")this.#Z=!1},window.addEventListener("keydown",this.#X),window.addEventListener("keyup",this.#Y)}get#E(){const Q=this.getAttribute("drag");return Q===null||Q.toLowerCase()!=="false"}#T(Q){if(!this.#E)return;Q.preventDefault(),this.#q=!0,this.#K.classList.add("dragging"),this.#K.setPointerCapture(Q.pointerId);const{clientX:$,clientY:J}=Q,Z=this.#Q,_=this.#$,j=(K)=>{if(!this.#q)return;if(K.buttons===0){q();return}const X=K.clientX-$,W=K.clientY-J;this.#$=this.#P(_+X*0.5),this.#Q=this.#P(Z-W*0.5),this.#D(),this.#S(),this.setAttribute("value",this.value),this.#z("input")},q=()=>{if(!this.#q)return;this.setAttribute("value",this.value),this.#q=!1,this.#K.classList.remove("dragging"),this.#K.removeEventListener("pointermove",j),this.#K.removeEventListener("pointerup",q),this.#K.removeEventListener("pointercancel",q),this.#K.removeEventListener("lostpointercapture",q),this.#z("change")};this.#K.addEventListener("pointermove",j),this.#K.addEventListener("pointerup",q),this.#K.addEventListener("pointercancel",q),this.#K.addEventListener("lostpointercapture",q)}}customElements.define("fig-3d-rotate",A0);class p extends HTMLElement{#Q=50;#$=50;#J=0;#_=null;#q=[];#Z=null;#j=null;#K=null;#X=!1;#Y=!1;#G=null;#B=null;#W=null;static SNAP_POINTS=[0,16.6667,33.3333,50,66.6667,83.3333,100];static get observedAttributes(){return["value","precision","aspect-ratio","drag","fields"]}connectedCallback(){this.#J=parseInt(this.getAttribute("precision")||"0"),this.#L(this.getAttribute("aspect-ratio")),this.#R(this.getAttribute("value")),this.#S(),this.#U(),this.#z()}disconnectedCallback(){this.#X=!1,this.#m()}get value(){const Q=this.#J;return`${this.#Q.toFixed(Q)}% ${this.#$.toFixed(Q)}%`}set value(Q){this.setAttribute("value",Q)}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#L(J);return}if(Q==="drag"){this.#U();return}if(Q==="fields"){this.#S(),this.#U(),this.#z();return}if(Q==="precision"){this.#J=parseInt(J||"0"),this.#D(),this.#z();return}if(Q==="value"){if(this.#Y||this.#X)return;this.#R(J),this.#k(),this.#E(),this.#D()}}get#N(){const Q=this.getAttribute("drag");return Q===null||Q.toLowerCase()!=="false"}get#O(){const Q=this.getAttribute("fields");if(Q===null)return!1;return Q.toLowerCase()!=="false"}#L(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}#U(){if(!this.#_)return;this.#_.classList.toggle("drag-disabled",!this.#N)}#F(Q){return Math.max(0,Math.min(100,Q))}#A(Q,$){const J=(Q||"").trim().toLowerCase();if(!J)return $==="x"?this.#Q:this.#$;const Z=$==="x"?{left:0,center:50,right:100}:{top:0,center:50,bottom:100};if(J in Z)return Z[J];const _=Number.parseFloat(J.replace("%",""));if(Number.isFinite(_))return _;return $==="x"?this.#Q:this.#$}#M(Q){const $=Q.trim().replace(/,/g," ").split(/\s+/).filter(Boolean);if($.length<1)return;if($.length===1){const J=this.#A($[0],"x");this.#Q=J,this.#$=J;return}this.#Q=this.#A($[0],"x"),this.#$=this.#A($[1],"y")}#R(Q){const $=typeof Q==="string"?Q.trim():"";if(!$){this.#Q=50,this.#$=50;return}this.#M($)}#S(){const Q=Array.from({length:9},(_,j)=>{const q=j%3,K=Math.floor(j/3);return`<span class="origin-grid-cell" data-col="${q}" data-row="${K}">
         <span class="origin-grid-dot"></span>
-      </span>`}).join(""),$=this.#Q.toFixed(this.#J),J=this.#$.toFixed(this.#J),Z=this.#N?`<div class="origin-values">
+      </span>`}).join(""),$=this.#Q.toFixed(this.#J),J=this.#$.toFixed(this.#J),Z=this.#O?`<div class="origin-values">
       <fig-input-number name="x" value="${$}" step="1" units="%"><span slot="prepend">X</span></fig-input-number>
       <fig-input-number name="y" value="${J}" step="1" units="%"><span slot="prepend">Y</span></fig-input-number>
     </div>`:"";this.innerHTML=`<div class="fig-origin-grid-surface">
@@ -240,7 +240,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
         <span class="origin-grid-handle"></span>
       </div>
     </div>
-    ${Z}`,this.#_=this.querySelector(".origin-grid"),this.#q=Array.from(this.querySelectorAll(".origin-grid-cell")),this.#Z=this.querySelector(".origin-grid-handle"),this.#j=this.querySelector('fig-input-number[name="x"]'),this.#K=this.querySelector('fig-input-number[name="y"]'),this.#k(),this.#E(),this.#F(),this.#y()}#F(){const Q=this.#Q.toFixed(this.#J),$=this.#$.toFixed(this.#J);if(this.#j)this.#j.setAttribute("value",Q);if(this.#K)this.#K.setAttribute("value",$)}#z(){const Q=this.value;if(this.getAttribute("value")===Q)return;this.#G=!0,this.setAttribute("value",Q),this.#G=!1}#H(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{value:this.value,x:this.#Q,y:this.#$}}))}#k(){if(!this.#Z)return;const Q=($)=>16.6667+this.#D($)/100*66.6667;this.#Z.style.left=`${Q(this.#Q)}%`,this.#Z.style.top=`${Q(this.#$)}%`}#E(){if(!this.#Z)return;const Q=this.#Q<0||this.#Q>100,$=this.#$<0||this.#$>100,J=this.#Q<0,Z=this.#Q>100,_=this.#$<0,j=this.#$>100;this.#Z.classList.toggle("beyond-bounds-x",Q),this.#Z.classList.toggle("beyond-bounds-y",$),this.#Z.classList.toggle("overflow-left",J),this.#Z.classList.toggle("overflow-right",Z),this.#Z.classList.toggle("overflow-up",_),this.#Z.classList.toggle("overflow-down",j)}#C(Q,$){if(!this.#_)return null;const J=this.#_.getBoundingClientRect(),Z=(Q-J.left)/Math.max(J.width,1),_=($-J.top)/Math.max(J.height,1);if(Z<0||Z>1||_<0||_>1)return null;const j=Math.max(0,Math.min(2,Math.floor(Z*3))),q=Math.max(0,Math.min(2,Math.floor(_*3)));return this.#q.find((K)=>Number(K.getAttribute("data-col"))===j&&Number(K.getAttribute("data-row"))===q)}#T(){for(let Q of this.#q)Q.classList.remove("is-hovered")}#h(Q){if(this.#T(),Q)Q.classList.add("is-hovered")}#w(Q,$,J){const Z=Number(Q),_=Number($);if(!Number.isFinite(Z)||!Number.isFinite(_))return;if(Z===this.#Q&&_===this.#$&&J==="input")return;this.#Q=Z,this.#$=_,this.#k(),this.#E(),this.#F(),this.#z(),this.#H(J)}#f(Q,$){if(!this.#_)return{x:this.#Q,y:this.#$};const J=this.#_.getBoundingClientRect(),Z=J.width/6,_=J.height/6,j=Math.max(1,J.width-Z*2),q=Math.max(1,J.height-_*2),K=(Q-(J.left+Z))/j,X=($-(J.top+_))/q;return{x:K*100,y:X*100}}#b(Q,$){if(!this.#_)return{x:50,y:50};const J=this.#_.getBoundingClientRect(),Z=(Q-J.left)/Math.max(J.width,1)*3,_=($-J.top)/Math.max(J.height,1)*3,j=Math.max(0,Math.min(2,Math.floor(Z))),q=Math.max(0,Math.min(2,Math.floor(_)));return{x:j*50,y:q*50}}#g(Q){let J=Q,Z=1/0;for(let _ of p.SNAP_POINTS){const j=Math.abs(Q-_);if(j<Z)Z=j,J=_}return Z<=2.5?J:Q}#v(Q,$){if(!$)return Q;return{x:this.#g(Q.x),y:this.#g(Q.y)}}#m(){if(!this.#_||!this.#B||!this.#X)return;this.#_.removeEventListener("pointermove",this.#B),this.#_.removeEventListener("pointerup",this.#X),this.#_.removeEventListener("pointercancel",this.#X),this.#_.removeEventListener("lostpointercapture",this.#X),this.#B=null,this.#X=null}#d(Q){if(!this.#_||!this.#O)return;Q.preventDefault(),this.#W=!0,this.#Y=Q.pointerId;const{clientX:$,clientY:J}=Q,Z=3;let _=!1;this.#_.setPointerCapture(Q.pointerId),this.#B=(j)=>{if(!this.#W||j.pointerId!==this.#Y)return;const q=j.clientX-$,K=j.clientY-J,X=Math.hypot(q,K);if(!_&&X<Z)return;if(!_)_=!0,this.#_.classList.add("is-dragging"),this.#T();const W=this.#v(this.#f(j.clientX,j.clientY),j.shiftKey);this.#w(W.x,W.y,"input")},this.#X=(j)=>{if(!this.#W||j.pointerId!==this.#Y)return;if(this.#W=!1,this.#Y=null,this.#_.classList.remove("is-dragging"),this.#T(),this.#m(),!_){const q=this.#b($,J);this.#w(q.x,q.y,"input")}this.#H("change")},this.#_.addEventListener("pointermove",this.#B),this.#_.addEventListener("pointerup",this.#X),this.#_.addEventListener("pointercancel",this.#X),this.#_.addEventListener("lostpointercapture",this.#X)}#y(){if(!this.#_||!this.#Z)return;this.#_.addEventListener("pointerdown",($)=>{const J=this.#C($.clientX,$.clientY);if(this.#h(J),this.#O){this.#d($);return}const Z=this.#b($.clientX,$.clientY);this.#w(Z.x,Z.y,"input"),this.#H("change")}),this.#_.addEventListener("pointermove",($)=>{if(this.#W)return;const J=this.#C($.clientX,$.clientY);this.#h(J)}),this.#_.addEventListener("pointerleave",()=>{this.#T()});const Q=($,J)=>{if(!$)return;const Z=(_)=>{const j=Number.parseFloat(_.target.value);if(!Number.isFinite(j))return;if(J==="x")this.#w(j,this.#$,"input");else this.#w(this.#Q,j,"input")};$.addEventListener("input",Z),$.addEventListener("change",Z),$.addEventListener("focusout",()=>{this.#H("change")})};Q(this.#j,"x"),Q(this.#K,"y")}}customElements.define("fig-origin-grid",p);class F0 extends HTMLElement{#Q=null;#$=null;#J=null;#_=null;#q=null;#Z=null;#j=null;#K=null;#W=!1;constructor(){super();this.position={x:0.5,y:0.5},this.isDragging=!1,this.isShiftHeld=!1,this.plane=null,this.cursor=null,this.xInput=null,this.yInput=null,this.coordinates="screen",this.#G=!1,this.#Q=(Q)=>this.#T(Q),this.#$=(Q)=>this.#h(Q),this.#J=(Q)=>this.#w(Q),this.#_=(Q)=>this.#f(Q),this.#q=(Q)=>this.#A(Q),this.#Z=(Q)=>this.#M(Q),this.#j=()=>this.#R(),this.#K=()=>this.#R()}#G=!1;connectedCallback(){requestAnimationFrame(()=>{if(this.precision=this.getAttribute("precision")||3,this.precision=parseInt(this.precision),this.transform=this.getAttribute("transform")||1,this.transform=Number(this.transform),this.coordinates=this.getAttribute("coordinates")||"screen",this.#B(this.getAttribute("aspect-ratio")),!this.hasAttribute("value"))this.setAttribute("value","50% 50%");this.#O(),this.#U(),this.#E(),this.#C(),this.#G=!0})}#Y(Q){return this.coordinates==="math"?1-Q:Q}#B(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}disconnectedCallback(){this.#D()}get#X(){const Q=this.getAttribute("fields");if(Q===null)return!1;return Q.toLowerCase()!=="false"}#O(){this.innerHTML=this.#L()}#N(){const Q=(this.getAttribute("axis-labels")||"").trim();if(!Q)return{left:"",right:"",top:"",bottom:"",leftNoRotate:!1};const $=Q.split(/\s+/).filter(Boolean);if($.length===1)return{left:"",right:"",top:$[0],bottom:"",leftNoRotate:!1};if($.length===2){const[J,Z]=$;return{left:J,right:"",top:"",bottom:Z,leftNoRotate:!0}}if($.length===4){const[J,Z,_,j]=$;return{left:J,right:Z,top:_,bottom:j,leftNoRotate:!1}}return{left:"",right:"",top:"",bottom:"",leftNoRotate:!1}}#L(){const Q=this.#N();return`        
+    ${Z}`,this.#_=this.querySelector(".origin-grid"),this.#q=Array.from(this.querySelectorAll(".origin-grid-cell")),this.#Z=this.querySelector(".origin-grid-handle"),this.#j=this.querySelector('fig-input-number[name="x"]'),this.#K=this.querySelector('fig-input-number[name="y"]'),this.#k(),this.#E(),this.#D(),this.#y()}#D(){const Q=this.#Q.toFixed(this.#J),$=this.#$.toFixed(this.#J);if(this.#j)this.#j.setAttribute("value",Q);if(this.#K)this.#K.setAttribute("value",$)}#z(){const Q=this.value;if(this.getAttribute("value")===Q)return;this.#Y=!0,this.setAttribute("value",Q),this.#Y=!1}#P(Q){this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,detail:{value:this.value,x:this.#Q,y:this.#$}}))}#k(){if(!this.#Z)return;const Q=($)=>16.6667+this.#F($)/100*66.6667;this.#Z.style.left=`${Q(this.#Q)}%`,this.#Z.style.top=`${Q(this.#$)}%`}#E(){if(!this.#Z)return;const Q=this.#Q<0||this.#Q>100,$=this.#$<0||this.#$>100,J=this.#Q<0,Z=this.#Q>100,_=this.#$<0,j=this.#$>100;this.#Z.classList.toggle("beyond-bounds-x",Q),this.#Z.classList.toggle("beyond-bounds-y",$),this.#Z.classList.toggle("overflow-left",J),this.#Z.classList.toggle("overflow-right",Z),this.#Z.classList.toggle("overflow-up",_),this.#Z.classList.toggle("overflow-down",j)}#T(Q,$){if(!this.#_)return null;const J=this.#_.getBoundingClientRect(),Z=(Q-J.left)/Math.max(J.width,1),_=($-J.top)/Math.max(J.height,1);if(Z<0||Z>1||_<0||_>1)return null;const j=Math.max(0,Math.min(2,Math.floor(Z*3))),q=Math.max(0,Math.min(2,Math.floor(_*3)));return this.#q.find((K)=>Number(K.getAttribute("data-col"))===j&&Number(K.getAttribute("data-row"))===q)}#C(){for(let Q of this.#q)Q.classList.remove("is-hovered")}#h(Q){if(this.#C(),Q)Q.classList.add("is-hovered")}#w(Q,$,J){const Z=Number(Q),_=Number($);if(!Number.isFinite(Z)||!Number.isFinite(_))return;if(Z===this.#Q&&_===this.#$&&J==="input")return;this.#Q=Z,this.#$=_,this.#k(),this.#E(),this.#D(),this.#z(),this.#P(J)}#f(Q,$){if(!this.#_)return{x:this.#Q,y:this.#$};const J=this.#_.getBoundingClientRect(),Z=J.width/6,_=J.height/6,j=Math.max(1,J.width-Z*2),q=Math.max(1,J.height-_*2),K=(Q-(J.left+Z))/j,X=($-(J.top+_))/q;return{x:K*100,y:X*100}}#b(Q,$){if(!this.#_)return{x:50,y:50};const J=this.#_.getBoundingClientRect(),Z=(Q-J.left)/Math.max(J.width,1)*3,_=($-J.top)/Math.max(J.height,1)*3,j=Math.max(0,Math.min(2,Math.floor(Z))),q=Math.max(0,Math.min(2,Math.floor(_)));return{x:j*50,y:q*50}}#g(Q){let J=Q,Z=1/0;for(let _ of p.SNAP_POINTS){const j=Math.abs(Q-_);if(j<Z)Z=j,J=_}return Z<=2.5?J:Q}#v(Q,$){if(!$)return Q;return{x:this.#g(Q.x),y:this.#g(Q.y)}}#m(){if(!this.#_||!this.#B||!this.#W)return;this.#_.removeEventListener("pointermove",this.#B),this.#_.removeEventListener("pointerup",this.#W),this.#_.removeEventListener("pointercancel",this.#W),this.#_.removeEventListener("lostpointercapture",this.#W),this.#B=null,this.#W=null}#d(Q){if(!this.#_||!this.#N)return;Q.preventDefault(),this.#X=!0,this.#G=Q.pointerId;const{clientX:$,clientY:J}=Q,Z=3;let _=!1;this.#_.setPointerCapture(Q.pointerId),this.#B=(j)=>{if(!this.#X||j.pointerId!==this.#G)return;const q=j.clientX-$,K=j.clientY-J,X=Math.hypot(q,K);if(!_&&X<Z)return;if(!_)_=!0,this.#_.classList.add("is-dragging"),this.#C();const W=this.#v(this.#f(j.clientX,j.clientY),j.shiftKey);this.#w(W.x,W.y,"input")},this.#W=(j)=>{if(!this.#X||j.pointerId!==this.#G)return;if(this.#X=!1,this.#G=null,this.#_.classList.remove("is-dragging"),this.#C(),this.#m(),!_){const q=this.#b($,J);this.#w(q.x,q.y,"input")}this.#P("change")},this.#_.addEventListener("pointermove",this.#B),this.#_.addEventListener("pointerup",this.#W),this.#_.addEventListener("pointercancel",this.#W),this.#_.addEventListener("lostpointercapture",this.#W)}#y(){if(!this.#_||!this.#Z)return;this.#_.addEventListener("pointerdown",($)=>{const J=this.#T($.clientX,$.clientY);if(this.#h(J),this.#N){this.#d($);return}const Z=this.#b($.clientX,$.clientY);this.#w(Z.x,Z.y,"input"),this.#P("change")}),this.#_.addEventListener("pointermove",($)=>{if(this.#X)return;const J=this.#T($.clientX,$.clientY);this.#h(J)}),this.#_.addEventListener("pointerleave",()=>{this.#C()});const Q=($,J)=>{if(!$)return;const Z=(_)=>{const j=Number.parseFloat(_.target.value);if(!Number.isFinite(j))return;if(J==="x")this.#w(j,this.#$,"input");else this.#w(this.#Q,j,"input")};$.addEventListener("input",Z),$.addEventListener("change",Z),$.addEventListener("focusout",()=>{this.#P("change")})};Q(this.#j,"x"),Q(this.#K,"y")}}customElements.define("fig-origin-grid",p);class D0 extends HTMLElement{#Q=null;#$=null;#J=null;#_=null;#q=null;#Z=null;#j=null;#K=null;#X=!1;constructor(){super();this.position={x:0.5,y:0.5},this.isDragging=!1,this.isShiftHeld=!1,this.plane=null,this.cursor=null,this.xInput=null,this.yInput=null,this.coordinates="screen",this.#Y=!1,this.#Q=(Q)=>this.#C(Q),this.#$=(Q)=>this.#h(Q),this.#J=(Q)=>this.#w(Q),this.#_=(Q)=>this.#f(Q),this.#q=(Q)=>this.#A(Q),this.#Z=(Q)=>this.#M(Q),this.#j=()=>this.#R(),this.#K=()=>this.#R()}#Y=!1;connectedCallback(){requestAnimationFrame(()=>{if(this.precision=this.getAttribute("precision")||3,this.precision=parseInt(this.precision),this.transform=this.getAttribute("transform")||1,this.transform=Number(this.transform),this.coordinates=this.getAttribute("coordinates")||"screen",this.#B(this.getAttribute("aspect-ratio")),!this.hasAttribute("value"))this.setAttribute("value","50% 50%");this.#N(),this.#U(),this.#E(),this.#T(),this.#Y=!0})}#G(Q){return this.coordinates==="math"?1-Q:Q}#B(Q){if(Q&&Q.trim())this.style.setProperty("--aspect-ratio",Q.trim());else this.style.removeProperty("--aspect-ratio")}disconnectedCallback(){this.#F()}get#W(){const Q=this.getAttribute("fields");if(Q===null)return!1;return Q.toLowerCase()!=="false"}#N(){this.innerHTML=this.#L()}#O(){const Q=(this.getAttribute("axis-labels")||"").trim();if(!Q)return{left:"",right:"",top:"",bottom:"",leftNoRotate:!1};const $=Q.split(/\s+/).filter(Boolean);if($.length===1)return{left:"",right:"",top:$[0],bottom:"",leftNoRotate:!1};if($.length===2){const[J,Z]=$;return{left:J,right:"",top:"",bottom:Z,leftNoRotate:!0}}if($.length===4){const[J,Z,_,j]=$;return{left:J,right:Z,top:_,bottom:j,leftNoRotate:!1}}return{left:"",right:"",top:"",bottom:"",leftNoRotate:!1}}#L(){const Q=this.#O();return`        
           <div class="fig-input-joystick-plane-container" tabindex="0">
             ${[Q.left?`<label class="fig-joystick-axis-label left${Q.leftNoRotate?" no-rotate":""}" aria-hidden="true">${Q.left}</label>`:"",Q.right?`<label class="fig-joystick-axis-label right" aria-hidden="true">${Q.right}</label>`:"",Q.top?`<label class="fig-joystick-axis-label top" aria-hidden="true">${Q.top}</label>`:"",Q.bottom?`<label class="fig-joystick-axis-label bottom" aria-hidden="true">${Q.bottom}</label>`:""].join("")}
             <div class="fig-input-joystick-plane">
@@ -248,7 +248,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
               <div class="fig-input-joystick-handle"></div>
             </div>
           </div>
-          ${this.#X?`<div class="joystick-values">
+          ${this.#W?`<div class="joystick-values">
                   <fig-input-number
                     name="x"
                     step="1"
@@ -268,7 +268,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
                     <span slot="prepend">Y</span>
                   </fig-input-number>
                 </div>`:""}
-        `}#U(){if(this.plane=this.querySelector(".fig-input-joystick-plane"),this.cursor=this.querySelector(".fig-input-joystick-handle"),this.xInput=this.querySelector("fig-input-number[name='x']"),this.yInput=this.querySelector("fig-input-number[name='y']"),this.plane.addEventListener("mousedown",this.#Q),this.plane.addEventListener("touchstart",this.#$),window.addEventListener("keydown",this.#J),window.addEventListener("keyup",this.#_),this.#X&&this.xInput&&this.yInput)this.xInput.addEventListener("input",this.#q),this.xInput.addEventListener("change",this.#q),this.xInput.addEventListener("focusout",this.#j),this.yInput.addEventListener("input",this.#Z),this.yInput.addEventListener("change",this.#Z),this.yInput.addEventListener("focusout",this.#K)}#D(){if(this.plane)this.plane.removeEventListener("mousedown",this.#Q),this.plane.removeEventListener("touchstart",this.#$);if(window.removeEventListener("keydown",this.#J),window.removeEventListener("keyup",this.#_),this.#X&&this.xInput&&this.yInput)this.xInput.removeEventListener("input",this.#q),this.xInput.removeEventListener("change",this.#q),this.xInput.removeEventListener("focusout",this.#j),this.yInput.removeEventListener("input",this.#Z),this.yInput.removeEventListener("change",this.#Z),this.yInput.removeEventListener("focusout",this.#K)}#A(Q){const $=Number.parseFloat(Q.target.value);if(!Number.isFinite($))return;this.position.x=Math.max(0,Math.min(1,$/100)),this.#E(),this.#C(),this.#H()}#M(Q){const $=Number.parseFloat(Q.target.value);if(!Number.isFinite($))return;this.position.y=Math.max(0,Math.min(1,$/100)),this.#E(),this.#C(),this.#H()}#R(){this.#C(),this.#k()}#P(Q){if(!this.isShiftHeld)return Q;if(Q<0.1)return 0;if(Q>0.9)return 1;if(Q>0.4&&Q<0.6)return 0.5;return Q}#F(Q,$){if(!this.isShiftHeld)return{x:Q,y:$};if(Math.abs(Q-$)<0.1)return{x:(Q+$)/2,y:(Q+$)/2};if(Math.abs(1-Q-$)<0.1)return{x:Q,y:1-Q};return{x:Q,y:$}}#z(Q){const $=this.plane.getBoundingClientRect();let J=Math.max(0,Math.min(1,(Q.clientX-$.left)/$.width)),Z=Math.max(0,Math.min(1,(Q.clientY-$.top)/$.height)),_=this.coordinates==="math"?1-Z:Z;J=this.#P(J),_=this.#P(_);const j=this.#F(J,_);this.position=j;const q=this.#Y(j.y);if(this.cursor.style.left=`${j.x*100}%`,this.cursor.style.top=`${q*100}%`,this.#X&&this.xInput&&this.yInput)this.xInput.setAttribute("value",Math.round(j.x*100)),this.yInput.setAttribute("value",Math.round(j.y*100));this.#C(),this.#H()}#H(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0}))}#k(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0}))}#E(){const Q=this.#Y(this.position.y);if(this.cursor)this.cursor.style.left=`${this.position.x*100}%`,this.cursor.style.top=`${Q*100}%`;if(this.#X&&this.xInput&&this.yInput)this.xInput.setAttribute("value",Math.round(this.position.x*100)),this.yInput.setAttribute("value",Math.round(this.position.y*100))}#C(){const Q=this.value;if(this.getAttribute("value")===Q)return;this.#W=!0,this.setAttribute("value",Q),this.#W=!1}#T(Q){this.isDragging=!0,this.#z(Q),this.plane.style.cursor="grabbing";const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#z(Z)},J=()=>{this.isDragging=!1,this.plane.classList.remove("dragging"),this.plane.style.cursor="",window.removeEventListener("mousemove",$),window.removeEventListener("mouseup",J),this.#C(),this.#k()};window.addEventListener("mousemove",$),window.addEventListener("mouseup",J)}#h(Q){Q.preventDefault(),this.isDragging=!0,this.#z(Q.touches[0]);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#z(Z.touches[0])},J=()=>{this.isDragging=!1,this.plane.classList.remove("dragging"),window.removeEventListener("touchmove",$),window.removeEventListener("touchend",J),this.#C(),this.#k()};window.addEventListener("touchmove",$),window.addEventListener("touchend",J)}#w(Q){if(Q.key==="Shift")this.isShiftHeld=!0}#f(Q){if(Q.key==="Shift")this.isShiftHeld=!1}focus(){this.querySelector(".fig-input-joystick-plane-container")?.focus()}static get observedAttributes(){return["value","precision","transform","fields","coordinates","aspect-ratio","axis-labels"]}get value(){return`${Math.round(this.position.x*100)}% ${Math.round(this.position.y*100)}%`}set value(Q){const $=Q==null?"":String(Q).trim();if(!$)this.position={x:0.5,y:0.5};else{const J=$.split(/[\s,]+/).filter(Boolean),Z=(q)=>{if(!q)return 0.5;const K=q.includes("%"),X=Number.parseFloat(q.replace(/%/g,"").trim());if(!Number.isFinite(X))return 0.5;const W=K||Math.abs(X)>1?X/100:X;return Math.max(0,Math.min(1,W))},_=Z(J[0]),j=Z(J[1]??J[0]);this.position={x:_,y:j}}if(this.#G)this.#E()}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#B(J);return}if(Q==="value"){if(this.#W||this.isDragging)return;this.value=J}if(Q==="precision")this.precision=parseInt(J);if(Q==="transform")this.transform=Number(J);if(Q==="fields"&&J!==$)this.#D(),this.#O(),this.#U(),this.#E();if(Q==="axis-labels"&&J!==$)this.#D(),this.#O(),this.#U(),this.#E();if(Q==="coordinates")this.coordinates=J||"screen",this.#E()}}customElements.define("fig-joystick",F0);class D0 extends HTMLElement{#Q;#$;#J=null;#_;constructor(){super();this.angle=0,this.#Q=1,this.#$=0,this.isDragging=!1,this.isShiftHeld=!1,this.handle=null,this.angleInput=null,this.plane=null,this.units="\xB0",this.min=null,this.max=null,this.showRotations=!1,this.rotationSpan=null,this.#_=this.#N.bind(this)}connectedCallback(){requestAnimationFrame(()=>{this.precision=this.getAttribute("precision")||1,this.precision=parseInt(this.precision),this.text=this.getAttribute("text")==="true";let Q=this.getAttribute("units")||"\xB0";if(Q==="deg")Q="\xB0";if(this.units=Q,this.min=this.hasAttribute("min")?Number(this.getAttribute("min")):null,this.max=this.hasAttribute("max")?Number(this.getAttribute("max")):null,this.showRotations=this.getAttribute("show-rotations")==="true",this.#q(),this.#X(),this.#F(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision))})}disconnectedCallback(){this.#O()}#q(){this.innerHTML=this.#Z()}#Z(){const Q=this.#W(),$=this.min!==null?`min="${this.min}"`:"",J=this.max!==null?`max="${this.max}"`:"";return`
+        `}#U(){if(this.plane=this.querySelector(".fig-input-joystick-plane"),this.cursor=this.querySelector(".fig-input-joystick-handle"),this.xInput=this.querySelector("fig-input-number[name='x']"),this.yInput=this.querySelector("fig-input-number[name='y']"),this.plane.addEventListener("mousedown",this.#Q),this.plane.addEventListener("touchstart",this.#$),window.addEventListener("keydown",this.#J),window.addEventListener("keyup",this.#_),this.#W&&this.xInput&&this.yInput)this.xInput.addEventListener("input",this.#q),this.xInput.addEventListener("change",this.#q),this.xInput.addEventListener("focusout",this.#j),this.yInput.addEventListener("input",this.#Z),this.yInput.addEventListener("change",this.#Z),this.yInput.addEventListener("focusout",this.#K)}#F(){if(this.plane)this.plane.removeEventListener("mousedown",this.#Q),this.plane.removeEventListener("touchstart",this.#$);if(window.removeEventListener("keydown",this.#J),window.removeEventListener("keyup",this.#_),this.#W&&this.xInput&&this.yInput)this.xInput.removeEventListener("input",this.#q),this.xInput.removeEventListener("change",this.#q),this.xInput.removeEventListener("focusout",this.#j),this.yInput.removeEventListener("input",this.#Z),this.yInput.removeEventListener("change",this.#Z),this.yInput.removeEventListener("focusout",this.#K)}#A(Q){const $=Number.parseFloat(Q.target.value);if(!Number.isFinite($))return;this.position.x=Math.max(0,Math.min(1,$/100)),this.#E(),this.#T(),this.#P()}#M(Q){const $=Number.parseFloat(Q.target.value);if(!Number.isFinite($))return;this.position.y=Math.max(0,Math.min(1,$/100)),this.#E(),this.#T(),this.#P()}#R(){this.#T(),this.#k()}#S(Q){if(!this.isShiftHeld)return Q;if(Q<0.1)return 0;if(Q>0.9)return 1;if(Q>0.4&&Q<0.6)return 0.5;return Q}#D(Q,$){if(!this.isShiftHeld)return{x:Q,y:$};if(Math.abs(Q-$)<0.1)return{x:(Q+$)/2,y:(Q+$)/2};if(Math.abs(1-Q-$)<0.1)return{x:Q,y:1-Q};return{x:Q,y:$}}#z(Q){const $=this.plane.getBoundingClientRect();let J=Math.max(0,Math.min(1,(Q.clientX-$.left)/$.width)),Z=Math.max(0,Math.min(1,(Q.clientY-$.top)/$.height)),_=this.coordinates==="math"?1-Z:Z;J=this.#S(J),_=this.#S(_);const j=this.#D(J,_);this.position=j;const q=this.#G(j.y);if(this.cursor.style.left=`${j.x*100}%`,this.cursor.style.top=`${q*100}%`,this.#W&&this.xInput&&this.yInput)this.xInput.setAttribute("value",Math.round(j.x*100)),this.yInput.setAttribute("value",Math.round(j.y*100));this.#T(),this.#P()}#P(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0}))}#k(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0}))}#E(){const Q=this.#G(this.position.y);if(this.cursor)this.cursor.style.left=`${this.position.x*100}%`,this.cursor.style.top=`${Q*100}%`;if(this.#W&&this.xInput&&this.yInput)this.xInput.setAttribute("value",Math.round(this.position.x*100)),this.yInput.setAttribute("value",Math.round(this.position.y*100))}#T(){const Q=this.value;if(this.getAttribute("value")===Q)return;this.#X=!0,this.setAttribute("value",Q),this.#X=!1}#C(Q){this.isDragging=!0,this.#z(Q),this.plane.style.cursor="grabbing";const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#z(Z)},J=()=>{this.isDragging=!1,this.plane.classList.remove("dragging"),this.plane.style.cursor="",window.removeEventListener("mousemove",$),window.removeEventListener("mouseup",J),this.#T(),this.#k()};window.addEventListener("mousemove",$),window.addEventListener("mouseup",J)}#h(Q){Q.preventDefault(),this.isDragging=!0,this.#z(Q.touches[0]);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#z(Z.touches[0])},J=()=>{this.isDragging=!1,this.plane.classList.remove("dragging"),window.removeEventListener("touchmove",$),window.removeEventListener("touchend",J),this.#T(),this.#k()};window.addEventListener("touchmove",$),window.addEventListener("touchend",J)}#w(Q){if(Q.key==="Shift")this.isShiftHeld=!0}#f(Q){if(Q.key==="Shift")this.isShiftHeld=!1}focus(){this.querySelector(".fig-input-joystick-plane-container")?.focus()}static get observedAttributes(){return["value","precision","transform","fields","coordinates","aspect-ratio","axis-labels"]}get value(){return`${Math.round(this.position.x*100)}% ${Math.round(this.position.y*100)}%`}set value(Q){const $=Q==null?"":String(Q).trim();if(!$)this.position={x:0.5,y:0.5};else{const J=$.split(/[\s,]+/).filter(Boolean),Z=(q)=>{if(!q)return 0.5;const K=q.includes("%"),X=Number.parseFloat(q.replace(/%/g,"").trim());if(!Number.isFinite(X))return 0.5;const W=K||Math.abs(X)>1?X/100:X;return Math.max(0,Math.min(1,W))},_=Z(J[0]),j=Z(J[1]??J[0]);this.position={x:_,y:j}}if(this.#Y)this.#E()}attributeChangedCallback(Q,$,J){if(Q==="aspect-ratio"){this.#B(J);return}if(Q==="value"){if(this.#X||this.isDragging)return;this.value=J}if(Q==="precision")this.precision=parseInt(J);if(Q==="transform")this.transform=Number(J);if(Q==="fields"&&J!==$)this.#F(),this.#N(),this.#U(),this.#E();if(Q==="axis-labels"&&J!==$)this.#F(),this.#N(),this.#U(),this.#E();if(Q==="coordinates")this.coordinates=J||"screen",this.#E()}}customElements.define("fig-joystick",D0);class F0 extends HTMLElement{#Q;#$;#J=null;#_;constructor(){super();this.angle=0,this.#Q=1,this.#$=0,this.isDragging=!1,this.isShiftHeld=!1,this.handle=null,this.angleInput=null,this.plane=null,this.units="\xB0",this.min=null,this.max=null,this.showRotations=!1,this.rotationSpan=null,this.#_=this.#O.bind(this)}connectedCallback(){requestAnimationFrame(()=>{this.precision=this.getAttribute("precision")||1,this.precision=parseInt(this.precision),this.text=this.getAttribute("text")==="true";let Q=this.getAttribute("units")||"\xB0";if(Q==="deg")Q="\xB0";if(this.units=Q,this.min=this.hasAttribute("min")?Number(this.getAttribute("min")):null,this.max=this.hasAttribute("max")?Number(this.getAttribute("max")):null,this.showRotations=this.getAttribute("show-rotations")==="true",this.#q(),this.#W(),this.#D(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision))})}disconnectedCallback(){this.#N()}#q(){this.innerHTML=this.#Z()}#Z(){const Q=this.#X(),$=this.min!==null?`min="${this.min}"`:"",J=this.max!==null?`max="${this.max}"`:"";return`
         <div class="fig-input-angle-plane" tabindex="0">
           <div class="fig-input-angle-handle"></div>
         </div>
@@ -281,7 +281,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
                 units="${this.units}">
                 ${this.showRotations?'<span slot="append" class="fig-input-angle-rotations"></span>':""}
               </fig-input-number>`:""}
-    `}#j(){const Q=Math.abs(this.#G(this.angle));return Math.floor(Q/360)}#K(){if(!this.rotationSpan)return;const Q=this.#j();if(Q>1)this.rotationSpan.textContent=`\xD7${Q}`,this.rotationSpan.style.display="";else this.rotationSpan.textContent="",this.rotationSpan.style.display="none"}#W(){switch(this.units){case"rad":return 0.01;case"turn":return 0.001;default:return 0.1}}#G(Q){switch(this.units){case"rad":return Q*180/Math.PI;case"turn":return Q*360;default:return Q}}#Y(Q){switch(this.units){case"rad":return Q*Math.PI/180;case"turn":return Q/360;default:return Q}}#B(Q,$,J){let Z;switch($){case"rad":Z=Q*180/Math.PI;break;case"turn":Z=Q*360;break;default:Z=Q}switch(J){case"rad":return Z*Math.PI/180;case"turn":return Z/360;default:return Z}}#X(){if(this.handle=this.querySelector(".fig-input-angle-handle"),this.plane=this.querySelector(".fig-input-angle-plane"),this.angleInput=this.querySelector("fig-input-number[name='angle']"),this.rotationSpan=this.querySelector(".fig-input-angle-rotations"),this.#K(),this.plane.addEventListener("mousedown",this.#z.bind(this)),this.plane.addEventListener("touchstart",this.#H.bind(this)),window.addEventListener("keydown",this.#k.bind(this)),window.addEventListener("keyup",this.#E.bind(this)),this.text&&this.angleInput)this.angleInput.addEventListener("input",this.#L.bind(this));this.addEventListener("change",this.#_,!0)}#O(){if(this.plane?.removeEventListener("mousedown",this.#z),this.plane?.removeEventListener("touchstart",this.#H),window.removeEventListener("keydown",this.#k),window.removeEventListener("keyup",this.#E),this.text&&this.angleInput)this.angleInput.removeEventListener("input",this.#L);this.removeEventListener("change",this.#_,!0)}#N(Q){if(!Q.target?.matches?.("input"))return;const J=Q.target.value.match(/^(-?\d*\.?\d+)\s*(turn|rad|deg|°)$/i);if(J){const Z=parseFloat(J[1]);let _=J[2].toLowerCase();if(_==="deg")_="\xB0";if(_!==this.units){const j=this.#B(Z,_,this.units);Q.target.value=String(j)}}}#L(Q){Q.stopPropagation(),this.angle=Number(Q.target.value),this.#U(),this.#F(),this.#K(),this.#R(),this.#P()}#U(){const $=this.#G(this.angle)*Math.PI/180;this.#Q=Math.cos($),this.#$=Math.sin($)}#D(Q){if(!this.isShiftHeld)return Q;const $=45;return Math.round(Q/$)*$}#A(Q){const $=this.plane.getBoundingClientRect(),J=$.left+$.width/2,Z=$.top+$.height/2,_=Q.clientX-J,j=Q.clientY-Z;return Math.atan2(j,_)*180/Math.PI}#M(Q){let J=(this.#A(Q)%360+360)%360;if(J=this.#D(J),this.min!==null||this.max!==null)this.angle=this.#Y(J);else if(this.#J===null){this.#J=J;const j=(this.#G(this.angle)%360+360)%360;let q=J-j;if(q>180)q-=360;if(q<-180)q+=360;this.angle+=this.#Y(q)}else{let _=J-this.#J;if(_>180)_-=360;if(_<-180)_+=360;this.angle+=this.#Y(_),this.#J=J}if(this.#U(),this.#F(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#K(),this.#R()}#R(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0}))}#P(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0}))}#F(){if(this.handle){const $=this.#G(this.angle)*Math.PI/180,J=this.plane.offsetWidth/2-this.handle.offsetWidth/2,Z=Math.cos($)*J,_=Math.sin($)*J;this.handle.style.transform=`translate(${Z}px, ${_}px)`}}#z(Q){this.isDragging=!0,this.#J=null,this.#M(Q);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#M(Z)},J=()=>{this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),window.removeEventListener("mousemove",$),window.removeEventListener("mouseup",J),this.#P()};window.addEventListener("mousemove",$),window.addEventListener("mouseup",J)}#H(Q){Q.preventDefault(),this.isDragging=!0,this.#J=null,this.#M(Q.touches[0]);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#M(Z.touches[0])},J=()=>{this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),window.removeEventListener("touchmove",$),window.removeEventListener("touchend",J),this.#P()};window.addEventListener("touchmove",$),window.addEventListener("touchend",J)}#k(Q){if(Q.key==="Shift")this.isShiftHeld=!0}#E(Q){if(Q.key==="Shift")this.isShiftHeld=!1}focus(){this.plane?.focus()}static get observedAttributes(){return["value","precision","text","min","max","units","show-rotations"]}get value(){return this.angle}get adjacent(){return this.#Q}get opposite(){return this.#$}set value(Q){if(isNaN(Q)){console.error("Invalid value: must be a number.");return}if(this.angle=Q,this.#U(),this.#F(),this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#K()}attributeChangedCallback(Q,$,J){switch(Q){case"value":if(this.isDragging)break;this.value=Number(J);break;case"precision":this.precision=parseInt(J);break;case"text":if(J!==$){if(this.text=J?.toLowerCase()==="true",this.plane)this.#q(),this.#X(),this.#F()}break;case"units":{let Z=J||"\xB0";if(Z==="deg")Z="\xB0";if(this.units=Z,this.plane)this.#q(),this.#X(),this.#F();break}case"min":if(this.min=J!==null?Number(J):null,this.plane)this.#q(),this.#X(),this.#F();break;case"max":if(this.max=J!==null?Number(J):null,this.plane)this.#q(),this.#X(),this.#F();break;case"show-rotations":if(this.showRotations=J==="true",this.plane)this.#q(),this.#X(),this.#F();break}}}customElements.define("fig-input-angle",D0);class R0 extends HTMLElement{connectedCallback(){const Q=this.getAttribute("duration");if(Q)this.style.setProperty("--shimmer-duration",Q)}static get observedAttributes(){return["duration","playing"]}get playing(){return this.getAttribute("playing")!=="false"}set playing(Q){if(Q)this.removeAttribute("playing");else this.setAttribute("playing","false")}attributeChangedCallback(Q,$,J){if(Q==="duration")this.style.setProperty("--shimmer-duration",J||"1.5s")}}customElements.define("fig-shimmer",R0);class k0 extends HTMLElement{static get observedAttributes(){return["open","visible"]}#Q=null;#$=null;connectedCallback(){requestAnimationFrame(()=>{this.#J()})}disconnectedCallback(){if(this.#Q&&this.#$)this.#Q.removeEventListener("click",this.#$)}#J(){const Q=this.querySelector(":scope > .fig-layer-row");if(!Q)return;if(Q.querySelector(".fig-layer-chevron"))return;this.#Q=document.createElement("span"),this.#Q.className="fig-layer-chevron",Q.prepend(this.#Q),this.#$=this.#_.bind(this),this.#Q.addEventListener("click",this.#$)}#_(Q){Q.stopPropagation(),this.open=!this.open}get open(){const Q=this.getAttribute("open");return Q!==null&&Q!=="false"}set open(Q){const $=this.open;if(Q)this.setAttribute("open","true");else this.setAttribute("open","false");if($!==Q)this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0}))}get visible(){return this.getAttribute("visible")!=="false"}set visible(Q){const $=this.visible;if(Q)this.setAttribute("visible","true");else this.setAttribute("visible","false");if($!==Q)this.dispatchEvent(new CustomEvent("visibilitychange",{detail:{visible:Q},bubbles:!0}))}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="open"){const Z=J!==null&&J!=="false";this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Z},bubbles:!0}))}if(Q==="visible"){const Z=J!=="false";this.dispatchEvent(new CustomEvent("visibilitychange",{detail:{visible:Z},bubbles:!0}))}}}customElements.define("fig-layer",k0);class z0 extends HTMLElement{#Q=null;#$=null;#J=null;#_="solid";anchorElement=null;#q="solid";#Z={h:0,s:0,v:85,a:1};#j={type:"linear",angle:0,centerX:50,centerY:50,stops:[{position:0,color:"#D9D9D9",opacity:100},{position:100,color:"#737373",opacity:100}]};#K={url:null,scaleMode:"fill",scale:50};#W={url:null,scaleMode:"fill",scale:50};#G={stream:null,snapshot:null};#Y={};#B={};#X=null;#O=null;#N=null;#L=null;#U=!1;constructor(){super()}static get observedAttributes(){return["value","disabled","alpha","mode","experimental"]}connectedCallback(){this.style.display="contents",requestAnimationFrame(()=>{this.#D(),this.#A(),this.#M()})}disconnectedCallback(){if(this.#J)this.#J.close(),this.#J.remove()}#D(){const Q=Array.from(this.children).find(($)=>!$.getAttribute("slot")?.startsWith("mode-"));if(!Q)this.#$=document.createElement("fig-chit"),this.#$.setAttribute("background","#D9D9D9"),this.appendChild(this.#$),this.#Q=this.#$;else if(Q.tagName==="FIG-CHIT")this.#$=Q,this.#Q=Q;else this.#Q=Q,this.#$=null;if(this.#Q.addEventListener("click",($)=>{if(this.hasAttribute("disabled"))return;$.stopPropagation(),$.preventDefault(),this.#P()}),this.#$)requestAnimationFrame(()=>{const $=this.#$.querySelector('input[type="color"]');if($)$.style.pointerEvents="none"})}#A(){const Q=this.getAttribute("value");if(!Q)return;const $=["solid","gradient","image","video","webcam"];try{const J=JSON.parse(Q);if(J.type)this.#q=J.type;if(J.color){if(typeof J.color==="string")this.#Z=this.#x(J.color);else if(typeof J.color==="object"&&J.color.h!==void 0)this.#Z=J.color}if(J.opacity!==void 0)this.#Z.a=J.opacity/100;if(J.gradient)this.#j={...this.#j,...J.gradient};if(J.image)this.#K={...this.#K,...J.image};if(J.video)this.#W={...this.#W,...J.video};if(J.type&&!$.includes(J.type)){const{type:Z,..._}=J;this.#B[J.type]=_}}catch(J){if(Q.startsWith("#"))this.#q="solid",this.#Z=this.#x(Q)}}#M(){if(!this.#$)return;let Q,$="cover",J="center";switch(this.#q){case"solid":Q=this.#I(this.#Z);break;case"gradient":Q=this.#v();break;case"image":if(this.#K.url){Q=`url(${this.#K.url})`;const _=this.#R(this.#K.scaleMode,this.#K.scale);$=_.size,J=_.position}else Q="";break;case"video":if(this.#W.url){Q=`url(${this.#W.url})`;const _=this.#R(this.#W.scaleMode,this.#W.scale);$=_.size,J=_.position}else Q="";break;default:Q=this.#Y[this.#q]?.element?.getAttribute("chit-background")||"#D9D9D9"}if(this.#$.setAttribute("background",Q),this.#$.style.setProperty("--chit-bg-size",$),this.#$.style.setProperty("--chit-bg-position",J),this.#q==="solid")this.#$.setAttribute("alpha",this.#Z.a);else this.#$.removeAttribute("alpha")}#R(Q,$){switch(Q){case"fill":return{size:"cover",position:"center"};case"fit":return{size:"contain",position:"center"};case"crop":return{size:"cover",position:"center"};case"tile":return{size:`${$}%`,position:"top left"};default:return{size:"cover",position:"center"}}}#P(){if(!this.#J)this.#F();this.#z(this.#q),this.#J.open=!0,requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.#k(),this.#E()})})}#F(){this.#Y={},this.querySelectorAll('[slot^="mode-"]').forEach((G)=>{const O=G.getAttribute("slot").slice(5);this.#Y[O]={element:G,label:G.getAttribute("label")||O.charAt(0).toUpperCase()+O.slice(1)}}),this.#J=document.createElement("dialog",{is:"fig-popup"}),this.#J.setAttribute("is","fig-popup"),this.#J.setAttribute("drag","true"),this.#J.setAttribute("handle","fig-header"),this.#J.setAttribute("autoresize","false"),this.#J.classList.add("fig-fill-picker-dialog"),this.#J.anchor=this.anchorElement||this.#Q;const Q=this.getAttribute("dialog-position")||"left";this.#J.setAttribute("position",Q);const $=["solid","gradient","image","video","webcam"],J={solid:"Solid",gradient:"Gradient",image:"Image",video:"Video",webcam:"Webcam"},Z=this.getAttribute("mode");let _;if(Z){if(_=Z.split(",").map((O)=>O.trim().toLowerCase()).filter((O)=>$.includes(O)||this.#Y[O]),_.length===0)_=[...$]}else _=[...$];const j={...J};for(let[G,{label:O}]of Object.entries(this.#Y))j[G]=O;if(!_.includes(this.#q))this.#q=_[0],this.#_=_[0];const q=this.getAttribute("experimental"),K=q?`experimental="${q}"`:"";let X;if(_.length===1)X=`<h3 class="fig-fill-picker-type-label">${j[_[0]]}</h3>`;else{const G=_.map((O)=>`<option value="${O}">${j[O]}</option>`).join("\n          ");X=`<fig-dropdown class="fig-fill-picker-type" ${K} value="${this.#q}">
+    `}#j(){const Q=Math.abs(this.#Y(this.angle));return Math.floor(Q/360)}#K(){if(!this.rotationSpan)return;const Q=this.#j();if(Q>1)this.rotationSpan.textContent=`\xD7${Q}`,this.rotationSpan.style.display="";else this.rotationSpan.textContent="",this.rotationSpan.style.display="none"}#X(){switch(this.units){case"rad":return 0.01;case"turn":return 0.001;default:return 0.1}}#Y(Q){switch(this.units){case"rad":return Q*180/Math.PI;case"turn":return Q*360;default:return Q}}#G(Q){switch(this.units){case"rad":return Q*Math.PI/180;case"turn":return Q/360;default:return Q}}#B(Q,$,J){let Z;switch($){case"rad":Z=Q*180/Math.PI;break;case"turn":Z=Q*360;break;default:Z=Q}switch(J){case"rad":return Z*Math.PI/180;case"turn":return Z/360;default:return Z}}#W(){if(this.handle=this.querySelector(".fig-input-angle-handle"),this.plane=this.querySelector(".fig-input-angle-plane"),this.angleInput=this.querySelector("fig-input-number[name='angle']"),this.rotationSpan=this.querySelector(".fig-input-angle-rotations"),this.#K(),this.plane.addEventListener("mousedown",this.#z.bind(this)),this.plane.addEventListener("touchstart",this.#P.bind(this)),window.addEventListener("keydown",this.#k.bind(this)),window.addEventListener("keyup",this.#E.bind(this)),this.text&&this.angleInput)this.angleInput.addEventListener("input",this.#L.bind(this));this.addEventListener("change",this.#_,!0)}#N(){if(this.plane?.removeEventListener("mousedown",this.#z),this.plane?.removeEventListener("touchstart",this.#P),window.removeEventListener("keydown",this.#k),window.removeEventListener("keyup",this.#E),this.text&&this.angleInput)this.angleInput.removeEventListener("input",this.#L);this.removeEventListener("change",this.#_,!0)}#O(Q){if(!Q.target?.matches?.("input"))return;const J=Q.target.value.match(/^(-?\d*\.?\d+)\s*(turn|rad|deg|°)$/i);if(J){const Z=parseFloat(J[1]);let _=J[2].toLowerCase();if(_==="deg")_="\xB0";if(_!==this.units){const j=this.#B(Z,_,this.units);Q.target.value=String(j)}}}#L(Q){Q.stopPropagation(),this.angle=Number(Q.target.value),this.#U(),this.#D(),this.#K(),this.#R(),this.#S()}#U(){const $=this.#Y(this.angle)*Math.PI/180;this.#Q=Math.cos($),this.#$=Math.sin($)}#F(Q){if(!this.isShiftHeld)return Q;const $=45;return Math.round(Q/$)*$}#A(Q){const $=this.plane.getBoundingClientRect(),J=$.left+$.width/2,Z=$.top+$.height/2,_=Q.clientX-J,j=Q.clientY-Z;return Math.atan2(j,_)*180/Math.PI}#M(Q){let J=(this.#A(Q)%360+360)%360;if(J=this.#F(J),this.min!==null||this.max!==null)this.angle=this.#G(J);else if(this.#J===null){this.#J=J;const j=(this.#Y(this.angle)%360+360)%360;let q=J-j;if(q>180)q-=360;if(q<-180)q+=360;this.angle+=this.#G(q)}else{let _=J-this.#J;if(_>180)_-=360;if(_<-180)_+=360;this.angle+=this.#G(_),this.#J=J}if(this.#U(),this.#D(),this.text&&this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#K(),this.#R()}#R(){this.dispatchEvent(new CustomEvent("input",{bubbles:!0,cancelable:!0}))}#S(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0}))}#D(){if(this.handle){const $=this.#Y(this.angle)*Math.PI/180,J=this.plane.offsetWidth/2-this.handle.offsetWidth/2,Z=Math.cos($)*J,_=Math.sin($)*J;this.handle.style.transform=`translate(${Z}px, ${_}px)`}}#z(Q){this.isDragging=!0,this.#J=null,this.#M(Q);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#M(Z)},J=()=>{this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),window.removeEventListener("mousemove",$),window.removeEventListener("mouseup",J),this.#S()};window.addEventListener("mousemove",$),window.addEventListener("mouseup",J)}#P(Q){Q.preventDefault(),this.isDragging=!0,this.#J=null,this.#M(Q.touches[0]);const $=(Z)=>{if(this.plane.classList.add("dragging"),this.isDragging)this.#M(Z.touches[0])},J=()=>{this.isDragging=!1,this.#J=null,this.plane.classList.remove("dragging"),window.removeEventListener("touchmove",$),window.removeEventListener("touchend",J),this.#S()};window.addEventListener("touchmove",$),window.addEventListener("touchend",J)}#k(Q){if(Q.key==="Shift")this.isShiftHeld=!0}#E(Q){if(Q.key==="Shift")this.isShiftHeld=!1}focus(){this.plane?.focus()}static get observedAttributes(){return["value","precision","text","min","max","units","show-rotations"]}get value(){return this.angle}get adjacent(){return this.#Q}get opposite(){return this.#$}set value(Q){if(isNaN(Q)){console.error("Invalid value: must be a number.");return}if(this.angle=Q,this.#U(),this.#D(),this.angleInput)this.angleInput.setAttribute("value",this.angle.toFixed(this.precision));this.#K()}attributeChangedCallback(Q,$,J){switch(Q){case"value":if(this.isDragging)break;this.value=Number(J);break;case"precision":this.precision=parseInt(J);break;case"text":if(J!==$){if(this.text=J?.toLowerCase()==="true",this.plane)this.#q(),this.#W(),this.#D()}break;case"units":{let Z=J||"\xB0";if(Z==="deg")Z="\xB0";if(this.units=Z,this.plane)this.#q(),this.#W(),this.#D();break}case"min":if(this.min=J!==null?Number(J):null,this.plane)this.#q(),this.#W(),this.#D();break;case"max":if(this.max=J!==null?Number(J):null,this.plane)this.#q(),this.#W(),this.#D();break;case"show-rotations":if(this.showRotations=J==="true",this.plane)this.#q(),this.#W(),this.#D();break}}}customElements.define("fig-input-angle",F0);class R0 extends HTMLElement{connectedCallback(){const Q=this.getAttribute("duration");if(Q)this.style.setProperty("--shimmer-duration",Q)}static get observedAttributes(){return["duration","playing"]}get playing(){return this.getAttribute("playing")!=="false"}set playing(Q){if(Q)this.removeAttribute("playing");else this.setAttribute("playing","false")}attributeChangedCallback(Q,$,J){if(Q==="duration")this.style.setProperty("--shimmer-duration",J||"1.5s")}}customElements.define("fig-shimmer",R0);class k0 extends HTMLElement{static get observedAttributes(){return["open","visible"]}#Q=null;#$=null;connectedCallback(){requestAnimationFrame(()=>{this.#J()})}disconnectedCallback(){if(this.#Q&&this.#$)this.#Q.removeEventListener("click",this.#$)}#J(){const Q=this.querySelector(":scope > .fig-layer-row");if(!Q)return;if(Q.querySelector(".fig-layer-chevron"))return;this.#Q=document.createElement("span"),this.#Q.className="fig-layer-chevron",Q.prepend(this.#Q),this.#$=this.#_.bind(this),this.#Q.addEventListener("click",this.#$)}#_(Q){Q.stopPropagation(),this.open=!this.open}get open(){const Q=this.getAttribute("open");return Q!==null&&Q!=="false"}set open(Q){const $=this.open;if(Q)this.setAttribute("open","true");else this.setAttribute("open","false");if($!==Q)this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Q},bubbles:!0}))}get visible(){return this.getAttribute("visible")!=="false"}set visible(Q){const $=this.visible;if(Q)this.setAttribute("visible","true");else this.setAttribute("visible","false");if($!==Q)this.dispatchEvent(new CustomEvent("visibilitychange",{detail:{visible:Q},bubbles:!0}))}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="open"){const Z=J!==null&&J!=="false";this.dispatchEvent(new CustomEvent("openchange",{detail:{open:Z},bubbles:!0}))}if(Q==="visible"){const Z=J!=="false";this.dispatchEvent(new CustomEvent("visibilitychange",{detail:{visible:Z},bubbles:!0}))}}}customElements.define("fig-layer",k0);class z0 extends HTMLElement{#Q=null;#$=null;#J=null;#_="solid";anchorElement=null;#q="solid";#Z={h:0,s:0,v:85,a:1};#j={type:"linear",angle:0,centerX:50,centerY:50,stops:[{position:0,color:"#D9D9D9",opacity:100},{position:100,color:"#737373",opacity:100}]};#K={url:null,scaleMode:"fill",scale:50};#X={url:null,scaleMode:"fill",scale:50};#Y={stream:null,snapshot:null};#G={};#B={};#W=null;#N=null;#O=null;#L=null;#U=!1;constructor(){super()}static get observedAttributes(){return["value","disabled","alpha","mode","experimental"]}connectedCallback(){this.style.display="contents",requestAnimationFrame(()=>{this.#F(),this.#A(),this.#M()})}disconnectedCallback(){if(this.#J)this.#J.close(),this.#J.remove()}#F(){const Q=Array.from(this.children).find(($)=>!$.getAttribute("slot")?.startsWith("mode-"));if(!Q)this.#$=document.createElement("fig-chit"),this.#$.setAttribute("background","#D9D9D9"),this.appendChild(this.#$),this.#Q=this.#$;else if(Q.tagName==="FIG-CHIT")this.#$=Q,this.#Q=Q;else this.#Q=Q,this.#$=null;if(this.#Q.addEventListener("click",($)=>{if(this.hasAttribute("disabled"))return;$.stopPropagation(),$.preventDefault(),this.#S()}),this.#$)requestAnimationFrame(()=>{const $=this.#$.querySelector('input[type="color"]');if($)$.style.pointerEvents="none"})}#A(){const Q=this.getAttribute("value");if(!Q)return;const $=["solid","gradient","image","video","webcam"];try{const J=JSON.parse(Q);if(J.type)this.#q=J.type;if(J.color){if(typeof J.color==="string")this.#Z=this.#x(J.color);else if(typeof J.color==="object"&&J.color.h!==void 0)this.#Z=J.color}if(J.opacity!==void 0)this.#Z.a=J.opacity/100;if(J.gradient)this.#j={...this.#j,...J.gradient};if(J.image)this.#K={...this.#K,...J.image};if(J.video)this.#X={...this.#X,...J.video};if(J.type&&!$.includes(J.type)){const{type:Z,..._}=J;this.#B[J.type]=_}}catch(J){if(Q.startsWith("#"))this.#q="solid",this.#Z=this.#x(Q)}}#M(){if(!this.#$)return;let Q,$="cover",J="center";switch(this.#q){case"solid":Q=this.#I(this.#Z);break;case"gradient":Q=this.#v();break;case"image":if(this.#K.url){Q=`url(${this.#K.url})`;const _=this.#R(this.#K.scaleMode,this.#K.scale);$=_.size,J=_.position}else Q="";break;case"video":if(this.#X.url){Q=`url(${this.#X.url})`;const _=this.#R(this.#X.scaleMode,this.#X.scale);$=_.size,J=_.position}else Q="";break;default:Q=this.#G[this.#q]?.element?.getAttribute("chit-background")||"#D9D9D9"}if(this.#$.setAttribute("background",Q),this.#$.style.setProperty("--chit-bg-size",$),this.#$.style.setProperty("--chit-bg-position",J),this.#q==="solid")this.#$.setAttribute("alpha",this.#Z.a);else this.#$.removeAttribute("alpha")}#R(Q,$){switch(Q){case"fill":return{size:"cover",position:"center"};case"fit":return{size:"contain",position:"center"};case"crop":return{size:"cover",position:"center"};case"tile":return{size:`${$}%`,position:"top left"};default:return{size:"cover",position:"center"}}}#S(){if(!this.#J)this.#D();this.#z(this.#q),this.#J.open=!0,requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.#k(),this.#E()})})}#D(){this.#G={},this.querySelectorAll('[slot^="mode-"]').forEach((G)=>{const N=G.getAttribute("slot").slice(5);this.#G[N]={element:G,label:G.getAttribute("label")||N.charAt(0).toUpperCase()+N.slice(1)}}),this.#J=document.createElement("dialog",{is:"fig-popup"}),this.#J.setAttribute("is","fig-popup"),this.#J.setAttribute("drag","true"),this.#J.setAttribute("handle","fig-header"),this.#J.setAttribute("autoresize","false"),this.#J.classList.add("fig-fill-picker-dialog"),this.#J.anchor=this.anchorElement||this.#Q;const Q=this.getAttribute("dialog-position")||"left";this.#J.setAttribute("position",Q);const $=["solid","gradient","image","video","webcam"],J={solid:"Solid",gradient:"Gradient",image:"Image",video:"Video",webcam:"Webcam"},Z=this.getAttribute("mode");let _;if(Z){if(_=Z.split(",").map((N)=>N.trim().toLowerCase()).filter((N)=>$.includes(N)||this.#G[N]),_.length===0)_=[...$]}else _=[...$];const j={...J};for(let[G,{label:N}]of Object.entries(this.#G))j[G]=N;if(!_.includes(this.#q))this.#q=_[0],this.#_=_[0];const q=this.getAttribute("experimental"),K=q?`experimental="${q}"`:"";let X;if(_.length===1)X=`<h3 class="fig-fill-picker-type-label">${j[_[0]]}</h3>`;else{const G=_.map((N)=>`<option value="${N}">${j[N]}</option>`).join("\n          ");X=`<fig-dropdown class="fig-fill-picker-type" ${K} value="${this.#q}">
           ${G}
         </fig-dropdown>`}const W=_.map((G)=>`<div class="fig-fill-picker-tab" data-tab="${G}"></div>`).join("\n        ");this.#J.innerHTML=`
       <fig-header>
@@ -293,7 +293,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
       <div class="fig-fill-picker-content">
         ${W}
       </div>
-    `,document.body.appendChild(this.#J);for(let[G,{element:O}]of Object.entries(this.#Y)){const B=this.#J.querySelector(`[data-tab="${G}"]`);if(!B)continue;while(O.firstChild)B.appendChild(O.firstChild);this.dispatchEvent(new CustomEvent("modeready",{bubbles:!0,detail:{mode:G,container:B}}))}const L=this.#J.querySelector(".fig-fill-picker-type");if(L)L.addEventListener("change",(G)=>{this.#z(G.target.value)});this.#J.querySelector(".fig-fill-picker-close").addEventListener("click",()=>{this.#J.open=!1}),this.#J.addEventListener("close",()=>{this.#V()});const U={solid:()=>this.#H(),gradient:()=>this.#h(),image:()=>this.#m(),video:()=>this.#o(),webcam:()=>this.#c()};for(let[G,O]of Object.entries(U))if(!this.#Y[G]&&_.includes(G))O();for(let G of Object.keys(this.#Y)){if($.includes(G))continue;const O=this.#J.querySelector(`[data-tab="${G}"]`);if(!O)continue;O.addEventListener("input",(B)=>{if(B.target===this)return;if(B.stopPropagation(),B.detail)this.#B[G]=B.detail;this.#S()}),O.addEventListener("change",(B)=>{if(B.target===this)return;if(B.stopPropagation(),B.detail)this.#B[G]=B.detail;this.#V()})}}#z(Q){if(!this.#J?.querySelector(`.fig-fill-picker-tab[data-tab="${Q}"]`))return;this.#_=Q,this.#q=Q;const J=this.#J.querySelector(".fig-fill-picker-type");if(J&&J.value!==Q)J.value=Q;this.#J.querySelectorAll(".fig-fill-picker-tab").forEach((j)=>{if(j.dataset.tab===Q)j.style.display="block";else j.style.display="none"});const _=this.#J.querySelector(".fig-fill-picker-content");if(_)_.style.padding=this.#Y[Q]?"0":"";if(Q==="gradient")requestAnimationFrame(()=>{this.#f()});this.#M(),this.#S()}#H(){const Q=this.#J.querySelector('[data-tab="solid"]'),$=this.getAttribute("alpha")!=="false";if(Q.innerHTML=`
+    `,document.body.appendChild(this.#J);for(let[G,{element:N}]of Object.entries(this.#G)){const B=this.#J.querySelector(`[data-tab="${G}"]`);if(!B)continue;while(N.firstChild)B.appendChild(N.firstChild);this.dispatchEvent(new CustomEvent("modeready",{bubbles:!0,detail:{mode:G,container:B}}))}const L=this.#J.querySelector(".fig-fill-picker-type");if(L)L.addEventListener("change",(G)=>{this.#z(G.target.value)});this.#J.querySelector(".fig-fill-picker-close").addEventListener("click",()=>{this.#J.open=!1}),this.#J.addEventListener("close",()=>{this.#V()});const U={solid:()=>this.#P(),gradient:()=>this.#h(),image:()=>this.#m(),video:()=>this.#o(),webcam:()=>this.#c()};for(let[G,N]of Object.entries(U))if(!this.#G[G]&&_.includes(G))N();for(let G of Object.keys(this.#G)){if($.includes(G))continue;const N=this.#J.querySelector(`[data-tab="${G}"]`);if(!N)continue;N.addEventListener("input",(B)=>{if(B.target===this)return;if(B.stopPropagation(),B.detail)this.#B[G]=B.detail;this.#H()}),N.addEventListener("change",(B)=>{if(B.target===this)return;if(B.stopPropagation(),B.detail)this.#B[G]=B.detail;this.#V()})}}#z(Q){if(!this.#J?.querySelector(`.fig-fill-picker-tab[data-tab="${Q}"]`))return;this.#_=Q,this.#q=Q;const J=this.#J.querySelector(".fig-fill-picker-type");if(J&&J.value!==Q)J.value=Q;this.#J.querySelectorAll(".fig-fill-picker-tab").forEach((j)=>{if(j.dataset.tab===Q)j.style.display="block";else j.style.display="none"});const _=this.#J.querySelector(".fig-fill-picker-content");if(_)_.style.padding=this.#G[Q]?"0":"";if(Q==="gradient")requestAnimationFrame(()=>{this.#f()});this.#M(),this.#H()}#P(){const Q=this.#J.querySelector('[data-tab="solid"]'),$=this.getAttribute("alpha")!=="false";if(Q.innerHTML=`
       <div class="fig-fill-picker-color-area">
         <canvas width="200" height="200"></canvas>
         <div class="fig-fill-picker-handle"></div>
@@ -306,7 +306,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
         <fig-button icon variant="ghost" class="fig-fill-picker-eyedropper" title="Pick color from screen"><span class="fig-mask-icon" style="--icon: var(--icon-eyedropper)"></span></fig-button>
         <fig-input-color class="fig-fill-picker-color-input" text="true" picker="false" value="${this.#I(this.#Z)}"></fig-input-color>
       </div>
-    `,this.#X=Q.querySelector("canvas"),this.#O=Q.querySelector(".fig-fill-picker-handle"),this.#k(),this.#E(),this.#C(),this.#N=Q.querySelector('fig-slider[type="hue"]'),this.#N.addEventListener("input",(_)=>{this.#Z.h=parseFloat(_.target.value),this.#k(),this.#E(),this.#T(),this.#S()}),this.#N.addEventListener("change",()=>{this.#V()}),$)this.#L=Q.querySelector('fig-slider[type="opacity"]'),this.#L.addEventListener("input",(_)=>{this.#Z.a=parseFloat(_.target.value)/100,this.#T(),this.#S()}),this.#L.addEventListener("change",()=>{this.#V()});const J=Q.querySelector(".fig-fill-picker-color-input");J.addEventListener("input",(_)=>{if(this.#U)return;const j=_.target.value;if(this.#Z={...this.#x(j),a:this.#Z.a},this.#k(),this.#E(),this.#N)this.#N.setAttribute("value",this.#Z.h);this.#S()}),J.addEventListener("change",()=>{this.#V()});const Z=Q.querySelector(".fig-fill-picker-eyedropper");if("EyeDropper"in window)Z.addEventListener("click",async()=>{try{const j=await new EyeDropper().open();this.#Z={...this.#x(j.sRGBHex),a:this.#Z.a},this.#k(),this.#E(),this.#T(),this.#S()}catch(_){}});else Z.setAttribute("disabled",""),Z.title="EyeDropper not supported in this browser"}#k(){if(!this.#X&&this.#J)this.#X=this.#J.querySelector('[data-tab="solid"] canvas');if(!this.#X)return;const Q=this.#X.getContext("2d");if(!Q)return;const $=this.#X.width,J=this.#X.height;Q.clearRect(0,0,$,J);const Z=this.#Z.h,_=Q.createLinearGradient(0,0,$,0);_.addColorStop(0,"#FFFFFF"),_.addColorStop(1,`hsl(${Z}, 100%, 50%)`),Q.fillStyle=_,Q.fillRect(0,0,$,J);const j=Q.createLinearGradient(0,0,0,J);j.addColorStop(0,"rgba(0,0,0,0)"),j.addColorStop(1,"rgba(0,0,0,1)"),Q.fillStyle=j,Q.fillRect(0,0,$,J)}#E(Q=0){if(!this.#O||!this.#X)return;const $=this.#X.getBoundingClientRect();if(($.width===0||$.height===0)&&Q<5){requestAnimationFrame(()=>this.#E(Q+1));return}const J=this.#Z.s/100*$.width,Z=(100-this.#Z.v)/100*$.height;this.#O.style.left=`${J}px`,this.#O.style.top=`${Z}px`,this.#O.style.setProperty("--picker-color",this.#I({...this.#Z,a:1}))}#C(){if(!this.#X||!this.#O)return;const Q=()=>{if(!this.#U)return;this.#U=!1,this.#V()},$=(J)=>{const Z=this.#X.getBoundingClientRect(),_=Math.max(0,Math.min(J.clientX-Z.left,Z.width)),j=Math.max(0,Math.min(J.clientY-Z.top,Z.height));this.#Z.s=_/Z.width*100,this.#Z.v=100-j/Z.height*100,this.#E(),this.#T(),this.#S()};this.#X.addEventListener("pointerdown",(J)=>{this.#U=!0,this.#X.setPointerCapture(J.pointerId),$(J)}),this.#X.addEventListener("pointermove",(J)=>{if(!this.#U)return;if(J.buttons===0){Q();return}$(J)}),this.#X.addEventListener("pointerup",Q),this.#X.addEventListener("pointercancel",Q),this.#X.addEventListener("lostpointercapture",Q),this.#O.addEventListener("pointerdown",(J)=>{J.stopPropagation(),this.#U=!0,this.#O.setPointerCapture(J.pointerId)}),this.#O.addEventListener("pointermove",(J)=>{if(!this.#U)return;if(J.buttons===0){Q();return}$(J)}),this.#O.addEventListener("pointerup",Q),this.#O.addEventListener("pointercancel",Q),this.#O.addEventListener("lostpointercapture",Q)}#T(){if(!this.#J)return;const Q=this.#I(this.#Z),$=this.#J.querySelector(".fig-fill-picker-color-input");if($)$.setAttribute("value",Q);if(this.#L)this.#L.setAttribute("color",Q);this.#M()}#h(){const Q=this.#J.querySelector('[data-tab="gradient"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
+    `,this.#W=Q.querySelector("canvas"),this.#N=Q.querySelector(".fig-fill-picker-handle"),this.#k(),this.#E(),this.#T(),this.#O=Q.querySelector('fig-slider[type="hue"]'),this.#O.addEventListener("input",(_)=>{this.#Z.h=parseFloat(_.target.value),this.#k(),this.#E(),this.#C(),this.#H()}),this.#O.addEventListener("change",()=>{this.#V()}),$)this.#L=Q.querySelector('fig-slider[type="opacity"]'),this.#L.addEventListener("input",(_)=>{this.#Z.a=parseFloat(_.target.value)/100,this.#C(),this.#H()}),this.#L.addEventListener("change",()=>{this.#V()});const J=Q.querySelector(".fig-fill-picker-color-input");J.addEventListener("input",(_)=>{if(this.#U)return;const j=_.target.value;if(this.#Z={...this.#x(j),a:this.#Z.a},this.#k(),this.#E(),this.#O)this.#O.setAttribute("value",this.#Z.h);this.#H()}),J.addEventListener("change",()=>{this.#V()});const Z=Q.querySelector(".fig-fill-picker-eyedropper");if("EyeDropper"in window)Z.addEventListener("click",async()=>{try{const j=await new EyeDropper().open();this.#Z={...this.#x(j.sRGBHex),a:this.#Z.a},this.#k(),this.#E(),this.#C(),this.#H()}catch(_){}});else Z.setAttribute("disabled",""),Z.title="EyeDropper not supported in this browser"}#k(){if(!this.#W&&this.#J)this.#W=this.#J.querySelector('[data-tab="solid"] canvas');if(!this.#W)return;const Q=this.#W.getContext("2d");if(!Q)return;const $=this.#W.width,J=this.#W.height;Q.clearRect(0,0,$,J);const Z=this.#Z.h,_=Q.createLinearGradient(0,0,$,0);_.addColorStop(0,"#FFFFFF"),_.addColorStop(1,`hsl(${Z}, 100%, 50%)`),Q.fillStyle=_,Q.fillRect(0,0,$,J);const j=Q.createLinearGradient(0,0,0,J);j.addColorStop(0,"rgba(0,0,0,0)"),j.addColorStop(1,"rgba(0,0,0,1)"),Q.fillStyle=j,Q.fillRect(0,0,$,J)}#E(Q=0){if(!this.#N||!this.#W)return;const $=this.#W.getBoundingClientRect();if(($.width===0||$.height===0)&&Q<5){requestAnimationFrame(()=>this.#E(Q+1));return}const J=this.#Z.s/100*$.width,Z=(100-this.#Z.v)/100*$.height;this.#N.style.left=`${J}px`,this.#N.style.top=`${Z}px`,this.#N.style.setProperty("--picker-color",this.#I({...this.#Z,a:1}))}#T(){if(!this.#W||!this.#N)return;const Q=()=>{if(!this.#U)return;this.#U=!1,this.#V()},$=(J)=>{const Z=this.#W.getBoundingClientRect(),_=Math.max(0,Math.min(J.clientX-Z.left,Z.width)),j=Math.max(0,Math.min(J.clientY-Z.top,Z.height));this.#Z.s=_/Z.width*100,this.#Z.v=100-j/Z.height*100,this.#E(),this.#C(),this.#H()};this.#W.addEventListener("pointerdown",(J)=>{this.#U=!0,this.#W.setPointerCapture(J.pointerId),$(J)}),this.#W.addEventListener("pointermove",(J)=>{if(!this.#U)return;if(J.buttons===0){Q();return}$(J)}),this.#W.addEventListener("pointerup",Q),this.#W.addEventListener("pointercancel",Q),this.#W.addEventListener("lostpointercapture",Q),this.#N.addEventListener("pointerdown",(J)=>{J.stopPropagation(),this.#U=!0,this.#N.setPointerCapture(J.pointerId)}),this.#N.addEventListener("pointermove",(J)=>{if(!this.#U)return;if(J.buttons===0){Q();return}$(J)}),this.#N.addEventListener("pointerup",Q),this.#N.addEventListener("pointercancel",Q),this.#N.addEventListener("lostpointercapture",Q)}#C(){if(!this.#J)return;const Q=this.#I(this.#Z),$=this.#J.querySelector(".fig-fill-picker-color-input");if($)$.setAttribute("value",Q);if(this.#L)this.#L.setAttribute("color",Q);this.#M()}#h(){const Q=this.#J.querySelector('[data-tab="gradient"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
       <div class="fig-fill-picker-gradient-header">
         <fig-dropdown class="fig-fill-picker-gradient-type" ${J} value="${this.#j.type}">
           <option value="linear" selected>Linear</option>
@@ -339,7 +339,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
         </div>
         <div class="fig-fill-picker-gradient-stops-list"></div>
       </div>
-    `,this.#f(),this.#w(Q)}#w(Q){Q.querySelector(".fig-fill-picker-gradient-type").addEventListener("change",(j)=>{this.#j.type=j.target.value,this.#f(),this.#S()}),Q.querySelector(".fig-fill-picker-gradient-angle").addEventListener("input",(j)=>{const q=parseFloat(j.target.value)||0;this.#j.angle=(q+90)%360,this.#b(),this.#S()});const Z=Q.querySelector(".fig-fill-picker-gradient-cx"),_=Q.querySelector(".fig-fill-picker-gradient-cy");Z?.addEventListener("input",(j)=>{this.#j.centerX=parseFloat(j.target.value)||50,this.#b(),this.#S()}),_?.addEventListener("input",(j)=>{this.#j.centerY=parseFloat(j.target.value)||50,this.#b(),this.#S()}),Q.querySelector(".fig-fill-picker-gradient-flip").addEventListener("click",()=>{this.#j.stops.forEach((j)=>{j.position=100-j.position}),this.#j.stops.sort((j,q)=>j.position-q.position),this.#f(),this.#S()}),Q.querySelector(".fig-fill-picker-gradient-add").addEventListener("click",()=>{this.#j.stops.push({position:50,color:"#888888",opacity:100}),this.#j.stops.sort((q,K)=>q.position-K.position),this.#f(),this.#S()})}#f(){if(!this.#J)return;const Q=this.#J.querySelector('[data-tab="gradient"]');if(!Q)return;const $=Q.querySelector(".fig-fill-picker-gradient-angle"),J=Q.querySelector(".fig-fill-picker-gradient-center");if(this.#j.type==="radial")$.style.display="none",J.style.display="flex";else{$.style.display="block",J.style.display="none";const Z=(this.#j.angle-90+360)%360;$.setAttribute("value",Z)}this.#b(),this.#g()}#b(){if(!this.#J)return;const Q=this.#J.querySelector(".fig-fill-picker-gradient-bar");if(Q)Q.style.background=this.#v();this.#M()}#g(){if(!this.#J)return;const Q=this.#J.querySelector(".fig-fill-picker-gradient-stops-list");if(!Q)return;Q.innerHTML=this.#j.stops.map(($,J)=>`
+    `,this.#f(),this.#w(Q)}#w(Q){Q.querySelector(".fig-fill-picker-gradient-type").addEventListener("change",(j)=>{this.#j.type=j.target.value,this.#f(),this.#H()}),Q.querySelector(".fig-fill-picker-gradient-angle").addEventListener("input",(j)=>{const q=parseFloat(j.target.value)||0;this.#j.angle=(q+90)%360,this.#b(),this.#H()});const Z=Q.querySelector(".fig-fill-picker-gradient-cx"),_=Q.querySelector(".fig-fill-picker-gradient-cy");Z?.addEventListener("input",(j)=>{this.#j.centerX=parseFloat(j.target.value)||50,this.#b(),this.#H()}),_?.addEventListener("input",(j)=>{this.#j.centerY=parseFloat(j.target.value)||50,this.#b(),this.#H()}),Q.querySelector(".fig-fill-picker-gradient-flip").addEventListener("click",()=>{this.#j.stops.forEach((j)=>{j.position=100-j.position}),this.#j.stops.sort((j,q)=>j.position-q.position),this.#f(),this.#H()}),Q.querySelector(".fig-fill-picker-gradient-add").addEventListener("click",()=>{this.#j.stops.push({position:50,color:"#888888",opacity:100}),this.#j.stops.sort((q,K)=>q.position-K.position),this.#f(),this.#H()})}#f(){if(!this.#J)return;const Q=this.#J.querySelector('[data-tab="gradient"]');if(!Q)return;const $=Q.querySelector(".fig-fill-picker-gradient-angle"),J=Q.querySelector(".fig-fill-picker-gradient-center");if(this.#j.type==="radial")$.style.display="none",J.style.display="flex";else{$.style.display="block",J.style.display="none";const Z=(this.#j.angle-90+360)%360;$.setAttribute("value",Z)}this.#b(),this.#g()}#b(){if(!this.#J)return;const Q=this.#J.querySelector(".fig-fill-picker-gradient-bar");if(Q)Q.style.background=this.#v();this.#M()}#g(){if(!this.#J)return;const Q=this.#J.querySelector(".fig-fill-picker-gradient-stops-list");if(!Q)return;Q.innerHTML=this.#j.stops.map(($,J)=>`
       <div class="fig-fill-picker-gradient-stop-row" data-index="${J}">
         <fig-input-number class="fig-fill-picker-stop-position" min="0" max="100" value="${$.position}" units="%"></fig-input-number>
         <fig-input-color class="fig-fill-picker-stop-color" text="true" alpha="true" picker="figma" picker-dialog-position="right" value="${$.color}"></fig-input-color>
@@ -347,7 +347,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           <span class="fig-mask-icon" style="--icon: var(--icon-minus)"></span>
         </fig-button>
       </div>
-    `).join(""),Q.querySelectorAll(".fig-fill-picker-gradient-stop-row").forEach(($)=>{const J=parseInt($.dataset.index);$.querySelector(".fig-fill-picker-stop-position").addEventListener("input",(j)=>{this.#j.stops[J].position=parseFloat(j.target.value)||0,this.#b(),this.#S()});const Z=$.querySelector(".fig-fill-picker-stop-color"),_=Z.querySelector("fig-fill-picker");if(_)_.anchorElement=this.#J;else requestAnimationFrame(()=>{const j=Z.querySelector("fig-fill-picker");if(j)j.anchorElement=this.#J});Z.addEventListener("input",(j)=>{this.#j.stops[J].color=j.target.hexOpaque||j.target.value;const q=parseFloat(j.target.alpha);this.#j.stops[J].opacity=isNaN(q)?100:q,this.#b(),this.#S()}),$.querySelector(".fig-fill-picker-stop-remove").addEventListener("click",()=>{if(this.#j.stops.length>2)this.#j.stops.splice(J,1),this.#f(),this.#S()})})}#v(){const Q=this.#j.stops.map(($)=>{return`${this.#n($.color,$.opacity/100)} ${$.position}%`}).join(", ");switch(this.#j.type){case"linear":return`linear-gradient(${this.#j.angle}deg, ${Q})`;case"radial":return`radial-gradient(circle at ${this.#j.centerX}% ${this.#j.centerY}%, ${Q})`;case"angular":return`conic-gradient(from ${this.#j.angle}deg, ${Q})`;default:return`linear-gradient(${this.#j.angle}deg, ${Q})`}}#m(){const Q=this.#J.querySelector('[data-tab="image"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
+    `).join(""),Q.querySelectorAll(".fig-fill-picker-gradient-stop-row").forEach(($)=>{const J=parseInt($.dataset.index);$.querySelector(".fig-fill-picker-stop-position").addEventListener("input",(j)=>{this.#j.stops[J].position=parseFloat(j.target.value)||0,this.#b(),this.#H()});const Z=$.querySelector(".fig-fill-picker-stop-color"),_=Z.querySelector("fig-fill-picker");if(_)_.anchorElement=this.#J;else requestAnimationFrame(()=>{const j=Z.querySelector("fig-fill-picker");if(j)j.anchorElement=this.#J});Z.addEventListener("input",(j)=>{this.#j.stops[J].color=j.target.hexOpaque||j.target.value;const q=parseFloat(j.target.alpha);this.#j.stops[J].opacity=isNaN(q)?100:q,this.#b(),this.#H()}),$.querySelector(".fig-fill-picker-stop-remove").addEventListener("click",()=>{if(this.#j.stops.length>2)this.#j.stops.splice(J,1),this.#f(),this.#H()})})}#v(){const Q=this.#j.stops.map(($)=>{return`${this.#n($.color,$.opacity/100)} ${$.position}%`}).join(", ");switch(this.#j.type){case"linear":return`linear-gradient(${this.#j.angle}deg, ${Q})`;case"radial":return`radial-gradient(circle at ${this.#j.centerX}% ${this.#j.centerY}%, ${Q})`;case"angular":return`conic-gradient(from ${this.#j.angle}deg, ${Q})`;default:return`linear-gradient(${this.#j.angle}deg, ${Q})`}}#m(){const Q=this.#J.querySelector('[data-tab="image"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
       <div class="fig-fill-picker-media-header">
         <fig-dropdown class="fig-fill-picker-scale-mode" ${J} value="${this.#K.scaleMode}">
           <option value="fill" selected>Fill</option>
@@ -365,9 +365,9 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           <input type="file" accept="image/*" style="display: none;" />
         </fig-button>
       </div>
-    `,this.#d(Q)}#d(Q){const $=Q.querySelector(".fig-fill-picker-scale-mode"),J=Q.querySelector(".fig-fill-picker-scale"),Z=Q.querySelector(".fig-fill-picker-upload"),_=Q.querySelector('input[type="file"]'),j=Q.querySelector(".fig-fill-picker-image-preview");$.addEventListener("change",(K)=>{this.#K.scaleMode=K.target.value,J.style.display=K.target.value==="tile"?"block":"none",this.#y(j),this.#M(),this.#S()}),J.addEventListener("input",(K)=>{this.#K.scale=parseFloat(K.target.value)||100,this.#y(j),this.#M(),this.#S()}),Z.addEventListener("click",()=>{_.click()}),_.addEventListener("change",(K)=>{const X=K.target.files[0];if(X){const W=new FileReader;W.onload=(L)=>{this.#K.url=L.target.result,this.#y(j),this.#M(),this.#S()},W.readAsDataURL(X)}});const q=Q.querySelector(".fig-fill-picker-media-preview");q.addEventListener("dragover",(K)=>{K.preventDefault(),q.classList.add("dragover")}),q.addEventListener("dragleave",()=>{q.classList.remove("dragover")}),q.addEventListener("drop",(K)=>{K.preventDefault(),q.classList.remove("dragover");const X=K.dataTransfer.files[0];if(X&&X.type.startsWith("image/")){const W=new FileReader;W.onload=(L)=>{this.#K.url=L.target.result,this.#y(j),this.#M(),this.#S()},W.readAsDataURL(X)}})}#y(Q){const $=Q.closest(".fig-fill-picker-media-preview");if(!this.#K.url){Q.style.display="none",$?.classList.remove("has-media");return}switch(Q.style.display="block",$?.classList.add("has-media"),Q.style.backgroundImage=`url(${this.#K.url})`,Q.style.backgroundPosition="center",this.#K.scaleMode){case"fill":Q.style.backgroundSize="cover",Q.style.backgroundRepeat="no-repeat";break;case"fit":Q.style.backgroundSize="contain",Q.style.backgroundRepeat="no-repeat";break;case"crop":Q.style.backgroundSize="cover",Q.style.backgroundRepeat="no-repeat";break;case"tile":Q.style.backgroundSize=`${this.#K.scale}%`,Q.style.backgroundRepeat="repeat",Q.style.backgroundPosition="top left";break}}#u(Q){switch(Q.style.objectPosition="center",Q.style.width="100%",Q.style.height="100%",this.#W.scaleMode){case"fill":case"crop":Q.style.objectFit="cover";break;case"fit":Q.style.objectFit="contain";break}}#o(){const Q=this.#J.querySelector('[data-tab="video"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
+    `,this.#d(Q)}#d(Q){const $=Q.querySelector(".fig-fill-picker-scale-mode"),J=Q.querySelector(".fig-fill-picker-scale"),Z=Q.querySelector(".fig-fill-picker-upload"),_=Q.querySelector('input[type="file"]'),j=Q.querySelector(".fig-fill-picker-image-preview");$.addEventListener("change",(K)=>{this.#K.scaleMode=K.target.value,J.style.display=K.target.value==="tile"?"block":"none",this.#y(j),this.#M(),this.#H()}),J.addEventListener("input",(K)=>{this.#K.scale=parseFloat(K.target.value)||100,this.#y(j),this.#M(),this.#H()}),Z.addEventListener("click",()=>{_.click()}),_.addEventListener("change",(K)=>{const X=K.target.files[0];if(X){const W=new FileReader;W.onload=(L)=>{this.#K.url=L.target.result,this.#y(j),this.#M(),this.#H()},W.readAsDataURL(X)}});const q=Q.querySelector(".fig-fill-picker-media-preview");q.addEventListener("dragover",(K)=>{K.preventDefault(),q.classList.add("dragover")}),q.addEventListener("dragleave",()=>{q.classList.remove("dragover")}),q.addEventListener("drop",(K)=>{K.preventDefault(),q.classList.remove("dragover");const X=K.dataTransfer.files[0];if(X&&X.type.startsWith("image/")){const W=new FileReader;W.onload=(L)=>{this.#K.url=L.target.result,this.#y(j),this.#M(),this.#H()},W.readAsDataURL(X)}})}#y(Q){const $=Q.closest(".fig-fill-picker-media-preview");if(!this.#K.url){Q.style.display="none",$?.classList.remove("has-media");return}switch(Q.style.display="block",$?.classList.add("has-media"),Q.style.backgroundImage=`url(${this.#K.url})`,Q.style.backgroundPosition="center",this.#K.scaleMode){case"fill":Q.style.backgroundSize="cover",Q.style.backgroundRepeat="no-repeat";break;case"fit":Q.style.backgroundSize="contain",Q.style.backgroundRepeat="no-repeat";break;case"crop":Q.style.backgroundSize="cover",Q.style.backgroundRepeat="no-repeat";break;case"tile":Q.style.backgroundSize=`${this.#K.scale}%`,Q.style.backgroundRepeat="repeat",Q.style.backgroundPosition="top left";break}}#s(Q){switch(Q.style.objectPosition="center",Q.style.width="100%",Q.style.height="100%",this.#X.scaleMode){case"fill":case"crop":Q.style.objectFit="cover";break;case"fit":Q.style.objectFit="contain";break}}#o(){const Q=this.#J.querySelector('[data-tab="video"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
       <div class="fig-fill-picker-media-header">
-        <fig-dropdown class="fig-fill-picker-scale-mode" ${J} value="${this.#W.scaleMode}">
+        <fig-dropdown class="fig-fill-picker-scale-mode" ${J} value="${this.#X.scaleMode}">
           <option value="fill" selected>Fill</option>
           <option value="fit">Fit</option>
           <option value="crop">Crop</option>
@@ -381,7 +381,7 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           <input type="file" accept="video/*" style="display: none;" />
         </fig-button>
       </div>
-    `,this.#l(Q)}#l(Q){const $=Q.querySelector(".fig-fill-picker-scale-mode"),J=Q.querySelector(".fig-fill-picker-upload"),Z=Q.querySelector('input[type="file"]'),_=Q.querySelector(".fig-fill-picker-video-preview");$.addEventListener("change",(q)=>{this.#W.scaleMode=q.target.value,this.#u(_),this.#M(),this.#S()}),J.addEventListener("click",()=>{Z.click()});const j=Q.querySelector(".fig-fill-picker-media-preview");Z.addEventListener("change",(q)=>{const K=q.target.files[0];if(K)this.#W.url=URL.createObjectURL(K),_.src=this.#W.url,_.style.display="block",_.play(),j.classList.add("has-media"),this.#u(_),this.#M(),this.#S()}),j.addEventListener("dragover",(q)=>{q.preventDefault(),j.classList.add("dragover")}),j.addEventListener("dragleave",()=>{j.classList.remove("dragover")}),j.addEventListener("drop",(q)=>{q.preventDefault(),j.classList.remove("dragover");const K=q.dataTransfer.files[0];if(K&&K.type.startsWith("video/"))this.#W.url=URL.createObjectURL(K),_.src=this.#W.url,_.style.display="block",_.play(),j.classList.add("has-media"),this.#u(_),this.#M(),this.#S()})}#c(){const Q=this.#J.querySelector('[data-tab="webcam"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
+    `,this.#l(Q)}#l(Q){const $=Q.querySelector(".fig-fill-picker-scale-mode"),J=Q.querySelector(".fig-fill-picker-upload"),Z=Q.querySelector('input[type="file"]'),_=Q.querySelector(".fig-fill-picker-video-preview");$.addEventListener("change",(q)=>{this.#X.scaleMode=q.target.value,this.#s(_),this.#M(),this.#H()}),J.addEventListener("click",()=>{Z.click()});const j=Q.querySelector(".fig-fill-picker-media-preview");Z.addEventListener("change",(q)=>{const K=q.target.files[0];if(K)this.#X.url=URL.createObjectURL(K),_.src=this.#X.url,_.style.display="block",_.play(),j.classList.add("has-media"),this.#s(_),this.#M(),this.#H()}),j.addEventListener("dragover",(q)=>{q.preventDefault(),j.classList.add("dragover")}),j.addEventListener("dragleave",()=>{j.classList.remove("dragover")}),j.addEventListener("drop",(q)=>{q.preventDefault(),j.classList.remove("dragover");const K=q.dataTransfer.files[0];if(K&&K.type.startsWith("video/"))this.#X.url=URL.createObjectURL(K),_.src=this.#X.url,_.style.display="block",_.play(),j.classList.add("has-media"),this.#s(_),this.#M(),this.#H()})}#c(){const Q=this.#J.querySelector('[data-tab="webcam"]'),$=this.getAttribute("experimental"),J=$?`experimental="${$}"`:"";Q.innerHTML=`
       <div class="fig-fill-picker-webcam-preview">
         <div class="fig-fill-picker-checkerboard"></div>
         <video class="fig-fill-picker-webcam-video" autoplay muted playsinline></video>
@@ -396,4 +396,4 @@ var T0=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var f0={};var l=T0(()=>{/*! Vendored from @u
           Capture
         </fig-button>
       </div>
-    `,this.#p(Q)}#p(Q){const $=Q.querySelector(".fig-fill-picker-webcam-video"),J=Q.querySelector(".fig-fill-picker-webcam-status"),Z=Q.querySelector(".fig-fill-picker-webcam-capture"),_=Q.querySelector(".fig-fill-picker-camera-select"),j=async(K=null)=>{try{const X={video:K?{deviceId:{exact:K}}:!0};if(this.#G.stream)this.#G.stream.getTracks().forEach((U)=>U.stop());this.#G.stream=await navigator.mediaDevices.getUserMedia(X),$.srcObject=this.#G.stream,$.style.display="block",J.style.display="none";const L=(await navigator.mediaDevices.enumerateDevices()).filter((U)=>U.kind==="videoinput");if(L.length>1)_.style.display="block",_.innerHTML=L.map((U,G)=>`<option value="${U.deviceId}">${U.label||`Camera ${G+1}`}</option>`).join("")}catch(X){console.error("Webcam error:",X.name,X.message);let W="Camera access denied";if(X.name==="NotAllowedError")W="Camera permission denied";else if(X.name==="NotFoundError")W="No camera found";else if(X.name==="NotReadableError")W="Camera in use by another app";else if(X.name==="OverconstrainedError")W="Camera constraints not supported";else if(!window.isSecureContext)W="Camera requires secure context";J.innerHTML=`<span>${W}</span>`,J.style.display="flex",$.style.display="none"}};new MutationObserver(()=>{if(Q.style.display!=="none"&&!this.#G.stream)j()}).observe(Q,{attributes:!0,attributeFilter:["style"]}),_.addEventListener("change",(K)=>{j(K.target.value)}),Z.addEventListener("click",()=>{if(!this.#G.stream)return;const K=document.createElement("canvas");K.width=$.videoWidth,K.height=$.videoHeight,K.getContext("2d").drawImage($,0,0),this.#G.snapshot=K.toDataURL("image/png"),this.#K.url=this.#G.snapshot,this.#q="image",this.#M(),this.#S(),this.#z("image");const X=this.#J.querySelector("fig-tabs");X.value="image"})}#t(Q){const $=Q.h/360,J=Q.s/100,Z=Q.v/100;let _,j,q;const K=Math.floor($*6),X=$*6-K,W=Z*(1-J),L=Z*(1-X*J),U=Z*(1-(1-X)*J);switch(K%6){case 0:_=Z,j=U,q=W;break;case 1:_=L,j=Z,q=W;break;case 2:_=W,j=Z,q=U;break;case 3:_=W,j=L,q=Z;break;case 4:_=U,j=W,q=Z;break;case 5:_=Z,j=W,q=L;break}return{r:Math.round(_*255),g:Math.round(j*255),b:Math.round(q*255)}}#i(Q){const $=Q.r/255,J=Q.g/255,Z=Q.b/255,_=Math.max($,J,Z),j=Math.min($,J,Z),q=_-j;let K=0;const X=_===0?0:q/_,W=_;if(_!==j){switch(_){case $:K=(J-Z)/q+(J<Z?6:0);break;case J:K=(Z-$)/q+2;break;case Z:K=($-J)/q+4;break}K/=6}return{h:K*360,s:X*100,v:W*100,a:1}}#I(Q){if(!Q||typeof Q.h!=="number"||typeof Q.s!=="number"||typeof Q.v!=="number")return"#D9D9D9";const $=this.#t(Q),J=(Z)=>{return(isNaN(Z)?217:Math.max(0,Math.min(255,Math.round(Z)))).toString(16).padStart(2,"0")};return`#${J($.r)}${J($.g)}${J($.b)}`}#x(Q){const $=parseInt(Q.slice(1,3),16),J=parseInt(Q.slice(3,5),16),Z=parseInt(Q.slice(5,7),16);return this.#i({r:$,g:J,b:Z})}#n(Q,$=1){const J=parseInt(Q.slice(1,3),16),Z=parseInt(Q.slice(3,5),16),_=parseInt(Q.slice(5,7),16);return`rgba(${J}, ${Z}, ${_}, ${$})`}#Q0(Q){const $=Q.r/255,J=Q.g/255,Z=Q.b/255,_=Math.max($,J,Z),j=Math.min($,J,Z);let q,K;const X=(_+j)/2;if(_===j)q=K=0;else{const W=_-j;switch(K=X>0.5?W/(2-_-j):W/(_+j),_){case $:q=((J-Z)/W+(J<Z?6:0))/6;break;case J:q=((Z-$)/W+2)/6;break;case Z:q=(($-J)/W+4)/6;break}}return{h:q*360,s:K*100,l:X*100}}#$0(Q){const $=Q.h/360,J=Q.s/100,Z=Q.l/100;let _,j,q;if(J===0)_=j=q=Z;else{const K=(L,U,G)=>{if(G<0)G+=1;if(G>1)G-=1;if(G<0.16666666666666666)return L+(U-L)*6*G;if(G<0.5)return U;if(G<0.6666666666666666)return L+(U-L)*(0.6666666666666666-G)*6;return L},X=Z<0.5?Z*(1+J):Z+J-Z*J,W=2*Z-X;_=K(W,X,$+0.3333333333333333),j=K(W,X,$),q=K(W,X,$-0.3333333333333333)}return{r:Math.round(_*255),g:Math.round(j*255),b:Math.round(q*255)}}#s(Q){const $=(U)=>{return U=U/255,U<=0.04045?U/12.92:Math.pow((U+0.055)/1.055,2.4)},J=$(Q.r),Z=$(Q.g),_=$(Q.b),j=0.4122214708*J+0.5363325363*Z+0.0514459929*_,q=0.2119034982*J+0.6806995451*Z+0.1073969566*_,K=0.0883024619*J+0.2817188376*Z+0.6299787005*_,X=Math.cbrt(j),W=Math.cbrt(q),L=Math.cbrt(K);return{l:0.2104542553*X+0.793617785*W-0.0040720468*L,a:1.9779984951*X-2.428592205*W+0.4505937099*L,b:0.0259040371*X+0.7827717662*W-0.808675766*L}}#r(Q){const $=this.#s(Q);return{l:$.l,c:Math.sqrt($.a*$.a+$.b*$.b),h:(Math.atan2($.b,$.a)*180/Math.PI+360)%360}}#S(){this.#M(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:this.value}))}#V(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.value}))}get value(){const Q={type:this.#q};switch(this.#q){case"solid":return{...Q,color:this.#I(this.#Z),alpha:this.#Z.a,hsv:{...this.#Z}};case"gradient":return{...Q,gradient:{...this.#j},css:this.#v()};case"image":return{...Q,image:{...this.#K}};case"video":return{...Q,video:{...this.#W}};case"webcam":return{...Q,image:{url:this.#G.snapshot,scaleMode:"fill",scale:50}};default:return{...Q,...this.#B[this.#q]}}}set value(Q){if(typeof Q==="string")this.setAttribute("value",Q);else this.setAttribute("value",JSON.stringify(Q))}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":if(this.#A(),this.#M(),this.#J){if(!this.#U){if(this.#E(),this.#T(),this.#N)this.#N.setAttribute("value",this.#Z.h);if(this.#L)this.#L.setAttribute("value",this.#Z.a*100),this.#L.setAttribute("color",this.#I(this.#Z))}}break;case"disabled":break}}}customElements.define("fig-fill-picker",z0);
+    `,this.#p(Q)}#p(Q){const $=Q.querySelector(".fig-fill-picker-webcam-video"),J=Q.querySelector(".fig-fill-picker-webcam-status"),Z=Q.querySelector(".fig-fill-picker-webcam-capture"),_=Q.querySelector(".fig-fill-picker-camera-select"),j=async(K=null)=>{try{const X={video:K?{deviceId:{exact:K}}:!0};if(this.#Y.stream)this.#Y.stream.getTracks().forEach((U)=>U.stop());this.#Y.stream=await navigator.mediaDevices.getUserMedia(X),$.srcObject=this.#Y.stream,$.style.display="block",J.style.display="none";const L=(await navigator.mediaDevices.enumerateDevices()).filter((U)=>U.kind==="videoinput");if(L.length>1)_.style.display="block",_.innerHTML=L.map((U,G)=>`<option value="${U.deviceId}">${U.label||`Camera ${G+1}`}</option>`).join("")}catch(X){console.error("Webcam error:",X.name,X.message);let W="Camera access denied";if(X.name==="NotAllowedError")W="Camera permission denied";else if(X.name==="NotFoundError")W="No camera found";else if(X.name==="NotReadableError")W="Camera in use by another app";else if(X.name==="OverconstrainedError")W="Camera constraints not supported";else if(!window.isSecureContext)W="Camera requires secure context";J.innerHTML=`<span>${W}</span>`,J.style.display="flex",$.style.display="none"}};new MutationObserver(()=>{if(Q.style.display!=="none"&&!this.#Y.stream)j()}).observe(Q,{attributes:!0,attributeFilter:["style"]}),_.addEventListener("change",(K)=>{j(K.target.value)}),Z.addEventListener("click",()=>{if(!this.#Y.stream)return;const K=document.createElement("canvas");K.width=$.videoWidth,K.height=$.videoHeight,K.getContext("2d").drawImage($,0,0),this.#Y.snapshot=K.toDataURL("image/png"),this.#K.url=this.#Y.snapshot,this.#q="image",this.#M(),this.#H(),this.#z("image");const X=this.#J.querySelector("fig-tabs");X.value="image"})}#t(Q){const $=Q.h/360,J=Q.s/100,Z=Q.v/100;let _,j,q;const K=Math.floor($*6),X=$*6-K,W=Z*(1-J),L=Z*(1-X*J),U=Z*(1-(1-X)*J);switch(K%6){case 0:_=Z,j=U,q=W;break;case 1:_=L,j=Z,q=W;break;case 2:_=W,j=Z,q=U;break;case 3:_=W,j=L,q=Z;break;case 4:_=U,j=W,q=Z;break;case 5:_=Z,j=W,q=L;break}return{r:Math.round(_*255),g:Math.round(j*255),b:Math.round(q*255)}}#i(Q){const $=Q.r/255,J=Q.g/255,Z=Q.b/255,_=Math.max($,J,Z),j=Math.min($,J,Z),q=_-j;let K=0;const X=_===0?0:q/_,W=_;if(_!==j){switch(_){case $:K=(J-Z)/q+(J<Z?6:0);break;case J:K=(Z-$)/q+2;break;case Z:K=($-J)/q+4;break}K/=6}return{h:K*360,s:X*100,v:W*100,a:1}}#I(Q){if(!Q||typeof Q.h!=="number"||typeof Q.s!=="number"||typeof Q.v!=="number")return"#D9D9D9";const $=this.#t(Q),J=(Z)=>{return(isNaN(Z)?217:Math.max(0,Math.min(255,Math.round(Z)))).toString(16).padStart(2,"0")};return`#${J($.r)}${J($.g)}${J($.b)}`}#x(Q){const $=parseInt(Q.slice(1,3),16),J=parseInt(Q.slice(3,5),16),Z=parseInt(Q.slice(5,7),16);return this.#i({r:$,g:J,b:Z})}#n(Q,$=1){const J=parseInt(Q.slice(1,3),16),Z=parseInt(Q.slice(3,5),16),_=parseInt(Q.slice(5,7),16);return`rgba(${J}, ${Z}, ${_}, ${$})`}#Q0(Q){const $=Q.r/255,J=Q.g/255,Z=Q.b/255,_=Math.max($,J,Z),j=Math.min($,J,Z);let q,K;const X=(_+j)/2;if(_===j)q=K=0;else{const W=_-j;switch(K=X>0.5?W/(2-_-j):W/(_+j),_){case $:q=((J-Z)/W+(J<Z?6:0))/6;break;case J:q=((Z-$)/W+2)/6;break;case Z:q=(($-J)/W+4)/6;break}}return{h:q*360,s:K*100,l:X*100}}#$0(Q){const $=Q.h/360,J=Q.s/100,Z=Q.l/100;let _,j,q;if(J===0)_=j=q=Z;else{const K=(L,U,G)=>{if(G<0)G+=1;if(G>1)G-=1;if(G<0.16666666666666666)return L+(U-L)*6*G;if(G<0.5)return U;if(G<0.6666666666666666)return L+(U-L)*(0.6666666666666666-G)*6;return L},X=Z<0.5?Z*(1+J):Z+J-Z*J,W=2*Z-X;_=K(W,X,$+0.3333333333333333),j=K(W,X,$),q=K(W,X,$-0.3333333333333333)}return{r:Math.round(_*255),g:Math.round(j*255),b:Math.round(q*255)}}#u(Q){const $=(U)=>{return U=U/255,U<=0.04045?U/12.92:Math.pow((U+0.055)/1.055,2.4)},J=$(Q.r),Z=$(Q.g),_=$(Q.b),j=0.4122214708*J+0.5363325363*Z+0.0514459929*_,q=0.2119034982*J+0.6806995451*Z+0.1073969566*_,K=0.0883024619*J+0.2817188376*Z+0.6299787005*_,X=Math.cbrt(j),W=Math.cbrt(q),L=Math.cbrt(K);return{l:0.2104542553*X+0.793617785*W-0.0040720468*L,a:1.9779984951*X-2.428592205*W+0.4505937099*L,b:0.0259040371*X+0.7827717662*W-0.808675766*L}}#r(Q){const $=this.#u(Q);return{l:$.l,c:Math.sqrt($.a*$.a+$.b*$.b),h:(Math.atan2($.b,$.a)*180/Math.PI+360)%360}}#H(){this.#M(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:this.value}))}#V(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.value}))}get value(){const Q={type:this.#q};switch(this.#q){case"solid":return{...Q,color:this.#I(this.#Z),alpha:this.#Z.a,hsv:{...this.#Z}};case"gradient":return{...Q,gradient:{...this.#j},css:this.#v()};case"image":return{...Q,image:{...this.#K}};case"video":return{...Q,video:{...this.#X}};case"webcam":return{...Q,image:{url:this.#Y.snapshot,scaleMode:"fill",scale:50}};default:return{...Q,...this.#B[this.#q]}}}set value(Q){if(typeof Q==="string")this.setAttribute("value",Q);else this.setAttribute("value",JSON.stringify(Q))}attributeChangedCallback(Q,$,J){if($===J)return;switch(Q){case"value":if(this.#A(),this.#M(),this.#J){if(!this.#U){if(this.#E(),this.#C(),this.#O)this.#O.setAttribute("value",this.#Z.h);if(this.#L)this.#L.setAttribute("value",this.#Z.a*100),this.#L.setAttribute("color",this.#I(this.#Z))}}break;case"disabled":break}}}customElements.define("fig-fill-picker",z0);