@creaditor/newsletter-starterkit
Version:
Creaditor Newsletter Editor - Starterkit for creating beautiful email newsletters
1 lines • 9.15 kB
JavaScript
;(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[9800],{29800:(e,t,n)=>{n.r(t),n.d(t,{default:()=>S});var o=n(35210);const i=e=>{{const{component:t,commands:n,helpers:i}=e;return{select:e=>{let{changeTab:t,tab:n}=e},tabs:e=>{const t=[{text:"design",selected:!0},{text:"link"},{text:"icons"},{text:"settings"}];return t.forEach((t=>t.selected=t.selected=t.text===e)),t},layout:e=>{let{tab:i,changeTab:r,tabs:s}=e;return[{type:"input",title:"whatTheBtnSays",mergeTags:!0,emoji:!0,active:()=>"design"===i.text,value:t.props.text||"",onInput:e=>{const t=e.target.value;n.execCommand("text",t)}},{type:"divider",active:()=>"design"===i.text},{type:"divider",active:()=>"design"===i.text},{type:"typography",active:()=>"design"===i.text,bold:700===t.props.style.fontWeight,italic:"italic"===t.props.style.fontStyle,underline:"underline"===t.props.style.textDecoration,onChange:e=>{switch(e){case"bold":const e=700===t.props.style.fontWeight?400:700;n.execCommand("style",{fontWeight:e});break;case"italic":const o="italic"===t.props.style.fontStyle?"normal":"italic";n.execCommand("style",{fontStyle:o});break;case"underline":const i="underline"===t.props.style.textDecoration?"none":"underline";n.execCommand("style",{textDecoration:i})}}},{type:"divider",active:()=>"design"===i.text},{type:"fontFamily",active:()=>"design"===i.text,value:t.props.style.fontFamily,onChange:e=>{const t=e.target.value;n.execCommand("style",{fontFamily:t})}},{type:"divider",active:()=>"design"===i.text},{type:"slider",title:"fontSize",step:1,min:8,max:50,active:()=>"design"===i.text,value:parseInt(t.props.style.fontSize)||14,onInput:e=>{const t=e.target.value;n.execCommand("style",{fontSize:t+"px",height:"auto"})}},{type:"divider",active:()=>"design"===i.text},{type:"slider",title:"width",min:10,max:500,active:()=>"design"===i.text,value:parseInt(t.props.style.width),onInput:e=>{const t=e.target.value;n.execCommand("style",{width:t+"px",minWidth:null})}},{type:"divider",active:()=>"design"===i.text},{type:"colorpicker",alpha:!1,title:"button_background",active:()=>"design"===i.text,value:t.props.style.background,onChange:e=>{const i=e.target.value,r=(0,o.R)(t.props.style.color,i);n.execCommand("style",{color:r}),n.execCommand("style",{background:i})}},{type:"divider",active:()=>"design"===i.text},{type:"colorpicker",title:"font_color",alpha:!1,active:()=>"design"===i.text,value:t.props.style.color,onChange:e=>{const t=e.target.value;n.execCommand("style",{color:t})}},{type:"divider",active:()=>"design"===i.text},{type:"slider",title:"radius",min:0,max:100,active:()=>"design"===i.text,value:parseInt(t.props.style.borderRadius),onInput:e=>{const t=e.target.value;n.execCommand("style",{borderRadius:t+"px"})}},{type:"divider",active:()=>"design"===i.text},{type:"linkpicker",href:t.props.onClick?.link,protocol:t.props.onClick?.link?.protocol,target:t.props.onClick?.link?.target,autofocus:!0,active:()=>"link"===i.text,onChange:e=>{const t={link:e.target.value};n.execCommand("onClick",t)}},{type:"checkbox",title:"hasIcon",checked:!!t.props.hasIcon,active:()=>"icons"===i.text,onChange:e=>{const t=e.target.checked;n.execCommand("hasIcon",t),n.execCommand("iconDirection","left")}},{type:"dropdown",active:()=>"icons"===i.text&&!0===t.props.hasIcon,title:"iconDirection",value:t.props.iconDirection,onChange:e=>{const t=e.target.value;n.execCommand("iconDirection",t)},items:[{value:"left",label:"left"},{value:"right",label:"right"}]},{type:"slider",title:"size",min:10,max:100,active:()=>"icons"===i.text&&!0===t.props.hasIcon,value:t.props.iconSize||16,onInput:e=>{const t=e.target.value;n.execCommand("iconSize",t)}},{type:"icons",active:()=>"icons"===i.text&&!0===t.props.hasIcon,selectedIcon:t.props.iconUrl,onChange:e=>{const t=e.detail;n.execCommand("iconUrl",t.src)}}]}}}},r=e=>{let{helpers:t,editor:n,getFocused:o}=e;return{set:(e,i,r)=>{switch(i){case"style":return e[i]=t.deepMerge(e[i],r),!0;case"text":return e.text=r,o()||n.chain().setContent(r).run(),!0;case"ripple":case"rippleColor":case"scaleOnHover":case"hasIcon":case"iconUrl":case"iconSize":case"iconDirection":return e[i]=r,!0;case"onClick":if(r.link)return e[i]=r,!0}}}};var s=n(46062),a=n.n(s),c=n(32877),l=n.n(c),d=n(96793),p=n.n(d),u=n(17892),m=n.n(u),A=n(11173),g=n.n(A),h=n(96186),x={};x.setAttributes=m(),x.insert=p().bind(null,"head"),x.domAPI=l(),x.insertStyleElement=g();a()(h.Z,x);const y=h.Z&&h.Z.locals?h.Z.locals:void 0;var C=n(88573),v=n(42626);const b=C.NB.create({name:"paragraph",priority:1e3,addOptions:()=>({HTMLAttributes:{}}),group:"block",content:"inline*",parseHTML:()=>[{tag:"p"}],renderHTML({HTMLAttributes:e}){return["p",(0,C.P1)(this.options.HTMLAttributes,e),0]},addCommands(){return{setParagraph:()=>({commands:e})=>e.setNode(this.name)}},addKeyboardShortcuts(){return{"Mod-Alt-0":()=>this.editor.commands.setParagraph()}}});var f=n(64652),E=n(39615);const k=C.hj.create({addKeyboardShortcuts:()=>({Enter:()=>!0})});const S=()=>{const e="button";return{name:e,create:t=>{const{createElement:n,compose:o,helpers:s}=t,{arrayToString:a,mergeDiff:c}=s;let l=!1;const d=document.createElement("div"),p=document.createElement("div"),{editor:u}=function(e){let{content:t,element:n}=e;return{element:n,editor:new C.ML({element:n,extensions:[v.Z,b,E.Z,f.ZP,k],content:t})}}({content:o.props.text,element:p});d.appendChild(p);return u.view.dom.setAttribute("dir","auto"),u.on("update",(e=>{let{editor:t}=e;const n=t.getText();o.editor.store().updateComponent(o,"text",n)})),u.on("focus",(e=>{let{event:t,editor:n}=e;l=!0})),u.on("blur",(e=>{let{event:t,editor:n}=e;l=!1})),d.className=y.button,n({name:e,id:o.id,template:d,commands:{insertContent:e=>{u.commands.insertContent(e),u.chain().focus()}},defaultProps:{style:{height:"auto",width:"200px",padding:"10px",borderRadius:"5px",fontFamily:"Arial"},text:"button"},render:()=>{try{o.props.style.display="",o.props.style.direction=""}catch(e){console.error(e)}c(d,{style:o.props.style}),d.style.height="auto";const e=o.props.hasIcon,t=o.props.iconUrl,n=o.props.iconDirection,i=o.props.iconSize,r="icon_in_button";let s=d.querySelector(`.${r}`)||document.createElement("img");e&&t?(s.className=r,s.src=t,s.style.width=(i||16)+"px",s.style.height=(i||16)+"px",s.style.marginRight="8px",s.style.marginLeft="8px","left"===n?d.insertBefore(s,d.firstChild):d.appendChild(s)):s.remove()},draggable:{group:"element"},droppable:{group:"element"},resizeable:()=>d,handleBar:!0,validator:r({template:d,helpers:s,editor:u,getFocused:function(){return l}}),schema:o.schema,onSelect:e=>{d.classList.add(e)},onDeselect:e=>{d.classList.remove(e)},elementProps:o,destroy:()=>{u.destroy()},remove:()=>{d.remove()},createEditor:i})}}}},96186:(e,t,n)=>{n.d(t,{Z:()=>a});var o=n(40272),i=n.n(o),r=n(82609),s=n.n(r)()(i());s.push([e.id,".vjErS0oxa7pSGS7JqfxF {\n cursor: text !important;\n}\n.vjErS0oxa7pSGS7JqfxF {\n min-width: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n padding:10px;\n}\n.vjErS0oxa7pSGS7JqfxF p {\n margin: 0;\n line-height: 1;\n}\n.eicX5x7SmY60CCQnENoO {\n width: 100%;\n}\n.WAp1CoJW6d3eiztdh2uT {\n position: absolute;\n z-index: 9;\n width: 3px;\n height: 90%;\n background: var(--resizer-color);\n border-radius: 20px;\n}\n.EcbMG0N6j40eXKTfBpGy {\n left: -8px;\n cursor: w-resize;\n}\n.mtf6071V9prUmvmTszKr {\n left: calc(100% + 5px);\n cursor: e-resize;\n}\n\n.vjErS0oxa7pSGS7JqfxF .WAp1CoJW6d3eiztdh2uT {\n display: none;\n}\n.vjErS0oxa7pSGS7JqfxF.sTe_74tbJp9DHRljPoY5 .WAp1CoJW6d3eiztdh2uT {\n display: block;\n}\n/* .handle{\n display: none;\n}\n.button.selected .handle{\n display: block;\n} */\n","",{version:3,sources:["webpack://./../button-editor-component/lib/style.module.css"],names:[],mappings:"AAAA;EACE,uBAAuB;AAOzB;AARA;EAEE,eAAe;EACf,aAAa;EACb,uBAAuB;EACvB,mBAAmB;EACnB,kBAAkB;EAClB,YAAY;AACd;AACA;EACE,SAAS;EACT,cAAc;AAChB;AACA;EACE,WAAW;AACb;AACA;EACE,kBAAkB;EAClB,UAAU;EACV,UAAU;EACV,WAAW;EACX,gCAAgC;EAChC,mBAAmB;AACrB;AACA;EACE,UAAU;EACV,gBAAgB;AAClB;AACA;EACE,sBAAsB;EACtB,gBAAgB;AAClB;;AAEA;EACE,aAAa;AACf;AACA;EACE,cAAc;AAChB;AACA;;;;;GAKG",sourcesContent:[".button {\n cursor: text !important;\n min-width: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n padding:10px;\n}\n.button p {\n margin: 0;\n line-height: 1;\n}\n.contentEditable {\n width: 100%;\n}\n.margin {\n position: absolute;\n z-index: 9;\n width: 3px;\n height: 90%;\n background: var(--resizer-color);\n border-radius: 20px;\n}\n.marginLeft {\n left: -8px;\n cursor: w-resize;\n}\n.marginRight {\n left: calc(100% + 5px);\n cursor: e-resize;\n}\n\n.button .margin {\n display: none;\n}\n.button.selected .margin {\n display: block;\n}\n/* .handle{\n display: none;\n}\n.button.selected .handle{\n display: block;\n} */\n"],sourceRoot:""}]),s.locals={button:"vjErS0oxa7pSGS7JqfxF",contentEditable:"eicX5x7SmY60CCQnENoO",margin:"WAp1CoJW6d3eiztdh2uT",marginLeft:"EcbMG0N6j40eXKTfBpGy",marginRight:"mtf6071V9prUmvmTszKr",selected:"sTe_74tbJp9DHRljPoY5"};const a=s}}]);