@creaditor/newsletter-starterkit/dist/9530.creaditor.bundle.js

Creaditor Newsletter Editor - Starterkit for creating beautiful email newsletters

"use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9530],{79530:(t,e,o)=>{o.r(e),o.d(e,{SettingEditor:()=>r});var n=o(56666),c=o(21293),s=o(45607);class r extends c.oi{constructor(){super(),this.onInspect=this.onInspect.bind(this),this.name="",this.element_ID=" ",this.cmds={onToggleDisplayMode:(t,e)=>{s.Z.store().execCommand(`show_on_${t}`,e),this[`show_on_${t}`]=e},onChangeElementID(t){s.Z.store().execCommand("element_ID",t.target.value)},onChangeName(t){s.Z.store().execCommand("name",t.target.value)}}}onInspect(){if(s.Z.components.length>0){const t=s.Z.components[0].props;this.show_on_desktop=!!t.show_on_desktop,this.show_on_tablet=!!t.show_on_tablet,this.show_on_mobile=!!t.show_on_mobile,this.name=t.name||"",this.element_ID=t.element_ID||""}}connectedCallback(){super.connectedCallback(),s.Z.on("select",this.onInspect),s.Z.on("update",this.onInspect),this.onInspect()}disconnectedCallback(){super.disconnectedCallback(),s.Z.off("select",this.onInspect),s.Z.off("update",this.onInspect)}render(){return c.dy`
      <cdtr-accordion-item isOpen="true" label="display_mode">
        <cdtr-editor-container>
          <cdtr-text>
            <lang-text text="coming_soon"></lang-text>
          </cdtr-text>
          <!-- <cdtr-row mt="1" alignItems="center">
            <cdtr-checkbox
              .checked=${this.show_on_desktop}
              @change="${t=>this.cmds.onToggleDisplayMode("desktop",!t.target.checked)}"
            >
              <cdtr-title
                ><lang-text text="show_on_desktop"></lang-text
              ></cdtr-title>
            </cdtr-checkbox>
          </cdtr-row>
          <cdtr-row mt="1" alignItems="center">
            <cdtr-checkbox
              .checked=${this.show_on_tablet}
              @change="${t=>this.cmds.onToggleDisplayMode("tablet",!t.target.checked)}"
            >
              <cdtr-title
                ><lang-text text="show_on_tablet"></lang-text></cdtr-title
            ></cdtr-checkbox>
          </cdtr-row>
          <cdtr-row mt="1" alignItems="center">
            <cdtr-checkbox
              .checked=${this.show_on_mobile}
              @change="${t=>this.cmds.onToggleDisplayMode("mobile",!t.target.checked)}"
            >
              <cdtr-title
                ><lang-text text="show_on_mobile"></lang-text></cdtr-title
            ></cdtr-checkbox>
          </cdtr-row> -->
        </cdtr-editor-container>
      </cdtr-accordion-item>
      <cdtr-accordion-item isOpen="true" label="properties">
        <cdtr-editor-container>
          <cdtr-row mt="1">
            <cdtr-title><lang-text text="name"></lang-text></cdtr-title>
          </cdtr-row>
          <cdtr-row>
            <cdtr-input
              max="30"
              @change=${this.cmds.onChangeName}
              .value=${this.name}
              style="width:100%"
            ></cdtr-input>
          </cdtr-row>
          <cdtr-row mt="1">
            <cdtr-title
              ><lang-text text="ID_with_description"></lang-text
            ></cdtr-title>
          </cdtr-row>
          <cdtr-row>
            <cdtr-input
              max="50"
              @change=${this.cmds.onChangeElementID}
              .value=${this.element_ID}
              style="width:100%"
            ></cdtr-input>
          </cdtr-row>
        </cdtr-editor-container>
      </cdtr-accordion-item>
    `}}(0,n.Z)(r,"properties",{name:{},element_ID:{},show_on_desktop:{},show_on_tablet:{},show_on_mobile:{}}),(0,n.Z)(r,"styles",c.iv`
    :host {
      direction: var(--direction-locale);
    }
  `),customElements.define("cdtr-setting-editor",r)}}]);