@redocly/replay 0.3.1 → 0.3.2

package/dist/replay.cjs

@@ -113,7 +113,7 @@ Example:
 Perhaps you're looking to import 'styled-components/native'?
 Read more about this at https://www.styled-components.com/docs/basics#react-native`),process.env.NODE_ENV!=="production"&&process.env.NODE_ENV!=="test"&&typeof window<"u"&&(window["__styled-components-init__"]=window["__styled-components-init__"]||0,window["__styled-components-init__"]===1&&console.warn(`It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.
 
-See https://s-c.sh/2BAXzed for more info.`),window["__styled-components-init__"]+=1);const M=vp,{createElement:Ao,createContext:JT,createRef:CU,forwardRef:VS,useCallback:Bn,useContext:WS,useEffect:Ps,useImperativeHandle:zS,useLayoutEffect:KT,useMemo:eI,useRef:tr,useState:fu}=H,IO=H["useId".toString()],vf=JT(null);vf.displayName="PanelGroupContext";const Za=KT,tI=typeof IO=="function"?IO:()=>null;let nI=0;function Q0(n=null){const e=tI(),t=tr(n||e||null);return t.current===null&&(t.current=""+nI++),n??t.current}function XS({children:n,className:e="",collapsedSize:t,collapsible:r,defaultSize:i,forwardedRef:s,id:o,maxSize:a,minSize:l,onCollapse:c,onExpand:u,onResize:f,order:d,style:h,tagName:p="div",...m}){const g=WS(vf);if(g===null)throw Error("Panel components must be rendered within a PanelGroup container");const{collapsePanel:v,expandPanel:O,getPanelSize:x,getPanelStyle:S,groupId:y,isPanelCollapsed:w,reevaluatePanelConstraints:C,registerPanel:k,resizePanel:P,unregisterPanel:A}=g,E=Q0(o),I=tr({callbacks:{onCollapse:c,onExpand:u,onResize:f},constraints:{collapsedSize:t,collapsible:r,defaultSize:i,maxSize:a,minSize:l},id:E,idIsFromProps:o!==void 0,order:d});tr({didLogMissingDefaultSizeWarning:!1}),Za(()=>{const{callbacks:j,constraints:$}=I.current,F={...$};I.current.id=E,I.current.idIsFromProps=o!==void 0,I.current.order=d,j.onCollapse=c,j.onExpand=u,j.onResize=f,$.collapsedSize=t,$.collapsible=r,$.defaultSize=i,$.maxSize=a,$.minSize=l,(F.collapsedSize!==$.collapsedSize||F.collapsible!==$.collapsible||F.maxSize!==$.maxSize||F.minSize!==$.minSize)&&C(I.current,F)}),Za(()=>{const j=I.current;return k(j),()=>{A(j)}},[d,E,k,A]),zS(s,()=>({collapse:()=>{v(I.current)},expand:()=>{O(I.current)},getId(){return E},getSize(){return x(I.current)},isCollapsed(){return w(I.current)},isExpanded(){return!w(I.current)},resize:j=>{P(I.current,j)}}),[v,O,x,w,E,P]);const R=S(I.current,i);return Ao(p,{...m,children:n,className:e,style:{...R,...h},"data-panel":"","data-panel-id":E,"data-panel-group-id":y,"data-panel-collapsible":void 0,"data-panel-size":void 0})}const xp=VS((n,e)=>Ao(XS,{...n,forwardedRef:e}));XS.displayName="Panel";xp.displayName="forwardRef(Panel)";function Be(n,e="Assertion failed!"){if(!n)throw console.error(e),Error(e)}const LS=10;function Va(n,e,t=LS){n=parseFloat(n.toFixed(t)),e=parseFloat(e.toFixed(t));const r=n-e;return r===0?0:r>0?1:-1}function Kn(n,e,t){return Va(n,e,t)===0}function so({panelConstraints:n,panelIndex:e,size:t}){const r=n[e];Be(r!=null);let{collapsedSize:i=0,collapsible:s,maxSize:o=100,minSize:a=0}=r;if(Va(t,a)<0)if(s){const l=(i+a)/2;Va(t,l)<0?t=i:t=a}else t=a;return t=Math.min(o,t),t=parseFloat(t.toFixed(LS)),t}function xa({delta:n,layout:e,panelConstraints:t,pivotIndices:r,trigger:i}){if(Kn(n,0))return e;const s=[...e],[o,a]=r;Be(o!=null),Be(a!=null);let l=0;if(i==="keyboard"){{const u=n<0?a:o,f=t[u];if(Be(f),f.collapsible){const d=e[u];Be(d!=null);const h=t[u];Be(h);const{collapsedSize:p=0,minSize:m=0}=h;if(Kn(d,p)){const g=m-d;Va(g,Math.abs(n))>0&&(n=n<0?0-g:g)}}}{const u=n<0?o:a,f=t[u];Be(f);const{collapsible:d}=f;if(d){const h=e[u];Be(h!=null);const p=t[u];Be(p);const{collapsedSize:m=0,minSize:g=0}=p;if(Kn(h,g)){const v=h-m;Va(v,Math.abs(n))>0&&(n=n<0?0-v:v)}}}}{const u=n<0?1:-1;let f=n<0?a:o,d=0;for(;;){const p=e[f];Be(p!=null);const g=so({panelConstraints:t,panelIndex:f,size:100})-p;if(d+=g,f+=u,f<0||f>=t.length)break}const h=Math.min(Math.abs(n),Math.abs(d));n=n<0?0-h:h}{let f=n<0?o:a;for(;f>=0&&f<t.length;){const d=Math.abs(n)-Math.abs(l),h=e[f];Be(h!=null);const p=h-d,m=so({panelConstraints:t,panelIndex:f,size:p});if(!Kn(h,m)&&(l+=h-m,s[f]=m,l.toPrecision(3).localeCompare(Math.abs(n).toPrecision(3),void 0,{numeric:!0})>=0))break;n<0?f--:f++}}if(Kn(l,0))return e;{const u=n<0?a:o,f=e[u];Be(f!=null);const d=f+l,h=so({panelConstraints:t,panelIndex:u,size:d});if(s[u]=h,!Kn(h,d)){let p=d-h,g=n<0?a:o;for(;g>=0&&g<t.length;){const v=s[g];Be(v!=null);const O=v+p,x=so({panelConstraints:t,panelIndex:g,size:O});if(Kn(v,x)||(p-=x-v,s[g]=x),Kn(p,0))break;n>0?g--:g++}}}const c=s.reduce((u,f)=>f+u,0);return Kn(c,100)?s:e}function rI({layout:n,panelsArray:e,pivotIndices:t}){let r=0,i=100,s=0,o=0;const a=t[0];Be(a!=null),e.forEach((f,d)=>{const{constraints:h}=f,{maxSize:p=100,minSize:m=0}=h;d===a?(r=m,i=p):(s+=m,o+=p)});const l=Math.min(i,100-s),c=Math.max(r,100-o),u=n[a];return{valueMax:l,valueMin:c,valueNow:u}}function Wa(n,e=document){return Array.from(e.querySelectorAll(`[data-panel-resize-handle-id][data-panel-group-id="${n}"]`))}function GS(n,e,t=document){const i=Wa(n,t).findIndex(s=>s.getAttribute("data-panel-resize-handle-id")===e);return i??null}function YS(n,e,t){const r=GS(n,e,t);return r!=null?[r,r+1]:[-1,-1]}function US(n,e=document){var t;if(e instanceof HTMLElement&&(e==null||(t=e.dataset)===null||t===void 0?void 0:t.panelGroupId)==n)return e;const r=e.querySelector(`[data-panel-group][data-panel-group-id="${n}"]`);return r||null}function xf(n,e=document){const t=e.querySelector(`[data-panel-resize-handle-id="${n}"]`);return t||null}function iI(n,e,t,r=document){var i,s,o,a;const l=xf(e,r),c=Wa(n,r),u=l?c.indexOf(l):-1,f=(i=(s=t[u])===null||s===void 0?void 0:s.id)!==null&&i!==void 0?i:null,d=(o=(a=t[u+1])===null||a===void 0?void 0:a.id)!==null&&o!==void 0?o:null;return[f,d]}function sI({committedValuesRef:n,eagerValuesRef:e,groupId:t,layout:r,panelDataArray:i,panelGroupElement:s,setLayout:o}){tr({didWarnAboutMissingResizeHandle:!1}),Za(()=>{if(!s)return;const a=Wa(t,s);for(let l=0;l<i.length-1;l++){const{valueMax:c,valueMin:u,valueNow:f}=rI({layout:r,panelsArray:i,pivotIndices:[l,l+1]}),d=a[l];if(d!=null){const h=i[l];Be(h),d.setAttribute("aria-controls",h.id),d.setAttribute("aria-valuemax",""+Math.round(c)),d.setAttribute("aria-valuemin",""+Math.round(u)),d.setAttribute("aria-valuenow",f!=null?""+Math.round(f):"")}}return()=>{a.forEach((l,c)=>{l.removeAttribute("aria-controls"),l.removeAttribute("aria-valuemax"),l.removeAttribute("aria-valuemin"),l.removeAttribute("aria-valuenow")})}},[t,r,i,s]),Ps(()=>{if(!s)return;const a=e.current;Be(a);const{panelDataArray:l}=a,c=US(t,s);Be(c!=null,`No group found for id "${t}"`);const u=Wa(t,s);Be(u);const f=u.map(d=>{const h=d.getAttribute("data-panel-resize-handle-id");Be(h);const[p,m]=iI(t,h,l,s);if(p==null||m==null)return()=>{};const g=v=>{if(!v.defaultPrevented)switch(v.key){case"Enter":{v.preventDefault();const O=l.findIndex(x=>x.id===p);if(O>=0){const x=l[O];Be(x);const S=r[O],{collapsedSize:y=0,collapsible:w,minSize:C=0}=x.constraints;if(S!=null&&w){const k=xa({delta:Kn(S,y)?C-y:y-S,layout:r,panelConstraints:l.map(P=>P.constraints),pivotIndices:YS(t,h,s),trigger:"keyboard"});r!==k&&o(k)}}break}}};return d.addEventListener("keydown",g),()=>{d.removeEventListener("keydown",g)}});return()=>{f.forEach(d=>d())}},[s,n,e,t,r,i,o])}function $O(n,e){if(n.length!==e.length)return!1;for(let t=0;t<n.length;t++)if(n[t]!==e[t])return!1;return!0}function qS(n){return n.type==="keydown"}function HS(n){return n.type.startsWith("mouse")}function JS(n){return n.type.startsWith("touch")}function KS(n,e){const t=n==="horizontal";if(HS(e))return t?e.clientX:e.clientY;if(JS(e)){const r=e.touches[0];return Be(r),t?r.screenX:r.screenY}else throw Error(`Unsupported event type "${e.type}"`)}function oI(n,e,t,r,i){const s=t==="horizontal",o=xf(e,i);Be(o);const a=o.getAttribute("data-panel-group-id");Be(a);let{initialCursorPosition:l}=r;const c=KS(t,n),u=US(a,i);Be(u);const f=u.getBoundingClientRect(),d=s?f.width:f.height;return(c-l)/d*100}function aI(n,e,t,r,i,s){if(qS(n)){const o=t==="horizontal";let a=0;n.shiftKey?a=100:i!=null?a=i:a=10;let l=0;switch(n.key){case"ArrowDown":l=o?0:a;break;case"ArrowLeft":l=o?-a:0;break;case"ArrowRight":l=o?a:0;break;case"ArrowUp":l=o?0:-a;break;case"End":l=100;break;case"Home":l=-100;break}return l}else return r==null?0:oI(n,e,t,r,s)}function lI({panelDataArray:n}){const e=Array(n.length),t=n.map(s=>s.constraints);let r=0,i=100;for(let s=0;s<n.length;s++){const o=t[s];Be(o);const{defaultSize:a}=o;a!=null&&(r++,e[s]=a,i-=a)}for(let s=0;s<n.length;s++){const o=t[s];Be(o);const{defaultSize:a}=o;if(a!=null)continue;const l=n.length-r,c=i/l;r++,e[s]=c,i-=c}return e}function Ls(n,e,t){e.forEach((r,i)=>{const s=n[i];Be(s);const{callbacks:o,constraints:a,id:l}=s,{collapsedSize:c=0,collapsible:u}=a,f=t[l];if(f==null||r!==f){t[l]=r;const{onCollapse:d,onExpand:h,onResize:p}=o;p&&p(r,f),u&&(d||h)&&(h&&(f==null||f===c)&&r!==c&&h(),d&&(f==null||f!==c)&&r===c&&d())}})}function Hl(n,e){if(n.length!==e.length)return!1;for(let t=0;t<n.length;t++)if(n[t]!=e[t])return!1;return!0}function cI({defaultSize:n,dragState:e,layout:t,panelData:r,panelIndex:i,precision:s=3}){const o=t[i];let a;return o==null?a=n??"1":r.length===1?a="1":a=o.toPrecision(s),{flexBasis:0,flexGrow:a,flexShrink:1,overflow:"hidden",pointerEvents:e!==null?"none":void 0}}let bp=null,Ss=null;function ew(n){switch(n){case"horizontal":return"ew-resize";case"horizontal-max":return"w-resize";case"horizontal-min":return"e-resize";case"vertical":return"ns-resize";case"vertical-max":return"n-resize";case"vertical-min":return"s-resize"}}function uI(){Ss!==null&&(document.head.removeChild(Ss),bp=null,Ss=null)}function bd(n){if(bp===n)return;bp=n;const e=ew(n);Ss===null&&(Ss=document.createElement("style"),document.head.appendChild(Ss)),Ss.innerHTML=`*{cursor: ${e}!important;}`}function fI(n,e=10){let t=null;return(...i)=>{t!==null&&clearTimeout(t),t=setTimeout(()=>{n(...i)},e)}}function RO(n){try{if(typeof localStorage<"u")n.getItem=e=>localStorage.getItem(e),n.setItem=(e,t)=>{localStorage.setItem(e,t)};else throw new Error("localStorage not supported in this environment")}catch(e){console.error(e),n.getItem=()=>null,n.setItem=()=>{}}}function tw(n){return`react-resizable-panels:${n}`}function nw(n){return n.map(e=>{const{constraints:t,id:r,idIsFromProps:i,order:s}=e;return i?r:s?`${s}:${JSON.stringify(t)}`:JSON.stringify(t)}).sort((e,t)=>e.localeCompare(t)).join(",")}function rw(n,e){try{const t=tw(n),r=e.getItem(t);if(r){const i=JSON.parse(r);if(typeof i=="object"&&i!=null)return i}}catch{}return null}function dI(n,e,t){var r,i;const s=(r=rw(n,t))!==null&&r!==void 0?r:{},o=nw(e);return(i=s[o])!==null&&i!==void 0?i:null}function hI(n,e,t,r,i){var s;const o=tw(n),a=nw(e),l=(s=rw(n,i))!==null&&s!==void 0?s:{};l[a]={expandToSizes:Object.fromEntries(t.entries()),layout:r};try{i.setItem(o,JSON.stringify(l))}catch(c){console.error(c)}}function DO({layout:n,panelConstraints:e}){const t=[...n],r=t.reduce((s,o)=>s+o,0);if(t.length!==e.length)throw Error(`Invalid ${e.length} panel layout: ${t.map(s=>`${s}%`).join(", ")}`);if(!Kn(r,100))for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=100/r*o;t[s]=a}let i=0;for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=so({panelConstraints:e,panelIndex:s,size:o});o!=a&&(i+=o-a,t[s]=a)}if(!Kn(i,0))for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=o+i,l=so({panelConstraints:e,panelIndex:s,size:a});if(o!==l&&(i-=l-o,t[s]=l,Kn(i,0)))break}return t}const pI=100,ba={getItem:n=>(RO(ba),ba.getItem(n)),setItem:(n,e)=>{RO(ba),ba.setItem(n,e)}},QO={};function iw({autoSaveId:n=null,children:e,className:t="",direction:r,forwardedRef:i,id:s=null,onLayout:o=null,keyboardResizeBy:a=null,storage:l=ba,style:c,tagName:u="div",...f}){const d=Q0(s),h=tr(null),[p,m]=fu(null),[g,v]=fu([]),O=tr({}),x=tr(new Map),S=tr(0),y=tr({autoSaveId:n,direction:r,dragState:p,id:d,keyboardResizeBy:a,onLayout:o,storage:l}),w=tr({layout:g,panelDataArray:[],panelDataArrayChanged:!1});tr({didLogIdAndOrderWarning:!1,didLogPanelConstraintsWarning:!1,prevPanelIds:[]}),zS(i,()=>({getId:()=>y.current.id,getLayout:()=>{const{layout:D}=w.current;return D},setLayout:D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current,N=DO({layout:D,panelConstraints:q.map(ee=>ee.constraints)});$O(B,N)||(v(N),w.current.layout=N,_&&_(N),Ls(q,N,O.current))}}),[]),Za(()=>{y.current.autoSaveId=n,y.current.direction=r,y.current.dragState=p,y.current.id=d,y.current.onLayout=o,y.current.storage=l}),sI({committedValuesRef:y,eagerValuesRef:w,groupId:d,layout:g,panelDataArray:w.current.panelDataArray,setLayout:v,panelGroupElement:h.current}),Ps(()=>{const{panelDataArray:D}=w.current;if(n){if(g.length===0||g.length!==D.length)return;let _=QO[n];_==null&&(_=fI(hI,pI),QO[n]=_);const B=[...D],q=new Map(x.current);_(n,B,q,g,l)}},[n,g,l]),Ps(()=>{});const C=Bn(D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current;if(D.constraints.collapsible){const N=q.map(oe=>oe.constraints),{collapsedSize:ee=0,panelSize:z,pivotIndices:le}=ps(q,D,B);if(Be(z!=null),z!==ee){x.current.set(D.id,z);const ae=no(q,D)===q.length-1?z-ee:ee-z,K=xa({delta:ae,layout:B,panelConstraints:N,pivotIndices:le,trigger:"imperative-api"});Hl(B,K)||(v(K),w.current.layout=K,_&&_(K),Ls(q,K,O.current))}}},[]),k=Bn(D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current;if(D.constraints.collapsible){const N=q.map(ae=>ae.constraints),{collapsedSize:ee=0,panelSize:z,minSize:le=0,pivotIndices:oe}=ps(q,D,B);if(z===ee){const ae=x.current.get(D.id),K=ae!=null&&ae>=le?ae:le,Y=no(q,D)===q.length-1?z-K:K-z,te=xa({delta:Y,layout:B,panelConstraints:N,pivotIndices:oe,trigger:"imperative-api"});Hl(B,te)||(v(te),w.current.layout=te,_&&_(te),Ls(q,te,O.current))}}},[]),P=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{panelSize:q}=ps(B,D,_);return Be(q!=null),q},[]),A=Bn((D,_)=>{const{panelDataArray:B}=w.current,q=no(B,D);return cI({defaultSize:_,dragState:p,layout:g,panelData:B,panelIndex:q})},[p,g]),E=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{collapsedSize:q=0,collapsible:N,panelSize:ee}=ps(B,D,_);return N===!0&&ee===q},[]),I=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{collapsedSize:q=0,collapsible:N,panelSize:ee}=ps(B,D,_);return Be(ee!=null),!N||ee>q},[]),R=Bn(D=>{const{panelDataArray:_}=w.current;_.push(D),_.sort((B,q)=>{const N=B.order,ee=q.order;return N==null&&ee==null?0:N==null?-1:ee==null?1:N-ee}),w.current.panelDataArrayChanged=!0},[]);Za(()=>{if(w.current.panelDataArrayChanged){w.current.panelDataArrayChanged=!1;const{autoSaveId:D,onLayout:_,storage:B}=y.current,{layout:q,panelDataArray:N}=w.current;let ee=null;if(D){const le=dI(D,N,B);le&&(x.current=new Map(Object.entries(le.expandToSizes)),ee=le.layout)}ee==null&&(ee=lI({panelDataArray:N}));const z=DO({layout:ee,panelConstraints:N.map(le=>le.constraints)});$O(q,z)||(v(z),w.current.layout=z,_&&_(z),Ls(N,z,O.current))}});const j=Bn(D=>function(B){B.preventDefault();const q=h.current;if(!q)return()=>null;const{direction:N,dragState:ee,id:z,keyboardResizeBy:le,onLayout:oe}=y.current,{layout:ae,panelDataArray:K}=w.current,{initialLayout:he}=ee??{},Y=YS(z,D,q);let te=aI(B,D,N,ee,le,q);if(te===0)return;const me=N==="horizontal";document.dir==="rtl"&&me&&(te=-te);const xe=K.map(Pe=>Pe.constraints),$e=xa({delta:te,layout:he??ae,panelConstraints:xe,pivotIndices:Y,trigger:qS(B)?"keyboard":"mouse-or-touch"}),be=!Hl(ae,$e);(HS(B)||JS(B))&&S.current!=te&&(S.current=te,bd(be?me?"horizontal":"vertical":me?te<0?"horizontal-min":"horizontal-max":te<0?"vertical-min":"vertical-max")),be&&(v($e),w.current.layout=$e,oe&&oe($e),Ls(K,$e,O.current))},[]),$=Bn((D,_)=>{const{onLayout:B}=y.current,{layout:q,panelDataArray:N}=w.current,ee=N.map(he=>he.constraints),{panelSize:z,pivotIndices:le}=ps(N,D,q);Be(z!=null);const ae=no(N,D)===N.length-1?z-_:_-z,K=xa({delta:ae,layout:q,panelConstraints:ee,pivotIndices:le,trigger:"imperative-api"});Hl(q,K)||(v(K),w.current.layout=K,B&&B(K),Ls(N,K,O.current))},[]),F=Bn((D,_)=>{const{layout:B,panelDataArray:q}=w.current,{collapsedSize:N=0,collapsible:ee,defaultSize:z,maxSize:le=100,minSize:oe=0}=_,{collapsedSize:ae=0,collapsible:K,defaultSize:he,maxSize:Y=100,minSize:te=0}=D.constraints,{panelSize:me}=ps(q,D,B);Be(me!=null),ee&&K&&N!==ae&&me===N?$(D,ae):me<te?$(D,te):me>Y&&$(D,Y)},[$]),X=Bn((D,_)=>{const{direction:B}=y.current,{layout:q}=w.current;if(!h.current)return;const N=xf(D,h.current);Be(N);const ee=KS(B,_);m({dragHandleId:D,dragHandleRect:N.getBoundingClientRect(),initialCursorPosition:ee,initialLayout:q})},[]),V=Bn(()=>{uI(),m(null)},[]),U=Bn(D=>{const{panelDataArray:_}=w.current,B=no(_,D);B>=0&&(_.splice(B,1),delete O.current[D.id],w.current.panelDataArrayChanged=!0)},[]),L=eI(()=>({collapsePanel:C,direction:r,dragState:p,expandPanel:k,getPanelSize:P,getPanelStyle:A,groupId:d,isPanelCollapsed:E,isPanelExpanded:I,reevaluatePanelConstraints:F,registerPanel:R,registerResizeHandle:j,resizePanel:$,startDragging:X,stopDragging:V,unregisterPanel:U,panelGroupElement:h.current}),[C,p,r,k,P,A,d,E,I,F,R,j,$,X,V,U]),W={display:"flex",flexDirection:r==="horizontal"?"row":"column",height:"100%",overflow:"hidden",width:"100%"};return Ao(vf.Provider,{value:L},Ao(u,{...f,children:e,className:t,style:{...W,...c},ref:h,"data-panel-group":"","data-panel-group-direction":r,"data-panel-group-id":d}))}const sw=VS((n,e)=>Ao(iw,{...n,forwardedRef:e}));iw.displayName="PanelGroup";sw.displayName="forwardRef(PanelGroup)";function no(n,e){return n.findIndex(t=>t===e||t.id===e.id)}function ps(n,e,t){const r=no(n,e),s=r===n.length-1?[r-1,r]:[r,r+1],o=t[r];return{...e.constraints,panelSize:o,pivotIndices:s}}function gI({disabled:n,handleId:e,resizeHandler:t,panelGroupElement:r}){Ps(()=>{if(n||t==null||r==null)return;const i=xf(e,r);if(i==null)return;const s=o=>{if(!o.defaultPrevented)switch(o.key){case"ArrowDown":case"ArrowLeft":case"ArrowRight":case"ArrowUp":case"End":case"Home":{o.preventDefault(),t(o);break}case"F6":{o.preventDefault();const a=i.getAttribute("data-panel-group-id");Be(a);const l=Wa(a,r),c=GS(a,e,r);Be(c!==null);const u=o.shiftKey?c>0?c-1:l.length-1:c+1<l.length?c+1:0;l[u].focus();break}}};return i.addEventListener("keydown",s),()=>{i.removeEventListener("keydown",s)}},[r,n,e,t])}function ow({children:n=null,className:e="",disabled:t=!1,id:r,onDragging:i,style:s={},tabIndex:o=0,tagName:a="div",...l}){const c=tr(null),u=tr({onDragging:i});Ps(()=>{u.current.onDragging=i});const f=WS(vf);if(f===null)throw Error("PanelResizeHandle components must be rendered within a PanelGroup container");const{direction:d,dragState:h,groupId:p,registerResizeHandle:m,startDragging:g,stopDragging:v,panelGroupElement:O}=f,x=Q0(r),S=(h==null?void 0:h.dragHandleId)===x,[y,w]=fu(!1),[C,k]=fu(null),P=Bn(()=>{const E=c.current;Be(E),E.blur(),v();const{onDragging:I}=u.current;I&&I(!1)},[v]);Ps(()=>{if(t)k(null);else{const E=m(x);k(()=>E)}},[t,x,m]),Ps(()=>{if(t||C==null||!S)return;const E=$=>{C($)},I=$=>{C($)},R=c.current;Be(R);const j=R.ownerDocument;return j.body.addEventListener("contextmenu",P),j.body.addEventListener("mousemove",E),j.body.addEventListener("touchmove",E),j.body.addEventListener("mouseleave",I),window.addEventListener("mouseup",P),window.addEventListener("touchend",P),()=>{j.body.removeEventListener("contextmenu",P),j.body.removeEventListener("mousemove",E),j.body.removeEventListener("touchmove",E),j.body.removeEventListener("mouseleave",I),window.removeEventListener("mouseup",P),window.removeEventListener("touchend",P)}},[d,t,S,C,P]),gI({disabled:t,handleId:x,resizeHandler:C,panelGroupElement:O});const A={cursor:ew(d),touchAction:"none",userSelect:"none"};return Ao(a,{...l,children:n,className:e,onBlur:()=>w(!1),onFocus:()=>w(!0),onMouseDown:E=>{g(x,E.nativeEvent);const I=u.current;Be(I);const{onDragging:R}=I;R&&R(!0)},onMouseUp:P,onTouchCancel:P,onTouchEnd:P,onTouchStart:E=>{g(x,E.nativeEvent);const I=u.current;Be(I);const{onDragging:R}=I;R&&R(!0)},ref:c,role:"separator",style:{...A,...s},tabIndex:o,"data-panel-group-direction":d,"data-panel-group-id":p,"data-resize-handle":"","data-resize-handle-active":S?"pointer":y?"keyboard":void 0,"data-panel-resize-handle-enabled":!t,"data-panel-resize-handle-id":x})}ow.displayName="PanelResizeHandle";const Ze=M.div`
+See https://s-c.sh/2BAXzed for more info.`),window["__styled-components-init__"]+=1);const M=vp,{createElement:Ao,createContext:JT,createRef:kU,forwardRef:VS,useCallback:Bn,useContext:WS,useEffect:Ps,useImperativeHandle:zS,useLayoutEffect:KT,useMemo:eI,useRef:tr,useState:fu}=H,IO=H["useId".toString()],vf=JT(null);vf.displayName="PanelGroupContext";const Za=KT,tI=typeof IO=="function"?IO:()=>null;let nI=0;function Q0(n=null){const e=tI(),t=tr(n||e||null);return t.current===null&&(t.current=""+nI++),n??t.current}function XS({children:n,className:e="",collapsedSize:t,collapsible:r,defaultSize:i,forwardedRef:s,id:o,maxSize:a,minSize:l,onCollapse:c,onExpand:u,onResize:f,order:d,style:h,tagName:p="div",...m}){const g=WS(vf);if(g===null)throw Error("Panel components must be rendered within a PanelGroup container");const{collapsePanel:v,expandPanel:O,getPanelSize:x,getPanelStyle:S,groupId:y,isPanelCollapsed:w,reevaluatePanelConstraints:C,registerPanel:k,resizePanel:P,unregisterPanel:A}=g,E=Q0(o),I=tr({callbacks:{onCollapse:c,onExpand:u,onResize:f},constraints:{collapsedSize:t,collapsible:r,defaultSize:i,maxSize:a,minSize:l},id:E,idIsFromProps:o!==void 0,order:d});tr({didLogMissingDefaultSizeWarning:!1}),Za(()=>{const{callbacks:j,constraints:$}=I.current,F={...$};I.current.id=E,I.current.idIsFromProps=o!==void 0,I.current.order=d,j.onCollapse=c,j.onExpand=u,j.onResize=f,$.collapsedSize=t,$.collapsible=r,$.defaultSize=i,$.maxSize=a,$.minSize=l,(F.collapsedSize!==$.collapsedSize||F.collapsible!==$.collapsible||F.maxSize!==$.maxSize||F.minSize!==$.minSize)&&C(I.current,F)}),Za(()=>{const j=I.current;return k(j),()=>{A(j)}},[d,E,k,A]),zS(s,()=>({collapse:()=>{v(I.current)},expand:()=>{O(I.current)},getId(){return E},getSize(){return x(I.current)},isCollapsed(){return w(I.current)},isExpanded(){return!w(I.current)},resize:j=>{P(I.current,j)}}),[v,O,x,w,E,P]);const R=S(I.current,i);return Ao(p,{...m,children:n,className:e,style:{...R,...h},"data-panel":"","data-panel-id":E,"data-panel-group-id":y,"data-panel-collapsible":void 0,"data-panel-size":void 0})}const xp=VS((n,e)=>Ao(XS,{...n,forwardedRef:e}));XS.displayName="Panel";xp.displayName="forwardRef(Panel)";function Be(n,e="Assertion failed!"){if(!n)throw console.error(e),Error(e)}const LS=10;function Va(n,e,t=LS){n=parseFloat(n.toFixed(t)),e=parseFloat(e.toFixed(t));const r=n-e;return r===0?0:r>0?1:-1}function Kn(n,e,t){return Va(n,e,t)===0}function so({panelConstraints:n,panelIndex:e,size:t}){const r=n[e];Be(r!=null);let{collapsedSize:i=0,collapsible:s,maxSize:o=100,minSize:a=0}=r;if(Va(t,a)<0)if(s){const l=(i+a)/2;Va(t,l)<0?t=i:t=a}else t=a;return t=Math.min(o,t),t=parseFloat(t.toFixed(LS)),t}function xa({delta:n,layout:e,panelConstraints:t,pivotIndices:r,trigger:i}){if(Kn(n,0))return e;const s=[...e],[o,a]=r;Be(o!=null),Be(a!=null);let l=0;if(i==="keyboard"){{const u=n<0?a:o,f=t[u];if(Be(f),f.collapsible){const d=e[u];Be(d!=null);const h=t[u];Be(h);const{collapsedSize:p=0,minSize:m=0}=h;if(Kn(d,p)){const g=m-d;Va(g,Math.abs(n))>0&&(n=n<0?0-g:g)}}}{const u=n<0?o:a,f=t[u];Be(f);const{collapsible:d}=f;if(d){const h=e[u];Be(h!=null);const p=t[u];Be(p);const{collapsedSize:m=0,minSize:g=0}=p;if(Kn(h,g)){const v=h-m;Va(v,Math.abs(n))>0&&(n=n<0?0-v:v)}}}}{const u=n<0?1:-1;let f=n<0?a:o,d=0;for(;;){const p=e[f];Be(p!=null);const g=so({panelConstraints:t,panelIndex:f,size:100})-p;if(d+=g,f+=u,f<0||f>=t.length)break}const h=Math.min(Math.abs(n),Math.abs(d));n=n<0?0-h:h}{let f=n<0?o:a;for(;f>=0&&f<t.length;){const d=Math.abs(n)-Math.abs(l),h=e[f];Be(h!=null);const p=h-d,m=so({panelConstraints:t,panelIndex:f,size:p});if(!Kn(h,m)&&(l+=h-m,s[f]=m,l.toPrecision(3).localeCompare(Math.abs(n).toPrecision(3),void 0,{numeric:!0})>=0))break;n<0?f--:f++}}if(Kn(l,0))return e;{const u=n<0?a:o,f=e[u];Be(f!=null);const d=f+l,h=so({panelConstraints:t,panelIndex:u,size:d});if(s[u]=h,!Kn(h,d)){let p=d-h,g=n<0?a:o;for(;g>=0&&g<t.length;){const v=s[g];Be(v!=null);const O=v+p,x=so({panelConstraints:t,panelIndex:g,size:O});if(Kn(v,x)||(p-=x-v,s[g]=x),Kn(p,0))break;n>0?g--:g++}}}const c=s.reduce((u,f)=>f+u,0);return Kn(c,100)?s:e}function rI({layout:n,panelsArray:e,pivotIndices:t}){let r=0,i=100,s=0,o=0;const a=t[0];Be(a!=null),e.forEach((f,d)=>{const{constraints:h}=f,{maxSize:p=100,minSize:m=0}=h;d===a?(r=m,i=p):(s+=m,o+=p)});const l=Math.min(i,100-s),c=Math.max(r,100-o),u=n[a];return{valueMax:l,valueMin:c,valueNow:u}}function Wa(n,e=document){return Array.from(e.querySelectorAll(`[data-panel-resize-handle-id][data-panel-group-id="${n}"]`))}function GS(n,e,t=document){const i=Wa(n,t).findIndex(s=>s.getAttribute("data-panel-resize-handle-id")===e);return i??null}function YS(n,e,t){const r=GS(n,e,t);return r!=null?[r,r+1]:[-1,-1]}function US(n,e=document){var t;if(e instanceof HTMLElement&&(e==null||(t=e.dataset)===null||t===void 0?void 0:t.panelGroupId)==n)return e;const r=e.querySelector(`[data-panel-group][data-panel-group-id="${n}"]`);return r||null}function xf(n,e=document){const t=e.querySelector(`[data-panel-resize-handle-id="${n}"]`);return t||null}function iI(n,e,t,r=document){var i,s,o,a;const l=xf(e,r),c=Wa(n,r),u=l?c.indexOf(l):-1,f=(i=(s=t[u])===null||s===void 0?void 0:s.id)!==null&&i!==void 0?i:null,d=(o=(a=t[u+1])===null||a===void 0?void 0:a.id)!==null&&o!==void 0?o:null;return[f,d]}function sI({committedValuesRef:n,eagerValuesRef:e,groupId:t,layout:r,panelDataArray:i,panelGroupElement:s,setLayout:o}){tr({didWarnAboutMissingResizeHandle:!1}),Za(()=>{if(!s)return;const a=Wa(t,s);for(let l=0;l<i.length-1;l++){const{valueMax:c,valueMin:u,valueNow:f}=rI({layout:r,panelsArray:i,pivotIndices:[l,l+1]}),d=a[l];if(d!=null){const h=i[l];Be(h),d.setAttribute("aria-controls",h.id),d.setAttribute("aria-valuemax",""+Math.round(c)),d.setAttribute("aria-valuemin",""+Math.round(u)),d.setAttribute("aria-valuenow",f!=null?""+Math.round(f):"")}}return()=>{a.forEach((l,c)=>{l.removeAttribute("aria-controls"),l.removeAttribute("aria-valuemax"),l.removeAttribute("aria-valuemin"),l.removeAttribute("aria-valuenow")})}},[t,r,i,s]),Ps(()=>{if(!s)return;const a=e.current;Be(a);const{panelDataArray:l}=a,c=US(t,s);Be(c!=null,`No group found for id "${t}"`);const u=Wa(t,s);Be(u);const f=u.map(d=>{const h=d.getAttribute("data-panel-resize-handle-id");Be(h);const[p,m]=iI(t,h,l,s);if(p==null||m==null)return()=>{};const g=v=>{if(!v.defaultPrevented)switch(v.key){case"Enter":{v.preventDefault();const O=l.findIndex(x=>x.id===p);if(O>=0){const x=l[O];Be(x);const S=r[O],{collapsedSize:y=0,collapsible:w,minSize:C=0}=x.constraints;if(S!=null&&w){const k=xa({delta:Kn(S,y)?C-y:y-S,layout:r,panelConstraints:l.map(P=>P.constraints),pivotIndices:YS(t,h,s),trigger:"keyboard"});r!==k&&o(k)}}break}}};return d.addEventListener("keydown",g),()=>{d.removeEventListener("keydown",g)}});return()=>{f.forEach(d=>d())}},[s,n,e,t,r,i,o])}function $O(n,e){if(n.length!==e.length)return!1;for(let t=0;t<n.length;t++)if(n[t]!==e[t])return!1;return!0}function qS(n){return n.type==="keydown"}function HS(n){return n.type.startsWith("mouse")}function JS(n){return n.type.startsWith("touch")}function KS(n,e){const t=n==="horizontal";if(HS(e))return t?e.clientX:e.clientY;if(JS(e)){const r=e.touches[0];return Be(r),t?r.screenX:r.screenY}else throw Error(`Unsupported event type "${e.type}"`)}function oI(n,e,t,r,i){const s=t==="horizontal",o=xf(e,i);Be(o);const a=o.getAttribute("data-panel-group-id");Be(a);let{initialCursorPosition:l}=r;const c=KS(t,n),u=US(a,i);Be(u);const f=u.getBoundingClientRect(),d=s?f.width:f.height;return(c-l)/d*100}function aI(n,e,t,r,i,s){if(qS(n)){const o=t==="horizontal";let a=0;n.shiftKey?a=100:i!=null?a=i:a=10;let l=0;switch(n.key){case"ArrowDown":l=o?0:a;break;case"ArrowLeft":l=o?-a:0;break;case"ArrowRight":l=o?a:0;break;case"ArrowUp":l=o?0:-a;break;case"End":l=100;break;case"Home":l=-100;break}return l}else return r==null?0:oI(n,e,t,r,s)}function lI({panelDataArray:n}){const e=Array(n.length),t=n.map(s=>s.constraints);let r=0,i=100;for(let s=0;s<n.length;s++){const o=t[s];Be(o);const{defaultSize:a}=o;a!=null&&(r++,e[s]=a,i-=a)}for(let s=0;s<n.length;s++){const o=t[s];Be(o);const{defaultSize:a}=o;if(a!=null)continue;const l=n.length-r,c=i/l;r++,e[s]=c,i-=c}return e}function Ls(n,e,t){e.forEach((r,i)=>{const s=n[i];Be(s);const{callbacks:o,constraints:a,id:l}=s,{collapsedSize:c=0,collapsible:u}=a,f=t[l];if(f==null||r!==f){t[l]=r;const{onCollapse:d,onExpand:h,onResize:p}=o;p&&p(r,f),u&&(d||h)&&(h&&(f==null||f===c)&&r!==c&&h(),d&&(f==null||f!==c)&&r===c&&d())}})}function Hl(n,e){if(n.length!==e.length)return!1;for(let t=0;t<n.length;t++)if(n[t]!=e[t])return!1;return!0}function cI({defaultSize:n,dragState:e,layout:t,panelData:r,panelIndex:i,precision:s=3}){const o=t[i];let a;return o==null?a=n??"1":r.length===1?a="1":a=o.toPrecision(s),{flexBasis:0,flexGrow:a,flexShrink:1,overflow:"hidden",pointerEvents:e!==null?"none":void 0}}let bp=null,Ss=null;function ew(n){switch(n){case"horizontal":return"ew-resize";case"horizontal-max":return"w-resize";case"horizontal-min":return"e-resize";case"vertical":return"ns-resize";case"vertical-max":return"n-resize";case"vertical-min":return"s-resize"}}function uI(){Ss!==null&&(document.head.removeChild(Ss),bp=null,Ss=null)}function bd(n){if(bp===n)return;bp=n;const e=ew(n);Ss===null&&(Ss=document.createElement("style"),document.head.appendChild(Ss)),Ss.innerHTML=`*{cursor: ${e}!important;}`}function fI(n,e=10){let t=null;return(...i)=>{t!==null&&clearTimeout(t),t=setTimeout(()=>{n(...i)},e)}}function RO(n){try{if(typeof localStorage<"u")n.getItem=e=>localStorage.getItem(e),n.setItem=(e,t)=>{localStorage.setItem(e,t)};else throw new Error("localStorage not supported in this environment")}catch(e){console.error(e),n.getItem=()=>null,n.setItem=()=>{}}}function tw(n){return`react-resizable-panels:${n}`}function nw(n){return n.map(e=>{const{constraints:t,id:r,idIsFromProps:i,order:s}=e;return i?r:s?`${s}:${JSON.stringify(t)}`:JSON.stringify(t)}).sort((e,t)=>e.localeCompare(t)).join(",")}function rw(n,e){try{const t=tw(n),r=e.getItem(t);if(r){const i=JSON.parse(r);if(typeof i=="object"&&i!=null)return i}}catch{}return null}function dI(n,e,t){var r,i;const s=(r=rw(n,t))!==null&&r!==void 0?r:{},o=nw(e);return(i=s[o])!==null&&i!==void 0?i:null}function hI(n,e,t,r,i){var s;const o=tw(n),a=nw(e),l=(s=rw(n,i))!==null&&s!==void 0?s:{};l[a]={expandToSizes:Object.fromEntries(t.entries()),layout:r};try{i.setItem(o,JSON.stringify(l))}catch(c){console.error(c)}}function DO({layout:n,panelConstraints:e}){const t=[...n],r=t.reduce((s,o)=>s+o,0);if(t.length!==e.length)throw Error(`Invalid ${e.length} panel layout: ${t.map(s=>`${s}%`).join(", ")}`);if(!Kn(r,100))for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=100/r*o;t[s]=a}let i=0;for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=so({panelConstraints:e,panelIndex:s,size:o});o!=a&&(i+=o-a,t[s]=a)}if(!Kn(i,0))for(let s=0;s<e.length;s++){const o=t[s];Be(o!=null);const a=o+i,l=so({panelConstraints:e,panelIndex:s,size:a});if(o!==l&&(i-=l-o,t[s]=l,Kn(i,0)))break}return t}const pI=100,ba={getItem:n=>(RO(ba),ba.getItem(n)),setItem:(n,e)=>{RO(ba),ba.setItem(n,e)}},QO={};function iw({autoSaveId:n=null,children:e,className:t="",direction:r,forwardedRef:i,id:s=null,onLayout:o=null,keyboardResizeBy:a=null,storage:l=ba,style:c,tagName:u="div",...f}){const d=Q0(s),h=tr(null),[p,m]=fu(null),[g,v]=fu([]),O=tr({}),x=tr(new Map),S=tr(0),y=tr({autoSaveId:n,direction:r,dragState:p,id:d,keyboardResizeBy:a,onLayout:o,storage:l}),w=tr({layout:g,panelDataArray:[],panelDataArrayChanged:!1});tr({didLogIdAndOrderWarning:!1,didLogPanelConstraintsWarning:!1,prevPanelIds:[]}),zS(i,()=>({getId:()=>y.current.id,getLayout:()=>{const{layout:D}=w.current;return D},setLayout:D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current,N=DO({layout:D,panelConstraints:q.map(ee=>ee.constraints)});$O(B,N)||(v(N),w.current.layout=N,_&&_(N),Ls(q,N,O.current))}}),[]),Za(()=>{y.current.autoSaveId=n,y.current.direction=r,y.current.dragState=p,y.current.id=d,y.current.onLayout=o,y.current.storage=l}),sI({committedValuesRef:y,eagerValuesRef:w,groupId:d,layout:g,panelDataArray:w.current.panelDataArray,setLayout:v,panelGroupElement:h.current}),Ps(()=>{const{panelDataArray:D}=w.current;if(n){if(g.length===0||g.length!==D.length)return;let _=QO[n];_==null&&(_=fI(hI,pI),QO[n]=_);const B=[...D],q=new Map(x.current);_(n,B,q,g,l)}},[n,g,l]),Ps(()=>{});const C=Bn(D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current;if(D.constraints.collapsible){const N=q.map(oe=>oe.constraints),{collapsedSize:ee=0,panelSize:z,pivotIndices:le}=ps(q,D,B);if(Be(z!=null),z!==ee){x.current.set(D.id,z);const ae=no(q,D)===q.length-1?z-ee:ee-z,K=xa({delta:ae,layout:B,panelConstraints:N,pivotIndices:le,trigger:"imperative-api"});Hl(B,K)||(v(K),w.current.layout=K,_&&_(K),Ls(q,K,O.current))}}},[]),k=Bn(D=>{const{onLayout:_}=y.current,{layout:B,panelDataArray:q}=w.current;if(D.constraints.collapsible){const N=q.map(ae=>ae.constraints),{collapsedSize:ee=0,panelSize:z,minSize:le=0,pivotIndices:oe}=ps(q,D,B);if(z===ee){const ae=x.current.get(D.id),K=ae!=null&&ae>=le?ae:le,Y=no(q,D)===q.length-1?z-K:K-z,te=xa({delta:Y,layout:B,panelConstraints:N,pivotIndices:oe,trigger:"imperative-api"});Hl(B,te)||(v(te),w.current.layout=te,_&&_(te),Ls(q,te,O.current))}}},[]),P=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{panelSize:q}=ps(B,D,_);return Be(q!=null),q},[]),A=Bn((D,_)=>{const{panelDataArray:B}=w.current,q=no(B,D);return cI({defaultSize:_,dragState:p,layout:g,panelData:B,panelIndex:q})},[p,g]),E=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{collapsedSize:q=0,collapsible:N,panelSize:ee}=ps(B,D,_);return N===!0&&ee===q},[]),I=Bn(D=>{const{layout:_,panelDataArray:B}=w.current,{collapsedSize:q=0,collapsible:N,panelSize:ee}=ps(B,D,_);return Be(ee!=null),!N||ee>q},[]),R=Bn(D=>{const{panelDataArray:_}=w.current;_.push(D),_.sort((B,q)=>{const N=B.order,ee=q.order;return N==null&&ee==null?0:N==null?-1:ee==null?1:N-ee}),w.current.panelDataArrayChanged=!0},[]);Za(()=>{if(w.current.panelDataArrayChanged){w.current.panelDataArrayChanged=!1;const{autoSaveId:D,onLayout:_,storage:B}=y.current,{layout:q,panelDataArray:N}=w.current;let ee=null;if(D){const le=dI(D,N,B);le&&(x.current=new Map(Object.entries(le.expandToSizes)),ee=le.layout)}ee==null&&(ee=lI({panelDataArray:N}));const z=DO({layout:ee,panelConstraints:N.map(le=>le.constraints)});$O(q,z)||(v(z),w.current.layout=z,_&&_(z),Ls(N,z,O.current))}});const j=Bn(D=>function(B){B.preventDefault();const q=h.current;if(!q)return()=>null;const{direction:N,dragState:ee,id:z,keyboardResizeBy:le,onLayout:oe}=y.current,{layout:ae,panelDataArray:K}=w.current,{initialLayout:he}=ee??{},Y=YS(z,D,q);let te=aI(B,D,N,ee,le,q);if(te===0)return;const me=N==="horizontal";document.dir==="rtl"&&me&&(te=-te);const xe=K.map(Pe=>Pe.constraints),$e=xa({delta:te,layout:he??ae,panelConstraints:xe,pivotIndices:Y,trigger:qS(B)?"keyboard":"mouse-or-touch"}),be=!Hl(ae,$e);(HS(B)||JS(B))&&S.current!=te&&(S.current=te,bd(be?me?"horizontal":"vertical":me?te<0?"horizontal-min":"horizontal-max":te<0?"vertical-min":"vertical-max")),be&&(v($e),w.current.layout=$e,oe&&oe($e),Ls(K,$e,O.current))},[]),$=Bn((D,_)=>{const{onLayout:B}=y.current,{layout:q,panelDataArray:N}=w.current,ee=N.map(he=>he.constraints),{panelSize:z,pivotIndices:le}=ps(N,D,q);Be(z!=null);const ae=no(N,D)===N.length-1?z-_:_-z,K=xa({delta:ae,layout:q,panelConstraints:ee,pivotIndices:le,trigger:"imperative-api"});Hl(q,K)||(v(K),w.current.layout=K,B&&B(K),Ls(N,K,O.current))},[]),F=Bn((D,_)=>{const{layout:B,panelDataArray:q}=w.current,{collapsedSize:N=0,collapsible:ee,defaultSize:z,maxSize:le=100,minSize:oe=0}=_,{collapsedSize:ae=0,collapsible:K,defaultSize:he,maxSize:Y=100,minSize:te=0}=D.constraints,{panelSize:me}=ps(q,D,B);Be(me!=null),ee&&K&&N!==ae&&me===N?$(D,ae):me<te?$(D,te):me>Y&&$(D,Y)},[$]),X=Bn((D,_)=>{const{direction:B}=y.current,{layout:q}=w.current;if(!h.current)return;const N=xf(D,h.current);Be(N);const ee=KS(B,_);m({dragHandleId:D,dragHandleRect:N.getBoundingClientRect(),initialCursorPosition:ee,initialLayout:q})},[]),V=Bn(()=>{uI(),m(null)},[]),U=Bn(D=>{const{panelDataArray:_}=w.current,B=no(_,D);B>=0&&(_.splice(B,1),delete O.current[D.id],w.current.panelDataArrayChanged=!0)},[]),L=eI(()=>({collapsePanel:C,direction:r,dragState:p,expandPanel:k,getPanelSize:P,getPanelStyle:A,groupId:d,isPanelCollapsed:E,isPanelExpanded:I,reevaluatePanelConstraints:F,registerPanel:R,registerResizeHandle:j,resizePanel:$,startDragging:X,stopDragging:V,unregisterPanel:U,panelGroupElement:h.current}),[C,p,r,k,P,A,d,E,I,F,R,j,$,X,V,U]),W={display:"flex",flexDirection:r==="horizontal"?"row":"column",height:"100%",overflow:"hidden",width:"100%"};return Ao(vf.Provider,{value:L},Ao(u,{...f,children:e,className:t,style:{...W,...c},ref:h,"data-panel-group":"","data-panel-group-direction":r,"data-panel-group-id":d}))}const sw=VS((n,e)=>Ao(iw,{...n,forwardedRef:e}));iw.displayName="PanelGroup";sw.displayName="forwardRef(PanelGroup)";function no(n,e){return n.findIndex(t=>t===e||t.id===e.id)}function ps(n,e,t){const r=no(n,e),s=r===n.length-1?[r-1,r]:[r,r+1],o=t[r];return{...e.constraints,panelSize:o,pivotIndices:s}}function gI({disabled:n,handleId:e,resizeHandler:t,panelGroupElement:r}){Ps(()=>{if(n||t==null||r==null)return;const i=xf(e,r);if(i==null)return;const s=o=>{if(!o.defaultPrevented)switch(o.key){case"ArrowDown":case"ArrowLeft":case"ArrowRight":case"ArrowUp":case"End":case"Home":{o.preventDefault(),t(o);break}case"F6":{o.preventDefault();const a=i.getAttribute("data-panel-group-id");Be(a);const l=Wa(a,r),c=GS(a,e,r);Be(c!==null);const u=o.shiftKey?c>0?c-1:l.length-1:c+1<l.length?c+1:0;l[u].focus();break}}};return i.addEventListener("keydown",s),()=>{i.removeEventListener("keydown",s)}},[r,n,e,t])}function ow({children:n=null,className:e="",disabled:t=!1,id:r,onDragging:i,style:s={},tabIndex:o=0,tagName:a="div",...l}){const c=tr(null),u=tr({onDragging:i});Ps(()=>{u.current.onDragging=i});const f=WS(vf);if(f===null)throw Error("PanelResizeHandle components must be rendered within a PanelGroup container");const{direction:d,dragState:h,groupId:p,registerResizeHandle:m,startDragging:g,stopDragging:v,panelGroupElement:O}=f,x=Q0(r),S=(h==null?void 0:h.dragHandleId)===x,[y,w]=fu(!1),[C,k]=fu(null),P=Bn(()=>{const E=c.current;Be(E),E.blur(),v();const{onDragging:I}=u.current;I&&I(!1)},[v]);Ps(()=>{if(t)k(null);else{const E=m(x);k(()=>E)}},[t,x,m]),Ps(()=>{if(t||C==null||!S)return;const E=$=>{C($)},I=$=>{C($)},R=c.current;Be(R);const j=R.ownerDocument;return j.body.addEventListener("contextmenu",P),j.body.addEventListener("mousemove",E),j.body.addEventListener("touchmove",E),j.body.addEventListener("mouseleave",I),window.addEventListener("mouseup",P),window.addEventListener("touchend",P),()=>{j.body.removeEventListener("contextmenu",P),j.body.removeEventListener("mousemove",E),j.body.removeEventListener("touchmove",E),j.body.removeEventListener("mouseleave",I),window.removeEventListener("mouseup",P),window.removeEventListener("touchend",P)}},[d,t,S,C,P]),gI({disabled:t,handleId:x,resizeHandler:C,panelGroupElement:O});const A={cursor:ew(d),touchAction:"none",userSelect:"none"};return Ao(a,{...l,children:n,className:e,onBlur:()=>w(!1),onFocus:()=>w(!0),onMouseDown:E=>{g(x,E.nativeEvent);const I=u.current;Be(I);const{onDragging:R}=I;R&&R(!0)},onMouseUp:P,onTouchCancel:P,onTouchEnd:P,onTouchStart:E=>{g(x,E.nativeEvent);const I=u.current;Be(I);const{onDragging:R}=I;R&&R(!0)},ref:c,role:"separator",style:{...A,...s},tabIndex:o,"data-panel-group-direction":d,"data-panel-group-id":p,"data-resize-handle":"","data-resize-handle-active":S?"pointer":y?"keyboard":void 0,"data-panel-resize-handle-enabled":!t,"data-panel-resize-handle-id":x})}ow.displayName="PanelResizeHandle";const Ze=M.div`
   border-bottom: 1px solid var(--border-color-secondary);
   width: 100%;
 `;function mI({onDoubleClick:n,...e}){return b.jsx(ow,{...e,children:b.jsx(OI,{onDoubleClick:n,children:b.jsx(Ze,{})})})}const OI=M.div`
