UNPKG

@rogieking/figui3

Version:

A lightweight web components library for building Figma plugin and widget UIs with native look and feel

35 lines 263 kB
var G1=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var M1={};var U0=G1(()=>{/*! 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 j={};j[Z]="li";var q=HTMLLIElement,K=function(){return Reflect.construct(q,[],K)};if(K.prototype=J.create(q.prototype),$.define("ungap-li",K,j),!/is="ungap-li"/.test(new K().outerHTML))throw j}catch(X){(function(){var _="attributeChangedCallback",Y="connectedCallback",N="disconnectedCallback",W=Element.prototype,G=J.assign,D=J.create,R=J.defineProperties,L=J.getOwnPropertyDescriptor,B=J.setPrototypeOf,M=$.define,O=$.get,A=$.upgrade,H=$.whenDefined,E=D(null),k=new WeakMap,C={childList:!0,subtree:!0};Reflect.ownKeys(self).filter(function(U){return typeof U=="string"&&/^HTML(?!Element)/.test(U)}).forEach(function(U){function z(){}var F=self[U];B(z,F),(z.prototype=F.prototype).constructor=z,F={},F[U]={value:z},R(self,F)}),new MutationObserver(t).observe(Q,C),W0(Document.prototype,"importNode"),W0(Node.prototype,"cloneNode"),R($,{define:{value:function(U,z,F){if(U=U.toLowerCase(),F&&Z in F){E[U]=G({},F,{Class:z});var T=F[Z]+'[is="'+U+'"]',P=Q.querySelectorAll(T);for(var f=0,y=P.length;f<y;f++)d(P[f])}else M.apply($,arguments)}},get:{value:function(U){return U in E?E[U].Class:O.call($,U)}},upgrade:{value:function(U){var z=w(U);if(z&&!(U instanceof z.Class))N0(U,z);else A.call($,U)}},whenDefined:{value:function(U){return U in E?Promise.resolve():H.call($,U)}}});var I=Q.createElement;R(Q,{createElement:{value:function(U,z){var F=I.call(Q,U);if(z&&"is"in z)F.setAttribute("is",z.is),$.upgrade(F);return F}}});var p=L(W,"attachShadow").value,l=L(W,"innerHTML");R(W,{attachShadow:{value:function(){var U=p.apply(this,arguments);return new MutationObserver(t).observe(U,C),U}},innerHTML:{get:l.get,set:function(U){if(l.set.call(this,U),/\bis=("|')?[a-z0-9_-]+\1/i.test(U))a(this,d)}}});function t(U){for(var z=0,F=U.length;z<F;z++){var T=U[z],P=T.addedNodes,f=T.removedNodes;for(var y=0,n=P.length;y<n;y++)d(P[y]);for(var j0=0,L1=f.length;j0<L1;j0++)g(f[j0])}}function h(U){for(var z=0,F=U.length;z<F;z++){var T=U[z],P=T.attributeName,f=T.oldValue,y=T.target,n=y.getAttribute(P);if(_ in y&&!(f==n&&n==null))y[_](P,f,y.getAttribute(P),null)}}function g(U){if(U.nodeType!==1)return;var z=w(U);if(z&&U instanceof z.Class&&N in U&&k.get(U)!==N)k.set(U,N),Promise.resolve(U).then(U1);a(U,g)}function w(U){var z=U.getAttribute("is");if(z){if(z=z.toLowerCase(),z in E)return E[z]}return null}function W1(U){U[Y]()}function U1(U){U[N]()}function N0(U,z){var F=z.Class,T=F.observedAttributes||[];if(B(U,F.prototype),T.length){new MutationObserver(h).observe(U,{attributes:!0,attributeFilter:T,attributeOldValue:!0});var P=[];for(var f=0,y=T.length;f<y;f++)P.push({attributeName:T[f],oldValue:null,target:U});h(P)}}function d(U){if(U.nodeType!==1)return;var z=w(U);if(z){if(!(U instanceof z.Class))N0(U,z);if(Y in U&&U.isConnected&&k.get(U)!==Y)k.set(U,Y),Promise.resolve(U).then(W1)}a(U,d)}function a(U,z){for(var F=U.content,T=(F&&F.nodeType==11?F:U).querySelectorAll("[is]"),P=0,f=T.length;P<f;P++)z(T[P])}function W0(U,z){var F=U[z],T={};T[z]={value:function(){var P=F.apply(this,arguments);switch(P.nodeType){case 1:case 11:a(P,d)}return P}},R(U,T)}})()}})(document,customElements,Object)});function B1(){if(typeof navigator>"u")return!1;let 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 u(Q,$={}){let J=document.createElement("fig-icon");if(Q)J.setAttribute("name",Q);if($.size)J.setAttribute("size",$.size);if($.className)J.className=$.className;return J}function O1(){if(typeof window>"u"||!window.customElements||typeof HTMLButtonElement>"u")return!1;let 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}}var B0=B1()&&!O1(),A1=(B0?Promise.resolve().then(() => (U0(),M1)):Promise.resolve()).then(()=>{}).catch((Q)=>{throw Q});function q0(Q,$,J){let Z=()=>{if(!customElements.get(Q))customElements.define(Q,$,J)};if(!B0){Z();return}A1.then(Z).catch((j)=>{console.error(`[figui3] Failed to load customized built-in polyfill for "${Q}".`,j)})}function c(){return Date.now().toString(36)+Math.random().toString(36).substring(2)}var R1=1e4;function z1(){return R1++}function x(Q,$,J){if(J&&J.trim())Q.style.setProperty($,J.trim());else Q.style.removeProperty($)}var m=null,L0=null;function K0(Q=1,$=1){if(!m)m=document.createElement("canvas"),L0=m.getContext("2d");if(m.width!==Q)m.width=Q;if(m.height!==$)m.height=$;return{canvas:m,ctx:L0}}class O0 extends HTMLElement{type;#$;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); appearance: none; display: flex; border: 0; flex: 1; text-align: center; align-items: stretch; justify-content: center; font: inherit; color: inherit; outline: 0; place-items: center; background: transparent; margin: calc(var(--spacer-2)*-1); height: var(--spacer-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; min-width: 0; } :host([size="large"]) button { height: var(--spacer-5); } :host([size="large"][icon]) button { padding: 0; } </style> <button type="${this.type}"> <slot></slot> </button> `,this.#$=this.hasAttribute("selected")&&this.getAttribute("selected")!=="false",requestAnimationFrame(()=>{this.button=this.shadowRoot.querySelector("button"),this.button.addEventListener("click",this.#Q.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.#$}set selected(Q){this.setAttribute("selected",Q)}#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"){let 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.#$=J==="true";break}}}customElements.define("fig-button",O0);class A0 extends HTMLElement{#$="Menu";#Q=null;#J;#q;#j=!1;#Z=null;get label(){return this.#$}set label(Q){this.#$=Q}#X;constructor(){super();this.select=document.createElement("select"),this.optionsSlot=document.createElement("slot"),this.attachShadow({mode:"open"}),this.#J=this.#L.bind(this),this.#q=this.#G.bind(this),this.#X=this.slotChange.bind(this)}#_(){if(typeof CSS>"u"||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.#_()){this.#j=!1;return}let J=document.createElement("button");J.setAttribute("type","button"),J.setAttribute("aria-hidden","true");let Z=document.createElement("selectedcontent");J.appendChild(Z),this.select.appendChild(J),this.#j=!0,this.#Z=Z}#Y(){if(!this.#Z)return;let Q=this.select.selectedOptions?.[0];if(!Q){this.#Z.textContent="";return}this.#Z.innerHTML=Q.innerHTML}#U(){this.select.addEventListener("input",this.#J),this.select.addEventListener("change",this.#q)}#W(Q){if(!Q||!(Q instanceof Element))return!1;return!!Q.querySelector('fig-checkbox, fig-switch, input[type="checkbox"]')}#N(){if(typeof this.select.showPicker==="function")requestAnimationFrame(()=>{try{this.select.showPicker()}catch{}})}connectedCallback(){this.type=this.getAttribute("type")||"select",this.#$=this.getAttribute("label")||this.#$,this.select.setAttribute("aria-label",this.#$),this.appendChild(this.select),this.shadowRoot.appendChild(this.optionsSlot),this.optionsSlot.addEventListener("slotchange",this.#X),this.#U()}slotChange(){while(this.select.firstChild)this.select.firstChild.remove();if(this.#K(),this.type==="dropdown"){let 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.#M(this.value),this.#Y(),this.type==="dropdown")this.select.selectedIndex=-1}#L(Q){let $=Q.target.selectedOptions?.[0];if(this.#W($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#N();return}let J=Q.target.value;if(this.type==="dropdown")this.#Q=J;this.setAttribute("value",J),this.#Y(),this.dispatchEvent(new CustomEvent("input",{detail:J,bubbles:!0,composed:!0}))}#G(Q){let $=Q.target.selectedOptions?.[0];if(this.#W($)){if(this.type==="dropdown")this.select.selectedIndex=-1;this.#N();return}let J=this.type==="dropdown"?this.#Q:this.select.value;if(this.type==="dropdown")this.select.selectedIndex=-1;this.#Y(),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.#Q;return this.select?.value}set value(Q){if(this.type==="dropdown")this.#Q=Q;this.setAttribute("value",Q)}static get observedAttributes(){return["value","type","experimental"]}#M(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.#Y()}attributeChangedCallback(Q,$,J){if(Q==="value")this.#M(J);if(Q==="type")this.type=J;if(Q==="experimental")this.slotChange();if(Q==="label")this.#$=J,this.select.setAttribute("aria-label",this.#$)}disconnectedCallback(){this.optionsSlot.removeEventListener("slotchange",this.#X),this.select.removeEventListener("input",this.#J),this.select.removeEventListener("change",this.#q)}}customElements.define("fig-dropdown",A0);class S extends HTMLElement{static#$=0;static#Q=500;#J;#q;#j;#Z;#X;#_;#K;#Y;#U;#W=null;#N;#L=!1;constructor(){super();this.action=this.getAttribute("action")||"hover";let Q=parseInt(this.getAttribute("delay"));this.delay=!isNaN(Q)?Q:500,this.#J=this.#P.bind(this),this.#q=this.hidePopupOutsideClick.bind(this),this.#j=this.showDelayedPopup.bind(this),this.#Z=this.#M.bind(this),this.#X=this.#B.bind(this),this.#_=this.#R.bind(this),this.#K=this.#O.bind(this),this.#Y=this.#A.bind(this),this.#U=()=>{clearTimeout(this.timeout),this.destroy(),this.isOpen=!1}}connectedCallback(){if(this.setup(),this.setupEventListeners(),this.#W=this.closest("dialog"),this.#W)this.#W.addEventListener("close",this.#U)}disconnectedCallback(){if(clearTimeout(this.timeout),this.destroy(),document.removeEventListener("mousedown",this.#J,!0),this.#W)this.#W.removeEventListener("close",this.#U),this.#W=null;if(this.action==="click")document.body.removeEventListener("click",this.#q);if(clearTimeout(this.#N),this.action==="hover")this.removeEventListener("pointerenter",this.#j),this.removeEventListener("pointerleave",this.#Z),this.removeEventListener("touchstart",this.#X),this.removeEventListener("touchmove",this.#_),this.removeEventListener("touchend",this.#K),this.removeEventListener("touchcancel",this.#Y);else if(this.action==="click")this.removeEventListener("click",this.#j),this.removeEventListener("touchstart",this.#j)}setup(){this.style.display="contents"}render(){this.destroy();let Q=typeof HTMLElement<"u"&&"popover"in HTMLElement.prototype,$=document.createElement("span");if(this.popup=document.createElement("dialog",{is:"fig-popup"}),this.popup.setAttribute("is","fig-popup"),this.popup.setAttribute("variant","tooltip"),this.popup.setAttribute("data-tooltip-managed",""),this.popup.setAttribute("role","tooltip"),this.popup.setAttribute("closedby","none"),Q)this.popup.setAttribute("popover","manual");let J=c();this.popup.setAttribute("id",J);let Z=this.getAttribute("theme");if(Z)this.popup.setAttribute("theme",Z);let j=this.getAttribute("pointer");if(j!==null)this.popup.setAttribute("pointer",j);if(this.popup.append($),$.innerText=this.getAttribute("text")??"",this.firstElementChild)this.firstElementChild.setAttribute("aria-describedby",J);if(Q)document.body.append(this.popup);else{let q=this.closest("dialog");if(q&&q.open)q.append(this.popup);else document.body.append(this.popup)}this.popup.anchor=this.firstElementChild}destroy(){if(this.popup)this.popup.remove(),this.popup=null;if(this.action==="click")document.body.removeEventListener("click",this.#q)}isTouchDevice(){return"ontouchstart"in window||navigator.maxTouchPoints>0||navigator.msMaxTouchPoints>0}setupEventListeners(){if(this.action==="manual")return;if(this.action==="hover"){if(!this.isTouchDevice())this.addEventListener("pointerenter",this.#j),this.addEventListener("pointerleave",this.#Z);this.addEventListener("touchstart",this.#X,{passive:!0}),this.addEventListener("touchmove",this.#_,{passive:!0}),this.addEventListener("touchend",this.#K,{passive:!0}),this.addEventListener("touchcancel",this.#Y,{passive:!0})}else if(this.action==="click")this.addEventListener("click",this.#j),document.body.addEventListener("click",this.#q),this.addEventListener("touchstart",this.#j,{passive:!0});document.addEventListener("mousedown",this.#J,!0)}get#G(){return this.hasAttribute("show")&&this.getAttribute("show")!=="false"}showDelayedPopup(){if(this.#G)return;this.render(),clearTimeout(this.timeout);let $=Date.now()-S.#$<S.#Q?0:this.delay;this.timeout=setTimeout(this.showPopup.bind(this),$)}showPopup(){if(this.#W&&!this.#W.open)return;if(!this.firstElementChild)return;if(!this.popup)this.render();this.popup.anchor=this.firstElementChild,this.popup.open=!0,this.isOpen=!0,S.#$=Date.now()}hidePopup(){if(this.#G)return;if(clearTimeout(this.timeout),clearTimeout(this.#N),this.popup)this.destroy();this.isOpen=!1,S.#$=Date.now()}hidePopupOutsideClick(Q){if(this.isOpen&&!this.popup.contains(Q.target))this.hidePopup()}#M(Q){if(!this.#L)this.hidePopup()}#B(Q){if(this.action==="hover")this.#L=!0,clearTimeout(this.#N),this.showDelayedPopup()}#R(Q){if(this.action==="hover"&&this.#L)clearTimeout(this.#N),this.#N=setTimeout(()=>{this.#L=!1,this.hidePopup()},150)}#O(Q){if(this.action==="hover"&&this.#L)clearTimeout(this.#N),this.#N=setTimeout(()=>{this.#L=!1,this.hidePopup()},300)}#A(Q){if(this.action==="hover"&&this.#L)this.#L=!1,clearTimeout(this.#N),this.hidePopup()}static get observedAttributes(){return["action","delay","open","pointer","show","text","theme"]}get text(){return this.getAttribute("text")??""}set text(Q){this.setAttribute("text",Q)}#z(Q){if(!this.popup)return;let $=this.popup.firstElementChild??this.popup.firstChild;if(!$)return;$.innerText=Q}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()});if(Q==="show")if(J!==null&&J!=="false")this.showPopup();else this.hidePopup();if(Q==="text")this.#z(J??"");if(Q==="pointer"){if(this.popup)if(J!==null)this.popup.setAttribute("pointer",J);else this.popup.removeAttribute("pointer")}if(Q==="theme"){if(this.popup)if(J)this.popup.setAttribute("theme",J);else this.popup.removeAttribute("theme")}}#P(Q){if(!this.isOpen)return;let $=Q.target;if(this.popup&&this.popup.contains($))return;if($.tagName==="SELECT"||$.hasAttribute("popover")||$.closest("dialog"))this.hidePopup()}static#F=new WeakMap;static show(Q,$,J={}){S.hide(Q);let Z=J.delay??500,q=Date.now()-S.#$<S.#Q?0:Z,K={timeout:null,popup:null};S.#F.set(Q,K),K.timeout=setTimeout(()=>{let X=typeof HTMLElement<"u"&&"popover"in HTMLElement.prototype,_=document.createElement("dialog",{is:"fig-popup"});if(_.setAttribute("is","fig-popup"),_.setAttribute("variant","tooltip"),_.setAttribute("data-tooltip-managed",""),_.setAttribute("role","tooltip"),_.setAttribute("closedby","none"),X)_.setAttribute("popover","manual");let Y=document.createElement("span");if(Y.innerText=$,_.append(Y),X)document.body.append(_);else{let N=Q.closest?.("dialog");if(N&&N.open)N.append(_);else document.body.append(_)}_.anchor=Q,_.open=!0,K.popup=_,S.#$=Date.now()},q)}static hide(Q){let $=S.#F.get(Q);if(!$)return;if(clearTimeout($.timeout),$.popup)$.popup.remove();S.#F.delete(Q)}}customElements.define("fig-tooltip",S);class R0 extends HTMLElement{static observedAttributes=["position","tail"];#$=null;#Q=null;#J=null;connectedCallback(){this.#$=this.textContent,requestAnimationFrame(()=>{this.#q(),this.#j()})}disconnectedCallback(){this.#Z()}attributeChangedCallback(Q,$,J){if($===J)return;if(this.#$===null)return;this.#q()}#q(){let Q=this.getAttribute("position")||"right",$=this.#$||"";if(Q==="middle"){let J=this.getAttribute("tail"),Z;if(J){let K=$.lastIndexOf(J);Z=K>0?K:Math.ceil($.length/2)}else Z=Math.ceil($.length/2);this.innerHTML="";let j=document.createElement("span");j.className="start",j.textContent=$.slice(0,Z);let q=document.createElement("span");q.className="end",q.textContent=$.slice(Z),this.appendChild(j),this.appendChild(q)}else this.textContent=$}#j(){if(!this.hasAttribute("tooltip")||this.getAttribute("tooltip")==="false")return;this.#Q=()=>{if(this.scrollWidth<=this.clientWidth)return;S.show(this,this.#$)},this.#J=()=>{S.hide(this)},this.addEventListener("pointerenter",this.#Q),this.addEventListener("pointerleave",this.#J)}#Z(){if(this.#Q)this.removeEventListener("pointerenter",this.#Q);if(this.#J)this.removeEventListener("pointerleave",this.#J);S.hide(this)}}customElements.define("fig-truncate",R0);class z0 extends HTMLDialogElement{constructor(){super();this._figInit()}_figInit(){if(this._figInitialized)return;this._figInitialized=!0,this._isDragging=!1,this._dragPending=!1,this._dragStartPos={x:0,y:0},this._dragOffset={x:0,y:0},this._resizeObserver=null,this._mutationObserver=null,this._autoResizeRafId=0,this._offset=16,this._positionInitialized=!1,this._dragThreshold=3,this._boundPointerDown=this._handlePointerDown.bind(this),this._boundPointerMove=this._handlePointerMove.bind(this),this._boundPointerUp=this._handlePointerUp.bind(this),this._boundClose=this.close.bind(this),this._boundIframeMessage=this._handleIframeMessage.bind(this),this._boundContentMutation=this._scheduleAutoResize.bind(this),this._boundContentResize=this._scheduleAutoResize.bind(this)}get autoresize(){return this.hasAttribute("autoresize")&&this.getAttribute("autoresize")!=="false"}connectedCallback(){this._figInit(),this.modal=this.hasAttribute("modal")&&this.getAttribute("modal")!=="false",this.drag=this.hasAttribute("drag")&&this.getAttribute("drag")!=="false",this._ensureHeader(),requestAnimationFrame(()=>{this._addCloseListeners(),this._setupDragListeners(),this._applyPosition(),this._syncAutoResize()}),window.addEventListener("message",this._boundIframeMessage)}disconnectedCallback(){this._figInit(),this._removeDragListeners(),this.querySelectorAll("fig-button[close-dialog]").forEach((Q)=>{Q.removeEventListener("click",this._boundClose)}),window.removeEventListener("message",this._boundIframeMessage),this._teardownAutoResize()}_handleIframeMessage(Q){if(!this.autoresize)return;let $=Q?.data;if(!$||$.type!=="figui:iframe-resize")return;let J=Q.source;if(!J)return;let Z=Array.from(this.querySelectorAll("iframe")).find((j)=>j.contentWindow===J);if(!Z)return;this._resizeForIframe(Z,$)}_syncAutoResize(){if(this.autoresize)this._setupAutoResize(),this._scheduleAutoResize();else this._teardownAutoResize()}_setupAutoResize(){if(!this._resizeObserver){this._resizeObserver=new ResizeObserver(this._boundContentResize);for(let Q of this.children)try{this._resizeObserver.observe(Q)}catch{}}if(!this._mutationObserver)this._mutationObserver=new MutationObserver((Q)=>{for(let $ of Q)$.addedNodes?.forEach((J)=>{if(J instanceof Element&&J.parentElement===this)try{this._resizeObserver?.observe(J)}catch{}});this._scheduleAutoResize()}),this._mutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0})}_teardownAutoResize(){if(this._resizeObserver)this._resizeObserver.disconnect(),this._resizeObserver=null;if(this._mutationObserver)this._mutationObserver.disconnect(),this._mutationObserver=null;if(this._autoResizeRafId)cancelAnimationFrame(this._autoResizeRafId),this._autoResizeRafId=0}_scheduleAutoResize(){if(!this.autoresize)return;if(this._autoResizeRafId)return;this._autoResizeRafId=requestAnimationFrame(()=>{this._autoResizeRafId=0,this._applyAutoResize()})}_applyAutoResize(){if(!this.autoresize)return;if(this.querySelector(":scope > iframe"))return;this._resizeToContent(null)}_computeChrome(Q){let $=window.getComputedStyle(this),J=parseFloat($.paddingTop||"0")+parseFloat($.paddingBottom||"0")+parseFloat($.borderTopWidth||"0")+parseFloat($.borderBottomWidth||"0"),Z=0,j=parseFloat($.rowGap||$.gap||"0")||0,q=0;for(let K of this.children){let X=K.getBoundingClientRect();if(X.height===0)continue;if(q+=1,K===Q)continue;let _=window.getComputedStyle(K),Y=parseFloat(_.marginTop||"0")+parseFloat(_.marginBottom||"0");Z+=X.height+Y}if(j&&q>1)Z+=j*(q-1);return J+Z}_resizeForIframe(Q,$){if(typeof $.height!=="number"||!($.height>0))return;let J=this._computeChrome(Q);this.style.height=`${Math.ceil($.height+J)}px`}_resizeToContent(){if(this.style.height)this.style.height=""}_ensureHeader(){if(this.querySelector("fig-header[dialog-header]"))return;let Q=document.createElement("fig-header");Q.setAttribute("dialog-header",""),Q.setAttribute("data-auto","");let $=document.createElement("h3");$.textContent=this.getAttribute("title")||"Dialog";let J=document.createElement("fig-tooltip");J.setAttribute("text","Close");let Z=document.createElement("fig-button");Z.setAttribute("variant","ghost"),Z.setAttribute("icon",""),Z.setAttribute("close-dialog",""),Z.appendChild(u("close")),J.appendChild(Z),Q.appendChild($),Q.appendChild(J),this.prepend(Q)}_addCloseListeners(){this.querySelectorAll("fig-button[close-dialog]").forEach((Q)=>{Q.removeEventListener("click",this._boundClose),Q.addEventListener("click",this._boundClose)})}_applyPosition(){let 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";let $=Q.includes("top"),J=Q.includes("bottom"),Z=Q.includes("left"),j=Q.includes("right"),q=Q.includes("center")&&!$&&!J,K=Q.includes("center")&&!Z&&!j;if($)this.style.top=`${this._offset}px`;else if(J)this.style.bottom=`${this._offset}px`;else if(q)this.style.top="0",this.style.bottom="0";if(Z)this.style.left=`${this._offset}px`;else if(j)this.style.right=`${this._offset}px`;else if(K)this.style.left="0",this.style.right="0";if(q&&K)this.style.margin="auto";else if(q)this.style.marginTop="auto",this.style.marginBottom="auto";else if(K)this.style.marginLeft="auto",this.style.marginRight="auto";this._positionInitialized=!0}_setupDragListeners(){if(this.drag){this.addEventListener("pointerdown",this._boundPointerDown);let Q=this.getAttribute("handle"),$=Q?this.querySelector(Q):this.querySelector("fig-header, header");if($)$.style.cursor="grab"}}_removeDragListeners(){this.removeEventListener("pointerdown",this._boundPointerDown),document.removeEventListener("pointermove",this._boundPointerMove),document.removeEventListener("pointerup",this._boundPointerUp)}_isInteractiveElement(Q){let $=["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=(q)=>$.some((K)=>q.matches?.(K))||q.tagName?.startsWith("FIG-")&&!J.includes(q.tagName);if(Z(Q))return!0;let j=Q.parentElement;while(j&&j!==this){if(Z(j))return!0;j=j.parentElement}return!1}_handlePointerDown(Q){if(!this.drag)return;if(this._isInteractiveElement(Q.target))return;let $=this.getAttribute("handle");if($&&$.trim()){let Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this._dragPending=!0,this._dragStartPos.x=Q.clientX,this._dragStartPos.y=Q.clientY;let 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){let $=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.setPointerCapture(Q.pointerId),this.style.cursor="grabbing";let 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()}static get observedAttributes(){return["modal","drag","position","handle","title","resizable","closedby","autoresize"]}attributeChangedCallback(Q,$,J){if(this._figInit(),Q==="autoresize"&&this.isConnected)this._syncAutoResize();if(Q==="drag")if(this.drag=J!==null&&J!=="false",this.drag)this._setupDragListeners();else{this._removeDragListeners();let Z=this.querySelector("fig-header, header");if(Z)Z.style.cursor=""}if(Q==="position"&&this._positionInitialized)this._applyPosition();if(Q==="modal"){let Z=this.modal;if(this.modal=J!==null&&J!=="false",this.open&&Z!==this.modal)if(this.close(),this.modal)this.showModal();else this.show()}if(Q==="closedby")this.closedby=J||"any";if(Q==="title"){let Z=this.querySelector("fig-header[data-auto] h3");if(Z)Z.textContent=J||"Dialog"}}}q0("fig-dialog",z0,{extends:"dialog"});class D0 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>"u")this._anchorObserver=null;if(typeof this._contentObserver>"u")this._contentObserver=null;if(typeof this._mutationObserver>"u")this._mutationObserver=null;if(typeof this._anchorTrackRAF>"u")this._anchorTrackRAF=null;if(typeof this._lastAnchorRect>"u")this._lastAnchorRect=null;if(typeof this._isPopupActive>"u")this._isPopupActive=!1;if(typeof this._rafId>"u")this._rafId=null;if(typeof this._anchorRef>"u")this._anchorRef=null;if(typeof this._isDragging>"u")this._isDragging=!1;if(typeof this._dragPending>"u")this._dragPending=!1;if(typeof this._dragStartPos>"u")this._dragStartPos={x:0,y:0};if(typeof this._dragOffset>"u")this._dragOffset={x:0,y:0};if(typeof this._dragThreshold!=="number")this._dragThreshold=3;if(typeof this._wasDragged>"u")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 if(Q&&typeof Q.getBoundingClientRect==="function")this._anchorRef=Q;else this._anchorRef=null;if(this.open)this.queueReposition()}connectedCallback(){if(this.ensureInitialized(),this.getAttribute("variant")==="tooltip"){if(!this.hasAttribute("position"))this.setAttribute("position","top center");if(!this.hasAttribute("offset"))this.setAttribute("offset","8 8");if(!this.hasAttribute("viewport-margin"))this.setAttribute("viewport-margin","8");if(!this.hasAttribute("theme"))this.setAttribute("theme","menu")}if(!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}this.style.position="fixed",this.style.inset="auto",this.style.margin="0",this.style.zIndex=String(z1()+1);let Q=this.hasAttribute("popover")&&typeof this.showPopover==="function"&&!this.matches?.(":popover-open"),$=this.shouldAutoReposition();if($)this.style.visibility="hidden";if(Q)try{this.showPopover()}catch(Z){}if(!Q&&!super.open)try{this.show()}catch(Z){}if($&&(this.matches?.(":open")||this.matches?.(":popover-open")))this.positionPopup(),this.style.visibility="";this.setupObservers(),document.addEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._wasDragged=!1,this.queueReposition(),this._isPopupActive=!0;let J=this.resolveAnchor();if(J?.classList)J.classList.add("has-popup-open")}hidePopup(){let Q=this.resolveAnchor();if(Q?.classList)Q.classList.remove("has-popup-open");if(this.style.visibility="",this._isPopupActive=!1,this._wasDragged=!1,this.teardownObservers(),document.removeEventListener("pointerdown",this._boundOutsidePointerDown,!0),this.hasAttribute("popover")&&typeof this.hidePopover==="function"&&this.matches?.(":popover-open"))try{this.hidePopover()}catch($){}if(this.matches?.(":open"))try{this.close()}catch($){}}get autoresize(){let Q=this.getAttribute("autoresize");return Q===null||Q!=="false"}set autoresize(Q){if(Q||Q==="")this.setAttribute("autoresize",Q===!0?"":Q);else this.removeAttribute("autoresize")}setupObservers(){this.teardownObservers();let Q=this.resolveAnchor();if(Q instanceof Element&&"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;let $=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;let Q=()=>{if(!this.open){this._anchorTrackRAF=null;return}let $=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;let $=this.getAttribute("closedby");if($==="none"||$==="closerequest")return;let J=Q.target;if(!(J instanceof Node))return;if(this.contains(J))return;let Z=this.resolveAnchor();if(Z?.contains&&Z.contains(J))return;if(this.isInsideDescendantPopup(J))return;this.open=!1}isInsideDescendantPopup(Q){let $=Q.closest?.('dialog[is="fig-popup"]');if(!$||$===this)return!1;let J=$,Z=new Set;while(J&&!Z.has(J)){Z.add(J);let j=J.anchor;if(!(j instanceof Element))break;if(this.contains(j))return!0;J=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){let $=["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=(q)=>$.some((K)=>q.matches?.(K))||q.tagName?.startsWith("FIG-")&&!J.includes(q.tagName);if(Z(Q))return!0;let j=Q.parentElement;while(j&&j!==this){if(Z(j))return!0;j=j.parentElement}return!1}handlePointerDown(Q){if(!this.drag)return;if(this.isInteractiveElement(Q.target))return;let $=this.getAttribute("handle");if($&&$.trim()){let Z=this.querySelector($);if(!Z||!Z.contains(Q.target))return}this._dragPending=!0,this._dragStartPos.x=Q.clientX,this._dragStartPos.y=Q.clientY;let 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){let $=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";let 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;let Q=this.getAttribute("anchor");if(!Q)return null;let $=this.parentElement;if($?.querySelector){let J=$.querySelector(Q);if(J&&!this.contains(J))return J}return document.querySelector(Q)}parsePosition(){let $=(this.getAttribute("position")||"top center").trim().toLowerCase().split(/\s+/).filter(Boolean),J=new Set(["top","center","bottom"]),Z=new Set(["left","center","right"]),j="top",q="center",K=null;if($.length>=2){if(J.has($[0]))j=$[0];if(Z.has($[1]))q=$[1];return{vertical:j,horizontal:q,shorthand:K}}if($.length===1){let X=$[0];if(X==="top"||X==="bottom")j=X,K=X;else if(X==="left"||X==="right")q=X,K=X;else if(X==="center")j="center",q="center"}return{vertical:j,horizontal:q,shorthand:K}}normalizeOffsetToken(Q,$="0px"){if(!Q)return $;let J=Q.trim();if(!J)return $;if(/^-?\d+(\.\d+)?$/.test(J))return`${J}px`;return J}measureLengthPx(Q,$="x"){if(!Q)return 0;let J=this.normalizeOffsetToken(Q,"0px");if(J.endsWith("px")){let q=parseFloat(J);return Number.isFinite(q)?q:0}let 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);let j=Z.getBoundingClientRect();return Z.remove(),$==="x"?j.width:j.height}parseOffset(){let $=(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(){let $=(this.getAttribute("viewport-margin")||"8").trim().split(/\s+/).map(Number).filter((Z)=>!Number.isNaN(Z)),J=8;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){let Z={top:"bottom",bottom:"top",left:"right",right:"left",center:"center"};if(J){let q=J==="left"||J==="right"?["top","bottom"]:["left","right"];return[{v:Q,h:$,s:J},{v:Q,h:$,s:Z[J]},{v:Q,h:$,s:q[0]},{v:Q,h:$,s:q[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,q){let K,X;if(q==="left"||q==="right")return X=q==="left"?Q.left-$.width-j.xPx:Q.right+j.xPx,K=Q.top,{top:K,left:X};if(q==="top"||q==="bottom")return K=q==="top"?Q.top-$.height-j.yPx:Q.bottom+j.yPx,X=Q.left,{top:K,left:X};if(J==="top")K=Q.top-$.height-j.yPx;else if(J==="bottom")K=Q.bottom+j.yPx;else K=Q.top+(Q.height-$.height)/2;if(J==="center")if(Z==="left")X=Q.left-$.width-j.xPx;else if(Z==="right")X=Q.right+j.xPx;else X=Q.left+(Q.width-$.width)/2;else if(Z==="left")X=Q.left+j.xPx;else if(Z==="right")X=Q.right-$.width-j.xPx;else X=Q.left+(Q.width-$.width)/2;return{top:K,left:X}}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,j){let q=this.getAttribute("variant");if(!(q==="popover"||q==="tooltip")||!Q){this.style.removeProperty("--fig-popup-beak-offset"),this.removeAttribute("data-beak-side");return}let X=this.oppositeSide(j);this.setAttribute("data-beak-side",X);let _=Q.left+Q.width/2,Y=Q.top+Q.height/2,N=this.getBoundingClientRect(),W=N.width>0&&N.height>0?N:$,G=W.left,D=W.top,R=10,L;if(X==="top"||X==="bottom"){L=_-G;let B=R,M=Math.max(B,W.width-R);L=Math.min(M,Math.max(B,L))}else{L=Y-D;let B=R,M=Math.max(B,W.height-R);L=Math.min(M,Math.max(B,L))}this.style.setProperty("--fig-popup-beak-offset",`${L}px`)}overflowScore(Q,$,J){let{innerWidth:Z,innerHeight:j}=window,q=Q.left+$.width,K=Q.top+$.height,X=Math.max(0,J.left-Q.left),_=Math.max(0,J.top-Q.top),Y=Math.max(0,q-(Z-J.right)),N=Math.max(0,K-(j-J.bottom));return X+_+Y+N}fits(Q,$,J){return this.overflowScore(Q,$,J)===0}clamp(Q,$,J){let{left:Z,top:j}=J,q=Math.max(J.left,window.innerWidth-$.width-J.right),K=Math.max(J.top,window.innerHeight-$.height-J.bottom);return{left:Math.min(q,Math.max(Z,Q.left)),top:Math.min(K,Math.max(j,Q.top))}}positionPopup(){if(!this.open||!this.matches?.(":open"))return;let Q=this.getBoundingClientRect(),$=this.parseOffset(),{vertical:J,horizontal:Z,shorthand:j}=this.parsePosition(),q=this.resolveAnchor(),K=this.parseViewportMargins();if(!q){this.updatePopoverBeak(null,Q,0,0,"top");let D={left:K.left+(window.innerWidth-K.right-K.left-Q.width)/2,top:K.top+(window.innerHeight-K.bottom-K.top-Q.height)/2},R=this.clamp(D,Q,K);this.style.left=`${R.left}px`,this.style.top=`${R.top}px`;return}let X=q.getBoundingClientRect(),_=this.getPlacementCandidates(J,Z,j),Y=null,N="top",W=Number.POSITIVE_INFINITY;for(let{v:D,h:R,s:L}of _){let B=this.computeCoords(X,Q,D,R,$,L),M=this.getPlacementSide(D,R,L);if(L){let O=this.clamp(B,Q,K);if(L==="left"||L==="right"?B.left>=K.left&&B.left+Q.width<=window.innerWidth-K.right:B.top>=K.top&&B.top+Q.height<=window.innerHeight-K.bottom){this.style.left=`${O.left}px`,this.style.top=`${O.top}px`,this.updatePopoverBeak(X,Q,O.left,O.top,M);return}let H=this.overflowScore(B,Q,K);if(H<W)W=H,Y=O,N=M}else{if(this.fits(B,Q,K)){this.style.left=`${B.left}px`,this.style.top=`${B.top}px`,this.updatePopoverBeak(X,Q,B.left,B.top,M);return}let O=this.overflowScore(B,Q,K);if(O<W)W=O,Y=B,N=M}}let G=this.clamp(Y||{left:0,top:0},Q,K);this.style.left=`${G.left}px`,this.style.top=`${G.top}px`,this.updatePopoverBeak(X,Q,G.left,G.top,N)}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()}}q0("fig-popup",D0,{extends:"dialog"});class H0 extends HTMLElement{#$;#Q;constructor(){super();this.content=null,this.#$=!1,this.#Q=this.handleClick.bind(this)}connectedCallback(){this.setAttribute("label",this.innerText),this.setAttribute("role","tab"),this.setAttribute("tabindex","0"),this.addEventListener("click",this.#Q),requestAnimationFrame(()=>{if(typeof this.getAttribute("content")==="string"){if(this.content=document.querySelector(this.getAttribute("content")),this.content)if(this.content.setAttribute("role","tabpanel"),this.#$)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.#$}set selected(Q){this.setAttribute("selected",Q?"true":"false")}disconnectedCallback(){this.removeEventListener("click",this.#Q)}handleClick(){if(this.hasAttribute("disabled"))return;if(this.selected=!0,this.content)this.content.style.display="block"}static get observedAttributes(){return["selected"]}attributeChangedCallback(Q,$,J){if(Q==="selected"){if(this.#$=J!==null&&J!=="false",this.setAttribute("aria-selected",this.#$?"true":"false"),this?.content)this.content.style.display=this.#$?"block":"none"}}}customElements.define("fig-tab",H0);class F0 extends HTMLElement{#$;#Q;constructor(){super();this.#$=this.handleClick.bind(this),this.#Q=this.#q.bind(this)}static get observedAttributes(){return["value","name","disabled"]}connectedCallback(){this.name=this.getAttribute("name")||"tabs",this.setAttribute("role","tablist"),this.addEventListener("click",this.#$),this.addEventListener("keydown",this.#Q),requestAnimationFrame(()=>{let Q=this.getAttribute("value");if(Q)this.#j(Q);if(this.hasAttribute("disabled"))this.#J(!0)})}#J(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.#$),this.removeEventListener("keydown",this.#Q)}#q(Q){let $=Array.from(this.querySelectorAll("fig-tab")),J=$.findIndex((j)=>j.hasAttribute("selected")),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((q)=>q.removeAttribute("selected")),this.selectedTab=$[Z],$[Z].setAttribute("selected","true");let j=$[Z].getAttribute("value");if(j)this.setAttribute("value",j);$[Z].focus()}}get value(){return this.selectedTab?.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q)}#j(Q){let $=this.querySelectorAll("fig-tab");for(let J of $)if(J.getAttribute("value")===Q)this.selectedTab=J,J.setAttribute("selected","true");else J.removeAttribute("selected")}attributeChangedCallback(Q,$,J){switch(Q){case"value":if(J!==$)this.#j(J);break;case"disabled":this.#J(J!==null&&J!=="false");break}}handleClick(Q){if(this.hasAttribute("disabled"))return;let $=Q.target.closest("fig-tab");if(!$||!this.contains($))return;let J=this.querySelectorAll("fig-tab");for(let j of J)if(j===$)this.selectedTab=j,j.setAttribute("selected","true");else j.removeAttribute("selected");let Z=$.getAttribute("value");if(Z)this.setAttribute("value",Z)}}customElements.define("fig-tabs",F0);class P0 extends HTMLElement{#$;#Q;#J;constructor(){super();this.#J=this.handleClick.bind(this)}connectedCallback(){this.addEventListener("click",this.#J)}disconnectedCallback(){this.removeEventListener("click",this.#J)}handleClick(){let Q=this.closest("fig-segmented-control");if(Q&&Q.hasAttribute("disabled")&&Q.getAttribute("disabled")!=="false")return;this.setAttribute("selected","true")}get value(){return this.#$}set value(Q){this.#$=Q,this.setAttribute("value",Q)}get selected(){return this.#Q}set selected(Q){this.#Q=Q,this.setAttribute("selected",Q)}static get observedAttributes(){return["selected","value"]}attributeChangedCallback(Q,$,J){switch(Q){case"value":this.#$=J;break;case"selected":this.#Q=J;break}}}customElements.define("fig-segment",P0);class E0 extends HTMLElement{#$=null;#Q=this.handleClick.bind(this);#J=null;#q=null;#j=0;#Z=!1;#X=!1;constructor(){super()}static get observedAttributes(){return["disabled","value","animated","sizing"]}connectedCallback(){this.name=this.getAttribute("name")||"segmented-control",this.addEventListener("click",this.#Q),this.#O(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),this.#R(),this.#G(),requestAnimationFrame(()=>{this.#B({enforceFallback:!0}),this.#M(),this.#N({forceInstant:!0})})}disconnectedCallback(){if(this.removeEventListener("click",this.#Q),this.#J?.disconnect(),this.#J=null,this.#q?.disconnect(),this.#q=null,this.#j)cancelAnimationFrame(this.#j),this.#j=0;this.#Z=!1,this.#X=!1}get selectedSegment(){return this.#$}set selectedSegment(Q){let $=this.querySelectorAll("fig-segment");for(let J of $){let Z=J===Q,j=J.hasAttribute("selected");if(Z&&!j)J.setAttribute("selected","true");else if(!Z&&j)J.removeAtt