ember-native-devtools 1.0.2

package/download/chrome-devtools-frontend.appspot.com/serve_file/@abb728f8afc6a86cc66b1313f5056728ce422ddd/panels/emulation/components/components.js

@@ -0,0 +1,39 @@
+import*as e from"../../../models/emulation/emulation.js";import*as t from"../../../ui/legacy/legacy.js";import*as i from"../../../ui/lit-html/lit-html.js";import*as s from"../../../ui/visual_logging/visual_logging.js";class l extends Event{size;static eventName="sizechanged";constructor(e){super(l.eventName),this.size=e}}function a(e){return Number(e.target.value)}class n extends HTMLElement{#e=this.attachShadow({mode:"open"});#t=!1;#i="0";#s="";#l;#a;static litTagName=i.literal`device-mode-emulation-size-input`;constructor(e,{jslogContext:t}){super(),this.#l=e,this.#a=t}connectedCallback(){this.render()}set disabled(e){this.#t=e,this.render()}set size(e){this.#i=e,this.render()}set placeholder(e){this.#s=e,this.render()}render(){i.render(i.html`
+      <style>
+        input {
+          /*
+           * 4 characters for the maximum size of the value,
+           * 2 characters for the width of the step-buttons,
+           * 2 pixels padding between the characters and the
+           * step-buttons.
+           */
+          width: calc(4ch + 2ch + 2px);
+          max-height: 18px;
+          border: var(--sys-color-neutral-outline);
+          border-radius: 4px;
+          margin: 0 2px;
+          text-align: center;
+          font-size: inherit;
+          font-family: inherit;
+        }
+
+        input:disabled {
+          user-select: none;
+        }
+
+        input:focus::-webkit-input-placeholder {
+          color: transparent;
+        }
+      </style>
+      <input type="number"
+             max=${e.DeviceModeModel.MaxDeviceSize}
+             min=${e.DeviceModeModel.MinDeviceSize}
+             jslog=${s.textField().track({change:!0}).context(this.#a)}
+             maxlength="4"
+             title=${this.#l}
+             placeholder=${this.#s}
+             ?disabled=${this.#t}
+             .value=${this.#i}
+             @change=${this.#n}
+             @keydown=${this.#o} />
+    `,this.#e,{host:this})}#n(e){this.dispatchEvent(new l(a(e)))}#o(i){let s=t.UIUtils.modifiedFloatNumber(a(i),i);null!==s&&(s=Math.min(s,e.DeviceModeModel.MaxDeviceSize),s=Math.max(s,e.DeviceModeModel.MinDeviceSize),i.preventDefault(),i.target.value=String(s),this.dispatchEvent(new l(s)))}}customElements.define("device-mode-emulation-size-input",n);var o=Object.freeze({__proto__:null,SizeInputElement:n});export{o as DeviceSizeInputElement};

package/download/chrome-devtools-frontend.appspot.com/serve_file/@abb728f8afc6a86cc66b1313f5056728ce422ddd/panels/emulation/emulation.js

@@ -0,0 +1 @@
+import*as e from"../../core/host/host.js";import*as t from"../../ui/legacy/legacy.js";import*as i from"../../ui/legacy/theme_support/theme_support.js";import*as o from"../../core/root/root.js";import*as s from"../../core/sdk/sdk.js";import*as n from"../../models/emulation/emulation.js";import*as r from"../../core/common/common.js";import*as a from"../../core/i18n/i18n.js";import*as d from"../../core/platform/platform.js";import*as l from"../../ui/visual_logging/visual_logging.js";import*as c from"../mobile_throttling/mobile_throttling.js";import*as h from"./components/components.js";import*as m from"../../models/bindings/bindings.js";var p={cssContent:".device-mode-x{margin:0 1px;font-size:16px}.device-mode-empty-toolbar-element{width:0}\n/*# sourceURL=deviceModeToolbar.css */\n"};const u={dimensions:"Dimensions",width:"Width",heightLeaveEmptyForFull:"Height (leave empty for full)",zoom:"Zoom",devicePixelRatio:"Device pixel ratio",deviceType:"Device type",experimentalWebPlatformFeature:'"`Experimental Web Platform Feature`" flag is enabled. Click to disable it.',experimentalWebPlatformFeatureFlag:'"`Experimental Web Platform Feature`" flag is disabled. Click to enable it.',moreOptions:"More options",fitToWindowF:"Fit to window ({PH1}%)",autoadjustZoom:"Auto-adjust zoom",defaultF:"Default: {PH1}",hideDeviceFrame:"Hide device frame",showDeviceFrame:"Show device frame",hideMediaQueries:"Hide media queries",showMediaQueries:"Show media queries",hideRulers:"Hide rulers",showRulers:"Show rulers",removeDevicePixelRatio:"Remove device pixel ratio",addDevicePixelRatio:"Add device pixel ratio",removeDeviceType:"Remove device type",addDeviceType:"Add device type",resetToDefaults:"Reset to defaults",closeDevtools:"Close DevTools",responsive:"Responsive",edit:"Edit…",portrait:"Portrait",landscape:"Landscape",rotate:"Rotate",none:"None",screenOrientationOptions:"Screen orientation options",toggleDualscreenMode:"Toggle dual-screen mode",devicePosture:"Device posture"},g=a.i18n.registerUIStrings("panels/emulation/DeviceModeToolbar.ts",u),v=a.i18n.getLocalizedString.bind(void 0,g);function b(e,t){e.setTitle(t),e.element.title=t}class S{model;showMediaInspectorSetting;showRulersSetting;deviceOutlineSetting;showDeviceScaleFactorSetting;showUserAgentTypeSetting;autoAdjustScaleSetting;lastMode;elementInternal;emulatedDevicesList;persistenceSetting;spanButton;postureItem;modeButton;widthInput;heightInput;deviceScaleItem;deviceSelectItem;scaleItem;uaItem;experimentalButton;cachedDeviceScale;cachedUaType;xItem;throttlingConditionsItem;cachedModelType;cachedScale;cachedModelDevice;cachedModelMode;constructor(e,i,o){this.model=e,this.showMediaInspectorSetting=i,this.showRulersSetting=o,this.deviceOutlineSetting=this.model.deviceOutlineSetting(),this.showDeviceScaleFactorSetting=r.Settings.Settings.instance().createSetting("emulation.show-device-scale-factor",!1),this.showDeviceScaleFactorSetting.addChangeListener(this.updateDeviceScaleFactorVisibility,this),this.showUserAgentTypeSetting=r.Settings.Settings.instance().createSetting("emulation.show-user-agent-type",!1),this.showUserAgentTypeSetting.addChangeListener(this.updateUserAgentTypeVisibility,this),this.autoAdjustScaleSetting=r.Settings.Settings.instance().createSetting("emulation.auto-adjust-scale",!0),this.lastMode=new Map,this.elementInternal=document.createElement("div"),this.elementInternal.classList.add("device-mode-toolbar"),this.elementInternal.setAttribute("jslog",`${l.toolbar("device-mode").track({resize:!0})}`);const s=this.elementInternal.createChild("div","device-mode-toolbar-spacer");s.createChild("div","device-mode-toolbar-spacer");const a=new t.Toolbar.Toolbar("",s);this.fillLeftToolbar(a);const d=new t.Toolbar.Toolbar("",this.elementInternal);d.makeWrappable(),this.widthInput=new h.DeviceSizeInputElement.SizeInputElement(v(u.width),{jslogContext:"width"}),this.widthInput.addEventListener("sizechanged",(({size:e})=>{this.autoAdjustScaleSetting.get()?this.model.setWidthAndScaleToFit(e):this.model.setWidth(e)})),this.heightInput=new h.DeviceSizeInputElement.SizeInputElement(v(u.heightLeaveEmptyForFull),{jslogContext:"height"}),this.heightInput.addEventListener("sizechanged",(({size:e})=>{this.autoAdjustScaleSetting.get()?this.model.setHeightAndScaleToFit(e):this.model.setHeight(e)})),this.fillMainToolbar(d);const c=this.elementInternal.createChild("div","device-mode-toolbar-spacer"),m=new t.Toolbar.Toolbar("device-mode-toolbar-fixed-size",c);m.makeWrappable(),this.fillRightToolbar(m);const p=new t.Toolbar.Toolbar("device-mode-toolbar-fixed-size",c);p.makeWrappable(),this.fillModeToolbar(p),c.createChild("div","device-mode-toolbar-spacer");const g=new t.Toolbar.Toolbar("device-mode-toolbar-options",c);function b(){const t=e.toolbarControlsEnabledSetting().get();a.setEnabled(t),d.setEnabled(t),m.setEnabled(t),p.setEnabled(t),g.setEnabled(t)}g.makeWrappable(),this.fillOptionsToolbar(g),this.emulatedDevicesList=n.EmulatedDevices.EmulatedDevicesList.instance(),this.emulatedDevicesList.addEventListener("CustomDevicesUpdated",this.deviceListChanged,this),this.emulatedDevicesList.addEventListener("StandardDevicesUpdated",this.deviceListChanged,this),this.persistenceSetting=r.Settings.Settings.instance().createSetting("emulation.device-mode-value",{device:"",orientation:"",mode:""}),this.model.toolbarControlsEnabledSetting().addChangeListener(b),b()}createEmptyToolbarElement(){const e=document.createElement("div");return e.classList.add("device-mode-empty-toolbar-element"),e}fillLeftToolbar(e){e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.deviceSelectItem=new t.Toolbar.ToolbarMenuButton(this.appendDeviceMenuItems.bind(this),void 0,void 0,"device"),this.deviceSelectItem.turnShrinkable(),this.deviceSelectItem.setDarkText(),e.appendToolbarItem(this.deviceSelectItem)}fillMainToolbar(e){e.appendToolbarItem(new t.Toolbar.ToolbarItem(this.widthInput));const i=document.createElement("div");i.classList.add("device-mode-x"),i.textContent="×",this.xItem=this.wrapToolbarItem(i),e.appendToolbarItem(this.xItem),e.appendToolbarItem(new t.Toolbar.ToolbarItem(this.heightInput))}fillRightToolbar(e){e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.scaleItem=new t.Toolbar.ToolbarMenuButton(this.appendScaleMenuItems.bind(this),void 0,void 0,"scale"),b(this.scaleItem,v(u.zoom)),this.scaleItem.setDarkText(),e.appendToolbarItem(this.scaleItem),e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.deviceScaleItem=new t.Toolbar.ToolbarMenuButton(this.appendDeviceScaleMenuItems.bind(this),void 0,void 0,"device-pixel-ratio"),this.deviceScaleItem.setVisible(this.showDeviceScaleFactorSetting.get()),b(this.deviceScaleItem,v(u.devicePixelRatio)),this.deviceScaleItem.setDarkText(),e.appendToolbarItem(this.deviceScaleItem),e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.uaItem=new t.Toolbar.ToolbarMenuButton(this.appendUserAgentMenuItems.bind(this),void 0,void 0,"device-type"),this.uaItem.setVisible(this.showUserAgentTypeSetting.get()),b(this.uaItem,v(u.deviceType)),this.uaItem.setDarkText(),e.appendToolbarItem(this.uaItem),this.throttlingConditionsItem=c.ThrottlingManager.throttlingManager().createMobileThrottlingButton(),e.appendToolbarItem(this.throttlingConditionsItem)}fillModeToolbar(e){e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.modeButton=new t.Toolbar.ToolbarButton("","screen-rotation",void 0,"screen-rotation"),this.modeButton.addEventListener("Click",this.modeMenuClicked,this),e.appendToolbarItem(this.modeButton),this.spanButton=new t.Toolbar.ToolbarButton("","device-fold",void 0,"device-fold"),this.spanButton.addEventListener("Click",this.spanClicked,this),e.appendToolbarItem(this.spanButton),e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement())),this.postureItem=new t.Toolbar.ToolbarMenuButton(this.appendDevicePostureItems.bind(this),void 0,void 0,"device-posture"),this.postureItem.setDarkText(),b(this.postureItem,v(u.devicePosture)),e.appendToolbarItem(this.postureItem),this.createExperimentalButton(e)}createExperimentalButton(e){e.appendToolbarItem(new t.Toolbar.ToolbarSeparator(!0));const i=this.model.webPlatformExperimentalFeaturesEnabled()?v(u.experimentalWebPlatformFeature):v(u.experimentalWebPlatformFeatureFlag);this.experimentalButton=new t.Toolbar.ToolbarToggle(i,"experiment-check"),this.experimentalButton.setToggled(this.model.webPlatformExperimentalFeaturesEnabled()),this.experimentalButton.setEnabled(!0),this.experimentalButton.addEventListener("Click",this.experimentalClicked,this),e.appendToolbarItem(this.experimentalButton)}experimentalClicked(){e.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab("chrome://flags/#enable-experimental-web-platform-features")}fillOptionsToolbar(e){e.appendToolbarItem(this.wrapToolbarItem(this.createEmptyToolbarElement()));const i=new t.Toolbar.ToolbarMenuButton(this.appendOptionsMenuItems.bind(this),void 0,void 0,"more-options");b(i,v(u.moreOptions)),e.appendToolbarItem(i)}appendDevicePostureItems(e){for(const t of["Continuous","Folded"])e.defaultSection().appendCheckboxItem(t,this.spanClicked.bind(this),{checked:t===this.currentDevicePosture(),jslogContext:t.toLowerCase()})}currentDevicePosture(){const e=this.model.mode();return!e||e.orientation!==n.EmulatedDevices.VerticalSpanned&&e.orientation!==n.EmulatedDevices.HorizontalSpanned?"Continuous":"Folded"}appendScaleMenuItems(e){this.model.type()===n.DeviceModeModel.Type.Device&&e.footerSection().appendItem(v(u.fitToWindowF,{PH1:this.getPrettyFitZoomPercentage()}),this.onScaleMenuChanged.bind(this,this.model.fitScale()),{jslogContext:"fit-to-window"}),e.footerSection().appendCheckboxItem(v(u.autoadjustZoom),this.onAutoAdjustScaleChanged.bind(this),{checked:this.autoAdjustScaleSetting.get(),jslogContext:"auto-adjust-zoom"});const t=function(t,i){e.defaultSection().appendCheckboxItem(t,this.onScaleMenuChanged.bind(this,i),{checked:this.model.scaleSetting().get()===i,jslogContext:t})}.bind(this);t("50%",.5),t("75%",.75),t("100%",1),t("125%",1.25),t("150%",1.5),t("200%",2)}onScaleMenuChanged(e){this.model.scaleSetting().set(e)}onAutoAdjustScaleChanged(){this.autoAdjustScaleSetting.set(!this.autoAdjustScaleSetting.get())}appendDeviceScaleMenuItems(e){const t=this.model.deviceScaleFactorSetting(),i="Mobile"===this.model.uaSetting().get()||"Mobile (no touch)"===this.model.uaSetting().get()?n.DeviceModeModel.defaultMobileScaleFactor:window.devicePixelRatio;function o(e,i,o,s){e.appendCheckboxItem(i,t.set.bind(t,o),{checked:t.get()===o,jslogContext:s})}o(e.headerSection(),v(u.defaultF,{PH1:i}),0,"dpr-default"),o(e.defaultSection(),"1",1,"dpr-1"),o(e.defaultSection(),"2",2,"dpr-2"),o(e.defaultSection(),"3",3,"dpr-3")}appendUserAgentMenuItems(e){const t=this.model.uaSetting();function i(i,o){e.defaultSection().appendCheckboxItem(i,t.set.bind(t,o),{checked:t.get()===o,jslogContext:d.StringUtilities.toKebabCase(o)})}i("Mobile","Mobile"),i("Mobile (no touch)","Mobile (no touch)"),i("Desktop","Desktop"),i("Desktop (touch)","Desktop (touch)")}appendOptionsMenuItems(t){const i=this.model;function o(e,t,o,s,r,a){void 0===r&&(r=i.type()===n.DeviceModeModel.Type.None);const d=t.get(),l=`${a}-${d?"disable":"enable"}`;e.appendItem(d?o:s,t.set.bind(t,!t.get()),{disabled:r,jslogContext:l})}o(t.headerSection(),this.deviceOutlineSetting,v(u.hideDeviceFrame),v(u.showDeviceFrame),i.type()!==n.DeviceModeModel.Type.Device,"device-frame"),o(t.headerSection(),this.showMediaInspectorSetting,v(u.hideMediaQueries),v(u.showMediaQueries),void 0,"media-queries"),o(t.headerSection(),this.showRulersSetting,v(u.hideRulers),v(u.showRulers),void 0,"rulers"),o(t.defaultSection(),this.showDeviceScaleFactorSetting,v(u.removeDevicePixelRatio),v(u.addDevicePixelRatio),void 0,"device-pixel-ratio"),o(t.defaultSection(),this.showUserAgentTypeSetting,v(u.removeDeviceType),v(u.addDeviceType),void 0,"device-type"),t.appendItemsAtLocation("deviceModeMenu"),t.footerSection().appendItem(v(u.resetToDefaults),this.reset.bind(this),{jslogContext:"reset-to-defaults"}),t.footerSection().appendItem(v(u.closeDevtools),e.InspectorFrontendHost.InspectorFrontendHostInstance.closeWindow.bind(e.InspectorFrontendHost.InspectorFrontendHostInstance),{jslogContext:"close-dev-tools"})}reset(){this.deviceOutlineSetting.set(!1),this.showDeviceScaleFactorSetting.set(!1),this.showUserAgentTypeSetting.set(!1),this.showMediaInspectorSetting.set(!1),this.showRulersSetting.set(!1),this.model.reset()}wrapToolbarItem(e){const i=document.createElement("div");return t.UIUtils.createShadowRootWithCoreStyles(i,{cssFile:p,delegatesFocus:void 0}).appendChild(e),new t.Toolbar.ToolbarItem(i)}emulateDevice(e){const t=this.autoAdjustScaleSetting.get()?void 0:this.model.scaleSetting().get();this.model.emulate(n.DeviceModeModel.Type.Device,e,this.lastMode.get(e)||e.modes[0],t)}switchToResponsive(){this.model.emulate(n.DeviceModeModel.Type.Responsive,null,null)}filterDevices(e){return(e=e.filter((function(e){return e.show()}))).sort(n.EmulatedDevices.EmulatedDevice.deviceComparator),e}standardDevices(){return this.filterDevices(this.emulatedDevicesList.standard())}customDevices(){return this.filterDevices(this.emulatedDevicesList.custom())}allDevices(){return this.standardDevices().concat(this.customDevices())}appendDeviceMenuItems(e){function t(t){if(!t.length)return;const i=e.section();for(const e of t)i.appendCheckboxItem(e.title,this.emulateDevice.bind(this,e),{checked:this.model.device()===e,jslogContext:d.StringUtilities.toKebabCase(e.title)})}e.headerSection().appendCheckboxItem(v(u.responsive),this.switchToResponsive.bind(this),{checked:this.model.type()===n.DeviceModeModel.Type.Responsive,jslogContext:"responsive"}),t.call(this,this.standardDevices()),t.call(this,this.customDevices()),e.footerSection().appendItem(v(u.edit),this.emulatedDevicesList.revealCustomSetting.bind(this.emulatedDevicesList),{jslogContext:"edit"})}deviceListChanged(){const e=this.model.device();if(!e)return;const t=this.allDevices();-1===t.indexOf(e)?t.length?this.emulateDevice(t[0]):this.model.emulate(n.DeviceModeModel.Type.Responsive,null,null):this.emulateDevice(e)}updateDeviceScaleFactorVisibility(){this.deviceScaleItem&&this.deviceScaleItem.setVisible(this.showDeviceScaleFactorSetting.get())}updateUserAgentTypeVisibility(){this.uaItem&&this.uaItem.setVisible(this.showUserAgentTypeSetting.get())}spanClicked(){const e=this.model.device();if(!e||!e.isDualScreen&&!e.isFoldableScreen)return;const t=this.autoAdjustScaleSetting.get()?void 0:this.model.scaleSetting().get(),i=this.model.mode();if(!i)return;const o=e.getSpanPartner(i);o&&this.model.emulate(this.model.type(),e,o,t)}modeMenuClicked(e){const i=this.model.device(),o=this.model,s=this.autoAdjustScaleSetting;if(o.type()===n.DeviceModeModel.Type.Responsive){const e=o.appliedDeviceSize();return void(s.get()?o.setSizeAndScaleToFit(e.height,e.width):(o.setWidth(e.height),o.setHeight(e.width)))}if(!i)return;if((i.isDualScreen||i.isFoldableScreen||2===i.modes.length)&&i.modes[0].orientation!==i.modes[1].orientation){const e=s.get()?void 0:o.scaleSetting().get(),t=o.mode();if(!t)return;const n=i.getRotationPartner(t);if(!n)return;return void o.emulate(o.type(),o.device(),n,e)}if(!this.modeButton)return;const r=new t.ContextMenu.ContextMenu(e.data,{useSoftMenu:!1,x:this.modeButton.element.getBoundingClientRect().left,y:this.modeButton.element.getBoundingClientRect().top+this.modeButton.element.offsetHeight});function a(e,t){if(!i)return;const o=i.modesForOrientation(e);if(o.length)if(1===o.length)d(o[0],t);else for(let e=0;e<o.length;e++)d(o[e],t+" – "+o[e].title)}function d(e,t){r.defaultSection().appendCheckboxItem(t,l.bind(null,e),{checked:o.mode()===e,jslogContext:"device-mode"})}function l(e){const t=s.get()?void 0:o.scaleSetting().get();o.emulate(o.type(),o.device(),e,t)}a(n.EmulatedDevices.Vertical,v(u.portrait)),a(n.EmulatedDevices.Horizontal,v(u.landscape)),r.show()}getPrettyFitZoomPercentage(){return`${(100*this.model.fitScale()).toFixed(0)}`}getPrettyZoomPercentage(){return`${(100*this.model.scale()).toFixed(0)}`}element(){return this.elementInternal}update(){this.model.type()!==this.cachedModelType&&(this.cachedModelType=this.model.type(),this.widthInput.disabled=this.model.type()!==n.DeviceModeModel.Type.Responsive,this.heightInput.disabled=this.model.type()!==n.DeviceModeModel.Type.Responsive,this.deviceScaleItem.setEnabled(this.model.type()===n.DeviceModeModel.Type.Responsive),this.uaItem.setEnabled(this.model.type()===n.DeviceModeModel.Type.Responsive),this.model.type()===n.DeviceModeModel.Type.Responsive?(this.modeButton.setEnabled(!0),b(this.modeButton,v(u.rotate))):this.modeButton.setEnabled(!1));const e=this.model.appliedDeviceSize();this.widthInput.size=String(e.width),this.heightInput.size=this.model.type()===n.DeviceModeModel.Type.Responsive&&this.model.isFullHeight()?"":String(e.height),this.heightInput.placeholder=String(e.height),this.model.scale()!==this.cachedScale&&(this.scaleItem.setText(`${this.getPrettyZoomPercentage()}%`),this.cachedScale=this.model.scale());const t=this.model.appliedDeviceScaleFactor();t!==this.cachedDeviceScale&&(this.deviceScaleItem.setText(`DPR: ${t.toFixed(1)}`),this.cachedDeviceScale=t);const i=this.model.appliedUserAgentType();i!==this.cachedUaType&&(this.uaItem.setText(i),this.cachedUaType=i);let o=v(u.none);this.model.type()===n.DeviceModeModel.Type.Responsive&&(o=v(u.responsive));const s=this.model.device();if(this.model.type()===n.DeviceModeModel.Type.Device&&s&&(o=s.title),this.deviceSelectItem.setText(`${v(u.dimensions)}: ${o}`),this.model.device()!==this.cachedModelDevice){const e=this.model.device();if(e){const t=e?e.modes.length:0;this.modeButton.setEnabled(t>=2),b(this.modeButton,v(2===t?u.rotate:u.screenOrientationOptions))}this.cachedModelDevice=e}if(this.experimentalButton){const e=this.model.device();e&&(e.isDualScreen||e.isFoldableScreen)?(e.isDualScreen?(this.spanButton.setVisible(!0),this.postureItem.setVisible(!1)):e.isFoldableScreen&&(this.spanButton.setVisible(!1),this.postureItem.setVisible(!0),this.postureItem.setText(this.currentDevicePosture())),this.experimentalButton.setVisible(!0)):(this.spanButton.setVisible(!1),this.postureItem.setVisible(!1),this.experimentalButton.setVisible(!1)),b(this.spanButton,v(u.toggleDualscreenMode))}if(this.model.type()===n.DeviceModeModel.Type.Device&&this.lastMode.set(this.model.device(),this.model.mode()),this.model.mode()!==this.cachedModelMode&&this.model.type()!==n.DeviceModeModel.Type.None){this.cachedModelMode=this.model.mode();const e=this.persistenceSetting.get(),t=this.model.device();if(t){e.device=t.title;const i=this.model.mode();e.orientation=i?i.orientation:"",e.mode=i?i.title:""}else e.device="",e.orientation="",e.mode="";this.persistenceSetting.set(e)}}restore(){for(const e of this.allDevices())if(e.title===this.persistenceSetting.get().device)for(const t of e.modes)if(t.orientation===this.persistenceSetting.get().orientation&&t.title===this.persistenceSetting.get().mode)return this.lastMode.set(e,t),void this.emulateDevice(e);this.model.emulate(n.DeviceModeModel.Type.Responsive,null,null)}}var f=Object.freeze({__proto__:null,DeviceModeToolbar:S}),w={cssContent:":host{overflow:hidden;align-items:stretch;flex:auto;background-color:var(--app-color-toolbar-background)}.device-mode-toolbar{flex:none;background-color:var(--app-color-toolbar-background);border-bottom:1px solid var(--sys-color-divider);display:flex;flex-direction:row;align-items:stretch}.device-mode-toolbar .toolbar{overflow:hidden;flex:0 100000 auto;padding:0 5px}.device-mode-toolbar .toolbar.device-mode-toolbar-fixed-size{flex:0 1 auto}.device-mode-toolbar-options.toolbar{position:sticky;right:0;flex:none}.device-mode-toolbar-spacer{flex:1 1 0;display:flex;flex-direction:row;overflow:hidden}.device-mode-content-clip{overflow:hidden;flex:auto}.device-mode-media-container{flex:none;overflow:hidden;box-shadow:inset 0 -1px var(--sys-color-divider)}.device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-media-container{margin-bottom:20px}.device-mode-presets-container{flex:0 0 20px;display:flex}.device-mode-presets-container-inner{flex:auto;justify-content:center;position:relative;background-color:var(--sys-color-surface1);border-bottom:1px solid var(--sys-color-divider)}.device-mode-presets-container:hover{transition:opacity 0.1s;transition-delay:50ms;opacity:100%}.device-mode-preset-bar-outer{pointer-events:none;display:flex;justify-content:center}.device-mode-preset-bar{border-left:2px solid var(--sys-color-on-base-divider);border-right:2px solid var(--sys-color-on-base-divider);pointer-events:auto;text-align:center;flex:none;color:var(--sys-color-on-surface);display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-bottom:1px}.device-mode-preset-bar:hover{transition:background-color 0.1s;transition-delay:50ms;background-color:var(--sys-color-state-hover-on-subtle)}.device-mode-preset-bar > span{visibility:hidden}.device-mode-preset-bar:hover > span{transition:visibility 0.1s;transition-delay:50ms;visibility:visible}.device-mode-content-area{flex:auto;position:relative;margin:0}.device-mode-screen-area{position:absolute;left:0;right:0;width:0;height:0;background-color:var(--sys-color-inverse-surface)}.device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area{--override-screen-area-box-shadow:hsl(240deg 3% 84%) 0 0 0 0.5px,hsl(0deg 0% 80%/40%) 0 0 20px;box-shadow:var(--override-screen-area-box-shadow)}.theme-with-dark-background .device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area,\n:host-context(.theme-with-dark-background) .device-mode-content-clip:not(.device-mode-outline-visible) .device-mode-screen-area{--override-screen-area-box-shadow:rgb(40 40 42) 0 0 0 0.5px,rgb(51 51 51/40%) 0 0 20px}.device-mode-screen-image{position:absolute;left:0;top:0;width:100%;height:100%}.device-mode-resizer{position:absolute;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background-color 0.1s ease,opacity 0.1s ease}.device-mode-resizer:hover{background-color:var(--sys-color-state-hover-on-subtle);opacity:100%}.device-mode-resizer > div{pointer-events:none}.device-mode-right-resizer{top:0;bottom:-1px;right:-20px;width:20px}.device-mode-left-resizer{top:0;bottom:-1px;left:-20px;width:20px;opacity:0%}.device-mode-bottom-resizer{left:0;right:-1px;bottom:-20px;height:20px}.device-mode-bottom-right-resizer{left:0;top:0;right:-20px;bottom:-20px;background-color:var(--sys-color-surface1)}.device-mode-bottom-left-resizer{left:-20px;top:0;right:0;bottom:-20px;opacity:0%}.device-mode-right-resizer > div{content:var(--image-file-resizeHorizontal);width:6px;height:26px}.device-mode-left-resizer > div{content:var(--image-file-resizeHorizontal);width:6px;height:26px}.device-mode-bottom-resizer > div{content:var(--image-file-resizeVertical);margin-bottom:-2px;width:26px;height:6px}.device-mode-bottom-right-resizer > div{position:absolute;bottom:3px;right:3px;width:13px;height:13px;content:var(--image-file-resizeDiagonal)}.device-mode-bottom-left-resizer > div{position:absolute;bottom:3px;left:3px;width:13px;height:13px;content:var(--image-file-resizeDiagonal);transform:rotate(90deg)}.device-mode-page-area{position:absolute;left:0;right:0;width:0;height:0;display:flex;background-color:var(--sys-color-cdt-base-container)}.device-mode-ruler{position:absolute;overflow:visible}.device-mode-ruler-top{height:20px;right:0}.device-mode-ruler-left{width:20px;bottom:0}.device-mode-ruler-content{pointer-events:none;position:absolute;left:-20px;top:-20px}.device-mode-ruler-top .device-mode-ruler-content{border-top:1px solid transparent;right:0;bottom:20px;background-color:var(--sys-color-cdt-base-container)}.device-mode-ruler-left .device-mode-ruler-content{border-left:1px solid transparent;border-top:1px solid transparent;right:20px;bottom:0}.device-mode-content-clip.device-mode-outline-visible .device-mode-ruler-top .device-mode-ruler-content{border-top:1px solid var(--sys-color-token-subtle)}.device-mode-content-clip.device-mode-outline-visible .device-mode-ruler-left .device-mode-ruler-content{border-left:1px solid var(--sys-color-token-subtle);border-top:1px solid var(--sys-color-token-subtle)}.device-mode-ruler-inner{position:absolute}.device-mode-ruler-top .device-mode-ruler-inner{top:0;bottom:0;left:20px;right:0;border-bottom:1px solid var(--sys-color-token-subtle)}.device-mode-ruler-left .device-mode-ruler-inner{left:0;right:0;top:19px;bottom:0;border-right:1px solid var(--sys-color-token-subtle);background-color:var(--sys-color-cdt-base-container)}.device-mode-ruler-marker{position:absolute}.device-mode-ruler-top .device-mode-ruler-marker{width:0;height:5px;bottom:0;border-right:1px solid var(--sys-color-token-subtle);margin-right:-1px}.device-mode-ruler-top .device-mode-ruler-marker.device-mode-ruler-marker-medium{height:10px}.device-mode-ruler-top .device-mode-ruler-marker.device-mode-ruler-marker-large{height:15px}.device-mode-ruler-left .device-mode-ruler-marker{height:0;width:5px;right:0;border-bottom:1px solid var(--sys-color-token-subtle);margin-bottom:-1px}.device-mode-ruler-left .device-mode-ruler-marker.device-mode-ruler-marker-medium{width:10px}.device-mode-ruler-left .device-mode-ruler-marker.device-mode-ruler-marker-large{width:15px}.device-mode-ruler-text{color:var(--sys-color-token-subtle);position:relative;pointer-events:auto}.device-mode-ruler-text:hover{color:var(--sys-color-on-surface)}.device-mode-ruler-top .device-mode-ruler-text{left:2px;top:-2px}.device-mode-ruler-left .device-mode-ruler-text{left:-4px;top:-15px;transform:rotate(270deg)}\n/*# sourceURL=deviceModeView.css */\n"},M={cssContent:".media-inspector-view{height:50px}.media-inspector-marker-container{height:14px;margin:2px 0;position:relative}.media-inspector-bar{display:flex;flex-direction:row;align-items:stretch;pointer-events:none;position:absolute;left:0;right:0;top:0;bottom:0}.media-inspector-marker{flex:none;pointer-events:auto;margin:1px 0;white-space:nowrap;z-index:auto;position:relative}.media-inspector-marker-spacer{flex:auto}.media-inspector-marker:hover{margin:-1px 0;opacity:100%}.media-inspector-marker-min-width{flex:auto;background-color:var(--sys-color-yellow-container);border-right:2px solid var(--sys-color-yellow-bright);border-left:2px solid var(--sys-color-yellow-bright);&:hover{background-color:color-mix(in sRGB,var(--sys-color-yellow-container),var(--sys-color-yellow-bright) 30%)}}.media-inspector-marker-min-width-right{border-left:2px solid var(--sys-color-yellow-bright)}.media-inspector-marker-min-width-left{border-right:2px solid var(--sys-color-yellow-bright)}.media-inspector-marker-min-max-width{background-color:var(--sys-color-tertiary-container);border-left:2px solid var(--sys-color-tertiary);border-right:2px solid var(--sys-color-tertiary)}.media-inspector-marker-min-max-width:hover{z-index:1}.media-inspector-marker-max-width{background-color:var(--sys-color-inverse-primary);border-right:2px solid var(--sys-color-primary-bright);border-left:2px solid var(--sys-color-primary-bright)}.media-inspector-marker-inactive .media-inspector-marker-min-width:not(:hover){background-color:var(--sys-color-surface-yellow)}.media-inspector-marker-inactive .media-inspector-marker-min-max-width:not(:hover){background-color:color-mix(in sRGB,var(--sys-color-tertiary-container),var(--sys-color-cdt-base-container) 30%)}.media-inspector-marker-inactive .media-inspector-marker-max-width:not(:hover){background-color:var(--sys-color-tonal-container)}.media-inspector-marker-label-container{position:absolute;z-index:1}.media-inspector-marker:not(:hover) .media-inspector-marker-label-container{display:none}.media-inspector-marker-label-container-left{left:-2px}.media-inspector-marker-label-container-right{right:-2px}.media-inspector-marker-label{color:var(--sys-color-on-surface);position:absolute;top:1px;bottom:0;font-size:12px;pointer-events:none}.media-inspector-label-right{right:4px}.media-inspector-label-left{left:4px}\n/*# sourceURL=mediaQueryInspector.css */\n"};const x={revealInSourceCode:"Reveal in source code"},I=a.i18n.registerUIStrings("panels/emulation/MediaQueryInspector.ts",x),y=a.i18n.getLocalizedString.bind(void 0,I);class C extends t.Widget.Widget{mediaThrottler;getWidthCallback;setWidthCallback;scale;elementsToMediaQueryModel;elementsToCSSLocations;cssModel;cachedQueryModels;constructor(e,i,o){super(!0),this.registerRequiredCSS(M),this.contentElement.classList.add("media-inspector-view"),this.contentElement.setAttribute("jslog",`${l.mediaInspectorView().track({click:!0})}`),this.contentElement.addEventListener("click",this.onMediaQueryClicked.bind(this),!1),this.contentElement.addEventListener("contextmenu",this.onContextMenu.bind(this),!1),this.mediaThrottler=o,this.getWidthCallback=e,this.setWidthCallback=i,this.scale=1,this.elementsToMediaQueryModel=new WeakMap,this.elementsToCSSLocations=new WeakMap,s.TargetManager.TargetManager.instance().observeModels(s.CSSModel.CSSModel,this),t.ZoomManager.ZoomManager.instance().addEventListener("ZoomChanged",this.renderMediaQueries.bind(this),this)}modelAdded(e){e.target()===s.TargetManager.TargetManager.instance().primaryPageTarget()&&(this.cssModel=e,this.cssModel.addEventListener(s.CSSModel.Events.StyleSheetAdded,this.scheduleMediaQueriesUpdate,this),this.cssModel.addEventListener(s.CSSModel.Events.StyleSheetRemoved,this.scheduleMediaQueriesUpdate,this),this.cssModel.addEventListener(s.CSSModel.Events.StyleSheetChanged,this.scheduleMediaQueriesUpdate,this),this.cssModel.addEventListener(s.CSSModel.Events.MediaQueryResultChanged,this.scheduleMediaQueriesUpdate,this))}modelRemoved(e){e===this.cssModel&&(this.cssModel.removeEventListener(s.CSSModel.Events.StyleSheetAdded,this.scheduleMediaQueriesUpdate,this),this.cssModel.removeEventListener(s.CSSModel.Events.StyleSheetRemoved,this.scheduleMediaQueriesUpdate,this),this.cssModel.removeEventListener(s.CSSModel.Events.StyleSheetChanged,this.scheduleMediaQueriesUpdate,this),this.cssModel.removeEventListener(s.CSSModel.Events.MediaQueryResultChanged,this.scheduleMediaQueriesUpdate,this),delete this.cssModel)}setAxisTransform(e){Math.abs(this.scale-e)<1e-8||(this.scale=e,this.renderMediaQueries())}onMediaQueryClicked(e){const t=e.target.enclosingNodeOrSelfWithClass("media-inspector-bar");if(!t)return;const i=this.elementsToMediaQueryModel.get(t);if(!i)return;const o=i.maxWidthExpression(),s=i.minWidthExpression();if(0===i.section())return void this.setWidthCallback(o&&o.computedLength()||0);if(2===i.section())return void this.setWidthCallback(s&&s.computedLength()||0);const n=this.getWidthCallback();s&&n!==s.computedLength()?this.setWidthCallback(s.computedLength()||0):this.setWidthCallback(o&&o.computedLength()||0)}onContextMenu(e){if(!this.cssModel||!this.cssModel.isEnabled())return;const i=e.target.enclosingNodeOrSelfWithClass("media-inspector-bar");if(!i)return;const o=this.elementsToCSSLocations.get(i)||[],s=new Map;for(let e=0;e<o.length;++e){const t=m.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().rawLocationToUILocation(o[e]);if(!t)continue;const i="number"==typeof t.columnNumber?d.StringUtilities.sprintf("%s:%d:%d",t.uiSourceCode.url(),t.lineNumber+1,t.columnNumber+1):d.StringUtilities.sprintf("%s:%d",t.uiSourceCode.url(),t.lineNumber+1);s.set(i,t)}const n=[...s.keys()].sort(),r=new t.ContextMenu.ContextMenu(e),a=r.defaultSection().appendSubMenuItem(y(x.revealInSourceCode),void 0,"reveal-in-source-list");for(let e=0;e<n.length;++e){const t=n[e];a.defaultSection().appendItem(t,this.revealSourceLocation.bind(this,s.get(t)),{jslogContext:"reveal-in-source"})}r.show()}revealSourceLocation(e){r.Revealer.reveal(e)}scheduleMediaQueriesUpdate(){this.isShowing()&&this.mediaThrottler.schedule(this.refetchMediaQueries.bind(this))}refetchMediaQueries(){return this.isShowing()&&this.cssModel?this.cssModel.getMediaQueries().then(this.rebuildMediaQueries.bind(this)):Promise.resolve()}squashAdjacentEqual(e){const t=[];for(let i=0;i<e.length;++i){const o=t[t.length-1];o&&o.equals(e[i])||t.push(e[i])}return t}rebuildMediaQueries(e){let t=[];for(let i=0;i<e.length;++i){const o=e[i];if(o.mediaList)for(let e=0;e<o.mediaList.length;++e){const i=o.mediaList[e],s=k.createFromMediaQuery(o,i);s&&t.push(s)}}t.sort((function(e,t){return e.compareTo(t)})),t=this.squashAdjacentEqual(t);let i=this.cachedQueryModels&&this.cachedQueryModels.length===t.length;for(let e=0;i&&e<t.length;++e)i=i&&this.cachedQueryModels&&this.cachedQueryModels[e].equals(t[e]);i||(this.cachedQueryModels=t,this.renderMediaQueries())}renderMediaQueries(){if(!this.cachedQueryModels||!this.isShowing())return;const e=[];let t=null;for(const i of this.cachedQueryModels){t&&t.model.dimensionsEqual(i)?t.active=t.active||i.active():(t={active:i.active(),model:i,locations:[]},e.push(t));const o=i.rawLocation();o&&t.locations.push(o)}this.contentElement.removeChildren();let i=null;for(let t=0;t<e.length;++t){t&&e[t].model.section()===e[t-1].model.section()||(i=this.contentElement.createChild("div","media-inspector-marker-container"));const o=e[t],s=this.createElementFromMediaQueryModel(o.model);if(this.elementsToMediaQueryModel.set(s,o.model),this.elementsToCSSLocations.set(s,o.locations),s.classList.toggle("media-inspector-marker-inactive",!o.active),!i)throw new Error("Could not find container to render media queries into.");i.appendChild(s)}}zoomFactor(){return t.ZoomManager.ZoomManager.instance().zoomFactor()/this.scale}wasShown(){super.wasShown(),this.scheduleMediaQueriesUpdate()}createElementFromMediaQueryModel(e){const i=this.zoomFactor(),o=e.minWidthExpression(),s=e.maxWidthExpression(),n=o?(o.computedLength()||0)/i:0,r=s?(s.computedLength()||0)/i:0,a=document.createElement("div");if(a.classList.add("media-inspector-bar"),0===e.section()){a.createChild("div","media-inspector-marker-spacer");const i=a.createChild("div","media-inspector-marker media-inspector-marker-max-width");i.style.width=r+"px",t.Tooltip.Tooltip.install(i,e.mediaText()),d(i,e.maxWidthExpression(),!1,!1),d(i,e.maxWidthExpression(),!0,!0),a.createChild("div","media-inspector-marker-spacer")}if(1===e.section()){a.createChild("div","media-inspector-marker-spacer");const i=a.createChild("div","media-inspector-marker media-inspector-marker-min-max-width");i.style.width=.5*(r-n)+"px",t.Tooltip.Tooltip.install(i,e.mediaText()),d(i,e.maxWidthExpression(),!0,!1),d(i,e.minWidthExpression(),!1,!0),a.createChild("div","media-inspector-marker-spacer").style.flex="0 0 "+n+"px";const o=a.createChild("div","media-inspector-marker media-inspector-marker-min-max-width");o.style.width=.5*(r-n)+"px",t.Tooltip.Tooltip.install(o,e.mediaText()),d(o,e.minWidthExpression(),!0,!1),d(o,e.maxWidthExpression(),!1,!0),a.createChild("div","media-inspector-marker-spacer")}if(2===e.section()){const i=a.createChild("div","media-inspector-marker media-inspector-marker-min-width media-inspector-marker-min-width-left");t.Tooltip.Tooltip.install(i,e.mediaText()),d(i,e.minWidthExpression(),!1,!1),a.createChild("div","media-inspector-marker-spacer").style.flex="0 0 "+n+"px";const o=a.createChild("div","media-inspector-marker media-inspector-marker-min-width media-inspector-marker-min-width-right");t.Tooltip.Tooltip.install(o,e.mediaText()),d(o,e.minWidthExpression(),!0,!0)}function d(e,t,i,o){t&&(e.createChild("div","media-inspector-marker-label-container "+(i?"media-inspector-marker-label-container-left":"media-inspector-marker-label-container-right")).createChild("span","media-inspector-marker-label "+(o?"media-inspector-label-left":"media-inspector-label-right")).textContent=t.value()+t.unit())}return a}}class k{cssMedia;minWidthExpressionInternal;maxWidthExpressionInternal;activeInternal;sectionInternal;rawLocationInternal;constructor(e,t,i,o){this.cssMedia=e,this.minWidthExpressionInternal=t,this.maxWidthExpressionInternal=i,this.activeInternal=o,this.sectionInternal=i&&!t?0:t&&i?1:2}static createFromMediaQuery(e,t){let i=null,o=Number.MAX_VALUE,s=null,n=Number.MIN_VALUE;const r=t.expressions();if(!r)return null;for(let e=0;e<r.length;++e){const t=r[e],a=t.feature();if(-1===a.indexOf("width"))continue;const d=t.computedLength();a.startsWith("max-")&&d&&d<o?(i=t,o=d):a.startsWith("min-")&&d&&d>n&&(s=t,n=d)}return n>o||!i&&!s?null:new k(e,s,i,t.active())}equals(e){return 0===this.compareTo(e)}dimensionsEqual(e){const t=this.minWidthExpression(),i=e.minWidthExpression(),o=this.maxWidthExpression(),s=e.maxWidthExpression(),n=this.section()===e.section(),r=!t||t.computedLength()===i?.computedLength(),a=!o||o.computedLength()===s?.computedLength();return n&&r&&a}compareTo(e){if(this.section()!==e.section())return this.section()-e.section();if(this.dimensionsEqual(e)){const t=this.rawLocation(),i=e.rawLocation();return t||i?t&&!i?1:!t&&i?-1:this.active()!==e.active()?this.active()?-1:1:t&&i?d.StringUtilities.compare(t.url,i.url)||t.lineNumber-i.lineNumber||t.columnNumber-i.columnNumber:0:d.StringUtilities.compare(this.mediaText(),e.mediaText())}const t=this.maxWidthExpression(),i=e.maxWidthExpression(),o=t&&t.computedLength()||0,s=i&&i.computedLength()||0,n=this.minWidthExpression(),r=e.minWidthExpression(),a=n&&n.computedLength()||0,l=r&&r.computedLength()||0;return 0===this.section()?s-o:2===this.section()?a-l:a-l||s-o}section(){return this.sectionInternal}mediaText(){return this.cssMedia.text||""}rawLocation(){return this.rawLocationInternal||(this.rawLocationInternal=this.cssMedia.rawLocation()),this.rawLocationInternal}minWidthExpression(){return this.minWidthExpressionInternal}maxWidthExpression(){return this.maxWidthExpressionInternal}active(){return this.activeInternal}}var T=Object.freeze({__proto__:null,MediaQueryInspector:C,MediaQueryUIModel:k});const E={doubleclickForFullHeight:"Double-click for full height",mobileS:"Mobile S",mobileM:"Mobile M",mobileL:"Mobile L",tablet:"Tablet",laptop:"Laptop",laptopL:"Laptop L"},D=a.i18n.registerUIStrings("panels/emulation/DeviceModeView.ts",E),R=a.i18n.getLocalizedString.bind(void 0,D);class z extends t.Widget.VBox{wrapperInstance;blockElementToWidth;model;mediaInspector;showMediaInspectorSetting;showRulersSetting;topRuler;leftRuler;presetBlocks;responsivePresetsContainer;screenArea;pageArea;outlineImage;contentClip;contentArea;rightResizerElement;leftResizerElement;bottomResizerElement;bottomRightResizerElement;bottomLeftResizerElement;cachedResizable;mediaInspectorContainer;screenImage;toolbar;slowPositionStart;resizeStart;cachedCssScreenRect;cachedCssVisiblePageRect;cachedOutlineRect;cachedMediaInspectorVisible;cachedShowRulers;cachedScale;handleWidth;handleHeight;constructor(){super(!0),this.blockElementToWidth=new WeakMap,this.setMinimumSize(150,150),this.element.classList.add("device-mode-view"),this.registerRequiredCSS(w),this.model=n.DeviceModeModel.DeviceModeModel.instance(),this.model.addEventListener("Updated",this.updateUI,this),this.mediaInspector=new C((()=>this.model.appliedDeviceSize().width),this.model.setWidth.bind(this.model),new r.Throttler.Throttler(0)),this.showMediaInspectorSetting=r.Settings.Settings.instance().moduleSetting("show-media-query-inspector"),this.showMediaInspectorSetting.addChangeListener(this.updateUI,this),this.showRulersSetting=r.Settings.Settings.instance().moduleSetting("emulation.show-rulers"),this.showRulersSetting.addChangeListener(this.updateUI,this),this.topRuler=new L(!0,this.model.setWidthAndScaleToFit.bind(this.model)),this.topRuler.element.classList.add("device-mode-ruler-top"),this.leftRuler=new L(!1,this.model.setHeightAndScaleToFit.bind(this.model)),this.leftRuler.element.classList.add("device-mode-ruler-left"),this.createUI(),t.ZoomManager.ZoomManager.instance().addEventListener("ZoomChanged",this.zoomChanged,this)}createUI(){this.toolbar=new S(this.model,this.showMediaInspectorSetting,this.showRulersSetting),this.contentElement.appendChild(this.toolbar.element()),this.contentClip=this.contentElement.createChild("div","device-mode-content-clip vbox"),this.responsivePresetsContainer=this.contentClip.createChild("div","device-mode-presets-container"),this.responsivePresetsContainer.setAttribute("jslog",`${l.responsivePresets()}`),this.populatePresetsContainer(),this.mediaInspectorContainer=this.contentClip.createChild("div","device-mode-media-container"),this.contentArea=this.contentClip.createChild("div","device-mode-content-area"),this.outlineImage=this.contentArea.createChild("img","device-mode-outline-image hidden fill"),this.outlineImage.addEventListener("load",this.onImageLoaded.bind(this,this.outlineImage,!0),!1),this.outlineImage.addEventListener("error",this.onImageLoaded.bind(this,this.outlineImage,!1),!1),this.screenArea=this.contentArea.createChild("div","device-mode-screen-area"),this.screenImage=this.screenArea.createChild("img","device-mode-screen-image hidden"),this.screenImage.addEventListener("load",this.onImageLoaded.bind(this,this.screenImage,!0),!1),this.screenImage.addEventListener("error",this.onImageLoaded.bind(this,this.screenImage,!1),!1),this.bottomRightResizerElement=this.screenArea.createChild("div","device-mode-resizer device-mode-bottom-right-resizer"),this.bottomRightResizerElement.createChild("div",""),this.createResizer(this.bottomRightResizerElement,2,1),this.bottomLeftResizerElement=this.screenArea.createChild("div","device-mode-resizer device-mode-bottom-left-resizer"),this.bottomLeftResizerElement.createChild("div",""),this.createResizer(this.bottomLeftResizerElement,-2,1),this.rightResizerElement=this.screenArea.createChild("div","device-mode-resizer device-mode-right-resizer"),this.rightResizerElement.createChild("div",""),this.createResizer(this.rightResizerElement,2,0),this.leftResizerElement=this.screenArea.createChild("div","device-mode-resizer device-mode-left-resizer"),this.leftResizerElement.createChild("div",""),this.createResizer(this.leftResizerElement,-2,0),this.bottomResizerElement=this.screenArea.createChild("div","device-mode-resizer device-mode-bottom-resizer"),this.bottomResizerElement.createChild("div",""),this.createResizer(this.bottomResizerElement,0,1),this.bottomResizerElement.addEventListener("dblclick",this.model.setHeight.bind(this.model,0),!1),t.Tooltip.Tooltip.install(this.bottomResizerElement,R(E.doubleclickForFullHeight)),this.pageArea=this.screenArea.createChild("div","device-mode-page-area"),this.pageArea.createChild("slot")}populatePresetsContainer(){const e=[320,375,425,768,1024,1440,2560],t=[R(E.mobileS),R(E.mobileM),R(E.mobileL),R(E.tablet),R(E.laptop),R(E.laptopL),"4K"];this.presetBlocks=[];const i=this.responsivePresetsContainer.createChild("div","device-mode-presets-container-inner");for(let s=e.length-1;s>=0;--s){const n=i.createChild("div","fill device-mode-preset-bar-outer").createChild("div","device-mode-preset-bar");n.createChild("span").textContent=t[s]+" – "+e[s]+"px",n.setAttribute("jslog",`${l.action().track({click:!0}).context(`device-mode-preset-${e[s]}px`)}`),n.addEventListener("click",o.bind(this,e[s]),!1),this.blockElementToWidth.set(n,e[s]),this.presetBlocks.push(n)}function o(e,t){this.model.emulate(n.DeviceModeModel.Type.Responsive,null,null),this.model.setWidthAndScaleToFit(e),t.consume()}}createResizer(e,i,o){const s=new t.ResizerWidget.ResizerWidget;e.setAttribute("jslog",`${l.slider("device-mode-resizer").track({drag:!0})}`),s.addElement(e);let n=i?"ew-resize":"ns-resize";return i*o>0&&(n="nwse-resize"),i*o<0&&(n="nesw-resize"),s.setCursor(n),s.addEventListener("ResizeStart",this.onResizeStart,this),s.addEventListener("ResizeUpdateXY",this.onResizeUpdate.bind(this,i,o)),s.addEventListener("ResizeEnd",this.onResizeEnd,this),s}onResizeStart(){this.slowPositionStart=null;const e=this.model.screenRect();this.resizeStart=new t.Geometry.Size(e.width,e.height)}onResizeUpdate(e,i,o){o.data.shiftKey!==Boolean(this.slowPositionStart)&&(this.slowPositionStart=o.data.shiftKey?{x:o.data.currentX,y:o.data.currentY}:null);let s=o.data.currentX-o.data.startX,r=o.data.currentY-o.data.startY;if(this.slowPositionStart&&(s=(o.data.currentX-this.slowPositionStart.x)/10+this.slowPositionStart.x-o.data.startX,r=(o.data.currentY-this.slowPositionStart.y)/10+this.slowPositionStart.y-o.data.startY),e&&this.resizeStart){const i=s*t.ZoomManager.ZoomManager.instance().zoomFactor();let o=this.resizeStart.width+i*e;o=Math.round(o/this.model.scale()),o>=n.DeviceModeModel.MinDeviceSize&&o<=n.DeviceModeModel.MaxDeviceSize&&this.model.setWidth(o)}if(i&&this.resizeStart){const e=r*t.ZoomManager.ZoomManager.instance().zoomFactor();let o=this.resizeStart.height+e*i;o=Math.round(o/this.model.scale()),o>=n.DeviceModeModel.MinDeviceSize&&o<=n.DeviceModeModel.MaxDeviceSize&&this.model.setHeight(o)}}exitHingeMode(){this.model&&this.model.exitHingeMode()}onResizeEnd(){delete this.resizeStart,e.userMetrics.actionTaken(e.UserMetrics.Action.ResizedViewInResponsiveMode)}updateUI(){function e(e,t){e.style.left=t.left+"px",e.style.top=t.top+"px",e.style.width=t.width+"px",e.style.height=t.height+"px"}if(!this.isShowing())return;const i=t.ZoomManager.ZoomManager.instance().zoomFactor();let o=!1;const s=this.showRulersSetting.get()&&this.model.type()!==n.DeviceModeModel.Type.None;let r=!1,a=!1;const d=this.model.screenRect().scale(1/i);this.cachedCssScreenRect&&d.isEqual(this.cachedCssScreenRect)||(e(this.screenArea,d),a=!0,o=!0,this.cachedCssScreenRect=d);const l=this.model.visiblePageRect().scale(1/i);this.cachedCssVisiblePageRect&&l.isEqual(this.cachedCssVisiblePageRect)||(e(this.pageArea,l),o=!0,this.cachedCssVisiblePageRect=l);const c=this.model.outlineRect();if(c){const t=c.scale(1/i);this.cachedOutlineRect&&t.isEqual(this.cachedOutlineRect)||(e(this.outlineImage,t),o=!0,this.cachedOutlineRect=t)}this.contentClip.classList.toggle("device-mode-outline-visible",Boolean(this.model.outlineImage()));const h=this.model.type()===n.DeviceModeModel.Type.Responsive;h!==this.cachedResizable&&(this.rightResizerElement.classList.toggle("hidden",!h),this.leftResizerElement.classList.toggle("hidden",!h),this.bottomResizerElement.classList.toggle("hidden",!h),this.bottomRightResizerElement.classList.toggle("hidden",!h),this.bottomLeftResizerElement.classList.toggle("hidden",!h),this.cachedResizable=h);const m=this.showMediaInspectorSetting.get()&&this.model.type()!==n.DeviceModeModel.Type.None;if(m!==this.cachedMediaInspectorVisible&&(m?this.mediaInspector.show(this.mediaInspectorContainer):this.mediaInspector.detach(),r=!0,o=!0,this.cachedMediaInspectorVisible=m),s!==this.cachedShowRulers&&(this.contentClip.classList.toggle("device-mode-rulers-visible",s),s?(this.topRuler.show(this.contentArea),this.leftRuler.show(this.contentArea)):(this.topRuler.detach(),this.leftRuler.detach()),r=!0,o=!0,this.cachedShowRulers=s),this.model.scale()!==this.cachedScale){a=!0,o=!0;for(const e of this.presetBlocks){const t=this.blockElementToWidth.get(e);if(!t)throw new Error("Could not get width for block.");e.style.width=t*this.model.scale()+"px"}this.cachedScale=this.model.scale()}this.toolbar.update(),this.loadImage(this.screenImage,this.model.screenImage()),this.loadImage(this.outlineImage,this.model.outlineImage()),this.mediaInspector.setAxisTransform(this.model.scale()),o&&this.doResize(),a&&(this.topRuler.render(this.model.scale()),this.leftRuler.render(this.model.scale()),this.topRuler.element.positionAt(this.cachedCssScreenRect?this.cachedCssScreenRect.left:0,this.cachedCssScreenRect?this.cachedCssScreenRect.top:0),this.leftRuler.element.positionAt(this.cachedCssScreenRect?this.cachedCssScreenRect.left:0,this.cachedCssScreenRect?this.cachedCssScreenRect.top:0)),r&&this.contentAreaResized()}loadImage(e,t){e.getAttribute("srcset")!==t&&(e.setAttribute("srcset",t),t||e.classList.toggle("hidden",!0))}onImageLoaded(e,t){e.classList.toggle("hidden",!t)}setNonEmulatedAvailableSize(e){if(this.model.type()!==n.DeviceModeModel.Type.None)return;const i=t.ZoomManager.ZoomManager.instance().zoomFactor(),o=e.getBoundingClientRect(),s=new t.Geometry.Size(Math.max(o.width*i,1),Math.max(o.height*i,1));this.model.setAvailableSize(s,s)}contentAreaResized(){const e=t.ZoomManager.ZoomManager.instance().zoomFactor(),i=this.contentArea.getBoundingClientRect(),o=new t.Geometry.Size(Math.max(i.width*e,1),Math.max(i.height*e,1)),s=new t.Geometry.Size(Math.max((i.width-2*(this.handleWidth||0))*e,1),Math.max((i.height-(this.handleHeight||0))*e,1));this.model.setAvailableSize(o,s)}measureHandles(){const e=this.rightResizerElement.classList.contains("hidden");this.rightResizerElement.classList.toggle("hidden",!1),this.bottomResizerElement.classList.toggle("hidden",!1),this.handleWidth=this.rightResizerElement.offsetWidth,this.handleHeight=this.bottomResizerElement.offsetHeight,this.rightResizerElement.classList.toggle("hidden",e),this.bottomResizerElement.classList.toggle("hidden",e)}zoomChanged(){delete this.handleWidth,delete this.handleHeight,this.isShowing()&&(this.measureHandles(),this.contentAreaResized())}onResize(){this.isShowing()&&this.contentAreaResized()}wasShown(){this.measureHandles(),this.toolbar.restore()}willHide(){this.model.emulate(n.DeviceModeModel.Type.None,null,null)}async captureScreenshot(){const e=await this.model.captureScreenshot(!1);if(null===e)return;const t=new Image;t.src="data:image/png;base64,"+e,t.onload=async()=>{const e=t.naturalWidth/this.model.screenRect().width,i=this.model.outlineRect();if(!i)throw new Error("Unable to take screenshot: no outlineRect available.");const o=i.scale(e),s=this.model.screenRect().scale(e),n=this.model.visiblePageRect().scale(e),r=s.left+n.left-o.left,a=s.top+n.top-o.top,d=document.createElement("canvas");d.width=Math.floor(o.width),d.height=Math.min(16384,Math.floor(o.height));const l=d.getContext("2d");if(!l)throw new Error("Could not get 2d context from canvas.");l.imageSmoothingEnabled=!1,this.model.outlineImage()&&await this.paintImage(l,this.model.outlineImage(),o.relativeTo(o)),this.model.screenImage()&&await this.paintImage(l,this.model.screenImage(),s.relativeTo(o)),l.drawImage(t,Math.floor(r),Math.floor(a)),this.saveScreenshot(d)}}async captureFullSizeScreenshot(){const e=await this.model.captureScreenshot(!0);if(null!==e)return this.saveScreenshotBase64(e)}async captureAreaScreenshot(e){const t=await this.model.captureScreenshot(!1,e);if(null!==t)return this.saveScreenshotBase64(t)}saveScreenshotBase64(e){const t=new Image;t.src="data:image/png;base64,"+e,t.onload=()=>{const e=document.createElement("canvas");e.width=t.naturalWidth,e.height=Math.min(16384,Math.floor(t.naturalHeight));const i=e.getContext("2d");if(!i)throw new Error("Could not get 2d context for base64 screenshot.");i.imageSmoothingEnabled=!1,i.drawImage(t,0,0),this.saveScreenshot(e)}}paintImage(e,t,i){return new Promise((o=>{const s=new Image;s.crossOrigin="Anonymous",s.srcset=t,s.onerror=()=>o(),s.onload=()=>{e.drawImage(s,i.left,i.top,i.width,i.height),o()}}))}saveScreenshot(e){const t=this.model.inspectedURL();let i="";if(t){const e=d.StringUtilities.removeURLFragment(t);i=d.StringUtilities.trimURL(e)}const o=this.model.device();o&&this.model.type()===n.DeviceModeModel.Type.Device&&(i+=`(${o.title})`);const s=document.createElement("a");s.download=i+".png",e.toBlob((e=>{null!==e&&(s.href=URL.createObjectURL(e),s.click())}))}}class L extends t.Widget.VBox{contentElementInternal;horizontal;scale;count;throttler;applyCallback;renderedScale;renderedZoomFactor;constructor(e,t){super(),this.element.classList.add("device-mode-ruler"),this.element.setAttribute("jslog",`${l.deviceModeRuler().track({click:!0})}`),this.contentElementInternal=this.element.createChild("div","device-mode-ruler-content").createChild("div","device-mode-ruler-inner"),this.horizontal=e,this.scale=1,this.count=0,this.throttler=new r.Throttler.Throttler(0),this.applyCallback=t}render(e){this.scale=e,this.throttler.schedule(this.update.bind(this))}onResize(){this.throttler.schedule(this.update.bind(this))}update(){const e=t.ZoomManager.ZoomManager.instance().zoomFactor(),i=this.horizontal?this.contentElementInternal.offsetWidth:this.contentElementInternal.offsetHeight;this.scale===this.renderedScale&&e===this.renderedZoomFactor||(this.contentElementInternal.removeChildren(),this.count=0,this.renderedScale=this.scale,this.renderedZoomFactor=e);const o=i*e/this.scale,s=Math.ceil(o/5);let n=1;this.scale<.8&&(n=2),this.scale<.6&&(n=4),this.scale<.4&&(n=8),this.scale<.2&&(n=16),this.scale<.1&&(n=32);for(let e=s;e<this.count;e++)if(!(e%n)){const e=this.contentElementInternal.lastChild;e&&e.remove()}for(let t=this.count;t<s;t++){if(t%n)continue;const i=this.contentElementInternal.createChild("div","device-mode-ruler-marker");if(t&&(this.horizontal?i.style.left=5*t*this.scale/e+"px":i.style.top=5*t*this.scale/e+"px",!(t%20))){const e=i.createChild("div","device-mode-ruler-text");e.textContent=String(5*t),e.addEventListener("click",this.onMarkerClick.bind(this,5*t),!1)}t%10?t%5||i.classList.add("device-mode-ruler-marker-medium"):i.classList.add("device-mode-ruler-marker-large")}return this.count=s,Promise.resolve()}onMarkerClick(e){this.applyCallback.call(null,e)}}var W=Object.freeze({__proto__:null,DeviceModeView:z,Ruler:L});let P;class A extends t.Widget.VBox{inspectedPagePlaceholder;deviceModeView;toggleDeviceModeAction;showDeviceModeSetting;constructor(e){super(),this.inspectedPagePlaceholder=e,this.deviceModeView=null,this.toggleDeviceModeAction=t.ActionRegistry.ActionRegistry.instance().getAction("emulation.toggle-device-mode");const i=n.DeviceModeModel.DeviceModeModel.instance();this.showDeviceModeSetting=i.enabledSetting(),this.showDeviceModeSetting.setRequiresUserAction(Boolean(o.Runtime.Runtime.queryParam("hasOtherClients"))),this.showDeviceModeSetting.addChangeListener(this.update.bind(this,!1)),s.TargetManager.TargetManager.instance().addModelListener(s.OverlayModel.OverlayModel,"ScreenshotRequested",this.screenshotRequestedFromOverlay,this),this.update(!0)}static instance(e={forceNew:null,inspectedPagePlaceholder:null}){const{forceNew:t,inspectedPagePlaceholder:i}=e;if(!P||t){if(!i)throw new Error(`Unable to create DeviceModeWrapper: inspectedPagePlaceholder must be provided: ${(new Error).stack}`);P=new A(i)}return P}toggleDeviceMode(){this.showDeviceModeSetting.set(!this.showDeviceModeSetting.get())}isDeviceModeOn(){return this.showDeviceModeSetting.get()}captureScreenshot(e,t){return this.deviceModeView||(this.deviceModeView=new z),this.deviceModeView.setNonEmulatedAvailableSize(this.inspectedPagePlaceholder.element),e?this.deviceModeView.captureFullSizeScreenshot():t?this.deviceModeView.captureAreaScreenshot(t):this.deviceModeView.captureScreenshot(),!0}screenshotRequestedFromOverlay(e){const t=e.data;this.captureScreenshot(!1,t)}update(e){if(this.toggleDeviceModeAction.setToggled(this.showDeviceModeSetting.get()),!e){const e=this.deviceModeView&&this.deviceModeView.isShowing();if(this.showDeviceModeSetting.get()===e)return}this.showDeviceModeSetting.get()?(this.deviceModeView||(this.deviceModeView=new z),this.deviceModeView.show(this.element),this.inspectedPagePlaceholder.clearMinimumSize(),this.inspectedPagePlaceholder.show(this.deviceModeView.element)):(this.deviceModeView&&(this.deviceModeView.exitHingeMode(),this.deviceModeView.detach()),this.inspectedPagePlaceholder.restoreMinimumSize(),this.inspectedPagePlaceholder.show(this.element))}}var F=Object.freeze({__proto__:null,DeviceModeWrapper:A,ActionDelegate:class{handleAction(e,t){switch(t){case"emulation.capture-screenshot":return A.instance().captureScreenshot();case"emulation.capture-node-screenshot":{const i=e.flavor(s.DOMModel.DOMNode);if(!i)return!0;async function o(){if(!i)return;const e=await i.resolveToObject();if(!e)return;const t=await e.callFunction((function(){const e=this.getBoundingClientRect(),t=this.ownerDocument.documentElement.getBoundingClientRect();return JSON.stringify({x:e.left-t.left,y:e.top-t.top,width:e.width,height:e.height,scale:1})}));if(!t.object)throw new Error("Clipping error: could not get object data.");const o=JSON.parse(t.object.value),s=await i.domModel().target().pageAgent().invoke_getLayoutMetrics(),n=!s.getError()&&s.visualViewport.zoom||1;o.x*=n,o.y*=n,o.width*=n,o.height*=n,A.instance().captureScreenshot(!1,o)}return o(),!0}case"emulation.capture-full-height-screenshot":return A.instance().captureScreenshot(!0);case"emulation.toggle-device-mode":return A.instance().toggleDeviceMode(),!0}return!1}}}),V={cssContent:":host{background-color:var(--sys-color-cdt-base-container)}\n/*# sourceURL=inspectedPagePlaceholder.css */\n"};let U;class B extends(r.ObjectWrapper.eventMixin(t.Widget.Widget)){updateId;constructor(){super(!0),this.registerRequiredCSS(V),t.ZoomManager.ZoomManager.instance().addEventListener("ZoomChanged",this.onResize,this),this.restoreMinimumSize()}static instance(e={forceNew:null}){const{forceNew:t}=e;return U&&!t||(U=new B),U}onResize(){this.updateId&&this.element.window().cancelAnimationFrame(this.updateId),this.updateId=this.element.window().requestAnimationFrame(this.update.bind(this,!1))}restoreMinimumSize(){this.setMinimumSize(150,150)}clearMinimumSize(){this.setMinimumSize(1,1)}dipPageRect(){const e=t.ZoomManager.ZoomManager.instance().zoomFactor(),i=this.element.getBoundingClientRect(),o=this.element.ownerDocument.body.getBoundingClientRect(),s=Math.max(i.left*e,o.left*e),n=Math.max(i.top*e,o.top*e),r=Math.min(i.bottom*e,o.bottom*e);return{x:s,y:n,width:Math.min(i.right*e,o.right*e)-s,height:r-n}}update(e){delete this.updateId;const t=this.dipPageRect(),i={x:Math.round(t.x),y:Math.round(t.y),height:Math.max(1,Math.round(t.height)),width:Math.max(1,Math.round(t.width))};e&&(--i.height,this.dispatchEventToListeners("Update",i),++i.height),this.dispatchEventToListeners("Update",i)}}var j=Object.freeze({__proto__:null,InspectedPagePlaceholder:B});let Q,H;class O{rootSplitWidget;deviceModeView;inspectedPagePlaceholder;toolboxWindow;toolboxRootView;changingDockSide;toolboxDocument;constructor(){t.DockController.DockController.instance().addEventListener("BeforeDockSideChanged",this.openToolboxWindow,this)}static instance(){return Q||(Q=new O),Q}presentUI(e){const i=new t.RootView.RootView;this.rootSplitWidget=new t.SplitWidget.SplitWidget(!1,!0,"inspector-view.split-view-state",555,300,!0),this.rootSplitWidget.show(i.element),this.rootSplitWidget.setSidebarWidget(t.InspectorView.InspectorView.instance()),this.rootSplitWidget.setDefaultFocusedChild(t.InspectorView.InspectorView.instance()),t.InspectorView.InspectorView.instance().setOwnerSplit(this.rootSplitWidget),this.inspectedPagePlaceholder=B.instance(),this.inspectedPagePlaceholder.addEventListener("Update",this.onSetInspectedPageBounds.bind(this),this),this.deviceModeView=A.instance({inspectedPagePlaceholder:this.inspectedPagePlaceholder,forceNew:!1}),t.DockController.DockController.instance().addEventListener("BeforeDockSideChanged",this.onBeforeDockSideChange,this),t.DockController.DockController.instance().addEventListener("DockSideChanged",this.onDockSideChange,this),t.DockController.DockController.instance().addEventListener("AfterDockSideChanged",this.onAfterDockSideChange,this),this.onDockSideChange(),console.timeStamp("AdvancedApp.attachToBody"),i.attachToDocument(e),i.focus(),this.inspectedPagePlaceholder.update()}openToolboxWindow(e){if("undocked"!==e.data.to)return;if(this.toolboxWindow)return;const t=window.location.href.replace("devtools_app.html","device_mode_emulation_frame.html");this.toolboxWindow=window.open(t,void 0)}deviceModeEmulationFrameLoaded(e){i.ThemeSupport.instance().addDocumentToTheme(e),t.UIUtils.initializeUIUtils(e),t.UIUtils.addPlatformClass(e.documentElement),t.UIUtils.installComponentRootStyles(e.body),t.ContextMenu.ContextMenu.installHandler(e),this.toolboxRootView=new t.RootView.RootView,this.toolboxRootView.attachToDocument(e),this.toolboxDocument=e,this.updateDeviceModeView()}updateDeviceModeView(){this.isDocked()?this.rootSplitWidget.setMainWidget(this.deviceModeView):this.toolboxRootView&&this.deviceModeView.show(this.toolboxRootView.element)}onBeforeDockSideChange(e){"undocked"===e.data.to&&this.toolboxRootView&&(this.rootSplitWidget.hideSidebar(),this.inspectedPagePlaceholder.update()),this.changingDockSide=!0}onDockSideChange(e){this.updateDeviceModeView();const i=e?e.data.to:t.DockController.DockController.instance().dockSide();if(void 0===i)throw new Error("Got onDockSideChange event with unexpected undefined for dockSide()");"undocked"===i?this.updateForUndocked():this.toolboxRootView&&e&&"undocked"===e.data.from?this.rootSplitWidget.hideSidebar():this.updateForDocked(i)}onAfterDockSideChange(e){this.changingDockSide&&(e.data.from&&"undocked"===e.data.from&&this.updateForDocked(e.data.to),this.changingDockSide=!1,this.inspectedPagePlaceholder.update())}updateForDocked(e){this.rootSplitWidget.resizerElement().style.transform="right"===e?"translateX(2px)":"left"===e?"translateX(-2px)":"",this.rootSplitWidget.setVertical("right"===e||"left"===e),this.rootSplitWidget.setSecondIsSidebar("right"===e||"bottom"===e),this.rootSplitWidget.toggleResizer(this.rootSplitWidget.resizerElement(),!0),this.rootSplitWidget.toggleResizer(t.InspectorView.InspectorView.instance().topResizerElement(),"bottom"===e),this.rootSplitWidget.showBoth()}updateForUndocked(){this.rootSplitWidget.toggleResizer(this.rootSplitWidget.resizerElement(),!1),this.rootSplitWidget.toggleResizer(t.InspectorView.InspectorView.instance().topResizerElement(),!1),this.rootSplitWidget.hideMain()}isDocked(){return"undocked"!==t.DockController.DockController.instance().dockSide()}onSetInspectedPageBounds(t){if(this.changingDockSide)return;const i=this.inspectedPagePlaceholder.element.window();if(!i.innerWidth||!i.innerHeight)return;if(!this.inspectedPagePlaceholder.isShowing())return;const o=t.data;console.timeStamp("AdvancedApp.setInspectedPageBounds"),e.InspectorFrontendHost.InspectorFrontendHostInstance.setInspectedPageBounds(o)}}globalThis.Emulation=globalThis.Emulation||{},globalThis.Emulation.AdvancedApp=O;class _{static instance(e={forceNew:null}){const{forceNew:t}=e;return H&&!t||(H=new _),H}createApp(){return O.instance()}}var Z=Object.freeze({__proto__:null,AdvancedApp:O,AdvancedAppProvider:_});export{Z as AdvancedApp,f as DeviceModeToolbar,W as DeviceModeView,F as DeviceModeWrapper,j as InspectedPagePlaceholder,T as MediaQueryInspector};

package/download/chrome-devtools-frontend.appspot.com/serve_file/@abb728f8afc6a86cc66b1313f5056728ce422ddd/panels/event_listeners/event_listeners.js

@@ -0,0 +1 @@
+import*as e from"../../core/common/common.js";import*as t from"../../core/sdk/sdk.js";import*as n from"../../core/i18n/i18n.js";import*as r from"../../ui/components/buttons/buttons.js";import*as o from"../../ui/legacy/components/object_ui/object_ui.js";import*as i from"../../ui/legacy/components/utils/utils.js";import*as s from"../../ui/legacy/legacy.js";import*as l from"../../ui/visual_logging/visual_logging.js";async function a(n){const r=n.runtimeModel().target().model(t.DOMDebuggerModel.DOMDebuggerModel);if(!r)return{eventListeners:[],internalHandlers:null};const o={internalHandlers:null,eventListeners:[]};return n.callFunction((function(){const e=[];let t=[],n=[],r=[function(e){if(!(e&&e instanceof Node))return{eventListeners:[]};const t=window.jQuery;if(!t||!t.fn)return{eventListeners:[]};const n=t,r=t._data||t.data,o=[],i=[];if("function"==typeof r){const t=r(e,"events");for(const n in t)for(const r in t[n]){const i=t[n][r];if("object"==typeof i||"function"==typeof i){const t={handler:i.handler||i,useCapture:!0,passive:!1,once:!1,type:n,remove:u.bind(e,i.selector)};o.push(t)}}const n=r(e);n&&"function"==typeof n.handle&&i.push(n.handle)}const s=n(e)[0];if(s){const e=s.$events;for(const t in e){const n=e[t];for(const e in n)if("function"==typeof n[e]){const r={handler:n[e],useCapture:!0,passive:!1,once:!1,type:t};o.push(r)}}s&&s.$handle&&i.push(s.$handle)}return{eventListeners:o,internalHandlers:i}}];try{self.devtoolsFrameworkEventListeners&&i(self.devtoolsFrameworkEventListeners)&&(r=r.concat(self.devtoolsFrameworkEventListeners))}catch(t){e.push("devtoolsFrameworkEventListeners call produced error: "+a(t))}for(let o=0;o<r.length;++o)try{const e=r[o](this);if(e.eventListeners&&i(e.eventListeners)){const n=e.eventListeners.map((e=>s(e))).filter(c);t=t.concat(n)}if(e.internalHandlers&&i(e.internalHandlers)){const t=e.internalHandlers.map((e=>l(e))).filter(c);n=n.concat(t)}}catch(t){e.push("fetcher call produced error: "+a(t))}const o={eventListeners:t,internalHandlers:n.length?n:void 0,errorString:void 0};o.internalHandlers||delete o.internalHandlers;if(e.length){let t="Framework Event Listeners API Errors:\n\t"+e.join("\n\t");t=t.substr(0,t.length-1),o.errorString=t}""!==o.errorString&&void 0!==o.errorString||delete o.errorString;return o;function i(e){if(!e||"object"!=typeof e)return!1;try{if("function"==typeof e.splice){const t=e.length;return"number"==typeof t&&t>>>0===t&&(t>0||1/t>0)}}catch(e){}return!1}function s(t){try{let n="";if(t){const e=t.type;e&&"string"==typeof e||(n+="event listener's type isn't string or empty, ");const r=t.useCapture;"boolean"!=typeof r&&(n+="event listener's useCapture isn't boolean or undefined, ");const o=t.passive;"boolean"!=typeof o&&(n+="event listener's passive isn't boolean or undefined, ");const i=t.once;"boolean"!=typeof i&&(n+="event listener's once isn't boolean or undefined, ");const s=t.handler;s&&"function"==typeof s||(n+="event listener's handler isn't a function or empty, ");const l=t.remove;if(l&&"function"!=typeof l&&(n+="event listener's remove isn't a function, "),!n)return{type:e,useCapture:r,passive:o,once:i,handler:s,remove:l}}else n+="empty event listener, ";return e.push(n.substr(0,n.length-2)),null}catch(t){return e.push(a(t)),null}}function l(t){return t&&"function"==typeof t?t:(e.push("internal handler isn't a function or empty"),null)}function a(e){try{return String(e)}catch(e){return"<error>"}}function c(e){return Boolean(e)}function u(e,t,n){if(!(this&&this instanceof Node))return;const r=window.jQuery;if(!r||!r.fn)return;r(this).off(t,e,n)}}),void 0).then(c).then((function(e){return e.getOwnProperties(!1)})).then((async function(n){if(!n.properties)throw new Error("Object properties is empty");const r=[];for(const u of n.properties)"eventListeners"===u.name&&u.value&&r.push(i(u.value).then(l)),"internalHandlers"===u.name&&u.value&&r.push((c=u.value,t.RemoteObject.RemoteArray.objectAsArray(c).map(s).then(t.RemoteObject.RemoteArray.createFromRemoteObjects.bind(null))).then(a)),"errorString"===u.name&&u.value&&(o=u.value,e.Console.Console.instance().error(String(o.value)));var o;var c;await Promise.all(r)})).then((function(){return o})).catch((e=>(console.error(e),o)));function i(e){return t.RemoteObject.RemoteArray.objectAsArray(e).map((function(e){let o,i,l,a,u=null,d=null,h=null,v=null;const p=[];function f(e){h=e?e.location:null}return p.push(e.callFunctionJSON((function(){return{type:this.type,useCapture:this.useCapture,passive:this.passive,once:this.once}}),void 0).then((function(e){void 0!==e.type&&(o=e.type);void 0!==e.useCapture&&(i=e.useCapture);void 0!==e.passive&&(l=e.passive);void 0!==e.once&&(a=e.once)}))),p.push(e.callFunction((function(){return this.handler||null})).then(c).then((function(e){return d=e,d})).then(s).then((function(e){return u=e,e.debuggerModel().functionDetailsPromise(e).then(f)}))),p.push(e.callFunction((function(){return this.remove||null})).then(c).then((function(e){if("function"!==e.type)return;v=e}))),Promise.all(p).then((function(){if(!h)throw new Error("Empty event listener's location");return new t.DOMDebuggerModel.EventListener(r,n,o,i,l,a,u,d,h,v,"FrameworkUser")})).catch((e=>(console.error(e),null)))})).then(u)}function s(e){return t.RemoteObject.RemoteFunction.objectAsFunction(e).targetFunction()}function l(e){o.eventListeners=e}function a(e){o.internalHandlers=e}function c(e){if(e.wasThrown||!e.object)throw new Error("Exception in callFunction or empty result");return e.object}function u(e){return e.filter((function(e){return Boolean(e)}))}}var c=Object.freeze({__proto__:null,frameworkEventListeners:a});const u=new CSSStyleSheet;u.replaceSync(".value.object-value-node:hover{background-color:var(--sys-color-state-hover-on-subtle)}.object-value-function-prefix,\n.object-value-boolean{color:var(--sys-color-token-attribute-value)}.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(--sys-color-token-attribute-value)}.object-value-bigint{color:var(--sys-color-token-comment)}.object-value-string,\n.object-value-regexp,\n.object-value-symbol{white-space:pre;unicode-bidi:-webkit-isolate;color:var(--sys-color-token-property-special)}.object-value-node{position:relative;vertical-align:baseline;color:var(--sys-color-token-variable);white-space:nowrap}.object-value-null,\n.object-value-undefined{color:var(--sys-color-state-disabled)}.object-value-unavailable{color:var(--sys-color-token-tag)}.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(--sys-color-token-subtle)}.value .object-properties-preview{white-space:nowrap}.name{color:var(--sys-color-token-tag);flex-shrink:0}.object-properties-preview .name{color:var(--sys-color-token-subtle)}@media (forced-colors: active){.object-value-calculate-value-button:hover{forced-color-adjust:none;color:Highlight}}\n/*# sourceURL=objectValue.css */\n");const d=new CSSStyleSheet;d.replaceSync(".tree-outline-disclosure li{padding:0 0 0 5px;overflow:hidden;display:flex;min-height:18px;align-items:center}.tree-outline-disclosure{padding-left:0!important;padding-right:3px}.tree-outline-disclosure li.parent::before{top:0!important}.tree-outline-disclosure .name{color:var(--sys-color-token-tag)}.tree-outline-disclosure .object-value-node,\n.tree-outline-disclosure .object-value-object{overflow:hidden;text-overflow:ellipsis}.event-listener-details{display:flex;min-height:18px;align-items:center;devtools-button{height:18px}}.event-listener-tree-subtitle{float:right;margin-left:5px;flex-shrink:0}.event-listener-button{padding:0 5px;color:var(--sys-color-primary);background-color:var(--sys-color-cdt-base-container);border-radius:7px;border:1px solid var(--sys-color-tonal-outline);margin-left:5px;display:block;flex-shrink:0;&:hover{background-color:var(--sys-color-state-hover-on-subtle)}&:active{background-color:var(--sys-color-state-ripple-neutral-on-subtle)}}.tree-outline-disclosure li:hover .event-listener-button{display:inline}@media (forced-colors: active){.event-listener-details .event-listener-button{forced-color-adjust:none;opacity:100%;background:ButtonFace;color:ButtonText;border-color:ButtonText}.event-listener-button:hover{background-color:Highlight!important;color:HighlightText;border-color:ButtonText}.tree-outline.hide-selection-when-blurred .selected:focus-visible .event-listener-button,\n  .tree-outline-disclosure li:focus-visible .gray-info-message{background-color:Highlight;color:HighlightText;border-color:HighlightText}}\n/*# sourceURL=eventListenersView.css */\n");const h={noEventListeners:"No event listeners",deleteEventListener:"Delete event listener",togglePassive:"Toggle Passive",toggleWhetherEventListenerIs:"Toggle whether event listener is passive or blocking",revealInElementsPanel:"Reveal in Elements panel",passive:"Passive"},v=n.i18n.registerUIStrings("panels/event_listeners/EventListenersView.ts",h),p=n.i18n.getLocalizedString.bind(void 0,v);class f extends s.Widget.VBox{changeCallback;enableDefaultTreeFocus;treeOutline;emptyHolder;linkifier;treeItemMap;constructor(e,t=!1){super(),this.changeCallback=e,this.enableDefaultTreeFocus=t,this.treeOutline=new s.TreeOutline.TreeOutlineInShadow,this.treeOutline.setComparator(m.comparator),this.treeOutline.element.classList.add("monospace"),this.treeOutline.setShowSelectionOnKeyboardFocus(!0),this.treeOutline.setFocusable(!0),this.element.appendChild(this.treeOutline.element),this.emptyHolder=document.createElement("div"),this.emptyHolder.classList.add("gray-info-message"),this.emptyHolder.textContent=p(h.noEventListeners),this.emptyHolder.tabIndex=-1,this.linkifier=new i.Linkifier.Linkifier,this.treeItemMap=new Map}focus(){this.enableDefaultTreeFocus&&(this.emptyHolder.parentNode?this.emptyHolder.focus():this.treeOutline.forceSelect())}async addObjects(e){this.reset(),await Promise.all(e.map((e=>e?this.addObject(e):Promise.resolve()))),this.addEmptyHolderIfNeeded(),this.eventListenersArrivedForTest()}addObject(e){let n,r=null;const o=[],i=e.runtimeModel().target().model(t.DOMDebuggerModel.DOMDebuggerModel);return i&&o.push(i.eventListeners(e).then((function(e){n=e}))),o.push(a(e).then((function(e){r=e}))),Promise.all(o).then((async function(){if(!r)return;if(!r.internalHandlers)return;return r.internalHandlers.object().callFunctionJSON((function(){const e=[],t=new Set(this);for(const n of arguments)e.push(t.has(n));return e}),n.map((function(e){return t.RemoteObject.RemoteObject.toCallArgument(e.handler())}))).then((function(e){for(let t=0;t<n.length;++t)e[t]&&n[t].markAsFramework()}))})).then(function(){this.addObjectEventListeners(e,n),r&&this.addObjectEventListeners(e,r.eventListeners)}.bind(this))}addObjectEventListeners(e,t){if(t)for(const n of t){this.getOrCreateTreeElementForType(n.type()).addObjectEventListener(n,e)}}showFrameworkListeners(e,t,n){const r=this.treeOutline.rootElement().children();for(const o of r){let r=!0;for(const i of o.children()){const o=i,s=o.eventListener().origin();let l=!1;"FrameworkUser"!==s||e||(l=!0),"Framework"===s&&e&&(l=!0),!t&&o.eventListener().passive()&&(l=!0),n||o.eventListener().passive()||(l=!0),o.hidden=l,r=r&&l}o.hidden=r}}getOrCreateTreeElementForType(e){let t=this.treeItemMap.get(e);return t||(t=new m(e,this.linkifier,this.changeCallback),this.treeItemMap.set(e,t),t.hidden=!0,this.treeOutline.appendChild(t)),this.emptyHolder.remove(),t}addEmptyHolderIfNeeded(){let e=!0,t=null;for(const n of this.treeOutline.rootElement().children())n.hidden=!n.firstChild(),e=e&&n.hidden,t||n.hidden||(t=n);e&&!this.emptyHolder.parentNode&&this.element.appendChild(this.emptyHolder),t&&t.select(!0),this.treeOutline.setFocusable(Boolean(t))}reset(){const e=this.treeOutline.rootElement().children();for(const t of e)t.removeChildren();this.linkifier.reset()}eventListenersArrivedForTest(){}wasShown(){super.wasShown(),this.treeOutline.registerCSSFiles([d,u])}}class m extends s.TreeOutline.TreeElement{toggleOnClick;linkifier;changeCallback;constructor(e,t,n){super(e),this.toggleOnClick=!0,this.linkifier=t,this.changeCallback=n,s.ARIAUtils.setLabel(this.listItemElement,`${e}, event listener`)}static comparator(e,t){return e.title===t.title?0:e.title>t.title?1:-1}addObjectEventListener(e,t){const n=new b(e,t,this.linkifier,this.changeCallback);this.appendChild(n)}}class b extends s.TreeOutline.TreeElement{eventListenerInternal;editable;changeCallback;valueTitle;constructor(e,t,n,r){super("",!0),this.eventListenerInternal=e,this.editable=!1,this.setTitle(t,n),this.changeCallback=r}async onpopulate(){const e=[],n=this.eventListenerInternal,r=n.domDebuggerModel().runtimeModel();e.push(r.createRemotePropertyFromPrimitiveValue("useCapture",n.useCapture())),e.push(r.createRemotePropertyFromPrimitiveValue("passive",n.passive())),e.push(r.createRemotePropertyFromPrimitiveValue("once",n.once())),void 0!==n.handler()&&e.push(new t.RemoteObject.RemoteObjectProperty("handler",n.handler())),o.ObjectPropertiesSection.ObjectPropertyTreeElement.populateWithProperties(this,e,[],!0,!0,null)}setTitle(t,n){const i=this.listItemElement.createChild("span","event-listener-details"),a=o.ObjectPropertiesSection.ObjectPropertiesSection.createPropertyValue(t,!1,!1);if(this.valueTitle=a.element,i.appendChild(this.valueTitle),this.eventListenerInternal.canRemove()){const e=new r.Button.Button;e.data={variant:"icon",size:"SMALL",iconName:"bin",jslogContext:"delete-event-listener"},s.Tooltip.Tooltip.install(e,p(h.deleteEventListener)),e.addEventListener("click",(e=>{this.removeListener(),e.consume()}),!1),i.appendChild(e)}if(this.eventListenerInternal.isScrollBlockingType()&&this.eventListenerInternal.canTogglePassive()){const e=i.createChild("button","event-listener-button");e.textContent=p(h.togglePassive),e.setAttribute("jslog",`${l.action("passive").track({click:!0})}`),s.Tooltip.Tooltip.install(e,p(h.toggleWhetherEventListenerIs)),e.addEventListener("click",(e=>{this.togglePassiveListener(),e.consume()}),!1),i.appendChild(e)}const c=i.createChild("span","event-listener-tree-subtitle"),u=n.linkifyRawLocation(this.eventListenerInternal.location(),this.eventListenerInternal.sourceURL());c.appendChild(u),this.listItemElement.addEventListener("contextmenu",(n=>{const r=new s.ContextMenu.ContextMenu(n);n.target!==u&&r.appendApplicableItems(u),"node"===t.subtype&&r.defaultSection().appendItem(p(h.revealInElementsPanel),(()=>e.Revealer.reveal(t)),{jslogContext:"reveal-in-elements"}),r.defaultSection().appendItem(p(h.deleteEventListener),this.removeListener.bind(this),{disabled:!this.eventListenerInternal.canRemove(),jslogContext:"delete-event-listener"}),r.defaultSection().appendCheckboxItem(p(h.passive),this.togglePassiveListener.bind(this),{checked:this.eventListenerInternal.passive(),disabled:!this.eventListenerInternal.canTogglePassive(),jslogContext:"passive"}),r.show()}))}removeListener(){this.removeListenerBar(),this.eventListenerInternal.remove()}togglePassiveListener(){this.eventListenerInternal.togglePassive().then((()=>this.changeCallback()))}removeListenerBar(){const e=this.parent;if(!e)return;e.removeChild(this),e.childCount()||e.collapse();let t=!0;for(const n of e.children())n.hidden||(t=!1);e.hidden=t}eventListener(){return this.eventListenerInternal}onenter(){return!!this.valueTitle&&(this.valueTitle.click(),!0)}ondelete(){return!!this.eventListenerInternal.canRemove()&&(this.removeListener(),!0)}}var g=Object.freeze({__proto__:null,EventListenersView:f,EventListenersTreeElement:m,ObjectEventListenerBar:b});export{c as EventListenersUtils,g as EventListenersView};

package/download/chrome-devtools-frontend.appspot.com/serve_file/@abb728f8afc6a86cc66b1313f5056728ce422ddd/panels/explain/explain.js

@@ -0,0 +1,203 @@
+import*as e from"../../core/common/common.js";import*as t from"../../core/host/host.js";import*as n from"../../core/i18n/i18n.js";import*as o from"../../core/sdk/sdk.js";import*as s from"../../third_party/marked/marked.js";import*as i from"../../ui/components/buttons/buttons.js";import*as a from"../../ui/components/icon_button/icon_button.js";import*as r from"../../ui/components/input/input.js";import*as l from"../../ui/components/markdown_view/markdown_view.js";import*as c from"../../ui/legacy/legacy.js";import*as d from"../../ui/lit-html/lit-html.js";import*as g from"../../ui/visual_logging/visual_logging.js";import*as h from"../../models/bindings/bindings.js";import*as u from"../../models/formatter/formatter.js";import*as m from"../../models/logs/logs.js";import*as p from"../../ui/legacy/components/utils/utils.js";import*as f from"../console/console.js";const v=1e3;var y;!function(e){e.MESSAGE="message",e.STACKTRACE="stacktrace",e.NETWORK_REQUEST="networkRequest",e.RELATED_CODE="relatedCode"}(y||(y={}));class k{#e;constructor(e){this.#e=e}async getNetworkRequest(){const e=this.#e.consoleMessage().getAffectedResources()?.requestId;if(!e)return;return m.NetworkLog.NetworkLog.instance().requestsForId(e)[0]}async getMessageSourceCode(){const e=this.#e.consoleMessage().stackTrace?.callFrames[0],t=this.#e.consoleMessage().runtimeModel(),n=t?.debuggerModel();if(!n||!t||!e)return{text:"",columnNumber:0,lineNumber:0};const s=new o.DebuggerModel.Location(n,e.scriptId,e.lineNumber,e.columnNumber),i=await h.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().rawLocationToUILocation(s),a=await(i?.uiSourceCode.requestContent()),r=!a?.isEncoded&&a?.content?a.content:"",l=r.indexOf("\n");if(r.length>v&&(l<0||l>v)){const{formattedContent:e,formattedMapping:t}=await u.ScriptFormatter.formatScriptContent(i?.uiSourceCode.mimeType()??"text/javascript",r),[n,o]=t.originalToFormatted(i?.lineNumber??0,i?.columnNumber??0);return{text:e,columnNumber:o,lineNumber:n}}return{text:r,columnNumber:i?.columnNumber??0,lineNumber:i?.lineNumber??0}}async buildPrompt(e=Object.values(y)){const[t,n]=await Promise.all([e.includes(y.RELATED_CODE)?this.getMessageSourceCode():void 0,e.includes(y.NETWORK_REQUEST)?this.getNetworkRequest():void 0]),o=t?.text?w(t):"",s=n?T(n):"",i=e.includes(y.STACKTRACE)?R(this.#e):"",a=C(this.#e),r=this.formatPrompt({message:[a,i].join("\n").trim(),relatedCode:o,relatedRequest:s}),l=[{type:y.MESSAGE,value:a}];return i&&l.push({type:y.STACKTRACE,value:i}),o&&l.push({type:y.RELATED_CODE,value:o}),s&&l.push({type:y.NETWORK_REQUEST,value:s}),{prompt:r,sources:l,isPageReloadRecommended:e.includes(y.NETWORK_REQUEST)&&Boolean(this.#e.consoleMessage().getAffectedResources()?.requestId)&&!s}}formatPrompt({message:e,relatedCode:t,relatedRequest:n}){let o=`Why does browser show an error\n${e}`;return t&&(o+=`\nFor the following code in my web app\n\n\`\`\`\n${t}\n\`\`\``),n&&(o+=`\nFor the following network request in my web app\n\n\`\`\`\n${n}\n\`\`\``),o}getSearchQuery(){let e=this.#e.toMessageTextString();return e&&(e=e.split("\n")[0]),e}}function x(e){const t=e.name.toLowerCase().trim();return!t.startsWith("x-")&&("cookie"!==t&&"set-cookie"!==t&&"authorization"!==t)}function b(e){const t=/^\s*/.exec(e);if(!t||!t.length)return null;const n=t[0];return n===e?null:n}function w({text:e,columnNumber:t,lineNumber:n},o=1e3){const s=e.split("\n");if(s[n].length>=o/2){const e=Math.max(t-o/2,0),i=Math.min(t+o/2,s[n].length);return s[n].substring(e,i)}let i=0,a=n,r=b(s[n]);const l=new Map;for(;void 0!==s[a]&&i+s[a].length<=o/2;){const e=b(s[a]);null===e||null===r||e!==r&&e.startsWith(r)||(/^\s*[\}\)\]]/.exec(s[a])||l.set(e,a),r=e),i+=s[a].length+1,a--}a=n+1;let c=n,d=n;for(r=b(s[n]);void 0!==s[a]&&i+s[a].length<=o;){i+=s[a].length;const e=b(s[a]);if(null!==e&&null!==r&&(e===r||!e.startsWith(r))){const t=s[a+1],n=t?b(t):null;n&&n!==e&&n.startsWith(e)||l.has(e)&&(c=l.get(e)??0,d=a),r=e}a++}return s.slice(c,d+1).join("\n")}function $(e,t,n){let o="";for(const e of t){if(o.length+e.length>n)break;o+=e}return o=o.trim(),o&&e?e+"\n"+o:o}function T(e){const t=(e,t)=>$(e,t.filter(x).map((e=>e.name+": "+e.value+"\n")),1e3);return`Request: ${e.url()}\n\n${t("Request headers:",e.requestHeaders())}\n\n${t("Response headers:",e.responseHeaders)}\n\nResponse status: ${e.statusCode} ${e.statusText}`}function C(e){return e.toMessageTextString().substr(0,1e3)}function R(e){const t=e.contentElement().querySelector(".stack-preview-container");if(!t)return"";const n=t.shadowRoot?.querySelector(".stack-preview-container");return $("",n.childTextNodes().filter((e=>!e.parentElement?.closest(".show-all-link,.show-less-link,.hidden-row"))).map(p.Linkifier.Linkifier.untruncatedNodeText),1e3)}const M=new CSSStyleSheet;M.replaceSync('*{padding:0;margin:0;box-sizing:border-box}:host{--max-height:2000px;--loading-max-height:140px;font-family:var(--default-font-family);font-size:inherit;display:block;overflow:hidden;max-height:0}:host-context(.opening){animation:expand-to-loading var(--sys-motion-duration-medium2) var(--sys-motion-easing-emphasized);animation-fill-mode:forwards}:host-context(.loaded){animation:expand-to-full var(--sys-motion-duration-medium2) var(--sys-motion-easing-emphasized);animation-fill-mode:forwards}:host-context(.closing){animation:collapse var(--sys-motion-duration-medium2) var(--sys-motion-easing-emphasized);animation-fill-mode:forwards}@keyframes expand-to-loading{from{max-height:0}to{max-height:var(--loading-max-height)}}@keyframes expand-to-full{from{max-height:var(--actual-height,var(--loading-max-height))}to{max-height:var(--max-height)}}@keyframes collapse{from{max-height:var(--actual-height,var(--max-height))}to{max-height:0;margin-top:0;margin-bottom:0}}.wrapper{padding:16px;background-color:var(--sys-color-cdt-base-container);border-radius:16px;container-type:inline-size}.wrapper.top{border-radius:16px 16px 4px 4px}.wrapper.bottom{margin-top:5px;border-radius:4px 4px 16px 16px}header{display:flex;flex-direction:row;gap:6px;color:var(--sys-color-on-surface);font-size:13px;font-style:normal;font-weight:500;height:14px}header:focus-visible{outline:none}header > .filler{flex:1}main{--override-markdown-view-message-color:var(--sys-color-on-surface);margin:12px 0 0;color:var(--sys-color-on-surface);font-size:12px;font-style:normal;font-weight:400;line-height:20px;p{margin-block-start:1em;margin-block-end:1em}ul{list-style-type:none;list-style-position:inside;padding-inline-start:0.2em;li{display:list-item;list-style-type:disc;list-style-position:outside;margin-inline-start:1em}li::marker{font-size:11px;line-height:1}}label{display:inline-flex;flex-direction:row;gap:0.5em;input,\n    span{vertical-align:middle}input[type="checkbox"]{margin-top:0.3em}}}devtools-markdown-view{margin-bottom:12px}footer{display:flex;flex-direction:row;align-items:center;color:var(--sys-color-on-surface);font-style:normal;font-weight:400;line-height:normal;margin-top:14px;gap:32px}@container (max-width: 600px){footer{gap:8px}}footer > .filler{flex:1}footer .rating{display:flex;flex-direction:row;gap:8px}textarea{height:84px;padding:10px;border-radius:8px;border:1px solid var(--sys-color-neutral-outline);width:100%;font-family:var(--default-font-family);font-size:inherit}.buttons{display:flex;flex-wrap:wrap;gap:5px}main .buttons{margin-top:12px}.disclaimer{display:flex;gap:2px;color:var(--sys-color-on-surface-subtle);font-size:11px;align-items:flex-start;flex-direction:column;max-width:360px}.link{color:var(--sys-color-primary);text-decoration-line:underline;devtools-icon{color:var(--sys-color-primary);width:14px;height:14px}}.loader{background:linear-gradient(130deg,transparent 0%,var(--sys-color-gradient-tertiary) 20%,var(--sys-color-gradient-primary) 40%,transparent 60%,var(--sys-color-gradient-tertiary) 80%,var(--sys-color-gradient-primary) 100%);background-position:0% 0%;background-size:250% 250%;animation:gradient 5s infinite linear}@keyframes gradient{0%{background-position:0 0}100%{background-position:100% 100%}}summary{font-size:12px;font-style:normal;font-weight:400;line-height:20px}details{--collapsed-height:20px;overflow:hidden;height:var(--collapsed-height)}details[open]{height:calc(var(--list-height) + var(--collapsed-height) + 8px);transition:height var(--sys-motion-duration-short4) var(--sys-motion-easing-emphasized)}h2{display:block;font-size:inherit;margin:0;font-weight:inherit}h2:focus-visible{outline:none}.info{width:20px;height:20px}devtools-icon[name="spark"]{color:var(--sys-color-primary-bright)}devtools-icon[name="dog-paw"]{width:16px;height:16px}\n/*# sourceURL=./components/consoleInsight.css */\n');const S=new CSSStyleSheet;S.replaceSync('*{padding:0;margin:0;box-sizing:border-box}:host{display:block}ul{color:var(--sys-color-primary);font-size:12px;font-style:normal;font-weight:400;line-height:18px;margin-top:8px}li{list-style-type:none}ul .link{color:var(--sys-color-primary);display:inline-flex!important;align-items:center;gap:4px;text-decoration-line:underline}devtools-icon{height:16px;width:16px}devtools-icon[name="open-externally"]{color:var(--icon-link)}.source-disclaimer{color:var(--sys-color-on-surface-subtle)}\n/*# sourceURL=./components/consoleInsightSourcesList.css */\n');const I={consoleMessage:"Console message",stackTrace:"Stacktrace",networkRequest:"Network request",relatedCode:"Related code",generating:"Generating explanation…",insight:"Explanation",closeInsight:"Close explanation",inputData:"Data used to understand this message",thumbsUp:"Thumbs up",thumbsDown:"Thumbs down",report:"Report legal issue",error:"DevTools has encountered an error",errorBody:"Something went wrong. Try again.",opensInNewTab:"(opens in a new tab)",learnMore:"Learn more",notAvailable:"This feature is not available",notLoggedIn:"This feature is only available when you sign into Chrome with your Google account.",syncIsOff:"This feature requires you to turn on Chrome sync.",updateSettings:"Update Settings",offlineHeader:"DevTools can’t reach the internet",offline:"Check your internet connection and try again.",signInToUse:"Sign in to use this feature",cancel:"Cancel",disableFeature:"Disable this feature",next:"Next",back:"Back",continue:"Continue",search:"Use search instead",reloadRecommendation:"Reload the page to capture related network request data for this message in order to create a better insight."},N=n.i18n.registerUIStrings("panels/explain/components/ConsoleInsight.ts",I),B=n.i18n.getLocalizedString.bind(void 0,N),{render:E,html:A,Directives:j}=d;class P extends Event{static eventName="close";constructor(){super(P.eventName,{composed:!0,bubbles:!0})}}function U(e){switch(e){case y.MESSAGE:return B(I.consoleMessage);case y.STACKTRACE:return B(I.stackTrace);case y.NETWORK_REQUEST:return B(I.networkRequest);case y.RELATED_CODE:return B(I.relatedCode)}}const L="https://policies.google.com/terms",O="https://goo.gle/devtools-console-messages-ai";class D extends HTMLElement{static async create(e,n){const o=await t.AidaClient.AidaClient.checkAccessPreconditions();return new D(e,n,o)}static litTagName=d.literal`devtools-console-insight`;#t=this.attachShadow({mode:"open"});#n;#o;#s=new l.MarkdownView.MarkdownInsightRenderer;#i;#a;constructor(e,t,n){switch(super(),this.#n=e,this.#o=t,n){case"available":this.#i={type:"loading",consentReminderConfirmed:!1,consentOnboardingFinished:this.#r().get()};break;case"no-account-email":this.#i={type:"not-logged-in"};break;case"no-active-sync":this.#i={type:"sync-is-off"};break;case"no-internet":this.#i={type:"offline"}}this.#l(),this.addEventListener("keydown",(e=>{e.stopPropagation()})),this.addEventListener("keyup",(e=>{e.stopPropagation()})),this.addEventListener("keypress",(e=>{e.stopPropagation()})),this.addEventListener("click",(e=>{e.stopPropagation()})),this.focus(),this.addEventListener("animationend",(()=>{this.style.setProperty("--actual-height",`${this.offsetHeight}px`)}))}#r(){return e.Settings.Settings.instance().createLocalSetting("console-insights-onboarding-finished",!1)}connectedCallback(){this.#t.adoptedStyleSheets=[M,r.checkboxStyles],this.classList.add("opening"),this.#c()}#d(e){const t=this.#i;this.#i=e,e.type!==t.type&&"loading"===t.type&&this.classList.add("loaded"),this.#l(),e.type!==t.type&&this.#g()}async#c(){if("loading"===this.#i.type){if(!this.#i.consentOnboardingFinished)return this.#d({type:"consent-onboarding",page:"private"}),void t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingShown);if(!this.#i.consentReminderConfirmed){const{sources:e,isPageReloadRecommended:n}=await this.#n.buildPrompt();return this.#d({type:"consent-reminder",sources:e,isPageReloadRecommended:n}),void t.userMetrics.actionTaken(t.UserMetrics.Action.InsightConsentReminderShown)}}}#h(){"consent-reminder"===this.#i.type?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightConsentReminderCanceled):"consent-onboarding"===this.#i.type&&("private"===this.#i.page?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingCanceledOnPage1):t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingCanceledOnPage2)),this.dispatchEvent(new P),this.classList.add("closing")}#u(n){if("insight"!==this.#i.type)throw new Error("Unexpected state");if(void 0===this.#i.metadata?.rpcGlobalId)throw new Error("RPC Id not in metadata");if(void 0!==this.#a)return;this.#a="true"===n.target.dataset.rating,this.#l(),this.#a?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightRatedPositive):t.userMetrics.actionTaken(t.UserMetrics.Action.InsightRatedNegative);const o=e.Settings.Settings.instance().getHostConfig().aidaAvailability?.disallowLogging??!0;this.#o.registerClientEvent({corresponding_aida_rpc_global_id:this.#i.metadata.rpcGlobalId,disable_user_content_logging:o,do_conversation_client_event:{user_feedback:{sentiment:this.#a?"POSITIVE":"NEGATIVE"}}})}#m(){t.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab("https://support.google.com/legal/troubleshooter/1114905?hl=en#ts=1115658%2C13380504")}#p(){const e=this.#n.getSearchQuery();t.InspectorFrontendHost.InspectorFrontendHostInstance.openSearchResultsInNewTab(e)}async#f(){this.#d({type:"loading",consentReminderConfirmed:!0,consentOnboardingFinished:this.#r().get()}),t.userMetrics.actionTaken(t.UserMetrics.Action.InsightConsentReminderConfirmed);try{for await(const{sources:e,isPageReloadRecommended:t,explanation:n,metadata:o}of this.#v()){const s=this.#y(n),i=!1!==s;this.#d({type:"insight",tokens:i?s:[],validMarkdown:i,explanation:n,sources:e,metadata:o,isPageReloadRecommended:t})}t.userMetrics.actionTaken(t.UserMetrics.Action.InsightGenerated)}catch(e){t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErrored),this.#d({type:"error",error:e.message})}}#y(e){try{const t=s.Marked.lexer(e);for(const e of t)this.#s.renderToken(e);return t}catch{return t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredMarkdown),!1}}async*#v(){const{prompt:e,sources:n,isPageReloadRecommended:o}=await this.#n.buildPrompt();try{for await(const s of this.#o.fetch(t.AidaClient.AidaClient.buildConsoleInsightsRequest(e)))yield{sources:n,isPageReloadRecommended:o,...s}}catch(e){throw"Server responded: permission denied"===e.message?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredPermissionDenied):e.message.startsWith("Cannot send request:")?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredCannotSend):e.message.startsWith("Request failed:")?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredRequestFailed):e.message.startsWith("Cannot parse chunk:")?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredCannotParseChunk):"Unknown chunk result"===e.message?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredUnknownChunk):e.message.startsWith("Server responded:")?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredApi):t.userMetrics.actionTaken(t.UserMetrics.Action.InsightErroredOther),e}}#k(){const e=o.TargetManager.TargetManager.instance().rootTarget();if(null===e)return;const n="chrome://settings";e.targetAgent().invoke_createTarget({url:n}).then((e=>{e.getError()&&t.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab(n)}))}#x(){try{e.Settings.moduleSetting("console-insights-enabled").set(!1)}finally{this.#h(),c.InspectorView.InspectorView.instance().displayReloadRequiredWarning("Reload for the change to apply.")}t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingFeatureDisabled)}#b(){this.#d({type:"consent-onboarding",page:"legal"}),t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingNextPage)}#g(){this.#t.querySelector("header h2")?.focus()}#w(){const e=this.#t.querySelector(".terms");return!!e?.checked}#$(){this.#w()&&(this.#r().set(!0),this.#d({type:"loading",consentReminderConfirmed:!1,consentOnboardingFinished:this.#r().get()}),t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingConfirmed),this.#c())}#T(){this.#d({type:"consent-onboarding",page:"private"}),t.userMetrics.actionTaken(t.UserMetrics.Action.InsightsOnboardingPrevPage)}#C(){return A`<${i.Button.Button.litTagName}
+      class="cancel-button"
+      @click=${this.#h}
+      .data=${{variant:"outlined",jslogContext:"cancel"}}
+    >
+      ${B(I.cancel)}
+    </${i.Button.Button.litTagName}>`}#R(){return A`<${i.Button.Button.litTagName}
+      @click=${this.#x}
+      class="disable-button"
+      .data=${{variant:"outlined",jslogContext:"disable"}}
+    >
+      ${B(I.disableFeature)}
+    </${i.Button.Button.litTagName}>`}#M(){return A`<${i.Button.Button.litTagName}
+      class="next-button"
+      @click=${this.#b}
+      .data=${{variant:"primary",jslogContext:"next"}}
+    >
+      ${B(I.next)}
+    </${i.Button.Button.litTagName}>`}#S(){return A`<${i.Button.Button.litTagName}
+      @click=${this.#T}
+      .data=${{variant:"outlined",jslogContext:"back"}}
+    >
+      ${B(I.back)}
+    </${i.Button.Button.litTagName}>`}#I(e,t=!1){return A`<${i.Button.Button.litTagName}
+      @click=${e}
+      class="continue-button"
+      .data=${{variant:"primary",disabled:t,jslogContext:"continue"}}
+    >
+      ${B(I.continue)}
+    </${i.Button.Button.litTagName}>`}#N(){return A`<${i.Button.Button.litTagName}
+      @click=${this.#p}
+      class="search-button"
+      .data=${{variant:"outlined",jslogContext:"search"}}
+    >
+      ${B(I.search)}
+    </${i.Button.Button.litTagName}>`}#B(){return A`<x-link href=${O} class="link" jslog=${g.link("learn-more").track({click:!0})}>
+      ${B(I.learnMore)}
+    </x-link>`}#E(){this.#l()}#A(){const t=`${g.section(this.#i.type).track({resize:!0})}`,n=e.Settings.Settings.instance().getHostConfig().aidaAvailability?.disallowLogging??!0;switch(this.#i.type){case"loading":return A`<main jslog=${t}>
+            <div role="presentation" class="loader" style="clip-path: url('#clipPath');">
+              <svg width="100%" height="64">
+                <clipPath id="clipPath">
+                  <rect x="0" y="0" width="100%" height="16" rx="8"></rect>
+                  <rect x="0" y="24" width="100%" height="16" rx="8"></rect>
+                  <rect x="0" y="48" width="100%" height="16" rx="8"></rect>
+                </clipPath>
+              </svg>
+            </div>
+          </main>`;case"insight":return A`
+        <main jslog=${t}>
+          ${this.#i.validMarkdown?A`<${l.MarkdownView.MarkdownView.litTagName}
+              .data=${{tokens:this.#i.tokens,renderer:this.#s}}>
+            </${l.MarkdownView.MarkdownView.litTagName}>`:this.#i.explanation}
+          <details style="--list-height: ${20*(this.#i.sources.length+(this.#i.isPageReloadRecommended?1:0))}px;" jslog=${g.expand("sources").track({click:!0})}>
+            <summary>${B(I.inputData)}</summary>
+            <${q.litTagName} .sources=${this.#i.sources} .isPageReloadRecommended=${this.#i.isPageReloadRecommended}>
+            </${q.litTagName}>
+          </details>
+          <div class="buttons">
+            ${this.#N()}
+          </div>
+        </main>`;case"error":return A`
+        <main jslog=${t}>
+          <div class="error">${B(I.errorBody)}</div>
+        </main>`;case"consent-reminder":return A`
+          <main jslog=${t}>
+            <p>The following data will be sent to Google to understand the context for the console message.
+            ${n?"":"Human reviewers may process this information for quality purposes. Don’t submit sensitive information."}
+            Read Google’s <x-link href=${L} class="link" jslog=${g.link("terms-of-service").track({click:!0})}>Terms of Service</x-link>.</p>
+            <${q.litTagName} .sources=${this.#i.sources} .isPageReloadRecommended=${this.#i.isPageReloadRecommended}>
+            </${q.litTagName}>
+          </main>
+        `;case"consent-onboarding":switch(this.#i.page){case"private":return A`<main jslog=${t}>
+              <p>This notice and our <x-link href=${"https://policies.google.com/privacy"} class="link" jslog=${g.link("privacy-notice").track({click:!0})}>privacy notice</x-link> describe how Chrome DevTools handles your data. Please read them carefully.</p>
+
+              <p>Chrome DevTools uses the console message, associated stack trace, related source code, and the associated network headers as input data. When you use "Understand this message", Google collects this input data, generated output, related feature usage information, and your feedback. Google uses this data to provide, improve, and develop Google products and services and machine learning technologies, including Google's enterprise products such as Google Cloud.</p>
+
+              <p>To help with quality and improve our products, human reviewers may read, annotate, and process the above-mentioned input data, generated output, related feature usage information, and your feedback. <strong>Please do not include sensitive (e.g., confidential) or personal information that can be used to identify you or others in your prompts or feedback.</strong> Your data will be stored in a way where Google cannot tell who provided it and can no longer fulfill any deletion requests and will be retained for up to 18 months. We may refrain from collecting data to improve our product if your Google account is managed by an organization and depending on your region.</p>
+            </main>`;case"legal":return A`<main jslog=${t}>
+            <p>As you try "Understand this message", here are key things to know:
+
+            <ul>
+              <li>Chrome DevTools uses console message, associated stack trace, related source code, and the associated network headers to provide answers.</li>
+              <li>Chrome DevTools uses experimental technology, and may generate inaccurate or offensive information that doesn't represent Google's views. Voting on the responses will help make this feature better.</li>
+              <li>This feature is an experimental feature and subject to future changes.</li>
+              <li><strong><x-link class="link" href=${"https://support.google.com/legal/answer/13505487"} jslog=${g.link("use-code-with-caution").track({click:!0})}>Use generated code snippets with caution</x-link>.</strong></li>
+            </ul>
+            </p>
+
+            <p>
+            <label>
+              <input class="terms" @change=${this.#E} type="checkbox" jslog=${g.toggle("terms-of-service-accepted")}>
+              <span>I accept my use of "Understand this message" is subject to the <x-link href=${L} class="link" jslog=${g.link("terms-of-service").track({click:!0})}>Google Terms of Service</x-link>.</span>
+            </label>
+            </p>
+            </main>`}case"not-logged-in":return A`
+          <main jslog=${t}>
+            <div class="error">${B(I.notLoggedIn)}</div>
+          </main>`;case"sync-is-off":return A`
+          <main jslog=${t}>
+            <div class="error">${B(I.syncIsOff)}</div>
+          </main>`;case"offline":return A`
+          <main jslog=${t}>
+            <div class="error">${B(I.offline)}</div>
+          </main>`}}#j(){const t=!(e.Settings.Settings.instance().getHostConfig().aidaAvailability?.disallowLogging??1),n=d.html`<span>
+              This feature may display inaccurate or offensive information that doesn't represent Google's views.
+              <x-link href=${O} class="link" jslog=${g.link("learn-more").track({click:!0})}>${B(I.learnMore)}</x-link>
+            </span>`;switch(this.#i.type){case"loading":return d.nothing;case"error":case"offline":return A`<footer jslog=${g.section("footer")}>
+          <div class="disclaimer">
+            ${n}
+          </div>
+        </footer>`;case"not-logged-in":case"sync-is-off":return A`<footer jslog=${g.section("footer")}>
+        <div class="filler"></div>
+        <div>
+          <${i.Button.Button.litTagName}
+            @click=${this.#k}
+            .data=${{variant:"primary",jslogContext:"update-settings"}}
+          >
+            ${I.updateSettings}
+          </${i.Button.Button.litTagName}>
+        </div>
+      </footer>`;case"consent-reminder":return A`<footer jslog=${g.section("footer")}>
+          <div class="disclaimer">
+            ${n}
+          </div>
+          <div class="filler"></div>
+          <div class="buttons">
+            ${this.#C()}
+            ${this.#I(this.#f)}
+          </div>
+        </footer>`;case"consent-onboarding":switch(this.#i.page){case"private":return A`<footer jslog=${g.section("footer")}>
+                <div class="disclaimer">
+                  ${this.#B()}
+                </div>
+                <div class="filler"></div>
+                <div class="buttons">
+                    ${this.#C()}
+                    ${this.#R()}
+                    ${this.#M()}
+                  </div>
+              </footer>`;case"legal":return A`<footer jslog=${g.section("footer")}>
+            <div class="disclaimer">
+              ${this.#B()}
+            </div>
+            <div class="filler"></div>
+            <div class="buttons">
+                ${this.#S()}
+                ${this.#R()}
+                ${this.#I(this.#$,!this.#w())}
+              </div>
+          </footer>`}case"insight":return A`<footer jslog=${g.section("footer")}>
+        <div class="disclaimer">
+          ${n}
+        </div>
+        <div class="filler"></div>
+        <div class="rating">
+          ${t?A`
+            <${i.Button.Button.litTagName}
+              data-rating=${"true"}
+              .data=${{variant:"icon",size:"SMALL",iconName:"thumb-up",active:void 0!==this.#a&&this.#a,title:B(I.thumbsUp),jslogContext:"thumbs-up"}}
+              @click=${this.#u}
+            ></${i.Button.Button.litTagName}>
+            <${i.Button.Button.litTagName}
+              data-rating=${"false"}
+              .data=${{variant:"icon",size:"SMALL",iconName:"thumb-down",active:void 0!==this.#a&&!this.#a,title:B(I.thumbsDown),jslogContext:"thumbs-down"}}
+              @click=${this.#u}
+            ></${i.Button.Button.litTagName}>
+          `:d.nothing}
+          <${i.Button.Button.litTagName}
+            .data=${{variant:"icon",size:"SMALL",iconName:"report",title:B(I.report),jslogContext:"report"}}
+            @click=${this.#m}
+          ></${i.Button.Button.litTagName}>
+        </div>
+
+      </footer>`}}#P(){switch(this.#i.type){case"not-logged-in":return B(I.signInToUse);case"sync-is-off":return B(I.notAvailable);case"offline":return B(I.offlineHeader);case"loading":return B(I.generating);case"insight":return B(I.insight);case"error":return B(I.error);case"consent-reminder":return B(I.inputData);case"consent-onboarding":switch(this.#i.page){case"private":return"Privacy notice";case"legal":return"Legal notice"}}}#l(){E(A`
+      <div class="wrapper" jslog=${g.pane("console-insights").track({resize:!0})}>
+        <header>
+          <div class="filler">
+            <h2 tabindex="-1">
+              ${this.#P()}
+            </h2>
+          </div>
+          <div>
+            <${i.Button.Button.litTagName}
+              .data=${{variant:"icon",size:"SMALL",iconName:"cross",title:B(I.closeInsight)}}
+              jslog=${g.close().track({click:!0})}
+              @click=${this.#h}
+            ></${i.Button.Button.litTagName}>
+          </div>
+        </header>
+        ${this.#A()}
+        ${this.#j()}
+      </div>
+    `,this.#t,{host:this})}}class q extends HTMLElement{static litTagName=d.literal`devtools-console-insight-sources-list`;#t=this.attachShadow({mode:"open"});#U=[];#L=!1;constructor(){super(),this.#t.adoptedStyleSheets=[S,r.checkboxStyles]}#l(){E(A`
+      <ul>
+        ${j.repeat(this.#U,(e=>e.value),(e=>A`<li><x-link class="link" title="${U(e.type)} ${B(I.opensInNewTab)}" href="data:text/plain,${encodeURIComponent(e.value)}" jslog=${g.link("source-"+e.type).track({click:!0})}>
+            <${a.Icon.Icon.litTagName} name="open-externally"></${a.Icon.Icon.litTagName}>
+            ${U(e.type)}
+          </x-link></li>`))}
+        ${this.#L?d.html`<li class="source-disclaimer">
+          <${a.Icon.Icon.litTagName} name="warning"></${a.Icon.Icon.litTagName}>
+          ${B(I.reloadRecommendation)}</li>`:d.nothing}
+      </ul>
+    `,this.#t,{host:this})}set sources(e){this.#U=e,this.#l()}set isPageReloadRecommended(e){this.#L=e,this.#l()}}customElements.define("devtools-console-insight",D),customElements.define("devtools-console-insight-sources-list",q);class _{handleAction(e,n){switch(n){case"explain.console-message.context":case"explain.console-message.context.error":case"explain.console-message.context.warning":case"explain.console-message.context.other":case"explain.console-message.hover":{const o=e.flavor(f.ConsoleViewMessage.ConsoleViewMessage);if(o){n.startsWith("explain.console-message.context")?t.userMetrics.actionTaken(t.UserMetrics.Action.InsightRequestedViaContextMenu):"explain.console-message.hover"===n&&t.userMetrics.actionTaken(t.UserMetrics.Action.InsightRequestedViaHoverButton);const e=new k(o),s=new t.AidaClient.AidaClient;return D.create(e,s).then((e=>{o.setInsight(e)})),!0}return!1}}return!1}}export{_ as ActionDelegate,P as CloseEvent,D as ConsoleInsight,k as PromptBuilder,y as SourceType,x as allowHeader,C as formatConsoleMessage,T as formatNetworkRequest,w as formatRelatedCode,R as formatStackTrace,b as lineWhitespace};