@yuebai008/cli/dist/cli-server/client/front_end/panels/application/components/SharedStorageAccessGrid.js

Command line interface for rapid qg-minigame development

import*as i18n from"../../../core/i18n/i18n.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 LitHtml from"../../../ui/lit-html/lit-html.js";import sharedStorageAccessGridStyles from"./sharedStorageAccessGrid.css.js";const UIStrings={sharedStorage:"Shared storage",allSharedStorageEvents:"All shared storage events for this page.",eventTime:"Event Time",eventType:"Access Type",mainFrameId:"Main Frame ID",ownerOrigin:"Owner Origin",eventParams:"Optional Event Params",noEvents:"No shared storage events recorded."},str_=i18n.i18n.registerUIStrings("panels/application/components/SharedStorageAccessGrid.ts",UIStrings);export const i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);export class SharedStorageAccessGrid extends HTMLElement{static litTagName=LitHtml.literal`devtools-shared-storage-access-grid`;#e=this.attachShadow({mode:"open"});#t=[];connectedCallback(){this.#e.adoptedStyleSheets=[sharedStorageAccessGridStyles],this.#i()}set data(e){this.#t=e,this.#i()}#i(){LitHtml.render(LitHtml.html`
      <div>
        <span class="heading">${i18nString(UIStrings.sharedStorage)}</span>
        <${IconButton.Icon.Icon.litTagName} class="info-icon" title=${i18nString(UIStrings.allSharedStorageEvents)}
          .data=${{iconName:"info",color:"var(--icon-default)",width:"16px"}}>
        </${IconButton.Icon.Icon.litTagName}>
        ${this.#r()}
      </div>
    `,this.#e,{host:this})}#r(){if(0===this.#t.length)return LitHtml.html`<div
        class="no-events-message">${i18nString(UIStrings.noEvents)}</div>`;const e={columns:[{id:"event-main-frame-id",title:i18nString(UIStrings.mainFrameId),widthWeighting:10,hideable:!1,visible:!1,sortable:!1},{id:"event-time",title:i18nString(UIStrings.eventTime),widthWeighting:10,hideable:!1,visible:!0,sortable:!0},{id:"event-type",title:i18nString(UIStrings.eventType),widthWeighting:10,hideable:!1,visible:!0,sortable:!0},{id:"event-owner-origin",title:i18nString(UIStrings.ownerOrigin),widthWeighting:10,hideable:!1,visible:!0,sortable:!0},{id:"event-params",title:i18nString(UIStrings.eventParams),widthWeighting:10,hideable:!1,visible:!0,sortable:!0}],rows:this.#n(),initialSort:{columnId:"event-time",direction:"ASC"}};return LitHtml.html`
      <${DataGrid.DataGridController.DataGridController.litTagName} .data=${e}></${DataGrid.DataGridController.DataGridController.litTagName}>
    `}#n(){return this.#t.map((e=>({cells:[{columnId:"event-main-frame-id",value:e.mainFrameId},{columnId:"event-time",value:e.accessTime,renderer:this.#a.bind(this)},{columnId:"event-type",value:e.type},{columnId:"event-owner-origin",value:e.ownerOrigin},{columnId:"event-params",value:JSON.stringify(e.params)}]})))}#a(e){const t=new Date(1e3*e);return LitHtml.html`${t.toLocaleString()}`}}ComponentHelpers.CustomElements.defineComponent("devtools-shared-storage-access-grid",SharedStorageAccessGrid);