1import{d as I,f as R,s as U,c3 as x,aN as q,v as K,a as $,o as g,b as t,l as n,j as s,aa as Y,w as c,m as h,aV as G,aU as _,i as T,e as H,E as C,t as D,b$ as M,B as F,ao as te,bH as ae,c as E,bO as se,D as ne,_ as W,F as J,r as Z,n as Q,ax as oe,I as B,aL as z,Y as A,u as le,y as re}from"./index-B73K4ptn.js";import{_ as X}from"./BrandToggle.vue_vue_type_style_index_0_lang-CSHPpyEv.js";import{u as ie,_ as de}from"./VerificationEmailFields.vue_vue_type_script_setup_true_lang-K9lGh6BQ.js";import{u as ue}from"./use-clipboard-PsXjwgAi.js";import{C as me}from"./CodeHighlighted-2ZYukOTI.js";import{_ as pe}from"./Dialog.vue_vue_type_script_setup_true_lang-hRQ66mC-.js";import{E as O}from"./index-CyIyvjcg.js";import{_ as j}from"./SectionAnchor.vue_vue_type_script_setup_true_lang-htAUKAmC.js";(function(){try{var k=typeof window<"u"?window:typeof global<"u"?global:typeof globalThis<"u"?globalThis:typeof self<"u"?self:{};k.SENTRY_RELEASE={id:"[email protected]"}}catch{}})();try{(function(){var k=typeof window<"u"?window:typeof global<"u"?global:typeof globalThis<"u"?globalThis:typeof self<"u"?self:{},p=new k.Error().stack;p&&(k._sentryDebugIds=k._sentryDebugIds||{},k._sentryDebugIds[p]="6a6dc9f9-85fe-4360-89c4-82599231dcaf",k._sentryDebugIdIdentifier="sentry-dbid-6a6dc9f9-85fe-4360-89c4-82599231dcaf")})()}catch{}const ce={class:"mt-6"},fe={class:"flex items-center justify-between border-t border-brand-sand/60 pt-5"},be={class:"flex items-center justify-between border-t border-brand-sand/60 pt-5 mt-5"},ve={class:"flex items-center justify-between border-t border-brand-sand/60 pt-5 mt-5"},ge={class:"flex items-center justify-between border-t border-brand-sand/60 pt-5 mt-5"},ye={class:"flex items-center justify-between border-t border-brand-sand/60 pt-5 mt-5"},he={class:"mt-6 flex items-center justify-end space-x-3"},xe=I({__name:"HostedGeneralSettings",setup(k){const p=R(),o=U(x.SAVED),i=q({enabled:!0,returnUrl:"",verificationCodeExpiration:600,sessionLinkExpiration:86400,customerDataEndpoint:""});function d(){const u=p.org?.hosted;i.enabled=u?.enabled??!0,i.returnUrl=u?.returnUrl||"",i.verificationCodeExpiration=u?.verificationCodeExpiration||600,i.sessionLinkExpiration=u?.sessionLinkExpiration||86400,i.customerDataEndpoint=u?.customerDataEndpoint||""}K(()=>d());function l(){o.value=x.UNSAVED}function m(u){i.enabled=u,l()}function v(){d(),o.value=x.SAVED}async function a(){if(p.org){o.value=x.SAVING;try{const u=await M.updateHostedSettings(p.org._id,{enabled:i.enabled,returnUrl:i.returnUrl,verificationCodeExpiration:i.verificationCodeExpiration,sessionLinkExpiration:i.sessionLinkExpiration,customerDataEndpoint:i.customerDataEndpoint});p.setOrgDetails({hosted:{...p.org.hosted,...u}}),o.value=x.SAVED,F.success("Saved","Hosted settings updated.")}catch{o.value=x.ERROR_SAVING,F.error("Error","Failed to save hosted settings. Please try again.")}}}return(u,e)=>(g(),$("div",null,[e[13]||(e[13]=t("p",{class:"title mb-1"},"Hosted Cancel Flow Settings",-1)),e[14]||(e[14]=t("p",{class:"subtitle mt-2 text-sm text-brand-brown max-w-3xl"}," Configure how your Hosted Cancel Flow behaves. ",-1)),t("div",ce,[t("div",fe,[e[5]||(e[5]=t("div",{class:"pr-4 max-w-xl"},[t("p",{class:"text-sm font-semibold text-brand-black"},"Hosted Cancel Flow"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"}," When disabled, customers visiting your Hosted Cancel Flow will see an unavailable message. ")],-1)),n(X,{class:"shrink-0","off-label":"Off","on-label":"On","model-value":i.enabled,"onUpdate:modelValue":e[0]||(e[0]=r=>m(r))},null,8,["model-value"])]),t("div",be,[e[7]||(e[7]=t("div",{class:"pr-4 max-w-xl"},[t("p",{class:"text-sm font-semibold text-brand-black"},"Return URL"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"}," Where customers are redirected after completing or closing the Hosted Cancel Flow. ")],-1)),n(s(Y),{modelValue:i.returnUrl,"onUpdate:modelValue":e[1]||(e[1]=r=>i.returnUrl=r),placeholder:"yourapp.com/settings",class:"w-80 shrink-0",onInput:l},{prepend:c(()=>[...e[6]||(e[6]=[h("https://",-1)])]),_:1},8,["modelValue"])]),t("div",ve,[e[8]||(e[8]=t("div",{class:"pr-4 max-w-xl"},[t("p",{class:"text-sm font-semibold text-brand-black"},"Verification Code Expiration"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"}," How long the email verification code remains valid when customers identify themselves. ")],-1)),n(s(G),{modelValue:i.verificationCodeExpiration,"onUpdate:modelValue":e[2]||(e[2]=r=>i.verificationCodeExpiration=r),class:"w-40 shrink-0",onChange:l},{default:c(()=>[n(s(_),{value:300,label:"5 min"}),n(s(_),{value:600,label:"10 min"}),n(s(_),{value:900,label:"15 min"}),n(s(_),{value:1800,label:"30 min"})]),_:1},8,["modelValue"])]),t("div",ge,[e[9]||(e[9]=t("div",{class:"pr-4 max-w-xl"},[t("p",{class:"text-sm font-semibold text-brand-black"}
1,"Session Link Expiration"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"}," How long session links sent to customers remain valid before expiring. ")],-1)),n(s(G),{modelValue:i.sessionLinkExpiration,"onUpdate:modelValue":e[3]||(e[3]=r=>i.sessionLinkExpiration=r),class:"w-40 shrink-0",onChange:l},{default:c(()=>[n(s(_),{value:3600,label:"1 hour"}),n(s(_),{value:21600,label:"6 hours"}),n(s(_),{value:86400,label:"24 hours"}),n(s(_),{value:172800,label:"48 hours"}),n(s(_),{value:604800,label:"7 days"})]),_:1},8,["modelValue"])]),t("div",ye,[e[11]||(e[11]=t("div",{class:"pr-4 max-w-xl"},[t("p",{class:"text-sm font-semibold text-brand-black"},"Customer Data Endpoint"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"}," An API endpoint on your server that returns customer-specific data such as Custom Attributes and Adaptive Offers. Churnkey calls it server-side during the Hosted Cancel Flow to personalize the experience. ")],-1)),n(s(Y),{modelValue:i.customerDataEndpoint,"onUpdate:modelValue":e[4]||(e[4]=r=>i.customerDataEndpoint=r),placeholder:"api.yourapp.com/churnkey/customer-data",class:"w-80 shrink-0",onInput:l},{prepend:c(()=>[...e[10]||(e[10]=[h("https://",-1)])]),_:1},8,["modelValue"])])]),t("div",he,[o.value===s(x).UNSAVED?(g(),T(s(C),{key:0,link:"",class:"font-semibold",onClick:v},{default:c(()=>[...e[12]||(e[12]=[h(" Discard Changes ",-1)])]),_:1})):H("",!0),n(s(C),{type:"primary",loading:o.value===s(x).SAVING,disabled:o.value!==s(x).UNSAVED,onClick:a},{default:c(()=>[h(D(o.value===s(x).SAVING?"Saving...":"Save Changes"),1)]),_:1},8,["loading","disabled"])])]))}}),ke={class:"subtitle mt-2 text-sm text-brand-brown max-w-3xl"},we={class:"mt-6 border-t border-brand-sand/60 pt-5"},_e={class:"mt-6 flex items-center justify-end space-x-3"},Ce=I({__name:"HostedVerificationEmailSettings",setup(k){const p=R(),o=U(!1),{emailFlow:i,changesMade:d,validArgs:l,markSaved:m,discard:v}=ie();async function a(){if(p.org){o.value=!0;try{await M.update(p.org._id,{emailFlow:i.value}),m(),await p.syncOrg(),F.success("Saved","Verification email updated.")}catch{F.error("Error","Failed to save verification email settings. Please try again.")}finally{o.value=!1}}}return(u,e)=>(g(),$("div",null,[e[5]||(e[5]=t("p",{class:"title mb-1"},"Verification Email",-1)),t("p",ke,[e[2]||(e[2]=h(" The email carrying the one-time code customers enter to identify themselves. These settings are shared with your ",-1)),n(s(te),{to:"/cancellation/advanced-settings#managed-flow"},{default:c(()=>[...e[1]||(e[1]=[t("span",{class:"text-brand-blue font-semibold"},"Managed Flow Settings",-1)])]),_:1}),e[3]||(e[3]=h(". ",-1))]),t("div",we,[n(de,{modelValue:s(i),"onUpdate:modelValue":e[0]||(e[0]=r=>ae(i)?i.value=r:null)},null,8,["modelValue"])]),t("div",_e,[s(d)?(g(),T(s(C),{key:0,link:"",class:"font-semibold",onClick:s(v)},{default:c(()=>[...e[4]||(e[4]=[h(" Discard Changes ",-1)])]),_:1},8,["onClick"])):H("",!0),n(s(C),{type:"primary",loading:o.value,disabled:o.value||!s(d)||!s(l),onClick:a},{default:c(()=>[h(D(o.value?"Saving...":"Save Changes"),1)]),_:1},8,["loading","disabled"])])]))}}),$e={class:"mt-6 space-y-3"},Se={class:"flex items-center justify-between border border-brand-sand rounded-md px-4 py-3"},Ee={class:"text-sm font-medium text-brand-brown"},Ve={class:"flex items-center gap-2 ml-0"},Fe={class:"flex items-center justify-between border border-brand-sand rounded-md px-4 py-3"},Ue={key:0,class:"text-sm font-medium text-brand-black"},Ae={key:0,class:"flex items-center gap-2 ml-0"},De={class:"flex items-center justify-between border border-brand-sand rounded-md px-4 py-3"},Te={key:0,class:"text-sm font-medium text-brand-black"},He={key:0,class:"flex items-center gap-2 ml-0"},Ie=I({__name:"HostedDomainsSection",setup(k){const p=R(),o=E(()=>p.org?.dunning?.checkoutPage?.ckSubdomain||""),i=E(()=>{const u=p.org?.dunning?.checkoutPage?.customDomain;return u?.url&&se(u)?u.url:""}),d=E(()=>`https://billing.churnkey.co/cancel/${p.org?.appId}`),l=E(()=>`https://${o.value}.churnkey.co/cancel`),m=E(()=>`https://${i.value}/cancel`);function v(u){window.open(u,"_blank")}async function a(u){try{await navigator.clipboard.writeText(u),F.success("Copied","URL copied to clipboard.")}catch{F.error("Error","Failed to copy to clipboard.")}}return(u,e)=>{const r=ne("RouterLink");return g(),$("div",null,[e[17]||(e[17]=t("div",null,[t("p",{class:"title mb-1"},"Domains"),t("p",{class:"subtitle mt-2 text-sm text-brand-brown max-w-3xl"}," Your configured domains for the Hosted Cancel Flow experience. All domains below resolve to the same flow â use whichever fits your branding. ")],-1)),t("div",$e,[t("div",Se,[t("div",null,[e[6]||(e[6]=t("p",{class:"text-xs font-semibold text-brand-medium-brown uppercase tracking-wide mb-0.5"},"Fallback",-1)),t("p",Ee,D(d.value),1)]),t("div",Ve,[n(s(C),{size:"small",plain:"",onClick:e[0]||(e[0]=b=>a(d.value))},{default:c(()=>[...e[7]||(e[7]=[h("Copy",-1)])]),_:1}),n(s(C),{size:"small",type:"primary",onClick:e[1]||(e[1]=b=>v(d.value))},{default:c(()=>[...e[8]||(e[8]=[h("Open",-1)])]),_:1})])]),t("div",Fe,[t("div",null,[e[10]||(e[10]=t("p",{class:"text-xs font-semibold text-brand-medium-brown uppercase tracking-wide mb-0.5"},"Churnkey Subdomain",-1)),o.value?(g(),$("p",Ue,D(l.value),1)):(g(),T(r,{key:1,to:"/settings/domain",class:"text-sm font-semibold text-brand-blue hover:underline"},{default:c(()=>[...e[9]||(e[9]=[h(" Set up subdomain â ",-1)])]),_:1}))]),o.value?(g(),$("div",Ae,[n(s(C),{size:"small",plain:"",onClick:e[2]||(e[2]=b=>a(l.value))},{default:c(()=>[...e[11]||(e[11]=[h("Copy",-1)])]),_:1}),n(s(C),{size:"small",type:"primary",onClick:e[3]||(e[3]=b=>v(l.value))},{default:c(()=>[...e[12]||(e[12]=[h("Open",-1)])]),_:1})])):H("",!0)]),t("div",De,[t("div",null,[e[14]||(e[14]=t("p",{class:"text-xs font-semibold text-brand-medium-brown uppercase tracking-wide mb-0.5"},"Custom Domain",-1)),i.value?(g(),$("p",Te,D(m.value),1)):(g(),T(r,{key:1,to:"/settings/domain",class:"text-sm font-semibold text-brand-blue hover:underline"},{default:c(()=>[...e[13]||(e[13]=[h(" Set up custom domain â ",-1)])]),_:1}))]),i.value?(g(),$("div",He,[n(s(C),{size:"small",plain:"",onClick:e[4]||(e[4]=b=>a(m.value))},{default:c(()=>[...e[15]||(e[15]=[h("Copy",-1)])]),_:1}),n(s(C),{size:"small",type:"primary",onClick:e[5]||(e[5]=b=>v(m.value))},{default:c(()=>[...e[16]||(e[16]=[h("Open",-1)])]),_:1})])):H("",!0)])])])}}}),Be=W(Ie,[["__scopeId","data-v-cd365666"]]),Pe={class:"mt-6"},Ne={class:"mt-3 flex items-center gap-2"},Re={class:"mt-8"},Oe={class:"mt-4 flex items-center gap-4 border-b border-brand-sand"},je=["onClick"],Le={class:"mt-4"},ze={class:"mt-4 flex items-center gap-2"},Ge=I({__name:"HostedApiAccessSection",setup(k){const p=R(),o=ue(),i=[{value:"nodejs",label:"Node.js"},{value:"python",label:"Python"},{value:"ruby",label:"Ruby"},{value:"php",label:"PHP"}],d=U("nodejs"),l=U(""),m=U(!1),v=U(!1);async function a(){if(p.org){m.value=!0;try{const N=await M.getDataApiKey(p.org._id);l.value=N.apiKey}catch(N){F.error("Could not load API key",N)}finally{m.value=!1}}}a();const u=E(()=>
1{if(!l.value)return"";const N=l.value.slice(-4);return`${l.value.slice(0,8)}${"â¢".repeat(12)}${N}`}),e=E(()=>v.value?l.value:u.value);function r(){v.value=!v.value}async function b(){l.value&&(o.copy(l.value,void 0,!0),F.success("Copied","API key copied to clipboard."))}const V=E(()=>l.value||"YOUR_API_KEY"),P=E(()=>p.org?.appId||"YOUR_APP_ID"),w=E(()=>({nodejs:`const response = await fetch('https://api.churnkey.co/v1/cancel-sessions', { 2 method: 'POST', 3 headers: { 4 'x-ck-api-key': '${V.value}', 5 'x-ck-app': '${P.value}', 6 'Content-Type': 'application/json' 7 }, 8 body: JSON.stringify({ 9 customerId: 'cus_abc123', 10 subscriptionId: 'sub_xyz789', 11 expiresAt: new Date(Date.now() + 60 * 60 * 1000).toISOString() 12 }) 13}); 14const { data } = await response.json(); 15// Redirect subscriber to data.url 16res.redirect(data.url);`,python:`import requests, datetime 17 18response = requests.post( 19 'https://api.churnkey.co/v1/cancel-sessions', 20 headers={ 21 'x-ck-api-key': '${V.value}', 22 'x-ck-app': '${P.value}', 23 'Content-Type': 'application/json', 24 }, 25 json={ 26 'customerId': 'cus_abc123', 27 'subscriptionId': 'sub_xyz789', 28 'expiresAt': (datetime.datetime.utcnow() + datetime.timedelta(hours=1)).isoformat() + 'Z', 29 }, 30) 31data = response.json()['data'] 32# Redirect subscriber to data['url']`,ruby:`require 'net/http' 33require 'json' 34require 'time' 35 36uri = URI('https://api.churnkey.co/v1/cancel-sessions') 37req = Net::HTTP::Post.new(uri, { 38 'x-ck-api-key' => '${V.value}', 39 'x-ck-app' => '${P.value}', 40 'Content-Type' => 'application/json' 41}) 42req.body = { 43 customerId: 'cus_abc123', 44 subscriptionId: 'sub_xyz789', 45 expiresAt: (Time.now + 3600).utc.iso8601 46}.to_json 47 48res = Net::HTTP.start(uri.hostname, uri.port, use_ssl: true) { |http| http.request(req) } 49data = JSON.parse(res.body)['data'] 50# Redirect subscriber to data['url']`,php:`<?php 51$ch = curl_init('https://api.churnkey.co/v1/cancel-sessions'); 52curl_setopt($ch, CURLOPT_POST, true); 53curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); 54curl_setopt($ch, CURLOPT_HTTPHEADER, [ 55 'x-ck-api-key: ${V.value}', 56 'x-ck-app: ${P.value}', 57 'Content-Type: application/json', 58]); 59curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode([ 60 'customerId' => 'cus_abc123', 61 'subscriptionId' => 'sub_xyz789', 62 'expiresAt' => gmdate('c', time() + 3600), 63])); 64$response = json_decode(curl_exec($ch), true); 65curl_close($ch); 66// Redirect subscriber to $response['data']['url']`})),f=E(()=>w.value[d.value]);function S(){o.copy(f.value,void 0,!0),F.success("Copied","Code snippet copied to clipboard.")}return(N,y)=>(g(),$("div",null,[y[9]||(y[9]=t("p",{class:"title mb-1"},"API Cancel Links",-1)),y[10]||(y[10]=t("p",{class:"subtitle mt-2 text-sm text-brand-brown max-w-3xl"}," Generate Hosted Cancel Flow links programmatically from your backend. Use this to send subscribers straight into the Hosted Cancel Flow without email verification. ",-1)),t("div",Pe,[y[1]||(y[1]=t("p",{class:"text-xs font-semibold text-brand-medium-brown uppercase tracking-wide mb-1"}," Step One ",-1)),y[2]||(y[2]=t("p",{class:"text-base font-semibold text-brand-black"},"Get Your API Key",-1)),t("div",Ne,[n(s(Y),{"model-value":e.value,readonly:"",class:"flex-1",placeholder:m.value?"Loadingâ¦":"â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢â¢"},null,8,["model-value","placeholder"]),n(s(C),{plain:"",disabled:m.value||!l.value,onClick:r},{default:c(()=>[h(D(v.value?"Hide":"Reveal"),1)]),_:1},8,["disabled"]),n(s(C),{plain:"",disabled:!l.value,onClick:b},{default:c(()=>[...y[0]||(y[0]=[h("Copy",-1)])]),_:1},8,["disabled"])]),y[3]||(y[3]=t("p",{class:"mt-2 text-sm font-medium text-brand-brown"}," Keep this key on your server. Never expose it in client-side code. ",-1))]),t("div",Re,[y[6]||(y[6]=t("p",{class:"text-xs font-semibold text-brand-medium-brown uppercase tracking-wide mb-1"}," Step Two ",-1)),y[7]||(y[7]=t("p",{class:"text-base font-semibold text-brand-black"},"Generate a Cancel Session URL",-1)),y[8]||(y[8]=t("p",{class:"mt-1 text-sm font-medium text-brand-brown"},' When a subscriber clicks "Cancel" in your app, your backend creates a session and redirects them to the returned URL. ',-1)),t("div",Oe,[(g(),$(J,null,Z(i,L=>t("button",{key:L.value,class:Q(["pb-2 -mb-px text-sm font-semibold transition-colors",d.value===L.value?"text-brand-blue border-b-2 border-brand-blue":"text-brand-brown opacity-60 hover:opacity-100"]),onClick:yt=>d.value=L.value},D(L.label),11,je)),64))]),t("div",Le,[n(me,{code:f.value,language:"javascript",theme:"dark"},null,8,["code"])]),t("div",ze,[n(s(C),{plain:"",onClick:S},{default:c(()=>[...y[4]||(y[4]=[h("Copy Code",-1)])]),_:1}),y[5]||(y[5]=t("a",{href:"https://docs.churnkey.co",target:"_blank",class:"text-sm font-semibold text-brand-blue hover:underline ml-2"}," See the docs â ",-1))])])]))}}),Ke={name:"Light Yellow",pageBg:"#fcf7f3",shellBg:"#ffffff",foreground:"#0c0c0e",primary:"#f7b200",primaryForeground:"#1a1a1a"},ee=[Ke,{name:"Dark Obsidian",pageBg:"#0a0a0a",shellBg:"#141414",foreground:"#f5f5f5",primary:"#525252",primaryForeground:"#ffffff"},{name:"Dark Midnight",pageBg:"#020617",shellBg:"#0f172a",foreground:"#f1f5f9",primary:"#3b82f6",primaryForeground:"#ffffff"},{name:"Dark Ember",pageBg:"#0c0a09",shellBg:"#1c1917",foreground:"#fafaf9",primary:"#f97316",primaryForeground:"#ffffff"},{name:"Dark Blurple",pageBg:"#202225",shellBg:"#2f3136",foreground:"#ffffff",primary:"#5865f2",primaryForeground:"#ffffff"},{name:"Light Clean",pageBg:"#f8fafc",shellBg:"#ffffff",foreground:"#0f172a",primary:"#6366f1",primaryForeground:"#ffffff"},{name:"Nebula",pageBg:"#0b0820",shellBg:"#181238",foreground:"#f5f3ff",primary:"#e1306c",primaryForeground:"#ffffff"}],Me={class:"hosted-appearance-panel__controls"},Ye={class:"hosted-appearance-panel__field"},qe={class:"flex items-center gap-2 w-full"},We={class:"hosted-appearance-panel__theme-option"},Je={class:"hosted-appearance-panel__theme-name"},Ze={class:"hosted-appearance-panel__theme-option"},Qe={class:"hosted-appearance-panel__field"},Xe={class:"hosted-appearance-panel__field"},et={key:0,class:"hosted-appearance-panel__preview-wrap"},tt=I({__name:"HostedAppearancePanel",props:{template:{},themeName:{},fontFamily:{},theme:{},gradient:{type:Boolean},blueprint:{}},emits:["update:template","update:themeName","update:fontFamily","update:gradient","customize-theme"],setup(k,{expose:p}){const o=k,i=ee,d=E(()=>({shellBg:o.theme.shellBg||"#f3f4f6",foreground:o.theme.foreground||"#6b7280",primary:o.theme.primary||"#9ca3af"}));p({themePresets:i}
66);const l=U();let m=null,v=!1;function a(e){return new Promise((r,b)=>{if(window.churnkeyHCFPreview){r();return}const V=document.createElement("script");V.src=e,V.onload=()=>r(),V.onerror=()=>b(new Error(`Failed to load HCF preview script from ${e}`)),document.head.appendChild(V)})}async function u(){if(!l.value||!o.blueprint)return;const e="https://billing.churnkey.co/cancel/preview/hcf-preview.js";try{v||(await a(e),v=!0);const r=window.churnkeyHCFPreview;if(!r){console.error("[HostedAppearancePanel] churnkeyHCFPreview not available after script load");return}m&&(m.destroy(),m=null),m=r.mount({container:l.value,blueprint:o.blueprint,template:o.template||void 0,theme:o.theme,fontFamily:o.fontFamily||void 0,gradient:o.gradient})}catch(r){console.error("[HostedAppearancePanel] Failed to mount preview:",r)}}return K(()=>{u()}),oe(()=>{m&&(m.destroy(),m=null)}),B(()=>o.blueprint,()=>{u()},{deep:!0}),B(()=>o.template,()=>{m&&m.update({template:o.template||void 0,blueprint:o.blueprint})}),B(()=>o.theme,e=>{m&&m.update({theme:e})},{deep:!0}),B(()=>o.fontFamily,e=>{m&&m.update({fontFamily:e||void 0})}),B(()=>o.gradient,e=>{m&&m.update({gradient:e})}),(e,r)=>(g(),$("div",{class:Q(["hosted-appearance-panel__grid",{"hosted-appearance-panel__grid--no-preview":!e.blueprint}])},[t("div",Me,[z(e.$slots,"controls",{},()=>[t("div",Ye,[r[6]||(r[6]=t("p",{class:"text-sm font-semibold text-brand-black"},"Color Theme",-1)),t("div",qe,[n(s(G),{"model-value":e.themeName,class:"hosted-appearance-panel__select flex-1","popper-class":"hosted-appearance-panel__theme-popper",onChange:r[0]||(r[0]=b=>e.$emit("update:themeName",b))},{default:c(()=>[z(e.$slots,"theme-options-before",{},void 0,!0),(g(!0),$(J,null,Z(s(i),b=>(g(),T(s(_),{key:b.name,value:b.name,label:b.name},{default:c(()=>[t("div",We,[t("div",{class:"hosted-appearance-panel__theme-thumb",style:A({background:b.shellBg}),"aria-hidden":"true"},[t("span",{class:"hosted-appearance-panel__theme-thumb-line hosted-appearance-panel__theme-thumb-line--heading",style:A({background:b.foreground})},null,4),t("span",{class:"hosted-appearance-panel__theme-thumb-line hosted-appearance-panel__theme-thumb-line--body",style:A({background:b.foreground})},null,4),t("span",{class:"hosted-appearance-panel__theme-thumb-button",style:A({background:b.primary})},null,4)],4),t("span",Je,D(b.name),1)])]),_:2},1032,["value","label"]))),128)),n(s(_),{value:"custom",label:"Custom"},{default:c(()=>[t("div",Ze,[t("div",{class:"hosted-appearance-panel__theme-thumb",style:A({background:d.value.shellBg}),"aria-hidden":"true"},[t("span",{class:"hosted-appearance-panel__theme-thumb-line hosted-appearance-panel__theme-thumb-line--heading",style:A({background:d.value.foreground})},null,4),t("span",{class:"hosted-appearance-panel__theme-thumb-line hosted-appearance-panel__theme-thumb-line--body",style:A({background:d.value.foreground})},null,4),t("span",{class:"hosted-appearance-panel__theme-thumb-button",style:A({background:d.value.primary})},null,4)],4),r[4]||(r[4]=t("span",{class:"hosted-appearance-panel__theme-name"},"Custom",-1))])]),_:1})]),_:3},8,["model-value"]),e.themeName==="custom"?(g(),T(s(C),{key:0,plain:"",size:"small",onClick:r[1]||(r[1]=b=>e.$emit("customize-theme"))},{default:c(()=>[...r[5]||(r[5]=[h(" Customize ",-1)])]),_:1})):H("",!0)])]),t("div",Qe,[r[7]||(r[7]=t("p",{class:"text-sm font-semibold text-brand-black"},"Gradient",-1)),n(X,{"model-value":e.gradient,"off-label":"Off","on-label":"On","onUpdate:modelValue":r[2]||(r[2]=b=>e.$emit("update:gradient",b===!0))},null,8,["model-value"])]),t("div",Xe,[r[8]||(r[8]=t("p",{class:"text-sm font-semibold text-brand-black"},"Font",-1)),n(s(G),{"model-value":e.fontFamily,class:"hosted-appearance-panel__select",onChange:r[3]||(r[3]=b=>e.$emit("update:fontFamily",b))},{default:c(()=>[z(e.$slots,"font-options-before",{},void 0,!0),n(s(_),{value:"General Sans",label:"General Sans"}),n(s(_),{value:"Inter",label:"Inter"}),n(s(_),{value:"Helvetica Neue",label:"Helvetica Neue"}),n(s(_),{value:"system-ui",label:"System UI"}),n(s(_),{value:"Georgia",label:"Georgia"}),n(s(_),{value:"Merriweather",label:"Merriweather"})]),_:3},8,["model-value"])])],!0),z(e.$slots,"controls-after",{},void 0,!0)]),e.blueprint?(g(),$("div",et,[t("div",{ref_key:"previewContainer",ref:l,class:"hosted-appearance-panel__preview",style:A({background:e.theme.pageBg||"#fcf7f3"})},null,4)])):H("",!0)],2))}}),at=W(tt,[["__scopeId","data-v-a6538ae6"]]),st={class:"space-y-5"},nt={class:"flex items-center justify-between"},ot={class:"flex items-center justify-between"},lt={class:"flex items-center justify-between"},rt={class:"flex items-center justify-between"},it={class:"flex items-center justify-between"},dt=I({__name:"HostedCustomThemeModal",props:{modelValue:{type:Boolean},theme:{}},emits:["update:modelValue","confirm"],setup(k,{emit:p}){const o=k,i=p,d=E({get:()=>o.modelValue,set:v=>i("update:modelValue",v)}),l=q({pageBg:"",shellBg:"",foreground:"",primary:"",primaryForeground:""});B(()=>o.modelValue,v=>{v&&Object.assign(l,o.theme)});function m(){i("confirm",{...l}),i("update:modelValue",!1)}return(v,a)=>(g(),T(pe,{modelValue:d.value,"onUpdate:modelValue":a[5]||(a[5]=u=>d.value=u),"confirm-text":"Apply Colors",size:"max-w-lg",onConfirm:m},{default:c(()=>[a[11]||(a[11]=t("p",{class:"text-lg font-bold text-brand-black mb-1"},"Custom Theme Colors",-1)),a[12]||(a[12]=t("p",{class:"text-sm font-medium text-brand-brown mb-6"}," Set the colors used in your Hosted Cancel Flows. ",-1)),t("div",st,[t("div",nt,[a[6]||(a[6]=t("div",null,[t("p",{class:"text-sm font-semibold text-brand-black"}
66,"Page Background"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"},"The backdrop behind the Hosted Cancel Flow card.")],-1)),n(s(O),{modelValue:l.pageBg,"onUpdate:modelValue":a[0]||(a[0]=u=>l.pageBg=u)},null,8,["modelValue"])]),t("div",ot,[a[7]||(a[7]=t("div",null,[t("p",{class:"text-sm font-semibold text-brand-black"},"Shell Background"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"},"The Hosted Cancel Flow card's background color.")],-1)),n(s(O),{modelValue:l.shellBg,"onUpdate:modelValue":a[1]||(a[1]=u=>l.shellBg=u)},null,8,["modelValue"])]),t("div",lt,[a[8]||(a[8]=t("div",null,[t("p",{class:"text-sm font-semibold text-brand-black"},"Foreground"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"},"Primary text color inside the Hosted Cancel Flow.")],-1)),n(s(O),{modelValue:l.foreground,"onUpdate:modelValue":a[2]||(a[2]=u=>l.foreground=u)},null,8,["modelValue"])]),t("div",rt,[a[9]||(a[9]=t("div",null,[t("p",{class:"text-sm font-semibold text-brand-black"},"Primary"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"},"CTA buttons, links, and focus rings.")],-1)),n(s(O),{modelValue:l.primary,"onUpdate:modelValue":a[3]||(a[3]=u=>l.primary=u)},null,8,["modelValue"])]),t("div",it,[a[10]||(a[10]=t("div",null,[t("p",{class:"text-sm font-semibold text-brand-black"},"Primary Foreground"),t("p",{class:"mt-0.5 text-sm font-medium text-brand-brown"},"Text color on primary-colored backgrounds.")],-1)),n(s(O),{modelValue:l.primaryForeground,"onUpdate:modelValue":a[4]||(a[4]=u=>l.primaryForeground=u)},null,8,["modelValue"])])])]),_:1},8,["modelValue"]))}}),ut={class:"flex items-center justify-end space-x-3 pt-2"},mt=I({__name:"HostedAppearanceSettings",setup(k){const p=R(),o=le(),i=E(()=>o.primaryBlueprint??void 0),d=U(x.SAVED),l=U(!1),m=U(),v=ee,a=q({template:"classic",themeName:"Light Yellow",theme:{pageBg:"",shellBg:"",foreground:"",primary:"",primaryForeground:""},fontFamily:"",logo:"",gradient:!1});function u(){const w=p.org?.hosted;a.template=w?.template||"classic",a.themeName=w?.themeName||"Light Yellow",a.theme={...w?.theme||v[0]},a.fontFamily=w?.fontFamily||"",a.logo=w?.logo||"",a.gradient=w?.gradient??!1}K(()=>u());function e(){d.value=x.UNSAVED}function r(w){if(a.themeName=w,w!=="custom"){const f=v.find(S=>S.name===w);f&&(a.theme={pageBg:f.pageBg,shellBg:f.shellBg,foreground:f.foreground,primary:f.primary,primaryForeground:f.primaryForeground})}e()}function b(w){a.theme={...w},e()}function V(){u(),d.value=x.SAVED}async function P(){if(p.org){d.value=x.SAVING;try{const w=await M.updateHostedSettings(p.org._id,{template:a.template,themeName:a.themeName,theme:a.theme,fontFamily:a.fontFamily,logo:a.logo,gradient:a.gradient});p.setOrgDetails({hosted:{...p.org.hosted,...w}}),d.value=x.SAVED,F.success("Saved","Appearance settings updated.")}catch{d.value=x.ERROR_SAVING,F.error("Error","Failed to save appearance settings. Please try again.")}}}return(w,f)=>(g(),$("div",null,[f[7]||(f[7]=t("p",{class:"title mb-1"},"Appearance",-1)),f[8]||(f[8]=t("p",{class:"subtitle mt-2 text-sm text-brand-brown max-w-3xl"}," Customize the look and feel of your Hosted Cancel Flow. ",-1)),n(at,{ref_key:"panel",ref:m,template:a.template,"theme-name":a.themeName,"font-family":a.fontFamily,theme:a.theme,gradient:a.gradient,blueprint:i.value,"onUpdate:template":f[0]||(f[0]=S=>{a.template=S,e()}),"onUpdate:themeName":f[1]||(f[1]=S=>r(S)),"onUpdate:fontFamily":f[2]||(f[2]=S=>{a.fontFamily=S,e()}),"onUpdate:gradient":f[3]||(f[3]=S=>{a.gradient=S,e()}),onCustomizeTheme:f[4]||(f[4]=S=>l.value=!0)},{"controls-after":c(()=>[t("div",ut,[d.value===s(x).UNSAVED?(g(),T(s(C),{key:0,link:"",class:"font-semibold",onClick:V},{default:c(()=>[...f[6]||(f[6]=[h(" Discard Changes ",-1)])]),_:1})):H("",!0),n(s(C),{type:"primary",loading:d.value===s(x).SAVING,disabled:d.value!==s(x).UNSAVED,onClick:P},{default:c(()=>[h(D(d.value===s(x).SAVING?"Saving...":"Save Changes"),1)]),_:1},8,["loading","disabled"])])]),_:1},8,["template","theme-name","font-family","theme","gradient","blueprint"]),n(dt,{modelValue:l.value,"onUpdate:modelValue":f[5]||
66(f[5]=S=>l.value=S),theme:a.theme,onConfirm:b},null,8,["modelValue","theme"])]))}}),pt={class:"space-y-2"},ct={id:"general",class:"brand-card-lg relative"},ft={key:0,id:"verification-email",class:"brand-card-lg relative"},bt={id:"domains",class:"brand-card-lg relative"},vt={id:"api-access",class:"brand-card-lg relative"},gt={id:"appearance",class:"brand-card-lg relative"},Et=I({__name:"hosted",setup(k){const p=R(),o=re();function i(d){if(!d)return;let l=0,m=!1;const v=()=>{const a=document.getElementById(d);a&&(a.scrollIntoView({behavior:m?"auto":"smooth"}),m=!0),++l<14&&setTimeout(v,160)};v()}return K(()=>{const d=o.hash?decodeURIComponent(o.hash.slice(1)):"";i(d)}),B(()=>o.hash,d=>i(d?decodeURIComponent(d.slice(1)):"")),(d,l)=>(g(),$("div",pt,[t("div",ct,[n(j,{"anchor-id":"general",class:"absolute right-6 top-6 z-10"}),n(xe)]),s(p).org?(g(),$("div",ft,[n(j,{"anchor-id":"verification-email",class:"absolute right-6 top-6 z-10"}),n(Ce)])):H("",!0),t("div",bt,[n(j,{"anchor-id":"domains",class:"absolute right-6 top-6 z-10"}),n(Be)]),t("div",vt,[n(j,{"anchor-id":"api-access",class:"absolute right-6 top-6 z-10"}),n(Ge)]),t("div",gt,[n(j,{"anchor-id":"appearance",class:"absolute right-6 top-6 z-10"}),n(mt)])]))}});export{Et as default}; 67//# sourceMappingURL=hosted-BdfC2_QN.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.