@@ -276,7 +276,7 @@ html body {
   span {
     color: var(--text-color-secondary);
   }
-`,pj=[{label:"Default",value:!1},{label:"Secret",value:!0}];function Sl({variable:n,onSave:e,onCancel:t,className:r,readonlyName:i,readonlyValue:s,isNew:o}){const[a,l]=Q.useState(n.name),[c,u]=Q.useState(n.value),[f,d]=Q.useState(n.isSecret),h=()=>{e({...n,name:a,value:c,isSecret:f})},p=Q.useCallback(({value:m})=>d(m),[]);return b.jsxs(gj,{className:r,children:[b.jsxs(mj,{children:[o?"New":"Edit"," variable"]}),b.jsx(Wv,{children:"Name"}),b.jsx(Ya,{"data-testid":"variable-name-input",type:"text",placeholder:"Enter name",value:a,readOnly:i,onChange:m=>l(m.target.value)}),b.jsx(Wv,{children:"Value"}),b.jsx(Ya,{"data-testid":"variable-value-input",type:"text",placeholder:"Enter value",value:c,readOnly:s,onChange:m=>u(m.target.value)}),b.jsxs(vj,{children:[b.jsx(Oj,{children:"Type"}),b.jsx(G.Segmented,{size:"small",options:pj,value:!!f,onChange:p})]}),b.jsxs(xj,{children:[b.jsx(G.Button,{size:"small",variant:"text",onClick:t,children:"Cancel"}),b.jsx(G.Button,{size:"small",variant:"primary",onClick:h,disabled:!c||!a,"data-testid":"variable-save-button",children:"Save"})]})]})}const gj=M.div`
+`,pj=[{label:"Default",value:!1},{label:"Secret",value:!0}];function Sl({variable:n,onSave:e,onCancel:t,className:r,readonlyName:i,readonlyValue:s,isNew:o}){const[a,l]=Q.useState(n.name),[c,u]=Q.useState(n.value),[f,d]=Q.useState(n.isSecret),h=()=>{e({...n,name:a,value:c,isSecret:f})},p=Q.useCallback(({value:m})=>d(m),[]);return b.jsxs(gj,{className:r,children:[b.jsxs(mj,{children:[o?"New":"Edit"," variable"]}),b.jsx(Wv,{children:"Name"}),b.jsx(Ya,{"data-testid":"variable-name-input",type:"text",placeholder:"Enter name",value:a,readOnly:i,onChange:m=>l(m.target.value)}),b.jsx(Wv,{children:"Value"}),b.jsx(Ya,{"data-testid":"variable-value-input",type:"text",placeholder:"Enter value",value:c,readOnly:s,onChange:m=>u(m.target.value)}),b.jsxs(vj,{children:[b.jsx(Oj,{children:"Type"}),b.jsx(G.Segmented,{size:"small",options:pj,value:!!f,onChange:p})]}),b.jsxs(xj,{children:[b.jsx(G.Button,{size:"small",variant:"text",onClick:t,children:"Cancel"}),b.jsx(G.Button,{size:"small",variant:"primary",onClick:h,disabled:!c.trim()||!a.trim(),"data-testid":"variable-save-button",children:"Save"})]})]})}const gj=M.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -1747,7 +1747,7 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   background-color: var(--color-info-bg);
   width: 20px;
   height: 20px;
-`;function hY({variable:n,environment:e}){const[t,r]=Q.useState(!1),[i,s]=Q.useState(!1),{sendEvent:o}=$t(),{name:a,value:l,readonlyName:c,isSecret:u,canBeRemoved:f,canBeEdited:d}=n.get(),{name:h}=e.get(),p=x=>{o("environment_variable_edited",{name:h,variable:a,changed:x.value!==l}),n.set(x),r(!1)},m=()=>{r(!1),o("environment_variable_editing_cancelled",{name:h,variable:a})},g=()=>{o("environment_variable_secret_toggled",{name:h,variable:a,visible:!i}),s(!i)},v=()=>{r(!0),o("environment_variable_editing_started",{name:h,variable:a})},O=()=>{n.set(Pt),o("environment_variable_removed",{name:h,variable:a})};return t?b.jsx(vY,{variable:n.get(),onSave:p,onCancel:m,readonlyName:c}):b.jsx(NE,{dataTestId:`environment-variable-${n.get().name}`,controls:b.jsxs(pY,{children:[u&&b.jsx(Ma,{onClick:g,variant:"text",size:"small",icon:i?b.jsx(G.ViewOffIcon,{}):b.jsx(G.ViewIcon,{})}),d&&b.jsx(Ma,{"data-testid":`edit-variable-btn-${n.get().name}`,size:"small",variant:"text",icon:b.jsx(G.EditIcon,{}),onClick:v}),f&&b.jsx(Of,{description:"Are you sure you to delete this environment variable?",onConfirm:O,children:b.jsx(Ei,{"data-testid":`remove-variable-btn-${n.get().name}`,icon:b.jsx(G.TrashCanIcon,{})})}),(!d||!f)&&b.jsx(ls,{content:d?cY:lY,children:b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.InformationIcon,{})})})]}),children:b.jsxs(gY,{children:[b.jsxs(mY,{children:[a,u&&b.jsx(fY,{})]}),b.jsx(OY,{$isEmpty:!l,children:u&&!i?"•••••":Ia(l,e.variables)||"No value"})]})})}const pY=M.div`
+`;function hY({variable:n,environment:e}){const[t,r]=Q.useState(!1),[i,s]=Q.useState(!1),{sendEvent:o}=$t(),{name:a,value:l,readonlyName:c,isSecret:u,canBeRemoved:f,canBeEdited:d}=n.get(),{name:h}=e.get(),p=x=>{o("environment_variable_edited",{name:h,variable:a,changed:x.value!==l}),n.set(x),r(!1)},m=()=>{r(!1),o("environment_variable_editing_cancelled",{name:h,variable:a})},g=()=>{o("environment_variable_secret_toggled",{name:h,variable:a,visible:!i}),s(!i)},v=()=>{r(!0),o("environment_variable_editing_started",{name:h,variable:a})},O=()=>{n.set(Pt),o("environment_variable_removed",{name:h,variable:a})};return t?b.jsx(xY,{variable:n.get(),onSave:p,onCancel:m,readonlyName:c}):b.jsx(NE,{dataTestId:`environment-variable-${n.get().name}`,controls:b.jsxs(pY,{children:[u&&b.jsx(Ma,{onClick:g,variant:"text",size:"small",icon:i?b.jsx(G.ViewOffIcon,{}):b.jsx(G.ViewIcon,{})}),d&&b.jsx(Ma,{"data-testid":`edit-variable-btn-${n.get().name}`,size:"small",variant:"text",icon:b.jsx(G.EditIcon,{}),onClick:v}),f&&b.jsx(Of,{description:"Are you sure you to delete this environment variable?",onConfirm:O,children:b.jsx(Ei,{"data-testid":`remove-variable-btn-${n.get().name}`,icon:b.jsx(G.TrashCanIcon,{})})}),(!d||!f)&&b.jsx(ls,{content:d?cY:lY,children:b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.InformationIcon,{})})})]}),children:b.jsxs(gY,{children:[b.jsxs(mY,{children:[b.jsx(OY,{children:a}),u&&b.jsx(fY,{})]}),b.jsx(vY,{$isEmpty:!l,children:u&&!i?"•••••":Ia(l,e.variables)||"No value"})]})})}const pY=M.div`
   display: flex;
   flex-direction: row;
   gap: var(--spacing-xxs);
@@ -1757,66 +1757,74 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
+  padding-bottom: var(--spacing-xs);
   gap: 2px;
   flex: 1 0 0;
   width: 100%;
 `,mY=M.div`
   display: flex;
   align-items: center;
+  width: 100%;
   gap: var(--spacing-xxs);
-  overflow: hidden;
   color: var(--text-color-primary);
-  text-overflow: ellipsis;
-  white-space: nowrap;
   font-size: var(--font-size-base);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-base);
   padding-left: var(--spacing-base);
   padding-top: var(--spacing-xs);
-`,OY=M.span`
+`,OY=M.div`
+  overflow: hidden;
+  min-width: 0;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`,vY=M.span`
   color: ${({$isEmpty:n})=>n?"var(--color-warm-grey-5)":"var(--text-color-secondary)"};
   font-size: var(--font-size-sm);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
   padding-left: var(--spacing-base);
-  padding-bottom: var(--spacing-xs);
   word-wrap: break-word;
   max-width: 100%;
-`,vY=M(Sl)`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+`,xY=M(Sl)`
   padding-left: 39px;
   margin-left: -23px;
-`;function xY({defaultName:n,onChange:e,onApplyNewName:t,onCancelEditing:r,icon:i,placeholder:s="New Folder"}){const[o,a]=Q.useState(n),l=u=>{a(u.target.value),e==null||e(u)},c=o.trim();return b.jsx(wl,{onClickOutside:r,children:b.jsxs(qG,{children:[i,b.jsx(Ya,{"data-testid":"edit-item-header-input",type:"text",placeholder:s,value:o,onChange:l}),b.jsx(G.Button,{"data-testid":"edit-item-header-save-button",variant:"primary",onClick:()=>t(c),disabled:!c,children:b.jsx(G.CheckmarkIcon,{})}),b.jsx(G.Button,{variant:"text",onClick:r,icon:b.jsx(G.CloseIcon,{})})]})})}function bY({environment:n,defaultExpanded:e}){const[t,r]=Q.useState(!1),{sendEvent:i}=$t(),{state:s,canBeEdited:o,canBeRemoved:a,name:l}=n.get(),c=()=>{n.set(Pt),i("environment_creation_cancelled",{})},u=()=>{n.state.set(fr.Normal),i("environment_editing_cancelled",{name:l})},f=()=>{n.state.set(fr.Edit),i("environment_editing_started",{name:l})},d=()=>{n.set(Pt),i("environment_removed",{name:l})},h=v=>{s===fr.Draft?i("environment_creation_finished",{name:v}):i("environment_edited",{name:l,newName:v}),n.state.set(fr.Normal),v.length&&n.name.set(v)},p=()=>{r(!0),i("environment_variable_creation_started",{name:l})},m=v=>{n.variables.set(O=>[v,...O]),r(!1),i("environment_variable_creation_finished",{name:l,variable:v.name,isSecret:v.isSecret})},g=()=>{r(!1),i("environment_variable_creation_cancelled",{name:l})};return s===fr.Edit||s===fr.Draft?b.jsx(xY,{placeholder:"New Environment",defaultName:l,onApplyNewName:h,onCancelEditing:s===fr.Draft?c:u,icon:s===fr.Edit?b.jsx(G.ChevronRightIcon,{size:"14px",color:"--text-color-secondary"}):b.jsx(G.AddIcon,{})}):b.jsx(b.Fragment,{children:b.jsxs(jf,{dataTestId:`environment-${l}`,title:l,defaultExpanded:e,controls:b.jsxs(yY,{children:[o&&b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.EditIcon,{}),onClick:f,"data-testid":`edit-environment-${l}`}),a&&b.jsx(Of,{description:uY.replace("{name}",l),onConfirm:d,children:b.jsx(Ei,{variant:"text",icon:b.jsx(G.TrashCanIcon,{}),"data-testid":`remove-environment-${l}`})}),(!o||!a)&&b.jsx(ls,{content:aY,children:b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.InformationIcon,{})})})]}),children:[t?b.jsx(CY,{variable:$u(),onSave:m,onCancel:g,isNew:!0}):b.jsx(wY,{icon:b.jsx(G.AddIcon,{}),variant:"secondary",onClick:p,iconPosition:"left",size:"small",children:"New variable"}),n.variables.map(v=>b.jsx(Q.Fragment,{children:b.jsx(hY,{variable:v,environment:n})},v.get().id))]})})}const yY=M.div`
+`;function bY({defaultName:n,onChange:e,onApplyNewName:t,onCancelEditing:r,icon:i,placeholder:s="New Folder"}){const[o,a]=Q.useState(n),l=u=>{a(u.target.value),e==null||e(u)},c=o.trim();return b.jsx(wl,{onClickOutside:r,children:b.jsxs(qG,{children:[i,b.jsx(Ya,{"data-testid":"edit-item-header-input",type:"text",placeholder:s,value:o,onChange:l}),b.jsx(G.Button,{"data-testid":"edit-item-header-save-button",variant:"primary",onClick:()=>t(c),disabled:!c,children:b.jsx(G.CheckmarkIcon,{})}),b.jsx(G.Button,{variant:"text",onClick:r,icon:b.jsx(G.CloseIcon,{})})]})})}function yY({environment:n,defaultExpanded:e}){const[t,r]=Q.useState(!1),{sendEvent:i}=$t(),{state:s,canBeEdited:o,canBeRemoved:a,name:l}=n.get(),c=()=>{n.set(Pt),i("environment_creation_cancelled",{})},u=()=>{n.state.set(fr.Normal),i("environment_editing_cancelled",{name:l})},f=()=>{n.state.set(fr.Edit),i("environment_editing_started",{name:l})},d=()=>{n.set(Pt),i("environment_removed",{name:l})},h=v=>{s===fr.Draft?i("environment_creation_finished",{name:v}):i("environment_edited",{name:l,newName:v}),n.state.set(fr.Normal),v.length&&n.name.set(v)},p=()=>{r(!0),i("environment_variable_creation_started",{name:l})},m=v=>{n.variables.set(O=>[v,...O]),r(!1),i("environment_variable_creation_finished",{name:l,variable:v.name,isSecret:v.isSecret})},g=()=>{r(!1),i("environment_variable_creation_cancelled",{name:l})};return s===fr.Edit||s===fr.Draft?b.jsx(bY,{placeholder:"New Environment",defaultName:l,onApplyNewName:h,onCancelEditing:s===fr.Draft?c:u,icon:s===fr.Edit?b.jsx(G.ChevronRightIcon,{size:"14px",color:"--text-color-secondary"}):b.jsx(G.AddIcon,{})}):b.jsx(b.Fragment,{children:b.jsxs(jf,{dataTestId:`environment-${l}`,title:l,defaultExpanded:e,controls:b.jsxs(SY,{children:[o&&b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.EditIcon,{}),onClick:f,"data-testid":`edit-environment-${l}`}),a&&b.jsx(Of,{description:uY.replace("{name}",l),onConfirm:d,children:b.jsx(Ei,{variant:"text",icon:b.jsx(G.TrashCanIcon,{}),"data-testid":`remove-environment-${l}`})}),(!o||!a)&&b.jsx(ls,{content:aY,children:b.jsx(Ma,{size:"small",variant:"text",icon:b.jsx(G.InformationIcon,{})})})]}),children:[t?b.jsx(kY,{variable:$u(),onSave:m,onCancel:g,isNew:!0}):b.jsx(CY,{icon:b.jsx(G.AddIcon,{}),variant:"secondary",onClick:p,iconPosition:"left",size:"small",children:"New variable"}),n.variables.map(v=>b.jsx(Q.Fragment,{children:b.jsx(hY,{variable:v,environment:n})},v.get().id))]})})}const SY=M.div`
   display: flex;
   flex-direction: row;
   gap: var(--spacing-xxs);
   align-items: center;
-`,SY=M(G.Button)`
+`,wY=M(G.Button)`
   align-self: flex-start;
   margin: 0;
-`,wY=M(SY)`
+`,CY=M(wY)`
   margin: 8px 0 8px -7px;
   font-size: var(--font-size-base);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-base);
-`,CY=M(Sl)`
+`,kY=M(Sl)`
   padding-left: 39px;
   margin-left: -23px;
-`;function kY(){const[n,e]=Q.useState(""),{environments:t,selectedEnvironmentId:r}=Xe(),{sendEvent:i}=$t(),s=Q.useMemo(()=>t.filter(l=>l.name.get().toLowerCase().includes(n.toLowerCase())),[n,t]),o=()=>{e(""),t.set(l=>[{id:crypto.randomUUID(),name:"",variables:[],state:fr.Draft,canBeRemoved:!0,canBeEdited:!0},...l]),i("environment_creation_started",{})},a=l=>{e(l)};return b.jsxs(AY,{children:[b.jsxs(cO,{children:[b.jsx(lO,{value:n,onSearch:a}),b.jsx(Me,{}),b.jsx(VE,{children:b.jsx(G.Button,{"data-testid":"add-environment-btn",variant:"text",disabled:!!t.find(({state:l})=>l.get()===fr.Draft),onClick:o,size:"small",icon:b.jsx(G.AddIcon,{})})})]}),b.jsx(uO,{children:s.map(l=>b.jsx(bY,{environment:l,defaultExpanded:l.get().id===r.get()},l.id.get()))})]})}const AY=M.div`
+`;function AY(){const[n,e]=Q.useState(""),{environments:t,selectedEnvironmentId:r}=Xe(),{sendEvent:i}=$t(),s=Q.useMemo(()=>t.filter(l=>l.name.get().toLowerCase().includes(n.toLowerCase())),[n,t]),o=()=>{e(""),t.set(l=>[{id:crypto.randomUUID(),name:"",variables:[],state:fr.Draft,canBeRemoved:!0,canBeEdited:!0},...l]),i("environment_creation_started",{})},a=l=>{e(l)};return b.jsxs(PY,{children:[b.jsxs(cO,{children:[b.jsx(lO,{value:n,onSearch:a}),b.jsx(Me,{}),b.jsx(VE,{children:b.jsx(G.Button,{"data-testid":"add-environment-btn",variant:"text",disabled:!!t.find(({state:l})=>l.get()===fr.Draft),onClick:o,size:"small",icon:b.jsx(G.AddIcon,{})})})]}),b.jsx(uO,{children:s.map(l=>b.jsx(yY,{environment:l,defaultExpanded:l.get().id===r.get()},l.id.get()))})]})}const PY=M.div`
   display: flex;
   flex-direction: column;
   width: 100%;
-`;function ES({name:n,value:e}){const[t,r]=Q.useState(!1),{sendEvent:i}=$t(),s=()=>{i("app_credential_visibility_toggled",{name:n,visible:!t}),r(!t)},o=()=>{i("app_credential_copied",{name:n})};return b.jsxs(PY,{children:[b.jsxs(EY,{children:[b.jsx(TY,{children:n}),b.jsx(IY,{children:t?e:"••••••••••••••••••••••••••••••••••••"})]}),b.jsxs($Y,{children:[b.jsx(G.Button,{variant:"text",size:"small",icon:t?b.jsx(G.ViewIcon,{}):b.jsx(G.ViewOffIcon,{}),onClick:s}),b.jsx(G.CopyButton,{toasterPlacement:"left",data:e,onCopyClick:o})]})]})}const PY=M.div`
+`;function ES({name:n,value:e}){const[t,r]=Q.useState(!1),{sendEvent:i}=$t(),s=()=>{i("app_credential_visibility_toggled",{name:n,visible:!t}),r(!t)},o=()=>{i("app_credential_copied",{name:n})};return b.jsxs(EY,{children:[b.jsxs(TY,{children:[b.jsx(IY,{children:n}),b.jsx($Y,{children:t?e:"••••••••••••••••••••••••••••••••••••"})]}),b.jsxs(RY,{children:[b.jsx(G.Button,{variant:"text",size:"small",icon:t?b.jsx(G.ViewIcon,{}):b.jsx(G.ViewOffIcon,{}),onClick:s}),b.jsx(G.CopyButton,{toasterPlacement:"left",data:e,onCopyClick:o})]})]})}const EY=M.div`
   display: flex;
   padding: var(--spacing-xs) var(--spacing-xs);
   align-items: flex-start;
   gap: var(--spacing-xs);
   align-self: stretch;
-`,EY=M.div`
+`,TY=M.div`
   display: flex;
   align-items: flex-start;
   gap: 10px;
   flex: 1 0 0;
-`,TY=M.div`
+`,IY=M.div`
   display: -webkit-box;
   width: var(--64-px-4-rem-spacing-11, 64px);
   -webkit-box-orient: vertical;
@@ -1829,19 +1837,19 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   font-style: normal;
   font-weight: var(--font-weight-semibold);
   line-height: var(--line-height-sm);
-`,IY=M.div`
+`,$Y=M.div`
   flex: 1 0 0;
   color: var(--text-color-primary);
   font-size: var(--font-size-sm);
   font-style: normal;
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
-`,$Y=M.div`
+`,RY=M.div`
   display: flex;
   justify-content: flex-end;
   align-items: center;
   gap: var(--spacing-xxs);
-`;function RY({credential:n,number:e}){const{requestActiveTabIdx:t,request:{securityType:r,security:i}}=Xe(),s=Kt(),{clientId:o,clientSecret:a,valueToUseInHeader:l}=n,{sendEvent:c}=$t(),u=()=>{t.set(SL);const f=(d,h)=>{if(d.get()===ce.AuthorizationCode){const{clientId:p,clientSecret:m}=h[ce.AuthorizationCode];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}if(d.get()===ce.Implicit){const{clientId:p}=h[ce.Implicit];(o||a)&&cn(o||a||"",p,s)}if(d.get()===ce.ClientCredentials){const{clientId:p,clientSecret:m}=h[ce.ClientCredentials];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}if(d.get()===ce.Password){const{clientId:p,clientSecret:m}=h[ce.Password];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}};if(r.get()===ne.BasicAuth){const{username:d,password:h}=i[ne.BasicAuth];(o||a)&&cn(o||a||"",d,s),a&&cn(a,h,s)}if(r.get()===ne.DigestAuth){const{username:d,password:h}=i[ne.DigestAuth];(o||a)&&cn(o||a||"",d,s),a&&cn(a,h,s)}if(r.get()===ne.JWT){const{token:d}=i[ne.JWT];(o||a)&&cn(o||a||"",d,s)}if(r.get()===ne.APIKey){const{key:d}=i[ne.APIKey];cn(n[l||"clientSecret"]||o||"",d,s)}if(r.get()===ne.OAuth2){const d=i[ne.OAuth2],h=d.grantType;f(h,d)}if(r.get()===ne.OpenIDConnect){const d=i[ne.OpenIDConnect],{grantType:h}=d;f(h,d)}c("apps_use_key_clicked",{number:e})};return b.jsxs(DY,{children:[b.jsxs(QY,{children:[b.jsx(BY,{children:e.toString().padStart(2,"0")}),b.jsxs(jY,{children:[n.stage&&b.jsx(G.Tag,{color:"gray",children:n.stage}),b.jsx(G.Tag,{color:"green",children:n.status})]})]}),o&&b.jsx(ES,{name:"API key",value:o}),a&&b.jsx(ES,{name:o?"Secret":"API key",value:a}),b.jsx(_Y,{children:b.jsx(G.Button,{size:"small",variant:"secondary",onClick:u,children:"Use key"})})]})}const DY=M.div`
+`;function DY({credential:n,number:e}){const{requestActiveTabIdx:t,request:{securityType:r,security:i}}=Xe(),s=Kt(),{clientId:o,clientSecret:a,valueToUseInHeader:l}=n,{sendEvent:c}=$t(),u=()=>{t.set(SL);const f=(d,h)=>{if(d.get()===ce.AuthorizationCode){const{clientId:p,clientSecret:m}=h[ce.AuthorizationCode];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}if(d.get()===ce.Implicit){const{clientId:p}=h[ce.Implicit];(o||a)&&cn(o||a||"",p,s)}if(d.get()===ce.ClientCredentials){const{clientId:p,clientSecret:m}=h[ce.ClientCredentials];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}if(d.get()===ce.Password){const{clientId:p,clientSecret:m}=h[ce.Password];(o||a)&&cn(o||a||"",p,s),a&&cn(a,m,s)}};if(r.get()===ne.BasicAuth){const{username:d,password:h}=i[ne.BasicAuth];(o||a)&&cn(o||a||"",d,s),a&&cn(a,h,s)}if(r.get()===ne.DigestAuth){const{username:d,password:h}=i[ne.DigestAuth];(o||a)&&cn(o||a||"",d,s),a&&cn(a,h,s)}if(r.get()===ne.JWT){const{token:d}=i[ne.JWT];(o||a)&&cn(o||a||"",d,s)}if(r.get()===ne.APIKey){const{key:d}=i[ne.APIKey];cn(n[l||"clientSecret"]||o||"",d,s)}if(r.get()===ne.OAuth2){const d=i[ne.OAuth2],h=d.grantType;f(h,d)}if(r.get()===ne.OpenIDConnect){const d=i[ne.OpenIDConnect],{grantType:h}=d;f(h,d)}c("apps_use_key_clicked",{number:e})};return b.jsxs(QY,{children:[b.jsxs(jY,{children:[b.jsx(_Y,{children:e.toString().padStart(2,"0")}),b.jsxs(BY,{children:[n.stage&&b.jsx(G.Tag,{color:"gray",children:n.stage}),b.jsx(G.Tag,{color:"green",children:n.status})]})]}),o&&b.jsx(ES,{name:"API key",value:o}),a&&b.jsx(ES,{name:o?"Secret":"API key",value:a}),b.jsx(MY,{children:b.jsx(G.Button,{size:"small",variant:"secondary",onClick:u,children:"Use key"})})]})}const QY=M.div`
   display: flex;
   flex-direction: column;
   align-self: stretch;
@@ -1855,7 +1863,7 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   & > :not(:last-child) {
     border-bottom: 1px solid var(--border-color-secondary);
   }
-`,QY=M.div`
+`,jY=M.div`
   display: flex;
   justify-content: space-between;
   padding: var(--spacing-xs) var(--spacing-xs);
@@ -1863,16 +1871,16 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   align-items: center;
   align-self: stretch;
   background: var(--layer-color);
-`,jY=M.div`
+`,BY=M.div`
   display: flex;
   gap: var(--spacing-xxs);
-`,BY=M.div`
+`,_Y=M.div`
   color: var(--text-color-secondary, #3b3c45);
   font-size: var(--font-size-sm);
   font-style: normal;
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
-`,_Y=M.div`
+`,MY=M.div`
   display: flex;
   padding: var(--spacing-xs) var(--spacing-xs);
   border-radius: 0 0 var(--border-radius-md) var(--border-radius-md);
@@ -1880,16 +1888,16 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   align-items: center;
   align-self: stretch;
   background: var(--layer-color);
-`;function MY({app:n}){const[e,t]=Q.useState(!1),{title:r,credentials:i,id:s}=n,o=i.get()||[],a=l=>{l&&!i.get()&&(t(!0),fetch(`/api/api-keys/apps/${s.get()}`).then(c=>c.json().then(u=>{c.ok&&i.set(u.credentials)}).catch(()=>console.log("Something went wrong")).finally(()=>t(!1))))};return b.jsx(jf,{dataTestId:`app-${name}`,title:r.get(),onToggle:a,children:b.jsx(NY,{children:e?b.jsx(FY,{children:b.jsx(G.SpinnerIcon,{size:"16px",color:"--icon-color-additional"})}):o.length?o.map((l,c)=>b.jsx(RY,{credential:l,number:c+1},l.id)):b.jsx(ZY,{children:"There are no credentials yet."})})})}const NY=M.div`
+`;function NY({app:n}){const[e,t]=Q.useState(!1),{title:r,credentials:i,id:s}=n,o=i.get()||[],a=l=>{l&&!i.get()&&(t(!0),fetch(`/api/api-keys/apps/${s.get()}`).then(c=>c.json().then(u=>{c.ok&&i.set(u.credentials)}).catch(()=>console.log("Something went wrong")).finally(()=>t(!1))))};return b.jsx(jf,{dataTestId:`app-${name}`,title:r.get(),onToggle:a,children:b.jsx(FY,{children:e?b.jsx(ZY,{children:b.jsx(G.SpinnerIcon,{size:"16px",color:"--icon-color-additional"})}):o.length?o.map((l,c)=>b.jsx(DY,{credential:l,number:c+1},l.id)):b.jsx(VY,{children:"There are no credentials yet."})})})}const FY=M.div`
   padding-bottom: var(--spacing-xxs);
   margin-left: -7px;
   padding-right: var(--spacing-base);
-`,FY=M.div`
+`,ZY=M.div`
   display: flex;
   height: 224px;
   justify-content: center;
   align-items: center;
-`,ZY=M.div`
+`,VY=M.div`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -1897,17 +1905,17 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   font-size: var(--font-size-base);
   line-height: var(--line-height-base);
   color: var(--text-color-secondary);
-`;function VY(){const[n,e]=Q.useState(""),{apps:t,apiId:r,appsLoadingState:i}=Xe(),{sendEvent:s}=$t(),o=()=>{window.open("/apps","_blank"),s("apps_request_access_clicked",{})};Q.useEffect(()=>((i.get()===Wr.Idle||i.get()===Wr.Error)&&(i.set(Wr.Loading),fetch(`/api/api-keys/api-products/${r.get()}/access?expand=0`).then(c=>c.json().then(u=>{c.ok?(t.set(u.apps||[]),i.set(Wr.Success)):i.set(Wr.Error)}).catch(()=>i.set(Wr.Error)))),()=>{t.set([]),i.set(Wr.Idle)}),[r]);const a=Q.useMemo(()=>t.filter(c=>c.title.get().toLowerCase().includes(n.toLowerCase())),[n,t]),l=c=>{e(c)};return i.get()===Wr.Loading?b.jsx(zY,{children:b.jsx(G.SpinnerIcon,{size:"24px",color:"--icon-color-additional"})}):t.length?b.jsxs(WY,{children:[b.jsx(cO,{children:b.jsx(lO,{value:n,onSearch:l})}),b.jsx(uO,{children:a.map(c=>b.jsx(MY,{app:c},c.get().id))})]}):b.jsxs(WE,{children:["You don't have any apps with access to this API",b.jsx(G.Button,{onClick:o,children:"Request access"})]})}const WY=M.div`
+`;function WY(){const[n,e]=Q.useState(""),{apps:t,apiId:r,appsLoadingState:i}=Xe(),{sendEvent:s}=$t(),o=()=>{window.open("/apps","_blank"),s("apps_request_access_clicked",{})};Q.useEffect(()=>((i.get()===Wr.Idle||i.get()===Wr.Error)&&(i.set(Wr.Loading),fetch(`/api/api-keys/api-products/${r.get()}/access?expand=0`).then(c=>c.json().then(u=>{c.ok?(t.set(u.apps||[]),i.set(Wr.Success)):i.set(Wr.Error)}).catch(()=>i.set(Wr.Error)))),()=>{t.set([]),i.set(Wr.Idle)}),[r]);const a=Q.useMemo(()=>t.filter(c=>c.title.get().toLowerCase().includes(n.toLowerCase())),[n,t]),l=c=>{e(c)};return i.get()===Wr.Loading?b.jsx(XY,{children:b.jsx(G.SpinnerIcon,{size:"24px",color:"--icon-color-additional"})}):t.length?b.jsxs(zY,{children:[b.jsx(cO,{children:b.jsx(lO,{value:n,onSearch:l})}),b.jsx(uO,{children:a.map(c=>b.jsx(NY,{app:c},c.get().id))})]}):b.jsxs(WE,{children:["You don't have any apps with access to this API",b.jsx(G.Button,{onClick:o,children:"Request access"})]})}const zY=M.div`
   display: flex;
   flex-direction: column;
   width: 100%;
-`,zY=M.div`
+`,XY=M.div`
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
   height: calc(100vh - 50px);
-}`,{Tab:XY,TabContent:LY,TabList:GY,Tabs:YY}=G.markdoc.components;function UY(){const{apiId:n}=Xe(),{sendEvent:e}=$t(),[t,r]=Q.useState(!0),i=Q.useCallback(a=>{e("side_panel_tab_changed",{name:a})},[e]),s=()=>{r(!t),e("side_panel_toggled",{expanded:!t})},o=Q.useMemo(()=>{const a=[b.jsx(cp,{label:"History",onClick:()=>i("History"),children:b.jsx(HG,{})},"History"),b.jsx(cp,{label:"Environments",onClick:()=>i("Environments"),children:b.jsx(kY,{})},"Environments")];return n.get()&&a.push(b.jsx(cp,{label:"Apps",onClick:()=>i("Apps"),children:b.jsx(VY,{})})),a},[n,i]);return b.jsxs(qY,{$expanded:t,children:[t&&b.jsxs(HY,{children:[...o]}),b.jsx(JY,{variant:"text",onClick:s,children:t?b.jsx(G.SidePanelOpenIcon,{}):b.jsx(G.SidePanelCloseIcon,{})})]})}const qY=M.div`
+}`,{Tab:LY,TabContent:GY,TabList:YY,Tabs:UY}=G.markdoc.components;function qY(){const{apiId:n}=Xe(),{sendEvent:e}=$t(),[t,r]=Q.useState(!0),i=Q.useCallback(a=>{e("side_panel_tab_changed",{name:a})},[e]),s=()=>{r(!t),e("side_panel_toggled",{expanded:!t})},o=Q.useMemo(()=>{const a=[b.jsx(cp,{label:"History",onClick:()=>i("History"),children:b.jsx(HG,{})},"History"),b.jsx(cp,{label:"Environments",onClick:()=>i("Environments"),children:b.jsx(AY,{})},"Environments")];return n.get()&&a.push(b.jsx(cp,{label:"Apps",onClick:()=>i("Apps"),children:b.jsx(WY,{})})),a},[n,i]);return b.jsxs(HY,{$expanded:t,children:[t&&b.jsxs(JY,{children:[...o]}),b.jsx(KY,{variant:"text",onClick:s,children:t?b.jsx(G.SidePanelOpenIcon,{}):b.jsx(G.SidePanelCloseIcon,{})})]})}const HY=M.div`
   display: flex;
   flex-direction: row;
   border-left: 1px solid var(--border-color-secondary);
@@ -1919,13 +1927,13 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   svg {
     fill: var(--text-color-primary);
   }
-`,HY=M(YY)`
+`,JY=M(UY)`
   flex-grow: 1;
   margin-right: -48px;
   margin-top: 0;
   --md-tabs-content-padding: 0;
 
-  ${GY} {
+  ${YY} {
     margin: 0;
     height: 49px;
     font-size: var(--font-size-lg);
@@ -1940,11 +1948,11 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
     --md-tabs-hover-tab-border-width: 0;
   }
 
-  ${LY} {
+  ${GY} {
     overflow: auto;
   }
 
-  ${XY} {
+  ${LY} {
     font-size: var(--font-size-lg);
     font-weight: var(--font-weight-regular);
     line-height: var(--line-height-lg);
@@ -1966,56 +1974,56 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   ol[class^='Tabs__TabList'] {
     padding: 0 0 0 var(--spacing-base);
   }
-`,JY=M(G.Button)`
+`,KY=M(G.Button)`
   align-self: flex-start;
   margin: 12px;
   padding: 4px;
-`,cp=M.li``,KY=({error:n})=>b.jsxs(eU,{children:[b.jsx(tU,{children:"An Error Has Occurred"}),b.jsx(nU,{children:n==null?void 0:n.message}),b.jsx(rU,{children:n==null?void 0:n.stack})]}),eU=M.div`
+`,cp=M.li``,eU=({error:n})=>b.jsxs(tU,{children:[b.jsx(nU,{children:"An Error Has Occurred"}),b.jsx(rU,{children:n==null?void 0:n.message}),b.jsx(iU,{children:n==null?void 0:n.stack})]}),tU=M.div`
   padding: var(--spacing-xs) var(--spacing-xl);
-`,tU=M.h2`
+`,nU=M.h2`
   color: var(--color-error-base);
-`,nU=M.h4`
+`,rU=M.h4`
   color: var(--text-color-secondary);
-`,rU=M.pre`
+`,iU=M.pre`
   white-space: break-spaces;
-`;function iU({className:n}){return b.jsx(sU,{className:n,children:b.jsxs(oU,{children:[b.jsx(G.CloseFilledIcon,{size:"24px",color:"--color-error-base"}),b.jsxs(aU,{children:[b.jsx(lU,{children:"Oops! Something went wrong."}),b.jsx(cU,{children:"We're sorry. There's been an unexpected error. Our team has been notified and will investigate the issue."})]})]})})}const sU=M.div`
+`;function sU({className:n}){return b.jsx(oU,{className:n,children:b.jsxs(aU,{children:[b.jsx(G.CloseFilledIcon,{size:"24px",color:"--color-error-base"}),b.jsxs(lU,{children:[b.jsx(cU,{children:"Oops! Something went wrong."}),b.jsx(uU,{children:"We're sorry. There's been an unexpected error. Our team has been notified and will investigate the issue."})]})]})})}const oU=M.div`
   display: flex;
   justify-content: center;
   align-items: center;
   width: 80vw;
   height: 100vh;
   background-color: var(--bg-color);
-`,oU=M.div`
+`,aU=M.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--spacing-base);
-`,aU=M.div`
+`,lU=M.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--spacing-xxs);
   width: 488px;
-`,lU=M.div`
+`,cU=M.div`
   color: var(--text-color-primary);
   font-size: var(--font-size-xl);
   font-style: normal;
   font-weight: var(--font-weight-semibold);
   line-height: var(--line-height-xl);
-`,cU=M.div`
+`,uU=M.div`
   color: var(--text-color-primary);
   font-size: var(--font-size-lg);
   font-style: normal;
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-lg);
   text-align: center;
-`;class zE extends H.Component{constructor(e){super(e),this.state={error:void 0},this.onUnhandledError=this.onUnhandledError.bind(this),this.onUnhandledPromiseRejection=this.onUnhandledPromiseRejection.bind(this)}onUnhandledError({error:e}){var t,r;(r=(t=this.props).onError)==null||r.call(t,e)}onUnhandledPromiseRejection(e){var t,r;(r=(t=this.props).onError)==null||r.call(t,e.reason)}componentDidMount(){window.addEventListener("error",this.onUnhandledError),window.addEventListener("unhandledrejection",this.onUnhandledPromiseRejection)}componentWillUnmount(){window.removeEventListener("error",this.onUnhandledError),window.removeEventListener("unhandledrejection",this.onUnhandledPromiseRejection)}componentDidCatch(e,t){var i,s;const r={error:{message:e.message,stack:t.componentStack??void 0}};this.setState(r),(s=(i=this.props).onError)==null||s.call(i,r.error)}render(){return this.state.error?process.env.NODE_ENV==="production"?b.jsx(iU,{}):b.jsx(KY,{error:this.state.error}):this.props.children}}function uU({className:n}){const{operationUrl:e}=Xe().get(),{sendEvent:t}=$t();return b.jsxs(b.Fragment,{children:[b.jsx(G.GlobalStyle,{}),b.jsx(fU,{className:n,children:b.jsxs(zE,{onError:r=>t("unhandled_error",{...r,operationUrl:e}),children:[b.jsx(_E,{}),b.jsx(UY,{})]})})]})}const fU=M.div`
+`;class zE extends H.Component{constructor(e){super(e),this.state={error:void 0},this.onUnhandledError=this.onUnhandledError.bind(this),this.onUnhandledPromiseRejection=this.onUnhandledPromiseRejection.bind(this)}onUnhandledError({error:e}){var t,r;(r=(t=this.props).onError)==null||r.call(t,e)}onUnhandledPromiseRejection(e){var t,r;(r=(t=this.props).onError)==null||r.call(t,e.reason)}componentDidMount(){window.addEventListener("error",this.onUnhandledError),window.addEventListener("unhandledrejection",this.onUnhandledPromiseRejection)}componentWillUnmount(){window.removeEventListener("error",this.onUnhandledError),window.removeEventListener("unhandledrejection",this.onUnhandledPromiseRejection)}componentDidCatch(e,t){var i,s;const r={error:{message:e.message,stack:t.componentStack??void 0}};this.setState(r),(s=(i=this.props).onError)==null||s.call(i,r.error)}render(){return this.state.error?process.env.NODE_ENV==="production"?b.jsx(sU,{}):b.jsx(eU,{error:this.state.error}):this.props.children}}function fU({className:n}){const{operationUrl:e}=Xe().get(),{sendEvent:t}=$t();return b.jsxs(b.Fragment,{children:[b.jsx(G.GlobalStyle,{}),b.jsx(dU,{className:n,children:b.jsxs(zE,{onError:r=>t("unhandled_error",{...r,operationUrl:e}),children:[b.jsx(_E,{}),b.jsx(qY,{})]})})]})}const dU=M.div`
   display: flex;
   height: 100vh;
   background-color: var(--bg-color);
-`;function dU(n,e){const t=nE(n),r=tE(n),i=nz(n),s=K7(n),o=n.request.get().body.activeExampleName,a=n.request.get().body.type,l=Jm(n);return{requestValues:{cookie:i,header:t,query:s,body:r},activeExampleName:o,activeMimeName:a,environment:(l==null?void 0:l.name)||(l==null?void 0:l.url),environments:Object.fromEntries(Object.entries(n.environments.get()).map(([,c])=>[c.name,{...Object.fromEntries(c.variables.map(({name:u,value:f})=>[u,f])),server:c.url||""}]))}}function hU(n,e){const{servers:t,parameters:r}=n,i=r.filter(o=>o.in==="path"),s=pU(n);return t.map(o=>{const a=o.url,l=o.description||a,c=o.variables||{},u=Object.entries(c).map(([m,g])=>{const v=Ea.getEnvironmentVariableByName(l,m,dr.Server);return{id:crypto.randomUUID(),name:m,value:(v==null?void 0:v.value)||g.default,type:dr.Server,canBeRemoved:!1,canBeEdited:!0,readonlyName:!0}}),f=i.map(({name:m})=>{const g=Ea.getEnvironmentVariableByName(l,m,dr.Path);return{id:crypto.randomUUID(),name:m,value:(g==null?void 0:g.value)||"",type:dr.Path,canBeRemoved:!1,canBeEdited:!0,readonlyName:!0}}),d=s.map(m=>{const g=Ea.getEnvironmentVariableByName(l,m.name,dr.Security);return{...m,value:(g==null?void 0:g.value)||m.value}}),h=Ea.getEnvironmentByName(l),p=(h==null?void 0:h.variables.filter(m=>m.type===dr.UserCreated))||[];return{id:crypto.randomUUID(),name:l,url:a,state:fr.Normal,canBeRemoved:!1,canBeEdited:!1,variables:gU([...p,{id:crypto.randomUUID(),name:"server",value:Hf(a),type:dr.ServerUrl,canBeRemoved:!1,canBeEdited:!1},...u,...f,...d],e==null?void 0:e[l])}})}function pU(n){const e=[],t=n.security||[],r=new Set;return t.forEach(i=>{const s=Hi(i);if(r.has(s))return;const o=i.id;r.add(s),(s===ne.BasicAuth||s===ne.DigestAuth)&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Username,!1)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.Password))),s===ne.JWT&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.JWTToken)),s===ne.APIKey&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.APIKey)),s===ne.OAuth2&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Token)),tO(i).forEach(l=>{e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientId)),l!==ce.Implicit&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientSecret))})),s===ne.OpenIDConnect&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Token)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientId)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientSecret)))}),e}function Zr(n,e){return{id:crypto.randomUUID(),name:n,value:"",type:dr.Security,canBeRemoved:!1,canBeEdited:!0,isSecret:e===void 0?!0:e}}function gU(n,e){return e?n.map(t=>{const r=e[t.name];return r!==void 0?{...t,canBeRemoved:!1,value:t.type===dr.ServerUrl?Hf(r):r}:t}):n}function XE({value:n,disableDraft:e,...t}){const r=Xe(),{operation:i,request:s,response:o,corsProxyUrl:a,environments:l,operationUrl:c,mockServer:u,selectedEnvironmentId:f,apiId:d,oAuth2RedirectURI:h}=r;return Q.useEffect(()=>{const p=t.operationUrl&&!e?EE.getByKey(t.operationUrl):null,m=Vn(n),g=hU(m,t.predefinedEnvValues),v=g.find(({name:O,url:x})=>x===(t==null?void 0:t.environment)||O===(t==null?void 0:t.environment));i.set(m),l.set(g),a.set(t.corsProxyUrl??NL),o.set(null),c.set(t.operationUrl),u.set(t.mockServer),d.set(t.apiId),h.set(t.oAuth2RedirectURI),v&&f.set(v.id),p?s.set(p):s.set(Km(m)),H2(r)},[n]),r}function mU({onClose:n,onLoad:e,onRequestChange:t,...r}){const i=Q.useRef(null),{sendEvent:s}=$t(),o=Xe(),a=XE(r),l=Q.useCallback(()=>{if(t){const u=a.isLinked.get(),f=dU(a,r.value);t(u?f:{requestValues:{}})}s("replay_closed",{operationName:r.value.name}),n(),o.set(Vs())},[n,t,a,r.value,s,o]);Q.useEffect(()=>{e==null||e(),s("replay_opened",{operationName:r.value.name})},[]),Q.useEffect(()=>{i.current&&i.current.focus()},[]);const c=u=>{u.key==="Enter"&&(u.preventDefault(),l())};return b.jsx(Q.StrictMode,{children:b.jsxs(HC,{onClick:l,children:[b.jsx(vU,{onClick:l,role:"button",onKeyDown:c,tabIndex:0,ref:i,autoFocus:!0,children:b.jsx(xU,{})}),b.jsx(OU,{})]})})}const OU=M(uU)`
+`;function hU(n,e){const t=nE(n),r=tE(n),i=nz(n),s=K7(n),o=n.request.get().body.activeExampleName,a=n.request.get().body.type,l=Jm(n);return{requestValues:{cookie:i,header:t,query:s,body:r},activeExampleName:o,activeMimeName:a,environment:(l==null?void 0:l.name)||(l==null?void 0:l.url),environments:Object.fromEntries(Object.entries(n.environments.get()).map(([,c])=>[c.name,{...Object.fromEntries(c.variables.map(({name:u,value:f})=>[u,f])),server:c.url||""}]))}}function pU(n,e){const{servers:t,parameters:r}=n,i=r.filter(o=>o.in==="path"),s=gU(n);return t.map(o=>{const a=o.url,l=o.description||a,c=o.variables||{},u=Object.entries(c).map(([m,g])=>{const v=Ea.getEnvironmentVariableByName(l,m,dr.Server);return{id:crypto.randomUUID(),name:m,value:(v==null?void 0:v.value)||g.default,type:dr.Server,canBeRemoved:!1,canBeEdited:!0,readonlyName:!0}}),f=i.map(({name:m})=>{const g=Ea.getEnvironmentVariableByName(l,m,dr.Path);return{id:crypto.randomUUID(),name:m,value:(g==null?void 0:g.value)||"",type:dr.Path,canBeRemoved:!1,canBeEdited:!0,readonlyName:!0}}),d=s.map(m=>{const g=Ea.getEnvironmentVariableByName(l,m.name,dr.Security);return{...m,value:(g==null?void 0:g.value)||m.value}}),h=Ea.getEnvironmentByName(l),p=(h==null?void 0:h.variables.filter(m=>m.type===dr.UserCreated))||[];return{id:crypto.randomUUID(),name:l,url:a,state:fr.Normal,canBeRemoved:!1,canBeEdited:!1,variables:mU([...p,{id:crypto.randomUUID(),name:"server",value:Hf(a),type:dr.ServerUrl,canBeRemoved:!1,canBeEdited:!1},...u,...f,...d],e==null?void 0:e[l])}})}function gU(n){const e=[],t=n.security||[],r=new Set;return t.forEach(i=>{const s=Hi(i);if(r.has(s))return;const o=i.id;r.add(s),(s===ne.BasicAuth||s===ne.DigestAuth)&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Username,!1)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.Password))),s===ne.JWT&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.JWTToken)),s===ne.APIKey&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.APIKey)),s===ne.OAuth2&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Token)),tO(i).forEach(l=>{e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientId)),l!==ce.Implicit&&e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientSecret))})),s===ne.OpenIDConnect&&(e.push(Zr(o+G.SecurityVariablesEnvSuffix.Token)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientId)),e.push(Zr(o+G.SecurityVariablesEnvSuffix.ClientSecret)))}),e}function Zr(n,e){return{id:crypto.randomUUID(),name:n,value:"",type:dr.Security,canBeRemoved:!1,canBeEdited:!0,isSecret:e===void 0?!0:e}}function mU(n,e){return e?n.map(t=>{const r=e[t.name];return r!==void 0?{...t,canBeRemoved:!1,value:t.type===dr.ServerUrl?Hf(r):r}:t}):n}function XE({value:n,disableDraft:e,...t}){const r=Xe(),{operation:i,request:s,response:o,corsProxyUrl:a,environments:l,operationUrl:c,mockServer:u,selectedEnvironmentId:f,apiId:d,oAuth2RedirectURI:h}=r;return Q.useEffect(()=>{const p=t.operationUrl&&!e?EE.getByKey(t.operationUrl):null,m=Vn(n),g=pU(m,t.predefinedEnvValues),v=g.find(({name:O,url:x})=>x===(t==null?void 0:t.environment)||O===(t==null?void 0:t.environment));i.set(m),l.set(g),a.set(t.corsProxyUrl??NL),o.set(null),c.set(t.operationUrl),u.set(t.mockServer),d.set(t.apiId),h.set(t.oAuth2RedirectURI),v&&f.set(v.id),p?s.set(p):s.set(Km(m)),H2(r)},[n]),r}function OU({onClose:n,onLoad:e,onRequestChange:t,...r}){const i=Q.useRef(null),{sendEvent:s}=$t(),o=Xe(),a=XE(r),l=Q.useCallback(()=>{if(t){const u=a.isLinked.get(),f=hU(a,r.value);t(u?f:{requestValues:{}})}s("replay_closed",{operationName:r.value.name}),n(),o.set(Vs())},[n,t,a,r.value,s,o]);Q.useEffect(()=>{e==null||e(),s("replay_opened",{operationName:r.value.name})},[]),Q.useEffect(()=>{i.current&&i.current.focus()},[]);const c=u=>{u.key==="Enter"&&(u.preventDefault(),l())};return b.jsx(Q.StrictMode,{children:b.jsxs(HC,{onClick:l,children:[b.jsx(xU,{onClick:l,role:"button",onKeyDown:c,tabIndex:0,ref:i,autoFocus:!0,children:b.jsx(bU,{})}),b.jsx(vU,{})]})})}const vU=M(fU)`
   width: 80vw;
-`,vU=M.div`
+`,xU=M.div`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -2028,12 +2036,12 @@ Please report this to https://github.com/markedjs/marked.`,e.silent)return"<p>An
   width: 24px;
   height: 24px;
   cursor: pointer;
