@react-native/debugger-frontend 0.73.0

package/dist/third-party/front_end/panels/elements/elements.js

@@ -0,0 +1 @@
+import*as e from"../../core/common/common.js";import*as t from"../../core/root/root.js";import*as s from"../../core/sdk/sdk.js";import*as n from"../../ui/legacy/legacy.js";import*as i from"../../core/host/host.js";import*as o from"../../core/i18n/i18n.js";import*as r from"../../core/platform/platform.js";import{assertNotNullOrUndefined as a}from"../../core/platform/platform.js";import*as l from"../../models/extensions/extensions.js";import*as d from"../../ui/components/buttons/buttons.js";import*as c from"../../ui/components/tree_outline/tree_outline.js";import*as h from"./components/components.js";import*as u from"../../ui/lit-html/lit-html.js";import*as p from"../../ui/legacy/components/inline_editor/inline_editor.js";import*as m from"../../ui/legacy/components/utils/utils.js";import*as g from"../../models/bindings/bindings.js";import*as f from"../../models/text_utils/text_utils.js";import*as y from"../../ui/legacy/components/color_picker/color_picker.js";import*as C from"../../ui/components/icon_button/icon_button.js";import*as S from"../../models/workspace/workspace.js";import*as b from"../../models/workspace_diff/workspace_diff.js";import{highlightElement as E,formatCSSChangesFromDiff as v}from"../utils/utils.js";import*as w from"../../ui/components/diff_view/diff_view.js";import*as x from"../../third_party/codemirror.next/codemirror.next.js";import*as T from"../../ui/components/adorners/adorners.js";import*as I from"../../ui/components/code_highlighter/code_highlighter.js";import*as M from"../../ui/components/text_editor/text_editor.js";import*as N from"../emulation/emulation.js";import*as P from"../../models/issues_manager/issues_manager.js";import*as R from"../../ui/components/issue_counter/issue_counter.js";import*as k from"../../ui/components/markdown_view/markdown_view.js";import*as L from"../network/forward/forward.js";import*as A from"../issues/components/components.js";import*as O from"../../models/logs/logs.js";import*as D from"../../ui/components/request_link_icon/request_link_icon.js";import*as F from"../event_listeners/event_listeners.js";import*as U from"../../ui/legacy/components/object_ui/object_ui.js";const H=new CSSStyleSheet;function V(e){const t=s.FrameManager.FrameManager.instance().getFrame(e)?.resourceTreeModel().target().model(s.AccessibilityModel.AccessibilityModel);if(!t)throw Error("Could not instantiate model for frameId");return t}async function B(e){const t=V(e),s=await t.requestRootNode(e);if(!s)throw Error("No accessibility root for frame");return s}function _(e){let t;if(t=e instanceof s.DOMModel.DOMDocument?e.body?.frameId():e.frameId(),!t)throw Error("No frameId for DOM node");return t}async function W(e){let t=_(e);const n=V(t),i=await n.requestAndLoadSubTreeToNode(e);if(!i)throw Error("Could not retrieve accessibility node for inspected DOM node");const o=s.FrameManager.FrameManager.instance().getOutermostFrame()?.id;if(!o)return i;for(;t!==o;){const e=await(s.FrameManager.FrameManager.instance().getFrame(t)?.getOwnerDOMNodeOrDocument());if(!e)break;t=_(e);const n=V(t),o=await n.requestAndLoadSubTreeToNode(e);i.push(...o||[])}return i}async function q(e){const t=e;return 0===(s=e).numChildren()&&"Iframe"!==s.role()?.value?[{treeNodeData:t,id:K(e)}]:[{treeNodeData:t,children:async()=>{const t=await async function(e){if("Iframe"===e.role()?.value){const t=await(e.deferredDOMNode()?.resolvePromise());if(!t)throw new Error("Could not find corresponding DOMNode");const s=t.frameOwnerFrameId();if(!s)throw Error("No owner frameId on iframe node");return[await B(s)]}return e.accessibilityModel().requestAXChildren(e.id(),e.getFrameId()||void 0)}(e);return(await Promise.all(t.map((e=>q(e))))).flat(1)},id:K(e)}];var s}function z(e){const t=h.AccessibilityTreeNode.AccessibilityTreeNode.litTagName,s=e.treeNodeData,n=s.name()?.value||"",i=s.role()?.value||"",o=s.properties()||[],r=s.ignored(),a=K(s);return u.html`<${t} .data="${{name:n,role:i,ignored:r,properties:o,id:a}}"></${t}>`}function K(e){return e.getFrameId()+"#"+e.id()}H.replaceSync("#main-content{position:relative;flex:1 1}#elements-content{overflow:auto;padding:2px 0 0;height:100%}.style-panes-wrapper{overflow:hidden scroll;background-color:var(--color-background)}.style-panes-wrapper > div:not(:last-child){border-bottom:1px solid var(--color-details-hairline)}#elements-content:not(.elements-wrap) > div{display:inline-block;min-width:100%}#elements-crumbs{background-color:var(--color-background);border-top:1px solid var(--color-details-hairline);overflow:hidden;width:100%}devtools-adorner-settings-pane{margin-bottom:10px;border-bottom:1px solid var(--color-details-hairline);overflow:auto}devtools-tree-outline{overflow:auto}.axtree-button{position:absolute;top:16px;right:20px;background-color:var(--color-background-elevation-1);display:flex;justify-content:center;align-items:center;z-index:1;border:1px solid var(--color-details-hairline);border-radius:3px}\n/*# sourceURL=elementsPanel.css */\n");var j=Object.freeze({__proto__:null,getRootNode:B,getNodeAndAncestorsFromDOMNode:W,sdkNodeToAXTreeNodes:q,accessibilityNodeRenderer:z,getNodeId:K});const $=new CSSStyleSheet;$.replaceSync(".accessibility-tree-view-container{height:100%;overflow:auto}\n/*# sourceURL=accessibilityTreeView.css */\n");class G extends n.Widget.VBox{accessibilityTreeComponent;toggleButton;inspectedDOMNode=null;root=null;constructor(e,t){super(),this.toggleButton=e,this.accessibilityTreeComponent=t;const n=this.contentElement.createChild("div");n.classList.add("accessibility-tree-view-container"),n.appendChild(this.toggleButton),n.appendChild(this.accessibilityTreeComponent),s.TargetManager.TargetManager.instance().observeModels(s.AccessibilityModel.AccessibilityModel,this,{scoped:!0}),this.accessibilityTreeComponent.addEventListener("itemselected",(e=>{const t=e.data.node.treeNodeData;if(!t.isDOMNode())return;const s=t.deferredDOMNode();s&&s.resolve((e=>{e&&(this.inspectedDOMNode=e,eo.instance().revealAndSelectNode(e,!0,!1))}))})),this.accessibilityTreeComponent.addEventListener("itemmouseover",(e=>{e.data.node.treeNodeData.highlightDOMNode()})),this.accessibilityTreeComponent.addEventListener("itemmouseout",(()=>{s.OverlayModel.OverlayModel.hideDOMNodeHighlight()}))}async wasShown(){await this.refreshAccessibilityTree(),this.inspectedDOMNode&&await this.loadSubTreeIntoAccessibilityModel(this.inspectedDOMNode),this.registerCSSFiles([$])}async refreshAccessibilityTree(){if(!this.root){const e=s.FrameManager.FrameManager.instance().getOutermostFrame()?.id;if(!e)throw Error("No top frame");if(this.root=await B(e),!this.root)throw Error("No root")}await this.renderTree(),await this.accessibilityTreeComponent.expandRecursively(1)}async renderTree(){if(!this.root)return;const e=await q(this.root);this.accessibilityTreeComponent.data={defaultRenderer:z,tree:e,filter:e=>e.ignored()||"generic"===e.role()?.value&&!e.name()?.value?"FLATTEN":"SHOW"}}async loadSubTreeIntoAccessibilityModel(e){const t=await W(e),s=t.find((t=>t.backendDOMNodeId()===e.backendNodeId()));s&&(await this.accessibilityTreeComponent.expandNodeIds(t.map((e=>e.getFrameId()+"#"+e.id()))),await this.accessibilityTreeComponent.focusNodeId(K(s)))}async revealAndSelectNode(e){e!==this.inspectedDOMNode&&(this.inspectedDOMNode=e,this.isShowing()&&await this.loadSubTreeIntoAccessibilityModel(e))}async selectedNodeChanged(e){this.isShowing()||e===this.inspectedDOMNode||(!e.ownerDocument||"HTML"!==e.nodeName()&&"BODY"!==e.nodeName()?this.inspectedDOMNode=e:this.inspectedDOMNode=e.ownerDocument)}treeUpdated({data:e}){if(!e.root)return void this.renderTree();const t=s.FrameManager.FrameManager.instance().getOutermostFrame()?.id;e.root?.getFrameId()===t?(this.root=e.root,this.accessibilityTreeComponent.collapseAllNodes(),this.refreshAccessibilityTree()):this.renderTree()}modelAdded(e){e.addEventListener(s.AccessibilityModel.Events.TreeUpdated,this.treeUpdated,this)}modelRemoved(e){e.removeEventListener(s.AccessibilityModel.Events.TreeUpdated,this.treeUpdated,this)}}var Y=Object.freeze({__proto__:null,AccessibilityTreeView:G});const Q=new CSSStyleSheet;Q.replaceSync(".styles-sidebar-pane-toolbar{border-bottom:1px solid var(--color-details-hairline-light);flex-shrink:0}.styles-sidebar-pane-filter-box{flex:auto;display:flex}.styles-sidebar-pane-filter-box > input{outline:none!important;border:none;width:100%;background:var(--color-background);padding-left:4px;margin:3px}.styles-sidebar-pane-filter-box > input:focus,\n.styles-sidebar-pane-filter-box > input:not(:placeholder-shown){box-shadow:var(--legacy-focus-ring-active-shadow)}.styles-sidebar-pane-filter-box > input::placeholder{color:var(--color-text-secondary)}@media (forced-colors: active){.styles-sidebar-pane-filter-box > input{border:1px solid ButtonText}}.styles-sidebar-computed-style-widget{min-height:auto}\n/*# sourceURL=computedStyleSidebarPane.css */\n");class X extends e.ObjectWrapper.ObjectWrapper{nodeInternal;cssModelInternal;eventListeners;frameResizedTimer;computedStylePromise;constructor(){super(),this.nodeInternal=n.Context.Context.instance().flavor(s.DOMModel.DOMNode),this.cssModelInternal=null,this.eventListeners=[],n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.onNodeChanged,this)}node(){return this.nodeInternal}cssModel(){return this.cssModelInternal&&this.cssModelInternal.isEnabled()?this.cssModelInternal:null}onNodeChanged(e){this.nodeInternal=e.data,this.updateModel(this.nodeInternal?this.nodeInternal.domModel().cssModel():null),this.onComputedStyleChanged(null)}updateModel(t){if(this.cssModelInternal===t)return;e.EventTarget.removeEventListeners(this.eventListeners),this.cssModelInternal=t;const n=t?t.domModel():null,i=t?t.target().model(s.ResourceTreeModel.ResourceTreeModel):null;t&&n&&i&&(this.eventListeners=[t.addEventListener(s.CSSModel.Events.StyleSheetAdded,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.StyleSheetRemoved,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.StyleSheetChanged,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.FontsUpdated,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.MediaQueryResultChanged,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.PseudoStateForced,this.onComputedStyleChanged,this),t.addEventListener(s.CSSModel.Events.ModelWasEnabled,this.onComputedStyleChanged,this),n.addEventListener(s.DOMModel.Events.DOMMutated,this.onDOMModelChanged,this),i.addEventListener(s.ResourceTreeModel.Events.FrameResized,this.onFrameResized,this)])}onComputedStyleChanged(e){delete this.computedStylePromise,this.dispatchEventToListeners("ComputedStyleChanged",e?.data??null)}onDOMModelChanged(e){const t=e.data;this.nodeInternal&&(this.nodeInternal===t||t.parentNode===this.nodeInternal.parentNode||t.isAncestor(this.nodeInternal))&&this.onComputedStyleChanged(null)}onFrameResized(){this.frameResizedTimer&&clearTimeout(this.frameResizedTimer),this.frameResizedTimer=window.setTimeout(function(){this.onComputedStyleChanged(null),delete this.frameResizedTimer}.bind(this),100)}elementNode(){const e=this.node();return e?e.enclosingElementOrSelf():null}async fetchComputedStyle(){const e=this.elementNode(),t=this.cssModel();if(!e||!t)return null;const s=e.id;return s?(this.computedStylePromise||(this.computedStylePromise=t.getComputedStyle(s).then(function(e,t){return e===this.elementNode()&&t?new J(e,t):null}.bind(this,e))),this.computedStylePromise):null}}class J{node;computedStyle;constructor(e,t){this.node=e,this.computedStyle=t}}var Z=Object.freeze({__proto__:null,ComputedStyleModel:X,ComputedStyle:J});class ee{getLinkElement;getDOMNode;popover;constructor(e,t,s){this.getLinkElement=t,this.getDOMNode=s,this.popover=new n.PopoverHelper.PopoverHelper(e,this.handleRequest.bind(this)),this.popover.setHasPadding(!0),this.popover.setTimeout(0,100)}handleRequest(e){const t=this.getLinkElement(e);if(!t)return null;const s=te.get(t);return s?{box:t.boxInWindow(),hide:void 0,show:async e=>{const n=this.getDOMNode(t);if(!n)return!1;const i=await m.ImagePreview.ImagePreview.loadDimensionsForNode(n),o=await m.ImagePreview.ImagePreview.build(n.domModel().target(),s,!0,{imageAltText:void 0,precomputedFeatures:i});return o&&e.contentElement.appendChild(o),Boolean(o)}}:null}hide(){this.popover.hidePopover()}static setImageUrl(e,t){return te.set(e,t),e}static getImageURL(e){return te.get(e)}}const te=new WeakMap,se=new CSSStyleSheet;se.replaceSync(":host{user-select:text}.platform-fonts{flex-shrink:0}.font-name{font-weight:bold}.font-usage{color:var(--color-text-secondary);padding-left:3px}.title{padding:0 5px;border-top:1px solid;border-bottom:1px solid;border-color:var(--color-background-elevation-2);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;height:24px;background-color:var(--color-background-elevation-0);display:flex;align-items:center}.stats-section{margin:5px 0}.font-stats-item{padding-left:1em}.font-stats-item .font-delimeter{margin:0 1ex}\n/*# sourceURL=platformFontsWidget.css */\n");const ne={renderedFonts:"Rendered Fonts",networkResource:"Network resource",localFile:"Local file",dGlyphs:"{n, plural, =1 {(# glyph)} other {(# glyphs)}}"},ie=o.i18n.registerUIStrings("panels/elements/PlatformFontsWidget.ts",ne),oe=o.i18n.getLocalizedString.bind(void 0,ie);class re extends n.ThrottledWidget.ThrottledWidget{sharedModel;sectionTitle;fontStatsSection;constructor(e){super(!0),this.sharedModel=e,this.sharedModel.addEventListener("ComputedStyleChanged",this.update,this),this.sectionTitle=document.createElement("div"),this.sectionTitle.classList.add("title"),this.contentElement.classList.add("platform-fonts"),this.contentElement.appendChild(this.sectionTitle),this.sectionTitle.textContent=oe(ne.renderedFonts),this.fontStatsSection=this.contentElement.createChild("div","stats-section")}doUpdate(){const e=this.sharedModel.cssModel(),t=this.sharedModel.node();return t&&e?e.getPlatformFonts(t.id).then(this.refreshUI.bind(this,t)):Promise.resolve()}refreshUI(e,t){if(this.sharedModel.node()!==e)return;this.fontStatsSection.removeChildren();const s=!t||!t.length;if(this.sectionTitle.classList.toggle("hidden",s),!s&&t){t.sort((function(e,t){return t.glyphCount-e.glyphCount}));for(let e=0;e<t.length;++e){const s=this.fontStatsSection.createChild("div","font-stats-item");s.createChild("span","font-name").textContent=t[e].familyName;s.createChild("span","font-delimeter").textContent="—";s.createChild("span").textContent=t[e].isCustomFont?oe(ne.networkResource):oe(ne.localFile);const n=s.createChild("span","font-usage"),i=t[e].glyphCount;n.textContent=oe(ne.dGlyphs,{n:i})}}}wasShown(){super.wasShown(),this.registerCSSFiles([se])}}var ae=Object.freeze({__proto__:null,PlatformFontsWidget:re});const le=["Layout","Text","Appearance","Animation","CSS Variables","Grid","Flex","Table","Generated Content","Other"],de=new Map([["Layout",["display","margin","padding","height","width","position","top","right","bottom","left","z-index","float","clear","overflow","resize","clip","visibility","box-sizing","align-content","align-items","align-self","flex","flex-basis","flex-direction","flex-flow","flex-grow","flex-shrink","flex-wrap","justify-content","order","inline-size","block-size","min-inline-size","min-block-size","max-inline-size","max-block-size","min-width","max-width","min-height","max-height"]],["Text",["font","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","font-smoothing","direction","tab-size","text-align","text-align-last","text-decoration","text-decoration-color","text-decoration-line","text-decoration-style","text-indent","text-justify","text-overflow","text-shadow","text-transform","text-size-adjust","line-height","vertical-align","letter-spacing","word-spacing","white-space","word-break","word-wrap"]],["Appearance",["color","outline","outline-color","outline-offset","outline-style","Outline-width","border","border-image","background","cursor","box-shadow","≈","tap-highlight-color"]],["Animation",["animation","animation-delay","animation-direction","animation-duration","animation-fill-mode","animation-iteration-count","animation-name","animation-play-state","animation-timing-function","transition","transition-delay","transition-duration","transition-property","transition-timing-function"]],["Grid",["grid","grid-column","grid-row","order","place-items","place-content","place-self"]],["Flex",["flex","order","place-items","place-content","place-self"]],["Table",["border-collapse","border-spacing","caption-side","empty-cells","table-layout"]],["Generated Content",["content","quotes","counter-reset","counter-increment"]]]),ce=new Map;for(const[e,t]of de)for(const s of t){ce.has(s)||ce.set(s,[]);ce.get(s).push(e)}const he=e=>ce.has(e)?ce.get(e):e.startsWith("--")?["CSS Variables"]:[],ue=e=>{const t=s.CSSMetadata.cssMetadata(),n=t.canonicalPropertyName(e),i=he(n);if(i.length>0)return i;const o=t.getShorthands(n);if(o)for(const e of o){const t=he(e);if(t.length>0)return t}return["Other"]},pe={openCubicBezierEditor:"Open cubic bezier editor",openShadowEditor:"Open shadow editor"},me=o.i18n.registerUIStrings("panels/elements/ColorSwatchPopoverIcon.ts",pe),ge=o.i18n.getLocalizedString.bind(void 0,me);class fe{treeElement;swatchPopoverHelper;swatch;boundBezierChanged;boundOnScroll;bezierEditor;scrollerElement;originalPropertyText;constructor({treeElement:e,swatchPopoverHelper:t,swatch:s}){this.treeElement=e,this.swatchPopoverHelper=t,this.swatch=s,n.Tooltip.Tooltip.install(this.swatch.iconElement(),ge(pe.openCubicBezierEditor)),this.swatch.iconElement().addEventListener("click",this.iconClick.bind(this),!1),this.swatch.iconElement().addEventListener("mousedown",(e=>e.consume()),!1),this.boundBezierChanged=this.bezierChanged.bind(this),this.boundOnScroll=this.onScroll.bind(this)}iconClick(t){if(t.consume(!0),this.swatchPopoverHelper.isShowing())return void this.swatchPopoverHelper.hide(!0);const s=p.AnimationTimingModel.AnimationTimingModel.parse(this.swatch.bezierText())||p.AnimationTimingModel.LINEAR_BEZIER;this.bezierEditor=new p.BezierEditor.BezierEditor(s),this.bezierEditor.addEventListener(p.BezierEditor.Events.BezierChanged,this.boundBezierChanged),this.swatchPopoverHelper.show(this.bezierEditor,this.swatch.iconElement(),this.onPopoverHidden.bind(this)),this.scrollerElement=this.swatch.enclosingNodeOrSelfWithClass("style-panes-wrapper"),this.scrollerElement&&this.scrollerElement.addEventListener("scroll",this.boundOnScroll,!1),this.originalPropertyText=this.treeElement.property.propertyText,this.treeElement.parentPane().setEditingStyle(!0);const n=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().propertyUILocation(this.treeElement.property,!1);n&&e.Revealer.reveal(n,!0)}bezierChanged(e){this.swatch.setBezierText(e.data),this.treeElement.applyStyleText(this.treeElement.renderedPropertyText(),!1)}onScroll(e){this.swatchPopoverHelper.hide(!0)}onPopoverHidden(e){this.scrollerElement&&this.scrollerElement.removeEventListener("scroll",this.boundOnScroll,!1),this.bezierEditor&&this.bezierEditor.removeEventListener(p.BezierEditor.Events.BezierChanged,this.boundBezierChanged),this.bezierEditor=void 0;const t=e?this.treeElement.renderedPropertyText():this.originalPropertyText||"";this.treeElement.applyStyleText(t,!0),this.treeElement.parentPane().setEditingStyle(!1),delete this.originalPropertyText}}class ye extends e.ObjectWrapper.ObjectWrapper{treeElement;swatchPopoverHelper;swatch;contrastInfo;boundSpectrumChanged;boundOnScroll;spectrum;scrollerElement;originalPropertyText;constructor(e,t,s){super(),this.treeElement=e,this.swatchPopoverHelper=t,this.swatch=s,this.swatch.addEventListener(p.ColorSwatch.ClickEvent.eventName,this.iconClick.bind(this)),this.contrastInfo=null,this.boundSpectrumChanged=this.spectrumChanged.bind(this),this.boundOnScroll=this.onScroll.bind(this)}generateCSSVariablesPalette(){const t=this.treeElement.matchedStyles(),s=this.treeElement.property.ownerStyle,n=t.availableCSSVariables(s),i=[],o=[];for(const r of n){if(r===this.treeElement.property.name)continue;const n=t.computeCSSVariable(s,r);if(!n)continue;e.Color.parse(n)&&(i.push(n),o.push(r))}return{title:"CSS Variables",mutable:!1,matchUserFormat:!0,colors:i,colorNames:o}}setContrastInfo(e){this.contrastInfo=e}iconClick(e){e.consume(!0),this.showPopover()}async toggleEyeDropper(){await(this.spectrum?.toggleColorPicker())}showPopover(){if(this.swatchPopoverHelper.isShowing())return void this.swatchPopoverHelper.hide(!0);const t=this.swatch.getColor(),s=this.swatch.getFormat();if(!t||!s)return;this.spectrum=new y.Spectrum.Spectrum(this.contrastInfo),this.spectrum.setColor(t,s),this.spectrum.addPalette(this.generateCSSVariablesPalette()),this.spectrum.addEventListener(y.Spectrum.Events.SizeChanged,this.spectrumResized,this),this.spectrum.addEventListener(y.Spectrum.Events.ColorChanged,this.boundSpectrumChanged),this.swatchPopoverHelper.show(this.spectrum,this.swatch,this.onPopoverHidden.bind(this)),this.scrollerElement=this.swatch.enclosingNodeOrSelfWithClass("style-panes-wrapper"),this.scrollerElement&&this.scrollerElement.addEventListener("scroll",this.boundOnScroll,!1),this.originalPropertyText=this.treeElement.property.propertyText,this.treeElement.parentPane().setEditingStyle(!0);const o=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().propertyUILocation(this.treeElement.property,!1);o&&e.Revealer.reveal(o,!0),n.Context.Context.instance().setFlavor(ye,this),i.userMetrics.colorPickerOpenedFrom(1)}spectrumResized(){this.swatchPopoverHelper.reposition()}async spectrumChanged(t){const s=e.Color.parse(t.data);if(!s)return;const n=this.spectrum?this.spectrum.colorName():void 0,i=n&&n.startsWith("--")?`var(${n})`:s.getAuthoredText()??s.asString();this.swatch.renderColor(s);const o=this.swatch.firstElementChild;o&&(o.remove(),this.swatch.createChild("span").textContent=i),i&&this.dispatchEventToListeners("colorchanged",i)}onScroll(e){this.swatchPopoverHelper.hide(!0)}onPopoverHidden(e){this.scrollerElement&&this.scrollerElement.removeEventListener("scroll",this.boundOnScroll,!1),this.spectrum&&this.spectrum.removeEventListener(y.Spectrum.Events.ColorChanged,this.boundSpectrumChanged),this.spectrum=void 0;const t=e?this.treeElement.renderedPropertyText():this.originalPropertyText||"";this.treeElement.applyStyleText(t,!0),this.treeElement.parentPane().setEditingStyle(!1),delete this.originalPropertyText,n.Context.Context.instance().setFlavor(ye,null)}}class Ce{treeElement;swatchPopoverHelper;shadowSwatch;iconElement;boundShadowChanged;boundOnScroll;cssShadowEditor;scrollerElement;originalPropertyText;constructor(e,t,s){this.treeElement=e,this.swatchPopoverHelper=t,this.shadowSwatch=s,this.iconElement=s.iconElement(),n.Tooltip.Tooltip.install(this.iconElement,ge(pe.openShadowEditor)),this.iconElement.addEventListener("click",this.iconClick.bind(this),!1),this.iconElement.addEventListener("mousedown",(e=>e.consume()),!1),this.boundShadowChanged=this.shadowChanged.bind(this),this.boundOnScroll=this.onScroll.bind(this)}iconClick(e){e.consume(!0),this.showPopover()}showPopover(){if(this.swatchPopoverHelper.isShowing())return void this.swatchPopoverHelper.hide(!0);this.cssShadowEditor=new p.CSSShadowEditor.CSSShadowEditor,this.cssShadowEditor.setModel(this.shadowSwatch.model()),this.cssShadowEditor.addEventListener(p.CSSShadowEditor.Events.ShadowChanged,this.boundShadowChanged),this.swatchPopoverHelper.show(this.cssShadowEditor,this.iconElement,this.onPopoverHidden.bind(this)),this.scrollerElement=this.iconElement.enclosingNodeOrSelfWithClass("style-panes-wrapper"),this.scrollerElement&&this.scrollerElement.addEventListener("scroll",this.boundOnScroll,!1),this.originalPropertyText=this.treeElement.property.propertyText,this.treeElement.parentPane().setEditingStyle(!0);const t=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().propertyUILocation(this.treeElement.property,!1);t&&e.Revealer.reveal(t,!0)}shadowChanged(e){this.shadowSwatch.setCSSShadow(e.data),this.treeElement.applyStyleText(this.treeElement.renderedPropertyText(),!1)}onScroll(e){this.swatchPopoverHelper.hide(!0)}onPopoverHidden(e){this.scrollerElement&&this.scrollerElement.removeEventListener("scroll",this.boundOnScroll,!1),this.cssShadowEditor&&this.cssShadowEditor.removeEventListener(p.CSSShadowEditor.Events.ShadowChanged,this.boundShadowChanged),this.cssShadowEditor=void 0;const t=e?this.treeElement.renderedPropertyText():this.originalPropertyText||"";this.treeElement.applyStyleText(t,!0),this.treeElement.parentPane().setEditingStyle(!1),delete this.originalPropertyText}}class Se{treeElementMap;swatchPopoverHelper;section;parentPane;fontEditor;scrollerElement;boundFontChanged;boundOnScroll;boundResized;constructor(e,t){this.treeElementMap=new Map,this.swatchPopoverHelper=e,this.section=t,this.parentPane=null,this.fontEditor=null,this.scrollerElement=null,this.boundFontChanged=this.fontChanged.bind(this),this.boundOnScroll=this.onScroll.bind(this),this.boundResized=this.fontEditorResized.bind(this)}fontChanged(e){const{propertyName:t,value:s}=e.data,n=this.treeElementMap.get(t);this.updateFontProperty(t,s,n)}async updateFontProperty(e,t,s){if(s&&s.treeOutline&&s.valueElement&&s.property.parsedOk&&s.property.range){let e,n=!1;s.valueElement.textContent=t,s.property.value=t;const i=s.property.name;t.length?e=s.renderedPropertyText():(e="",n=!0,this.fixIndex(s.property.index)),this.treeElementMap.set(i,s),await s.applyStyleText(e,!0),n&&this.treeElementMap.delete(i)}else if(t.length){const s=this.section.addNewBlankProperty();s&&(s.property.name=e,s.property.value=t,s.updateTitle(),await s.applyStyleText(s.renderedPropertyText(),!0),this.treeElementMap.set(s.property.name,s))}this.section.onpopulate(),this.swatchPopoverHelper.reposition()}fontEditorResized(){this.swatchPopoverHelper.reposition()}fixIndex(e){for(const t of this.treeElementMap.values())t.property.index>e&&(t.property.index-=1)}createPropertyValueMap(){const e=new Map;for(const t of this.treeElementMap){const s=t[0],n=t[1];n.property.value.length?e.set(s,n.property.value):this.treeElementMap.delete(s)}return e}registerFontProperty(e){const t=e.property.name;if(this.treeElementMap.has(t)){const s=this.treeElementMap.get(t);(!e.overloaded()||s&&s.overloaded())&&this.treeElementMap.set(t,e)}else this.treeElementMap.set(t,e)}async showPopover(e,t){if(this.swatchPopoverHelper.isShowing())return void this.swatchPopoverHelper.hide(!0);this.parentPane=t;const s=this.createPropertyValueMap();this.fontEditor=new p.FontEditor.FontEditor(s),this.fontEditor.addEventListener(p.FontEditor.Events.FontChanged,this.boundFontChanged),this.fontEditor.addEventListener(p.FontEditor.Events.FontEditorResized,this.boundResized),this.swatchPopoverHelper.show(this.fontEditor,e,this.onPopoverHidden.bind(this)),this.scrollerElement=e.enclosingNodeOrSelfWithClass("style-panes-wrapper"),this.scrollerElement&&this.scrollerElement.addEventListener("scroll",this.boundOnScroll,!1),this.parentPane.setEditingStyle(!0)}onScroll(){this.swatchPopoverHelper.hide(!0)}onPopoverHidden(){this.scrollerElement&&this.scrollerElement.removeEventListener("scroll",this.boundOnScroll,!1),this.section.onpopulate(),this.fontEditor&&this.fontEditor.removeEventListener(p.FontEditor.Events.FontChanged,this.boundFontChanged),this.fontEditor=null,this.parentPane&&this.parentPane.setEditingStyle(!1),this.section.resetToolbars(),this.section.onpopulate()}static treeElementSymbol=Symbol("FontEditorSectionManager._treeElementSymbol")}var be=Object.freeze({__proto__:null,BezierPopoverIcon:fe,ColorSwatchPopoverIcon:ye,ShadowSwatchPopoverHelper:Ce,FontEditorSectionManager:Se});const Ee=new CSSStyleSheet;Ee.replaceSync(":host{display:inline}.node-link{cursor:pointer;display:inline;pointer-events:auto}.node-link:focus-visible{outline-width:unset}.node-label-name{color:var(--color-syntax-1)}.node-label-class,\n.node-label-pseudo{color:var(--color-syntax-4)}\n/*# sourceURL=domLinkifier.css */\n");const ve={node:"<node>"},we=o.i18n.registerUIStrings("panels/elements/DOMLinkifier.ts",ve),xe=o.i18n.getLocalizedString.bind(void 0,we),Te=function(e,t,s){const i=e,o=e.nodeType()===Node.ELEMENT_NODE&&e.pseudoType();o&&e.parentNode&&(e=e.parentNode);let r=e.nodeNameInCorrectCase();const a=t.createChild("span","node-label-name");a.textContent=r;const l=e.getAttribute("id");if(l){const e=t.createChild("span","node-label-id"),s="#"+l;r+=s,n.UIUtils.createTextChild(e,s),a.classList.add("extra")}const d=e.getAttribute("class");if(d){const e=d.split(/\s+/);if(e.length){const s=new Set,i=t.createChild("span","extra node-label-class");for(let t=0;t<e.length;++t){const o=e[t];if(o&&!s.has(o)){const e="."+o;r+=e,n.UIUtils.createTextChild(i,e),s.add(o)}}}}if(o){const e=t.createChild("span","extra node-label-pseudo"),s="::"+i.pseudoType();n.UIUtils.createTextChild(e,s),r+=s}n.Tooltip.Tooltip.install(t,s||r)},Ie=function(t,i={tooltip:void 0,preventKeyboardFocus:void 0}){if(!t)return document.createTextNode(xe(ve.node));const o=document.createElement("span");o.classList.add("monospace");const r=n.Utils.createShadowRootWithCoreStyles(o,{cssFile:[Ee],delegatesFocus:void 0}).createChild("div","node-link");return Te(t,r,i.tooltip),r.addEventListener("click",(()=>(e.Revealer.reveal(t,!1),!1)),!1),r.addEventListener("mouseover",t.highlight.bind(t,void 0),!1),r.addEventListener("mouseleave",(()=>s.OverlayModel.OverlayModel.hideDOMNodeHighlight()),!1),i.preventKeyboardFocus||(r.addEventListener("keydown",(s=>{"Enter"===s.key&&e.Revealer.reveal(t,!1)})),r.tabIndex=0,n.ARIAUtils.markAsLink(r)),o},Me=function(t,s={tooltip:void 0,preventKeyboardFocus:void 0}){const i=document.createElement("div"),o=n.Utils.createShadowRootWithCoreStyles(i,{cssFile:[Ee],delegatesFocus:void 0}).createChild("div","node-link");function r(t){e.Revealer.reveal(t)}return o.createChild("slot"),o.addEventListener("click",t.resolve.bind(t,r),!1),o.addEventListener("mousedown",(e=>e.consume()),!1),s.preventKeyboardFocus||(o.addEventListener("keydown",(e=>"Enter"===e.key&&t.resolve(r))),o.tabIndex=0,n.ARIAUtils.markAsLink(o)),i};let Ne;class Pe{static instance(e={forceNew:null}){const{forceNew:t}=e;return Ne&&!t||(Ne=new Pe),Ne}linkify(e,t){if(e instanceof s.DOMModel.DOMNode)return Ie(e,t);if(e instanceof s.DOMModel.DeferredDOMNode)return Me(e,t);throw new Error("Can't linkify non-node")}}var Re=Object.freeze({__proto__:null,decorateNodeLabel:Te,linkifyNodeReference:Ie,linkifyDeferredNodeReference:Me,Linkifier:Pe});const ke=new CSSStyleSheet;ke.replaceSync('.tree-outline{padding:0}.tree-outline li.not-parsed-ok{margin-left:0}.tree-outline li.filter-match{background-color:var(--color-match-highlight)}.tree-outline li.not-parsed-ok .exclamation-mark{display:inline-block;position:relative;width:11px;height:10px;margin:0 7px 0 0;top:1px;left:-36px;user-select:none;cursor:default;z-index:1}.tree-outline li{margin-left:12px;padding-left:22px;white-space:normal;text-overflow:ellipsis;cursor:auto;display:block}.tree-outline li::before{display:none}.has-ignorable-error .webkit-css-property{color:inherit}.tree-outline li .webkit-css-property{margin-left:-22px}.tree-outline > li{padding-left:38px;clear:both;min-height:14px}.tree-outline > li .webkit-css-property{margin-left:-38px}.tree-outline > li.child-editing{padding-left:8px}.tree-outline > li.child-editing .text-prompt{white-space:pre-wrap}.tree-outline > li.child-editing .webkit-css-property{margin-left:0}.tree-outline li.child-editing{word-wrap:break-word!important;white-space:normal!important;padding-left:0}ol:not(.tree-outline){display:none;margin:0;padding-inline-start:12px;list-style:none}ol.expanded{display:block}.tree-outline li .info{padding-top:4px;padding-bottom:3px}.enabled-button{visibility:hidden;float:left;font-size:10px;margin:0;vertical-align:top;position:relative;z-index:1;width:18px;left:-40px;top:1px;height:13px}.tree-outline li.editing .enabled-button{display:none!important}.overloaded:not(.has-ignorable-error, .invalid-property-value),\n.inactive:not(.invalid-property-value),\n.disabled,\n.not-parsed-ok:not(.has-ignorable-error, .invalid-property-value){text-decoration:line-through}.not-parsed-ok.invalid-property-value .value{text-decoration:line-through}.implicit,\n.inherited,\n.inactive-property{opacity:50%}.changed{background-color:var(--color-accent-green-background)}.changed::after{content:"";position:absolute;left:-4px;top:0;width:2px;height:100%;background-color:var(--color-accent-green)}.copy{display:none}.changed:hover .copy{position:absolute;right:-4px;top:0;bottom:0;margin:auto;display:inline-block;cursor:pointer;transform:scale(0.9)}.hint-wrapper{align-items:center;display:inline-block;margin-left:3px;max-height:13px;max-width:13px;vertical-align:middle}.hint{cursor:pointer;display:block;position:relative;left:-1.5px;top:-1.5px}.has-ignorable-error{color:var(--color-text-disabled)}.tree-outline li.editing{margin-left:10px;text-overflow:clip}.tree-outline li.editing-sub-part{padding:3px 6px 8px 18px;margin:-1px -6px -8px;text-overflow:clip}:host-context(.no-affect) .tree-outline li{opacity:50%}:host-context(.no-affect) .tree-outline li.editing{opacity:100%}:host-context(.styles-panel-hovered:not(.read-only)) .webkit-css-property:hover,\n:host-context(.styles-panel-hovered:not(.read-only)) .value:hover{text-decoration:underline;cursor:default}.styles-name-value-separator{display:inline-block;width:14px;text-decoration:inherit;white-space:pre}.styles-clipboard-only{display:inline-block;width:0;opacity:0%;pointer-events:none;white-space:pre}.styles-pane-button{width:15px;height:15px;padding:0;border:0;margin:0 0 0 6px;position:absolute;top:-1px;background-color:var(--color-background-elevation-2);border-radius:3px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.tree-outline li.child-editing .styles-clipboard-only{display:none}:host-context(.matched-styles) .tree-outline li{margin-left:0!important}.expand-icon{user-select:none;margin-left:-6px;margin-right:2px;margin-bottom:-4px}.tree-outline li:not(.parent) .expand-icon{display:none}:host-context(.matched-styles:not(.read-only):hover) .enabled-button{visibility:visible}:host-context(.matched-styles:not(.read-only)) .tree-outline li.disabled .enabled-button{visibility:visible}:host-context(.matched-styles) ol.expanded{margin-left:16px}.devtools-link-styled-trim{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:80%;vertical-align:bottom}devtools-css-angle,\ndevtools-css-length{display:inline-block}\n/*# sourceURL=stylesSectionTree.css */\n');let Le=null;class Ae extends n.Widget.VBox{editor;pane;section;editorContainer;#e;constructor(){super(!0),this.contentElement.tabIndex=0,this.setDefaultFocusedElement(this.contentElement),this.editorContainer=document.createElement("div"),this.contentElement.appendChild(this.editorContainer),this.onPropertySelected=this.onPropertySelected.bind(this),this.onPropertyDeselected=this.onPropertyDeselected.bind(this)}getSection(){return this.section}async onPropertySelected(e){if(!this.section)return;const t=Oe(this.section,e.data.name);t.property.value=e.data.value,t.updateTitle(),await t.applyStyleText(t.renderedPropertyText(),!1),await this.render()}async onPropertyDeselected(e){if(!this.section)return;const t=Oe(this.section,e.data.name);await t.applyStyleText("",!1),await this.render()}bindContext(e,t){this.pane=e,this.section=t,this.editor?.addEventListener("propertyselected",this.onPropertySelected),this.editor?.addEventListener("propertydeselected",this.onPropertyDeselected)}setTriggerKey(e){this.#e=e}getTriggerKey(){return this.#e}unbindContext(){this.pane=void 0,this.section=void 0,this.editor?.removeEventListener("propertyselected",this.onPropertySelected),this.editor?.removeEventListener("propertydeselected",this.onPropertyDeselected)}async render(){this.editor&&(this.editor.data={authoredProperties:this.section?Fe(this.section,this.editor.getEditableProperties()):new Map,computedProperties:this.pane?await De(this.pane):new Map})}static instance(){return Le||(Le=new Ae),Le}setEditor(e){this.editor instanceof e||(this.contentElement.removeChildren(),this.editor=new e,this.contentElement.appendChild(this.editor))}static createTriggerButton(e,t,s,n,i){const o=function(e){const t=document.createElement("button");t.classList.add("styles-pane-button"),t.tabIndex=0,t.title=e,t.onmouseup=e=>{e.stopPropagation()};const s=new C.Icon.Icon;return s.data={iconName:"flex-wrap",color:"var(--color-text-secondary)",width:"16px",height:"16px"},t.appendChild(s),t}(n);return o.onclick=async n=>{n.stopPropagation();const r=e.swatchPopoverHelper(),a=Ae.instance();a.setEditor(s),a.bindContext(e,t),a.setTriggerKey(i),await a.render();const l=o.enclosingNodeOrSelfWithClass("style-panes-wrapper"),d=()=>{r.hide(!0)};r.show(a,o,(()=>{a.unbindContext(),l&&l.removeEventListener("scroll",d)})),l&&l.addEventListener("scroll",d)},o}}function Oe(e,t){const s=e.propertiesTreeOutline.rootElement().children().find((e=>e instanceof Zt&&e.property.name===t));if(s)return s;const n=e.addNewBlankProperty();return n.property.name=t,n}async function De(e){const t=e.computedStyleModel(),s=await t.fetchComputedStyle();return s?s.computedStyle:new Map}function Fe(e,t){const s=new Map,n=new Set(t.map((e=>e.propertyName)));for(const t of e.style().leadingProperties())n.has(t.name)&&s.set(t.name,t.value);return s}var Ue=Object.freeze({__proto__:null,StyleEditorWidget:Ae});class He extends n.Widget.VBox{computedStyleModelInternal;updateThrottler;updateWhenVisible;constructor(t){super(!0,t),this.element.classList.add("flex-none"),this.computedStyleModelInternal=new X,this.computedStyleModelInternal.addEventListener("ComputedStyleChanged",this.onCSSModelChanged,this),this.updateThrottler=new e.Throttler.Throttler(100),this.updateWhenVisible=!1}node(){return this.computedStyleModelInternal.node()}cssModel(){return this.computedStyleModelInternal.cssModel()}computedStyleModel(){return this.computedStyleModelInternal}async doUpdate(){}update(){this.updateWhenVisible=!this.isShowing(),this.updateWhenVisible||this.updateThrottler.schedule(function(){return this.isShowing()?this.doUpdate():Promise.resolve()}.bind(this))}wasShown(){super.wasShown(),this.updateWhenVisible&&this.update()}onCSSModelChanged(e){}}var Ve=Object.freeze({__proto__:null,ElementsSidebarPane:He});class Be{styleSidebarPane;constructor(e){this.styleSidebarPane=e}highlightProperty(e){for(const e of this.styleSidebarPane.allSections())for(let t=e.propertiesTreeOutline.firstChild();t;t=t.nextSibling)t.onpopulate();const{treeElement:t,section:s}=this.findTreeElementAndSection((t=>t.property===e));t&&(t.parent&&t.parent.expand(),this.scrollAndHighlightTreeElement(t),s&&s.element.focus())}findAndHighlightSectionBlock(e){const t=this.styleSidebarPane.getSectionBlockByName(e);if(!t||0===t.sections.length)return;const[s]=t.sections;s.showAllItems(),E(t.titleElement())}findAndHighlightPropertyName(e){for(const t of this.styleSidebarPane.allSections()){if(!t.style().hasActiveProperty(e))continue;t.showAllItems();const s=this.findTreeElementFromSection((t=>t.property.name===e&&!t.overloaded()),t);if(s)return this.scrollAndHighlightTreeElement(s),void(t&&t.element.focus())}}findTreeElementAndSection(e){for(const t of this.styleSidebarPane.allSections()){const s=this.findTreeElementFromSection(e,t);if(s)return{treeElement:s,section:t}}return{treeElement:null,section:null}}findTreeElementFromSection(e,t){let s=t.propertiesTreeOutline.firstChild();for(;s&&s instanceof Zt;){if(e(s))return s;s=s.traverseNextTreeElement(!1,null,!0)}return null}scrollAndHighlightTreeElement(e){E(e.listItemElement)}}var _e=Object.freeze({__proto__:null,StylePropertyHighlighter:Be});const We=new CSSStyleSheet;We.replaceSync(".styles-section{min-height:18px;white-space:nowrap;user-select:text;border-bottom:1px solid var(--color-details-hairline);position:relative;overflow:hidden;> div{padding:2px 2px 4px 4px}&:last-child{border-bottom:none}&.has-open-popover{z-index:1}&.read-only{background-color:var(--color-background-opacity-50);font-style:italic}&:focus-visible,\n  &.read-only:focus-visible{background-color:var(--color-background-elevation-2)}.simple-selector.filter-match{background-color:var(--color-match-highlight);color:var(--color-text-primary)}.devtools-link{user-select:none}.styles-section-subtitle devtools-icon{margin-bottom:-4px}.styles-section-subtitle .devtools-link{color:var(--color-text-primary);text-decoration-color:hsl(0deg 0% 60%);outline-offset:0}.selector,\n  .try-rule-selector-element{color:var(--color-text-disabled)}.simple-selector.selector-matches,\n  &.keyframe-key{color:var(--color-text-primary)}.style-properties{margin:0;padding:2px 4px 0 0;list-style:none;clear:both;display:flex}&.matched-styles .style-properties{padding-left:0}& span.simple-selector:hover{text-decoration:var(--override-styles-section-text-hover-text-decoration);cursor:var(--override-styles-section-text-hover-cursor)}&.styles-panel-hovered:not(.read-only),\n  &.styles-panel-hovered:not(.read-only) devtools-css-query{--override-styles-section-text-hover-text-decoration:underline;--override-styles-section-text-hover-cursor:default}}.sidebar-pane-closing-brace{clear:both}.styles-section-title{background-origin:padding;background-clip:padding;word-wrap:break-word;white-space:normal;.query-list{color:var(--color-text-disabled)}}.styles-section-subtitle{color:var(--color-text-secondary);float:right;padding-left:15px;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;height:15px;margin-bottom:-1px}.sidebar-pane-open-brace,\n.sidebar-pane-closing-brace{color:var(--color-text-primary)}.nesting-symbol.implicit{color:var(--color-text-disabled)}.nesting-symbol:hover{color:var(--color-text-primary)}@keyframes styles-element-state-pane-slidein{from{margin-top:-60px}to{margin-top:0}}@keyframes styles-element-state-pane-slideout{from{margin-top:0}to{margin-top:-60px}}.styles-sidebar-toolbar-pane{position:relative;animation-duration:0.1s;animation-direction:normal}.styles-sidebar-toolbar-pane-container{position:relative;overflow:hidden;flex-shrink:0}.styles-selector{cursor:text}.styles-sidebar-pane-toolbar-container{--override-toolbar-background-color:var(--color-background-elevation-1);flex-shrink:0;overflow:hidden;position:sticky;top:0;background-color:var(--override-toolbar-background-color);z-index:2}.styles-sidebar-pane-toolbar{border-bottom:1px solid var(--color-details-hairline);flex-shrink:0}.font-toolbar-hidden{visibility:hidden}.styles-sidebar-pane-filter-box{flex:auto;display:flex;> input{outline:none!important;border:none;width:100%;background:var(--color-background);padding-left:4px;margin:3px;&:hover{box-shadow:var(--legacy-focus-ring-inactive-shadow)}&:focus,\n    &:not(:placeholder-shown){box-shadow:var(--legacy-focus-ring-active-shadow)}&::placeholder{color:var(--color-text-secondary)}}}.sidebar-separator{background-color:var(--color-background-elevation-1);padding:0 5px;border-bottom:1px solid var(--color-details-hairline);color:var(--color-text-secondary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;line-height:22px;> span.monospace{max-width:180px;display:inline-block;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;margin-left:2px}&.layer-separator{display:flex}}.sidebar-pane-section-toolbar{position:absolute;right:0;bottom:-1px;z-index:0;&.new-rule-toolbar{visibility:hidden;margin-bottom:5px;--toolbar-height:16px}&.shifted-toolbar{padding-right:32px}}.styles-pane:not(.is-editing-style) .styles-section.matched-styles:not(.read-only):hover .sidebar-pane-section-toolbar.new-rule-toolbar{visibility:visible}.styles-show-all{margin-left:16px;text-overflow:ellipsis;overflow:hidden;max-width:-webkit-fill-available}@media (forced-colors: active){.styles-sidebar-pane-filter-box > input{border:1px solid ButtonText;background:ButtonFace}.sidebar-pane-section-toolbar{forced-color-adjust:none;border-color:1px solid ButtonText;background-color:ButtonFace}.styles-section{&:focus-visible,\n    &.read-only:focus-visible{forced-color-adjust:none;background-color:Highlight}.styles-section-subtitle{.devtools-link{color:linktext;text-decoration-color:linktext;&:focus-visible{color:HighlightText}}}&:focus-visible *,\n    &.read-only:focus-visible *,\n    &:focus-visible .styles-section-subtitle .devtools-link{color:HighlightText;text-decoration-color:HighlightText}&:focus-visible .sidebar-pane-section-toolbar{background-color:ButtonFace}&:focus-visible{--webkit-css-property-color:HighlightText}}}.spinner::before{--dimension:24px;margin-top:2em;left:calc(50% - var(--dimension) / 2)}\n/*# sourceURL=stylesSidebarPane.css */\n");const qe=new CSSStyleSheet;qe.replaceSync(".styles-layers-pane{overflow:hidden;padding-left:2px;background-color:var(--color-background-elevation-1);border-bottom:1px solid var(--color-details-hairline);margin-top:0;padding-bottom:2px}.styles-layers-pane > div{font-weight:bold;margin:8px 4px 6px}.styles-layers-pane > table{width:100%;border-spacing:0}.styles-layers-pane td{padding:0}\n/*# sourceURL=layersWidget.css */\n");const ze={cssLayersTitle:"CSS layers",toggleCSSLayers:"Toggle CSS Layers view"},Ke=o.i18n.registerUIStrings("panels/elements/LayersWidget.ts",ze),je=o.i18n.getLocalizedString.bind(void 0,Ke);let $e,Ge;class Ye extends n.Widget.Widget{cssModel;layerTreeComponent=new c.TreeOutline.TreeOutline;constructor(){super(!0),this.contentElement.className="styles-layers-pane",n.UIUtils.createTextChild(this.contentElement.createChild("div"),je(ze.cssLayersTitle)),this.contentElement.appendChild(this.layerTreeComponent),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.update,this)}updateModel(e){this.cssModel!==e&&(this.cssModel&&this.cssModel.removeEventListener(s.CSSModel.Events.StyleSheetChanged,this.update,this),this.cssModel=e,this.cssModel&&this.cssModel.addEventListener(s.CSSModel.Events.StyleSheetChanged,this.update,this))}async wasShown(){return super.wasShown(),this.registerCSSFiles([qe]),this.update()}async update(){if(!this.isShowing())return;let e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(e&&(e=e.enclosingElementOrSelf()),!e)return;if(this.updateModel(e.domModel().cssModel()),!this.cssModel)return;const t=e=>n=>{const i=n.subLayers,o=s.CSSModel.CSSModel.readableLayerName(n.name),r=n.order+": "+o,a=e?e+"."+o:o;return i?{treeNodeData:r,id:a,children:()=>Promise.resolve(i.sort(((e,t)=>e.order-t.order)).map(t(a)))}:{treeNodeData:r,id:a}},i=await this.cssModel.getRootLayer(e.id);this.layerTreeComponent.data={defaultRenderer:c.TreeOutline.defaultRenderer,tree:[t("")(i)]},await this.layerTreeComponent.expandRecursively(5)}async revealLayer(e){return this.isShowing()||eo.instance().showToolbarPane(this,Qe.instance().item()),await this.update(),this.layerTreeComponent.expandToAndSelectTreeNodeId("implicit outer layer."+e)}static instance(e={forceNew:null}){const{forceNew:t}=e;return $e&&!t||($e=new Ye),$e}}class Qe{button;constructor(){this.button=new n.Toolbar.ToolbarToggle(je(ze.toggleCSSLayers),"layers","layers-filled"),this.button.setVisible(!1),this.button.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.clicked,this),this.button.element.classList.add("monospace")}static instance(e={forceNew:null}){const{forceNew:t}=e;return Ge&&!t||(Ge=new Qe),Ge}clicked(){const e=Ye.instance();eo.instance().showToolbarPane(e.isShowing()?null:e,this.button)}item(){return this.button}}var Xe=Object.freeze({__proto__:null,LayersWidget:Ye,ButtonProvider:Qe});class Je{#t=new Map;fetchPromiseForTest;constructor(e){this.fetchPromiseForTest=e?fetch(`${e}third_party/vscode.web-custom-data/browsers.css-data.json`).then((e=>e.json())).then((e=>{for(const t of e.properties)this.#t.set(t.name,t)})).catch():Promise.resolve()}static create(){const e=t.Runtime.getRemoteBase();return new Je(e?.base??"")}findCssProperty(e){return this.#t.get(e)}}var Ze=Object.freeze({__proto__:null,WebCustomData:Je});const et={noMatchingSelectorOrStyle:"No matching selector or style",visibleSelectors:"{n, plural, =1 {# visible selector listed below} other {# visible selectors listed below}}",invalidPropertyValue:"Invalid property value",unknownPropertyName:"Unknown property name",filter:"Filter",filterStyles:"Filter Styles",pseudoSElement:"Pseudo ::{PH1} element",inheritedFroms:"Inherited from ",inheritedFromSPseudoOf:"Inherited from ::{PH1} pseudo of ",incrementdecrementWithMousewheelOne:"Increment/decrement with mousewheel or up/down keys. {PH1}: R ±1, Shift: G ±1, Alt: B ±1",incrementdecrementWithMousewheelHundred:"Increment/decrement with mousewheel or up/down keys. {PH1}: ±100, Shift: ±10, Alt: ±0.1",invalidString:"{PH1}, property name: {PH2}, property value: {PH3}",newStyleRule:"New Style Rule",cssPropertyName:"`CSS` property name: {PH1}",cssPropertyValue:"`CSS` property value: {PH1}",toggleRenderingEmulations:"Toggle common rendering emulations",automaticDarkMode:"Automatic dark mode",copyAllCSSChanges:"Copy CSS changes",copiedToClipboard:"Copied to clipboard",layer:"Layer",clickToRevealLayer:"Click to reveal layer in layer tree",specificity:"Specificity: {PH1}"},tt=o.i18n.registerUIStrings("panels/elements/StylesSidebarPane.ts",et),st=o.i18n.getLocalizedString.bind(void 0,tt),nt=[{mode:"padding",properties:["padding"]},{mode:"border",properties:["border"]},{mode:"margin",properties:["margin"]},{mode:"gap",properties:["gap","grid-gap"]},{mode:"column-gap",properties:["column-gap","grid-column-gap"]},{mode:"row-gap",properties:["row-gap","grid-row-gap"]},{mode:"grid-template-columns",properties:["grid-template-columns"]},{mode:"grid-template-rows",properties:["grid-template-rows"]},{mode:"grid-template-areas",properties:["grid-areas"]},{mode:"justify-content",properties:["justify-content"]},{mode:"align-content",properties:["align-content"]},{mode:"align-items",properties:["align-items"]},{mode:"flexibility",properties:["flex","flex-basis","flex-grow","flex-shrink"]}];let it;class ot extends(e.ObjectWrapper.eventMixin(He)){currentToolbarPane;animatedToolbarPane;pendingWidget;pendingWidgetToggle;toolbar;toolbarPaneElement;lastFilterChange;visibleSections;noMatchesElement;sectionsContainer;sectionByElement;swatchPopoverHelperInternal;linkifier;decorator;lastRevealedProperty;userOperation;isEditingStyle;filterRegexInternal;isActivePropertyHighlighted;initialUpdateCompleted;hasMatchedStyles;sectionBlocks;idleCallbackManager;needsForceUpdate;resizeThrottler;scrollerElement;boundOnScroll;imagePreviewPopover;#s;#n;#i;activeCSSAngle;#o=new Map;#r;#a;#l;static instance(e){return it&&!e?.forceNew||(it=new ot),it}constructor(){super(!0),this.setMinimumSize(96,26),this.registerCSSFiles([We]),e.Settings.Settings.instance().moduleSetting("colorFormat").addChangeListener(this.update.bind(this)),e.Settings.Settings.instance().moduleSetting("textEditorIndent").addChangeListener(this.update.bind(this)),this.currentToolbarPane=null,this.animatedToolbarPane=null,this.pendingWidget=null,this.pendingWidgetToggle=null,this.toolbar=null,this.lastFilterChange=null,this.visibleSections=null,this.toolbarPaneElement=this.createStylesSidebarToolbar(),this.computedStyleModelInternal=new X,this.noMatchesElement=this.contentElement.createChild("div","gray-info-message hidden"),this.noMatchesElement.textContent=st(et.noMatchingSelectorOrStyle),this.sectionsContainer=this.contentElement.createChild("div"),n.ARIAUtils.markAsList(this.sectionsContainer),this.sectionsContainer.addEventListener("keydown",this.sectionsContainerKeyDown.bind(this),!1),this.sectionsContainer.addEventListener("focusin",this.sectionsContainerFocusChanged.bind(this),!1),this.sectionsContainer.addEventListener("focusout",this.sectionsContainerFocusChanged.bind(this),!1),this.sectionByElement=new WeakMap,this.swatchPopoverHelperInternal=new p.SwatchPopoverHelper.SwatchPopoverHelper,this.swatchPopoverHelperInternal.addEventListener(p.SwatchPopoverHelper.Events.WillShowPopover,this.hideAllPopovers,this),this.linkifier=new m.Linkifier.Linkifier(rt,!0),this.decorator=new Be(this),this.lastRevealedProperty=null,this.userOperation=!1,this.isEditingStyle=!1,this.filterRegexInternal=null,this.isActivePropertyHighlighted=!1,this.initialUpdateCompleted=!1,this.hasMatchedStyles=!1,this.contentElement.classList.add("styles-pane"),this.sectionBlocks=[],this.idleCallbackManager=null,this.needsForceUpdate=!1,it=this,n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.forceUpdate,this),this.contentElement.addEventListener("copy",this.clipboardCopy.bind(this)),this.resizeThrottler=new e.Throttler.Throttler(100),this.boundOnScroll=this.onScroll.bind(this),this.imagePreviewPopover=new ee(this.contentElement,(e=>{const t=e.composedPath()[0];return t instanceof Element?t:null}),(()=>this.node())),this.activeCSSAngle=null;const t=e.Settings.Settings.instance().moduleSetting("showCSSPropertyDocumentationOnHover");t.addChangeListener((e=>{const t=Boolean(e.data)?1:2;i.userMetrics.cssPropertyDocumentation(t)})),this.#n=new n.PopoverHelper.PopoverHelper(this.contentElement,(e=>{const s=e.composedPath()[0],n=e.composedPath()[2];if(!(s&&s instanceof Element))return null;if(n instanceof Element&&n.matches(".hint")){const e=Gt.get(n);if(e)return{box:s.boxInWindow(),show:async t=>{const s=new h.CSSHintDetailsView.CSSHintDetailsView(e);return t.contentElement.appendChild(s),!0}}}if(t.get()&&s.matches(".webkit-css-property")){this.#s||(this.#s=Je.create());const e=s.textContent,t=e&&this.#s.findCssProperty(e);if(t)return{box:s.boxInWindow(),show:async e=>{const s=new h.CSSPropertyDocsView.CSSPropertyDocsView(t);return e.contentElement.appendChild(s),i.userMetrics.cssPropertyDocumentation(0),!0}}}if(s.matches(".nesting-symbol"))return{box:s.boxInWindow(),show:async e=>{e.setIgnoreLeftMargin(!0);const t=document.createElement("span");return t.textContent=s.dataset.nestingSelectors||"",e.contentElement.appendChild(t),!0}};if(s.matches(".simple-selector")){const e=is.getSpecificityStoredForNodeElement(s);return{box:s.boxInWindow(),show:async t=>{t.setIgnoreLeftMargin(!0);const s=document.createElement("span");return s.textContent=st(et.specificity,{PH1:e?`(${e.a},${e.b},${e.c})`:"(?,?,?)"}),t.contentElement.appendChild(s),!0}}}return null})),this.#n.setDisableOnClick(!0),this.#n.setTimeout(300),this.#n.setHasPadding(!0),this.#i=new n.PopoverHelper.PopoverHelper(this.contentElement,(e=>{const t=e.composedPath()[0];if(!(t&&t instanceof Element&&t.matches(".link-swatch-link")))return null;const s=e.composedPath()[2];if(!(s&&s instanceof Element&&s.matches(".css-var-link")))return null;const n=t.getAttribute("data-title")||"";return{box:t.boxInWindow(),show:async e=>{const t=new h.CSSVariableValueView.CSSVariableValueView(n);return e.contentElement.appendChild(t),!0}}})),this.#i.setDisableOnClick(!0),this.#i.setTimeout(500,200)}onScroll(e){this.hideAllPopovers()}swatchPopoverHelper(){return this.swatchPopoverHelperInternal}setUserOperation(e){this.userOperation=e}static createExclamationMark(e,t){const i=document.createElement("span",{is:"dt-icon-label"});let o;i.className="exclamation-mark",ot.ignoreErrorsForProperty(e)||(i.data={iconName:"warning-filled",color:"var(--icon-warning)",width:"14px",height:"14px"}),t?(n.Tooltip.Tooltip.install(i,t),o=t):(o=s.CSSMetadata.cssMetadata().isCSSPropertyName(e.name)?st(et.invalidPropertyValue):st(et.unknownPropertyName),n.Tooltip.Tooltip.install(i,o));const r=st(et.invalidString,{PH1:o,PH2:e.name,PH3:e.value});return e.setDisplayedStringForInvalidProperty(r),i}static ignoreErrorsForProperty(e){function t(e){return!e.startsWith("-webkit-")&&/^[-_][\w\d]+-\w/.test(e)}const s=e.name.toLowerCase();if("_"===s.charAt(0))return!0;if("filter"===s)return!0;if(s.startsWith("scrollbar-"))return!0;if(t(s))return!0;const n=e.value.toLowerCase();return!!n.endsWith("\\9")||!!t(n)}static createPropertyFilterElement(e,t,s){const n=document.createElement("input");function i(){const e=n.value?new RegExp(r.StringUtilities.escapeForRegExp(n.value),"i"):null;s(e)}return n.type="search",n.classList.add("custom-search-input"),n.placeholder=e,n.addEventListener("input",i,!1),n.addEventListener("keydown",(function(e){const t=e;t.key===r.KeyboardUtilities.ESCAPE_KEY&&n.value&&(t.consume(!0),n.value="",i())}),!1),n}static formatLeadingProperties(t){const s=t.headerText(),n=e.Settings.Settings.instance().moduleSetting("textEditorIndent").get(),i=t.style(),o=[];for(const e of i.leadingProperties())e.disabled?o.push(`${n}/* ${e.name}: ${e.value}; */`):o.push(`${n}${e.name}: ${e.value};`);const r=o.join("\n");return{allDeclarationText:r,ruleText:`${s} {\n${r}\n}`}}revealProperty(e){this.decorator.highlightProperty(e),this.lastRevealedProperty=e,this.update()}jumpToProperty(e){this.decorator.findAndHighlightPropertyName(e)}jumpToSectionBlock(e){this.decorator.findAndHighlightSectionBlock(e)}forceUpdate(){this.needsForceUpdate=!0,this.swatchPopoverHelperInternal.hide(),this.#a?.abort(),this.resetCache(),this.update()}sectionsContainerKeyDown(e){const t=r.DOMUtilities.deepActiveElement(this.sectionsContainer.ownerDocument);if(!t)return;const s=this.sectionByElement.get(t);if(!s)return;let n=null,i=!1;switch(e.key){case"ArrowUp":case"ArrowLeft":n=s.previousSibling()||s.lastSibling(),i=!1;break;case"ArrowDown":case"ArrowRight":n=s.nextSibling()||s.firstSibling(),i=!0;break;case"Home":n=s.firstSibling(),i=!0;break;case"End":n=s.lastSibling(),i=!1}n&&this.filterRegexInternal&&(n=n.findCurrentOrNextVisible(i)),n&&(n.element.focus(),e.consume(!0))}sectionsContainerFocusChanged(){this.resetFocus()}resetFocus(){if(this.noMatchesElement.classList.contains("hidden")&&this.sectionBlocks[0]&&this.sectionBlocks[0].sections[0]){const e=this.sectionBlocks[0].sections[0].findCurrentOrNextVisible(!0);e&&(e.element.tabIndex=this.sectionsContainer.hasFocus()?-1:0)}}onAddButtonLongClick(e){const t=this.cssModel();if(!t)return;const s=t.styleSheetHeaders().filter((function(e){return!e.isViaInspector()&&!e.isInline&&Boolean(e.resourceURL())})),i=[];for(let e=0;e<s.length;++e){const t=s[e],n=this.createNewRuleInStyleSheet.bind(this,t);i.push({text:g.ResourceUtils.displayNameForURL(t.resourceURL()),handler:n})}i.sort((function(e,t){return r.StringUtilities.naturalOrderComparator(e.text,t.text)}));const o=new n.ContextMenu.ContextMenu(e);for(let e=0;e<i.length;++e){const t=i[e];o.defaultSection().appendItem(t.text,t.handler)}o.footerSection().appendItem("inspector-stylesheet",this.createNewRuleInViaInspectorStyleSheet.bind(this)),o.show()}onFilterChanged(e){this.lastFilterChange=Date.now(),this.filterRegexInternal=e,this.updateFilter(),this.resetFocus(),setTimeout((()=>{if(this.lastFilterChange){Date.now()-this.lastFilterChange<500||n.ARIAUtils.alert(this.visibleSections?st(et.visibleSelectors,{n:this.visibleSections}):st(et.noMatchingSelectorOrStyle))}}),500)}refreshUpdate(e,t){if(t)for(const e of this.allSections())e instanceof os&&e.isBlank||e.updateVarFunctions(t);if(this.isEditingStyle)return;const s=this.node();if(s){for(const t of this.allSections())t instanceof os&&t.isBlank||t.update(t===e);this.filterRegexInternal&&this.updateFilter(),this.swatchPopoverHelper().reposition(),this.nodeStylesUpdatedForTest(s,!1)}}async doUpdate(){this.#a?.abort(),this.#a=new AbortController,await this.#d(this.#a.signal);const e=this?.contentElement?.enclosingNodeOrSelfWithClass("style-panes-wrapper")?.parentElement?.querySelectorAll(".style-panes-wrapper");if(e.length>0)for(const t of e)this.scrollerElement=t,this.scrollerElement.addEventListener("scroll",this.boundOnScroll,!1)}async#d(e){this.initialUpdateCompleted||window.setTimeout((()=>{e.aborted||this.initialUpdateCompleted||this.sectionsContainer.createChild("span","spinner")}),200);const s=await this.fetchMatchedCascade();if(e.aborted)return;const n=this.node()?.id,i=s?.getParentLayoutNodeId(),[o,r]=await Promise.all([this.fetchComputedStylesFor(n),this.fetchComputedStylesFor(i)]);e.aborted||(await this.innerRebuildUpdate(e,s,o,r),e.aborted||(this.initialUpdateCompleted||(this.initialUpdateCompleted=!0,this.appendToolbarItem(this.createRenderingShortcuts()),t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)&&(this.#r=this.createCopyAllChangesButton(),this.appendToolbarItem(this.#r),this.#r.element.classList.add("hidden")),this.dispatchEventToListeners("InitialUpdateCompleted")),this.nodeStylesUpdatedForTest(this.node(),!0),this.dispatchEventToListeners("StylesUpdateCompleted",{hasMatchedStyles:this.hasMatchedStyles})))}async fetchComputedStylesFor(e){const t=this.node();return null===t||void 0===e?null:await t.domModel().cssModel().getComputedStyle(e)}onResize(){this.resizeThrottler.schedule(this.innerResize.bind(this))}innerResize(){const e=this.contentElement.getBoundingClientRect().width+"px";return this.allSections().forEach((t=>{t.propertiesTreeOutline.element.style.width=e})),this.hideAllPopovers(),Promise.resolve()}resetCache(){const e=this.cssModel();e&&e.discardCachedMatchedCascade()}fetchMatchedCascade(){const e=this.node();if(!e||!this.cssModel())return Promise.resolve(null);const t=this.cssModel();return t?t.cachedMatchedCascadeForNode(e).then(function(e){return e&&e.node()===this.node()?e:null}.bind(this)):Promise.resolve(null)}setEditingStyle(e,t){this.isEditingStyle!==e&&(this.contentElement.classList.toggle("is-editing-style",e),this.isEditingStyle=e,this.setActiveProperty(null))}setActiveProperty(e){if(this.isActivePropertyHighlighted&&s.OverlayModel.OverlayModel.hideDOMNodeHighlight(),this.isActivePropertyHighlighted=!1,!this.node())return;if(!e||e.overloaded()||e.inherited())return;const t=e.property.ownerStyle.parentRule,n=t instanceof s.CSSRule.CSSStyleRule?t.selectorText():void 0;for(const{properties:t,mode:s}of nt){if(!t.includes(e.name))continue;const i=this.node();if(i){i.domModel().overlayModel().highlightInOverlay({node:this.node(),selectorList:n},s),this.isActivePropertyHighlighted=!0;break}}}onCSSModelChanged(e){const t=e?.data&&"edit"in e.data?e.data.edit:null;if(t){for(const e of this.allSections())e.styleSheetEdited(t);this.refreshComputedStyles()}else this.userOperation||this.isEditingStyle?this.refreshComputedStyles():(this.resetCache(),this.update())}async refreshComputedStyles(){this.#l?.abort(),this.#a=new AbortController;const e=this.#a.signal,t=await this.fetchMatchedCascade(),s=this.node()?.id,n=t?.getParentLayoutNodeId(),[i,o]=await Promise.all([this.fetchComputedStylesFor(s),this.fetchComputedStylesFor(n)]);if(!e.aborted)for(const e of this.allSections())e.setComputedStyles(i),e.setParentsComputedStyles(o),e.updateAuthoringHint()}focusedSectionIndex(){let e=0;for(const t of this.sectionBlocks)for(const s of t.sections){if(s.element.hasFocus())return e;e++}return-1}continueEditingElement(e,t){const s=this.allSections()[e];if(s){const e=s.closestPropertyForEditing(t);if(!e)return void s.element.focus();e.startEditing()}}async innerRebuildUpdate(e,t,s,n){if(this.needsForceUpdate)this.needsForceUpdate=!1;else if(this.isEditingStyle||this.userOperation)return;const o=this.focusedSectionIndex();this.linkifier.reset();const r=this.sectionBlocks.map((e=>e.sections)).flat();this.sectionBlocks=[];const a=this.node();if(this.hasMatchedStyles=null!==t&&null!==a,!this.hasMatchedStyles)return this.sectionsContainer.removeChildren(),void this.noMatchesElement.classList.remove("hidden");const l=await this.rebuildSectionsForMatchedStyleRules(t,s,n);if(e.aborted)return;this.sectionBlocks=l;const d=this.sectionBlocks.map((e=>e.sections)).flat(),c=Ae.instance(),h=c.getSection();if(h){c.unbindContext();for(const[e,t]of r.entries())h===t&&e<d.length&&c.bindContext(this,d[e])}this.sectionsContainer.removeChildren();const u=document.createDocumentFragment();let p=0,m=null;for(const e of this.sectionBlocks){const t=e.titleElement();t&&u.appendChild(t);for(const t of e.sections)u.appendChild(t.element),p===o&&(m=t.element),p++}this.sectionsContainer.appendChild(u),m&&m.focus(),o>=p&&this.sectionBlocks[0].sections[0].element.focus(),this.sectionsContainerFocusChanged(),this.filterRegexInternal?this.updateFilter():this.noMatchesElement.classList.toggle("hidden",this.sectionBlocks.length>0),this.lastRevealedProperty&&(this.decorator.highlightProperty(this.lastRevealedProperty),this.lastRevealedProperty=null),this.swatchPopoverHelper().reposition(),i.userMetrics.panelLoaded("elements","DevTools.Launch.Elements"),this.dispatchEventToListeners("StylesUpdateCompleted",{hasMatchedStyles:!1})}nodeStylesUpdatedForTest(e,t){}rebuildSectionsForMatchedStyleRulesForTest(e,t,s){return this.rebuildSectionsForMatchedStyleRules(e,t,s)}async rebuildSectionsForMatchedStyleRules(e,n,i){this.idleCallbackManager&&this.idleCallbackManager.discard(),this.idleCallbackManager=new lt;const o=[new at(null)];let r=0,a=null,l=null,d=!1;const c=e=>{const t=e.parentRule;if(t instanceof s.CSSRule.CSSStyleRule){const e=t.layers;if((e.length||l)&&l!==e){const s=at.createLayerBlock(t);o.push(s),d=!0,l=e}}};Qe.instance().item().setVisible(!1);const h=new Set;for(const s of e.nodeStyles()){if(t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)&&s.parentRule){const e=s.parentRule.resourceURL();e&&!h.has(e)&&(await this.trackURLForChanges(e),h.add(e))}const l=e.isInherited(s)?e.nodeForStyle(s):null;if(l&&l!==a){a=l;const e=await at.createInheritedNodeBlock(a);o.push(e)}c(s);const d=o[o.length-1];d&&this.idleCallbackManager.schedule((()=>{const t=new is(this,e,s,r,n,i);r++,d.sections.push(t)}))}const u=Array.from(e.customHighlightPseudoNames()).map((t=>({highlightName:t,pseudoType:"highlight",pseudoStyles:e.customHighlightPseudoStyles(t)}))),p=[...e.pseudoTypes()].map((t=>({highlightName:null,pseudoType:t,pseudoStyles:e.pseudoStyles(t)}))),m=u.concat(p).sort(((e,t)=>"before"===e.pseudoType&&"before"!==t.pseudoType?-1:"before"!==e.pseudoType&&"before"===t.pseudoType?1:e.pseudoType<t.pseudoType?-1:e.pseudoType>t.pseudoType?1:0));for(const t of m){a=null;for(let s=0;s<t.pseudoStyles.length;++s){const d=t.pseudoStyles[s],h=e.isInherited(d)?e.nodeForStyle(d):null;if(0===s||h!==a)if(l=null,h){const e=await at.createInheritedPseudoTypeBlock(t.pseudoType,t.highlightName,h);o.push(e)}else{const e=at.createPseudoTypeBlock(t.pseudoType,t.highlightName);o.push(e)}a=h,c(d);const u=o[o.length-1];this.idleCallbackManager.schedule((()=>{const t=new ls(this,e,d,r,n,i);r++,u.sections.push(t)}))}}for(const t of e.keyframes()){const s=at.createKeyframesBlock(t.name().text);for(const n of t.keyframes())this.idleCallbackManager.schedule((()=>{s.sections.push(new rs(this,e,n.style,r)),r++}));o.push(s)}for(const t of e.positionFallbackRules()){const s=at.createPositionFallbackBlock(t.name().text);for(const o of t.tryRules())this.idleCallbackManager.schedule((()=>{s.sections.push(new as(this,e,o.style,r,n,i)),r++}));o.push(s)}return d?Qe.instance().item().setVisible(!0):Ye.instance().isShowing()&&eo.instance().showToolbarPane(null,Qe.instance().item()),await this.idleCallbackManager.awaitDone(),o}async createNewRuleInViaInspectorStyleSheet(){const e=this.cssModel(),t=this.node();if(!e||!t)return;this.setUserOperation(!0);const s=await e.requestViaInspectorStylesheet(t);this.setUserOperation(!1),await this.createNewRuleInStyleSheet(s)}async createNewRuleInStyleSheet(e){if(!e)return;const t=((await e.requestContent()).content||"").split("\n"),s=f.TextRange.TextRange.createFromLocation(t.length-1,t[t.length-1].length);this.sectionBlocks&&this.sectionBlocks.length>0&&this.addBlankSection(this.sectionBlocks[0].sections[0],e.id,s)}addBlankSection(e,t,s){const n=this.node(),i=new os(this,e.matchedStyles,n?n.simpleSelector():"",t,s,e.style(),0);this.sectionsContainer.insertBefore(i.element,e.element.nextSibling);for(const t of this.sectionBlocks){const s=t.sections.indexOf(e);-1!==s&&(t.sections.splice(s+1,0,i),i.startEditingSelector())}let o=0;for(const e of this.sectionBlocks)for(const t of e.sections)t.setSectionIdx(o),o++}removeSection(e){for(const t of this.sectionBlocks){const s=t.sections.indexOf(e);-1!==s&&(t.sections.splice(s,1),e.element.remove())}}filterRegex(){return this.filterRegexInternal}updateFilter(){let e=!1,t=0;for(const s of this.sectionBlocks)t+=s.updateFilter(),e=Boolean(t)||e;this.noMatchesElement.classList.toggle("hidden",Boolean(e)),this.visibleSections=t}willHide(){this.hideAllPopovers(),super.willHide()}hideAllPopovers(){this.swatchPopoverHelperInternal.hide(),this.imagePreviewPopover.hide(),this.activeCSSAngle&&(this.activeCSSAngle.minify(),this.activeCSSAngle=null),this.#n?.hidePopover(),this.#i?.hidePopover()}getSectionBlockByName(e){return this.sectionBlocks.find((t=>t.titleElement()?.textContent===e))}allSections(){let e=[];for(const t of this.sectionBlocks)e=e.concat(t.sections);return e}async trackURLForChanges(e){const t=this.#o.get(e);t&&b.WorkspaceDiff.workspaceDiff().unsubscribeFromDiffChange(t.uiSourceCode,t.diffChangeCallback);const s=S.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(e);if(!s)return;const n=this.refreshChangedLines.bind(this,s);b.WorkspaceDiff.workspaceDiff().subscribeToDiffChange(s,n);const i={uiSourceCode:s,changedLines:new Set,diffChangeCallback:n};this.#o.set(e,i),await this.refreshChangedLines(i.uiSourceCode)}isPropertyChanged(e){const t=e.ownerStyle.parentRule?.resourceURL();if(!t)return!1;const s=this.#o.get(t);if(!s)return!1;const{changedLines:n,formattedCurrentMapping:i}=s,o=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().propertyUILocation(e,!0);if(!o)return!1;if(!i)return n.has(o.lineNumber+1);const r=i.originalToFormatted(o.lineNumber,o.columnNumber)[0];return n.has(r+1)}updateChangeStatus(){if(!this.#r)return;let e=!1;for(const t of this.#o.values())if(t.changedLines.size>0){e=!0;break}this.#r.element.classList.toggle("hidden",!e)}async refreshChangedLines(e){const t=this.#o.get(e.url());if(!t)return;const s=await b.WorkspaceDiff.workspaceDiff().requestDiff(e,{shouldFormatDiff:!0}),n=new Set;if(t.changedLines=n,!s)return;const{diff:i,formattedCurrentMapping:o}=s,{rows:r}=w.DiffView.buildDiffRows(i);for(const e of r)"addition"===e.type&&n.add(e.currentLineNumber);t.formattedCurrentMapping=o}async getFormattedChanges(){let e="";for(const[t,{uiSourceCode:s}]of this.#o){const n=await b.WorkspaceDiff.workspaceDiff().requestDiff(s,{shouldFormatDiff:!0});if(!n||n?.diff.length<2)continue;const i=await v(n.diff);i.length>0&&(e+=`/* ${ut(t)} */\n\n${i}\n\n`)}return e}clipboardCopy(e){i.userMetrics.actionTaken(i.UserMetrics.Action.StyleRuleCopied)}createStylesSidebarToolbar(){const e=this.contentElement.createChild("div","styles-sidebar-pane-toolbar-container"),t=e.createChild("div","hbox styles-sidebar-pane-toolbar"),s=t.createChild("div","styles-sidebar-pane-filter-box"),i=ot.createPropertyFilterElement(st(et.filter),t,this.onFilterChanged.bind(this));n.ARIAUtils.setLabel(i,st(et.filterStyles)),s.appendChild(i);const o=new n.Toolbar.Toolbar("styles-pane-toolbar",t);o.makeToggledGray(),o.appendItemsAtLocation("styles-sidebarpane-toolbar"),this.toolbar=o;return e.createChild("div","styles-sidebar-toolbar-pane-container").createChild("div","styles-sidebar-toolbar-pane")}showToolbarPane(e,t){this.pendingWidgetToggle&&this.pendingWidgetToggle.setToggled(!1),this.pendingWidgetToggle=t,this.animatedToolbarPane?this.pendingWidget=e:this.startToolbarPaneAnimation(e),e&&t&&t.setToggled(!0)}appendToolbarItem(e){this.toolbar&&this.toolbar.appendToolbarItem(e)}startToolbarPaneAnimation(e){if(e===this.currentToolbarPane)return;if(e&&this.currentToolbarPane)return this.currentToolbarPane.detach(),e.show(this.toolbarPaneElement),this.currentToolbarPane=e,void this.currentToolbarPane.focus();this.animatedToolbarPane=e,this.currentToolbarPane?this.toolbarPaneElement.style.animationName="styles-element-state-pane-slideout":e&&(this.toolbarPaneElement.style.animationName="styles-element-state-pane-slidein"),e&&e.show(this.toolbarPaneElement);const t=function(){this.toolbarPaneElement.style.removeProperty("animation-name"),this.toolbarPaneElement.removeEventListener("animationend",t,!1),this.currentToolbarPane&&this.currentToolbarPane.detach();this.currentToolbarPane=this.animatedToolbarPane,this.currentToolbarPane&&this.currentToolbarPane.focus();this.animatedToolbarPane=null,this.pendingWidget&&(this.startToolbarPaneAnimation(this.pendingWidget),this.pendingWidget=null)}.bind(this);this.toolbarPaneElement.addEventListener("animationend",t,!1)}createRenderingShortcuts(){const t=e.Settings.Settings.instance().moduleSetting("emulatedCSSMediaFeaturePrefersColorScheme"),s=e.Settings.Settings.instance().moduleSetting("emulateAutoDarkMode"),i=(e,t)=>`${e?"✓ ":""}${t}`,o=new n.Toolbar.ToolbarToggle(st(et.toggleRenderingEmulations),"brush","brush-filled");return o.element.addEventListener("click",(e=>{const r=o.element.getBoundingClientRect(),a=new n.ContextMenu.ContextMenu(e,{x:r.left,y:r.bottom}),l=t.get(),d="light"===l,c="dark"===l,h=s.get(),u=i(d,"prefers-color-scheme: light"),p=i(c,"prefers-color-scheme: dark"),m=i(h,st(et.automaticDarkMode));a.defaultSection().appendItem(u,(()=>{s.set(!1),t.set(d?"":"light"),o.setToggled(Boolean(t.get()))})),a.defaultSection().appendItem(p,(()=>{s.set(!1),t.set(c?"":"dark"),o.setToggled(Boolean(t.get()))})),a.defaultSection().appendItem(m,(()=>{s.set(!h),o.setToggled(Boolean(t.get()))})),a.show(),e.stopPropagation()}),{capture:!0}),o}createCopyAllChangesButton(){const e=new n.Toolbar.ToolbarButton(st(et.copyAllCSSChanges),"copy");let t;return e.element.setAttribute("data-content",st(et.copiedToClipboard)),e.addEventListener(n.Toolbar.ToolbarButton.Events.Click,(async()=>{const s=await this.getFormattedChanges();i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(s),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllChangesViaStylesPane),t&&(clearTimeout(t),t=void 0),e.element.classList.add("copied-to-clipboard"),t=window.setTimeout((()=>{e.element.classList.remove("copied-to-clipboard"),t=void 0}),2e3)})),e}}const rt=23;class at{titleElementInternal;sections;constructor(e){this.titleElementInternal=e,this.sections=[]}static createPseudoTypeBlock(e,t){const s=document.createElement("div");s.className="sidebar-separator";const n=`${e}${t?`(${t})`:""}`;return s.textContent=st(et.pseudoSElement,{PH1:n}),new at(s)}static async createInheritedPseudoTypeBlock(t,s,i){const o=document.createElement("div");o.className="sidebar-separator";const r=`${t}${s?`(${s})`:""}`;n.UIUtils.createTextChild(o,st(et.inheritedFromSPseudoOf,{PH1:r}));const a=await e.Linkifier.Linkifier.linkify(i,{preventKeyboardFocus:!0,tooltip:void 0});return o.appendChild(a),new at(o)}static createKeyframesBlock(e){const t=document.createElement("div");return t.className="sidebar-separator",t.textContent=`@keyframes ${e}`,new at(t)}static createPositionFallbackBlock(e){const t=document.createElement("div");return t.className="sidebar-separator",t.textContent=`@position-fallback ${e}`,new at(t)}static async createInheritedNodeBlock(t){const s=document.createElement("div");s.className="sidebar-separator",n.UIUtils.createTextChild(s,st(et.inheritedFroms));const i=await e.Linkifier.Linkifier.linkify(t,{preventKeyboardFocus:!0,tooltip:void 0});return s.appendChild(i),new at(s)}static createLayerBlock(e){const t=document.createElement("div");t.className="sidebar-separator layer-separator",n.UIUtils.createTextChild(t.createChild("div"),st(et.layer));const i=e.layers;if(!i.length&&"user-agent"===e.origin){const s="user-agent"===e.origin?" user agent stylesheet":" implicit outer layer";return n.UIUtils.createTextChild(t.createChild("div"),s),new at(t)}const o=t.createChild("button");o.className="link",o.title=st(et.clickToRevealLayer);const r=i.map((e=>s.CSSModel.CSSModel.readableLayerName(e.text))).join(".");return o.textContent=r,o.onclick=()=>Ye.instance().revealLayer(r),new at(t)}updateFilter(){let e=!1,t=0;for(const s of this.sections)t+=s.updateFilter()?1:0,e=s.updateFilter()||e;return this.titleElementInternal&&this.titleElementInternal.classList.toggle("hidden",!e),t}titleElement(){return this.titleElementInternal}}class lt{discarded;promises;queue;constructor(){this.discarded=!1,this.promises=[],this.queue=[]}discard(){this.discarded=!0}schedule(e){if(this.discarded)return;const t=new Promise(((t,s)=>{this.queue.push({fn:e,resolve:t,reject:s})}));this.promises.push(t),this.scheduleIdleCallback(100)}scheduleIdleCallback(e){window.requestIdleCallback((()=>{const e=this.queue.shift();a(e);try{this.discarded||e.fn(),e.resolve()}catch(t){e.reject(t)}}),{timeout:e})}awaitDone(){return Promise.all(this.promises)}}function dt(e){return`'${e.replaceAll("'","\\'")}'`}class ct extends n.TextPrompt.TextPrompt{isColorAware;cssCompletions;selectedNodeComputedStyles;parentNodeComputedStyles;treeElement;isEditingName;cssVariables;constructor(e,t){super(),this.initialize(this.buildPropertyCompletions.bind(this),n.UIUtils.StyleValueDelimiters);const o=s.CSSMetadata.cssMetadata();this.isColorAware=s.CSSMetadata.cssMetadata().isColorAwareProperty(e.property.name),this.cssCompletions=[];const a=e.node();if(t)this.cssCompletions=o.allProperties(),a&&!a.isSVGNode()&&(this.cssCompletions=this.cssCompletions.filter((e=>!o.isSVGProperty(e))));else if(this.cssCompletions=o.getPropertyValues(e.property.name),a&&o.isFontFamilyProperty(e.property.name)){const e=a.domModel().cssModel().fontFaces().map((e=>dt(e.getFontFamily())));this.cssCompletions.unshift(...e)}if(this.selectedNodeComputedStyles=null,this.parentNodeComputedStyles=null,this.treeElement=e,this.isEditingName=t,this.cssVariables=e.matchedStyles().availableCSSVariables(e.property.ownerStyle),this.cssVariables.length<1e3?this.cssVariables.sort(r.StringUtilities.naturalOrderComparator):this.cssVariables.sort(),!t&&(this.disableDefaultSuggestionForEmptyInput(),e&&e.valueElement)){const t=e.valueElement.textContent,s=i.Platform.isMac()?"Cmd":"Ctrl";null!==t&&(t.match(/#[\da-f]{3,6}$/i)?this.setTitle(st(et.incrementdecrementWithMousewheelOne,{PH1:s})):t.match(/\d+/)&&this.setTitle(st(et.incrementdecrementWithMousewheelHundred,{PH1:s})))}}onKeyDown(e){const t=e;switch(t.key){case"ArrowUp":case"ArrowDown":case"PageUp":case"PageDown":if(!this.isSuggestBoxVisible()&&this.handleNameOrValueUpDown(t))return void t.preventDefault();break;case"Enter":if(t.shiftKey)return;return this.tabKeyPressed(),void t.preventDefault();case" ":if(this.isEditingName)return this.tabKeyPressed(),void t.preventDefault()}super.onKeyDown(t)}onMouseWheel(e){this.handleNameOrValueUpDown(e)?e.consume(!0):super.onMouseWheel(e)}tabKeyPressed(){return this.acceptAutoComplete(),!1}handleNameOrValueUpDown(e){return!(this.isEditingName||!this.treeElement.valueElement||!n.UIUtils.handleElementValueModifications(e,this.treeElement.valueElement,function(e,t){this.treeElement.nameElement&&this.treeElement.valueElement&&this.treeElement.applyStyleText(this.treeElement.nameElement.textContent+": "+this.treeElement.valueElement.textContent,!1)}.bind(this),this.isValueSuggestion.bind(this),function(e,t,n){return 0===t||n.length||!s.CSSMetadata.cssMetadata().isLengthProperty(this.treeElement.property.name)||this.treeElement.property.value.toLowerCase().startsWith("calc(")||(n="px"),e+t+n}.bind(this)))}isValueSuggestion(e){return!!e&&(e=e.toLowerCase(),-1!==this.cssCompletions.indexOf(e)||e.startsWith("--"))}async buildPropertyCompletions(t,n,i){const o=n.toLowerCase(),r=!this.isEditingName&&t.trim().endsWith("var(");if(!n&&!i&&!r&&(this.isEditingName||t))return Promise.resolve([]);const a=[],l=[];r||(this.cssCompletions.forEach((e=>g.call(this,e,!1))),this.isEditingName&&s.CSSMetadata.cssMetadata().aliasesFor().forEach(((e,t)=>{if(0!==t.toLowerCase().indexOf(o))return;const n={text:t,priority:s.CSSMetadata.cssMetadata().propertyUsageWeight(t),isCSSVariableColor:!1},i={text:e,priority:s.CSSMetadata.cssMetadata().propertyUsageWeight(e),subtitle:`= ${t}`,isCSSVariableColor:!1};a.push(n,i)})));const d=this.treeElement.node();if(this.isEditingName&&d){s.CSSMetadata.cssMetadata().nameValuePresets(d.isSVGNode()).forEach((e=>g.call(this,e,!1,!0)))}(this.isEditingName||r)&&this.cssVariables.forEach((e=>g.call(this,e,!0)));const c=a.concat(l);!this.isEditingName&&!c.length&&n.length>1&&"!important".startsWith(o)&&c.push({text:"!important",title:void 0,subtitle:void 0,priority:void 0,isSecondary:void 0,subtitleRenderer:void 0,selectionRange:void 0,hideGhostText:void 0,iconElement:void 0});const u=n.replace("-","");if(u&&u===u.toUpperCase())for(let e=0;e<c.length;++e)c[e].text.startsWith("--")||(c[e].text=c[e].text.toUpperCase());for(const e of c){if(r){e.title=e.text,e.text+=")";continue}const t=s.CSSMetadata.cssMetadata().getValuePreset(this.treeElement.name,e.text);!this.isEditingName&&t&&(e.title=e.text,e.text=t.text,e.selectionRange={startColumn:t.startColumn,endColumn:t.endColumn})}const m=async()=>{if(!d||this.selectedNodeComputedStyles)return;this.selectedNodeComputedStyles=await d.domModel().cssModel().getComputedStyle(d.id);const e=d.parentNode;e&&(this.parentNodeComputedStyles=await e.domModel().cssModel().getComputedStyle(e.id))};for(const e of c){await m();const t=h.CSSPropertyIconResolver.findIcon(this.isEditingName?e.text:`${this.treeElement.property.name}: ${e.text}`,this.selectedNodeComputedStyles,this.parentNodeComputedStyles);if(!t)continue;const s=new C.Icon.Icon,n="12.5px",i="12.5px";s.data={iconName:t.iconName,width:n,height:i,color:"black"},s.style.transform=`rotate(${t.rotate}deg) scale(${1.1*t.scaleX}, ${1.1*t.scaleY})`,s.style.maxHeight=i,s.style.maxWidth=n,e.iconElement=s}return this.isColorAware&&!this.isEditingName&&c.sort(((e,t)=>e.isCSSVariableColor&&t.isCSSVariableColor?0:e.isCSSVariableColor?-1:1)),Promise.resolve(c);function g(t,n,i){const r=t.toLowerCase().indexOf(o),d={text:t,title:void 0,subtitle:void 0,priority:void 0,isSecondary:void 0,subtitleRenderer:void 0,selectionRange:void 0,hideGhostText:void 0,iconElement:void 0,isCSSVariableColor:!1};if(n){const s=this.treeElement.matchedStyles().computeCSSVariable(this.treeElement.property.ownerStyle,t);if(s){const t=e.Color.parse(s);t?(d.subtitleRenderer=f.bind(null,t),d.isCSSVariableColor=!0):d.subtitleRenderer=y.bind(null,s)}}i&&(d.hideGhostText=!0),0===r?(d.priority=this.isEditingName?s.CSSMetadata.cssMetadata().propertyUsageWeight(t):1,a.push(d)):r>-1&&l.push(d)}function f(e){const t=new p.ColorSwatch.ColorSwatch;return t.renderColor(e),t.style.pointerEvents="none",t}function y(e){const t=document.createElement("span");return t.className="suggestion-subtitle",t.textContent=`${e}`,t.style.maxWidth="100px",t.title=`${e}`,t}}}function ht(e){return e.replace(/(?<!\\)\\(?:([a-fA-F0-9]{1,6})|(.))[\n\t\x20]?/gs,((e,t,s)=>{if(s)return s;const n=parseInt(t,16);return 55296<=n&&n<=57343||0===n||n>1114111?"�":String.fromCodePoint(n)}))}function ut(e){const t=new URL(e);return t.search?`${t.origin}${t.pathname}${t.search.replaceAll("*/","*%2F")}${t.hash}`:t.toString()}class pt{rule;node;propertyName;propertyValue;colorHandler;colorMixHandler;bezierHandler;fontHandler;shadowHandler;gridHandler;varHandler;angleHandler;lengthHandler;animationNameHandler;animationHandler;positionFallbackHandler;constructor(e,t,s,n){this.rule=e,this.node=t,this.propertyName=s,this.propertyValue=n,this.colorHandler=null,this.colorMixHandler=null,this.bezierHandler=null,this.fontHandler=null,this.shadowHandler=null,this.gridHandler=null,this.varHandler=document.createTextNode.bind(document),this.animationNameHandler=null,this.angleHandler=null,this.lengthHandler=null,this.animationHandler=null,this.positionFallbackHandler=null}setColorHandler(e){this.colorHandler=e}setColorMixHandler(e){this.colorMixHandler=e}setBezierHandler(e){this.bezierHandler=e}setFontHandler(e){this.fontHandler=e}setShadowHandler(e){this.shadowHandler=e}setGridHandler(e){this.gridHandler=e}setVarHandler(e){this.varHandler=e}setAnimationNameHandler(e){this.animationNameHandler=e}setAnimationHandler(e){this.animationHandler=e}setAngleHandler(e){this.angleHandler=e}setLengthHandler(e){this.lengthHandler=e}setPositionFallbackHandler(e){this.positionFallbackHandler=e}renderName(){const e=document.createElement("span");return n.ARIAUtils.setLabel(e,st(et.cssPropertyName,{PH1:this.propertyName})),e.className="webkit-css-property",e.textContent=this.propertyName,e.normalize(),e}renderValue(){const i=document.createElement("span");if(n.ARIAUtils.setLabel(i,st(et.cssPropertyValue,{PH1:this.propertyValue})),i.className="value",!this.propertyValue)return i;const o=s.CSSMetadata.cssMetadata();if(this.shadowHandler&&o.isShadowProperty(this.propertyName)&&!s.CSSMetadata.VariableRegex.test(this.propertyValue))return i.appendChild(this.shadowHandler(this.propertyValue,this.propertyName)),i.normalize(),i;if(this.gridHandler&&o.isGridAreaDefiningProperty(this.propertyName))return i.appendChild(this.gridHandler(this.propertyValue,this.propertyName)),i.normalize(),i;if(this.animationHandler&&("animation"===this.propertyName||"-webkit-animation"===this.propertyName))return i.appendChild(this.animationHandler(this.propertyValue)),i.normalize(),i;o.isStringProperty(this.propertyName)&&n.Tooltip.Tooltip.install(i,ht(this.propertyValue));const r=[],a=[];this.colorMixHandler&&o.isColorAwareProperty(this.propertyName)&&(r.push(e.Color.ColorMixRegex),a.push(this.colorMixHandler)),r.push(s.CSSMetadata.VariableRegex,s.CSSMetadata.URLRegex),a.push(this.varHandler,this.processURL.bind(this)),this.colorHandler&&o.isColorAwareProperty(this.propertyName)&&(r.push(e.Color.Regex),a.push(this.colorHandler)),this.bezierHandler&&o.isBezierAwareProperty(this.propertyName)&&(r.push(n.Geometry.CubicBezier.Regex),a.push(this.bezierHandler)),this.angleHandler&&o.isAngleAwareProperty(this.propertyName)&&(r.push(p.CSSAngleUtils.CSSAngleRegex),a.push(this.angleHandler)),this.fontHandler&&o.isFontAwareProperty(this.propertyName)&&("font-family"===this.propertyName?r.push(p.FontEditorUtils.FontFamilyRegex):r.push(p.FontEditorUtils.FontPropertiesRegex),a.push(this.fontHandler)),t.Runtime.experiments.isEnabled("cssTypeComponentLength")&&this.lengthHandler&&(r.push(p.CSSLengthUtils.CSSLengthRegex),a.push(this.lengthHandler)),"animation-name"===this.propertyName&&(r.push(/^.*$/g),a.push(this.animationNameHandler)),this.positionFallbackHandler&&"position-fallback"===this.propertyName&&(r.push(/^.*$/g),a.push(this.positionFallbackHandler));const l=f.TextUtils.Utils.splitStringByRegexes(this.propertyValue,r);for(let e=0;e<l.length;e++){const t=l[e],s=-1===t.regexIndex?document.createTextNode.bind(document):a[t.regexIndex];s&&i.appendChild(s(t.value))}return i.normalize(),i}processURL(t){let s=t.substring(4,t.length-1).trim();(/^'.*'$/s.test(s)||/^".*"$/s.test(s))&&(s=e.ParsedURL.ParsedURL.substring(s,1,s.length-1));const i=document.createDocumentFragment();n.UIUtils.createTextChild(i,"url(");let o=null;this.rule&&this.rule.resourceURL()?o=e.ParsedURL.ParsedURL.completeURL(this.rule.resourceURL(),s):this.node&&(o=this.node.resolveURL(s));const r=ee.setImageUrl(m.Linkifier.Linkifier.linkifyURL(o||s,{text:s,preventClick:!1,bypassURLTrimming:!0,showColumnNumber:!1,inlineFrameIndex:0}),o||s);return i.appendChild(r),n.UIUtils.createTextChild(i,")"),i}}let mt;class gt{button;constructor(){this.button=new n.Toolbar.ToolbarButton(st(et.newStyleRule),"plus"),this.button.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.clicked,this);const e=n.Icon.Icon.create("triangle-bottom-right","long-click-glyph");function t(){let e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);e=e?e.enclosingElementOrSelf():null,this.button.setEnabled(Boolean(e))}this.button.element.appendChild(e),new n.UIUtils.LongClickController(this.button.element,this.longClicked.bind(this)),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,t.bind(this)),t.call(this)}static instance(e={forceNew:null}){const{forceNew:t}=e;return mt&&!t||(mt=new gt),mt}clicked(){ot.instance().createNewRuleInViaInspectorStyleSheet()}longClicked(e){ot.instance().onAddButtonLongClick(e)}item(){return this.button}}var ft=Object.freeze({__proto__:null,StylesSidebarPane:ot,SectionBlock:at,IdleCallbackManager:lt,quoteFamilyName:dt,CSSPropertyPrompt:ct,unescapeCssString:ht,escapeUrlAsCssComment:ut,StylesSidebarPropertyRenderer:pt,ButtonProvider:gt});function yt(e){const{name:t,value:s}=e;return`${t.startsWith("--")?`'${t}'`:t.replace(/-([a-z])/gi,((e,t)=>t.toUpperCase()))}: ${`'${s.replaceAll("'","\\'")}'`}`}var Ct=Object.freeze({__proto__:null,getCssDeclarationAsJavascriptProperty:yt});const St=(e,t)=>void 0===t?bt(e):'<code class="unbreakable-text"><span class="property">'+e+"</span>: "+t+"</code>",bt=e=>'<code class="unbreakable-text"><span class="property">'+e+"</span></code>",Et=e=>'<code class="unbreakable-text">'+e+"</code>",vt=e=>{if(!e)return!1;const t=e.get("display");return"flex"===t||"inline-flex"===t},wt=new Set(["audio","canvas","embed","iframe","img","input","object","video"]),xt=e=>{if(!e)return!1;const t=e.get("display");return"grid"===t||"inline-grid"===t},Tt={ruleViolatedBySameElementRuleReason:"The {REASON_PROPERTY_DECLARATION_CODE} property prevents {AFFECTED_PROPERTY_DECLARATION_CODE} from having an effect.",ruleViolatedBySameElementRuleFix:"Try setting {PROPERTY_NAME} to something other than {PROPERTY_VALUE}.",ruleViolatedBySameElementRuleChangeSuggestion:"Try setting the {EXISTING_PROPERTY_DECLARATION} property to {TARGET_PROPERTY_DECLARATION}.",ruleViolatedByParentElementRuleReason:"The {REASON_PROPERTY_DECLARATION_CODE} property on the parent element prevents {AFFECTED_PROPERTY_DECLARATION_CODE} from having an effect.",ruleViolatedByParentElementRuleFix:"Try setting the {EXISTING_PARENT_ELEMENT_RULE} property on the parent to {TARGET_PARENT_ELEMENT_RULE}.",fontVariationSettingsWarning:"Value for setting “{PH1}” {PH2} is outside the supported range [{PH3}, {PH4}] for font-family “{PH5}”."},It=o.i18n.registerUIStrings("panels/elements/CSSRuleValidator.ts",Tt),Mt=o.i18n.getLocalizedString.bind(void 0,It);class Nt{#c;#h;#u;constructor(e,t,s){this.#c=e,this.#h=t,this.#u=s}getMessage(){return this.#c}getPossibleFixMessage(){return this.#h}getLearnMoreLink(){return this.#u}}class Pt{getMetricType(){return i.UserMetrics.CSSHintType.Other}#p;constructor(e){this.#p=e}getApplicableProperties(){return this.#p}}class Rt extends Pt{constructor(){super(["align-content"])}getMetricType(){return i.UserMetrics.CSSHintType.AlignContent}getHint(e,t){if(!t)return;if(!vt(t))return;if("nowrap"!==t.get("flex-wrap"))return;const s=St("flex-wrap","nowrap"),n=bt("align-content");return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:s,AFFECTED_PROPERTY_DECLARATION_CODE:n}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("flex-wrap"),PROPERTY_VALUE:Et("nowrap")}))}}class kt extends Pt{constructor(){super(["flex","flex-basis","flex-grow","flex-shrink"])}getMetricType(){return i.UserMetrics.CSSHintType.FlexItem}getHint(e,t,s){if(!s)return;if(vt(s))return;const n=St("display",s?.get("display")),i=bt(e),o=St("display","flex");return new Nt(Mt(Tt.ruleViolatedByParentElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:n,AFFECTED_PROPERTY_DECLARATION_CODE:i}),Mt(Tt.ruleViolatedByParentElementRuleFix,{EXISTING_PARENT_ELEMENT_RULE:n,TARGET_PARENT_ELEMENT_RULE:o}))}}class Lt extends Pt{constructor(){super(["flex-direction","flex-flow","flex-wrap"])}getMetricType(){return i.UserMetrics.CSSHintType.FlexContainer}getHint(e,t){if(!t)return;if(vt(t))return;const s=St("display",t?.get("display")),n=St("display","flex"),i=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:s,AFFECTED_PROPERTY_DECLARATION_CODE:i}),Mt(Tt.ruleViolatedBySameElementRuleChangeSuggestion,{EXISTING_PROPERTY_DECLARATION:s,TARGET_PROPERTY_DECLARATION:n}))}}class At extends Pt{constructor(){super(["grid","grid-auto-columns","grid-auto-flow","grid-auto-rows","grid-template","grid-template-areas","grid-template-columns","grid-template-rows"])}getMetricType(){return i.UserMetrics.CSSHintType.GridContainer}getHint(e,t){if(xt(t))return;const s=St("display",t?.get("display")),n=St("display","grid"),i=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:s,AFFECTED_PROPERTY_DECLARATION_CODE:i}),Mt(Tt.ruleViolatedBySameElementRuleChangeSuggestion,{EXISTING_PROPERTY_DECLARATION:s,TARGET_PROPERTY_DECLARATION:n}))}}class Ot extends Pt{constructor(){super(["grid-area","grid-column","grid-row","grid-row-end","grid-row-start","justify-self"])}getMetricType(){return i.UserMetrics.CSSHintType.GridItem}getHint(e,t,s){if(!s)return;if(xt(s))return;const n=St("display",s?.get("display")),i=St("display","grid"),o=bt(e);return new Nt(Mt(Tt.ruleViolatedByParentElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:n,AFFECTED_PROPERTY_DECLARATION_CODE:o}),Mt(Tt.ruleViolatedByParentElementRuleFix,{EXISTING_PARENT_ELEMENT_RULE:n,TARGET_PARENT_ELEMENT_RULE:i}))}}class Dt extends Pt{constructor(){super(["place-self","align-self","order"])}getMetricType(){return i.UserMetrics.CSSHintType.FlexOrGridItem}getHint(e,t,s){if(!s)return;if(vt(s)||xt(s))return;const n=St("display",s?.get("display")),i=`${St("display","flex")} or ${St("display","grid")}`,o=bt(e);return new Nt(Mt(Tt.ruleViolatedByParentElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:n,AFFECTED_PROPERTY_DECLARATION_CODE:o}),Mt(Tt.ruleViolatedByParentElementRuleFix,{EXISTING_PARENT_ELEMENT_RULE:n,TARGET_PARENT_ELEMENT_RULE:i}))}}class Ft extends Pt{constructor(){super(["justify-content","align-content","place-content","align-items"])}getMetricType(){return i.UserMetrics.CSSHintType.FlexGrid}getHint(e,t){if(!t)return;if(vt(t)||xt(t))return;const s=St("display",t?.get("display")),n=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:s,AFFECTED_PROPERTY_DECLARATION_CODE:n}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("display"),PROPERTY_VALUE:Et(t?.get("display"))}))}}class Ut extends Pt{constructor(){super(["gap","column-gap","row-gap","grid-gap","grid-column-gap","grid-column-end","grid-row-gap"])}getMetricType(){return i.UserMetrics.CSSHintType.MulticolFlexGrid}getHint(e,t){if(!t)return;if((e=>{if(!e)return!1;const t=e.get("column-width"),s=e.get("column-count");return"auto"!==t||"auto"!==s})(t)||vt(t)||xt(t))return;const s=St("display",t?.get("display")),n=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:s,AFFECTED_PROPERTY_DECLARATION_CODE:n}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("display"),PROPERTY_VALUE:Et(t?.get("display"))}))}}class Ht extends Pt{constructor(){super(["padding","padding-top","padding-right","padding-bottom","padding-left"])}getMetricType(){return i.UserMetrics.CSSHintType.Padding}getHint(e,t){const s=t?.get("display");if(!s)return;if(!["table-row-group","table-header-group","table-footer-group","table-row","table-column-group","table-column"].includes(s))return;const n=St("display",t?.get("display")),i=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:n,AFFECTED_PROPERTY_DECLARATION_CODE:i}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("display"),PROPERTY_VALUE:Et(t?.get("display"))}))}}class Vt extends Pt{constructor(){super(["top","right","bottom","left"])}getMetricType(){return i.UserMetrics.CSSHintType.Position}getHint(e,t){const s=t?.get("position");if(!s)return;if("static"!==s)return;const n=St("position",t?.get("position")),i=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:n,AFFECTED_PROPERTY_DECLARATION_CODE:i}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("position"),PROPERTY_VALUE:Et(t?.get("position"))}))}}class Bt extends Pt{constructor(){super(["z-index"])}getMetricType(){return i.UserMetrics.CSSHintType.ZIndex}getHint(e,t,s){const n=t?.get("position");if(!n)return;if(["absolute","relative","fixed","sticky"].includes(n)||vt(s)||xt(s))return;const i=St("position",t?.get("position")),o=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:i,AFFECTED_PROPERTY_DECLARATION_CODE:o}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("position"),PROPERTY_VALUE:Et(t?.get("position"))}))}}class _t extends Pt{constructor(){super(["width","height"])}getMetricType(){return i.UserMetrics.CSSHintType.Sizing}getHint(e,t,s,n){if(!t||!n)return;if(!(e=>!!e&&"inline"===e.get("display"))(t))return;if((e=>!!e&&wt.has(e))(n))return;const i=St("display",t?.get("display")),o=bt(e);return new Nt(Mt(Tt.ruleViolatedBySameElementRuleReason,{REASON_PROPERTY_DECLARATION_CODE:i,AFFECTED_PROPERTY_DECLARATION_CODE:o}),Mt(Tt.ruleViolatedBySameElementRuleFix,{PROPERTY_NAME:bt("display"),PROPERTY_VALUE:Et(t?.get("display"))}))}}class Wt extends Pt{constructor(){super(["font-variation-settings"])}getMetricType(){return i.UserMetrics.CSSHintType.FontVariationSettings}getHint(e,t,n,i,o){if(!t)return;const r=t.get("font-variation-settings");if(!r)return;const a=t.get("font-family");if(!a)return;const l=new Set(s.CSSPropertyParser.parseFontFamily(a)),d=(o||[]).filter((e=>l.has(e.getFontFamily()))),c=s.CSSPropertyParser.parseFontVariationSettings(r),h=[];for(const e of c)for(const t of d){const s=t.getVariationAxisByTag(e.tag);s&&((e.value<s.minValue||e.value>s.maxValue)&&h.push(Mt(Tt.fontVariationSettingsWarning,{PH1:e.tag,PH2:e.value,PH3:s.minValue,PH4:s.maxValue,PH5:t.getFontFamily()})))}return h.length?new Nt(h.join(" "),""):void 0}}const qt=[Rt,Lt,Ft,kt,Dt,Wt,At,Ot,Ut,Ht,Vt,_t,Bt],zt=(()=>{const e=new Map;for(const t of qt){const s=new t,n=s.getApplicableProperties();for(const t of n){let n=e.get(t);void 0===n&&(n=[]),n.push(s),e.set(t,n)}}return e})();var Kt=Object.freeze({__proto__:null,Hint:Nt,CSSRuleValidator:Pt,AlignContentValidator:Rt,FlexItemValidator:kt,FlexContainerValidator:Lt,GridContainerValidator:At,GridItemValidator:Ot,FlexOrGridItemValidator:Dt,FlexGridValidator:Ft,MulticolFlexGridValidator:Ut,PaddingValidator:Ht,PositionValidator:Vt,ZIndexValidator:Bt,SizingValidator:_t,FontVariationSettingsValidator:Wt,cssRuleValidatorsMap:zt});const jt=h.StylePropertyEditor.FlexboxEditor,$t=h.StylePropertyEditor.GridEditor,Gt=new WeakMap,Yt={shiftClickToChangeColorFormat:"Shift + Click to change color format.",openColorPickerS:"Open color picker. {PH1}",togglePropertyAndContinueEditing:"Toggle property and continue editing",revealInSourcesPanel:"Reveal in Sources panel",copyDeclaration:"Copy declaration",copyProperty:"Copy property",copyValue:"Copy value",copyRule:"Copy rule",copyAllDeclarations:"Copy all declarations",copyAllCSSChanges:"Copy all CSS changes",viewComputedValue:"View computed value",flexboxEditorButton:"Open `flexbox` editor",gridEditorButton:"Open `grid` editor",copyCssDeclarationAsJs:"Copy declaration as JS",copyAllCssDeclarationsAsJs:"Copy all declarations as JS"},Qt=o.i18n.registerUIStrings("panels/elements/StylePropertyTreeElement.ts",Yt),Xt=o.i18n.getLocalizedString.bind(void 0,Qt),Jt=new WeakMap;class Zt extends n.TreeOutline.TreeElement{style;matchedStylesInternal;property;inheritedInternal;overloadedInternal;parentPaneInternal;isShorthand;applyStyleThrottler;newProperty;expandedDueToFilter;valueElement;nameElement;expandElement;originalPropertyText;hasBeenEditedIncrementally;prompt;lastComputedValue;computedStyles=null;parentsComputedStyles=null;contextForTest;#m;constructor(t,s,n,i,o,r,a){super("",i),this.style=n.ownerStyle,this.matchedStylesInternal=s,this.property=n,this.inheritedInternal=o,this.overloadedInternal=r,this.selectable=!1,this.parentPaneInternal=t,this.isShorthand=i,this.applyStyleThrottler=new e.Throttler.Throttler(0),this.newProperty=a,this.newProperty&&(this.listItemElement.textContent=""),this.expandedDueToFilter=!1,this.valueElement=null,this.nameElement=null,this.expandElement=null,this.originalPropertyText="",this.hasBeenEditedIncrementally=!1,this.prompt=null,this.lastComputedValue=null,this.#m=n.propertyText||""}matchedStyles(){return this.matchedStylesInternal}editable(){return Boolean(this.style.styleSheetId&&this.style.range)}inherited(){return this.inheritedInternal}overloaded(){return this.overloadedInternal}setOverloaded(e){e!==this.overloadedInternal&&(this.overloadedInternal=e,this.updateState())}setComputedStyles(e){this.computedStyles=e}setParentsComputedStyles(e){this.parentsComputedStyles=e}get name(){return this.property.name}get value(){return this.property.value}updateFilter(){const e=this.parentPaneInternal.filterRegex(),t=null!==e&&(e.test(this.property.name)||e.test(this.property.value));this.listItemElement.classList.toggle("filter-match",t),this.onpopulate();let s=!1;for(let e=0;e<this.childCount();++e){const t=this.childAt(e);!t||t&&!t.updateFilter()||(s=!0)}return e?s&&!this.expanded?(this.expand(),this.expandedDueToFilter=!0):!s&&this.expanded&&this.expandedDueToFilter&&(this.collapse(),this.expandedDueToFilter=!1):(this.expandedDueToFilter&&this.collapse(),this.expandedDueToFilter=!1),t}renderColorSwatch(e,t){const s=this.editable(),n=Xt(Yt.shiftClickToChangeColorFormat),o=this.editable()?Xt(Yt.openColorPickerS,{PH1:n}):n,r=new p.ColorSwatch.ColorSwatch;if(r.renderColor(e,s,o),!t){t=r.createChild("span");const s=r.getColor();t.textContent=s?s.getAuthoredText()??s.asString(r.getFormat()??void 0):e}r.appendChild(t);if(r.addEventListener(p.ColorSwatch.ClickEvent.eventName,(()=>{i.userMetrics.swatchActivated(2)})),r.addEventListener(p.ColorSwatch.ColorChangedEvent.eventName,(e=>{const{data:t}=e;r.firstElementChild&&r.firstElementChild.remove(),r.createChild("span").textContent=t.text,this.applyStyleText(this.renderedPropertyText(),!1)})),this.editable()){const e=new ye(this,this.parentPaneInternal.swatchPopoverHelper(),r);e.addEventListener("colorchanged",(e=>{r.dispatchEvent(new p.ColorSwatch.ColorChangedEvent(e.data))})),this.addColorContrastInfo(e)}return r}processAnimationName(e){const t=e.split(",").map((e=>e.trim())),s=document.createElement("span");for(let e=0;e<t.length;e++){const o=t[e],r=new p.LinkSwatch.LinkSwatch;n.UIUtils.createTextChild(r,o);const a=Boolean(this.matchedStylesInternal.keyframes().find((e=>e.name().text===o)));r.data={text:o,isDefined:a,onLinkActivate:()=>{i.userMetrics.swatchActivated(1),this.parentPaneInternal.jumpToSectionBlock(`@keyframes ${o}`)}},s.appendChild(r),e!==t.length-1&&s.appendChild(document.createTextNode(", "))}return s}processAnimation(e){const t=this.property.getLonghandProperties().find((e=>"animation-name"===e.name));if(!t)return document.createTextNode(e);const s=t.value.split(",").map((e=>e.trim())),n=p.CSSAnimationModel.CSSAnimationModel.parse(e,s),i=document.createElement("span");for(let e=0;e<n.parts.length;e++){const t=n.parts[e];switch(t.type){case"T":i.appendChild(document.createTextNode(t.value));break;case"EF":i.appendChild(this.processBezier(t.value));break;case"AN":i.appendChild(this.processAnimationName(t.value));break;case"V":i.appendChild(this.processVar(t.value))}","!==n.parts[e+1]?.value&&e!==n.parts.length-1&&i.appendChild(document.createTextNode(" "))}return i}processPositionFallback(e){const t=document.createElement("span"),s=new p.LinkSwatch.LinkSwatch;n.UIUtils.createTextChild(s,e);const o=Boolean(this.matchedStylesInternal.positionFallbackRules().find((t=>t.name().text===e)));return s.data={text:e,isDefined:o,onLinkActivate:()=>{i.userMetrics.swatchActivated(9),this.parentPaneInternal.jumpToSectionBlock(`@position-fallback ${e}`)}},t.appendChild(s),t}processColor(e,t){return this.renderColorSwatch(e,t)}processColorMix(t){let n=t,i=!1;const o=[],r=p.ColorMixModel.ColorMixModel.parse(t);if(!r)return document.createTextNode(t);const a=(t,i)=>{if(t.match(s.CSSMetadata.VariableRegex)){const s=this.matchedStylesInternal.computeSingleVariableValue(this.style,t);if(!s||!s.computedValue||!e.Color.parse(s.computedValue))return;const{computedValue:r}=s;n=n.replace(t,r);const a=this.processVar(t);return a instanceof p.ColorSwatch.ColorSwatch&&a.addEventListener(p.ColorSwatch.ColorChangedEvent.eventName,(e=>{i(e.data.text)})),m.appendChild(a),void o.push(s.computedValue)}if(t.match(e.Color.Regex)){const e=this.processColor(t);e instanceof p.ColorSwatch.ColorSwatch&&e.addEventListener(p.ColorSwatch.ColorChangedEvent.eventName,(e=>{i(e.data.text)})),m.appendChild(e),o.push(t)}},l=(e,t)=>{for(let s=0;s<e.length;s++){const n=e[s];"V"===n.name?a(n.value,t):m.appendChild(document.createTextNode(n.value)),s!==e.length-1&&m.appendChild(document.createTextNode(" "))}},[d,c,h]=r.parts,u=new p.ColorMixSwatch.ColorMixSwatch,m=document.createElement("span");return m.appendChild(document.createTextNode("color-mix(")),(e=>{const t=f.TextUtils.Utils.splitStringByRegexes(e,[s.CSSMetadata.VariableRegex]);for(const e of t)if(0===e.regexIndex){const t=this.matchedStylesInternal.computeSingleVariableValue(this.style,e.value);if(!t||!t.computedValue)return;n=n.replace(e.value,t.computedValue);const s=this.processVar(e.value);m.appendChild(s)}else m.appendChild(document.createTextNode(e.value));i=!0})(d.value),m.appendChild(document.createTextNode(", ")),l(c.value,(e=>{u.setFirstColor(e)})),m.appendChild(document.createTextNode(", ")),l(h.value,(e=>{u.setSecondColor(e)})),m.appendChild(document.createTextNode(")")),2===o.length&&i?(u.appendChild(m),u.setFirstColor(o[0]),u.setSecondColor(o[1]),u.setColorMixText(n),u):document.createTextNode(t)}processVar(t){const s=this.matchedStylesInternal.computeSingleVariableValue(this.style,t);if(!s)return document.createTextNode(t);const{computedValue:i,fromFallback:o}=s,r=new p.LinkSwatch.CSSVarSwatch;return n.UIUtils.createTextChild(r,t),r.data={text:t,computedValue:i,fromFallback:o,onLinkActivate:this.handleVarDefinitionActivate.bind(this)},i&&e.Color.parse(i)?this.processColor(i,r):r}handleVarDefinitionActivate(e){i.userMetrics.actionTaken(i.UserMetrics.Action.CustomPropertyLinkClicked),i.userMetrics.swatchActivated(0),this.parentPaneInternal.jumpToProperty(e)}async addColorContrastInfo(e){if("color"!==this.property.name||!this.parentPaneInternal.cssModel()||!this.node())return;const t=this.parentPaneInternal.cssModel(),s=this.node();if(t&&s&&void 0!==s.id){const n=new y.ContrastInfo.ContrastInfo(await t.getBackgroundColors(s.id));e.setContrastInfo(n)}}renderedPropertyText(){return this.nameElement&&this.valueElement?this.nameElement.textContent+": "+this.valueElement.textContent:""}processBezier(e){if(!this.editable()||!p.AnimationTimingModel.AnimationTimingModel.parse(e))return document.createTextNode(e);const t=this.parentPaneInternal.swatchPopoverHelper(),s=p.Swatches.BezierSwatch.create();return s.iconElement().addEventListener("click",(()=>{i.userMetrics.swatchActivated(3)})),s.setBezierText(e),new fe({treeElement:this,swatchPopoverHelper:t,swatch:s}),s}processFont(e){const t=this.section();return t&&t.registerFontProperty(this),document.createTextNode(e)}processShadow(e,t){if(!this.editable())return document.createTextNode(e);let s;if(s="text-shadow"===t?p.CSSShadowModel.CSSShadowModel.parseTextShadow(e):p.CSSShadowModel.CSSShadowModel.parseBoxShadow(e),!s.length)return document.createTextNode(e);const n=document.createDocumentFragment(),o=this.parentPaneInternal.swatchPopoverHelper();for(let e=0;e<s.length;e++){0!==e&&n.appendChild(document.createTextNode(", "));const t=p.Swatches.CSSShadowSwatch.create();t.setCSSShadow(s[e]),t.iconElement().addEventListener("click",(()=>{i.userMetrics.swatchActivated(4)})),new Ce(this,o,t);const r=t.colorSwatch();if(r){r.addEventListener(p.ColorSwatch.ClickEvent.eventName,(()=>{i.userMetrics.swatchActivated(2)}));new ye(this,o,r).addEventListener("colorchanged",(e=>{r.dispatchEvent(new p.ColorSwatch.ColorChangedEvent(e.data))})),r.addEventListener(p.ColorSwatch.ColorChangedEvent.eventName,(()=>{this.applyStyleText(this.renderedPropertyText(),!1)}))}n.appendChild(t)}return n}processGrid(t,i){const o=f.TextUtils.Utils.splitStringByRegexes(t,[s.CSSMetadata.GridAreaRowRegex]);if(o.length<=1)return document.createTextNode(t);const r=e.Settings.Settings.instance().moduleSetting("textEditorIndent").get(),a=document.createDocumentFragment();for(const e of o){const t=e.value.trim(),s=n.Fragment.html`<br><span class="styles-clipboard-only">${r.repeat(2)}</span>${t}`;a.appendChild(s)}return a}processAngle(e){if(!this.editable())return document.createTextNode(e);const t=new p.CSSAngle.CSSAngle,s=document.createElement("span");s.textContent=e;const n=this.matchedStylesInternal.computeValue(this.property.ownerStyle,this.property.value)||"";t.data={propertyName:this.property.name,propertyValue:n,angleText:e,containingPane:this.parentPaneInternal.element.enclosingNodeOrSelfWithClass("style-panes-wrapper")},t.append(s);return t.addEventListener("popovertoggled",(e=>{const s=this.section();if(!s)return;const{data:n}=e;n.open&&(this.parentPaneInternal.hideAllPopovers(),this.parentPaneInternal.activeCSSAngle=t,i.userMetrics.swatchActivated(7)),s.element.classList.toggle("has-open-popover",n.open),this.parentPaneInternal.setEditingStyle(n.open)})),t.addEventListener("valuechanged",(async e=>{const{data:n}=e;s.textContent=n.value,await this.applyStyleText(this.renderedPropertyText(),!1);const i=this.matchedStylesInternal.computeValue(this.property.ownerStyle,this.property.value)||"";t.updateProperty(this.property.name,i)})),t.addEventListener("unitchanged",(async e=>{const{data:t}=e;s.textContent=t.value})),t}processLength(e){if(!this.editable())return document.createTextNode(e);const t=new p.CSSLength.CSSLength,s=document.createElement("span");s.textContent=e,t.data={lengthText:e,overloaded:this.overloadedInternal},t.append(s);return t.addEventListener("valuechanged",(e=>{const{data:t}=e;s.textContent=t.value,this.parentPaneInternal.setEditingStyle(!0),this.applyStyleText(this.renderedPropertyText(),!1)})),t.addEventListener("draggingfinished",(()=>{this.parentPaneInternal.setEditingStyle(!1)})),t}updateState(){if(!this.listItemElement)return;this.style.isPropertyImplicit(this.name)?this.listItemElement.classList.add("implicit"):this.listItemElement.classList.remove("implicit");!this.property.parsedOk&&ot.ignoreErrorsForProperty(this.property)?this.listItemElement.classList.add("has-ignorable-error"):this.listItemElement.classList.remove("has-ignorable-error"),this.inherited()?this.listItemElement.classList.add("inherited"):this.listItemElement.classList.remove("inherited"),this.overloaded()?this.listItemElement.classList.add("overloaded"):this.listItemElement.classList.remove("overloaded"),this.property.disabled?this.listItemElement.classList.add("disabled"):this.listItemElement.classList.remove("disabled"),this.listItemElement.classList.toggle("changed",this.isPropertyChanged(this.property))}node(){return this.parentPaneInternal.node()}parentPane(){return this.parentPaneInternal}section(){return this.treeOutline?this.treeOutline.section:null}updatePane(){const e=this.section();e&&e.refreshUpdate(this)}async toggleDisabled(e){if(!this.style.range)return;this.parentPaneInternal.setUserOperation(!0);const t=await this.property.setDisabled(e);this.parentPaneInternal.setUserOperation(!1),t&&(this.matchedStylesInternal.resetActiveProperties(),this.updatePane(),this.styleTextAppliedForTest())}isPropertyChanged(e){return!!t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)&&(this.#m!==e.propertyText||this.parentPane().isPropertyChanged(e))}async onpopulate(){if(this.childCount()||!this.isShorthand)return;const e=this.property.getLonghandProperties(),t=this.style.leadingProperties();for(const n of e){const e=n.name;let i=!1,o=!1;const r=this.section();r&&(i=r.isPropertyInherited(e),o=this.matchedStylesInternal.propertyState(n)===s.CSSMatchedStyles.PropertyState.Overloaded);const a=t.find((t=>t.name===e&&t.activeInStyle()));a&&(o=!0);const l=new Zt(this.parentPaneInternal,this.matchedStylesInternal,n,!1,i,o,!1);l.setComputedStyles(this.computedStyles),l.setParentsComputedStyles(this.parentsComputedStyles),this.appendChild(l)}}onattach(){this.updateTitle(),this.listItemElement.addEventListener("mousedown",(e=>{0===e.button&&Jt.set(this.parentPaneInternal,this)}),!1),this.listItemElement.addEventListener("mouseup",this.mouseUp.bind(this)),this.listItemElement.addEventListener("click",(e=>{if(!e.target)return;e.target.hasSelection()||e.target===this.listItemElement||e.consume(!0)})),this.listItemElement.addEventListener("contextmenu",this.handleCopyContextMenuEvent.bind(this))}onexpand(){this.updateExpandElement()}oncollapse(){this.updateExpandElement()}updateExpandElement(){this.expandElement&&(this.expanded?this.expandElement.setIconType("triangle-down"):this.expandElement.setIconType("triangle-right"))}updateTitleIfComputedValueChanged(){const e=this.matchedStylesInternal.computeValue(this.property.ownerStyle,this.property.value);e!==this.lastComputedValue&&(this.lastComputedValue=e,this.innerUpdateTitle())}updateTitle(){this.lastComputedValue=this.matchedStylesInternal.computeValue(this.property.ownerStyle,this.property.value),this.innerUpdateTitle()}innerUpdateTitle(){this.updateState(),this.isExpandable()?this.expandElement=n.Icon.Icon.create("triangle-right","expand-icon"):this.expandElement=null;const t=new pt(this.style.parentRule,this.node(),this.name,this.value);if(this.property.parsedOk&&(t.setVarHandler(this.processVar.bind(this)),t.setAnimationNameHandler(this.processAnimationName.bind(this)),t.setAnimationHandler(this.processAnimation.bind(this)),t.setColorHandler(this.processColor.bind(this)),t.setColorMixHandler(this.processColorMix.bind(this)),t.setBezierHandler(this.processBezier.bind(this)),t.setFontHandler(this.processFont.bind(this)),t.setShadowHandler(this.processShadow.bind(this)),t.setGridHandler(this.processGrid.bind(this)),t.setAngleHandler(this.processAngle.bind(this)),t.setLengthHandler(this.processLength.bind(this)),t.setPositionFallbackHandler(this.processPositionFallback.bind(this))),this.listItemElement.removeChildren(),this.nameElement=t.renderName(),this.property.name.startsWith("--")&&this.nameElement&&n.Tooltip.Tooltip.install(this.nameElement,this.matchedStylesInternal.computeCSSVariable(this.style,this.property.name)||""),this.valueElement=t.renderValue(),!this.treeOutline)return;const o=e.Settings.Settings.instance().moduleSetting("textEditorIndent").get();if(n.UIUtils.createTextChild(this.listItemElement.createChild("span","styles-clipboard-only"),o+(this.property.disabled?"/* ":"")),this.nameElement&&this.listItemElement.appendChild(this.nameElement),this.valueElement){const e=this.valueElement.firstElementChild&&"BR"===this.valueElement.firstElementChild.tagName?":":": ";this.listItemElement.createChild("span","styles-name-value-separator").textContent=e,this.expandElement&&this.listItemElement.appendChild(this.expandElement),this.listItemElement.appendChild(this.valueElement);const t=this.listItemElement.createChild("span","styles-semicolon");t.textContent=";",t.onmouseup=this.mouseUp.bind(this),this.property.disabled&&n.UIUtils.createTextChild(this.listItemElement.createChild("span","styles-clipboard-only")," */")}const r=this.section();if(this.valueElement&&r&&r.editable&&"display"===this.property.name){const e=this.property.trimmedValueWithoutImportant(),t="flex"===e||"inline-flex"===e,s="grid"===e||"inline-grid"===e;if(t||s){const e=`${r.getSectionIdx()}_${r.nextEditorTriggerButtonIdx}`,s=Ae.createTriggerButton(this.parentPaneInternal,r,t?jt:$t,Xt(t?Yt.flexboxEditorButton:Yt.gridEditorButton),e);r.nextEditorTriggerButtonIdx++,s.addEventListener("click",(()=>{i.userMetrics.swatchActivated(t?6:5)})),this.listItemElement.appendChild(s);const n=this.parentPaneInternal.swatchPopoverHelper();n.isShowing(Ae.instance())&&Ae.instance().getTriggerKey()===e&&n.setAnchorElement(s)}}if(this.property.parsedOk)this.updateAuthoringHint();else{this.listItemElement.classList.add("not-parsed-ok"),this.listItemElement.insertBefore(ot.createExclamationMark(this.property,null),this.listItemElement.firstChild);s.CSSMetadata.cssMetadata().isCSSPropertyName(this.property.name)&&this.listItemElement.classList.add("invalid-property-value")}if(this.property.activeInStyle()||this.listItemElement.classList.add("inactive"),this.updateFilter(),this.property.parsedOk&&this.section()&&this.parent&&this.parent.root){const e=document.createElement("input");e.className="enabled-button",e.type="checkbox",e.checked=!this.property.disabled,e.addEventListener("mousedown",(e=>e.consume()),!1),e.addEventListener("click",(e=>{this.toggleDisabled(!this.property.disabled),e.consume()}),!1),this.nameElement&&this.valueElement&&n.ARIAUtils.setLabel(e,`${this.nameElement.textContent} ${this.valueElement.textContent}`);const t=n.Icon.Icon.create("copy","copy");n.Tooltip.Tooltip.install(t,Xt(Yt.copyDeclaration)),t.addEventListener("click",(()=>{const e=`${this.property.name}: ${this.property.value};`;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.DeclarationViaChangedLine)})),this.listItemElement.append(t),this.listItemElement.insertBefore(e,this.listItemElement.firstChild)}}updateAuthoringHint(){this.listItemElement.classList.remove("inactive-property");const e=this.listItemElement.querySelector(".hint");e&&(Gt.delete(e),e?.closest(".hint-wrapper")?.remove());const t=this.property.name;if(!zt.has(t))return;if(this.node()?.isSVGNode())return;const s=this.parentPaneInternal.cssModel()?.fontFaces()||[],n=this.node()?.localName();for(const e of zt.get(t)||[]){const o=e.getHint(t,this.computedStyles||void 0,this.parentsComputedStyles||void 0,n?.toLowerCase(),s);if(o){i.userMetrics.cssHintShown(e.getMetricType());const t=document.createElement("span");t.classList.add("hint-wrapper");const s=new C.Icon.Icon;s.data={iconName:"info",color:"var(--icon-default)",width:"14px",height:"14px"},s.classList.add("hint"),t.append(s),Gt.set(s,o),this.listItemElement.append(t),this.listItemElement.classList.add("inactive-property");break}}}mouseUp(e){const t=Jt.get(this.parentPaneInternal);if(Jt.delete(this.parentPaneInternal),!t)return;if(this.listItemElement.hasSelection())return;if(n.UIUtils.isBeingEdited(e.target))return;if(e.consume(!0),e.target===this.listItemElement)return;const s=this.section();n.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(e)&&s&&s.navigable?this.navigateToSource(e.target):this.startEditing(e.target)}handleContextMenuEvent(e,t){const s=new n.ContextMenu.ContextMenu(t);if(this.property.parsedOk&&this.section()&&this.parent&&this.parent.root){const n=this.parentPaneInternal.focusedSectionIndex();s.defaultSection().appendCheckboxItem(Xt(Yt.togglePropertyAndContinueEditing),(async()=>{if(this.treeOutline){const s=this.treeOutline.rootElement().indexOfChild(this);this.editingCancelled(null,e),await this.toggleDisabled(!this.property.disabled),t.consume(),this.parentPaneInternal.continueEditingElement(n,s)}}),!this.property.disabled)}const i=this.navigateToSource.bind(this);s.defaultSection().appendItem(Xt(Yt.revealInSourcesPanel),i),s.show()}handleCopyContextMenuEvent(e){if(!e.target)return;this.createCopyContextMenu(e).show()}createCopyContextMenu(e){const t=new n.ContextMenu.ContextMenu(e);return t.headerSection().appendItem(Xt(Yt.copyDeclaration),(()=>{const e=`${this.property.name}: ${this.property.value};`;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.DeclarationViaContextMenu)})),t.headerSection().appendItem(Xt(Yt.copyProperty),(()=>{i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.property.name),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.PropertyViaContextMenu)})),t.headerSection().appendItem(Xt(Yt.copyValue),(()=>{i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.property.value),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.ValueViaContextMenu)})),t.headerSection().appendItem(Xt(Yt.copyRule),(()=>{const e=this.section(),t=ot.formatLeadingProperties(e).ruleText;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(t),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.RuleViaContextMenu)})),t.headerSection().appendItem(Xt(Yt.copyCssDeclarationAsJs),this.copyCssDeclarationAsJs.bind(this)),t.clipboardSection().appendItem(Xt(Yt.copyAllDeclarations),(()=>{const e=this.section(),t=ot.formatLeadingProperties(e).allDeclarationText;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(t),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllDeclarationsViaContextMenu)})),t.clipboardSection().appendItem(Xt(Yt.copyAllCssDeclarationsAsJs),this.copyAllCssDeclarationAsJs.bind(this)),t.defaultSection().appendItem(Xt(Yt.copyAllCSSChanges),(async()=>{const e=await this.parentPane().getFormattedChanges();i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllChangesViaStylesPane)})),t.footerSection().appendItem(Xt(Yt.viewComputedValue),(()=>{this.viewComputedValue()})),t}async viewComputedValue(){const e=eo.instance().getComputedStyleWidget();e.isShowing()||await n.ViewManager.ViewManager.instance().showView("Computed");let t="";t=this.isShorthand?"^"+this.property.name+"-":"^"+this.property.name+"$";const s=new RegExp(t,"i");await e.filterComputedStyles(s);const i=e.input;i.value=this.property.name,i.focus()}copyCssDeclarationAsJs(){const e=yt(this.property);i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.DeclarationAsJSViaContextMenu)}copyAllCssDeclarationAsJs(){const e=this.section().style().leadingProperties().filter((e=>!e.disabled)).map(yt);i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e.join(",\n")),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllDeclarationsAsJSViaContextMenu)}navigateToSource(t,s){const n=this.section();if(!n||!n.navigable)return;const i=t===this.nameElement,o=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().propertyUILocation(this.property,i);o&&e.Revealer.reveal(o,s)}startEditing(e){if(this.parent instanceof Zt&&this.parent.isShorthand)return;if(this.expandElement&&e===this.expandElement)return;const t=this.section();if(t&&!t.editable)return;if(e&&(e=e.enclosingNodeOrSelfWithClass("webkit-css-property")||e.enclosingNodeOrSelfWithClass("value")||e.enclosingNodeOrSelfWithClass("styles-semicolon")),e||(e=this.nameElement),n.UIUtils.isBeingEdited(e))return;const i=e===this.nameElement;var o;!i&&this.valueElement&&(s.CSSMetadata.cssMetadata().isGridAreaDefiningProperty(this.name)&&(this.valueElement.textContent=(o=this.value,f.TextUtils.Utils.splitStringByRegexes(o,[s.CSSMetadata.GridAreaRowRegex]).map((e=>e.value.trim())).join("\n"))),this.valueElement.textContent=function(e,t){const n=e.split(s.CSSMetadata.URLRegex);if(1===n.length)return e;const i=new RegExp(s.CSSMetadata.URLRegex);for(let e=1;e<n.length;e+=2){const s=i.exec(t);s&&(n[e]=s[0])}return n.join("")}(this.valueElement.textContent||"",this.value),e=this.valueElement);const r=e&&e.textContent||"",a={expanded:this.expanded,hasChildren:this.isExpandable(),isEditingName:i,originalProperty:this.property,previousContent:r,originalName:void 0,originalValue:void 0};this.contextForTest=a,this.setExpandable(!1),e&&(e.parentElement&&e.parentElement.classList.add("child-editing"),e.textContent=e.textContent),this.originalPropertyText=this.property.propertyText||"",this.parentPaneInternal.setEditingStyle(!0,this),e&&e.parentElement&&e.parentElement.scrollIntoViewIfNeeded(!1),this.prompt=new ct(this,i),this.prompt.setAutocompletionTimeout(0),this.prompt.addEventListener(n.TextPrompt.Events.TextChanged,(e=>{this.applyFreeFlowStyleTextEdit(a)}));const l=this.property.getInvalidStringForInvalidProperty();if(l&&e&&n.ARIAUtils.alert(l),e){const t=this.prompt.attachAndStartEditing(e,function(e,t){let s=t.target.textContent;e.isEditingName||(s=this.value||s),this.editingCommitted(s||"",e,"")}.bind(this,a));this.navigateToSource(e,!0),t.addEventListener("keydown",this.editingNameValueKeyDown.bind(this,a),!1),t.addEventListener("keypress",this.editingNameValueKeyPress.bind(this,a),!1),i&&(t.addEventListener("paste",function(e,t){const s=t.clipboardData;if(!s)return;const n=s.getData("Text");if(!n)return;const i=n.indexOf(":");if(i<0)return;const o=n.substring(0,i).trim(),r=n.substring(i+1).trim();t.preventDefault(),void 0===e.originalName&&(this.nameElement&&(e.originalName=this.nameElement.textContent||""),this.valueElement&&(e.originalValue=this.valueElement.textContent||"")),this.property.name=o,this.property.value=r,this.nameElement&&(this.nameElement.textContent=o,this.nameElement.normalize()),this.valueElement&&(this.valueElement.textContent=r,this.valueElement.normalize());const a=t.target;this.editingCommitted(a.textContent||"",e,"forward")}.bind(this,a),!1),t.addEventListener("contextmenu",this.handleContextMenuEvent.bind(this,a),!1));const s=e.getComponentSelection();s&&s.selectAllChildren(e)}}editingNameValueKeyDown(e,t){if(t.handled)return;const s=t,i=s.target;let o;if("Enter"===s.key&&!s.shiftKey||e.isEditingName&&" "===s.key)o="forward";else if(s.keyCode===n.KeyboardShortcut.Keys.Esc.code||s.key===r.KeyboardUtilities.ESCAPE_KEY)o="cancel";else if(!e.isEditingName&&this.newProperty&&s.keyCode===n.KeyboardShortcut.Keys.Backspace.code){const e=i.getComponentSelection();e&&e.isCollapsed&&!e.focusOffset&&(t.preventDefault(),o="backward")}else"Tab"===s.key&&(o=s.shiftKey?"backward":"forward",t.preventDefault());if(o){switch(o){case"cancel":this.editingCancelled(null,e);break;case"forward":case"backward":this.editingCommitted(i.textContent||"",e,o)}t.consume()}else;}editingNameValueKeyPress(e,t){const s=t,n=s.target,i=String.fromCharCode(s.charCode),o=this.#g(n);if(e.isEditingName?":"===i:";"===i&&null!==o&&function(e,t){let s="";for(let n=0;n<t;++n){const t=e[n];"\\"===t&&""!==s?++n:s||'"'!==t&&"'"!==t?s===t&&(s=""):s=t}return!s}(n.textContent||"",o))return t.consume(!0),void this.editingCommitted(n.textContent||"",e,"forward")}#g(e){const t=e.getComponentSelection();if(!t?.containsNode(e,!0))return null;let s=t.anchorOffset,n=t.anchorNode;for(;n!==e;){for(;n?.previousSibling;)n=n.previousSibling,s+=n.textContent?.length??0;n=n?.parentNodeOrShadowHost()??null}return s}async applyFreeFlowStyleTextEdit(e){if(!this.prompt||!this.parentPaneInternal.node())return;const t=this.prompt.text();if(e.isEditingName&&t.includes(":"))return void this.editingCommitted(t,e,"forward");const s=this.prompt.textWithCurrentSuggestion();if(s.includes(";"))return;const n=this.parentPaneInternal.node();if(n){if(Boolean(n.pseudoType())){if("content"===this.name.toLowerCase())return;const e=s.trim().toLowerCase();if(e.startsWith("content:")||"display: none"===e)return}}e.isEditingName?s.includes(":")?await this.applyStyleText(s,!1):this.hasBeenEditedIncrementally&&await this.applyOriginalStyle(e):this.nameElement&&await this.applyStyleText(`${this.nameElement.textContent}: ${s}`,!1)}kickFreeFlowStyleEditForTest(){const e=this.contextForTest;return this.applyFreeFlowStyleTextEdit(e)}editingEnded(e){this.setExpandable(e.hasChildren),e.expanded&&this.expand();const t=e.isEditingName?this.nameElement:this.valueElement;t&&t.parentElement&&t.parentElement.classList.remove("child-editing"),this.parentPaneInternal.setEditingStyle(!1)}editingCancelled(e,t){this.removePrompt(),this.hasBeenEditedIncrementally?this.applyOriginalStyle(t):this.newProperty&&this.treeOutline&&this.treeOutline.removeChild(this),this.updateTitle(),this.editingEnded(t)}async applyOriginalStyle(e){await this.applyStyleText(this.originalPropertyText,!1,e.originalProperty)}findSibling(e){let t=this;do{const s="forward"===e?t.nextSibling:t.previousSibling;t=s instanceof Zt?s:null}while(t&&t.inherited());return t}async editingCommitted(e,t,s){this.removePrompt(),this.editingEnded(t);const n=t.isEditingName;if(!this.nameElement||!this.valueElement)return;const i=this.nameElement.textContent||"",o=n&&i.includes(":")||!this.property;let a=!1,l=!1;const d=void 0!==t.originalName,c=d&&(this.nameElement.textContent!==t.originalName||this.valueElement.textContent!==t.originalValue),h=d&&n&&this.valueElement.textContent!==t.originalValue;let u=this;const p=n!==("forward"===s),m=this.newProperty&&!e&&(p||n);("forward"===s&&(!n||h)||"backward"===s&&n)&&(u=u.findSibling(s),u||("forward"!==s||this.newProperty&&!e?"backward"===s&&(l=!0):a=!0));let g=-1;null!==u&&this.treeOutline&&(g=this.treeOutline.rootElement().indexOfChild(u));const f=r.StringUtilities.isWhitespace(e),y=this.newProperty&&(h||p||!s&&!n||n&&f||o),C=this.section();if((e!==t.previousContent||c)&&!this.newProperty||y){let t;t=o?this.nameElement.textContent:f||this.newProperty&&r.StringUtilities.isWhitespace(this.valueElement.textContent||"")?"":n?e+": "+this.property.value:this.property.name+": "+e,await this.applyStyleText(t||"",!0),S.call(this,this.newProperty,!f,C)}else n?this.property.name=e:this.property.value=e,d||this.newProperty||this.updateTitle(),S.call(this,this.newProperty,!1,C);function S(e,t,i){if(s)if(u&&u.parent)u.startEditing(n?u.valueElement:u.nameElement);else{if(u&&!u.parent){const t=i.propertiesTreeOutline.rootElement();if("forward"===s&&f&&!n&&--g,g>=t.childCount()&&!this.newProperty)a=!0;else{const i=g>=0?t.childAt(g):null;if(i){let t=!n||h?i.nameElement:i.valueElement;return e&&f&&(t="forward"===s?i.nameElement:i.valueElement),void i.startEditing(t)}e||(l=!0)}}if(a){if(e&&!t&&n!==("backward"===s))return;i.addNewBlankProperty().startEditing()}else if(m){u=this.findSibling(s);const e=u||"backward"===s?i:i.nextEditableSibling();e&&(e.style().parentRule?e.startEditingSelector():e.moveEditorFromSelector(s))}else l&&(i.style().parentRule?i.startEditingSelector():i.moveEditorFromSelector(s))}else this.parentPaneInternal.resetFocus()}}removePrompt(){this.prompt&&(this.prompt.detach(),this.prompt=null)}styleTextAppliedForTest(){}applyStyleText(e,t,s){return this.applyStyleThrottler.schedule(this.innerApplyStyleText.bind(this,e,t,s))}async innerApplyStyleText(e,t,s){if(!this.treeOutline||!this.property)return;if(!this.style.range)return;const n=this.hasBeenEditedIncrementally;if(!(e=e.replace(/[\xA0\t]/g," ").trim()).length&&t&&this.newProperty&&!n)return void(this.parent&&this.parent.removeChild(this));const i=this.parentPaneInternal.node();this.parentPaneInternal.setUserOperation(!0),(e+=r.StringUtilities.findUnclosedCssQuote(e)).length&&!/;\s*$/.test(e)&&(e+=";");const o=!this.newProperty||n;let a=await this.property.setText(e,t,o);n&&t&&!a&&(t=!1,a=await this.property.setText(this.originalPropertyText,t,o)),this.parentPaneInternal.setUserOperation(!1);const l=s||this.style.propertyAt(this.property.index),d=this.property.index<this.style.allProperties().length;if(!a||!l&&d)return t&&(this.newProperty?this.treeOutline.removeChild(this):this.updateTitle()),void this.styleTextAppliedForTest();l&&(this.listItemElement.classList.toggle("changed",this.isPropertyChanged(l)),this.parentPane().updateChangeStatus()),this.matchedStylesInternal.resetActiveProperties(),this.hasBeenEditedIncrementally=!0;const c=t&&!e.length,h=this.section();c&&h?h.resetToolbars():!c&&l&&(this.property=l),i===this.node()&&this.updatePane(),this.styleTextAppliedForTest()}ondblclick(){return!0}isEventWithinDisclosureTriangle(e){return e.target===this.expandElement}}var es=Object.freeze({__proto__:null,activeHints:Gt,StylePropertyTreeElement:Zt});const ts={insertStyleRuleBelow:"Insert Style Rule Below",constructedStylesheet:"constructed stylesheet",userAgentStylesheet:"user agent stylesheet",injectedStylesheet:"injected stylesheet",viaInspector:"via inspector",styleAttribute:"`style` attribute",sattributesStyle:"{PH1}[Attributes Style]",showAllPropertiesSMore:"Show All Properties ({PH1} more)",copySelector:"Copy `selector`",copyRule:"Copy rule",copyAllDeclarations:"Copy all declarations",copyAllCSSChanges:"Copy all CSS changes",cssSelector:"`CSS` selector"},ss=o.i18n.registerUIStrings("panels/elements/StylePropertiesSection.ts",ts),ns=o.i18n.getLocalizedString.bind(void 0,ss);class is{parentPane;styleInternal;matchedStyles;computedStyles;parentsComputedStyles;editable;hoverTimer;willCauseCancelEditing;forceShowAll;originalPropertiesCount;element;innerElement;titleElement;propertiesTreeOutline;showAllButton;selectorElement;newStyleRuleToolbar;fontEditorToolbar;fontEditorSectionManager;fontEditorButton;selectedSinceMouseDown;elementToSelectorIndex;navigable;selectorRefElement;hoverableSelectorsMode;isHiddenInternal;queryListElement;nextEditorTriggerButtonIdx=1;sectionIdx=0;static#f=new WeakMap;constructor(e,i,o,a,l,d){this.parentPane=e,this.sectionIdx=a,this.styleInternal=o,this.matchedStyles=i,this.computedStyles=l,this.parentsComputedStyles=d,this.editable=Boolean(o.styleSheetId&&o.range),this.hoverTimer=null,this.willCauseCancelEditing=!1,this.forceShowAll=!1,this.originalPropertiesCount=o.leadingProperties().length;const c=o.parentRule;this.element=document.createElement("div"),this.element.classList.add("styles-section"),this.element.classList.add("matched-styles"),this.element.classList.add("monospace"),n.ARIAUtils.setLabel(this.element,`${this.headerText()}, css selector`),this.element.tabIndex=-1,n.ARIAUtils.markAsListitem(this.element),this.element.addEventListener("keydown",this.onKeyDown.bind(this),!1),e.sectionByElement.set(this.element,this),this.innerElement=this.element.createChild("div"),this.titleElement=this.innerElement.createChild("div","styles-section-title "+(c?"styles-selector":"")),this.propertiesTreeOutline=new n.TreeOutline.TreeOutlineInShadow,this.propertiesTreeOutline.setFocusable(!1),this.propertiesTreeOutline.registerCSSFiles([ke]),this.propertiesTreeOutline.element.classList.add("style-properties","matched-styles","monospace"),this.propertiesTreeOutline.section=this,this.innerElement.appendChild(this.propertiesTreeOutline.element),this.showAllButton=n.UIUtils.createTextButton("",this.showAllItems.bind(this),"styles-show-all"),this.innerElement.appendChild(this.showAllButton);const h=document.createElement("div");h.classList.add("selector-container"),this.selectorElement=document.createElement("span"),n.ARIAUtils.setLabel(this.selectorElement,ns(ts.cssSelector)),this.selectorElement.classList.add("selector"),this.selectorElement.textContent=this.headerText(),h.appendChild(this.selectorElement),this.selectorElement.addEventListener("mouseenter",this.onMouseEnterSelector.bind(this),!1),this.selectorElement.addEventListener("mouseleave",this.onMouseOutSelector.bind(this),!1);h.createChild("span","sidebar-pane-open-brace").textContent=" {";if(this.innerElement.createChild("div","sidebar-pane-closing-brace").textContent="}",this.styleInternal.parentRule){const e=new n.Toolbar.ToolbarButton(ns(ts.insertStyleRuleBelow),"plus");e.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.onNewRuleClick,this),e.element.tabIndex=-1,this.newStyleRuleToolbar||(this.newStyleRuleToolbar=new n.Toolbar.Toolbar("sidebar-pane-section-toolbar new-rule-toolbar",this.innerElement)),this.newStyleRuleToolbar.appendToolbarItem(e),n.ARIAUtils.markAsHidden(this.newStyleRuleToolbar.element)}if(t.Runtime.experiments.isEnabled("fontEditor")&&this.editable&&(this.fontEditorToolbar=new n.Toolbar.Toolbar("sidebar-pane-section-toolbar",this.innerElement),this.fontEditorSectionManager=new Se(this.parentPane.swatchPopoverHelper(),this),this.fontEditorButton=new n.Toolbar.ToolbarButton("Font Editor","custom-typography"),this.fontEditorButton.addEventListener(n.Toolbar.ToolbarButton.Events.Click,(()=>{this.onFontEditorButtonClicked()}),this),this.fontEditorButton.element.addEventListener("keydown",(e=>{r.KeyboardUtilities.isEnterOrSpaceKey(e)&&(e.consume(!0),this.onFontEditorButtonClicked())}),!1),this.fontEditorToolbar.appendToolbarItem(this.fontEditorButton),this.styleInternal.type===s.CSSStyleDeclaration.Type.Inline?this.newStyleRuleToolbar&&this.newStyleRuleToolbar.element.classList.add("shifted-toolbar"):this.fontEditorToolbar.element.classList.add("font-toolbar-hidden")),this.selectorElement.addEventListener("click",this.handleSelectorClick.bind(this),!1),this.element.addEventListener("contextmenu",this.handleContextMenuEvent.bind(this),!1),this.element.addEventListener("mousedown",this.handleEmptySpaceMouseDown.bind(this),!1),this.element.addEventListener("click",this.handleEmptySpaceClick.bind(this),!1),this.element.addEventListener("mousemove",this.onMouseMove.bind(this),!1),this.element.addEventListener("mouseleave",this.onMouseLeave.bind(this),!1),this.selectedSinceMouseDown=!1,this.elementToSelectorIndex=new WeakMap,c)if(c.isUserAgent()||c.isInjected())this.editable=!1;else if(c.styleSheetId){const e=c.cssModel().styleSheetHeaderForId(c.styleSheetId);this.navigable=e&&!e.isAnonymousInlineStyleSheet()}this.queryListElement=this.titleElement.createChild("div","query-list query-matches"),this.selectorRefElement=this.titleElement.createChild("div","styles-section-subtitle"),this.updateQueryList(),this.updateRuleOrigin(),this.titleElement.appendChild(h),this.navigable&&this.element.classList.add("navigable"),this.editable||(this.element.classList.add("read-only"),this.propertiesTreeOutline.element.classList.add("read-only")),this.hoverableSelectorsMode=!1,this.isHiddenInternal=!1,this.markSelectorMatches(),this.onpopulate()}setComputedStyles(e){this.computedStyles=e}setParentsComputedStyles(e){this.parentsComputedStyles=e}updateAuthoringHint(){let e=this.propertiesTreeOutline.firstChild();for(;e;)e instanceof Zt&&(e.setComputedStyles(this.computedStyles),e.setParentsComputedStyles(this.parentsComputedStyles),e.updateAuthoringHint()),e=e.nextSibling}setSectionIdx(e){this.sectionIdx=e,this.onpopulate()}getSectionIdx(){return this.sectionIdx}registerFontProperty(e){this.fontEditorSectionManager&&this.fontEditorSectionManager.registerFontProperty(e),this.fontEditorToolbar&&(this.fontEditorToolbar.element.classList.remove("font-toolbar-hidden"),this.newStyleRuleToolbar&&this.newStyleRuleToolbar.element.classList.add("shifted-toolbar"))}resetToolbars(){this.parentPane.swatchPopoverHelper().isShowing()||this.styleInternal.type===s.CSSStyleDeclaration.Type.Inline||(this.fontEditorToolbar&&this.fontEditorToolbar.element.classList.add("font-toolbar-hidden"),this.newStyleRuleToolbar&&this.newStyleRuleToolbar.element.classList.remove("shifted-toolbar"))}static createRuleOriginNode(e,t,s){if(!s)return document.createTextNode("");const n=this.getRuleLocationFromCSSRule(s),i=s.styleSheetId?e.cssModel().styleSheetHeaderForId(s.styleSheetId):null;function o(){return s&&n&&s.styleSheetId&&i&&!i.isAnonymousInlineStyleSheet()?is.linkifyRuleLocation(e.cssModel(),t,s.styleSheetId,n):null}function r(e){if(i?.ownerNode){const t=Me(i.ownerNode,{preventKeyboardFocus:!1,tooltip:void 0});return t.textContent=e,t}return null}if(i?.isMutable&&!i.isViaInspector()){const e=i.isConstructedByNew()?null:o();if(e)return e;const t=i.isConstructedByNew()?ns(ts.constructedStylesheet):"<style>",s=r(t);return s||document.createTextNode(t)}const a=o();if(a)return a;if(s.isUserAgent())return document.createTextNode(ns(ts.userAgentStylesheet));if(s.isInjected())return document.createTextNode(ns(ts.injectedStylesheet));if(s.isViaInspector())return document.createTextNode(ns(ts.viaInspector));const l=r("<style>");return l||document.createTextNode("")}static getRuleLocationFromCSSRule(e){let t;return e instanceof s.CSSRule.CSSStyleRule?t=e.style.range:e instanceof s.CSSRule.CSSKeyframeRule&&(t=e.key().range),t}static tryNavigateToRuleLocation(e,t){if(!t)return;const s=this.getRuleLocationFromCSSRule(t),n=t.styleSheetId?e.cssModel().styleSheetHeaderForId(t.styleSheetId):null;if(s&&t.styleSheetId&&n&&!n.isAnonymousInlineStyleSheet()){const n=this.getCSSSelectorLocation(e.cssModel(),t.styleSheetId,s);this.revealSelectorSource(n,!0)}}static linkifyRuleLocation(e,t,s,n){const i=this.getCSSSelectorLocation(e,s,n);return t.linkifyCSSLocation(i)}static getCSSSelectorLocation(e,t,n){const i=e.styleSheetHeaderForId(t),o=i.lineNumberInSource(n.startLine),r=i.columnNumberInSource(n.startLine,n.startColumn);return new s.CSSModel.CSSLocation(i,o,r)}getFocused(){return this.propertiesTreeOutline.shadowRoot.activeElement||null}focusNext(e){const t=this.getFocused();t&&(t.tabIndex=-1),e.focus(),this.propertiesTreeOutline.shadowRoot.contains(e)&&(e.tabIndex=0)}ruleNavigation(e){if(e.altKey||e.ctrlKey||e.metaKey||e.shiftKey)return;const t=this.getFocused();let s=null;const n=Array.from(this.propertiesTreeOutline.shadowRoot.querySelectorAll("[tabindex]"));if(0===n.length)return;const i=t?n.indexOf(t):-1;if("ArrowLeft"===e.key)s=n[i-1]||this.element;else if("ArrowRight"===e.key)s=n[i+1]||this.element;else if("ArrowUp"===e.key||"ArrowDown"===e.key)return void this.focusNext(this.element);s&&(this.focusNext(s),e.consume(!0))}onKeyDown(e){const t=e;if(!(n.UIUtils.isEditing()||!this.editable||t.altKey||t.ctrlKey||t.metaKey))switch(t.key){case"Enter":case" ":this.startEditingAtFirstPosition(),t.consume(!0);break;case"ArrowLeft":case"ArrowRight":case"ArrowUp":case"ArrowDown":this.ruleNavigation(t);break;default:1===t.key.length&&this.addNewBlankProperty(0).startEditing()}}setSectionHovered(e){this.element.classList.toggle("styles-panel-hovered",e),this.propertiesTreeOutline.element.classList.toggle("styles-panel-hovered",e),this.hoverableSelectorsMode!==e&&(this.hoverableSelectorsMode=e,this.markSelectorMatches())}onMouseLeave(e){this.setSectionHovered(!1),this.parentPane.setActiveProperty(null)}onMouseMove(e){const t=n.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(e);this.setSectionHovered(t);const s=this.propertiesTreeOutline.treeElementFromEvent(e);s instanceof Zt?this.parentPane.setActiveProperty(s):this.parentPane.setActiveProperty(null);const i=this.element.getComponentSelection();!this.selectedSinceMouseDown&&i&&i.toString()&&(this.selectedSinceMouseDown=!0)}onFontEditorButtonClicked(){this.fontEditorSectionManager&&this.fontEditorButton&&this.fontEditorSectionManager.showPopover(this.fontEditorButton.element,this.parentPane)}style(){return this.styleInternal}headerText(){const e=this.matchedStyles.nodeForStyle(this.styleInternal);return this.styleInternal.type===s.CSSStyleDeclaration.Type.Inline?this.matchedStyles.isInherited(this.styleInternal)?ns(ts.styleAttribute):"element.style":e&&this.styleInternal.type===s.CSSStyleDeclaration.Type.Attributes?ns(ts.sattributesStyle,{PH1:e.nodeNameInCorrectCase()}):this.styleInternal.parentRule instanceof s.CSSRule.CSSStyleRule?this.styleInternal.parentRule.selectorText():""}onMouseOutSelector(){this.hoverTimer&&clearTimeout(this.hoverTimer),s.OverlayModel.OverlayModel.hideDOMNodeHighlight()}onMouseEnterSelector(){this.hoverTimer&&clearTimeout(this.hoverTimer),this.hoverTimer=window.setTimeout(this.highlight.bind(this),300)}highlight(e="all"){s.OverlayModel.OverlayModel.hideDOMNodeHighlight();const t=this.parentPane.node();if(!t)return;const n=this.styleInternal.parentRule&&this.styleInternal.parentRule instanceof s.CSSRule.CSSStyleRule?this.styleInternal.parentRule.selectorText():void 0;t.domModel().overlayModel().highlightInOverlay({node:t,selectorList:n},e)}firstSibling(){const e=this.element.parentElement;if(!e)return null;let t=e.firstChild;for(;t;){const e=this.parentPane.sectionByElement.get(t);if(e)return e;t=t.nextSibling}return null}findCurrentOrNextVisible(e,t){if(!this.isHidden())return this;if(this===t)return null;t||(t=this);let s=null;const n=e?this.nextSibling():this.previousSibling();if(n)s=n.findCurrentOrNextVisible(e,t);else{const n=e?this.firstSibling():this.lastSibling();n&&(s=n.findCurrentOrNextVisible(e,t))}return s}lastSibling(){const e=this.element.parentElement;if(!e)return null;let t=e.lastChild;for(;t;){const e=this.parentPane.sectionByElement.get(t);if(e)return e;t=t.previousSibling}return null}nextSibling(){let e=this.element;do{e=e.nextSibling}while(e&&!this.parentPane.sectionByElement.has(e));if(e)return this.parentPane.sectionByElement.get(e)}previousSibling(){let e=this.element;do{e=e.previousSibling}while(e&&!this.parentPane.sectionByElement.has(e));if(e)return this.parentPane.sectionByElement.get(e)}onNewRuleClick(e){e.data.consume();const t=this.styleInternal.parentRule;if(!t||!t.style.range||void 0===t.styleSheetId)return;const s=f.TextRange.TextRange.createFromLocation(t.style.range.endLine,t.style.range.endColumn+1);this.parentPane.addBlankSection(this,t.styleSheetId,s)}styleSheetEdited(e){const t=this.styleInternal.parentRule;t?t.rebase(e):this.styleInternal.rebase(e),this.updateQueryList(),this.updateRuleOrigin()}createAtRuleLists(e){this.createMediaList(e.media),this.createContainerQueryList(e.containerQueries),this.createScopesList(e.scopes),this.createSupportsList(e.supports)}createMediaList(e){for(let t=e.length-1;t>=0;--t){const n=e[t];if(!n.text||!n.text.includes("(")&&"print"!==n.text)continue;let i,o="",r="";switch(n.source){case s.CSSMedia.Source.LINKED_SHEET:case s.CSSMedia.Source.INLINE_SHEET:r=`media="${n.text}"`;break;case s.CSSMedia.Source.MEDIA_RULE:o="@media",r=n.text,n.styleSheetId&&(i=this.handleQueryRuleClick.bind(this,n));break;case s.CSSMedia.Source.IMPORT_RULE:r=`@import ${n.text}`}const a=new h.CSSQuery.CSSQuery;a.data={queryPrefix:o,queryText:r,onQueryTextClick:i},this.queryListElement.append(a)}}createContainerQueryList(e){for(let t=e.length-1;t>=0;--t){const s=e[t];if(!s.text)continue;let n;s.styleSheetId&&(n=this.handleQueryRuleClick.bind(this,s));const i=new h.CSSQuery.CSSQuery;i.data={queryPrefix:"@container",queryName:s.name,queryText:s.text,onQueryTextClick:n},this.queryListElement.append(i),this.addContainerForContainerQuery(s)}}createScopesList(e){for(let t=e.length-1;t>=0;--t){const s=e[t];if(!s.text)continue;let n;s.styleSheetId&&(n=this.handleQueryRuleClick.bind(this,s));const i=new h.CSSQuery.CSSQuery;i.data={queryPrefix:"@scope",queryText:s.text,onQueryTextClick:n},this.queryListElement.append(i)}}createSupportsList(e){for(let t=e.length-1;t>=0;--t){const s=e[t];if(!s.text)continue;let n;s.styleSheetId&&(n=this.handleQueryRuleClick.bind(this,s));const i=new h.CSSQuery.CSSQuery;i.data={queryPrefix:"@supports",queryText:s.text,onQueryTextClick:n},this.queryListElement.append(i)}}async addContainerForContainerQuery(e){const t=await e.getContainerForNode(this.matchedStyles.node().id);if(!t)return;const s=new h.QueryContainer.QueryContainer;s.data={container:h.Helper.legacyNodeToElementsComponentsNode(t.containerNode),queryName:e.name,onContainerLinkClick:e=>{e.preventDefault(),eo.instance().revealAndSelectNode(t.containerNode,!0,!0),t.containerNode.scrollIntoView()}},s.addEventListener("queriedsizerequested",(async()=>{const e=await t.getContainerSizeDetails();e&&s.updateContainerQueriedSizeDetails(e)})),this.queryListElement.prepend(s)}updateQueryList(){this.queryListElement.removeChildren(),this.styleInternal.parentRule&&this.styleInternal.parentRule instanceof s.CSSRule.CSSStyleRule&&this.createAtRuleLists(this.styleInternal.parentRule)}isPropertyInherited(e){return!!this.matchedStyles.isInherited(this.styleInternal)&&!s.CSSMetadata.cssMetadata().isPropertyInherited(e)}nextEditableSibling(){let e=this;do{e=e.nextSibling()}while(e&&!e.editable);if(!e)for(e=this.firstSibling();e&&!e.editable;)e=e.nextSibling();return e&&e.editable?e:null}previousEditableSibling(){let e=this;do{e=e.previousSibling()}while(e&&!e.editable);if(!e)for(e=this.lastSibling();e&&!e.editable;)e=e.previousSibling();return e&&e.editable?e:null}refreshUpdate(e){this.parentPane.refreshUpdate(this,e)}updateVarFunctions(e){let t=this.propertiesTreeOutline.firstChild();for(;t;)t!==e&&t instanceof Zt&&t.updateTitleIfComputedValueChanged(),t=t.traverseNextTreeElement(!1,null,!0)}update(e){if(this.selectorElement.textContent=this.headerText(),this.markSelectorMatches(),e)this.onpopulate();else{let e=this.propertiesTreeOutline.firstChild();for(;e&&e instanceof Zt;)e.setOverloaded(this.isPropertyOverloaded(e.property)),e=e.traverseNextTreeElement(!1,null,!0)}}showAllItems(e){e&&e.consume(),this.forceShowAll||(this.forceShowAll=!0,this.onpopulate())}onpopulate(){this.parentPane.setActiveProperty(null),this.nextEditorTriggerButtonIdx=1,this.propertiesTreeOutline.removeChildren();const e=this.styleInternal;let t=0;const s=e.leadingProperties(),n=is.MaxProperties+s.length-this.originalPropertiesCount;for(const i of s){if(!this.forceShowAll&&t>=n)break;t++;const s=i.getLonghandProperties().length>0,o=this.isPropertyInherited(i.name),r=this.isPropertyOverloaded(i);if(e.parentRule&&e.parentRule.isUserAgent()&&o)continue;const a=new Zt(this.parentPane,this.matchedStyles,i,s,o,r,!1);a.setComputedStyles(this.computedStyles),a.setParentsComputedStyles(this.parentsComputedStyles),this.propertiesTreeOutline.appendChild(a)}t<s.length?(this.showAllButton.classList.remove("hidden"),this.showAllButton.textContent=ns(ts.showAllPropertiesSMore,{PH1:s.length-t})):this.showAllButton.classList.add("hidden")}isPropertyOverloaded(e){return this.matchedStyles.propertyState(e)===s.CSSMatchedStyles.PropertyState.Overloaded}updateFilter(){let e=!1;this.showAllItems();for(const t of this.propertiesTreeOutline.rootElement().children())if(t instanceof Zt){const s=t.updateFilter();e=e||s}const t=this.parentPane.filterRegex(),s=!e&&null!==t&&!t.test(this.element.deepTextContent());return this.isHiddenInternal=s,this.element.classList.toggle("hidden",s),!s&&this.styleInternal.parentRule&&this.markSelectorHighlights(),!s}isHidden(){return this.isHiddenInternal}markSelectorMatches(){const e=this.styleInternal.parentRule;if(!(e&&e instanceof s.CSSRule.CSSStyleRule))return;this.queryListElement.classList.toggle("query-matches",this.matchedStyles.queryMatches(this.styleInternal));const t=this.matchedStyles.getMatchingSelectors(e),n=new Array(e.selectors.length).fill(!1);for(const e of t)n[e]=!0;if(this.parentPane.isEditingStyle)return;const i=is.renderSelectors(e.selectors,n,this.elementToSelectorIndex,e.nestingSelectors);this.selectorElement.removeChildren(),this.selectorElement.appendChild(i),this.markSelectorHighlights()}static getSpecificityStoredForNodeElement(e){return is.#f.get(e)}static renderSelectors(e,t,s,i){const o=document.createDocumentFragment();let r=!1;for(const[a,l]of e.entries()){a&&n.UIUtils.createTextChild(o,", ");const d=document.createElement("span");if(d.classList.add("simple-selector"),d.classList.toggle("selector-matches",t[a]),l.specificity&&is.#f.set(d,l.specificity),s.set(d,a),i&&l.text.includes("&")){r=!0;const e=l.text.split("&");for(const[t,s]of e.entries())s&&d.append(s),t<e.length-1&&d.append(this.createNestingSymbol(i))}else d.textContent=e[a].text;o.append(d)}if(i&&!r){const e=this.createNestingSymbol(i);e.classList.add("implicit"),o.prepend(e," ")}return o}static createNestingSymbol(e){const t=document.createElement("span");t.textContent="&",t.classList.add("nesting-symbol");const s=e.reverse().map((e=>e.includes(",")?`:is(${e})`:e)).join(" ");return t.dataset.nestingSelectors=s,t}markSelectorHighlights(){const e=this.selectorElement.getElementsByClassName("simple-selector"),t=this.parentPane.filterRegex();for(let s=0;s<e.length;++s){const n=null!==t&&t.test(e[s].textContent||"");e[s].classList.toggle("filter-match",n)}}addNewBlankProperty(e=this.propertiesTreeOutline.rootElement().childCount()){const t=this.styleInternal.newBlankProperty(e),s=new Zt(this.parentPane,this.matchedStyles,t,!1,!1,!1,!0);return this.propertiesTreeOutline.insertChild(s,t.index),s}handleEmptySpaceMouseDown(){this.willCauseCancelEditing=this.parentPane.isEditingStyle,this.selectedSinceMouseDown=!1}handleEmptySpaceClick(e){if(!this.editable||this.element.hasSelection()||this.willCauseCancelEditing||this.selectedSinceMouseDown)return;const t=e.target;if(t.classList.contains("header")||this.element.classList.contains("read-only")||t.enclosingNodeOrSelfWithClass("query"))return void e.consume();const s=n.UIUtils.deepElementFromEvent(e),i=s&&n.TreeOutline.TreeElement.getTreeElementBylistItemNode(s);i&&i instanceof Zt?this.addNewBlankProperty(i.property.index+1).startEditing():t.classList.contains("selector-container")||t.classList.contains("styles-section-subtitle")?this.addNewBlankProperty(0).startEditing():this.addNewBlankProperty().startEditing(),e.consume(!0)}handleQueryRuleClick(t,s){const i=s.currentTarget;if(n.UIUtils.isBeingEdited(i))return;if(n.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(s)&&this.navigable){const n=t.rawLocation();if(!n)return void s.consume(!0);const i=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().rawLocationToUILocation(n);return i&&e.Revealer.reveal(i),void s.consume(!0)}if(!this.editable)return;const o=new n.InplaceEditor.Config(this.editingMediaCommitted.bind(this,t),this.editingMediaCancelled.bind(this,i),void 0,this.editingMediaBlurHandler.bind(this));n.InplaceEditor.InplaceEditor.startEditing(i,o);const r=i.getComponentSelection();r&&r.selectAllChildren(i),this.parentPane.setEditingStyle(!0);i.enclosingNodeOrSelfWithClass("query").classList.add("editing-query"),s.consume(!0)}editingMediaFinished(e){this.parentPane.setEditingStyle(!1);e.enclosingNodeOrSelfWithClass("query").classList.remove("editing-query")}editingMediaCancelled(e){this.editingMediaFinished(e),this.markSelectorMatches();const t=e.getComponentSelection();t&&t.collapse(e,0)}editingMediaBlurHandler(){return!0}async editingMediaCommitted(e,t,n,i,o,r){this.parentPane.setEditingStyle(!1),this.editingMediaFinished(t),n&&(n=n.trim()),this.parentPane.setUserOperation(!0);const a=this.parentPane.cssModel();if(a&&e.styleSheetId){const t=e.range;let i=!1;i=e instanceof s.CSSContainerQuery.CSSContainerQuery?await a.setContainerQueryText(e.styleSheetId,t,n):e instanceof s.CSSSupports.CSSSupports?await a.setSupportsText(e.styleSheetId,t,n):e instanceof s.CSSScope.CSSScope?await a.setScopeText(e.styleSheetId,t,n):await a.setMediaText(e.styleSheetId,t,n),i&&(this.matchedStyles.resetActiveProperties(),this.parentPane.refreshUpdate(this)),this.parentPane.setUserOperation(!1),this.editingMediaTextCommittedForTest()}}editingMediaTextCommittedForTest(){}handleSelectorClick(e){const t=e.target;if(t){if(n.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(e)&&this.navigable&&t.classList.contains("simple-selector")){const s=this.elementToSelectorIndex.get(t);return s&&this.navigateToSelectorSource(s,!0),void e.consume(!0)}this.element.hasSelection()||(this.startEditingAtFirstPosition(),e.consume(!0))}}handleContextMenuEvent(e){if(!e.target)return;const t=new n.ContextMenu.ContextMenu(e);t.clipboardSection().appendItem(ns(ts.copySelector),(()=>{const e=this.headerText();i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.SelectorViaContextMenu)})),t.clipboardSection().appendItem(ns(ts.copyRule),(()=>{const e=ot.formatLeadingProperties(this).ruleText;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.RuleViaContextMenu)})),t.clipboardSection().appendItem(ns(ts.copyAllDeclarations),(()=>{const e=ot.formatLeadingProperties(this).allDeclarationText;i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllDeclarationsViaContextMenu)})),t.clipboardSection().appendItem(ns(ts.copyAllCSSChanges),(async()=>{const e=await this.parentPane.getFormattedChanges();i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(e),i.userMetrics.styleTextCopied(i.UserMetrics.StyleTextCopied.AllChangesViaStylesPane)})),t.show()}navigateToSelectorSource(e,t){const n=this.parentPane.cssModel();if(!n)return;const i=this.styleInternal.parentRule;if(!i||void 0===i.styleSheetId)return;const o=n.styleSheetHeaderForId(i.styleSheetId);if(!o)return;const r=new s.CSSModel.CSSLocation(o,i.lineNumberInSource(e),i.columnNumberInSource(e));is.revealSelectorSource(r,t)}static revealSelectorSource(t,s){const n=g.CSSWorkspaceBinding.CSSWorkspaceBinding.instance().rawLocationToUILocation(t);n&&e.Revealer.reveal(n,!s)}startEditingAtFirstPosition(){this.editable&&(this.styleInternal.parentRule?this.startEditingSelector():this.moveEditorFromSelector("forward"))}startEditingSelector(){const e=this.selectorElement;if(n.UIUtils.isBeingEdited(e))return;e.scrollIntoViewIfNeeded(!1);const t=e.textContent;null!==t&&(e.textContent=t.replace(/\s+/g," ").trim());const s=new n.InplaceEditor.Config(this.editingSelectorCommitted.bind(this),this.editingSelectorCancelled.bind(this));n.InplaceEditor.InplaceEditor.startEditing(this.selectorElement,s);const i=e.getComponentSelection();i&&i.selectAllChildren(e),this.parentPane.setEditingStyle(!0),e.classList.contains("simple-selector")&&this.navigateToSelectorSource(0,!1)}moveEditorFromSelector(e){if(this.markSelectorMatches(),e)if("forward"===e){let e=this.propertiesTreeOutline.firstChild();for(;e&&e.inherited();){const t=e.nextSibling;e=t instanceof Zt?t:null}e?e.startEditing(e.nameElement):this.addNewBlankProperty().startEditing()}else{const e=this.previousEditableSibling();if(!e)return;e.addNewBlankProperty().startEditing()}}editingSelectorCommitted(e,t,s,n,i){if(this.editingSelectorEnded(),t&&(t=t.trim()),t===s)return this.selectorElement.textContent=t,void this.moveEditorFromSelector(i);const o=this.styleInternal.parentRule;o&&(this.parentPane.setUserOperation(!0),this.setHeaderText(o,t).then(function(){this.parentPane.setUserOperation(!1),this.moveEditorFromSelector(i),this.editingSelectorCommittedForTest()}.bind(this)))}setHeaderText(e,t){function n(e){const t=this.matchedStyles.getMatchingSelectors(e).length>0;this.propertiesTreeOutline.element.classList.toggle("no-affect",!t),this.matchedStyles.resetActiveProperties(),this.parentPane.refreshUpdate(this)}if(!(e instanceof s.CSSRule.CSSStyleRule))return Promise.resolve();const i=e.selectorRange();return i?e.setSelectorText(t).then(function(e,t){return t?this.matchedStyles.recomputeMatchingSelectors(e).then(n.bind(this,e)):Promise.resolve()}.bind(this,e,Boolean(i))):Promise.resolve()}editingSelectorCommittedForTest(){}updateRuleOrigin(){this.selectorRefElement.removeChildren(),this.selectorRefElement.appendChild(is.createRuleOriginNode(this.matchedStyles,this.parentPane.linkifier,this.styleInternal.parentRule))}editingSelectorEnded(){this.parentPane.setEditingStyle(!1)}editingSelectorCancelled(){this.editingSelectorEnded(),this.markSelectorMatches()}closestPropertyForEditing(e){const t=this.propertiesTreeOutline.rootElement();return e>=t.childCount()?t.lastChild():t.childAt(e)}static MaxProperties=50}class os extends is{normal;ruleLocation;styleSheetId;constructor(e,t,n,i,o,r,a){const l=e.cssModel();super(e,t,s.CSSRule.CSSStyleRule.createDummyRule(l,n).style,a,null,null),this.normal=!1,this.ruleLocation=o,this.styleSheetId=i,this.selectorRefElement.removeChildren(),this.selectorRefElement.appendChild(is.linkifyRuleLocation(l,this.parentPane.linkifier,i,this.actualRuleLocation())),r&&r.parentRule&&r.parentRule instanceof s.CSSRule.CSSStyleRule&&this.createAtRuleLists(r.parentRule),this.element.classList.add("blank-section")}actualRuleLocation(){const e=this.rulePrefix().split("\n"),t=e[e.length-1],s=new f.TextRange.TextRange(0,0,e.length-1,t?t.length:0);return this.ruleLocation.rebaseAfterTextEdit(f.TextRange.TextRange.createFromLocation(0,0),s)}rulePrefix(){return 0===this.ruleLocation.startLine&&0===this.ruleLocation.startColumn?"":"\n\n"}get isBlank(){return!this.normal}editingSelectorCommitted(e,t,s,n,i){if(!this.isBlank)return void super.editingSelectorCommitted(e,t,s,n,i);function o(e){const t=this.matchedStyles.getMatchingSelectors(e).length>0;this.makeNormal(e),t||this.propertiesTreeOutline.element.classList.add("no-affect"),this.updateRuleOrigin(),this.parentPane.setUserOperation(!1),this.editingSelectorEnded(),this.element.parentElement&&this.moveEditorFromSelector(i),this.markSelectorMatches(),this.editingSelectorCommittedForTest()}t&&(t=t.trim()),this.parentPane.setUserOperation(!0);const r=this.parentPane.cssModel(),a=this.rulePrefix()+t+" {}";r&&r.addRule(this.styleSheetId,a,this.ruleLocation).then(function(e){return e?this.matchedStyles.addNewRule(e,this.matchedStyles.node()).then(o.bind(this,e)):(this.editingSelectorCancelled(),this.editingSelectorCommittedForTest(),Promise.resolve())}.bind(this))}editingSelectorCancelled(){this.parentPane.setUserOperation(!1),this.isBlank?(this.editingSelectorEnded(),this.parentPane.removeSection(this)):super.editingSelectorCancelled()}makeNormal(e){this.element.classList.remove("blank-section"),this.styleInternal=e.style,this.normal=!0}}class rs extends is{constructor(e,t,s,n){super(e,t,s,n,null,null),this.selectorElement.className="keyframe-key"}headerText(){return this.styleInternal.parentRule instanceof s.CSSRule.CSSKeyframeRule?this.styleInternal.parentRule.key().text:""}setHeaderText(e,t){if(!(e instanceof s.CSSRule.CSSKeyframeRule))return Promise.resolve();return e.key().range?e.setKeyText(t).then(function(e){e&&this.parentPane.refreshUpdate(this)}.bind(this)):Promise.resolve()}isPropertyInherited(e){return!1}isPropertyOverloaded(e){return!1}markSelectorHighlights(){}markSelectorMatches(){this.styleInternal.parentRule instanceof s.CSSRule.CSSKeyframeRule&&(this.selectorElement.textContent=this.styleInternal.parentRule.key().text)}highlight(){}}class as extends is{constructor(e,t,s,n,i,o){super(e,t,s,n,i,o),this.selectorElement.className="try-rule-selector-element",this.selectorElement.addEventListener("click",(e=>e.stopPropagation()),!0)}headerText(){return"@try"}}class ls extends is{isPropertyInherited(e){return!1}}var ds=Object.freeze({__proto__:null,StylePropertiesSection:is,BlankStylePropertiesSection:os,KeyframePropertiesSection:rs,TryRuleSection:as,HighlightPseudoStylePropertiesSection:ls});const cs={filter:"Filter",filterComputedStyles:"Filter Computed Styles",showAll:"Show all",group:"Group",noMatchingProperty:"No matching property",navigateToSelectorSource:"Navigate to selector source",navigateToStyle:"Navigate to style"},hs=o.i18n.registerUIStrings("panels/elements/ComputedStyleWidget.ts",cs),us=o.i18n.getLocalizedString.bind(void 0,hs),ps=new Map;const ms=(e,t,s,n,i,o,r)=>{const{name:a,value:l}=function(e,t,s){const n=t+":"+s,i=ps.get(n);if(i)return i;const o=new pt(null,e,t,s);o.setColorHandler(gs);const r=o.renderName();r.slot="name";const a=o.renderValue();return a.slot="value",ps.set(n,{name:r,value:a}),{name:r,value:a}}(e,t,s);return u.html`<${h.ComputedStyleProperty.ComputedStyleProperty.litTagName} .traceable="${n}" .inherited="${i}" @oncontextmenu="${r}" @onnavigatetosource="${e=>{o&&fs(o,e)}}"> ${a} ${l} </${h.ComputedStyleProperty.ComputedStyleProperty.litTagName}>`},gs=e=>{const t=new p.ColorSwatch.ColorSwatch;t.renderColor(e,!0);const s=document.createElement("span");return s.textContent=t.getText(),t.append(s),t.addEventListener(p.ColorSwatch.ColorChangedEvent.eventName,(e=>{const{data:t}=e;s.textContent=t.text})),t},fs=(t,s)=>{s&&(e.Revealer.reveal(t),s.consume(!0))},ys=(e,t)=>{if(e.startsWith("--")!==t.startsWith("--"))return e.startsWith("--")?1:-1;if(e.startsWith("-webkit")!==t.startsWith("-webkit"))return e.startsWith("-webkit")?1:-1;const n=s.CSSMetadata.cssMetadata().canonicalPropertyName(e),i=s.CSSMetadata.cssMetadata().canonicalPropertyName(t);return r.StringUtilities.compare(n,i)};class Cs extends n.ThrottledWidget.ThrottledWidget{computedStyleModel;showInheritedComputedStylePropertiesSetting;groupComputedStylesSetting;input;filterRegex;noMatchesElement;linkifier;imagePreviewPopover;#y=new c.TreeOutline.TreeOutline;#C;constructor(){super(!0),this.contentElement.classList.add("styles-sidebar-computed-style-widget"),this.computedStyleModel=new X,this.computedStyleModel.addEventListener("ComputedStyleChanged",this.update,this),this.showInheritedComputedStylePropertiesSetting=e.Settings.Settings.instance().createSetting("showInheritedComputedStyleProperties",!1),this.showInheritedComputedStylePropertiesSetting.addChangeListener(this.update.bind(this)),this.groupComputedStylesSetting=e.Settings.Settings.instance().createSetting("groupComputedStyles",!1),this.groupComputedStylesSetting.addChangeListener((()=>{this.update()}));const t=this.contentElement.createChild("div","hbox styles-sidebar-pane-toolbar"),s=t.createChild("div","styles-sidebar-pane-filter-box"),i=ot.createPropertyFilterElement(us(cs.filter),t,this.filterComputedStyles.bind(this));n.ARIAUtils.setLabel(i,us(cs.filterComputedStyles)),s.appendChild(i),this.input=i,this.filterRegex=null;const o=new n.Toolbar.Toolbar("styles-pane-toolbar",t);o.appendToolbarItem(new n.Toolbar.ToolbarSettingCheckbox(this.showInheritedComputedStylePropertiesSetting,void 0,us(cs.showAll))),o.appendToolbarItem(new n.Toolbar.ToolbarSettingCheckbox(this.groupComputedStylesSetting,void 0,us(cs.group))),this.noMatchesElement=this.contentElement.createChild("div","gray-info-message"),this.noMatchesElement.textContent=us(cs.noMatchingProperty),this.contentElement.appendChild(this.#y),this.linkifier=new m.Linkifier.Linkifier(Ss),this.imagePreviewPopover=new ee(this.contentElement,(e=>{const t=e.composedPath()[0];return t instanceof Element?t:null}),(()=>this.computedStyleModel.node()));new re(this.computedStyleModel).show(this.contentElement),e.Settings.Settings.instance().moduleSetting("colorFormat").addChangeListener(this.update.bind(this))}onResize(){const e=this.contentElement.offsetWidth<260;this.#y.classList.toggle("computed-narrow",e)}wasShown(){super.wasShown(),this.registerCSSFiles([Q])}async doUpdate(){const[e,t]=await Promise.all([this.computedStyleModel.fetchComputedStyle(),this.fetchMatchedCascade()]);if(!e||!t)return void this.noMatchesElement.classList.remove("hidden");this.groupComputedStylesSetting.get()?await this.rebuildGroupedList(e,t):await this.rebuildAlphabeticalList(e,t)}async fetchMatchedCascade(){const e=this.computedStyleModel.node();if(!e||!this.computedStyleModel.cssModel())return null;const t=this.computedStyleModel.cssModel();return t?t.cachedMatchedCascadeForNode(e).then(function(e){return e&&e.node()===this.computedStyleModel.node()?e:null}.bind(this)):null}async rebuildAlphabeticalList(e,t){this.imagePreviewPopover.hide(),this.linkifier.reset();if(!this.computedStyleModel.cssModel())return;const n=[...e.computedStyle.keys()];n.sort(ys);const i=e.node,o=this.computePropertyTraces(t),r=this.computeNonInheritedProperties(t),a=this.showInheritedComputedStylePropertiesSetting.get(),l=[];for(const t of n){const n=e.computedStyle.get(t)||"",i=s.CSSMetadata.cssMetadata().canonicalPropertyName(t),d=!r.has(i);(a||!d||bs.has(t))&&(!a&&t.startsWith("--")||t!==i&&n===e.computedStyle.get(i)||l.push(this.buildTreeNode(o,t,n,d)))}const d=this.createTreeNodeRenderer(o,i,t);this.#C={tree:l,compact:!0,defaultRenderer:d},this.filterAlphabeticalList()}async rebuildGroupedList(e,t){this.imagePreviewPopover.hide(),this.linkifier.reset();const n=this.computedStyleModel.cssModel();if(!e||!t||!n)return void this.noMatchesElement.classList.remove("hidden");const i=e.node,o=this.computePropertyTraces(t),r=this.computeNonInheritedProperties(t),a=this.showInheritedComputedStylePropertiesSetting.get(),l=new Map,d=[];for(const[t,n]of e.computedStyle){const i=s.CSSMetadata.cssMetadata().canonicalPropertyName(t),o=!r.has(i);if(!a&&o&&!bs.has(t))continue;if(!a&&t.startsWith("--"))continue;if(t!==i&&n===e.computedStyle.get(i))continue;const d=ue(t);for(const e of d)l.has(e)||l.set(e,[]),l.get(e)?.push(t)}this.#y.removeChildren();for(const t of le){const n=l.get(t);if(n&&n.length>0){const i=[];for(const t of n){const n=e.computedStyle.get(t)||"",a=s.CSSMetadata.cssMetadata().canonicalPropertyName(t),l=!r.has(a);i.push(this.buildTreeNode(o,t,n,l))}d.push({id:t,treeNodeData:{tag:"category",name:t},children:async()=>i})}}const c=this.createTreeNodeRenderer(o,i,t);return this.#C={tree:d,compact:!0,defaultRenderer:c},this.filterGroupLists()}buildTraceNode(e){const t=e.ownerStyle.parentRule;return{treeNodeData:{tag:"traceElement",property:e,rule:t},id:t.origin+": "+t.styleSheetId+(e.range||e.name)}}createTreeNodeRenderer(e,t,n){return i=>{const o=i.treeNodeData;if("property"===o.tag){const i=e.get(o.propertyName)?.find((e=>n.propertyState(e)===s.CSSMatchedStyles.PropertyState.Active));return ms(t,o.propertyName,o.propertyValue,e.has(o.propertyName),o.inherited,i,(e=>{i&&this.handleContextMenuEvent(n,i,e)}))}if("traceElement"===o.tag){const e=n.propertyState(o.property)===s.CSSMatchedStyles.PropertyState.Overloaded,i=((e,t,s,n,i)=>{const o=new h.ComputedStyleTrace.ComputedStyleTrace,r=new pt(null,e,t.name,t.value);r.setColorHandler(gs);const a=r.renderValue();a.slot="trace-value",o.appendChild(a);const l=t.ownerStyle.parentRule;let d;return l&&(d=is.createRuleOriginNode(n,i,l)),o.data={selector:l?l.selectorText():"element.style",active:!s,onNavigateToSource:fs.bind(null,t),ruleOriginNode:d},o})(t,o.property,e,n,this.linkifier);return i.addEventListener("contextmenu",this.handleContextMenuEvent.bind(this,n,o.property)),u.html`${i}`}return u.html`<span style="cursor: text; color: var(--color-text-secondary);">${o.name}</span>`}}buildTreeNode(e,t,s,n){const i={tag:"property",propertyName:t,propertyValue:s,inherited:n},o=e.get(t);return o?{treeNodeData:i,id:t,children:async()=>o.map(this.buildTraceNode)}:{treeNodeData:i,id:t}}handleContextMenuEvent(t,s,i){const o=new n.ContextMenu.ContextMenu(i),r=s.ownerStyle.parentRule;if(r){const e=r.styleSheetId?t.cssModel().styleSheetHeaderForId(r.styleSheetId):null;e&&!e.isAnonymousInlineStyleSheet()&&o.defaultSection().appendItem(us(cs.navigateToSelectorSource),(()=>{is.tryNavigateToRuleLocation(t,r)}))}o.defaultSection().appendItem(us(cs.navigateToStyle),(()=>e.Revealer.reveal(s))),o.show()}computePropertyTraces(e){const t=new Map;for(const s of e.nodeStyles()){const n=s.allProperties();for(const s of n)s.activeInStyle()&&e.propertyState(s)&&(t.has(s.name)||t.set(s.name,[]),t.get(s.name).push(s))}return t}computeNonInheritedProperties(e){const t=new Set;for(const n of e.nodeStyles())for(const i of n.allProperties())e.propertyState(i)&&t.add(s.CSSMetadata.cssMetadata().canonicalPropertyName(i.name));return t}async filterComputedStyles(e){return this.filterRegex=e,this.groupComputedStylesSetting.get()?this.filterGroupLists():this.filterAlphabeticalList()}nodeFilter(e){const t=this.filterRegex,s=e.treeNodeData;if("property"===s.tag){return!t||t.test(s.propertyName)||t.test(s.propertyValue)}return!0}filterAlphabeticalList(){if(!this.#C)return;const e=this.#C.tree.filter(this.nodeFilter.bind(this));this.#y.data={tree:e,defaultRenderer:this.#C.defaultRenderer,compact:this.#C.compact},this.noMatchesElement.classList.toggle("hidden",Boolean(e.length))}async filterGroupLists(){if(!this.#C)return;const e=[];for(const t of this.#C.tree){const s=t.treeNodeData;if("category"!==s.tag||!t.children)continue;const n=(await t.children()).filter(this.nodeFilter.bind(this));n.length&&e.push({id:s.name,treeNodeData:{tag:"category",name:s.name},children:async()=>n})}this.#y.data={tree:e,defaultRenderer:this.#C.defaultRenderer,compact:this.#C.compact},await this.#y.expandRecursively(0),this.noMatchesElement.classList.toggle("hidden",Boolean(e.length))}}const Ss=30,bs=new Set(["display","height","width"]);var Es=Object.freeze({__proto__:null,ComputedStyleWidget:Cs});const vs=function(e,t){if(e.nodeType()!==Node.ELEMENT_NODE)return"";const s=[];let n=e;for(;n;){const i=Ts(n,Boolean(t),n===e);if(!i)break;if(s.push(i),i.optimized)break;n=n.parentNode}return s.reverse(),s.join(" > ")},ws=function(e){let t=e;for(;t;){const e=t.ancestorShadowRoot();if(e&&e.shadowRootType()!==s.DOMModel.DOMNode.ShadowRootTypes.Open)return!1;t=t.ancestorShadowHost()}return!0},xs=function(e,t){if(e.nodeType()!==Node.ELEMENT_NODE)return"";const s=[];let n=e;for(;n;)s.push(vs(n,t)),n=n.ancestorShadowHost();s.reverse();let i="";for(let e=0;e<s.length;++e){const t=JSON.stringify(s[e]);i+=e?`.shadowRoot.querySelector(${t})`:`document.querySelector(${t})`}return i},Ts=function(e,t,s){if(e.nodeType()!==Node.ELEMENT_NODE)return null;const n=e.getAttribute("id");if(t){if(n)return new Ps(a(n),!0);const t=e.nodeName().toLowerCase();if("body"===t||"head"===t||"html"===t)return new Ps(e.nodeNameInCorrectCase(),!0)}const i=e.nodeNameInCorrectCase();if(n)return new Ps(i+a(n),!0);const o=e.parentNode;if(!o||o.nodeType()===Node.DOCUMENT_NODE)return new Ps(i,!0);function r(e){const t=e.getAttribute("class");return t?t.split(/\s+/g).filter(Boolean).map((function(e){return"$"+e})):[]}function a(e){return"#"+CSS.escape(e)}const l=r(e);let d=!1,c=!1,h=-1,u=-1;const p=o.children();for(let t=0;p&&(-1===h||!c)&&t<p.length;++t){const s=p[t];if(s.nodeType()!==Node.ELEMENT_NODE)continue;if(u+=1,s===e){h=u;continue}if(c)continue;if(s.nodeNameInCorrectCase()!==i)continue;d=!0;const n=new Set(l);if(!n.size){c=!0;continue}const o=r(s);for(let e=0;e<o.length;++e){const t=o[e];if(n.has(t)&&(n.delete(t),!n.size)){c=!0;break}}}let m=i;if(s&&"input"===i.toLowerCase()&&e.getAttribute("type")&&!e.getAttribute("id")&&!e.getAttribute("class")&&(m+="[type="+CSS.escape(e.getAttribute("type")||"")+"]"),c)m+=":nth-child("+(h+1)+")";else if(d)for(const e of l)m+="."+CSS.escape(e.slice(1));return new Ps(m,!1)},Is=function(e,t){if(e.nodeType()===Node.DOCUMENT_NODE)return"/";const s=[];let n=e;for(;n;){const e=Ms(n,t);if(!e)break;if(s.push(e),e.optimized)break;n=n.parentNode}return s.reverse(),(s.length&&s[0].optimized?"":"/")+s.join("/")},Ms=function(e,t){let s;const n=Ns(e);if(-1===n)return null;switch(e.nodeType()){case Node.ELEMENT_NODE:if(t&&e.getAttribute("id"))return new Ps('//*[@id="'+e.getAttribute("id")+'"]',!0);s=e.localName();break;case Node.ATTRIBUTE_NODE:s="@"+e.nodeName();break;case Node.TEXT_NODE:case Node.CDATA_SECTION_NODE:s="text()";break;case Node.PROCESSING_INSTRUCTION_NODE:s="processing-instruction()";break;case Node.COMMENT_NODE:s="comment()";break;case Node.DOCUMENT_NODE:default:s=""}return n>0&&(s+="["+n+"]"),new Ps(s,e.nodeType()===Node.DOCUMENT_NODE)},Ns=function(e){function t(e,t){if(e===t)return!0;if(e.nodeType()===Node.ELEMENT_NODE&&t.nodeType()===Node.ELEMENT_NODE)return e.localName()===t.localName();if(e.nodeType()===t.nodeType())return!0;return(e.nodeType()===Node.CDATA_SECTION_NODE?Node.TEXT_NODE:e.nodeType())===(t.nodeType()===Node.CDATA_SECTION_NODE?Node.TEXT_NODE:t.nodeType())}const s=e.parentNode?e.parentNode.children():null;if(!s)return 0;let n;for(let i=0;i<s.length;++i)if(t(e,s[i])&&s[i]!==e){n=!0;break}if(!n)return 0;let i=1;for(let n=0;n<s.length;++n)if(t(e,s[n])){if(s[n]===e)return i;++i}return-1};class Ps{value;optimized;constructor(e,t){this.value=e,this.optimized=t||!1}toString(){return this.value}}var Rs=Object.freeze({__proto__:null,fullQualifiedSelector:function(e,t){return e.nodeType()!==Node.ELEMENT_NODE?e.localName()||e.nodeName().toLowerCase():vs(e,t)},cssPath:vs,canGetJSPath:ws,jsPath:xs,xPath:Is,Step:Ps});const ks={hiddenIssues:"Hidden issues",unhideAll:"Unhide all"},Ls=o.i18n.registerUIStrings("panels/issues/HiddenIssuesRow.ts",ks),As=o.i18n.getLocalizedString.bind(void 0,Ls);class Os extends n.TreeOutline.TreeElement{#S;constructor(){super(void 0,!0),this.#S=document.createElement("span"),this.toggleOnClick=!0,this.listItemElement.classList.add("issue-category","hidden-issues"),this.childrenListElement.classList.add("hidden-issues-body"),this.#b()}#b(){const e=n.UIUtils.createTextButton(As(ks.unhideAll),(()=>P.IssuesManager.IssuesManager.instance().unhideAllIssues()),"unhide-all-issues-button"),t=new T.Adorner.Adorner;t.data={name:"countWrapper",content:this.#S},t.classList.add("aggregated-issues-count"),this.#S.textContent="0";const s=document.createElement("div"),i=document.createElement("div");s.classList.add("header"),i.classList.add("title"),i.textContent=As(ks.hiddenIssues),s.appendChild(t),s.appendChild(i),s.appendChild(e),this.listItemElement.appendChild(s)}update(e){this.#S.textContent=`${e}`}}const Ds=new CSSStyleSheet;Ds.replaceSync(".issues-pane{overflow:hidden}.issues-pane-no-issues{align-items:center;background-color:var(--color-background);display:flex;flex:1 1 auto;font-size:18px;justify-content:center;padding:30px}.issues-toolbar-container{display:flex;flex:none}.issues-toolbar-container > .toolbar{background-color:var(--color-background-elevation-1);border-bottom:1px solid var(--color-details-hairline)}.issues-toolbar-left{flex:1 1 auto}.issues-toolbar-right{padding-right:6px}\n/*# sourceURL=issuesPane.css */\n");const Fs=new CSSStyleSheet;Fs.replaceSync(':host,\n.issues{padding:0;overflow:auto}.issues{--issue-indent:8px}.issues li{white-space:normal;align-items:flex-start}.issues .always-parent::before{display:none}.issues li.parent::before{margin-top:8px}.issues .affected-resources li.parent::before{margin-top:3px;margin-right:0}.issue-category,\n.issue-kind,\n.issue{padding:0 8px;padding-left:var(--issue-indent);overflow:hidden;flex:none;transition:background-color 200ms;border:1px solid var(--color-details-hairline-light);border-width:0 0 1px}.issue-category.hidden-issues.parent.expanded,\n.issue-kind.parent.expanded{border-width:0 0 1px;background-color:var(--color-background-elevation-1)}.issue-category + .children .issue,\n.issue.expanded{background:var(--color-background)}.issue.expanded{border-width:0}.issue.selected,\n.issue.expanded.selected{background-color:var(--legacy-focus-bg-color)}.unhide-all-issues-button{margin:0;height:20px}p{margin-block-start:2px;margin-block-end:2px}.tree-outline-disclosure:not(.tree-outline-disclosure-hide-overflow) .tree-outline.hide-selection-when-blurred .issue-category.selected:focus-visible,\n.tree-outline-disclosure:not(.tree-outline-disclosure-hide-overflow) .tree-outline.hide-selection-when-blurred .issue-kind.selected:focus-visible,\n.tree-outline-disclosure:not(.tree-outline-disclosure-hide-overflow) .tree-outline.hide-selection-when-blurred .issue.selected:focus-visible{width:auto;padding-right:8px}.header{display:flex;flex-direction:row;align-items:flex-start;padding:4px 0;cursor:pointer;width:100%}.header devtools-hide-issues-menu{visibility:hidden}.header:hover devtools-hide-issues-menu{visibility:visible}.header devtools-hide-issues-menu.has-context-menu-opened{visibility:visible}.title{flex:1;font-size:14px;color:var(--color-text-primary);font-weight:normal;user-select:text;padding-top:2px}.issue.expanded .title{font-weight:450}.body.children{border-bottom:1px solid var(--color-details-hairline-light);padding:6px 0;position:relative;padding-left:calc(var(--issue-indent) + 43px);padding-bottom:26px;padding-right:8px}.issue-category + .children,\n.issue-kind + .children{--issue-indent:24px;padding-left:0}.body::before{content:"";display:block;position:absolute;left:calc(var(--issue-indent) + 23px);top:0;bottom:20px;width:2px}.issue-kind-breaking-change.body::before{border-left:2px solid var(--issue-color-yellow)}.issue-kind-page-error.body::before{border-left:2px solid var(--issue-color-red)}.issue-kind-improvement.body::before{border-left:2px solid var(--issue-color-blue)}devtools-icon.leading-issue-icon{margin:1px 0 -1px 7px}.message{line-height:20px;font-size:14px;color:var(--color-text-secondary);margin-bottom:4px;user-select:text}.message p{margin-bottom:16px}.message li{margin-top:8px}.message code{color:var(--color-text-primary);font-size:12px;user-select:text;cursor:text;background:var(--color-background-elevation-1)}.separator::before{content:"·";padding-left:1ex;padding-right:1ex}.link{font-size:14px;color:var(--color-link)}.link-wrapper{margin-top:15px;user-select:text}.affected-resources-label,\n.resolutions-label{margin-top:5px;font-size:10px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;color:var(--color-text-primary);display:inline-block}.link-list{list-style-type:none;list-style-position:inside;padding-inline-start:0}.resolutions-list{list-style-type:none;list-style-position:inside;padding-inline-start:0}.link-list li::before{content:none;-webkit-mask-image:none}.resolutions-list li::before{content:"→";-webkit-mask-image:none;padding-right:5px;position:relative;top:-1px}.resolutions-list li{display:list-item}ul > li.plain-enum{display:list-item}ul > li.plain-enum::before{content:"";padding:0;margin:0;max-width:0}.affected-resources-label + .affected-resources{padding:3px 0 0;position:relative;user-select:text}.affected-resource-label{font-size:14px;line-height:20px;color:var(--color-text-primary);position:relative;cursor:pointer}.affected-resource-cookie{font-size:14px;line-height:20px;border:0;border-collapse:collapse}.affected-resource-element{font-size:14px;line-height:20px;color:var(--color-link);border:0;border-collapse:collapse}.affected-resource-row{font-size:14px;line-height:20px;border:0;border-collapse:collapse;vertical-align:top}.affected-resource-mixed-content{font-size:14px;line-height:20px;border:0;border-collapse:collapse}.affected-resource-heavy-ad{font-size:14px;line-height:20px;border:0;border-collapse:collapse}.affected-resource-request{font-size:14px;line-height:20px;border:0;border-collapse:collapse}.affected-resource-source{font-size:14px;line-height:20px;color:var(--color-link);border:0;border-collapse:collapse}.affected-resource-list{border-spacing:10px 0;margin-left:-12px}.affected-resource-header{font-size:12px;color:var(--color-text-primary);padding-left:2px}.code-example{font-family:var(--monospace-font-family);font-size:var(--monospace-font-size)}.affected-resource-blocked-status{color:var(--issue-color-red)}.affected-resource-report-only-status{color:var(--issue-color-yellow)}.affected-resource-cookie-info{color:var(--color-text-secondary);padding:2px;text-align:right}.affected-resource-cookie-info-header{text-align:right}.affected-resource-mixed-content-info{color:var(--color-text-secondary);padding:2px}.affected-resource-heavy-ad-info{color:var(--color-text-secondary);padding:2px}.affected-resource-heavy-ad-info-frame{display:flex;align-items:center;color:var(--color-text-secondary);padding:2px}.affected-resource-cell{color:var(--color-text-secondary);padding:2px}.affected-resource-cell.link{color:var(--color-link)}.affected-resource-cell span.icon{margin-right:0.5ex;vertical-align:sub}.affected-resources > .parent{margin-top:0;padding:2px 5px 0}.affected-resources > .parent.expanded{background:var(--color-background-elevation-0)}.affected-resources > .children.expanded{background:var(--color-background-elevation-0);padding:6px 0 9px 5px;margin-bottom:10px}.aggregated-issues-count{padding:3px 7px 0}.affected-resource-directive-info-header{text-align:left}.affected-resource-directive{font-size:14px;line-height:20px;border:0;border-collapse:collapse}.affected-resource-directive-info{color:var(--color-text-secondary);padding:2px;text-align:left}.devtools-link{padding-top:4px}devtools-icon.link-icon{vertical-align:sub;margin-right:0.5ch}devtools-icon.elements-panel,\ndevtools-icon.network-panel{margin-right:0.5ex;vertical-align:baseline;height:14px}@media (forced-colors: active){.title{color:ButtonText}.tree-outline:not(.hide-selection-when-blurred) .selected .header .title,\n  .tree-outline.hide-selection-when-blurred .selected:focus-visible .header .title{color:HighlightText}}\n/*# sourceURL=issuesTree.css */\n');class Us extends P.Issue.Issue{#E=new Map;#v=new Map;#w=new Map;#x=new Map;#T=new Set;#I=new Map;#M=new Set;#N=new Set;#P=new Set;#R=new Set;#k=P.Issue.IssueKind.Improvement;#L=new Set;#A=new Set;#O=new Set;#D=new Set;#F=new Set;#U=new Set;#H;#V=0;#B;constructor(e,t){super(e),this.#B=t}primaryKey(){throw new Error("This should never be called")}aggregationKey(){return this.#B}getBlockedByResponseDetails(){return this.#I.values()}cookies(){return Array.from(this.#E.values()).map((e=>e.cookie))}getRawCookieLines(){return this.#v.values()}sources(){return this.#x.values()}getBounceTrackingSites(){return this.#M.values()}cookiesWithRequestIndicator(){return this.#E.values()}getHeavyAdIssues(){return this.#T}getMixedContentIssues(){return this.#A}getCorsIssues(){return this.#N}getCspIssues(){return this.#P}getDeprecationIssues(){return this.#R}getLowContrastIssues(){return this.#L}requests(){return this.#w.values()}getSharedArrayBufferIssues(){return this.#O}getQuirksModeIssues(){return this.#D}getAttributionReportingIssues(){return this.#F}getGenericIssues(){return this.#U}getDescription(){return this.#H?this.#H.getDescription():null}getCategory(){return this.#H?this.#H.getCategory():P.Issue.IssueCategory.Other}getAggregatedIssuesCount(){return this.#V}#_(e){const{domain:t,path:s,name:n}=e;return`${t};${s};${n}`}addInstance(e){this.#V++,this.#H||(this.#H=e),this.#k=P.Issue.unionIssueKind(this.#k,e.getKind());let t=!1;for(const s of e.requests())t=!0,this.#w.has(s.requestId)||this.#w.set(s.requestId,s);for(const s of e.cookies()){const e=this.#_(s);this.#E.has(e)||this.#E.set(e,{cookie:s,hasRequest:t})}for(const s of e.rawCookieLines())this.#v.has(s)||this.#v.set(s,{rawCookieLine:s,hasRequest:t});for(const t of e.trackingSites())this.#M.has(t)||this.#M.add(t);for(const t of e.sources()){const e=JSON.stringify(t);this.#x.has(e)||this.#x.set(e,t)}e instanceof P.MixedContentIssue.MixedContentIssue&&this.#A.add(e),e instanceof P.HeavyAdIssue.HeavyAdIssue&&this.#T.add(e);for(const t of e.getBlockedByResponseDetails()){const e=JSON.stringify(t,["parentFrame","blockedFrame","requestId","frameId","reason","request"]);this.#I.set(e,t)}e instanceof P.ContentSecurityPolicyIssue.ContentSecurityPolicyIssue&&this.#P.add(e),e instanceof P.DeprecationIssue.DeprecationIssue&&this.#R.add(e),e instanceof P.SharedArrayBufferIssue.SharedArrayBufferIssue&&this.#O.add(e),e instanceof P.LowTextContrastIssue.LowTextContrastIssue&&this.#L.add(e),e instanceof P.CorsIssue.CorsIssue&&this.#N.add(e),e instanceof P.QuirksModeIssue.QuirksModeIssue&&this.#D.add(e),e instanceof P.AttributionReportingIssue.AttributionReportingIssue&&this.#F.add(e),e instanceof P.GenericIssue.GenericIssue&&this.#U.add(e)}getKind(){return this.#k}isHidden(){return this.#H?.isHidden()||!1}setHidden(e){throw new Error("Should not call setHidden on aggregatedIssue")}}class Hs extends e.ObjectWrapper.ObjectWrapper{issuesManager;#W=new Map;#q=new Map;constructor(e){super(),this.issuesManager=e,this.issuesManager.addEventListener("IssueAdded",this.#z,this),this.issuesManager.addEventListener("FullUpdateRequired",this.#K,this);for(const e of this.issuesManager.issues())this.#j(e)}#z(e){this.#j(e.data.issue)}#K(){this.#W.clear(),this.#q.clear();for(const e of this.issuesManager.issues())this.#j(e);this.dispatchEventToListeners("FullUpdateRequired")}#j(e){const t=e.isHidden()?this.#q:this.#W,s=this.#$(t,e);return this.dispatchEventToListeners("AggregatedIssueUpdated",s),s}#$(e,t){const s=t.code();let n=e.get(s);return n||(n=new Us(t.code(),s),e.set(s,n)),n.addInstance(t),n}aggregatedIssues(){return[...this.#W.values(),...this.#q.values()]}hiddenAggregatedIssues(){return this.#q.values()}aggregatedIssueCodes(){return new Set([...this.#W.keys(),...this.#q.keys()])}aggregatedIssueCategories(){const e=new Set;for(const t of this.#W.values())e.add(t.getCategory());return e}aggregatedIssueKinds(){const e=new Set;for(const t of this.#W.values())e.add(t.getKind());return e}numberOfAggregatedIssues(){return this.#W.size}numberOfHiddenAggregatedIssues(){return this.#q.size}keyForIssue(e){return e.code()}}const Vs={unknown:"unknown",clickToRevealTheFramesDomNodeIn:"Click to reveal the frame's DOM node in the Elements panel",unavailable:"unavailable"},Bs=o.i18n.registerUIStrings("panels/issues/AffectedResourcesView.ts",Vs),_s=o.i18n.getLocalizedString.bind(void 0,Bs);class Ws extends n.TreeOutline.TreeElement{#G;issue;affectedResourcesCountElement;affectedResources;#Y;#Q;#X;requestResolver;constructor(e,t){super(),this.#G=e,this.issue=t,this.toggleOnClick=!0,this.affectedResourcesCountElement=this.createAffectedResourcesCounter(),this.affectedResources=this.createAffectedResources(),this.#Y=0,this.requestResolver=new O.RequestResolver.RequestResolver,this.#Q=[],this.#X=new Set}setIssue(e){this.issue=e}createAffectedResourcesCounter(){const e=document.createElement("div");return e.classList.add("affected-resource-label"),this.listItemElement.appendChild(e),e}createAffectedResources(){const e=new n.TreeOutline.TreeElement,t=document.createElement("table");return t.classList.add("affected-resource-list"),e.listItemElement.appendChild(t),this.appendChild(e),t}updateAffectedResourceCount(e){this.#Y=e,this.affectedResourcesCountElement.textContent=this.getResourceNameWithCount(e),this.hidden=0===this.#Y,this.#G.updateAffectedResourceVisibility()}isEmpty(){return 0===this.#Y}clear(){this.affectedResources.textContent="",this.requestResolver.clear()}expandIfOneResource(){1===this.#Y&&this.expand()}#J(e){const t=s.FrameManager.FrameManager.instance().getFrame(e);if(!(t&&t.url||(this.#X.add(e),this.#Q.length))){const e=s.FrameManager.FrameManager.instance().addEventListener(s.FrameManager.Events.FrameAddedToTarget,this.#Z,this),t=s.FrameManager.FrameManager.instance().addEventListener(s.FrameManager.Events.FrameNavigated,this.#Z,this);this.#Q=[e,t]}return t}#Z(t){const s=t.data.frame;if(!s.url)return;const n=this.#X.delete(s.id);0===this.#X.size&&this.#Q.length&&(e.EventTarget.removeEventListeners(this.#Q),this.#Q=[]),n&&this.update()}createFrameCell(t,n){const o=this.#J(t),r=o&&(o.unreachableUrl()||o.url)||_s(Vs.unknown),a=document.createElement("td");if(a.classList.add("affected-resource-cell"),o){const o=new C.Icon.Icon;o.data={iconName:"code-circle",color:"var(--icon-link)",width:"16px",height:"16px"},o.classList.add("link","elements-panel"),o.onclick=async()=>{i.userMetrics.issuesPanelResourceOpened(n,"Element");const o=s.FrameManager.FrameManager.instance().getFrame(t);if(o){const t=await o.getOwnerDOMNodeOrDocument();t&&e.Revealer.reveal(t)}},o.title=_s(Vs.clickToRevealTheFramesDomNodeIn),a.appendChild(o)}return a.appendChild(document.createTextNode(r)),a.onmouseenter=()=>{const e=s.FrameManager.FrameManager.instance().getFrame(t);e&&e.highlight()},a.onmouseleave=()=>s.OverlayModel.OverlayModel.hideDOMNodeHighlight(),a}createRequestCell(e,t={}){const s=document.createElement("td");s.classList.add("affected-resource-cell");const n=new D.RequestLinkIcon.RequestLinkIcon;return n.data={...t,affectedRequest:e,requestResolver:this.requestResolver,displayURL:!0},s.appendChild(n),s}async createElementCell({backendNodeId:t,nodeName:n,target:o},r){if(!o){const e=document.createElement("td");return e.textContent=n||_s(Vs.unavailable),e}function a(){i.userMetrics.issuesPanelResourceOpened(r,"Element")}const l=new s.DOMModel.DeferredDOMNode(o,t),d=await e.Linkifier.Linkifier.linkify(l);d.textContent=n,d.addEventListener("click",(()=>a())),d.addEventListener("keydown",(e=>{"Enter"===e.key&&a()}));const c=document.createElement("td");return c.classList.add("affected-resource-element","devtools-link"),c.appendChild(d),c}appendSourceLocation(e,t,s){const n=document.createElement("td");if(n.classList.add("affected-source-location"),t){const e=40,i=new m.Linkifier.Linkifier(e).linkifyScriptLocation(s||null,t.scriptId||null,t.url,t.lineNumber,{columnNumber:t.columnNumber,inlineFrameIndex:0});n.appendChild(i)}e.appendChild(n)}appendColumnTitle(e,t,s=null){const n=document.createElement("td");n.classList.add("affected-resource-header"),s&&n.classList.add(s),n.textContent=t,e.appendChild(n)}createIssueDetailCell(e,t=null){const s=document.createElement("td");return s.textContent=e,t&&s.classList.add(t),s}appendIssueDetailCell(e,t,s=null){const n=this.createIssueDetailCell(t,s);return e.appendChild(n),n}}const qs={nDirectives:"{n, plural, =1 {# directive} other {# directives}}",reportonly:"report-only",blocked:"blocked",clickToRevealTheViolatingDomNode:"Click to reveal the violating DOM node in the Elements panel",directiveC:"Directive",element:"Element",sourceLocation:"Source Location",status:"Status",resourceC:"Resource"},zs=o.i18n.registerUIStrings("panels/issues/AffectedDirectivesView.ts",qs),Ks=o.i18n.getLocalizedString.bind(void 0,zs);class js extends Ws{#ee(e,t){const s=document.createElement("td");t?(s.classList.add("affected-resource-report-only-status"),s.textContent=Ks(qs.reportonly)):(s.classList.add("affected-resource-blocked-status"),s.textContent=Ks(qs.blocked)),e.appendChild(s)}getResourceNameWithCount(e){return Ks(qs.nDirectives,{n:e})}#te(e,t){const s=document.createElement("td");s.textContent=t,e.appendChild(s)}#se(e,t){const s=document.createElement("td");s.classList.add("affected-resource-directive-info"),s.textContent=t,e.appendChild(s)}#ne(t,n,o){const r=new A.ElementsPanelLink.ElementsPanelLink;if(n){const t=n;r.title=Ks(qs.clickToRevealTheViolatingDomNode);const a=()=>{const n=o.getTargetIfNotDisposed();if(n){i.userMetrics.issuesPanelResourceOpened(this.issue.getCategory(),"Element");const o=new s.DOMModel.DeferredDOMNode(n,t);e.Revealer.reveal(o)}},l=()=>{const e=o.getTargetIfNotDisposed();if(e){const n=new s.DOMModel.DeferredDOMNode(e,t);n&&n.highlight()}},d=()=>{s.OverlayModel.OverlayModel.hideDOMNodeHighlight()};r.data={onElementRevealIconClick:a,onElementRevealIconMouseEnter:l,onElementRevealIconMouseLeave:d}}const a=document.createElement("td");a.classList.add("affected-resource-csp-info-node"),a.appendChild(r),t.appendChild(a)}#ie(e){const t=document.createElement("tr");if(this.issue.code()===P.ContentSecurityPolicyIssue.inlineViolationCode)this.appendColumnTitle(t,Ks(qs.directiveC)),this.appendColumnTitle(t,Ks(qs.element)),this.appendColumnTitle(t,Ks(qs.sourceLocation)),this.appendColumnTitle(t,Ks(qs.status));else if(this.issue.code()===P.ContentSecurityPolicyIssue.urlViolationCode)this.appendColumnTitle(t,Ks(qs.resourceC),"affected-resource-directive-info-header"),this.appendColumnTitle(t,Ks(qs.status)),this.appendColumnTitle(t,Ks(qs.directiveC)),this.appendColumnTitle(t,Ks(qs.sourceLocation));else if(this.issue.code()===P.ContentSecurityPolicyIssue.evalViolationCode)this.appendColumnTitle(t,Ks(qs.sourceLocation)),this.appendColumnTitle(t,Ks(qs.directiveC)),this.appendColumnTitle(t,Ks(qs.status));else if(this.issue.code()===P.ContentSecurityPolicyIssue.trustedTypesSinkViolationCode)this.appendColumnTitle(t,Ks(qs.sourceLocation)),this.appendColumnTitle(t,Ks(qs.status));else{if(this.issue.code()!==P.ContentSecurityPolicyIssue.trustedTypesPolicyViolationCode)return void this.updateAffectedResourceCount(0);this.appendColumnTitle(t,Ks(qs.sourceLocation)),this.appendColumnTitle(t,Ks(qs.directiveC)),this.appendColumnTitle(t,Ks(qs.status))}this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,this.#oe(t);this.updateAffectedResourceCount(s)}#oe(e){const t=document.createElement("tr");t.classList.add("affected-resource-directive");const s=e.details(),n=P.Issue.toZeroBasedLocation(s.sourceCodeLocation),i=e.model(),o=e.model()?.getTargetIfNotDisposed();if(this.issue.code()===P.ContentSecurityPolicyIssue.inlineViolationCode&&i)this.#te(t,s.violatedDirective),this.#ne(t,s.violatingNodeId,i),this.appendSourceLocation(t,n,o),this.#ee(t,s.isReportOnly);else if(this.issue.code()===P.ContentSecurityPolicyIssue.urlViolationCode){const e=s.blockedURL?s.blockedURL:r.DevToolsPath.EmptyUrlString;this.#se(t,e),this.#ee(t,s.isReportOnly),this.#te(t,s.violatedDirective),this.appendSourceLocation(t,n,o)}else if(this.issue.code()===P.ContentSecurityPolicyIssue.evalViolationCode)this.appendSourceLocation(t,n,o),this.#te(t,s.violatedDirective),this.#ee(t,s.isReportOnly);else if(this.issue.code()===P.ContentSecurityPolicyIssue.trustedTypesSinkViolationCode)this.appendSourceLocation(t,n,o),this.#ee(t,s.isReportOnly);else{if(this.issue.code()!==P.ContentSecurityPolicyIssue.trustedTypesPolicyViolationCode)return;this.appendSourceLocation(t,n,o),this.#te(t,s.violatedDirective),this.#ee(t,s.isReportOnly)}this.affectedResources.appendChild(t)}update(){this.clear(),this.#ie(this.issue.getCspIssues())}}const $s={nRequests:"{n, plural, =1 {# request} other {# requests}}",requestC:"Request",parentFrame:"Parent Frame",blockedResource:"Blocked Resource"},Gs=o.i18n.registerUIStrings("panels/issues/AffectedBlockedByResponseView.ts",$s),Ys=o.i18n.getLocalizedString.bind(void 0,Gs);class Qs extends Ws{#re(e){const t=document.createElement("tr");this.appendColumnTitle(t,Ys($s.requestC)),this.appendColumnTitle(t,Ys($s.parentFrame)),this.appendColumnTitle(t,Ys($s.blockedResource)),this.affectedResources.appendChild(t);let s=0;for(const t of e)this.#ae(t),s++;this.updateAffectedResourceCount(s)}getResourceNameWithCount(e){return Ys($s.nRequests,{n:e})}#ae(e){const t=document.createElement("tr");t.classList.add("affected-resource-row");const s=this.createRequestCell(e.request,{additionalOnClickAction(){i.userMetrics.issuesPanelResourceOpened(P.Issue.IssueCategory.CrossOriginEmbedderPolicy,"Request")}});if(t.appendChild(s),e.parentFrame){const s=this.createFrameCell(e.parentFrame.frameId,this.issue.getCategory());t.appendChild(s)}else t.appendChild(document.createElement("td"));if(e.blockedFrame){const s=this.createFrameCell(e.blockedFrame.frameId,this.issue.getCategory());t.appendChild(s)}else t.appendChild(document.createElement("td"));this.affectedResources.appendChild(t)}update(){this.clear(),this.#re(this.issue.getBlockedByResponseDetails())}}const Xs={nCookies:"{n, plural, =1 {# cookie} other {# cookies}}",name:"Name",domain:"Domain",path:"Path",nRawCookieLines:"{n, plural, =1 {1 Raw `Set-Cookie` header} other {# Raw `Set-Cookie` headers}}",filterSetCookieTitle:"Show network requests that include this `Set-Cookie` header in the network panel"},Js=o.i18n.registerUIStrings("panels/issues/AffectedCookiesView.ts",Xs),Zs=o.i18n.getLocalizedString.bind(void 0,Js);class en extends Ws{getResourceNameWithCount(e){return Zs(Xs.nCookies,{n:e})}#le(e){const t=document.createElement("tr");this.appendColumnTitle(t,Zs(Xs.name)),this.appendColumnTitle(t,Zs(Xs.domain)+" & "+Zs(Xs.path),"affected-resource-cookie-info-header"),this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,this.#de(t.cookie,t.hasRequest);this.updateAffectedResourceCount(s)}#de(t,s){const o=document.createElement("tr");o.classList.add("affected-resource-cookie");const r=document.createElement("td");s?r.appendChild(n.UIUtils.createTextButton(t.name,(()=>{i.userMetrics.issuesPanelResourceOpened(this.issue.getCategory(),"Cookie"),e.Revealer.reveal(L.UIFilter.UIRequestFilter.filters([{filterType:L.UIFilter.FilterType.CookieDomain,filterValue:t.domain},{filterType:L.UIFilter.FilterType.CookieName,filterValue:t.name},{filterType:L.UIFilter.FilterType.CookiePath,filterValue:t.path}]))}),"link-style devtools-link")):r.textContent=t.name,o.appendChild(r),this.appendIssueDetailCell(o,`${t.domain}${t.path}`,"affected-resource-cookie-info"),this.affectedResources.appendChild(o)}update(){this.clear(),this.#le(this.issue.cookiesWithRequestIndicator())}}class tn extends Ws{getResourceNameWithCount(e){return Zs(Xs.nRawCookieLines,{n:e})}update(){this.clear();const t=this.issue.getRawCookieLines();let s=0;for(const i of t){const t=document.createElement("tr");if(t.classList.add("affected-resource-directive"),i.hasRequest){const s=document.createElement("td"),o=n.UIUtils.createTextButton(i.rawCookieLine,(()=>{e.Revealer.reveal(L.UIFilter.UIRequestFilter.filters([{filterType:L.UIFilter.FilterType.ResponseHeaderValueSetCookie,filterValue:i.rawCookieLine}]))}),"link-style devtools-link");o.title=Zs(Xs.filterSetCookieTitle),s.appendChild(o),t.appendChild(s)}else this.appendIssueDetailCell(t,i.rawCookieLine);this.affectedResources.appendChild(t),s++}this.updateAffectedResourceCount(s)}}const sn={nElements:"{n, plural, =1 {# element} other {# elements}}"},nn=o.i18n.registerUIStrings("panels/issues/AffectedElementsView.ts",sn),on=o.i18n.getLocalizedString.bind(void 0,nn);class rn extends Ws{async#ce(e){let t=0;for(const s of e)await this.#he(s),t++;this.updateAffectedResourceCount(t)}getResourceNameWithCount(e){return on(sn.nElements,{n:e})}async#he(e){const t=await this.createElementCell(e,this.issue.getCategory()),s=document.createElement("tr");s.appendChild(t),this.affectedResources.appendChild(s)}update(){this.clear(),this.#ce(this.issue.elements())}}const an={nDocuments:"{n, plural, =1 { document} other { documents}}",documentInTheDOMTree:"Document in the DOM tree",url:"URL",mode:"Mode"},ln=o.i18n.registerUIStrings("panels/issues/AffectedDocumentsInQuirksModeView.ts",an),dn=o.i18n.getLocalizedString.bind(void 0,ln);class cn extends rn{#ue=Promise.resolve();update(){this.#ue=this.#ue.then(this.#pe.bind(this))}getResourceName(e){return dn(an.nDocuments,{n:e})}async#pe(){this.clear(),await this.#me(this.issue.getQuirksModeIssues())}async#ge(e){const t=document.createElement("tr");t.classList.add("affected-resource-quirks-mode");const n=e.details(),i=s.FrameManager.FrameManager.instance().getFrame(n.frameId)?.resourceTreeModel().target()||null;t.appendChild(await this.createElementCell({nodeName:"document",backendNodeId:n.documentNodeId,target:i},e.getCategory())),this.appendIssueDetailCell(t,n.isLimitedQuirksMode?"Limited Quirks Mode":"Quirks Mode"),this.appendIssueDetailCell(t,n.url),this.affectedResources.appendChild(t)}async#me(e){const t=document.createElement("tr");this.appendColumnTitle(t,dn(an.documentInTheDOMTree)),this.appendColumnTitle(t,dn(an.mode)),this.appendColumnTitle(t,dn(an.url)),this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,await this.#ge(t);this.updateAffectedResourceCount(s)}}class hn extends rn{#ue=Promise.resolve();update(){this.#ue=this.#ue.then(this.#pe.bind(this))}async#pe(){this.clear(),await this.#fe(this.issue.getLowContrastIssues())}async#ye(e){const t=document.createElement("tr");t.classList.add("affected-resource-low-contrast");const s=e.details(),n=e.model()?.target()||null;t.appendChild(await this.createElementCell({nodeName:s.violatingNodeSelector,backendNodeId:s.violatingNodeId,target:n},e.getCategory())),this.appendIssueDetailCell(t,String(r.NumberUtilities.floor(s.contrastRatio,2))),this.appendIssueDetailCell(t,String(s.thresholdAA)),this.appendIssueDetailCell(t,String(s.thresholdAAA)),this.appendIssueDetailCell(t,s.fontSize),this.appendIssueDetailCell(t,s.fontWeight),this.affectedResources.appendChild(t)}async#fe(e){const t=document.createElement("tr");this.appendColumnTitle(t,mn(un.element)),this.appendColumnTitle(t,mn(un.contrastRatio)),this.appendColumnTitle(t,mn(un.minimumAA)),this.appendColumnTitle(t,mn(un.minimumAAA)),this.appendColumnTitle(t,mn(un.textSize)),this.appendColumnTitle(t,mn(un.textWeight)),this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,await this.#ye(t);this.updateAffectedResourceCount(s)}}const un={element:"Element",contrastRatio:"Contrast ratio",minimumAA:"Minimum AA ratio",minimumAAA:"Minimum AAA ratio",textSize:"Text size",textWeight:"Text weight"},pn=o.i18n.registerUIStrings("panels/issues/AffectedElementsWithLowContrastView.ts",un),mn=o.i18n.getLocalizedString.bind(void 0,pn),gn={nResources:"{n, plural, =1 {# resource} other {# resources}}",limitExceeded:"Limit exceeded",resolutionStatus:"Resolution Status",frameUrl:"Frame URL",removed:"Removed",warned:"Warned",cpuPeakLimit:"CPU peak limit",cpuTotalLimit:"CPU total limit",networkLimit:"Network limit"},fn=o.i18n.registerUIStrings("panels/issues/AffectedHeavyAdView.ts",gn),yn=o.i18n.getLocalizedString.bind(void 0,fn);class Cn extends Ws{#Ce(e){const t=document.createElement("tr");this.appendColumnTitle(t,yn(gn.limitExceeded)),this.appendColumnTitle(t,yn(gn.resolutionStatus)),this.appendColumnTitle(t,yn(gn.frameUrl)),this.affectedResources.appendChild(t);let s=0;for(const t of e)this.#Se(t.details()),s++;this.updateAffectedResourceCount(s)}getResourceNameWithCount(e){return yn(gn.nResources,{n:e})}#be(e){switch(e){case"HeavyAdBlocked":return yn(gn.removed);case"HeavyAdWarning":return yn(gn.warned)}return""}#Ee(e){switch(e){case"CpuPeakLimit":return yn(gn.cpuPeakLimit);case"CpuTotalLimit":return yn(gn.cpuTotalLimit);case"NetworkTotalLimit":return yn(gn.networkLimit)}return""}#Se(e){const t=document.createElement("tr");t.classList.add("affected-resource-heavy-ad");const s=document.createElement("td");s.classList.add("affected-resource-heavy-ad-info"),s.textContent=this.#Ee(e.reason),t.appendChild(s);const n=document.createElement("td");n.classList.add("affected-resource-heavy-ad-info"),n.textContent=this.#be(e.resolution),t.appendChild(n);const i=e.frame.frameId,o=this.createFrameCell(i,this.issue.getCategory());t.appendChild(o),this.affectedResources.appendChild(t)}update(){this.clear(),this.#Ce(this.issue.getHeavyAdIssues())}}const Sn={nViolations:"{n, plural, =1 {# violation} other {# violations}}",warning:"warning",blocked:"blocked",instantiation:"Instantiation",aSharedarraybufferWas:"A `SharedArrayBuffer` was instantiated in a context that is not cross-origin isolated",transfer:"Transfer",sharedarraybufferWasTransferedTo:"`SharedArrayBuffer` was transfered to a context that is not cross-origin isolated",sourceLocation:"Source Location",trigger:"Trigger",status:"Status"},bn=o.i18n.registerUIStrings("panels/issues/AffectedSharedArrayBufferIssueDetailsView.ts",Sn),En=o.i18n.getLocalizedString.bind(void 0,bn);class vn extends Ws{getResourceNameWithCount(e){return En(Sn.nViolations,{n:e})}#ee(e,t){const s=document.createElement("td");t?(s.classList.add("affected-resource-report-only-status"),s.textContent=En(Sn.warning)):(s.classList.add("affected-resource-blocked-status"),s.textContent=En(Sn.blocked)),e.appendChild(s)}#ve(e,t){const s=document.createElement("td");switch(t){case"CreationIssue":s.textContent=En(Sn.instantiation),s.title=En(Sn.aSharedarraybufferWas);break;case"TransferIssue":s.textContent=En(Sn.transfer),s.title=En(Sn.sharedarraybufferWasTransferedTo)}e.appendChild(s)}#re(e){const t=document.createElement("tr");this.appendColumnTitle(t,En(Sn.sourceLocation)),this.appendColumnTitle(t,En(Sn.trigger)),this.appendColumnTitle(t,En(Sn.status)),this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,this.#ae(t);this.updateAffectedResourceCount(s)}#ae(e){const t=document.createElement("tr");t.classList.add("affected-resource-directive");const s=e.details(),n=P.Issue.toZeroBasedLocation(s.sourceCodeLocation);this.appendSourceLocation(t,n,e.model()?.getTargetIfNotDisposed()),this.#ve(t,s.type),this.#ee(t,s.isWarning),this.affectedResources.appendChild(t)}update(){this.clear(),this.#re(this.issue.getSharedArrayBufferIssues())}}const wn={nSources:"{n, plural, =1 {# source} other {# sources}}"},xn=o.i18n.registerUIStrings("panels/issues/AffectedSourcesView.ts",wn),Tn=o.i18n.getLocalizedString.bind(void 0,xn);class In extends Ws{#we(e){let t=0;for(const s of e)this.#xe(s),t++;this.updateAffectedResourceCount(t)}getResourceNameWithCount(e){return Tn(wn.nSources,{n:e})}#xe({url:e,lineNumber:t,columnNumber:s}){const n=document.createElement("td"),i={columnNumber:s,lineNumber:t,tabStop:!0,showColumnNumber:!1,inlineFrameIndex:0},o=m.Linkifier.Linkifier.linkifyURL(e,i);n.appendChild(o);const r=document.createElement("tr");r.classList.add("affected-resource-source"),r.appendChild(n),this.affectedResources.appendChild(r)}update(){this.clear(),this.#we(this.issue.sources())}}const Mn={nTrackingSites:"{n, plural, =1 {1 potentially tracking website} other {# potentially tracking websites}}"},Nn=o.i18n.registerUIStrings("panels/issues/AffectedTrackingSitesView.ts",Mn),Pn=o.i18n.getLocalizedString.bind(void 0,Nn);class Rn extends Ws{getResourceNameWithCount(e){return Pn(Mn.nTrackingSites,{n:e})}update(){this.clear();const e=this.issue.getBounceTrackingSites();let t=0;for(const s of e){const e=document.createElement("tr");e.classList.add("affected-resource-directive"),this.appendIssueDetailCell(e,s),this.affectedResources.appendChild(e),t++}this.updateAffectedResourceCount(t)}}const kn={nRequests:"{n, plural, =1 {# request} other {# requests}}",warning:"warning",blocked:"blocked",status:"Status",request:"Request",resourceAddressSpace:"Resource Address",initiatorAddressSpace:"Initiator Address",secure:"secure",insecure:"insecure",initiatorContext:"Initiator Context",preflightRequestIfProblematic:"Preflight Request (if problematic)",preflightRequest:"Preflight Request",header:"Header",problem:"Problem",invalidValue:"Invalid Value (if available)",problemMissingHeader:"Missing Header",problemMultipleValues:"Multiple Values",problemInvalidValue:"Invalid Value",preflightDisallowedRedirect:"Response to preflight was a redirect",preflightInvalidStatus:"HTTP status of preflight request didn't indicate success",allowedOrigin:"Allowed Origin (from header)",allowCredentialsValueFromHeader:"`Access-Control-Allow-Credentials` Header Value",disallowedRequestMethod:"Disallowed Request Method",disallowedRequestHeader:"Disallowed Request Header",sourceLocation:"Source Location",unsupportedScheme:"Unsupported Scheme",failedRequest:"Failed Request"},Ln=o.i18n.registerUIStrings("panels/issues/CorsIssueDetailsView.ts",kn),An=o.i18n.getLocalizedString.bind(void 0,Ln);class On extends Ws{constructor(e,t){super(e,t),this.affectedResourcesCountElement.classList.add("cors-issue-affected-resource-label")}#ee(e,t){const s=document.createElement("td");t?(s.classList.add("affected-resource-report-only-status"),s.textContent=An(kn.warning)):(s.classList.add("affected-resource-blocked-status"),s.textContent=An(kn.blocked)),e.appendChild(s)}getResourceNameWithCount(e){return An(kn.nRequests,{n:e})}#re(e,t){const s=document.createElement("tr");switch(this.appendColumnTitle(s,An(kn.request)),this.appendColumnTitle(s,An(kn.status)),e){case P.CorsIssue.IssueCode.InvalidHeaderValues:this.appendColumnTitle(s,An(kn.preflightRequestIfProblematic)),this.appendColumnTitle(s,An(kn.header)),this.appendColumnTitle(s,An(kn.problem)),this.appendColumnTitle(s,An(kn.invalidValue));break;case P.CorsIssue.IssueCode.WildcardOriginNotAllowed:this.appendColumnTitle(s,An(kn.preflightRequestIfProblematic));break;case P.CorsIssue.IssueCode.PreflightResponseInvalid:this.appendColumnTitle(s,An(kn.preflightRequest)),this.appendColumnTitle(s,An(kn.problem));break;case P.CorsIssue.IssueCode.OriginMismatch:this.appendColumnTitle(s,An(kn.preflightRequestIfProblematic)),this.appendColumnTitle(s,An(kn.initiatorContext)),this.appendColumnTitle(s,An(kn.allowedOrigin));break;case P.CorsIssue.IssueCode.AllowCredentialsRequired:this.appendColumnTitle(s,An(kn.preflightRequestIfProblematic)),this.appendColumnTitle(s,An(kn.allowCredentialsValueFromHeader));break;case P.CorsIssue.IssueCode.InsecurePrivateNetwork:this.appendColumnTitle(s,An(kn.resourceAddressSpace)),this.appendColumnTitle(s,An(kn.initiatorAddressSpace)),this.appendColumnTitle(s,An(kn.initiatorContext));break;case P.CorsIssue.IssueCode.PreflightAllowPrivateNetworkError:this.appendColumnTitle(s,An(kn.preflightRequest)),this.appendColumnTitle(s,An(kn.invalidValue)),this.appendColumnTitle(s,An(kn.initiatorAddressSpace)),this.appendColumnTitle(s,An(kn.initiatorContext));break;case P.CorsIssue.IssueCode.MethodDisallowedByPreflightResponse:this.appendColumnTitle(s,An(kn.preflightRequest)),this.appendColumnTitle(s,An(kn.disallowedRequestMethod));break;case P.CorsIssue.IssueCode.HeaderDisallowedByPreflightResponse:this.appendColumnTitle(s,An(kn.preflightRequest)),this.appendColumnTitle(s,An(kn.disallowedRequestHeader));break;case P.CorsIssue.IssueCode.RedirectContainsCredentials:break;case P.CorsIssue.IssueCode.DisallowedByMode:this.appendColumnTitle(s,An(kn.initiatorContext)),this.appendColumnTitle(s,An(kn.sourceLocation));break;case P.CorsIssue.IssueCode.CorsDisabledScheme:this.appendColumnTitle(s,An(kn.initiatorContext)),this.appendColumnTitle(s,An(kn.sourceLocation)),this.appendColumnTitle(s,An(kn.unsupportedScheme));break;case P.CorsIssue.IssueCode.NoCorsRedirectModeNotFollow:this.appendColumnTitle(s,An(kn.sourceLocation));break;default:r.assertUnhandled(e)}this.affectedResources.appendChild(s);let n=0;for(const s of t)n++,this.#ae(e,s);this.updateAffectedResourceCount(n)}#Te(e,t){void 0!==t?this.appendIssueDetailCell(e,An(t?kn.secure:kn.insecure)):this.appendIssueDetailCell(e,"")}static getHeaderFromError(e){switch(e){case"InvalidAllowHeadersPreflightResponse":return"Access-Control-Allow-Headers";case"InvalidAllowMethodsPreflightResponse":case"MethodDisallowedByPreflightResponse":return"Access-Control-Allow-Methods";case"PreflightMissingAllowOriginHeader":case"PreflightMultipleAllowOriginValues":case"PreflightInvalidAllowOriginValue":case"MissingAllowOriginHeader":case"MultipleAllowOriginValues":case"InvalidAllowOriginValue":case"WildcardOriginNotAllowed":case"PreflightWildcardOriginNotAllowed":case"AllowOriginMismatch":case"PreflightAllowOriginMismatch":return"Access-Control-Allow-Origin";case"InvalidAllowCredentials":case"PreflightInvalidAllowCredentials":return"Access-Control-Allow-Credentials";case"PreflightMissingAllowPrivateNetwork":case"PreflightInvalidAllowPrivateNetwork":return"Access-Control-Allow-Private-Network";case"RedirectContainsCredentials":case"PreflightDisallowedRedirect":return"Location";case"PreflightInvalidStatus":return"Status-Code"}return""}static getProblemFromError(e){switch(e.corsError){case"InvalidAllowHeadersPreflightResponse":case"InvalidAllowMethodsPreflightResponse":case"PreflightInvalidAllowOriginValue":case"InvalidAllowOriginValue":return An(kn.problemInvalidValue);case"PreflightMultipleAllowOriginValues":case"MultipleAllowOriginValues":return An(kn.problemMultipleValues);case"MissingAllowOriginHeader":case"PreflightMissingAllowOriginHeader":return An(kn.problemMissingHeader);case"PreflightInvalidStatus":return An(kn.preflightInvalidStatus);case"PreflightDisallowedRedirect":return An(kn.preflightDisallowedRedirect);case"InvalidResponse":return An(kn.failedRequest)}throw new Error("Invalid Argument")}#ae(e,t){const s=document.createElement("tr");s.classList.add("affected-resource-directive");const n=t.details(),o=n.corsErrorStatus,a=n.corsErrorStatus.corsError,l={section:L.UIRequestLocation.UIHeaderSection.Response,name:On.getHeaderFromError(a)},d={additionalOnClickAction(){i.userMetrics.issuesPanelResourceOpened(P.Issue.IssueCategory.Cors,"Request")}};switch(e){case P.CorsIssue.IssueCode.InvalidHeaderValues:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),a.includes("Preflight")?s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})):this.appendIssueDetailCell(s,""),this.appendIssueDetailCell(s,On.getHeaderFromError(a),"code-example"),this.appendIssueDetailCell(s,On.getProblemFromError(n.corsErrorStatus)),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example");break;case P.CorsIssue.IssueCode.WildcardOriginNotAllowed:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),a.includes("Preflight")?s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})):this.appendIssueDetailCell(s,"");break;case P.CorsIssue.IssueCode.PreflightResponseInvalid:{s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning);const e="PreflightInvalidStatus"===a?{section:L.UIRequestLocation.UIHeaderSection.General,name:"Status-Code"}:l;s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:e})),this.appendIssueDetailCell(s,On.getProblemFromError(n.corsErrorStatus));break}case P.CorsIssue.IssueCode.OriginMismatch:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),a.includes("Preflight")?s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})):this.appendIssueDetailCell(s,""),this.appendIssueDetailCell(s,n.initiatorOrigin??"","code-example"),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example");break;case P.CorsIssue.IssueCode.AllowCredentialsRequired:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),a.includes("Preflight")?s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})):this.appendIssueDetailCell(s,""),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example");break;case P.CorsIssue.IssueCode.InsecurePrivateNetwork:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),this.appendIssueDetailCell(s,n.resourceIPAddressSpace??""),this.appendIssueDetailCell(s,n.clientSecurityState?.initiatorIPAddressSpace??""),this.#Te(s,n.clientSecurityState?.initiatorIsSecureContext);break;case P.CorsIssue.IssueCode.PreflightAllowPrivateNetworkError:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example"),this.appendIssueDetailCell(s,n.clientSecurityState?.initiatorIPAddressSpace??""),this.#Te(s,n.clientSecurityState?.initiatorIsSecureContext);break;case P.CorsIssue.IssueCode.MethodDisallowedByPreflightResponse:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:l})),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example");break;case P.CorsIssue.IssueCode.HeaderDisallowedByPreflightResponse:s.appendChild(this.createRequestCell(n.request,{...d,highlightHeader:{section:L.UIRequestLocation.UIHeaderSection.Request,name:o.failedParameter}})),this.#ee(s,n.isWarning),s.appendChild(this.createRequestCell(n.request,{...d,linkToPreflight:!0,highlightHeader:{section:L.UIRequestLocation.UIHeaderSection.Response,name:"Access-Control-Allow-Headers"}})),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter,"code-example");break;case P.CorsIssue.IssueCode.RedirectContainsCredentials:s.appendChild(this.createRequestCell(n.request,{...d,highlightHeader:{section:L.UIRequestLocation.UIHeaderSection.Response,name:On.getHeaderFromError(a)}})),this.#ee(s,n.isWarning);break;case P.CorsIssue.IssueCode.DisallowedByMode:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),this.appendIssueDetailCell(s,n.initiatorOrigin??"","code-example"),this.appendSourceLocation(s,n.location,t.model()?.getTargetIfNotDisposed());break;case P.CorsIssue.IssueCode.CorsDisabledScheme:s.appendChild(this.createRequestCell(n.request,{...d,highlightHeader:{section:L.UIRequestLocation.UIHeaderSection.Response,name:On.getHeaderFromError(a)}})),this.#ee(s,n.isWarning),this.appendIssueDetailCell(s,n.initiatorOrigin??"","code-example"),this.appendSourceLocation(s,n.location,t.model()?.getTargetIfNotDisposed()),this.appendIssueDetailCell(s,n.corsErrorStatus.failedParameter??"","code-example");break;case P.CorsIssue.IssueCode.NoCorsRedirectModeNotFollow:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),this.appendSourceLocation(s,n.location,t.model()?.getTargetIfNotDisposed());break;default:s.appendChild(this.createRequestCell(n.request,d)),this.#ee(s,n.isWarning),r.assertUnhandled(e)}this.affectedResources.appendChild(s)}update(){this.clear();const e=this.issue.getCorsIssues();e.size>0?this.#re(e.values().next().value.code(),e):this.updateAffectedResourceCount(0)}}const Dn={nResources:"{n, plural, =1 {# resource} other {# resources}}",frameId:"Frame",violatingNode:"Violating node"},Fn=o.i18n.registerUIStrings("panels/issues/GenericIssueDetailsView.ts",Dn),Un=o.i18n.getLocalizedString.bind(void 0,Fn);class Hn extends Ws{getResourceNameWithCount(e){return Un(Dn.nResources,{n:e})}#re(e){const t=document.createElement("tr");e.values().next().value.details().frameId&&this.appendColumnTitle(t,Un(Dn.frameId)),this.affectedResources.appendChild(t);let s=0;for(const t of e)s++,this.#ae(t);this.updateAffectedResourceCount(s)}async#ae(e){const t=document.createElement("tr");t.classList.add("affected-resource-directive");const s=e.details();if(s.frameId&&t.appendChild(this.createFrameCell(s.frameId,e.getCategory())),s.violatingNodeId){const n=e.model()?.target()||null;t.appendChild(await this.createElementCell({backendNodeId:s.violatingNodeId,nodeName:this.violatingNodeIdName(s.errorType),target:n},e.getCategory()))}this.affectedResources.appendChild(t)}violatingNodeIdName(e){return"FormLabelForNameError"===e?o.i18n.lockedString("Label"):Un(Dn.violatingNode)}update(){this.clear();const e=this.issue.getGenericIssues();e.size>0?this.#re(e):this.updateAffectedResourceCount(0)}}const Vn={nViolations:"{n, plural, =1 {# violation} other {# violations}}",element:"Element",invalidHeaderValue:"Invalid Header Value",request:"Request",untrustworthyOrigin:"Untrustworthy origin"},Bn=o.i18n.registerUIStrings("panels/issues/AttributionReportingIssueDetailsView.ts",Vn),_n=o.i18n.getLocalizedString.bind(void 0,Bn);class Wn extends Ws{getResourceNameWithCount(e){return _n(Vn.nViolations,{n:e})}update(){this.clear();const e=this.issue.getAttributionReportingIssues();e.size>0?this.#re(e.values().next().value.code(),e):this.updateAffectedResourceCount(0)}#re(e,t){const s=document.createElement("tr");switch(e){case"AttributionReportingIssue::InvalidRegisterSourceHeader":case"AttributionReportingIssue::InvalidRegisterTriggerHeader":case"AttributionReportingIssue::InvalidRegisterOsSourceHeader":case"AttributionReportingIssue::InvalidRegisterOsTriggerHeader":case"AttributionReportingIssue::OsSourceIgnored":case"AttributionReportingIssue::OsTriggerIgnored":case"AttributionReportingIssue::SourceIgnored":case"AttributionReportingIssue::TriggerIgnored":this.appendColumnTitle(s,_n(Vn.request)),this.appendColumnTitle(s,_n(Vn.invalidHeaderValue));break;case"AttributionReportingIssue::InsecureContext":case"AttributionReportingIssue::UntrustworthyReportingOrigin":this.appendColumnTitle(s,_n(Vn.element)),this.appendColumnTitle(s,_n(Vn.request)),this.appendColumnTitle(s,_n(Vn.untrustworthyOrigin));break;case"AttributionReportingIssue::PermissionPolicyDisabled":this.appendColumnTitle(s,_n(Vn.element)),this.appendColumnTitle(s,_n(Vn.request));break;case"AttributionReportingIssue::SourceAndTriggerHeaders":case"AttributionReportingIssue::WebAndOsHeaders":this.appendColumnTitle(s,_n(Vn.request))}this.affectedResources.appendChild(s);let n=0;for(const s of t)n++,this.#ae(e,s);this.updateAffectedResourceCount(n)}async#ae(e,t){const s=document.createElement("tr");s.classList.add("affected-resource-directive");const n=t.issueDetails;switch(e){case"AttributionReportingIssue::InvalidRegisterSourceHeader":case"AttributionReportingIssue::InvalidRegisterTriggerHeader":case"AttributionReportingIssue::SourceIgnored":case"AttributionReportingIssue::TriggerIgnored":this.#Ie(s,n.request),this.appendIssueDetailCell(s,n.invalidParameter||"");break;case"AttributionReportingIssue::InsecureContext":case"AttributionReportingIssue::UntrustworthyReportingOrigin":await this.#Me(s,t),this.#Ie(s,n.request),this.appendIssueDetailCell(s,n.invalidParameter||"");break;case"AttributionReportingIssue::PermissionPolicyDisabled":await this.#Me(s,t),this.#Ie(s,n.request);break;case"AttributionReportingIssue::SourceAndTriggerHeaders":this.#Ie(s,n.request)}this.affectedResources.appendChild(s)}async#Me(e,t){const s=t.issueDetails;if(void 0!==s.violatingNodeId){const n=t.model()?.target()||null;e.appendChild(await this.createElementCell({backendNodeId:s.violatingNodeId,target:n,nodeName:"Attribution source element"},t.getCategory()))}else this.appendIssueDetailCell(e,"")}#Ie(e,t){if(!t)return void this.appendIssueDetailCell(e,"");const s={additionalOnClickAction(){i.userMetrics.issuesPanelResourceOpened(P.Issue.IssueCategory.AttributionReporting,"Request")}};e.appendChild(this.createRequestCell(t,s))}}const qn={name:"Name",blocked:"blocked",nRequests:"{n, plural, =1 {# request} other {# requests}}",nResources:"{n, plural, =1 {# resource} other {# resources}}",restrictionStatus:"Restriction Status",warned:"Warned",affectedResources:"Affected Resources",learnMoreS:"Learn more: {PH1}",automaticallyUpgraded:"automatically upgraded",hideIssuesLikeThis:"Hide issues like this",unhideIssuesLikeThis:"Unhide issues like this"},zn=o.i18n.registerUIStrings("panels/issues/IssueView.ts",qn),Kn=o.i18n.getLocalizedString.bind(void 0,zn);class jn extends Ws{#Ne(e){let s=0;for(const n of e){const e=document.createElement("tr");e.classList.add("affected-resource-request");const o=this.issue.getCategory();let r=$n.get(o)||L.UIRequestLocation.UIRequestTabs.Headers;r===L.UIRequestLocation.UIRequestTabs.Headers&&t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.HEADER_OVERRIDES)&&(r=L.UIRequestLocation.UIRequestTabs.HeadersComponent),e.appendChild(this.createRequestCell(n,{networkTab:r,additionalOnClickAction(){i.userMetrics.issuesPanelResourceOpened(o,"Request")}})),this.affectedResources.appendChild(e),s++}this.updateAffectedResourceCount(s)}getResourceNameWithCount(e){return Kn(qn.nRequests,{n:e})}update(){this.clear();for(const e of this.issue.getBlockedByResponseDetails())return void this.updateAffectedResourceCount(0);this.issue.getCategory()!==P.Issue.IssueCategory.MixedContent?this.#Ne(this.issue.requests()):this.updateAffectedResourceCount(0)}}const $n=new Map([[P.Issue.IssueCategory.Cookie,L.UIRequestLocation.UIRequestTabs.Cookies],[P.Issue.IssueCategory.CrossOriginEmbedderPolicy,L.UIRequestLocation.UIRequestTabs.Headers],[P.Issue.IssueCategory.MixedContent,L.UIRequestLocation.UIRequestTabs.Headers]]);class Gn extends Ws{#Pe(e){const t=document.createElement("tr");this.appendColumnTitle(t,Kn(qn.name)),this.appendColumnTitle(t,Kn(qn.restrictionStatus)),this.affectedResources.appendChild(t);let s=0;for(const t of e){const e=t.getDetails();this.appendAffectedMixedContent(e),s++}this.updateAffectedResourceCount(s)}getResourceNameWithCount(e){return Kn(qn.nResources,{n:e})}appendAffectedMixedContent(e){const s=document.createElement("tr");if(s.classList.add("affected-resource-mixed-content"),e.request){let n=$n.get(this.issue.getCategory())||L.UIRequestLocation.UIRequestTabs.Headers;n===L.UIRequestLocation.UIRequestTabs.Headers&&t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.HEADER_OVERRIDES)&&(n=L.UIRequestLocation.UIRequestTabs.HeadersComponent),s.appendChild(this.createRequestCell(e.request,{networkTab:n,additionalOnClickAction(){i.userMetrics.issuesPanelResourceOpened(P.Issue.IssueCategory.MixedContent,"Request")}}))}else{const t=(n=e.insecureURL,(/[^/]+$/.exec(n)||/[^/]+\/$/.exec(n)||[""])[0]);this.appendIssueDetailCell(s,t,"affected-resource-mixed-content-info").title=e.insecureURL}var n;this.appendIssueDetailCell(s,Gn.translateStatus(e.resolutionStatus),"affected-resource-mixed-content-info"),this.affectedResources.appendChild(s)}static translateStatus(e){switch(e){case"MixedContentBlocked":return Kn(qn.blocked);case"MixedContentAutomaticallyUpgraded":return Kn(qn.automaticallyUpgraded);case"MixedContentWarning":return Kn(qn.warned)}}update(){this.clear(),this.#Pe(this.issue.getMixedContentIssues())}}class Yn extends n.TreeOutline.TreeElement{#Re;#ke;toggleOnClick;affectedResources;#Le;#V;#Ae=null;#Oe;#De;#Fe=!0;#Ue;#He=!1;constructor(t,s){super(),this.#Re=t,this.#ke=s,this.#De=new e.Throttler.Throttler(250),this.toggleOnClick=!0,this.listItemElement.classList.add("issue"),this.childrenListElement.classList.add("body"),this.childrenListElement.classList.add(Yn.getBodyCSSClass(this.#Re.getKind())),this.affectedResources=this.#Ve(),this.#Le=[new en(this,this.#Re),new rn(this,this.#Re),new jn(this,this.#Re),new Gn(this,this.#Re),new In(this,this.#Re),new Cn(this,this.#Re),new js(this,this.#Re),new Qs(this,this.#Re),new vn(this,this.#Re),new hn(this,this.#Re),new On(this,this.#Re),new Hn(this,this.#Re),new cn(this,this.#Re),new Wn(this,this.#Re),new tn(this,this.#Re),new Rn(this,this.#Re)],this.#Ue=new A.HideIssuesMenu.HideIssuesMenu,this.#V=null,this.#Oe=!1}setIssue(e){this.#Re!==e&&(this.#Fe=!0),this.#Re=e,this.#Le.forEach((t=>t.setIssue(e)))}static getBodyCSSClass(e){switch(e){case P.Issue.IssueKind.BreakingChange:return"issue-kind-breaking-change";case P.Issue.IssueKind.PageError:return"issue-kind-page-error";case P.Issue.IssueKind.Improvement:return"issue-kind-improvement"}}getIssueTitle(){return this.#ke.title}onattach(){this.#He?this.update():this.createContent()}createContent(){this.#b(),this.#Be(),this.appendChild(this.affectedResources);for(const e of this.#Le)this.appendAffectedResource(e),e.update();this.#_e(),this.updateAffectedResourceVisibility(),this.#He=!0}appendAffectedResource(e){this.affectedResources.appendChild(e)}#b(){const e=document.createElement("div");e.classList.add("header"),this.#Ae=new C.Icon.Icon,this.#Ae.classList.add("leading-issue-icon"),this.#V=document.createElement("span");const t=new T.Adorner.Adorner;t.data={name:"countWrapper",content:this.#V},t.classList.add("aggregated-issues-count"),e.appendChild(this.#Ae),e.appendChild(t);const s=document.createElement("div");s.classList.add("title"),s.textContent=this.#ke.title,e.appendChild(s),this.#Ue&&e.appendChild(this.#Ue),this.#We(),this.listItemElement.appendChild(e)}onexpand(){if(i.userMetrics.issuesPanelIssueExpanded(this.#Re.getCategory()),this.#Fe&&this.#pe(),!this.#Oe){this.#Oe=!0;for(const e of this.#Le)e.expandIfOneResource()}}#We(){if(this.#Ae){const e=this.#Re.getKind();this.#Ae.data=R.IssueCounter.getIssueKindIconData(e),this.#Ae.title=P.Issue.getIssueKindDescription(e)}if(this.#V&&(this.#V.textContent=`${this.#Re.getAggregatedIssuesCount()}`),this.listItemElement.classList.toggle("hidden-issue",this.#Re.isHidden()),this.#Ue){const e={menuItemLabel:this.#Re.isHidden()?Kn(qn.unhideIssuesLikeThis):Kn(qn.hideIssuesLikeThis),menuItemAction:()=>{const e=P.IssuesManager.getHideIssueByCodeSetting(),t=e.get();t[this.#Re.code()]=this.#Re.isHidden()?"Unhidden":"Hidden",e.set(t)}};this.#Ue.data=e}}updateAffectedResourceVisibility(){const e=this.#Le.every((e=>e.isEmpty()));this.affectedResources.hidden=e}#Ve(){const e=new n.TreeOutline.TreeElement;return e.setCollapsible(!1),e.setExpandable(!0),e.expand(),e.selectable=!1,e.listItemElement.classList.add("affected-resources-label"),e.listItemElement.textContent=Kn(qn.affectedResources),e.childrenListElement.classList.add("affected-resources"),e}#Be(){const e=new n.TreeOutline.TreeElement;e.setCollapsible(!1),e.selectable=!1;const t=new k.MarkdownView.MarkdownView;t.data={tokens:this.#ke.markdown},e.listItemElement.appendChild(t),this.appendChild(e)}#_e(){if(0===this.#ke.links.length)return;const e=new n.TreeOutline.TreeElement;e.setCollapsible(!1),e.listItemElement.classList.add("link-wrapper");const t=e.listItemElement.createChild("ul","link-list");for(const e of this.#ke.links){const s=n.Fragment.html`<x-link class="link devtools-link" tabindex="0" href="${e.link}">${Kn(qn.learnMoreS,{PH1:e.linkTitle})}</x-link>`,o=new C.Icon.Icon;o.data={iconName:"open-externally",color:"var(--icon-link)",width:"16px",height:"16px"},o.classList.add("link-icon"),s.prepend(o),s.addEventListener("x-link-invoke",(()=>{i.userMetrics.issuesPanelResourceOpened(this.#Re.getCategory(),"LearnMore")}));t.createChild("li").appendChild(s)}this.appendChild(e)}#pe(){this.expanded&&(this.#Le.forEach((e=>e.update())),this.updateAffectedResourceVisibility()),this.#Fe=!this.expanded,this.#We()}update(){this.#De.schedule((async()=>this.#pe()))}clear(){this.#Le.forEach((e=>e.clear()))}getIssueKind(){return this.#Re.getKind()}isForHiddenIssue(){return this.#Re.isHidden()}toggle(e){e||void 0===e&&!this.expanded?this.expand():this.collapse()}}const Qn={hideAllCurrentPageErrors:"Hide all current Page Errors",hideAllCurrentBreakingChanges:"Hide all current Breaking Changes",hideAllCurrentImprovements:"Hide all current Improvements"},Xn=o.i18n.registerUIStrings("panels/issues/IssueKindView.ts",Qn),Jn=o.i18n.getLocalizedString.bind(void 0,Xn);function Zn(){return e.Settings.Settings.instance().createSetting("groupIssuesByKind",!1)}class ei extends n.TreeOutline.TreeElement{#qe;#ze;constructor(e){super(void 0,!0),this.#qe=e,this.#ze=document.createElement("span"),this.toggleOnClick=!0,this.listItemElement.classList.add("issue-kind"),this.listItemElement.classList.add(function(e){switch(e){case P.Issue.IssueKind.BreakingChange:return"breaking-changes";case P.Issue.IssueKind.Improvement:return"improvements";case P.Issue.IssueKind.PageError:return"page-errors"}}(e)),this.childrenListElement.classList.add("issue-kind-body")}getKind(){return this.#qe}getHideAllCurrentKindString(){switch(this.#qe){case P.Issue.IssueKind.PageError:return Jn(Qn.hideAllCurrentPageErrors);case P.Issue.IssueKind.Improvement:return Jn(Qn.hideAllCurrentImprovements);case P.Issue.IssueKind.BreakingChange:return Jn(Qn.hideAllCurrentBreakingChanges)}}#b(){const e=document.createElement("div");e.classList.add("header");const t=new C.Icon.Icon;t.data=R.IssueCounter.getIssueKindIconData(this.#qe),t.classList.add("leading-issue-icon");const s=new T.Adorner.Adorner;s.data={name:"countWrapper",content:this.#ze},s.classList.add("aggregated-issues-count"),this.#ze.textContent="0";const n=document.createElement("div");n.classList.add("title"),n.textContent=P.Issue.getIssueKindName(this.#qe);const i=new A.HideIssuesMenu.HideIssuesMenu;i.classList.add("hide-available-issues"),i.data={menuItemLabel:this.getHideAllCurrentKindString(),menuItemAction:()=>{const e=P.IssuesManager.getHideIssueByCodeSetting(),t=e.get();for(const e of P.IssuesManager.IssuesManager.instance().issues())e.getKind()===this.#qe&&(t[e.code()]="Hidden");e.set(t)}},e.appendChild(t),e.appendChild(s),e.appendChild(n),e.appendChild(i),this.listItemElement.appendChild(e)}onattach(){this.#b(),this.expand()}update(e){this.#ze.textContent=`${e}`}}const ti={crossOriginEmbedderPolicy:"Cross Origin Embedder Policy",mixedContent:"Mixed Content",samesiteCookie:"SameSite Cookie",heavyAds:"Heavy Ads",contentSecurityPolicy:"Content Security Policy",other:"Other",lowTextContrast:"Low Text Contrast",cors:"Cross Origin Resource Sharing",groupDisplayedIssuesUnder:"Group displayed issues under associated categories",groupByCategory:"Group by category",groupDisplayedIssuesUnderKind:"Group displayed issues as Page errors, Breaking changes and Improvements",groupByKind:"Group by kind",includeCookieIssuesCausedBy:"Include cookie Issues caused by third-party sites",includeThirdpartyCookieIssues:"Include third-party cookie issues",onlyThirdpartyCookieIssues:"Only third-party cookie issues detected so far",noIssuesDetectedSoFar:"No issues detected so far",attributionReporting:"Attribution Reporting `API`",quirksMode:"Quirks Mode",generic:"Generic"},si=o.i18n.registerUIStrings("panels/issues/IssuesPane.ts",ti),ni=o.i18n.getLocalizedString.bind(void 0,si);class ii extends n.TreeOutline.TreeElement{#Ke;constructor(e){super(),this.#Ke=e,this.toggleOnClick=!0,this.listItemElement.classList.add("issue-category"),this.childrenListElement.classList.add("issue-category-body")}getCategoryName(){switch(this.#Ke){case P.Issue.IssueCategory.CrossOriginEmbedderPolicy:return ni(ti.crossOriginEmbedderPolicy);case P.Issue.IssueCategory.MixedContent:return ni(ti.mixedContent);case P.Issue.IssueCategory.Cookie:return ni(ti.samesiteCookie);case P.Issue.IssueCategory.HeavyAd:return ni(ti.heavyAds);case P.Issue.IssueCategory.ContentSecurityPolicy:return ni(ti.contentSecurityPolicy);case P.Issue.IssueCategory.LowTextContrast:return ni(ti.lowTextContrast);case P.Issue.IssueCategory.Cors:return ni(ti.cors);case P.Issue.IssueCategory.AttributionReporting:return ni(ti.attributionReporting);case P.Issue.IssueCategory.QuirksMode:return ni(ti.quirksMode);case P.Issue.IssueCategory.Generic:return ni(ti.generic);case P.Issue.IssueCategory.Other:return ni(ti.other)}}onattach(){this.#b()}#b(){const e=document.createElement("div");e.classList.add("header");const t=document.createElement("div");t.classList.add("title"),t.textContent=this.getCategoryName(),e.appendChild(t),this.listItemElement.appendChild(e)}}function oi(){return e.Settings.Settings.instance().createSetting("groupIssuesByCategory",!1)}let ri;class ai extends n.Widget.VBox{#je;#$e;#Ge;#Ye;#Qe;#Xe;#Je;#Ze;#et;#tt=Promise.resolve();constructor(){super(!0),this.contentElement.classList.add("issues-pane"),this.#je=new Map,this.#Ge=new Map,this.#$e=new Map,this.#Ye=null,this.#st(),this.#Qe=new n.TreeOutline.TreeOutlineInShadow,this.#Qe.setShowSelectionOnKeyboardFocus(!0),this.#Qe.contentElement.classList.add("issues"),this.contentElement.appendChild(this.#Qe.element),this.#Xe=new Os,this.#Qe.appendChild(this.#Xe),this.#Je=document.createElement("div"),this.#Je.classList.add("issues-pane-no-issues"),this.contentElement.appendChild(this.#Je),this.#Ze=P.IssuesManager.IssuesManager.instance(),this.#et=new Hs(this.#Ze),this.#et.addEventListener("AggregatedIssueUpdated",this.#nt,this),this.#et.addEventListener("FullUpdateRequired",this.#it,this),this.#Xe.hidden=0===this.#Ze.numberOfHiddenIssues(),this.#it(),this.#Ze.addEventListener("IssuesCountUpdated",this.#ot,this)}static instance(e={forceNew:null}){const{forceNew:t}=e;return ri&&!t||(ri=new ai),ri}elementsToRestoreScrollPositionsFor(){return[this.#Qe.element]}#st(){const e=this.contentElement.createChild("div","issues-toolbar-container");new n.Toolbar.Toolbar("issues-toolbar-left",e);const t=new n.Toolbar.Toolbar("issues-toolbar-right",e),s=oi(),i=new n.Toolbar.ToolbarSettingCheckbox(s,ni(ti.groupDisplayedIssuesUnder),ni(ti.groupByCategory));i.setVisible(!1),t.appendToolbarItem(i),s.addChangeListener((()=>{this.#rt(!0)}));const o=Zn(),r=new n.Toolbar.ToolbarSettingCheckbox(o,ni(ti.groupDisplayedIssuesUnderKind),ni(ti.groupByKind));t.appendToolbarItem(r),o.addChangeListener((()=>{this.#rt(!0)})),r.setVisible(!0);const a=P.Issue.getShowThirdPartyIssuesSetting();this.#Ye=new n.Toolbar.ToolbarSettingCheckbox(a,ni(ti.includeCookieIssuesCausedBy),ni(ti.includeThirdpartyCookieIssues)),t.appendToolbarItem(this.#Ye),this.setDefaultFocusedElement(this.#Ye.inputElement),t.appendSeparator();const l=new R.IssueCounter.IssueCounter;l.data={tooltipCallback:()=>{const e=R.IssueCounter.getIssueCountsEnumeration(P.IssuesManager.IssuesManager.instance(),!1);l.title=e},displayMode:"ShowAlways",issuesManager:P.IssuesManager.IssuesManager.instance()},l.id="console-issues-counter";const d=new n.Toolbar.ToolbarItem(l);return t.appendToolbarItem(d),{toolbarContainer:e}}#nt(e){this.#at(e.data)}#at(e){this.#tt=this.#tt.then((()=>this.#lt(e)))}async#lt(e){let t=this.#$e.get(e.aggregationKey());if(t){t.setIssue(e);const s=this.#dt(e);t.parent===s||s instanceof n.TreeOutline.TreeOutline&&t.parent===s.rootElement()||(t.parent?.removeChild(t),this.appendIssueViewToParent(t,s))}else{const s=e.getDescription();if(!s)return void console.warn("Could not find description for issue code:",e.code());const n=await P.MarkdownIssueDescription.createIssueDescriptionFromMarkdown(s);t=new Yn(e,n),this.#$e.set(e.aggregationKey(),t);const i=this.#dt(e);this.appendIssueViewToParent(t,i)}t.update(),this.#ot()}appendIssueViewToParent(e,t){t.appendChild(e,((e,t)=>e instanceof Os?1:t instanceof Os?-1:e instanceof Yn&&t instanceof Yn?e.getIssueTitle().localeCompare(t.getIssueTitle()):(console.error("The issues tree should only contain IssueView objects as direct children"),0)))}#dt(e){if(e.isHidden())return this.#Xe;if(Zn().get()){const t=e.getKind(),s=this.#Ge.get(t);if(s)return s;const n=new ei(t);return this.#Qe.appendChild(n,((e,t)=>e instanceof ei&&t instanceof ei?function(e,t){return e.getKind()===t.getKind()?0:e.getKind()===P.Issue.IssueKind.PageError||e.getKind()===P.Issue.IssueKind.BreakingChange&&t.getKind()===P.Issue.IssueKind.Improvement?-1:1}(e,t):0)),this.#Ge.set(t,n),n}if(oi().get()){const t=e.getCategory(),s=this.#je.get(t);if(s)return s;const n=new ii(t);return this.#Qe.appendChild(n,((e,t)=>e instanceof ii&&t instanceof ii?e.getCategoryName().localeCompare(t.getCategoryName()):0)),this.#je.set(t,n),n}return this.#Qe}#ct(e,t){for(const[s,n]of Array.from(e.entries()))t?.has(s)||(n.parent&&n.parent.removeChild(n),e.delete(s))}#it(){this.#rt(!1)}#rt(e){if(this.#ct(this.#je,e?void 0:this.#et.aggregatedIssueCategories()),this.#ct(this.#Ge,e?void 0:this.#et.aggregatedIssueKinds()),this.#ct(this.#$e,e?void 0:this.#et.aggregatedIssueCodes()),this.#et)for(const e of this.#et.aggregatedIssues())this.#at(e);this.#ot()}#ht(){for(const e of this.#Ge.values()){const t=this.#Ze.numberOfIssues(e.getKind());e.update(t)}}#ot(){this.#ut(this.#Ze.numberOfIssues(),this.#Ze.numberOfHiddenIssues()),Zn().get()&&this.#ht()}#ut(e,t){if(e>0||t>0){this.#Xe.hidden=0===t,this.#Xe.update(t),this.#Qe.element.hidden=!1,this.#Je.style.display="none";const e=this.#Qe.firstChild();e&&(e.select(!0),this.setDefaultFocusedElement(e.listItemElement))}else{this.#Qe.element.hidden=!0,this.#Ye&&this.setDefaultFocusedElement(this.#Ye.inputElement);const e=this.#Ze.numberOfAllStoredIssues()>0;this.#Je.textContent=ni(e?ti.onlyThirdpartyCookieIssues:ti.noIssuesDetectedSoFar),this.#Je.style.display="flex"}}async reveal(e){await this.#tt;const t=this.#et.keyForIssue(e),s=this.#$e.get(t);if(s){if(s.isForHiddenIssue()&&(this.#Xe.expand(),this.#Xe.reveal()),Zn().get()&&!s.isForHiddenIssue()){const e=this.#Ge.get(s.getIssueKind());e?.expand(),e?.reveal()}s.expand(),s.reveal(),s.select(!1,!0)}}wasShown(){super.wasShown(),this.#Qe.registerCSSFiles([Fs]),this.registerCSSFiles([Ds])}}const li=new CSSStyleSheet;li.replaceSync('.editing{box-shadow:var(--drop-shadow);background-color:var(--color-background);text-overflow:clip!important;padding-left:2px;margin-left:-2px;padding-right:2px;margin-right:-2px;margin-bottom:-1px;padding-bottom:1px;opacity:100%!important}.editing,\n.editing *{color:var(--color-text-primary)!important;text-decoration:none!important}.editing br{display:none}.adorner-reveal{margin:0 3px}.adorner-with-icon{display:flex;justify-content:center}.adorner-with-icon *:not(:last-child){margin-right:2px}.elements-disclosure{width:100%;display:inline-block;line-height:normal}.elements-disclosure li{padding:1px 0 0 14px;margin-left:-2px;word-break:normal;position:relative;min-height:15px;line-height:1.36;min-width:200px}.elements-disclosure li::after{content:"";position:absolute;inset:0;left:calc(var(--indent) * -1);width:var(--indent)}.elements-disclosure li.parent{display:flex}.elements-disclosure li.parent:not(.always-parent){margin-left:-12px}.elements-disclosure li .selected-hint::before{font-style:italic;content:" == $0";opacity:0%;position:absolute;white-space:pre}.elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) li.selected .selected-hint::before{position:static;opacity:60%}.elements-disclosure li.parent:not(.always-parent)::before{box-sizing:border-box;user-select:none;-webkit-mask-image:var(--image-file-triangle-right);height:14px;content:"\\A0\\A0";color:transparent;text-shadow:none;margin-left:-3px;margin-top:-1px;background-color:var(--icon-default);transition:transform 200ms}.elements-disclosure li.parent.expanded::before{transform:rotate(90deg)}.elements-disclosure li .selection{display:none;z-index:-1}.elements-disclosure li.selected .selection{display:block}.elements-disclosure li.elements-drag-over .selection{display:block;margin-top:-2px;border-top:2px solid var(--legacy-selection-bg-color)}.elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) .selection{background-color:var(--legacy-item-selection-inactive-bg-color)}.elements-disclosure li.hovered:not(.selected) .selection{display:block;left:3px;right:3px;background-color:var(--item-hover-color);border-radius:5px}.elements-disclosure li .webkit-html-tag.close{margin-left:-12px}.elements-disclosure .elements-tree-outline.hide-selection-when-blurred .selected:focus-visible .highlight > *{background:var(--legacy-focus-bg-color);border-radius:2px;box-shadow:0 0 0 2px var(--legacy-focus-bg-color)}.elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) li.selected:focus .selection{background-color:var(--legacy-item-selection-bg-color)}.elements-disclosure ol{list-style-type:none;padding-inline-start:12px;margin:0}.elements-disclosure ol.children{display:none;min-width:100%}.elements-disclosure ol.children.expanded{display:inline-block}.elements-disclosure > ol{position:relative;margin:0;min-width:100%;min-height:100%;padding-left:2px}.elements-disclosure li.in-clipboard .highlight{outline:1px dotted var(--color-details-hairline)}.elements-tree-outline ol.shadow-root-depth-4{--override-shadow-root-background-color:rgb(0 0 0/4%);background-color:var(--override-shadow-root-background-color)}.elements-tree-outline ol.shadow-root-depth-3{--override-shadow-root-background-color:rgb(0 0 0/3%);background-color:var(--override-shadow-root-background-color)}.elements-tree-outline ol.shadow-root-depth-2{--override-shadow-root-background-color:rgb(0 0 0/2%);background-color:var(--override-shadow-root-background-color)}.elements-tree-outline ol.shadow-root-depth-1{--override-shadow-root-background-color:rgb(0 0 0/1%);background-color:var(--override-shadow-root-background-color)}.elements-tree-outline ol.shadow-root-deep{background-color:transparent}.elements-tree-editor{box-shadow:var(--drop-shadow);margin-right:4px}button,\ninput,\nselect{font-family:inherit;font-size:inherit}.elements-gutter-decoration{position:absolute;top:3px;left:2px;height:9px;width:9px;border-radius:5px;border:1px solid var(--issue-color-yellow);background-color:var(--issue-color-yellow)}.elements-gutter-decoration.elements-has-decorated-children{opacity:50%}.add-attribute{margin-left:1px;margin-right:1px;white-space:nowrap}.elements-tree-nowrap,\n.elements-tree-nowrap .li{white-space:pre!important}.elements-disclosure .elements-tree-nowrap li{word-wrap:normal}@keyframes dom-update-highlight-animation{from{background-color:var(--color-syntax-2);color:var(--color-background)}80%{background-color:var(--color-syntax-8)}to{background-color:inherit}}@keyframes dom-update-highlight-animation-dark{from{background-color:var(--color-syntax-2);color:var(--color-background)}80%{background-color:var(--color-background);color:inherit}to{background-color:inherit}}.dom-update-highlight{animation:dom-update-highlight-animation 1.4s 1 cubic-bezier(0,0,0.2,1);border-radius:2px}:host-context(.-theme-with-dark-background) .dom-update-highlight{animation:dom-update-highlight-animation-dark 1.4s 1 cubic-bezier(0,0,0.2,1)}.elements-disclosure.single-node li{padding-left:2px}.elements-tree-shortcut-title,\n.elements-tree-shortcut-link{color:var(--color-text-secondary)}.elements-disclosure .gutter-container{position:absolute;top:0;left:0;width:15px;height:15px;z-index:1}.elements-hide-gutter .gutter-container{display:none}.gutter-container > devtools-icon{display:block;visibility:hidden;position:relative;left:-1px}.elements-disclosure li.selected .gutter-container:not(.has-decorations) > devtools-icon{visibility:visible}li.hovered:not(.always-parent) + ol.children,\n.elements-tree-outline ol.shadow-root,\nli.selected:not(.always-parent) + ol.children{background:linear-gradient(to right,var(--override-indentation-level-border-color),var(--override-indentation-level-border-color) 0.5px,transparent 0);background-position-x:5px;background-size:0.5px 100%;background-repeat:no-repeat}li.selected:not(.always-parent) + ol.children{--override-indentation-level-border-color:hsl(216deg 68% 80%/100%)!important}li.hovered:not(.always-parent) + ol.children:not(.shadow-root){--override-indentation-level-border-color:hsl(0deg 0% 0%/10%)}.elements-tree-outline ol.shadow-root{--override-indentation-level-border-color:hsl(0deg 0% 80%/100%)}@media (forced-colors: active){.elements-disclosure li.parent::before{forced-color-adjust:none;background-color:ButtonText!important}.elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) li.selected .selected-hint::before{opacity:unset}.elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) .selection,\n  .elements-disclosure li.hovered:not(.selected) .selection,\n  .elements-disclosure .elements-tree-outline:not(.hide-selection-when-blurred) li.selected:focus .selection{forced-color-adjust:none;background:canvas!important;border:1px solid Highlight!important}.gutter-container > devtools-icon{forced-color-adjust:none}}.violating-element{background-image:var(--image-file-errorWave);background-repeat:repeat-x;background-position:bottom;padding-bottom:1px}\n/*# sourceURL=elementsTreeOutline.css */\n');const di={reveal:"reveal"},ci=o.i18n.registerUIStrings("panels/elements/TopLayerContainer.ts",di),hi=o.i18n.getLocalizedString.bind(void 0,ci);class ui extends n.TreeOutline.TreeElement{tree;domModel;currentTopLayerDOMNodes=new Set;topLayerUpdateThrottler;constructor(t,s){super("#top-layer"),this.tree=t,this.domModel=s,this.topLayerUpdateThrottler=new e.Throttler.Throttler(1)}async throttledUpdateTopLayerElements(){await this.topLayerUpdateThrottler.schedule((()=>this.updateTopLayerElements()))}async updateTopLayerElements(){this.removeChildren(),this.removeCurrentTopLayerElementsAdorners(),this.currentTopLayerDOMNodes=new Set;const e=await this.domModel.getTopLayerElements();if(!e||0===e.length)return;let t=0;for(let n=0;n<e.length;n++){const i=this.domModel.idToDOMNode.get(e[n]);if(i&&"::backdrop"!==i.nodeName()){const o=new s.DOMModel.DOMNodeShortcut(this.domModel.target(),i.backendNodeId(),0,i.nodeName()),r=new xi(o);this.appendChild(r),this.currentTopLayerDOMNodes.add(i);const a=n>0?this.domModel.idToDOMNode.get(e[n-1]):void 0;if(a&&"::backdrop"===a.nodeName()){const e=new s.DOMModel.DOMNodeShortcut(this.domModel.target(),a.backendNodeId(),0,a.nodeName()),t=new xi(e);r.appendChild(t)}const l=this.tree.treeElementByNode.get(i);l&&this.addTopLayerAdorner(l,r,++t)}}}removeCurrentTopLayerElementsAdorners(){for(const e of this.currentTopLayerDOMNodes){this.tree.treeElementByNode.get(e)?.removeAllAdorners()}}addTopLayerAdorner(e,t,s){const n=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.TOP_LAYER),o=document.createElement("span");o.classList.add("adorner-with-icon");const r=new C.Icon.Icon;r.data={iconName:"select-element",color:"var(--icon-default)",width:"14px",height:"14px"};const a=document.createElement("span");a.textContent=` top-layer (${s}) `,o.append(r),o.append(a);const l=e?.adorn(n,o);if(l){const e=()=>{i.userMetrics.badgeActivated(7),t.revealAndSelect()};l.addInteraction(e,{isToggle:!1,shouldPropagateOnKeydown:!1,ariaLabelDefault:hi(di.reveal),ariaLabelActive:hi(di.reveal)}),l.addEventListener("mousedown",(e=>e.consume()),!1)}}}var pi=Object.freeze({__proto__:null,TopLayerContainer:ui});const mi={pageDom:"Page DOM",storeAsGlobalVariable:"Store as global variable",showAllNodesDMore:"Show All Nodes ({PH1} More)",reveal:"reveal",adornerSettings:"Badge settings…"},gi=o.i18n.registerUIStrings("panels/elements/ElementsTreeOutline.ts",mi),fi=o.i18n.getLocalizedString.bind(void 0,gi),yi=new WeakMap,Ci=new Set;class Si extends(e.ObjectWrapper.eventMixin(n.TreeOutline.TreeOutline)){treeElementByNode;shadowRoot;elementInternal;includeRootDOMNode;selectEnabled;rootDOMNodeInternal;selectedDOMNodeInternal;visible;imagePreviewPopover;updateRecords;treeElementsBeingUpdated;decoratorExtensions;showHTMLCommentsSetting;multilineEditing;visibleWidthInternal;clipboardNodeData;isXMLMimeTypeInternal;suppressRevealAndSelect=!1;previousHoveredElement;treeElementBeingDragged;dragOverTreeElement;updateModifiedNodesTimeout;#U=[];#pt=new Map;#Ze;#mt;#gt=new Map;constructor(s,i,o){if(super(),t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.HIGHLIGHT_ERRORS_ELEMENTS_PANEL)){this.#Ze=P.IssuesManager.IssuesManager.instance(),this.#Ze.addEventListener("IssueAdded",this.#ft,this);for(const e of this.#Ze.issues())e instanceof P.GenericIssue.GenericIssue&&this.#z(e)}this.treeElementByNode=new WeakMap;const r=document.createElement("div");this.shadowRoot=n.Utils.createShadowRootWithCoreStyles(r,{cssFile:[li,I.Style.default],delegatesFocus:void 0});const a=this.shadowRoot.createChild("div","elements-disclosure");this.elementInternal=this.element,this.elementInternal.classList.add("elements-tree-outline","source-code"),o&&this.elementInternal.classList.add("elements-hide-gutter"),n.ARIAUtils.setLabel(this.elementInternal,fi(mi.pageDom)),this.elementInternal.addEventListener("focusout",this.onfocusout.bind(this),!1),this.elementInternal.addEventListener("mousedown",this.onmousedown.bind(this),!1),this.elementInternal.addEventListener("mousemove",this.onmousemove.bind(this),!1),this.elementInternal.addEventListener("mouseleave",this.onmouseleave.bind(this),!1),this.elementInternal.addEventListener("dragstart",this.ondragstart.bind(this),!1),this.elementInternal.addEventListener("dragover",this.ondragover.bind(this),!1),this.elementInternal.addEventListener("dragleave",this.ondragleave.bind(this),!1),this.elementInternal.addEventListener("drop",this.ondrop.bind(this),!1),this.elementInternal.addEventListener("dragend",this.ondragend.bind(this),!1),this.elementInternal.addEventListener("contextmenu",this.contextMenuEventFired.bind(this),!1),this.elementInternal.addEventListener("clipboard-beforecopy",this.onBeforeCopy.bind(this),!1),this.elementInternal.addEventListener("clipboard-copy",this.onCopyOrCut.bind(this,!1),!1),this.elementInternal.addEventListener("clipboard-cut",this.onCopyOrCut.bind(this,!0),!1),this.elementInternal.addEventListener("clipboard-paste",this.onPaste.bind(this),!1),this.elementInternal.addEventListener("keydown",this.onKeyDown.bind(this),!1),a.appendChild(this.elementInternal),this.element=r,this.includeRootDOMNode=!s,this.selectEnabled=i,this.rootDOMNodeInternal=null,this.selectedDOMNodeInternal=null,this.visible=!1,this.imagePreviewPopover=new ee(this.contentElement,(e=>{let t=e.target;for(;t&&!ee.getImageURL(t);)t=t.parentElementOrShadowHost();return t}),(e=>{const t=n.UIUtils.enclosingNodeOrSelfWithNodeName(e,"li");if(!t)return null;const s=n.TreeOutline.TreeElement.getTreeElementBylistItemNode(t);return s?s.node():null})),this.updateRecords=new Map,this.treeElementsBeingUpdated=new Set,this.decoratorExtensions=null,this.showHTMLCommentsSetting=e.Settings.Settings.instance().moduleSetting("showHTMLComments"),this.showHTMLCommentsSetting.addChangeListener(this.onShowHTMLCommentsChange.bind(this)),this.setUseLightSelectionColor(!0),t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.HIGHLIGHT_ERRORS_ELEMENTS_PANEL)&&(this.#mt=new n.PopoverHelper.PopoverHelper(this.elementInternal,(e=>{const t=e.composedPath()[0];if(!t||!t.matches(".violating-element"))return null;const s=this.#gt.get(t);if(!s)return null;const i=s.details(),o=this.#yt(i.errorType),r=new C.Icon.Icon;r.data=R.IssueCounter.getIssueKindIconData(s.getKind()),r.style.cursor="pointer";const a=document.createElement("a");a.href="#",a.textContent="View issue:";const l=document.createElement("span");l.textContent=o;const d=document.createElement("div");return d.appendChild(r),d.appendChild(a),d.appendChild(l),d.style.display="flex",d.style.alignItems="center",d.style.gap="5px",{box:t.boxInWindow(),show:async e=>{e.setIgnoreLeftMargin(!0);const t=()=>{n.ViewManager.ViewManager.instance().showView("issues-pane"),ai.instance().reveal(s)};return a.addEventListener("click",(()=>t())),r.addEventListener("click",(()=>t())),e.contentElement.appendChild(d),!0}}})),this.#mt.setTimeout(300),this.#mt.setHasPadding(!0))}#yt(e){switch(e){case"FormLabelForNameError":case"FormLabelForMatchesNonExistingIdError":return"Incorrect use of <label for=FORM_ELEMENT>";case"FormDuplicateIdForInputError":return"Duplicate form field id in the same form";case"FormInputWithNoLabelError":return"Form field without valid aria-labelledby attribute or associated label";case"FormAutocompleteAttributeEmptyError":return"Incorrect use of autocomplete attribute";case"FormEmptyIdAndNameAttributesForInputError":return"A form field element should have an id or name attribute";case"FormAriaLabelledByToNonExistingId":return"An aria-labelledby attribute doesn't match any element id";case"FormInputAssignedAutocompleteValueToIdOrNameAttributeError":return"An element doesn't have an autocomplete attribute";case"FormLabelHasNeitherForNorNestedInput":return"No label associated with a form field";case"FormInputHasWrongButWellIntendedAutocompleteValueError":return"Non-standard autocomplete attribute value";default:return""}}static forDOMModel(e){return yi.get(e)||null}async#ft(e){e.data.issue instanceof P.GenericIssue.GenericIssue&&(this.#z(e.data.issue),await this.#Ct(e.data.issue))}#z(e){this.#U.push(e)}#St(){for(const e of this.#U)this.#Ct(e)}async#Ct(e){const t=e.details();if(!this.#yt(t.errorType))return;if(!this.rootDOMNode||!t.violatingNodeId)return;const n=new s.DOMModel.DeferredDOMNode(this.rootDOMNode.domModel().target(),t.violatingNodeId),i=await n.resolvePromise();if(!i)return;const o=this.findTreeElement(i);if(o){o.addIssue(e);const t=o.issuesByNodeElement;for(const[e,s]of t)this.#gt.set(e,s)}}onShowHTMLCommentsChange(){const e=this.selectedDOMNode();e&&e.nodeType()===Node.COMMENT_NODE&&!this.showHTMLCommentsSetting.get()&&this.selectDOMNode(e.parentNode),this.update()}setWordWrap(e){this.elementInternal.classList.toggle("elements-tree-nowrap",!e)}setMultilineEditing(e){this.multilineEditing=e}visibleWidth(){return this.visibleWidthInternal||0}setVisibleWidth(e){this.visibleWidthInternal=e,this.multilineEditing&&this.multilineEditing.resize()}setClipboardData(e){if(this.clipboardNodeData){const e=this.findTreeElement(this.clipboardNodeData.node);e&&e.setInClipboard(!1),delete this.clipboardNodeData}if(e){const t=this.findTreeElement(e.node);t&&t.setInClipboard(!0),this.clipboardNodeData=e}}resetClipboardIfNeeded(e){this.clipboardNodeData&&this.clipboardNodeData.node===e&&this.setClipboardData(null)}onBeforeCopy(e){e.handled=!0}onCopyOrCut(e,t){this.setClipboardData(null);const s=t.original;if(!s||!s.target)return;if(s.target instanceof Node&&s.target.hasSelection())return;if(n.UIUtils.isEditing())return;const i=this.selectedDOMNode();i&&s.clipboardData&&(s.clipboardData.clearData(),t.handled=!0,this.performCopyOrCut(e,i))}performCopyOrCut(e,t){t&&(e&&(t.isShadowRoot()||t.ancestorUserAgentShadowRoot())||(t.copyNode(),this.setClipboardData({node:t,isCut:e})))}canPaste(e){if(e.isShadowRoot()||e.ancestorUserAgentShadowRoot())return!1;if(!this.clipboardNodeData)return!1;const t=this.clipboardNodeData.node;return(!this.clipboardNodeData.isCut||t!==e&&!t.isAncestor(e))&&e.domModel()===t.domModel()}pasteNode(e){this.canPaste(e)&&this.performPaste(e)}duplicateNode(e){this.performDuplicate(e)}onPaste(e){if(n.UIUtils.isEditing())return;const t=this.selectedDOMNode();t&&this.canPaste(t)&&(e.handled=!0,this.performPaste(t))}performPaste(e){function t(e,t){!e&&t&&this.selectDOMNode(t)}this.clipboardNodeData&&(this.clipboardNodeData.isCut?(this.clipboardNodeData.node.moveTo(e,null,t.bind(this)),this.setClipboardData(null)):this.clipboardNodeData.node.copyTo(e,null,t.bind(this)))}performDuplicate(e){if(e.isInShadowTree())return;const t=e.parentNode?e.parentNode:e;"#document"!==t.nodeName()&&e.copyTo(t,e.nextSibling)}setVisible(e){if(e!==this.visible){if(this.visible=e,!this.visible)return this.imagePreviewPopover.hide(),void(this.multilineEditing&&this.multilineEditing.cancel());this.runPendingUpdates(),this.selectedDOMNodeInternal&&this.revealAndSelectNode(this.selectedDOMNodeInternal,!1)}}get rootDOMNode(){return this.rootDOMNodeInternal}set rootDOMNode(e){this.rootDOMNodeInternal!==e&&(this.rootDOMNodeInternal=e,this.isXMLMimeTypeInternal=e&&e.isXMLNode(),this.update())}get isXMLMimeType(){return Boolean(this.isXMLMimeTypeInternal)}selectedDOMNode(){return this.selectedDOMNodeInternal}selectDOMNode(e,t){this.selectedDOMNodeInternal!==e?(this.selectedDOMNodeInternal=e,this.revealAndSelectNode(e,!t),this.selectedDOMNodeInternal===e&&this.selectedNodeChanged(Boolean(t))):this.revealAndSelectNode(e,!t)}editing(){const e=this.selectedDOMNode();if(!e)return!1;const t=this.findTreeElement(e);return t&&t.isEditing()||!1}update(){const e=this.selectedDOMNode();if(this.removeChildren(),this.rootDOMNode){if(this.includeRootDOMNode){const e=this.createElementTreeElement(this.rootDOMNode);this.appendChild(e)}else{const e=this.visibleChildren(this.rootDOMNode);for(const t of e){const e=this.createElementTreeElement(t);this.appendChild(e)}}this.createTopLayerContainer(this.rootElement(),this.rootDOMNode.domModel()),e&&this.revealAndSelectNode(e,!0)}}selectedNodeChanged(e){this.dispatchEventToListeners(Si.Events.SelectedNodeChanged,{node:this.selectedDOMNodeInternal,focus:e})}fireElementsTreeUpdated(e){this.dispatchEventToListeners(Si.Events.ElementsTreeUpdated,e)}findTreeElement(e){let t=this.lookUpTreeElement(e);return t||e.nodeType()!==Node.TEXT_NODE||(t=this.lookUpTreeElement(e.parentNode)),t}lookUpTreeElement(e){if(!e)return null;const t=this.treeElementByNode.get(e);if(t)return t;const s=[];let n;for(n=e.parentNode;n&&(s.push(n),!this.treeElementByNode.has(n));n=n.parentNode);if(!n)return null;for(let t=s.length-1;t>=0;--t){const n=s[t-1]||e,i=this.treeElementByNode.get(s[t]);i&&(i.onpopulate(),n.index&&n.index>=i.expandedChildrenLimit()&&this.setExpandedChildrenLimit(i,n.index+1))}return this.treeElementByNode.get(e)||null}createTreeElementFor(e){let t=this.findTreeElement(e);return t||(e.parentNode?(t=this.createTreeElementFor(e.parentNode),t?this.showChild(t,e):null):null)}revealAndSelectNode(e,t){if(this.suppressRevealAndSelect)return;if(!this.includeRootDOMNode&&e===this.rootDOMNode&&this.rootDOMNode&&(e=this.rootDOMNode.firstChild),!e)return;const s=this.createTreeElementFor(e);s&&s.revealAndSelect(t)}treeElementFromEventInternal(e){if(!this.element.parentElement)return null;const t=e.pageX,s=e.pageY,n=this.treeElementFromPoint(t,s);let i;return i=n===this.treeElementFromPoint(t,s-2)?n:this.treeElementFromPoint(t,s+2),i}onfocusout(e){s.OverlayModel.OverlayModel.hideDOMNodeHighlight()}onmousedown(e){const t=this.treeElementFromEventInternal(e);t&&t.select()}setHoverEffect(e){this.previousHoveredElement!==e&&(this.previousHoveredElement instanceof Hi&&(this.previousHoveredElement.hovered=!1,delete this.previousHoveredElement),e instanceof Hi&&(e.hovered=!0,this.previousHoveredElement=e))}onmousemove(e){const t=this.treeElementFromEventInternal(e);t&&this.previousHoveredElement===t||(this.setHoverEffect(t),this.highlightTreeElement(t,!n.KeyboardShortcut.KeyboardShortcut.eventHasEitherCtrlOrMeta(e)))}highlightTreeElement(e,t){e instanceof Hi?e.node().domModel().overlayModel().highlightInOverlay({node:e.node(),selectorList:void 0},"all",t):e instanceof xi&&e.domModel().overlayModel().highlightInOverlay({deferredNode:e.deferredNode(),selectorList:void 0},"all",t)}onmouseleave(e){this.setHoverEffect(null),s.OverlayModel.OverlayModel.hideDOMNodeHighlight()}ondragstart(e){const t=e.target;if(!t||t.hasSelection())return!1;if("A"===t.nodeName)return!1;const n=this.validDragSourceOrTarget(this.treeElementFromEventInternal(e));return!!n&&("BODY"!==n.node().nodeName()&&"HEAD"!==n.node().nodeName()&&(e.dataTransfer&&n.listItemElement.textContent?(e.dataTransfer.setData("text/plain",n.listItemElement.textContent.replace(/\u200b/g,"")),e.dataTransfer.effectAllowed="copyMove",this.treeElementBeingDragged=n,s.OverlayModel.OverlayModel.hideDOMNodeHighlight(),!0):void 0))}ondragover(e){if(!this.treeElementBeingDragged)return!1;const t=this.validDragSourceOrTarget(this.treeElementFromEventInternal(e));if(!t)return!1;let s=t.node();for(;s;){if(s===this.treeElementBeingDragged.nodeInternal)return!1;s=s.parentNode}return t.listItemElement.classList.add("elements-drag-over"),this.dragOverTreeElement=t,e.preventDefault(),e.dataTransfer&&(e.dataTransfer.dropEffect="move"),!1}ondragleave(e){return this.clearDragOverTreeElementMarker(),e.preventDefault(),!1}validDragSourceOrTarget(e){if(!e)return null;if(!(e instanceof Hi))return null;const t=e,s=t.node();return s.parentNode&&s.parentNode.nodeType()===Node.ELEMENT_NODE?t:null}ondrop(e){e.preventDefault();const t=this.treeElementFromEventInternal(e);t instanceof Hi&&this.doMove(t)}doMove(e){if(!this.treeElementBeingDragged)return;let t,s;if(e.isClosingTag())t=e.node();else{const n=e.node();t=n.parentNode,s=n}if(!t||!s)return;const n=this.treeElementBeingDragged.expanded;this.treeElementBeingDragged.nodeInternal.moveTo(t,s,this.selectNodeAfterEdit.bind(this,n)),delete this.treeElementBeingDragged}ondragend(e){e.preventDefault(),this.clearDragOverTreeElementMarker(),delete this.treeElementBeingDragged}clearDragOverTreeElementMarker(){this.dragOverTreeElement&&(this.dragOverTreeElement.listItemElement.classList.remove("elements-drag-over"),delete this.dragOverTreeElement)}contextMenuEventFired(e){const t=this.treeElementFromEventInternal(e);t instanceof Hi&&this.showContextMenu(t,e)}showContextMenu(e,t){if(n.UIUtils.isEditing())return;const s=new n.ContextMenu.ContextMenu(t),i=Boolean(e.node().pseudoType()),o=e.node().nodeType()===Node.ELEMENT_NODE&&!i,r=t.target;if(!r)return;let a=r.enclosingNodeOrSelfWithClass("webkit-html-text-node");a&&a.classList.contains("bogus")&&(a=null);const l=r.enclosingNodeOrSelfWithClass("webkit-html-comment");s.saveSection().appendItem(fi(mi.storeAsGlobalVariable),this.saveNodeToTempVariable.bind(this,e.node())),a?e.populateTextContextMenu(s,a):o?e.populateTagContextMenu(s,t):l?e.populateNodeContextMenu(s):i&&e.populateScrollIntoView(s),s.viewSection().appendItem(fi(mi.adornerSettings),(()=>{eo.instance().showAdornerSettingsPane()})),s.appendApplicableItems(e.node()),s.show()}async saveNodeToTempVariable(e){const t=await e.resolveToObject(),i=t?.runtimeModel().target()?.model(s.ConsoleModel.ConsoleModel);await(i?.saveToTempVariable(n.Context.Context.instance().flavor(s.RuntimeModel.ExecutionContext),t))}runPendingUpdates(){this.updateModifiedNodes()}onKeyDown(e){const t=e;if(n.UIUtils.isEditing())return;const s=this.selectedDOMNode();if(!s)return;const i=this.treeElementByNode.get(s);if(i&&n.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(t)&&s.parentNode){if("ArrowUp"===t.key&&s.previousSibling)return s.moveTo(s.parentNode,s.previousSibling,this.selectNodeAfterEdit.bind(this,i.expanded)),void t.consume(!0);if("ArrowDown"===t.key&&s.nextSibling)return s.moveTo(s.parentNode,s.nextSibling.nextSibling,this.selectNodeAfterEdit.bind(this,i.expanded)),void t.consume(!0)}}toggleEditAsHTML(e,t,s){const n=this.treeElementByNode.get(e);if(!n||!n.hasEditableNode())return;if(e.pseudoType())return;const i=e.parentNode,o=e.index,r=n.expanded;n.toggleEditAsHTML(function(e){s&&s();if(!e)return;if(this.runPendingUpdates(),!o)return;const t=i&&i.children(),n=t&&t[o]||i;if(!n)return;if(this.selectDOMNode(n,!0),r){const e=this.findTreeElement(n);e&&e.expand()}}.bind(this),t)}selectNodeAfterEdit(e,t,s){if(t)return null;if(this.runPendingUpdates(),!s)return null;this.selectDOMNode(s,!0);const n=this.findTreeElement(s);return e&&n&&n.expand(),n}async toggleHideElement(e){const t=e.pseudoType(),s=t?e.parentNode:e;if(!s)return;const n=e.marker("hidden-marker"),i=await s.resolveToObject("");i&&(await i.callFunction((function(e,t){const s="__web-inspector-hide-shortcut-style__",n=[];n.push(".__web-inspector-hide-shortcut__"),n.push(".__web-inspector-hide-shortcut__ *"),n.push(".__web-inspector-hidebefore-shortcut__::before"),n.push(".__web-inspector-hideafter-shortcut__::after");const i=n.join(", "),o="\n"+i+"\n{\n    visibility: hidden !important;\n}\n",r="__web-inspector-hide"+(e||"")+"-shortcut__";this.classList.toggle(r,t);let a=this;for(;a.parentNode;)a=a.parentNode;a.nodeType===Node.DOCUMENT_NODE&&(a=document.head);let l=a.querySelector("style#"+s);if(l)return;l=document.createElement("style"),l.id=s,l.textContent=o,a.appendChild(l)}),[{value:t},{value:!n}]),i.release(),e.setMarker("hidden-marker",!n||null))}isToggledToHidden(e){return Boolean(e.marker("hidden-marker"))}reset(){this.rootDOMNode=null,this.selectDOMNode(null,!1),this.imagePreviewPopover.hide(),delete this.clipboardNodeData,s.OverlayModel.OverlayModel.hideDOMNodeHighlight(),this.updateRecords.clear()}wireToDOMModel(e){yi.set(e,this),e.addEventListener(s.DOMModel.Events.MarkersChanged,this.markersChanged,this),e.addEventListener(s.DOMModel.Events.NodeInserted,this.nodeInserted,this),e.addEventListener(s.DOMModel.Events.NodeRemoved,this.nodeRemoved,this),e.addEventListener(s.DOMModel.Events.AttrModified,this.attributeModified,this),e.addEventListener(s.DOMModel.Events.AttrRemoved,this.attributeRemoved,this),e.addEventListener(s.DOMModel.Events.CharacterDataModified,this.characterDataModified,this),e.addEventListener(s.DOMModel.Events.DocumentUpdated,this.documentUpdated,this),e.addEventListener(s.DOMModel.Events.ChildNodeCountUpdated,this.childNodeCountUpdated,this),e.addEventListener(s.DOMModel.Events.DistributedNodesChanged,this.distributedNodesChanged,this),e.addEventListener(s.DOMModel.Events.TopLayerElementsChanged,this.topLayerElementsChanged,this)}unwireFromDOMModel(e){e.removeEventListener(s.DOMModel.Events.MarkersChanged,this.markersChanged,this),e.removeEventListener(s.DOMModel.Events.NodeInserted,this.nodeInserted,this),e.removeEventListener(s.DOMModel.Events.NodeRemoved,this.nodeRemoved,this),e.removeEventListener(s.DOMModel.Events.AttrModified,this.attributeModified,this),e.removeEventListener(s.DOMModel.Events.AttrRemoved,this.attributeRemoved,this),e.removeEventListener(s.DOMModel.Events.CharacterDataModified,this.characterDataModified,this),e.removeEventListener(s.DOMModel.Events.DocumentUpdated,this.documentUpdated,this),e.removeEventListener(s.DOMModel.Events.ChildNodeCountUpdated,this.childNodeCountUpdated,this),e.removeEventListener(s.DOMModel.Events.DistributedNodesChanged,this.distributedNodesChanged,this),e.removeEventListener(s.DOMModel.Events.TopLayerElementsChanged,this.topLayerElementsChanged,this),yi.delete(e)}addUpdateRecord(e){let t=this.updateRecords.get(e);return t||(t=new Ei,this.updateRecords.set(e,t)),t}updateRecordForHighlight(e){return this.visible&&this.updateRecords.get(e)||null}documentUpdated(e){const s=e.data;this.reset(),s.existingDocument()&&(this.rootDOMNode=s.existingDocument(),t.Runtime.experiments.isEnabled(t.Runtime.ExperimentName.HIGHLIGHT_ERRORS_ELEMENTS_PANEL)&&this.#St())}attributeModified(e){const{node:t}=e.data;this.addUpdateRecord(t).attributeModified(e.data.name),this.updateModifiedNodesSoon()}attributeRemoved(e){const{node:t}=e.data;this.addUpdateRecord(t).attributeRemoved(e.data.name),this.updateModifiedNodesSoon()}characterDataModified(e){const t=e.data;this.addUpdateRecord(t).charDataModified(),t.parentNode&&t.parentNode.firstChild===t.parentNode.lastChild&&this.addUpdateRecord(t.parentNode).childrenModified(),this.updateModifiedNodesSoon()}nodeInserted(e){const t=e.data;this.addUpdateRecord(t.parentNode).nodeInserted(t),this.updateModifiedNodesSoon()}nodeRemoved(e){const{node:t,parent:s}=e.data;this.resetClipboardIfNeeded(t),this.addUpdateRecord(s).nodeRemoved(t),this.updateModifiedNodesSoon()}childNodeCountUpdated(e){const t=e.data;this.addUpdateRecord(t).childrenModified(),this.updateModifiedNodesSoon()}distributedNodesChanged(e){const t=e.data;this.addUpdateRecord(t).childrenModified(),this.updateModifiedNodesSoon()}updateModifiedNodesSoon(){this.updateRecords.size&&(this.updateModifiedNodesTimeout||(this.updateModifiedNodesTimeout=window.setTimeout(this.updateModifiedNodes.bind(this),50)))}updateModifiedNodes(){this.updateModifiedNodesTimeout&&(clearTimeout(this.updateModifiedNodesTimeout),delete this.updateModifiedNodesTimeout);const e=[...this.updateRecords.keys()],t=e.length>10;let s,n;t&&(s=this.element.parentNode,n=s?s.scrollTop:0,this.elementInternal.classList.add("hidden"));const i=this.rootDOMNodeInternal&&this.updateRecords.get(this.rootDOMNodeInternal);if(i&&i.hasChangedChildren())this.update();else for(const[e,t]of this.updateRecords)t.hasChangedChildren()?this.updateModifiedParentNode(e):this.updateModifiedNode(e);t&&(this.elementInternal.classList.remove("hidden"),s&&n&&(s.scrollTop=n)),this.updateRecords.clear(),this.fireElementsTreeUpdated(e)}updateModifiedNode(e){const t=this.findTreeElement(e);t&&t.updateTitle(this.updateRecordForHighlight(e))}updateModifiedParentNode(e){const t=this.findTreeElement(e);t&&(t.setExpandable(this.hasVisibleChildren(e)),t.updateTitle(this.updateRecordForHighlight(e)),Ci.has(t)&&this.updateChildren(t))}populateTreeElement(e){return e.childCount()||!e.isExpandable()?Promise.resolve():new Promise((t=>{e.node().getChildNodes((()=>{Ci.add(e),this.updateModifiedParentNode(e.node()),t()}))}))}async createTopLayerContainer(e,t){if(!(e.treeOutline&&e.treeOutline instanceof Si))return;const s=new ui(e.treeOutline,t);await s.throttledUpdateTopLayerElements(),s.currentTopLayerDOMNodes.size>0&&e.appendChild(s),this.#pt.set(e,s)}createElementTreeElement(e,t){const s=new Hi(e,t);return s.setExpandable(!t&&this.hasVisibleChildren(e)),e.nodeType()===Node.ELEMENT_NODE&&e.parentNode&&e.parentNode.nodeType()===Node.DOCUMENT_NODE&&!e.parentNode.parentNode&&s.setCollapsible(!1),e.hasAssignedSlot()&&s.createSlotLink(e.assignedSlot),s.selectable=Boolean(this.selectEnabled),s}showChild(e,t){if(e.isClosingTag())return null;const s=this.visibleChildren(e.node()).indexOf(t);return-1===s?null:(s>=e.expandedChildrenLimit()&&this.setExpandedChildrenLimit(e,s+1),e.childAt(s))}visibleChildren(e){let t=Hi.visibleShadowRoots(e);const s=e.contentDocument();s&&t.push(s);const n=e.templateContent();n&&t.push(n),t.push(...e.viewTransitionPseudoElements());const i=e.markerPseudoElement();i&&t.push(i);const o=e.beforePseudoElement();if(o&&t.push(o),e.childNodeCount()){let s=e.children()||[];this.showHTMLCommentsSetting.get()||(s=s.filter((e=>e.nodeType()!==Node.COMMENT_NODE))),t=t.concat(s)}const r=e.afterPseudoElement();r&&t.push(r);const a=e.backdropPseudoElement();return a&&t.push(a),t}hasVisibleChildren(e){return!!e.isIframe()||(!!e.isPortal()||(!!e.contentDocument()||(!!e.templateContent()||(!!Hi.visibleShadowRoots(e).length||(!!e.hasPseudoElements()||(!!e.isInsertionPoint()||Boolean(e.childNodeCount())&&!Hi.canShowInlineText(e)))))))}createExpandAllButtonTreeElement(e){const t=n.UIUtils.createTextButton("",function(t){const s=this.visibleChildren(e.node()).length;this.setExpandedChildrenLimit(e,Math.max(s,e.expandedChildrenLimit()+Vi)),t.consume()}.bind(this));t.value="";const s=new n.TreeOutline.TreeElement(t);return s.selectable=!1,s.button=t,s}setExpandedChildrenLimit(e,t){e.expandedChildrenLimit()!==t&&(e.setExpandedChildrenLimit(t),e.treeOutline&&!this.treeElementsBeingUpdated.has(e)&&this.updateModifiedParentNode(e.node()))}updateChildren(e){if(!e.isExpandable()){if(!e.treeOutline)return;const t=e.treeOutline.selectedTreeElement;return t&&t.hasAncestor(e)&&e.select(!0),void e.removeChildren()}console.assert(!e.isClosingTag()),this.innerUpdateChildren(e)}insertChildElement(e,t,s,n){const i=this.createElementTreeElement(t,n);return e.insertChild(i,s),t.nodeType()===Node.DOCUMENT_NODE&&this.createTopLayerContainer(i,t.domModel()),i}moveChild(e,t,s){if(e.indexOfChild(t)===s)return;const n=t.selected;t.parent&&t.parent.removeChild(t),e.insertChild(t,s),n&&t.select()}innerUpdateChildren(e){if(this.treeElementsBeingUpdated.has(e))return;this.treeElementsBeingUpdated.add(e);const t=e.node(),s=this.visibleChildren(t),n=new Set(s),i=new Map;for(let t=e.childCount()-1;t>=0;--t){const s=e.childAt(t);if(!(s instanceof Hi)){e.removeChildAtIndex(t);continue}const o=s.node();n.has(o)?i.set(o,s):e.removeChildAtIndex(t)}for(let n=0;n<s.length&&n<e.expandedChildrenLimit();++n){const o=s[n],r=i.get(o)||this.findTreeElement(o);if(r&&r!==e)this.moveChild(e,r,n);else{const s=this.insertChildElement(e,o,n);this.updateRecordForHighlight(t)&&e.expanded&&Hi.animateOnDOMUpdate(s),e.childCount()>e.expandedChildrenLimit()&&this.setExpandedChildrenLimit(e,e.expandedChildrenLimit()+1)}}const o=e.childCount();if(s.length>o){const t=o;e.expandAllButtonElement||(e.expandAllButtonElement=this.createExpandAllButtonTreeElement(e)),e.insertChild(e.expandAllButtonElement,t),e.expandAllButtonElement.title=fi(mi.showAllNodesDMore,{PH1:s.length-o})}else e.expandAllButtonElement&&(e.expandAllButtonElement=null);if(t.isInsertionPoint())for(const s of t.distributedNodes())e.appendChild(new xi(s));t.nodeType()===Node.ELEMENT_NODE&&!t.pseudoType()&&e.isExpandable()&&this.insertChildElement(e,t,e.childCount(),!0),this.treeElementsBeingUpdated.delete(e)}markersChanged(e){const t=e.data,s=this.treeElementByNode.get(t);s&&s.updateDecorations()}async topLayerElementsChanged(){for(const[e,t]of this.#pt)await t.throttledUpdateTopLayerElements(),t.currentTopLayerDOMNodes.size>0&&t.parent!==e&&e.appendChild(t),t.hidden=0===t.currentTopLayerDOMNodes.size}static treeOutlineSymbol=Symbol("treeOutline")}!function(e){let t;!function(e){e.SelectedNodeChanged="SelectedNodeChanged",e.ElementsTreeUpdated="ElementsTreeUpdated"}(t=e.Events||(e.Events={}))}(Si||(Si={}));const bi=new Map([[" ","nbsp"],["­","shy"],[" ","ensp"],[" ","emsp"],[" ","thinsp"],[" ","hairsp"],["​","ZeroWidthSpace"],["‌","zwnj"],["‍","zwj"],["‎","lrm"],["‏","rlm"],["‪","#x202A"],["‫","#x202B"],["‬","#x202C"],["‭","#x202D"],["‮","#x202E"],["⁠","NoBreak"],["\ufeff","#xFEFF"]]);class Ei{modifiedAttributes;removedAttributes;hasChangedChildrenInternal;hasRemovedChildrenInternal;charDataModifiedInternal;attributeModified(e){this.removedAttributes&&this.removedAttributes.has(e)&&this.removedAttributes.delete(e),this.modifiedAttributes||(this.modifiedAttributes=new Set),this.modifiedAttributes.add(e)}attributeRemoved(e){this.modifiedAttributes&&this.modifiedAttributes.has(e)&&this.modifiedAttributes.delete(e),this.removedAttributes||(this.removedAttributes=new Set),this.removedAttributes.add(e)}nodeInserted(e){this.hasChangedChildrenInternal=!0}nodeRemoved(e){this.hasChangedChildrenInternal=!0,this.hasRemovedChildrenInternal=!0}charDataModified(){this.charDataModifiedInternal=!0}childrenModified(){this.hasChangedChildrenInternal=!0}isAttributeModified(e){return null!==this.modifiedAttributes&&void 0!==this.modifiedAttributes&&this.modifiedAttributes.has(e)}hasRemovedAttributes(){return null!==this.removedAttributes&&void 0!==this.removedAttributes&&Boolean(this.removedAttributes.size)}isCharDataModified(){return Boolean(this.charDataModifiedInternal)}hasChangedChildren(){return Boolean(this.hasChangedChildrenInternal)}hasRemovedChildren(){return Boolean(this.hasRemovedChildrenInternal)}}let vi;class wi{static instance(e={forceNew:null}){const{forceNew:t}=e;return vi&&!t||(vi=new wi),vi}async render(e){let t=null;if(e instanceof s.DOMModel.DOMNode?t=e:e instanceof s.DOMModel.DeferredDOMNode&&(t=await e.resolvePromise()),!t)return null;const n=new Si(!1,!0,!0);n.rootDOMNode=t;const i=n.firstChild();return i&&!i.isExpandable()&&n.element.classList.add("single-node"),n.setVisible(!0),n.element.treeElementForTest=i,n.setShowSelectionOnKeyboardFocus(!0,!0),{node:n.element,tree:n}}}class xi extends n.TreeOutline.TreeElement{nodeShortcut;hoveredInternal;constructor(e){super(""),this.listItemElement.createChild("div","selection fill");const t=this.listItemElement.createChild("span","elements-tree-shortcut-title");let s=e.nodeName.toLowerCase();e.nodeType===Node.ELEMENT_NODE&&(s="<"+s+">"),t.textContent="↪ "+s,this.nodeShortcut=e,this.addRevealAdorner()}addRevealAdorner(){const t=new T.Adorner.Adorner;t.classList.add("adorner-reveal");const s=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.REVEAL).name,n=document.createElement("span"),o=new C.Icon.Icon;o.data={iconName:"select-element",color:"var(--icon-default)",width:"14px",height:"14px"};const r=document.createElement("span");r.textContent=s,n.append(o),n.append(r),n.classList.add("adorner-with-icon"),t.data={name:s,content:n},this.listItemElement.appendChild(t);t.addInteraction((()=>{i.userMetrics.badgeActivated(8),this.nodeShortcut.deferredNode.resolve((t=>{e.Revealer.reveal(t)}))}),{isToggle:!1,shouldPropagateOnKeydown:!1,ariaLabelDefault:fi(mi.reveal),ariaLabelActive:fi(mi.reveal)}),t.addEventListener("mousedown",(e=>e.consume()),!1),eo.instance().registerAdorner(t)}get hovered(){return Boolean(this.hoveredInternal)}set hovered(e){this.hoveredInternal!==e&&(this.hoveredInternal=e,this.listItemElement.classList.toggle("hovered",e))}deferredNode(){return this.nodeShortcut.deferredNode}domModel(){return this.nodeShortcut.deferredNode.domModel()}setLeftIndentOverlay(){let e=24;if(this.parent&&this.parent instanceof Hi){e+=parseFloat(this.parent.listItemElement.style.getPropertyValue("--indent"))||0}this.listItemElement.style.setProperty("--indent",e+"px")}onattach(){this.setLeftIndentOverlay()}onselect(e){if(!e)return!0;return this.nodeShortcut.deferredNode.highlight(),this.nodeShortcut.deferredNode.resolve(function(e){e&&this.treeOutline instanceof Si&&(this.treeOutline.selectedDOMNodeInternal=e,this.treeOutline.selectedNodeChanged(!1))}.bind(this)),!0}}var Ti=Object.freeze({__proto__:null,get ElementsTreeOutline(){return Si},MappedCharToEntity:bi,UpdateRecord:Ei,Renderer:wi,ShortcutTreeElement:xi});const Ii={domBreakpoint:"DOM Breakpoint",elementIsHidden:"Element is hidden"},Mi=o.i18n.registerUIStrings("panels/elements/MarkerDecorator.ts",Ii),Ni=o.i18n.getLazilyComputedLocalizedString.bind(void 0,Mi);class Pi{title;color;constructor(e){if(!e.title||!e.color)throw new Error(`Generic decorator requires a color and a title: ${e.marker}`);this.title=e.title(),this.color=e.color}decorate(e){return{title:this.title,color:this.color}}}const Ri={marker:"breakpoint-marker",title:Ni(Ii.domBreakpoint),color:"rgb(105, 140, 254)"},ki={marker:"hidden-marker",title:Ni(Ii.elementIsHidden),color:"#555"};function Li(){return[{...Ri,decorator:()=>new Pi(Ri)},{...ki,decorator:()=>new Pi(ki)},{decorator:uo.instance,marker:"pseudo-state-marker",title:void 0,color:void 0}]}var Ai=Object.freeze({__proto__:null,GenericDecorator:Pi,getRegisteredDecorators:Li});const Oi={thisFrameWasIdentifiedAsAnAd:"This frame was identified as an ad frame",forceState:"Force state",useSInTheConsoleToReferToThis:"Use {PH1} in the console to refer to this element.",addAttribute:"Add attribute",editAttribute:"Edit attribute",focus:"Focus",scrollIntoView:"Scroll into view",editText:"Edit text",editAsHtml:"Edit as HTML",cut:"Cut",copy:"Copy",paste:"Paste",copyOuterhtml:"Copy outerHTML",copySelector:"Copy `selector`",copyJsPath:"Copy JS path",copyStyles:"Copy styles",copyXpath:"Copy XPath",copyFullXpath:"Copy full XPath",copyElement:"Copy element",duplicateElement:"Duplicate element",hideElement:"Hide element",deleteElement:"Delete element",expandRecursively:"Expand recursively",collapseChildren:"Collapse children",captureNodeScreenshot:"Capture node screenshot",showFrameDetails:"Show `iframe` details",valueIsTooLargeToEdit:"<value is too large to edit>",children:"Children:",enableGridMode:"Enable grid mode",disableGridMode:"Disable grid mode",enableFlexMode:"Enable flex mode",disableFlexMode:"Disable flex mode",enableScrollSnap:"Enable scroll-snap overlay",disableScrollSnap:"Disable scroll-snap overlay"},Di=o.i18n.registerUIStrings("panels/elements/ElementsTreeElement.ts",Oi),Fi=o.i18n.getLocalizedString.bind(void 0,Di);function Ui(e){return"OPENING_TAG"===e.tagType}class Hi extends n.TreeOutline.TreeElement{nodeInternal;treeOutline;gutterContainer;decorationsElement;searchQuery;expandedChildrenLimitInternal;decorationsThrottler;inClipboard;hoveredInternal;editing;highlightResult;htmlEditElement;expandAllButtonElement;searchHighlightsVisible;selectionElement;hintElement;contentElement;#bt=new Map;#gt=new Map;tagTypeContext;constructor(t,s){super(),this.nodeInternal=t,this.treeOutline=null,this.contentElement=this.listItemElement.createChild("div"),this.gutterContainer=this.contentElement.createChild("div","gutter-container"),this.gutterContainer.addEventListener("click",this.showContextMenu.bind(this));const i=new C.Icon.Icon;if(i.data={color:"var(--icon-default)",iconName:"dots-horizontal",height:"16px",width:"16px"},this.gutterContainer.append(i),this.decorationsElement=this.gutterContainer.createChild("div","hidden"),this.searchQuery=null,this.expandedChildrenLimitInternal=Vi,this.decorationsThrottler=new e.Throttler.Throttler(100),this.inClipboard=!1,this.hoveredInternal=!1,this.editing=null,this.highlightResult=[],s)this.tagTypeContext={tagType:"CLOSING_TAG"};else if(this.tagTypeContext={tagType:"OPENING_TAG",adornerContainer:this.contentElement.createChild("div","adorner-container hidden"),adorners:[],styleAdorners:[],adornersThrottler:new e.Throttler.Throttler(100),canAddAttributes:this.nodeInternal.nodeType()===Node.ELEMENT_NODE},this.updateStyleAdorners(),t.isAdFrameNode()){const e=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.AD),t=this.adorn(e);n.Tooltip.Tooltip.install(t,Fi(Oi.thisFrameWasIdentifiedAsAnAd))}this.expandAllButtonElement=null}static animateOnDOMUpdate(e){const t=e.listItemElement.querySelector(".webkit-html-tag-name");n.UIUtils.runCSSAnimationOnce(t||e.listItemElement,"dom-update-highlight")}static visibleShadowRoots(t){let n=t.shadowRoots();return n.length&&!e.Settings.Settings.instance().moduleSetting("showUAShadowDOM").get()&&(n=n.filter((function(e){return e.shadowRootType()!==s.DOMModel.DOMNode.ShadowRootTypes.UserAgent}))),n}static canShowInlineText(e){if(e.contentDocument()||e.templateContent()||Hi.visibleShadowRoots(e).length||e.hasPseudoElements())return!1;if(e.nodeType()!==Node.ELEMENT_NODE)return!1;if(!e.firstChild||e.firstChild!==e.lastChild||e.firstChild.nodeType()!==Node.TEXT_NODE)return!1;return e.firstChild.nodeValue().length<80}static populateForcedPseudoStateItems(e,t){const s=["active","hover","focus","visited","focus-within","focus-visible"],n=t.domModel().cssModel().pseudoState(t),i=e.debugSection().appendSubMenuItem(Fi(Oi.forceState));for(const e of s){const t=!!n&&n.indexOf(e)>=0;i.defaultSection().appendCheckboxItem(":"+e,o.bind(null,e,!t),t,!1)}function o(e,s){t.domModel().cssModel().forcePseudoState(t,e,s)}}isClosingTag(){return!Ui(this.tagTypeContext)}node(){return this.nodeInternal}isEditing(){return Boolean(this.editing)}highlightSearchResults(e){this.searchQuery!==e&&this.hideSearchHighlight(),this.searchQuery=e,this.searchHighlightsVisible=!0,this.updateTitle(null,!0)}hideSearchHighlights(){delete this.searchHighlightsVisible,this.hideSearchHighlight()}hideSearchHighlight(){if(0!==this.highlightResult.length){for(let e=this.highlightResult.length-1;e>=0;--e){const t=this.highlightResult[e];switch(t.type){case"added":t.node.remove();break;case"changed":t.node.textContent=t.oldText||null}}this.highlightResult=[]}}setInClipboard(e){this.inClipboard!==e&&(this.inClipboard=e,this.listItemElement.classList.toggle("in-clipboard",e))}get hovered(){return this.hoveredInternal}set hovered(e){this.hoveredInternal!==e&&(this.hoveredInternal=e,this.listItemElement&&(e?(this.createSelection(),this.listItemElement.classList.add("hovered")):this.listItemElement.classList.remove("hovered")))}addIssue(e){this.#bt.has(e.primaryKey())||(this.#bt.set(e.primaryKey(),e),this.#Et(e))}#Et(e){const t=e.details();t.violatingNodeAttribute?this.#vt(t.violatingNodeAttribute,e):this.#wt(e)}get issuesByNodeElement(){return this.#gt}#vt(e,t){const s=this.listItemElement.getElementsByClassName("webkit-html-tag")[0].getElementsByClassName("webkit-html-attribute");for(const n of s)if(n.getElementsByClassName("webkit-html-attribute-name")[0].textContent===e){const e=n.getElementsByClassName("webkit-html-attribute-name")[0];e.classList.add("violating-element"),this.#gt.set(e,t)}}#wt(e){const t=this.listItemElement.getElementsByClassName("webkit-html-tag-name")[0];t.classList.add("violating-element"),this.#gt.set(t,e)}expandedChildrenLimit(){return this.expandedChildrenLimitInternal}setExpandedChildrenLimit(e){this.expandedChildrenLimitInternal=e}createSlotLink(t){if(Ui(this.tagTypeContext)&&t){const s=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.SLOT);this.tagTypeContext.slot=this.adornSlot(s,this.tagTypeContext);const n=t.deferredNode;this.tagTypeContext.slot.addEventListener("click",(()=>{i.userMetrics.badgeActivated(6),n.resolve((t=>{e.Revealer.reveal(t)}))})),this.tagTypeContext.slot.addEventListener("mousedown",(e=>e.consume()),!1)}}createSelection(){const e=this.contentElement;e&&(this.selectionElement||(this.selectionElement=document.createElement("div"),this.selectionElement.className="selection fill",this.selectionElement.style.setProperty("margin-left",-this.computeLeftIndent()+"px"),e.prepend(this.selectionElement)))}createHint(){if(this.contentElement&&!this.hintElement){this.hintElement=this.contentElement.createChild("span","selected-hint");const e="$0";n.Tooltip.Tooltip.install(this.hintElement,Fi(Oi.useSInTheConsoleToReferToThis,{PH1:e})),n.ARIAUtils.markAsHidden(this.hintElement)}}onbind(){this.treeOutline&&!this.isClosingTag()&&this.treeOutline.treeElementByNode.set(this.nodeInternal,this)}onunbind(){this.editing&&this.editing.cancel(),this.treeOutline&&this.treeOutline.treeElementByNode.get(this.nodeInternal)===this&&this.treeOutline.treeElementByNode.delete(this.nodeInternal)}onattach(){this.hoveredInternal&&(this.createSelection(),this.listItemElement.classList.add("hovered")),this.updateTitle(),this.listItemElement.draggable=!0}async onpopulate(){if(this.treeOutline)return this.treeOutline.populateTreeElement(this)}async expandRecursively(){await this.nodeInternal.getSubtree(-1,!0),await super.expandRecursively(Number.MAX_VALUE)}onexpand(){this.isClosingTag()||this.updateTitle()}oncollapse(){this.isClosingTag()||this.updateTitle()}select(e,t){return!this.editing&&super.select(e,t)}onselect(e){return!!this.treeOutline&&(this.treeOutline.suppressRevealAndSelect=!0,this.treeOutline.selectDOMNode(this.nodeInternal,e),e&&(this.nodeInternal.highlight(),i.userMetrics.actionTaken(i.UserMetrics.Action.ChangeInspectedNodeInElementsPanel)),this.createSelection(),this.createHint(),this.treeOutline.suppressRevealAndSelect=!1,!0)}ondelete(){if(!this.treeOutline)return!1;const e=this.treeOutline.findTreeElement(this.nodeInternal);return e?e.remove():this.remove(),!0}onenter(){return!this.editing&&(this.startEditing(),!0)}selectOnMouseDown(e){super.selectOnMouseDown(e),this.editing||e.detail>=2&&e.preventDefault()}ondblclick(e){return this.editing||this.isClosingTag()||this.startEditingTarget(e.target)||this.isExpandable()&&!this.expanded&&this.expand(),!1}hasEditableNode(){return!this.nodeInternal.isShadowRoot()&&!this.nodeInternal.ancestorUserAgentShadowRoot()}insertInLastAttributePosition(e,t){if(e.getElementsByClassName("webkit-html-attribute").length>0)e.insertBefore(t,e.lastChild);else if(null!==e.textContent){const s=e.textContent.match(/^<(.*?)>$/);if(!s)return;const i=s[1];e.textContent="",n.UIUtils.createTextChild(e,"<"+i),e.appendChild(t),n.UIUtils.createTextChild(e,">")}}startEditingTarget(e){if(!this.treeOutline||this.treeOutline.selectedDOMNode()!==this.nodeInternal)return!1;if(this.nodeInternal.nodeType()!==Node.ELEMENT_NODE&&this.nodeInternal.nodeType()!==Node.TEXT_NODE)return!1;const t=e.enclosingNodeOrSelfWithClass("webkit-html-text-node");if(t)return this.startEditingTextNode(t);const s=e.enclosingNodeOrSelfWithClass("webkit-html-attribute");if(s)return this.startEditingAttribute(s,e);const n=e.enclosingNodeOrSelfWithClass("webkit-html-tag-name");if(n)return this.startEditingTagName(n);return!!e.enclosingNodeOrSelfWithClass("add-attribute")&&this.addNewAttribute()}showContextMenu(e){this.treeOutline&&this.treeOutline.showContextMenu(this,e)}populateTagContextMenu(e,t){const s=this.isClosingTag()&&this.treeOutline?this.treeOutline.findTreeElement(this.nodeInternal):this;if(!s)return;e.editSection().appendItem(Fi(Oi.addAttribute),s.addNewAttribute.bind(s));const n=t.target,i=n.enclosingNodeOrSelfWithClass("webkit-html-attribute"),o=n.enclosingNodeOrSelfWithClass("add-attribute");i&&!o&&e.editSection().appendItem(Fi(Oi.editAttribute),this.startEditingAttribute.bind(this,i,n)),this.populateNodeContextMenu(e),Hi.populateForcedPseudoStateItems(e,s.node()),this.populateScrollIntoView(e),e.viewSection().appendItem(Fi(Oi.focus),(async()=>{await this.nodeInternal.focus()}))}populateScrollIntoView(e){e.viewSection().appendItem(Fi(Oi.scrollIntoView),(()=>this.nodeInternal.scrollIntoView()))}populateTextContextMenu(e,t){this.editing||e.editSection().appendItem(Fi(Oi.editText),this.startEditingTextNode.bind(this,t)),this.populateNodeContextMenu(e)}populateNodeContextMenu(t){const i=this.hasEditableNode();i&&!this.editing&&t.editSection().appendItem(Fi(Oi.editAsHtml),this.editAsHTML.bind(this));const o=this.nodeInternal.isShadowRoot(),r=n.KeyboardShortcut.KeyboardShortcut.shortcutToString.bind(null),a=n.KeyboardShortcut.Modifiers.CtrlOrMeta,l=this.treeOutline;if(!l)return;let d;d=t.clipboardSection().appendItem(Fi(Oi.cut),l.performCopyOrCut.bind(l,!0,this.nodeInternal),!this.hasEditableNode()),d.setShortcut(r("X",a));const c=t.clipboardSection().appendSubMenuItem(Fi(Oi.copy)),h=c.section();if(o||(d=h.appendItem(Fi(Oi.copyOuterhtml),l.performCopyOrCut.bind(l,!1,this.nodeInternal)),d.setShortcut(r("V",a))),this.nodeInternal.nodeType()===Node.ELEMENT_NODE&&(h.appendItem(Fi(Oi.copySelector),this.copyCSSPath.bind(this)),h.appendItem(Fi(Oi.copyJsPath),this.copyJSPath.bind(this),!ws(this.nodeInternal)),h.appendItem(Fi(Oi.copyStyles),this.copyStyles.bind(this))),o||(h.appendItem(Fi(Oi.copyXpath),this.copyXPath.bind(this)),h.appendItem(Fi(Oi.copyFullXpath),this.copyFullXPath.bind(this))),!o){d=c.clipboardSection().appendItem(Fi(Oi.copyElement),l.performCopyOrCut.bind(l,!1,this.nodeInternal)),d.setShortcut(r("C",a));const e=!this.nodeInternal.parentNode||"#document"===this.nodeInternal.parentNode.nodeName();d=t.editSection().appendItem(Fi(Oi.duplicateElement),l.duplicateNode.bind(l,this.nodeInternal),this.nodeInternal.isInShadowTree()||e)}d=t.clipboardSection().appendItem(Fi(Oi.paste),l.pasteNode.bind(l,this.nodeInternal),!l.canPaste(this.nodeInternal)),d.setShortcut(r("V",a)),d=t.debugSection().appendCheckboxItem(Fi(Oi.hideElement),l.toggleHideElement.bind(l,this.nodeInternal),l.isToggledToHidden(this.nodeInternal)),d.setShortcut(n.ShortcutRegistry.ShortcutRegistry.instance().shortcutTitleForAction("elements.hide-element")||""),i&&t.editSection().appendItem(Fi(Oi.deleteElement),this.remove.bind(this)),t.viewSection().appendItem(Fi(Oi.expandRecursively),this.expandRecursively.bind(this)),t.viewSection().appendItem(Fi(Oi.collapseChildren),this.collapseChildren.bind(this));const u=new N.DeviceModeWrapper.ActionDelegate;t.viewSection().appendItem(Fi(Oi.captureNodeScreenshot),u.handleAction.bind(null,n.Context.Context.instance(),"emulation.capture-node-screenshot")),this.nodeInternal.frameOwnerFrameId()&&t.viewSection().appendItem(Fi(Oi.showFrameDetails),(()=>{const t=this.nodeInternal.frameOwnerFrameId();if(t){const n=s.FrameManager.FrameManager.instance().getFrame(t);e.Revealer.reveal(n)}}))}startEditing(){if(!this.treeOutline||this.treeOutline.selectedDOMNode()!==this.nodeInternal)return;const e=this.listItemElement;if(Ui(this.tagTypeContext)&&this.tagTypeContext.canAddAttributes){const t=e.getElementsByClassName("webkit-html-attribute")[0];return t?this.startEditingAttribute(t,t.getElementsByClassName("webkit-html-attribute-value")[0]):this.addNewAttribute()}if(this.nodeInternal.nodeType()===Node.TEXT_NODE){const t=e.getElementsByClassName("webkit-html-text-node")[0];if(t)return this.startEditingTextNode(t)}}addNewAttribute(){const e=document.createElement("span"),t=this.buildAttributeDOM(e," ","",null);t.style.marginLeft="2px",t.style.marginRight="2px";const s=this.listItemElement.getElementsByClassName("webkit-html-tag")[0];return this.insertInLastAttributePosition(s,t),t.scrollIntoViewIfNeeded(!0),this.startEditingAttribute(t,t)}triggerEditAttribute(e){const t=this.listItemElement.getElementsByClassName("webkit-html-attribute-name");for(let s=0,n=t.length;s<n;++s)if(t[s].textContent===e)for(let e=t[s].nextSibling;e;e=e.nextSibling)if(e.nodeType===Node.ELEMENT_NODE&&e.classList.contains("webkit-html-attribute-value"))return this.startEditingAttribute(e.parentElement,e)}startEditingAttribute(t,s){if(console.assert(this.listItemElement.isAncestor(t)),n.UIUtils.isBeingEdited(t))return!0;const i=t.getElementsByClassName("webkit-html-attribute-name")[0];if(!i)return!1;const o=i.textContent,r=t.getElementsByClassName("webkit-html-attribute-value")[0];s=r.isAncestor(s)?r:s;const a=o&&r?this.nodeInternal.getAttribute(o)?.replaceAll('"',"&quot;"):void 0;void 0!==a&&r.setTextContentTruncatedIfNeeded(a,Fi(Oi.valueIsTooLargeToEdit)),function e(t){if(t.nodeType!==Node.TEXT_NODE){if(t.nodeType===Node.ELEMENT_NODE)for(let s=t.firstChild;s;s=s.nextSibling)e(s)}else t.nodeValue=t.nodeValue?t.nodeValue.replace(/\u200B/g,""):""}(t);const l=new n.InplaceEditor.Config(this.attributeEditingCommitted.bind(this),this.editingCancelled.bind(this),o||void 0);e.ParsedURL.ParsedURL.fromString(r.textContent||"")||l.setPostKeydownFinishHandler((function(e){return n.UIUtils.handleElementValueModifications(e,t),""})),this.updateEditorHandles(t,l);const d=this.listItemElement.getComponentSelection();return d&&d.selectAllChildren(s),!0}startEditingTextNode(e){if(n.UIUtils.isBeingEdited(e))return!0;let t=this.nodeInternal;t.nodeType()===Node.ELEMENT_NODE&&t.firstChild&&(t=t.firstChild);const s=e.enclosingNodeOrSelfWithClass("webkit-html-text-node");s&&(s.textContent=t.nodeValue());const i=new n.InplaceEditor.Config(this.textNodeEditingCommitted.bind(this,t),this.editingCancelled.bind(this));this.updateEditorHandles(e,i);const o=this.listItemElement.getComponentSelection();return o&&o.selectAllChildren(e),!0}startEditingTagName(e){if(!e&&!(e=this.listItemElement.getElementsByClassName("webkit-html-tag-name")[0]))return!1;const t=e.textContent;if(null!==t&&_i.has(t.toLowerCase()))return!1;if(n.UIUtils.isBeingEdited(e))return!0;const s=this.distinctClosingTagElement();function i(){s&&e&&(s.textContent="</"+e.textContent+">")}const o=e=>{" "===e.key&&(this.editing&&this.editing.commit(),e.consume(!0))};e.addEventListener("keyup",i,!1),e.addEventListener("keydown",o,!1);const r=new n.InplaceEditor.Config(function(t,s,n,r,a){e&&(e.removeEventListener("keyup",i,!1),e.removeEventListener("keydown",o,!1),this.tagNameEditingCommitted(t,s,n,r,a))}.bind(this),function(t,s){e&&(e.removeEventListener("keyup",i,!1),e.removeEventListener("keydown",o,!1),this.editingCancelled(t,s))}.bind(this),t);this.updateEditorHandles(e,r);const a=this.listItemElement.getComponentSelection();return a&&a.selectAllChildren(e),!0}updateEditorHandles(e,t){const s=n.InplaceEditor.InplaceEditor.startEditing(e,t);this.editing=s?{commit:s.commit,cancel:s.cancel,editor:void 0,resize:()=>{}}:null}async startEditingAsHTML(e,t,s){if(null===s)return;if(this.editing)return;const n=this.convertWhitespaceToEntities(s).text;this.htmlEditElement=document.createElement("div"),this.htmlEditElement.className="source-code elements-tree-editor";let i=this.listItemElement.firstChild;for(;i;)i.style.display="none",i=i.nextSibling;this.childrenListElement&&(this.childrenListElement.style.display="none"),this.listItemElement.append(this.htmlEditElement),this.htmlEditElement.addEventListener("keydown",(e=>{"Escape"===e.key&&e.consume(!0)}));const o=new M.TextEditor.TextEditor(x.EditorState.create({doc:n,extensions:[x.keymap.of([{key:"Mod-Enter",run:()=>(this.editing?.commit(),!0)},{key:"Escape",run:()=>(this.editing?.cancel(),!0)}]),M.Config.baseConfiguration(n),M.Config.closeBrackets,M.Config.autocompletion.instance(),x.html.html(),M.Config.domWordWrap.instance(),x.EditorView.theme({"&.cm-editor":{maxHeight:"300px"},".cm-scroller":{overflowY:"auto"}}),x.EditorView.domEventHandlers({focusout:e=>{const t=e.relatedTarget;t&&!t.isSelfOrDescendant(o)&&this.editing&&this.editing.commit()}})]}));function r(){this.treeOutline&&this.htmlEditElement&&(this.htmlEditElement.style.width=this.treeOutline.visibleWidth()-this.computeLeftIndent()-30+"px")}function a(){if(!this.editing||!this.editing.editor)return;this.editing=null,this.htmlEditElement&&this.listItemElement.removeChild(this.htmlEditElement),this.htmlEditElement=void 0,this.childrenListElement&&this.childrenListElement.style.removeProperty("display");let e=this.listItemElement.firstChild;for(;e;)e.style.removeProperty("display"),e=e.nextSibling;this.treeOutline&&(this.treeOutline.setMultilineEditing(null),this.treeOutline.focus()),t()}this.editing={commit:function(){this.editing&&this.editing.editor&&e(n,this.editing.editor.state.doc.toString());a.call(this)}.bind(this),cancel:a.bind(this),editor:o,resize:r.bind(this)},r.call(this),this.htmlEditElement.appendChild(o),o.editor.focus(),this.treeOutline&&this.treeOutline.setMultilineEditing(this.editing)}attributeEditingCommitted(e,t,s,n,i){this.editing=null;const o=this.treeOutline;function a(s){if(s&&this.editingCancelled(e,n),!i)return;o&&(o.runPendingUpdates(),o.focus());const a=this.nodeInternal.attributes();for(let e=0;e<a.length;++e)if(a[e].name===n)return void("backward"===i?0===e?this.startEditingTagName():this.triggerEditAttribute(a[e-1].name):e===a.length-1?this.addNewAttribute():this.triggerEditAttribute(a[e+1].name));"backward"===i?" "===t?a.length>0&&this.triggerEditAttribute(a[a.length-1].name):a.length>1&&this.triggerEditAttribute(a[a.length-2].name):"forward"===i&&(r.StringUtilities.isWhitespace(t)?this.startEditingTagName():this.addNewAttribute())}!n.trim()&&!t.trim()||s===t?(this.updateTitle(),a.call(this)):this.nodeInternal.setAttribute(n,t,a.bind(this))}tagNameEditingCommitted(e,t,s,n,i){this.editing=null;const o=this;function r(){const t=o.distinctClosingTagElement();t&&(t.textContent="</"+n+">"),o.editingCancelled(e,n),a.call(o)}function a(){if("forward"!==i)return void this.addNewAttribute();const e=this.nodeInternal.attributes();e.length>0?this.triggerEditAttribute(e[0].name):this.addNewAttribute()}if((t=t.trim())===s)return void r();const l=this.treeOutline,d=this.expanded;this.nodeInternal.setNodeName(t,((e,t)=>{if(e||!t)return void r();if(!l)return;const s=l.selectNodeAfterEdit(d,e,t);a.call(s)}))}textNodeEditingCommitted(e,t,s){this.editing=null,e.setNodeValue(s,function(){this.updateTitle()}.bind(this))}editingCancelled(e,t){this.editing=null,this.updateTitle()}distinctClosingTagElement(){if(this.expanded){const e=this.childrenListElement.querySelectorAll(".close");return e[e.length-1]}const e=this.listItemElement.getElementsByClassName("webkit-html-tag");return 1===e.length?null:e[e.length-1]}updateTitle(e,t){if(!this.editing){if(t)this.hideSearchHighlight();else{const t=this.nodeTitleInfo(e||null);if(this.nodeInternal.nodeType()===Node.DOCUMENT_FRAGMENT_NODE&&this.nodeInternal.isInShadowTree()&&this.nodeInternal.shadowRootType()){this.childrenListElement.classList.add("shadow-root");let e=4;for(let t=this.nodeInternal;e&&t;t=t.parentNode)t.nodeType()===Node.DOCUMENT_FRAGMENT_NODE&&e--;e?this.childrenListElement.classList.add("shadow-root-depth-"+e):this.childrenListElement.classList.add("shadow-root-deep")}this.contentElement.removeChildren();this.contentElement.createChild("span","highlight").append(t),this.title=this.contentElement,this.updateDecorations(),this.contentElement.prepend(this.gutterContainer),Ui(this.tagTypeContext)&&(this.contentElement.append(this.tagTypeContext.adornerContainer),this.tagTypeContext.slot&&this.contentElement.append(this.tagTypeContext.slot)),this.highlightResult=[],delete this.selectionElement,delete this.hintElement,this.selected&&(this.createSelection(),this.createHint());for(const e of this.#bt.values())this.#Et(e)}this.highlightSearchResultsInternal()}}computeLeftIndent(){let e=this.parent,t=0;for(;null!==e;)t++,e=e.parent;return 12*(t-2)+(this.isExpandable()&&this.isCollapsible()?1:12)}updateDecorations(){const e=this.computeLeftIndent();this.gutterContainer.style.left=-e+"px",this.listItemElement.style.setProperty("--indent",e+"px"),this.isClosingTag()||this.nodeInternal.nodeType()===Node.ELEMENT_NODE&&this.decorationsThrottler.schedule(this.updateDecorationsInternal.bind(this))}updateDecorationsInternal(){if(!this.treeOutline)return Promise.resolve();const e=this.nodeInternal;this.treeOutline.decoratorExtensions||(this.treeOutline.decoratorExtensions=Li());const t=new Map;for(const e of this.treeOutline.decoratorExtensions)t.set(e.marker,e);const s=[],i=[],o=[];function r(t,s){const n=s.decorate(t);n&&(t===e?i:o).push(n)}return e.traverseMarkers((function(e,n){const i=t.get(n);if(!i)return;s.push(Promise.resolve(i.decorator()).then(r.bind(null,e)))})),Promise.all(s).then(function(){if(this.decorationsElement.removeChildren(),this.decorationsElement.classList.add("hidden"),this.gutterContainer.classList.toggle("has-decorations",Boolean(i.length||o.length)),n.ARIAUtils.setLabel(this.decorationsElement,""),!i.length&&!o.length)return;const e=new Set,t=document.createElement("div");for(const s of i){t.createChild("div").textContent=s.title,e.add(s.color)}if(this.expanded&&!i.length)return;const s=new Set;if(o.length){let e=t.createChild("div");e.textContent=Fi(Oi.children);for(const n of o)e=t.createChild("div"),e.style.marginLeft="15px",e.textContent=n.title,s.add(n.color)}let r=0;a.call(this,e,"elements-gutter-decoration"),this.expanded||a.call(this,s,"elements-gutter-decoration elements-has-decorated-children");function a(e,t){for(const s of e){const e=this.decorationsElement.createChild("div",t);this.decorationsElement.classList.remove("hidden"),e.style.backgroundColor=s,e.style.borderColor=s,r&&(e.style.marginLeft=r+"px"),r+=3}}n.Tooltip.Tooltip.install(this.decorationsElement,t.textContent),n.ARIAUtils.setLabel(this.decorationsElement,t.textContent||"")}.bind(this))}buildAttributeDOM(e,t,s,i,o,a){const l=/[\/;:\)\]\}]/g;let d=0,c=0,h=0;function u(e,t){const s=this.convertWhitespaceToEntities(t);for(c=s.entityRanges.length,t=s.text.replace(l,((e,t)=>{for(;d<c&&s.entityRanges[d].offset<t;)s.entityRanges[d].offset+=h,++d;return h+=1,e+"​"})).replaceAll('"',"&quot;");d<c;)s.entityRanges[d].offset+=h,++d;e.setTextContentTruncatedIfNeeded(t),n.UIUtils.highlightRangesWithStyleClass(e,s.entityRanges,"webkit-html-entity-value")}const p=o||s.length>0,g=e.createChild("span","webkit-html-attribute"),f=g.createChild("span","webkit-html-attribute-name");f.textContent=t,p&&n.UIUtils.createTextChild(g,'=​"');const y=g.createChild("span","webkit-html-attribute-value");function C(e){const t=a?a.resolveURL(e):null;if(null===t){const t=document.createElement("span");return u.call(this,t,e),t}(e=e.replace(l,"$&​")).startsWith("data:")&&(e=r.StringUtilities.trimMiddle(e,60));const s=a&&"a"===a.nodeName().toLowerCase()?n.XLink.XLink.create(t,e,"",!0):m.Linkifier.Linkifier.linkifyURL(t,{text:e,preventClick:!0,showColumnNumber:!1,inlineFrameIndex:0});return ee.setImageUrl(s,t)}i&&i.isAttributeModified(t)&&n.UIUtils.runCSSAnimationOnce(p?y:f,"dom-update-highlight");const S=a?a.nodeName().toLowerCase():"";function b(e){const t=document.createDocumentFragment();let s=0;for(;e.length;){s++>0&&n.UIUtils.createTextChild(t," ");let i="",o="";const r=(e=e.trim()).search(/\s/);if(-1===r)i=e;else if(r>0&&","===e[r-1])i=e.substring(0,r);else{i=e.substring(0,r);const t=e.indexOf(",",r);o=-1!==t?e.substring(r,t+1):e.substring(r)}i&&(i.endsWith(",")?(t.appendChild(C.call(this,i.substring(0,i.length-1))),n.UIUtils.createTextChild(t,",")):t.appendChild(C.call(this,i))),o&&n.UIUtils.createTextChild(t,o),e=e.substring(i.length+o.length)}return t}return S&&("src"===t||"href"===t)&&s?y.appendChild(C.call(this,s)):("img"!==S&&"source"!==S||"srcset"!==t)&&("image"!==S||"xlink:href"!==t&&"href"!==t)?u.call(this,y,s):y.appendChild(b.call(this,s)),p&&n.UIUtils.createTextChild(g,'"'),g}buildPseudoElementDOM(e,t){e.createChild("span","webkit-html-pseudo-element").textContent="::"+t,n.UIUtils.createTextChild(e,"​")}buildTagDOM(e,t,s,i,o){const r=this.nodeInternal,a=["webkit-html-tag"];s&&i&&a.push("close");const l=e.createChild("span",a.join(" "));n.UIUtils.createTextChild(l,"<");const d=l.createChild("span",s?"webkit-html-close-tag-name":"webkit-html-tag-name");if(d.textContent=(s?"/":"")+t,!s){if(r.hasAttributes()){const e=r.attributes();for(let t=0;t<e.length;++t){const s=e[t];n.UIUtils.createTextChild(l," "),this.buildAttributeDOM(l,s.name,s.value,o,!1,r)}}if(o){let e=o.hasRemovedAttributes()||o.hasRemovedChildren();e=e||!this.expanded&&o.hasChangedChildren(),e&&n.UIUtils.runCSSAnimationOnce(d,"dom-update-highlight")}}n.UIUtils.createTextChild(l,">"),n.UIUtils.createTextChild(e,"​"),l.textContent&&n.ARIAUtils.setLabel(l,l.textContent)}convertWhitespaceToEntities(e){let t="",s=0;const n=[],i=bi;for(let o=0,r=e.length;o<r;++o){const r=e.charAt(o);if(i.has(r)){t+=e.substring(s,o);const a="&"+i.get(r)+";";n.push({offset:t.length,length:a.length}),t+=a,s=o+1}}return t&&(t+=e.substring(s)),{text:t||e,entityRanges:n}}nodeTitleInfo(e){const t=this.nodeInternal,s=document.createDocumentFragment(),i=()=>{this.highlightResult=[],this.highlightSearchResultsInternal()};switch(t.nodeType()){case Node.ATTRIBUTE_NODE:this.buildAttributeDOM(s,t.name,t.value,e,!0);break;case Node.ELEMENT_NODE:{let i=t.pseudoType();if(i){const e=t.pseudoIdentifier();e&&(i+=`(${e})`),this.buildPseudoElementDOM(s,i);break}const o=t.nodeNameInCorrectCase();if(this.isClosingTag()){this.buildTagDOM(s,o,!0,!0,e);break}if(this.buildTagDOM(s,o,!1,!1,e),this.isExpandable()){if(!this.expanded){const t=new h.ElementsTreeExpandButton.ElementsTreeExpandButton;t.data={clickHandler:()=>this.expand()},s.appendChild(t);const i=document.createElement("span");i.textContent="…",i.style.fontSize="0",s.appendChild(i),n.UIUtils.createTextChild(s,"​"),this.buildTagDOM(s,o,!0,!1,e)}break}if(Hi.canShowInlineText(t)){const i=s.createChild("span","webkit-html-text-node"),a=t.firstChild;if(!a)throw new Error("ElementsTreeElement._nodeTitleInfo expects node.firstChild to be defined.");const l=this.convertWhitespaceToEntities(a.nodeValue());i.textContent=r.StringUtilities.collapseWhitespace(l.text),n.UIUtils.highlightRangesWithStyleClass(i,l.entityRanges,"webkit-html-entity-value"),n.UIUtils.createTextChild(s,"​"),this.buildTagDOM(s,o,!0,!1,e),e&&e.hasChangedChildren()&&n.UIUtils.runCSSAnimationOnce(i,"dom-update-highlight"),e&&e.isCharDataModified()&&n.UIUtils.runCSSAnimationOnce(i,"dom-update-highlight");break}(this.treeOutline&&this.treeOutline.isXMLMimeType||!Bi.has(o))&&this.buildTagDOM(s,o,!0,!1,e);break}case Node.TEXT_NODE:if(t.parentNode&&"script"===t.parentNode.nodeName().toLowerCase()){const e=s.createChild("span","webkit-html-text-node webkit-html-js-node"),n=t.nodeValue();e.textContent=n.replace(/^[\n\r]+|\s+$/g,""),I.CodeHighlighter.highlightNode(e,"text/javascript").then(i)}else if(t.parentNode&&"style"===t.parentNode.nodeName().toLowerCase()){const e=s.createChild("span","webkit-html-text-node webkit-html-css-node"),n=t.nodeValue();e.textContent=n.replace(/^[\n\r]+|\s+$/g,""),I.CodeHighlighter.highlightNode(e,"text/css").then(i)}else{n.UIUtils.createTextChild(s,'"');const i=s.createChild("span","webkit-html-text-node"),o=this.convertWhitespaceToEntities(t.nodeValue());i.textContent=r.StringUtilities.collapseWhitespace(o.text),n.UIUtils.highlightRangesWithStyleClass(i,o.entityRanges,"webkit-html-entity-value"),n.UIUtils.createTextChild(s,'"'),e&&e.isCharDataModified()&&n.UIUtils.runCSSAnimationOnce(i,"dom-update-highlight")}break;case Node.COMMENT_NODE:{const e=s.createChild("span","webkit-html-comment");n.UIUtils.createTextChild(e,"\x3c!--"+t.nodeValue()+"--\x3e");break}case Node.DOCUMENT_TYPE_NODE:{const e=s.createChild("span","webkit-html-doctype");n.UIUtils.createTextChild(e,"<!DOCTYPE "+t.nodeName()),t.publicId?(n.UIUtils.createTextChild(e,' PUBLIC "'+t.publicId+'"'),t.systemId&&n.UIUtils.createTextChild(e,' "'+t.systemId+'"')):t.systemId&&n.UIUtils.createTextChild(e,' SYSTEM "'+t.systemId+'"'),t.internalSubset&&n.UIUtils.createTextChild(e," ["+t.internalSubset+"]"),n.UIUtils.createTextChild(e,">");break}case Node.CDATA_SECTION_NODE:{const e=s.createChild("span","webkit-html-text-node");n.UIUtils.createTextChild(e,"<![CDATA["+t.nodeValue()+"]]>");break}case Node.DOCUMENT_FRAGMENT_NODE:s.createChild("span","webkit-html-fragment").textContent=r.StringUtilities.collapseWhitespace(t.nodeNameInCorrectCase());break;default:{const e=r.StringUtilities.collapseWhitespace(t.nodeNameInCorrectCase());n.UIUtils.createTextChild(s,e)}}return s}remove(){if(this.nodeInternal.pseudoType())return;this.parent&&this.nodeInternal.parentNode&&this.nodeInternal.parentNode.nodeType()!==Node.DOCUMENT_NODE&&this.nodeInternal.removeNode()}toggleEditAsHTML(e,t){if(this.editing&&this.htmlEditElement)return void this.editing.commit();if(!1===t)return;function s(t){e&&e(!t)}const n=this.nodeInternal;n.getOuterHTML().then(this.startEditingAsHTML.bind(this,(function(e,t){e!==t&&n.setOuterHTML(t,s)}),(function(){e&&e(!1)})))}copyCSSPath(){i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(vs(this.nodeInternal,!0))}copyJSPath(){i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(xs(this.nodeInternal,!0))}copyXPath(){i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(Is(this.nodeInternal,!0))}copyFullXPath(){i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(Is(this.nodeInternal,!1))}async copyStyles(){const t=this.nodeInternal,n=t.domModel().cssModel(),o=await n.cachedMatchedCascadeForNode(t);if(!o)return;const r=e.Settings.Settings.instance().moduleSetting("textEditorIndent").get(),a=[];for(const e of o.nodeStyles().reverse())for(const t of e.leadingProperties())t.parsedOk&&!t.disabled&&t.activeInStyle()&&!t.implicit&&(o.isInherited(e)&&!s.CSSMetadata.cssMetadata().isPropertyInherited(t.name)||e.parentRule&&e.parentRule.isUserAgent()||o.propertyState(t)===s.CSSMatchedStyles.PropertyState.Active&&a.push(`${r}${t.name}: ${t.value};`));i.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(a.join("\n"))}highlightSearchResultsInternal(){if(!this.searchQuery||!this.searchHighlightsVisible)return;this.hideSearchHighlight();const e=this.listItemElement.textContent||"",t=r.StringUtilities.createPlainTextSearchRegex(this.searchQuery,"gi");let s=t.exec(e);const i=[];for(;s;)i.push(new f.TextRange.SourceRange(s.index,s[0].length)),s=t.exec(e);i.length||i.push(new f.TextRange.SourceRange(0,e.length)),this.highlightResult=[],n.UIUtils.highlightSearchResults(this.listItemElement,i,this.highlightResult)}editAsHTML(){e.Revealer.reveal(this.node()).then((()=>{const e=n.ActionRegistry.ActionRegistry.instance().action("elements.edit-as-html");if(e)return e.execute()}))}adorn({name:e},t){let s=t;s||(s=document.createElement("span"),s.textContent=e);const n=new T.Adorner.Adorner;return n.data={name:e,content:s},Ui(this.tagTypeContext)&&(this.tagTypeContext.adorners.push(n),eo.instance().registerAdorner(n),this.updateAdorners(this.tagTypeContext)),n}adornSlot({name:e},t){const s=new C.Icon.Icon;s.data={iconName:"select-element",color:"var(--icon-default)",width:"14px",height:"14px"};const n=document.createElement("span");n.textContent=e;const i=document.createElement("span");i.append(s),i.append(n),i.classList.add("adorner-with-icon");const o=new T.Adorner.Adorner;return o.data={name:e,content:i},t.adorners.push(o),eo.instance().registerAdorner(o),this.updateAdorners(t),o}removeAdorner(e,t){const s=t.adorners;eo.instance().deregisterAdorner(e),e.remove();for(let n=0;n<s.length;++n)if(s[n]===e)return s.splice(n,1),void this.updateAdorners(t)}removeAllAdorners(){if(Ui(this.tagTypeContext)){for(const e of this.tagTypeContext.adorners)eo.instance().deregisterAdorner(e),e.remove();this.tagTypeContext.adorners=[],this.updateAdorners(this.tagTypeContext)}}updateAdorners(e){e.adornersThrottler.schedule(this.updateAdornersInternal.bind(null,e))}updateAdornersInternal(e){const t=e.adornerContainer;if(!t)return Promise.resolve();const s=e.adorners;if(0===s.length)return t.classList.add("hidden"),Promise.resolve();s.sort(Wi),t.removeChildren();for(const e of s)t.appendChild(e);return t.classList.remove("hidden"),Promise.resolve()}async updateStyleAdorners(){if(!Ui(this.tagTypeContext))return;const e=this.node(),t=e.id;if(e.nodeType()===Node.COMMENT_NODE||e.nodeType()===Node.DOCUMENT_FRAGMENT_NODE||e.nodeType()===Node.TEXT_NODE||void 0===t)return;const n=await e.domModel().cssModel().getComputedStyle(t);for(const e of this.tagTypeContext.styleAdorners)this.removeAdorner(e,this.tagTypeContext);if(this.tagTypeContext.styleAdorners=[],!n)return;const i=n.get("display"),o="grid"===i||"inline-grid"===i,r="flex"===i||"inline-flex"===i,a=(o&&(n.get("grid-template-columns")?.startsWith("subgrid")||n.get("grid-template-rows")?.startsWith("subgrid")))??!1,l=n.get("container-type"),d=n.get("contain"),c=""!==s.CSSContainerQuery.getQueryAxis(`${l} ${d}`);o&&this.pushGridAdorner(this.tagTypeContext,a),r&&this.pushFlexAdorner(this.tagTypeContext),n.get("scroll-snap-type")&&"none"!==n.get("scroll-snap-type")&&this.pushScrollSnapAdorner(this.tagTypeContext),c&&this.pushContainerAdorner(this.tagTypeContext)}pushGridAdorner(e,t){const n=this.node(),o=n.id;if(!o)return;const r=h.AdornerManager.getRegisteredAdorner(t?h.AdornerManager.RegisteredAdorners.SUBGRID:h.AdornerManager.RegisteredAdorners.GRID),a=this.adorn(r);a.classList.add("grid");a.addInteraction((()=>{a.isActive()?(n.domModel().overlayModel().highlightGridInPersistentOverlay(o),i.userMetrics.badgeActivated(t?1:0)):n.domModel().overlayModel().hideGridInPersistentOverlay(o)}),{isToggle:!0,shouldPropagateOnKeydown:!1,ariaLabelDefault:Fi(Oi.enableGridMode),ariaLabelActive:Fi(Oi.disableGridMode)}),n.domModel().overlayModel().addEventListener(s.OverlayModel.Events.PersistentGridOverlayStateChanged,(e=>{const{nodeId:t,enabled:s}=e.data;t===o&&a.toggle(s)})),e.styleAdorners.push(a)}pushScrollSnapAdorner(e){const t=this.node(),n=t.id;if(!n)return;const o=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.SCROLL_SNAP),r=this.adorn(o);r.classList.add("scroll-snap");r.addInteraction((()=>{const e=t.domModel().overlayModel();r.isActive()?(e.highlightScrollSnapInPersistentOverlay(n),i.userMetrics.badgeActivated(4)):e.hideScrollSnapInPersistentOverlay(n)}),{isToggle:!0,shouldPropagateOnKeydown:!1,ariaLabelDefault:Fi(Oi.enableScrollSnap),ariaLabelActive:Fi(Oi.disableScrollSnap)}),t.domModel().overlayModel().addEventListener(s.OverlayModel.Events.PersistentScrollSnapOverlayStateChanged,(e=>{const{nodeId:t,enabled:s}=e.data;t===n&&r.toggle(s)})),e.styleAdorners.push(r)}pushFlexAdorner(e){const t=this.node(),n=t.id;if(!n)return;const o=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.FLEX),r=this.adorn(o);r.classList.add("flex");r.addInteraction((()=>{const e=t.domModel().overlayModel();r.isActive()?(e.highlightFlexContainerInPersistentOverlay(n),i.userMetrics.badgeActivated(2)):e.hideFlexContainerInPersistentOverlay(n)}),{isToggle:!0,shouldPropagateOnKeydown:!1,ariaLabelDefault:Fi(Oi.enableFlexMode),ariaLabelActive:Fi(Oi.disableFlexMode)}),t.domModel().overlayModel().addEventListener(s.OverlayModel.Events.PersistentFlexContainerOverlayStateChanged,(e=>{const{nodeId:t,enabled:s}=e.data;t===n&&r.toggle(s)})),e.styleAdorners.push(r)}pushContainerAdorner(e){const t=this.node(),n=t.id;if(!n)return;const o=h.AdornerManager.getRegisteredAdorner(h.AdornerManager.RegisteredAdorners.CONTAINER),r=this.adorn(o);r.classList.add("container");r.addInteraction((()=>{const e=t.domModel().overlayModel();r.isActive()?(e.highlightContainerQueryInPersistentOverlay(n),i.userMetrics.badgeActivated(5)):e.hideContainerQueryInPersistentOverlay(n)}),{isToggle:!0,shouldPropagateOnKeydown:!1,ariaLabelDefault:Fi(Oi.enableScrollSnap),ariaLabelActive:Fi(Oi.disableScrollSnap)}),t.domModel().overlayModel().addEventListener(s.OverlayModel.Events.PersistentContainerQueryOverlayStateChanged,(e=>{const{nodeId:t,enabled:s}=e.data;t===n&&r.toggle(s)})),e.styleAdorners.push(r)}}const Vi=500,Bi=new Set(["area","base","basefont","br","canvas","col","command","embed","frame","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr"]),_i=new Set(["html","head","body"]);function Wi(e,t){const s=h.AdornerManager.compareAdornerNamesByCategory(t.name,t.name);return 0===s?e.name.localeCompare(t.name):s}var qi=Object.freeze({__proto__:null,ElementsTreeElement:Hi,InitialChildrenLimit:Vi,ForbiddenClosingTagElements:Bi,EditTagBlocklist:_i,adornerComparator:Wi});class zi{throttler;treeOutline;currentHighlightedElement;alreadyExpandedParentElement;pendingHighlightNode;isModifyingTreeOutline;constructor(e,t){this.throttler=t,this.treeOutline=e,this.treeOutline.addEventListener(n.TreeOutline.Events.ElementExpanded,this.clearState,this),this.treeOutline.addEventListener(n.TreeOutline.Events.ElementCollapsed,this.clearState,this),this.treeOutline.addEventListener(Si.Events.SelectedNodeChanged,this.clearState,this),s.TargetManager.TargetManager.instance().addModelListener(s.OverlayModel.OverlayModel,s.OverlayModel.Events.HighlightNodeRequested,this.highlightNode,this,{scoped:!0}),s.TargetManager.TargetManager.instance().addModelListener(s.OverlayModel.OverlayModel,s.OverlayModel.Events.InspectModeWillBeToggled,this.clearState,this,{scoped:!0}),this.currentHighlightedElement=null,this.alreadyExpandedParentElement=null,this.pendingHighlightNode=null,this.isModifyingTreeOutline=!1}highlightNode(t){if(!e.Settings.Settings.instance().moduleSetting("highlightNodeOnHoverInOverlay").get())return;const s=t.data;this.throttler.schedule((async()=>{this.highlightNodeInternal(this.pendingHighlightNode),this.pendingHighlightNode=null})),this.pendingHighlightNode=this.treeOutline===Si.forDOMModel(s.domModel())?s:null}highlightNodeInternal(e){this.isModifyingTreeOutline=!0;let t=null;if(this.currentHighlightedElement){let e=this.currentHighlightedElement;for(;e&&e!==this.alreadyExpandedParentElement;){e.expanded&&e.collapse();const t=e.parent;e=t instanceof Hi?t:null}}if(this.currentHighlightedElement=null,this.alreadyExpandedParentElement=null,e){let s=e;const n=this.treeOutline.treeElementByNode,i=e=>{const t=n.get(e);return!t||!t.expanded};for(;s&&i(s);)s=s.parentNode;this.alreadyExpandedParentElement=s?n.get(s):this.treeOutline.rootElement(),t=this.treeOutline.createTreeElementFor(e)}this.currentHighlightedElement=t,this.treeOutline.setHoverEffect(t),t&&t.reveal(!0),this.isModifyingTreeOutline=!1}clearState(){this.isModifyingTreeOutline||(this.currentHighlightedElement=null,this.alreadyExpandedParentElement=null,this.pendingHighlightNode=null)}}var Ki=Object.freeze({__proto__:null,ElementsTreeElementHighlighter:zi});const ji=new CSSStyleSheet;ji.replaceSync(".metrics{padding:8px;font-size:10px;text-align:center;white-space:nowrap;min-height:var(--metrics-height);display:flex;flex-direction:column;align-items:center;justify-content:center;--override-box-model-separator-color:#000;--override-box-model-text-color:#222}:host{--metrics-height:190px;height:var(--metrics-height);contain:strict}:host(.invisible){visibility:hidden;height:0}:host(.collapsed){visibility:collapse;height:0}:host-context(.platform-windows){--metrics-height:214px}.metrics .label{position:absolute;font-size:10px;left:4px}.metrics .position{border:1px var(--color-text-secondary) dotted;background-color:var(--color-background);display:inline-block;text-align:center;padding:3px;margin:3px;position:relative}.metrics .margin{border:1px dashed var(--override-box-model-separator-color);background-color:var(--color-background);display:inline-block;text-align:center;vertical-align:middle;padding:3px 6px;margin:3px;position:relative}.metrics .border{border:1px solid var(--override-box-model-separator-color);background-color:var(--color-background);display:inline-block;text-align:center;vertical-align:middle;padding:3px 6px;margin:3px;position:relative}.metrics .padding{border:1px dashed var(--override-box-model-separator-color);background-color:var(--color-background);display:inline-block;text-align:center;vertical-align:middle;padding:3px 6px;margin:3px;position:relative;min-width:120px}.metrics .content{position:static;border:1px solid var(--override-box-model-separator-color);background-color:var(--color-background);display:inline-block;text-align:center;vertical-align:middle;padding:3px;margin:3px;min-width:80px;overflow:visible}.metrics .content span{display:inline-block}.metrics .editing{position:relative;z-index:100;cursor:text}.metrics .left{display:inline-block;vertical-align:middle}.metrics .right{display:inline-block;vertical-align:middle}.metrics .top{display:inline-block}.metrics .bottom{display:inline-block}:host-context(.-theme-with-dark-background) .margin:hover,\n:host-context(.-theme-with-dark-background) .margin:hover *{border-color:var(--color-text-secondary)}.metrics .highlighted:not(.position) > *:not(.border):not(.padding):not(.content){color:var(--override-box-model-text-color)}\n/*# sourceURL=metricsSidebarPane.css */\n");class $i extends He{originalPropertyData;previousPropertyDataCandidate;inlineStyle;highlightMode;boxElements;isEditingMetrics;constructor(){super(),this.originalPropertyData=null,this.previousPropertyDataCandidate=null,this.inlineStyle=null,this.highlightMode="",this.boxElements=[]}doUpdate(){if(this.isEditingMetrics)return Promise.resolve();const e=this.node(),t=this.cssModel();if(!e||e.nodeType()!==Node.ELEMENT_NODE||!t)return this.contentElement.removeChildren(),this.element.classList.add("collapsed"),Promise.resolve();if(!e.id)return Promise.resolve();const s=[t.getComputedStyle(e.id).then(function(t){t&&this.node()===e&&this.updateMetrics(t)}.bind(this)),t.getInlineStyles(e.id).then((t=>{t&&this.node()===e&&(this.inlineStyle=t.inlineStyle)}))];return Promise.all(s)}onCSSModelChanged(){this.update()}toggleVisibility(e){this.element.classList.toggle("invisible",!e)}getPropertyValueAsPx(e,t){const s=e.get(t);return s?Number(s.replace(/px$/,"")||0):0}getBox(e,t){const s="border"===t?"-width":"";return{left:this.getPropertyValueAsPx(e,t+"-left"+s),top:this.getPropertyValueAsPx(e,t+"-top"+s),right:this.getPropertyValueAsPx(e,t+"-right"+s),bottom:this.getPropertyValueAsPx(e,t+"-bottom"+s)}}highlightDOMNode(e,t,n){n.consume();const i=this.node();if(e&&i){if(this.highlightMode===t)return;this.highlightMode=t,i.highlight(t)}else this.highlightMode="",s.OverlayModel.OverlayModel.hideDOMNodeHighlight();for(const{element:e,name:s,backgroundColor:n}of this.boxElements){const o=!i||"all"===t||s===t;e.style.backgroundColor=o?n:"",e.classList.toggle("highlighted",o)}}updateMetrics(t){const s=document.createElement("div");s.className="metrics";const n=this;function i(e,t,s,n){const i=document.createElement("div");i.className=s;const o=("position"!==t?t+"-":"")+s+n;let a=e.get(o);return void 0===a||((""===a||"position"!==t&&"0px"===a||"position"===t&&"auto"===a)&&(a="‒"),a=a.replace(/px$/,""),a=r.NumberUtilities.toFixedIfFloating(a),i.textContent=a,i.addEventListener("dblclick",this.startEditing.bind(this,i,t,o,e),!1)),i}function o(e){let t=e.get("width");if(!t)return"";t=t.replace(/px$/,"");const s=Number(t);if(!isNaN(s)&&"border-box"===e.get("box-sizing")){const i=n.getBox(e,"border"),o=n.getBox(e,"padding");t=(s-i.left-i.right-o.left-o.right).toString()}return r.NumberUtilities.toFixedIfFloating(t)}function a(e){let t=e.get("height");if(!t)return"";t=t.replace(/px$/,"");const s=Number(t);if(!isNaN(s)&&"border-box"===e.get("box-sizing")){const i=n.getBox(e,"border"),o=n.getBox(e,"padding");t=(s-i.top-i.bottom-o.top-o.bottom).toString()}return r.NumberUtilities.toFixedIfFloating(t)}const l=new Set(["table-cell","table-column","table-column-group","table-footer-group","table-header-group","table-row","table-row-group"]),d=new Set(["table-column","table-column-group","table-footer-group","table-header-group","table-row","table-row-group"]),c=new Set(["static"]),h=["content","padding","border","margin","position"],u=[e.Color.PageHighlight.Content,e.Color.PageHighlight.Padding,e.Color.PageHighlight.Border,e.Color.PageHighlight.Margin,e.Color.Legacy.fromRGBA([0,0,0,0])],p=["content","padding","border","margin","position"];let m=null;this.boxElements=[];for(let e=0;e<h.length;++e){const s=h[e],n=t.get("display"),r=t.get("position");if(!n||!r)continue;if("margin"===s&&l.has(n))continue;if("padding"===s&&d.has(n))continue;if("position"===s&&c.has(r))continue;const g=document.createElement("div");g.className=`${s} highlighted`;const f=u[e].asString("rgba")||"";if(g.style.backgroundColor=f,g.addEventListener("mouseover",this.highlightDOMNode.bind(this,!0,"position"===s?"all":s),!1),this.boxElements.push({element:g,name:s,backgroundColor:f}),"content"===s){const e=document.createElement("span");e.textContent=o(t),e.addEventListener("dblclick",this.startEditing.bind(this,e,"width","width",t),!1);const s=document.createElement("span");s.textContent=a(t),s.addEventListener("dblclick",this.startEditing.bind(this,s,"height","height",t),!1);const n=document.createElement("span");n.textContent=" × ",g.appendChild(e),g.appendChild(n),g.appendChild(s)}else{const n="border"===s?"-width":"",o=document.createElement("div");o.className="label",o.textContent=p[e],g.appendChild(o),g.appendChild(i.call(this,t,s,"top",n)),g.appendChild(document.createElement("br")),g.appendChild(i.call(this,t,s,"left",n)),m&&g.appendChild(m),g.appendChild(i.call(this,t,s,"right",n)),g.appendChild(document.createElement("br")),g.appendChild(i.call(this,t,s,"bottom",n))}m=g}s.appendChild(m),s.addEventListener("mouseover",this.highlightDOMNode.bind(this,!1,"all"),!1),s.addEventListener("mouseleave",this.highlightDOMNode.bind(this,!1,"all"),!1),this.contentElement.removeChildren(),this.contentElement.appendChild(s),this.element.classList.remove("collapsed")}startEditing(e,t,s,i){if(n.UIUtils.isBeingEdited(e))return;const o={box:t,styleProperty:s,computedStyle:i,keyDownHandler:()=>{}},r=this.handleKeyDown.bind(this,o);o.keyDownHandler=r,e.addEventListener("keydown",r,!1),this.isEditingMetrics=!0;const a=new n.InplaceEditor.Config(this.editingCommitted.bind(this),this.editingCancelled.bind(this),o);n.InplaceEditor.InplaceEditor.startEditing(e,a);const l=e.getComponentSelection();l&&l.selectAllChildren(e)}handleKeyDown(e,t){const s=t.currentTarget;n.UIUtils.handleElementValueModifications(t,s,function(t,n){this.applyUserInput(s,n,t,e,!1)}.bind(this),void 0,(function(t,s,n){return"margin"!==e.styleProperty&&s<0&&(s=0),t+s+n}))}editingEnded(e,t){this.originalPropertyData=null,this.previousPropertyDataCandidate=null,e.removeEventListener("keydown",t.keyDownHandler,!1),delete this.isEditingMetrics}editingCancelled(e,t){if(this.inlineStyle)if(this.originalPropertyData)this.inlineStyle.allProperties()[this.originalPropertyData.index].setText(this.originalPropertyData.propertyText||"",!1);else{const e=this.inlineStyle.pastLastSourcePropertyIndex();e&&this.inlineStyle.allProperties()[e-1].setText("",!1)}this.editingEnded(e,t),this.update()}applyUserInput(t,s,n,i,o){if(!this.inlineStyle)return this.editingCancelled(t,i);if(o&&s===n)return this.editingCancelled(t,i);"position"===i.box||s&&"‒"!==s?"position"!==i.box||s&&"‒"!==s||(s="auto"):s="0px",s=s.toLowerCase(),/^\d+$/.test(s)&&(s+="px");const r=i.styleProperty,a=i.computedStyle;if("border-box"===a.get("box-sizing")&&("width"===r||"height"===r)){if(!s.match(/px$/))return void e.Console.Console.instance().error("For elements with box-sizing: border-box, only absolute content area dimensions can be applied");const t=this.getBox(a,"border"),n=this.getBox(a,"padding");let i=Number(s.replace(/px$/,""));if(isNaN(i))return;i+="width"===r?t.left+t.right+n.left+n.right:t.top+t.bottom+n.top+n.bottom,s=i+"px"}this.previousPropertyDataCandidate=null;const l=this.inlineStyle.allProperties();for(let e=0;e<l.length;++e){const t=l[e];if(t.name===i.styleProperty&&t.activeInStyle())return this.previousPropertyDataCandidate=t,void t.setValue(s,o,!0,d.bind(this))}function d(e){if(e){if(this.originalPropertyData||(this.originalPropertyData=this.previousPropertyDataCandidate),this.highlightMode){const e=this.node();if(!e)return;e.highlight(this.highlightMode)}o&&this.update()}}this.inlineStyle.appendProperty(i.styleProperty,s,d.bind(this))}editingCommitted(e,t,s,n){this.editingEnded(e,n),this.applyUserInput(e,t,s,n,!0)}wasShown(){super.wasShown(),this.registerCSSFiles([ji])}}var Gi=Object.freeze({__proto__:null,MetricsSidebarPane:$i});const Yi={findByStringSelectorOrXpath:"Find by string, selector, or `XPath`",switchToAccessibilityTreeView:"Switch to Accessibility Tree view",switchToDomTreeView:"Switch to DOM Tree view",showComputedStylesSidebar:"Show Computed Styles sidebar",hideComputedStylesSidebar:"Hide Computed Styles sidebar",computedStylesShown:"Computed Styles sidebar shown",computedStylesHidden:"Computed Styles sidebar hidden",computed:"Computed",styles:"Styles",revealInElementsPanel:"Reveal in Elements panel",nodeCannotBeFoundInTheCurrent:"Node cannot be found in the current page.",theRemoteObjectCouldNotBe:"The remote object could not be resolved to a valid node.",theDeferredDomNodeCouldNotBe:"The deferred `DOM` Node could not be resolved to a valid node.",elementStateS:"Element state: {PH1}",sidePanelToolbar:"Side panel toolbar",sidePanelContent:"Side panel content",domTreeExplorer:"DOM tree explorer"},Qi=o.i18n.registerUIStrings("panels/elements/ElementsPanel.ts",Yi),Xi=o.i18n.getLocalizedString.bind(void 0,Qi),Ji=e=>{const t=new d.Button.Button,s=Xi(e?Yi.switchToDomTreeView:Yi.switchToAccessibilityTreeView);return t.data={active:e,variant:"toolbar",iconUrl:new URL("../../Images/person.svg",import.meta.url).toString(),title:s},t.tabIndex=0,t.classList.add("axtree-button"),e&&t.classList.add("active"),t};let Zi;class eo extends n.Panel.Panel{splitWidget;searchableViewInternal;mainContainer;domTreeContainer;splitMode;accessibilityTreeView;breadcrumbs;stylesWidget;computedStyleWidget;metricsWidget;treeOutlines=new Set;searchResults;currentSearchResultIndex;pendingNodeReveal;adornerManager;adornerSettingsPane;adornersByName;accessibilityTreeButton;domTreeButton;selectedNodeOnReset;hasNonDefaultSelectedNode;searchConfig;omitDefaultSelection;notFirstInspectElement;sidebarPaneView;stylesViewToReveal;cssStyleTrackerByCSSModel;constructor(){super("elements"),this.splitWidget=new n.SplitWidget.SplitWidget(!0,!0,"elementsPanelSplitViewState",325,325),this.splitWidget.addEventListener(n.SplitWidget.Events.SidebarSizeChanged,this.updateTreeOutlineVisibleWidth.bind(this)),this.splitWidget.show(this.element),this.searchableViewInternal=new n.SearchableView.SearchableView(this,null),this.searchableViewInternal.setMinimumSize(25,28),this.searchableViewInternal.setPlaceholder(Xi(Yi.findByStringSelectorOrXpath));const i=this.searchableViewInternal.element;this.mainContainer=document.createElement("div"),this.domTreeContainer=document.createElement("div");const o=document.createElement("div");t.Runtime.experiments.isEnabled("fullAccessibilityTree")&&this.initializeFullAccessibilityTreeView(),this.mainContainer.appendChild(this.domTreeContainer),i.appendChild(this.mainContainer),i.appendChild(o),n.ARIAUtils.markAsMain(this.domTreeContainer),n.ARIAUtils.setLabel(this.domTreeContainer,Xi(Yi.domTreeExplorer)),this.splitWidget.setMainWidget(this.searchableViewInternal),this.splitMode=null,this.mainContainer.id="main-content",this.domTreeContainer.id="elements-content",this.domTreeContainer.tabIndex=-1,e.Settings.Settings.instance().moduleSetting("domWordWrap").get()&&this.domTreeContainer.classList.add("elements-wrap"),e.Settings.Settings.instance().moduleSetting("domWordWrap").addChangeListener(this.domWordWrapSettingChanged.bind(this)),o.id="elements-crumbs",this.domTreeButton&&(this.accessibilityTreeView=new G(this.domTreeButton,new c.TreeOutline.TreeOutline)),this.breadcrumbs=new h.ElementsBreadcrumbs.ElementsBreadcrumbs,this.breadcrumbs.addEventListener("breadcrumbsnodeselected",(e=>{this.crumbNodeSelected(e)})),o.appendChild(this.breadcrumbs),this.stylesWidget=ot.instance(),this.computedStyleWidget=new Cs,this.metricsWidget=new $i,e.Settings.Settings.instance().moduleSetting("sidebarPosition").addChangeListener(this.updateSidebarPosition.bind(this)),this.updateSidebarPosition(),this.cssStyleTrackerByCSSModel=new Map,s.TargetManager.TargetManager.instance().observeModels(s.DOMModel.DOMModel,this,{scoped:!0}),s.TargetManager.TargetManager.instance().addEventListener(s.TargetManager.Events.NameChanged,(e=>this.targetNameChanged(e.data))),e.Settings.Settings.instance().moduleSetting("showUAShadowDOM").addChangeListener(this.showUAShadowDOMChanged.bind(this)),l.ExtensionServer.ExtensionServer.instance().addEventListener(l.ExtensionServer.Events.SidebarPaneAdded,this.extensionSidebarPaneAdded,this),this.currentSearchResultIndex=-1,this.pendingNodeReveal=!1,this.adornerManager=new h.AdornerManager.AdornerManager(e.Settings.Settings.instance().moduleSetting("adornerSettings")),this.adornerSettingsPane=null,this.adornersByName=new Map}initializeFullAccessibilityTreeView(){this.accessibilityTreeButton=Ji(!1),this.accessibilityTreeButton.addEventListener("click",this.showAccessibilityTree.bind(this)),this.domTreeButton=Ji(!0),this.domTreeButton.addEventListener("click",this.showDOMTree.bind(this)),this.mainContainer.appendChild(this.accessibilityTreeButton)}showAccessibilityTree(){this.accessibilityTreeView&&this.splitWidget.setMainWidget(this.accessibilityTreeView)}showDOMTree(){this.splitWidget.setMainWidget(this.searchableViewInternal);const e=this.selectedDOMNode();if(!e)return;const t=this.treeElementForNode(e);t&&t.select()}static instance(e={forceNew:null}){const{forceNew:t}=e;return Zi&&!t||(Zi=new eo),Zi}revealProperty(e){return this.sidebarPaneView&&this.stylesViewToReveal?this.sidebarPaneView.showView(this.stylesViewToReveal).then((()=>{this.stylesWidget.revealProperty(e)})):Promise.resolve()}resolveLocation(e){return this.sidebarPaneView||null}showToolbarPane(e,t){this.stylesWidget.showToolbarPane(e,t)}modelAdded(t){const n=t.parentModel();let i=n?Si.forDOMModel(n):null;i||(i=new Si(!0,!0),i.setWordWrap(e.Settings.Settings.instance().moduleSetting("domWordWrap").get()),i.addEventListener(Si.Events.SelectedNodeChanged,this.selectedNodeChanged,this),i.addEventListener(Si.Events.ElementsTreeUpdated,this.updateBreadcrumbIfNeeded,this),new zi(i,new e.Throttler.Throttler(100)),this.treeOutlines.add(i)),i.wireToDOMModel(t),this.setupStyleTracking(t.cssModel()),this.isShowing()&&this.wasShown(),this.domTreeContainer.hasFocus()&&i.focus(),t.addEventListener(s.DOMModel.Events.DocumentUpdated,this.documentUpdatedEvent,this)}modelRemoved(e){e.removeEventListener(s.DOMModel.Events.DocumentUpdated,this.documentUpdatedEvent,this);const t=Si.forDOMModel(e);t&&(t.unwireFromDOMModel(e),e.parentModel()||(this.treeOutlines.delete(t),t.element.remove(),this.removeStyleTracking(e.cssModel())))}targetNameChanged(e){const t=e.model(s.DOMModel.DOMModel);if(!t)return;Si.forDOMModel(t)}updateTreeOutlineVisibleWidth(){if(!this.treeOutlines.size)return;let e=this.splitWidget.element.offsetWidth;this.splitWidget.isVertical()&&(e-=this.splitWidget.sidebarSize());for(const t of this.treeOutlines)t.setVisibleWidth(e)}focus(){this.treeOutlines.size?this.treeOutlines.values().next().value.focus():this.domTreeContainer.focus()}searchableView(){return this.searchableViewInternal}wasShown(){super.wasShown(),n.Context.Context.instance().setFlavor(eo,this),this.registerCSSFiles([H]);for(const e of this.treeOutlines)e.element.parentElement!==this.domTreeContainer&&this.domTreeContainer.appendChild(e.element);const e=s.TargetManager.TargetManager.instance().models(s.DOMModel.DOMModel,{scoped:!0});for(const t of e){if(t.parentModel())continue;const e=Si.forDOMModel(t);e&&(e.setVisible(!0),e.rootDOMNode||(t.existingDocument()?(e.rootDOMNode=t.existingDocument(),this.documentUpdated(t)):t.requestDocument()))}}willHide(){s.OverlayModel.OverlayModel.hideDOMNodeHighlight();for(const e of this.treeOutlines)e.setVisible(!1),this.domTreeContainer.removeChild(e.element);super.willHide(),n.Context.Context.instance().setFlavor(eo,null)}onResize(){this.element.window().requestAnimationFrame(this.updateSidebarPosition.bind(this)),this.updateTreeOutlineVisibleWidth()}selectedNodeChanged(e){let t=e.data.node;t&&t.pseudoType()&&!t.parentNode&&(t=null);const{focus:i}=e.data;for(const e of this.treeOutlines)t&&Si.forDOMModel(t.domModel())===e||e.selectDOMNode(null);if(t){const e=[h.Helper.legacyNodeToElementsComponentsNode(t)];for(let s=t.parentNode;s;s=s.parentNode)e.push(h.Helper.legacyNodeToElementsComponentsNode(s));this.breadcrumbs.data={crumbs:e,selectedNode:h.Helper.legacyNodeToElementsComponentsNode(t)},this.accessibilityTreeView&&this.accessibilityTreeView.selectedNodeChanged(t)}else this.breadcrumbs.data={crumbs:[],selectedNode:null};if(n.Context.Context.instance().setFlavor(s.DOMModel.DOMNode,t),!t)return;t.setAsInspectedNode(),i&&(this.selectedNodeOnReset=t,this.hasNonDefaultSelectedNode=!0);const o=t.domModel().runtimeModel().executionContexts(),r=t.frameId();for(const e of o)if(e.frameId===r){n.Context.Context.instance().setFlavor(s.RuntimeModel.ExecutionContext,e);break}}documentUpdatedEvent(e){const t=e.data;this.documentUpdated(t),this.removeStyleTracking(t.cssModel()),this.setupStyleTracking(t.cssModel())}documentUpdated(e){if(this.searchableViewInternal.cancelSearch(),!e.existingDocument())return void(this.isShowing()&&e.requestDocument());if(this.hasNonDefaultSelectedNode=!1,this.omitDefaultSelection)return;const t=this.selectedNodeOnReset;(async function(e,s){const n=s?s.path():null,i=n?await e.pushNodeByPathToFrontend(n):null;if(t!==this.selectedNodeOnReset)return;let o=i?e.nodeForId(i):null;if(!o){const t=e.existingDocument();o=t?t.body||t.documentElement:null}o&&(this.setDefaultSelectedNode(o),this.lastSelectedNodeSelectedForTest())}).call(this,e,this.selectedNodeOnReset||null)}lastSelectedNodeSelectedForTest(){}setDefaultSelectedNode(e){if(!e||this.hasNonDefaultSelectedNode||this.pendingNodeReveal)return;const t=Si.forDOMModel(e.domModel());t&&(this.selectDOMNode(e),t.selectedTreeElement&&t.selectedTreeElement.expand())}onSearchClosed(){const e=this.selectedDOMNode();if(!e)return;const t=this.treeElementForNode(e);t&&t.select()}onSearchCanceled(){this.searchConfig=void 0,this.hideSearchHighlights(),this.searchableViewInternal.updateSearchMatchesCount(0),this.currentSearchResultIndex=-1,delete this.searchResults,s.DOMModel.DOMModel.cancelSearch()}performSearch(t,n,i){const o=t.query,r=o.trim();if(!r.length)return;this.searchConfig&&this.searchConfig.query===o?this.hideSearchHighlights():this.onSearchCanceled(),this.searchConfig=t;const a=e.Settings.Settings.instance().moduleSetting("showUAShadowDOM").get(),l=s.TargetManager.TargetManager.instance().models(s.DOMModel.DOMModel,{scoped:!0}),d=l.map((e=>e.performSearch(r,a)));Promise.all(d).then((e=>{this.searchResults=[];for(let t=0;t<e.length;++t){const s=e[t];for(let e=0;e<s;++e)this.searchResults.push({domModel:l[t],index:e,node:void 0})}if(this.searchableViewInternal.updateSearchMatchesCount(this.searchResults.length),!this.searchResults.length)return;this.currentSearchResultIndex>=this.searchResults.length&&(this.currentSearchResultIndex=-1);let t=this.currentSearchResultIndex;n&&(t=-1===this.currentSearchResultIndex?i?-1:0:i?t-1:t+1,this.jumpToSearchResult(t))}))}domWordWrapSettingChanged(e){this.domTreeContainer.classList.toggle("elements-wrap",e.data);for(const t of this.treeOutlines)t.setWordWrap(e.data)}switchToAndFocus(e){this.searchableViewInternal.cancelSearch(),n.ViewManager.ViewManager.instance().showView("elements").then((()=>this.selectDOMNode(e,!0)))}jumpToSearchResult(e){this.searchResults&&(this.currentSearchResultIndex=(e+this.searchResults.length)%this.searchResults.length,this.highlightCurrentSearchResult())}jumpToNextSearchResult(){this.searchResults&&this.searchConfig&&this.performSearch(this.searchConfig,!0)}jumpToPreviousSearchResult(){this.searchResults&&this.searchConfig&&this.performSearch(this.searchConfig,!0,!0)}supportsCaseSensitiveSearch(){return!1}supportsRegexSearch(){return!1}highlightCurrentSearchResult(){const e=this.currentSearchResultIndex,t=this.searchResults;if(!t)return;const s=t[e];if(this.searchableViewInternal.updateCurrentMatchIndex(e),null===s.node)return;if(void 0===s.node)return void s.domModel.searchResult(s.index).then((e=>{s.node=e;this.searchConfig&&this.searchResults&&-1!==this.currentSearchResultIndex&&this.highlightCurrentSearchResult()}));const i=this.treeElementForNode(s.node);if(s.node.scrollIntoView(),i){this.searchConfig&&i.highlightSearchResults(this.searchConfig.query),i.reveal();const e=i.listItemElement.getElementsByClassName(n.UIUtils.highlightedSearchResultClassName);e.length&&e[0].scrollIntoViewIfNeeded(!1),i.select(!0)}}hideSearchHighlights(){if(!this.searchResults||!this.searchResults.length||-1===this.currentSearchResultIndex)return;const e=this.searchResults[this.currentSearchResultIndex];if(!e.node)return;const t=this.treeElementForNode(e.node);t&&t.hideSearchHighlights()}selectedDOMNode(){for(const e of this.treeOutlines)if(e.selectedDOMNode())return e.selectedDOMNode();return null}selectDOMNode(e,t){for(const s of this.treeOutlines){Si.forDOMModel(e.domModel())===s?s.selectDOMNode(e,t):s.selectDOMNode(null)}}selectAndShowSidebarTab(e){this.sidebarPaneView&&(this.sidebarPaneView.tabbedPane().selectTab(e),this.isShowing()||n.ViewManager.ViewManager.instance().showView("elements"))}updateBreadcrumbIfNeeded(e){const t=e.data,s=this.selectedDOMNode();if(!s)return void(this.breadcrumbs.data={crumbs:[],selectedNode:null});const n=h.Helper.legacyNodeToElementsComponentsNode(s),i=[n];for(let e=s.parentNode;e;e=e.parentNode)i.push(h.Helper.legacyNodeToElementsComponentsNode(e));const o=t.map(h.Helper.legacyNodeToElementsComponentsNode),r=new Map;o.forEach((e=>r.set(e.id,e)));const a=i.map((e=>r.get(e.id)||e));this.breadcrumbs.data={crumbs:a,selectedNode:n}}crumbNodeSelected(e){this.selectDOMNode(e.legacyDomNode,!0)}treeOutlineForNode(e){return e?Si.forDOMModel(e.domModel()):null}treeElementForNode(e){const t=this.treeOutlineForNode(e);return t?t.findTreeElement(e):null}leaveUserAgentShadowDOM(e){let t;for(;(t=e.ancestorUserAgentShadowRoot())&&t.parentNode;)e=t.parentNode;return e}async revealAndSelectNode(t,s,o){this.omitDefaultSelection=!0;const r=e.Settings.Settings.instance().moduleSetting("showUAShadowDOM").get()?t:this.leaveUserAgentShadowDOM(t);o||r.highlightForTwoSeconds(),this.accessibilityTreeView&&this.accessibilityTreeView.revealAndSelectNode(t),await n.ViewManager.ViewManager.instance().showView("elements",!1,!s),this.selectDOMNode(r,s),delete this.omitDefaultSelection,this.notFirstInspectElement||(eo.firstInspectElementNodeNameForTest=r.nodeName(),eo.firstInspectElementCompletedForTest(),i.InspectorFrontendHost.InspectorFrontendHostInstance.inspectElementCompleted()),this.notFirstInspectElement=!0}showUAShadowDOMChanged(){for(const e of this.treeOutlines)e.update()}setupTextSelectionHack(e){const t=n.bind(this),s=e=>{0===e.buttons&&n.call(this)};function n(){this.splitWidget.element.classList.remove("disable-resizer-for-elements-hack"),e.style.removeProperty("left"),e.style.removeProperty("padding-left"),e.style.removeProperty("width"),e.style.removeProperty("position"),e.window().removeEventListener("blur",t),e.window().removeEventListener("contextmenu",t,!0),e.window().removeEventListener("dragstart",t,!0),e.window().removeEventListener("mousemove",s,!0),e.window().removeEventListener("mouseup",t,!0),e.window().removeEventListener("visibilitychange",t)}e.addEventListener("mousedown",(n=>{if(0!==n.button)return;this.splitWidget.element.classList.add("disable-resizer-for-elements-hack"),e.style.setProperty("height",`${e.offsetHeight}px`);e.style.setProperty("left","-1000000px"),e.style.setProperty("padding-left","1000000px"),e.style.setProperty("width","calc(100% + 1000000px)"),e.style.setProperty("position","fixed"),e.window().addEventListener("blur",t),e.window().addEventListener("contextmenu",t,!0),e.window().addEventListener("dragstart",t,!0),e.window().addEventListener("mousemove",s,!0),e.window().addEventListener("mouseup",t,!0),e.window().addEventListener("visibilitychange",t)}),!0)}initializeSidebarPanes(e){this.splitWidget.setVertical("Vertical"===e),this.showToolbarPane(null,null);const t=new n.Widget.VBox;t.element.classList.add("style-panes-wrapper"),this.stylesWidget.show(t.element),this.setupTextSelectionHack(t.element);const s=new n.Widget.VBox;s.element.classList.add("style-panes-wrapper"),this.computedStyleWidget.show(s.element);const o=new n.SplitWidget.SplitWidget(!0,!0,"elements.styles.sidebar.width",100);o.setMainWidget(t),o.hideSidebar(),o.enableShowModeSaving(),o.addEventListener(n.SplitWidget.Events.ShowModeChanged,(()=>{a()})),this.stylesWidget.addEventListener("InitialUpdateCompleted",(()=>{this.stylesWidget.appendToolbarItem(o.createShowHideSidebarButton(Xi(Yi.showComputedStylesSidebar),Xi(Yi.hideComputedStylesSidebar),Xi(Yi.computedStylesShown),Xi(Yi.computedStylesHidden)))}));const r=()=>{this.metricsWidget.show(s.element,this.computedStyleWidget.element),this.metricsWidget.toggleVisibility(!0),this.stylesWidget.removeEventListener("StylesUpdateCompleted",c)},a=()=>{o.showMode()===n.SplitWidget.ShowMode.Both?r():(this.metricsWidget.show(t.element),this.stylesWidget.hasMatchedStyles||this.metricsWidget.toggleVisibility(!1),this.stylesWidget.addEventListener("StylesUpdateCompleted",c))};let d=!1;const c=e=>{this.metricsWidget.toggleVisibility(e.data.hasMatchedStyles)};this.sidebarPaneView=n.ViewManager.ViewManager.instance().createTabbedLocation((()=>n.ViewManager.ViewManager.instance().showView("elements")),"Styles-pane-sidebar",!1,!0);const h=this.sidebarPaneView.tabbedPane();"Vertical"!==this.splitMode&&this.splitWidget.installResizer(h.headerElement());const u=h.headerElement();n.ARIAUtils.markAsNavigation(u),n.ARIAUtils.setLabel(u,Xi(Yi.sidePanelToolbar));const p=h.tabbedPaneContentElement();n.ARIAUtils.markAsComplementary(p),n.ARIAUtils.setLabel(p,Xi(Yi.sidePanelContent));const m=new n.View.SimpleView(Xi(Yi.styles),void 0,"Styles");this.sidebarPaneView.appendView(m),m.element.classList.add("flex-auto"),o.show(m.element);const g=new n.View.SimpleView(Xi(Yi.computed),void 0,"Computed");g.element.classList.add("composite","fill"),h.addEventListener(n.TabbedPane.Events.TabSelected,(e=>{const{tabId:t}=e.data;"Computed"===t?(s.show(g.element),r()):"Styles"===t&&(o.setSidebarWidget(s),a()),d?i.userMetrics.elementsSidebarTabShown(t):d=!0}),this),this.sidebarPaneView.appendView(g),this.stylesViewToReveal=m,this.sidebarPaneView.appendApplicableItems("elements-sidebar");const f=l.ExtensionServer.ExtensionServer.instance().sidebarPanes();for(let e=0;e<f.length;++e)this.addExtensionSidebarPane(f[e]);this.splitWidget.setSidebarWidget(this.sidebarPaneView.tabbedPane())}updateSidebarPosition(){if(this.sidebarPaneView&&this.sidebarPaneView.tabbedPane().shouldHideOnDetach())return;const t=e.Settings.Settings.instance().moduleSetting("sidebarPosition").get();let s="Horizontal";if(("right"===t||"auto"===t&&n.InspectorView.InspectorView.instance().element.offsetWidth>680)&&(s="Vertical"),!this.sidebarPaneView)return void this.initializeSidebarPanes(s);if(s===this.splitMode)return;this.splitMode=s;const i=this.sidebarPaneView.tabbedPane();this.splitWidget.uninstallResizer(i.headerElement()),this.splitWidget.setVertical("Vertical"===this.splitMode),this.showToolbarPane(null,null),"Vertical"!==this.splitMode&&this.splitWidget.installResizer(i.headerElement())}extensionSidebarPaneAdded(e){this.addExtensionSidebarPane(e.data)}addExtensionSidebarPane(e){this.sidebarPaneView&&e.panelName()===this.name&&this.sidebarPaneView.appendView(e)}getComputedStyleWidget(){return this.computedStyleWidget}setupStyleTracking(e){const t=e.createCSSPropertyTracker(to);t.start(),this.cssStyleTrackerByCSSModel.set(e,t),t.addEventListener(s.CSSModel.CSSPropertyTrackerEvents.TrackedCSSPropertiesUpdated,this.trackedCSSPropertiesUpdated,this)}removeStyleTracking(e){const t=this.cssStyleTrackerByCSSModel.get(e);t&&(t.stop(),this.cssStyleTrackerByCSSModel.delete(e),t.removeEventListener(s.CSSModel.CSSPropertyTrackerEvents.TrackedCSSPropertiesUpdated,this.trackedCSSPropertiesUpdated,this))}trackedCSSPropertiesUpdated({data:e}){for(const t of e){if(!t)continue;const e=this.treeElementForNode(t);e&&e.updateStyleAdorners(),h.LayoutPane.LayoutPane.instance().render()}}showAdornerSettingsPane(){this.adornerSettingsPane||(this.adornerSettingsPane=new h.AdornerSettingsPane.AdornerSettingsPane,this.adornerSettingsPane.addEventListener("adornersettingupdated",(e=>{const{adornerName:t,isEnabledNow:s,newSettings:n}=e.data,i=this.adornersByName.get(t);if(i)for(const e of i)s?e.show():e.hide();this.adornerManager.updateSettings(n)})),this.searchableViewInternal.element.prepend(this.adornerSettingsPane));const e=this.adornerManager.getSettings();this.adornerSettingsPane.data={settings:e},this.adornerSettingsPane.show()}isAdornerEnabled(e){return this.adornerManager.isAdornerEnabled(e)}registerAdorner(e){let t=this.adornersByName.get(e.name);t||(t=new Set,this.adornersByName.set(e.name,t)),t.add(e),this.isAdornerEnabled(e.name)||e.hide()}deregisterAdorner(e){const t=this.adornersByName.get(e.name);t&&t.delete(e)}static firstInspectElementCompletedForTest=function(){};static firstInspectElementNodeNameForTest=""}globalThis.Elements=globalThis.Elements||{},globalThis.Elements.ElementsPanel=eo;const to=[{name:"display",value:"grid"},{name:"display",value:"inline-grid"},{name:"display",value:"flex"},{name:"display",value:"inline-flex"},{name:"container-type",value:"inline-size"},{name:"container-type",value:"block-size"},{name:"container-type",value:"size"}];let so,no,io,oo,ro;class ao{appendApplicableItems(t,n,i){if(!(i instanceof s.RemoteObject.RemoteObject&&i.isNode()||i instanceof s.DOMModel.DOMNode||i instanceof s.DOMModel.DeferredDOMNode))return;if(eo.instance().element.isAncestor(t.target))return;const o=e.Revealer.reveal.bind(e.Revealer.Revealer,i);n.revealSection().appendItem(Xi(Yi.revealInElementsPanel),o)}static instance(){return so||(so=new ao),so}}class lo{static instance(e={forceNew:null}){const{forceNew:t}=e;return no&&!t||(no=new lo),no}reveal(t,n){const i=eo.instance();return i.pendingNodeReveal=!0,new Promise((function(e,o){if(t instanceof s.DOMModel.DOMNode)a(t);else if(t instanceof s.DOMModel.DeferredDOMNode)t.resolve((function(e){if(!e){const e=Xi(Yi.theDeferredDomNodeCouldNotBe);return void o(new r.UserVisibleError.UserVisibleError(e))}a(e)}));else if(t instanceof s.RemoteObject.RemoteObject){const e=t.runtimeModel().target().model(s.DOMModel.DOMModel);if(e)e.pushObjectAsNodeToFrontend(t).then((function(e){if(!e){const e=Xi(Yi.theRemoteObjectCouldNotBe);return void o(new r.UserVisibleError.UserVisibleError(e))}a(e)}));else{const e=Xi(Yi.nodeCannotBeFoundInTheCurrent);o(new r.UserVisibleError.UserVisibleError(e))}}else{const e=Xi(Yi.theRemoteObjectCouldNotBe);o(new r.UserVisibleError.UserVisibleError(e)),i.pendingNodeReveal=!1}function a(a){i.pendingNodeReveal=!1;let l=a;for(;l.parentNode;)l=l.parentNode;const d=!(l instanceof s.DOMModel.DOMDocument);if(!(t instanceof s.DOMModel.DOMDocument)&&d){const e=Xi(Yi.nodeCannotBeFoundInTheCurrent);return void o(new r.UserVisibleError.UserVisibleError(e))}if(a)return void i.revealAndSelectNode(a,!n).then(e);const c=Xi(Yi.nodeCannotBeFoundInTheCurrent);o(new r.UserVisibleError.UserVisibleError(c))}})).catch((t=>{let s;throw s=r.UserVisibleError.isUserVisibleError(t)?t.message:Xi(Yi.nodeCannotBeFoundInTheCurrent),e.Console.Console.instance().warn(s),t}))}}class co{static instance(e={forceNew:null}){const{forceNew:t}=e;return io&&!t||(io=new co),io}reveal(e){return eo.instance().revealProperty(e)}}class ho{handleAction(e,t){const i=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!i)return!0;const o=Si.forDOMModel(i.domModel());if(!o)return!0;switch(t){case"elements.hide-element":return o.toggleHideElement(i),!0;case"elements.edit-as-html":return o.toggleEditAsHTML(i),!0;case"elements.duplicate-element":return o.duplicateNode(i),!0;case"elements.copy-styles":return o.findTreeElement(i)?.copyStyles(),!0;case"elements.undo":return s.DOMModel.DOMModelUndoStack.instance().undo(),eo.instance().stylesWidget.forceUpdate(),!0;case"elements.redo":return s.DOMModel.DOMModelUndoStack.instance().redo(),eo.instance().stylesWidget.forceUpdate(),!0;case"elements.show-styles":return eo.instance().selectAndShowSidebarTab("Styles"),!0;case"elements.show-computed":return eo.instance().selectAndShowSidebarTab("Computed"),!0;case"elements.toggle-eye-dropper":{const e=n.Context.Context.instance().flavor(ye);if(!e)return!1;e.toggleEyeDropper()}}return!1}static instance(e={forceNew:null}){const{forceNew:t}=e;return oo&&!t||(oo=new ho),oo}}class uo{static instance(e={forceNew:null}){const{forceNew:t}=e;return ro&&!t||(ro=new uo),ro}decorate(e){const t=e.domModel().cssModel().pseudoState(e);return t?{color:"orange",title:Xi(Yi.elementStateS,{PH1:":"+t.join(", :")})}:null}}var po=Object.freeze({__proto__:null,ElementsPanel:eo,ContextMenuProvider:ao,DOMNodeRevealer:lo,CSSPropertyRevealer:co,ElementsActionDelegate:ho,PseudoStateMarkerDecorator:uo});let mo,go;class fo{toggleSearchAction;mode;showDetailedInspectTooltipSetting;constructor(){this.toggleSearchAction=n.ActionRegistry.ActionRegistry.instance().action("elements.toggle-element-search"),this.mode="none",s.TargetManager.TargetManager.instance().addEventListener(s.TargetManager.Events.SuspendStateChanged,this.suspendStateChanged,this),s.TargetManager.TargetManager.instance().addModelListener(s.OverlayModel.OverlayModel,s.OverlayModel.Events.ExitedInspectMode,(()=>this.setMode("none")),void 0,{scoped:!0}),s.OverlayModel.OverlayModel.setInspectNodeHandler(this.inspectNode.bind(this)),s.TargetManager.TargetManager.instance().observeModels(s.OverlayModel.OverlayModel,this,{scoped:!0}),this.showDetailedInspectTooltipSetting=e.Settings.Settings.instance().moduleSetting("showDetailedInspectTooltip"),this.showDetailedInspectTooltipSetting.addChangeListener(this.showDetailedInspectTooltipChanged.bind(this)),document.addEventListener("keydown",(e=>{e.keyCode===n.KeyboardShortcut.Keys.Esc.code&&this.isInInspectElementMode()&&(this.setMode("none"),e.consume(!0))}),!0)}static instance({forceNew:e}={forceNew:!1}){return mo&&!e||(mo=new fo),mo}modelAdded(e){"none"!==this.mode&&e.setInspectMode(this.mode,this.showDetailedInspectTooltipSetting.get())}modelRemoved(e){}isInInspectElementMode(){return"none"!==this.mode}toggleInspectMode(){let t;t=this.isInInspectElementMode()?"none":e.Settings.Settings.instance().moduleSetting("showUAShadowDOM").get()?"searchForUAShadowDOM":"searchForNode",this.setMode(t)}captureScreenshotMode(){this.setMode("captureAreaScreenshot")}setMode(e){if(!s.TargetManager.TargetManager.instance().allTargetsSuspended()){this.mode=e;for(const t of s.TargetManager.TargetManager.instance().models(s.OverlayModel.OverlayModel,{scoped:!0}))t.setInspectMode(e,this.showDetailedInspectTooltipSetting.get());this.toggleSearchAction&&this.toggleSearchAction.setToggled(this.isInInspectElementMode())}}suspendStateChanged(){s.TargetManager.TargetManager.instance().allTargetsSuspended()&&(this.mode="none",this.toggleSearchAction&&this.toggleSearchAction.setToggled(!1))}inspectNode(e){eo.instance().revealAndSelectNode(e,!0,!0)}showDetailedInspectTooltipChanged(){this.setMode(this.mode)}}class yo{handleAction(e,s){return!t.Runtime.Runtime.queryParam("isSharedWorker")&&(mo=fo.instance(),!!mo&&("elements.toggle-element-search"===s?mo.toggleInspectMode():"elements.capture-area-screenshot"===s&&mo.captureScreenshotMode(),!0))}static instance(e={forceNew:null}){const{forceNew:t}=e;return go&&!t||(go=new yo),go}}var Co=Object.freeze({__proto__:null,InspectElementModeController:fo,ToggleSearchActionDelegate:yo});const So={frameworkListeners:"`Framework` listeners",refresh:"Refresh",showListenersOnTheAncestors:"Show listeners on the ancestors",ancestors:"Ancestors",eventListenersCategory:"Event listeners category",all:"All",passive:"Passive",blocking:"Blocking",resolveEventListenersBoundWith:"Resolve event listeners bound with framework"},bo=o.i18n.registerUIStrings("panels/elements/EventListenersWidget.ts",So),Eo=o.i18n.getLocalizedString.bind(void 0,bo);let vo;class wo extends n.ThrottledWidget.ThrottledWidget{toolbarItemsInternal;showForAncestorsSetting;dispatchFilterBySetting;showFrameworkListenersSetting;eventListenersView;lastRequestedNode;constructor(){super(),this.toolbarItemsInternal=[],this.showForAncestorsSetting=e.Settings.Settings.instance().moduleSetting("showEventListenersForAncestors"),this.showForAncestorsSetting.addChangeListener(this.update.bind(this)),this.dispatchFilterBySetting=e.Settings.Settings.instance().createSetting("eventListenerDispatchFilterType",xo.All),this.dispatchFilterBySetting.addChangeListener(this.update.bind(this)),this.showFrameworkListenersSetting=e.Settings.Settings.instance().createSetting("showFrameowkrListeners",!0),this.showFrameworkListenersSetting.setTitle(Eo(So.frameworkListeners)),this.showFrameworkListenersSetting.addChangeListener(this.showFrameworkListenersChanged.bind(this)),this.eventListenersView=new F.EventListenersView.EventListenersView(this.update.bind(this)),this.eventListenersView.show(this.element);const t=new n.Toolbar.ToolbarButton(Eo(So.refresh),"refresh");t.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.update.bind(this)),this.toolbarItemsInternal.push(t),this.toolbarItemsInternal.push(new n.Toolbar.ToolbarSettingCheckbox(this.showForAncestorsSetting,Eo(So.showListenersOnTheAncestors),Eo(So.ancestors)));const i=new n.Toolbar.ToolbarComboBox(this.onDispatchFilterTypeChanged.bind(this),Eo(So.eventListenersCategory));function o(e,t){const s=i.createOption(e,t);t===this.dispatchFilterBySetting.get()&&i.select(s)}o.call(this,Eo(So.all),xo.All),o.call(this,Eo(So.passive),xo.Passive),o.call(this,Eo(So.blocking),xo.Blocking),i.setMaxWidth(200),this.toolbarItemsInternal.push(i),this.toolbarItemsInternal.push(new n.Toolbar.ToolbarSettingCheckbox(this.showFrameworkListenersSetting,Eo(So.resolveEventListenersBoundWith))),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.update,this),this.update()}static instance(e={forceNew:null}){const{forceNew:t}=e;return vo&&!t||(vo=new wo),vo}doUpdate(){this.lastRequestedNode&&(this.lastRequestedNode.domModel().runtimeModel().releaseObjectGroup(To),delete this.lastRequestedNode);const e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!e)return this.eventListenersView.reset(),this.eventListenersView.addEmptyHolderIfNeeded(),Promise.resolve();this.lastRequestedNode=e;const t=!this.showForAncestorsSetting.get(),i=[];if(i.push(e.resolveToObject(To)),!t){let t=e.parentNode;for(;t;)i.push(t.resolveToObject(To)),t=t.parentNode;i.push(this.windowObjectInNodeContext(e))}return Promise.all(i).then(this.eventListenersView.addObjects.bind(this.eventListenersView)).then(this.showFrameworkListenersChanged.bind(this))}toolbarItems(){return this.toolbarItemsInternal}onDispatchFilterTypeChanged(e){const t=e.target;this.dispatchFilterBySetting.set(t.value)}showFrameworkListenersChanged(){const e=this.dispatchFilterBySetting.get(),t=e===xo.All||e===xo.Passive,s=e===xo.All||e===xo.Blocking;this.eventListenersView.showFrameworkListeners(this.showFrameworkListenersSetting.get(),t,s)}windowObjectInNodeContext(e){const t=e.domModel().runtimeModel().executionContexts();let s=t[0];if(e.frameId())for(let n=0;n<t.length;++n){const i=t[n];i.frameId===e.frameId()&&i.isDefault&&(s=i)}return s.evaluate({expression:"self",objectGroup:To,includeCommandLineAPI:!1,silent:!0,returnByValue:!1,generatePreview:!1},!1,!1).then((e=>"object"in e?e.object:null))}eventListenersArrivedForTest(){}}const xo={All:"All",Blocking:"Blocking",Passive:"Passive"},To="event-listeners-panel";var Io=Object.freeze({__proto__:null,EventListenersWidget:wo,DispatchFilterBy:xo});const Mo=new CSSStyleSheet;Mo.replaceSync(".properties-widget-section{padding:2px 0 2px 5px;flex:none}.properties-widget-toolbar{border-bottom:1px solid var(--color-details-hairline-light);flex-shrink:0}.properties-widget-filter-box{flex:auto;display:flex}.properties-widget-filter-box > input{outline:none!important;border:none;width:100%;background:var(--color-background);padding-left:4px;margin:3px}.properties-widget-filter-box > input:focus,\n.properties-widget-filter-box > input:not(:placeholder-shown){box-shadow:var(--legacy-focus-ring-active-shadow)}.properties-widget-filter-box > input::placeholder{color:var(--color-text-secondary)}@media (forced-colors: active){.properties-widget-filter-box > input{border:1px solid ButtonText}}\n/*# sourceURL=propertiesWidget.css */\n");const No={filter:"Filter",filterProperties:"Filter Properties",showAll:"Show all",showAllTooltip:"When unchecked, only properties whose values are neither null nor undefined will be shown",noMatchingProperty:"No matching property"},Po=o.i18n.registerUIStrings("panels/elements/PropertiesWidget.ts",No),Ro=o.i18n.getLocalizedString.bind(void 0,Po);let ko;class Lo extends n.ThrottledWidget.ThrottledWidget{node;showAllPropertiesSetting;filterRegex=null;noMatchesElement;treeOutline;expandController;lastRequestedNode;constructor(t){super(!0,t),this.showAllPropertiesSetting=e.Settings.Settings.instance().createSetting("showAllProperties",!1),this.showAllPropertiesSetting.addChangeListener(this.filterList.bind(this)),s.TargetManager.TargetManager.instance().addModelListener(s.DOMModel.DOMModel,s.DOMModel.Events.AttrModified,this.onNodeChange,this,{scoped:!0}),s.TargetManager.TargetManager.instance().addModelListener(s.DOMModel.DOMModel,s.DOMModel.Events.AttrRemoved,this.onNodeChange,this,{scoped:!0}),s.TargetManager.TargetManager.instance().addModelListener(s.DOMModel.DOMModel,s.DOMModel.Events.CharacterDataModified,this.onNodeChange,this,{scoped:!0}),s.TargetManager.TargetManager.instance().addModelListener(s.DOMModel.DOMModel,s.DOMModel.Events.ChildNodeCountUpdated,this.onNodeChange,this,{scoped:!0}),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.setNode,this),this.node=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);const o=this.contentElement.createChild("div","hbox properties-widget-toolbar"),r=o.createChild("div","properties-widget-filter-box"),a=ot.createPropertyFilterElement(Ro(No.filter),o,this.filterProperties.bind(this));n.ARIAUtils.setLabel(a,Ro(No.filterProperties)),r.appendChild(a);new n.Toolbar.Toolbar("styles-pane-toolbar",o).appendToolbarItem(new n.Toolbar.ToolbarSettingCheckbox(this.showAllPropertiesSetting,Ro(No.showAllTooltip),Ro(No.showAll))),this.noMatchesElement=this.contentElement.createChild("div","gray-info-message hidden"),this.noMatchesElement.textContent=Ro(No.noMatchingProperty),this.treeOutline=new U.ObjectPropertiesSection.ObjectPropertiesSectionsTreeOutline({readOnly:!0}),this.treeOutline.setShowSelectionOnKeyboardFocus(!0,!1),this.expandController=new U.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController(this.treeOutline),this.contentElement.appendChild(this.treeOutline.element),this.treeOutline.addEventListener(n.TreeOutline.Events.ElementExpanded,(()=>{i.userMetrics.actionTaken(i.UserMetrics.Action.DOMPropertiesExpanded)})),this.update()}static instance(e){return ko&&!e?.forceNew||(ko=new Lo(e?.throttlingTimeout)),ko}filterProperties(e){this.filterRegex=e,this.filterList()}filterList(){let e=!0;for(const t of this.treeOutline.rootElement().children()){const{property:s}=t,n=!s?.match({includeNullOrUndefinedValues:this.showAllPropertiesSetting.get(),regex:this.filterRegex});n||(e=!1),t.hidden=n}this.noMatchesElement.classList.toggle("hidden",!e)}setNode(e){this.node=e.data,this.update()}async doUpdate(){if(this.lastRequestedNode&&(this.lastRequestedNode.domModel().runtimeModel().releaseObjectGroup("properties-sidebar-pane"),delete this.lastRequestedNode),!this.node)return void this.treeOutline.removeChildren();this.lastRequestedNode=this.node;const e=await this.node.resolveToObject("properties-sidebar-pane");if(!e)return;const t=this.treeOutline.rootElement();let{properties:n}=await s.RemoteObject.RemoteObject.loadFromObjectPerProto(e,!0);t.removeChildren(),null===n&&(n=[]),U.ObjectPropertiesSection.ObjectPropertyTreeElement.populateWithProperties(t,n,null,!0,!0,e),this.filterList()}onNodeChange(e){if(!this.node)return;const t=e.data,n=t instanceof s.DOMModel.DOMNode?t:t.node;this.node===n&&this.update()}wasShown(){super.wasShown(),this.registerCSSFiles([Mo])}}var Ao=Object.freeze({__proto__:null,PropertiesWidget:Lo});const Oo=new CSSStyleSheet;Oo.replaceSync(".stack-trace{font-size:11px!important;font-family:Menlo,monospace}\n/*# sourceURL=nodeStackTraceWidget.css */\n");const Do={noStackTraceAvailable:"No stack trace available"},Fo=o.i18n.registerUIStrings("panels/elements/NodeStackTraceWidget.ts",Do),Uo=o.i18n.getLocalizedString.bind(void 0,Fo);let Ho;class Vo extends n.ThrottledWidget.ThrottledWidget{noStackTraceElement;creationStackTraceElement;linkifier;constructor(){super(!0),this.noStackTraceElement=this.contentElement.createChild("div","gray-info-message"),this.noStackTraceElement.textContent=Uo(Do.noStackTraceAvailable),this.creationStackTraceElement=this.contentElement.createChild("div","stack-trace"),this.linkifier=new m.Linkifier.Linkifier(Bo)}static instance(e={forceNew:null}){const{forceNew:t}=e;return Ho&&!t||(Ho=new Vo),Ho}wasShown(){super.wasShown(),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.update,this),this.registerCSSFiles([Oo]),this.update()}willHide(){n.Context.Context.instance().removeFlavorChangeListener(s.DOMModel.DOMNode,this.update,this)}async doUpdate(){const e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!e)return this.noStackTraceElement.classList.remove("hidden"),void this.creationStackTraceElement.classList.add("hidden");const t=await e.creationStackTrace();if(t){this.noStackTraceElement.classList.add("hidden"),this.creationStackTraceElement.classList.remove("hidden");const s=m.JSPresentationUtils.buildStackTracePreviewContents(e.domModel().target(),this.linkifier,{stackTrace:t,tabStops:void 0});this.creationStackTraceElement.removeChildren(),this.creationStackTraceElement.appendChild(s.element)}else this.noStackTraceElement.classList.remove("hidden"),this.creationStackTraceElement.classList.add("hidden")}}const Bo=40;var _o=Object.freeze({__proto__:null,NodeStackTraceWidget:Vo,MaxLengthForLinks:Bo});const Wo=new CSSStyleSheet;Wo.replaceSync('.styles-element-classes-pane{background-color:var(--color-background-elevation-1);border-bottom:1px solid var(--color-details-hairline);padding:6px 2px 2px}.styles-element-classes-container{display:flex;flex-wrap:wrap;justify-content:flex-start}.styles-element-classes-pane [is="dt-checkbox"]{margin-right:15px}.styles-element-classes-pane .title-container{padding-bottom:2px}.styles-element-classes-pane .new-class-input{padding-left:3px;padding-right:3px;overflow:hidden;border:1px solid var(--input-outline);line-height:15px;margin-left:3px;width:calc(100% - 7px);background-color:var(--color-background);cursor:text}\n/*# sourceURL=classesPaneWidget.css */\n');const qo={addNewClass:"Add new class",classesSAdded:"Classes {PH1} added",classSAdded:"Class {PH1} added",elementClasses:"Element Classes"},zo=o.i18n.registerUIStrings("panels/elements/ClassesPaneWidget.ts",qo),Ko=o.i18n.getLocalizedString.bind(void 0,zo);class jo extends n.Widget.Widget{input;classesContainer;prompt;mutatingNodes;pendingNodeClasses;updateNodeThrottler;previousTarget;constructor(){super(!0),this.contentElement.className="styles-element-classes-pane";const t=this.contentElement.createChild("div","title-container");this.input=t.createChild("div","new-class-input monospace"),this.setDefaultFocusedElement(this.input),this.classesContainer=this.contentElement.createChild("div","source-code"),this.classesContainer.classList.add("styles-element-classes-container"),this.prompt=new Qo(this.nodeClasses.bind(this)),this.prompt.setAutocompletionTimeout(0),this.prompt.renderAsBlock();const i=this.prompt.attach(this.input);this.prompt.setPlaceholder(Ko(qo.addNewClass)),this.prompt.addEventListener(n.TextPrompt.Events.TextChanged,this.onTextChanged,this),i.addEventListener("keydown",this.onKeyDown.bind(this),!1),s.TargetManager.TargetManager.instance().addModelListener(s.DOMModel.DOMModel,s.DOMModel.Events.DOMMutated,this.onDOMMutated,this,{scoped:!0}),this.mutatingNodes=new Set,this.pendingNodeClasses=new Map,this.updateNodeThrottler=new e.Throttler.Throttler(0),this.previousTarget=null,n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.onSelectedNodeChanged,this)}splitTextIntoClasses(e){return e.split(/[,\s]/).map((e=>e.trim())).filter((e=>e.length))}onKeyDown(e){if("Enter"!==e.key&&!r.KeyboardUtilities.isEscKey(e))return;if("Enter"===e.key&&(e.consume(),this.prompt.acceptAutoComplete()))return;const t=e.target;let i=t.textContent;r.KeyboardUtilities.isEscKey(e)&&(r.StringUtilities.isWhitespace(i)||e.consume(!0),i=""),this.prompt.clearAutocomplete(),t.textContent="";const o=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!o)return;const a=this.splitTextIntoClasses(i);if(!a.length)return void this.installNodeClasses(o);for(const e of a)this.toggleClass(o,e,!0);const l=a.join(" "),d=a.length>1?Ko(qo.classesSAdded,{PH1:l}):Ko(qo.classSAdded,{PH1:l});n.ARIAUtils.alert(d),this.installNodeClasses(o),this.update()}onTextChanged(){const e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);e&&this.installNodeClasses(e)}onDOMMutated(e){const t=e.data;this.mutatingNodes.has(t)||($o.delete(t),this.update())}onSelectedNodeChanged(e){this.previousTarget&&this.prompt.text()&&(this.input.textContent="",this.installNodeClasses(this.previousTarget)),this.previousTarget=e.data,this.update()}wasShown(){super.wasShown(),this.update(),this.registerCSSFiles([Wo])}update(){if(!this.isShowing())return;let e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(e&&(e=e.enclosingElementOrSelf()),this.classesContainer.removeChildren(),this.input.disabled=!e,!e)return;const t=this.nodeClasses(e),i=[...t.keys()];i.sort(r.StringUtilities.caseInsensetiveComparator);for(const e of i){const s=n.UIUtils.CheckboxLabel.create(e,t.get(e));s.classList.add("monospace"),s.checkboxElement.addEventListener("click",this.onClick.bind(this,e),!1),this.classesContainer.appendChild(s)}}onClick(e,t){const i=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!i)return;const o=t.target.checked;this.toggleClass(i,e,o),this.installNodeClasses(i)}nodeClasses(e){let t=$o.get(e);if(!t){const s=(e.getAttribute("class")||"").split(/\s/);t=new Map;for(let e=0;e<s.length;++e){const n=s[e].trim();n.length&&t.set(n,!0)}$o.set(e,t)}return t}toggleClass(e,t,s){this.nodeClasses(e).set(t,s)}installNodeClasses(e){const t=this.nodeClasses(e),s=new Set;for(const e of t.keys())t.get(e)&&s.add(e);const n=this.splitTextIntoClasses(this.prompt.textWithCurrentSuggestion());for(const e of n)s.add(e);const i=[...s.values()].sort();this.pendingNodeClasses.set(e,i.join(" ")),this.updateNodeThrottler.schedule(this.flushPendingClasses.bind(this))}async flushPendingClasses(){const e=[];for(const s of this.pendingNodeClasses.keys()){this.mutatingNodes.add(s);const n=s.setAttributeValuePromise("class",this.pendingNodeClasses.get(s)).then(t.bind(this,s));e.push(n)}function t(e){this.mutatingNodes.delete(e)}this.pendingNodeClasses.clear(),await Promise.all(e)}}const $o=new WeakMap;let Go;class Yo{button;view;constructor(){this.button=new n.Toolbar.ToolbarToggle(Ko(qo.elementClasses),""),this.button.setText(".cls"),this.button.element.classList.add("monospace"),this.button.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.clicked,this),this.view=new jo}static instance(e={forceNew:null}){const{forceNew:t}=e;return Go&&!t||(Go=new Yo),Go}clicked(){eo.instance().showToolbarPane(this.view.isShowing()?null:this.view,this.button)}item(){return this.button}}class Qo extends n.TextPrompt.TextPrompt{nodeClasses;selectedFrameId;classNamesPromise;constructor(e){super(),this.nodeClasses=e,this.initialize(this.buildClassNameCompletions.bind(this)," "),this.disableDefaultSuggestionForEmptyInput(),this.selectedFrameId="",this.classNamesPromise=null}async getClassNames(e){const t=[],s=new Set;this.selectedFrameId=e.frameId();const n=e.domModel().cssModel(),i=n.allStyleSheets();for(const e of i){if(e.frameId!==this.selectedFrameId)continue;const i=n.getClassNames(e.id).then((e=>{for(const t of e)s.add(t)}));t.push(i)}const o=e.ownerDocument.id,r=e.domModel().classNamesPromise(o).then((e=>{for(const t of e)s.add(t)}));return t.push(r),await Promise.all(t),[...s]}async buildClassNameCompletions(e,t,i){t&&!i||(this.classNamesPromise=null);const o=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!o||!t&&!i&&!e.trim())return[];this.classNamesPromise&&this.selectedFrameId===o.frameId()||(this.classNamesPromise=this.getClassNames(o));let r=await this.classNamesPromise;const a=this.nodeClasses(o);return r=r.filter((e=>!a.get(e))),"."===t[0]&&(r=r.map((e=>"."+e))),r.filter((e=>e.startsWith(t))).sort().map((e=>({text:e,title:void 0,subtitle:void 0,priority:void 0,isSecondary:void 0,subtitleRenderer:void 0,selectionRange:void 0,hideGhostText:void 0,iconElement:void 0})))}}var Xo=Object.freeze({__proto__:null,ClassesPaneWidget:jo,ButtonProvider:Yo,ClassNamePrompt:Qo});const Jo=new CSSStyleSheet;Jo.replaceSync(".styles-element-state-pane{overflow:hidden;padding-left:2px;background-color:var(--color-background-elevation-1);border-bottom:1px solid var(--color-details-hairline);margin-top:0;padding-bottom:2px}.styles-element-state-pane > div{margin:8px 4px 6px}.styles-element-state-pane > table{width:100%;border-spacing:0}.styles-element-state-pane td{padding:0}\n/*# sourceURL=elementStatePaneWidget.css */\n");const Zo={forceElementState:"Force element state",toggleElementState:"Toggle Element State"},er=o.i18n.registerUIStrings("panels/elements/ElementStatePaneWidget.ts",Zo),tr=o.i18n.getLocalizedString.bind(void 0,er);class sr extends n.Widget.Widget{inputs;inputStates;cssModel;constructor(){super(!0),this.contentElement.className="styles-element-state-pane",n.UIUtils.createTextChild(this.contentElement.createChild("div"),tr(Zo.forceElementState));const e=document.createElement("table");e.classList.add("source-code"),n.ARIAUtils.markAsPresentation(e);const t=[];this.inputs=t,this.inputStates=new WeakMap;const i=e=>{const t=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(!(t&&e.target instanceof HTMLInputElement))return;const i=this.inputStates.get(e.target);i&&t.domModel().cssModel().forcePseudoState(t,i,e.target.checked)},o=e=>{const s=document.createElement("td"),o=n.UIUtils.CheckboxLabel.create(":"+e),r=o.checkboxElement;return this.inputStates.set(r,e),r.addEventListener("click",i,!1),t.push(r),s.appendChild(o),s};let r=e.createChild("tr");r.appendChild(o("active")),r.appendChild(o("hover")),r=e.createChild("tr"),r.appendChild(o("focus")),r.appendChild(o("visited")),r=e.createChild("tr"),r.appendChild(o("focus-within")),r.appendChild(o("focus-visible")),r=e.createChild("tr"),r.appendChild(o("target")),this.contentElement.appendChild(e),n.Context.Context.instance().addFlavorChangeListener(s.DOMModel.DOMNode,this.update,this)}updateModel(e){this.cssModel!==e&&(this.cssModel&&this.cssModel.removeEventListener(s.CSSModel.Events.PseudoStateForced,this.update,this),this.cssModel=e,this.cssModel&&this.cssModel.addEventListener(s.CSSModel.Events.PseudoStateForced,this.update,this))}wasShown(){super.wasShown(),this.registerCSSFiles([Jo]),this.update()}update(){let e=n.Context.Context.instance().flavor(s.DOMModel.DOMNode);if(e&&(e=e.enclosingElementOrSelf()),this.updateModel(e?e.domModel().cssModel():null),e){const t=e.domModel().cssModel().pseudoState(e);for(const s of this.inputs){s.disabled=Boolean(e.pseudoType());const n=this.inputStates.get(s);s.checked=!(!t||void 0===n)&&t.indexOf(n)>=0}}else for(const e of this.inputs)e.disabled=!0,e.checked=!1;ir.instance().item().setToggled(this.inputs.some((e=>e.checked)))}}let nr;class ir{button;view;constructor(){this.button=new n.Toolbar.ToolbarToggle(tr(Zo.toggleElementState),""),this.button.setText(o.i18n.lockedString(":hov")),this.button.setToggleWithDot(!0),this.button.addEventListener(n.Toolbar.ToolbarButton.Events.Click,this.clicked,this),this.button.element.classList.add("monospace"),this.view=new sr}static instance(e={forceNew:null}){const{forceNew:t}=e;return nr&&!t||(nr=new ir),nr}clicked(){eo.instance().showToolbarPane(this.view.isShowing()?null:this.view,null)}item(){return this.button}}var or=Object.freeze({__proto__:null,ElementStatePaneWidget:sr,ButtonProvider:ir});export{j as AccessibilityTreeUtils,Y as AccessibilityTreeView,Kt as CSSRuleValidator,Xo as ClassesPaneWidget,be as ColorSwatchPopoverIcon,Z as ComputedStyleModel,Es as ComputedStyleWidget,Re as DOMLinkifier,Rs as DOMPath,or as ElementStatePaneWidget,po as ElementsPanel,Ve as ElementsSidebarPane,qi as ElementsTreeElement,Ki as ElementsTreeElementHighlighter,Ti as ElementsTreeOutline,Io as EventListenersWidget,Co as InspectElementModeController,Xe as LayersWidget,Ai as MarkerDecorator,Gi as MetricsSidebarPane,_o as NodeStackTraceWidget,ae as PlatformFontsWidget,Ao as PropertiesWidget,Ue as StyleEditorWidget,ds as StylePropertiesSection,_e as StylePropertyHighlighter,es as StylePropertyTreeElement,Ct as StylePropertyUtils,ft as StylesSidebarPane,pi as TopLayerContainer,Ze as WebCustomData};