@creaditor/newsletter-starterkit
Version:
Creaditor Newsletter Editor - Starterkit for creating beautiful email newsletters
98 lines (97 loc) • 3.62 kB
JavaScript
"use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[201],{10201:(t,e,o)=>{o.r(e),o.d(e,{ElementHandleBar:()=>d});var i=o(56666),s=o(21293),n=(o(27338),o(70235)),r=o(59320),c=(o(45607),o(52278),o(11211),o(29533));class d extends s.oi{constructor(){super(),this.delayer=new r.Z,this.show_click_message=!0,this.onRemove=this.onRemove.bind(this)}onRemove(){const t={detail:this.closest(this.target),bubbles:!0,composed:!0};this.dispatchEvent(new CustomEvent("remove",t))}onClone(){const t={detail:this.closest(this.target),bubbles:!0,composed:!0};this.dispatchEvent(new CustomEvent("clone",t))}render(){const t="20",e="20",o=n.h.get("config","editor","configure","onSaveBlock");return s.dy`<cdtr-row
alignItems="center"
justify="space-evenly"
class="wrapper"
>
<cdtr-tooltip content="drag_section">
<div class="block-handle--sortable button">
<!-- TODO: if ok move the svg to component -->
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11 10.5V5.828L9.17196 7.657L7.75696 6.243L12 2L16.243 6.243L14.828 7.657L13 5.828V13V18.172L14.828 16.343L16.243 17.757L12 22L7.75696 17.757L9.17196 16.343L11 18.172V13V10.5Z"
fill="black"
/>
<rect
x="3.5"
y="10.5"
width="17"
height="3"
fill="white"
stroke="black"
/>
</svg>
</div>
</cdtr-tooltip>
<div class="button">
<cdtr-tooltip content="duplicate_block">
<cdtr-dupicate-icon
width=${t}
height=${e}
=${this.onClone}
></cdtr-dupicate-icon>
</cdtr-tooltip>
</div>
${o&&s.dy` <div class="button" =${c.Z}>
<cdtr-tooltip content="save_block">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="#000"
width=${t}
height=${e}
>
<path
d="M7 19V13H17V19H19V7.82843L16.1716 5H5V19H7ZM4 3H17L21 7V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM9 15V19H15V15H9Z"
></path>
</svg>
</cdtr-tooltip>
</div>`}
<div class="button" =${this.onRemove}>
<cdtr-tooltip content="remove_block">
<cdtr-remove-icon width=${t} height=${e}></cdtr-remove-icon>
</cdtr-tooltip>
</div>
</cdtr-row>`}}(0,i.Z)(d,"properties",{target:{type:String},show_click_message:{type:Boolean}}),(0,i.Z)(d,"styles",s.iv`
:host {
position: absolute;
top: 0;
right: 0;
height: 25px;
background: transparent;
z-index: 101;
display: flex;
align-items: center;
width: 40%;
transform: translateY(-100%);
}
.wrapper {
position: absolute;
right: 0;
padding: 5px;
height: 100%;
width: auto;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
transform: translateY(-30%);
background: #fff;
border-radius: 0.2rem;
}
.button {
padding: 1px 7px;
min-width: auto;
}
cdtr-tooltip {
display: block;
}
.drag_block {
cursor: grab;
}
.drag_block:active {
cursor: grabbing !important;
}
`),customElements.define("cdtr-element-handle-bar",d)}}]);