@rogieking/figui3 4.12.1 → 4.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.css +41 -2
- package/dist/components.css +1 -1
- package/dist/fig.css +1 -1
- package/dist/fig.js +2 -2
- package/fig.js +14 -8
- package/package.json +1 -1
package/dist/fig.js
CHANGED
|
@@ -32,7 +32,7 @@ var U1=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var L1={};var N0=U1(()=>{/*! Vendored from @
|
|
|
32
32
|
<button type="${this.type}">
|
|
33
33
|
<slot></slot>
|
|
34
34
|
</button>
|
|
35
|
-
`,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",B0);class O0 extends HTMLElement{#$="Menu";#Q=null;#J;#K;#j=!1;#Z=null;get label(){return this.#$}set label(Q){this.#$=Q}#_;constructor(){super();this.select=document.createElement("select"),this.optionsSlot=document.createElement("slot"),this.attachShadow({mode:"open"}),this.#J=this.#L.bind(this),this.#K=this.#G.bind(this),this.#_=this.slotChange.bind(this)}#X(){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}}#q(){if(!(this.getAttribute("experimental")||"").split(/\s+/).filter(Boolean).includes("modern")||!this.#X()){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}#W(){this.select.addEventListener("input",this.#J),this.select.addEventListener("change",this.#K)}#U(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.#_),this.#W()}slotChange(){while(this.select.firstChild)this.select.firstChild.remove();if(this.#q(),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.#U($)){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.#U($)){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.#_),this.select.removeEventListener("input",this.#J),this.select.removeEventListener("change",this.#K)}}customElements.define("fig-dropdown",O0);class E extends HTMLElement{static#$=0;static#Q=500;#J;#K;#j;#Z;#_;#X;#q;#Y;#W;#U=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.#H.bind(this),this.#K=this.hidePopupOutsideClick.bind(this),this.#j=this.showDelayedPopup.bind(this),this.#Z=this.#M.bind(this),this.#_=this.#B.bind(this),this.#X=this.#A.bind(this),this.#q=this.#O.bind(this),this.#Y=this.#R.bind(this),this.#W=()=>{clearTimeout(this.timeout),this.destroy(),this.isOpen=!1}}connectedCallback(){if(this.setup(),this.setupEventListeners(),this.#U=this.closest("dialog"),this.#U)this.#U.addEventListener("close",this.#W)}disconnectedCallback(){if(clearTimeout(this.timeout),this.destroy(),document.removeEventListener("mousedown",this.#J,!0),this.#U)this.#U.removeEventListener("close",this.#W),this.#U=null;if(this.action==="click")document.body.removeEventListener("click",this.#K);if(clearTimeout(this.#N),this.action==="hover")this.removeEventListener("pointerenter",this.#j),this.removeEventListener("pointerleave",this.#Z),this.removeEventListener("touchstart",this.#_),this.removeEventListener("touchmove",this.#X),this.removeEventListener("touchend",this.#q),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=u();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 K=this.closest("dialog");if(K&&K.open)K.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.#K)}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.#_,{passive:!0}),this.addEventListener("touchmove",this.#X,{passive:!0}),this.addEventListener("touchend",this.#q,{passive:!0}),this.addEventListener("touchcancel",this.#Y,{passive:!0})}else if(this.action==="click")this.addEventListener("click",this.#j),document.body.addEventListener("click",this.#K),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()-E.#$<E.#Q?0:this.delay;this.timeout=setTimeout(this.showPopup.bind(this),$)}showPopup(){if(this.#U&&!this.#U.open)return;if(!this.firstElementChild)return;if(!this.popup)this.render();this.popup.anchor=this.firstElementChild,this.popup.open=!0,this.isOpen=!0,E.#$=Date.now()}hidePopup(){if(this.#G)return;if(clearTimeout(this.timeout),clearTimeout(this.#N),this.popup)this.destroy();this.isOpen=!1,E.#$=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()}#A(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)}#R(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")}}#H(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#P=new WeakMap;static show(Q,$,J={}){E.hide(Q);let Z=J.delay??500,K=Date.now()-E.#$<E.#Q?0:Z,q={timeout:null,popup:null};E.#P.set(Q,q),q.timeout=setTimeout(()=>{let _=typeof HTMLElement<"u"&&"popover"in HTMLElement.prototype,X=document.createElement("dialog",{is:"fig-popup"});if(X.setAttribute("is","fig-popup"),X.setAttribute("variant","tooltip"),X.setAttribute("data-tooltip-managed",""),X.setAttribute("role","tooltip"),X.setAttribute("closedby","none"),_)X.setAttribute("popover","manual");let Y=document.createElement("span");if(Y.innerText=$,X.append(Y),_)document.body.append(X);else{let N=Q.closest?.("dialog");if(N&&N.open)N.append(X);else document.body.append(X)}X.anchor=Q,X.open=!0,q.popup=X,E.#$=Date.now()},K)}static hide(Q){let $=E.#P.get(Q);if(!$)return;if(clearTimeout($.timeout),$.popup)$.popup.remove();E.#P.delete(Q)}}customElements.define("fig-tooltip",E);class A0 extends HTMLElement{static observedAttributes=["position","tail"];#$=null;#Q=null;#J=null;connectedCallback(){this.#$=this.textContent,requestAnimationFrame(()=>{this.#K(),this.#j()})}disconnectedCallback(){this.#Z()}attributeChangedCallback(Q,$,J){if($===J)return;if(this.#$===null)return;this.#K()}#K(){let Q=this.getAttribute("position")||"right",$=this.#$||"";if(Q==="middle"){let J=this.getAttribute("tail"),Z;if(J){let q=$.lastIndexOf(J);Z=q>0?q: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 K=document.createElement("span");K.className="end",K.textContent=$.slice(Z),this.appendChild(j),this.appendChild(K)}else this.textContent=$}#j(){if(!this.hasAttribute("tooltip")||this.getAttribute("tooltip")==="false")return;this.#Q=()=>{if(this.scrollWidth<=this.clientWidth)return;E.show(this,this.#$)},this.#J=()=>{E.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);E.hide(this)}}customElements.define("fig-truncate",A0);class R0 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,K=0;for(let q of this.children){let _=q.getBoundingClientRect();if(_.height===0)continue;if(K+=1,q===Q)continue;let X=window.getComputedStyle(q),Y=parseFloat(X.marginTop||"0")+parseFloat(X.marginBottom||"0");Z+=_.height+Y}if(j&&K>1)Z+=j*(K-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","");let j=document.createElement("span");j.className="fig-mask-icon",j.style.setProperty("--icon","var(--icon-close)"),Z.appendChild(j),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"),K=Q.includes("center")&&!$&&!J,q=Q.includes("center")&&!Z&&!j;if($)this.style.top=`${this._offset}px`;else if(J)this.style.bottom=`${this._offset}px`;else if(K)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(q)this.style.left="0",this.style.right="0";if(K&&q)this.style.margin="auto";else if(K)this.style.marginTop="auto",this.style.marginBottom="auto";else if(q)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=(K)=>$.some((q)=>K.matches?.(q))||K.tagName?.startsWith("FIG-")&&!J.includes(K.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"}}}j0("fig-dialog",R0,{extends:"dialog"});class z0 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 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(A1()+1);let Q=this.hasAttribute("popover")&&typeof this.showPopover==="function"&&!this.matches?.(":popover-open");if(Q)try{this.showPopover()}catch(J){}if(!Q&&!super.open)try{this.show()}catch(J){}this.setupObservers(),document.addEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._wasDragged=!1,this.queueReposition(),this._isPopupActive=!0;let $=this.resolveAnchor();if($)$.classList.add("has-popup-open")}hidePopup(){let 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),this.hasAttribute("popover")&&typeof this.hidePopover==="function"&&this.matches?.(":popover-open"))try{this.hidePopover()}catch($){}if(super.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&&"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&&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=(K)=>$.some((q)=>K.matches?.(q))||K.tagName?.startsWith("FIG-")&&!J.includes(K.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",K="center",q=null;if($.length>=2){if(J.has($[0]))j=$[0];if(Z.has($[1]))K=$[1];return{vertical:j,horizontal:K,shorthand:q}}if($.length===1){let _=$[0];if(_==="top"||_==="bottom")j=_,q=_;else if(_==="left"||_==="right")K=_,q=_;else if(_==="center")j="center",K="center"}return{vertical:j,horizontal:K,shorthand:q}}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 K=parseFloat(J);return Number.isFinite(K)?K: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 K=J==="left"||J==="right"?["top","bottom"]:["left","right"];return[{v:Q,h:$,s:J},{v:Q,h:$,s:Z[J]},{v:Q,h:$,s:K[0]},{v:Q,h:$,s:K[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,K){let q,_;if(K==="left"||K==="right")return _=K==="left"?Q.left-$.width-j.xPx:Q.right+j.xPx,q=Q.top,{top:q,left:_};if(K==="top"||K==="bottom")return q=K==="top"?Q.top-$.height-j.yPx:Q.bottom+j.yPx,_=Q.left,{top:q,left:_};if(J==="top")q=Q.top-$.height-j.yPx;else if(J==="bottom")q=Q.bottom+j.yPx;else q=Q.top+(Q.height-$.height)/2;if(J==="center")if(Z==="left")_=Q.left-$.width-j.xPx;else if(Z==="right")_=Q.right+j.xPx;else _=Q.left+(Q.width-$.width)/2;else if(Z==="left")_=Q.left+j.xPx;else if(Z==="right")_=Q.right-$.width-j.xPx;else _=Q.left+(Q.width-$.width)/2;return{top:q,left:_}}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 K=this.getAttribute("variant");if(!(K==="popover"||K==="tooltip")||!Q){this.style.removeProperty("--fig-popup-beak-offset"),this.removeAttribute("data-beak-side");return}let _=this.oppositeSide(j);this.setAttribute("data-beak-side",_);let X=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(_==="top"||_==="bottom"){L=X-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,K=Q.left+$.width,q=Q.top+$.height,_=Math.max(0,J.left-Q.left),X=Math.max(0,J.top-Q.top),Y=Math.max(0,K-(Z-J.right)),N=Math.max(0,q-(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,K=Math.max(J.left,window.innerWidth-$.width-J.right),q=Math.max(J.top,window.innerHeight-$.height-J.bottom);return{left:Math.min(K,Math.max(Z,Q.left)),top:Math.min(q,Math.max(j,Q.top))}}positionPopup(){if(!this.open||!super.open)return;let Q=this.getBoundingClientRect(),$=this.parseOffset(),{vertical:J,horizontal:Z,shorthand:j}=this.parsePosition(),K=this.resolveAnchor(),q=this.parseViewportMargins();if(!K){this.updatePopoverBeak(null,Q,0,0,"top");let D={left:q.left+(window.innerWidth-q.right-q.left-Q.width)/2,top:q.top+(window.innerHeight-q.bottom-q.top-Q.height)/2},R=this.clamp(D,Q,q);this.style.left=`${R.left}px`,this.style.top=`${R.top}px`;return}let _=K.getBoundingClientRect(),X=this.getPlacementCandidates(J,Z,j),Y=null,N="top",W=Number.POSITIVE_INFINITY;for(let{v:D,h:R,s:L}of X){let B=this.computeCoords(_,Q,D,R,$,L),M=this.getPlacementSide(D,R,L);if(L){let O=this.clamp(B,Q,q);if(L==="left"||L==="right"?B.left>=q.left&&B.left+Q.width<=window.innerWidth-q.right:B.top>=q.top&&B.top+Q.height<=window.innerHeight-q.bottom){this.style.left=`${O.left}px`,this.style.top=`${O.top}px`,this.updatePopoverBeak(_,Q,O.left,O.top,M);return}let H=this.overflowScore(B,Q,q);if(H<W)W=H,Y=O,N=M}else{if(this.fits(B,Q,q)){this.style.left=`${B.left}px`,this.style.top=`${B.top}px`,this.updatePopoverBeak(_,Q,B.left,B.top,M);return}let O=this.overflowScore(B,Q,q);if(O<W)W=O,Y=B,N=M}}let G=this.clamp(Y||{left:0,top:0},Q,q);this.style.left=`${G.left}px`,this.style.top=`${G.top}px`,this.updatePopoverBeak(_,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()}}j0("fig-popup",z0,{extends:"dialog"});class D0 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",D0);class H0 extends HTMLElement{#$;#Q;constructor(){super();this.#$=this.handleClick.bind(this),this.#Q=this.#K.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)}#K(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((K)=>K.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",H0);class F0 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",F0);class P0 extends HTMLElement{#$=null;#Q=this.handleClick.bind(this);#J=null;#K=null;#j=0;#Z=!1;#_=!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.#A(),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.#K?.disconnect(),this.#K=null,this.#j)cancelAnimationFrame(this.#j),this.#j=0;this.#Z=!1,this.#_=!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.removeAttribute("selected")}this.#$=Q instanceof HTMLElement&&this.contains(Q)?Q:null,this.#N()}get value(){return this.getAttribute("value")||""}set value(Q){if(Q===null||Q===void 0){this.removeAttribute("value");return}this.setAttribute("value",String(Q))}#X(Q){this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0}))}#q(Q){let $=Q.getAttribute("value");if($!==null){let J=$.trim();if(J.length>0)return J}return Q.textContent?.trim()||""}#Y(){let Q=this.querySelectorAll("fig-segment");for(let $ of Q)if($.hasAttribute("selected"))return $;return null}#W(Q){let $=String(Q??"").trim();if(!$)return!1;let J=this.querySelectorAll("fig-segment");for(let Z of J){let j=this.#q(Z);if(!j)continue;if(j===$)return this.selectedSegment=Z,!0}return!1}#U(){let Q=this.getAttribute("animated");if(Q===null)return!1;if(Q==="")return!0;return Q.trim().toLowerCase()==="true"}#N({forceInstant:Q=!1}={}){if(this.#Z=this.#Z||Q,this.#j)return;this.#j=requestAnimationFrame(()=>{this.#j=0;let $=this.#Z;this.#Z=!1,this.#L({forceInstant:$})})}#L({forceInstant:Q=!1}={}){let $=this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false",J=this.#U(),Z=this.#$&&this.contains(this.#$)?this.#$:this.#Y();if($||!J){if(this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready"),!J||$)this.#_=!1;return}if(!Z){if(this.#_)return;this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready");return}let j=this.getBoundingClientRect(),K=Z.getBoundingClientRect();if(j.width<=0||K.width<=0){if(this.#_)return;this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready");return}let q=Math.max(0,K.left-j.left);this.style.setProperty("--seg-indicator-x",`${q}px`),this.style.setProperty("--seg-indicator-w",`${K.width}px`),this.style.setProperty("--seg-indicator-opacity","1"),this.style.setProperty("--seg-indicator-transition-duration",!this.#_||Q?"0ms":"150ms"),this.setAttribute("data-indicator-ready","true"),this.#_=!0}#G(){this.#K?.disconnect(),this.#K=new ResizeObserver(()=>{this.#N()}),this.#M()}#M(){if(!this.#K)return;this.#K.disconnect(),this.#K.observe(this),this.querySelectorAll("fig-segment").forEach((Q)=>{this.#K?.observe(Q)})}#B({enforceFallback:Q=!1}={}){let $=this.querySelectorAll("fig-segment");if($.length===0){this.#$=null,this.#N({forceInstant:!0});return}let J=this.getAttribute("value"),Z=J?.trim()??"";if(J!==null){if(Z!==J){this.setAttribute("value",Z);return}if(Z&&this.#W(Z))return}let j=this.#Y();if(j){this.selectedSegment=j;return}if(Q)this.selectedSegment=$[0]}#A(){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.#O(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),this.#M(),this.#B({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;let $=Q.target.closest("fig-segment");if(!$||!this.contains($))return;let J=this.selectedSegment,Z=this.value;this.selectedSegment=$;let j=this.#q($);if(j)this.setAttribute("value",j);else this.removeAttribute("value");let K=this.value;if(J!==$||Z!==K)this.#X(K)}#O(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.#O(J!==null&&J!=="false"),this.#N({forceInstant:!0});return}if(Q==="value"){this.#B({enforceFallback:!1});return}if(Q==="animated"){if(!this.#U())this.#_=!1;this.#N({forceInstant:!0});return}if(Q==="sizing")this.#N({forceInstant:!0})}}customElements.define("fig-segmented-control",P0);class k0 extends HTMLElement{static get observedAttributes(){return["options","value","disabled","full","sizing"]}#$="segments";#Q=0;#J=null;#K=[];#j=null;#Z=!1;#_(Q){let $=Q?.detail;if(typeof $==="string")return $;let J=Q?.currentTarget?.value??Q?.target?.value??this.getAttribute("value");if(J===null||J===void 0)return null;return String(J)}connectedCallback(){this.#X(),this.#q(),this.#L(),requestAnimationFrame(()=>{requestAnimationFrame(()=>this.#B())})}disconnectedCallback(){this.#J?.disconnect(),this.#J=null}get value(){return this.getAttribute("value")||""}set value(Q){if(Q===null||Q===void 0)this.removeAttribute("value");else this.setAttribute("value",String(Q))}get options(){return this.#K.slice()}set options(Q){if(Array.isArray(Q)){let J=Q.some((Z)=>String(Z).includes(","))?JSON.stringify(Q):Q.join(",");this.setAttribute("options",J)}else this.setAttribute("options",String(Q||""))}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="options"){this.#X(),this.#W();return}if(Q==="value"){this.#U();return}if(Q==="disabled"){this.#N("disabled");return}if(Q==="full"){this.#N("full");return}if(Q==="sizing")this.#N("sizing"),this.#W()}#X(){let Q=this.getAttribute("options")||"";if(Q.startsWith("["))try{this.#K=JSON.parse(Q);return}catch{}let $=Q.includes(`
|
|
35
|
+
`,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",B0);class O0 extends HTMLElement{#$="Menu";#Q=null;#J;#K;#j=!1;#Z=null;get label(){return this.#$}set label(Q){this.#$=Q}#_;constructor(){super();this.select=document.createElement("select"),this.optionsSlot=document.createElement("slot"),this.attachShadow({mode:"open"}),this.#J=this.#L.bind(this),this.#K=this.#G.bind(this),this.#_=this.slotChange.bind(this)}#X(){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}}#q(){if(!(this.getAttribute("experimental")||"").split(/\s+/).filter(Boolean).includes("modern")||!this.#X()){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}#W(){this.select.addEventListener("input",this.#J),this.select.addEventListener("change",this.#K)}#U(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.#_),this.#W()}slotChange(){while(this.select.firstChild)this.select.firstChild.remove();if(this.#q(),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.#U($)){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.#U($)){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.#_),this.select.removeEventListener("input",this.#J),this.select.removeEventListener("change",this.#K)}}customElements.define("fig-dropdown",O0);class E extends HTMLElement{static#$=0;static#Q=500;#J;#K;#j;#Z;#_;#X;#q;#Y;#W;#U=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.#H.bind(this),this.#K=this.hidePopupOutsideClick.bind(this),this.#j=this.showDelayedPopup.bind(this),this.#Z=this.#M.bind(this),this.#_=this.#B.bind(this),this.#X=this.#A.bind(this),this.#q=this.#O.bind(this),this.#Y=this.#R.bind(this),this.#W=()=>{clearTimeout(this.timeout),this.destroy(),this.isOpen=!1}}connectedCallback(){if(this.setup(),this.setupEventListeners(),this.#U=this.closest("dialog"),this.#U)this.#U.addEventListener("close",this.#W)}disconnectedCallback(){if(clearTimeout(this.timeout),this.destroy(),document.removeEventListener("mousedown",this.#J,!0),this.#U)this.#U.removeEventListener("close",this.#W),this.#U=null;if(this.action==="click")document.body.removeEventListener("click",this.#K);if(clearTimeout(this.#N),this.action==="hover")this.removeEventListener("pointerenter",this.#j),this.removeEventListener("pointerleave",this.#Z),this.removeEventListener("touchstart",this.#_),this.removeEventListener("touchmove",this.#X),this.removeEventListener("touchend",this.#q),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=u();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 K=this.closest("dialog");if(K&&K.open)K.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.#K)}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.#_,{passive:!0}),this.addEventListener("touchmove",this.#X,{passive:!0}),this.addEventListener("touchend",this.#q,{passive:!0}),this.addEventListener("touchcancel",this.#Y,{passive:!0})}else if(this.action==="click")this.addEventListener("click",this.#j),document.body.addEventListener("click",this.#K),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()-E.#$<E.#Q?0:this.delay;this.timeout=setTimeout(this.showPopup.bind(this),$)}showPopup(){if(this.#U&&!this.#U.open)return;if(!this.firstElementChild)return;if(!this.popup)this.render();this.popup.anchor=this.firstElementChild,this.popup.open=!0,this.isOpen=!0,E.#$=Date.now()}hidePopup(){if(this.#G)return;if(clearTimeout(this.timeout),clearTimeout(this.#N),this.popup)this.destroy();this.isOpen=!1,E.#$=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()}#A(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)}#R(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")}}#H(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#P=new WeakMap;static show(Q,$,J={}){E.hide(Q);let Z=J.delay??500,K=Date.now()-E.#$<E.#Q?0:Z,q={timeout:null,popup:null};E.#P.set(Q,q),q.timeout=setTimeout(()=>{let _=typeof HTMLElement<"u"&&"popover"in HTMLElement.prototype,X=document.createElement("dialog",{is:"fig-popup"});if(X.setAttribute("is","fig-popup"),X.setAttribute("variant","tooltip"),X.setAttribute("data-tooltip-managed",""),X.setAttribute("role","tooltip"),X.setAttribute("closedby","none"),_)X.setAttribute("popover","manual");let Y=document.createElement("span");if(Y.innerText=$,X.append(Y),_)document.body.append(X);else{let N=Q.closest?.("dialog");if(N&&N.open)N.append(X);else document.body.append(X)}X.anchor=Q,X.open=!0,q.popup=X,E.#$=Date.now()},K)}static hide(Q){let $=E.#P.get(Q);if(!$)return;if(clearTimeout($.timeout),$.popup)$.popup.remove();E.#P.delete(Q)}}customElements.define("fig-tooltip",E);class A0 extends HTMLElement{static observedAttributes=["position","tail"];#$=null;#Q=null;#J=null;connectedCallback(){this.#$=this.textContent,requestAnimationFrame(()=>{this.#K(),this.#j()})}disconnectedCallback(){this.#Z()}attributeChangedCallback(Q,$,J){if($===J)return;if(this.#$===null)return;this.#K()}#K(){let Q=this.getAttribute("position")||"right",$=this.#$||"";if(Q==="middle"){let J=this.getAttribute("tail"),Z;if(J){let q=$.lastIndexOf(J);Z=q>0?q: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 K=document.createElement("span");K.className="end",K.textContent=$.slice(Z),this.appendChild(j),this.appendChild(K)}else this.textContent=$}#j(){if(!this.hasAttribute("tooltip")||this.getAttribute("tooltip")==="false")return;this.#Q=()=>{if(this.scrollWidth<=this.clientWidth)return;E.show(this,this.#$)},this.#J=()=>{E.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);E.hide(this)}}customElements.define("fig-truncate",A0);class R0 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,K=0;for(let q of this.children){let _=q.getBoundingClientRect();if(_.height===0)continue;if(K+=1,q===Q)continue;let X=window.getComputedStyle(q),Y=parseFloat(X.marginTop||"0")+parseFloat(X.marginBottom||"0");Z+=_.height+Y}if(j&&K>1)Z+=j*(K-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","");let j=document.createElement("span");j.className="fig-mask-icon",j.style.setProperty("--icon","var(--icon-close)"),Z.appendChild(j),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"),K=Q.includes("center")&&!$&&!J,q=Q.includes("center")&&!Z&&!j;if($)this.style.top=`${this._offset}px`;else if(J)this.style.bottom=`${this._offset}px`;else if(K)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(q)this.style.left="0",this.style.right="0";if(K&&q)this.style.margin="auto";else if(K)this.style.marginTop="auto",this.style.marginBottom="auto";else if(q)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=(K)=>$.some((q)=>K.matches?.(q))||K.tagName?.startsWith("FIG-")&&!J.includes(K.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"}}}j0("fig-dialog",R0,{extends:"dialog"});class z0 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(A1()+1);let Q=this.hasAttribute("popover")&&typeof this.showPopover==="function"&&!this.matches?.(":popover-open");if(Q)try{this.showPopover()}catch(J){}if(!Q&&!super.open)try{this.show()}catch(J){}this.setupObservers(),document.addEventListener("pointerdown",this._boundOutsidePointerDown,!0),this._wasDragged=!1,this.queueReposition(),this._isPopupActive=!0;let $=this.resolveAnchor();if($?.classList)$.classList.add("has-popup-open")}hidePopup(){let Q=this.resolveAnchor();if(Q?.classList)Q.classList.remove("has-popup-open");if(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(super.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=(K)=>$.some((q)=>K.matches?.(q))||K.tagName?.startsWith("FIG-")&&!J.includes(K.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",K="center",q=null;if($.length>=2){if(J.has($[0]))j=$[0];if(Z.has($[1]))K=$[1];return{vertical:j,horizontal:K,shorthand:q}}if($.length===1){let _=$[0];if(_==="top"||_==="bottom")j=_,q=_;else if(_==="left"||_==="right")K=_,q=_;else if(_==="center")j="center",K="center"}return{vertical:j,horizontal:K,shorthand:q}}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 K=parseFloat(J);return Number.isFinite(K)?K: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 K=J==="left"||J==="right"?["top","bottom"]:["left","right"];return[{v:Q,h:$,s:J},{v:Q,h:$,s:Z[J]},{v:Q,h:$,s:K[0]},{v:Q,h:$,s:K[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,K){let q,_;if(K==="left"||K==="right")return _=K==="left"?Q.left-$.width-j.xPx:Q.right+j.xPx,q=Q.top,{top:q,left:_};if(K==="top"||K==="bottom")return q=K==="top"?Q.top-$.height-j.yPx:Q.bottom+j.yPx,_=Q.left,{top:q,left:_};if(J==="top")q=Q.top-$.height-j.yPx;else if(J==="bottom")q=Q.bottom+j.yPx;else q=Q.top+(Q.height-$.height)/2;if(J==="center")if(Z==="left")_=Q.left-$.width-j.xPx;else if(Z==="right")_=Q.right+j.xPx;else _=Q.left+(Q.width-$.width)/2;else if(Z==="left")_=Q.left+j.xPx;else if(Z==="right")_=Q.right-$.width-j.xPx;else _=Q.left+(Q.width-$.width)/2;return{top:q,left:_}}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 K=this.getAttribute("variant");if(!(K==="popover"||K==="tooltip")||!Q){this.style.removeProperty("--fig-popup-beak-offset"),this.removeAttribute("data-beak-side");return}let _=this.oppositeSide(j);this.setAttribute("data-beak-side",_);let X=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(_==="top"||_==="bottom"){L=X-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,K=Q.left+$.width,q=Q.top+$.height,_=Math.max(0,J.left-Q.left),X=Math.max(0,J.top-Q.top),Y=Math.max(0,K-(Z-J.right)),N=Math.max(0,q-(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,K=Math.max(J.left,window.innerWidth-$.width-J.right),q=Math.max(J.top,window.innerHeight-$.height-J.bottom);return{left:Math.min(K,Math.max(Z,Q.left)),top:Math.min(q,Math.max(j,Q.top))}}positionPopup(){if(!this.open||!super.open)return;let Q=this.getBoundingClientRect(),$=this.parseOffset(),{vertical:J,horizontal:Z,shorthand:j}=this.parsePosition(),K=this.resolveAnchor(),q=this.parseViewportMargins();if(!K){this.updatePopoverBeak(null,Q,0,0,"top");let D={left:q.left+(window.innerWidth-q.right-q.left-Q.width)/2,top:q.top+(window.innerHeight-q.bottom-q.top-Q.height)/2},R=this.clamp(D,Q,q);this.style.left=`${R.left}px`,this.style.top=`${R.top}px`;return}let _=K.getBoundingClientRect(),X=this.getPlacementCandidates(J,Z,j),Y=null,N="top",W=Number.POSITIVE_INFINITY;for(let{v:D,h:R,s:L}of X){let B=this.computeCoords(_,Q,D,R,$,L),M=this.getPlacementSide(D,R,L);if(L){let O=this.clamp(B,Q,q);if(L==="left"||L==="right"?B.left>=q.left&&B.left+Q.width<=window.innerWidth-q.right:B.top>=q.top&&B.top+Q.height<=window.innerHeight-q.bottom){this.style.left=`${O.left}px`,this.style.top=`${O.top}px`,this.updatePopoverBeak(_,Q,O.left,O.top,M);return}let H=this.overflowScore(B,Q,q);if(H<W)W=H,Y=O,N=M}else{if(this.fits(B,Q,q)){this.style.left=`${B.left}px`,this.style.top=`${B.top}px`,this.updatePopoverBeak(_,Q,B.left,B.top,M);return}let O=this.overflowScore(B,Q,q);if(O<W)W=O,Y=B,N=M}}let G=this.clamp(Y||{left:0,top:0},Q,q);this.style.left=`${G.left}px`,this.style.top=`${G.top}px`,this.updatePopoverBeak(_,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()}}j0("fig-popup",z0,{extends:"dialog"});class D0 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",D0);class H0 extends HTMLElement{#$;#Q;constructor(){super();this.#$=this.handleClick.bind(this),this.#Q=this.#K.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)}#K(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((K)=>K.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",H0);class F0 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",F0);class P0 extends HTMLElement{#$=null;#Q=this.handleClick.bind(this);#J=null;#K=null;#j=0;#Z=!1;#_=!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.#A(),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.#K?.disconnect(),this.#K=null,this.#j)cancelAnimationFrame(this.#j),this.#j=0;this.#Z=!1,this.#_=!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.removeAttribute("selected")}this.#$=Q instanceof HTMLElement&&this.contains(Q)?Q:null,this.#N()}get value(){return this.getAttribute("value")||""}set value(Q){if(Q===null||Q===void 0){this.removeAttribute("value");return}this.setAttribute("value",String(Q))}#X(Q){this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0}))}#q(Q){let $=Q.getAttribute("value");if($!==null){let J=$.trim();if(J.length>0)return J}return Q.textContent?.trim()||""}#Y(){let Q=this.querySelectorAll("fig-segment");for(let $ of Q)if($.hasAttribute("selected"))return $;return null}#W(Q){let $=String(Q??"").trim();if(!$)return!1;let J=this.querySelectorAll("fig-segment");for(let Z of J){let j=this.#q(Z);if(!j)continue;if(j===$)return this.selectedSegment=Z,!0}return!1}#U(){let Q=this.getAttribute("animated");if(Q===null)return!1;if(Q==="")return!0;return Q.trim().toLowerCase()==="true"}#N({forceInstant:Q=!1}={}){if(this.#Z=this.#Z||Q,this.#j)return;this.#j=requestAnimationFrame(()=>{this.#j=0;let $=this.#Z;this.#Z=!1,this.#L({forceInstant:$})})}#L({forceInstant:Q=!1}={}){let $=this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false",J=this.#U(),Z=this.#$&&this.contains(this.#$)?this.#$:this.#Y();if($||!J){if(this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready"),!J||$)this.#_=!1;return}if(!Z){if(this.#_)return;this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready");return}let j=this.getBoundingClientRect(),K=Z.getBoundingClientRect();if(j.width<=0||K.width<=0){if(this.#_)return;this.style.setProperty("--seg-indicator-opacity","0"),this.style.setProperty("--seg-indicator-transition-duration","0ms"),this.removeAttribute("data-indicator-ready");return}let q=Math.max(0,K.left-j.left);this.style.setProperty("--seg-indicator-x",`${q}px`),this.style.setProperty("--seg-indicator-w",`${K.width}px`),this.style.setProperty("--seg-indicator-opacity","1"),this.style.setProperty("--seg-indicator-transition-duration",!this.#_||Q?"0ms":"150ms"),this.setAttribute("data-indicator-ready","true"),this.#_=!0}#G(){this.#K?.disconnect(),this.#K=new ResizeObserver(()=>{this.#N()}),this.#M()}#M(){if(!this.#K)return;this.#K.disconnect(),this.#K.observe(this),this.querySelectorAll("fig-segment").forEach((Q)=>{this.#K?.observe(Q)})}#B({enforceFallback:Q=!1}={}){let $=this.querySelectorAll("fig-segment");if($.length===0){this.#$=null,this.#N({forceInstant:!0});return}let J=this.getAttribute("value"),Z=J?.trim()??"";if(J!==null){if(Z!==J){this.setAttribute("value",Z);return}if(Z&&this.#W(Z))return}let j=this.#Y();if(j){this.selectedSegment=j;return}if(Q)this.selectedSegment=$[0]}#A(){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.#O(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false"),this.#M(),this.#B({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;let $=Q.target.closest("fig-segment");if(!$||!this.contains($))return;let J=this.selectedSegment,Z=this.value;this.selectedSegment=$;let j=this.#q($);if(j)this.setAttribute("value",j);else this.removeAttribute("value");let K=this.value;if(J!==$||Z!==K)this.#X(K)}#O(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.#O(J!==null&&J!=="false"),this.#N({forceInstant:!0});return}if(Q==="value"){this.#B({enforceFallback:!1});return}if(Q==="animated"){if(!this.#U())this.#_=!1;this.#N({forceInstant:!0});return}if(Q==="sizing")this.#N({forceInstant:!0})}}customElements.define("fig-segmented-control",P0);class k0 extends HTMLElement{static get observedAttributes(){return["options","value","disabled","full","sizing"]}#$="segments";#Q=0;#J=null;#K=[];#j=null;#Z=!1;#_(Q){let $=Q?.detail;if(typeof $==="string")return $;let J=Q?.currentTarget?.value??Q?.target?.value??this.getAttribute("value");if(J===null||J===void 0)return null;return String(J)}connectedCallback(){this.#X(),this.#q(),this.#L(),requestAnimationFrame(()=>{requestAnimationFrame(()=>this.#B())})}disconnectedCallback(){this.#J?.disconnect(),this.#J=null}get value(){return this.getAttribute("value")||""}set value(Q){if(Q===null||Q===void 0)this.removeAttribute("value");else this.setAttribute("value",String(Q))}get options(){return this.#K.slice()}set options(Q){if(Array.isArray(Q)){let J=Q.some((Z)=>String(Z).includes(","))?JSON.stringify(Q):Q.join(",");this.setAttribute("options",J)}else this.setAttribute("options",String(Q||""))}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="options"){this.#X(),this.#W();return}if(Q==="value"){this.#U();return}if(Q==="disabled"){this.#N("disabled");return}if(Q==="full"){this.#N("full");return}if(Q==="sizing")this.#N("sizing"),this.#W()}#X(){let Q=this.getAttribute("options")||"";if(Q.startsWith("["))try{this.#K=JSON.parse(Q);return}catch{}let $=Q.includes(`
|
|
36
36
|
`)?`
|
|
37
37
|
`:",";this.#K=Q.split($).map((J)=>J.trim()).filter(Boolean)}#q(){if(this.innerHTML="",this.#K.length===0)return;let Q=document.createElement("fig-segmented-control");if(Q.setAttribute("sizing",this.getAttribute("sizing")||"equal"),this.hasAttribute("disabled"))Q.setAttribute("disabled","");if(this.hasAttribute("full"))Q.setAttribute("full","");let $=this.getAttribute("value");for(let J of this.#K){let Z=document.createElement("fig-segment");if(Z.setAttribute("value",J),Z.textContent=J,$===J)Z.setAttribute("selected","true");Q.appendChild(Z)}if($)Q.setAttribute("value",$);Q.addEventListener("input",(J)=>{if(J.stopPropagation(),this.#Z)return;let Z=this.#_(J);if(Z===null)return;this.#Z=!0,this.setAttribute("value",Z),this.#Z=!1,this.dispatchEvent(new CustomEvent("input",{detail:Z,bubbles:!0,composed:!0}))}),Q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#Z)return;let Z=this.#_(J);if(Z===null)return;this.dispatchEvent(new CustomEvent("change",{detail:Z,bubbles:!0,composed:!0}))}),this.appendChild(Q),this.#j=Q,this.#$="segments"}#Y(){if(this.innerHTML="",this.#K.length===0)return;let Q=document.createElement("fig-dropdown");if(this.hasAttribute("disabled"))Q.setAttribute("disabled","");let $=this.getAttribute("value");for(let J of this.#K){let Z=document.createElement("option");if(Z.value=J,Z.textContent=J,$===J)Z.selected=!0;Q.appendChild(Z)}if($)Q.setAttribute("value",$);Q.addEventListener("input",(J)=>{if(J.stopPropagation(),this.#Z)return;let Z=this.#_(J);if(!Z)return;this.#Z=!0,this.setAttribute("value",Z),this.#Z=!1,this.dispatchEvent(new CustomEvent("input",{detail:Z,bubbles:!0,composed:!0}))}),Q.addEventListener("change",(J)=>{if(J.stopPropagation(),this.#Z)return;let Z=this.#_(J);if(!Z)return;this.dispatchEvent(new CustomEvent("change",{detail:Z,bubbles:!0,composed:!0}))}),this.appendChild(Q),this.#j=Q,this.#$="dropdown"}#W(){if(this.#$==="segments")this.#q(),requestAnimationFrame(()=>{requestAnimationFrame(()=>this.#B())});else this.#Y()}#U(){if(!this.#j||this.#Z)return;let Q=this.getAttribute("value")||"";this.#j.value=Q}#N(Q){if(!this.#j)return;if(this.hasAttribute(Q))this.#j.setAttribute(Q,this.getAttribute(Q)||"");else this.#j.removeAttribute(Q)}#L(){this.#J?.disconnect(),this.#J=new ResizeObserver(()=>{this.#B()}),this.#J.observe(this)}#G(Q){let $=document.createRange();$.selectNodeContents(Q);let J=$.getBoundingClientRect().width,j=Q.getBoundingClientRect().width,K=getComputedStyle(Q),q=parseFloat(K.paddingLeft)||0,_=parseFloat(K.paddingRight)||0,X=j-q-_;return J>X+0.5}#M(){let Q=this.querySelectorAll("fig-segment");for(let $ of Q)if(this.#G($))return!0;return!1}#B(){if(this.#K.length<=1)return;if(this.#$==="segments"){let Q=this.#j;if(Q&&Q.scrollWidth>Q.clientWidth+1||this.#M())this.#Q=this.clientWidth,this.#Y()}else if(this.#Q>0&&this.clientWidth>=this.#Q)this.#q(),requestAnimationFrame(()=>{requestAnimationFrame(()=>{let Q=this.#j;if(Q&&Q.scrollWidth>Q.clientWidth+1||this.#M())this.#Y()})})}}customElements.define("fig-options",k0);class E0 extends HTMLElement{#$=!1;#Q=!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"}};#K;#j;#Z;#_;constructor(){super();this.initialInnerHTML=this.innerHTML,this.#K=(Q)=>{Q.stopPropagation(),this.#A()},this.#j=(Q)=>{Q.stopPropagation(),this.#O()},this.#Z=(Q)=>{Q.stopPropagation(),this.#q()},this.#_=(Q)=>{Q.stopPropagation(),this.#R()}}#X(){let 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"):"##";let $=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=Q===null||typeof Q==="string"&&Q.trim()==="",this.value=this.#G(Q),this.color)this.style.setProperty("--color",this.color);let J="",Z=`<div class="fig-slider-input-container" role="group">
|
|
38
38
|
<input
|
|
@@ -446,4 +446,4 @@ var U1=(Q,$)=>()=>(Q&&($=Q(Q=0)),$);var L1={};var N0=U1(()=>{/*! Vendored from @
|
|
|
446
446
|
`,this.#n(Q)}#n(Q){let $=Q.querySelector(".fig-fill-picker-webcam-video"),J=Q.querySelector(".fig-fill-picker-webcam-status"),Z=Q.querySelector(".fig-fill-picker-webcam-capture"),j=Q.querySelector(".fig-fill-picker-camera-select"),K=async(q=null)=>{try{let _={video:q?{deviceId:{exact:q}}:!0};if(this.#U.stream)this.#U.stream.getTracks().forEach((N)=>N.stop());this.#U.stream=await navigator.mediaDevices.getUserMedia(_),$.srcObject=this.#U.stream,$.style.display="block",J.style.display="none";let Y=(await navigator.mediaDevices.enumerateDevices()).filter((N)=>N.kind==="videoinput");if(Y.length>1)j.style.display="block",j.innerHTML=Y.map((N,W)=>`<option value="${N.deviceId}">${N.label||`Camera ${W+1}`}</option>`).join("")}catch(_){console.error("Webcam error:",_.name,_.message);let X="Camera access denied";if(_.name==="NotAllowedError")X="Camera permission denied";else if(_.name==="NotFoundError")X="No camera found";else if(_.name==="NotReadableError")X="Camera in use by another app";else if(_.name==="OverconstrainedError")X="Camera constraints not supported";else if(!window.isSecureContext)X="Camera requires secure context";J.innerHTML=`<span>${X}</span>`,J.style.display="flex",$.style.display="none"}};this.#H=new MutationObserver(()=>{if(Q.style.display!=="none"&&!this.#U.stream)K()}),this.#H.observe(Q,{attributes:!0,attributeFilter:["style"]}),j.addEventListener("change",(q)=>{K(q.target.value)}),Z.addEventListener("click",()=>{if(!this.#U.stream)return;let q=document.createElement("canvas");q.width=$.videoWidth,q.height=$.videoHeight,q.getContext("2d").drawImage($,0,0),this.#U.snapshot=q.toDataURL("image/png"),this.#Y.url=this.#U.snapshot,this.#j="image",this.#F(),this.#x(),this.#E("image");let _=this.#J.querySelector("fig-tabs");_.value="image"})}#o(Q){let $=Q.h/360,J=Q.s/100,Z=Q.v/100,j,K,q,_=Math.floor($*6),X=$*6-_,Y=Z*(1-J),N=Z*(1-X*J),W=Z*(1-(1-X)*J);switch(_%6){case 0:j=Z,K=W,q=Y;break;case 1:j=N,K=Z,q=Y;break;case 2:j=Y,K=Z,q=W;break;case 3:j=Y,K=N,q=Z;break;case 4:j=W,K=Y,q=Z;break;case 5:j=Z,K=Y,q=N;break}return{r:Math.round(j*255),g:Math.round(K*255),b:Math.round(q*255)}}#e(Q){let $=Q.r/255,J=Q.g/255,Z=Q.b/255,j=Math.max($,J,Z),K=Math.min($,J,Z),q=j-K,_=0,X=j===0?0:q/j,Y=j;if(j!==K){switch(j){case $:_=(J-Z)/q+(J<Z?6:0);break;case J:_=(Z-$)/q+2;break;case Z:_=($-J)/q+4;break}_/=6}return{h:_*360,s:X*100,v:Y*100,a:1}}#s(Q){if(!Q||typeof Q.h!=="number"||typeof Q.s!=="number"||typeof Q.v!=="number")return"#D9D9D9";let $=this.#o(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)}`}#j0(Q){let $=parseInt(Q.slice(1,3),16),J=parseInt(Q.slice(3,5),16),Z=parseInt(Q.slice(5,7),16);return this.#e({r:$,g:J,b:Z})}#W0(Q,$=1){let J=parseInt(Q.slice(1,3),16),Z=parseInt(Q.slice(3,5),16),j=parseInt(Q.slice(5,7),16);return`rgba(${J}, ${Z}, ${j}, ${$})`}#U0(Q,$=1){let J=+(parseInt(Q.slice(1,3),16)/255).toFixed(4),Z=+(parseInt(Q.slice(3,5),16)/255).toFixed(4),j=+(parseInt(Q.slice(5,7),16)/255).toFixed(4);return`color(display-p3 ${J} ${Z} ${j} / ${$})`}#L0(Q){let $=Q.r/255,J=Q.g/255,Z=Q.b/255,j=Math.max($,J,Z),K=Math.min($,J,Z),q,_,X=(j+K)/2;if(j===K)q=_=0;else{let Y=j-K;switch(_=X>0.5?Y/(2-j-K):Y/(j+K),j){case $:q=((J-Z)/Y+(J<Z?6:0))/6;break;case J:q=((Z-$)/Y+2)/6;break;case Z:q=(($-J)/Y+4)/6;break}}return{h:q*360,s:_*100,l:X*100}}#G0(Q){let $=Q.h/360,J=Q.s/100,Z=Q.l/100,j,K,q;if(J===0)j=K=q=Z;else{let _=(N,W,G)=>{if(G<0)G+=1;if(G>1)G-=1;if(G<0.16666666666666666)return N+(W-N)*6*G;if(G<0.5)return W;if(G<0.6666666666666666)return N+(W-N)*(0.6666666666666666-G)*6;return N},X=Z<0.5?Z*(1+J):Z+J-Z*J,Y=2*Z-X;j=_(Y,X,$+0.3333333333333333),K=_(Y,X,$),q=_(Y,X,$-0.3333333333333333)}return{r:Math.round(j*255),g:Math.round(K*255),b:Math.round(q*255)}}#Y0(Q){let $=(W)=>{return W=W/255,W<=0.04045?W/12.92:Math.pow((W+0.055)/1.055,2.4)},J=$(Q.r),Z=$(Q.g),j=$(Q.b),K=0.4122214708*J+0.5363325363*Z+0.0514459929*j,q=0.2119034982*J+0.6806995451*Z+0.1073969566*j,_=0.0883024619*J+0.2817188376*Z+0.6299787005*j,X=Math.cbrt(K),Y=Math.cbrt(q),N=Math.cbrt(_);return{l:0.2104542553*X+0.793617785*Y-0.0040720468*N,a:1.9779984951*X-2.428592205*Y+0.4505937099*N,b:0.0259040371*X+0.7827717662*Y-0.808675766*N}}#M0(Q){let $=this.#Y0(Q);return{l:$.l,c:Math.sqrt($.a*$.a+$.b*$.b),h:(Math.atan2($.b,$.a)*180/Math.PI+360)%360}}#N0(Q){let $=Q.l+0.3963377774*Q.a+0.2158037573*Q.b,J=Q.l-0.1055613458*Q.a-0.0638541728*Q.b,Z=Q.l-0.0894841775*Q.a-1.291485548*Q.b,j=$*$*$,K=J*J*J,q=Z*Z*Z,_=(X)=>{let Y=X<=0.0031308?12.92*X:1.055*Math.pow(X,0.4166666666666667)-0.055;return Math.round(Math.max(0,Math.min(1,Y))*255)};return{r:_(4.0767416621*j-3.3077115913*K+0.2309699292*q),g:_(-1.2684380046*j+2.6097574011*K-0.3413193965*q),b:_(-0.0041960863*j-0.7034186147*K+1.707614701*q)}}#B0(Q){let $=Q.h*Math.PI/180;return this.#N0({l:Q.l,a:Q.c*Math.cos($),b:Q.c*Math.sin($)})}#x(){this.#F(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:this.value}))}#u(){this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.value}))}get value(){let Q={type:this.#j,colorSpace:this.#Z};switch(this.#j){case"solid":return{...Q,color:this.#s(this.#_),alpha:this.#_.a,hsv:{...this.#_}};case"gradient":return{...Q,gradient:d(this.#q),css:this.#J0()};case"image":return{...Q,image:{...this.#Y}};case"video":return{...Q,video:{...this.#W}};case"webcam":return{...Q,image:{url:this.#U.snapshot,scaleMode:"fill",scale:50}};default:return{...Q,...this.#L[this.#j]}}}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.#D(),this.#F(),this.#J){if(!this.#O){if(this.#f(),this.#p(),this.#B)this.#B.setAttribute("value",this.#_.h);if(this.#A)this.#A.setAttribute("value",this.#_.a*100),this.#A.setAttribute("color",this.#s(this.#_))}}break;case"disabled":break}}}customElements.define("fig-fill-picker",e);class J1 extends HTMLElement{#$=null;#Q=null;#J=null;#K=this.#B.bind(this);#j=this.#A.bind(this);static get observedAttributes(){return["value","selected","disabled","alpha","control"]}get#Z(){return this.getAttribute("control")||"color"}connectedCallback(){this.#Y(),this.#G()}disconnectedCallback(){this.#_(),this.removeEventListener("click",this.#W)}#_(){if(this.#$)this.#$.removeEventListener("input",this.#K),this.#$.removeEventListener("change",this.#j);if(this.#J)this.#J.disconnect(),this.#J=null}#X(){if(this.#J)this.#J.disconnect(),this.#J=null;if(!this.#Q)return;this.#J=new MutationObserver(()=>{if(this.#Q?.hasAttribute("selected")&&this.#Q.getAttribute("selected")!=="false"){if(!this.hasAttribute("selected"))this.setAttribute("selected","")}else if(this.hasAttribute("selected"))this.removeAttribute("selected")}),this.#J.observe(this.#Q,{attributes:!0,attributeFilter:["selected"]})}get#q(){let Q=this.getAttribute("alpha");return Q===null||Q!=="false"}#Y(){let Q=this.#Z;if(Q==="add"||Q==="remove"){let q=Q==="add"?"var(--icon-add)":"var(--icon-minus)";this.innerHTML=`<fig-button icon variant="ghost"><span class="fig-mask-icon" style="--icon: ${q}"></span></fig-button>`,this.#$=null,this.#Q=null,this.addEventListener("click",this.#W);return}this.removeEventListener("click",this.#W);let $=(this.getAttribute("value")||"").trim(),J=this.#L($),Z=this.#N($),j=this.#q?"":'alpha="false"',K=Z<1?JSON.stringify({type:"solid",color:J,opacity:Math.round(Z*100)}):JSON.stringify({type:"solid",color:J});this.innerHTML=`
|
|
447
447
|
<fig-fill-picker mode="solid" ${j} value='${K}'>
|
|
448
448
|
<fig-chit background="${J}"></fig-chit>
|
|
449
|
-
</fig-fill-picker>`,this.#$=this.querySelector("fig-fill-picker"),this.#Q=this.querySelector("fig-chit"),this.#_(),this.#$?.addEventListener("input",this.#K),this.#$?.addEventListener("change",this.#j),this.#X()}#W=()=>{let Q=this.#Z;this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,composed:!0}))};#U(Q){if(!Q)return"#D9D9D9";let $=Q.replace("#","").trim();if($.length===3||$.length===4){let[J,Z,j]=$;return`#${J}${J}${Z}${Z}${j}${j}`.toUpperCase()}if($.length===6||$.length===8)return`#${$.slice(0,6)}`.toUpperCase();return"#D9D9D9"}#N(Q){if(!Q)return 1;let $=String(Q).trim();if($.startsWith("#")&&$.length===9)return parseInt($.slice(7,9),16)/255;let J=$.match(/rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*,\s*([\d.]+)\s*\)/i);if(J)return parseFloat(J[1]);return 1}#L(Q){if(!Q)return"#D9D9D9";let $=String(Q).trim();if($.startsWith("{"))try{let J=JSON.parse($);if(J?.color)return this.#L(J.color)}catch{}if($.startsWith("#"))return this.#U($);try{let{ctx:J}=M0(1,1);J.fillStyle="#000000",J.fillStyle=$;let Z=J.fillStyle;if(Z.startsWith("#"))return this.#U(Z);let j=Z.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/i);if(j){let K=(q)=>Math.max(0,Math.min(255,Number(q))).toString(16).padStart(2,"0");return`#${K(j[1])}${K(j[2])}${K(j[3])}`.toUpperCase()}}catch{}return"#D9D9D9"}#G(){let Q=this.getAttribute("value"),$=this.#L(Q),J=this.#N(Q);if(Q!==$&&J>=1){this.setAttribute("value",$);return}if(this.#$){let Z=J<1?{type:"solid",color:$,opacity:Math.round(J*100)}:{type:"solid",color:$};if(this.#$.setAttribute("value",JSON.stringify(Z)),this.#q)this.#$.removeAttribute("alpha");else this.#$.setAttribute("alpha","false");if(this.hasAttribute("disabled"))this.#$.setAttribute("disabled","");else this.#$.removeAttribute("disabled")}if(this.#Q)if(this.#Q.setAttribute("background",$),this.hasAttribute("disabled"))this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled")}#M(Q,$){let J=this.#L(Q?.color),Z=this.#L(this.getAttribute("value"));if(J!==Z)this.setAttribute("value",J);else this.#G();let j={color:this.value};if(this.#q){if(Q?.opacity!==void 0)j.opacity=Q.opacity;else if(Q?.alpha!==void 0)j.opacity=Math.round(Q.alpha*100)}this.dispatchEvent(new CustomEvent($,{bubbles:!0,cancelable:!0,composed:!0,detail:j}))}#B(Q){Q.stopPropagation(),this.#M(Q.detail,"input")}#A(Q){Q.stopPropagation(),this.#M(Q.detail,"change")}attributeChangedCallback(Q,$,J){if($===J)return;if(!this.isConnected)return;switch(Q){case"control":this.#Y();break;case"value":case"selected":case"disabled":this.#G();break}}get value(){return this.#L(this.getAttribute("value"))}set value(Q){if(Q===null||Q===void 0||Q===""){this.removeAttribute("value");return}this.setAttribute("value",this.#L(Q))}get selected(){return this.hasAttribute("selected")}set selected(Q){this.toggleAttribute("selected",Boolean(Q))}get disabled(){return this.hasAttribute("disabled")}set disabled(Q){this.toggleAttribute("disabled",Boolean(Q))}}customElements.define("fig-color-tip",J1);class Z1 extends HTMLElement{static get observedAttributes(){return["selected","disabled"]}connectedCallback(){if(this.setAttribute("role","option"),!this.hasAttribute("tabindex"))this.setAttribute("tabindex","0");if(this.setAttribute("aria-selected",this.hasAttribute("selected")?"true":"false"),this.hasAttribute("disabled"))this.setAttribute("aria-disabled","true")}attributeChangedCallback(Q){if(Q==="selected")this.setAttribute("aria-selected",this.hasAttribute("selected")?"true":"false");if(Q==="disabled")if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")this.setAttribute("aria-disabled","true"),this.setAttribute("tabindex","-1");else this.removeAttribute("aria-disabled"),this.setAttribute("tabindex","0")}}customElements.define("fig-choice",Z1);class j1 extends HTMLElement{#$=null;#Q=this.#B.bind(this);#J=this.#A.bind(this);#K=this.#R.bind(this);#j=null;#Z=null;#_=null;#X=null;#q=null;constructor(){super()}static get observedAttributes(){return["value","disabled","choice-element","drag","overflow","loop"]}get#Y(){return this.getAttribute("overflow")==="scrollbar"?"scrollbar":"buttons"}get#W(){let Q=this.getAttribute("drag");return Q===null||Q!=="false"}get#U(){return this.getAttribute("choice-element")||"fig-choice"}get choices(){return Array.from(this.querySelectorAll(this.#U))}get selectedChoice(){return this.#$}set selectedChoice(Q){if(Q&&!this.contains(Q))return;let $=this.choices;for(let Z of $){let j=Z===Q,K=Z.hasAttribute("selected");if(j&&!K)Z.setAttribute("selected","");else if(!j&&K)Z.removeAttribute("selected")}this.#$=Q;let J=Q?.getAttribute("value")??"";if(this.getAttribute("value")!==J){if(J)this.setAttribute("value",J)}this.#k(Q)}get value(){return this.#$?.getAttribute("value")??""}set value(Q){if(Q===null||Q===void 0||Q==="")return;this.setAttribute("value",String(Q))}connectedCallback(){this.setAttribute("role","listbox"),this.addEventListener("click",this.#Q),this.addEventListener("keydown",this.#J),this.addEventListener("scroll",this.#K),this.#D(),this.#H(),this.#E(),this.#z(),requestAnimationFrame(()=>{this.#L(),this.#R(),this.#N()})}#N(){let Q=()=>{if(!this.isConnected)return;if(this.#$)this.#k(this.#$,"auto")},$=()=>{let J=this.querySelectorAll("img, video");for(let Z of J){if(Z.tagName==="IMG"?Z.complete:Z.readyState>=1)continue;let j=()=>{Z.removeEventListener("load",j),Z.removeEventListener("loadedmetadata",j),Z.removeEventListener("error",j),Q()};Z.addEventListener("load",j),Z.addEventListener("loadedmetadata",j),Z.addEventListener("error",j)}};requestAnimationFrame(()=>{$(),Q()})}disconnectedCallback(){this.removeEventListener("click",this.#Q),this.removeEventListener("keydown",this.#J),this.removeEventListener("scroll",this.#K),this.#P(),this.#j?.disconnect(),this.#j=null,this.#Z?.disconnect(),this.#Z=null,this.#F()}attributeChangedCallback(Q,$,J){if(Q==="value"&&J!==$&&J)this.#G(J);if(Q==="disabled"){let Z=J!==null&&J!=="false",j=this.choices;for(let K of j)if(Z)K.setAttribute("aria-disabled","true"),K.setAttribute("tabindex","-1");else K.removeAttribute("aria-disabled"),K.setAttribute("tabindex","0")}if(Q==="choice-element")requestAnimationFrame(()=>this.#L());if(Q==="drag")if(this.#W)this.#H();else this.#P();if(Q==="overflow")this.#D()}#L(){let Q=this.choices;if(!Q.length){this.#$=null;return}let $=this.getAttribute("value");if($&&this.#G($))return;let J=Q.find((Z)=>Z.hasAttribute("selected"));if(J){this.selectedChoice=J;return}this.selectedChoice=Q[0]}#G(Q){let $=this.choices;for(let J of $)if(J.getAttribute("value")===Q)return this.selectedChoice=J,!0;return!1}#M(Q){let $=this.#U,J=Q;while(J&&J!==this){if(J.matches($))return J;J=J.parentElement}return null}#B(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;let $=this.#M(Q.target);if(!$)return;if($.hasAttribute("disabled")&&$.getAttribute("disabled")!=="false")return;this.selectedChoice=$,this.#O()}#A(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;let $=this.choices.filter((K)=>!K.hasAttribute("disabled")||K.getAttribute("disabled")==="false");if(!$.length)return;let J=$.indexOf(this.#$),Z=J,j=this.hasAttribute("loop");switch(Q.key){case"ArrowDown":case"ArrowRight":if(Q.preventDefault(),J<$.length-1)Z=J+1;else if(j)Z=0;break;case"ArrowUp":case"ArrowLeft":if(Q.preventDefault(),J>0)Z=J-1;else if(j)Z=$.length-1;break;case"Home":Q.preventDefault(),Z=0;break;case"End":Q.preventDefault(),Z=$.length-1;break;case"Enter":case" ":if(Q.preventDefault(),document.activeElement?.matches(this.#U)){let K=this.#M(document.activeElement);if(K&&K!==this.#$)this.selectedChoice=K,this.#O()}return;default:return}if(Z!==J&&$[Z])this.selectedChoice=$[Z],$[Z].focus(),this.#O()}#O(){let Q=this.value;this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0}))}#R(){if(this.#Y==="scrollbar")return;let Q=this.getAttribute("layout")==="horizontal",$=2;if(Q){let J=this.scrollLeft<=$,Z=this.scrollLeft+this.clientWidth>=this.scrollWidth-$;this.classList.toggle("overflow-start",!J),this.classList.toggle("overflow-end",!Z)}else{let J=this.scrollTop<=$,Z=this.scrollTop+this.clientHeight>=this.scrollHeight-$;this.classList.toggle("overflow-start",!J),this.classList.toggle("overflow-end",!Z)}}#z(){this.#Z?.disconnect(),this.#Z=new ResizeObserver(()=>{this.#R()}),this.#Z.observe(this)}#H(){if(this.#q?.bound)return;if(!this.#W)return;let Q=(K)=>{if(K.button!==0)return;if(!(this.getAttribute("layout")==="horizontal"?this.scrollWidth>this.clientWidth:this.scrollHeight>this.clientHeight))return;this.#q.active=!0,this.#q.didDrag=!1,this.#q.startX=K.clientX,this.#q.startY=K.clientY,this.#q.scrollLeft=this.scrollLeft,this.#q.scrollTop=this.scrollTop,this.style.cursor="grab",this.style.userSelect="none"},$=(K)=>{if(!this.#q.active)return;let q=this.getAttribute("layout")==="horizontal",_=K.clientX-this.#q.startX,X=K.clientY-this.#q.startY;if(!this.#q.didDrag&&Math.abs(q?_:X)>3)this.#q.didDrag=!0,this.style.cursor="grabbing",this.setPointerCapture(K.pointerId);if(!this.#q.didDrag)return;if(q)this.scrollLeft=this.#q.scrollLeft-_;else this.scrollTop=this.#q.scrollTop-X},J=(K)=>{if(!this.#q.active)return;let q=this.#q.didDrag;if(this.#q.active=!1,this.#q.didDrag=!1,this.style.cursor="",this.style.userSelect="",K.pointerId!==void 0)try{this.releasePointerCapture(K.pointerId)}catch{}if(q)K.preventDefault(),K.stopPropagation()},Z=(K)=>{if(this.#q?.suppressClick)K.stopPropagation(),K.preventDefault(),this.#q.suppressClick=!1},j=(K)=>{if(this.#q?.didDrag)this.#q.suppressClick=!0,setTimeout(()=>{if(this.#q)this.#q.suppressClick=!1},0)};this.#q={active:!1,didDrag:!1,suppressClick:!1,startX:0,startY:0,scrollLeft:0,scrollTop:0,bound:!0,onPointerDown:Q,onPointerMove:$,onPointerUp:J,onClick:Z,onPointerUpCapture:j},this.addEventListener("pointerdown",Q),window.addEventListener("pointermove",$),window.addEventListener("pointerup",J),this.addEventListener("pointerup",j,!0),this.addEventListener("click",Z,!0)}#P(){if(!this.#q?.bound)return;this.removeEventListener("pointerdown",this.#q.onPointerDown),window.removeEventListener("pointermove",this.#q.onPointerMove),window.removeEventListener("pointerup",this.#q.onPointerUp),this.removeEventListener("pointerup",this.#q.onPointerUpCapture,!0),this.removeEventListener("click",this.#q.onClick,!0),this.style.cursor="",this.style.userSelect="",this.#q=null}#D(){if(this.#Y==="scrollbar")this.#F();else this.#S()}#F(){this.#_?.remove(),this.#X?.remove(),this.#_=null,this.#X=null,this.classList.remove("overflow-start","overflow-end")}#S(){if(this.#_)return;let Q=()=>{let $=document.createElement("span");return $.className="fig-mask-icon fig-chooser-nav-chevron",$.style.setProperty("--icon","var(--icon-chevron)"),$.style.setProperty("--size","1rem"),$};this.#_=document.createElement("button"),this.#_.className="fig-chooser-nav-start",this.#_.setAttribute("tabindex","-1"),this.#_.setAttribute("aria-label","Scroll back"),this.#_.appendChild(Q()),this.#X=document.createElement("button"),this.#X.className="fig-chooser-nav-end",this.#X.setAttribute("tabindex","-1"),this.#X.setAttribute("aria-label","Scroll forward"),this.#X.appendChild(Q()),this.#_.addEventListener("pointerup",($)=>{$.stopPropagation(),this.#I(-1)}),this.#X.addEventListener("pointerup",($)=>{$.stopPropagation(),this.#I(1)}),this.prepend(this.#_),this.append(this.#X)}#I(Q){let $=this.getAttribute("layout")==="horizontal",Z=($?this.clientWidth:this.clientHeight)*0.8*Q;this.scrollBy({[$?"left":"top"]:Z,behavior:"smooth"})}#k(Q,$="smooth"){if(!Q)return;requestAnimationFrame(()=>{if(!Q.isConnected)return;let J=this.scrollHeight>this.clientHeight,Z=this.scrollWidth>this.clientWidth;if(!Z&&!J)return;let j=Q.getBoundingClientRect(),K=this.getBoundingClientRect(),q={behavior:$};if(J){let _=j.top-K.top+this.scrollTop+j.height/2;q.top=_-this.clientHeight/2}if(Z){let _=j.left-K.left+this.scrollLeft+j.width/2;q.left=_-this.clientWidth/2}this.scrollTo(q)})}#E(){this.#j?.disconnect(),this.#j=new MutationObserver(()=>{let Q=this.choices;if(this.#$&&!Q.includes(this.#$))this.#$=null,this.#L();else if(!this.#$&&Q.length)this.#L()}),this.#j.observe(this,{childList:!0,subtree:!0})}}customElements.define("fig-chooser",j1);class K1 extends HTMLElement{static observedAttributes=["color","selected","disabled","drag","drag-surface","drag-axes","drag-snapping","value","type","control","hit-area","hit-area-mode"];#$=!1;#Q=!1;#J=null;#K=!1;#j=null;#Z=null;get#_(){return this.getAttribute("control")||null}get#X(){return this.#_==="add"||this.#_==="remove"}get#q(){return this.classList.contains("fig-input-gradient-ghost")}get#Y(){let Q=this.getAttribute("drag");return Q!==null&&Q!=="false"}get#W(){let Q=(this.getAttribute("drag-axes")||"x,y").toLowerCase();return{x:Q.includes("x"),y:Q.includes("y")}}get#U(){let Q=this.getAttribute("drag-snapping");if(Q===null)return"false";let $=Q.trim().toLowerCase();if($==="modifier")return"modifier";if($===""||$==="true")return"true";return"false"}#N(Q){let $=this.#U;if($==="true")return!0;if($==="modifier")return!!Q;return!1}#L(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}#G(Q,$){if(Math.abs(Q-$)<0.1){let Z=(Q+$)/2;return{x:Z,y:Z}}if(Math.abs(1-Q-$)<0.1)return{x:Q,y:1-Q};return{x:Q,y:$}}#M(){let Q=this.getAttribute("drag-surface");if(!Q||Q==="parent")return this.parentElement;return this.closest(Q)}get value(){let Q=this.#M();if(!Q)return"0% 0%";let $=Q.getBoundingClientRect(),J=this.offsetWidth/2,Z=this.offsetHeight/2,j=parseFloat(this.style.left)||0,K=parseFloat(this.style.top)||0,q=$.width>0?(j+J)/$.width*100:0,_=$.height>0?(K+Z)/$.height*100:0;return`${Math.round(q)}% ${Math.round(_)}%`}set value(Q){this.setAttribute("value",Q??"0% 0%")}#B(Q){let $=Q==null?"":String(Q).trim();if(!$)return{xPct:0,yPct:0};let J=$.split(/[\s,]+/).filter(Boolean),Z=(q)=>{if(!q)return 0;let _=q.includes("px"),X=q.includes("%"),Y=parseFloat(q.replace(/[%px]/g,""));if(!Number.isFinite(Y))return 0;if(_)return{px:Y};if(X||Math.abs(Y)>1)return Math.max(0,Math.min(100,Y));return Math.max(0,Math.min(100,Y*100))},j=Z(J[0]),K=Z(J[1]??J[0]);return{xToken:j,yToken:K}}#A(Q){let $=this.#M();if(!$)return;let{xToken:J,yToken:Z}=this.#B(Q),j=$.getBoundingClientRect(),K=this.offsetWidth/2,q=this.offsetHeight/2,_=(Y,N,W)=>{if(Y&&typeof Y==="object"&&"px"in Y)return Math.max(-W,Math.min(N-W,Y.px-W));let D=(typeof Y==="number"?Y:0)/100*N;return Math.max(-W,Math.min(N-W,D-W))},X=this.#W;if(X.x)this.style.left=`${Math.round(_(J,j.width,K))}px`;if(X.y)this.style.top=`${Math.round(_(Z,j.height,q))}px`}#O(){this.#K=!0,this.setAttribute("value",this.value),this.#K=!1}get#R(){return this.getAttribute("hit-area-mode")||"handle"}#z(){let Q=this.getAttribute("hit-area");if(!Q)return null;let $=Q.trim().split(/\s+/),J=0,Z=0,j=!1,K=[];for(let q of $){if(q==="circle"){j=!0;continue}let _=parseFloat(q);if(Number.isFinite(_))K.push(_)}if(K.length>=2)J=K[0],Z=K[1];else if(K.length===1)J=K[0],Z=K[0];else return null;return{vPad:J,hPad:Z,circle:j}}#H(){let Q=this.#z();if(!Q){if(this.#Z)this.#Z.remove(),this.#Z=null;this.style.removeProperty("--fig-handle-hit-area-size");return}if(!this.#Z){let $=document.createElement("div");$.classList.add("fig-handle-hit-area"),$.addEventListener("pointerdown",(J)=>this.#P(J)),this.prepend($),this.#Z=$}if(this.style.setProperty("--fig-handle-hit-area-size",String(Q.hPad*2)),Q.circle)this.#Z.style.borderRadius="50%";else this.#Z.style.borderRadius="inherit"}#P(Q){if(this.hasAttribute("disabled"))return;if(Q.target!==this.#Z)return;if(this.#R==="delegate")Q.preventDefault(),Q.stopPropagation(),this.dispatchEvent(new CustomEvent("hitareadown",{bubbles:!0,detail:{originalEvent:Q}}));else this.#E(Q)}connectedCallback(){if(!this.hasAttribute("type"))this.setAttribute("type","canvas");this.#I(),this.#H(),this.addEventListener("click",this.#D),document.addEventListener("pointerdown",this.#F),document.addEventListener("keydown",this.#S);let Q=this.getAttribute("value");if(Q)this.#A(Q);if(this.#X)this.#C()}disconnectedCallback(){if(this.#k(),this.#w(),this.#Z)this.#Z.remove(),this.#Z=null;this.removeEventListener("click",this.#D),document.removeEventListener("pointerdown",this.#F),document.removeEventListener("keydown",this.#S)}select(){if(this.hasAttribute("disabled"))return;if(this.setAttribute("selected",""),this.getAttribute("type")==="color"&&!this.#$)this.#C()}deselect(){this.removeAttribute("selected"),this.#w()}#D=(Q)=>{if(this.#X)return;if(this.#Q){this.#Q=!1;return}this.select()};#F=(Q)=>{if(this.#X)return;if(this.contains(Q.target))return;if(this.#j&&Q.target.closest?.("dialog, [popover]"))return;this.deselect()};#S=(Q)=>{if(Q.key!=="Enter")return;if(!this.hasAttribute("selected"))return;if(this.getAttribute("type")!=="color")return;if(this.#j)return;Q.preventDefault(),this.#C()};attributeChangedCallback(Q,$,J){if(Q==="color"){if(!J||J==="false"||J==="true")this.style.removeProperty("--fill");else this.style.setProperty("--fill",J);if(this.#j&&J)this.#j.setAttribute("value",J)}if(Q==="drag")this.#I();if(Q==="hit-area")this.#H();if(Q==="value"&&!this.#K&&!this.#$)this.#A(J);if(Q==="control")if(this.#X)this.#w(),this.#C();else this.#w()}#I(){if(this.#Y&&!this.#J)this.#J=(Q)=>this.#E(Q),this.addEventListener("pointerdown",this.#J);else if(!this.#Y&&this.#J)this.#k()}#k(){if(this.#J)this.removeEventListener("pointerdown",this.#J),this.#J=null;this.#$=!1}#E(Q){if(!this.#Y||this.hasAttribute("disabled"))return;Q.preventDefault();let $=this.#M();if(!$)return;this.#$=!0;let J=this.#W,Z=this.offsetWidth,j=this.offsetHeight,K=null,q=this.getBoundingClientRect(),_=q.left+q.width/2,X=q.top+q.height/2,Y=Q.clientX-_,N=Q.clientY-X,W=Q.clientX,G=Q.clientY,D=3,R=(M,O,A=!1)=>{let H=$.getBoundingClientRect();K=H;let T=parseFloat(this.style.left)||0,S=parseFloat(this.style.top)||0,f=M-Y-H.left-Z/2,I=O-N-H.top-j/2,c=Math.max(-Z/2,Math.min(H.width-Z/2,f)),o=Math.max(-j/2,Math.min(H.height-j/2,I)),h=H.width>0?((J.x?c:T)+Z/2)/H.width:0.5,g=H.height>0?((J.y?o:S)+j/2)/H.height:0.5;if(this.#N(A)){if(J.x)h=this.#L(h);if(J.y)g=this.#L(g);if(J.x&&J.y){let b=this.#G(h,g);h=b.x,g=b.y}}if(J.x){let b=h*H.width-Z/2;this.style.left=`${Math.round(Math.max(-Z/2,Math.min(H.width-Z/2,b)))}px`}if(J.y){let b=g*H.height-j/2;this.style.top=`${Math.round(Math.max(-j/2,Math.min(H.height-j/2,b)))}px`}},L=(M)=>{if(!this.#$)return;if(!this.#Q){let O=M.clientX-W,A=M.clientY-G;if(O*O+A*A<D*D)return;if(this.classList.add("dragging"),this.style.cursor="grabbing",!this.hasAttribute("selected"))this.select()}this.#Q=!0,R(M.clientX,M.clientY,M.shiftKey),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:{...this.#b(K),shiftKey:M.shiftKey}}))},B=(M)=>{if(this.#$=!1,this.style.cursor="",this.classList.remove("dragging"),window.removeEventListener("pointermove",L),window.removeEventListener("pointerup",B),this.#Q){R(M.clientX,M.clientY,M.shiftKey),this.#O(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.#b(K)}));let O=(A)=>{A.stopPropagation(),A.preventDefault()};this.addEventListener("click",O,{capture:!0,once:!0})}else this.#O();this.#Q=!1};window.addEventListener("pointermove",L),window.addEventListener("pointerup",B)}showColorTip(){if(this.#j){this.#j.style.display="";return}this.#C()}hideColorTip(){if(!this.#j)return;this.#j.style.display="none"}#C(){if(this.#j)return;let Q=document.createElement("fig-color-tip");if(this.#X)Q.setAttribute("control",this.#_);else Q.setAttribute("value",this.getAttribute("color")||"#D9D9D9"),Q.setAttribute("alpha","true"),Q.setAttribute("selected","");Q.addEventListener("input",this.#f),Q.addEventListener("change",this.#y),Q.addEventListener("add",this.#V),Q.addEventListener("remove",this.#V),this.appendChild(Q),this.#j=Q}#w(){if(!this.#j)return;this.#j.removeEventListener("input",this.#f),this.#j.removeEventListener("change",this.#y),this.#j.removeEventListener("add",this.#V),this.#j.removeEventListener("remove",this.#V),this.#j.remove(),this.#j=null}#T(Q,$){if($===void 0||$>=100)return Q;let{r:J,g:Z,b:j}=i(Q);return`rgba(${J}, ${Z}, ${j}, ${$/100})`}#f=(Q)=>{if(Q.stopPropagation(),Q.detail?.color)this.setAttribute("color",this.#T(Q.detail.color,Q.detail.opacity)),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:{color:Q.detail.color,opacity:Q.detail.opacity}}))};#y=(Q)=>{if(Q.stopPropagation(),Q.detail?.color)this.setAttribute("color",this.#T(Q.detail.color,Q.detail.opacity)),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{color:Q.detail.color,opacity:Q.detail.opacity}}))};#V=(Q)=>{Q.stopPropagation(),this.dispatchEvent(new CustomEvent(Q.type,{bubbles:!0,composed:!0}))};#b(Q){let $=this.offsetWidth/2,J=this.offsetHeight/2,Z=parseFloat(this.style.left)||0,j=parseFloat(this.style.top)||0,K=Q.width>0?(Z+$)/Q.width:0,q=Q.height>0?(j+J)/Q.height:0;return{x:Z,y:j,px:K,py:q}}}customElements.define("fig-handle",K1);class q1 extends HTMLElement{static get observedAttributes(){return["value","disabled"]}get value(){return this.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q??"")}connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","menuitem");if(!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1")}attributeChangedCallback(){}}customElements.define("fig-menu-item",q1);class _1 extends HTMLElement{connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","separator")}}customElements.define("fig-menu-separator",_1);class X1 extends HTMLElement{#$=null;#Q=null;#J=null;#K;#j;#Z;#_;#X=-1;static get observedAttributes(){return["position","offset","closedby","disabled","open"]}constructor(){super();this.#K=this.#B.bind(this),this.#j=this.#A.bind(this),this.#Z=this.#O.bind(this),this.#_=this.#R.bind(this)}get value(){return this.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q??"")}get open(){return this.hasAttribute("open")&&this.getAttribute("open")!=="false"}set open(Q){if(Q)this.setAttribute("open","");else this.removeAttribute("open")}connectedCallback(){if(this.#q(),this.#Y(),this.#W(),this.#U(),this.#L(),this.#M(),this.open)this.#H()}disconnectedCallback(){if(this.#N(),this.#J)this.#J.disconnect(),this.#J=null;if(this.#$)this.#$.removeEventListener("close",this.#_),this.#$.remove(),this.#$=null}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="open"){if(J===null||J==="false")this.#P();else this.#H();return}if(Q==="disabled"){if(this.#Q)if(J!==null&&J!=="false")this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled");return}if(this.#$&&(Q==="position"||Q==="offset"||Q==="closedby"))if(J!==null)this.#$.setAttribute(Q,J);else this.#$.removeAttribute(Q)}#q(){this.#Q=this.querySelector("[fig-menu-trigger]")||this.querySelector(":scope > :not(fig-menu-item):not(fig-menu-separator)")}#Y(){this.#$=document.createElement("dialog",{is:"fig-popup"}),this.#$.setAttribute("is","fig-popup"),this.#$.setAttribute("theme","menu"),this.#$.setAttribute("role","menu");let Q=this.getAttribute("position")||"bottom left";this.#$.setAttribute("position",Q);let $=this.getAttribute("offset");if($)this.#$.setAttribute("offset",$);let J=this.getAttribute("closedby");if(J)this.#$.setAttribute("closedby",J);if(this.#Q)this.#$.anchor=this.#Q;this.#$.addEventListener("close",this.#_),this.appendChild(this.#$)}#W(){let Q=Array.from(this.querySelectorAll(":scope > fig-menu-item, :scope > fig-menu-separator"));for(let $ of Q)this.#$.appendChild($)}#U(){if(this.#Q)this.#Q.addEventListener("click",this.#K),this.#Q.setAttribute("aria-haspopup","menu"),this.#Q.setAttribute("aria-expanded","false");if(this.#$)this.#$.addEventListener("click",this.#j),this.#$.addEventListener("keydown",this.#Z)}#N(){if(this.#Q)this.#Q.removeEventListener("click",this.#K);if(this.#$)this.#$.removeEventListener("click",this.#j),this.#$.removeEventListener("keydown",this.#Z)}#L(){this.#J=new MutationObserver((Q)=>{for(let $ of Q)for(let J of $.addedNodes){if(J.nodeType!==1||J===this.#$)continue;if((J.tagName==="FIG-MENU-ITEM"||J.tagName==="FIG-MENU-SEPARATOR")&&J.parentElement===this)this.#$.appendChild(J);else if(!this.#Q&&J.parentElement===this){if(this.#q(),this.#Q)this.#Q.addEventListener("click",this.#K),this.#Q.setAttribute("aria-haspopup","menu"),this.#Q.setAttribute("aria-expanded","false"),this.#$.anchor=this.#Q,this.#M()}}}),this.#J.observe(this,{childList:!0})}#G(){if(!this.#$)return[];return Array.from(this.#$.querySelectorAll("fig-menu-item:not([disabled]):not([disabled='true'])"))}#M(){if(!this.#Q)return;if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled")}#B(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;if(Q.stopPropagation(),this.open)this.open=!1;else this.open=!0}#A(Q){let $=Q.target.closest("fig-menu-item");if(!$)return;if($.hasAttribute("disabled")&&$.getAttribute("disabled")!=="false")return;this.#z($)}#O(Q){let $=this.#G();if(!$.length)return;switch(Q.key){case"ArrowDown":{Q.preventDefault(),this.#X=Math.min(this.#X+1,$.length-1),$[this.#X]?.focus();break}case"ArrowUp":{Q.preventDefault(),this.#X=Math.max(this.#X-1,0),$[this.#X]?.focus();break}case"Home":{Q.preventDefault(),this.#X=0,$[0]?.focus();break}case"End":{Q.preventDefault(),this.#X=$.length-1,$[this.#X]?.focus();break}case"Enter":case" ":{Q.preventDefault();let J=$[this.#X];if(J)this.#z(J);break}}}#R(){if(this.hasAttribute("open"))this.removeAttribute("open");if(this.#Q)this.#Q.setAttribute("aria-expanded","false"),this.#Q.focus();this.#X=-1}#z(Q){let $=Q.getAttribute("value")||Q.textContent.trim();this.setAttribute("value",$),this.dispatchEvent(new CustomEvent("change",{detail:{value:$,item:Q},bubbles:!0})),this.open=!1}#H(){if(!this.#$)return;if(this.#$.open=!0,this.#Q)this.#Q.setAttribute("aria-expanded","true");this.#X=0,requestAnimationFrame(()=>{let Q=this.#G();if(Q.length)Q[0].focus()})}#P(){if(!this.#$)return;this.#$.open=!1}}customElements.define("fig-menu",X1);
|
|
449
|
+
</fig-fill-picker>`,this.#$=this.querySelector("fig-fill-picker"),this.#Q=this.querySelector("fig-chit"),this.#_(),this.#$?.addEventListener("input",this.#K),this.#$?.addEventListener("change",this.#j),this.#X()}#W=()=>{let Q=this.#Z;this.dispatchEvent(new CustomEvent(Q,{bubbles:!0,composed:!0}))};#U(Q){if(!Q)return"#D9D9D9";let $=Q.replace("#","").trim();if($.length===3||$.length===4){let[J,Z,j]=$;return`#${J}${J}${Z}${Z}${j}${j}`.toUpperCase()}if($.length===6||$.length===8)return`#${$.slice(0,6)}`.toUpperCase();return"#D9D9D9"}#N(Q){if(!Q)return 1;let $=String(Q).trim();if($.startsWith("#")&&$.length===9)return parseInt($.slice(7,9),16)/255;let J=$.match(/rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*,\s*([\d.]+)\s*\)/i);if(J)return parseFloat(J[1]);return 1}#L(Q){if(!Q)return"#D9D9D9";let $=String(Q).trim();if($.startsWith("{"))try{let J=JSON.parse($);if(J?.color)return this.#L(J.color)}catch{}if($.startsWith("#"))return this.#U($);try{let{ctx:J}=M0(1,1);J.fillStyle="#000000",J.fillStyle=$;let Z=J.fillStyle;if(Z.startsWith("#"))return this.#U(Z);let j=Z.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/i);if(j){let K=(q)=>Math.max(0,Math.min(255,Number(q))).toString(16).padStart(2,"0");return`#${K(j[1])}${K(j[2])}${K(j[3])}`.toUpperCase()}}catch{}return"#D9D9D9"}#G(){let Q=this.getAttribute("value"),$=this.#L(Q),J=this.#N(Q);if(Q!==$&&J>=1){this.setAttribute("value",$);return}if(this.#$){let Z=J<1?{type:"solid",color:$,opacity:Math.round(J*100)}:{type:"solid",color:$};if(this.#$.setAttribute("value",JSON.stringify(Z)),this.#q)this.#$.removeAttribute("alpha");else this.#$.setAttribute("alpha","false");if(this.hasAttribute("disabled"))this.#$.setAttribute("disabled","");else this.#$.removeAttribute("disabled")}if(this.#Q)if(this.#Q.setAttribute("background",$),this.hasAttribute("disabled"))this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled")}#M(Q,$){let J=this.#L(Q?.color),Z=this.#L(this.getAttribute("value"));if(J!==Z)this.setAttribute("value",J);else this.#G();let j={color:this.value};if(this.#q){if(Q?.opacity!==void 0)j.opacity=Q.opacity;else if(Q?.alpha!==void 0)j.opacity=Math.round(Q.alpha*100)}this.dispatchEvent(new CustomEvent($,{bubbles:!0,cancelable:!0,composed:!0,detail:j}))}#B(Q){Q.stopPropagation(),this.#M(Q.detail,"input")}#A(Q){Q.stopPropagation(),this.#M(Q.detail,"change")}attributeChangedCallback(Q,$,J){if($===J)return;if(!this.isConnected)return;switch(Q){case"control":this.#Y();break;case"value":case"selected":case"disabled":this.#G();break}}get value(){return this.#L(this.getAttribute("value"))}set value(Q){if(Q===null||Q===void 0||Q===""){this.removeAttribute("value");return}this.setAttribute("value",this.#L(Q))}get selected(){return this.hasAttribute("selected")}set selected(Q){this.toggleAttribute("selected",Boolean(Q))}get disabled(){return this.hasAttribute("disabled")}set disabled(Q){this.toggleAttribute("disabled",Boolean(Q))}}customElements.define("fig-color-tip",J1);class Z1 extends HTMLElement{static get observedAttributes(){return["selected","disabled"]}connectedCallback(){if(this.setAttribute("role","option"),!this.hasAttribute("tabindex"))this.setAttribute("tabindex","0");if(this.setAttribute("aria-selected",this.hasAttribute("selected")?"true":"false"),this.hasAttribute("disabled"))this.setAttribute("aria-disabled","true")}attributeChangedCallback(Q){if(Q==="selected")this.setAttribute("aria-selected",this.hasAttribute("selected")?"true":"false");if(Q==="disabled")if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")this.setAttribute("aria-disabled","true"),this.setAttribute("tabindex","-1");else this.removeAttribute("aria-disabled"),this.setAttribute("tabindex","0")}}customElements.define("fig-choice",Z1);class j1 extends HTMLElement{#$=null;#Q=this.#B.bind(this);#J=this.#A.bind(this);#K=this.#R.bind(this);#j=null;#Z=null;#_=null;#X=null;#q=null;constructor(){super()}static get observedAttributes(){return["value","disabled","choice-element","drag","overflow","loop"]}get#Y(){return this.getAttribute("overflow")==="scrollbar"?"scrollbar":"buttons"}get#W(){let Q=this.getAttribute("drag");return Q===null||Q!=="false"}get#U(){return this.getAttribute("choice-element")||"fig-choice"}get choices(){return Array.from(this.querySelectorAll(this.#U))}get selectedChoice(){return this.#$}set selectedChoice(Q){if(Q&&!this.contains(Q))return;let $=this.choices;for(let Z of $){let j=Z===Q,K=Z.hasAttribute("selected");if(j&&!K)Z.setAttribute("selected","");else if(!j&&K)Z.removeAttribute("selected")}this.#$=Q;let J=Q?.getAttribute("value")??"";if(this.getAttribute("value")!==J){if(J)this.setAttribute("value",J)}this.#k(Q)}get value(){return this.#$?.getAttribute("value")??""}set value(Q){if(Q===null||Q===void 0||Q==="")return;this.setAttribute("value",String(Q))}connectedCallback(){this.setAttribute("role","listbox"),this.addEventListener("click",this.#Q),this.addEventListener("keydown",this.#J),this.addEventListener("scroll",this.#K),this.#D(),this.#H(),this.#E(),this.#z(),requestAnimationFrame(()=>{this.#L(),this.#R(),this.#N()})}#N(){let Q=()=>{if(!this.isConnected)return;if(this.#$)this.#k(this.#$,"auto")},$=()=>{let J=this.querySelectorAll("img, video");for(let Z of J){if(Z.tagName==="IMG"?Z.complete:Z.readyState>=1)continue;let j=()=>{Z.removeEventListener("load",j),Z.removeEventListener("loadedmetadata",j),Z.removeEventListener("error",j),Q()};Z.addEventListener("load",j),Z.addEventListener("loadedmetadata",j),Z.addEventListener("error",j)}};requestAnimationFrame(()=>{$(),Q()})}disconnectedCallback(){this.removeEventListener("click",this.#Q),this.removeEventListener("keydown",this.#J),this.removeEventListener("scroll",this.#K),this.#P(),this.#j?.disconnect(),this.#j=null,this.#Z?.disconnect(),this.#Z=null,this.#F()}attributeChangedCallback(Q,$,J){if(Q==="value"&&J!==$&&J)this.#G(J);if(Q==="disabled"){let Z=J!==null&&J!=="false",j=this.choices;for(let K of j)if(Z)K.setAttribute("aria-disabled","true"),K.setAttribute("tabindex","-1");else K.removeAttribute("aria-disabled"),K.setAttribute("tabindex","0")}if(Q==="choice-element")requestAnimationFrame(()=>this.#L());if(Q==="drag")if(this.#W)this.#H();else this.#P();if(Q==="overflow")this.#D()}#L(){let Q=this.choices;if(!Q.length){this.#$=null;return}let $=this.getAttribute("value");if($&&this.#G($))return;let J=Q.find((Z)=>Z.hasAttribute("selected"));if(J){this.selectedChoice=J;return}this.selectedChoice=Q[0]}#G(Q){let $=this.choices;for(let J of $)if(J.getAttribute("value")===Q)return this.selectedChoice=J,!0;return!1}#M(Q){let $=this.#U,J=Q;while(J&&J!==this){if(J.matches($))return J;J=J.parentElement}return null}#B(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;let $=this.#M(Q.target);if(!$)return;if($.hasAttribute("disabled")&&$.getAttribute("disabled")!=="false")return;this.selectedChoice=$,this.#O()}#A(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;let $=this.choices.filter((K)=>!K.hasAttribute("disabled")||K.getAttribute("disabled")==="false");if(!$.length)return;let J=$.indexOf(this.#$),Z=J,j=this.hasAttribute("loop");switch(Q.key){case"ArrowDown":case"ArrowRight":if(Q.preventDefault(),J<$.length-1)Z=J+1;else if(j)Z=0;break;case"ArrowUp":case"ArrowLeft":if(Q.preventDefault(),J>0)Z=J-1;else if(j)Z=$.length-1;break;case"Home":Q.preventDefault(),Z=0;break;case"End":Q.preventDefault(),Z=$.length-1;break;case"Enter":case" ":if(Q.preventDefault(),document.activeElement?.matches(this.#U)){let K=this.#M(document.activeElement);if(K&&K!==this.#$)this.selectedChoice=K,this.#O()}return;default:return}if(Z!==J&&$[Z])this.selectedChoice=$[Z],$[Z].focus(),this.#O()}#O(){let Q=this.value;this.dispatchEvent(new CustomEvent("input",{detail:Q,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:Q,bubbles:!0}))}#R(){if(this.#Y==="scrollbar")return;let Q=this.getAttribute("layout")==="horizontal",$=2;if(Q){let J=this.scrollWidth-this.clientWidth>$,Z=!J||this.scrollLeft<=$,j=!J||this.scrollLeft+this.clientWidth>=this.scrollWidth-$;this.classList.toggle("overflow-start",!Z),this.classList.toggle("overflow-end",!j)}else{let J=this.scrollHeight-this.clientHeight>$,Z=!J||this.scrollTop<=$,j=!J||this.scrollTop+this.clientHeight>=this.scrollHeight-$;this.classList.toggle("overflow-start",!Z),this.classList.toggle("overflow-end",!j)}}#z(){this.#Z?.disconnect(),this.#Z=new ResizeObserver(()=>{this.#R()}),this.#Z.observe(this)}#H(){if(this.#q?.bound)return;if(!this.#W)return;let Q=(K)=>{if(K.button!==0)return;if(!(this.getAttribute("layout")==="horizontal"?this.scrollWidth>this.clientWidth:this.scrollHeight>this.clientHeight))return;this.#q.active=!0,this.#q.didDrag=!1,this.#q.startX=K.clientX,this.#q.startY=K.clientY,this.#q.scrollLeft=this.scrollLeft,this.#q.scrollTop=this.scrollTop,this.style.cursor="grab",this.style.userSelect="none"},$=(K)=>{if(!this.#q.active)return;let q=this.getAttribute("layout")==="horizontal",_=K.clientX-this.#q.startX,X=K.clientY-this.#q.startY;if(!this.#q.didDrag&&Math.abs(q?_:X)>3)this.#q.didDrag=!0,this.style.cursor="grabbing",this.setPointerCapture(K.pointerId);if(!this.#q.didDrag)return;if(q)this.scrollLeft=this.#q.scrollLeft-_;else this.scrollTop=this.#q.scrollTop-X},J=(K)=>{if(!this.#q.active)return;let q=this.#q.didDrag;if(this.#q.active=!1,this.#q.didDrag=!1,this.style.cursor="",this.style.userSelect="",K.pointerId!==void 0)try{this.releasePointerCapture(K.pointerId)}catch{}if(q)K.preventDefault(),K.stopPropagation()},Z=(K)=>{if(this.#q?.suppressClick)K.stopPropagation(),K.preventDefault(),this.#q.suppressClick=!1},j=(K)=>{if(this.#q?.didDrag)this.#q.suppressClick=!0,setTimeout(()=>{if(this.#q)this.#q.suppressClick=!1},0)};this.#q={active:!1,didDrag:!1,suppressClick:!1,startX:0,startY:0,scrollLeft:0,scrollTop:0,bound:!0,onPointerDown:Q,onPointerMove:$,onPointerUp:J,onClick:Z,onPointerUpCapture:j},this.addEventListener("pointerdown",Q),window.addEventListener("pointermove",$),window.addEventListener("pointerup",J),this.addEventListener("pointerup",j,!0),this.addEventListener("click",Z,!0)}#P(){if(!this.#q?.bound)return;this.removeEventListener("pointerdown",this.#q.onPointerDown),window.removeEventListener("pointermove",this.#q.onPointerMove),window.removeEventListener("pointerup",this.#q.onPointerUp),this.removeEventListener("pointerup",this.#q.onPointerUpCapture,!0),this.removeEventListener("click",this.#q.onClick,!0),this.style.cursor="",this.style.userSelect="",this.#q=null}#D(){if(this.#Y==="scrollbar")this.#F();else this.#S()}#F(){this.#_?.remove(),this.#X?.remove(),this.#_=null,this.#X=null,this.classList.remove("overflow-start","overflow-end")}#S(){if(this.#_)return;let Q=()=>{let $=document.createElement("span");return $.className="fig-mask-icon fig-chooser-nav-chevron",$.style.setProperty("--icon","var(--icon-chevron)"),$.style.setProperty("--size","1rem"),$};this.#_=document.createElement("button"),this.#_.className="fig-chooser-nav-start",this.#_.setAttribute("tabindex","-1"),this.#_.setAttribute("aria-label","Scroll back"),this.#_.appendChild(Q()),this.#X=document.createElement("button"),this.#X.className="fig-chooser-nav-end",this.#X.setAttribute("tabindex","-1"),this.#X.setAttribute("aria-label","Scroll forward"),this.#X.appendChild(Q()),this.#_.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#I(-1)}),this.#X.addEventListener("pointerdown",($)=>{$.stopPropagation(),this.#I(1)}),this.prepend(this.#_),this.append(this.#X)}#I(Q){let $=this.getAttribute("layout")==="horizontal",Z=($?this.clientWidth:this.clientHeight)*0.8*Q;this.scrollBy({[$?"left":"top"]:Z,behavior:"smooth"})}#k(Q,$="smooth"){if(!Q)return;requestAnimationFrame(()=>{if(!Q.isConnected)return;let J=this.scrollHeight>this.clientHeight,Z=this.scrollWidth>this.clientWidth;if(!Z&&!J)return;let j=Q.getBoundingClientRect(),K=this.getBoundingClientRect(),q={behavior:$};if(J){let _=j.top-K.top+this.scrollTop+j.height/2;q.top=_-this.clientHeight/2}if(Z){let _=j.left-K.left+this.scrollLeft+j.width/2;q.left=_-this.clientWidth/2}this.scrollTo(q)})}#E(){this.#j?.disconnect(),this.#j=new MutationObserver(()=>{let Q=this.choices;if(this.#$&&!Q.includes(this.#$))this.#$=null,this.#L();else if(!this.#$&&Q.length)this.#L()}),this.#j.observe(this,{childList:!0,subtree:!0})}}customElements.define("fig-chooser",j1);class K1 extends HTMLElement{static observedAttributes=["color","selected","disabled","drag","drag-surface","drag-axes","drag-snapping","value","type","control","hit-area","hit-area-mode"];#$=!1;#Q=!1;#J=null;#K=!1;#j=null;#Z=null;get#_(){return this.getAttribute("control")||null}get#X(){return this.#_==="add"||this.#_==="remove"}get#q(){return this.classList.contains("fig-input-gradient-ghost")}get#Y(){let Q=this.getAttribute("drag");return Q!==null&&Q!=="false"}get#W(){let Q=(this.getAttribute("drag-axes")||"x,y").toLowerCase();return{x:Q.includes("x"),y:Q.includes("y")}}get#U(){let Q=this.getAttribute("drag-snapping");if(Q===null)return"false";let $=Q.trim().toLowerCase();if($==="modifier")return"modifier";if($===""||$==="true")return"true";return"false"}#N(Q){let $=this.#U;if($==="true")return!0;if($==="modifier")return!!Q;return!1}#L(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}#G(Q,$){if(Math.abs(Q-$)<0.1){let Z=(Q+$)/2;return{x:Z,y:Z}}if(Math.abs(1-Q-$)<0.1)return{x:Q,y:1-Q};return{x:Q,y:$}}#M(){let Q=this.getAttribute("drag-surface");if(!Q||Q==="parent")return this.parentElement;return this.closest(Q)}get value(){let Q=this.#M();if(!Q)return"0% 0%";let $=Q.getBoundingClientRect(),J=this.offsetWidth/2,Z=this.offsetHeight/2,j=parseFloat(this.style.left)||0,K=parseFloat(this.style.top)||0,q=$.width>0?(j+J)/$.width*100:0,_=$.height>0?(K+Z)/$.height*100:0;return`${Math.round(q)}% ${Math.round(_)}%`}set value(Q){this.setAttribute("value",Q??"0% 0%")}#B(Q){let $=Q==null?"":String(Q).trim();if(!$)return{xPct:0,yPct:0};let J=$.split(/[\s,]+/).filter(Boolean),Z=(q)=>{if(!q)return 0;let _=q.includes("px"),X=q.includes("%"),Y=parseFloat(q.replace(/[%px]/g,""));if(!Number.isFinite(Y))return 0;if(_)return{px:Y};if(X||Math.abs(Y)>1)return Math.max(0,Math.min(100,Y));return Math.max(0,Math.min(100,Y*100))},j=Z(J[0]),K=Z(J[1]??J[0]);return{xToken:j,yToken:K}}#A(Q){let $=this.#M();if(!$)return;let{xToken:J,yToken:Z}=this.#B(Q),j=$.getBoundingClientRect(),K=this.offsetWidth/2,q=this.offsetHeight/2,_=(Y,N,W)=>{if(Y&&typeof Y==="object"&&"px"in Y)return Math.max(-W,Math.min(N-W,Y.px-W));let D=(typeof Y==="number"?Y:0)/100*N;return Math.max(-W,Math.min(N-W,D-W))},X=this.#W;if(X.x)this.style.left=`${Math.round(_(J,j.width,K))}px`;if(X.y)this.style.top=`${Math.round(_(Z,j.height,q))}px`}#O(){this.#K=!0,this.setAttribute("value",this.value),this.#K=!1}get#R(){return this.getAttribute("hit-area-mode")||"handle"}#z(){let Q=this.getAttribute("hit-area");if(!Q)return null;let $=Q.trim().split(/\s+/),J=0,Z=0,j=!1,K=[];for(let q of $){if(q==="circle"){j=!0;continue}let _=parseFloat(q);if(Number.isFinite(_))K.push(_)}if(K.length>=2)J=K[0],Z=K[1];else if(K.length===1)J=K[0],Z=K[0];else return null;return{vPad:J,hPad:Z,circle:j}}#H(){let Q=this.#z();if(!Q){if(this.#Z)this.#Z.remove(),this.#Z=null;this.style.removeProperty("--fig-handle-hit-area-size");return}if(!this.#Z){let $=document.createElement("div");$.classList.add("fig-handle-hit-area"),$.addEventListener("pointerdown",(J)=>this.#P(J)),this.prepend($),this.#Z=$}if(this.style.setProperty("--fig-handle-hit-area-size",String(Q.hPad*2)),Q.circle)this.#Z.style.borderRadius="50%";else this.#Z.style.borderRadius="inherit"}#P(Q){if(this.hasAttribute("disabled"))return;if(Q.target!==this.#Z)return;if(this.#R==="delegate")Q.preventDefault(),Q.stopPropagation(),this.dispatchEvent(new CustomEvent("hitareadown",{bubbles:!0,detail:{originalEvent:Q}}));else this.#E(Q)}connectedCallback(){if(!this.hasAttribute("type"))this.setAttribute("type","canvas");this.#I(),this.#H(),this.addEventListener("click",this.#D),document.addEventListener("pointerdown",this.#F),document.addEventListener("keydown",this.#S);let Q=this.getAttribute("value");if(Q)this.#A(Q);if(this.#X)this.#C()}disconnectedCallback(){if(this.#k(),this.#w(),this.#Z)this.#Z.remove(),this.#Z=null;this.removeEventListener("click",this.#D),document.removeEventListener("pointerdown",this.#F),document.removeEventListener("keydown",this.#S)}select(){if(this.hasAttribute("disabled"))return;if(this.setAttribute("selected",""),this.getAttribute("type")==="color"&&!this.#$)this.#C()}deselect(){this.removeAttribute("selected"),this.#w()}#D=(Q)=>{if(this.#X)return;if(this.#Q){this.#Q=!1;return}this.select()};#F=(Q)=>{if(this.#X)return;if(this.contains(Q.target))return;if(this.#j&&Q.target.closest?.("dialog, [popover]"))return;this.deselect()};#S=(Q)=>{if(Q.key!=="Enter")return;if(!this.hasAttribute("selected"))return;if(this.getAttribute("type")!=="color")return;if(this.#j)return;Q.preventDefault(),this.#C()};attributeChangedCallback(Q,$,J){if(Q==="color"){if(!J||J==="false"||J==="true")this.style.removeProperty("--fill");else this.style.setProperty("--fill",J);if(this.#j&&J)this.#j.setAttribute("value",J)}if(Q==="drag")this.#I();if(Q==="hit-area")this.#H();if(Q==="value"&&!this.#K&&!this.#$)this.#A(J);if(Q==="control")if(this.#X)this.#w(),this.#C();else this.#w()}#I(){if(this.#Y&&!this.#J)this.#J=(Q)=>this.#E(Q),this.addEventListener("pointerdown",this.#J);else if(!this.#Y&&this.#J)this.#k()}#k(){if(this.#J)this.removeEventListener("pointerdown",this.#J),this.#J=null;this.#$=!1}#E(Q){if(!this.#Y||this.hasAttribute("disabled"))return;Q.preventDefault();let $=this.#M();if(!$)return;this.#$=!0;let J=this.#W,Z=this.offsetWidth,j=this.offsetHeight,K=null,q=this.getBoundingClientRect(),_=q.left+q.width/2,X=q.top+q.height/2,Y=Q.clientX-_,N=Q.clientY-X,W=Q.clientX,G=Q.clientY,D=3,R=(M,O,A=!1)=>{let H=$.getBoundingClientRect();K=H;let T=parseFloat(this.style.left)||0,S=parseFloat(this.style.top)||0,f=M-Y-H.left-Z/2,I=O-N-H.top-j/2,c=Math.max(-Z/2,Math.min(H.width-Z/2,f)),o=Math.max(-j/2,Math.min(H.height-j/2,I)),h=H.width>0?((J.x?c:T)+Z/2)/H.width:0.5,g=H.height>0?((J.y?o:S)+j/2)/H.height:0.5;if(this.#N(A)){if(J.x)h=this.#L(h);if(J.y)g=this.#L(g);if(J.x&&J.y){let b=this.#G(h,g);h=b.x,g=b.y}}if(J.x){let b=h*H.width-Z/2;this.style.left=`${Math.round(Math.max(-Z/2,Math.min(H.width-Z/2,b)))}px`}if(J.y){let b=g*H.height-j/2;this.style.top=`${Math.round(Math.max(-j/2,Math.min(H.height-j/2,b)))}px`}},L=(M)=>{if(!this.#$)return;if(!this.#Q){let O=M.clientX-W,A=M.clientY-G;if(O*O+A*A<D*D)return;if(this.classList.add("dragging"),this.style.cursor="grabbing",!this.hasAttribute("selected"))this.select()}this.#Q=!0,R(M.clientX,M.clientY,M.shiftKey),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:{...this.#b(K),shiftKey:M.shiftKey}}))},B=(M)=>{if(this.#$=!1,this.style.cursor="",this.classList.remove("dragging"),window.removeEventListener("pointermove",L),window.removeEventListener("pointerup",B),this.#Q){R(M.clientX,M.clientY,M.shiftKey),this.#O(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:this.#b(K)}));let O=(A)=>{A.stopPropagation(),A.preventDefault()};this.addEventListener("click",O,{capture:!0,once:!0})}else this.#O();this.#Q=!1};window.addEventListener("pointermove",L),window.addEventListener("pointerup",B)}showColorTip(){if(this.#j){this.#j.style.display="";return}this.#C()}hideColorTip(){if(!this.#j)return;this.#j.style.display="none"}#C(){if(this.#j)return;let Q=document.createElement("fig-color-tip");if(this.#X)Q.setAttribute("control",this.#_);else Q.setAttribute("value",this.getAttribute("color")||"#D9D9D9"),Q.setAttribute("alpha","true"),Q.setAttribute("selected","");Q.addEventListener("input",this.#f),Q.addEventListener("change",this.#y),Q.addEventListener("add",this.#V),Q.addEventListener("remove",this.#V),this.appendChild(Q),this.#j=Q}#w(){if(!this.#j)return;this.#j.removeEventListener("input",this.#f),this.#j.removeEventListener("change",this.#y),this.#j.removeEventListener("add",this.#V),this.#j.removeEventListener("remove",this.#V),this.#j.remove(),this.#j=null}#T(Q,$){if($===void 0||$>=100)return Q;let{r:J,g:Z,b:j}=i(Q);return`rgba(${J}, ${Z}, ${j}, ${$/100})`}#f=(Q)=>{if(Q.stopPropagation(),Q.detail?.color)this.setAttribute("color",this.#T(Q.detail.color,Q.detail.opacity)),this.dispatchEvent(new CustomEvent("input",{bubbles:!0,detail:{color:Q.detail.color,opacity:Q.detail.opacity}}))};#y=(Q)=>{if(Q.stopPropagation(),Q.detail?.color)this.setAttribute("color",this.#T(Q.detail.color,Q.detail.opacity)),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:{color:Q.detail.color,opacity:Q.detail.opacity}}))};#V=(Q)=>{Q.stopPropagation(),this.dispatchEvent(new CustomEvent(Q.type,{bubbles:!0,composed:!0}))};#b(Q){let $=this.offsetWidth/2,J=this.offsetHeight/2,Z=parseFloat(this.style.left)||0,j=parseFloat(this.style.top)||0,K=Q.width>0?(Z+$)/Q.width:0,q=Q.height>0?(j+J)/Q.height:0;return{x:Z,y:j,px:K,py:q}}}customElements.define("fig-handle",K1);class q1 extends HTMLElement{static get observedAttributes(){return["value","disabled"]}get value(){return this.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q??"")}connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","menuitem");if(!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1")}attributeChangedCallback(){}}customElements.define("fig-menu-item",q1);class _1 extends HTMLElement{connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","separator")}}customElements.define("fig-menu-separator",_1);class X1 extends HTMLElement{#$=null;#Q=null;#J=null;#K;#j;#Z;#_;#X=-1;static get observedAttributes(){return["position","offset","closedby","disabled","open"]}constructor(){super();this.#K=this.#B.bind(this),this.#j=this.#A.bind(this),this.#Z=this.#O.bind(this),this.#_=this.#R.bind(this)}get value(){return this.getAttribute("value")||""}set value(Q){this.setAttribute("value",Q??"")}get open(){return this.hasAttribute("open")&&this.getAttribute("open")!=="false"}set open(Q){if(Q)this.setAttribute("open","");else this.removeAttribute("open")}connectedCallback(){if(this.#q(),this.#Y(),this.#W(),this.#U(),this.#L(),this.#M(),this.open)this.#H()}disconnectedCallback(){if(this.#N(),this.#J)this.#J.disconnect(),this.#J=null;if(this.#$)this.#$.removeEventListener("close",this.#_),this.#$.remove(),this.#$=null}attributeChangedCallback(Q,$,J){if($===J)return;if(Q==="open"){if(J===null||J==="false")this.#P();else this.#H();return}if(Q==="disabled"){if(this.#Q)if(J!==null&&J!=="false")this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled");return}if(this.#$&&(Q==="position"||Q==="offset"||Q==="closedby"))if(J!==null)this.#$.setAttribute(Q,J);else this.#$.removeAttribute(Q)}#q(){this.#Q=this.querySelector("[fig-menu-trigger]")||this.querySelector(":scope > :not(fig-menu-item):not(fig-menu-separator)")}#Y(){this.#$=document.createElement("dialog",{is:"fig-popup"}),this.#$.setAttribute("is","fig-popup"),this.#$.setAttribute("theme","menu"),this.#$.setAttribute("role","menu");let Q=this.getAttribute("position")||"bottom left";this.#$.setAttribute("position",Q);let $=this.getAttribute("offset");if($)this.#$.setAttribute("offset",$);let J=this.getAttribute("closedby");if(J)this.#$.setAttribute("closedby",J);if(this.#Q)this.#$.anchor=this.#Q;this.#$.addEventListener("close",this.#_),this.appendChild(this.#$)}#W(){let Q=Array.from(this.querySelectorAll(":scope > fig-menu-item, :scope > fig-menu-separator"));for(let $ of Q)this.#$.appendChild($)}#U(){if(this.#Q)this.#Q.addEventListener("click",this.#K),this.#Q.setAttribute("aria-haspopup","menu"),this.#Q.setAttribute("aria-expanded","false");if(this.#$)this.#$.addEventListener("click",this.#j),this.#$.addEventListener("keydown",this.#Z)}#N(){if(this.#Q)this.#Q.removeEventListener("click",this.#K);if(this.#$)this.#$.removeEventListener("click",this.#j),this.#$.removeEventListener("keydown",this.#Z)}#L(){this.#J=new MutationObserver((Q)=>{for(let $ of Q)for(let J of $.addedNodes){if(J.nodeType!==1||J===this.#$)continue;if((J.tagName==="FIG-MENU-ITEM"||J.tagName==="FIG-MENU-SEPARATOR")&&J.parentElement===this)this.#$.appendChild(J);else if(!this.#Q&&J.parentElement===this){if(this.#q(),this.#Q)this.#Q.addEventListener("click",this.#K),this.#Q.setAttribute("aria-haspopup","menu"),this.#Q.setAttribute("aria-expanded","false"),this.#$.anchor=this.#Q,this.#M()}}}),this.#J.observe(this,{childList:!0})}#G(){if(!this.#$)return[];return Array.from(this.#$.querySelectorAll("fig-menu-item:not([disabled]):not([disabled='true'])"))}#M(){if(!this.#Q)return;if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")this.#Q.setAttribute("disabled","");else this.#Q.removeAttribute("disabled")}#B(Q){if(this.hasAttribute("disabled")&&this.getAttribute("disabled")!=="false")return;if(Q.stopPropagation(),this.open)this.open=!1;else this.open=!0}#A(Q){let $=Q.target.closest("fig-menu-item");if(!$)return;if($.hasAttribute("disabled")&&$.getAttribute("disabled")!=="false")return;this.#z($)}#O(Q){let $=this.#G();if(!$.length)return;switch(Q.key){case"ArrowDown":{Q.preventDefault(),this.#X=Math.min(this.#X+1,$.length-1),$[this.#X]?.focus();break}case"ArrowUp":{Q.preventDefault(),this.#X=Math.max(this.#X-1,0),$[this.#X]?.focus();break}case"Home":{Q.preventDefault(),this.#X=0,$[0]?.focus();break}case"End":{Q.preventDefault(),this.#X=$.length-1,$[this.#X]?.focus();break}case"Enter":case" ":{Q.preventDefault();let J=$[this.#X];if(J)this.#z(J);break}}}#R(){if(this.hasAttribute("open"))this.removeAttribute("open");if(this.#Q)this.#Q.setAttribute("aria-expanded","false"),this.#Q.focus();this.#X=-1}#z(Q){let $=Q.getAttribute("value")||Q.textContent.trim();this.setAttribute("value",$),this.dispatchEvent(new CustomEvent("change",{detail:{value:$,item:Q},bubbles:!0})),this.open=!1}#H(){if(!this.#$)return;if(this.#$.open=!0,this.#Q)this.#Q.setAttribute("aria-expanded","true");this.#X=0,requestAnimationFrame(()=>{let Q=this.#G();if(Q.length)Q[0].focus()})}#P(){if(!this.#$)return;this.#$.open=!1}}customElements.define("fig-menu",X1);
|
package/fig.js
CHANGED
|
@@ -1661,6 +1661,8 @@ class FigPopup extends HTMLDialogElement {
|
|
|
1661
1661
|
} else if (typeof value === "string") {
|
|
1662
1662
|
this._anchorRef = null;
|
|
1663
1663
|
this.setAttribute("anchor", value);
|
|
1664
|
+
} else if (value && typeof value.getBoundingClientRect === "function") {
|
|
1665
|
+
this._anchorRef = value;
|
|
1664
1666
|
} else {
|
|
1665
1667
|
this._anchorRef = null;
|
|
1666
1668
|
}
|
|
@@ -1802,12 +1804,12 @@ class FigPopup extends HTMLDialogElement {
|
|
|
1802
1804
|
this._isPopupActive = true;
|
|
1803
1805
|
|
|
1804
1806
|
const anchor = this.resolveAnchor();
|
|
1805
|
-
if (anchor) anchor.classList.add("has-popup-open");
|
|
1807
|
+
if (anchor?.classList) anchor.classList.add("has-popup-open");
|
|
1806
1808
|
}
|
|
1807
1809
|
|
|
1808
1810
|
hidePopup() {
|
|
1809
1811
|
const anchor = this.resolveAnchor();
|
|
1810
|
-
if (anchor) anchor.classList.remove("has-popup-open");
|
|
1812
|
+
if (anchor?.classList) anchor.classList.remove("has-popup-open");
|
|
1811
1813
|
|
|
1812
1814
|
this._isPopupActive = false;
|
|
1813
1815
|
this._wasDragged = false;
|
|
@@ -1854,7 +1856,7 @@ class FigPopup extends HTMLDialogElement {
|
|
|
1854
1856
|
this.teardownObservers();
|
|
1855
1857
|
|
|
1856
1858
|
const anchor = this.resolveAnchor();
|
|
1857
|
-
if (anchor && "ResizeObserver" in window) {
|
|
1859
|
+
if (anchor instanceof Element && "ResizeObserver" in window) {
|
|
1858
1860
|
this._anchorObserver = new ResizeObserver(this._boundReposition);
|
|
1859
1861
|
this._anchorObserver.observe(anchor);
|
|
1860
1862
|
}
|
|
@@ -1971,7 +1973,7 @@ class FigPopup extends HTMLDialogElement {
|
|
|
1971
1973
|
if (this.contains(target)) return;
|
|
1972
1974
|
|
|
1973
1975
|
const anchor = this.resolveAnchor();
|
|
1974
|
-
if (anchor && anchor.contains(target)) return;
|
|
1976
|
+
if (anchor?.contains && anchor.contains(target)) return;
|
|
1975
1977
|
|
|
1976
1978
|
if (this.isInsideDescendantPopup(target)) return;
|
|
1977
1979
|
|
|
@@ -14593,14 +14595,18 @@ class FigChooser extends HTMLElement {
|
|
|
14593
14595
|
const threshold = 2;
|
|
14594
14596
|
|
|
14595
14597
|
if (isHorizontal) {
|
|
14596
|
-
const
|
|
14598
|
+
const scrollable = this.scrollWidth - this.clientWidth > threshold;
|
|
14599
|
+
const atStart = !scrollable || this.scrollLeft <= threshold;
|
|
14597
14600
|
const atEnd =
|
|
14601
|
+
!scrollable ||
|
|
14598
14602
|
this.scrollLeft + this.clientWidth >= this.scrollWidth - threshold;
|
|
14599
14603
|
this.classList.toggle("overflow-start", !atStart);
|
|
14600
14604
|
this.classList.toggle("overflow-end", !atEnd);
|
|
14601
14605
|
} else {
|
|
14602
|
-
const
|
|
14606
|
+
const scrollable = this.scrollHeight - this.clientHeight > threshold;
|
|
14607
|
+
const atStart = !scrollable || this.scrollTop <= threshold;
|
|
14603
14608
|
const atEnd =
|
|
14609
|
+
!scrollable ||
|
|
14604
14610
|
this.scrollTop + this.clientHeight >= this.scrollHeight - threshold;
|
|
14605
14611
|
this.classList.toggle("overflow-start", !atStart);
|
|
14606
14612
|
this.classList.toggle("overflow-end", !atEnd);
|
|
@@ -14771,12 +14777,12 @@ class FigChooser extends HTMLElement {
|
|
|
14771
14777
|
this.#navEnd.setAttribute("aria-label", "Scroll forward");
|
|
14772
14778
|
this.#navEnd.appendChild(makeChevron());
|
|
14773
14779
|
|
|
14774
|
-
this.#navStart.addEventListener("
|
|
14780
|
+
this.#navStart.addEventListener("pointerdown", (e) => {
|
|
14775
14781
|
e.stopPropagation();
|
|
14776
14782
|
this.#scrollByPage(-1);
|
|
14777
14783
|
});
|
|
14778
14784
|
|
|
14779
|
-
this.#navEnd.addEventListener("
|
|
14785
|
+
this.#navEnd.addEventListener("pointerdown", (e) => {
|
|
14780
14786
|
e.stopPropagation();
|
|
14781
14787
|
this.#scrollByPage(1);
|
|
14782
14788
|
});
|
package/package.json
CHANGED