@react-native/debugger-frontend 0.73.0

package/dist/third-party/front_end/ui/legacy/components/inline_editor/inline_editor.js

@@ -0,0 +1 @@
+import*as e from"../../legacy.js";import*as t from"../../../../third_party/codemirror.next/codemirror.next.js";import*as i from"../../../../core/platform/platform.js";import*as n from"../../../../core/common/common.js";import*as s from"../../../components/helpers/helpers.js";import*as o from"../../../lit-html/lit-html.js";import*as r from"../../../../core/host/host.js";import*as a from"../../../../core/i18n/i18n.js";import*as l from"../color_picker/color_picker.js";import*as h from"../../../../core/sdk/sdk.js";import*as d from"../../../../models/text_utils/text_utils.js";import*as c from"../../../components/icon_button/icon_button.js";import*as u from"../../../../panels/css_overview/css_overview.js";const p=t.css.cssLanguage.parser,m=new Intl.NumberFormat("en",{maximumFractionDigits:2});function g(e,t){for(let i=t;i<e.length;i++)if(!isNaN(e[i].input))return i;return-1}function v(e,t){const i=[];for(;","!==e.type.name&&")"!==e.type.name;){const n=t.substring(e.from,e.to);if("NumberLiteral"!==e.type.name)return null;i.push(n),e.next(!1)}if(i.length>3)return null;const n=i.filter((e=>e.includes("%")));if(n.length>2)return null;const s=i.filter((e=>!e.includes("%")));return 1!==s.length?null:{number:Number(s[0]),lengthA:n[0]?Number(n[0].substring(0,n[0].length-1)):void 0,lengthB:n[1]?Number(n[1].substring(0,n[1].length-1)):void 0}}const f={linear:"linear(0 0%, 1 100%)"};class x{#e;constructor(e){this.#e=e}static parse(e){if(f[e])return x.parse(f[e]);const t=function(e){const t=`*{--a: ${e}}`,i=p.parse(t).cursorAt(t.indexOf(":")+1);for(;"ArgList"!==i.name&&i.next(!0);)if("Callee"===i.name&&"linear"!==t.substring(i.from,i.to))return null;if("ArgList"!==i.name)return null;i.firstChild();const n=[];for(;")"!==i.type.name&&i.next(!1);){const e=v(i,t);if(!e)return null;n.push(e)}return n}(e);if(!t||t.length<2)return null;let i=-1/0;const n=[];for(let e=0;e<t.length;e++){const s=t[e],o={input:NaN,output:s.number};if(n.push(o),void 0!==s.lengthA){if(o.input=Math.max(s.lengthA,i),i=o.input,void 0!==s.lengthB){const e={input:NaN,output:o.output};n.push(e),e.input=Math.max(s.lengthB,i),i=e.input}}else 0===e?(o.input=0,i=0):e===t.length-1&&(o.input=Math.max(100,i))}let s=0;for(let e=1;e<n.length;e++)isNaN(n[e].input)&&(e>s&&(s=g(n,e)),n[e].input=n[e-1].input+(n[s].input-n[e-1].input)/(s-(e-1)));return new x(n)}addPoint(e,t){void 0===t?this.#e.push(e):this.#e.splice(t,0,e)}removePoint(e){this.#e.splice(e,1)}setPoint(e,t){this.#e[e]=t}points(){return this.#e}asCSSText(){const e=`linear(${this.#e.map((e=>`${m.format(e.output)} ${m.format(e.input)}%`)).join(", ")})`;for(const[t,i]of Object.entries(f))if(i===e)return t;return e}}var b=Object.freeze({__proto__:null,CSSLinearEasingModel:x});class w{static parse(t){const i=x.parse(t);return i||(e.Geometry.CubicBezier.parse(t)||null)}}const S=e.Geometry.LINEAR_BEZIER;var y=Object.freeze({__proto__:null,AnimationTimingModel:w,LINEAR_BEZIER:S});class C{width;height;marginTop;radius;shouldDrawLine;constructor({width:e,height:t,marginTop:i,controlPointRadius:n,shouldDrawLine:s}){this.width=e,this.height=t,this.marginTop=i,this.radius=n,this.shouldDrawLine=s}static drawVelocityChart(e,t,i){const n=I;let s=["M",0,n];const o=1/40;let r=e.evaluateAt(0);for(let t=o;t<1.025;t+=o){const o=e.evaluateAt(t);let a=(o.y-r.y)/(o.x-r.x);const l=r.x*(1-t)+o.x*t;a=Math.tanh(a/1.5),s=s.concat(["L",(l*i).toFixed(2),(n-a*n).toFixed(2)]),r=o}s=s.concat(["L",i.toFixed(2),n,"Z"]),t.setAttribute("d",s.join(" "))}curveWidth(){return this.width-2*this.radius}curveHeight(){return this.height-2*this.radius-2*this.marginTop}drawLine(t,i,n,s,o,r){const a=e.UIUtils.createSVGChild(t,"line",i);a.setAttribute("x1",String(n+this.radius)),a.setAttribute("y1",String(s+this.radius+this.marginTop)),a.setAttribute("x2",String(o+this.radius)),a.setAttribute("y2",String(r+this.radius+this.marginTop))}drawControlPoints(t,i,n,s,o){this.drawLine(t,"bezier-control-line",i,n,s,o);const r=e.UIUtils.createSVGChild(t,"circle","bezier-control-circle");r.setAttribute("cx",String(s+this.radius)),r.setAttribute("cy",String(o+this.radius+this.marginTop)),r.setAttribute("r",String(this.radius))}drawCurve(t,i){if(!t)return;const n=this.curveWidth(),s=this.curveHeight();i.setAttribute("width",String(this.width)),i.setAttribute("height",String(this.height)),i.removeChildren();const o=e.UIUtils.createSVGChild(i,"g");this.shouldDrawLine&&this.drawLine(o,"linear-line",0,s,n,0);const r=e.UIUtils.createSVGChild(o,"path","bezier-path"),a=[new e.Geometry.Point(t.controlPoints[0].x*n+this.radius,(1-t.controlPoints[0].y)*s+this.radius+this.marginTop),new e.Geometry.Point(t.controlPoints[1].x*n+this.radius,(1-t.controlPoints[1].y)*s+this.radius+this.marginTop),new e.Geometry.Point(n+this.radius,this.marginTop+this.radius)];r.setAttribute("d","M"+this.radius+","+(s+this.radius+this.marginTop)+" C"+a.join(" ")),this.drawControlPoints(o,0,s,t.controlPoints[0].x*n,(1-t.controlPoints[0].y)*s),this.drawControlPoints(o,n,0,t.controlPoints[1].x*n,(1-t.controlPoints[1].y)*s)}}const I=26;var k=Object.freeze({__proto__:null,BezierUI:C,Height:I});class E{#t;#i;#n;#s;#o;#r;#a;constructor({bezier:t,container:i,onBezierChange:n}){this.#i=t,this.#t=new C({width:150,height:250,marginTop:50,controlPointRadius:7,shouldDrawLine:!0}),this.#n=e.UIUtils.createSVGChild(i,"svg","bezier-curve"),this.#a=n,e.UIUtils.installDragHandle(this.#n,this.dragStart.bind(this),this.dragMove.bind(this),this.dragEnd.bind(this),"default")}dragStart(t){this.#s=new e.Geometry.Point(t.x,t.y);const n=this.#t;this.#o=new e.Geometry.Point(i.NumberUtilities.clamp((t.offsetX-n.radius)/n.curveWidth(),0,1),(n.curveHeight()+n.marginTop+n.radius-t.offsetY)/n.curveHeight());const s=this.#o.distanceTo(this.#i.controlPoints[0])<this.#o.distanceTo(this.#i.controlPoints[1]);return this.#r=s?0:1,this.#i.controlPoints[this.#r]=this.#o,this.#a(this.#i),t.consume(!0),!0}updateControlPosition(t,n){if(void 0===this.#s||void 0===this.#o||void 0===this.#r)return;const s=(t-this.#s.x)/this.#t.curveWidth(),o=(n-this.#s.y)/this.#t.curveHeight(),r=new e.Geometry.Point(i.NumberUtilities.clamp(this.#o.x+s,0,1),this.#o.y-o);this.#i.controlPoints[this.#r]=r}dragMove(e){this.updateControlPosition(e.x,e.y),this.#a(this.#i)}dragEnd(e){this.updateControlPosition(e.x,e.y),this.#a(this.#i)}setBezier(e){this.#i=e,this.draw()}draw(){this.#t.drawCurve(this.#i,this.#n)}}class P{params;renderedPositions;constructor(e){this.params=e}#l(){return this.params.width-2*this.params.pointRadius}#h(){return this.params.height-2*this.params.pointRadius-2*this.params.marginTop}#d(t,i,n,s){const o=e.UIUtils.createSVGChild(t,"circle","bezier-control-circle");o.setAttribute("data-point-index",String(s)),o.setAttribute("cx",String(i)),o.setAttribute("cy",String(n)),o.setAttribute("r",String(this.params.pointRadius))}timingPointToPosition(e){return{x:e.input/100*this.#l()+this.params.pointRadius,y:(1-e.output)*this.#h()+this.params.pointRadius}}positionToTimingPoint(e){return{input:(e.x-this.params.pointRadius)/this.#l()*100,output:1-(e.y-this.params.pointRadius)/this.#h()}}draw(t,i){i.setAttribute("width",String(this.#l())),i.setAttribute("height",String(this.#h())),i.removeChildren();const n=e.UIUtils.createSVGChild(i,"g"),s=t.points().map((e=>this.timingPointToPosition(e)));this.renderedPositions=s;let o=s[0];for(let t=1;t<s.length;t++){const i=s[t],r=e.UIUtils.createSVGChild(n,"path","bezier-path linear-path");r.setAttribute("d",`M ${o.x} ${o.y} L ${i.x} ${i.y}`),r.setAttribute("data-line-index",String(t)),o=i}for(let e=0;e<s.length;e++){const t=s[e];this.#d(n,t.x,t.y,e)}}}class T{#c;#u;#p;#m;#g;#v;#s;#f;constructor({model:t,container:i,onChange:n}){this.#c=t,this.#u=n,this.#p=new P({width:150,height:250,pointRadius:7,marginTop:50}),this.#f=e.UIUtils.createSVGChild(i,"svg","bezier-curve linear"),e.UIUtils.installDragHandle(this.#f,this.#x.bind(this),this.#b.bind(this),this.#w.bind(this),"default")}#S(e,t){const i=this.#p.positionToTimingPoint({x:e.offsetX,y:e.offsetY});this.#c.addPoint(i,t),this.#m=void 0,this.#s=void 0}#y(e,t){if(this.#m=t,this.#s={x:e.x,y:e.y},clearTimeout(this.#g),this.#v===this.#m)return this.#c.removePoint(this.#m),this.#v=void 0,this.#m=void 0,void(this.#s=void 0);this.#v=this.#m,this.#g=window.setTimeout((()=>{this.#v=void 0}),500)}#x(e){return e.target instanceof SVGElement&&(void 0!==e.target.dataset.lineIndex?(this.#S(e,Number(e.target.dataset.lineIndex)),e.consume(!0),!0):void 0!==e.target.dataset.pointIndex&&(this.#y(e,Number(e.target.dataset.pointIndex)),e.consume(!0),!0))}#C(e,t){if(void 0===this.#m||void 0===this.#s)return;const i=this.#p.renderedPositions?.[this.#m];if(!i)return;const n=e-this.#s.x,s=t-this.#s.y;this.#s={x:e,y:t};const o={x:i.x+n,y:i.y+s};this.#c.setPoint(this.#m,this.#p.positionToTimingPoint(o))}#b(e){this.#C(e.x,e.y),this.#u(this.#c)}#w(e){this.#C(e.x,e.y),this.#u(this.#c)}setCSSLinearEasingModel(e){this.#c=e,this.draw()}draw(){this.#p.draw(this.#c,this.#f)}}class z{#I;#k;constructor(){this.#I=new P({width:40,height:40,marginTop:0,pointRadius:2}),this.#k=new C({width:40,height:40,marginTop:0,controlPointRadius:2,shouldDrawLine:!1})}draw(t,i){t instanceof x?this.#I.draw(t,i):t instanceof e.Geometry.CubicBezier&&this.#k.drawCurve(t,i)}}class M{#E;#P;#T;#c;#u;#z;#M;constructor({model:t,onChange:i}){this.#E=document.createElement("div"),this.#E.className="animation-timing-ui",this.#E.style.width="150px",this.#E.style.height="250px",this.#P=document.createElement("div"),this.#P.classList.add("bezier-ui-container"),this.#T=document.createElement("div"),this.#T.classList.add("linear-easing-ui-container"),this.#E.appendChild(this.#P),this.#E.appendChild(this.#T),this.#c=t,this.#u=i,this.#c instanceof e.Geometry.CubicBezier?this.#z=new E({bezier:this.#c,container:this.#P,onBezierChange:this.#u}):this.#c instanceof x&&(this.#M=new T({model:this.#c,container:this.#T,onChange:this.#u}))}element(){return this.#E}setModel(t){this.#c=t,this.#c instanceof e.Geometry.CubicBezier?this.#z?this.#z.setBezier(this.#c):this.#z=new E({bezier:this.#c,container:this.#P,onBezierChange:this.#u}):this.#c instanceof x&&(this.#M?this.#M.setCSSLinearEasingModel(this.#c):this.#M=new T({model:this.#c,container:this.#T,onChange:this.#u})),this.draw()}draw(){this.#T.classList.toggle("hidden",!(this.#c instanceof x)),this.#P.classList.toggle("hidden",!(this.#c instanceof e.Geometry.CubicBezier)),this.#z&&this.#z.draw(),this.#M&&this.#M.draw()}}var L=Object.freeze({__proto__:null,PresetUI:z,AnimationTimingUI:M});const U=new CSSStyleSheet;U.replaceSync(":host{width:270px;height:350px;user-select:none;padding:16px;overflow:hidden}.bezier-preset-selected > svg{background-color:var(--legacy-selection-bg-color)}.bezier-container{--override-bezier-control-color:#9c27b0;display:flex;margin-top:38px;flex-shrink:0;z-index:2;background-image:radial-gradient(circle,var(--color-background-elevation-2) 1px,var(--color-background-inverted-opacity-0) 1px);background-size:17px 17px;background-position:-5px -10px}.-theme-with-dark-background .bezier-container,\n:host-context(.-theme-with-dark-background) .bezier-container{--override-bezier-control-color:rgb(196 79 216)}.bezier-preset{width:50px;height:50px;padding:5px;margin:auto;background-color:var(--color-background-elevation-1);border-radius:3px}.bezier-preset line.bezier-control-line{stroke:var(--color-text-secondary);stroke-width:1;stroke-linecap:round;fill:none}.bezier-preset circle.bezier-control-circle{fill:var(--color-text-secondary)}.bezier-preset path.bezier-path{stroke:var(--color-background-inverted);stroke-width:2;stroke-linecap:round;fill:none}.bezier-preset-selected path.bezier-path,\n.bezier-preset-selected line.bezier-control-line{stroke:var(--color-background)}.bezier-preset-selected circle.bezier-control-circle{fill:var(--color-background)}.bezier-curve line.linear-line{stroke:var(--color-background-elevation-2);stroke-width:2;stroke-linecap:round;fill:none}.bezier-curve line.bezier-control-line{stroke:var(--override-bezier-control-color);stroke-width:2;stroke-linecap:round;fill:none;opacity:60%}.bezier-curve circle.bezier-control-circle{fill:var(--override-bezier-control-color);cursor:pointer}.bezier-curve path.bezier-path{stroke:var(--color-background-inverted);stroke-width:3;stroke-linecap:round;fill:none}.bezier-curve path.bezier-path.linear-path{cursor:pointer}.bezier-preview-container{position:relative;background-color:var(--color-background);overflow:hidden;border-radius:20px;width:200%;height:20px;z-index:2;flex-shrink:0;opacity:0%}.bezier-preview-animation{background-color:#9c27b0;width:20px;height:20px;border-radius:20px;position:absolute}.bezier-preview-onion{margin-top:-20px;position:relative;z-index:1}.bezier-preview-onion > .bezier-preview-animation{opacity:10%}svg.bezier-preset-modify{background-color:var(--color-background-elevation-1);border-radius:35px;display:inline-block;visibility:hidden;transition:transform 100ms cubic-bezier(0.4,0,0.2,1);cursor:pointer;position:absolute}svg.bezier-preset-modify:hover,\n.bezier-preset:hover{background-color:var(--color-background-elevation-2)}.bezier-preset-selected .bezier-preset:hover{background-color:var(--legacy-selection-bg-color)}.bezier-preset-modify path{stroke-width:2;stroke:var(--color-background-inverted);fill:none}.bezier-presets{display:flex;flex-direction:column;justify-content:space-between}.bezier-preset-selected .bezier-preset-modify{opacity:100%}.bezier-preset-category{width:50px;cursor:pointer;transition:transform 100ms cubic-bezier(0.4,0,0.2,1)}span.bezier-display-value{width:100%;user-select:text;display:block;text-align:center;line-height:20px;min-height:20px;cursor:text}svg.bezier-curve{margin-left:32px;margin-top:-8px}svg.bezier-curve.linear{margin-top:42px;overflow:visible}svg.bezier-preset-modify.bezier-preset-plus{right:0}.bezier-header{margin-top:16px;z-index:1}svg.bezier-preset-modify:active{transform:scale(1.1);background-color:var(--legacy-selection-bg-color)}.bezier-preset-category:active{transform:scale(1.05)}.bezier-header-active > svg.bezier-preset-modify{visibility:visible}.bezier-preset-modify:active path{stroke:var(--color-background)}\n/*# sourceURL=bezierEditor.css */\n");class A extends(n.ObjectWrapper.eventMixin(e.Widget.VBox)){model;previewElement;previewOnion;outerContainer;selectedCategory;presetsContainer;presetUI;presetCategories;animationTimingUI;header;label;previewAnimation;debouncedStartPreviewAnimation;constructor(e){super(!0),this.model=e,this.contentElement.tabIndex=0,this.setDefaultFocusedElement(this.contentElement),this.element.style.overflowY="auto",this.previewElement=this.contentElement.createChild("div","bezier-preview-container"),this.previewElement.createChild("div","bezier-preview-animation"),this.previewElement.addEventListener("click",this.startPreviewAnimation.bind(this)),this.previewOnion=this.contentElement.createChild("div","bezier-preview-onion"),this.previewOnion.addEventListener("click",this.startPreviewAnimation.bind(this)),this.outerContainer=this.contentElement.createChild("div","bezier-container"),this.selectedCategory=null,this.presetsContainer=this.outerContainer.createChild("div","bezier-presets"),this.presetUI=new z,this.presetCategories=[];for(let e=0;e<R.length;e++){const t=this.createCategory(R[e]);t&&(this.presetCategories[e]=t,this.presetsContainer.appendChild(this.presetCategories[e].icon))}this.debouncedStartPreviewAnimation=n.Debouncer.debounce(this.startPreviewAnimation.bind(this),300),this.animationTimingUI=new M({model:this.model,onChange:e=>{this.setModel(e),this.onchange(),this.unselectPresets(),this.debouncedStartPreviewAnimation()}}),this.outerContainer.appendChild(this.animationTimingUI.element()),this.header=this.contentElement.createChild("div","bezier-header");const t=this.createPresetModifyIcon(this.header,"bezier-preset-minus","M 12 6 L 8 10 L 12 14"),i=this.createPresetModifyIcon(this.header,"bezier-preset-plus","M 8 6 L 12 10 L 8 14");t.addEventListener("click",this.presetModifyClicked.bind(this,!1)),i.addEventListener("click",this.presetModifyClicked.bind(this,!0)),this.label=this.header.createChild("span","source-code bezier-display-value")}setModel(e){this.model=e,this.animationTimingUI?.setModel(this.model),this.updateUI()}wasShown(){this.registerCSSFiles([U]),this.unselectPresets();for(const e of this.presetCategories)for(let t=0;t<e.presets.length;t++)this.model.asCSSText()===e.presets[t].value&&(e.presetIndex=t,this.presetCategorySelected(e));this.updateUI(),this.startPreviewAnimation()}onchange(){this.updateUI(),this.dispatchEventToListeners(F.BezierChanged,this.model.asCSSText())}updateUI(){const e=this.selectedCategory?this.selectedCategory.presets[this.selectedCategory.presetIndex].name:this.model.asCSSText().replace(/\s(-\d\.\d)/g,"$1");this.label.textContent=e,this.animationTimingUI?.draw()}createCategory(t){const i=w.parse(t[0].value);if(!i)return null;const n=document.createElement("div");n.classList.add("bezier-preset-category");const s=e.UIUtils.createSVGChild(n,"svg","bezier-preset monospace"),o={presets:t,presetIndex:0,icon:n};return this.presetUI.draw(i,s),s.addEventListener("click",this.presetCategorySelected.bind(this,o)),o}createPresetModifyIcon(t,i,n){const s=e.UIUtils.createSVGChild(t,"svg","bezier-preset-modify "+i);s.setAttribute("width","20"),s.setAttribute("height","20");return e.UIUtils.createSVGChild(s,"path").setAttribute("d",n),s}unselectPresets(){for(const e of this.presetCategories)e.icon.classList.remove("bezier-preset-selected");this.selectedCategory=null,this.header.classList.remove("bezier-header-active")}presetCategorySelected(e,t){if(this.selectedCategory===e)return;this.unselectPresets(),this.header.classList.add("bezier-header-active"),this.selectedCategory=e,this.selectedCategory.icon.classList.add("bezier-preset-selected");const i=w.parse(e.presets[e.presetIndex].value);i&&(this.setModel(i),this.onchange(),this.startPreviewAnimation()),t&&t.consume(!0)}presetModifyClicked(e,t){if(null===this.selectedCategory)return;const i=this.selectedCategory.presets.length;this.selectedCategory.presetIndex=(this.selectedCategory.presetIndex+(e?1:-1)+i)%i;const n=this.selectedCategory.presets[this.selectedCategory.presetIndex].value,s=w.parse(n);s&&(this.setModel(s),this.onchange(),this.startPreviewAnimation())}startPreviewAnimation(){this.previewOnion.removeChildren(),this.previewAnimation&&this.previewAnimation.cancel();const e=1600;this.previewAnimation=this.previewElement.animate([{offset:0,transform:"translateX(0px)",opacity:1},{offset:1,transform:"translateX(218px)",opacity:1}],{easing:this.model.asCSSText(),duration:e}),this.previewOnion.removeChildren();for(let t=0;t<=20;t++){const i=this.previewOnion.createChild("div","bezier-preview-animation").animate([{transform:"translateX(0px)",easing:this.model.asCSSText()},{transform:"translateX(218px)"}],{duration:e,fill:"forwards"});i.pause(),i.currentTime=e*t/20}}}var F;(F||(F={})).BezierChanged="BezierChanged";const R=[[{name:"linear",value:"linear"},{name:"elastic",value:"linear(0 0%, 0.22 2.1%, 0.86 6.5%, 1.11 8.6%, 1.3 10.7%, 1.35 11.8%, 1.37 12.9%, 1.37 13.7%, 1.36 14.5%, 1.32 16.2%, 1.03 21.8%, 0.94 24%, 0.89 25.9%, 0.88 26.85%, 0.87 27.8%, 0.87 29.25%, 0.88 30.7%, 0.91 32.4%, 0.98 36.4%, 1.01 38.3%, 1.04 40.5%, 1.05 42.7%, 1.05 44.1%, 1.04 45.7%, 1 53.3%, 0.99 55.4%, 0.98 57.5%, 0.99 60.7%, 1 68.1%, 1.01 72.2%, 1 86.7%, 1 100%)"},{name:"bounce",value:"linear(0 0%, 0 2.27%, 0.02 4.53%, 0.04 6.8%, 0.06 9.07%, 0.1 11.33%, 0.14 13.6%, 0.25 18.15%, 0.39 22.7%, 0.56 27.25%, 0.77 31.8%, 1 36.35%, 0.89 40.9%, 0.85 43.18%, 0.81 45.45%, 0.79 47.72%, 0.77 50%, 0.75 52.27%, 0.75 54.55%, 0.75 56.82%, 0.77 59.1%, 0.79 61.38%, 0.81 63.65%, 0.85 65.93%, 0.89 68.2%, 1 72.7%, 0.97 74.98%, 0.95 77.25%, 0.94 79.53%, 0.94 81.8%, 0.94 84.08%, 0.95 86.35%, 0.97 88.63%, 1 90.9%, 0.99 93.18%, 0.98 95.45%, 0.99 97.73%, 1 100%)"},{name:"emphasized",value:"linear(0 0%, 0 1.8%, 0.01 3.6%, 0.03 6.35%, 0.07 9.1%, 0.13 11.4%, 0.19 13.4%, 0.27 15%, 0.34 16.1%, 0.54 18.35%, 0.66 20.6%, 0.72 22.4%, 0.77 24.6%, 0.81 27.3%, 0.85 30.4%, 0.88 35.1%, 0.92 40.6%, 0.94 47.2%, 0.96 55%, 0.98 64%, 0.99 74.4%, 1 86.4%, 1 100%)"}],[{name:"ease-in-out",value:"ease-in-out"},{name:"In Out · Sine",value:"cubic-bezier(0.45, 0.05, 0.55, 0.95)"},{name:"In Out · Quadratic",value:"cubic-bezier(0.46, 0.03, 0.52, 0.96)"},{name:"In Out · Cubic",value:"cubic-bezier(0.65, 0.05, 0.36, 1)"},{name:"Fast Out, Slow In",value:"cubic-bezier(0.4, 0, 0.2, 1)"},{name:"In Out · Back",value:"cubic-bezier(0.68, -0.55, 0.27, 1.55)"}],[{name:"Fast Out, Linear In",value:"cubic-bezier(0.4, 0, 1, 1)"},{name:"ease-in",value:"ease-in"},{name:"In · Sine",value:"cubic-bezier(0.47, 0, 0.75, 0.72)"},{name:"In · Quadratic",value:"cubic-bezier(0.55, 0.09, 0.68, 0.53)"},{name:"In · Cubic",value:"cubic-bezier(0.55, 0.06, 0.68, 0.19)"},{name:"In · Back",value:"cubic-bezier(0.6, -0.28, 0.74, 0.05)"}],[{name:"ease-out",value:"ease-out"},{name:"Out · Sine",value:"cubic-bezier(0.39, 0.58, 0.57, 1)"},{name:"Out · Quadratic",value:"cubic-bezier(0.25, 0.46, 0.45, 0.94)"},{name:"Out · Cubic",value:"cubic-bezier(0.22, 0.61, 0.36, 1)"},{name:"Linear Out, Slow In",value:"cubic-bezier(0, 0, 0.2, 1)"},{name:"Out · Back",value:"cubic-bezier(0.18, 0.89, 0.32, 1.28)"}]];var B=Object.freeze({__proto__:null,BezierEditor:A,get Events(){return F},Presets:R});const N=t.css.cssLanguage.parser;function O(e,t){const i=[];for(;e.nextSibling()&&","!==e.name&&")"!==e.name;)if("ValueName"===e.name||"CallExpression"===e.name||"ColorLiteral"===e.name)i.push({name:"V",value:t.substring(e.from,e.to)});else{if("NumberLiteral"!==e.name)return null;{const n=t.substring(e.from,e.to);if(!n.includes("%"))return null;i.push({name:"P",value:n})}}return i}function D(e){const t=1===e.filter((e=>"V"===e.name)).length,i=e.filter((e=>"P"===e.name)).length<=1;return t&&i}class _{parts;constructor(e){this.parts=e}static parse(e){const t=`*{color:${e};}`,i=N.parse(t).cursorAt(t.indexOf(":")+1);for(;"ArgList"!==i.name&&i.next(!0););if("ArgList"!==i.name)return null;i.firstChild();const n=function(e,t){let i="";for(;e.nextSibling()&&","!==e.name;)i+=t.substring(e.from,e.to)+" ";return","!==e.name?null:{name:"IM",value:i.trimEnd()}}(i,t);if(!n)return null;const s=O(i,t);if(!s)return null;const o=O(i,t);return o&&n.value.startsWith("in")&&D(s)&&D(o)?new _([n,{name:"PA",value:s},{name:"PA",value:o}]):null}}var $=Object.freeze({__proto__:null,ColorMixModel:_});const V=new CSSStyleSheet;V.replaceSync(".swatch-icon{display:inline-grid;inline-size:15px;grid:[stack] 1fr/[stack] 1fr;margin-left:1px;margin-right:2px}.swatch{aspect-ratio:1/1;display:inline-block;width:10px;border-radius:1e5px;background:linear-gradient(var(--color),var(--color)),var(--image-file-checker);box-shadow:inset 0 0 0 .5px rgb(128 128 128/60%);grid-area:stack}.swatch-right{justify-self:end}.swatch-mix{box-shadow:none;justify-self:end;mask:radial-gradient(circle at 0% center,rgb(0 0 0) 50%,rgb(0 0 0/0%) calc(50% + 0.5px));-webkit-mask:radial-gradient(circle at 0% center,rgb(0 0 0) 50%,rgb(0 0 0/0%) calc(50% + 0.5px))}\n/*# sourceURL=colorMixSwatch.css */\n");class H extends HTMLElement{static litTagName=o.literal`devtools-color-mix-swatch`;shadow=this.attachShadow({mode:"open"});colorMixText="";firstColorText="";secondColorText="";constructor(){super(),this.shadow.adoptedStyleSheets=[V]}setFirstColor(e){this.firstColorText&&(this.colorMixText=this.colorMixText.replace(this.firstColorText,e)),this.firstColorText=e,this.#L()}setSecondColor(e){this.secondColorText&&(this.colorMixText=i.StringUtilities.replaceLast(this.colorMixText,this.secondColorText,e)),this.secondColorText=e,this.#L()}setColorMixText(e){this.colorMixText=e,this.#L()}#L(){this.colorMixText&&this.firstColorText&&this.secondColorText?o.render(o.html`<div class="swatch-icon"> <span class="swatch swatch-left" id="swatch-1" style="--color: ${this.firstColorText}"></span> <span class="swatch swatch-right" id="swatch-2" style="--color: ${this.secondColorText}"></span> <span class="swatch swatch-mix" id="mix-result" style="--color: ${this.colorMixText}"></span> </div><slot>${this.colorMixText}</slot>`,this.shadow,{host:this}):o.render(this.colorMixText,this.shadow,{host:this})}}s.CustomElements.defineComponent("devtools-color-mix-swatch",H);var j=Object.freeze({__proto__:null,ColorMixSwatch:H});const G=new CSSStyleSheet;G.replaceSync(":host{white-space:nowrap}.color-swatch{position:relative;margin-left:1px;margin-right:2px;width:12px;height:12px;transform:scale(0.8);vertical-align:-2px;display:inline-block;user-select:none;background-image:var(--image-file-checker);line-height:10px}.color-swatch-inner{width:100%;height:100%;display:inline-block;border:1px solid rgb(128 128 128/60%);box-sizing:border-box;cursor:pointer}.color-swatch:not(.read-only) .color-swatch-inner:hover{border:1px solid rgb(64 64 64/80%)}@media (forced-colors: active){.color-swatch{forced-color-adjust:none}}\n/*# sourceURL=colorSwatch.css */\n");const X={shiftclickToChangeColorFormat:"Shift-click to change color format"},Y=a.i18n.registerUIStrings("ui/legacy/components/inline_editor/ColorSwatch.ts",X),W=a.i18n.getLocalizedString.bind(void 0,Y);class K extends Event{static eventName="colorchanged";data;constructor(e){super(K.eventName,{}),this.data={text:e}}}class q extends Event{static eventName="swatchclick";constructor(){super(q.eventName,{})}}class Z extends HTMLElement{static litTagName=o.literal`devtools-color-swatch`;shadow=this.attachShadow({mode:"open"});tooltip=W(X.shiftclickToChangeColorFormat);text=null;color=null;format=null;constructor(){super(),this.shadow.adoptedStyleSheets=[G]}static isColorSwatch(e){return"devtools-color-swatch"===e.localName}getColor(){return this.color}getFormat(){return this.format}getText(){return this.text}get anchorBox(){const e=this.shadow.querySelector(".color-swatch");return e?e.boxInWindow():null}renderColor(e,t,i){if("string"==typeof e){if(this.color=n.Color.parse(e),this.text=e,!this.color)return void this.renderTextOnly()}else this.color=e;this.format="boolean"==typeof t&&t?n.Settings.detectColorFormat(this.color):"string"==typeof t?n.Color.getFormat(t):this.color.format(),this.text=this.color.getAuthoredText()??this.color.asString(this.format??void 0),i&&(this.tooltip=i),this.render()}renderTextOnly(){o.render(this.text,this.shadow,{host:this})}render(){o.render(o.html`<span class="color-swatch" title="${this.tooltip}"><span class="color-swatch-inner" style="background-color: ${this.text};" @click="${this.onClick}" @mousedown="${this.consume}" @dblclick="${this.consume}"></span></span><slot><span>${this.text}</span></slot>`,this.shadow,{host:this})}onClick(e){if(e.shiftKey)return e.stopPropagation(),void this.showFormatPicker(e);this.dispatchEvent(new q)}consume(e){e.stopPropagation()}setFormat(e){const t=this.color?.as(e),i=t?.asString();t&&i&&(this.color=t,this.format=this.color.format(),this.text=i,this.render(),this.dispatchEvent(new K(this.text)))}showFormatPicker(e){if(!this.color||!this.format)return;new l.FormatPickerContextMenu.FormatPickerContextMenu(this.color,this.format).show(e,(e=>{this.setFormat(e),r.userMetrics.colorConvertedFrom(0)}))}}s.CustomElements.defineComponent("devtools-color-swatch",Z);var Q=Object.freeze({__proto__:null,ColorChangedEvent:K,ClickEvent:q,ColorSwatch:Z});const J=new CSSStyleSheet;J.replaceSync(".css-angle{display:inline-block;position:relative;outline:none}devtools-css-angle-swatch{display:inline-block;margin-right:2px;user-select:none}devtools-css-angle-editor{--override-dial-color:#a3a3a3;position:fixed;z-index:2}.preview{display:inline-block}\n/*# sourceURL=cssAngle.css */\n");const ee=/(?<value>[+-]?\d*\.?\d+)(?<unit>deg|grad|rad|turn)/,te=e=>{const t=e.match(ee);return t&&t.groups?{value:Number(t.groups.value),unit:t.groups.unit}:null},ie=(t,i)=>{let n=t;switch(i){case"grad":n=e.Geometry.radiansToGradians(t);break;case"deg":n=e.Geometry.radiansToDegrees(t);break;case"turn":n=e.Geometry.radiansToTurns(t)}return{value:n,unit:i}},ne=t=>{switch(t.unit){case"deg":return e.Geometry.degreesToRadians(t.value);case"grad":return e.Geometry.gradiansToRadians(t.value);case"turn":return e.Geometry.turnsToRadians(t.value)}return t.value},se=(e,t)=>{const i=ne(e);return{translateX:Math.sin(i)*t,translateY:-Math.cos(i)*t}},oe=e=>{let t=e.value;switch(e.unit){case"deg":case"grad":t=Math.round(e.value);break;case"rad":t=Math.round(1e4*e.value)/1e4;break;case"turn":t=Math.round(100*e.value)/100;break;default:i.assertNever(e.unit,`Unknown angle unit: ${e.unit}`)}return{value:t,unit:e.unit}},re=e=>{switch(e){case"deg":return"grad";case"grad":return"rad";case"rad":return"turn";default:return"deg"}},ae=(e,t)=>{if(e.unit===t)return e;const i=ne(e);return ie(i,t)},le=(t,i)=>{const n=e.UIUtils.getValueModificationDirection(i);if(null===n)return;let s="Up"===n?Math.PI/180:-Math.PI/180;i.shiftKey&&(s*=10);const o=ne(t);return ie(o+s,t.unit)};var he=Object.freeze({__proto__:null,CSSAngleRegex:ee,parseText:te,getAngleFromRadians:ie,getRadiansFromAngle:ne,get2DTranslationsForAngle:se,roundAngleByUnit:oe,getNextUnit:re,convertAngleUnit:ae,getNewAngleFromEvent:le});class de extends Event{static eventName="valuechanged";data;constructor(e){super(de.eventName,{}),this.data={value:e}}}var ce=Object.freeze({__proto__:null,ValueChangedEvent:de});const ue=new CSSStyleSheet;ue.replaceSync('.editor.interacting::before{content:"";position:fixed;inset:0}.clock,\n.pointer,\n.center,\n.hand,\n.dial{position:absolute}.clock{top:6px;width:6em;height:6em;background-color:var(--color-background);border:0.5em solid var(--color-background-elevation-1);border-radius:9em;box-shadow:var(--drop-shadow),inset 0 0 15px var(--box-shadow-outline-color);transform:translateX(-3em)}.center,\n.hand{box-shadow:0 0 2px var(--box-shadow-outline-color)}.pointer{margin:auto;top:0;left:-0.4em;right:0;width:0;height:0;border-style:solid;border-width:0 0.9em 0.9em;border-color:transparent transparent var(--color-background-elevation-1) transparent}.center,\n.hand,\n.dial{margin:auto;top:0;left:0;right:0;bottom:0}.center{width:0.7em;height:0.7em;border-radius:10px}.dial{width:2px;height:var(--clock-dial-length);background-color:var(--override-dial-color);border-radius:1px}.hand{height:50%;width:0.3em;background:var(--legacy-accent-fg-color)}.hand::before{content:"";display:inline-block;position:absolute;top:-0.6em;left:-0.35em;width:1em;height:1em;border-radius:50%;cursor:pointer;box-shadow:0 0 5px var(--box-shadow-outline-color)}.hand::before,\n.center{background-color:var(--legacy-accent-fg-color)}:host-context(.-theme-with-dark-background) .hand::before{box-shadow:0 0 5px hsl(0deg 0% 0%/80%)}:host-context(.-theme-with-dark-background) .center,\n:host-context(.-theme-with-dark-background) .hand{box-shadow:0 0 2px hsl(0deg 0% 0%/60%)}:host-context(.-theme-with-dark-background) .clock{background-color:hsl(225deg 5% 27%)}\n/*# sourceURL=cssAngleEditor.css */\n');const{render:pe,html:me}=o,ge=o.Directives.styleMap;class ve extends HTMLElement{static litTagName=o.literal`devtools-css-angle-editor`;shadow=this.attachShadow({mode:"open"});angle={value:0,unit:"rad"};onAngleUpdate;background="";clockRadius=38.5;dialTemplates;mousemoveThrottler=new n.Throttler.Throttler(16.67);mousemoveListener=this.onMousemove.bind(this);connectedCallback(){this.shadow.adoptedStyleSheets=[ue],s.SetCSSProperty.set(this,"--clock-dial-length","6px")}set data(e){this.angle=e.angle,this.onAngleUpdate=e.onAngleUpdate,this.background=e.background,this.render()}updateAngleFromMousePosition(e,t,i){const n=this.shadow.querySelector(".clock");if(!n||!this.onAngleUpdate)return;const{top:s,right:o,bottom:r,left:a}=n.getBoundingClientRect();this.clockRadius=(o-a)/2;const l=(a+o)/2,h=(r+s)/2,d=-Math.atan2(e-l,t-h)+Math.PI;if(i){const e=ne({value:15,unit:"deg"}),t=Math.round(d/e)*e;this.onAngleUpdate(ie(t,this.angle.unit))}else this.onAngleUpdate(ie(d,this.angle.unit))}onEditorMousedown(e){e.stopPropagation(),this.updateAngleFromMousePosition(e.pageX,e.pageY,e.shiftKey);const t=e.target instanceof Node&&e.target.ownerDocument,i=this.shadow.querySelector(".editor");t&&i&&(t.addEventListener("mousemove",this.mousemoveListener,{capture:!0}),i.classList.add("interacting"),t.addEventListener("mouseup",(()=>{t.removeEventListener("mousemove",this.mousemoveListener,{capture:!0}),i.classList.remove("interacting")}),{once:!0}))}onMousemove(e){1===e.buttons&&(e.preventDefault(),this.mousemoveThrottler.schedule((()=>(this.updateAngleFromMousePosition(e.pageX,e.pageY,e.shiftKey),Promise.resolve()))))}onEditorWheel(e){if(!this.onAngleUpdate)return;const t=le(this.angle,e);t&&this.onAngleUpdate(t),e.preventDefault()}render(){const e={background:this.background},{translateX:t,translateY:i}=se(this.angle,this.clockRadius/2),n={transform:`translate(${t}px, ${i}px) rotate(${this.angle.value}${this.angle.unit})`};pe(me` <div class="editor"> <span class="pointer"></span> <div class="clock" style="${ge(e)}" @mousedown="${this.onEditorMousedown}" @wheel="${this.onEditorWheel}"> ${this.renderDials()} <div class="hand" style="${ge(n)}"></div> <span class="center"></span> </div> </div> `,this.shadow,{host:this})}renderDials(){return this.dialTemplates||(this.dialTemplates=[0,45,90,135,180,225,270,315].map((e=>{const t=this.clockRadius-6-3,{translateX:i,translateY:n}=se({value:e,unit:"deg"},t);return me`<span class="dial" style="${ge({transform:`translate(${i}px, ${n}px) rotate(${e}deg)`})}"></span>`}))),this.dialTemplates}}s.CustomElements.defineComponent("devtools-css-angle-editor",ve);const fe=new CSSStyleSheet;fe.replaceSync(".swatch{position:relative;display:inline-block;margin-bottom:-2px;width:1em;height:1em;border:1px solid var(--legacy-selection-inactive-fg-color);border-radius:50%;overflow:hidden;cursor:pointer;background-color:var(--color-background-elevation-1)}.mini-hand{position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;height:55%;width:2px;background-color:var(--legacy-accent-fg-color);border-radius:5px}\n/*# sourceURL=cssAngleSwatch.css */\n");const{render:xe,html:be}=o,we=o.Directives.styleMap;class Se extends HTMLElement{static litTagName=o.literal`devtools-css-angle-swatch`;shadow=this.attachShadow({mode:"open"});angle={value:0,unit:"rad"};connectedCallback(){this.shadow.adoptedStyleSheets=[fe]}set data(e){this.angle=e.angle,this.render()}render(){const{translateX:e,translateY:t}=se(this.angle,2.75),i={transform:`translate(${e}px, ${t}px) rotate(${this.angle.value}${this.angle.unit})`};xe(be` <div class="swatch"> <span class="mini-hand" style="${we(i)}"></span> </div> `,this.shadow,{host:this})}}s.CustomElements.defineComponent("devtools-css-angle-swatch",Se);const{render:ye,html:Ce}=o,Ie=o.Directives.styleMap,ke=new Set(["color","background","background-color"]);class Ee extends Event{static eventName="popovertoggled";data;constructor(e){super(Ee.eventName,{}),this.data={open:e}}}class Pe extends Event{static eventName="unitchanged";data;constructor(e){super(Pe.eventName,{}),this.data={value:e}}}const Te={value:0,unit:"rad"};class ze extends HTMLElement{static litTagName=o.literal`devtools-css-angle`;shadow=this.attachShadow({mode:"open"});angle=Te;displayedAngle=Te;propertyName="";propertyValue="";containingPane;angleElement=null;swatchElement=null;popoverOpen=!1;popoverStyleTop="";popoverStyleLeft="";onMinifyingAction=this.minify.bind(this);connectedCallback(){this.shadow.adoptedStyleSheets=[J]}set data(e){const t=te(e.angleText);t&&(this.angle=t,this.displayedAngle={...t},this.propertyName=e.propertyName,this.propertyValue=e.propertyValue,this.containingPane=e.containingPane,this.render())}disconnectedCallback(){this.unbindMinifyingAction()}popover(){if(!this.containingPane)return;if(this.angleElement||(this.angleElement=this.shadow.querySelector(".css-angle")),this.swatchElement||(this.swatchElement=this.shadow.querySelector("devtools-css-angle-swatch")),!this.angleElement||!this.swatchElement)return;this.dispatchEvent(new Ee(!0)),this.bindMinifyingAction();const e=this.swatchElement.getBoundingClientRect().bottom,t=this.swatchElement.getBoundingClientRect().left;if(e&&t){const i=this.containingPane.getBoundingClientRect().top,n=this.containingPane.getBoundingClientRect().left;this.popoverStyleTop=e-i+"px",this.popoverStyleLeft=t-n+"px"}this.popoverOpen=!0,this.render(),this.angleElement.focus()}minify(){!1!==this.popoverOpen&&(this.popoverOpen=!1,this.dispatchEvent(new Ee(!1)),this.unbindMinifyingAction(),this.render())}updateProperty(e,t){this.propertyName=e,this.propertyValue=t,this.render()}updateAngle(e){this.displayedAngle=oe(ae(e,this.displayedAngle.unit)),this.angle=this.displayedAngle,this.dispatchEvent(new de(`${this.angle.value}${this.angle.unit}`))}displayNextUnit(){const e=re(this.displayedAngle.unit);this.displayedAngle=oe(ae(this.angle,e)),this.dispatchEvent(new Pe(`${this.displayedAngle.value}${this.displayedAngle.unit}`))}bindMinifyingAction(){document.addEventListener("mousedown",this.onMinifyingAction),this.containingPane&&this.containingPane.addEventListener("scroll",this.onMinifyingAction)}unbindMinifyingAction(){document.removeEventListener("mousedown",this.onMinifyingAction),this.containingPane&&this.containingPane.removeEventListener("scroll",this.onMinifyingAction)}onMiniIconClick(e){e.stopPropagation(),!e.shiftKey||this.popoverOpen?this.popoverOpen?this.minify():this.popover():this.displayNextUnit()}consume(e){e.stopPropagation()}onKeydown(e){if(this.popoverOpen)switch(e.key){case"Escape":e.stopPropagation(),this.minify(),this.blur();break;case"ArrowUp":case"ArrowDown":{const t=le(this.angle,e);t&&this.updateAngle(t),e.preventDefault();break}}}render(){ye(Ce` <div class="css-angle" @keydown="${this.onKeydown}" tabindex="-1"> <div class="preview"> <${Se.litTagName} @click="${this.onMiniIconClick}" @mousedown="${this.consume}" @dblclick="${this.consume}" .data="${{angle:this.angle}}"> </${Se.litTagName}><slot></slot></div> ${this.popoverOpen?this.renderPopover():null} </div> `,this.shadow,{host:this})}renderPopover(){let e="";return ke.has(this.propertyName)&&!this.propertyValue.match(/url\(.*\)/i)&&(e=this.propertyValue),Ce` <${ve.litTagName} class="popover popover-css-angle" style="${Ie({top:this.popoverStyleTop,left:this.popoverStyleLeft})}" .data="${{angle:this.angle,onAngleUpdate:e=>{this.updateAngle(e)},background:e}}"></${ve.litTagName}> `}}s.CustomElements.defineComponent("devtools-css-angle",ze);var Me=Object.freeze({__proto__:null,PopoverToggledEvent:Ee,UnitChangedEvent:Pe,CSSAngle:ze});const Le=t.css.cssLanguage.parser,Ue=new Map(Object.entries({normal:"D",alternate:"D",reverse:"D","alternate-reverse":"D",none:"F",forwards:"F",backwards:"F",both:"F",running:"P",paused:"P",infinite:"I",linear:"E",ease:"E","ease-in":"E","ease-out":"E","ease-in-out":"E"}));class Ae{parts;constructor(e){this.parts=e}static parse(t,i){const n=function(e){const t=`*{animation:${e};}`,i=Le.parse(t).cursorAt(t.indexOf(":")+1);i.firstChild(),i.nextSibling();const n=[];for(;i.nextSibling();)n.push(t.substring(i.from,i.to));return n}(t);let s=0;const o=[],r={E:!1,I:!1,D:!1,F:!1,P:!1};for(const t of n){const n=Ue.get(t),a=n&&!r[n];let l="T";if(t.match(e.Geometry.CubicBezier.Regex)&&!r.E?l="EF":t.match(h.CSSMetadata.VariableRegex)?l="V":t!==i[s]||a||(l="AN"),o.push({type:l,value:t}),n&&(r[n]=!0),","===t){for(const e of Object.keys(r))r[e]=!1;s++}}return new Ae(o)}}var Fe=Object.freeze({__proto__:null,CSSAnimationModel:Ae});const Re=new CSSStyleSheet;Re.replaceSync('.css-length{display:inline-block;position:relative;outline:none}.css-length.overloaded{text-decoration:line-through}.value{cursor:ew-resize}.unit-dropdown{display:none}.unit-dropdown select{all:unset;cursor:pointer;opacity:0%;width:0.8em;background-color:var(--color-background)}.icon{position:absolute;display:inline-block;-webkit-mask-image:var(--image-file-chevron-down);-webkit-mask-repeat:no-repeat;background-color:var(--icon-default);transform:scale(0.7);margin-left:-7px;margin-top:-3px;content:"";height:2em;width:2em}:host(:not(:last-child)){margin-right:0.1em}:host(:not(:last-child)) .unit-dropdown{position:absolute}.css-length:hover .unit-dropdown{display:inline-block}:host(:last-child) .unit-dropdown select{width:0.6em}\n/*# sourceURL=cssLength.css */\n');const Be=["px","cm","mm","in","pc","pt","ch","em","rem","vh","vw","vmin","vmax"],Ne=new RegExp(`(?<value>[+-]?\\d*\\.?\\d+)(?<unit>${Be.join("|")})`),Oe=e=>{const t=e.match(Ne);return t&&t.groups?{value:Number(t.groups.value),unit:t.groups.unit}:null};var De=Object.freeze({__proto__:null,LENGTH_UNITS:Be,CSSLengthRegex:Ne,parseText:Oe});const{render:_e,html:$e,Directives:{classMap:Ve}}=o;class He extends Event{static eventName="draggingfinished";constructor(){super(He.eventName,{})}}const je={value:0,unit:"px"};class Ge extends HTMLElement{static litTagName=o.literal`devtools-css-length`;shadow=this.attachShadow({mode:"open"});onDraggingValue=this.dragValue.bind(this);length=je;overloaded=!1;isEditingSlot=!1;isDraggingValue=!1;currentMouseClientX=0;#U=0;set data(e){const t=Oe(e.lengthText);t&&(this.length=t,this.overloaded=e.overloaded,this.render())}connectedCallback(){this.shadow.adoptedStyleSheets=[Re]}onUnitChange(e){this.length.unit=e.target.value,this.dispatchEvent(new de(`${this.length.value}${this.length.unit}`)),this.dispatchEvent(new He),this.render()}dragValue(e){if(e.preventDefault(),e.stopPropagation(),Date.now()-this.#U<=300)return;this.isDraggingValue=!0;let t=e.clientX-this.currentMouseClientX;this.currentMouseClientX=e.clientX,e.shiftKey&&(t*=10),e.altKey&&(t*=.1),this.length.value=this.length.value+t,this.dispatchEvent(new de(`${this.length.value}${this.length.unit}`)),this.render()}onValueMousedown(e){if(0!==e.button)return;this.#U=Date.now(),this.currentMouseClientX=e.clientX;const t=e.target instanceof Node&&e.target.ownerDocument;t&&(t.addEventListener("mousemove",this.onDraggingValue,{capture:!0}),t.addEventListener("mouseup",(e=>{t.removeEventListener("mousemove",this.onDraggingValue,{capture:!0}),this.isDraggingValue&&(e.preventDefault(),e.stopPropagation(),this.isDraggingValue=!1,this.dispatchEvent(new He))}),{once:!0,capture:!0}))}onValueMouseup(){this.isDraggingValue||(this.isEditingSlot=!0,this.render())}onUnitMouseup(e){e.preventDefault(),e.stopPropagation(),r.userMetrics.swatchActivated(8)}render(){const e={"css-length":!0,overloaded:this.overloaded};_e($e` <div class="${Ve(e)}"> ${this.renderContent()} </div> `,this.shadow,{host:this})}renderContent(){if(this.isEditingSlot)return $e`<slot></slot>`;const e=Be.map((e=>$e` <option value="${e}" .selected="${this.length.unit===e}">${e}</option> `));return $e` <span class="value" @mousedown="${this.onValueMousedown}" @mouseup="${this.onValueMouseup}">${this.length.value}</span><span class="unit">${this.length.unit}</span><div class="unit-dropdown"> <span class="icon"></span> <select @mouseup="${this.onUnitMouseup}" @change="${this.onUnitChange}"> ${e} </select> </div> `}}s.CustomElements.defineComponent("devtools-css-length",Ge);var Xe=Object.freeze({__proto__:null,DraggingFinishedEvent:He,CSSLength:Ge});class Ye{isBoxShadowInternal;insetInternal;offsetXInternal;offsetYInternal;blurRadiusInternal;spreadRadiusInternal;colorInternal;format;important;constructor(e){this.isBoxShadowInternal=e,this.insetInternal=!1,this.offsetXInternal=We.zero(),this.offsetYInternal=We.zero(),this.blurRadiusInternal=We.zero(),this.spreadRadiusInternal=We.zero(),this.colorInternal=n.Color.parse("black"),this.format=["X","Y"],this.important=!1}static parseTextShadow(e){return Ye.parseShadow(e,!1)}static parseBoxShadow(e){return Ye.parseShadow(e,!0)}static parseShadow(e,t){const i=[],s=d.TextUtils.Utils.splitStringByRegexes(e,[n.Color.Regex,/,/g]);let o=0;for(let t=0;t<s.length;t++)if(1===s[t].regexIndex){const n=s[t];i.push(e.substring(o,n.position)),o=n.position+1}i.push(e.substring(o,e.length));const r=[];for(let e=0;e<i.length;e++){const s=new Ye(t);s.format=[];let o=!0;const l=[/!important/gi,/inset/gi,n.Color.Regex,We.Regex],h=d.TextUtils.Utils.splitStringByRegexes(i[e],l);for(let e=0;e<h.length;e++){const t=h[e];if(-1===t.regexIndex){if(/\S/.test(t.value))return[];o=!0}else{if(!o)return[];if(o=!1,0===t.regexIndex)s.important=!0,s.format.push("M");else if(1===t.regexIndex)s.insetInternal=!0,s.format.push("I");else if(2===t.regexIndex){const e=n.Color.parse(t.value);if(!e)return[];s.colorInternal=e,s.format.push("C")}else if(3===t.regexIndex){const e=We.parse(t.value);if(!e)return[];const i=s.format.length>0?s.format[s.format.length-1]:"";"X"===i?(s.offsetYInternal=e,s.format.push("Y")):"Y"===i?(s.blurRadiusInternal=e,s.format.push("B")):"B"===i?(s.spreadRadiusInternal=e,s.format.push("S")):(s.offsetXInternal=e,s.format.push("X"))}}}if(a(s,"X",1,1)||a(s,"Y",1,1)||a(s,"C",0,1)||a(s,"B",0,1)||a(s,"I",0,t?1:0)||a(s,"S",0,t?1:0)||a(s,"M",0,1))return[];r.push(s)}return r;function a(e,t,i,n){let s=0;for(let i=0;i<e.format.length;i++)e.format[i]===t&&s++;return s<i||s>n}}setInset(e){this.insetInternal=e,-1===this.format.indexOf("I")&&this.format.unshift("I")}setOffsetX(e){this.offsetXInternal=e}setOffsetY(e){this.offsetYInternal=e}setBlurRadius(e){if(this.blurRadiusInternal=e,-1===this.format.indexOf("B")){const e=this.format.indexOf("Y");this.format.splice(e+1,0,"B")}}setSpreadRadius(e){if(this.spreadRadiusInternal=e,-1===this.format.indexOf("S")){this.setBlurRadius(this.blurRadiusInternal);const e=this.format.indexOf("B");this.format.splice(e+1,0,"S")}}setColor(e){this.colorInternal=e,-1===this.format.indexOf("C")&&this.format.push("C")}isBoxShadow(){return this.isBoxShadowInternal}inset(){return this.insetInternal}offsetX(){return this.offsetXInternal}offsetY(){return this.offsetYInternal}blurRadius(){return this.blurRadiusInternal}spreadRadius(){return this.spreadRadiusInternal}color(){return this.colorInternal}asCSSText(){const e=[];for(let t=0;t<this.format.length;t++){const i=this.format[t];"I"===i&&this.insetInternal?e.push("inset"):"X"===i?e.push(this.offsetXInternal.asCSSText()):"Y"===i?e.push(this.offsetYInternal.asCSSText()):"B"===i?e.push(this.blurRadiusInternal.asCSSText()):"S"===i?e.push(this.spreadRadiusInternal.asCSSText()):"C"===i?e.push(this.colorInternal.getAuthoredText()??this.colorInternal.asString()):"M"===i&&this.important&&e.push("!important")}return e.join(" ")}}class We{amount;unit;constructor(e,t){this.amount=e,this.unit=t}static parse(e){const t=new RegExp("^(?:"+We.Regex.source+")$","i"),i=e.match(t);return i?i.length>2&&i[2]?new We(parseFloat(i[1]),i[2]):We.zero():null}static zero(){return new We(0,"")}asCSSText(){return this.amount+this.unit}static Regex=function(){return new RegExp("([+-]?(?:[0-9]*[.])?[0-9]+(?:[eE][+-]?[0-9]+)?)(ch|cm|em|ex|in|mm|pc|pt|px|rem|vh|vmax|vmin|vw)|[+-]?(?:0*[.])?0+(?:[eE][+-]?[0-9]+)?","gi")}()}var Ke=Object.freeze({__proto__:null,CSSShadowModel:Ye,CSSLength:We});const qe=new CSSStyleSheet;qe.replaceSync(":host{user-select:none;padding:4px 12px 12px;border:1px solid transparent}.shadow-editor-field{height:24px;margin-top:8px;font-size:12px;flex-shrink:0}.shadow-editor-field:last-of-type{margin-bottom:8px}.shadow-editor-flex-field{display:flex;align-items:center;flex-direction:row}.shadow-editor-field.shadow-editor-blur-field{margin-top:40px}.shadow-editor-2D-slider{position:absolute;height:88px;width:88px;border:1px solid var(--divider-line);border-radius:2px}.shadow-editor-label{display:inline-block;width:52px;height:24px;line-height:24px;margin-right:8px;text-align:right}.shadow-editor-button-left,\n.shadow-editor-button-right{width:74px;height:24px;padding:3px 7px;line-height:16px;border:1px solid var(--divider-line);color:var(--color-text-primary);background-color:var(--color-background);text-align:center;font-weight:500}.shadow-editor-button-left{border-radius:2px 0 0 2px}.shadow-editor-button-right{border-radius:0 2px 2px 0;border-left-width:0}.shadow-editor-button-left:hover,\n.shadow-editor-button-right:hover{box-shadow:0 1px 1px var(--color-background-elevation-1)}.shadow-editor-button-left:focus,\n.shadow-editor-button-right:focus{background-color:var(--color-background-elevation-1)}.shadow-editor-button-left.enabled,\n.shadow-editor-button-right.enabled{--override-button-text-color:#fff;background-color:var(--color-primary-old);color:var(--override-button-text-color)}.shadow-editor-button-left.enabled:focus,\n.shadow-editor-button-right.enabled:focus{background-color:var(--color-primary-variant)}.shadow-editor-text-input{width:52px;margin-right:8px;text-align:right;box-shadow:var(--legacy-focus-ring-inactive-shadow)}@media (forced-colors: active){.shadow-editor-button-left:hover,\n  .shadow-editor-button-left.enabled:focus,\n  .shadow-editor-button-right:hover .shadow-editor-button-left.enabled,\n  .shadow-editor-button-right.enabled,\n  .shadow-editor-button-right.enabled:focus{forced-color-adjust:none;background-color:Highlight;color:HighlightText}}\n/*# sourceURL=cssShadowEditor.css */\n");const Ze={type:"Type",xOffset:"X offset",yOffset:"Y offset",blur:"Blur",spread:"Spread"},Qe=a.i18n.registerUIStrings("ui/legacy/components/inline_editor/CSSShadowEditor.ts",Ze),Je=a.i18n.getLocalizedString.bind(void 0,Qe);class et extends(n.ObjectWrapper.eventMixin(e.Widget.VBox)){typeField;outsetButton;insetButton;xInput;yInput;xySlider;halfCanvasSize;innerCanvasSize;blurInput;blurSlider;spreadField;spreadInput;spreadSlider;model;canvasOrigin;changedElement;constructor(){super(!0),this.contentElement.tabIndex=0,this.setDefaultFocusedElement(this.contentElement),this.typeField=this.contentElement.createChild("div","shadow-editor-field shadow-editor-flex-field"),this.typeField.createChild("label","shadow-editor-label").textContent=Je(Ze.type),this.outsetButton=this.typeField.createChild("button","shadow-editor-button-left"),this.outsetButton.textContent=a.i18n.lockedString("Outset"),this.outsetButton.addEventListener("click",this.onButtonClick.bind(this),!1),this.insetButton=this.typeField.createChild("button","shadow-editor-button-right"),this.insetButton.textContent=a.i18n.lockedString("Inset"),this.insetButton.addEventListener("click",this.onButtonClick.bind(this),!1);const t=this.contentElement.createChild("div","shadow-editor-field");this.xInput=this.createTextInput(t,Je(Ze.xOffset));const i=this.contentElement.createChild("div","shadow-editor-field");this.yInput=this.createTextInput(i,Je(Ze.yOffset)),this.xySlider=t.createChild("canvas","shadow-editor-2D-slider"),this.xySlider.width=88,this.xySlider.height=88,this.xySlider.tabIndex=-1,this.halfCanvasSize=44,this.innerCanvasSize=this.halfCanvasSize-6,e.UIUtils.installDragHandle(this.xySlider,this.dragStart.bind(this),this.dragMove.bind(this),null,"default"),this.xySlider.addEventListener("keydown",this.onCanvasArrowKey.bind(this),!1),this.xySlider.addEventListener("blur",this.onCanvasBlur.bind(this),!1);const n=this.contentElement.createChild("div","shadow-editor-field shadow-editor-flex-field shadow-editor-blur-field");this.blurInput=this.createTextInput(n,Je(Ze.blur)),this.blurSlider=this.createSlider(n),this.spreadField=this.contentElement.createChild("div","shadow-editor-field shadow-editor-flex-field"),this.spreadInput=this.createTextInput(this.spreadField,Je(Ze.spread)),this.spreadSlider=this.createSlider(this.spreadField)}createTextInput(t,i){const n=t.createChild("label","shadow-editor-label");n.textContent=i,n.setAttribute("for",i);const s=e.UIUtils.createInput("shadow-editor-text-input","text");return t.appendChild(s),s.id=i,s.addEventListener("keydown",this.handleValueModification.bind(this),!1),s.addEventListener("wheel",this.handleValueModification.bind(this),!1),s.addEventListener("input",this.onTextInput.bind(this),!1),s.addEventListener("blur",this.onTextBlur.bind(this),!1),s}createSlider(t){const i=e.UIUtils.createSlider(0,20,-1);return i.addEventListener("input",this.onSliderInput.bind(this),!1),t.appendChild(i),i}wasShown(){this.registerCSSFiles([qe]),this.updateUI()}setModel(e){this.model=e,this.typeField.classList.toggle("hidden",!e.isBoxShadow()),this.spreadField.classList.toggle("hidden",!e.isBoxShadow()),this.updateUI()}updateUI(){this.updateButtons(),this.xInput.value=this.model.offsetX().asCSSText(),this.yInput.value=this.model.offsetY().asCSSText(),this.blurInput.value=this.model.blurRadius().asCSSText(),this.spreadInput.value=this.model.spreadRadius().asCSSText(),this.blurSlider.value=this.model.blurRadius().amount.toString(),this.spreadSlider.value=this.model.spreadRadius().amount.toString(),this.updateCanvas(!1)}updateButtons(){this.insetButton.classList.toggle("enabled",this.model.inset()),this.outsetButton.classList.toggle("enabled",!this.model.inset())}updateCanvas(e){const t=this.xySlider.getContext("2d");if(!t)throw new Error("Unable to obtain canvas context");t.clearRect(0,0,this.xySlider.width,this.xySlider.height),t.save(),t.setLineDash([1,1]),t.strokeStyle="rgba(210, 210, 210, 0.8)",t.beginPath(),t.moveTo(this.halfCanvasSize,0),t.lineTo(this.halfCanvasSize,88),t.moveTo(0,this.halfCanvasSize),t.lineTo(88,this.halfCanvasSize),t.stroke(),t.restore();const i=this.sliderThumbPosition();t.save(),t.translate(this.halfCanvasSize,this.halfCanvasSize),t.lineWidth=2,t.strokeStyle="rgba(130, 130, 130, 0.75)",t.beginPath(),t.moveTo(0,0),t.lineTo(i.x,i.y),t.stroke(),e&&(t.beginPath(),t.fillStyle="rgba(66, 133, 244, 0.4)",t.arc(i.x,i.y,8,0,2*Math.PI),t.fill()),t.beginPath(),t.fillStyle="#4285F4",t.arc(i.x,i.y,6,0,2*Math.PI),t.fill(),t.restore()}onButtonClick(e){const t=e.currentTarget===this.insetButton;t&&this.model.inset()||!t&&!this.model.inset()||(this.model.setInset(t),this.updateButtons(),this.dispatchEventToListeners(tt.ShadowChanged,this.model))}handleValueModification(t){const i=t.currentTarget,n=e.UIUtils.createReplacementString(i.value,t,(function(e,t,i){i.length||(i="px");return e+t+i}));if(!n)return;const s=We.parse(n);s&&(t.currentTarget===this.blurInput&&s.amount<0&&(s.amount=0),i.value=s.asCSSText(),i.selectionStart=0,i.selectionEnd=i.value.length,this.onTextInput(t),t.consume(!0))}onTextInput(e){const t=e.currentTarget;this.changedElement=t,this.changedElement.classList.remove("invalid");const i=We.parse(t.value);!i||t===this.blurInput&&i.amount<0||(t===this.xInput?(this.model.setOffsetX(i),this.updateCanvas(!1)):t===this.yInput?(this.model.setOffsetY(i),this.updateCanvas(!1)):t===this.blurInput?(this.model.setBlurRadius(i),this.blurSlider.value=i.amount.toString()):t===this.spreadInput&&(this.model.setSpreadRadius(i),this.spreadSlider.value=i.amount.toString()),this.dispatchEventToListeners(tt.ShadowChanged,this.model))}onTextBlur(){if(!this.changedElement)return;let e=this.changedElement.value.trim()?We.parse(this.changedElement.value):We.zero();if(e||(e=We.parse(this.changedElement.value+"px")),!e)return this.changedElement.classList.add("invalid"),void(this.changedElement=null);this.changedElement===this.xInput?(this.model.setOffsetX(e),this.xInput.value=e.asCSSText(),this.updateCanvas(!1)):this.changedElement===this.yInput?(this.model.setOffsetY(e),this.yInput.value=e.asCSSText(),this.updateCanvas(!1)):this.changedElement===this.blurInput?(e.amount<0&&(e=We.zero()),this.model.setBlurRadius(e),this.blurInput.value=e.asCSSText(),this.blurSlider.value=e.amount.toString()):this.changedElement===this.spreadInput&&(this.model.setSpreadRadius(e),this.spreadInput.value=e.asCSSText(),this.spreadSlider.value=e.amount.toString()),this.changedElement=null,this.dispatchEventToListeners(tt.ShadowChanged,this.model)}onSliderInput(e){e.currentTarget===this.blurSlider?(this.model.setBlurRadius(new We(Number(this.blurSlider.value),this.model.blurRadius().unit||"px")),this.blurInput.value=this.model.blurRadius().asCSSText(),this.blurInput.classList.remove("invalid")):e.currentTarget===this.spreadSlider&&(this.model.setSpreadRadius(new We(Number(this.spreadSlider.value),this.model.spreadRadius().unit||"px")),this.spreadInput.value=this.model.spreadRadius().asCSSText(),this.spreadInput.classList.remove("invalid")),this.dispatchEventToListeners(tt.ShadowChanged,this.model)}dragStart(t){this.xySlider.focus(),this.updateCanvas(!0),this.canvasOrigin=new e.Geometry.Point(this.xySlider.getBoundingClientRect().left+this.halfCanvasSize,this.xySlider.getBoundingClientRect().top+this.halfCanvasSize);const i=new e.Geometry.Point(t.x-this.canvasOrigin.x,t.y-this.canvasOrigin.y),n=this.sliderThumbPosition();return i.distanceTo(n)>=6&&this.dragMove(t),!0}dragMove(t){let i=new e.Geometry.Point(t.x-this.canvasOrigin.x,t.y-this.canvasOrigin.y);t.shiftKey&&(i=this.snapToClosestDirection(i));const n=this.constrainPoint(i,this.innerCanvasSize),s=Math.round(n.x/this.innerCanvasSize*20),o=Math.round(n.y/this.innerCanvasSize*20);t.shiftKey?(this.model.setOffsetX(new We(s,this.model.offsetX().unit||"px")),this.model.setOffsetY(new We(o,this.model.offsetY().unit||"px"))):(t.altKey||this.model.setOffsetX(new We(s,this.model.offsetX().unit||"px")),e.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(t)||this.model.setOffsetY(new We(o,this.model.offsetY().unit||"px"))),this.xInput.value=this.model.offsetX().asCSSText(),this.yInput.value=this.model.offsetY().asCSSText(),this.xInput.classList.remove("invalid"),this.yInput.classList.remove("invalid"),this.updateCanvas(!0),this.dispatchEventToListeners(tt.ShadowChanged,this.model)}onCanvasBlur(){this.updateCanvas(!1)}onCanvasArrowKey(e){const t=e;let n=0,s=0;if("ArrowRight"===t.key?n=1:"ArrowLeft"===t.key?n=-1:"ArrowUp"===t.key?s=-1:"ArrowDown"===t.key&&(s=1),n||s){if(e.consume(!0),n){const e=this.model.offsetX(),t=i.NumberUtilities.clamp(e.amount+n,-20,20);if(t===e.amount)return;this.model.setOffsetX(new We(t,e.unit||"px")),this.xInput.value=this.model.offsetX().asCSSText(),this.xInput.classList.remove("invalid")}if(s){const e=this.model.offsetY(),t=i.NumberUtilities.clamp(e.amount+s,-20,20);if(t===e.amount)return;this.model.setOffsetY(new We(t,e.unit||"px")),this.yInput.value=this.model.offsetY().asCSSText(),this.yInput.classList.remove("invalid")}this.updateCanvas(!0),this.dispatchEventToListeners(tt.ShadowChanged,this.model)}}constrainPoint(t,i){return Math.abs(t.x)<=i&&Math.abs(t.y)<=i?new e.Geometry.Point(t.x,t.y):t.scale(i/Math.max(Math.abs(t.x),Math.abs(t.y)))}snapToClosestDirection(t){let i=Number.MAX_VALUE,n=t;const s=[new e.Geometry.Point(0,-1),new e.Geometry.Point(1,-1),new e.Geometry.Point(1,0),new e.Geometry.Point(1,1)];for(const e of s){const s=t.projectOn(e),o=t.distanceTo(s);o<i&&(i=o,n=s)}return n}sliderThumbPosition(){const t=this.model.offsetX().amount/20*this.innerCanvasSize,i=this.model.offsetY().amount/20*this.innerCanvasSize;return this.constrainPoint(new e.Geometry.Point(t,i),this.innerCanvasSize)}}var tt;(tt||(tt={})).ShadowChanged="ShadowChanged";var it=Object.freeze({__proto__:null,CSSShadowEditor:et,get Events(){return tt}});const nt=new CSSStyleSheet;nt.replaceSync(":host{user-select:none;padding:4px 12px 12px}.error-input{box-shadow:0 0 0 1px var(--color-accent-red)}.error-text{color:var(--color-accent-red);padding:6px 0}.warning-input{--override-warning-input-color:#ffdd9e;box-shadow:0 0 0 1px var(--override-warning-input-color)}.-theme-with-dark-background .warning-input,\n:host-context(.-theme-with-dark-background) .warning-input{--override-warning-input-color:rgb(97 63 0)}.hide-warning{display:none}.font-section-header{font-weight:normal;font-size:17px;text-align:left}.font-section-subheader{font-size:12px;text-align:left;font-weight:bold}.font-selector-section{overflow-y:auto;padding-bottom:10px}.font-selector-input{width:204px;text-align-last:center}.font-reset-button{width:100%;margin-top:10px}.font-section{border-top:1px solid var(--color-details-hairline)}.chrome-select.font-editor-select{min-width:50px;min-height:27px}input::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button{display:none;margin:0}.preview-text{max-width:300px;word-break:break-word;display:block}.rendered-font-list-label{font-weight:bold;font-size:12px}.rendered-font-list{padding:5px 0}.shadow-editor-field{height:24px;margin-top:8px;font-size:12px;flex-shrink:0}.shadow-editor-field:last-of-type{margin-bottom:8px}.shadow-editor-flex-field{display:flex;align-items:center;flex-direction:row}.shadow-editor-field.shadow-editor-blur-field{margin-top:40px}.shadow-editor-2D-slider{position:absolute;height:88px;width:88px;border:1px solid var(--divider-line);border-radius:2px}.shadow-editor-label{display:inline-block;width:70px;height:24px;line-height:24px;margin-right:8px;text-align:left}.shadow-editor-button-left,\n.shadow-editor-button-right{width:74px;height:24px;padding:3px 7px;line-height:16px;border:1px solid var(--divider-line);color:var(--color-text-primary);background-color:var(--color-background);text-align:center;font-weight:500}.shadow-editor-button-left{border-radius:2px 0 0 2px}.shadow-editor-button-right{border-radius:0 2px 2px 0;border-left-width:0}.shadow-editor-button-left:hover,\n.shadow-editor-button-right:hover{box-shadow:0 1px 1px var(--divider-line)}.shadow-editor-button-left:focus,\n.shadow-editor-button-right:focus{background-color:var(--color-background-elevation-1)}.shadow-editor-text-input{width:50px;margin:8px;text-align:center;box-shadow:var(--legacy-focus-ring-inactive-shadow)}.spectrum-switcher{border-radius:2px;height:20px;width:20px;padding:2px;margin-left:5px}.spectrum-switcher:hover{background-color:var(--color-background-elevation-1)}.spectrum-switcher:focus-visible{background-color:var(--legacy-focus-bg-color)}\n/*# sourceURL=fontEditor.css */\n");async function st(t){const i=e.Context.Context.instance().flavor(h.DOMModel.DOMNode);let n;if(i&&i.parentNode&&"HTML"!==i.nodeName()){const[e]=h.TargetManager.TargetManager.instance().models(u.CSSOverviewModel.CSSOverviewModel),s=t?i.parentNode.id:i.id,o=(await e.getComputedStyleForNode(s).then(ot)).replace(/[a-z]/g,"");n=parseFloat(o)}else n=16;return n}function ot(e){const t=e.computedStyle;let i=6;if(t[i].name&&"font-size"!==t[i].name)for(let e=0;e<t.length;e++)if("font-size"===t[e].name){i=e;break}return t[i].value}const rt={expression:"window.innerWidth",includeCommandLineAPI:!1,silent:!0,returnByValue:!1,generatePreview:!1,userGesture:!1,awaitPromise:!0,throwOnSideEffect:!1,disableBreaks:!0,replMode:!1,allowUnsafeEvalBlockedByCSP:!1},at={expression:"window.innerHeight",includeCommandLineAPI:!1,silent:!0,returnByValue:!1,generatePreview:!1,userGesture:!1,awaitPromise:!0,throwOnSideEffect:!1,disableBreaks:!0,replMode:!1,allowUnsafeEvalBlockedByCSP:!1};async function lt(){const t=e.Context.Context.instance().flavor(h.RuntimeModel.ExecutionContext);let i,n;if(t){const e=await t.evaluate(rt,!1,!1),s=await t.evaluate(at,!1,!1);if("error"in e||"error"in s)return null;e.object&&(i=e.object.value),s.object&&(n=s.object.value)}if(void 0===i||void 0===n){const t=e.Context.Context.instance().flavor(h.DOMModel.DOMNode);if(!t)return null;const s=await t.domModel().target().pageAgent().invoke_getLayoutMetrics(),o=s.visualViewport.zoom?s.visualViewport.zoom:1;n=s.visualViewport.clientHeight/o,i=s.visualViewport.clientWidth/o}return{width:i,height:n}}const ht=new Map;async function dt(e,t,i){let n,s;""===e&&(e="em"),""===t&&(t="em");const o=ht.get(e),r=ht.get(t);return o&&r?(n="em"===e||"%"===e?await o(i):await o(),s="em"===t||"%"===t?await r(i):await r(),n/s):1}ht.set("px",(function(){return 1})),ht.set("em",st),ht.set("rem",(async function(){const t=function(e){let t=e;for(;t&&"HTML"!==t.nodeName()&&t.parentNode;)t=t.parentNode;return t}(e.Context.Context.instance().flavor(h.DOMModel.DOMNode));if(!t||!t.id)return 16;const[i]=h.TargetManager.TargetManager.instance().models(u.CSSOverviewModel.CSSOverviewModel),n=(await i.getComputedStyleForNode(t.id).then(ot)).replace(/[a-z]/g,"");return parseFloat(n)})),ht.set("%",(async function(e){return await st(e)/100})),ht.set("vh",(async function(){const e=await lt();return e?e.height/100:1})),ht.set("vw",(async function(){const e=await lt();return e?e.width/100:1})),ht.set("vmin",(async function(){const e=await lt();if(!e)return 1;const t=e.width,i=e.height;return Math.min(t,i)/100})),ht.set("vmax",(async function(){const e=await lt();if(!e)return 1;const t=e.width,i=e.height;return Math.max(t,i)/100})),ht.set("cm",(function(){return 37.795})),ht.set("mm",(function(){return 3.7795})),ht.set("in",(function(){return 96})),ht.set("pt",(function(){return 4/3})),ht.set("pc",(function(){return 16}));var ct=Object.freeze({__proto__:null,getUnitConversionMultiplier:dt});const ut=new Set(["px","em","rem","%","vh","vw"]),pt=new Set(["","px","em","%"]),mt=new Set(["em","rem","px"]),gt=["","xx-small","x-small","smaller","small","medium","large","larger","x-large","xx-large"],vt=["","normal"],ft=["","lighter","normal","bold","bolder"],xt=["","normal"],bt=["inherit","initial","unset"];gt.push(...bt),vt.push(...bt),ft.push(...bt),xt.push(...bt);const wt=new Set(gt),St=new Set(vt),yt=new Set(ft),Ct=new Set(xt),It=new Map([["px",{min:0,max:72,step:1}],["em",{min:0,max:4.5,step:.1}],["rem",{min:0,max:4.5,step:.1}],["%",{min:0,max:450,step:1}],["vh",{min:0,max:10,step:.1}],["vw",{min:0,max:10,step:.1}],["vmin",{min:0,max:10,step:.1}],["vmax",{min:0,max:10,step:.1}],["cm",{min:0,max:2,step:.1}],["mm",{min:0,max:20,step:.1}],["in",{min:0,max:1,step:.01}],["pt",{min:0,max:54,step:1}],["pc",{min:0,max:4.5,step:.1}]]),kt=new Map([["",{min:0,max:2,step:.1}],["em",{min:0,max:2,step:.1}],["%",{min:0,max:200,step:1}],["px",{min:0,max:32,step:1}],["rem",{min:0,max:2,step:.1}],["vh",{min:0,max:4.5,step:.1}],["vw",{min:0,max:4.5,step:.1}],["vmin",{min:0,max:4.5,step:.1}],["vmax",{min:0,max:4.5,step:.1}],["cm",{min:0,max:1,step:.1}],["mm",{min:0,max:8.5,step:.1}],["in",{min:0,max:.5,step:.1}],["pt",{min:0,max:24,step:1}],["pc",{min:0,max:2,step:.1}]]),Et=new Map([["",{min:100,max:700,step:100}]]),Pt=new Map([["px",{min:-10,max:10,step:.01}],["em",{min:-.625,max:.625,step:.001}],["rem",{min:-.625,max:.625,step:.001}],["%",{min:-62.5,max:62.5,step:.1}],["vh",{min:-1.5,max:1.5,step:.01}],["vw",{min:-1.5,max:1.5,step:.01}],["vmin",{min:-1.5,max:1.5,step:.01}],["vmax",{min:-1.5,max:1.5,step:.01}],["cm",{min:-.25,max:.025,step:.001}],["mm",{min:-2.5,max:2.5,step:.01}],["in",{min:-.1,max:.1,step:.001}],["pt",{min:-7.5,max:7.5,step:.01}],["pc",{min:-.625,max:.625,step:.001}]]),Tt={regex:/(^[\+\d\.]+)([a-zA-Z%]+)/,units:ut,keyValues:wt,rangeMap:It,defaultUnit:"px"},zt={regex:/(^[\+\d\.]+)([a-zA-Z%]*)/,units:pt,keyValues:St,rangeMap:kt,defaultUnit:""},Mt={regex:/(^[\+\d\.]+)/,units:null,keyValues:yt,rangeMap:Et,defaultUnit:null},Lt={regex:/([\+-0-9\.]+)([a-zA-Z%]+)/,units:mt,keyValues:Ct,rangeMap:Pt,defaultUnit:"em"},Ut=["Arial","Bookman","Candara","Comic Sans MS","Courier New","Garamond","Georgia","Helvetica","Impact","Palatino","Roboto","Times New Roman","Verdana"],At=["serif","sans-serif","monspace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded","emoji","math","fangsong"];async function Ft(){const e=h.TargetManager.TargetManager.instance().models(u.CSSOverviewModel.CSSOverviewModel);if(e){const t=e[0];if(t){const{fontInfo:e}=await t.getNodeStyleStats();return Array.from(e.keys())}}return[]}function Rt(e){switch(e){case 1:default:return 0;case.1:return 1;case.01:return 2;case.001:return 3}}var Bt=Object.freeze({__proto__:null,FontPropertiesRegex:/^[^- ][a-zA-Z-]+|-?\+?(?:[0-9]+\.[0-9]+|\.[0-9]+|[0-9]+)[a-zA-Z%]{0,4}/,FontFamilyRegex:/(?:"[\w \,-]+",? ?|'[\w \,-]+',? ?|[\w \,-]+,? ?)+/,GlobalValues:bt,FontSizeStaticParams:Tt,LineHeightStaticParams:zt,FontWeightStaticParams:Mt,LetterSpacingStaticParams:Lt,SystemFonts:Ut,GenericFonts:At,generateComputedFontArray:Ft,getRoundingPrecision:Rt});const Nt={fontFamily:"Font Family",cssProperties:"CSS Properties",fontSize:"Font Size",lineHeight:"Line Height",fontWeight:"Font Weight",spacing:"Spacing",fallbackS:"Fallback {PH1}",thereIsNoValueToDeleteAtIndexS:"There is no value to delete at index: {PH1}",fontSelectorDeletedAtIndexS:"Font Selector deleted at index: {PH1}",deleteS:"Delete {PH1}",PleaseEnterAValidValueForSText:"* Please enter a valid value for {PH1} text input",thisPropertyIsSetToContainUnits:"This property is set to contain units but does not have a defined corresponding unitsArray: {PH1}",sSliderInput:"{PH1} Slider Input",sTextInput:"{PH1} Text Input",units:"Units",sUnitInput:"{PH1} Unit Input",sKeyValueSelector:"{PH1} Key Value Selector",sToggleInputType:"{PH1} toggle input type",selectorInputMode:"Selector Input Mode",sliderInputMode:"Slider Input Mode"},Ot=a.i18n.registerUIStrings("ui/legacy/components/inline_editor/FontEditor.ts",Nt),Dt=a.i18n.getLocalizedString.bind(void 0,Ot);class _t extends(n.ObjectWrapper.eventMixin(e.Widget.VBox)){selectedNode;propertyMap;fontSelectorSection;fontSelectors;fontsList;constructor(t){super(!0),this.selectedNode=e.Context.Context.instance().flavor(h.DOMModel.DOMNode),this.propertyMap=t,this.contentElement.tabIndex=0,this.setDefaultFocusedElement(this.contentElement),this.fontSelectorSection=this.contentElement.createChild("div","font-selector-section"),this.fontSelectorSection.createChild("h2","font-section-header").textContent=Dt(Nt.fontFamily),this.fontSelectors=[],this.fontsList=null;const i=this.propertyMap.get("font-family");this.createFontSelectorSection(i);const n=this.contentElement.createChild("div","font-section");n.createChild("h2","font-section-header").textContent=Dt(Nt.cssProperties);const s=this.getPropertyInfo("font-size",Tt.regex),o=this.getPropertyInfo("line-height",zt.regex),r=this.getPropertyInfo("font-weight",Mt.regex),a=this.getPropertyInfo("letter-spacing",Lt.regex);new Vt("font-size",Dt(Nt.fontSize),n,s,Tt,this.updatePropertyValue.bind(this),this.resizePopout.bind(this),!0),new Vt("line-height",Dt(Nt.lineHeight),n,o,zt,this.updatePropertyValue.bind(this),this.resizePopout.bind(this),!0),new Vt("font-weight",Dt(Nt.fontWeight),n,r,Mt,this.updatePropertyValue.bind(this),this.resizePopout.bind(this),!1),new Vt("letter-spacing",Dt(Nt.spacing),n,a,Lt,this.updatePropertyValue.bind(this),this.resizePopout.bind(this),!0)}wasShown(){this.registerCSSFiles([nt])}async createFontSelectorSection(e){if(e){const t=e.split(",");if(await this.createFontSelector(t[0],!0),!bt.includes(t[0]))for(let e=1;e<t.length+1;e++)this.createFontSelector(t[e])}else this.createFontSelector("",!0);this.resizePopout()}async createFontsList(){const e=await Ft(),t=new Map,i=this.splitComputedFontArray(e);t.set("Computed Fonts",i);const n=new Map;n.set("System Fonts",Ut),n.set("Generic Families",At);const s=[];return s.push(t),s.push(n),s}splitComputedFontArray(e){const t=[];for(const i of e)if(i.includes(",")){i.split(",").forEach((e=>{-1===t.findIndex((t=>t.toLowerCase()===e.trim().toLowerCase().replace(/"/g,"'")))&&t.push(e.trim().replace(/"/g,""))}))}else-1===t.findIndex((e=>e.toLowerCase()===i.toLowerCase().replace('"',"'")))&&t.push(i.replace(/"/g,""));return t}async createFontSelector(e,t){if(e=e?e.trim():""){const t=e.charAt(0);"'"===t?e=e.replace(/'/g,""):'"'===t&&(e=e.replace(/"/g,""))}const i=this.fontSelectorSection.createChild("div","shadow-editor-field shadow-editor-flex-field");let n;if(this.fontsList||(this.fontsList=await this.createFontsList()),t){n=Dt(Nt.fontFamily);const t=new Map([["Global Values",bt]]),s=[...this.fontsList];s.push(t),this.createSelector(i,n,s,e.trim())}else n=Dt(Nt.fallbackS,{PH1:this.fontSelectors.length}),this.createSelector(i,n,this.fontsList,e.trim())}deleteFontSelector(t,i){let n=this.fontSelectors[t];const s=0===t;if(""===n.input.value&&!i)return void e.ARIAUtils.alert(Dt(Nt.thereIsNoValueToDeleteAtIndexS,{PH1:t}));if(s){const e=this.fontSelectors[1];let i="";e&&(i=e.input.value,n=e);this.fontSelectors[0].input.value=i,t=1}if(n.input.parentNode){const i=this.fontSelectors.length>1;if(!s||i){const e=n.input.parentElement;e&&(e.remove(),this.fontSelectors.splice(t,1),this.updateFontSelectorList())}e.ARIAUtils.alert(Dt(Nt.fontSelectorDeletedAtIndexS,{PH1:t}))}this.onFontSelectorChanged(),this.resizePopout();const o=s?0:t-1;this.fontSelectors[o].input.focus()}updateFontSelectorList(){for(let t=0;t<this.fontSelectors.length;t++){const i=this.fontSelectors[t];let n;n=0===t?Dt(Nt.fontFamily):Dt(Nt.fallbackS,{PH1:t}),i.label.textContent=n,e.ARIAUtils.setLabel(i.input,n),i.deleteButton.setTitle(Dt(Nt.deleteS,{PH1:n})),i.index=t}}getPropertyInfo(e,t){const i=this.propertyMap.get(e);if(i){const e=i,n=e.match(t);if(n){return{value:"+"===n[1].charAt(0)?n[1].substr(1):n[1],units:n[2]?n[2]:""}}return{value:e,units:null}}return{value:null,units:null}}createSelector(t,n,s,o){const r=this.fontSelectors.length,a=e.UIUtils.createSelect(n,s);a.value=o;const l=e.UIUtils.createLabel(n,"shadow-editor-label",a);a.addEventListener("input",this.onFontSelectorChanged.bind(this),!1),a.addEventListener("keydown",(e=>{"Enter"===e.key&&e.consume()}),!1),t.appendChild(l),t.appendChild(a);const h=new e.Toolbar.Toolbar("",t),d=new e.Toolbar.ToolbarButton(Dt(Nt.deleteS,{PH1:n}),"bin");h.appendToolbarItem(d);const c={label:l,input:a,deleteButton:d,index:r};d.addEventListener(e.Toolbar.ToolbarButton.Events.Click,(()=>{this.deleteFontSelector(c.index)})),d.element.addEventListener("keydown",(e=>{i.KeyboardUtilities.isEnterOrSpaceKey(e)&&(this.deleteFontSelector(c.index),e.consume())}),!1),this.fontSelectors.push(c)}onFontSelectorChanged(){let e="";const t=bt.includes(this.fontSelectors[0].input.value);if(t)for(let e=1;e<this.fontSelectors.length;e++)this.deleteFontSelector(e,!0);for(const t of this.fontSelectors){const i=t.input;""!==i.value&&(""===e?e=this.fontSelectors[0].input.value:e+=", "+i.value)}""!==this.fontSelectors[this.fontSelectors.length-1].input.value&&!t&&this.fontSelectors.length<10&&(this.createFontSelector(""),this.resizePopout()),this.updatePropertyValue("font-family",e)}updatePropertyValue(e,t){this.dispatchEventToListeners($t.FontChanged,{propertyName:e,value:t})}resizePopout(){this.dispatchEventToListeners($t.FontEditorResized)}}var $t;!function(e){e.FontChanged="FontChanged",e.FontEditorResized="FontEditorResized"}($t||($t={}));class Vt{showSliderMode;errorText;propertyInfo;propertyName;staticParams;hasUnits;units;addedUnit;initialRange;boundUpdateCallback;boundResizeCallback;selectedNode;sliderInput;textBoxInput;unitInput;selectorInput;applyNextInput;constructor(t,i,n,s,o,r,a,l){this.showSliderMode=!0;const d=n.createChild("div","shadow-editor-field shadow-editor-flex-field");if(this.errorText=n.createChild("div","error-text"),this.errorText.textContent=Dt(Nt.PleaseEnterAValidValueForSText,{PH1:t}),this.errorText.hidden=!0,e.ARIAUtils.markAsAlert(this.errorText),this.propertyInfo=s,this.propertyName=t,this.staticParams=o,this.hasUnits=l,this.hasUnits&&this.staticParams.units&&null!==this.staticParams.defaultUnit){const e=this.staticParams.defaultUnit;this.units=null!==s.units?s.units:e,this.addedUnit=!this.staticParams.units.has(this.units)}else{if(this.hasUnits)throw new Error(Dt(Nt.thisPropertyIsSetToContainUnits,{PH1:t}));this.units=""}this.initialRange=this.getUnitRange(),this.boundUpdateCallback=r,this.boundResizeCallback=a,this.selectedNode=e.Context.Context.instance().flavor(h.DOMModel.DOMNode);const c=e.UIUtils.createLabel(i,"shadow-editor-label");d.append(c),this.sliderInput=this.createSliderInput(d,i),this.textBoxInput=this.createTextBoxInput(d),e.ARIAUtils.bindLabelToControl(c,this.textBoxInput),this.unitInput=this.createUnitInput(d),this.selectorInput=this.createSelectorInput(d),this.createTypeToggle(d),this.checkSelectorValueAndToggle(),this.applyNextInput=!1}setInvalidTextBoxInput(e){e?this.errorText.hidden&&(this.errorText.hidden=!1,this.textBoxInput.classList.add("error-input"),this.boundResizeCallback()):this.errorText.hidden||(this.errorText.hidden=!0,this.textBoxInput.classList.remove("error-input"),this.boundResizeCallback())}checkSelectorValueAndToggle(){return!(!this.staticParams.keyValues||null===this.propertyInfo.value||!this.staticParams.keyValues.has(this.propertyInfo.value))&&(this.toggleInputType(),!0)}getUnitRange(){let e=0,t=100,i=1;if(null!==this.propertyInfo.value&&/\d/.test(this.propertyInfo.value))if(this.staticParams.rangeMap.get(this.units)){const n=this.staticParams.rangeMap.get(this.units);n&&(e=Math.min(n.min,parseFloat(this.propertyInfo.value)),t=Math.max(n.max,parseFloat(this.propertyInfo.value)),i=n.step)}else{const n=this.staticParams.rangeMap.get("px");n&&(e=Math.min(n.min,parseFloat(this.propertyInfo.value)),t=Math.max(n.max,parseFloat(this.propertyInfo.value)),i=n.step)}else{const n=this.staticParams.rangeMap.get(this.units);n&&(e=n.min,t=n.max,i=n.step)}return{min:e,max:t,step:i}}createSliderInput(t,i){const n=this.initialRange.min,s=this.initialRange.max,o=this.initialRange.step,r=e.UIUtils.createSlider(n,s,-1);if(r.sliderElement.step=o.toString(),r.sliderElement.tabIndex=0,this.propertyInfo.value)r.value=parseFloat(this.propertyInfo.value);else{const e=(n+s)/2;r.value=e}return r.addEventListener("input",(e=>{this.onSliderInput(e,!1)})),r.addEventListener("mouseup",(e=>{this.onSliderInput(e,!0)})),r.addEventListener("keydown",(e=>{"ArrowUp"!==e.key&&"ArrowDown"!==e.key&&"ArrowLeft"!==e.key&&"ArrowRight"!==e.key||(this.applyNextInput=!0)})),t.appendChild(r),e.ARIAUtils.setLabel(r.sliderElement,Dt(Nt.sSliderInput,{PH1:this.propertyName})),r}createTextBoxInput(t){const i=e.UIUtils.createInput("shadow-editor-text-input","number");return i.step=this.initialRange.step.toString(),i.classList.add("font-editor-text-input"),null!==this.propertyInfo.value&&("+"===this.propertyInfo.value.charAt(0)&&(this.propertyInfo.value=this.propertyInfo.value.substr(1)),i.value=this.propertyInfo.value),i.step="any",i.addEventListener("input",this.onTextBoxInput.bind(this),!1),t.appendChild(i),e.ARIAUtils.setLabel(i,Dt(Nt.sTextInput,{PH1:this.propertyName})),i}createUnitInput(t){let i;if(this.hasUnits&&this.staticParams.units){const t=this.propertyInfo.units,n=this.staticParams.units;i=e.UIUtils.createSelect(Dt(Nt.units),n),i.classList.add("font-editor-select"),this.addedUnit&&t&&i.add(new Option(t,t)),t&&(i.value=t),i.addEventListener("change",this.onUnitInput.bind(this),!1)}else i=e.UIUtils.createSelect(Dt(Nt.units),[]),i.classList.add("font-editor-select"),i.disabled=!0;return i.addEventListener("keydown",(e=>{"Enter"===e.key&&e.consume()}),!1),t.appendChild(i),e.ARIAUtils.setLabel(i,Dt(Nt.sUnitInput,{PH1:this.propertyName})),i}createSelectorInput(t){const i=e.UIUtils.createSelect(Dt(Nt.sKeyValueSelector,{PH1:this.propertyName}),this.staticParams.keyValues);return i.classList.add("font-selector-input"),this.propertyInfo.value&&(i.value=this.propertyInfo.value),i.addEventListener("input",this.onSelectorInput.bind(this),!1),i.addEventListener("keydown",(e=>{"Enter"===e.key&&e.consume()}),!1),t.appendChild(i),i.hidden=!0,i}onSelectorInput(e){if(e.currentTarget){const t=e.currentTarget.value;this.textBoxInput.value="";const i=(parseFloat(this.sliderInput.sliderElement.min)+parseFloat(this.sliderInput.sliderElement.max))/2;this.sliderInput.value=i,this.setInvalidTextBoxInput(!1),this.boundUpdateCallback(this.propertyName,t)}}onSliderInput(e,t){const i=e.currentTarget;if(i){const e=i.value;this.textBoxInput.value=e,this.selectorInput.value="";const n=this.hasUnits?e+this.unitInput.value:e.toString();this.setInvalidTextBoxInput(!1),(t||this.applyNextInput)&&(this.boundUpdateCallback(this.propertyName,n),this.applyNextInput=!1)}}onTextBoxInput(e){const t=e.currentTarget;if(t){const e=t.value,i=e+(""===e?"":this.unitInput.value);this.staticParams.regex.test(i)||""===e&&!t.validationMessage.length?(parseFloat(e)>parseFloat(this.sliderInput.sliderElement.max)?this.sliderInput.sliderElement.max=e:parseFloat(e)<parseFloat(this.sliderInput.sliderElement.min)&&(this.sliderInput.sliderElement.min=e),this.sliderInput.value=parseFloat(e),this.selectorInput.value="",this.setInvalidTextBoxInput(!1),this.boundUpdateCallback(this.propertyName,i)):this.setInvalidTextBoxInput(!0)}}async onUnitInput(e){const t=e.currentTarget,i=t.hasFocus(),n=t.value;t.disabled=!0;const s=this.units,o=await dt(s,n,"font-size"===this.propertyName);this.setInputUnits(o,n),this.textBoxInput.value&&this.boundUpdateCallback(this.propertyName,this.textBoxInput.value+n),this.units=n,t.disabled=!1,i&&t.focus()}createTypeToggle(t){const i=t.createChild("div","spectrum-switcher"),n=new c.Icon.Icon;n.data={iconName:"fold-more",color:"var(--icon-default)",width:"16px",height:"16px"},i.appendChild(n),e.UIUtils.setTitle(i,Dt(Nt.sToggleInputType,{PH1:this.propertyName})),i.tabIndex=0,self.onInvokeElement(i,this.toggleInputType.bind(this)),e.ARIAUtils.markAsButton(i)}toggleInputType(t){t&&"Enter"===t.key&&t.consume(),this.showSliderMode?(this.sliderInput.hidden=!0,this.textBoxInput.hidden=!0,this.unitInput.hidden=!0,this.selectorInput.hidden=!1,this.showSliderMode=!1,e.ARIAUtils.alert(Dt(Nt.selectorInputMode))):(this.sliderInput.hidden=!1,this.textBoxInput.hidden=!1,this.unitInput.hidden=!1,this.selectorInput.hidden=!0,this.showSliderMode=!0,e.ARIAUtils.alert(Dt(Nt.sliderInputMode)))}setInputUnits(e,t){const i=this.staticParams.rangeMap.get(t);let n,s,o;i?(n=i.min,s=i.max,o=i.step):(n=0,s=100,o=1);let r=!1;const a=Rt(o);let l=(n+s)/2;this.textBoxInput.value&&(r=!0,l=parseFloat((parseFloat(this.textBoxInput.value)*e).toFixed(a))),this.sliderInput.sliderElement.min=Math.min(l,n).toString(),this.sliderInput.sliderElement.max=Math.max(l,s).toString(),this.sliderInput.sliderElement.step=o.toString(),this.textBoxInput.step=o.toString(),r&&(this.textBoxInput.value=l.toString()),this.sliderInput.value=l}}var Ht=Object.freeze({__proto__:null,FontEditor:_t,get Events(){return $t}});const jt=new CSSStyleSheet;jt.replaceSync(".link-swatch-link:not(.undefined){cursor:pointer;text-underline-offset:2px;color:var(--color-link)}.link-swatch-link:hover:not(.undefined){text-decoration:underline}.link-swatch-link:focus:not(:focus-visible){outline:none}.link-swatch-link.undefined{--override-link-swatch-link-undefined-color:rgb(102 102 102);color:var(--override-link-swatch-link-undefined-color)}\n/*# sourceURL=linkSwatch.css */\n");const Gt={sIsNotDefined:"{PH1} is not defined"},Xt=a.i18n.registerUIStrings("ui/legacy/components/inline_editor/LinkSwatch.ts",Gt),Yt=a.i18n.getLocalizedString.bind(void 0,Xt),{render:Wt,html:Kt,Directives:qt}=o;class Zt extends HTMLElement{static litTagName=o.literal`devtools-base-link-swatch`;shadow=this.attachShadow({mode:"open"});onLinkActivate=()=>{};connectedCallback(){this.shadow.adoptedStyleSheets=[jt]}set data(e){this.onLinkActivate=(t,n)=>{n instanceof MouseEvent&&0!==n.button||n instanceof KeyboardEvent&&!i.KeyboardUtilities.isEnterOrSpaceKey(n)||(e.onLinkActivate(t),n.consume(!0))},e.showTitle=void 0===e.showTitle||e.showTitle,this.render(e)}render(e){const{isDefined:t,text:i,title:n}=e,s=qt.classMap({"link-swatch-link":!0,undefined:!t}),r=t?this.onLinkActivate.bind(this,i.trim()):null;Wt(Kt`<span class="${s}" title="${o.Directives.ifDefined(e.showTitle?n:null)}" data-title="${o.Directives.ifDefined(e.showTitle?null:n)}" @mousedown="${r}" @keydown="${r}" role="link" tabindex="-1">${i}</span>`,this.shadow,{host:this})}}const Qt=/(^var\()\s*(--(?:[\s\w\P{ASCII}-]|\\.)+)(,?\s*.*)\s*(\))$/u;class Jt extends HTMLElement{static litTagName=o.literal`devtools-css-var-swatch`;shadow=this.attachShadow({mode:"open"});constructor(){super(),this.tabIndex=-1,this.addEventListener("focus",(()=>{const e=this.shadow.querySelector('[role="link"]');e&&e.focus()}))}set data(e){this.render(e)}parseVariableFunctionParts(e){const t=e.replace(/\s{2,}/g," ").match(Qt);return t?{pre:t[1],variableName:t[2],fallbackIncludeComma:t[3],post:t[4]}:null}variableName(e){const t=e.match(Qt);return t?t[2]:""}render(e){const{text:t,fromFallback:i,computedValue:n,onLinkActivate:s}=e,o=this.parseVariableFunctionParts(t);if(!o)return void Wt("",this.shadow,{host:this});const r=Boolean(n)&&!i,a=r?n:Yt(Gt.sIsNotDefined,{PH1:this.variableName(t)}),l=o.fallbackIncludeComma?o.fallbackIncludeComma:"";Wt(Kt`<span data-title="${e.computedValue||""}">${o.pre}<${Zt.litTagName} .data="${{title:a,showTitle:!1,text:o.variableName,isDefined:r,onLinkActivate:s}}" class="css-var-link"></${Zt.litTagName}>${l}${o.post}</span>`,this.shadow,{host:this})}}class ei extends HTMLElement{static litTagName=o.literal`devtools-link-swatch`;shadow=this.attachShadow({mode:"open"});set data(e){this.render(e)}render(e){const{text:t,isDefined:i,onLinkActivate:n}=e,s=i?t:Yt(Gt.sIsNotDefined,{PH1:t});Wt(Kt`<span title="${e.text}"><${Zt.litTagName} .data="${{text:t,isDefined:i,title:s,onLinkActivate:n}}"></${Zt.litTagName}></span>`,this.shadow,{host:this})}}s.CustomElements.defineComponent("devtools-base-link-swatch",Zt),s.CustomElements.defineComponent("devtools-link-swatch",ei),s.CustomElements.defineComponent("devtools-css-var-swatch",Jt);var ti=Object.freeze({__proto__:null,CSSVarSwatch:Jt,LinkSwatch:ei});const ii=new CSSStyleSheet;ii.replaceSync(':host{white-space:nowrap}[is="ui-icon"].icon-mask.bezier-swatch-icon{position:relative;transform:scale(0.7);margin:-5px -2px -6px -4px;user-select:none;background-color:var(--icon-css);cursor:default}[is="ui-icon"].icon-mask.bezier-swatch-icon:hover{background-color:var(--icon-css-hover)}\n/*# sourceURL=bezierSwatch.css */\n');const ni=new CSSStyleSheet;ni.replaceSync(':host{white-space:nowrap}[is="ui-icon"].shadow-swatch-icon{background-color:var(--icon-css);transform:scale(0.7);position:relative;margin:-5px -2px -5px -4px;user-select:none}[is="ui-icon"].shadow-swatch-icon:hover{background-color:var(--icon-css-hover)}\n/*# sourceURL=cssShadowSwatch.css */\n');class si extends HTMLSpanElement{iconElementInternal;textElement;constructor(){super();const t=e.Utils.createShadowRootWithCoreStyles(this,{cssFile:[ii],delegatesFocus:void 0});this.iconElementInternal=e.Icon.Icon.create("bezier-curve-filled","bezier-swatch-icon"),t.appendChild(this.iconElementInternal),this.textElement=this.createChild("span"),t.createChild("slot")}static create(){let t=si.constructorInternal;return t||(t=e.Utils.registerCustomElement("span","bezier-swatch",si),si.constructorInternal=t),t()}bezierText(){return this.textElement.textContent||""}setBezierText(e){this.textElement.textContent=e}hideText(e){this.textElement.hidden=e}iconElement(){return this.iconElementInternal}static constructorInternal=null}class oi extends HTMLSpanElement{iconElementInternal;contentElement;colorSwatchInternal;modelInternal;constructor(){super();const t=e.Utils.createShadowRootWithCoreStyles(this,{cssFile:[ni],delegatesFocus:void 0});this.iconElementInternal=e.Icon.Icon.create("shadow","shadow-swatch-icon"),t.appendChild(this.iconElementInternal),t.createChild("slot"),this.contentElement=this.createChild("span")}static create(){let t=oi.constructorInternal;return t||(t=e.Utils.registerCustomElement("span","css-shadow-swatch",oi),oi.constructorInternal=t),t()}model(){return this.modelInternal}setCSSShadow(e){this.modelInternal=e,this.contentElement.removeChildren();const t=d.TextUtils.Utils.splitStringByRegexes(e.asCSSText(),[/!important/g,/inset/g,n.Color.Regex]);for(let i=0;i<t.length;i++){const n=t[i];if(2===n.regexIndex){if(!this.colorSwatchInternal){this.colorSwatchInternal=new Z;const e=this.colorSwatchInternal.createChild("span");this.colorSwatchInternal.addEventListener(K.eventName,(t=>{e.textContent=t.data.text}))}this.colorSwatchInternal.renderColor(e.color());const t=this.colorSwatchInternal.querySelector("span");t&&(t.textContent=e.color().getAuthoredText()??e.color().asString()),this.contentElement.appendChild(this.colorSwatchInternal)}else this.contentElement.appendChild(document.createTextNode(n.value))}}hideText(e){this.contentElement.hidden=e}iconElement(){return this.iconElementInternal}colorSwatch(){return this.colorSwatchInternal}static constructorInternal=null}var ri=Object.freeze({__proto__:null,BezierSwatch:si,CSSShadowSwatch:oi});const ai=new CSSStyleSheet;ai.replaceSync(".widget{display:flex;background:var(--color-background);box-shadow:var(--drop-shadow);border-radius:2px;overflow:auto;user-select:text;line-height:11px}\n/*# sourceURL=swatchPopover.css */\n");class li extends n.ObjectWrapper.ObjectWrapper{popover;hideProxy;boundOnKeyDown;boundFocusOut;isHidden;anchorElement;view;hiddenCallback;focusRestorer;constructor(){super(),this.popover=new e.GlassPane.GlassPane,this.popover.setSizeBehavior("MeasureContent"),this.popover.setMarginBehavior("Arrow"),this.popover.element.addEventListener("mousedown",(e=>e.consume()),!1),this.hideProxy=this.hide.bind(this,!0),this.boundOnKeyDown=this.onKeyDown.bind(this),this.boundFocusOut=this.onFocusOut.bind(this),this.isHidden=!0,this.anchorElement=null}onFocusOut(e){const t=e.relatedTarget;!this.isHidden&&t&&this.view&&!t.isSelfOrDescendant(this.view.contentElement)&&this.hideProxy()}setAnchorElement(e){this.anchorElement=e}isShowing(e){return this.popover.isShowing()&&(e&&this.view===e||!e)}show(e,t,i){if(this.popover.isShowing()){if(this.anchorElement===t)return;this.hide(!0)}this.popover.registerCSSFiles([ai]),this.dispatchEventToListeners(hi.WillShowPopover),this.isHidden=!1,this.anchorElement=t,this.view=e,this.hiddenCallback=i,this.reposition(),e.focus();const n=this.popover.element.ownerDocument;n.addEventListener("mousedown",this.hideProxy,!1),n.defaultView&&n.defaultView.addEventListener("resize",this.hideProxy,!1),this.view.contentElement.addEventListener("keydown",this.boundOnKeyDown,!1)}reposition(){if(!this.isHidden&&this.view){if(this.view.contentElement.removeEventListener("focusout",this.boundFocusOut,!1),this.view.show(this.popover.contentElement),this.anchorElement){let e=this.anchorElement.boxInWindow();if(Z.isColorSwatch(this.anchorElement)){const t=this.anchorElement;if(!t.anchorBox)return;e=t.anchorBox}this.popover.setContentAnchorBox(e),this.popover.show(this.anchorElement.ownerDocument)}this.view.contentElement.addEventListener("focusout",this.boundFocusOut,!1),this.focusRestorer||(this.focusRestorer=new e.Widget.WidgetFocusRestorer(this.view))}}hide(e){if(this.isHidden)return;const t=this.popover.element.ownerDocument;this.isHidden=!0,this.popover.hide(),t.removeEventListener("mousedown",this.hideProxy,!1),t.defaultView&&t.defaultView.removeEventListener("resize",this.hideProxy,!1),this.hiddenCallback&&this.hiddenCallback.call(null,Boolean(e)),this.focusRestorer&&this.focusRestorer.restore(),this.anchorElement=null,this.view&&(this.view.detach(),this.view.contentElement.removeEventListener("keydown",this.boundOnKeyDown,!1),this.view.contentElement.removeEventListener("focusout",this.boundFocusOut,!1),delete this.view)}onKeyDown(e){if("Enter"===e.key)return this.hide(!0),void e.consume(!0);e.key===i.KeyboardUtilities.ESCAPE_KEY&&(this.hide(!1),e.consume(!0))}}var hi;!function(e){e.WillShowPopover="WillShowPopover"}(hi||(hi={}));var di=Object.freeze({__proto__:null,SwatchPopoverHelper:li,get Events(){return hi}});export{y as AnimationTimingModel,L as AnimationTimingUI,B as BezierEditor,k as BezierUI,Me as CSSAngle,he as CSSAngleUtils,Fe as CSSAnimationModel,Xe as CSSLength,De as CSSLengthUtils,b as CSSLinearEasingModel,it as CSSShadowEditor,Ke as CSSShadowModel,$ as ColorMixModel,j as ColorMixSwatch,Q as ColorSwatch,Ht as FontEditor,ct as FontEditorUnitConverter,Bt as FontEditorUtils,ce as InlineEditorUtils,ti as LinkSwatch,di as SwatchPopoverHelper,ri as Swatches};

package/dist/third-party/front_end/ui/legacy/components/object_ui/object_ui-legacy.js

@@ -0,0 +1 @@
+import*as e from"./object_ui.js";self.ObjectUI=self.ObjectUI||{},ObjectUI=ObjectUI||{},ObjectUI.CustomPreviewComponent=e.CustomPreviewComponent.CustomPreviewComponent,ObjectUI.JavaScriptREPL=e.JavaScriptREPL.JavaScriptREPL,Object.defineProperty(ObjectUI.JavaScriptREPL,"_MaxLengthForEvaluation",{set:e.JavaScriptREPL.setMaxLengthForEvaluation,get:e.JavaScriptREPL.getMaxLengthForEvaluation}),ObjectUI.ObjectPopoverHelper=e.ObjectPopoverHelper.ObjectPopoverHelper,ObjectUI.ArrayGroupingTreeElement=e.ObjectPropertiesSection.ArrayGroupingTreeElement,ObjectUI.ExpandableTextPropertyValue=e.ObjectPropertiesSection.ExpandableTextPropertyValue,ObjectUI.ObjectPropertiesSection=e.ObjectPropertiesSection.ObjectPropertiesSection,Object.defineProperty(ObjectUI.ObjectPropertiesSection,"_maxRenderableStringLength",{set:e.ObjectPropertiesSection.setMaxRenderableStringLength,get:e.ObjectPropertiesSection.getMaxRenderableStringLength}),ObjectUI.ObjectPropertiesSection.getObjectPropertiesSectionFrom=e.ObjectPropertiesSection.getObjectPropertiesSectionFrom,ObjectUI.ObjectPropertiesSectionsTreeOutline=e.ObjectPropertiesSection.ObjectPropertiesSectionsTreeOutline,ObjectUI.ObjectPropertiesSection.RootElement=e.ObjectPropertiesSection.RootElement,ObjectUI.ObjectPropertiesSection.Renderer=e.ObjectPropertiesSection.Renderer,ObjectUI.ObjectPropertyTreeElement=e.ObjectPropertiesSection.ObjectPropertyTreeElement,ObjectUI.ObjectPropertyPrompt=e.ObjectPropertiesSection.ObjectPropertyPrompt,ObjectUI.ObjectPropertiesSectionsTreeExpandController=e.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController,ObjectUI.RemoteObjectPreviewFormatter=e.RemoteObjectPreviewFormatter.RemoteObjectPreviewFormatter;

package/dist/third-party/front_end/ui/legacy/components/object_ui/object_ui-meta.js

@@ -0,0 +1 @@
+import*as e from"../../../../core/sdk/sdk.js";import*as t from"../../legacy.js";let r;t.UIUtils.registerRenderer({contextTypes:()=>[e.RemoteObject.RemoteObject],loadRenderer:async()=>(await async function(){return r||(r=await import("./object_ui.js")),r}()).ObjectPropertiesSection.Renderer.instance()});

package/dist/third-party/front_end/ui/legacy/components/object_ui/object_ui.js

@@ -0,0 +1 @@
+import*as e from"../../../../core/common/common.js";import*as t from"../../../../core/i18n/i18n.js";import*as n from"../../legacy.js";import*as i from"../../../../core/root/root.js";import*as o from"../../../../core/host/host.js";import*as s from"../../../components/linear_memory_inspector/linear_memory_inspector.js";import*as r from"../../../../core/platform/platform.js";import*as a from"../../../../core/sdk/sdk.js";import*as l from"../../../../models/text_utils/text_utils.js";import*as c from"../../../../models/javascript_metadata/javascript_metadata.js";import*as p from"../../../components/icon_button/icon_button.js";import*as d from"../../../components/text_editor/text_editor.js";import*as h from"../../../../models/formatter/formatter.js";import*as u from"../../../../models/source_map_scopes/source_map_scopes.js";import*as m from"../utils/utils.js";const b={emptyD:"empty × {PH1}",empty:"empty",thePropertyIsComputedWithAGetter:"The property is computed with a getter"},v=t.i18n.registerUIStrings("ui/legacy/components/object_ui/RemoteObjectPreviewFormatter.ts",b),y=t.i18n.getLocalizedString.bind(void 0,v);class f{static objectPropertyComparator(e,t){return n(e)-n(t);function n(e){return"[[PromiseState]]"===e.name?1:"[[PromiseResult]]"===e.name?2:"[[GeneratorState]]"===e.name||"[[PrimitiveValue]]"===e.name||"[[WeakRefTarget]]"===e.name?3:"function"===e.type||e.name.startsWith("#")?5:4}}appendObjectPreview(e,t,i){const o=t.description,s=new Set(["arraybuffer","dataview","error","null","regexp","webassemblymemory","internal#entry","trustedtype"]);if("object"!==t.type||t.subtype&&s.has(t.subtype)||i)return void e.appendChild(this.renderPropertyPreview(t.type,t.subtype,void 0,o));const r="array"===t.subtype||"typedarray"===t.subtype;if(o){let n;if(r){const e=a.RemoteObject.RemoteObject.arrayLength(t),i=e>1?"("+e+")":"",s=a.RemoteObject.RemoteObject.arrayNameFromDescription(o);n="Array"===s?i:s+i}else{n="Object"===o?"":o}n.length>0&&(e.createChild("span","object-description").textContent=n+" ")}const l=e.createChild("span","object-properties-preview");if(n.UIUtils.createTextChild(l,r?"[":"{"),t.entries?this.appendEntriesPreview(l,t):r?this.appendArrayPropertiesPreview(l,t):this.appendObjectPropertiesPreview(l,t),t.overflow){const e=l.textContent&&l.textContent.length>1?", …":"…";l.createChild("span").textContent=e}n.UIUtils.createTextChild(l,r?"]":"}")}abbreviateFullQualifiedClassName(e){const t=e.split(".");for(let e=0;e<t.length-1;++e)t[e]=r.StringUtilities.trimMiddle(t[e],3);return t.join(".")}appendObjectPropertiesPreview(e,t){const i=t.properties.filter((e=>"accessor"!==e.type)).sort(f.objectPropertyComparator);for(let o=0;o<i.length;++o){o>0&&n.UIUtils.createTextChild(e,", ");const s=i[o],r=s.name;if("promise"===t.subtype&&"[[PromiseState]]"===r){e.appendChild(this.renderDisplayName("<"+s.value+">"));const t=o+1<i.length?i[o+1]:null;t&&"[[PromiseResult]]"===t.name&&("pending"!==s.value&&(n.UIUtils.createTextChild(e,": "),e.appendChild(this.renderPropertyPreviewOrAccessor([t]))),o++)}else"generator"===t.subtype&&"[[GeneratorState]]"===r?e.appendChild(this.renderDisplayName("<"+s.value+">")):"[[PrimitiveValue]]"===r?e.appendChild(this.renderPropertyPreviewOrAccessor([s])):"[[WeakRefTarget]]"===r?"undefined"===s.type?e.appendChild(this.renderDisplayName("<cleared>")):e.appendChild(this.renderPropertyPreviewOrAccessor([s])):(e.appendChild(this.renderDisplayName(r)),n.UIUtils.createTextChild(e,": "),e.appendChild(this.renderPropertyPreviewOrAccessor([s])))}}appendArrayPropertiesPreview(e,t){const i=a.RemoteObject.RemoteObject.arrayLength(t),o=t.properties.filter((e=>-1!==r(e.name))).sort((function(e,t){return r(e.name)-r(t.name)})),s=t.properties.filter((e=>-1===r(e.name))).sort(f.objectPropertyComparator);function r(e){const t=Number(e)>>>0;return String(t)===e&&t<i?t:-1}const l=!t.overflow;let c=-1,p=!1;for(let t=0;t<o.length;++t){p&&n.UIUtils.createTextChild(e,", ");const i=o[t],s=r(i.name);l&&s-c>1&&(d(s),n.UIUtils.createTextChild(e,", ")),l||t===s||(e.appendChild(this.renderDisplayName(i.name)),n.UIUtils.createTextChild(e,": ")),e.appendChild(this.renderPropertyPreviewOrAccessor([i])),c=s,p=!0}l&&i-c>1&&(p&&n.UIUtils.createTextChild(e,", "),d(i));for(let t=0;t<s.length;++t){p&&n.UIUtils.createTextChild(e,", ");const i=s[t];e.appendChild(this.renderDisplayName(i.name)),n.UIUtils.createTextChild(e,": "),e.appendChild(this.renderPropertyPreviewOrAccessor([i])),p=!0}function d(t){const n=e.createChild("span","object-value-undefined"),i=t-c-1;n.textContent=1!==i?y(b.emptyD,{PH1:i}):y(b.empty),p=!0}}appendEntriesPreview(e,t){if(t.entries)for(let i=0;i<t.entries.length;++i){i>0&&n.UIUtils.createTextChild(e,", ");const o=t.entries[i];o.key&&(this.appendObjectPreview(e,o.key,!0),n.UIUtils.createTextChild(e," => ")),this.appendObjectPreview(e,o.value,!0)}}renderDisplayName(e){const t=document.createElement("span");t.classList.add("name");const n=/^\s|\s$|^$|\n/.test(e);return t.textContent=n?'"'+e.replace(/\n/g,"↵")+'"':e,t}renderPropertyPreviewOrAccessor(e){const t=e[e.length-1];if(!t)throw new Error("Could not find property");return this.renderPropertyPreview(t.type,t.subtype,t.name,t.value)}renderPropertyPreview(e,t,i,o){const s=document.createElement("span");if(s.classList.add("object-value-"+(t||e)),o=o||"","accessor"===e)return s.textContent="(...)",n.Tooltip.Tooltip.install(s,y(b.thePropertyIsComputedWithAGetter)),s;if("function"===e)return s.textContent="ƒ",s;if("object"===e&&"trustedtype"===t&&i)return g(s,o,i),s;if("object"===e&&"node"===t&&o)return x(s,o),s;if("string"===e)return n.UIUtils.createTextChildren(s,r.StringUtilities.formatAsJSLiteral(o)),s;if("object"===e&&!t){let e=this.abbreviateFullQualifiedClassName(o);return"Object"===e&&(e="{…}"),s.textContent=e,n.Tooltip.Tooltip.install(s,o),s}return s.textContent=o,s}}const x=function(e,t){const n=t.match(/([^#.]+)(#[^.]+)?(\..*)?/);n&&(e.createChild("span","webkit-html-tag-name").textContent=n[1],n[2]&&(e.createChild("span","webkit-html-attribute-value").textContent=n[2]),n[3]&&(e.createChild("span","webkit-html-attribute-name").textContent=n[3]))},g=function(e,t,i){n.UIUtils.createTextChildren(e,`${i} `);const o=document.createElement("span");o.classList.add("object-value-string"),n.UIUtils.createTextChildren(o,'"',t.replace(/\n/g,"↵"),'"'),e.appendChild(o)};var w=Object.freeze({__proto__:null,RemoteObjectPreviewFormatter:f,createSpansForNodeTitle:x,createSpanForTrustedType:g});class E{static wrapObjectLiteral(e){const t=/^\s*\{\s*(.*)\s*\}[\s;]*$/.exec(e);if(null===t)return e;const[,n]=t;let i=0;for(const t of n)if("{"===t)i++;else if("}"===t&&--i<0)return e;const o=(async()=>0).constructor;try{o("return {"+n+"};");const e="({"+n+"})";return o(e),e}catch(t){return e}}static async evaluateAndBuildPreview(e,t,o,s,r,l,c=!1,p=!1){const d=n.Context.Context.instance().flavor(a.RuntimeModel.ExecutionContext),m=e.length>C;if(!e||!d||t&&m)return{preview:document.createDocumentFragment(),result:null};let b=e;if(i.Runtime.experiments.isEnabled("evaluateExpressionsWithSourceMaps")){const e=d.debuggerModel.selectedCallFrame();if(e){const t=await u.NamesResolver.allVariablesInCallFrame(e);try{b=await h.FormatterWorkerPool.formatterWorkerPool().javaScriptSubstitute(b,t)}catch{}}}b=E.wrapObjectLiteral(b);const v={expression:b,generatePreview:!0,includeCommandLineAPI:!0,throwOnSideEffect:t,timeout:s,objectGroup:l,disableBreaks:!0,replMode:o,silent:p},y=await d.evaluate(v,!1,c);return{preview:E.buildEvaluationPreview(y,r),result:y}}static buildEvaluationPreview(e,t){const n=document.createDocumentFragment();if("error"in e)return n;if(e.exceptionDetails&&e.exceptionDetails.exception&&e.exceptionDetails.exception.description){const i=e.exceptionDetails.exception.description;return(i.startsWith("TypeError: ")||t)&&(n.createChild("span").textContent=e.exceptionDetails.text+" "+i),n}const i=new f,{preview:o,type:s,subtype:a,className:l,description:c}=e.object;if(o&&"object"===s&&"node"!==a&&"trustedtype"!==a)i.appendObjectPreview(n,o,!1);else{const e=i.renderPropertyPreview(s,a,l,r.StringUtilities.trimEndWithMaxLength(c||"",400));n.appendChild(e)}return n}}let C=2e3;var j=Object.freeze({__proto__:null,JavaScriptREPL:E,setMaxLengthForEvaluation:function(e){C=e},getMaxLengthForEvaluation:function(){return C}});const P=new CSSStyleSheet;P.replaceSync(".value.object-value-node:hover{background-color:var(--item-hover-color)}.object-value-function-prefix,\n.object-value-boolean{color:var(--color-syntax-3)}.object-value-function{font-style:italic}.object-value-function.linkified:hover{--override-linkified-hover-background:rgb(0 0 0/10%);background-color:var(--override-linkified-hover-background);cursor:pointer}.-theme-with-dark-background .object-value-function.linkified:hover,\n:host-context(.-theme-with-dark-background) .object-value-function.linkified:hover{--override-linkified-hover-background:rgb(230 230 230/10%)}.object-value-number{color:var(--color-syntax-3)}.object-value-bigint{color:var(--color-syntax-6)}.object-value-string,\n.object-value-regexp,\n.object-value-symbol{white-space:pre;unicode-bidi:-webkit-isolate;color:var(--color-syntax-1)}.object-value-node{position:relative;vertical-align:baseline;color:var(--color-syntax-7);white-space:nowrap}.object-value-null,\n.object-value-undefined{color:var(--color-text-disabled)}.object-value-unavailable{color:var(--color-syntax-2)}.object-value-calculate-value-button:hover{text-decoration:underline}.object-properties-section-custom-section{display:inline-flex;flex-direction:column}.-theme-with-dark-background .object-value-number,\n:host-context(.-theme-with-dark-background) .object-value-number,\n.-theme-with-dark-background .object-value-boolean,\n:host-context(.-theme-with-dark-background) .object-value-boolean{--override-primitive-dark-mode-color:hsl(252deg 100% 75%);color:var(--override-primitive-dark-mode-color)}.object-properties-section .object-description{color:var(--color-text-secondary)}.value .object-properties-preview{white-space:nowrap}.name{color:var(--color-syntax-2);flex-shrink:0}.object-properties-preview .name{color:var(--color-text-secondary)}@media (forced-colors: active){.object-value-calculate-value-button:hover{forced-color-adjust:none;color:Highlight}}\n/*# sourceURL=objectValue.css */\n");const T=new CSSStyleSheet;T.replaceSync('.object-properties-section-dimmed{opacity:60%}.object-properties-section{padding:0;color:var(--color-text-primary);display:flex;flex-direction:column}.object-properties-section li{user-select:text}.object-properties-section li::before{top:-1px;margin-right:2px}.object-properties-section li.editing-sub-part{padding:3px 12px 8px 6px;margin:-1px -6px -8px;text-overflow:clip}.object-properties-section li.editing{margin-left:10px;text-overflow:clip}.tree-outline ol.title-less-mode{padding-left:0}.object-properties-section .own-property{font-weight:bold}.object-properties-section .synthetic-property{color:var(--color-text-secondary)}.object-properties-section .private-property-hash{color:var(--color-text-primary)}.object-properties-section-root-element{display:flex;flex-direction:row}.object-properties-section .editable-div{overflow:hidden}.object-properties-section [data-webidl="true"] > .name-and-value > .adorner{flex-shrink:0;width:16px;height:16px;margin-right:2px}.object-properties-section [data-webidl="true"] > .name-and-value > .name{font-weight:bold}.name-and-value{overflow:hidden;line-height:16px;display:flex;white-space:nowrap}.name-and-value .separator{white-space:pre;flex-shrink:0}.editing-sub-part .name-and-value{overflow:visible;display:inline-flex}.property-prompt{margin-left:4px}.tree-outline.hide-selection-when-blurred .selected:focus-visible{background:none}.tree-outline.hide-selection-when-blurred .selected:focus-visible ::slotted(*),\n.tree-outline.hide-selection-when-blurred .selected:focus-visible .tree-element-title,\n.tree-outline.hide-selection-when-blurred .selected:focus-visible .name-and-value,\n.tree-outline.hide-selection-when-blurred .selected:focus-visible .gray-info-message{background:var(--legacy-focus-bg-color);border-radius:2px;box-shadow:0 0 0 2px var(--legacy-focus-bg-color)}@media (forced-colors: active){.object-properties-section-dimmed{opacity:100%}.tree-outline.hide-selection-when-blurred .selected:focus-visible{background:Highlight}.tree-outline li:hover .tree-element-title,\n  .tree-outline li.selected .tree-element-title{color:ButtonText}.tree-outline.hide-selection-when-blurred .selected:focus-visible .tree-element-title,\n  .tree-outline.hide-selection-when-blurred .selected:focus-visible .name-and-value{background:transparent;box-shadow:none}.tree-outline.hide-selection-when-blurred .selected:focus-visible span,\n  .tree-outline.hide-selection-when-blurred .selected:focus-visible .gray-info-message{color:HighlightText}.tree-outline-disclosure:hover li.parent::before{background-color:ButtonText}}\n/*# sourceURL=objectPropertiesSection.css */\n');const I={exceptionS:"[Exception: {PH1}]",unknown:"unknown",expandRecursively:"Expand recursively",collapseChildren:"Collapse children",noProperties:"No properties",dots:"(...)",invokePropertyGetter:"Invoke property getter",showAllD:"Show all {PH1}",valueUnavailable:"<value unavailable>",valueNotAccessibleToTheDebugger:"Value is not accessible to the debugger",copyValue:"Copy value",copyPropertyPath:"Copy property path",stringIsTooLargeToEdit:"<string is too large to edit>",showMoreS:"Show more ({PH1})",longTextWasTruncatedS:"long text was truncated ({PH1})",copy:"Copy",revealInMemoryInpector:"Reveal in Memory Inspector panel"},O=t.i18n.registerUIStrings("ui/legacy/components/object_ui/ObjectPropertiesSection.ts",I),S=t.i18n.getLocalizedString.bind(void 0,O),L=new WeakMap,k=new WeakMap,M=c.JavaScriptMetadata.JavaScriptMetadataImpl.domPinnedProperties.DOMPinnedProperties;class R extends n.TreeOutline.TreeOutlineInShadow{object;editable;objectTreeElementInternal;titleElement;skipProtoInternal;constructor(e,t,n,i){super(),this.object=e,this.editable=!0,i||this.hideOverflow(),this.setFocusable(!0),this.setShowSelectionOnKeyboardFocus(!0),this.objectTreeElementInternal=new U(e,n),this.appendChild(this.objectTreeElementInternal),"string"!=typeof t&&t?(this.titleElement=t,this.element.appendChild(t)):(this.titleElement=this.element.createChild("span"),this.titleElement.textContent=t||""),this.titleElement instanceof HTMLElement&&!this.titleElement.hasAttribute("tabIndex")&&(this.titleElement.tabIndex=-1),k.set(this.element,this),this.registerCSSFiles([P,T]),this.rootElement().childrenListElement.classList.add("source-code","object-properties-section")}static defaultObjectPresentation(e,t,n,i){const o=R.defaultObjectPropertiesSection(e,t,n,i);return e.hasChildren?o.element:o.titleElement}static defaultObjectPropertiesSection(e,t,i,o){const s=document.createElement("span");s.classList.add("source-code");const r=n.Utils.createShadowRootWithCoreStyles(s,{cssFile:[P],delegatesFocus:void 0}),a=R.createPropertyValue(e,!1,!0);r.appendChild(a.element);const l=new R(e,s,t);return l.editable=!1,i&&l.skipProto(),o&&l.setEditable(!1),l}static assignWebIDLMetadata(e,t){if(!e)return;const n="object"===e.type&&null!==e.className?M[e.className]:void 0;if(!n)return;e.webIdl={info:n,state:new Map};const i=(n.includes?.map((e=>M[e]))??[]).flatMap((e=>Object.entries(e?.props??{}))),o={...n.props,...Object.fromEntries(i)};for(const e of t){const t=o[e.name];t&&(e.webIdl={info:t})}}static getPropertyValuesByNames(e){const t=new Map;for(const n of e)t.set(n.name,n.value);return t}static compareProperties(e,t){if(!e.synthetic&&t.synthetic)return 1;if(!t.synthetic&&e.synthetic)return-1;if(!e.isOwn&&t.isOwn)return 1;if(!t.isOwn&&e.isOwn)return-1;if(!e.enumerable&&t.enumerable)return 1;if(!t.enumerable&&e.enumerable)return-1;if(e.symbol&&!t.symbol)return 1;if(t.symbol&&!e.symbol)return-1;if(e.private&&!t.private)return 1;if(t.private&&!e.private)return-1;const n=e.name,i=t.name;return n.startsWith("_")&&!i.startsWith("_")?1:i.startsWith("_")&&!n.startsWith("_")?-1:r.StringUtilities.naturalOrderComparator(n,i)}static createNameElement(e,t){return null===e?n.Fragment.html`<span class="name"></span>`:/^\s|\s$|^$|\n/.test(e)?n.Fragment.html`<span class="name">"${e.replace(/\n/g,"↵")}"</span>`:t?n.Fragment.html`<span class="name"> <span class="private-property-hash">${e[0]}</span>${e.substring(1)} </span>`:n.Fragment.html`<span class="name">${e}</span>`}static valueElementForFunctionDescription(e,t,i){const o=document.createElement("span");o.classList.add("object-value-function");const s=(e=e||"").replace(/^function [gs]et /,"function ").replace(/^function [gs]et\(/,"function(").replace(/^[gs]et /,"");i=i||"";const a=s.match(/^(async\s+function)/),l=s.startsWith("function*"),c=s.startsWith("*"),p=!l&&s.startsWith("function"),d=s.startsWith("class ")||s.startsWith("class{"),h=s.indexOf("=>"),u=!a&&!l&&!p&&!d&&h>0;let m;if(d){m=s.substring("class".length);const e=/^[^{\s]+/.exec(m.trim());let t=i;e&&(t=e[0].trim()||i),v("class",m,t)}else if(a)m=s.substring(a[1].length),v("async ƒ",m,b(m));else if(l)m=s.substring("function*".length),v("ƒ*",m,b(m));else if(c)m=s.substring("*".length),v("ƒ*",m,b(m));else if(p)m=s.substring("function".length),v("ƒ",m,b(m));else if(u){const e=60;let t=s;i?t=i+"()":s.length>e&&(t=s.substring(0,h+2)+" {…}"),v("",s,t)}else v("ƒ",s,b(s));return n.Tooltip.Tooltip.install(o,r.StringUtilities.trimEndWithMaxLength(e,500)),o;function b(e){const t=e.indexOf("("),n=e.match(/\)\s*{/);if(-1!==t&&n&&void 0!==n.index&&n.index>t){return(e.substring(0,t).trim()||i)+e.substring(t,n.index+1)}return i+"()"}function v(e,i,s){e.length&&(o.createChild("span","object-value-function-prefix").textContent=e+" "),t?n.UIUtils.createTextChild(o,r.StringUtilities.trimEndWithMaxLength(i.trim(),200)):n.UIUtils.createTextChild(o,s.replace(/\n/g," "))}}static createPropertyValueWithCustomSupport(e,t,n,i,o,s,r){if(e.customPreview()){const t=new q(e).element;return t.classList.add("object-properties-section-custom-section"),new B(t)}return R.createPropertyValue(e,t,n,i,o,s,r)}static appendMemoryIcon(e,t,i){if(!("object"===t.type&&t.subtype&&s.LinearMemoryInspectorController.ACCEPTED_MEMORY_TYPES.includes(t.subtype))&&!s.LinearMemoryInspectorController.isDWARFMemoryObject(t))return;const r=new p.Icon.Icon;r.data={iconName:"memory",color:"var(--icon-default)",width:"16px",height:"13px"},r.onclick=async e=>{e.stopPropagation();const n=s.LinearMemoryInspectorController.LinearMemoryInspectorController.instance();o.userMetrics.linearMemoryInspectorRevealedFrom(o.UserMetrics.LinearMemoryInspectorRevealedFrom.MemoryIcon),n.openInspectorView(t,void 0,i)};const a=S(I.revealInMemoryInpector);n.Tooltip.Tooltip.install(r,a),n.ARIAUtils.setLabel(r,a),r.style.setProperty("vertical-align","sub"),r.style.setProperty("cursor","pointer"),e.appendChild(r)}static createPropertyValue(i,o,s,l,c,p=!1,d){let h;const u=i.type,m=i.subtype,b=i.description||"",v=i.className;if("object"===u&&"internal#location"===m){const e=i.debuggerModel().createRawLocationByScriptId(i.value.scriptId,i.value.lineNumber,i.value.columnNumber);if(e&&c)return new B(c.linkifyRawLocation(e,r.DevToolsPath.EmptyUrlString));h=new B(function(){const e=document.createElement("span");return e.textContent="<"+S(I.unknown)+">",n.Tooltip.Tooltip.install(e,b||""),e}())}else if("string"===u&&"string"==typeof b)h=y();else if("object"===u&&"trustedtype"===m)h=function(){const e=document.createElement("span");e.classList.add("object-value-trustedtype");const t=`${v} "${b}"`;let i;if(t.length>A)i=new J(e,t,50);else{const o=y();n.UIUtils.createTextChild(e,`${v} `),e.appendChild(o.element),i=new B(e),n.Tooltip.Tooltip.install(e,t)}return i}();else if("function"===u)h=new B(R.valueElementForFunctionDescription(b));else if("object"===u&&"node"===m&&b)h=new B(function(){const t=document.createElement("span");return t.classList.add("object-value-node"),x(t,b),t.addEventListener("click",(t=>{e.Revealer.reveal(i),t.consume(!0)}),!1),t.addEventListener("mousemove",(()=>a.OverlayModel.OverlayModel.highlightObjectAsDOMNode(i)),!1),t.addEventListener("mouseleave",(()=>a.OverlayModel.OverlayModel.hideDOMNodeHighlight()),!1),t}());else{const e=document.createElement("span");if(e.classList.add("object-value-"+(m||u)),i.preview&&s){(new f).appendObjectPreview(e,i.preview,!1),h=new B(e),n.Tooltip.Tooltip.install(h.element,b||"")}else b.length>A?h=new J(e,b,50):(h=new B(e),h.element.textContent=b,n.Tooltip.Tooltip.install(h.element,b));p||this.appendMemoryIcon(e,i,d)}if(o){const e=document.createElement("span");e.classList.add("error"),e.classList.add("value"),e.appendChild(t.i18n.getFormatLocalizedString(O,I.exceptionS,{PH1:h.element})),h.element=e}return h.element.classList.add("value"),h;function y(){const e=document.createElement("span");e.classList.add("object-value-string");const t=JSON.stringify(b);let i;return b.length>A?i=new J(e,t,50):(n.UIUtils.createTextChild(e,t),i=new B(e),n.Tooltip.Tooltip.install(e,b)),i}}static formatObjectAsFunction(t,n,i,o){return t.debuggerModel().functionDetailsPromise(t).then((function(s){i&&s&&s.location&&(n.classList.add("linkified"),n.addEventListener("click",(()=>(e.Revealer.reveal(s.location),!1))));let r=o?"":"anonymous";s&&s.functionName&&(r=s.functionName);const a=R.valueElementForFunctionDescription(t.description,o,r);n.appendChild(a)}))}static isDisplayableProperty(e,t){if(!t||!t.synthetic)return!0;const n=e.name;return!("[[Entries]]"===t.name&&("length"===n||"__proto__"===n))}skipProto(){this.skipProtoInternal=!0}expand(){this.objectTreeElementInternal.expand()}setEditable(e){this.editable=e}objectTreeElement(){return this.objectTreeElementInternal}enableContextMenu(){this.element.addEventListener("contextmenu",this.contextMenuEventFired.bind(this),!1)}contextMenuEventFired(e){const t=new n.ContextMenu.ContextMenu(e);t.appendApplicableItems(this.object),this.object instanceof a.RemoteObject.LocalJSONObject&&(t.viewSection().appendItem(S(I.expandRecursively),this.objectTreeElementInternal.expandRecursively.bind(this.objectTreeElementInternal,100)),t.viewSection().appendItem(S(I.collapseChildren),this.objectTreeElementInternal.collapseChildren.bind(this.objectTreeElementInternal))),t.show()}titleLessMode(){this.objectTreeElementInternal.listItemElement.classList.add("hidden"),this.objectTreeElementInternal.childrenListElement.classList.add("title-less-mode"),this.objectTreeElementInternal.expand()}}let A=1e4;class N extends n.TreeOutline.TreeOutlineInShadow{editable;constructor(e){super(),this.registerCSSFiles([P,T]),this.editable=!(e&&e.readOnly),this.contentElement.classList.add("source-code"),this.contentElement.classList.add("object-properties-section"),this.hideOverflow()}}class U extends n.TreeOutline.TreeElement{object;linkifier;emptyPlaceholder;propertiesMode;extraProperties;targetObject;toggleOnClick;constructor(e,t,n,i=1,o=[],s=e){super(document.createElement("slot")),this.object=e,this.linkifier=t,this.emptyPlaceholder=n,this.propertiesMode=i,this.extraProperties=o,this.targetObject=s,this.setExpandable(!0),this.selectable=!0,this.toggleOnClick=!0,this.listItemElement.classList.add("object-properties-section-root-element"),this.listItemElement.addEventListener("contextmenu",this.onContextMenu.bind(this),!1)}onexpand(){this.treeOutline&&this.treeOutline.element.classList.add("expanded")}oncollapse(){this.treeOutline&&this.treeOutline.element.classList.remove("expanded")}ondblclick(e){return!0}onContextMenu(e){const t=new n.ContextMenu.ContextMenu(e);if(t.appendApplicableItems(this.object),this.object instanceof a.RemoteObject.LocalJSONObject){const{value:e}=this.object,n="object"==typeof e?JSON.stringify(e,null,2):e,i=()=>{o.userMetrics.actionTaken(o.UserMetrics.Action.NetworkPanelCopyValue),o.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(n)};t.clipboardSection().appendItem(S(I.copyValue),i)}t.viewSection().appendItem(S(I.expandRecursively),this.expandRecursively.bind(this,100)),t.viewSection().appendItem(S(I.collapseChildren),this.collapseChildren.bind(this)),t.show()}async onpopulate(){const e=this.treeOutline,t=!!e&&Boolean(e.skipProtoInternal);return F.populate(this,this.object,t,!1,this.linkifier,this.emptyPlaceholder,this.propertiesMode,this.extraProperties,this.targetObject)}}class F extends n.TreeOutline.TreeElement{property;toggleOnClick;highlightChanges;linkifier;maxNumPropertiesToShow;nameElement;valueElement;rowContainer;readOnly;prompt;editableDiv;propertyValue;expandedValueElement;constructor(e,t){super(),this.property=e,this.toggleOnClick=!0,this.highlightChanges=[],this.linkifier=t,this.maxNumPropertiesToShow=200,this.listItemElement.addEventListener("contextmenu",this.contextMenuFired.bind(this),!1),this.listItemElement.dataset.objectPropertyNameForTest=e.name,this.setExpandRecursively("[[Prototype]]"!==e.name)}static async populate(e,t,n,i,o,s,r=1,l,c){if(t.arrayLength()>100)return e.removeChildren(),void D.populateArray(e,t,0,t.arrayLength()-1,o);let p,d=null;switch(r){case 0:({properties:p}=await t.getAllProperties(!1,!0));break;case 1:({properties:p,internalProperties:d}=await a.RemoteObject.RemoteObject.loadFromObjectPerProto(t,!0))}e.removeChildren(),p&&(void 0!==l&&p.push(...l),F.populateWithProperties(e,p,d,n,i,c||t,o,s))}static populateWithProperties(e,t,n,i,o,s,r,l){R.assignWebIDLMetadata(s,t);const c=R.getPropertyValuesByNames(t);if(s?.webIdl){const e=s.webIdl.info.rules;if(e)for(const{when:t,is:n}of e)c.get(t)?.value===n&&s.webIdl.state.set(t,n);for(const n of t)if(n.webIdl){const t=s.webIdl.state,i=n.webIdl.info.rules;n.webIdl.applicable=!e&&!i||(!i||i?.some((e=>t.get(e.when)===e.is)))}}t.sort(R.compareProperties);const p=(n=n||[]).find((e=>"[[Entries]]"===e.name));if(p){L.set(p,s);const t=new F(p,r);t.setExpandable(!0),t.expand(),e.appendChild(t)}const d=[];for(let n=0;n<t.length;++n){const i=t[n];if(L.set(i,s),!R.isDisplayableProperty(i,e.property))continue;if(i.isOwn&&!o){if(i.getter){const e=new a.RemoteObject.RemoteObjectProperty("get "+i.name,i.getter,!1);L.set(e,s),d.push(e)}if(i.setter){const e=new a.RemoteObject.RemoteObjectProperty("set "+i.name,i.setter,!1);L.set(e,s),d.push(e)}}if(i.getter||!i.isAccessorProperty()){const t=new F(i,r);"memories"===i.name&&"Memories"===i.value?.className&&(t.updateExpandable(),t.isExpandable()&&t.expand()),e.appendChild(t)}}for(let t=0;t<d.length;++t)e.appendChild(new F(d[t],r));for(const t of n){L.set(t,s);const n=new F(t,r);"[[Entries]]"!==t.name&&("[[Prototype]]"===t.name&&i||e.appendChild(n))}F.appendEmptyPlaceholderIfNeeded(e,l)}static appendEmptyPlaceholderIfNeeded(e,t){if(e.childCount())return;const i=document.createElement("div");i.classList.add("gray-info-message"),i.textContent=t||S(I.noProperties);const o=new n.TreeOutline.TreeElement(i);e.appendChild(o)}static createRemoteObjectAccessorPropertySpan(e,t,i){const o=document.createElement("span"),s=o.createChild("span");if(s.textContent=S(I.dots),!e)return o;function r(e){let t=this;const n=JSON.parse(e);for(let e=0,i=n.length;e<i;++e)t=t[n[e]];return t}return s.classList.add("object-value-calculate-value-button"),n.Tooltip.Tooltip.install(s,S(I.invokePropertyGetter)),s.addEventListener("click",(function(n){n.consume(),e&&e.callFunction(r,[{value:JSON.stringify(t)}]).then(i)}),!1),o}setSearchRegex(e,t){let i=n.UIUtils.highlightedSearchResultClassName;if(t&&(i+=" "+t),this.revertHighlightChanges(),this.applySearch(e,this.nameElement,i),this.property.value){"object"!==this.property.value.type&&this.applySearch(e,this.valueElement,i)}return Boolean(this.highlightChanges.length)}applySearch(e,t,i){const o=[],s=t.textContent||"";e.lastIndex=0;let r=e.exec(s);for(;r;)o.push(new l.TextRange.SourceRange(r.index,r[0].length)),r=e.exec(s);o.length&&n.UIUtils.highlightRangesWithStyleClass(t,o,i,this.highlightChanges)}showAllPropertiesElementSelected(e){return this.removeChild(e),this.children().forEach((e=>{e.hidden=!1})),!1}createShowAllPropertiesButton(){const e=document.createElement("div");e.classList.add("object-value-calculate-value-button"),e.textContent=S(I.dots),n.Tooltip.Tooltip.install(e,S(I.showAllD,{PH1:this.childCount()}));const t=this.children();for(let e=this.maxNumPropertiesToShow;e<this.childCount();++e)t[e].hidden=!0;const i=new n.TreeOutline.TreeElement(e);i.onselect=this.showAllPropertiesElementSelected.bind(this,i),this.appendChild(i)}revertHighlightChanges(){n.UIUtils.revertDomChanges(this.highlightChanges),this.highlightChanges=[]}async onpopulate(){const e=this.property.value;console.assert(void 0!==e);const t=this.treeOutline,n=!!t&&Boolean(t.skipProtoInternal),i="[[Prototype]]"!==this.property.name?e:L.get(this.property);i&&(await F.populate(this,e,n,!1,this.linkifier,void 0,void 0,void 0,i),this.childCount()>this.maxNumPropertiesToShow&&this.createShowAllPropertiesButton())}ondblclick(e){const t=e.target,n=t.isSelfOrDescendant(this.valueElement)||this.expandedValueElement&&t.isSelfOrDescendant(this.expandedValueElement);return this.property.value&&!this.property.value.customPreview()&&n&&(this.property.writable||this.property.setter)&&this.startEditing(),!1}onenter(){return!(!this.property.value||this.property.value.customPreview()||!this.property.writable&&!this.property.setter)&&(this.startEditing(),!0)}onattach(){this.update(),this.updateExpandable()}onexpand(){this.showExpandedValueElement(!0)}oncollapse(){this.showExpandedValueElement(!1)}showExpandedValueElement(e){this.expandedValueElement&&(e?this.rowContainer.replaceChild(this.expandedValueElement,this.valueElement):this.rowContainer.replaceChild(this.valueElement,this.expandedValueElement))}createExpandedValueElement(e,t){if(!(e.hasChildren&&!e.customPreview()&&"node"!==e.subtype&&"function"!==e.type&&("object"!==e.type||e.preview)))return null;const i=document.createElement("span");return i.classList.add("value"),"Object"===e.description?i.textContent="":i.setTextContentTruncatedIfNeeded(e.description||""),i.classList.add("object-value-"+(e.subtype||e.type)),n.Tooltip.Tooltip.install(i,e.description||""),t||R.appendMemoryIcon(i,e),i}update(){this.nameElement=R.createNameElement(this.property.name,this.property.private),this.property.enumerable||this.nameElement.classList.add("object-properties-section-dimmed"),this.property.isOwn&&this.nameElement.classList.add("own-property"),this.property.synthetic&&this.nameElement.classList.add("synthetic-property"),this.updatePropertyPath();const e=this.property.synthetic&&"[[Entries]]"===this.property.name;if(e)this.valueElement=document.createElement("span"),this.valueElement.classList.add("value");else if(this.property.value){const e="[[Prototype]]"!==this.property.name;this.propertyValue=R.createPropertyValueWithCustomSupport(this.property.value,this.property.wasThrown,e,this.listItemElement,this.linkifier,this.property.synthetic,this.path()),this.valueElement=this.propertyValue.element}else if(this.property.getter){this.valueElement=document.createElement("span");const e=this.valueElement.createChild("span");e.textContent=S(I.dots),e.classList.add("object-value-calculate-value-button"),n.Tooltip.Tooltip.install(e,S(I.invokePropertyGetter));const t=L.get(this.property),i=this.property.getter;e.addEventListener("click",(e=>{e.consume();t.callFunction("\n          function invokeGetter(getter) {\n            return Reflect.apply(getter, this, []);\n          }",[a.RemoteObject.RemoteObject.toCallArgument(i)]).then(this.onInvokeGetterClick.bind(this))}),!1)}else this.valueElement=document.createElement("span"),this.valueElement.classList.add("object-value-unavailable"),this.valueElement.textContent=S(I.valueUnavailable),n.Tooltip.Tooltip.install(this.valueElement,S(I.valueNotAccessibleToTheDebugger));const t=this.valueElement.textContent;this.property.value&&t&&!this.property.wasThrown&&(this.expandedValueElement=this.createExpandedValueElement(this.property.value,this.property.synthetic));const o=i.Runtime.experiments.isEnabled(i.Runtime.ExperimentName.IMPORTANT_DOM_PROPERTIES);let s,r="";if(this.property.webIdl?.applicable&&o){const e=new p.Icon.Icon;e.data={iconName:"star",color:"var(--icon-default)",width:"16px",height:"16px"},r=n.Fragment.html` <span class="adorner">${e}</span> `}s=e?n.Fragment.html` <span class="name-and-value">${r}${this.nameElement}</span> `:n.Fragment.html` <span class="name-and-value">${r}${this.nameElement}<span class="separator">: </span>${this.valueElement}</span> `,this.listItemElement.removeChildren(),this.rowContainer=s,this.listItemElement.appendChild(this.rowContainer),o&&(this.listItemElement.dataset.webidl=this.property.webIdl?.applicable?"true":"false")}updatePropertyPath(){if(this.nameElement.title)return;const e=this.property.name;if(this.property.synthetic)return void n.Tooltip.Tooltip.install(this.nameElement,e);const t=this.parent instanceof F&&this.parent.nameElement&&!this.parent.property.synthetic?this.parent.nameElement.title:"";this.property.private||/^(?:[$_\p{ID_Start}])(?:[$_\u200C\u200D\p{ID_Continue}])*$/u.test(e)?n.Tooltip.Tooltip.install(this.nameElement,t?`${t}.${e}`:e):/^(?:0|[1-9]\d*)$/.test(e)?n.Tooltip.Tooltip.install(this.nameElement,`${t}[${e}]`):n.Tooltip.Tooltip.install(this.nameElement,`${t}[${JSON.stringify(e)}]`)}contextMenuFired(e){const t=new n.ContextMenu.ContextMenu(e);if(t.appendApplicableItems(this),this.property.symbol&&t.appendApplicableItems(this.property.symbol),this.property.value&&(t.appendApplicableItems(this.property.value),L.get(this.property)instanceof a.RemoteObject.LocalJSONObject)){const{value:{value:e}}=this.property,n="object"==typeof e?JSON.stringify(e,null,2):e,i=()=>{o.userMetrics.actionTaken(o.UserMetrics.Action.NetworkPanelCopyValue),o.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(n)};t.clipboardSection().appendItem(S(I.copyValue),i)}if(!this.property.synthetic&&this.nameElement&&this.nameElement.title){const e=o.InspectorFrontendHost.InspectorFrontendHostInstance.copyText.bind(o.InspectorFrontendHost.InspectorFrontendHostInstance,this.nameElement.title);t.clipboardSection().appendItem(S(I.copyPropertyPath),e)}L.get(this.property)instanceof a.RemoteObject.LocalJSONObject&&(t.viewSection().appendItem(S(I.expandRecursively),this.expandRecursively.bind(this,100)),t.viewSection().appendItem(S(I.collapseChildren),this.collapseChildren.bind(this))),this.propertyValue&&this.propertyValue.appendApplicableItems(e,t,{}),t.show()}startEditing(){const e=this.treeOutline;if(this.prompt||!e||!e.editable||this.readOnly)return;if(this.editableDiv=this.rowContainer.createChild("span","editable-div"),this.property.value){let e=this.property.value.description;"string"===this.property.value.type&&"string"==typeof e&&(e=`"${e}"`),this.editableDiv.setTextContentTruncatedIfNeeded(e,S(I.stringIsTooLargeToEdit))}const t=this.editableDiv.textContent||"";this.setExpandable(!1),this.listItemElement.classList.add("editing-sub-part"),this.valueElement.classList.add("hidden"),this.prompt=new _;const n=this.prompt.attachAndStartEditing(this.editableDiv,this.editingCommitted.bind(this,t));n.classList.add("property-prompt");const i=this.listItemElement.getComponentSelection();i&&i.selectAllChildren(this.editableDiv),n.addEventListener("keydown",this.promptKeyDown.bind(this,t),!1)}editingEnded(){this.prompt&&(this.prompt.detach(),delete this.prompt),this.editableDiv.remove(),this.updateExpandable(),this.listItemElement.scrollLeft=0,this.listItemElement.classList.remove("editing-sub-part"),this.select()}editingCancelled(){this.valueElement.classList.remove("hidden"),this.editingEnded()}async editingCommitted(e){const t=this.prompt?this.prompt.text():"";t!==e?(this.editingEnded(),await this.applyExpression(t)):this.editingCancelled()}promptKeyDown(e,t){const n=t;return"Enter"===n.key?(n.consume(),void this.editingCommitted(e)):n.key===r.KeyboardUtilities.ESCAPE_KEY?(n.consume(),void this.editingCancelled()):void 0}async applyExpression(e){const t=a.RemoteObject.RemoteObject.toCallArgument(this.property.symbol||this.property.name);if(e=E.wrapObjectLiteral(e.trim()),this.property.synthetic){let t=!1;if(e&&(t=await this.property.setSyntheticValue(e)),t){const e=this.parent;e&&(e.invalidateChildren(),e.onpopulate())}else this.update();return}const n=L.get(this.property),i=e?n.setPropertyValue(t,e):n.deleteProperty(t);if(await i)this.update();else if(e){const e=this.parent;e&&(e.invalidateChildren(),e.onpopulate())}else this.parent&&this.parent.removeChild(this)}onInvokeGetterClick(e){e.object&&(this.property.value=e.object,this.property.wasThrown=e.wasThrown||!1,this.update(),this.invalidateChildren(),this.updateExpandable())}updateExpandable(){this.property.value?this.setExpandable(!this.property.value.customPreview()&&this.property.value.hasChildren&&!this.property.wasThrown):this.setExpandable(!1)}path(){return this.nameElement.title}}class D extends n.TreeOutline.TreeElement{toggleOnClick;fromIndex;toIndex;object;readOnly;propertyCount;linkifier;constructor(e,t,n,i,o){super(r.StringUtilities.sprintf("[%d … %d]",t,n),!0),this.toggleOnClick=!0,this.fromIndex=t,this.toIndex=n,this.object=e,this.readOnly=!0,this.propertyCount=i,this.linkifier=o}static async populateArray(e,t,n,i,o){await D.populateRanges(e,t,n,i,!0,o)}static async populateRanges(e,t,n,i,o,s){const r=await t.callFunctionJSON((function(e,t,n,i){if(void 0===e||void 0===t||void 0===i||void 0===n)return;let o=null;const s=t-e>=i&&ArrayBuffer.isView(this);function*r(n){if(void 0!==e&&void 0!==t&&void 0!==i)if(t-e<i)for(let i=e;i<=t;++i)i in n&&(yield i);else{o=o||Object.getOwnPropertyNames(n);for(let n=0;n<o.length;++n){const i=o[n],s=Number(i)>>>0;String(s)===i&&e<=s&&s<=t&&(yield s)}}}let a=0;if(s)a=t-e+1;else for(const e of r(this))++a;let l=a;l=a<=n?a:Math.pow(n,Math.ceil(Math.log(a)/Math.log(n))-1);const c=[];if(s)for(let n=e;n<=t;n+=l){const e=n;let i=e+l-1;i>t&&(i=t),c.push([e,i,i-e+1])}else{a=0;let e=-1,t=0;for(const n of r(this))-1===e&&(e=n),t=n,++a===l&&(c.push([e,t,a]),a=0,e=-1);a>0&&c.push([e,t,a])}return{ranges:c}}),[{value:n},{value:i},{value:D.bucketThreshold},{value:D.sparseIterationThreshold}]);await async function(n){if(!n)return;const i=n.ranges;if(1===i.length)await D.populateAsFragment(e,t,i[0][0],i[0][1],s);else for(let n=0;n<i.length;++n){const o=i[n][0],r=i[n][1],a=i[n][2];o===r?await D.populateAsFragment(e,t,o,r,s):e.appendChild(new D(t,o,r,a,s))}o&&await D.populateNonIndexProperties(e,t,s)}(r)}static async populateAsFragment(e,t,n,i,o){const s=await t.callFunction((function(e,t,n){const i=Object.create(null);if(void 0===e||void 0===t||void 0===n)return;if(t-e<n)for(let n=e;n<=t;++n)n in this&&(i[n]=this[n]);else{const n=Object.getOwnPropertyNames(this);for(let o=0;o<n.length;++o){const s=n[o],r=Number(s)>>>0;String(r)===s&&e<=r&&r<=t&&(i[r]=this[r])}}return i}),[{value:n},{value:i},{value:D.sparseIterationThreshold}]);if(!s.object||s.wasThrown)return;const r=s.object,a=await r.getAllProperties(!1,!0);r.release();const l=a.properties;if(l){l.sort(R.compareProperties);for(let t=0;t<l.length;++t){L.set(l[t],this.object);const n=new F(l[t],o);n.readOnly=!0,e.appendChild(n)}}}static async populateNonIndexProperties(e,t,n){const{properties:i,internalProperties:o}=await a.RemoteObject.RemoteObject.loadFromObjectPerProto(t,!0,!0);i&&F.populateWithProperties(e,i,o,!1,!1,t,n)}async onpopulate(){this.propertyCount>=D.bucketThreshold?await D.populateRanges(this,this.object,this.fromIndex,this.toIndex,!1,this.linkifier):await D.populateAsFragment(this,this.object,this.fromIndex,this.toIndex,this.linkifier)}onattach(){this.listItemElement.classList.add("object-properties-section-name")}static bucketThreshold=100;static sparseIterationThreshold=25e4}class _ extends n.TextPrompt.TextPrompt{constructor(){super(),this.initialize(d.JavaScript.completeInContext)}}const V=new Map,W=new Map;let H;class ${static instance(e={forceNew:!1}){const{forceNew:t}=e;return H&&!t||(H=new $),H}async render(e,t){if(!(e instanceof a.RemoteObject.RemoteObject))throw new Error("Can't render "+e);const n=(t=t||{title:void 0,editable:void 0}).title,i=new R(e,n);return n||i.titleLessMode(),i.editable=Boolean(t.editable),{node:i.element,tree:i}}}class B{element;constructor(e){this.element=e}appendApplicableItems(e,t,n){}}class J extends B{text;maxLength;expandElement;maxDisplayableTextLength;expandElementText;copyButtonText;constructor(e,t,i){super(e);const o=e.createChild("span");this.text=t,this.maxLength=i,o.textContent=t.slice(0,i),n.Tooltip.Tooltip.install(o,`${t.slice(0,i)}…`),this.expandElement=o.createChild("span"),this.maxDisplayableTextLength=1e7;const s=r.StringUtilities.countWtf8Bytes(t),a=r.NumberUtilities.bytesToString(s);this.text.length<this.maxDisplayableTextLength?(this.expandElementText=S(I.showMoreS,{PH1:a}),this.expandElement.setAttribute("data-text",this.expandElementText),this.expandElement.classList.add("expandable-inline-button"),this.expandElement.addEventListener("click",this.expandText.bind(this)),this.expandElement.addEventListener("keydown",(e=>{const t=e;"Enter"!==t.key&&" "!==t.key||this.expandText()})),n.ARIAUtils.markAsButton(this.expandElement)):(this.expandElement.setAttribute("data-text",S(I.longTextWasTruncatedS,{PH1:a})),this.expandElement.classList.add("undisplayable-text")),this.copyButtonText=S(I.copy);const l=o.createChild("span","expandable-inline-button");l.setAttribute("data-text",this.copyButtonText),l.addEventListener("click",this.copyText.bind(this)),l.addEventListener("keydown",(e=>{const t=e;"Enter"!==t.key&&" "!==t.key||this.copyText()})),n.ARIAUtils.markAsButton(l)}appendApplicableItems(e,t,n){this.text.length<this.maxDisplayableTextLength&&this.expandElement&&t.clipboardSection().appendItem(this.expandElementText||"",this.expandText.bind(this)),t.clipboardSection().appendItem(this.copyButtonText,this.copyText.bind(this))}expandText(){this.expandElement&&(this.expandElement.parentElement&&this.expandElement.parentElement.insertBefore(document.createTextNode(this.text.slice(this.maxLength)),this.expandElement),this.expandElement.remove(),this.expandElement=null)}copyText(){o.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.text)}}var G=Object.freeze({__proto__:null,getObjectPropertiesSectionFrom:e=>k.get(e),ObjectPropertiesSection:R,setMaxRenderableStringLength:function(e){A=e},getMaxRenderableStringLength:function(){return A},ObjectPropertiesSectionsTreeOutline:N,RootElement:U,InitialVisibleChildrenLimit:200,ObjectPropertyTreeElement:F,ArrayGroupingTreeElement:D,ObjectPropertyPrompt:_,ObjectPropertiesSectionsTreeExpandController:class{expandedProperties;constructor(e){this.expandedProperties=new Set,e.addEventListener(n.TreeOutline.Events.ElementAttached,this.elementAttached,this),e.addEventListener(n.TreeOutline.Events.ElementExpanded,this.elementExpanded,this),e.addEventListener(n.TreeOutline.Events.ElementCollapsed,this.elementCollapsed,this)}watchSection(e,t){V.set(t,e),this.expandedProperties.has(e)&&t.expand()}stopWatchSectionsWithId(e){for(const t of this.expandedProperties)t.startsWith(e+":")&&this.expandedProperties.delete(t)}elementAttached(e){const t=e.data;t.isExpandable()&&this.expandedProperties.has(this.propertyPath(t))&&t.expand()}elementExpanded(e){const t=e.data;this.expandedProperties.add(this.propertyPath(t))}elementCollapsed(e){const t=e.data;this.expandedProperties.delete(this.propertyPath(t))}propertyPath(e){const t=W.get(e);if(t)return t;let n=e,i=n;if(!e.treeOutline)throw new Error("No tree outline available");const o=e.treeOutline.rootElement();let s;for(;n!==o;){let e="";e=n.property?n.property.name:"string"==typeof n.title?n.title:n.title.textContent||"",s=e+(s?"."+s:""),i=n,n.parent&&(n=n.parent)}return s=V.get(i)+(s?":"+s:""),W.set(e,s),s}},Renderer:$,ObjectPropertyValue:B,ExpandableTextPropertyValue:J});const z=new CSSStyleSheet;z.replaceSync(".custom-expandable-section{display:inline-flex;flex-direction:column}.custom-expand-icon{user-select:none;margin-right:4px;margin-bottom:-4px}.custom-expandable-section-standard-section{display:inline-flex}\n/*# sourceURL=customPreviewComponent.css */\n");const K={showAsJavascriptObject:"Show as JavaScript object"},Y=t.i18n.registerUIStrings("ui/legacy/components/object_ui/CustomPreviewComponent.ts",K),Q=t.i18n.getLocalizedString.bind(void 0,Y);class X{sectionElement;object;expanded;cachedContent;header;expandIcon;constructor(t){this.sectionElement=document.createElement("span"),this.sectionElement.classList.add("custom-expandable-section"),this.object=t,this.expanded=!1,this.cachedContent=null;const i=t.customPreview();if(!i)return;let o;try{o=JSON.parse(i.header)}catch(t){return void e.Console.Console.instance().error("Broken formatter: header is invalid json "+t)}this.header=this.renderJSONMLTag(o),this.header.nodeType!==Node.TEXT_NODE?(i.bodyGetterId&&(this.header instanceof Element&&this.header.classList.add("custom-expandable-section-header"),this.header.addEventListener("click",this.onClick.bind(this),!1),this.expandIcon=n.Icon.Icon.create("triangle-right","custom-expand-icon"),this.header.insertBefore(this.expandIcon,this.header.firstChild)),this.sectionElement.appendChild(this.header)):e.Console.Console.instance().error("Broken formatter: header should be an element node.")}element(){return this.sectionElement}renderJSONMLTag(e){if(!Array.isArray(e))return document.createTextNode(String(e));const t=e;return"object"===t[0]?this.layoutObjectTag(t):this.renderElement(t)}renderElement(t){const n=t.shift();if(!X.allowedTags.has(n))return e.Console.Console.instance().error("Broken formatter: element "+n+" is not allowed!"),document.createElement("span");const i=document.createElement(n);if("object"==typeof t[0]&&!Array.isArray(t[0])){const e=t.shift();for(const t in e){const n=e[t];"style"===t&&"string"==typeof n&&i.setAttribute(t,n)}}return this.appendJsonMLTags(i,t),i}layoutObjectTag(e){e.shift();const t=e.shift(),n=this.object.runtimeModel().createRemoteObject(t);if(n.customPreview())return new X(n).element();const i=R.defaultObjectPresentation(n);return i.classList.toggle("custom-expandable-section-standard-section",n.hasChildren),i}appendJsonMLTags(e,t){for(let n=0;n<t.length;++n)e.appendChild(this.renderJSONMLTag(t[n]))}onClick(e){e.consume(!0),this.cachedContent?this.toggleExpand():this.loadBody()}toggleExpand(){this.expanded=!this.expanded,this.header instanceof Element&&this.header.classList.toggle("expanded",this.expanded),this.cachedContent instanceof Element&&this.cachedContent.classList.toggle("hidden",!this.expanded),this.expandIcon&&(this.expanded?this.expandIcon.setIconType("triangle-down"):this.expandIcon.setIconType("triangle-right"))}async loadBody(){const e=this.object.customPreview();if(e&&e.bodyGetterId){const t=await this.object.callFunctionJSON((e=>e()),[{objectId:e.bodyGetterId}]);if(!t)return;this.cachedContent=this.renderJSONMLTag(t),this.sectionElement.appendChild(this.cachedContent),this.toggleExpand()}}static allowedTags=new Set(["span","div","ol","li","table","tr","td"])}class q{object;customPreviewSection;element;constructor(e){this.object=e,this.customPreviewSection=new X(e),this.element=document.createElement("span"),this.element.classList.add("source-code");const t=n.Utils.createShadowRootWithCoreStyles(this.element,{cssFile:[z],delegatesFocus:void 0});this.element.addEventListener("contextmenu",this.contextMenuEventFired.bind(this),!1),t.appendChild(this.customPreviewSection.element())}expandIfPossible(){const e=this.object.customPreview();e&&e.bodyGetterId&&this.customPreviewSection&&this.customPreviewSection.loadBody()}contextMenuEventFired(e){const t=new n.ContextMenu.ContextMenu(e);this.customPreviewSection&&t.revealSection().appendItem(Q(K.showAsJavascriptObject),this.disassemble.bind(this)),t.appendApplicableItems(this.object),t.show()}disassemble(){this.element.shadowRoot&&(this.element.shadowRoot.textContent="",this.customPreviewSection=null,this.element.shadowRoot.appendChild(R.defaultObjectPresentation(this.object)))}}var Z=Object.freeze({__proto__:null,CustomPreviewSection:X,CustomPreviewComponent:q});const ee=new CSSStyleSheet;ee.replaceSync(".object-popover-content{display:block;position:relative;overflow:hidden;flex:1 1 auto}.object-popover-title{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-weight:bold;padding-left:18px;padding-bottom:2px}.object-popover-tree{border-top:1px solid var(--color-details-hairline);overflow:auto;width:100%;height:calc(100% - 13px)}.object-popover-container{display:inline-block}\n/*# sourceURL=objectPopover.css */\n");class te{linkifier;resultHighlightedAsDOM;constructor(e,t){this.linkifier=e,this.resultHighlightedAsDOM=t}dispose(){this.resultHighlightedAsDOM&&a.OverlayModel.OverlayModel.hideDOMNodeHighlight(),this.linkifier&&this.linkifier.dispose()}static async buildObjectPopover(e,t){const i=r.StringUtilities.trimEndWithMaxLength(e.description||"",ne);let o=null;if("function"===e.type||"object"===e.type){let s=null,r=!1;if("node"===e.subtype&&(a.OverlayModel.OverlayModel.highlightObjectAsDOMNode(e),r=!0),e.customPreview()){const t=new q(e);t.expandIfPossible(),o=t.element}else{o=document.createElement("div"),o.classList.add("object-popover-content"),t.registerCSSFiles([P,ee]);const n=o.createChild("div","object-popover-title");"function"===e.type?(n.classList.add("source-code"),n.appendChild(R.valueElementForFunctionDescription(e.description))):(n.classList.add("monospace"),n.createChild("span").textContent=i),s=new m.Linkifier.Linkifier;const r=new R(e,"",s,!0);r.element.classList.add("object-popover-tree"),r.titleLessMode(),o.appendChild(r.element)}return o.dataset.stableNameForTest="object-popover-content",t.setMaxContentSize(new n.Geometry.Size(300,250)),t.setSizeBehavior("SetExactSize"),t.contentElement.appendChild(o),new te(s,r)}o=document.createElement("span"),o.dataset.stableNameForTest="object-popover-content",t.registerCSSFiles([P,ee]);const s=o.createChild("span","monospace object-value-"+e.type);return s.style.whiteSpace="pre","string"===e.type?n.UIUtils.createTextChildren(s,`"${i}"`):s.textContent=i,t.contentElement.appendChild(o),new te(null,!1)}}const ne=1e4;var ie=Object.freeze({__proto__:null,ObjectPopoverHelper:te});export{Z as CustomPreviewComponent,j as JavaScriptREPL,ie as ObjectPopoverHelper,G as ObjectPropertiesSection,w as RemoteObjectPreviewFormatter};

package/dist/third-party/front_end/ui/legacy/components/perf_ui/perf_ui-legacy.js

@@ -0,0 +1 @@
+import*as e from"./perf_ui.js";self.PerfUI=self.PerfUI||{},PerfUI=PerfUI||{},PerfUI.ChartViewport=e.ChartViewport.ChartViewport,PerfUI.FilmStripView=e.FilmStripView.FilmStripView,PerfUI.FilmStripView.Events=e.FilmStripView.Events,PerfUI.FilmStripView.Modes=e.FilmStripView.Modes,PerfUI.FilmStripView.Dialog=e.FilmStripView.Dialog,PerfUI.FlameChart=e.FlameChart.FlameChart,PerfUI.FlameChart.HeaderHeight=e.FlameChart.HeaderHeight,PerfUI.FlameChart.TimelineData=e.FlameChart.TimelineData,PerfUI.FlameChart.Events=e.FlameChart.Events,PerfUI.FlameChartDelegate=e.FlameChart.FlameChartDelegate,PerfUI.FlameChartDataProvider=e.FlameChart.FlameChartDataProvider,PerfUI.FlameChartMarker=e.FlameChart.FlameChartMarker,PerfUI.GCActionDelegate=e.GCActionDelegate.GCActionDelegate,PerfUI.LineLevelProfile={},PerfUI.LineLevelProfile.Performance=e.LineLevelProfile.Performance,PerfUI.LineLevelProfile.LineDecorator=e.LineLevelProfile.LineDecorator,PerfUI.LiveHeapProfile=e.LiveHeapProfile.LiveHeapProfile,PerfUI.uiLabelForNetworkPriority=e.NetworkPriorities.uiLabelForNetworkPriority,PerfUI.uiLabelToNetworkPriority=e.NetworkPriorities.uiLabelToNetworkPriority,PerfUI.networkPriorityWeight=e.NetworkPriorities.networkPriorityWeight,PerfUI.OverviewGrid=e.OverviewGrid.OverviewGrid,PerfUI.OverviewGrid.Window=e.OverviewGrid.Window,PerfUI.OverviewGrid.Events=e.OverviewGrid.Events,PerfUI.TimelineGrid=e.TimelineGrid.TimelineGrid,PerfUI.TimelineGrid.Calculator=e.TimelineGrid.Calculator,PerfUI.TimelineOverviewPane=e.TimelineOverviewPane.TimelineOverviewPane,PerfUI.TimelineOverviewPane.Events=e.TimelineOverviewPane.Events,PerfUI.TimelineOverviewBase=e.TimelineOverviewPane.TimelineOverviewBase,PerfUI.TimelineOverview=e.TimelineOverviewPane.TimelineOverview;

package/dist/third-party/front_end/ui/legacy/components/perf_ui/perf_ui-meta.js

@@ -0,0 +1 @@
+import*as e from"../../../../core/common/common.js";import*as t from"../../../../core/i18n/i18n.js";import*as o from"../../../../core/root/root.js";import*as i from"../../legacy.js";const n={flamechartMouseWheelAction:"Flamechart mouse wheel action:",scroll:"Scroll",zoom:"Zoom",liveMemoryAllocationAnnotations:"Live memory allocation annotations",showLiveMemoryAllocation:"Show live memory allocation annotations",hideLiveMemoryAllocation:"Hide live memory allocation annotations",collectGarbage:"Collect garbage"},a=t.i18n.registerUIStrings("ui/legacy/components/perf_ui/perf_ui-meta.ts",n),l=t.i18n.getLazilyComputedLocalizedString.bind(void 0,a);let r;i.ActionRegistration.registerActionExtension({actionId:"components.collect-garbage",category:i.ActionRegistration.ActionCategory.PERFORMANCE,title:l(n.collectGarbage),iconClass:"bin",loadActionDelegate:async()=>(await async function(){return r||(r=await import("./perf_ui.js")),r}()).GCActionDelegate.GCActionDelegate.instance()}),e.Settings.registerSettingExtension({category:e.Settings.SettingCategory.PERFORMANCE,storageType:e.Settings.SettingStorageType.Synced,title:l(n.flamechartMouseWheelAction),settingName:"flamechartMouseWheelAction",settingType:e.Settings.SettingType.ENUM,defaultValue:"zoom",options:[{title:l(n.scroll),text:l(n.scroll),value:"scroll"},{title:l(n.zoom),text:l(n.zoom),value:"zoom"}]}),e.Settings.registerSettingExtension({category:e.Settings.SettingCategory.MEMORY,experiment:o.Runtime.ExperimentName.LIVE_HEAP_PROFILE,title:l(n.liveMemoryAllocationAnnotations),settingName:"memoryLiveHeapProfile",settingType:e.Settings.SettingType.BOOLEAN,defaultValue:!1,options:[{value:!0,title:l(n.showLiveMemoryAllocation)},{value:!1,title:l(n.hideLiveMemoryAllocation)}]});