-`,xU=M(G.CloseIcon)`
+`,bU=M(G.CloseIcon)`
   width: 14px;
   height: 14px;
-`;function bU(n){const{sendEvent:e}=$t(),t=Q.useMemo(()=>aw(Vs()),[]);return b.jsx(kL,{value:t,children:b.jsx(zE,{onError:r=>e("unhandled_error",{...r,isEmbedded:!0}),children:b.jsx(yU,{...n})})})}function yU(n){return XE({...n,disableDraft:!0}),b.jsx(Q.StrictMode,{children:b.jsx(SU,{children:b.jsx(_E,{})})})}const SU=M.div`
+`;function yU(n){const{sendEvent:e}=$t(),t=Q.useMemo(()=>aw(Vs()),[]);return b.jsx(kL,{value:t,children:b.jsx(zE,{onError:r=>e("unhandled_error",{...r,isEmbedded:!0}),children:b.jsx(SU,{...n})})})}function SU(n){return XE({...n,disableDraft:!0}),b.jsx(Q.StrictMode,{children:b.jsx(wU,{children:b.jsx(_E,{})})})}const wU=M.div`
   display: flex;
   max-height: 80vh;
   height: 800px;
   width: 100%;
-`;exports.EmbeddedReplay=bU;exports.ReplayOverlay=mU;
+`;exports.EmbeddedReplay=yU;exports.ReplayOverlay=OU;

