@creaditor/newsletter-starterkit
Version:
Creaditor Newsletter Editor - Starterkit for creating beautiful email newsletters
6 lines • 8 kB
JavaScript
;(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[7637],{77637:(e,t,r)=>{r.r(t),r.d(t,{default:()=>L});var n=r(9571),s=r(8427);let i={};function a(e){i.selected=e}function c(e){return i.selected}const o=[{type:"youtube",src:"https://panel.sendmsg.co.il/templateContentImages/images/CreaditorGeneral/youtube.png"},{type:"whatsapp",src:"https://panel.sendmsg.co.il/templateContentImages/images/CreaditorGeneral/whatsapp.png"},{type:"snapchat",src:"https://panel.sendmsg.co.il/templateContentImages/images/CreaditorGeneral/snapchat.png"},{type:"instagram",src:"https://render.creaditor.ai/media/social-icons/instagram-black-square.png"},{type:"telegram",src:"https://render.creaditor.ai/media/social-icons/telegram-blue-square.png"},{type:"facebook",src:"https://render.creaditor.ai/media/social-icons/facebook-black-square.png"},{type:"vimeo",src:"https://render.creaditor.ai/media/social-icons/vimeo-blue-square.png"},{type:"email",src:"https://render.creaditor.ai/media/social-icons/broken-link-black-circle.png"},{type:"phone",src:"https://render.creaditor.ai/media/social-icons/phone-black-circle.png"},{type:"x",src:"https://render.creaditor.ai/media/social-icons/x-black-circle.png"},{type:"linkedin",src:"https://render.creaditor.ai/media/social-icons/linkedin-black-circle.png"},{type:"tiktok",src:"https://render.creaditor.ai/media/social-icons/tiktok-black-circle.png"},{type:"reddit",src:"https://render.creaditor.ai/media/social-icons/reddit-black-circle.png"},{type:"twitch",src:"https://render.creaditor.ai/media/social-icons/twitch-black-circle.png"}];const l=e=>{{const{component:t,commands:r}=e,n=c();return n?{select:e=>{let{changeTab:t,tab:r}=e;"link"!==r&&t("link")},tabs:e=>{const t=[{text:"image"},{text:"link"},{text:"design"}];return t.forEach((t=>t.selected=t.selected=t.text===e)),t},layout:e=>{let{tab:i,changeTab:a,tabs:c}=e;const l=[{type:"node",node:()=>s.dy`<img
style="padding:10px;display:block;margin:auto"
width="52"
height="52"
src=${n?.src}
/>`},{type:"button",text:"delete",bgColor:"#df381d",color:"#fff",icon:"deleteBin",active:!0,onClick:e=>{const s=[...t.props.items];if(s.length<2)return;const i=s.findIndex((e=>e.id===n.id));-1!==i&&(s.splice(i,1),r.execCommand("items",s))}},{type:"divider"},{type:"gallery",active:"image"===i.text,src:n?.src,hasPreview:!0,text:"open_gallery",justify:"flex-start",onChange:e=>{let s=e.detail;Array.isArray(s)&&(s=s[0]);const i=t.props,a=JSON.parse(JSON.stringify(i.items)),c=a.findIndex((e=>e.id===n.id));-1!==c&&(a[c].src=s.src,r.execCommand("items",a))}},{type:"linkpicker",href:n.link||n.url,active:()=>"link"===i.text&&!!n,onChange:e=>{const s=e.target.value,i=t.props,a=JSON.parse(JSON.stringify(i.items)),c=a.findIndex((e=>e.id===n.id));if(-1!==c){if(o.find((e=>e.src===a[c].src))){let e=function(e){if("string"!=typeof e)return;const t=document.createElement("a");t.href=e;const r=t.hostname,n=o.find((e=>-1!==r.indexOf(e.type)));return"tel:"===t.protocol?"https://render.creaditor.ai/media/social-icons/phone-black-circle.png":"mailto:"===t.protocol?"https://render.creaditor.ai/media/social-icons/mail-black-circle.png":n?n.src:"https://render.creaditor.ai/media/social-icons/broken-link-black-circle.png"}(s.href);e&&(a[c].src=e)}a[c].url=s.href,a[c].link=s,r.execCommand("items",a)}}},{type:"slider",title:"size",active:"design"===i.text,value:parseInt(n?.style?.width),min:10,max:80,onInput:e=>{const n=e.target.value,s=[...t.props.items];s.forEach((e=>{e.style.width=n+"px",e.style.height=n+"px"})),r.execCommand("items",s)}},{type:"divider"},{type:"slider",title:"spacing",active:"design"===i.text,value:parseFloat(t.props.style.gap),min:0,max:80,onInput:e=>{const t=e.target.value;r.execCommand("style",{gap:t+"px"})}}];return l}}:null}};var d=r(46245);const p=()=>({set:(e,t,r)=>{switch(t){case"style":if("object"==typeof r)return e[t]=(0,d.Z)(e[t],r),!0;case"items":if(e[t]=r,Array.isArray(r)){const e=c(),t=r.find((t=>t.id===e.id));if(t)return a(t),!0}case"src":const n=c();if(n){const s=[...e.items],i=s.findIndex((e=>e.id===n.id));if(-1!==i)return s[i].src=r,e[t]=s,!0}}}});var m=r(46062),h=r.n(m),u=r(32877),f=r.n(u),g=r(96793),y=r.n(g),b=r(17892),k=r.n(b),C=r(11173),x=r.n(C),v=r(12089),A={};A.setAttributes=k(),A.insert=y().bind(null,"head"),A.domAPI=f(),A.insertStyleElement=x();h()(v.Z,A);const w=v.Z&&v.Z.locals?v.Z.locals:void 0;var I=r(51921);const L=()=>{const e="social";return{name:e,create:t=>{let{createElement:r,compose:s,helpers:i}=t;const d=document.createElement("div"),m=document.createElement("div");m.classList.add(w.root);new I.ZP(m,{sort:!0,delay:0,delayOnTouchOnly:!1,touchStartThreshold:0,disabled:!1,store:null,animation:150,easing:"cubic-bezier(1, 0, 0, 1)",preventOnFilter:!0,draggable:".item",dataIdAttr:"data-id",ghostClass:"sortable-ghost",chosenClass:"sortable-chosen",dragClass:"sortable-drag",swapThreshold:1,invertSwap:!1,invertedSwapThreshold:1,direction:"horizontal",forceFallback:!1,fallbackClass:"sortable-fallback",fallbackOnBody:!1,fallbackTolerance:0,dragoverBubble:!1,removeCloneOnHide:!0,emptyInsertThreshold:5,setData:function(e,t){e.setData("Text",t.textContent)},onChoose:function(e){e.oldIndex},onUnchoose:function(e){},onStart:function(e){e.oldIndex},onEnd:function(e){const t=JSON.parse(JSON.stringify(s.props.items)),{oldIndex:r,newIndex:n}=e,[i]=t.splice(r,1);t.splice(n,0,i),s.editor.store().execCommand("items",t)},onMove:function(e,t){e.dragged,e.draggedRect,e.related,e.relatedRect,e.willInsertAfter,t.clientY},onChange:function(e){e.newIndex}});d.appendChild(m);return r({name:e,id:s.id,template:d,draggable:{group:"element"},droppable:{group:"element"},render:()=>{for(s.props.items.forEach((e=>{if(!e.src){const t=(e=>{if(!e)return;const t=e.toLowerCase();if(t.startsWith("mailto:"))return"email";if(t.startsWith("tel:"))return"phone";try{const r=(t.startsWith("http")?new URL(e):new URL(`https://${e}`)).hostname.replace("www.",""),n=r.split(".")[0];return o.find((e=>{const t=e.type.toLowerCase();return r.includes(t)||t.includes(n)||n.includes(t)}))?.type}catch(e){return o.find((e=>{const r=e.type.toLowerCase();return t.includes(r)||r.includes(t)}))?.type}})(e.url);t&&(e.src=o.find((e=>e.type===t))?.src)}}));m.firstChild;)m.removeChild(m.firstChild);i.mergeDiff(m,{style:s.props.style});const e=c();s.props.items.forEach((t=>{const r=document.createElement("img");e?.id===t.id&&r.classList.add(w.selected),r.addEventListener("click",(()=>{a(t),Array.from(m.children).forEach((e=>{e.classList.remove(w.selected)})),r.classList.add(w.selected)})),r.classList.add("item"),t.id&&r.setAttribute("data-id",t.id),r.src=t.src,i.mergeDiff(r,{style:t.style}),m.append(r)}));const t=document.createElement("paper-button");t.style.minWidth="0",t.style.padding=0,t.innerHTML="<cdtr-icon icon='add'></cdtr-icon>",m.append(t),t.addEventListener("click",(()=>{setTimeout((()=>{const e=s.props.items[s.props.items.length-1],t={id:(0,n.Z)(),fgColor:"",bgColor:"",style:e.style,url:"",src:"https://render.creaditor.ai/media/social-icons/broken-link-black-circle.png"},r=[...s.props.items];r.push(t),a(t),s.editor.store().execCommand("items",r)}),200)}))},handleBar:!0,defaultProps:{},validator:p(),schema:s.schema,onSelect:e=>{},onDeselect:e=>{},elementProps:s,remove:()=>{d.remove()},createEditor:l})}}}},12089:(e,t,r)=>{r.d(t,{Z:()=>c});var n=r(40272),s=r.n(n),i=r(82609),a=r.n(i)()(s());a.push([e.id,".kfYL5P8k1NoeIcHkTLa_{\n display: flex;\n}\n.qVA_0R0VNI45kslNcUpm{\n border:1px solid var(--primary);\n}","",{version:3,sources:["webpack://./../social-editor-component-newsletter/lib/style.module.css"],names:[],mappings:"AAAA;IACI,aAAa;AACjB;AACA;IACI,+BAA+B;AACnC",sourcesContent:[".root{\n display: flex;\n}\n.selected{\n border:1px solid var(--primary);\n}"],sourceRoot:""}]),a.locals={root:"kfYL5P8k1NoeIcHkTLa_",selected:"qVA_0R0VNI45kslNcUpm"};const c=a}}]);