https://www.debugbear.com/cdn/chunk-3202.c7e22916758de7c78311.js

1"use strict";(("undefined"==typeof window?self:window).webpackChunkdebugbear_gae=("undefined"==typeof window?self:window).webpackChunkdebugbear_gae||[]).push([[3202],{13202(e,n,i){i.d(n,{L3:()=>x,ut:()=>g}),i(62953);var t=i(70201),r=i(41802),o=i(32485),s=i.n(o),a=i(2543),l=i(96540),d=i(40961);function c(e){let n=e.children;return(0,d.createPortal)(n,document.body)}i(83209);var u=i(25608),f=i(74848);function p(e,n,i){return(n=function(e){var n=function(e){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var i=n.call(e,"string");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==typeof n?n:n+""}(n))in e?Object.defineProperty(e,n,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[n]=i,e}function h(e){const n=e.__info.valueSize+e.__info.keySize,i=(0,r.Ub)(n,{precision:n<1e3&&n>100?3:2});return{fullSize:n,fullSizeStr:i.value+i.unit}}const y=60;class z extends l.Component{constructor(){super(...arguments),p(this,"hideKeyInfo",()=>{document.body.style.paddingBottom="0",this.setState({keyInfo:null})}),p(this,"state",{keyInfo:null}),p(this,"showKeyInfo",e=>{if(this.props.dontShowKeyDetails)return;document.body.style.paddingBottom="174px";const n=function n(s){for(const a in s)if(Object.hasOwn(s,a))if("__info"===a){const n=s[a];if(n.key===e)return{key:e.split("@#@").slice(-1)[0],countKey:n.countKey,sampleValue:i(n.sampleValue),averageValueSize:t(n),totalValueSize:(0,r.z3)(n.valueSize),totalSize:(0,r.z3)(n.keySize+n.valueSize),keySize:(0,r.z3)(n.keySize),averageKeySize:o(n)}}else if(s[a]&&"object"==typeof s[a]){const e=n(s[a]);if(e)return e}return null}(this.props.jsonInfo);function i(e){e=JSON.stringify(e,null,4);let n=0,i="";for(let t=0;t<e.length;t++)if("\n"===e[t]&&n++,"\n"===e[t]&&1===n||"\n"===e[t-1]&&1===n&&" "===e[t]||(i+=e[t]),4===n){i=i.trim(),i+=" ...";break}return i}function t(e){if(!e.valueSize||!e.countKey)return"";let n=(0,r.Ub)(e.valueSize/e.countKey),i=n.value,t=n.unit;return"B"===t&&(i=parseFloat(i).toFixed(0)),i+t}function o(e){if(!e.keySize||!e.countKey)return"";let n=(0,r.Ub)(e.keySize/e.countKey),i=n.value,t=n.unit;return"B"===t&&(i=parseFloat(i).toFixed(0)),i+t}this.setState({keyInfo:n})})}componentWillUnmount(){document.body.style.paddingBottom="0"}render(){const e=this.props,n=e.jsonInfo,i=e.getExtraKeyContent,t=e.getRequiredChildKeys,o=this.state.keyInfo;return(0,f.jsxs)("div",{children:[o&&(0,f.jsx)(c,{children:(0,f.jsx)("div",{className:"preview-box",children:(0,f.jsx)("div",{className:"row",children:(0,f.jsx)("div",{className:"col-md-12",style:{margin:"0 auto"},children:(0,f.jsxs)("div",{className:"px-3",children:[(0,f.jsxs)("p",{className:"scale-small-1",children:[o.countKey," values at the"," ",(0,f.jsx)("code",{children:o.key})," property, here's an example:"]}),(0,f.jsx)("pre",{style:{borderRadius:4,fontSize:13},children:o.sampleValue}),(0,f.jsxs)("p",{className:"scale-small-1",children:[(0,f.jsxs)("span",{children:["Total size: ",o.totalSize]}),(0,f.jsxs)("span",{children:["Values: ",o.totalValueSize," (",o.averageValueSize," avg)"]}),(0,f.jsxs)("span",{children:["Key ",o.key,": ",o.keySize," (",o.averageKeySize," avg)"]})]})]})})})})}),n.largeImages.length>0&&(0,f.jsxs)("div",{children:[(0,f.jsxs)("h4",{className:"scale-small-1",children:["This JSON code contains ",n.largeImages.length," large images"]}),(0,f.jsx)("div",{className:"d-flex",style:{flexWrap:"wrap"},children:n.largeImages.map((e,n)=>(0,f.jsxs)("div",{style:{marginRight:8,marginBottom:8},children:[(0,f.jsx)("div",{style:{marginBottom:4,border:"1px solid #ccc",borderRadius:4,width:80,height:80,flexShrink:0,display:"flex",justifyContent:"center",alignItems:"center"},children:(0,f.jsx)("img",{src:e,style:{maxWidth:70,maxHeight:70}})}),(0,f.jsx)("div",{className:"scale-small-1 color-coldGrey1 text-center",children:(0,r.z3)(e.length)})]},n))})]}),(0,f.jsx)("div",{className:"output",children:(0,f.jsx)(m,{info:n.json,defaultExpanded:!0,totalSize:h(n.json).fullSize,onHoverKey:this.showKeyInfo,onHoverOutKey:this.hideKeyInfo,barLength:800,depth:0,getExtraKeyContent:i,getRequiredChildKeys:t})})]})}}function _(e,n){let i=e[n];

1return i||(i={__info:{keySize:0,valueSize:0,key:e.__info.key+"@#@"+n}}),i}class m extends l.Component{constructor(){super(...arguments),p(this,"state",{isExpanded:!1})}componentDidMount(){const e=this.props,n=e.defaultExpanded,i=e.depth,t=e.info.__info.key.split("@#@").slice(-1)[0];(n||"[]"===t&&i<2)&&this.setState({isExpanded:!0})}render(){const e=this.props,n=e.info,i=e.barLength,r=e.totalSize,o=e.onHoverKey,l=e.onHoverOutKey,d=e.depth,c=e.getExtraKeyContent,u=e.getRequiredChildKeys,p=h(n),z=p.fullSize,g=p.fullSizeStr,x=function(e){let n=Object.keys(e);return n=n.filter(n=>"__info"!==n&&"object"==typeof e[n]&&e[n].__info),(0,a.orderBy)(n,function(n){return e[n]&&e[n].__info?e[n].__info.valueSize+e[n].__info.keySize:0},["desc"])}(n);if(u){const e=u(n.__info.key);for(const n of e)x.includes(n)||x.push(n)}const b=x.length>0?function(e,n,i){let t,r;const o=_(n,e[0]).__info;r=o.valueSize+o.keySize,t=i<400?400:.75*i;const s=[{barLength:t,styles:{width:t}}];for(let i=1;i<e.length;i++)if(_(n,e[i])&&_(n,e[i]).__info){const o=_(n,e[i]).__info,a=(o.valueSize+o.keySize)/r*t;a>y?s.push({barLength:a,styles:{width:a}}):s.push({barLength:y,styles:{width:y,background:`linear-gradient(90deg, #044f77 0%, #044f77 ${a/y*100}%, #077cbb ${a/y*100}%)`}})}return s}(x,n,i):[];let v=n.__info.key.split("@#@").slice(-1)[0];"array"===n.__info.type&&(v=`${v}[${n.__info.countChildren}]`);const j=0===d;return(0,f.jsxs)("div",{style:{marginLeft:j?0:30},onClick:e=>{e.stopPropagation(),0!==this.props.depth&&this.setState({isExpanded:!this.state.isExpanded})},children:[(0,f.jsxs)("div",{className:s()("json-size-analyzer__item",{"json-size-analyzer__item--depth-0":j}),"data-test-json-size-visualization-item":n.__info.key,style:{display:"flex",alignItems:"center",position:"relative"},onMouseOver:()=>o(n.__info.key),children:[x.length>0&&!j&&(0,f.jsx)("button",{children:this.state.isExpanded?"–":"+"}),(0,f.jsx)(t.v,{size:z,maxSize:r,title:v,extraInfoLabel:c(n.__info.key),sizeLabel:g,fullSizeColor:"purple2"})]}),this.state.isExpanded&&x.map((e,i)=>{const t=b[i]&&b[i].barLength||y,s=_(n,e);return(0,f.jsx)("div",{children:(0,f.jsx)(m,{info:s,getExtraKeyContent:c,getRequiredChildKeys:u,barLength:t,totalSize:r,onHoverKey:o,onHoverOutKey:l,depth:d+1,defaultExpanded:0===d&&0===i})},i)})]})}}class g extends l.Component{render(){const e=this.props.jsonInfo;return(0,f.jsx)(z,{jsonInfo:e,getExtraKeyContent:n=>{const i=e.json.__info.valueSize+e.json.__info.keySize,t=(0,u.h)(e,n),r=t.__info.valueSize+t.__info.keySize;return(0,f.jsx)("span",{className:"percentage",children:(o=r/i,(100*o).toFixed(2)+"%")});var o}})}}l.Component;class x extends l.Component{render(){const e=this.props,n=e.jsonInfoBefore,i=e.jsonInfoAfter;return(0,f.jsx)("div",{className:"json-size-analyzer",children:(0,f.jsx)(z,{dontShowKeyDetails:!0,jsonInfo:i,getRequiredChildKeys:e=>{const i=(0,u.h)(n,e)||{};return Object.keys(i).filter(e=>"__info"!==e)},getExtraKeyContent:e=>{try{const t=(0,u.h)(n,e),o=t?t.__info.keySize+t.__info.valueSize:0,s=(0,u.h)(i,e),a=(s?s.__info.keySize+s.__info.valueSize:0)-o;let l="#777";return a>100&&(l="#d31d1d"),a<-100&&(l="green"),(0,f.jsx)("span",{style:{color:l},children:(0,r.ff)(a)})}catch(e){return(0,f.jsx)("span",{children:"(Error)"})}}})})}}},25608(e,n,i){i.d(n,{A:()=>a,h:()=>d});var t=i(2543);const r="@#@";let o={},s={};function a(e){let n=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:["json"],d=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"json",c=arguments.length>4?arguments[4]:void 0,u=!(arguments.length>5&&void 0!==arguments[5])||arguments[5];const f=(p=e)&&p.length&&p.forEach;var p;if(f){c||(o[i.join(r)]=o[i.join(r)]?++o[i.join(r)]:1);const t={type:"array",key:i.join(r),keySize:0,valueSize:0,sampleValue:e,countChildren:e.length};e.forEach(e=>{const n=a(e,!1,i,"",!0,!1);t.valueSize+=n.size}),t.valueSize+=2;const f=d?JSON.stringify(d).length:0;if(t.keySize=f,u&&l(s,i,{__info:t}),!n)return{size:t.valueSize+t.keySize}}else if((e=>null!==e&&!f&&"object"==typeof e)(e)){c||(o[i.join(r)]=o[i.join(r)]?++o[i.join(r)]:1);const t={key:i.join(r),keySize:0,valueSize:0,sampleValue:e};Object.keys(e).forEach(n=>{const r=a(e[n],!1,i.concat(n),n);t.valueSize+=r.size}),t.valueSize+=2;const f=d?JSON.stringify(d).length:0;if(t.keySize=f,u&&l(s,i,{__info:t}),!n)return{size:t.valueSize+t.keySize}}else{const t=JSON.stringify(e).length,a=d?JSON.stringify(d).length:0;c||(o[i.join(r)]=o[i.join(r)]?++o[i.join(r)]:1);const f={key:i.join(r),keySize:a,valueSize:t,sampleValue:e};if(u&&l(s,i,{__info:f}),!n)return{size:a+t,sampleValue:e}}

1Object.keys(o).forEach(e=>{l(s,e.split(r),{__info:{countKey:o[e]}})}),o={};const h=s;return s={},h.largeImages=(0,t.sortBy)((JSON.stringify(e).match(/data:image.*?"/g)||[]).map(e=>(e=e.slice(0,-1),/=[^=]/.test(e.slice(-2))&&(e=e.slice(0,-1)),e)).filter(e=>e.length>1024),e=>-e.length),h}function l(e,n,i){if(1===n.length)if(e[n[0]]&&e[n[0]].__info){const t={__info:{...e[n[0]].__info,...i.__info,valueSize:(i.__info.valueSize||0)+(e[n[0]].__info.valueSize||0)}};"array"===i.__info.type&&(t.__info.countChildren=(i.__info.countChildren||0)+(e[n[0]].__info.countChildren||0)),i.__info.countKey&&(t.__info.keySize=(i.__info.countKey||0)*(e[n[0]].__info.keySize||0)),e[n[0]]=Object.assign(e[n[0]]||{},t)}else e[n[0]]=Object.assign(e[n[0]]||{},i);else e[n[0]]||(e[n[0]]={}),l(e[n[0]],n.slice(1),i)}function d(e,n){const i=n.split(r).slice(1);e=e.json;for(let n=0;n<i.length&&(e=e[i[n]]);n++);return e}},70201(e,n,i){i.d(n,{v:()=>x,i:()=>b}),i(62953);var t=i(96540),r=i(85072),o=i.n(r),s=i(97825),a=i.n(s),l=i(77659),d=i.n(l),c=i(55056),u=i.n(c),f=i(10540),p=i.n(f),h=i(41113),y=i.n(h),z=i(42402),_={};_.styleTagTransform=y(),_.setAttributes=u(),_.insert=d().bind(null,"head"),_.domAPI=a(),_.insertStyleElement=p(),o()(z.A,_),z.A&&z.A.locals&&z.A.locals;var m=i(74848);function g(e,n){(null==n||n>e.length)&&(n=e.length);for(var i=0,t=Array(n);i<n;i++)t[i]=e[i];return t}function x(e){let n=e.size,i=e.compressedSize,r=e.maxSize,o=e.title,s=e.extraInfoLabel,a=e.sizeLabel,l=e.fullSizeColor,d=e.compressedSizeColor,c=e.extraContent,u=e.isNested;const f=(k=t.useState(0),w=2,function(e){if(Array.isArray(e))return e}(k)||function(e,n){var i=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=i){var t,r,o,s,a=[],l=!0,d=!1;try{if(o=(i=i.call(e)).next,0===n){if(Object(i)!==i)return;l=!1}else for(;!(l=(t=o.call(i)).done)&&(a.push(t.value),a.length!==n);l=!0);}catch(e){d=!0,r=e}finally{try{if(!l&&null!=i.return&&(s=i.return(),Object(s)!==s))return}finally{if(d)throw r}}return a}}(k,w)||function(e,n){if(e){if("string"==typeof e)return g(e,n);var i={}.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?g(e,n):void 0}}(k,w)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),p=f[0],h=f[1],y=n/r*p,z=i?i/r*p:null,_=l.startsWith("#")||l.startsWith("rgb")?l:`var(--${l})`,x=d?d.startsWith("#")||d.startsWith("rgb")?d:`var(--${d})`:void 0,b=i&&z&&x?{maxWidth:y,minWidth:y,background:`linear-gradient(90deg, ${_} 0%, ${_} ${100-z/y*100}%, ${x} ${100-z/y*100}%, ${x})`}:{maxWidth:y,minWidth:y,backgroundColor:_},v=t.useRef(null),j=e=>h(e.scrollWidth*(e.scrollWidth<800?.2:e.scrollWidth<1e3?.35:.5)*(u?.35:1)),S=t.useCallback(e=>{e&&(j(e),v.current=e)},[]);var k,w;return t.useEffect(()=>{const e=()=>{v.current&&j(v.current)};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]),(0,m.jsxs)("div",{className:"size-info-bar",ref:S,children:[(0,m.jsxs)("div",{className:"d-flex align-items-center size-info-bar__title-container",children:[(0,m.jsx)("div",{className:"size-info-bar__title",title:o,children:o}),c&&(0,m.jsx)("div",{className:"ml-1 d-flex",children:c})]}),(0,m.jsx)("div",{className:"size-info-bar__bar-container",children:(0,m.jsx)("div",{className:"size-info-bar__size-indicator",style:b})}),(0,m.jsxs)("div",{className:"d-flex align-items-center size-info-bar__size-info",children:[(0,m.jsx)("div",{className:"size-info-bar__extraInfo",children:s}),(0,m.jsx)("div",{className:"size-info-bar__size-label",children:a})]})]})}function b(e){let n=e.children,i=e.onClick;return(0,m.jsx)("div",{onClick:i,className:"size-info-bar__wrapper",children:n})}},31166(e,n,i){var t=i(31601),r=i.n(t),o=i(76314),s=i.n(o)()(r());s.push([e.id,".json-size-analyzer>div .input{width:100%}.json-size-analyzer>div .input textarea{padding:6px;width:100%;min-height:165px;border-radius:4px;background:snow}.dark-mode .json-size-analyzer>div .input textarea{background:#171923;color:#fff}.json-size-analyzer>div .input textarea:focus{outline:none}.json-size-analyzer>div .output{width:100%;overflow:auto}.json-size-analyzer>div .output .percentage{opacity:.5;transition:opacity .1s}.json-size-analyzer>div .output .json-size-analyzer__item:not(.json-size-analyzer__item--depth-0){cursor:pointer}.json-size-analyzer>div .output .json-size-analyzer__item:not(.json-size-analyzer__item--depth-0):hover{background:#eee}.dark-mode .json-size-analyzer>div .output .json-size-analyzer__item:not(.json-size-analyzer__item--depth-0):hover{background:rgba(255,255,255,.1)}.json-size-analyzer>div .output .json-size-analyzer__item:not(.json-size-analyzer__item--depth-0):hover .percentage{opacity:1}.json-size-analyzer>div .output button{border-radius:4px;position:absolute;background:rgba(0,0,0,0);left:-30px;border:none;cursor:pointer}.dark-mode .json-size-analyzer>div .output button{color:#fff}.json-size-analyzer>div .output button:focus{outline:none}.json-size-analyzer>div .output button:hover{color:#007bff}.preview-box{position:fixed;bottom:0;left:0;width:100%;background:#fafafa;border-top:1px solid #ddd;box-shadow:0px 0px 1px #aaa}.dark-mode .preview-box{background:#171923;color:#fff;border-color:rgba(255,255,255,.1) !important}.preview-box p{margin:10px 0}.preview-box p span{margin-right:20px}.preview-box pre{background:#ecf2f5;padding:6px;margin:0 0;font-size:12px;height:66px;overflow:hidden}.dark-mode .preview-box pre{background:#1e212e}.json-size-analyzer__item{border:1px solid #eee;margin:2px 0;margin-bottom:4px;padding:6px;margin-top:8px;border-radius:4px}.dark-mode .json-size-analyzer__item{border-color:rgba(255,255,255,.1) !important}.json-size-analyzer__item.json-size-analyzer__item--depth-0{margin-top:0px}",""]);const a=s;

1i.d(n,["A",0,a])},42402(e,n,i){var t=i(31601),r=i.n(t),o=i(76314),s=i.n(o)()(r());s.push([e.id,".space-children-2>*+*{margin-top:.5rem}.size-info-bar{flex-grow:1;display:flex;align-items:center;border-radius:4px}.size-info-bar__wrapper{cursor:pointer;border-radius:4px;padding:8px;border-bottom:1px solid #eee}.size-info-bar__wrapper:last-child{border-bottom:none}.dark-mode .size-info-bar__wrapper{border-color:rgba(255,255,255,.1) !important}.size-info-bar__wrapper:hover{background:#f7f7f7}.dark-mode .size-info-bar__wrapper:hover{background:rgba(255,255,255,.1)}.size-info-bar__title-container{flex-shrink:1;margin-right:.5rem;min-width:200px}@media screen and (max-width: 800px){.size-info-bar__title-container{min-width:100px}}.size-info-bar__title{line-height:1.1em;font-family:monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.size-info-bar__bar-container{flex-grow:1;display:flex;align-items:center;margin-right:.5rem;justify-content:flex-end}.size-info-bar__size-indicator{flex-grow:1;height:10px;padding:0 4px;border-radius:4px}.size-info-bar__size-info{flex-shrink:0;display:flex;align-items:center}.size-info-bar__extraInfo{color:#787878;white-space:nowrap;font-size:13px;margin-right:.5rem;text-align:right;width:55px}.size-info-bar__size-label{line-height:1;border-radius:4px;font-size:16px;font-weight:500;width:75px;text-align:right;flex-shrink:0}",""]);const a=s;i.d(n,["A",0,a])},83209(e,n,i){var t=i(85072),r=i.n(t),o=i(97825),s=i.n(o),a=i(77659),l=i.n(a),d=i(55056),c=i.n(d),u=i(10540),f=i.n(u),p=i(41113),h=i.n(p),y=i(31166),z={};z.styleTagTransform=h(),z.setAttributes=c(),z.insert=l().bind(null,"head"),z.domAPI=s(),z.insertStyleElement=f(),r()(y.A,z),y.A&&y.A.locals&&y.A.locals}}]);