package/dist/replay.js

@@ -2157,7 +2157,7 @@ See https://s-c.sh/2BAXzed for more info.`), window["__styled-components-init__"
 const _ = Np, {
   createElement: Mo,
   createContext: p$,
-  createRef: Zq,
+  createRef: Wq,
   forwardRef: Iw,
   useCallback: Wn,
   useContext: $w,
@@ -16206,7 +16206,7 @@ function Bl({
           size: "small",
           variant: "primary",
           onClick: h,
-          disabled: !c || !a,
+          disabled: !c.trim() || !a.trim(),
           "data-testid": "variable-save-button",
           children: "Save"
         }
@@ -54543,7 +54543,7 @@ function TU({ variable: n, environment: e }) {
     });
   };
   return t ? /* @__PURE__ */ b.jsx(
-    QU,
+    jU,
     {
       variable: n.get(),
       onSave: p,
@@ -54592,10 +54592,10 @@ function TU({ variable: n, environment: e }) {
       ] }),
       children: /* @__PURE__ */ b.jsxs($U, { children: [
         /* @__PURE__ */ b.jsxs(RU, { children: [
-          a,
+          /* @__PURE__ */ b.jsx(DU, { children: a }),
           u && /* @__PURE__ */ b.jsx(PU, {})
         ] }),
-        /* @__PURE__ */ b.jsx(DU, { $isEmpty: !l, children: u && !i ? "•••••" : Va(l, e.variables) || "No value" })
+        /* @__PURE__ */ b.jsx(QU, { $isEmpty: !l, children: u && !i ? "•••••" : Va(l, e.variables) || "No value" })
       ] })
     }
   );
