import{render as e,html as t,nothing as o,Directives as i}from"../../third_party/lit-html/lit-html.js";import{ls as s,UIString as n}from"../../common/common.js";import{Platform as r}from"../../host/host.js";import{assertNever as l,NumberUtilities as a}from"../../platform/platform.js";import{ContextMenu as c,Widget as d}from"../ui.js";import{ResourceUtils as h}from"../../bindings/bindings.js";class u extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.clickHandler=()=>{},this.counters=[]}set data(e){this.counters=e.counters,this.clickHandler=e.clickHandler,this.render()}setCounts(e){if(e.length!==this.counters.length)throw new Error(`Wrong number of texts, expected ${this.counters.length} but got ${e.length}`);for(let t=0;t<e.length;++t)this.counters[t].count=e[t];this.render()}onClickHandler(e){e.preventDefault(),this.clickHandler()}render(){return e(t`
      <style>
        :host {
          white-space: normal;
        }

        .counter-button {
          cursor: pointer;
          background-color: var(--toolbar-bg-color);
          border: 1px solid var(--divider-color);
          border-radius: 2px;
          color: var(--tab-selected-fg-color);
          margin-right: 2px;
          display: inline-flex;
          align-items: center;
        }

        .counter-button:hover,
        .counter-button:focus-visible {
          background-color: var(--toolbar-hover-bg-color);
        }

        .counter-button-title {
          margin-left: 0.5ex;
        }

        .status-icon {
          margin-left: 1ex;
        }

        .status-icon:first-child {
          margin-left: inherit;
        }
      </style>
      <button class="counter-button" @click=${this.onClickHandler}>
      ${this.counters.filter((e=>Boolean(e.count))).map((e=>t`
      <devtools-icon class="status-icon"
      .data=${{iconName:e.iconName,color:e.iconColor||"",width:"1.5ex",height:"1.5ex"}}>
      </devtools-icon>
      <span class="counter-button-title">${e.count}</span>
      </button>`))}
    `,this.shadow,{eventContext:this})}}customElements.define("counter-button",u);var m=Object.freeze({__proto__:null,CounterButton:u});const p=e=>t`${e}`;var w=Object.freeze({__proto__:null,primitiveRenderer:p,codeBlockRenderer:e=>{if(!e)return o;const i=String(e),s=i.length>13?i.substring(0,10)+"...":i;return t`<code>${s}</code>`}});const f=new Set(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"]);function g(e){return f.has(e)}function b(e,t){const o=e.cells.find((e=>e.columnId===t));if(void 0===o)throw new Error(`Found a row that was missing an entry for column ${t}.`);return o}function v(e){return e.renderer?e.renderer(e.value):p(e.value)}function x(e,t){const o=e.filter((e=>e.visible)).reduce(((e,t)=>e+t.widthWeighting),0),i=e.find((e=>e.id===t));if(!i)throw new Error("Could not find column with ID "+t);if(i.widthWeighting<1)throw new Error(`Error with column ${t}: width weightings must be >= 1.`);return i.visible?Math.round(i.widthWeighting/o*100):0}function C(e){const{key:t,currentFocusedCell:o,columns:i,rows:s}=e,[n,r]=o;switch(t){case"ArrowLeft":{if(n===i.findIndex((e=>e.visible)))return[n,r];let e=n;for(let t=e-1;t>=0;t--){if(i[t].visible){e=t;break}}return[e,r]}case"ArrowRight":{let e=n;for(let t=e+1;t<i.length;t++){if(i[t].visible){e=t;break}}return[e,r]}case"ArrowUp":{const e=i.some((e=>!0===e.sortable))?0:1;if(r===e)return[n,r];let t=r;for(let o=r-1;o>=e;o--){if(0===o){t=0;break}if(!s[o-1].hidden){t=o;break}}return[n,t]}case"ArrowDown":{if(0===r){const e=s.findIndex((e=>!e.hidden));return e>-1?[n,e+1]:[n,r]}let e=r;for(let t=e+1;t<s.length+1;t++){if(!s[t-1].hidden){e=t;break}}return[n,e]}default:return l(t,"Unknown arrow key: "+t)}}const y=e=>{const{columns:t,rows:o}=e,i=t.some((e=>!0===e.sortable))?0:o.findIndex((e=>!e.hidden))+1;return[t.findIndex((e=>e.visible)),i]};class k extends Event{constructor(e){super("context-menu-column-sort-click"),this.data={column:e}}}class S extends Event{constructor(){super("context-menu-header-reset-click")}}var R=Object.freeze({__proto__:null,ARROW_KEYS:f,keyIsArrowKey:g,getRowEntryForColumnId:b,renderCellValue:v,calculateColumnWidthPercentageFromWeighting:x,handleArrowKeyNavigation:C,calculateFirstFocusableCell:y,ContextMenuColumnSortClickEvent:k,ContextMenuHeaderResetClickEvent:S});function $(e,t){const o=!t.visible,i=e.data.columns.map((e=>(e===t&&(e.visible=o),e)));e.data={...e.data,columns:i}}function M(e,t){const{columns:o}=e.data;for(const i of o)i.hideable&&t.defaultSection().appendCheckboxItem(i.title,(()=>{$(e,i)}),i.visible)}function E(e,t){const o=e.data.columns.filter((e=>!0===e.sortable));if(o.length>0)for(const i of o)t.defaultSection().appendItem(i.title,(()=>{e.dispatchEvent(new k(i))}))}class z extends Event{constructor(e,t){super("column-header-click"),this.data={column:e,columnIndex:t}}}class I extends Event{constructor(e){super("new-user-filter-text",{composed:!0}),this.data={filterText:e}}}class L extends Event{constructor(e,t){super("cell-focused",{composed:!0}),this.data={cell:e,row:t}}}const _=new Set([" ","Enter"]);class A extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.columns=[],this.rows=[],this.sortState=null,this.pendingScroll=0,this.scheduledRenderId=0,this.contextMenus=void 0,this.currentResize=null,this.boundOnResizePointerUp=this.onResizePointerUp.bind(this),this.boundOnResizePointerMove=this.onResizePointerMove.bind(this),this.boundOnResizePointerDown=this.onResizePointerDown.bind(this),this.focusableCell=[0,1],this.hasRenderedAtLeastOnce=!1,this.pendingScrollUpdate=!1}get data(){return{columns:this.columns,rows:this.rows,activeSort:this.sortState,contextMenus:this.contextMenus}}set data(e){if(this.columns=e.columns,this.rows=e.rows,this.sortState=e.activeSort,this.contextMenus=e.contextMenus,this.hasRenderedAtLeastOnce||(this.focusableCell=y({columns:this.columns,rows:this.rows})),this.hasRenderedAtLeastOnce){const[e,t]=this.focusableCell,o=e>this.columns.length,i=t>this.rows.length;this.focusableCell=o||i?[o?this.columns.length:e,i?this.rows.length:t]:y({columns:this.columns,rows:this.rows})}this.scheduleRender()}scrollToBottomIfRequired(){if(!1===this.hasRenderedAtLeastOnce)return;const e=this.getCurrentlyFocusableCell();if(e&&e===this.shadow.activeElement)return;const t=this.shadow.querySelector("tbody tr:not(.hidden):last-child");t&&(cancelAnimationFrame(this.pendingScroll),this.pendingScroll=requestAnimationFrame((()=>{t.scrollIntoView()})))}getCurrentlyFocusableCell(){const[e,t]=this.focusableCell;return this.shadow.querySelector(`[data-row-index="${t}"][data-col-index="${e}"]`)}focusCell([e,t]){const[o,i]=this.focusableCell;o===e&&i===t||(this.focusableCell=[e,t]);const s=this.getCurrentlyFocusableCell();if(!s)throw new Error("Unexpected error: could not find cell marked as focusable");s.focus(),this.scheduleRender()}onTableKeyDown(e){const t=e.key;if(_.has(t)){const e=this.getCurrentlyFocusableCell(),[t,o]=this.focusableCell,i=this.columns[t];e&&0===o&&i&&i.sortable&&this.onColumnHeaderClick(i,t)}if(!g(t))return;const o=C({key:t,currentFocusedCell:this.focusableCell,columns:this.columns,rows:this.rows});this.focusCell(o)}onColumnHeaderClick(e,t){this.dispatchEvent(new z(e,t))}ariaSortForHeader(e){return!e.sortable||this.sortState&&this.sortState.columnId===e.id?this.sortState&&this.sortState.columnId===e.id?"ASC"===this.sortState.direction?"ascending":"descending":void 0:"none"}renderFillerRow(){const e=this.columns.map(((e,s)=>{if(!e.visible)return o;const n=i.classMap({firstVisibleColumn:0===s});return t`<td tabindex="-1" class=${n} data-filler-row-column-index=${s}></td>`}));return t`<tr tabindex="-1" class="filler-row">${e}</tr>`}cleanUpAfterResizeColumnComplete(){this.currentResize&&(this.currentResize.documentForCursorChange.body.style.cursor=this.currentResize.cursorToRestore,this.currentResize=null,this.scheduleRender())}onResizePointerDown(e){if(1!==e.buttons||r.isMac()&&e.ctrlKey)return;e.preventDefault();const t=e.target;if(!t)return;const o=t.dataset.columnIndex;if(!o)return;const i=globalThis.parseInt(o,10),s=this.columns.findIndex(((e,t)=>t>i&&!0===e.visible)),n=this.shadow.querySelector(`td[data-filler-row-column-index="${i}"]`),l=this.shadow.querySelector(`td[data-filler-row-column-index="${s}"]`);if(!n||!l)return;const a=this.shadow.querySelector(`col[data-col-column-index="${i}"]`),c=this.shadow.querySelector(`col[data-col-column-index="${s}"]`);if(!a||!c)return;const d=e.target.ownerDocument;d&&(this.currentResize={leftCellCol:a,rightCellCol:c,leftCellColInitialPercentageWidth:globalThis.parseInt(a.style.width,10),rightCellColInitialPercentageWidth:globalThis.parseInt(c.style.width,10),initialLeftCellWidth:n.clientWidth,initialRightCellWidth:l.clientWidth,initialMouseX:e.x,documentForCursorChange:d,cursorToRestore:t.style.cursor},d.body.style.cursor="col-resize",t.setPointerCapture(e.pointerId),t.addEventListener("pointermove",this.boundOnResizePointerMove))}onResizePointerMove(e){if(e.preventDefault(),!this.currentResize)return;const t=this.currentResize.leftCellColInitialPercentageWidth+this.currentResize.rightCellColInitialPercentageWidth-10,o=e.x-this.currentResize.initialMouseX,i=Math.abs(o)/(this.currentResize.initialLeftCellWidth+this.currentResize.initialRightCellWidth)*100;let s,n;o>0?(s=a.clamp(this.currentResize.leftCellColInitialPercentageWidth+i,10,t),n=a.clamp(this.currentResize.rightCellColInitialPercentageWidth-i,10,t)):o<0&&(s=a.clamp(this.currentResize.leftCellColInitialPercentageWidth-i,10,t),n=a.clamp(this.currentResize.rightCellColInitialPercentageWidth+i,10,t)),s&&n&&(this.currentResize.leftCellCol.style.width=Math.floor(s)+"%",this.currentResize.rightCellCol.style.width=Math.ceil(n)+"%")}onResizePointerUp(e){e.preventDefault();const t=e.target;t&&(t.releasePointerCapture(e.pointerId),t.removeEventListener("pointermove",this.boundOnResizePointerMove),this.cleanUpAfterResizeColumnComplete())}renderResizeForCell(e,o){const[i]=o;return i!==this.getIndexOfLastVisibleColumn()&&e.visible?t`<span class="cell-resize-handle"
     @pointerdown=${this.boundOnResizePointerDown}
     @pointerup=${this.boundOnResizePointerUp}
     data-column-index=${i}
    ></span>`:t``}getIndexOfLastVisibleColumn(){let e=this.columns.length-1;for(;e>-1;e--){if(this.columns[e].visible)break}return e}onHeaderContextMenu(e){if(2!==e.button)return;const t=new c.ContextMenu(e);M(this,t);E(this,t.defaultSection().appendSubMenuItem(s`Sort By`)),t.defaultSection().appendItem(s`Reset Columns`,(()=>{this.dispatchEvent(new S)})),this.contextMenus&&this.contextMenus.headerRow&&this.contextMenus.headerRow(t,this.columns),t.show()}onBodyRowContextMenu(e){if(2!==e.button)return;if(!(e.target&&e.target instanceof HTMLElement))return;const t=e.target.dataset.rowIndex;if(!t)return;const o=parseInt(t,10),i=this.rows[o-1],n=new c.ContextMenu(e);E(this,n.defaultSection().appendSubMenuItem(s`Sort By`));const r=n.defaultSection().appendSubMenuItem(s`Header Options`);M(this,r),r.defaultSection().appendItem(s`Reset Columns`,(()=>{this.dispatchEvent(new S)})),this.contextMenus&&this.contextMenus.bodyRow&&this.contextMenus.bodyRow(n,this.columns,i),n.show()}onScroll(){this.pendingScrollUpdate=!0,this.scheduleRender()}scheduleRender(){0===this.scheduledRenderId&&(this.scheduledRenderId=requestAnimationFrame((()=>{this.pendingScrollUpdate?this.pendingScrollUpdate=!1:this.scrollToBottomIfRequired(),this.render(),this.alignScrollHandlers(),this.scheduledRenderId=0})))}alignScrollHandlers(){requestAnimationFrame((()=>{const e=this.shadow.querySelectorAll("th:not(.hidden)"),t=this.shadow.querySelectorAll(".cell-resize-handle");this.shadow.querySelector("table")&&e.forEach(((e,o)=>{const{right:i}=e.getBoundingClientRect();t[o]&&(t[o].style.left=i-20+"px")}))}))}render(){const s=this.columns.findIndex((e=>e.visible)),n=this.columns.some((e=>!0===e.sortable));e(t`
    <style>
      :host {
        --table-divider-color: var(--color-details-hairline);
        --toolbar-bg-color: var(--color-background-elevation-1);
        --selected-row-color: var(--color-background-elevation-1);

        height: 100%;
        display: block;
      }

      /* Ensure that vertically we don't overflow */
      .wrapping-container {
        overflow-y: scroll;

        /* Use max-height instead of height to ensure that the
           table does not use more space than necessary. */
        height: 100%;
        position: relative;
      }

      table {
        border-spacing: 0;
        width: 100%;
        height: 100%;

        /* To make sure that we properly hide overflowing text
           when horizontal space is too narrow. */
        table-layout: fixed;
      }

      tr {
        outline: none;
      }

      tbody tr {
        background-color: var(--color-background);
      }

      tbody tr.selected {
        background-color: var(--selected-row-color);
      }

      td,
      th {
        padding: 1px 4px;

        /* Divider between each cell, except the first one (see below) */
        border-left: 1px solid var(--table-divider-color);
        color: var(--color-text-primary);
        line-height: 18px;
        height: 18px;
        user-select: text;

        /* Ensure that text properly cuts off if horizontal space is too narrow */
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        position: relative;
      }

      .cell-resize-handle {
        top: 0;
        height: 100%;
        z-index: 3;
        width: 20px;
        cursor: col-resize;
        position: absolute;
      }

      /* There is no divider before the first cell */
      td.firstVisibleColumn,
      th.firstVisibleColumn {
        border-left: none;
      }

      th {
        font-weight: normal;
        text-align: left;
        border-bottom: 1px solid var(--table-divider-color);
        position: sticky;
        top: 0;
        z-index: 2;
        background-color: var(--toolbar-bg-color);
      }

      .hidden {
        display: none;
      }

      .filler-row td {
        /* By making the filler row cells 100% they take up any extra height,
         * leaving the cells with content to be the regular height, and the
         * final filler row to be as high as it needs to be to fill the empty
         * space.
         */
        height: 100%;
        pointer-events: none;
      }

      .filler-row td .cell-resize-handle {
        pointer-events: all;
      }

      [aria-sort]:hover {
        cursor: pointer;
      }

      [aria-sort="descending"]::after {
        content: " ";
        border-left: 0.3em solid transparent;
        border-right: 0.3em solid transparent;
        border-top: 0.3em solid black;
        position: absolute;
        right: 0.5em;
        top: 0.6em;
      }

      [aria-sort="ascending"]::after {
        content: " ";
        border-bottom: 0.3em solid black;
        border-left: 0.3em solid transparent;
        border-right: 0.3em solid transparent;
        position: absolute;
        right: 0.5em;
        top: 0.6em;
      }
    </style>
    ${this.columns.map(((e,t)=>this.renderResizeForCell(e,[t,0])))}
    <div class="wrapping-container" @scroll=${this.onScroll}>
      <table
        aria-rowcount=${this.rows.length}
        aria-colcount=${this.columns.length}
        @keydown=${this.onTableKeyDown}
      >
        <colgroup>
          ${this.columns.map(((e,i)=>{const s=`width: ${x(this.columns,e.id)}%`;return e.visible?t`<col style=${s} data-col-column-index=${i}>`:o}))}
        </colgroup>
        <thead>
          <tr @contextmenu=${this.onHeaderContextMenu}>
            ${this.columns.map(((e,o)=>{const r=i.classMap({hidden:!e.visible,firstVisibleColumn:o===s}),l=n&&o===this.focusableCell[0]&&0===this.focusableCell[1];return t`<th class=${r}
                data-grid-header-cell=${e.id}
                @click=${()=>{this.focusCell([o,0]),this.onColumnHeaderClick(e,o)}}
                title=${e.title}
                aria-sort=${i.ifDefined(this.ariaSortForHeader(e))}
                aria-colindex=${o+1}
                data-row-index='0'
                data-col-index=${o}
                tabindex=${i.ifDefined(n?l?"0":"-1":void 0)}
              >${e.title}</th>`}))}
          </tr>
        </thead>
        <tbody>
          ${i.repeat(this.rows,(e=>this.rows.indexOf(e)),((e,o)=>{const n=this.getCurrentlyFocusableCell(),[,r]=this.focusableCell,l=o+1,a=!!n&&(n===this.shadow.activeElement&&l===r),c=i.classMap({selected:a,hidden:!0===e.hidden});return t`
              <tr
                aria-rowindex=${o+1}
                class=${c}
                @contextmenu=${this.onBodyRowContextMenu}
              >${this.columns.map(((o,n)=>{const r=b(e,o.id),a=i.classMap({hidden:!o.visible,firstVisibleColumn:n===s}),c=n===this.focusableCell[0]&&l===this.focusableCell[1],d=o.visible?v(r):null;return t`<td
                  class=${a}
                  tabindex=${c?"0":"-1"}
                  aria-colindex=${n+1}
                  title=${r.title||String(r.value)}
                  data-row-index=${l}
                  data-col-index=${n}
                  data-grid-value-cell-for-column=${o.id}
                  @focus=${()=>{this.dispatchEvent(new L(r,e))}}
                  @click=${()=>{this.focusCell([n,l])}}
                >${d}</td>`}))}
            `}))}
         ${this.renderFillerRow()}
        </tbody>
      </table>
    </div>
    `,this.shadow,{eventContext:this}),this.hasRenderedAtLeastOnce=!0}}customElements.define("devtools-data-grid",A);var O=Object.freeze({__proto__:null,ColumnHeaderClickEvent:z,NewUserFilterTextEvent:I,BodyCellFocusedEvent:L,DataGrid:A});class H extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.hasRenderedAtLeastOnce=!1,this.columns=[],this.rows=[],this.contextMenus=void 0,this.originalColumns=[],this.originalRows=[],this.sortState=null,this.filters=[]}get data(){return{columns:this.originalColumns,rows:this.originalRows,filters:this.filters,contextMenus:this.contextMenus}}set data(e){this.originalColumns=e.columns,this.originalRows=e.rows,this.contextMenus=e.contextMenus,this.filters=e.filters||[],this.contextMenus=e.contextMenus,this.columns=[...this.originalColumns],this.rows=this.cloneAndFilterRows(e.rows,this.filters),!this.hasRenderedAtLeastOnce&&e.initialSort&&(this.sortState=e.initialSort,this.sortRows(this.sortState)),this.render()}testRowWithFilter(e,t){let o=!1;const{key:i,text:s,negative:n,regex:r}=t;let l;if(i){const t=b(e,i);l=JSON.stringify(t.value).toLowerCase()}else l=JSON.stringify(e.cells.map((e=>e.value))).toLowerCase();return r?o=r.test(l):s&&(o=l.includes(s.toLowerCase())),n?!o:o}cloneAndFilterRows(e,t){return 0===t.length?[...e]:e.map((e=>{let o=!0;for(const i of t){if(!this.testRowWithFilter(e,i)){o=!1;break}}return{...e,hidden:!o}}))}sortRows(e){const{columnId:t,direction:o}=e;this.rows.sort(((e,i)=>{const s=b(e,t),n=b(i,t),r="number"==typeof s.value?s.value:String(s.value).toUpperCase(),l="number"==typeof n.value?n.value:String(n.value).toUpperCase();return r<l?"ASC"===o?-1:1:r>l?"ASC"===o?1:-1:0})),this.render()}onColumnHeaderClick(e){const{column:t}=e.data;this.applySortOnColumn(t)}applySortOnColumn(e){if(this.sortState&&this.sortState.columnId===e.id){const{columnId:e,direction:t}=this.sortState;this.sortState="DESC"===t?null:{columnId:e,direction:"DESC"}}else this.sortState={columnId:e.id,direction:"ASC"};this.sortState?this.sortRows(this.sortState):(this.rows=[...this.originalRows],this.render())}onContextMenuColumnSortClick(e){this.applySortOnColumn(e.data.column)}onContextMenuHeaderResetClick(){this.sortState=null,this.rows=[...this.originalRows],this.render()}render(){e(t`
      <style>
        :host {
          display: block;
          height: 100%;
          overflow: hidden;
        }
      </style>
      <devtools-data-grid .data=${{columns:this.columns,rows:this.rows,activeSort:this.sortState,contextMenus:this.contextMenus}}
        @column-header-click=${this.onColumnHeaderClick}
        @context-menu-column-sort-click=${this.onContextMenuColumnSortClick}
        @context-menu-header-reset-click=${this.onContextMenuHeaderResetClick}
     ></devtools-data-grid>
    `,this.shadow,{eventContext:this}),this.hasRenderedAtLeastOnce=!0}}customElements.define("devtools-data-grid-controller",H);var T=Object.freeze({__proto__:null,DataGridController:H});class F extends d.VBox{constructor(e){super(!0,!0),this.dataGrid=new H,this.dataGrid.data=e,this.contentElement.appendChild(this.dataGrid)}data(){return this.dataGrid.data}update(e){this.dataGrid.data=e}}var P=Object.freeze({__proto__:null,DataGridControllerIntegrator:F});const D=e=>void 0!==e;class N extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.iconPath="",this.color="rgb(110 110 110)",this.width="100%",this.height="100%"}set data(e){const{width:t,height:o}=e;this.color=e.color,this.width=D(t)?t:D(o)?o:this.width,this.height=D(o)?o:D(t)?t:this.height,this.iconPath="iconPath"in e?e.iconPath:`Images/${e.iconName}.svg`,"iconName"in e&&(this.iconName=e.iconName),this.render()}get data(){const e={color:this.color,width:this.width,height:this.height};return this.iconName?{...e,iconName:this.iconName}:{...e,iconPath:this.iconPath}}getStyles(){const{iconPath:e,width:t,height:o,color:i}=this,s={width:t,height:o,display:"block"};return i?{...s,webkitMaskImage:`url(${e})`,webkitMaskPosition:"center",webkitMaskRepeat:"no-repeat",webkitMaskSize:"100%",backgroundColor:`var(--icon-color, ${i})`}:{...s,backgroundImage:`url(${e})`,backgroundPosition:"center",backgroundRepeat:"no-repeat",backgroundSize:"100%"}}render(){e(t`
      <style>
        :host {
          display: inline-block;
          white-space: nowrap;
        }
      </style>
      <div class="icon-basic" style=${i.styleMap(this.getStyles())}></div>
    `,this.shadow)}}customElements.get("devtools-icon")||customElements.define("devtools-icon",N);var W=Object.freeze({__proto__:null,Icon:N});class U extends Event{constructor(e){super("linkifier-activated",{bubbles:!0,composed:!0}),this.data=e}}class j extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.url=""}set data(e){this.url=e.url,this.lineNumber=e.lineNumber,this.columnNumber=e.columnNumber,this.render()}onLinkActivation(e){e.preventDefault();const t=new U({url:this.url,lineNumber:this.lineNumber,columnNumber:this.columnNumber});this.dispatchEvent(t)}render(){if(!this.url)throw new Error("Cannot construct a Linkifier without providing a valid string URL.");return e(t`
      <style>
          .link:link,
          .link:visited {
            color: var(--color-link);
            text-decoration: underline;
            cursor: pointer;
          }
      </style>
      <a class="link" href=${this.url} @click=${this.onLinkActivation}>${function(e,t){if(e){let o=""+h.displayNameForURL(e);return void 0!==t&&(o+=":"+(t+1)),o}throw new Error("New linkifier component error: don't know how to generate link text for given arguments")}(this.url,this.lineNumber)}</a>
    `,this.shadow,{eventContext:this})}}customElements.define("devtools-linkifier",j);var q=Object.freeze({__proto__:null,LinkifierClick:U,Linkifier:j});class B extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.reportTitle=""}set data({reportTitle:e}){this.reportTitle=e,this.render()}connectedCallback(){this.render()}render(){e(t`
      <style>
        .content {
          background-color: var(--color-background);
          overflow: auto;
          display: grid;
          grid-template-columns: min-content auto;
        }

        .report-title {
          padding: 12px 24px;
          font-size: 15px;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          border-bottom: 1px solid var(--color-details-hairline);
          color: var(--color-text-primary);
          background-color: var(--color-background);
        }
      </style>

      ${this.reportTitle?t`<div class="report-title">${this.reportTitle}</div>`:o}
      <div class="content">
        <slot></slot>
      </div>
    `,this.shadow)}}class G extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){e(t`
      <style>
        :host {
          grid-column-start: span 2;
        }

        .section-header {
          padding: 12px;
          margin-left: 18px;
          display: flex;
          flex-direction: row;
          align-items: center;
          flex: auto;
          text-overflow: ellipsis;
          overflow: hidden;
          font-weight: bold;
          color: var(--color-text-primary);
        }
      </style>
      <div class="section-header">
        <slot></slot>
      </div>
    `,this.shadow)}}class V extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){e(t`
      <style>
        :host {
          grid-column-start: span 2;
        }

        .section-divider {
          margin-top: 12px;
          border-bottom: 1px solid var(--color-details-hairline);
        }
      </style>
      <div class="section-divider">
      </div>
    `,this.shadow)}}class K extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){e(t`
      <style>
        :host {
          line-height: 28px;
          margin: 8px 0 0 0;
        }

        .key {
          color: var(--color-text-secondary);
          padding: 0 6px;
          text-align: right;
          white-space: pre;
        }
      </style>
      <div class="key"><slot></slot></div>
    `,this.shadow)}}class J extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){e(t`
      <style>
        :host {
          line-height: 28px;
          margin: 8px 0 0 0;
        }

        .value {
          color: var(--color-text-primary);
          margin-inline-start: 0;
          padding: 0 6px;
        }
      </style>
      <div class="value"><slot></slot></div>
    `,this.shadow)}}customElements.define("devtools-report",B),customElements.define("devtools-report-section-header",G),customElements.define("devtools-report-key",K),customElements.define("devtools-report-value",J),customElements.define("devtools-report-divider",V);var X=Object.freeze({__proto__:null,Report:B,ReportSectionHeader:G,ReportSectionDivider:V,ReportKey:K,ReportValue:J});const Y=s;class Q extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.trigger="",this.promptText=n.LocalizedEmptyString,this.canShowSurvey=()=>{},this.showSurvey=()=>{},this.state="Checking"}set data(e){this.trigger=e.trigger,this.promptText=e.promptText,this.canShowSurvey=e.canShowSurvey,this.showSurvey=e.showSurvey,this.checkSurvey()}checkSurvey(){this.state="Checking",this.canShowSurvey(this.trigger,(({canShowSurvey:e})=>{this.state=e?"ShowLink":"DontShowLink",this.render()}))}sendSurvey(){this.state="Sending",this.render(),this.showSurvey(this.trigger,(({surveyShown:e})=>{this.state=e?"SurveyShown":"Failed",this.render()}))}render(){if("Checking"===this.state||"DontShowLink"===this.state)return;let o=this.promptText;"Sending"===this.state?o=Y`Opening survey …`:"SurveyShown"===this.state?o=Y`Thank you for your feedback`:"Failed"===this.state&&(o=Y`An error occurred with the survey`);let i="";"Sending"===this.state?i="pending-link":"Failed"!==this.state&&"SurveyShown"!==this.state||(i="disabled-link");const s="ShowLink"!==this.state,n=t`
      <style>
        .link-icon {
          vertical-align: sub;
          margin-right: 0.5ch;
        }

        .link {
          padding: 4px 0 0 0;
          text-decoration: underline;
          cursor: pointer;
          font-size: 14px;
          color: var(--issue-link);
          border: none;
          background: none;
        }

        .link:focus:not(:focus-visible) {
          outline: none;
        }

        .pending-link {
          opacity: 75%;
          pointer-events: none;
          cursor: default;
          text-decoration: none;
        }

        .disabled-link {
          pointer-events: none;
          cursor: default;
          text-decoration: none;
        }
      </style>
      <button class="link ${i}" tabindex=${s?"-1":"0"} aria-disabled=${s} @click=${this.sendSurvey}>
        <devtools-icon class="link-icon" .data=${{iconName:"feedback_thin_16x16_icon",color:"var(--issue-link)",width:"16px",height:"16px"}}></devtools-icon><!--
      -->${o}
      </button>
    `;e(n,this.shadow,{eventContext:this})}}customElements.define("devtools-survey-link",Q);var Z=Object.freeze({__proto__:null,SurveyLink:Q});export{m as CounterButton,O as DataGrid,T as DataGridController,P as DataGridControllerIntegrator,w as DataGridRenderers,R as DataGridUtils,W as Icon,q as Linkifier,X as ReportView,Z as SurveyLink};
