npm - @oneclick.dev/cms-core-modules - Versions diffs - 0.0.124 → 0.0.126 - Mend

@oneclick.dev/cms-core-modules 0.0.124 → 0.0.126

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (149) hide show

package/dist/TemplateBuilder.vue_vue_type_script_setup_true_lang-BgDdzbLe.js ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";const e=require("vue"),te=require("@oneclick.dev/cms-kit"),i=require("lucide-vue-next"),O=require("./index-ijdf0d9-.js"),Ee=require("./_plugin-vue_export-helper-BHFhmbuH.js"),de=require("./index-ChHD_1Cf.js"),ce={bodyBg:"#f4f4f5",contentBg:"#ffffff",footerBg:"#f4f4f5",footerTextColor:"#71717a",primaryColor:"#18181b",primaryForeground:"#ffffff",textColor:"#18181b",secondaryTextColor:"#71717a",linkColor:"#2563eb",fontFamily:"Arial, Helvetica, sans-serif",borderRadius:8,contentWidth:600,contentPadding:40,logoUrl:"",footerText:"© {{year}} {{agency_name}}. All rights reserved.",showUnsubscribe:!0,showSocialLinks:!1};function xe(l){switch(l){case"header":return{text:"Heading",level:"h2",align:"left"};case"text":return{html:"Enter your text here..."};case"button":return{text:"Click Here",url:"#",align:"center",variant:"primary"};case"image":return{src:"",alt:"Image",width:600,align:"center"};case"divider":return{color:"#e5e7eb"};case"spacer":return{height:24};case"columns":return{columns:[{label:"Label",value:"Value"},{label:"Label",value:"Value"}]};default:return{}}}const we=[{name:"Welcome Email",subject:"Welcome to {{agency_name}}, {{user_name}}!",description:"Sent when a new user is invited to the dashboard.",category:"onboarding",status:"active",blocks:[{id:"welcome-header",type:"header",content:{text:"Welcome aboard, {{user_name}}!",level:"h1",align:"center"}},{id:"welcome-text",type:"text",content:{html:"You've been invited to join {{project_name}} on {{agency_name}}. Click the button below to get started."}},{id:"welcome-btn",type:"button",content:{text:"Accept Invitation",url:"{{invite_url}}",align:"center",variant:"primary"}},{id:"welcome-divider",type:"divider",content:{color:"#e5e7eb"}},{id:"welcome-footer",type:"text",content:{html:`If you didn't expect this invitation, you can safely ignore this email.`}}]},{name:"Password Reset",subject:"Reset your password — {{agency_name}}",description:"Sent when a user requests a password reset.",category:"authentication",status:"active",blocks:[{id:"reset-header",type:"header",content:{text:"Password Reset",level:"h2",align:"left"}},{id:"reset-text",type:"text",content:{html:"Hi {{user_name}},We received a request to reset the password for your account ({{user_email}}). Click the button below to choose a new password."}},{id:"reset-btn",type:"button",content:{text:"Reset Password",url:"{{reset_url}}",align:"center",variant:"primary"}},{id:"reset-spacer",type:"spacer",content:{height:16}},{id:"reset-note",type:"text",content:{html:`If you didn't request this, no action is needed — your password will remain unchanged.`}}]},{name:"Payment Confirmation",subject:"Payment received — {{agency_name}}",description:"Sent after a successful payment is processed.",category:"billing",status:"active",blocks:[{id:"payment-header",type:"header",content:{text:"Payment Confirmed",level:"h2",align:"left"}},{id:"payment-text",type:"text",content:{html:"Hi {{user_name}},We've successfully received your payment. Thank you for your continued support!"}},{id:"payment-divider",type:"divider",content:{color:"#e5e7eb"}},{id:"payment-footer",type:"text",content:{html:'If you have questions about this charge, reach out at {{support_email}}.'}}]},{name:"Notification Digest",subject:"Your latest updates — {{agency_name}}",description:"Periodic summary of recent activity and notifications.",category:"notifications",blocks:[{id:"digest-header",type:"header",content:{text:"Here's what you missed",level:"h2",align:"left"}},{id:"digest-text",type:"text",content:{html:"Hi {{user_name}},Here's a summary of recent activity on {{project_name}}."}},{id:"digest-spacer",type:"spacer",content:{height:16}},{id:"digest-btn",type:"button",content:{text:"View Dashboard",url:"{{dashboard_url}}",align:"center",variant:"primary"}}]},{name:"System Maintenance",subject:"Scheduled maintenance — {{agency_name}}",description:"Sent before planned system downtime or maintenance windows.",category:"system",blocks:[{id:"maint-header",type:"header",content:{text:"Scheduled Maintenance",level:"h2",align:"left"}},{id:"maint-text",type:"text",content:{html:"Hi {{user_name}},We'll be performing scheduled maintenance on {{project_name}}. During this time, some services may be temporarily unavailable."}},{id:"maint-divider",type:"divider",content:{color:"#e5e7eb"}},{id:"maint-footer",type:"text",content:{html:'No action is required on your part. If you have questions, contact {{support_email}}.'}}]},{name:"Notification",subject:"{{notification_title}} — {{agency_name}}",description:"Sent when a user receives a notification and has email notifications enabled.",category:"notifications",status:"active",blocks:[{id:"notif-header",type:"header",content:{text:"{{notification_title}}",level:"h2",align:"left"}},{id:"notif-text",type:"text",content:{html:"Hi {{user_name}},{{notification_body}}"}},{id:"notif-btn",type:"button",content:{text:"View in Dashboard",url:"{{notification_url}}",align:"center",variant:"primary"}},{id:"notif-divider",type:"divider",content:{color:"#e5e7eb"}},{id:"notif-footer",type:"text",content:{html:`You're receiving this because you have email notifications enabled. You can update your preferences in your dashboard settings.`}}]}];function Me(){return structuredClone(ce)}function he(l,E){const a=we.find(u=>E?u.system_key===E:u.name===l);return a?structuredClone(a):null}function Le(){return structuredClone(we)}function Se(l){const{name:E,subject:a,preheader:u,description:d,category:k,status:v,blocks:C,styles:L}=l;return{name:E,subject:a,preheader:u,description:d,category:k,status:v,blocks:C,styles:L}}function ee(l){return JSON.stringify(Se(l))}function ie(l,E=60){let a=[l],u=0;return{get canUndo(){return u>0},get canRedo(){return u<a.length-1},record(d){a[u]!==d&&(a=a.slice(0,u+1),a.push(d),a.length>E&&a.shift(),u=a.length-1)},undo(){return u>0?a[--u]:null},redo(){return u<a.length-1?a[++u]:null}}}function Ie(...l){const E=JSON.stringify(l).matchAll(/\{\{(\w+)\}\}/g);return[...new Set(Array.from(E,a=>a[1]))].sort()}const Ae={class:"w-full xl:w-[240px] xl:min-w-[240px] border-r bg-card flex flex-col"},Re={class:"p-4 border-b"},je={class:"flex items-center justify-between mb-3"},Fe={class:"text-sm font-semibold"},Pe={class:"ml-1 text-xs text-muted-foreground"},He={class:"relative"},Oe={class:"p-2"},qe=["onClick"],We={class:"flex items-start gap-3"},Je={class:"min-w-0 flex-1"},Ye={class:"flex items-center gap-2"},Ke={class:"font-medium text-sm truncate"},Ge={key:0,class:"size-1.5 shrink-0 rounded-full bg-amber-500",title:"Unsaved changes","aria-label":"Unsaved changes"},Qe={class:"text-xs text-muted-foreground mt-0.5 truncate"},Ze={key:0,class:"text-[11px] text-muted-foreground/60 mt-1"},Xe={key:0,class:"text-center py-12 px-4"},_e=e.defineComponent({__name:"TemplateList",props:e.mergeModels({templates:{},selectedTemplateId:{},dirtyTemplateIds:{},canCreate:{type:Boolean}},{searchQuery:{default:""},searchQueryModifiers:{}}),emits:e.mergeModels(["select","create"],["update:searchQuery"]),setup(l,{emit:E}){const a=l,u=E,d=e.useModel(l,"searchQuery"),k=V=>({onboarding:i.UserPlus,authentication:i.KeyRound,billing:i.CreditCard,notifications:i.Bell,system:i.ShieldCheck})[V]??i.Mail,v=V=>({onboarding:"text-emerald-500",authentication:"text-amber-500",billing:"text-blue-500",notifications:"text-purple-500",system:"text-stone-500"})[V]??"text-stone-400",C=V=>{const c=Math.floor((Date.now()-new Date(V).getTime())/1e3);if(c<60)return"just now";const m=Math.floor(c/60);if(m<60)return`${m}m ago`;const y=Math.floor(m/60);if(y<24)return`${y}h ago`;const T=Math.floor(y/24);return T<30?`${T}d ago`:`${Math.floor(T/30)}mo ago`},L=e.computed(()=>{let V=a.templates;if(d.value.trim()){const c=d.value.toLowerCase();V=V.filter(m=>m.name.toLowerCase().includes(c)||(m.description||"").toLowerCase().includes(c)||m.subject.toLowerCase().includes(c))}return V});return(V,c)=>{const m=e.resolveComponent("Button"),y=e.resolveComponent("Input"),T=e.resolveComponent("ScrollArea");return e.openBlock(),e.createElementBlock("div",Ae,[e.createElementVNode("div",Re,[e.createElementVNode("div",je,[e.createElementVNode("h2",Fe,[c[2]||(c[2]=e.createTextVNode("Mail templates ",-1)),e.createElementVNode("span",Pe,e.toDisplayString(l.templates.length),1)]),l.canCreate?(e.openBlock(),e.createBlock(m,{key:0,variant:"ghost",size:"icon",class:"size-7","aria-label":"Create template",title:"Create template",onClick:c[0]||(c[0]=x=>u("create"))},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Plus),{class:"size-4"})]),_:1})):e.createCommentVNode("",!0)]),e.createElementVNode("div",He,[e.createVNode(y,{modelValue:d.value,"onUpdate:modelValue":c[1]||(c[1]=x=>d.value=x),type:"search",placeholder:"Search templates...","aria-label":"Search templates",class:"pl-9 h-9 text-sm appearance-none [&::-webkit-search-cancel-button]:appearance-none"},null,8,["modelValue"]),e.createVNode(e.unref(i.Search),{class:"absolute left-3 top-1/2 -translate-y-1/2 size-3.5 text-muted-foreground"})])]),e.createVNode(T,{class:"flex-1"},{default:e.withCtx(()=>[e.createElementVNode("div",Oe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(L.value,x=>(e.openBlock(),e.createElementBlock("button",{key:x.id,onClick:b=>u("select",x.id),class:e.normalizeClass(["w-full text-left p-3 rounded-lg mb-1 transition-all duration-150 group",l.selectedTemplateId===x.id?"bg-primary/5 border border-primary/20 shadow-sm":"hover:bg-accent/50 border border-transparent"])},[e.createElementVNode("div",We,[e.createElementVNode("div",{class:e.normalizeClass(["mt-0.5 size-8 rounded-lg flex items-center justify-center shrink-0",l.selectedTemplateId===x.id?"bg-primary/10":"bg-secondary"])},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(k(x.category)),{class:e.normalizeClass(["size-4",v(x.category)])},null,8,["class"]))],2),e.createElementVNode("div",Je,[e.createElementVNode("div",Ye,[e.createElementVNode("span",Ke,e.toDisplayString(x.name),1),l.dirtyTemplateIds.includes(x.id)?(e.openBlock(),e.createElementBlock("span",Ge)):e.createCommentVNode("",!0)]),e.createElementVNode("p",Qe,e.toDisplayString(x.description),1),x.updated_at?(e.openBlock(),e.createElementBlock("p",Ze,"Edited "+e.toDisplayString(C(x.updated_at)),1)):e.createCommentVNode("",!0)]),e.createVNode(e.unref(i.ChevronRight),{class:e.normalizeClass(["size-4 text-muted-foreground/40 shrink-0 mt-1 transition-transform",l.selectedTemplateId===x.id?"text-primary":"opacity-0 group-hover:opacity-100"])},null,8,["class"])])],10,qe))),128)),L.value.length===0?(e.openBlock(),e.createElementBlock("div",Xe,[e.createVNode(e.unref(i.Mail),{class:"mx-auto size-10 text-muted-foreground/30"}),c[3]||(c[3]=e.createElementVNode("p",{class:"text-sm text-muted-foreground mt-2"},"No templates found",-1)),c[4]||(c[4]=e.createElementVNode("p",{class:"text-xs text-muted-foreground/60 mt-1"},"Try a different search or create a template",-1))])):e.createCommentVNode("",!0)])]),_:1})])}}});function Te(l){const E={},{color:a,fontSize:u,textAlign:d}=l.style;return/^(#[\da-f]{3,8}|[a-z]+|rgba?$[\d.,%\s]+$|hsla?$[\d.,%\s]+$)$/i.test(a)&&(E.color=a),/^\d+(\.\d+)?px$/.test(u)&&parseFloat(u)>=8&&parseFloat(u)<=72&&(E.fontSize=u),["left","center","right","justify"].includes(d)&&(E.textAlign=d),E}function Be(l){return/^(https?:\/\/[^\s]+|mailto:[^\s]+|tel:[+\d\s()-]+|#[\w-]*|\{\{\w+\}\})$/i.test(l.trim())}const et=new Set(["p","br","strong","b","em","i","u","s","a","ul","ol","li","blockquote","span","h1","h2","h3"]),tt=new Set(["script","style","iframe","object","embed","svg","math","template","head"]);function lt(l){if(typeof DOMParser>"u")return[l.replace(/<[^>]*>/g,"")];const E=new DOMParser().parseFromString(l,"text/html"),a=u=>{if(u.nodeType===3)return u.textContent??"";if(u.nodeType!==1)return null;const d=u,k=d.tagName.toLowerCase();if(tt.has(k))return null;const v=Array.from(d.childNodes,a);return et.has(k)?e.h(k==="a"?"span":k,{style:Te(d),...k==="a"?{class:"email-preview-link"}:{}},k==="br"?void 0:v):v};return Array.from(E.body.childNodes,a)}const ot=["aria-label"],nt=["aria-label"],at=["aria-label"],rt=["disabled"],st=["disabled"],dt={class:"p-3 text-center"},it={class:"mt-1 text-xs text-muted-foreground"},ct=["src","alt"],ut=e.defineComponent({__name:"BlockRenderer",props:{block:{},index:{},totalBlocks:{},selectedBlockId:{},templateStyles:{}},emits:["select","move","duplicate","delete","drag-start","drag-end"],setup(l,{emit:E}){const a=l,u=E,d=e.computed(()=>({header:"Heading",text:"Text",button:"Button",image:"Image",divider:"Divider",spacer:"Spacer",columns:"Columns"})[a.block.type]),k=e.computed(()=>a.selectedBlockId===a.block.id),v=e.computed(()=>["h1","h2","h3"].includes(a.block.content.level)?a.block.content.level:"h2"),C=(x,b,t)=>x===""||x===void 0||x===null||!Number.isFinite(Number(x))?b:Math.min(t,Math.max(0,Number(x))),L=e.computed(()=>({paddingTop:`${C(a.block.content.paddingTop,["button","divider"].includes(a.block.type)?8:0,80)}px`,paddingBottom:`${C(a.block.content.paddingBottom,a.block.type==="spacer"?0:16,80)}px`})),V=e.computed(()=>({color:a.block.content.color||a.templateStyles.textColor,fontSize:`${C(a.block.content.fontSize,a.block.type==="header"?{h1:28,h2:22,h3:18}[v.value]||22:15,72)}px`,textAlign:a.block.content.align||"left",lineHeight:a.block.type==="header"?"1.3":"1.6"})),c=e.computed(()=>/^https?:\/\/[^\s]+$/i.test(a.block.content.src||"")?a.block.content.src:""),m=e.defineComponent({props:{html:{type:String,default:""}},setup:x=>()=>e.h("div",{class:"email-block-rich-text"},lt(x.html))});function y(x){const b=x.target.closest("button");if(b&&!b.hasAttribute("data-email-drag-handle")){x.preventDefault();return}if(x.dataTransfer){x.dataTransfer.effectAllowed="move",x.dataTransfer.setData("text/plain",a.block.id);const t=x.currentTarget,p=t.getBoundingClientRect();x.dataTransfer.setDragImage(t,x.clientX-p.left,x.clientY-p.top)}u("drag-start",a.block.id)}function T(x){x.target===x.currentTarget&&(x.key==="Enter"||x.key===" ")&&(x.preventDefault(),u("select",a.block.id))}return(x,b)=>(e.openBlock(),e.createElementBlock("div",{draggable:"true",tabindex:"0",role:"group","aria-label":`${d.value} block ${l.index+1} of ${l.totalBlocks}${k.value?", selected":""}. Press Enter to edit.`,class:e.normalizeClass(["group relative min-h-6 cursor-grab select-none rounded outline-none active:cursor-grabbing focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",k.value?"ring-2 ring-primary ring-offset-2":"hover:ring-1 hover:ring-primary/30 hover:ring-offset-1"]),style:e.normalizeStyle(L.value),onClick:b[6]||(b[6]=e.withModifiers(t=>u("select",l.block.id),["stop"])),onKeydown:T,onDragstart:e.withModifiers(y,["stop"]),onDragend:b[7]||(b[7]=e.withModifiers(t=>u("drag-end"),["stop"]))},[e.createElementVNode("div",{class:e.normalizeClass(["absolute -right-1 -top-3 z-10 flex items-center gap-0.5 rounded border bg-card p-0.5 text-card-foreground shadow-sm transition-opacity group-focus-within:opacity-100",k.value?"opacity-100":"opacity-0 group-hover:opacity-100"]),onClick:b[5]||(b[5]=e.withModifiers(()=>{},["stop"]))},[e.createElementVNode("button",{type:"button",draggable:"true","data-email-drag-handle":"","aria-label":`Drag ${d.value.toLowerCase()} block to reorder`,title:"Drag to reorder; use arrow buttons for keyboard control",class:"cursor-grab rounded p-1.5 hover:bg-accent active:cursor-grabbing"},[e.createVNode(e.unref(i.GripVertical),{class:"size-3.5"})],8,nt),e.createElementVNode("button",{type:"button","aria-label":`Edit ${d.value.toLowerCase()} block`,title:"Edit block",class:"rounded p-1.5 hover:bg-accent",onClick:b[0]||(b[0]=t=>u("select",l.block.id))},[e.createVNode(e.unref(i.Pencil),{class:"size-3.5"})],8,at),e.createElementVNode("button",{type:"button","aria-label":"Move block up",title:"Move block up",disabled:l.index===0,class:"rounded p-1.5 hover:bg-accent disabled:pointer-events-none disabled:opacity-30",onClick:b[1]||(b[1]=t=>u("move",l.block.id,"up"))},[e.createVNode(e.unref(i.MoveUp),{class:"size-3.5"})],8,rt),e.createElementVNode("button",{type:"button","aria-label":"Move block down",title:"Move block down",disabled:l.index===l.totalBlocks-1,class:"rounded p-1.5 hover:bg-accent disabled:pointer-events-none disabled:opacity-30",onClick:b[2]||(b[2]=t=>u("move",l.block.id,"down"))},[e.createVNode(e.unref(i.MoveDown),{class:"size-3.5"})],8,st),e.createElementVNode("button",{type:"button","aria-label":"Duplicate block",title:"Duplicate block",class:"rounded p-1.5 hover:bg-accent",onClick:b[3]||(b[3]=t=>u("duplicate",l.block.id))},[e.createVNode(e.unref(i.Copy),{class:"size-3.5"})]),e.createElementVNode("button",{type:"button","aria-label":"Delete block",title:"Delete block",class:"rounded p-1.5 hover:bg-destructive/10 hover:text-destructive",onClick:b[4]||(b[4]=t=>u("delete",l.block.id))},[e.createVNode(e.unref(i.Trash2),{class:"size-3.5"})])],2),l.block.type==="header"?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(v.value),{key:0,class:"m-0 font-bold",style:e.normalizeStyle(V.value)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.block.content.text),1)]),_:1},8,["style"])):l.block.type==="text"?(e.openBlock(),e.createBlock(e.unref(m),{key:1,html:l.block.content.html||"",style:e.normalizeStyle({...V.value,"--email-link-color":l.templateStyles.linkColor})},null,8,["html","style"])):l.block.type==="button"?(e.openBlock(),e.createElementBlock("div",{key:2,style:e.normalizeStyle({textAlign:l.block.content.align||"center"})},[e.createElementVNode("span",{class:"inline-block px-7 py-3 text-[15px] font-semibold",style:e.normalizeStyle({backgroundColor:l.block.content.variant==="secondary"?"transparent":l.templateStyles.primaryColor,color:l.block.content.variant==="secondary"?l.templateStyles.primaryColor:l.templateStyles.primaryForeground,border:l.block.content.variant==="secondary"?`2px solid ${l.templateStyles.primaryColor}`:"none",borderRadius:l.templateStyles.borderRadius+"px"})},e.toDisplayString(l.block.content.text),5)],4)):l.block.type==="image"?(e.openBlock(),e.createElementBlock("div",{key:3,style:e.normalizeStyle({textAlign:l.block.content.align||"center"})},[c.value?(e.openBlock(),e.createElementBlock("img",{key:1,src:c.value,alt:l.block.content.alt||"",style:e.normalizeStyle({width:C(l.block.content.width,600,800)+"px",maxWidth:"100%"}),class:"inline-block h-auto",draggable:"false"},null,12,ct)):(e.openBlock(),e.createElementBlock("div",{key:0,class:"inline-flex max-w-full items-center justify-center rounded-lg border-2 border-dashed bg-muted/30",style:e.normalizeStyle({width:Math.min(l.block.content.width||200,400)+"px",minHeight:"120px"})},[e.createElementVNode("div",dt,[e.createVNode(e.unref(i.Image),{class:"mx-auto size-8 text-muted-foreground/40"}),e.createElementVNode("p",it,e.toDisplayString(l.block.content.src?"Image preview available after variables are filled":"Select to add an image"),1)])],4))],4)):l.block.type==="divider"?(e.openBlock(),e.createElementBlock("hr",{key:4,class:"m-0 border-0",style:e.normalizeStyle({borderTopColor:l.block.content.color||"#e5e7eb",borderTopWidth:`${C(l.block.content.thickness,1,8)}px`,borderTopStyle:["solid","dashed","dotted"].includes(l.block.content.style)?l.block.content.style:"solid"})},null,4)):l.block.type==="spacer"?(e.openBlock(),e.createElementBlock("div",{key:5,style:e.normalizeStyle({height:`${C(l.block.content.height,24,200)}px`}),class:"min-h-2"},null,4)):l.block.type==="columns"?(e.openBlock(),e.createElementBlock("div",{key:6,class:"grid gap-2 p-2",style:e.normalizeStyle({gridTemplateColumns:`repeat(${Math.min(l.block.content.columns?.length||2,4)}, minmax(0, 1fr))`,backgroundColor:l.templateStyles.bodyBg,borderRadius:l.templateStyles.borderRadius+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.block.content.columns,(t,p)=>(e.openBlock(),e.createElementBlock("div",{key:p,class:"min-w-0 px-3 py-2"},[e.createElementVNode("p",{class:"m-0 text-xs font-semibold uppercase tracking-wide",style:e.normalizeStyle({color:l.templateStyles.secondaryTextColor})},e.toDisplayString(t.label),5),e.createElementVNode("p",{class:"mb-0 mt-1 break-words text-[15px] font-medium",style:e.normalizeStyle({color:l.templateStyles.textColor})},e.toDisplayString(t.value),5)]))),128))],4)):e.createCommentVNode("",!0)],46,ot))}}),mt=Ee._export_sfc(ut,[["__scopeId","data-v-48c20c32"]]),pt={class:"flex min-w-0 flex-1 flex-col bg-background","aria-label":"Email builder"},vt={class:"flex flex-wrap items-center justify-between gap-3 border-b bg-card px-4 py-3"},ft={class:"min-w-0 flex-1"},xt={class:"truncate text-sm font-semibold"},bt={class:"mt-0.5 text-xs text-muted-foreground",role:"status"},gt={class:"flex items-center gap-1.5"},yt={class:"flex flex-wrap items-center justify-between gap-2 border-b bg-card px-4 py-2"},kt={class:"flex gap-1 rounded-md bg-muted p-0.5","aria-label":"Editor mode"},Vt={key:0,class:"flex items-center gap-1","aria-label":"Preview viewport"},Nt={class:"ml-1 text-[11px] tabular-nums text-muted-foreground"},Ct={key:1,class:"flex items-center gap-2"},ht={key:0,class:"flex flex-wrap gap-1 border-b bg-card/50 px-3 py-2","aria-label":"Add email block"},Bt={key:1,class:"border-b bg-card px-4 py-2"},Et={class:"flex items-center justify-between gap-3"},wt={class:"truncate text-xs"},St={key:0,class:"space-y-3 py-3"},Tt={class:"flex items-center gap-2 text-xs"},Dt={class:"grid max-h-48 grid-cols-1 gap-2 overflow-y-auto sm:grid-cols-2"},$t={class:"mb-1 block font-mono text-muted-foreground"},Ut={key:2,class:"flex items-center justify-between gap-2 border-b bg-destructive/5 px-4 py-3 text-sm text-destructive",role:"alert"},zt={key:3,class:"max-h-28 overflow-auto border-b bg-amber-500/10 px-4 py-2 text-xs",role:"alert"},Mt={class:"relative min-h-0 flex-1 overflow-auto bg-muted/40"},Lt={key:0,class:"sticky top-2 z-10 mx-auto flex w-fit items-center gap-2 rounded-full border bg-card px-3 py-1.5 text-xs shadow-sm",role:"status"},It=["src"],At={key:1,class:"rounded-lg border-2 border-dashed p-8 text-center"},Rt=["data-email-block-id"],jt={key:0,"aria-hidden":"true",class:"pointer-events-none absolute -top-1 inset-x-0 z-20 border-t-2 border-primary"},Ft={key:2,class:"relative h-8 text-center text-xs leading-8 text-muted-foreground"},Pt={key:0,"aria-hidden":"true",class:"pointer-events-none absolute inset-x-0 top-0 border-t-2 border-primary"},Ht={key:1,class:"mt-3"},Ot={key:2,class:"h-full min-h-[500px] p-3 sm:p-5"},qt=["srcdoc"],Wt={key:3,class:"h-full p-4"},Jt=["value"],Yt={class:"flex flex-wrap items-center justify-between gap-2 border-t bg-card px-4 py-2 text-[11px] text-muted-foreground"},Kt={key:0,class:"relative"},Gt={class:"flex cursor-pointer list-none items-center gap-1 text-amber-600"},Qt={class:"absolute bottom-6 right-0 z-20 w-72 space-y-2 rounded-md border bg-card p-3 text-xs shadow-lg"},Zt={key:1,class:"flex items-center gap-1"},Xt={key:1,class:"flex flex-1 flex-col items-center justify-center p-8 text-center"},_t=e.defineComponent({__name:"EmailCanvas",props:{template:{},selectedBlockId:{},templateStyles:{},saving:{type:Boolean},hasUnsavedChanges:{type:Boolean},canUndo:{type:Boolean},canRedo:{type:Boolean},dirtyCount:{},canEdit:{type:Boolean},canCreate:{type:Boolean},canDelete:{type:Boolean}},emits:["select-block","add-block","move-block","reorder-block","duplicate-block","delete-block","save","undo","redo","duplicate-template","create","delete-template"],setup(l,{emit:E}){const a=l,u=E,d=te.useModuleApi(),k=N=>d.post("/render",{body:N}),v=e.ref(a.canEdit?"edit":"preview"),C=e.ref("desktop"),L=e.ref("mjml"),V=e.computed(()=>C.value==="mobile"?375:C.value==="tablet"?768:Math.max(680,a.templateStyles.contentWidth+80)),c=e.ref(null),m=e.ref(!1),y=e.ref(""),T=e.ref(!1),x=e.ref(!1),b=e.ref(!0),t=e.reactive({agency_name:"Your agency",user_name:"Alex Morgan",user_email:"alex@example.com",project_name:"Your project",year:String(new Date().getFullYear()),inviter_name:"Jamie",support_email:"support@example.com",dashboard_url:"https://example.com/dashboard",invite_url:"https://example.com/invitation",reset_url:"https://example.com/reset",unsubscribe_url:"https://example.com/unsubscribe",expires_at:new Date(Date.now()+7*864e5).toLocaleDateString()}),p=e.computed(()=>Ie(a.template?.subject,a.template?.preheader,a.template?.blocks,a.templateStyles,a.templateStyles.showUnsubscribe?"{{unsubscribe_url}}":"")),h=e.computed(()=>p.value.filter(N=>!t[N])),U=e.computed(()=>{const N=[];for(const[r,B]of(a.template?.blocks||[]).entries())B.type==="image"&&!B.content.src&&N.push(`Block ${r+1}: add an image URL.`),B.type==="image"&&B.content.src&&!B.content.alt&&N.push(`Block ${r+1}: add alternative text for accessibility.`),B.type==="button"&&(!B.content.url||B.content.url==="#")&&N.push(`Block ${r+1}: add a destination for the button.`);return a.template?.subject.trim()||N.unshift("Add an email subject in Settings."),N}),w=e.computed(()=>L.value==="mjml"?c.value?.mjml||"":c.value?.html||""),F=e.computed(()=>c.value?Math.ceil(new TextEncoder().encode(c.value.html).length/1024):0),H=e.computed(()=>c.value?.subject||a.template?.subject);let q,z=0;async function D(){const N=++z;if(a.template){m.value=!0,y.value="";try{const r=await k({blocks:a.template.blocks,subject:a.template.subject,preheader:a.template.preheader,styles:a.templateStyles,variables:v.value==="source"||!b.value?{}:{...t},preserveVariables:v.value==="source"||!b.value});N===z&&(c.value=r)}catch(r){N===z&&(y.value=r?.data?.statusMessage||(r instanceof Error?r.message:"Could not compile this email."),c.value=null)}finally{N===z&&(m.value=!1)}}}e.watch(()=>[a.template,a.templateStyles,t,b.value,v.value],()=>{if(clearTimeout(q),z++,v.value==="edit"){m.value=!1;return}m.value=!0,q=setTimeout(D,450)},{deep:!0,immediate:!0}),e.watch(()=>a.template?.id,()=>{c.value=null,y.value="",x.value=!1}),e.onBeforeUnmount(()=>{clearTimeout(q),z++});async function Z(N){if(!a.template||T.value)return;T.value=!0;const r=a.template.name;try{const B=await k({blocks:a.template.blocks,subject:a.template.subject,preheader:a.template.preheader,styles:a.templateStyles,preserveVariables:!0}),Q=new Blob([B[N]],{type:N==="html"?"text/html;charset=utf-8":"text/plain;charset=utf-8"}),J=URL.createObjectURL(Q),Y=document.createElement("a");Y.href=J,Y.download=`${r.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,"")||"email"}.${N}`,document.body.appendChild(Y),Y.click(),Y.remove(),setTimeout(()=>URL.revokeObjectURL(J),1e3),O.toast.success(`${N.toUpperCase()} exported with template variables preserved`)}catch(B){O.toast.error(B?.data?.statusMessage||(B instanceof Error?B.message:"Export failed"))}finally{T.value=!1}}async function K(){try{await navigator.clipboard.writeText(w.value),O.toast.success("Source copied")}catch{O.toast.error("Could not copy. Use Download instead.")}}const R=e.ref(null),n=e.ref(null),M=e.ref(!1),I=e.ref(null);function le(){R.value=null,n.value=null,M.value=!1}function ue(N){const r=Array.from(I.value?.querySelectorAll("[data-email-block-id]")??[]);for(const B of r){const Q=B.getBoundingClientRect();if(N<Q.top+Q.height/2)return B.dataset.emailBlockId??null}return null}function W(N){!R.value||!a.canEdit||(N.preventDefault(),N.dataTransfer&&(N.dataTransfer.dropEffect="move"),n.value=ue(N.clientY),M.value=!0)}function oe(N){!R.value||!a.canEdit||(N.preventDefault(),u("reorder-block",R.value,ue(N.clientY)),le())}function G(N){(!(N.relatedTarget instanceof Node)||!N.currentTarget.contains(N.relatedTarget))&&(M.value=!1)}e.watch(()=>[a.template?.id,v.value],le);const ne=[{type:"header",label:"Heading",icon:i.Type},{type:"text",label:"Text",icon:i.AlignLeft},{type:"button",label:"Button",icon:i.MousePointer},{type:"image",label:"Image",icon:i.Image},{type:"columns",label:"Columns",icon:i.Columns},{type:"divider",label:"Divider",icon:i.Minus},{type:"spacer",label:"Spacer",icon:i.Square}];return(N,r)=>{const B=e.resolveComponent("Button"),Q=e.resolveComponent("DropdownMenuTrigger"),J=e.resolveComponent("DropdownMenuItem"),Y=e.resolveComponent("DropdownMenuSeparator"),ve=e.resolveComponent("DropdownMenuContent"),fe=e.resolveComponent("DropdownMenu"),me=e.resolveComponent("Input");return e.openBlock(),e.createElementBlock("section",pt,[l.template?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("header",vt,[e.createElementVNode("div",ft,[e.createElementVNode("h1",xt,e.toDisplayString(l.template.name),1),e.createElementVNode("p",bt,e.toDisplayString(l.hasUnsavedChanges?`Unsaved changes${l.dirtyCount>1?` in ${l.dirtyCount} templates`:""}`:"All changes saved"),1)]),e.createElementVNode("div",gt,[l.canEdit?(e.openBlock(),e.createBlock(B,{key:0,variant:"ghost",size:"icon",class:"size-8",disabled:!l.canUndo,"aria-label":"Undo",title:"Undo (⌘/Ctrl Z)",onClick:r[0]||(r[0]=f=>u("undo"))},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Undo2),{class:"size-4"})]),_:1},8,["disabled"])):e.createCommentVNode("",!0),l.canEdit?(e.openBlock(),e.createBlock(B,{key:1,variant:"ghost",size:"icon",class:"size-8",disabled:!l.canRedo,"aria-label":"Redo",title:"Redo (⌘/Ctrl Shift Z)",onClick:r[1]||(r[1]=f=>u("redo"))},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Redo2),{class:"size-4"})]),_:1},8,["disabled"])):e.createCommentVNode("",!0),e.createVNode(fe,null,{default:e.withCtx(()=>[e.createVNode(Q,{"as-child":""},{default:e.withCtx(()=>[e.createVNode(B,{variant:"outline",size:"sm",class:"h-8","aria-label":"Template actions"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Download),{class:"size-3.5"}),r[17]||(r[17]=e.createElementVNode("span",{class:"hidden 2xl:inline"},"Export",-1))]),_:1})]),_:1}),e.createVNode(ve,{align:"end"},{default:e.withCtx(()=>[e.createVNode(J,{disabled:T.value,onSelect:r[2]||(r[2]=f=>Z("mjml"))},{default:e.withCtx(()=>[...r[18]||(r[18]=[e.createTextVNode("Download MJML",-1)])]),_:1},8,["disabled"]),e.createVNode(J,{disabled:T.value,onSelect:r[3]||(r[3]=f=>Z("html"))},{default:e.withCtx(()=>[...r[19]||(r[19]=[e.createTextVNode("Download HTML",-1)])]),_:1},8,["disabled"]),e.createVNode(Y),l.canCreate?(e.openBlock(),e.createBlock(J,{key:0,onSelect:r[4]||(r[4]=f=>u("duplicate-template"))},{default:e.withCtx(()=>[...r[20]||(r[20]=[e.createTextVNode("Duplicate template",-1)])]),_:1})):e.createCommentVNode("",!0),l.canDelete?(e.openBlock(),e.createBlock(J,{key:1,class:"text-destructive",onSelect:r[5]||(r[5]=f=>u("delete-template"))},{default:e.withCtx(()=>[...r[21]||(r[21]=[e.createTextVNode("Delete template",-1)])]),_:1})):e.createCommentVNode("",!0)]),_:1})]),_:1}),l.canEdit?(e.openBlock(),e.createBlock(B,{key:2,size:"sm",class:"h-8",disabled:!l.hasUnsavedChanges||l.saving,onClick:r[6]||(r[6]=f=>u("save"))},{default:e.withCtx(()=>[l.saving?(e.openBlock(),e.createBlock(e.unref(i.Loader2),{key:0,class:"size-3.5 animate-spin"})):(e.openBlock(),e.createBlock(e.unref(i.Check),{key:1,class:"size-3.5"})),e.createTextVNode(e.toDisplayString(l.saving?"Saving…":"Save changes"),1)]),_:1},8,["disabled"])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",yt,[e.createElementVNode("div",kt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList([{value:"edit",label:"Build",icon:e.unref(i.Pencil)},{value:"preview",label:"Preview",icon:e.unref(i.Eye)},{value:"source",label:"Source",icon:e.unref(i.Code2)}],f=>e.withDirectives((e.openBlock(),e.createBlock(B,{key:f.value,variant:v.value===f.value?"secondary":"ghost",size:"sm",class:"h-7 px-2.5 text-xs","aria-pressed":v.value===f.value,onClick:A=>v.value=f.value},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.icon),{class:"size-3.5"})),e.createTextVNode(e.toDisplayString(f.label),1)]),_:2},1032,["variant","aria-pressed","onClick"])),[[e.vShow,f.value!=="edit"||l.canEdit]])),128))]),v.value!=="source"?(e.openBlock(),e.createElementBlock("div",Vt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList([{value:"desktop",label:"Desktop",icon:e.unref(i.Monitor)},{value:"tablet",label:"Tablet",icon:e.unref(i.Tablet)},{value:"mobile",label:"Mobile",icon:e.unref(i.Smartphone)}],f=>(e.openBlock(),e.createBlock(B,{key:f.value,variant:C.value===f.value?"secondary":"ghost",size:"icon",class:"size-7","aria-label":f.label,title:f.label,"aria-pressed":C.value===f.value,onClick:A=>C.value=f.value},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.icon),{class:"size-3.5"}))]),_:2},1032,["variant","aria-label","title","aria-pressed","onClick"]))),128)),e.createElementVNode("span",Nt,e.toDisplayString(V.value)+"px",1)])):(e.openBlock(),e.createElementBlock("div",Ct,[e.withDirectives(e.createElementVNode("select",{"onUpdate:modelValue":r[7]||(r[7]=f=>L.value=f),"aria-label":"Source format",class:"h-7 rounded border bg-background px-2 text-xs"},[...r[22]||(r[22]=[e.createElementVNode("option",{value:"mjml"},"MJML",-1),e.createElementVNode("option",{value:"html"},"HTML",-1)])],512),[[e.vModelSelect,L.value]]),e.createVNode(B,{variant:"ghost",size:"sm",class:"h-7 text-xs",disabled:!w.value||m.value,onClick:K},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Copy),{class:"size-3.5"}),r[23]||(r[23]=e.createTextVNode(" Copy",-1))]),_:1},8,["disabled"])]))]),v.value==="edit"?(e.openBlock(),e.createElementBlock("div",ht,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(ne,f=>e.createVNode(B,{key:f.type,variant:"ghost",size:"sm",class:"h-8 gap-1.5 px-2 text-xs",title:`Add ${f.label.toLowerCase()}${l.selectedBlockId?" after selection":""}`,onClick:A=>u("add-block",f.type)},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.icon),{class:"size-3.5"})),e.createTextVNode(e.toDisplayString(f.label),1)]),_:2},1032,["title","onClick"])),64))])):v.value==="preview"?(e.openBlock(),e.createElementBlock("div",Bt,[e.createElementVNode("div",Et,[e.createElementVNode("p",wt,[r[24]||(r[24]=e.createElementVNode("span",{class:"text-muted-foreground"},"Subject: ",-1)),e.createTextVNode(e.toDisplayString(H.value),1)]),e.createVNode(B,{variant:"ghost",size:"sm",class:"h-7 shrink-0 text-xs",onClick:r[8]||(r[8]=f=>x.value=!x.value)},{default:e.withCtx(()=>[e.createTextVNode("Sample data"+e.toDisplayString(h.value.length?` (${h.value.length} missing)`:""),1)]),_:1})]),x.value?(e.openBlock(),e.createElementBlock("div",St,[e.createElementVNode("label",Tt,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[9]||(r[9]=f=>b.value=f),type:"checkbox"},null,512),[[e.vModelCheckbox,b.value]]),r[25]||(r[25]=e.createTextVNode(" Preview with sample values",-1))]),r[26]||(r[26]=e.createElementVNode("p",{class:"text-xs text-muted-foreground"},"Preview only. Saved HTML and downloads preserve your template variables.",-1)),e.createElementVNode("div",Dt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,f=>(e.openBlock(),e.createElementBlock("label",{key:f,class:"text-xs"},[e.createElementVNode("span",$t,e.toDisplayString(f),1),e.createVNode(me,{modelValue:t[f],"onUpdate:modelValue":A=>t[f]=A,disabled:!b.value,placeholder:`Sample ${f.replaceAll("_"," ")}`,class:"h-8 text-xs"},null,8,["modelValue","onUpdate:modelValue","disabled","placeholder"])]))),128))])])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),y.value&&v.value!=="edit"?(e.openBlock(),e.createElementBlock("div",Ut,[e.createElementVNode("span",null,e.toDisplayString(y.value),1),e.createVNode(B,{variant:"outline",size:"sm",onClick:D},{default:e.withCtx(()=>[...r[27]||(r[27]=[e.createTextVNode("Retry",-1)])]),_:1})])):e.createCommentVNode("",!0),v.value!=="edit"&&c.value?.errors?.length?(e.openBlock(),e.createElementBlock("div",zt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value.errors,(f,A)=>(e.openBlock(),e.createElementBlock("p",{key:A},e.toDisplayString(f.line?`Line ${f.line}: `:"")+e.toDisplayString(f.message),1))),128))])):e.createCommentVNode("",!0),e.createElementVNode("div",Mt,[m.value&&v.value!=="edit"?(e.openBlock(),e.createElementBlock("div",Lt,[e.createVNode(e.unref(i.Loader2),{class:"size-3 animate-spin"}),r[28]||(r[28]=e.createTextVNode(" Compiling email…",-1))])):e.createCommentVNode("",!0),v.value==="edit"?(e.openBlock(),e.createElementBlock("div",{key:1,class:"min-h-full p-4 sm:p-6",style:e.normalizeStyle({backgroundColor:l.templateStyles.bodyBg}),onDragenter:W,onDragover:W,onDrop:oe,onDragleave:G},[e.createElementVNode("div",{class:"mx-auto w-full overflow-visible rounded-lg shadow-sm",style:e.normalizeStyle({maxWidth:Math.min(V.value,l.templateStyles.contentWidth)+"px",backgroundColor:l.templateStyles.contentBg,fontFamily:l.templateStyles.fontFamily,borderRadius:l.templateStyles.borderRadius+"px"})},[e.createElementVNode("div",{ref_key:"blockList",ref:I,style:e.normalizeStyle({padding:Math.min(l.templateStyles.contentPadding,C.value==="mobile"?20:64)+"px"})},[l.templateStyles.logoUrl?(e.openBlock(),e.createElementBlock("img",{key:0,src:l.templateStyles.logoUrl,alt:"Agency logo",class:"mx-auto mb-6 max-h-12 max-w-full"},null,8,It)):e.createCommentVNode("",!0),l.template.blocks.length?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",At,[e.createVNode(e.unref(i.Plus),{class:"mx-auto mb-3 size-5 text-muted-foreground"}),r[30]||(r[30]=e.createElementVNode("p",{class:"text-sm text-muted-foreground"},"Add your first block using the toolbar.",-1)),e.createVNode(B,{variant:"outline",size:"sm",class:"mt-3",onClick:r[10]||(r[10]=f=>u("add-block","text"))},{default:e.withCtx(()=>[...r[29]||(r[29]=[e.createTextVNode("Add text",-1)])]),_:1})])),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.template.blocks,(f,A)=>(e.openBlock(),e.createElementBlock("div",{key:f.id,"data-email-block-id":f.id,class:e.normalizeClass(["relative",{"opacity-40":R.value===f.id}])},[R.value&&M.value&&n.value===f.id?(e.openBlock(),e.createElementBlock("div",jt)):e.createCommentVNode("",!0),e.createVNode(mt,{block:f,index:A,"total-blocks":l.template.blocks.length,"selected-block-id":l.selectedBlockId,"template-styles":l.templateStyles,onSelect:r[11]||(r[11]=j=>u("select-block",j)),onMove:r[12]||(r[12]=(j,X)=>u("move-block",j,X)),onDuplicate:r[13]||(r[13]=j=>u("duplicate-block",j)),onDelete:r[14]||(r[14]=j=>u("delete-block",j)),onDragStart:r[15]||(r[15]=j=>R.value=j),onDragEnd:le},null,8,["block","index","total-blocks","selected-block-id","template-styles"])],10,Rt))),128)),R.value?(e.openBlock(),e.createElementBlock("div",Ft,[M.value&&n.value===null?(e.openBlock(),e.createElementBlock("div",Pt)):e.createCommentVNode("",!0),r[31]||(r[31]=e.createTextVNode("Drop here to move to end",-1))])):e.createCommentVNode("",!0)],4),l.templateStyles.footerText||l.templateStyles.showUnsubscribe||l.templateStyles.showSocialLinks?(e.openBlock(),e.createElementBlock("div",{key:0,class:"rounded-b-lg px-6 py-6 text-center text-xs",style:e.normalizeStyle({backgroundColor:l.templateStyles.footerBg,color:l.templateStyles.footerTextColor})},[e.createElementVNode("p",null,e.toDisplayString(l.templateStyles.footerText),1),l.templateStyles.showUnsubscribe?(e.openBlock(),e.createElementBlock("p",{key:0,class:"mt-3 underline",style:e.normalizeStyle({color:l.templateStyles.linkColor})},"Unsubscribe",4)):e.createCommentVNode("",!0),l.templateStyles.showSocialLinks?(e.openBlock(),e.createElementBlock("p",Ht,"Social links appear when their URL variables are supplied.")):e.createCommentVNode("",!0)],4)):e.createCommentVNode("",!0)],4)],36)):v.value==="preview"&&c.value?(e.openBlock(),e.createElementBlock("div",Ot,[e.createElementVNode("iframe",{srcdoc:c.value.html,title:"Compiled email preview",sandbox:"",referrerpolicy:"no-referrer",class:"mx-auto block h-full min-h-[480px] max-w-none border bg-white shadow-sm",style:e.normalizeStyle({width:V.value+"px"})},null,12,qt)])):v.value==="source"?(e.openBlock(),e.createElementBlock("div",Wt,[r[32]||(r[32]=e.createElementVNode("p",{class:"mb-3 text-xs text-muted-foreground"},"Generated from your blocks. Downloads preserve template variables.",-1)),e.createElementVNode("textarea",{value:w.value,readonly:"","aria-label":"Generated email source",spellcheck:"false",class:"h-[calc(100%-2rem)] min-h-[350px] w-full resize-none rounded-md border bg-card p-4 font-mono text-xs leading-5 outline-none focus:ring-2 focus:ring-ring"},null,8,Jt)])):e.createCommentVNode("",!0)]),e.createElementVNode("footer",Yt,[e.createElementVNode("span",null,e.toDisplayString(l.template.blocks.length)+" blocks · "+e.toDisplayString(v.value==="edit"?"Select a block to edit · Drag to reorder":`MJML preview${F.value?` · ${F.value} KB HTML`:""}`),1),U.value.length?(e.openBlock(),e.createElementBlock("details",Kt,[e.createElementVNode("summary",Gt,[e.createVNode(e.unref(i.AlertCircle),{class:"size-3"}),e.createTextVNode(e.toDisplayString(U.value.length)+" "+e.toDisplayString(U.value.length===1?"check":"checks")+" to review",1)]),e.createElementVNode("ul",Qt,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(U.value,f=>(e.openBlock(),e.createElementBlock("li",{key:f},e.toDisplayString(f),1))),128))])])):v.value!=="edit"&&c.value&&!m.value&&!c.value.errors?.length?(e.openBlock(),e.createElementBlock("span",Zt,[e.createVNode(e.unref(i.Check),{class:"size-3"}),r[33]||(r[33]=e.createTextVNode("Compiled successfully",-1))])):e.createCommentVNode("",!0)])],64)):(e.openBlock(),e.createElementBlock("div",Xt,[e.createVNode(e.unref(i.Mail),{class:"mb-4 size-10 text-muted-foreground/40"}),r[35]||(r[35]=e.createElementVNode("h1",{class:"text-lg font-semibold"},"Build your next email",-1)),r[36]||(r[36]=e.createElementVNode("p",{class:"mt-2 max-w-xs text-sm text-muted-foreground"},"Choose a template or create one with responsive blocks and a live email preview.",-1)),l.canCreate?(e.openBlock(),e.createBlock(B,{key:0,class:"mt-5",onClick:r[16]||(r[16]=f=>u("create"))},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Plus),{class:"size-4"}),r[34]||(r[34]=e.createTextVNode("Create template",-1))]),_:1})):e.createCommentVNode("",!0)]))])}}}),el={class:"overflow-hidden rounded-md border bg-background focus-within:ring-2 focus-within:ring-ring/30"},tl={class:"flex flex-wrap items-center gap-0.5 border-b bg-muted/30 p-1",role:"toolbar","aria-label":"Text formatting"},ll=["title","aria-label","aria-pressed","onClick"],ol=["aria-expanded"],nl=["aria-pressed","title"],al={key:0,class:"space-y-2 border-b p-2"},rl={class:"block text-xs font-medium"},sl={key:0,role:"alert",class:"text-xs text-destructive"},dl={class:"flex justify-end gap-1"},il=["value","aria-label"],cl=e.defineComponent({__name:"RichTextEditor",props:{modelValue:{},label:{}},emits:["update:modelValue"],setup(l,{emit:E}){const a=l,u=E,d=e.ref(!1),k=e.ref(!1),v=e.ref(""),C=e.ref(""),V={default:null,parseHTML:t=>Object.entries(Te(t)).map(([p,h])=>`${p.replace(/[A-Z]/g,U=>`-${U.toLowerCase()}`)}: ${h}`).join("; ")||null,renderHTML:t=>t.emailStyle?{style:t.emailStyle}:{}},c=de.Extension.create({name:"emailTextStyles",addGlobalAttributes(){return[{types:["paragraph","heading","blockquote","listItem"],attributes:{emailStyle:V}}]}}),m=de.Mark.create({name:"emailInlineStyle",addAttributes:()=>({emailStyle:V}),parseHTML:()=>[{tag:"span[style]"}],renderHTML:({HTMLAttributes:t})=>["span",t,0]}),y=de.useEditor({content:a.modelValue||"",extensions:[de.index_default$1.configure({heading:{levels:[1,2,3]},code:!1,codeBlock:!1,horizontalRule:!1,link:{openOnClick:!1,defaultProtocol:"https",isAllowedUri:Be}}),c,m],editorProps:{attributes:{class:"email-text-editor min-h-36 px-3 py-2 text-sm focus:outline-none","aria-label":a.label||"Email text content",role:"textbox","aria-multiline":"true"}},onUpdate:({editor:t})=>u("update:modelValue",t.getHTML())});e.watch(()=>a.modelValue,t=>{y.value&&y.value.getHTML()!==t&&y.value.commands.setContent(t||"",{emitUpdate:!1})});const T=e.computed(()=>[{label:"Bold",icon:i.Bold,active:y.value?.isActive("bold"),action:()=>y.value?.chain().focus().toggleBold().run()},{label:"Italic",icon:i.Italic,active:y.value?.isActive("italic"),action:()=>y.value?.chain().focus().toggleItalic().run()},{label:"Underline",icon:i.Underline,active:y.value?.isActive("underline"),action:()=>y.value?.chain().focus().toggleUnderline().run()},{label:"Strikethrough",icon:i.Strikethrough,active:y.value?.isActive("strike"),action:()=>y.value?.chain().focus().toggleStrike().run()},{label:"Bullet list",icon:i.List,active:y.value?.isActive("bulletList"),action:()=>y.value?.chain().focus().toggleBulletList().run()},{label:"Numbered list",icon:i.ListOrdered,active:y.value?.isActive("orderedList"),action:()=>y.value?.chain().focus().toggleOrderedList().run()}]);function x(){v.value=y.value?.getAttributes("link").href||"",C.value="",k.value=!k.value}function b(){const t=v.value.trim();if(t&&!Be(t)){C.value="Use https://, mailto:, tel:, or a template variable.";return}t?y.value?.chain().focus().extendMarkRange("link").setLink({href:t}).run():y.value?.chain().focus().extendMarkRange("link").unsetLink().run(),k.value=!1}return(t,p)=>{const h=e.resolveComponent("Input"),U=e.resolveComponent("Button");return e.openBlock(),e.createElementBlock("div",el,[e.createElementVNode("div",tl,[d.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(T.value,w=>(e.openBlock(),e.createElementBlock("button",{key:w.label,type:"button",title:w.label,"aria-label":w.label,"aria-pressed":!!w.active,class:e.normalizeClass(["rounded p-1.5 hover:bg-accent focus-visible:ring-2 focus-visible:ring-ring",w.active?"bg-accent text-foreground":"text-muted-foreground"]),onClick:w.action},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(w.icon),{class:"size-3.5"}))],10,ll))),128)),e.createElementVNode("button",{type:"button",title:"Add or edit link","aria-label":"Add or edit link","aria-expanded":k.value,class:"rounded p-1.5 hover:bg-accent",onClick:x},[e.createVNode(e.unref(i.Link),{class:"size-3.5"})],8,ol),e.unref(y)?.isActive("link")?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",title:"Remove link","aria-label":"Remove link",class:"rounded p-1.5 hover:bg-accent",onClick:p[0]||(p[0]=w=>e.unref(y)?.chain().focus().extendMarkRange("link").unsetLink().run())},[e.createVNode(e.unref(i.Unlink),{class:"size-3.5"})])):e.createCommentVNode("",!0),e.createElementVNode("button",{type:"button",title:"Clear formatting","aria-label":"Clear formatting",class:"rounded p-1.5 hover:bg-accent",onClick:p[1]||(p[1]=w=>e.unref(y)?.chain().focus().unsetAllMarks().clearNodes().run())},[e.createVNode(e.unref(i.RemoveFormatting),{class:"size-3.5"})])],64)),e.createElementVNode("button",{type:"button","aria-pressed":d.value,class:"ml-auto inline-flex items-center gap-1 rounded px-1.5 py-1 text-[11px] hover:bg-accent",title:d.value?"Switch to visual editor":"Edit HTML source",onClick:p[2]||(p[2]=w=>{d.value=!d.value,k.value=!1})},[e.createVNode(e.unref(i.Code2),{class:"size-3.5"}),e.createTextVNode(e.toDisplayString(d.value?"Visual":"HTML"),1)],8,nl)]),k.value&&!d.value?(e.openBlock(),e.createElementBlock("div",al,[e.createElementVNode("label",rl,[p[7]||(p[7]=e.createTextVNode("Link URL ",-1)),e.createVNode(h,{modelValue:v.value,"onUpdate:modelValue":p[3]||(p[3]=w=>v.value=w),class:"mt-1 h-8 text-xs",placeholder:"https://example.com",onKeydown:[e.withKeys(e.withModifiers(b,["prevent"]),["enter"]),p[4]||(p[4]=e.withKeys(e.withModifiers(w=>k.value=!1,["prevent"]),["esc"]))]},null,8,["modelValue","onKeydown"])]),C.value?(e.openBlock(),e.createElementBlock("p",sl,e.toDisplayString(C.value),1)):e.createCommentVNode("",!0),e.createElementVNode("div",dl,[e.createVNode(U,{type:"button",size:"sm",variant:"ghost",class:"h-7 text-xs",onClick:p[5]||(p[5]=w=>k.value=!1)},{default:e.withCtx(()=>[...p[8]||(p[8]=[e.createTextVNode("Cancel",-1)])]),_:1}),e.createVNode(U,{type:"button",size:"sm",class:"h-7 text-xs",onClick:b},{default:e.withCtx(()=>[...p[9]||(p[9]=[e.createTextVNode("Apply link",-1)])]),_:1})])])):e.createCommentVNode("",!0),d.value?(e.openBlock(),e.createElementBlock("textarea",{key:1,value:l.modelValue,"aria-label":`${l.label||"Email text"} HTML source`,rows:"8",class:"block min-h-36 w-full resize-y bg-transparent p-3 font-mono text-xs outline-none",spellcheck:"false",onInput:p[6]||(p[6]=w=>u("update:modelValue",w.target.value))},null,40,il)):(e.openBlock(),e.createBlock(e.unref(de.EditorContent),{key:2,editor:e.unref(y)},null,8,["editor"]))])}}}),ul=Ee._export_sfc(cl,[["__scopeId","data-v-accbd7a8"]]),ml={class:"p-4 space-y-6"},pl={class:"flex items-center justify-between"},vl={class:"flex items-center gap-2"},fl={class:"text-sm font-semibold"},xl={class:"block text-xs font-medium text-muted-foreground"},bl={key:1,class:"space-y-1.5"},gl={class:"block text-xs font-medium text-muted-foreground"},yl={class:"block text-xs font-medium text-muted-foreground"},kl={class:"block text-xs font-medium text-muted-foreground"},Vl={class:"block text-xs font-medium text-muted-foreground"},Nl={class:"block text-xs font-medium text-muted-foreground"},Cl={class:"block text-xs font-medium text-muted-foreground"},hl={class:"flex items-center gap-2"},Bl=["value"],El={class:"block text-xs font-medium text-muted-foreground"},wl={key:5,class:"block text-xs font-medium text-muted-foreground"},Sl={class:"flex items-center justify-between"},Tl={class:"text-xs font-medium"},Dl=["aria-label","title","disabled","onClick"],$l={class:"block text-xs text-muted-foreground"},Ul={class:"block text-xs text-muted-foreground"},zl={class:"mb-1.5 flex items-center justify-between"},Ml={class:"flex items-center gap-2"},Ll=["value"],Il={class:"block text-xs font-medium text-muted-foreground"},Al={key:8},Rl={class:"border-t pt-4"},jl={class:"grid grid-cols-2 gap-3"},Fl={class:"text-xs text-muted-foreground"},Pl={class:"text-xs text-muted-foreground"},Hl={class:"block text-xs font-medium text-muted-foreground"},Ol={class:"space-y-3"},ql={class:"flex items-center gap-2"},Wl={class:"flex items-center gap-2"},Jl={class:"flex items-center gap-2"},Yl={class:"flex items-center gap-2"},Kl={class:"flex items-center gap-2"},Gl={class:"flex items-center gap-2"},Ql={class:"flex items-center gap-2"},Zl={class:"flex items-center gap-2"},Xl={class:"flex items-center gap-2"},_l={class:"space-y-3"},eo={class:"space-y-3"},to={class:"flex items-center gap-3"},lo={class:"text-xs text-muted-foreground font-mono w-12 text-right"},oo={class:"flex items-center gap-3"},no={class:"text-xs text-muted-foreground font-mono w-12 text-right"},ao={class:"flex items-center gap-3"},ro={class:"text-xs text-muted-foreground font-mono w-12 text-right"},so={class:"space-y-3"},io={class:"flex items-center justify-between"},co=e.defineComponent({__name:"DesignPanel",props:{selectedBlock:{},templateStyles:{}},emits:["deselect-block","update:hasUnsavedChanges"],setup(l,{emit:E}){const a=l,u=E,d=()=>u("update:hasUnsavedChanges",!0),k=[{value:"left",label:"Align left",icon:i.AlignLeft},{value:"center",label:"Align center",icon:i.AlignCenter},{value:"right",label:"Align right",icon:i.AlignRight}],v=e.computed(()=>a.selectedBlock?.content.columns||[]),C=e.computed(()=>a.selectedBlock?.type==="header"?{h1:28,h2:22,h3:18}[a.selectedBlock.content.level]||22:15),L=e.computed(()=>["button","divider"].includes(a.selectedBlock?.type||"")?8:0);function V(b,t){a.selectedBlock&&(a.selectedBlock.content[b]=t,d())}function c(b,t,p,h,U=!1){if(t===""){a.selectedBlock&&delete a.selectedBlock.content[b],d();return}const w=Number(t);Number.isFinite(w)&&V(b,U?Math.min(h,Math.max(p,w)):w)}function m(){v.value.length>=4||V("columns",[...v.value,{label:"Label",value:"Value"}])}function y(b){v.value.length<=1||V("columns",v.value.filter((t,p)=>p!==b))}const T=b=>({header:"Heading",text:"Text Block",button:"Button",image:"Image",divider:"Divider",spacer:"Spacer",columns:"Columns"})[b]??b,x=b=>({header:i.Type,text:i.AlignLeft,button:i.MousePointer,image:i.Image,divider:i.Minus,spacer:i.Square,columns:i.Columns})[b]??i.Square;return(b,t)=>{const p=e.resolveComponent("Input"),h=e.resolveComponent("SegmentedControlButton"),U=e.resolveComponent("SegmentedControl"),w=e.resolveComponent("Button"),F=e.resolveComponent("Separator"),H=e.resolveComponent("SelectValue"),q=e.resolveComponent("SelectTrigger"),z=e.resolveComponent("SelectItem"),D=e.resolveComponent("SelectContent"),Z=e.resolveComponent("Select"),K=e.resolveComponent("Textarea"),R=e.resolveComponent("Switch");return e.openBlock(),e.createElementBlock("div",ml,[l.selectedBlock?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[(e.openBlock(),e.createElementBlock("section",{key:l.selectedBlock.id,"aria-label":"Selected block design",class:"space-y-4"},[e.createElementVNode("div",pl,[e.createElementVNode("div",vl,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(x(l.selectedBlock.type)),{class:"size-4 text-muted-foreground"})),e.createElementVNode("h4",fl,e.toDisplayString(T(l.selectedBlock.type)),1)]),e.createElementVNode("button",{type:"button","aria-label":"Deselect block",title:"Deselect block",class:"rounded p-1 hover:bg-accent",onClick:t[0]||(t[0]=n=>u("deselect-block"))},[e.createVNode(e.unref(i.X),{class:"size-3.5 text-muted-foreground"})])]),l.selectedBlock.type==="header"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("label",xl,[t[54]||(t[54]=e.createTextVNode("Heading text ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.text,"onUpdate:modelValue":[t[1]||(t[1]=n=>l.selectedBlock.content.text=n),d],class:"mt-1.5 h-9 text-sm"},null,8,["modelValue"])]),e.createElementVNode("div",null,[t[58]||(t[58]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Heading level",-1)),e.createVNode(U,{"model-value":l.selectedBlock.content.level||"h2",class:"w-full","aria-label":"Heading level","onUpdate:modelValue":t[2]||(t[2]=n=>V("level",n))},{default:e.withCtx(()=>[e.createVNode(h,{value:"h1",class:"text-xs"},{default:e.withCtx(()=>[...t[55]||(t[55]=[e.createTextVNode("H1",-1)])]),_:1}),e.createVNode(h,{value:"h2",class:"text-xs"},{default:e.withCtx(()=>[...t[56]||(t[56]=[e.createTextVNode("H2",-1)])]),_:1}),e.createVNode(h,{value:"h3",class:"text-xs"},{default:e.withCtx(()=>[...t[57]||(t[57]=[e.createTextVNode("H3",-1)])]),_:1})]),_:1},8,["model-value"])])],64)):l.selectedBlock.type==="text"?(e.openBlock(),e.createElementBlock("div",bl,[t[59]||(t[59]=e.createElementVNode("p",{class:"text-xs font-medium text-muted-foreground"},"Content",-1)),(e.openBlock(),e.createBlock(ul,{key:l.selectedBlock.id,"model-value":l.selectedBlock.content.html||"","onUpdate:modelValue":t[3]||(t[3]=n=>V("html",n))},null,8,["model-value"])),t[60]||(t[60]=e.createElementVNode("p",{class:"text-[11px] leading-relaxed text-muted-foreground"},[e.createTextVNode("Variables work in text and links, e.g. "),e.createElementVNode("code",null,"{{user_name}}"),e.createTextVNode(".")],-1))])):l.selectedBlock.type==="button"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createElementVNode("label",gl,[t[61]||(t[61]=e.createTextVNode("Button text ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.text,"onUpdate:modelValue":[t[4]||(t[4]=n=>l.selectedBlock.content.text=n),d],class:"mt-1.5 h-9 text-sm"},null,8,["modelValue"])]),e.createElementVNode("label",yl,[t[62]||(t[62]=e.createTextVNode("Link URL ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.url,"onUpdate:modelValue":[t[5]||(t[5]=n=>l.selectedBlock.content.url=n),d],class:"mt-1.5 h-9 text-sm",placeholder:"https://… or {{invite_url}}"},null,8,["modelValue"])]),e.createElementVNode("div",null,[t[65]||(t[65]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Style",-1)),e.createVNode(U,{"model-value":l.selectedBlock.content.variant||"primary",class:"w-full","aria-label":"Button style","onUpdate:modelValue":t[6]||(t[6]=n=>V("variant",n))},{default:e.withCtx(()=>[e.createVNode(h,{value:"primary",class:"text-xs"},{default:e.withCtx(()=>[...t[63]||(t[63]=[e.createTextVNode("Filled",-1)])]),_:1}),e.createVNode(h,{value:"secondary",class:"text-xs"},{default:e.withCtx(()=>[...t[64]||(t[64]=[e.createTextVNode("Outline",-1)])]),_:1})]),_:1},8,["model-value"])])],64)):l.selectedBlock.type==="image"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[e.createElementVNode("label",kl,[t[66]||(t[66]=e.createTextVNode("Image URL ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.src,"onUpdate:modelValue":[t[7]||(t[7]=n=>l.selectedBlock.content.src=n),d],class:"mt-1.5 h-9 text-sm",placeholder:"https://…"},null,8,["modelValue"])]),e.createElementVNode("label",Vl,[t[67]||(t[67]=e.createTextVNode("Alt text ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.alt,"onUpdate:modelValue":[t[8]||(t[8]=n=>l.selectedBlock.content.alt=n),d],class:"mt-1.5 h-9 text-sm",placeholder:"Describe the image"},null,8,["modelValue"])]),e.createElementVNode("label",Nl,[t[68]||(t[68]=e.createTextVNode("Link URL (optional) ",-1)),e.createVNode(p,{modelValue:l.selectedBlock.content.href,"onUpdate:modelValue":[t[9]||(t[9]=n=>l.selectedBlock.content.href=n),d],class:"mt-1.5 h-9 text-sm",placeholder:"https://…"},null,8,["modelValue"])]),e.createElementVNode("label",Cl,[t[69]||(t[69]=e.createTextVNode("Width (px) ",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.width??600,type:"number",min:"24",max:"800",class:"mt-1.5 h-9 text-sm","onUpdate:modelValue":t[10]||(t[10]=n=>c("width",n,24,800)),onChange:t[11]||(t[11]=n=>c("width",n.target.value,24,800,!0))},null,8,["model-value"])]),t[70]||(t[70]=e.createElementVNode("p",{class:"text-[11px] text-muted-foreground"},"Images scale down to fit the email on smaller screens.",-1))],64)):l.selectedBlock.type==="divider"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:4},[e.createElementVNode("div",null,[t[71]||(t[71]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Line color",-1)),e.createElementVNode("div",hl,[e.createElementVNode("input",{type:"color",value:l.selectedBlock.content.color||"#e5e7eb","aria-label":"Divider color picker",class:"size-9 shrink-0 cursor-pointer rounded border",onInput:t[12]||(t[12]=n=>V("color",n.target.value))},null,40,Bl),e.createVNode(p,{"model-value":l.selectedBlock.content.color||"#e5e7eb","aria-label":"Divider color",class:"h-9 flex-1 font-mono text-sm","onUpdate:modelValue":t[13]||(t[13]=n=>V("color",n))},null,8,["model-value"])])]),e.createElementVNode("label",El,[t[72]||(t[72]=e.createTextVNode("Thickness (px) ",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.thickness??1,type:"number",min:"1",max:"8",class:"mt-1.5 h-9 text-sm","onUpdate:modelValue":t[14]||(t[14]=n=>c("thickness",n,1,8)),onChange:t[15]||(t[15]=n=>c("thickness",n.target.value,1,8,!0))},null,8,["model-value"])]),e.createElementVNode("div",null,[t[76]||(t[76]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Line style",-1)),e.createVNode(U,{"model-value":l.selectedBlock.content.style||"solid",class:"w-full","aria-label":"Divider line style","onUpdate:modelValue":t[16]||(t[16]=n=>V("style",n))},{default:e.withCtx(()=>[e.createVNode(h,{value:"solid",class:"px-2 text-xs"},{default:e.withCtx(()=>[...t[73]||(t[73]=[e.createTextVNode("Solid",-1)])]),_:1}),e.createVNode(h,{value:"dashed",class:"px-2 text-xs"},{default:e.withCtx(()=>[...t[74]||(t[74]=[e.createTextVNode("Dashed",-1)])]),_:1}),e.createVNode(h,{value:"dotted",class:"px-2 text-xs"},{default:e.withCtx(()=>[...t[75]||(t[75]=[e.createTextVNode("Dotted",-1)])]),_:1})]),_:1},8,["model-value"])])],64)):l.selectedBlock.type==="spacer"?(e.openBlock(),e.createElementBlock("label",wl,[t[77]||(t[77]=e.createTextVNode("Height (px) ",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.height??24,type:"number",min:"0",max:"200",class:"mt-1.5 h-9 text-sm","onUpdate:modelValue":t[17]||(t[17]=n=>c("height",n,0,200)),onChange:t[18]||(t[18]=n=>c("height",n.target.value,0,200,!0))},null,8,["model-value"])])):l.selectedBlock.type==="columns"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:6},[t[81]||(t[81]=e.createElementVNode("p",{class:"text-xs leading-relaxed text-muted-foreground"},"Present details side by side. Columns stack on mobile.",-1)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(n,M)=>(e.openBlock(),e.createElementBlock("div",{key:M,class:"space-y-2 rounded-md border p-3"},[e.createElementVNode("div",Sl,[e.createElementVNode("p",Tl,"Column "+e.toDisplayString(M+1),1),e.createElementVNode("button",{type:"button","aria-label":`Remove column ${M+1}`,title:`Remove column ${M+1}`,disabled:v.value.length<=1,class:"rounded p-1 text-muted-foreground hover:bg-accent hover:text-destructive disabled:opacity-30",onClick:I=>y(M)},[e.createVNode(e.unref(i.Trash2),{class:"size-3.5"})],8,Dl)]),e.createElementVNode("label",$l,[t[78]||(t[78]=e.createTextVNode("Label",-1)),e.createVNode(p,{modelValue:n.label,"onUpdate:modelValue":[I=>n.label=I,d],class:"mt-1 h-8 text-xs"},null,8,["modelValue","onUpdate:modelValue"])]),e.createElementVNode("label",Ul,[t[79]||(t[79]=e.createTextVNode("Value",-1)),e.createVNode(p,{modelValue:n.value,"onUpdate:modelValue":[I=>n.value=I,d],class:"mt-1 h-8 text-xs"},null,8,["modelValue","onUpdate:modelValue"])])]))),128)),e.createVNode(w,{type:"button",variant:"outline",size:"sm",class:"w-full gap-1.5",disabled:v.value.length>=4,onClick:m},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Plus),{class:"size-3.5"}),t[80]||(t[80]=e.createTextVNode("Add column",-1))]),_:1},8,["disabled"])],64)):e.createCommentVNode("",!0),["header","text"].includes(l.selectedBlock.type)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:7},[e.createElementVNode("div",null,[e.createElementVNode("div",zl,[t[82]||(t[82]=e.createElementVNode("p",{class:"text-xs font-medium text-muted-foreground"},"Text color",-1)),l.selectedBlock.content.color?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"text-[11px] text-muted-foreground hover:text-foreground",onClick:t[19]||(t[19]=n=>{delete l.selectedBlock.content.color,d()})},"Use template color")):e.createCommentVNode("",!0)]),e.createElementVNode("div",Ml,[e.createElementVNode("input",{type:"color",value:l.selectedBlock.content.color||l.templateStyles.textColor,"aria-label":"Block text color picker",class:"size-9 shrink-0 cursor-pointer rounded border",onInput:t[20]||(t[20]=n=>V("color",n.target.value))},null,40,Ll),e.createVNode(p,{"model-value":l.selectedBlock.content.color||l.templateStyles.textColor,"aria-label":"Block text color",class:"h-9 flex-1 font-mono text-sm","onUpdate:modelValue":t[21]||(t[21]=n=>V("color",n))},null,8,["model-value"])])]),e.createElementVNode("label",Il,[t[83]||(t[83]=e.createTextVNode("Font size (px) ",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.fontSize??C.value,type:"number",min:"8",max:"72",class:"mt-1.5 h-9 text-sm","onUpdate:modelValue":t[22]||(t[22]=n=>c("fontSize",n,8,72)),onChange:t[23]||(t[23]=n=>c("fontSize",n.target.value,8,72,!0))},null,8,["model-value"])])],64)):e.createCommentVNode("",!0),["header","text","button","image"].includes(l.selectedBlock.type)?(e.openBlock(),e.createElementBlock("div",Al,[t[84]||(t[84]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Alignment",-1)),e.createVNode(U,{"model-value":l.selectedBlock.content.align||(["button","image"].includes(l.selectedBlock.type)?"center":"left"),class:"w-full","aria-label":"Block alignment","onUpdate:modelValue":t[24]||(t[24]=n=>V("align",n))},{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(k,n=>e.createVNode(h,{key:n.value,value:n.value,"aria-label":n.label,title:n.label},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.icon),{class:"mx-auto size-3.5"}))]),_:2},1032,["value","aria-label","title"])),64))]),_:1},8,["model-value"])])):e.createCommentVNode("",!0),e.createElementVNode("div",Rl,[t[87]||(t[87]=e.createElementVNode("p",{class:"mb-2 text-xs font-medium text-muted-foreground"},"Spacing (px)",-1)),e.createElementVNode("div",jl,[e.createElementVNode("label",Fl,[t[85]||(t[85]=e.createTextVNode("Above",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.paddingTop??L.value,type:"number",min:"0",max:"80",class:"mt-1 h-8 text-xs","onUpdate:modelValue":t[25]||(t[25]=n=>c("paddingTop",n,0,80)),onChange:t[26]||(t[26]=n=>c("paddingTop",n.target.value,0,80,!0))},null,8,["model-value"])]),e.createElementVNode("label",Pl,[t[86]||(t[86]=e.createTextVNode("Below",-1)),e.createVNode(p,{"model-value":l.selectedBlock.content.paddingBottom??(l.selectedBlock.type==="spacer"?0:16),type:"number",min:"0",max:"80",class:"mt-1 h-8 text-xs","onUpdate:modelValue":t[27]||(t[27]=n=>c("paddingBottom",n,0,80)),onChange:t[28]||(t[28]=n=>c("paddingBottom",n.target.value,0,80,!0))},null,8,["model-value"])])])])])),e.createVNode(F)],64)):e.createCommentVNode("",!0),t[118]||(t[118]=e.createElementVNode("div",{class:"rounded-lg bg-muted/50 border border-border/50 p-3 mb-2"},[e.createElementVNode("h4",{class:"mb-1 text-xs font-semibold"},"Template design"),e.createElementVNode("p",{class:"text-[11px] text-muted-foreground leading-snug"},[e.createTextVNode("These design settings apply to "),e.createElementVNode("strong",null,"this template"),e.createTextVNode(".")])],-1)),e.createElementVNode("div",null,[t[89]||(t[89]=e.createElementVNode("h4",{class:"mb-3 text-sm font-semibold"},"Branding",-1)),e.createElementVNode("label",Hl,[t[88]||(t[88]=e.createTextVNode("Logo URL ",-1)),e.createVNode(p,{modelValue:l.templateStyles.logoUrl,"onUpdate:modelValue":[t[29]||(t[29]=n=>l.templateStyles.logoUrl=n),d],class:"mt-1.5 h-9 text-sm",placeholder:"https://example.com/logo.png"},null,8,["modelValue"])]),t[90]||(t[90]=e.createElementVNode("p",{class:"mt-1.5 text-[11px] text-muted-foreground"},"Appears above the email content. Leave empty to hide it.",-1))]),e.createElementVNode("div",null,[t[101]||(t[101]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Colors",-1)),e.createElementVNode("div",Ol,[e.createElementVNode("div",null,[t[91]||(t[91]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Body Background",-1)),e.createElementVNode("div",ql,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[30]||(t[30]=n=>l.templateStyles.bodyBg=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.bodyBg]]),e.createVNode(p,{modelValue:l.templateStyles.bodyBg,"onUpdate:modelValue":t[31]||(t[31]=n=>l.templateStyles.bodyBg=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[92]||(t[92]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Content Background",-1)),e.createElementVNode("div",Wl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[32]||(t[32]=n=>l.templateStyles.contentBg=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.contentBg]]),e.createVNode(p,{modelValue:l.templateStyles.contentBg,"onUpdate:modelValue":t[33]||(t[33]=n=>l.templateStyles.contentBg=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[93]||(t[93]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Footer Background",-1)),e.createElementVNode("div",Jl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[34]||(t[34]=n=>l.templateStyles.footerBg=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.footerBg]]),e.createVNode(p,{modelValue:l.templateStyles.footerBg,"onUpdate:modelValue":t[35]||(t[35]=n=>l.templateStyles.footerBg=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[94]||(t[94]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Footer Text Color",-1)),e.createElementVNode("div",Yl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[36]||(t[36]=n=>l.templateStyles.footerTextColor=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.footerTextColor]]),e.createVNode(p,{modelValue:l.templateStyles.footerTextColor,"onUpdate:modelValue":t[37]||(t[37]=n=>l.templateStyles.footerTextColor=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[95]||(t[95]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Primary / Button Color",-1)),e.createElementVNode("div",Kl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[38]||(t[38]=n=>l.templateStyles.primaryColor=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.primaryColor]]),e.createVNode(p,{modelValue:l.templateStyles.primaryColor,"onUpdate:modelValue":t[39]||(t[39]=n=>l.templateStyles.primaryColor=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[96]||(t[96]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Button Text Color",-1)),e.createElementVNode("div",Gl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[40]||(t[40]=n=>l.templateStyles.primaryForeground=n),"aria-label":"Button text color picker",class:"size-9 shrink-0 cursor-pointer rounded border",onInput:d},null,544),[[e.vModelText,l.templateStyles.primaryForeground]]),e.createVNode(p,{modelValue:l.templateStyles.primaryForeground,"onUpdate:modelValue":[t[41]||(t[41]=n=>l.templateStyles.primaryForeground=n),d],"aria-label":"Button text color",class:"h-9 flex-1 font-mono text-sm"},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[97]||(t[97]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Text Color",-1)),e.createElementVNode("div",Ql,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[42]||(t[42]=n=>l.templateStyles.textColor=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.textColor]]),e.createVNode(p,{modelValue:l.templateStyles.textColor,"onUpdate:modelValue":t[43]||(t[43]=n=>l.templateStyles.textColor=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])]),e.createElementVNode("div",null,[t[98]||(t[98]=e.createElementVNode("p",{class:"mb-1.5 text-xs font-medium text-muted-foreground"},"Secondary Text Color",-1)),e.createElementVNode("div",Zl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[44]||(t[44]=n=>l.templateStyles.secondaryTextColor=n),"aria-label":"Secondary text color picker",class:"size-9 shrink-0 cursor-pointer rounded border",onInput:d},null,544),[[e.vModelText,l.templateStyles.secondaryTextColor]]),e.createVNode(p,{modelValue:l.templateStyles.secondaryTextColor,"onUpdate:modelValue":[t[45]||(t[45]=n=>l.templateStyles.secondaryTextColor=n),d],"aria-label":"Secondary text color",class:"h-9 flex-1 font-mono text-sm"},null,8,["modelValue"])]),t[99]||(t[99]=e.createElementVNode("p",{class:"mt-1.5 text-[11px] text-muted-foreground"},"Used for column labels and supporting text.",-1))]),e.createElementVNode("div",null,[t[100]||(t[100]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Link Color",-1)),e.createElementVNode("div",Xl,[e.withDirectives(e.createElementVNode("input",{type:"color","onUpdate:modelValue":t[46]||(t[46]=n=>l.templateStyles.linkColor=n),class:"size-9 rounded border cursor-pointer",onInput:d},null,544),[[e.vModelText,l.templateStyles.linkColor]]),e.createVNode(p,{modelValue:l.templateStyles.linkColor,"onUpdate:modelValue":t[47]||(t[47]=n=>l.templateStyles.linkColor=n),class:"h-9 text-sm flex-1 font-mono",onInput:d},null,8,["modelValue"])])])])]),e.createVNode(F),e.createElementVNode("div",null,[t[110]||(t[110]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Typography",-1)),e.createElementVNode("div",_l,[e.createElementVNode("div",null,[t[109]||(t[109]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Font Family",-1)),e.createVNode(Z,{modelValue:l.templateStyles.fontFamily,"onUpdate:modelValue":[t[48]||(t[48]=n=>l.templateStyles.fontFamily=n),d]},{default:e.withCtx(()=>[e.createVNode(q,{class:"h-9 text-sm"},{default:e.withCtx(()=>[e.createVNode(H)]),_:1}),e.createVNode(D,null,{default:e.withCtx(()=>[e.createVNode(z,{value:"Arial, Helvetica, sans-serif"},{default:e.withCtx(()=>[...t[102]||(t[102]=[e.createTextVNode("Arial",-1)])]),_:1}),e.createVNode(z,{value:"'Helvetica Neue', Helvetica, Arial, sans-serif"},{default:e.withCtx(()=>[...t[103]||(t[103]=[e.createTextVNode("Helvetica",-1)])]),_:1}),e.createVNode(z,{value:"Georgia, 'Times New Roman', serif"},{default:e.withCtx(()=>[...t[104]||(t[104]=[e.createTextVNode("Georgia",-1)])]),_:1}),e.createVNode(z,{value:"Verdana, Geneva, sans-serif"},{default:e.withCtx(()=>[...t[105]||(t[105]=[e.createTextVNode("Verdana",-1)])]),_:1}),e.createVNode(z,{value:"Tahoma, Geneva, sans-serif"},{default:e.withCtx(()=>[...t[106]||(t[106]=[e.createTextVNode("Tahoma",-1)])]),_:1}),e.createVNode(z,{value:"'Trebuchet MS', Helvetica, sans-serif"},{default:e.withCtx(()=>[...t[107]||(t[107]=[e.createTextVNode("Trebuchet MS",-1)])]),_:1}),e.createVNode(z,{value:"'Courier New', Courier, monospace"},{default:e.withCtx(()=>[...t[108]||(t[108]=[e.createTextVNode("Courier New",-1)])]),_:1})]),_:1})]),_:1},8,["modelValue"])])])]),e.createVNode(F),e.createElementVNode("div",null,[t[114]||(t[114]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Layout",-1)),e.createElementVNode("div",eo,[e.createElementVNode("div",null,[t[111]||(t[111]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Content Width",-1)),e.createElementVNode("div",to,[e.withDirectives(e.createElementVNode("input",{type:"range","onUpdate:modelValue":t[49]||(t[49]=n=>l.templateStyles.contentWidth=n),min:"400",max:"800",step:"10",class:"flex-1 accent-primary",onInput:d},null,544),[[e.vModelText,l.templateStyles.contentWidth,void 0,{number:!0}]]),e.createElementVNode("span",lo,e.toDisplayString(l.templateStyles.contentWidth)+"px",1)])]),e.createElementVNode("div",null,[t[112]||(t[112]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Content Padding",-1)),e.createElementVNode("div",oo,[e.withDirectives(e.createElementVNode("input",{type:"range","onUpdate:modelValue":t[50]||(t[50]=n=>l.templateStyles.contentPadding=n),min:"16",max:"64",step:"4",class:"flex-1 accent-primary",onInput:d},null,544),[[e.vModelText,l.templateStyles.contentPadding,void 0,{number:!0}]]),e.createElementVNode("span",no,e.toDisplayString(l.templateStyles.contentPadding)+"px",1)])]),e.createElementVNode("div",null,[t[113]||(t[113]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Border Radius",-1)),e.createElementVNode("div",ao,[e.withDirectives(e.createElementVNode("input",{type:"range","onUpdate:modelValue":t[51]||(t[51]=n=>l.templateStyles.borderRadius=n),min:"0",max:"24",step:"2",class:"flex-1 accent-primary",onInput:d},null,544),[[e.vModelText,l.templateStyles.borderRadius,void 0,{number:!0}]]),e.createElementVNode("span",ro,e.toDisplayString(l.templateStyles.borderRadius)+"px",1)])])])]),e.createVNode(F),e.createElementVNode("div",null,[t[117]||(t[117]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Footer",-1)),e.createElementVNode("div",so,[e.createElementVNode("div",null,[t[115]||(t[115]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Footer Text",-1)),e.createVNode(K,{modelValue:l.templateStyles.footerText,"onUpdate:modelValue":t[52]||(t[52]=n=>l.templateStyles.footerText=n),rows:"2",class:"text-sm resize-none",onInput:d},null,8,["modelValue"])]),e.createElementVNode("div",io,[t[116]||(t[116]=e.createElementVNode("label",{class:"text-sm"},"Show Unsubscribe Link",-1)),e.createVNode(R,{modelValue:l.templateStyles.showUnsubscribe,"onUpdate:modelValue":[t[53]||(t[53]=n=>l.templateStyles.showUnsubscribe=n),d]},null,8,["modelValue"])])])])])}}}),uo={class:"p-4 space-y-6"},mo={class:"space-y-3"},po={class:"space-y-1.5"},vo=["onClick"],fo={class:"text-xs font-mono flex-1"},xo={class:"space-y-2"},bo={class:"text-[11px] text-muted-foreground/60"},go=e.defineComponent({__name:"SettingsPanel",props:{template:{},templateStyles:{}},emits:["update:hasUnsavedChanges","reset-styles","reset-template"],setup(l,{emit:E}){const a=l,u=E,d=()=>u("update:hasUnsavedChanges",!0),k=e.computed(()=>!!he(a.template.name,a.template.system_key)),v=()=>{u("reset-styles",Me());const c=he(a.template.name,a.template.system_key);c&&u("reset-template",c.blocks),u("update:hasUnsavedChanges",!0)},C=e.ref(null),L=async c=>{try{await navigator.clipboard.writeText(c)}catch{return}C.value=c,setTimeout(()=>{C.value===c&&(C.value=null)},1500)},V=["{{agency_name}}","{{user_name}}","{{user_email}}","{{dashboard_url}}","{{project_name}}","{{year}}","{{reset_url}}","{{invite_url}}","{{support_email}}","{{inviter_name}}","{{expires_at}}"];return(c,m)=>{const y=e.resolveComponent("Input"),T=e.resolveComponent("Textarea"),x=e.resolveComponent("Separator"),b=e.resolveComponent("Button");return e.openBlock(),e.createElementBlock("div",uo,[e.createElementVNode("div",null,[m[14]||(m[14]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Template Info",-1)),e.createElementVNode("div",mo,[e.createElementVNode("div",null,[m[6]||(m[6]=e.createElementVNode("label",{for:"email-template-name",class:"mb-1.5 block text-xs font-medium text-muted-foreground"},"Name",-1)),e.createVNode(y,{id:"email-template-name",modelValue:l.template.name,"onUpdate:modelValue":[m[0]||(m[0]=t=>l.template.name=t),d],class:"h-9 text-sm"},null,8,["modelValue"])]),e.createElementVNode("div",null,[m[7]||(m[7]=e.createElementVNode("label",{for:"email-template-description",class:"mb-1.5 block text-xs font-medium text-muted-foreground"},"Description",-1)),e.createVNode(T,{id:"email-template-description",modelValue:l.template.description,"onUpdate:modelValue":[m[1]||(m[1]=t=>l.template.description=t),d],rows:"2",class:"text-sm"},null,8,["modelValue"])]),e.createElementVNode("div",null,[m[9]||(m[9]=e.createElementVNode("label",{for:"email-template-category",class:"mb-1.5 block text-xs font-medium text-muted-foreground"},"Category",-1)),e.withDirectives(e.createElementVNode("select",{id:"email-template-category","onUpdate:modelValue":m[2]||(m[2]=t=>l.template.category=t),class:"h-9 w-full rounded-md border bg-background px-2 text-sm",onChange:d},[...m[8]||(m[8]=[e.createStaticVNode('<option value="authentication">Authentication</option><option value="billing">Billing</option><option value="notifications">Notifications</option><option value="onboarding">Onboarding</option><option value="system">System</option>',5)])],544),[[e.vModelSelect,l.template.category]])]),e.createElementVNode("div",null,[m[11]||(m[11]=e.createElementVNode("label",{for:"email-template-status",class:"mb-1.5 block text-xs font-medium text-muted-foreground"},"Status",-1)),e.withDirectives(e.createElementVNode("select",{id:"email-template-status","onUpdate:modelValue":m[3]||(m[3]=t=>l.template.status=t),class:"h-9 w-full rounded-md border bg-background px-2 text-sm",onChange:d},[...m[10]||(m[10]=[e.createElementVNode("option",{value:"draft"},"Draft",-1),e.createElementVNode("option",{value:"active"},"Active",-1),e.createElementVNode("option",{value:"inactive"},"Inactive",-1)])],544),[[e.vModelSelect,l.template.status]])]),e.createElementVNode("div",null,[m[12]||(m[12]=e.createElementVNode("label",{class:"text-xs font-medium text-muted-foreground mb-1.5 block"},"Subject",-1)),e.createVNode(y,{modelValue:l.template.subject,"onUpdate:modelValue":[m[4]||(m[4]=t=>l.template.subject=t),d],class:"h-9 text-sm"},null,8,["modelValue"]),m[13]||(m[13]=e.createElementVNode("p",{class:"text-[11px] text-muted-foreground/60 mt-1"},[e.createTextVNode("Use "),e.createElementVNode("code",{class:"text-[10px] bg-muted px-1 py-0.5 rounded"},"{{variables}}"),e.createTextVNode(" for dynamic content")],-1))])])]),e.createElementVNode("div",null,[m[15]||(m[15]=e.createElementVNode("label",{for:"email-preheader",class:"mb-1.5 block text-xs font-medium text-muted-foreground"},"Inbox preview text",-1)),e.createVNode(T,{id:"email-preheader",modelValue:l.template.preheader,"onUpdate:modelValue":[m[5]||(m[5]=t=>l.template.preheader=t),d],rows:"2",maxlength:"300",class:"text-sm",placeholder:"A short preview shown beside the subject…"},null,8,["modelValue"]),m[16]||(m[16]=e.createElementVNode("p",{class:"mt-1 text-[11px] text-muted-foreground"},"Keep it short. Variables are supported.",-1))]),e.createVNode(x),e.createElementVNode("div",null,[m[17]||(m[17]=e.createElementVNode("h4",{class:"text-sm font-semibold mb-3"},"Available Variables",-1)),e.createElementVNode("div",po,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(V,t=>e.createElementVNode("button",{type:"button",key:t,class:e.normalizeClass(["w-full flex items-center gap-2 px-2.5 py-1.5 rounded-md hover:bg-muted transition-all cursor-pointer group",C.value===t?"bg-primary/10":"bg-muted/50"]),onClick:p=>L(t)},[e.createVNode(e.unref(i.Code),{class:"size-3 text-muted-foreground"}),e.createElementVNode("code",fo,e.toDisplayString(t),1),e.createVNode(e.Transition,{name:"fade",mode:"out-in"},{default:e.withCtx(()=>[C.value===t?(e.openBlock(),e.createBlock(e.unref(i.Check),{key:0,class:"size-3 text-primary"})):(e.openBlock(),e.createBlock(e.unref(i.Copy),{key:1,class:"size-3 text-muted-foreground/0 group-hover:text-muted-foreground transition-colors"}))]),_:2},1024)],10,vo)),64))])]),e.createVNode(x),e.createElementVNode("div",null,[m[19]||(m[19]=e.createElementVNode("h4",{class:"text-sm font-semibold text-destructive mb-3"},"Danger Zone",-1)),e.createElementVNode("div",xo,[e.createVNode(b,{variant:"outline",size:"sm",class:"w-full justify-start gap-2 h-9 text-sm",onClick:v},{default:e.withCtx(()=>[e.createVNode(e.unref(i.RotateCcw),{class:"size-3.5"}),m[18]||(m[18]=e.createTextVNode(" Reset to Default ",-1))]),_:1}),e.createElementVNode("p",bo," Resets this template’s design"+e.toDisplayString(k.value?" and restores the template content.":"."),1)])])])}}}),yo={class:"w-full min-w-0 xl:w-[300px] xl:shrink-0 border-t xl:border-t-0 xl:border-l bg-card flex flex-col","aria-label":"Email design and settings"},ko={class:"p-3 border-b"},Vo=e.defineComponent({__name:"RightSidebar",props:{template:{},selectedBlock:{},templateStyles:{}},emits:["deselect-block","update:hasUnsavedChanges","reset-styles","reset-template"],setup(l,{emit:E}){const a=l,u=E,d=e.ref("style");return e.watch(()=>a.selectedBlock?.id,k=>{k&&(d.value="style")}),(k,v)=>{const C=e.resolveComponent("SegmentedControlButton"),L=e.resolveComponent("SegmentedControl"),V=e.resolveComponent("ScrollArea");return e.openBlock(),e.createElementBlock("aside",yo,[e.createElementVNode("div",ko,[e.createVNode(L,{modelValue:d.value,"onUpdate:modelValue":v[0]||(v[0]=c=>d.value=c),class:"w-full","aria-label":"Email settings panels"},{default:e.withCtx(()=>[e.createVNode(C,{value:"style",class:"flex justify-center items-center gap-1.5"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Palette),{class:"size-3.5"}),v[6]||(v[6]=e.createTextVNode(" Design ",-1))]),_:1}),e.createVNode(C,{value:"settings",class:"flex justify-center items-center gap-1.5"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.Settings2),{class:"size-3.5"}),v[7]||(v[7]=e.createTextVNode(" Settings ",-1))]),_:1})]),_:1},8,["modelValue"])]),e.createVNode(V,{class:"flex-1 min-h-0"},{default:e.withCtx(()=>[d.value==="style"?(e.openBlock(),e.createBlock(co,{key:0,"selected-block":l.selectedBlock,"template-styles":l.templateStyles,onDeselectBlock:v[1]||(v[1]=c=>u("deselect-block")),"onUpdate:hasUnsavedChanges":v[2]||(v[2]=c=>u("update:hasUnsavedChanges",c))},null,8,["selected-block","template-styles"])):d.value==="settings"?(e.openBlock(),e.createBlock(go,{key:1,template:l.template,"template-styles":l.templateStyles,"onUpdate:hasUnsavedChanges":v[3]||(v[3]=c=>u("update:hasUnsavedChanges",c)),onResetStyles:v[4]||(v[4]=c=>u("reset-styles",c)),onResetTemplate:v[5]||(v[5]=c=>u("reset-template",c))},null,8,["template","template-styles"])):e.createCommentVNode("",!0)]),_:1})])}}}),No={class:"mail-builder -m-4 flex h-[calc(100dvh-8rem)] min-h-[500px] flex-col overflow-hidden"},Co={key:0,class:"flex flex-1 items-center justify-center gap-2 text-sm text-muted-foreground"},ho={key:1,class:"flex flex-1 flex-col items-center justify-center gap-4"},Bo={key:0,class:"flex items-center justify-between gap-3 border-b bg-amber-500/10 px-4 py-2 text-xs",role:"alert"},Eo={class:"flex items-center justify-between border-b bg-card px-3 py-2 xl:hidden"},wo={class:"relative flex min-h-0 flex-1"},So={key:0,value:"duplicate"},To=["value"],Do=e.defineComponent({__name:"TemplateBuilder",setup(l){const E=te.useModuleApi(),{hasPermission:a}=te.useModulePermissions(),u=te.useModuleRoute(),d=te.useRouter();te.useModuleBreadcrumbs(()=>[]);const k=e.computed(()=>a("edit-template")),v=e.computed(()=>a("create-template")),C=e.computed(()=>a("delete-template")),L=()=>E.get("/templates"),V=s=>E.post("/templates",{body:s}),c=(s,o)=>E.patch(`/templates/${encodeURIComponent(s)}`,{body:o}),m=(s,o)=>s?.data?.statusMessage||s?.message||o,y=e.ref(!0),T=e.ref(""),x=e.ref(""),b=e.ref(null),t=e.ref(null),p=e.ref(!1),h=e.ref([]),U=e.computed(()=>D.value?.styles??{...ce}),w=e.ref({}),F=e.ref({}),H=e.ref(null),q=e.ref(!1),z=e.ref(!1),D=e.computed(()=>h.value.find(s=>s.id===b.value)??null),Z=e.computed(()=>D.value?.blocks.find(s=>s.id===t.value)??null),K=e.computed(()=>h.value.filter(s=>ee(s)!==w.value[s.id]).map(s=>s.id)),R=e.computed(()=>!y.value&&!T.value&&K.value.length>0),n=()=>JSON.stringify({templates:h.value});let M=ie(n());const I=e.ref(0),le=e.computed(()=>(I.value,M.canUndo)),ue=e.computed(()=>(I.value,M.canRedo));let W,oe=!1;function G(){clearTimeout(W),M.record(n()),I.value++}e.watch(h,()=>{y.value||oe||(clearTimeout(W),W=setTimeout(G,400))},{deep:!0,flush:"sync"});function ne(s){if(!k.value)return;G();const o=M[s]();if(!o)return;oe=!0;const g=JSON.parse(o);h.value=g.templates,h.value.some($=>$.id===b.value)||(b.value=h.value[0]?.id??null),t.value=null,oe=!1,I.value++}function N(s){G(),b.value=s,t.value=null,q.value=!1}function r(s){t.value=s,z.value=!0}function B(s){!D.value||!k.value||(G(),s(D.value.blocks),G())}function Q(s){const o={id:crypto.randomUUID(),type:s,content:xe(s)};B(g=>{const $=g.findIndex(P=>P.id===t.value);g.splice($<0?g.length:$+1,0,o)}),r(o.id)}function J(s){B(o=>{const g=o.findIndex($=>$.id===s);g>=0&&o.splice(g,1)}),t.value===s&&(t.value=null)}function Y(s,o){B(g=>{const $=g.findIndex(_=>_.id===s),P=$+(o==="up"?-1:1);$>=0&&P>=0&&P<g.length&&([g[$],g[P]]=[g[P],g[$]])})}function ve(s,o){s!==o&&B(g=>{const $=g.findIndex(se=>se.id===s);if($<0)return;const[P]=g.splice($,1),_=o?g.findIndex(se=>se.id===o):g.length;g.splice(_<0?g.length:_,0,P)})}function fe(s){B(o=>{const g=o.findIndex(P=>P.id===s);if(g<0)return;const $={...JSON.parse(JSON.stringify(o[g])),id:crypto.randomUUID()};o.splice(g+1,0,$),t.value=$.id})}async function me(){if(p.value||!R.value||!k.value)return;G();const s=JSON.parse(JSON.stringify(h.value.filter(o=>K.value.includes(o.id))));for(const o of s){const g=!o.name.trim()||!o.subject.trim()?"Every template needs a name and subject.":null;if(g){O.toast.error(g),N(o.id);return}}p.value=!0;try{for(const o of s){const g=await c(o.id,{...Se(o),updatedAt:F.value[o.id]});F.value[o.id]=g.updatedAt,H.value===o.id&&(H.value=null),w.value[o.id]=ee(o)}O.toast.success("All changes saved")}catch(o){(o?.statusCode===409||o?.status===409)&&(H.value=s.find(g=>ee(g)!==w.value[g.id])?.id??null),O.toast.error(m(o,"Could not save changes. Your drafts are still here."))}finally{p.value=!1}}const f=e.ref(!1),A=e.ref(""),j=e.ref("blank"),X=e.ref(!1),be=Le().filter(s=>!s.system_key);function pe(s=!1){A.value=s&&D.value?`${D.value.name} copy`:"",j.value=s?"duplicate":"blank",f.value=!0}async function De(){if(!A.value.trim()||X.value||!v.value)return;X.value=!0;const s=j.value==="duplicate"?D.value:be.find(o=>o.name===j.value);try{const o=await V({name:A.value.trim(),subject:s?.subject||A.value.trim(),preheader:s?.preheader||"",description:s?.description||"",category:s?.category||"notifications",status:"draft",styles:JSON.parse(JSON.stringify(s?.styles||ce)),blocks:(s?.blocks||[{type:"header",content:xe("header")},{type:"text",content:xe("text")}]).map(g=>({...JSON.parse(JSON.stringify(g)),id:crypto.randomUUID()}))});h.value.push(o),w.value[o.id]=ee(o),F.value[o.id]=o.updatedAt,clearTimeout(W),M=ie(n()),I.value++,N(o.id),f.value=!1,O.toast.success("Template created")}catch(o){O.toast.error(m(o,"Could not create template"))}finally{X.value=!1}}const ae=e.ref(!1),re=e.ref(!1);async function $e(){if(!D.value||!C.value||re.value)return;const s=D.value.id;re.value=!0;try{await E.del(`/templates/${encodeURIComponent(s)}`),h.value=h.value.filter(o=>o.id!==s),delete w.value[s],delete F.value[s],H.value===s&&(H.value=null),b.value=h.value[0]?.id??null,t.value=null,clearTimeout(W),M=ie(n()),I.value++,ae.value=!1,O.toast.success("Template deleted")}catch(o){O.toast.error(m(o,"Could not delete template"))}finally{re.value=!1}}async function Ue(){const s=H.value;if(!(!s||!window.confirm("Reload the saved version? This discards your local changes to this template. You can duplicate or export your draft first.")))try{const o=await E.get(`/templates/${encodeURIComponent(s)}`),g=h.value.findIndex($=>$.id===s);if(g<0)return;h.value[g]={...o,styles:{...ce,...o.styles}},w.value[s]=ee(h.value[g]),F.value[s]=o.updatedAt,H.value=null,clearTimeout(W),M=ie(n()),I.value++}catch(o){O.toast.error(m(o,"Could not reload the template"))}}function ge(s){R.value&&(s.preventDefault(),s.returnValue="")}function ye(s){if(!(s.metaKey||s.ctrlKey)||s.altKey)return;const o=s.key.toLowerCase();if(o==="s"){s.preventDefault(),me();return}s.target.closest('input, textarea, [contenteditable="true"]')||(o==="z"||o==="y")&&(s.preventDefault(),ne(o==="y"||s.shiftKey?"redo":"undo"))}const ze=d.beforeEach((s,o)=>s.fullPath===o.fullPath||!R.value||window.confirm("You have unsaved email changes. Leave without saving?"));async function ke(){y.value=!0,T.value="";try{const s=(await L()).map(o=>({...o,styles:{...ce,...o.styles},updated_at:o.updatedAt||o.updated_at}));h.value=s,w.value=Object.fromEntries(s.map(o=>[o.id,ee(o)])),F.value=Object.fromEntries(s.map(o=>[o.id,o.updatedAt])),b.value=s.find(o=>o.id===u.params.value.optionId)?.id??s[0]?.id??null,u.currentPath.value==="new"&&v.value&&pe(),M=ie(n()),I.value++}catch(s){T.value=m(s,"Could not load templates. Check the module’s Firebase integration and collection settings.")}finally{y.value=!1}}return e.onMounted(()=>{ke(),window.addEventListener("beforeunload",ge),window.addEventListener("keydown",ye)}),e.onBeforeUnmount(()=>{ze(),clearTimeout(W),window.removeEventListener("beforeunload",ge),window.removeEventListener("keydown",ye)}),(s,o)=>{const g=e.resolveComponent("Button"),$=e.resolveComponent("DialogTitle"),P=e.resolveComponent("DialogDescription"),_=e.resolveComponent("DialogHeader"),se=e.resolveComponent("Input"),Ve=e.resolveComponent("DialogFooter"),Ne=e.resolveComponent("DialogContent"),Ce=e.resolveComponent("Dialog");return e.openBlock(),e.createElementBlock("div",No,[y.value?(e.openBlock(),e.createElementBlock("div",Co,[e.createVNode(e.unref(i.Loader2),{class:"size-4 animate-spin"}),o[18]||(o[18]=e.createTextVNode(" Loading email workspace…",-1))])):T.value?(e.openBlock(),e.createElementBlock("div",ho,[e.createElementVNode("p",null,e.toDisplayString(T.value),1),e.createVNode(g,{onClick:ke},{default:e.withCtx(()=>[...o[19]||(o[19]=[e.createTextVNode("Try again",-1)])]),_:1})])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[H.value?(e.openBlock(),e.createElementBlock("div",Bo,[o[21]||(o[21]=e.createElementVNode("span",null,"A template changed elsewhere. Your local draft is intact; duplicate or export it to keep a copy.",-1)),e.createVNode(g,{variant:"outline",size:"sm",onClick:Ue},{default:e.withCtx(()=>[...o[20]||(o[20]=[e.createTextVNode("Reload latest",-1)])]),_:1})])):e.createCommentVNode("",!0),e.createElementVNode("div",Eo,[e.createVNode(g,{variant:"outline",size:"sm",onClick:o[0]||(o[0]=S=>{q.value=!q.value,z.value=!1})},{default:e.withCtx(()=>[e.createVNode(e.unref(i.PanelLeft),{class:"size-4"}),o[22]||(o[22]=e.createTextVNode(" Templates",-1))]),_:1}),D.value&&k.value?(e.openBlock(),e.createBlock(g,{key:0,variant:"outline",size:"sm",onClick:o[1]||(o[1]=S=>{z.value=!z.value,q.value=!1})},{default:e.withCtx(()=>[e.createVNode(e.unref(i.SlidersHorizontal),{class:"size-4"}),e.createTextVNode(" "+e.toDisplayString(Z.value?"Edit block":"Design"),1)]),_:1})):e.createCommentVNode("",!0)]),e.createElementVNode("div",wo,[e.createElementVNode("div",{class:e.normalizeClass(q.value?"absolute inset-0 z-30 bg-card xl:static":"hidden xl:flex")},[e.createVNode(_e,{templates:h.value,"selected-template-id":b.value,"dirty-template-ids":K.value,"can-create":v.value,"search-query":x.value,"onUpdate:searchQuery":o[2]||(o[2]=S=>x.value=S),onSelect:N,onCreate:o[3]||(o[3]=S=>pe())},null,8,["templates","selected-template-id","dirty-template-ids","can-create","search-query"])],2),e.createVNode(_t,{template:D.value,"selected-block-id":t.value,"template-styles":U.value,saving:p.value,"has-unsaved-changes":R.value,"can-undo":le.value,"can-redo":ue.value,"dirty-count":K.value.length,"can-edit":k.value,"can-create":v.value,"can-delete":C.value,onSelectBlock:r,onAddBlock:Q,onMoveBlock:Y,onReorderBlock:ve,onDuplicateBlock:fe,onDeleteBlock:J,onSave:me,onUndo:o[4]||(o[4]=S=>ne("undo")),onRedo:o[5]||(o[5]=S=>ne("redo")),onDuplicateTemplate:o[6]||(o[6]=S=>pe(!0)),onCreate:o[7]||(o[7]=S=>pe()),onDeleteTemplate:o[8]||(o[8]=S=>ae.value=!0)},null,8,["template","selected-block-id","template-styles","saving","has-unsaved-changes","can-undo","can-redo","dirty-count","can-edit","can-create","can-delete"]),D.value&&k.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(z.value?"absolute inset-0 z-20 overflow-auto bg-card xl:static xl:flex":"hidden xl:flex")},[e.createVNode(Vo,{template:D.value,"selected-block":Z.value,"template-styles":U.value,onDeselectBlock:o[9]||(o[9]=S=>t.value=null),onResetStyles:o[10]||(o[10]=S=>Object.assign(U.value,S)),onResetTemplate:o[11]||(o[11]=S=>{D.value&&(D.value.blocks=S)})},null,8,["template","selected-block","template-styles"])],2)):e.createCommentVNode("",!0)])],64)),e.createVNode(Ce,{open:f.value,"onUpdate:open":o[15]||(o[15]=S=>f.value=S)},{default:e.withCtx(()=>[e.createVNode(Ne,{class:"sm:max-w-md"},{default:e.withCtx(()=>[e.createVNode(_,null,{default:e.withCtx(()=>[e.createVNode($,null,{default:e.withCtx(()=>[...o[23]||(o[23]=[e.createTextVNode("New email template",-1)])]),_:1}),e.createVNode(P,null,{default:e.withCtx(()=>[...o[24]||(o[24]=[e.createTextVNode("Start fresh, use a starter, or make a copy of your current design.",-1)])]),_:1})]),_:1}),e.createElementVNode("form",{class:"space-y-4",onSubmit:e.withModifiers(De,["prevent"])},[e.createElementVNode("div",null,[o[25]||(o[25]=e.createElementVNode("label",{for:"template-name",class:"mb-1.5 block text-sm font-medium"},"Template name",-1)),e.createVNode(se,{id:"template-name",modelValue:A.value,"onUpdate:modelValue":o[12]||(o[12]=S=>A.value=S),placeholder:"e.g. Product announcement",maxlength:"120",required:""},null,8,["modelValue"])]),e.createElementVNode("div",null,[o[27]||(o[27]=e.createElementVNode("label",{for:"template-starter",class:"mb-1.5 block text-sm font-medium"},"Start from",-1)),e.withDirectives(e.createElementVNode("select",{id:"template-starter","onUpdate:modelValue":o[13]||(o[13]=S=>j.value=S),class:"h-10 w-full rounded-md border bg-background px-3 text-sm"},[o[26]||(o[26]=e.createElementVNode("option",{value:"blank"},"Blank email",-1)),D.value?(e.openBlock(),e.createElementBlock("option",So,"Copy of "+e.toDisplayString(D.value.name),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(be),S=>(e.openBlock(),e.createElementBlock("option",{key:S.name,value:S.name},e.toDisplayString(S.name),9,To))),128))],512),[[e.vModelSelect,j.value]])]),e.createVNode(Ve,null,{default:e.withCtx(()=>[e.createVNode(g,{type:"button",variant:"outline",onClick:o[14]||(o[14]=S=>f.value=!1)},{default:e.withCtx(()=>[...o[28]||(o[28]=[e.createTextVNode("Cancel",-1)])]),_:1}),e.createVNode(g,{type:"submit",disabled:X.value||!A.value.trim()},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(X.value?"Creating…":"Create template"),1)]),_:1},8,["disabled"])]),_:1})],32)]),_:1})]),_:1},8,["open"]),e.createVNode(Ce,{open:ae.value,"onUpdate:open":o[17]||(o[17]=S=>ae.value=S)},{default:e.withCtx(()=>[e.createVNode(Ne,{class:"sm:max-w-md"},{default:e.withCtx(()=>[e.createVNode(_,null,{default:e.withCtx(()=>[e.createVNode($,null,{default:e.withCtx(()=>[e.createTextVNode("Delete "+e.toDisplayString(D.value?.name)+"?",1)]),_:1}),e.createVNode(P,null,{default:e.withCtx(()=>[...o[29]||(o[29]=[e.createTextVNode("This permanently removes the saved template from the configured collection.",-1)])]),_:1})]),_:1}),e.createVNode(Ve,null,{default:e.withCtx(()=>[e.createVNode(g,{variant:"outline",onClick:o[16]||(o[16]=S=>ae.value=!1)},{default:e.withCtx(()=>[...o[30]||(o[30]=[e.createTextVNode("Cancel",-1)])]),_:1}),e.createVNode(g,{variant:"destructive",disabled:re.value,onClick:$e},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(re.value?"Deleting…":"Delete template"),1)]),_:1},8,["disabled"])]),_:1})]),_:1})]),_:1},8,["open"])])}}});exports._sfc_main=Do;