@@ -54610,36 +54610,44 @@ const IU = _.div`
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
+  padding-bottom: var(--spacing-xs);
   gap: 2px;
   flex: 1 0 0;
   width: 100%;
 `, RU = _.div`
   display: flex;
   align-items: center;
+  width: 100%;
   gap: var(--spacing-xxs);
-  overflow: hidden;
   color: var(--text-color-primary);
-  text-overflow: ellipsis;
-  white-space: nowrap;
   font-size: var(--font-size-base);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-base);
   padding-left: var(--spacing-base);
   padding-top: var(--spacing-xs);
-`, DU = _.span`
+`, DU = _.div`
+  overflow: hidden;
+  min-width: 0;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`, QU = _.span`
   color: ${({ $isEmpty: n }) => n ? "var(--color-warm-grey-5)" : "var(--text-color-secondary)"};
   font-size: var(--font-size-sm);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
   padding-left: var(--spacing-base);
-  padding-bottom: var(--spacing-xs);
   word-wrap: break-word;
   max-width: 100%;
-`, QU = _(Bl)`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+`, jU = _(Bl)`
   padding-left: 39px;
   margin-left: -23px;
 `;
-function jU({
+function BU({
   defaultName: n,
   onChange: e,
   onApplyNewName: t,
@@ -54675,7 +54683,7 @@ function jU({
     /* @__PURE__ */ b.jsx(Ve, { variant: "text", onClick: r, icon: /* @__PURE__ */ b.jsx(Bo, {}) })
   ] }) });
 }
