import*as i18n from"../../../core/i18n/i18n.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{Dialog as DialogElement}from"./Dialog.js";import iconDialogStyles from"./iconDialog.css.js";const UIStrings={close:"Close"},str_=i18n.i18n.registerUIStrings("ui/components/dialogs/IconDialog.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);export class ShowDialog extends Event{static eventName="showdialog";constructor(){super(ShowDialog.eventName)}}export class IconDialog extends HTMLElement{static litTagName=LitHtml.literal`devtools-icon-dialog`;#o=this.attachShadow({mode:"open"});#t=this.#e.bind(this);#i=null;#n=null;#l=null;connectedCallback(){this.#o.adoptedStyleSheets=[iconDialogStyles]}set data(o){this.#i=o,ComponentHelpers.ScheduledRender.scheduleRender(this,this.#t)}#s(){if(!this.#n)throw new Error("Dialog not found");this.#n.setDialogVisible(!0),ComponentHelpers.ScheduledRender.scheduleRender(this,this.#t),this.dispatchEvent(new ShowDialog)}#a(){if(!this.#n)throw new Error("Dialog not found");this.#n.setDialogVisible(!1),ComponentHelpers.ScheduledRender.scheduleRender(this,this.#t)}#e(){if(null===this.#i)throw new Error("IconDialog.data is not set");if(!ComponentHelpers.ScheduledRender.isScheduledRender(this))throw new Error("IconDialog render was not scheduled");let o=LitHtml.nothing;this.#i.closeButton&&(o=LitHtml.html`
        <div id='close-button-container'>
          <div id='close-button-right-aligner'>
            <${IconButton.Icon.Icon.litTagName}
              @click=${this.#a}
              .data=${{iconName:"cross",color:"var(--icon-default-hover)",width:"16px",height:"16px"}}
              title=${i18nString(UIStrings.close)}
            ></${IconButton.Icon.Icon.litTagName}>
          </div>
        </div>
      `),LitHtml.render(LitHtml.html`
      <${IconButton.Icon.Icon.litTagName}
        @click=${this.#s}
        on-render=${ComponentHelpers.Directives.nodeRenderedCallback((o=>{this.#l=o}))}
        .data=${this.#i.iconData}
      ></${IconButton.Icon.Icon.litTagName}>
      <${DialogElement.litTagName}
        @clickoutsidedialog=${this.#a}
        .showConnector=${!0}
        .origin=${()=>{if(!this.#l)throw new Error("Icon not found");return this.#l}}
        .position=${this.#i.position}
        .horizontalAlignment=${this.#i.horizontalAlignment}
        .closeOnESC=${this.#i.closeOnESC}
        .closeOnScroll=${this.#i.closeOnScroll}
        on-render=${ComponentHelpers.Directives.nodeRenderedCallback((o=>{this.#n=o}))}
      >
        ${o}
        <div id='slot-container'>
          <slot></slot>
        </div>
      </${DialogElement.litTagName}>
    `,this.#o,{host:this})}}ComponentHelpers.CustomElements.defineComponent("devtools-icon-dialog",IconDialog);