import*as Common from"../../../core/common/common.js";import*as i18n from"../../../core/i18n/i18n.js";import{PanelUtils}from"../../../panels/utils/utils.js";import*as DataGrid from"../../../ui/components/data_grid/data_grid.js";import*as ComponentHelpers from"../../../ui/components/helpers/helpers.js";import*as IconButton from"../../../ui/components/icon_button/icon_button.js";import*as LegacyWrapper from"../../../ui/components/legacy_wrapper/legacy_wrapper.js";import*as LitHtml from"../../../ui/lit-html/lit-html.js";import webBundleInfoViewStyles from"./WebBundleInfoView.css.js";const{render:render,html:html}=LitHtml,UIStrings={bundledResource:"Bundled resource"},str_=i18n.i18n.registerUIStrings("panels/network/components/WebBundleInfoView.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);export class WebBundleInfoView extends LegacyWrapper.LegacyWrapper.WrappableComponent{static litTagName=LitHtml.literal`devtools-web-bundle-info`;#e=this.attachShadow({mode:"open"});#n;#o;constructor(e){super();const n=e.webBundleInfo();if(!n)throw new Error("Trying to render a Web Bundle info without providing data");this.#n=n,this.#o=e.parsedURL.lastPathComponent}connectedCallback(){this.#e.adoptedStyleSheets=[webBundleInfoViewStyles]}async render(){const e=this.#n.resourceUrls?.map((e=>{const n=Common.ResourceType.ResourceType.mimeFromURL(e)||null,o=Common.ResourceType.ResourceType.fromMimeTypeOverride(n)||Common.ResourceType.ResourceType.fromMimeType(n),t=PanelUtils.iconDataForResourceType(o);return{cells:[{columnId:"url",value:null,renderer:()=>html`
                <div style="display: flex;">
                  <${IconButton.Icon.Icon.litTagName} class="icon"
                    .data=${{...t,width:"20px"}}>
                  </${IconButton.Icon.Icon.litTagName}>
                  <span>${e}</span>
                </div>`}]}}));render(html`
      <div class="header">
        <${IconButton.Icon.Icon.litTagName} class="icon"
          .data=${{color:"var(--icon-default)",iconName:"bundle",width:"20px"}}>
        </${IconButton.Icon.Icon.litTagName}>
        <span>${this.#o}</span>
        <x-link href="https://web.dev/web-bundles/#explaining-web-bundles">
          <${IconButton.Icon.Icon.litTagName} class="icon"
            .data=${{color:"var(--icon-default)",iconName:"help",width:"16px"}}>
          </${IconButton.Icon.Icon.litTagName}>
        </x-link>
      </div>
      <div>
        <${DataGrid.DataGrid.DataGrid.litTagName}
          .data=${{columns:[{id:"url",title:i18nString(UIStrings.bundledResource),widthWeighting:1,visible:!0,hideable:!1}],rows:e,activeSort:null}}>
        </${DataGrid.DataGrid.DataGrid.litTagName}>
      </div>`,this.#e,{host:this})}}ComponentHelpers.CustomElements.defineComponent("devtools-web-bundle-info",WebBundleInfoView);