-function BU({ environment: n, defaultExpanded: e }) {
+function _U({ environment: n, defaultExpanded: e }) {
   const [t, r] = Ce(!1), { sendEvent: i } = _t(), { state: s, canBeEdited: o, canBeRemoved: a, name: l } = n.get(), c = () => {
     n.set(Dt), i("environment_creation_cancelled", {});
   }, u = () => {
@@ -54698,7 +54706,7 @@ function BU({ environment: n, defaultExpanded: e }) {
     r(!1), i("environment_variable_creation_cancelled", { name: l });
   };
   return s === Or.Edit || s === Or.Draft ? /* @__PURE__ */ b.jsx(
-    jU,
+    BU,
     {
       placeholder: "New Environment",
       defaultName: l,
@@ -54712,7 +54720,7 @@ function BU({ environment: n, defaultExpanded: e }) {
       dataTestId: `environment-${l}`,
       title: l,
       defaultExpanded: e,
-      controls: /* @__PURE__ */ b.jsxs(_U, { children: [
+      controls: /* @__PURE__ */ b.jsxs(NU, { children: [
         o && /* @__PURE__ */ b.jsx(
           Ha,
           {
@@ -54742,7 +54750,7 @@ function BU({ environment: n, defaultExpanded: e }) {
       ] }),
       children: [
         t ? /* @__PURE__ */ b.jsx(
-          FU,
+          ZU,
           {
             variable: Lu(),
             onSave: m,
@@ -54750,7 +54758,7 @@ function BU({ environment: n, defaultExpanded: e }) {
             isNew: !0
           }
         ) : /* @__PURE__ */ b.jsx(
-          MU,
+          FU,
           {
             icon: /* @__PURE__ */ b.jsx(wu, {}),
             variant: "secondary",
@@ -54765,24 +54773,24 @@ function BU({ environment: n, defaultExpanded: e }) {
     }
   ) });
 }
-const _U = _.div`
+const NU = _.div`
   display: flex;
   flex-direction: row;
   gap: var(--spacing-xxs);
   align-items: center;
-`, NU = _(Ve)`
+`, MU = _(Ve)`
   align-self: flex-start;
   margin: 0;
-`, MU = _(NU)`
+`, FU = _(MU)`
   margin: 8px 0 8px -7px;
   font-size: var(--font-size-base);
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-base);
-`, FU = _(Bl)`
+`, ZU = _(Bl)`
   padding-left: 39px;
   margin-left: -23px;
 `;
-function ZU() {
+function WU() {
   const [n, e] = Ce(""), { environments: t, selectedEnvironmentId: r } = Le(), { sendEvent: i } = _t(), s = tt(
     () => t.filter((l) => l.name.get().toLowerCase().includes(n.toLowerCase())),
     [n, t]
@@ -54801,7 +54809,7 @@ function ZU() {
   }, a = (l) => {
     e(l);
   };
-  return /* @__PURE__ */ b.jsxs(WU, { children: [
+  return /* @__PURE__ */ b.jsxs(VU, { children: [
     /* @__PURE__ */ b.jsxs(jO, { children: [
       /* @__PURE__ */ b.jsx(QO, { value: n, onSearch: a }),
       /* @__PURE__ */ b.jsx(_e, {}),
@@ -54818,7 +54826,7 @@ function ZU() {
       ) })
     ] }),
     /* @__PURE__ */ b.jsx(BO, { children: s.map((l) => /* @__PURE__ */ b.jsx(
-      BU,
+      _U,
       {
         environment: l,
         defaultExpanded: l.get().id === r.get()
@@ -54827,7 +54835,7 @@ function ZU() {
     )) })
   ] });
 }
-const WU = _.div`
+const VU = _.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -54838,12 +54846,12 @@ function tw({ name: n, value: e }) {
   }, o = () => {
     i("app_credential_copied", { name: n });
   };
-  return /* @__PURE__ */ b.jsxs(VU, { children: [
-    /* @__PURE__ */ b.jsxs(zU, { children: [
-      /* @__PURE__ */ b.jsx(XU, { children: n }),
-      /* @__PURE__ */ b.jsx(LU, { children: t ? e : "••••••••••••••••••••••••••••••••••••" })
+  return /* @__PURE__ */ b.jsxs(zU, { children: [
+    /* @__PURE__ */ b.jsxs(XU, { children: [
+      /* @__PURE__ */ b.jsx(LU, { children: n }),
+      /* @__PURE__ */ b.jsx(GU, { children: t ? e : "••••••••••••••••••••••••••••••••••••" })
     ] }),
-    /* @__PURE__ */ b.jsxs(GU, { children: [
+    /* @__PURE__ */ b.jsxs(YU, { children: [
       /* @__PURE__ */ b.jsx(
         Ve,
         {
@@ -54857,18 +54865,18 @@ function tw({ name: n, value: e }) {
     ] })
   ] });
 }
-const VU = _.div`
+const zU = _.div`
   display: flex;
   padding: var(--spacing-xs) var(--spacing-xs);
   align-items: flex-start;
   gap: var(--spacing-xs);
   align-self: stretch;
-`, zU = _.div`
+`, XU = _.div`
   display: flex;
   align-items: flex-start;
   gap: 10px;
   flex: 1 0 0;
-`, XU = _.div`
+`, LU = _.div`
   display: -webkit-box;
   width: var(--64-px-4-rem-spacing-11, 64px);
   -webkit-box-orient: vertical;
@@ -54881,20 +54889,20 @@ const VU = _.div`
   font-style: normal;
   font-weight: var(--font-weight-semibold);
   line-height: var(--line-height-sm);
-`, LU = _.div`
+`, GU = _.div`
   flex: 1 0 0;
   color: var(--text-color-primary);
   font-size: var(--font-size-sm);
   font-style: normal;
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
-`, GU = _.div`
+`, YU = _.div`
   display: flex;
   justify-content: flex-end;
   align-items: center;
   gap: var(--spacing-xxs);
 `;
-function YU({ credential: n, number: e }) {
+function UU({ credential: n, number: e }) {
   const {
     requestActiveTabIdx: t,
     request: { securityType: r, security: i }
@@ -54948,20 +54956,20 @@ function YU({ credential: n, number: e }) {
     }
     c("apps_use_key_clicked", { number: e });
   };
-  return /* @__PURE__ */ b.jsxs(UU, { children: [
-    /* @__PURE__ */ b.jsxs(qU, { children: [
-      /* @__PURE__ */ b.jsx(JU, { children: e.toString().padStart(2, "0") }),
-      /* @__PURE__ */ b.jsxs(HU, { children: [
+  return /* @__PURE__ */ b.jsxs(qU, { children: [
+    /* @__PURE__ */ b.jsxs(HU, { children: [
+      /* @__PURE__ */ b.jsx(KU, { children: e.toString().padStart(2, "0") }),
+      /* @__PURE__ */ b.jsxs(JU, { children: [
         n.stage && /* @__PURE__ */ b.jsx(MO, { color: "gray", children: n.stage }),
         /* @__PURE__ */ b.jsx(MO, { color: "green", children: n.status })
       ] })
     ] }),
     o && /* @__PURE__ */ b.jsx(tw, { name: "API key", value: o }),
     a && /* @__PURE__ */ b.jsx(tw, { name: o ? "Secret" : "API key", value: a }),
-    /* @__PURE__ */ b.jsx(KU, { children: /* @__PURE__ */ b.jsx(Ve, { size: "small", variant: "secondary", onClick: u, children: "Use key" }) })
+    /* @__PURE__ */ b.jsx(eq, { children: /* @__PURE__ */ b.jsx(Ve, { size: "small", variant: "secondary", onClick: u, children: "Use key" }) })
   ] });
 }
-const UU = _.div`
+const qU = _.div`
   display: flex;
   flex-direction: column;
   align-self: stretch;
@@ -54975,7 +54983,7 @@ const UU = _.div`
   & > :not(:last-child) {
     border-bottom: 1px solid var(--border-color-secondary);
   }
-`, qU = _.div`
+`, HU = _.div`
   display: flex;
   justify-content: space-between;
   padding: var(--spacing-xs) var(--spacing-xs);
@@ -54983,16 +54991,16 @@ const UU = _.div`
   align-items: center;
   align-self: stretch;
   background: var(--layer-color);
-`, HU = _.div`
+`, JU = _.div`
   display: flex;
   gap: var(--spacing-xxs);
-`, JU = _.div`
+`, KU = _.div`
   color: var(--text-color-secondary, #3b3c45);
   font-size: var(--font-size-sm);
   font-style: normal;
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-sm);
-`, KU = _.div`
+`, eq = _.div`
   display: flex;
   padding: var(--spacing-xs) var(--spacing-xs);
   border-radius: 0 0 var(--border-radius-md) var(--border-radius-md);
@@ -55001,24 +55009,24 @@ const UU = _.div`
   align-self: stretch;
   background: var(--layer-color);
 `;
-function eq({ app: n }) {
+function tq({ app: n }) {
   const [e, t] = Ce(!1), { title: r, credentials: i, id: s } = n, o = i.get() || [], a = (l) => {
     l && !i.get() && (t(!0), fetch(`/api/api-keys/apps/${s.get()}`).then((c) => c.json().then((u) => {
       c.ok && i.set(u.credentials);
     }).catch(() => console.log("Something went wrong")).finally(() => t(!1))));
   };
-  return /* @__PURE__ */ b.jsx(td, { dataTestId: `app-${name}`, title: r.get(), onToggle: a, children: /* @__PURE__ */ b.jsx(tq, { children: e ? /* @__PURE__ */ b.jsx(nq, { children: /* @__PURE__ */ b.jsx(_f, { size: "16px", color: "--icon-color-additional" }) }) : o.length ? o.map((l, c) => /* @__PURE__ */ b.jsx(YU, { credential: l, number: c + 1 }, l.id)) : /* @__PURE__ */ b.jsx(rq, { children: "There are no credentials yet." }) }) });
+  return /* @__PURE__ */ b.jsx(td, { dataTestId: `app-${name}`, title: r.get(), onToggle: a, children: /* @__PURE__ */ b.jsx(nq, { children: e ? /* @__PURE__ */ b.jsx(rq, { children: /* @__PURE__ */ b.jsx(_f, { size: "16px", color: "--icon-color-additional" }) }) : o.length ? o.map((l, c) => /* @__PURE__ */ b.jsx(UU, { credential: l, number: c + 1 }, l.id)) : /* @__PURE__ */ b.jsx(iq, { children: "There are no credentials yet." }) }) });
 }
-const tq = _.div`
+const nq = _.div`
   padding-bottom: var(--spacing-xxs);
   margin-left: -7px;
   padding-right: var(--spacing-base);
-`, nq = _.div`
+`, rq = _.div`
   display: flex;
   height: 224px;
   justify-content: center;
   align-items: center;
-`, rq = _.div`
+`, iq = _.div`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -55027,7 +55035,7 @@ const tq = _.div`
   line-height: var(--line-height-base);
   color: var(--text-color-secondary);
 `;
-function iq() {
+function sq() {
   const [n, e] = Ce(""), { apps: t, apiId: r, appsLoadingState: i } = Le(), { sendEvent: s } = _t(), o = () => {
     window.open("/apps", "_blank"), s("apps_request_access_clicked", {});
   };
@@ -55042,26 +55050,26 @@ function iq() {
   ), l = (c) => {
     e(c);
   };
-  return i.get() === Ur.Loading ? /* @__PURE__ */ b.jsx(oq, { children: /* @__PURE__ */ b.jsx(_f, { size: "24px", color: "--icon-color-additional" }) }) : t.length ? /* @__PURE__ */ b.jsxs(sq, { children: [
+  return i.get() === Ur.Loading ? /* @__PURE__ */ b.jsx(aq, { children: /* @__PURE__ */ b.jsx(_f, { size: "24px", color: "--icon-color-additional" }) }) : t.length ? /* @__PURE__ */ b.jsxs(oq, { children: [
     /* @__PURE__ */ b.jsx(jO, { children: /* @__PURE__ */ b.jsx(QO, { value: n, onSearch: l }) }),
-    /* @__PURE__ */ b.jsx(BO, { children: a.map((c) => /* @__PURE__ */ b.jsx(eq, { app: c }, c.get().id)) })
+    /* @__PURE__ */ b.jsx(BO, { children: a.map((c) => /* @__PURE__ */ b.jsx(tq, { app: c }, c.get().id)) })
   ] }) : /* @__PURE__ */ b.jsxs($T, { children: [
     "You don't have any apps with access to this API",
     /* @__PURE__ */ b.jsx(Ve, { onClick: o, children: "Request access" })
   ] });
 }
-const sq = _.div`
+const oq = _.div`
   display: flex;
   flex-direction: column;
   width: 100%;
-`, oq = _.div`
+`, aq = _.div`
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
   height: calc(100vh - 50px);
-}`, { Tab: aq, TabContent: lq, TabList: cq, Tabs: uq } = aI.components;
-function fq() {
+}`, { Tab: lq, TabContent: cq, TabList: uq, Tabs: fq } = aI.components;
+function dq() {
   const { apiId: n } = Le(), { sendEvent: e } = _t(), [t, r] = Ce(!0), i = Je(
     (a) => {
       e("side_panel_tab_changed", { name: a });
@@ -55072,20 +55080,20 @@ function fq() {
   }, o = tt(() => {
     const a = [
       /* @__PURE__ */ b.jsx(Tp, { label: "History", onClick: () => i("History"), children: /* @__PURE__ */ b.jsx(hU, {}) }, "History"),
-      /* @__PURE__ */ b.jsx(Tp, { label: "Environments", onClick: () => i("Environments"), children: /* @__PURE__ */ b.jsx(ZU, {}) }, "Environments")
+      /* @__PURE__ */ b.jsx(Tp, { label: "Environments", onClick: () => i("Environments"), children: /* @__PURE__ */ b.jsx(WU, {}) }, "Environments")
     ];
     return n.get() && a.push(
-      /* @__PURE__ */ b.jsx(Tp, { label: "Apps", onClick: () => i("Apps"), children: /* @__PURE__ */ b.jsx(iq, {}) })
+      /* @__PURE__ */ b.jsx(Tp, { label: "Apps", onClick: () => i("Apps"), children: /* @__PURE__ */ b.jsx(sq, {}) })
     ), a;
   }, [n, i]);
-  return /* @__PURE__ */ b.jsxs(dq, { $expanded: t, children: [
-    t && /* @__PURE__ */ b.jsxs(hq, { children: [
+  return /* @__PURE__ */ b.jsxs(hq, { $expanded: t, children: [
+    t && /* @__PURE__ */ b.jsxs(pq, { children: [
       ...o
     ] }),
-    /* @__PURE__ */ b.jsx(pq, { variant: "text", onClick: s, children: t ? /* @__PURE__ */ b.jsx(lI, {}) : /* @__PURE__ */ b.jsx(cI, {}) })
+    /* @__PURE__ */ b.jsx(gq, { variant: "text", onClick: s, children: t ? /* @__PURE__ */ b.jsx(lI, {}) : /* @__PURE__ */ b.jsx(cI, {}) })
   ] });
 }
-const dq = _.div`
+const hq = _.div`
   display: flex;
   flex-direction: row;
   border-left: 1px solid var(--border-color-secondary);
@@ -55097,13 +55105,13 @@ const dq = _.div`
   svg {
     fill: var(--text-color-primary);
   }
-`, hq = _(uq)`
+`, pq = _(fq)`
   flex-grow: 1;
   margin-right: -48px;
   margin-top: 0;
   --md-tabs-content-padding: 0;
 
-  ${cq} {
+  ${uq} {
     margin: 0;
     height: 49px;
     font-size: var(--font-size-lg);
@@ -55118,11 +55126,11 @@ const dq = _.div`
     --md-tabs-hover-tab-border-width: 0;
   }
 
-  ${lq} {
+  ${cq} {
     overflow: auto;
   }
 
-  ${aq} {
+  ${lq} {
     font-size: var(--font-size-lg);
     font-weight: var(--font-weight-regular);
     line-height: var(--line-height-lg);
@@ -55144,57 +55152,57 @@ const dq = _.div`
   ol[class^='Tabs__TabList'] {
     padding: 0 0 0 var(--spacing-base);
   }
-`, pq = _(Ve)`
+`, gq = _(Ve)`
   align-self: flex-start;
   margin: 12px;
   padding: 4px;
-`, Tp = _.li``, gq = ({ error: n }) => /* @__PURE__ */ b.jsxs(mq, { children: [
-  /* @__PURE__ */ b.jsx(Oq, { children: "An Error Has Occurred" }),
-  /* @__PURE__ */ b.jsx(vq, { children: n == null ? void 0 : n.message }),
-  /* @__PURE__ */ b.jsx(xq, { children: n == null ? void 0 : n.stack })
-] }), mq = _.div`
+`, Tp = _.li``, mq = ({ error: n }) => /* @__PURE__ */ b.jsxs(Oq, { children: [
+  /* @__PURE__ */ b.jsx(vq, { children: "An Error Has Occurred" }),
+  /* @__PURE__ */ b.jsx(xq, { children: n == null ? void 0 : n.message }),
+  /* @__PURE__ */ b.jsx(bq, { children: n == null ? void 0 : n.stack })
+] }), Oq = _.div`
   padding: var(--spacing-xs) var(--spacing-xl);
-`, Oq = _.h2`
+`, vq = _.h2`
   color: var(--color-error-base);
-`, vq = _.h4`
+`, xq = _.h4`
   color: var(--text-color-secondary);
-`, xq = _.pre`
+`, bq = _.pre`
   white-space: break-spaces;
 `;
-function bq({ className: n }) {
-  return /* @__PURE__ */ b.jsx(yq, { className: n, children: /* @__PURE__ */ b.jsxs(Sq, { children: [
+function yq({ className: n }) {
+  return /* @__PURE__ */ b.jsx(Sq, { className: n, children: /* @__PURE__ */ b.jsxs(wq, { children: [
     /* @__PURE__ */ b.jsx(uw, { size: "24px", color: "--color-error-base" }),
-    /* @__PURE__ */ b.jsxs(wq, { children: [
-      /* @__PURE__ */ b.jsx(Cq, { children: "Oops! Something went wrong." }),
-      /* @__PURE__ */ b.jsx(kq, { children: "We're sorry. There's been an unexpected error. Our team has been notified and will investigate the issue." })
+    /* @__PURE__ */ b.jsxs(Cq, { children: [
+      /* @__PURE__ */ b.jsx(kq, { children: "Oops! Something went wrong." }),
+      /* @__PURE__ */ b.jsx(Aq, { children: "We're sorry. There's been an unexpected error. Our team has been notified and will investigate the issue." })
     ] })
   ] }) });
 }
-const yq = _.div`
+const Sq = _.div`
   display: flex;
   justify-content: center;
   align-items: center;
   width: 80vw;
   height: 100vh;
   background-color: var(--bg-color);
-`, Sq = _.div`
+`, wq = _.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--spacing-base);
-`, wq = _.div`
+`, Cq = _.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--spacing-xxs);
   width: 488px;
-`, Cq = _.div`
+`, kq = _.div`
   color: var(--text-color-primary);
   font-size: var(--font-size-xl);
   font-style: normal;
   font-weight: var(--font-weight-semibold);
   line-height: var(--line-height-xl);
-`, kq = _.div`
+`, Aq = _.div`
   color: var(--text-color-primary);
   font-size: var(--font-size-lg);
   font-style: normal;
@@ -55231,31 +55239,31 @@ class RT extends U.Component {
     this.setState(r), (s = (i = this.props).onError) == null || s.call(i, r.error);
   }
   render() {
-    return this.state.error ? process.env.NODE_ENV === "production" ? /* @__PURE__ */ b.jsx(bq, {}) : /* @__PURE__ */ b.jsx(gq, { error: this.state.error }) : this.props.children;
+    return this.state.error ? process.env.NODE_ENV === "production" ? /* @__PURE__ */ b.jsx(yq, {}) : /* @__PURE__ */ b.jsx(mq, { error: this.state.error }) : this.props.children;
   }
 }
-function Aq({ className: n }) {
+function Pq({ className: n }) {
   const { operationUrl: e } = Le().get(), { sendEvent: t } = _t();
   return /* @__PURE__ */ b.jsxs(b.Fragment, { children: [
     /* @__PURE__ */ b.jsx(uI, {}),
-    /* @__PURE__ */ b.jsx(Pq, { className: n, children: /* @__PURE__ */ b.jsxs(
+    /* @__PURE__ */ b.jsx(Eq, { className: n, children: /* @__PURE__ */ b.jsxs(
       RT,
       {
         onError: (r) => t("unhandled_error", { ...r, operationUrl: e }),
         children: [
           /* @__PURE__ */ b.jsx(kT, {}),
-          /* @__PURE__ */ b.jsx(fq, {})
+          /* @__PURE__ */ b.jsx(dq, {})
         ]
       }
     ) })
   ] });
 }
-const Pq = _.div`
+const Eq = _.div`
   display: flex;
   height: 100vh;
   background-color: var(--bg-color);
 `;
-function Eq(n, e) {
+function Tq(n, e) {
   const t = zE(n), r = VE(n), i = vX(n), s = gX(n), o = n.request.get().body.activeExampleName, a = n.request.get().body.type, l = CO(n);
   return {
     requestValues: {
@@ -55278,8 +55286,8 @@ function Eq(n, e) {
     )
   };
 }
-function Tq(n, e) {
-  const { servers: t, parameters: r } = n, i = r.filter((o) => o.in === "path"), s = Iq(n);
+function Iq(n, e) {
+  const { servers: t, parameters: r } = n, i = r.filter((o) => o.in === "path"), s = $q(n);
   return t.map((o) => {
     const a = o.url, l = o.description || a, c = o.variables || {}, u = Object.entries(c).map(([m, g]) => {
       const v = Za.getEnvironmentVariableByName(
@@ -55331,7 +55339,7 @@ function Tq(n, e) {
       state: Or.Normal,
       canBeRemoved: !1,
       canBeEdited: !1,
-      variables: $q(
+      variables: Rq(
         [
           ...p,
           {
@@ -55351,7 +55359,7 @@ function Tq(n, e) {
     };
   });
 }
-function Iq(n) {
+function $q(n) {
   const e = [], t = n.security || [], r = /* @__PURE__ */ new Set();
   return t.forEach((i) => {
     const s = as(i);
@@ -55374,7 +55382,7 @@ function Gr(n, e) {
     isSecret: e === void 0 ? !0 : e
   };
 }
-function $q(n, e) {
+function Rq(n, e) {
   return e ? n.map((t) => {
     const r = e[t.name];
     return r !== void 0 ? {
@@ -55398,16 +55406,16 @@ function DT({ value: n, disableDraft: e, ...t }) {
     oAuth2RedirectURI: h
   } = r;
   return Xe(() => {
-    const p = t.operationUrl && !e ? mT.getByKey(t.operationUrl) : null, m = Yn(n), g = Tq(m, t.predefinedEnvValues), v = g.find(
+    const p = t.operationUrl && !e ? mT.getByKey(t.operationUrl) : null, m = Yn(n), g = Iq(m, t.predefinedEnvValues), v = g.find(
       ({ name: O, url: x }) => x === (t == null ? void 0 : t.environment) || O === (t == null ? void 0 : t.environment)
     );
     i.set(m), l.set(g), a.set(t.corsProxyUrl ?? tY), o.set(null), c.set(t.operationUrl), u.set(t.mockServer), d.set(t.apiId), h.set(t.oAuth2RedirectURI), v && f.set(v.id), p ? s.set(p) : s.set(kO(m)), ME(r);
   }, [n]), r;
 }
-function qq({ onClose: n, onLoad: e, onRequestChange: t, ...r }) {
+function Hq({ onClose: n, onLoad: e, onRequestChange: t, ...r }) {
   const i = ct(null), { sendEvent: s } = _t(), o = Le(), a = DT(r), l = Je(() => {
     if (t) {
-      const u = a.isLinked.get(), f = Eq(a, r.value);
+      const u = a.isLinked.get(), f = Tq(a, r.value);
       t(u ? f : { requestValues: {} });
     }
     s("replay_closed", { operationName: r.value.name }), n(), o.set(eo());
@@ -55422,7 +55430,7 @@ function qq({ onClose: n, onLoad: e, onRequestChange: t, ...r }) {
   };
   return /* @__PURE__ */ b.jsx(iw, { children: /* @__PURE__ */ b.jsxs(Mk, { onClick: l, children: [
     /* @__PURE__ */ b.jsx(
-      Dq,
+      Qq,
       {
         onClick: l,
         role: "button",
@@ -55430,15 +55438,15 @@ function qq({ onClose: n, onLoad: e, onRequestChange: t, ...r }) {
         tabIndex: 0,
         ref: i,
         autoFocus: !0,
-        children: /* @__PURE__ */ b.jsx(Qq, {})
+        children: /* @__PURE__ */ b.jsx(jq, {})
       }
     ),
-    /* @__PURE__ */ b.jsx(Rq, {})
+    /* @__PURE__ */ b.jsx(Dq, {})
   ] }) });
 }
-const Rq = _(Aq)`
+const Dq = _(Pq)`
   width: 80vw;
-`, Dq = _.div`
+`, Qq = _.div`
   display: flex;
   justify-content: center;
   align-items: center;
@@ -55451,30 +55459,30 @@ const Rq = _(Aq)`
   width: 24px;
   height: 24px;
   cursor: pointer;
-`, Qq = _(Bo)`
+`, jq = _(Bo)`
   width: 14px;
   height: 14px;
 `;
-function Hq(n) {
+function Jq(n) {
   const { sendEvent: e } = _t(), t = tt(() => Uw(eo()), []);
   return /* @__PURE__ */ b.jsx(ZG, { value: t, children: /* @__PURE__ */ b.jsx(
     RT,
     {
       onError: (r) => e("unhandled_error", { ...r, isEmbedded: !0 }),
-      children: /* @__PURE__ */ b.jsx(jq, { ...n })
+      children: /* @__PURE__ */ b.jsx(Bq, { ...n })
     }
   ) });
 }
-function jq(n) {
-  return DT({ ...n, disableDraft: !0 }), /* @__PURE__ */ b.jsx(iw, { children: /* @__PURE__ */ b.jsx(Bq, { children: /* @__PURE__ */ b.jsx(kT, {}) }) });
+function Bq(n) {
+  return DT({ ...n, disableDraft: !0 }), /* @__PURE__ */ b.jsx(iw, { children: /* @__PURE__ */ b.jsx(_q, { children: /* @__PURE__ */ b.jsx(kT, {}) }) });
 }
-const Bq = _.div`
+const _q = _.div`
   display: flex;
   max-height: 80vh;
   height: 800px;
   width: 100%;
 `;
 export {
-  Hq as EmbeddedReplay,
-  qq as ReplayOverlay
+  Jq as EmbeddedReplay,
+  Hq as ReplayOverlay
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/replay",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "type": "module",
   "main": "./dist/replay.cjs",
   "module": "./dist/replay.js",