[{"data":1,"prerenderedAt":7563},["ShallowReactive",2],{"navigation":3,"/cancel-flows/quick-start-guide":310,"/cancel-flows/quick-start-guide-surround":7560},[4,13,161,197,211,236,290,300],{"title":5,"_path":6,"children":7,"_id":12,"description":11},"Getting Started","/getting-started",[8],{"title":9,"_path":6,"_id":10,"description":11},"Overview","content:1.getting-started:1.index.md","Everything you need to know about integrating Churnkey with your product and billing stack.","content:1.getting-started:_dir.yml",{"title":14,"_path":15,"children":16,"_id":160},"Cancel Flows","/cancel-flows",[17,22,27,32,37,42,47,52,57,62,67,72,116,130],{"title":18,"_path":19,"_id":20,"description":21},"Quick Start Guide","/cancel-flows/quick-start-guide","content:2.cancel-flows:1.quick-start-guide.md","A 3-step guide on how to implement Cancel Flows in your website",{"title":23,"_path":24,"_id":25,"description":26},"Cancel Flow Structure","/cancel-flows/flow-configuration","content:2.cancel-flows:2.flow configuration.md","Learn about the available components that make up a Cancel Flow, from initial offers to cancellation confirmation, and how each step contributes to the overall flow.",{"title":28,"_path":29,"_id":30,"description":31},"Configuration Options","/cancel-flows/further-configuration","content:2.cancel-flows:3.further-configuration.md","Additional details for all of the following options are included below.",{"title":33,"_path":34,"_id":35,"description":36},"Custom Styling","/cancel-flows/custom-styling","content:2.cancel-flows:4.custom-styling.md","Brand your Churnkey Cancel Flow with your own CSS",{"title":38,"_path":39,"_id":40,"description":41},"Managed Email Flow","/cancel-flows/email-verified-cancel-flow","content:2.cancel-flows:6.email-verified-cancel-flow.md","Our managed email based setup takes care of customer verification for you with an email verification code.",{"title":43,"_path":44,"_id":45,"description":46},"A/B Testing","/cancel-flows/a-b-testing","content:2.cancel-flows:7.a-b-testing.md","Run controlled experiments to optimize your Cancel Flows and maximize customer retention.",{"title":48,"_path":49,"_id":50,"description":51},"Testing","/cancel-flows/cancel-flow-testing","content:2.cancel-flows:8.cancel-flow-testing.md","Ensure that your Cancel Flow is working as intended before going live.",{"title":53,"_path":54,"_id":55,"description":56},"Pause Wall","/cancel-flows/pause-wall","content:2.cancel-flows:9.pause-wall.md","Block access to your application during subscription pauses",{"title":58,"_path":59,"_id":60,"description":61},"Click-to-Cancel Compliance","/cancel-flows/click-to-cancel","content:2.cancel-flows:10.click-to-cancel.md","Implement automatic compliance with global subscription cancellation requirements",{"title":63,"_path":64,"_id":65,"description":66},"Structured Follow-Up Questions","/cancel-flows/structured-follow-up-questions","content:2.cancel-flows:11.structured-follow-up-questions.md","Collect deeper cancellation insights and deliver targeted retention offers with a second layer of predefined follow-up options in your cancel flow survey.",{"title":68,"_path":69,"_id":70,"description":71},"Adaptive Offers","/cancel-flows/adaptive-offers","content:2.cancel-flows:adaptive-offers.md","AI-powered discount optimization that automatically finds the perfect offer for each customer",{"title":73,"_path":74,"children":75},"Analytics","/cancel-flows/analytics",[76,81,86,91,96,101,106,111],{"title":77,"_path":78,"_id":79,"description":80},"Boosted Revenue","/cancel-flows/analytics/average-boosted-revenue","content:2.cancel-flows:analytics:1.average-boosted-revenue.md","Measure the long-term value of retained subscribers",{"title":82,"_path":83,"_id":84,"description":85},"Save Rate","/cancel-flows/analytics/save-rate","content:2.cancel-flows:analytics:2.save-rate.md","The percentage of customers that your Cancel Flows saved from cancellation",{"title":87,"_path":88,"_id":89,"description":90},"Reactivation Rate","/cancel-flows/analytics/reactivation-rate","content:2.cancel-flows:analytics:3.reactivation-rate.md","The percentage of customers who pay at least one invoice after being saved",{"title":92,"_path":93,"_id":94,"description":95},"Sessions","/cancel-flows/analytics/session-outcomes","content:2.cancel-flows:analytics:4.session-outcomes.md","Track each interaction that a customer has with your Cancel Flows",{"title":97,"_path":98,"_id":99,"description":100},"Cancellation Trends","/cancel-flows/analytics/cancellation-trends","content:2.cancel-flows:analytics:5.cancellation-trends.md","Analyze and interpret the selection rates and trends for cancellation reasons in your Cancel Flows.",{"title":102,"_path":103,"_id":104,"description":105},"Feedback AI","/cancel-flows/analytics/feedback-ai","content:2.cancel-flows:analytics:6.feedback-ai.md","Transform customer feedback into actionable insights with AI-powered categorization and analysis",{"title":107,"_path":108,"_id":109,"description":110},"Response Flow","/cancel-flows/analytics/response-flow","content:2.cancel-flows:analytics:7.response-flow.md","Visualize how customers move from primary cancellation reasons to specific follow-up selections with the Sankey diagram",{"title":112,"_path":113,"_id":114,"description":115},"Response Explorer","/cancel-flows/analytics/response-explorer","content:2.cancel-flows:analytics:8.response-explorer.md","Drill into individual follow-up responses with the Treemap visualization, search, trend analysis, and MRR impact sorting",{"title":117,"_path":118,"children":119},"Multi Language Support","/cancel-flows/multi-language-support",[120,125],{"title":121,"_path":122,"_id":123,"description":124},"Manual Translations","/cancel-flows/multi-language-support/multi-language-support","content:2.cancel-flows:multi-language-support:5.multi-language-support.md","Support multiple languages.",{"title":126,"_path":127,"_id":128,"description":129},"Automatic Translations","/cancel-flows/multi-language-support/automatic-translation","content:2.cancel-flows:multi-language-support:automatic-translation.md","Enable AI-powered multilingual support for your Cancel Flows with a single toggle.",{"title":131,"_path":132,"children":133,"_id":159},"Offers","/cancel-flows/offers",[134,139,144,149,154],{"title":135,"_path":136,"_id":137,"description":138},"Discount","/cancel-flows/offers/discounts","content:2.cancel-flows:offers:discounts.md","Offer targeted subscription discounts to reduce churn and increase customer retention",{"title":140,"_path":141,"_id":142,"description":143},"Hidden Plans","/cancel-flows/offers/hidden-plans","content:2.cancel-flows:offers:hidden-plans.md","Use the Switch Subscription Plan offer to present exclusive, non-public plans to customers during cancellation",{"title":145,"_path":146,"_id":147,"description":148},"Pause Subscription","/cancel-flows/offers/pause-subscription","content:2.cancel-flows:offers:pause-subscription.md","Temporarily suspend subscription payments without canceling the service",{"title":150,"_path":151,"_id":152,"description":153},"Switch Subscription Plan","/cancel-flows/offers/switch-subscription","content:2.cancel-flows:offers:switch-subscription.md","Allow customers to change to a different subscription plan during the cancellation flow to retain them with a more suitable option",{"title":155,"_path":156,"_id":157,"description":158},"Trial Extension","/cancel-flows/offers/trial-extension","content:2.cancel-flows:offers:trial-extension.md","Extend customer trial periods to reduce churn and increase conversion rates during the critical trial-to-paid transition","content:2.cancel-flows:offers:_dir.yml","content:2.cancel-flows:_dir.yml",{"title":162,"_path":163,"children":164,"_id":196},"Payment Recovery","/failed-payment-recovery",[165,169,174,179,184,188],{"title":5,"_path":166,"_id":167,"description":168},"/failed-payment-recovery/payment-recovery","content:3.failed-payment-recovery:1.payment-recovery.md","Recover failed payment revenue, automatically.",{"title":170,"_path":171,"_id":172,"description":173},"Customize your Campaigns","/failed-payment-recovery/campaign-customization","content:3.failed-payment-recovery:2.campaign-customization.md","Customize your Payment Recovery Campaigns to match the unique needs of your individual customers.",{"title":175,"_path":176,"_id":177,"description":178},"Failed Payment Wall","/failed-payment-recovery/failed-payment-wall","content:3.failed-payment-recovery:3.failed-payment-wall.md","Block access to your application when payments fail",{"title":180,"_path":181,"_id":182,"description":183},"Billing Contact API","/failed-payment-recovery/billing-contact-api","content:3.failed-payment-recovery:4.billing-contact-api.md","Send Payment Recovery emails to multiple billing contacts",{"title":43,"_path":185,"_id":186,"description":187},"/failed-payment-recovery/ab-testing","content:3.failed-payment-recovery:5.ab-testing.md","Optimize your payment recovery campaigns through controlled experiments that maximize revenue recovery.",{"title":73,"_path":189,"children":190},"/failed-payment-recovery/analytics",[191],{"title":192,"_path":193,"_id":194,"description":195},"Overall Performance","/failed-payment-recovery/analytics/overview","content:3.failed-payment-recovery:analytics:1.overview.md","Key performance metrics for your Payment Recovery campaigns","content:3.failed-payment-recovery:_dir.yml",{"title":198,"_path":199,"children":200,"_id":210},"Reactivations","/reactivations",[201,205],{"title":5,"_path":202,"_id":203,"description":204},"/reactivations/reactivations","content:4.reactivations:1.reactivations.md","Churnkey helps you to recover unsubscribed customers with easy, customizable Reactivation Email Campaigns.",{"title":206,"_path":207,"_id":208,"description":209},"Customization","/reactivations/campaign-customization-guide","content:4.reactivations:2.campaign-customization-guide.md","Customize your Reactivation Campaigns to match the individual needs of your customers.","content:4.reactivations:_dir.yml",{"title":212,"_path":213,"children":214,"_id":235},"Data Integrations","/data-integrations",[215,220,225,230],{"title":216,"_path":217,"_id":218,"description":219},"Data API","/data-integrations/data-api","content:6.data-integrations:1.data-api.md","Access your data through our API.",{"title":221,"_path":222,"_id":223,"description":224},"Slack notifications","/data-integrations/slack","content:6.data-integrations:2.slack.md","Connect Churnkey with your organization's Slack and to send session notifications to a specific channel.",{"title":226,"_path":227,"_id":228,"description":229},"Webhooks","/data-integrations/webhooks","content:6.data-integrations:2.webhooks.md","Churnkey can send webhooks to automatically notify your application whenever a customer completes a session.",{"title":231,"_path":232,"_id":233,"description":234},"Event Tracking","/data-integrations/event-tracking","content:6.data-integrations:3.event-tracking.md","Track your customers' key-value metrics on a per customer basis.","content:6.data-integrations:_dir.yml",{"title":237,"_path":238,"children":239,"_id":289},"Billing Providers","/billing-providers",[240,245,250,255,260,265,270,275],{"title":241,"_path":242,"_id":243,"description":244},"Payment Providers","/billing-providers/payment-provider-overview","content:7.billing-providers:1.payment-provider-overview.md","Feature support for Stripe, Chargebee, Paddle, and Braintree",{"title":246,"_path":247,"_id":248,"description":249},"Stripe","/billing-providers/stripe","content:7.billing-providers:3.stripe.md","Integrate Churnkey with your Stripe account",{"title":251,"_path":252,"_id":253,"description":254},"Chargebee","/billing-providers/chargebee","content:7.billing-providers:4.chargebee.md","Integrate Churnkey with your Chargebee account",{"title":256,"_path":257,"_id":258,"description":259},"Paddle Classic","/billing-providers/paddle-classic","content:7.billing-providers:5.paddle-classic.md","Integrate Churnkey with your Paddle Classic account",{"title":261,"_path":262,"_id":263,"description":264},"Paddle Billing","/billing-providers/paddle-billing","content:7.billing-providers:6.paddle-billing.md","Integrate Churnkey with your Paddle Billing account",{"title":266,"_path":267,"_id":268,"description":269},"Braintree","/billing-providers/braintree","content:7.billing-providers:7.braintree.md","Integrate Churnkey with your Braintree account",{"title":271,"_path":272,"_id":273,"description":274},"Maxio","/billing-providers/maxio","content:7.billing-providers:8.maxio.md","Integrate Churnkey with your Maxio (formerly Chargify) account",{"title":276,"_path":277,"children":278},"Direct Connect","/billing-providers/direct-connect",[279,284],{"title":280,"_path":281,"_id":282,"description":283},"Churnkey Direct","/billing-providers/direct-connect/direct","content:7.billing-providers:9.direct-connect:1.direct.md","Integrate Churnkey with any billing system using Direct mode",{"title":285,"_path":286,"_id":287,"description":288},"Direct Mode Examples","/billing-providers/direct-connect/direct-examples","content:7.billing-providers:9.direct-connect:2.direct-examples.md","Real-world examples for common subscription scenarios","content:7.billing-providers:_dir.yml",{"title":291,"_path":292,"children":293,"_id":299},"Account","/account",[294],{"title":295,"_path":296,"_id":297,"description":298},"Multi-Workspace Support","/account/multi-workspace-support","content:8.account:1.multi-workspace-support.md","Use one email address to access multiple Churnkey workspaces and switch between them instantly.","content:8.account:_dir.yml",{"title":301,"_path":302,"children":303,"_id":309},"Support","/support",[304],{"title":305,"_path":306,"_id":307,"description":308},"Frequently Asked Questions","/support/faqs","content:9.support:1.faqs.md","We want setting up Churnkey to be a breeze.","content:9.support:_dir.yml",{"_path":19,"_dir":311,"_draft":312,"_partial":312,"_locale":313,"title":18,"description":21,"body":314,"_type":7554,"_id":20,"_source":7555,"_file":7556,"_stem":7557,"_extension":7558,"sitemap":7559},"cancel-flows",false,"",{"type":315,"children":316,"toc":7538},"root",[317,325,331,376,381,387,415,433,445,741,747,766,771,784,799,3215,3221,3234,3428,3434,3439,4072,4079,6285,6291,6297,6302,6310,6315,6383,6392,6400,6442,6448,6460,6468,6487,6495,6507,6515,7498,7503,7509,7514,7532],{"type":318,"tag":319,"props":320,"children":322},"element","h2",{"id":321},"overview",[323],{"type":324,"value":9},"text",{"type":318,"tag":326,"props":327,"children":328},"p",{},[329],{"type":324,"value":330},"Integrating Churnkey Cancel Flows into your application involves three main steps:",{"type":318,"tag":332,"props":333,"children":334},"ol",{},[335,356,366],{"type":318,"tag":336,"props":337,"children":338},"li",{},[339,345,347,354],{"type":318,"tag":340,"props":341,"children":342},"strong",{},[343],{"type":324,"value":344},"Load the Churnkey script",{"type":324,"value":346}," - Add the Churnkey JavaScript library to your website to make ",{"type":318,"tag":348,"props":349,"children":351},"code",{"className":350},[],[352],{"type":324,"value":353},"window.churnkey",{"type":324,"value":355}," available",{"type":318,"tag":336,"props":357,"children":358},{},[359,364],{"type":318,"tag":340,"props":360,"children":361},{},[362],{"type":324,"value":363},"Generate secure authentication",{"type":324,"value":365}," - Create a backend endpoint that generates an HMAC hash to verify customer identity",{"type":318,"tag":336,"props":367,"children":368},{},[369,374],{"type":318,"tag":340,"props":370,"children":371},{},[372],{"type":324,"value":373},"Initialize the cancel flow",{"type":324,"value":375}," - When a customer clicks cancel, fetch the authHash from your backend and display the Churnkey modal",{"type":318,"tag":326,"props":377,"children":378},{},[379],{"type":324,"value":380},"This integration pattern ensures that only authenticated customers can access their cancellation options, protecting your application from unauthorized access.",{"type":318,"tag":319,"props":382,"children":384},{"id":383},"step-one-place-script-element",[385],{"type":324,"value":386},"Step One: Place Script Element",{"type":318,"tag":326,"props":388,"children":389},{},[390,392,397,399,405,407,413],{"type":324,"value":391},"The following code will pull in the Churnkey client-side module and add it under the ",{"type":318,"tag":348,"props":393,"children":395},{"className":394},[],[396],{"type":324,"value":353},{"type":324,"value":398}," namespace so that you can later initialize the Churnkey Cancel Flow for your customers. Place it in the HTML ",{"type":318,"tag":348,"props":400,"children":402},{"className":401},[],[403],{"type":324,"value":404},"\u003Chead>",{"type":324,"value":406}," element.\nTo find ",{"type":318,"tag":348,"props":408,"children":410},{"className":409},[],[411],{"type":324,"value":412},"YOUR_APP_ID",{"type":324,"value":414},",from any initial page in Churnkey's dashboard you can navigate:",{"type":318,"tag":332,"props":416,"children":417},{},[418,423,428],{"type":318,"tag":336,"props":419,"children":420},{},[421],{"type":324,"value":422},"Settings (Bottom Left Corner)",{"type":318,"tag":336,"props":424,"children":425},{},[426],{"type":324,"value":427},"Organization (Top Menu)",{"type":318,"tag":336,"props":429,"children":430},{},[431],{"type":324,"value":432},"Scroll Down to the section Cancel Flow API Keys",{"type":318,"tag":326,"props":434,"children":436},{"align":435},"center",[437,439],{"type":324,"value":438},"\n  ",{"type":318,"tag":440,"props":441,"children":444},"img",{"src":442,"alt":443},"./img/cancel_flow/cancel_flow_api_keys.png","Cancel Flow APP_ID and API_KEY",[],{"type":318,"tag":446,"props":447,"children":451},"pre",{"className":448,"code":449,"language":450,"meta":313,"style":313},"language-javascript shiki shiki-themes github-light-default github-light-default github-dark-default","\u003Cscript>\n!function(){\n  if (!window.churnkey || !window.churnkey.created) {\n    window.churnkey = { created: true };\n    const a = document.createElement('script');\n    a.src = 'https://assets.churnkey.co/js/app.js?appId=YOUR_APP_ID';\n    a.async = true;\n    const b = document.getElementsByTagName('script')[0];\n    b.parentNode.insertBefore(a, b);\n  }\n}();\n\u003C/script>\n","javascript",[452],{"type":318,"tag":348,"props":453,"children":454},{"__ignoreMap":313},[455,478,493,533,563,602,625,647,692,701,710,724],{"type":318,"tag":456,"props":457,"children":460},"span",{"class":458,"line":459},"line",1,[461,467,473],{"type":318,"tag":456,"props":462,"children":464},{"style":463},"--shiki-light:#1F2328;--shiki-default:#1F2328;--shiki-dark:#E6EDF3",[465],{"type":324,"value":466},"\u003C",{"type":318,"tag":456,"props":468,"children":470},{"style":469},"--shiki-light:#116329;--shiki-default:#116329;--shiki-dark:#7EE787",[471],{"type":324,"value":472},"script",{"type":318,"tag":456,"props":474,"children":475},{"style":463},[476],{"type":324,"value":477},">\n",{"type":318,"tag":456,"props":479,"children":481},{"class":458,"line":480},2,[482,487],{"type":318,"tag":456,"props":483,"children":484},{"style":463},[485],{"type":324,"value":486},"!function()",{"type":318,"tag":456,"props":488,"children":490},{"style":489},"--shiki-light:#CF222E;--shiki-default:#CF222E;--shiki-dark:#FF7B72",[491],{"type":324,"value":492},"{\n",{"type":318,"tag":456,"props":494,"children":496},{"class":458,"line":495},3,[497,503,508,513,518,523,528],{"type":318,"tag":456,"props":498,"children":500},{"style":499},"--shiki-light:#8250DF;--shiki-default:#8250DF;--shiki-dark:#D2A8FF",[501],{"type":324,"value":502},"  if",{"type":318,"tag":456,"props":504,"children":505},{"style":463},[506],{"type":324,"value":507}," (",{"type":318,"tag":456,"props":509,"children":510},{"style":489},[511],{"type":324,"value":512},"!",{"type":318,"tag":456,"props":514,"children":515},{"style":463},[516],{"type":324,"value":517},"window.churnkey ",{"type":318,"tag":456,"props":519,"children":520},{"style":489},[521],{"type":324,"value":522},"||",{"type":318,"tag":456,"props":524,"children":525},{"style":489},[526],{"type":324,"value":527}," !",{"type":318,"tag":456,"props":529,"children":530},{"style":463},[531],{"type":324,"value":532},"window.churnkey.created) {\n",{"type":318,"tag":456,"props":534,"children":536},{"class":458,"line":535},4,[537,542,547,552,558],{"type":318,"tag":456,"props":538,"children":539},{"style":463},[540],{"type":324,"value":541},"    window.churnkey ",{"type":318,"tag":456,"props":543,"children":544},{"style":489},[545],{"type":324,"value":546},"=",{"type":318,"tag":456,"props":548,"children":549},{"style":463},[550],{"type":324,"value":551}," { created: ",{"type":318,"tag":456,"props":553,"children":555},{"style":554},"--shiki-light:#0550AE;--shiki-default:#0550AE;--shiki-dark:#79C0FF",[556],{"type":324,"value":557},"true",{"type":318,"tag":456,"props":559,"children":560},{"style":463},[561],{"type":324,"value":562}," };\n",{"type":318,"tag":456,"props":564,"children":566},{"class":458,"line":565},5,[567,572,576,581,586,591,597],{"type":318,"tag":456,"props":568,"children":569},{"style":463},[570],{"type":324,"value":571},"    const a ",{"type":318,"tag":456,"props":573,"children":574},{"style":489},[575],{"type":324,"value":546},{"type":318,"tag":456,"props":577,"children":578},{"style":463},[579],{"type":324,"value":580}," document.",{"type":318,"tag":456,"props":582,"children":583},{"style":499},[584],{"type":324,"value":585},"createElement",{"type":318,"tag":456,"props":587,"children":588},{"style":463},[589],{"type":324,"value":590},"(",{"type":318,"tag":456,"props":592,"children":594},{"style":593},"--shiki-light:#0A3069;--shiki-default:#0A3069;--shiki-dark:#A5D6FF",[595],{"type":324,"value":596},"'script'",{"type":318,"tag":456,"props":598,"children":599},{"style":463},[600],{"type":324,"value":601},");\n",{"type":318,"tag":456,"props":603,"children":605},{"class":458,"line":604},6,[606,611,615,620],{"type":318,"tag":456,"props":607,"children":608},{"style":463},[609],{"type":324,"value":610},"    a.src ",{"type":318,"tag":456,"props":612,"children":613},{"style":489},[614],{"type":324,"value":546},{"type":318,"tag":456,"props":616,"children":617},{"style":593},[618],{"type":324,"value":619}," 'https://assets.churnkey.co/js/app.js?appId=YOUR_APP_ID'",{"type":318,"tag":456,"props":621,"children":622},{"style":463},[623],{"type":324,"value":624},";\n",{"type":318,"tag":456,"props":626,"children":628},{"class":458,"line":627},7,[629,634,638,643],{"type":318,"tag":456,"props":630,"children":631},{"style":463},[632],{"type":324,"value":633},"    a.async ",{"type":318,"tag":456,"props":635,"children":636},{"style":489},[637],{"type":324,"value":546},{"type":318,"tag":456,"props":639,"children":640},{"style":554},[641],{"type":324,"value":642}," true",{"type":318,"tag":456,"props":644,"children":645},{"style":463},[646],{"type":324,"value":624},{"type":318,"tag":456,"props":648,"children":650},{"class":458,"line":649},8,[651,656,660,664,669,673,677,682,687],{"type":318,"tag":456,"props":652,"children":653},{"style":463},[654],{"type":324,"value":655},"    const b ",{"type":318,"tag":456,"props":657,"children":658},{"style":489},[659],{"type":324,"value":546},{"type":318,"tag":456,"props":661,"children":662},{"style":463},[663],{"type":324,"value":580},{"type":318,"tag":456,"props":665,"children":666},{"style":499},[667],{"type":324,"value":668},"getElementsByTagName",{"type":318,"tag":456,"props":670,"children":671},{"style":463},[672],{"type":324,"value":590},{"type":318,"tag":456,"props":674,"children":675},{"style":593},[676],{"type":324,"value":596},{"type":318,"tag":456,"props":678,"children":679},{"style":463},[680],{"type":324,"value":681},")[",{"type":318,"tag":456,"props":683,"children":684},{"style":554},[685],{"type":324,"value":686},"0",{"type":318,"tag":456,"props":688,"children":689},{"style":463},[690],{"type":324,"value":691},"];\n",{"type":318,"tag":456,"props":693,"children":695},{"class":458,"line":694},9,[696],{"type":318,"tag":456,"props":697,"children":698},{"style":463},[699],{"type":324,"value":700},"    b.parentNode.insertBefore(a, b);\n",{"type":318,"tag":456,"props":702,"children":704},{"class":458,"line":703},10,[705],{"type":318,"tag":456,"props":706,"children":707},{"style":463},[708],{"type":324,"value":709},"  }\n",{"type":318,"tag":456,"props":711,"children":713},{"class":458,"line":712},11,[714,719],{"type":318,"tag":456,"props":715,"children":716},{"style":489},[717],{"type":324,"value":718},"}",{"type":318,"tag":456,"props":720,"children":721},{"style":463},[722],{"type":324,"value":723},"();\n",{"type":318,"tag":456,"props":725,"children":727},{"class":458,"line":726},12,[728,733,737],{"type":318,"tag":456,"props":729,"children":730},{"style":463},[731],{"type":324,"value":732},"\u003C/",{"type":318,"tag":456,"props":734,"children":735},{"style":469},[736],{"type":324,"value":472},{"type":318,"tag":456,"props":738,"children":739},{"style":463},[740],{"type":324,"value":477},{"type":318,"tag":319,"props":742,"children":744},{"id":743},"step-two-generate-secure-hmac-hash",[745],{"type":324,"value":746},"Step Two: Generate Secure HMAC Hash",{"type":318,"tag":748,"props":749,"children":752},"alert",{":icon":750,"type":751},"/icon/paddle-logo.webp","warning",[753,761],{"type":318,"tag":326,"props":754,"children":755},{},[756],{"type":318,"tag":340,"props":757,"children":758},{},[759],{"type":324,"value":760},"Note for Paddle Users",{"type":318,"tag":326,"props":762,"children":763},{},[764],{"type":324,"value":765},"Use the Subscription ID instead of Customer ID for creating the HMAC hash",{"type":318,"tag":326,"props":767,"children":768},{},[769],{"type":324,"value":770},"To ensure that all customer requests processed by Churnkey are authorized, server-side verification is implemented. This involves generating an HMAC hash on the customer ID (or subscription ID for Paddle users) using SHA-256 hashing. Before triggering the Churnkey flow, a request is sent to the server to (a) validate the request's authenticity, typically using existing authorization measures, and (b) compute the customer's ID hash. Below are examples in various backend languages.",{"type":318,"tag":326,"props":772,"children":773},{},[774,776,782],{"type":324,"value":775},"To find your ",{"type":318,"tag":348,"props":777,"children":779},{"className":778},[],[780],{"type":324,"value":781},"API_KEY",{"type":324,"value":783},", from any initial page in Churnkey's dashboard you can navigate:",{"type":318,"tag":332,"props":785,"children":786},{},[787,791,795],{"type":318,"tag":336,"props":788,"children":789},{},[790],{"type":324,"value":422},{"type":318,"tag":336,"props":792,"children":793},{},[794],{"type":324,"value":427},{"type":318,"tag":336,"props":796,"children":797},{},[798],{"type":324,"value":432},{"type":318,"tag":800,"props":801,"children":802},"code-group",{},[803,957,1518,1643,1737,1831,2072,2638],{"type":318,"tag":446,"props":804,"children":809},{"className":805,"code":806,"filename":807,"language":808,"meta":313,"style":313},"language-js shiki shiki-themes github-light-default github-light-default github-dark-default","const crypto = require(\"crypto\");\nconst userHash = crypto.createHmac(\n  \"sha256\",\n  API_KEY // Your Churnkey API Key (keep this safe)\n).update(CUSTOMER_ID).digest(\"hex\"); // Send to front-end\n","Node.js","js",[810],{"type":318,"tag":348,"props":811,"children":812},{"__ignoreMap":313},[813,849,880,893,907],{"type":318,"tag":456,"props":814,"children":815},{"class":458,"line":459},[816,821,826,831,836,840,845],{"type":318,"tag":456,"props":817,"children":818},{"style":489},[819],{"type":324,"value":820},"const",{"type":318,"tag":456,"props":822,"children":823},{"style":554},[824],{"type":324,"value":825}," crypto",{"type":318,"tag":456,"props":827,"children":828},{"style":489},[829],{"type":324,"value":830}," =",{"type":318,"tag":456,"props":832,"children":833},{"style":499},[834],{"type":324,"value":835}," require",{"type":318,"tag":456,"props":837,"children":838},{"style":463},[839],{"type":324,"value":590},{"type":318,"tag":456,"props":841,"children":842},{"style":593},[843],{"type":324,"value":844},"\"crypto\"",{"type":318,"tag":456,"props":846,"children":847},{"style":463},[848],{"type":324,"value":601},{"type":318,"tag":456,"props":850,"children":851},{"class":458,"line":480},[852,856,861,865,870,875],{"type":318,"tag":456,"props":853,"children":854},{"style":489},[855],{"type":324,"value":820},{"type":318,"tag":456,"props":857,"children":858},{"style":554},[859],{"type":324,"value":860}," userHash",{"type":318,"tag":456,"props":862,"children":863},{"style":489},[864],{"type":324,"value":830},{"type":318,"tag":456,"props":866,"children":867},{"style":463},[868],{"type":324,"value":869}," crypto.",{"type":318,"tag":456,"props":871,"children":872},{"style":499},[873],{"type":324,"value":874},"createHmac",{"type":318,"tag":456,"props":876,"children":877},{"style":463},[878],{"type":324,"value":879},"(\n",{"type":318,"tag":456,"props":881,"children":882},{"class":458,"line":495},[883,888],{"type":318,"tag":456,"props":884,"children":885},{"style":593},[886],{"type":324,"value":887},"  \"sha256\"",{"type":318,"tag":456,"props":889,"children":890},{"style":463},[891],{"type":324,"value":892},",\n",{"type":318,"tag":456,"props":894,"children":895},{"class":458,"line":535},[896,901],{"type":318,"tag":456,"props":897,"children":898},{"style":554},[899],{"type":324,"value":900},"  API_KEY",{"type":318,"tag":456,"props":902,"children":904},{"style":903},"--shiki-light:#6E7781;--shiki-default:#6E7781;--shiki-dark:#8B949E",[905],{"type":324,"value":906}," // Your Churnkey API Key (keep this safe)\n",{"type":318,"tag":456,"props":908,"children":909},{"class":458,"line":565},[910,915,920,924,929,933,938,942,947,952],{"type":318,"tag":456,"props":911,"children":912},{"style":463},[913],{"type":324,"value":914},").",{"type":318,"tag":456,"props":916,"children":917},{"style":499},[918],{"type":324,"value":919},"update",{"type":318,"tag":456,"props":921,"children":922},{"style":463},[923],{"type":324,"value":590},{"type":318,"tag":456,"props":925,"children":926},{"style":554},[927],{"type":324,"value":928},"CUSTOMER_ID",{"type":318,"tag":456,"props":930,"children":931},{"style":463},[932],{"type":324,"value":914},{"type":318,"tag":456,"props":934,"children":935},{"style":499},[936],{"type":324,"value":937},"digest",{"type":318,"tag":456,"props":939,"children":940},{"style":463},[941],{"type":324,"value":590},{"type":318,"tag":456,"props":943,"children":944},{"style":593},[945],{"type":324,"value":946},"\"hex\"",{"type":318,"tag":456,"props":948,"children":949},{"style":463},[950],{"type":324,"value":951},"); ",{"type":318,"tag":456,"props":953,"children":954},{"style":903},[955],{"type":324,"value":956},"// Send to front-end\n",{"type":318,"tag":446,"props":958,"children":963},{"className":959,"code":960,"filename":961,"language":962,"meta":313,"style":313},"language-ts shiki shiki-themes github-light-default github-light-default github-dark-default","import crypto from \"crypto\";\nimport type { NextApiRequest, NextApiResponse } from \"next\";\n\ntype Data = {\n  userHash?: string;\n  error?: string;\n};\n\nexport default function handler(\n  req: NextApiRequest,\n  res: NextApiResponse\u003CData>\n) {\n  const { customerId } = req.body;\n\n  if (!customerId) {\n    return res.status(400).json({ error: \"Missing customerId\" });\n  }\n\n  const API_KEY = process.env.CHURNKEY_API_KEY || \"\"; // Your Churnkey API Key\n  const userHash = crypto\n    .createHmac(\"sha256\", API_KEY)\n    .update(customerId)\n    .digest(\"hex\");\n\n  return res.status(200).json({ userHash });\n}\n","Next.js","ts",[964],{"type":318,"tag":348,"props":965,"children":966},{"__ignoreMap":313},[967,994,1024,1033,1056,1078,1098,1106,1113,1140,1158,1175,1187,1220,1228,1249,1301,1309,1317,1364,1385,1421,1438,1462,1470,1509],{"type":318,"tag":456,"props":968,"children":969},{"class":458,"line":459},[970,975,980,985,990],{"type":318,"tag":456,"props":971,"children":972},{"style":489},[973],{"type":324,"value":974},"import",{"type":318,"tag":456,"props":976,"children":977},{"style":463},[978],{"type":324,"value":979}," crypto ",{"type":318,"tag":456,"props":981,"children":982},{"style":489},[983],{"type":324,"value":984},"from",{"type":318,"tag":456,"props":986,"children":987},{"style":593},[988],{"type":324,"value":989}," \"crypto\"",{"type":318,"tag":456,"props":991,"children":992},{"style":463},[993],{"type":324,"value":624},{"type":318,"tag":456,"props":995,"children":996},{"class":458,"line":480},[997,1001,1006,1011,1015,1020],{"type":318,"tag":456,"props":998,"children":999},{"style":489},[1000],{"type":324,"value":974},{"type":318,"tag":456,"props":1002,"children":1003},{"style":489},[1004],{"type":324,"value":1005}," type",{"type":318,"tag":456,"props":1007,"children":1008},{"style":463},[1009],{"type":324,"value":1010}," { NextApiRequest, NextApiResponse } ",{"type":318,"tag":456,"props":1012,"children":1013},{"style":489},[1014],{"type":324,"value":984},{"type":318,"tag":456,"props":1016,"children":1017},{"style":593},[1018],{"type":324,"value":1019}," \"next\"",{"type":318,"tag":456,"props":1021,"children":1022},{"style":463},[1023],{"type":324,"value":624},{"type":318,"tag":456,"props":1025,"children":1026},{"class":458,"line":495},[1027],{"type":318,"tag":456,"props":1028,"children":1030},{"emptyLinePlaceholder":1029},true,[1031],{"type":324,"value":1032},"\n",{"type":318,"tag":456,"props":1034,"children":1035},{"class":458,"line":535},[1036,1041,1047,1051],{"type":318,"tag":456,"props":1037,"children":1038},{"style":489},[1039],{"type":324,"value":1040},"type",{"type":318,"tag":456,"props":1042,"children":1044},{"style":1043},"--shiki-light:#953800;--shiki-default:#953800;--shiki-dark:#FFA657",[1045],{"type":324,"value":1046}," Data",{"type":318,"tag":456,"props":1048,"children":1049},{"style":489},[1050],{"type":324,"value":830},{"type":318,"tag":456,"props":1052,"children":1053},{"style":463},[1054],{"type":324,"value":1055}," {\n",{"type":318,"tag":456,"props":1057,"children":1058},{"class":458,"line":565},[1059,1064,1069,1074],{"type":318,"tag":456,"props":1060,"children":1061},{"style":1043},[1062],{"type":324,"value":1063},"  userHash",{"type":318,"tag":456,"props":1065,"children":1066},{"style":489},[1067],{"type":324,"value":1068},"?:",{"type":318,"tag":456,"props":1070,"children":1071},{"style":554},[1072],{"type":324,"value":1073}," string",{"type":318,"tag":456,"props":1075,"children":1076},{"style":463},[1077],{"type":324,"value":624},{"type":318,"tag":456,"props":1079,"children":1080},{"class":458,"line":604},[1081,1086,1090,1094],{"type":318,"tag":456,"props":1082,"children":1083},{"style":1043},[1084],{"type":324,"value":1085},"  error",{"type":318,"tag":456,"props":1087,"children":1088},{"style":489},[1089],{"type":324,"value":1068},{"type":318,"tag":456,"props":1091,"children":1092},{"style":554},[1093],{"type":324,"value":1073},{"type":318,"tag":456,"props":1095,"children":1096},{"style":463},[1097],{"type":324,"value":624},{"type":318,"tag":456,"props":1099,"children":1100},{"class":458,"line":627},[1101],{"type":318,"tag":456,"props":1102,"children":1103},{"style":463},[1104],{"type":324,"value":1105},"};\n",{"type":318,"tag":456,"props":1107,"children":1108},{"class":458,"line":649},[1109],{"type":318,"tag":456,"props":1110,"children":1111},{"emptyLinePlaceholder":1029},[1112],{"type":324,"value":1032},{"type":318,"tag":456,"props":1114,"children":1115},{"class":458,"line":694},[1116,1121,1126,1131,1136],{"type":318,"tag":456,"props":1117,"children":1118},{"style":489},[1119],{"type":324,"value":1120},"export",{"type":318,"tag":456,"props":1122,"children":1123},{"style":489},[1124],{"type":324,"value":1125}," default",{"type":318,"tag":456,"props":1127,"children":1128},{"style":489},[1129],{"type":324,"value":1130}," function",{"type":318,"tag":456,"props":1132,"children":1133},{"style":499},[1134],{"type":324,"value":1135}," handler",{"type":318,"tag":456,"props":1137,"children":1138},{"style":1043},[1139],{"type":324,"value":879},{"type":318,"tag":456,"props":1141,"children":1142},{"class":458,"line":703},[1143,1148,1153],{"type":318,"tag":456,"props":1144,"children":1145},{"style":1043},[1146],{"type":324,"value":1147},"  req",{"type":318,"tag":456,"props":1149,"children":1150},{"style":489},[1151],{"type":324,"value":1152},":",{"type":318,"tag":456,"props":1154,"children":1155},{"style":1043},[1156],{"type":324,"value":1157}," NextApiRequest,\n",{"type":318,"tag":456,"props":1159,"children":1160},{"class":458,"line":712},[1161,1166,1170],{"type":318,"tag":456,"props":1162,"children":1163},{"style":1043},[1164],{"type":324,"value":1165},"  res",{"type":318,"tag":456,"props":1167,"children":1168},{"style":489},[1169],{"type":324,"value":1152},{"type":318,"tag":456,"props":1171,"children":1172},{"style":1043},[1173],{"type":324,"value":1174}," NextApiResponse\u003CData>\n",{"type":318,"tag":456,"props":1176,"children":1177},{"class":458,"line":726},[1178,1183],{"type":318,"tag":456,"props":1179,"children":1180},{"style":1043},[1181],{"type":324,"value":1182},") ",{"type":318,"tag":456,"props":1184,"children":1185},{"style":463},[1186],{"type":324,"value":492},{"type":318,"tag":456,"props":1188,"children":1190},{"class":458,"line":1189},13,[1191,1196,1201,1206,1211,1215],{"type":318,"tag":456,"props":1192,"children":1193},{"style":489},[1194],{"type":324,"value":1195},"  const",{"type":318,"tag":456,"props":1197,"children":1198},{"style":463},[1199],{"type":324,"value":1200}," { ",{"type":318,"tag":456,"props":1202,"children":1203},{"style":554},[1204],{"type":324,"value":1205},"customerId",{"type":318,"tag":456,"props":1207,"children":1208},{"style":463},[1209],{"type":324,"value":1210}," } ",{"type":318,"tag":456,"props":1212,"children":1213},{"style":489},[1214],{"type":324,"value":546},{"type":318,"tag":456,"props":1216,"children":1217},{"style":463},[1218],{"type":324,"value":1219}," req.body;\n",{"type":318,"tag":456,"props":1221,"children":1223},{"class":458,"line":1222},14,[1224],{"type":318,"tag":456,"props":1225,"children":1226},{"emptyLinePlaceholder":1029},[1227],{"type":324,"value":1032},{"type":318,"tag":456,"props":1229,"children":1231},{"class":458,"line":1230},15,[1232,1236,1240,1244],{"type":318,"tag":456,"props":1233,"children":1234},{"style":489},[1235],{"type":324,"value":502},{"type":318,"tag":456,"props":1237,"children":1238},{"style":463},[1239],{"type":324,"value":507},{"type":318,"tag":456,"props":1241,"children":1242},{"style":489},[1243],{"type":324,"value":512},{"type":318,"tag":456,"props":1245,"children":1246},{"style":463},[1247],{"type":324,"value":1248},"customerId) {\n",{"type":318,"tag":456,"props":1250,"children":1252},{"class":458,"line":1251},16,[1253,1258,1263,1268,1272,1277,1281,1286,1291,1296],{"type":318,"tag":456,"props":1254,"children":1255},{"style":489},[1256],{"type":324,"value":1257},"    return",{"type":318,"tag":456,"props":1259,"children":1260},{"style":463},[1261],{"type":324,"value":1262}," res.",{"type":318,"tag":456,"props":1264,"children":1265},{"style":499},[1266],{"type":324,"value":1267},"status",{"type":318,"tag":456,"props":1269,"children":1270},{"style":463},[1271],{"type":324,"value":590},{"type":318,"tag":456,"props":1273,"children":1274},{"style":554},[1275],{"type":324,"value":1276},"400",{"type":318,"tag":456,"props":1278,"children":1279},{"style":463},[1280],{"type":324,"value":914},{"type":318,"tag":456,"props":1282,"children":1283},{"style":499},[1284],{"type":324,"value":1285},"json",{"type":318,"tag":456,"props":1287,"children":1288},{"style":463},[1289],{"type":324,"value":1290},"({ error: ",{"type":318,"tag":456,"props":1292,"children":1293},{"style":593},[1294],{"type":324,"value":1295},"\"Missing customerId\"",{"type":318,"tag":456,"props":1297,"children":1298},{"style":463},[1299],{"type":324,"value":1300}," });\n",{"type":318,"tag":456,"props":1302,"children":1304},{"class":458,"line":1303},17,[1305],{"type":318,"tag":456,"props":1306,"children":1307},{"style":463},[1308],{"type":324,"value":709},{"type":318,"tag":456,"props":1310,"children":1312},{"class":458,"line":1311},18,[1313],{"type":318,"tag":456,"props":1314,"children":1315},{"emptyLinePlaceholder":1029},[1316],{"type":324,"value":1032},{"type":318,"tag":456,"props":1318,"children":1320},{"class":458,"line":1319},19,[1321,1325,1330,1334,1339,1344,1349,1354,1359],{"type":318,"tag":456,"props":1322,"children":1323},{"style":489},[1324],{"type":324,"value":1195},{"type":318,"tag":456,"props":1326,"children":1327},{"style":554},[1328],{"type":324,"value":1329}," API_KEY",{"type":318,"tag":456,"props":1331,"children":1332},{"style":489},[1333],{"type":324,"value":830},{"type":318,"tag":456,"props":1335,"children":1336},{"style":463},[1337],{"type":324,"value":1338}," process.env.",{"type":318,"tag":456,"props":1340,"children":1341},{"style":554},[1342],{"type":324,"value":1343},"CHURNKEY_API_KEY",{"type":318,"tag":456,"props":1345,"children":1346},{"style":489},[1347],{"type":324,"value":1348}," ||",{"type":318,"tag":456,"props":1350,"children":1351},{"style":593},[1352],{"type":324,"value":1353}," \"\"",{"type":318,"tag":456,"props":1355,"children":1356},{"style":463},[1357],{"type":324,"value":1358},"; ",{"type":318,"tag":456,"props":1360,"children":1361},{"style":903},[1362],{"type":324,"value":1363},"// Your Churnkey API Key\n",{"type":318,"tag":456,"props":1365,"children":1367},{"class":458,"line":1366},20,[1368,1372,1376,1380],{"type":318,"tag":456,"props":1369,"children":1370},{"style":489},[1371],{"type":324,"value":1195},{"type":318,"tag":456,"props":1373,"children":1374},{"style":554},[1375],{"type":324,"value":860},{"type":318,"tag":456,"props":1377,"children":1378},{"style":489},[1379],{"type":324,"value":830},{"type":318,"tag":456,"props":1381,"children":1382},{"style":463},[1383],{"type":324,"value":1384}," crypto\n",{"type":318,"tag":456,"props":1386,"children":1388},{"class":458,"line":1387},21,[1389,1394,1398,1402,1407,1412,1416],{"type":318,"tag":456,"props":1390,"children":1391},{"style":463},[1392],{"type":324,"value":1393},"    .",{"type":318,"tag":456,"props":1395,"children":1396},{"style":499},[1397],{"type":324,"value":874},{"type":318,"tag":456,"props":1399,"children":1400},{"style":463},[1401],{"type":324,"value":590},{"type":318,"tag":456,"props":1403,"children":1404},{"style":593},[1405],{"type":324,"value":1406},"\"sha256\"",{"type":318,"tag":456,"props":1408,"children":1409},{"style":463},[1410],{"type":324,"value":1411},", ",{"type":318,"tag":456,"props":1413,"children":1414},{"style":554},[1415],{"type":324,"value":781},{"type":318,"tag":456,"props":1417,"children":1418},{"style":463},[1419],{"type":324,"value":1420},")\n",{"type":318,"tag":456,"props":1422,"children":1424},{"class":458,"line":1423},22,[1425,1429,1433],{"type":318,"tag":456,"props":1426,"children":1427},{"style":463},[1428],{"type":324,"value":1393},{"type":318,"tag":456,"props":1430,"children":1431},{"style":499},[1432],{"type":324,"value":919},{"type":318,"tag":456,"props":1434,"children":1435},{"style":463},[1436],{"type":324,"value":1437},"(customerId)\n",{"type":318,"tag":456,"props":1439,"children":1441},{"class":458,"line":1440},23,[1442,1446,1450,1454,1458],{"type":318,"tag":456,"props":1443,"children":1444},{"style":463},[1445],{"type":324,"value":1393},{"type":318,"tag":456,"props":1447,"children":1448},{"style":499},[1449],{"type":324,"value":937},{"type":318,"tag":456,"props":1451,"children":1452},{"style":463},[1453],{"type":324,"value":590},{"type":318,"tag":456,"props":1455,"children":1456},{"style":593},[1457],{"type":324,"value":946},{"type":318,"tag":456,"props":1459,"children":1460},{"style":463},[1461],{"type":324,"value":601},{"type":318,"tag":456,"props":1463,"children":1465},{"class":458,"line":1464},24,[1466],{"type":318,"tag":456,"props":1467,"children":1468},{"emptyLinePlaceholder":1029},[1469],{"type":324,"value":1032},{"type":318,"tag":456,"props":1471,"children":1473},{"class":458,"line":1472},25,[1474,1479,1483,1487,1491,1496,1500,1504],{"type":318,"tag":456,"props":1475,"children":1476},{"style":489},[1477],{"type":324,"value":1478},"  return",{"type":318,"tag":456,"props":1480,"children":1481},{"style":463},[1482],{"type":324,"value":1262},{"type":318,"tag":456,"props":1484,"children":1485},{"style":499},[1486],{"type":324,"value":1267},{"type":318,"tag":456,"props":1488,"children":1489},{"style":463},[1490],{"type":324,"value":590},{"type":318,"tag":456,"props":1492,"children":1493},{"style":554},[1494],{"type":324,"value":1495},"200",{"type":318,"tag":456,"props":1497,"children":1498},{"style":463},[1499],{"type":324,"value":914},{"type":318,"tag":456,"props":1501,"children":1502},{"style":499},[1503],{"type":324,"value":1285},{"type":318,"tag":456,"props":1505,"children":1506},{"style":463},[1507],{"type":324,"value":1508},"({ userHash });\n",{"type":318,"tag":456,"props":1510,"children":1512},{"class":458,"line":1511},26,[1513],{"type":318,"tag":456,"props":1514,"children":1515},{"style":463},[1516],{"type":324,"value":1517},"}\n",{"type":318,"tag":446,"props":1519,"children":1524},{"className":1520,"code":1521,"filename":1522,"language":1523,"meta":313,"style":313},"language-python shiki shiki-themes github-light-default github-light-default github-dark-default","import hmac\nimport hashlib\n\nuser_hash = hmac.new(\n    API_KEY, # Your Churnkey API Key (keep safe)\n    CUSTOMER_ID, # Stripe Customer ID\n    digestmod=hashlib.sha256\n).hexdigest()\n# Send user_hash to front-end\n","Python (Django)","python",[1525],{"type":318,"tag":348,"props":1526,"children":1527},{"__ignoreMap":313},[1528,1540,1552,1559,1576,1593,1610,1627,1635],{"type":318,"tag":456,"props":1529,"children":1530},{"class":458,"line":459},[1531,1535],{"type":318,"tag":456,"props":1532,"children":1533},{"style":489},[1534],{"type":324,"value":974},{"type":318,"tag":456,"props":1536,"children":1537},{"style":463},[1538],{"type":324,"value":1539}," hmac\n",{"type":318,"tag":456,"props":1541,"children":1542},{"class":458,"line":480},[1543,1547],{"type":318,"tag":456,"props":1544,"children":1545},{"style":489},[1546],{"type":324,"value":974},{"type":318,"tag":456,"props":1548,"children":1549},{"style":463},[1550],{"type":324,"value":1551}," hashlib\n",{"type":318,"tag":456,"props":1553,"children":1554},{"class":458,"line":495},[1555],{"type":318,"tag":456,"props":1556,"children":1557},{"emptyLinePlaceholder":1029},[1558],{"type":324,"value":1032},{"type":318,"tag":456,"props":1560,"children":1561},{"class":458,"line":535},[1562,1567,1571],{"type":318,"tag":456,"props":1563,"children":1564},{"style":463},[1565],{"type":324,"value":1566},"user_hash ",{"type":318,"tag":456,"props":1568,"children":1569},{"style":489},[1570],{"type":324,"value":546},{"type":318,"tag":456,"props":1572,"children":1573},{"style":463},[1574],{"type":324,"value":1575}," hmac.new(\n",{"type":318,"tag":456,"props":1577,"children":1578},{"class":458,"line":565},[1579,1584,1588],{"type":318,"tag":456,"props":1580,"children":1581},{"style":554},[1582],{"type":324,"value":1583},"    API_KEY",{"type":318,"tag":456,"props":1585,"children":1586},{"style":463},[1587],{"type":324,"value":1411},{"type":318,"tag":456,"props":1589,"children":1590},{"style":903},[1591],{"type":324,"value":1592},"# Your Churnkey API Key (keep safe)\n",{"type":318,"tag":456,"props":1594,"children":1595},{"class":458,"line":604},[1596,1601,1605],{"type":318,"tag":456,"props":1597,"children":1598},{"style":554},[1599],{"type":324,"value":1600},"    CUSTOMER_ID",{"type":318,"tag":456,"props":1602,"children":1603},{"style":463},[1604],{"type":324,"value":1411},{"type":318,"tag":456,"props":1606,"children":1607},{"style":903},[1608],{"type":324,"value":1609},"# Stripe Customer ID\n",{"type":318,"tag":456,"props":1611,"children":1612},{"class":458,"line":627},[1613,1618,1622],{"type":318,"tag":456,"props":1614,"children":1615},{"style":1043},[1616],{"type":324,"value":1617},"    digestmod",{"type":318,"tag":456,"props":1619,"children":1620},{"style":489},[1621],{"type":324,"value":546},{"type":318,"tag":456,"props":1623,"children":1624},{"style":463},[1625],{"type":324,"value":1626},"hashlib.sha256\n",{"type":318,"tag":456,"props":1628,"children":1629},{"class":458,"line":649},[1630],{"type":318,"tag":456,"props":1631,"children":1632},{"style":463},[1633],{"type":324,"value":1634},").hexdigest()\n",{"type":318,"tag":456,"props":1636,"children":1637},{"class":458,"line":694},[1638],{"type":318,"tag":456,"props":1639,"children":1640},{"style":903},[1641],{"type":324,"value":1642},"# Send user_hash to front-end\n",{"type":318,"tag":446,"props":1644,"children":1649},{"className":1645,"code":1646,"filename":1647,"language":1648,"meta":313,"style":313},"language-ruby shiki shiki-themes github-light-default github-light-default github-dark-default","user_hash = OpenSSL::HMAC.hexdigest(\n  \"sha256\",\n  API_KEY, # Your Churnkey API Key (keep safe)\n  CUSTOMER_ID # Stripe Customer ID\n)\n# Send user_hash to front-end\n","Ruby (Rails)","ruby",[1650],{"type":318,"tag":348,"props":1651,"children":1652},{"__ignoreMap":313},[1653,1684,1695,1710,1723,1730],{"type":318,"tag":456,"props":1654,"children":1655},{"class":458,"line":459},[1656,1660,1664,1669,1674,1679],{"type":318,"tag":456,"props":1657,"children":1658},{"style":463},[1659],{"type":324,"value":1566},{"type":318,"tag":456,"props":1661,"children":1662},{"style":489},[1663],{"type":324,"value":546},{"type":318,"tag":456,"props":1665,"children":1666},{"style":554},[1667],{"type":324,"value":1668}," OpenSSL",{"type":318,"tag":456,"props":1670,"children":1671},{"style":463},[1672],{"type":324,"value":1673},"::",{"type":318,"tag":456,"props":1675,"children":1676},{"style":554},[1677],{"type":324,"value":1678},"HMAC",{"type":318,"tag":456,"props":1680,"children":1681},{"style":463},[1682],{"type":324,"value":1683},".hexdigest(\n",{"type":318,"tag":456,"props":1685,"children":1686},{"class":458,"line":480},[1687,1691],{"type":318,"tag":456,"props":1688,"children":1689},{"style":593},[1690],{"type":324,"value":887},{"type":318,"tag":456,"props":1692,"children":1693},{"style":463},[1694],{"type":324,"value":892},{"type":318,"tag":456,"props":1696,"children":1697},{"class":458,"line":495},[1698,1702,1706],{"type":318,"tag":456,"props":1699,"children":1700},{"style":554},[1701],{"type":324,"value":900},{"type":318,"tag":456,"props":1703,"children":1704},{"style":463},[1705],{"type":324,"value":1411},{"type":318,"tag":456,"props":1707,"children":1708},{"style":903},[1709],{"type":324,"value":1592},{"type":318,"tag":456,"props":1711,"children":1712},{"class":458,"line":535},[1713,1718],{"type":318,"tag":456,"props":1714,"children":1715},{"style":554},[1716],{"type":324,"value":1717},"  CUSTOMER_ID",{"type":318,"tag":456,"props":1719,"children":1720},{"style":903},[1721],{"type":324,"value":1722}," # Stripe Customer ID\n",{"type":318,"tag":456,"props":1724,"children":1725},{"class":458,"line":565},[1726],{"type":318,"tag":456,"props":1727,"children":1728},{"style":463},[1729],{"type":324,"value":1420},{"type":318,"tag":456,"props":1731,"children":1732},{"class":458,"line":604},[1733],{"type":318,"tag":456,"props":1734,"children":1735},{"style":903},[1736],{"type":324,"value":1642},{"type":318,"tag":446,"props":1738,"children":1743},{"className":1739,"code":1740,"filename":1741,"language":1742,"meta":313,"style":313},"language-php shiki shiki-themes github-light-default github-light-default github-dark-default","\u003C?php\n$user_hash = hash_hmac('sha256', CUSTOMER_ID, API_KEY);\necho $user_hash; // Send to front-end\n?>\n","PHP","php",[1744],{"type":318,"tag":348,"props":1745,"children":1746},{"__ignoreMap":313},[1747,1760,1806,1823],{"type":318,"tag":456,"props":1748,"children":1749},{"class":458,"line":459},[1750,1755],{"type":318,"tag":456,"props":1751,"children":1752},{"style":489},[1753],{"type":324,"value":1754},"\u003C?",{"type":318,"tag":456,"props":1756,"children":1757},{"style":554},[1758],{"type":324,"value":1759},"php\n",{"type":318,"tag":456,"props":1761,"children":1762},{"class":458,"line":480},[1763,1768,1772,1777,1781,1786,1790,1794,1798,1802],{"type":318,"tag":456,"props":1764,"children":1765},{"style":463},[1766],{"type":324,"value":1767},"$user_hash ",{"type":318,"tag":456,"props":1769,"children":1770},{"style":489},[1771],{"type":324,"value":546},{"type":318,"tag":456,"props":1773,"children":1774},{"style":554},[1775],{"type":324,"value":1776}," hash_hmac",{"type":318,"tag":456,"props":1778,"children":1779},{"style":463},[1780],{"type":324,"value":590},{"type":318,"tag":456,"props":1782,"children":1783},{"style":593},[1784],{"type":324,"value":1785},"'sha256'",{"type":318,"tag":456,"props":1787,"children":1788},{"style":463},[1789],{"type":324,"value":1411},{"type":318,"tag":456,"props":1791,"children":1792},{"style":554},[1793],{"type":324,"value":928},{"type":318,"tag":456,"props":1795,"children":1796},{"style":463},[1797],{"type":324,"value":1411},{"type":318,"tag":456,"props":1799,"children":1800},{"style":554},[1801],{"type":324,"value":781},{"type":318,"tag":456,"props":1803,"children":1804},{"style":463},[1805],{"type":324,"value":601},{"type":318,"tag":456,"props":1807,"children":1808},{"class":458,"line":495},[1809,1814,1819],{"type":318,"tag":456,"props":1810,"children":1811},{"style":554},[1812],{"type":324,"value":1813},"echo",{"type":318,"tag":456,"props":1815,"children":1816},{"style":463},[1817],{"type":324,"value":1818}," $user_hash; ",{"type":318,"tag":456,"props":1820,"children":1821},{"style":903},[1822],{"type":324,"value":956},{"type":318,"tag":456,"props":1824,"children":1825},{"class":458,"line":535},[1826],{"type":318,"tag":456,"props":1827,"children":1828},{"style":489},[1829],{"type":324,"value":1830},"?>\n",{"type":318,"tag":446,"props":1832,"children":1837},{"className":1833,"code":1834,"filename":1835,"language":1836,"meta":313,"style":313},"language-go shiki shiki-themes github-light-default github-light-default github-dark-default","package main\n\nimport (\n    \"crypto/hmac\"\n    \"crypto/sha256\"\n    \"encoding/hex\"\n)\n\nfunc main() {\n    h := hmac.New(sha256.New, API_KEY) // Your Churnkey API Key (keep safe)\n    h.Write(CUSTOMER_ID)                // Stripe Customer ID\n    userHash := hex.EncodeToString(h.Sum(nil))\n    // Send userHash to front-end\n}\n","GO","go",[1838],{"type":318,"tag":348,"props":1839,"children":1840},{"__ignoreMap":313},[1841,1854,1861,1873,1891,1907,1923,1930,1937,1955,1988,2011,2057,2065],{"type":318,"tag":456,"props":1842,"children":1843},{"class":458,"line":459},[1844,1849],{"type":318,"tag":456,"props":1845,"children":1846},{"style":489},[1847],{"type":324,"value":1848},"package",{"type":318,"tag":456,"props":1850,"children":1851},{"style":1043},[1852],{"type":324,"value":1853}," main\n",{"type":318,"tag":456,"props":1855,"children":1856},{"class":458,"line":480},[1857],{"type":318,"tag":456,"props":1858,"children":1859},{"emptyLinePlaceholder":1029},[1860],{"type":324,"value":1032},{"type":318,"tag":456,"props":1862,"children":1863},{"class":458,"line":495},[1864,1868],{"type":318,"tag":456,"props":1865,"children":1866},{"style":489},[1867],{"type":324,"value":974},{"type":318,"tag":456,"props":1869,"children":1870},{"style":463},[1871],{"type":324,"value":1872}," (\n",{"type":318,"tag":456,"props":1874,"children":1875},{"class":458,"line":535},[1876,1881,1886],{"type":318,"tag":456,"props":1877,"children":1878},{"style":593},[1879],{"type":324,"value":1880},"    \"",{"type":318,"tag":456,"props":1882,"children":1883},{"style":1043},[1884],{"type":324,"value":1885},"crypto/hmac",{"type":318,"tag":456,"props":1887,"children":1888},{"style":593},[1889],{"type":324,"value":1890},"\"\n",{"type":318,"tag":456,"props":1892,"children":1893},{"class":458,"line":565},[1894,1898,1903],{"type":318,"tag":456,"props":1895,"children":1896},{"style":593},[1897],{"type":324,"value":1880},{"type":318,"tag":456,"props":1899,"children":1900},{"style":1043},[1901],{"type":324,"value":1902},"crypto/sha256",{"type":318,"tag":456,"props":1904,"children":1905},{"style":593},[1906],{"type":324,"value":1890},{"type":318,"tag":456,"props":1908,"children":1909},{"class":458,"line":604},[1910,1914,1919],{"type":318,"tag":456,"props":1911,"children":1912},{"style":593},[1913],{"type":324,"value":1880},{"type":318,"tag":456,"props":1915,"children":1916},{"style":1043},[1917],{"type":324,"value":1918},"encoding/hex",{"type":318,"tag":456,"props":1920,"children":1921},{"style":593},[1922],{"type":324,"value":1890},{"type":318,"tag":456,"props":1924,"children":1925},{"class":458,"line":627},[1926],{"type":318,"tag":456,"props":1927,"children":1928},{"style":463},[1929],{"type":324,"value":1420},{"type":318,"tag":456,"props":1931,"children":1932},{"class":458,"line":649},[1933],{"type":318,"tag":456,"props":1934,"children":1935},{"emptyLinePlaceholder":1029},[1936],{"type":324,"value":1032},{"type":318,"tag":456,"props":1938,"children":1939},{"class":458,"line":694},[1940,1945,1950],{"type":318,"tag":456,"props":1941,"children":1942},{"style":489},[1943],{"type":324,"value":1944},"func",{"type":318,"tag":456,"props":1946,"children":1947},{"style":499},[1948],{"type":324,"value":1949}," main",{"type":318,"tag":456,"props":1951,"children":1952},{"style":463},[1953],{"type":324,"value":1954},"() {\n",{"type":318,"tag":456,"props":1956,"children":1957},{"class":458,"line":703},[1958,1963,1968,1973,1978,1983],{"type":318,"tag":456,"props":1959,"children":1960},{"style":463},[1961],{"type":324,"value":1962},"    h ",{"type":318,"tag":456,"props":1964,"children":1965},{"style":489},[1966],{"type":324,"value":1967},":=",{"type":318,"tag":456,"props":1969,"children":1970},{"style":463},[1971],{"type":324,"value":1972}," hmac.",{"type":318,"tag":456,"props":1974,"children":1975},{"style":499},[1976],{"type":324,"value":1977},"New",{"type":318,"tag":456,"props":1979,"children":1980},{"style":463},[1981],{"type":324,"value":1982},"(sha256.New, API_KEY) ",{"type":318,"tag":456,"props":1984,"children":1985},{"style":903},[1986],{"type":324,"value":1987},"// Your Churnkey API Key (keep safe)\n",{"type":318,"tag":456,"props":1989,"children":1990},{"class":458,"line":712},[1991,1996,2001,2006],{"type":318,"tag":456,"props":1992,"children":1993},{"style":463},[1994],{"type":324,"value":1995},"    h.",{"type":318,"tag":456,"props":1997,"children":1998},{"style":499},[1999],{"type":324,"value":2000},"Write",{"type":318,"tag":456,"props":2002,"children":2003},{"style":463},[2004],{"type":324,"value":2005},"(CUSTOMER_ID)                ",{"type":318,"tag":456,"props":2007,"children":2008},{"style":903},[2009],{"type":324,"value":2010},"// Stripe Customer ID\n",{"type":318,"tag":456,"props":2012,"children":2013},{"class":458,"line":726},[2014,2019,2023,2028,2033,2038,2043,2047,2052],{"type":318,"tag":456,"props":2015,"children":2016},{"style":463},[2017],{"type":324,"value":2018},"    userHash ",{"type":318,"tag":456,"props":2020,"children":2021},{"style":489},[2022],{"type":324,"value":1967},{"type":318,"tag":456,"props":2024,"children":2025},{"style":463},[2026],{"type":324,"value":2027}," hex.",{"type":318,"tag":456,"props":2029,"children":2030},{"style":499},[2031],{"type":324,"value":2032},"EncodeToString",{"type":318,"tag":456,"props":2034,"children":2035},{"style":463},[2036],{"type":324,"value":2037},"(h.",{"type":318,"tag":456,"props":2039,"children":2040},{"style":499},[2041],{"type":324,"value":2042},"Sum",{"type":318,"tag":456,"props":2044,"children":2045},{"style":463},[2046],{"type":324,"value":590},{"type":318,"tag":456,"props":2048,"children":2049},{"style":554},[2050],{"type":324,"value":2051},"nil",{"type":318,"tag":456,"props":2053,"children":2054},{"style":463},[2055],{"type":324,"value":2056},"))\n",{"type":318,"tag":456,"props":2058,"children":2059},{"class":458,"line":1189},[2060],{"type":318,"tag":456,"props":2061,"children":2062},{"style":903},[2063],{"type":324,"value":2064},"    // Send userHash to front-end\n",{"type":318,"tag":456,"props":2066,"children":2067},{"class":458,"line":1222},[2068],{"type":318,"tag":456,"props":2069,"children":2070},{"style":463},[2071],{"type":324,"value":1517},{"type":318,"tag":446,"props":2073,"children":2078},{"className":2074,"code":2075,"filename":2076,"language":2077,"meta":313,"style":313},"language-java shiki shiki-themes github-light-default github-light-default github-dark-default","import javax.crypto.Mac;\nimport javax.crypto.spec.SecretKeySpec;\n\npublic class Test {\n    public static void main(String[] args) {\n        try {\n            String secret = API_KEY; // Your Churnkey API Key (keep safe)\n            String message = CUSTOMER_ID; // Stripe Customer ID\n\n            Mac sha256HMAC = Mac.getInstance(\"HmacSHA256\");\n            SecretKeySpec secretKey = new SecretKeySpec(secret.getBytes(), \"HmacSHA256\");\n            sha256HMAC.init(secretKey);\n\n            byte[] hash = sha256HMAC.doFinal(message.getBytes());\n            StringBuffer userHash = new StringBuffer();\n            for (byte b : hash) {\n                userHash.append(String.format(\"%02x\", b));\n            }\n            System.out.println(userHash.toString()); // Send to front-end\n        } catch (Exception e) {\n            System.out.println(\"Error: \" + e.getMessage());\n        }\n    }\n}\n","Java","java",[2079],{"type":318,"tag":348,"props":2080,"children":2081},{"__ignoreMap":313},[2082,2094,2106,2113,2135,2181,2193,2219,2244,2251,2291,2341,2359,2366,2411,2440,2472,2509,2517,2549,2576,2615,2623,2631],{"type":318,"tag":456,"props":2083,"children":2084},{"class":458,"line":459},[2085,2089],{"type":318,"tag":456,"props":2086,"children":2087},{"style":489},[2088],{"type":324,"value":974},{"type":318,"tag":456,"props":2090,"children":2091},{"style":463},[2092],{"type":324,"value":2093}," javax.crypto.Mac;\n",{"type":318,"tag":456,"props":2095,"children":2096},{"class":458,"line":480},[2097,2101],{"type":318,"tag":456,"props":2098,"children":2099},{"style":489},[2100],{"type":324,"value":974},{"type":318,"tag":456,"props":2102,"children":2103},{"style":463},[2104],{"type":324,"value":2105}," javax.crypto.spec.SecretKeySpec;\n",{"type":318,"tag":456,"props":2107,"children":2108},{"class":458,"line":495},[2109],{"type":318,"tag":456,"props":2110,"children":2111},{"emptyLinePlaceholder":1029},[2112],{"type":324,"value":1032},{"type":318,"tag":456,"props":2114,"children":2115},{"class":458,"line":535},[2116,2121,2126,2131],{"type":318,"tag":456,"props":2117,"children":2118},{"style":489},[2119],{"type":324,"value":2120},"public",{"type":318,"tag":456,"props":2122,"children":2123},{"style":489},[2124],{"type":324,"value":2125}," class",{"type":318,"tag":456,"props":2127,"children":2128},{"style":1043},[2129],{"type":324,"value":2130}," Test",{"type":318,"tag":456,"props":2132,"children":2133},{"style":463},[2134],{"type":324,"value":1055},{"type":318,"tag":456,"props":2136,"children":2137},{"class":458,"line":565},[2138,2143,2148,2153,2157,2161,2166,2171,2176],{"type":318,"tag":456,"props":2139,"children":2140},{"style":489},[2141],{"type":324,"value":2142},"    public",{"type":318,"tag":456,"props":2144,"children":2145},{"style":489},[2146],{"type":324,"value":2147}," static",{"type":318,"tag":456,"props":2149,"children":2150},{"style":489},[2151],{"type":324,"value":2152}," void",{"type":318,"tag":456,"props":2154,"children":2155},{"style":499},[2156],{"type":324,"value":1949},{"type":318,"tag":456,"props":2158,"children":2159},{"style":463},[2160],{"type":324,"value":590},{"type":318,"tag":456,"props":2162,"children":2163},{"style":489},[2164],{"type":324,"value":2165},"String",{"type":318,"tag":456,"props":2167,"children":2168},{"style":463},[2169],{"type":324,"value":2170},"[] ",{"type":318,"tag":456,"props":2172,"children":2173},{"style":1043},[2174],{"type":324,"value":2175},"args",{"type":318,"tag":456,"props":2177,"children":2178},{"style":463},[2179],{"type":324,"value":2180},") {\n",{"type":318,"tag":456,"props":2182,"children":2183},{"class":458,"line":604},[2184,2189],{"type":318,"tag":456,"props":2185,"children":2186},{"style":489},[2187],{"type":324,"value":2188},"        try",{"type":318,"tag":456,"props":2190,"children":2191},{"style":463},[2192],{"type":324,"value":1055},{"type":318,"tag":456,"props":2194,"children":2195},{"class":458,"line":627},[2196,2201,2206,2210,2215],{"type":318,"tag":456,"props":2197,"children":2198},{"style":463},[2199],{"type":324,"value":2200},"            String",{"type":318,"tag":456,"props":2202,"children":2203},{"style":463},[2204],{"type":324,"value":2205}," secret",{"type":318,"tag":456,"props":2207,"children":2208},{"style":489},[2209],{"type":324,"value":830},{"type":318,"tag":456,"props":2211,"children":2212},{"style":463},[2213],{"type":324,"value":2214}," API_KEY; ",{"type":318,"tag":456,"props":2216,"children":2217},{"style":903},[2218],{"type":324,"value":1987},{"type":318,"tag":456,"props":2220,"children":2221},{"class":458,"line":649},[2222,2226,2231,2235,2240],{"type":318,"tag":456,"props":2223,"children":2224},{"style":463},[2225],{"type":324,"value":2200},{"type":318,"tag":456,"props":2227,"children":2228},{"style":463},[2229],{"type":324,"value":2230}," message",{"type":318,"tag":456,"props":2232,"children":2233},{"style":489},[2234],{"type":324,"value":830},{"type":318,"tag":456,"props":2236,"children":2237},{"style":463},[2238],{"type":324,"value":2239}," CUSTOMER_ID; ",{"type":318,"tag":456,"props":2241,"children":2242},{"style":903},[2243],{"type":324,"value":2010},{"type":318,"tag":456,"props":2245,"children":2246},{"class":458,"line":694},[2247],{"type":318,"tag":456,"props":2248,"children":2249},{"emptyLinePlaceholder":1029},[2250],{"type":324,"value":1032},{"type":318,"tag":456,"props":2252,"children":2253},{"class":458,"line":703},[2254,2259,2264,2268,2273,2278,2282,2287],{"type":318,"tag":456,"props":2255,"children":2256},{"style":463},[2257],{"type":324,"value":2258},"            Mac",{"type":318,"tag":456,"props":2260,"children":2261},{"style":463},[2262],{"type":324,"value":2263}," sha256HMAC",{"type":318,"tag":456,"props":2265,"children":2266},{"style":489},[2267],{"type":324,"value":830},{"type":318,"tag":456,"props":2269,"children":2270},{"style":463},[2271],{"type":324,"value":2272}," Mac.",{"type":318,"tag":456,"props":2274,"children":2275},{"style":499},[2276],{"type":324,"value":2277},"getInstance",{"type":318,"tag":456,"props":2279,"children":2280},{"style":463},[2281],{"type":324,"value":590},{"type":318,"tag":456,"props":2283,"children":2284},{"style":593},[2285],{"type":324,"value":2286},"\"HmacSHA256\"",{"type":318,"tag":456,"props":2288,"children":2289},{"style":463},[2290],{"type":324,"value":601},{"type":318,"tag":456,"props":2292,"children":2293},{"class":458,"line":712},[2294,2299,2304,2308,2313,2318,2323,2328,2333,2337],{"type":318,"tag":456,"props":2295,"children":2296},{"style":463},[2297],{"type":324,"value":2298},"            SecretKeySpec",{"type":318,"tag":456,"props":2300,"children":2301},{"style":463},[2302],{"type":324,"value":2303}," secretKey",{"type":318,"tag":456,"props":2305,"children":2306},{"style":489},[2307],{"type":324,"value":830},{"type":318,"tag":456,"props":2309,"children":2310},{"style":489},[2311],{"type":324,"value":2312}," new",{"type":318,"tag":456,"props":2314,"children":2315},{"style":499},[2316],{"type":324,"value":2317}," SecretKeySpec",{"type":318,"tag":456,"props":2319,"children":2320},{"style":463},[2321],{"type":324,"value":2322},"(secret.",{"type":318,"tag":456,"props":2324,"children":2325},{"style":499},[2326],{"type":324,"value":2327},"getBytes",{"type":318,"tag":456,"props":2329,"children":2330},{"style":463},[2331],{"type":324,"value":2332},"(), ",{"type":318,"tag":456,"props":2334,"children":2335},{"style":593},[2336],{"type":324,"value":2286},{"type":318,"tag":456,"props":2338,"children":2339},{"style":463},[2340],{"type":324,"value":601},{"type":318,"tag":456,"props":2342,"children":2343},{"class":458,"line":726},[2344,2349,2354],{"type":318,"tag":456,"props":2345,"children":2346},{"style":463},[2347],{"type":324,"value":2348},"            sha256HMAC.",{"type":318,"tag":456,"props":2350,"children":2351},{"style":499},[2352],{"type":324,"value":2353},"init",{"type":318,"tag":456,"props":2355,"children":2356},{"style":463},[2357],{"type":324,"value":2358},"(secretKey);\n",{"type":318,"tag":456,"props":2360,"children":2361},{"class":458,"line":1189},[2362],{"type":318,"tag":456,"props":2363,"children":2364},{"emptyLinePlaceholder":1029},[2365],{"type":324,"value":1032},{"type":318,"tag":456,"props":2367,"children":2368},{"class":458,"line":1222},[2369,2374,2378,2383,2387,2392,2397,2402,2406],{"type":318,"tag":456,"props":2370,"children":2371},{"style":489},[2372],{"type":324,"value":2373},"            byte",{"type":318,"tag":456,"props":2375,"children":2376},{"style":1043},[2377],{"type":324,"value":2170},{"type":318,"tag":456,"props":2379,"children":2380},{"style":463},[2381],{"type":324,"value":2382},"hash",{"type":318,"tag":456,"props":2384,"children":2385},{"style":489},[2386],{"type":324,"value":830},{"type":318,"tag":456,"props":2388,"children":2389},{"style":463},[2390],{"type":324,"value":2391}," sha256HMAC.",{"type":318,"tag":456,"props":2393,"children":2394},{"style":499},[2395],{"type":324,"value":2396},"doFinal",{"type":318,"tag":456,"props":2398,"children":2399},{"style":463},[2400],{"type":324,"value":2401},"(message.",{"type":318,"tag":456,"props":2403,"children":2404},{"style":499},[2405],{"type":324,"value":2327},{"type":318,"tag":456,"props":2407,"children":2408},{"style":463},[2409],{"type":324,"value":2410},"());\n",{"type":318,"tag":456,"props":2412,"children":2413},{"class":458,"line":1230},[2414,2419,2423,2427,2431,2436],{"type":318,"tag":456,"props":2415,"children":2416},{"style":463},[2417],{"type":324,"value":2418},"            StringBuffer",{"type":318,"tag":456,"props":2420,"children":2421},{"style":463},[2422],{"type":324,"value":860},{"type":318,"tag":456,"props":2424,"children":2425},{"style":489},[2426],{"type":324,"value":830},{"type":318,"tag":456,"props":2428,"children":2429},{"style":489},[2430],{"type":324,"value":2312},{"type":318,"tag":456,"props":2432,"children":2433},{"style":499},[2434],{"type":324,"value":2435}," StringBuffer",{"type":318,"tag":456,"props":2437,"children":2438},{"style":463},[2439],{"type":324,"value":723},{"type":318,"tag":456,"props":2441,"children":2442},{"class":458,"line":1251},[2443,2448,2452,2457,2462,2467],{"type":318,"tag":456,"props":2444,"children":2445},{"style":489},[2446],{"type":324,"value":2447},"            for",{"type":318,"tag":456,"props":2449,"children":2450},{"style":463},[2451],{"type":324,"value":507},{"type":318,"tag":456,"props":2453,"children":2454},{"style":489},[2455],{"type":324,"value":2456},"byte",{"type":318,"tag":456,"props":2458,"children":2459},{"style":463},[2460],{"type":324,"value":2461}," b",{"type":318,"tag":456,"props":2463,"children":2464},{"style":489},[2465],{"type":324,"value":2466}," :",{"type":318,"tag":456,"props":2468,"children":2469},{"style":463},[2470],{"type":324,"value":2471}," hash) {\n",{"type":318,"tag":456,"props":2473,"children":2474},{"class":458,"line":1303},[2475,2480,2485,2490,2495,2499,2504],{"type":318,"tag":456,"props":2476,"children":2477},{"style":463},[2478],{"type":324,"value":2479},"                userHash.",{"type":318,"tag":456,"props":2481,"children":2482},{"style":499},[2483],{"type":324,"value":2484},"append",{"type":318,"tag":456,"props":2486,"children":2487},{"style":463},[2488],{"type":324,"value":2489},"(String.",{"type":318,"tag":456,"props":2491,"children":2492},{"style":499},[2493],{"type":324,"value":2494},"format",{"type":318,"tag":456,"props":2496,"children":2497},{"style":463},[2498],{"type":324,"value":590},{"type":318,"tag":456,"props":2500,"children":2501},{"style":593},[2502],{"type":324,"value":2503},"\"%02x\"",{"type":318,"tag":456,"props":2505,"children":2506},{"style":463},[2507],{"type":324,"value":2508},", b));\n",{"type":318,"tag":456,"props":2510,"children":2511},{"class":458,"line":1311},[2512],{"type":318,"tag":456,"props":2513,"children":2514},{"style":463},[2515],{"type":324,"value":2516},"            }\n",{"type":318,"tag":456,"props":2518,"children":2519},{"class":458,"line":1319},[2520,2525,2530,2535,2540,2545],{"type":318,"tag":456,"props":2521,"children":2522},{"style":463},[2523],{"type":324,"value":2524},"            System.out.",{"type":318,"tag":456,"props":2526,"children":2527},{"style":499},[2528],{"type":324,"value":2529},"println",{"type":318,"tag":456,"props":2531,"children":2532},{"style":463},[2533],{"type":324,"value":2534},"(userHash.",{"type":318,"tag":456,"props":2536,"children":2537},{"style":499},[2538],{"type":324,"value":2539},"toString",{"type":318,"tag":456,"props":2541,"children":2542},{"style":463},[2543],{"type":324,"value":2544},"()); ",{"type":318,"tag":456,"props":2546,"children":2547},{"style":903},[2548],{"type":324,"value":956},{"type":318,"tag":456,"props":2550,"children":2551},{"class":458,"line":1366},[2552,2557,2562,2567,2572],{"type":318,"tag":456,"props":2553,"children":2554},{"style":463},[2555],{"type":324,"value":2556},"        } ",{"type":318,"tag":456,"props":2558,"children":2559},{"style":489},[2560],{"type":324,"value":2561},"catch",{"type":318,"tag":456,"props":2563,"children":2564},{"style":463},[2565],{"type":324,"value":2566}," (Exception ",{"type":318,"tag":456,"props":2568,"children":2569},{"style":1043},[2570],{"type":324,"value":2571},"e",{"type":318,"tag":456,"props":2573,"children":2574},{"style":463},[2575],{"type":324,"value":2180},{"type":318,"tag":456,"props":2577,"children":2578},{"class":458,"line":1387},[2579,2583,2587,2591,2596,2601,2606,2611],{"type":318,"tag":456,"props":2580,"children":2581},{"style":463},[2582],{"type":324,"value":2524},{"type":318,"tag":456,"props":2584,"children":2585},{"style":499},[2586],{"type":324,"value":2529},{"type":318,"tag":456,"props":2588,"children":2589},{"style":463},[2590],{"type":324,"value":590},{"type":318,"tag":456,"props":2592,"children":2593},{"style":593},[2594],{"type":324,"value":2595},"\"Error: \"",{"type":318,"tag":456,"props":2597,"children":2598},{"style":489},[2599],{"type":324,"value":2600}," +",{"type":318,"tag":456,"props":2602,"children":2603},{"style":463},[2604],{"type":324,"value":2605}," e.",{"type":318,"tag":456,"props":2607,"children":2608},{"style":499},[2609],{"type":324,"value":2610},"getMessage",{"type":318,"tag":456,"props":2612,"children":2613},{"style":463},[2614],{"type":324,"value":2410},{"type":318,"tag":456,"props":2616,"children":2617},{"class":458,"line":1423},[2618],{"type":318,"tag":456,"props":2619,"children":2620},{"style":463},[2621],{"type":324,"value":2622},"        }\n",{"type":318,"tag":456,"props":2624,"children":2625},{"class":458,"line":1440},[2626],{"type":318,"tag":456,"props":2627,"children":2628},{"style":463},[2629],{"type":324,"value":2630},"    }\n",{"type":318,"tag":456,"props":2632,"children":2633},{"class":458,"line":1464},[2634],{"type":318,"tag":456,"props":2635,"children":2636},{"style":463},[2637],{"type":324,"value":1517},{"type":318,"tag":446,"props":2639,"children":2644},{"className":2640,"code":2641,"filename":2642,"language":2643,"meta":313,"style":313},"language-csharp shiki shiki-themes github-light-default github-light-default github-dark-default","using System;\nusing System.Security.Cryptography;\nusing System.Text;\n\npublic class Test\n{\n    public static void Main(string[] args)\n    {\n        try\n        {\n            string secret = API_KEY; // Your Churnkey API Key (keep safe)\n            string message = CUSTOMER_ID; // Stripe Customer ID\n\n            using (var hmacsha256 = new HMACSHA256(Encoding.UTF8.GetBytes(secret)))\n            {\n                byte[] hash = hmacsha256.ComputeHash(Encoding.UTF8.GetBytes(message));\n                StringBuilder userHash = new StringBuilder();\n                foreach (byte b in hash)\n                {\n                    userHash.Append(b.ToString(\"x2\"));\n                }\n                Console.WriteLine(userHash.ToString()); // Send to front-end\n            }\n        }\n        catch (Exception e)\n        {\n            Console.WriteLine(\"Error: \" + e.Message);\n        }\n    }\n}\n","C#","csharp",[2645],{"type":318,"tag":348,"props":2646,"children":2647},{"__ignoreMap":313},[2648,2665,2699,2723,2730,2746,2753,2794,2802,2810,2818,2842,2865,2872,2922,2930,2973,3002,3032,3040,3077,3085,3114,3121,3128,3154,3161,3191,3199,3207],{"type":318,"tag":456,"props":2649,"children":2650},{"class":458,"line":459},[2651,2656,2661],{"type":318,"tag":456,"props":2652,"children":2653},{"style":489},[2654],{"type":324,"value":2655},"using",{"type":318,"tag":456,"props":2657,"children":2658},{"style":1043},[2659],{"type":324,"value":2660}," System",{"type":318,"tag":456,"props":2662,"children":2663},{"style":463},[2664],{"type":324,"value":624},{"type":318,"tag":456,"props":2666,"children":2667},{"class":458,"line":480},[2668,2672,2676,2681,2686,2690,2695],{"type":318,"tag":456,"props":2669,"children":2670},{"style":489},[2671],{"type":324,"value":2655},{"type":318,"tag":456,"props":2673,"children":2674},{"style":1043},[2675],{"type":324,"value":2660},{"type":318,"tag":456,"props":2677,"children":2678},{"style":463},[2679],{"type":324,"value":2680},".",{"type":318,"tag":456,"props":2682,"children":2683},{"style":1043},[2684],{"type":324,"value":2685},"Security",{"type":318,"tag":456,"props":2687,"children":2688},{"style":463},[2689],{"type":324,"value":2680},{"type":318,"tag":456,"props":2691,"children":2692},{"style":1043},[2693],{"type":324,"value":2694},"Cryptography",{"type":318,"tag":456,"props":2696,"children":2697},{"style":463},[2698],{"type":324,"value":624},{"type":318,"tag":456,"props":2700,"children":2701},{"class":458,"line":495},[2702,2706,2710,2714,2719],{"type":318,"tag":456,"props":2703,"children":2704},{"style":489},[2705],{"type":324,"value":2655},{"type":318,"tag":456,"props":2707,"children":2708},{"style":1043},[2709],{"type":324,"value":2660},{"type":318,"tag":456,"props":2711,"children":2712},{"style":463},[2713],{"type":324,"value":2680},{"type":318,"tag":456,"props":2715,"children":2716},{"style":1043},[2717],{"type":324,"value":2718},"Text",{"type":318,"tag":456,"props":2720,"children":2721},{"style":463},[2722],{"type":324,"value":624},{"type":318,"tag":456,"props":2724,"children":2725},{"class":458,"line":535},[2726],{"type":318,"tag":456,"props":2727,"children":2728},{"emptyLinePlaceholder":1029},[2729],{"type":324,"value":1032},{"type":318,"tag":456,"props":2731,"children":2732},{"class":458,"line":565},[2733,2737,2741],{"type":318,"tag":456,"props":2734,"children":2735},{"style":489},[2736],{"type":324,"value":2120},{"type":318,"tag":456,"props":2738,"children":2739},{"style":489},[2740],{"type":324,"value":2125},{"type":318,"tag":456,"props":2742,"children":2743},{"style":1043},[2744],{"type":324,"value":2745}," Test\n",{"type":318,"tag":456,"props":2747,"children":2748},{"class":458,"line":604},[2749],{"type":318,"tag":456,"props":2750,"children":2751},{"style":463},[2752],{"type":324,"value":492},{"type":318,"tag":456,"props":2754,"children":2755},{"class":458,"line":627},[2756,2760,2764,2768,2773,2777,2782,2786,2790],{"type":318,"tag":456,"props":2757,"children":2758},{"style":489},[2759],{"type":324,"value":2142},{"type":318,"tag":456,"props":2761,"children":2762},{"style":489},[2763],{"type":324,"value":2147},{"type":318,"tag":456,"props":2765,"children":2766},{"style":489},[2767],{"type":324,"value":2152},{"type":318,"tag":456,"props":2769,"children":2770},{"style":499},[2771],{"type":324,"value":2772}," Main",{"type":318,"tag":456,"props":2774,"children":2775},{"style":463},[2776],{"type":324,"value":590},{"type":318,"tag":456,"props":2778,"children":2779},{"style":489},[2780],{"type":324,"value":2781},"string",{"type":318,"tag":456,"props":2783,"children":2784},{"style":463},[2785],{"type":324,"value":2170},{"type":318,"tag":456,"props":2787,"children":2788},{"style":1043},[2789],{"type":324,"value":2175},{"type":318,"tag":456,"props":2791,"children":2792},{"style":463},[2793],{"type":324,"value":1420},{"type":318,"tag":456,"props":2795,"children":2796},{"class":458,"line":649},[2797],{"type":318,"tag":456,"props":2798,"children":2799},{"style":463},[2800],{"type":324,"value":2801},"    {\n",{"type":318,"tag":456,"props":2803,"children":2804},{"class":458,"line":694},[2805],{"type":318,"tag":456,"props":2806,"children":2807},{"style":489},[2808],{"type":324,"value":2809},"        try\n",{"type":318,"tag":456,"props":2811,"children":2812},{"class":458,"line":703},[2813],{"type":318,"tag":456,"props":2814,"children":2815},{"style":463},[2816],{"type":324,"value":2817},"        {\n",{"type":318,"tag":456,"props":2819,"children":2820},{"class":458,"line":712},[2821,2826,2830,2834,2838],{"type":318,"tag":456,"props":2822,"children":2823},{"style":489},[2824],{"type":324,"value":2825},"            string",{"type":318,"tag":456,"props":2827,"children":2828},{"style":1043},[2829],{"type":324,"value":2205},{"type":318,"tag":456,"props":2831,"children":2832},{"style":489},[2833],{"type":324,"value":830},{"type":318,"tag":456,"props":2835,"children":2836},{"style":463},[2837],{"type":324,"value":2214},{"type":318,"tag":456,"props":2839,"children":2840},{"style":903},[2841],{"type":324,"value":1987},{"type":318,"tag":456,"props":2843,"children":2844},{"class":458,"line":726},[2845,2849,2853,2857,2861],{"type":318,"tag":456,"props":2846,"children":2847},{"style":489},[2848],{"type":324,"value":2825},{"type":318,"tag":456,"props":2850,"children":2851},{"style":1043},[2852],{"type":324,"value":2230},{"type":318,"tag":456,"props":2854,"children":2855},{"style":489},[2856],{"type":324,"value":830},{"type":318,"tag":456,"props":2858,"children":2859},{"style":463},[2860],{"type":324,"value":2239},{"type":318,"tag":456,"props":2862,"children":2863},{"style":903},[2864],{"type":324,"value":2010},{"type":318,"tag":456,"props":2866,"children":2867},{"class":458,"line":1189},[2868],{"type":318,"tag":456,"props":2869,"children":2870},{"emptyLinePlaceholder":1029},[2871],{"type":324,"value":1032},{"type":318,"tag":456,"props":2873,"children":2874},{"class":458,"line":1222},[2875,2880,2884,2889,2894,2898,2902,2907,2912,2917],{"type":318,"tag":456,"props":2876,"children":2877},{"style":489},[2878],{"type":324,"value":2879},"            using",{"type":318,"tag":456,"props":2881,"children":2882},{"style":463},[2883],{"type":324,"value":507},{"type":318,"tag":456,"props":2885,"children":2886},{"style":489},[2887],{"type":324,"value":2888},"var",{"type":318,"tag":456,"props":2890,"children":2891},{"style":1043},[2892],{"type":324,"value":2893}," hmacsha256",{"type":318,"tag":456,"props":2895,"children":2896},{"style":489},[2897],{"type":324,"value":830},{"type":318,"tag":456,"props":2899,"children":2900},{"style":489},[2901],{"type":324,"value":2312},{"type":318,"tag":456,"props":2903,"children":2904},{"style":1043},[2905],{"type":324,"value":2906}," HMACSHA256",{"type":318,"tag":456,"props":2908,"children":2909},{"style":463},[2910],{"type":324,"value":2911},"(Encoding.UTF8.",{"type":318,"tag":456,"props":2913,"children":2914},{"style":499},[2915],{"type":324,"value":2916},"GetBytes",{"type":318,"tag":456,"props":2918,"children":2919},{"style":463},[2920],{"type":324,"value":2921},"(secret)))\n",{"type":318,"tag":456,"props":2923,"children":2924},{"class":458,"line":1230},[2925],{"type":318,"tag":456,"props":2926,"children":2927},{"style":463},[2928],{"type":324,"value":2929},"            {\n",{"type":318,"tag":456,"props":2931,"children":2932},{"class":458,"line":1251},[2933,2938,2942,2946,2950,2955,2960,2964,2968],{"type":318,"tag":456,"props":2934,"children":2935},{"style":489},[2936],{"type":324,"value":2937},"                byte",{"type":318,"tag":456,"props":2939,"children":2940},{"style":463},[2941],{"type":324,"value":2170},{"type":318,"tag":456,"props":2943,"children":2944},{"style":1043},[2945],{"type":324,"value":2382},{"type":318,"tag":456,"props":2947,"children":2948},{"style":489},[2949],{"type":324,"value":830},{"type":318,"tag":456,"props":2951,"children":2952},{"style":463},[2953],{"type":324,"value":2954}," hmacsha256.",{"type":318,"tag":456,"props":2956,"children":2957},{"style":499},[2958],{"type":324,"value":2959},"ComputeHash",{"type":318,"tag":456,"props":2961,"children":2962},{"style":463},[2963],{"type":324,"value":2911},{"type":318,"tag":456,"props":2965,"children":2966},{"style":499},[2967],{"type":324,"value":2916},{"type":318,"tag":456,"props":2969,"children":2970},{"style":463},[2971],{"type":324,"value":2972},"(message));\n",{"type":318,"tag":456,"props":2974,"children":2975},{"class":458,"line":1303},[2976,2981,2985,2989,2993,2998],{"type":318,"tag":456,"props":2977,"children":2978},{"style":1043},[2979],{"type":324,"value":2980},"                StringBuilder",{"type":318,"tag":456,"props":2982,"children":2983},{"style":1043},[2984],{"type":324,"value":860},{"type":318,"tag":456,"props":2986,"children":2987},{"style":489},[2988],{"type":324,"value":830},{"type":318,"tag":456,"props":2990,"children":2991},{"style":489},[2992],{"type":324,"value":2312},{"type":318,"tag":456,"props":2994,"children":2995},{"style":1043},[2996],{"type":324,"value":2997}," StringBuilder",{"type":318,"tag":456,"props":2999,"children":3000},{"style":463},[3001],{"type":324,"value":723},{"type":318,"tag":456,"props":3003,"children":3004},{"class":458,"line":1311},[3005,3010,3014,3018,3022,3027],{"type":318,"tag":456,"props":3006,"children":3007},{"style":489},[3008],{"type":324,"value":3009},"                foreach",{"type":318,"tag":456,"props":3011,"children":3012},{"style":463},[3013],{"type":324,"value":507},{"type":318,"tag":456,"props":3015,"children":3016},{"style":489},[3017],{"type":324,"value":2456},{"type":318,"tag":456,"props":3019,"children":3020},{"style":1043},[3021],{"type":324,"value":2461},{"type":318,"tag":456,"props":3023,"children":3024},{"style":489},[3025],{"type":324,"value":3026}," in",{"type":318,"tag":456,"props":3028,"children":3029},{"style":463},[3030],{"type":324,"value":3031}," hash)\n",{"type":318,"tag":456,"props":3033,"children":3034},{"class":458,"line":1319},[3035],{"type":318,"tag":456,"props":3036,"children":3037},{"style":463},[3038],{"type":324,"value":3039},"                {\n",{"type":318,"tag":456,"props":3041,"children":3042},{"class":458,"line":1366},[3043,3048,3053,3058,3063,3067,3072],{"type":318,"tag":456,"props":3044,"children":3045},{"style":463},[3046],{"type":324,"value":3047},"                    userHash.",{"type":318,"tag":456,"props":3049,"children":3050},{"style":499},[3051],{"type":324,"value":3052},"Append",{"type":318,"tag":456,"props":3054,"children":3055},{"style":463},[3056],{"type":324,"value":3057},"(b.",{"type":318,"tag":456,"props":3059,"children":3060},{"style":499},[3061],{"type":324,"value":3062},"ToString",{"type":318,"tag":456,"props":3064,"children":3065},{"style":463},[3066],{"type":324,"value":590},{"type":318,"tag":456,"props":3068,"children":3069},{"style":593},[3070],{"type":324,"value":3071},"\"x2\"",{"type":318,"tag":456,"props":3073,"children":3074},{"style":463},[3075],{"type":324,"value":3076},"));\n",{"type":318,"tag":456,"props":3078,"children":3079},{"class":458,"line":1387},[3080],{"type":318,"tag":456,"props":3081,"children":3082},{"style":463},[3083],{"type":324,"value":3084},"                }\n",{"type":318,"tag":456,"props":3086,"children":3087},{"class":458,"line":1423},[3088,3093,3098,3102,3106,3110],{"type":318,"tag":456,"props":3089,"children":3090},{"style":463},[3091],{"type":324,"value":3092},"                Console.",{"type":318,"tag":456,"props":3094,"children":3095},{"style":499},[3096],{"type":324,"value":3097},"WriteLine",{"type":318,"tag":456,"props":3099,"children":3100},{"style":463},[3101],{"type":324,"value":2534},{"type":318,"tag":456,"props":3103,"children":3104},{"style":499},[3105],{"type":324,"value":3062},{"type":318,"tag":456,"props":3107,"children":3108},{"style":463},[3109],{"type":324,"value":2544},{"type":318,"tag":456,"props":3111,"children":3112},{"style":903},[3113],{"type":324,"value":956},{"type":318,"tag":456,"props":3115,"children":3116},{"class":458,"line":1440},[3117],{"type":318,"tag":456,"props":3118,"children":3119},{"style":463},[3120],{"type":324,"value":2516},{"type":318,"tag":456,"props":3122,"children":3123},{"class":458,"line":1464},[3124],{"type":318,"tag":456,"props":3125,"children":3126},{"style":463},[3127],{"type":324,"value":2622},{"type":318,"tag":456,"props":3129,"children":3130},{"class":458,"line":1472},[3131,3136,3140,3145,3150],{"type":318,"tag":456,"props":3132,"children":3133},{"style":489},[3134],{"type":324,"value":3135},"        catch",{"type":318,"tag":456,"props":3137,"children":3138},{"style":463},[3139],{"type":324,"value":507},{"type":318,"tag":456,"props":3141,"children":3142},{"style":1043},[3143],{"type":324,"value":3144},"Exception",{"type":318,"tag":456,"props":3146,"children":3147},{"style":1043},[3148],{"type":324,"value":3149}," e",{"type":318,"tag":456,"props":3151,"children":3152},{"style":463},[3153],{"type":324,"value":1420},{"type":318,"tag":456,"props":3155,"children":3156},{"class":458,"line":1511},[3157],{"type":318,"tag":456,"props":3158,"children":3159},{"style":463},[3160],{"type":324,"value":2817},{"type":318,"tag":456,"props":3162,"children":3164},{"class":458,"line":3163},27,[3165,3170,3174,3178,3182,3186],{"type":318,"tag":456,"props":3166,"children":3167},{"style":463},[3168],{"type":324,"value":3169},"            Console.",{"type":318,"tag":456,"props":3171,"children":3172},{"style":499},[3173],{"type":324,"value":3097},{"type":318,"tag":456,"props":3175,"children":3176},{"style":463},[3177],{"type":324,"value":590},{"type":318,"tag":456,"props":3179,"children":3180},{"style":593},[3181],{"type":324,"value":2595},{"type":318,"tag":456,"props":3183,"children":3184},{"style":489},[3185],{"type":324,"value":2600},{"type":318,"tag":456,"props":3187,"children":3188},{"style":463},[3189],{"type":324,"value":3190}," e.Message);\n",{"type":318,"tag":456,"props":3192,"children":3194},{"class":458,"line":3193},28,[3195],{"type":318,"tag":456,"props":3196,"children":3197},{"style":463},[3198],{"type":324,"value":2622},{"type":318,"tag":456,"props":3200,"children":3202},{"class":458,"line":3201},29,[3203],{"type":318,"tag":456,"props":3204,"children":3205},{"style":463},[3206],{"type":324,"value":2630},{"type":318,"tag":456,"props":3208,"children":3210},{"class":458,"line":3209},30,[3211],{"type":318,"tag":456,"props":3212,"children":3213},{"style":463},[3214],{"type":324,"value":1517},{"type":318,"tag":319,"props":3216,"children":3218},{"id":3217},"step-three-launch-churnkey",[3219],{"type":324,"value":3220},"Step Three: Launch Churnkey",{"type":318,"tag":326,"props":3222,"children":3223},{},[3224,3226,3232],{"type":324,"value":3225},"Once the HMAC hash has been generated, you can initialize and display the Churnkey Cancel Flow by calling ",{"type":318,"tag":348,"props":3227,"children":3229},{"className":3228},[],[3230],{"type":324,"value":3231},"window.churnkey.init('show')",{"type":324,"value":3233}," with the required configuration parameters.",{"type":318,"tag":446,"props":3235,"children":3237},{"className":448,"code":3236,"language":450,"meta":313,"style":313},"window.churnkey.init('show', {\n  customerId: 'CUSTOMER_ID', // required unless Paddle\n  authHash: 'HMAC_HASH', // required - fetched from your backend\n  subscriptionId: 'SUBSCRIPTION_ID', // recommended unless Paddle\n  appId: 'YOUR_APP_ID', // required\n  mode: 'live', // 'live', 'test', or 'sandbox' (Stripe only)\n  provider: 'stripe', // set to 'stripe', 'chargebee', 'braintree', 'paddle'\n  record: true, // set to false to skip session playback recording\n})\n",[3238],{"type":318,"tag":348,"props":3239,"children":3240},{"__ignoreMap":313},[3241,3267,3289,3311,3333,3355,3377,3399,3420],{"type":318,"tag":456,"props":3242,"children":3243},{"class":458,"line":459},[3244,3249,3253,3257,3262],{"type":318,"tag":456,"props":3245,"children":3246},{"style":463},[3247],{"type":324,"value":3248},"window.churnkey.",{"type":318,"tag":456,"props":3250,"children":3251},{"style":499},[3252],{"type":324,"value":2353},{"type":318,"tag":456,"props":3254,"children":3255},{"style":463},[3256],{"type":324,"value":590},{"type":318,"tag":456,"props":3258,"children":3259},{"style":593},[3260],{"type":324,"value":3261},"'show'",{"type":318,"tag":456,"props":3263,"children":3264},{"style":463},[3265],{"type":324,"value":3266},", {\n",{"type":318,"tag":456,"props":3268,"children":3269},{"class":458,"line":480},[3270,3275,3280,3284],{"type":318,"tag":456,"props":3271,"children":3272},{"style":463},[3273],{"type":324,"value":3274},"  customerId: ",{"type":318,"tag":456,"props":3276,"children":3277},{"style":593},[3278],{"type":324,"value":3279},"'CUSTOMER_ID'",{"type":318,"tag":456,"props":3281,"children":3282},{"style":463},[3283],{"type":324,"value":1411},{"type":318,"tag":456,"props":3285,"children":3286},{"style":903},[3287],{"type":324,"value":3288},"// required unless Paddle\n",{"type":318,"tag":456,"props":3290,"children":3291},{"class":458,"line":495},[3292,3297,3302,3306],{"type":318,"tag":456,"props":3293,"children":3294},{"style":463},[3295],{"type":324,"value":3296},"  authHash: ",{"type":318,"tag":456,"props":3298,"children":3299},{"style":593},[3300],{"type":324,"value":3301},"'HMAC_HASH'",{"type":318,"tag":456,"props":3303,"children":3304},{"style":463},[3305],{"type":324,"value":1411},{"type":318,"tag":456,"props":3307,"children":3308},{"style":903},[3309],{"type":324,"value":3310},"// required - fetched from your backend\n",{"type":318,"tag":456,"props":3312,"children":3313},{"class":458,"line":535},[3314,3319,3324,3328],{"type":318,"tag":456,"props":3315,"children":3316},{"style":463},[3317],{"type":324,"value":3318},"  subscriptionId: ",{"type":318,"tag":456,"props":3320,"children":3321},{"style":593},[3322],{"type":324,"value":3323},"'SUBSCRIPTION_ID'",{"type":318,"tag":456,"props":3325,"children":3326},{"style":463},[3327],{"type":324,"value":1411},{"type":318,"tag":456,"props":3329,"children":3330},{"style":903},[3331],{"type":324,"value":3332},"// recommended unless Paddle\n",{"type":318,"tag":456,"props":3334,"children":3335},{"class":458,"line":565},[3336,3341,3346,3350],{"type":318,"tag":456,"props":3337,"children":3338},{"style":463},[3339],{"type":324,"value":3340},"  appId: ",{"type":318,"tag":456,"props":3342,"children":3343},{"style":593},[3344],{"type":324,"value":3345},"'YOUR_APP_ID'",{"type":318,"tag":456,"props":3347,"children":3348},{"style":463},[3349],{"type":324,"value":1411},{"type":318,"tag":456,"props":3351,"children":3352},{"style":903},[3353],{"type":324,"value":3354},"// required\n",{"type":318,"tag":456,"props":3356,"children":3357},{"class":458,"line":604},[3358,3363,3368,3372],{"type":318,"tag":456,"props":3359,"children":3360},{"style":463},[3361],{"type":324,"value":3362},"  mode: ",{"type":318,"tag":456,"props":3364,"children":3365},{"style":593},[3366],{"type":324,"value":3367},"'live'",{"type":318,"tag":456,"props":3369,"children":3370},{"style":463},[3371],{"type":324,"value":1411},{"type":318,"tag":456,"props":3373,"children":3374},{"style":903},[3375],{"type":324,"value":3376},"// 'live', 'test', or 'sandbox' (Stripe only)\n",{"type":318,"tag":456,"props":3378,"children":3379},{"class":458,"line":627},[3380,3385,3390,3394],{"type":318,"tag":456,"props":3381,"children":3382},{"style":463},[3383],{"type":324,"value":3384},"  provider: ",{"type":318,"tag":456,"props":3386,"children":3387},{"style":593},[3388],{"type":324,"value":3389},"'stripe'",{"type":318,"tag":456,"props":3391,"children":3392},{"style":463},[3393],{"type":324,"value":1411},{"type":318,"tag":456,"props":3395,"children":3396},{"style":903},[3397],{"type":324,"value":3398},"// set to 'stripe', 'chargebee', 'braintree', 'paddle'\n",{"type":318,"tag":456,"props":3400,"children":3401},{"class":458,"line":649},[3402,3407,3411,3415],{"type":318,"tag":456,"props":3403,"children":3404},{"style":463},[3405],{"type":324,"value":3406},"  record: ",{"type":318,"tag":456,"props":3408,"children":3409},{"style":554},[3410],{"type":324,"value":557},{"type":318,"tag":456,"props":3412,"children":3413},{"style":463},[3414],{"type":324,"value":1411},{"type":318,"tag":456,"props":3416,"children":3417},{"style":903},[3418],{"type":324,"value":3419},"// set to false to skip session playback recording\n",{"type":318,"tag":456,"props":3421,"children":3422},{"class":458,"line":694},[3423],{"type":318,"tag":456,"props":3424,"children":3425},{"style":463},[3426],{"type":324,"value":3427},"})\n",{"type":318,"tag":319,"props":3429,"children":3431},{"id":3430},"complete-integration-example",[3432],{"type":324,"value":3433},"Complete Integration Example",{"type":318,"tag":326,"props":3435,"children":3436},{},[3437],{"type":324,"value":3438},"In practice, you'll need to fetch the authHash from your backend before initializing Churnkey. Here's a complete example showing the full flow:",{"type":318,"tag":446,"props":3440,"children":3442},{"className":448,"code":3441,"language":450,"meta":313,"style":313},"// When user clicks cancel button, fetch authHash from your backend\ndocument.getElementById('cancel-button').addEventListener('click', async function () {\n  try {\n    // Step 1: Fetch the authHash from your backend\n    const customerId = 'CUSTOMER_ID'; // Get from your logged-in user session\n\n    const response = await fetch('/api/churnkey', {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json',\n      },\n      body: JSON.stringify({\n        customerId: customerId,\n      }),\n    });\n\n    if (!response.ok) {\n      console.error('Failed to fetch authHash');\n      return;\n    }\n\n    const { userHash } = await response.json();\n\n    // Step 2: Initialize and display Churnkey with the authHash\n    window.churnkey.init('show', {\n      customerId: customerId, // required unless Paddle\n      authHash: userHash, // required - fetched from backend\n      subscriptionId: 'SUBSCRIPTION_ID', // recommended unless Paddle\n      appId: 'YOUR_APP_ID', // required\n      mode: 'live', // 'live', 'test', or 'sandbox' (Stripe only)\n      provider: 'stripe', // set to 'stripe', 'chargebee', 'braintree', 'paddle'\n      record: true, // set to false to skip session playback recording\n    });\n  } catch (error) {\n    console.error('Error initializing Churnkey:', error);\n  }\n});\n",[3443],{"type":318,"tag":348,"props":3444,"children":3445},{"__ignoreMap":313},[3446,3454,3512,3524,3532,3563,3570,3609,3626,3634,3656,3664,3691,3699,3707,3715,3722,3743,3769,3781,3788,3795,3836,3843,3851,3875,3887,3900,3920,3940,3960,3981,4002,4010,4028,4055,4063],{"type":318,"tag":456,"props":3447,"children":3448},{"class":458,"line":459},[3449],{"type":318,"tag":456,"props":3450,"children":3451},{"style":903},[3452],{"type":324,"value":3453},"// When user clicks cancel button, fetch authHash from your backend\n",{"type":318,"tag":456,"props":3455,"children":3456},{"class":458,"line":480},[3457,3462,3467,3471,3476,3480,3485,3489,3494,3498,3503,3507],{"type":318,"tag":456,"props":3458,"children":3459},{"style":463},[3460],{"type":324,"value":3461},"document.",{"type":318,"tag":456,"props":3463,"children":3464},{"style":499},[3465],{"type":324,"value":3466},"getElementById",{"type":318,"tag":456,"props":3468,"children":3469},{"style":463},[3470],{"type":324,"value":590},{"type":318,"tag":456,"props":3472,"children":3473},{"style":593},[3474],{"type":324,"value":3475},"'cancel-button'",{"type":318,"tag":456,"props":3477,"children":3478},{"style":463},[3479],{"type":324,"value":914},{"type":318,"tag":456,"props":3481,"children":3482},{"style":499},[3483],{"type":324,"value":3484},"addEventListener",{"type":318,"tag":456,"props":3486,"children":3487},{"style":463},[3488],{"type":324,"value":590},{"type":318,"tag":456,"props":3490,"children":3491},{"style":593},[3492],{"type":324,"value":3493},"'click'",{"type":318,"tag":456,"props":3495,"children":3496},{"style":463},[3497],{"type":324,"value":1411},{"type":318,"tag":456,"props":3499,"children":3500},{"style":489},[3501],{"type":324,"value":3502},"async",{"type":318,"tag":456,"props":3504,"children":3505},{"style":489},[3506],{"type":324,"value":1130},{"type":318,"tag":456,"props":3508,"children":3509},{"style":463},[3510],{"type":324,"value":3511}," () {\n",{"type":318,"tag":456,"props":3513,"children":3514},{"class":458,"line":495},[3515,3520],{"type":318,"tag":456,"props":3516,"children":3517},{"style":489},[3518],{"type":324,"value":3519},"  try",{"type":318,"tag":456,"props":3521,"children":3522},{"style":463},[3523],{"type":324,"value":1055},{"type":318,"tag":456,"props":3525,"children":3526},{"class":458,"line":535},[3527],{"type":318,"tag":456,"props":3528,"children":3529},{"style":903},[3530],{"type":324,"value":3531},"    // Step 1: Fetch the authHash from your backend\n",{"type":318,"tag":456,"props":3533,"children":3534},{"class":458,"line":565},[3535,3540,3545,3549,3554,3558],{"type":318,"tag":456,"props":3536,"children":3537},{"style":489},[3538],{"type":324,"value":3539},"    const",{"type":318,"tag":456,"props":3541,"children":3542},{"style":554},[3543],{"type":324,"value":3544}," customerId",{"type":318,"tag":456,"props":3546,"children":3547},{"style":489},[3548],{"type":324,"value":830},{"type":318,"tag":456,"props":3550,"children":3551},{"style":593},[3552],{"type":324,"value":3553}," 'CUSTOMER_ID'",{"type":318,"tag":456,"props":3555,"children":3556},{"style":463},[3557],{"type":324,"value":1358},{"type":318,"tag":456,"props":3559,"children":3560},{"style":903},[3561],{"type":324,"value":3562},"// Get from your logged-in user session\n",{"type":318,"tag":456,"props":3564,"children":3565},{"class":458,"line":604},[3566],{"type":318,"tag":456,"props":3567,"children":3568},{"emptyLinePlaceholder":1029},[3569],{"type":324,"value":1032},{"type":318,"tag":456,"props":3571,"children":3572},{"class":458,"line":627},[3573,3577,3582,3586,3591,3596,3600,3605],{"type":318,"tag":456,"props":3574,"children":3575},{"style":489},[3576],{"type":324,"value":3539},{"type":318,"tag":456,"props":3578,"children":3579},{"style":554},[3580],{"type":324,"value":3581}," response",{"type":318,"tag":456,"props":3583,"children":3584},{"style":489},[3585],{"type":324,"value":830},{"type":318,"tag":456,"props":3587,"children":3588},{"style":489},[3589],{"type":324,"value":3590}," await",{"type":318,"tag":456,"props":3592,"children":3593},{"style":499},[3594],{"type":324,"value":3595}," fetch",{"type":318,"tag":456,"props":3597,"children":3598},{"style":463},[3599],{"type":324,"value":590},{"type":318,"tag":456,"props":3601,"children":3602},{"style":593},[3603],{"type":324,"value":3604},"'/api/churnkey'",{"type":318,"tag":456,"props":3606,"children":3607},{"style":463},[3608],{"type":324,"value":3266},{"type":318,"tag":456,"props":3610,"children":3611},{"class":458,"line":649},[3612,3617,3622],{"type":318,"tag":456,"props":3613,"children":3614},{"style":463},[3615],{"type":324,"value":3616},"      method: ",{"type":318,"tag":456,"props":3618,"children":3619},{"style":593},[3620],{"type":324,"value":3621},"'POST'",{"type":318,"tag":456,"props":3623,"children":3624},{"style":463},[3625],{"type":324,"value":892},{"type":318,"tag":456,"props":3627,"children":3628},{"class":458,"line":694},[3629],{"type":318,"tag":456,"props":3630,"children":3631},{"style":463},[3632],{"type":324,"value":3633},"      headers: {\n",{"type":318,"tag":456,"props":3635,"children":3636},{"class":458,"line":703},[3637,3642,3647,3652],{"type":318,"tag":456,"props":3638,"children":3639},{"style":593},[3640],{"type":324,"value":3641},"        'Content-Type'",{"type":318,"tag":456,"props":3643,"children":3644},{"style":463},[3645],{"type":324,"value":3646},": ",{"type":318,"tag":456,"props":3648,"children":3649},{"style":593},[3650],{"type":324,"value":3651},"'application/json'",{"type":318,"tag":456,"props":3653,"children":3654},{"style":463},[3655],{"type":324,"value":892},{"type":318,"tag":456,"props":3657,"children":3658},{"class":458,"line":712},[3659],{"type":318,"tag":456,"props":3660,"children":3661},{"style":463},[3662],{"type":324,"value":3663},"      },\n",{"type":318,"tag":456,"props":3665,"children":3666},{"class":458,"line":726},[3667,3672,3677,3681,3686],{"type":318,"tag":456,"props":3668,"children":3669},{"style":463},[3670],{"type":324,"value":3671},"      body: ",{"type":318,"tag":456,"props":3673,"children":3674},{"style":554},[3675],{"type":324,"value":3676},"JSON",{"type":318,"tag":456,"props":3678,"children":3679},{"style":463},[3680],{"type":324,"value":2680},{"type":318,"tag":456,"props":3682,"children":3683},{"style":499},[3684],{"type":324,"value":3685},"stringify",{"type":318,"tag":456,"props":3687,"children":3688},{"style":463},[3689],{"type":324,"value":3690},"({\n",{"type":318,"tag":456,"props":3692,"children":3693},{"class":458,"line":1189},[3694],{"type":318,"tag":456,"props":3695,"children":3696},{"style":463},[3697],{"type":324,"value":3698},"        customerId: customerId,\n",{"type":318,"tag":456,"props":3700,"children":3701},{"class":458,"line":1222},[3702],{"type":318,"tag":456,"props":3703,"children":3704},{"style":463},[3705],{"type":324,"value":3706},"      }),\n",{"type":318,"tag":456,"props":3708,"children":3709},{"class":458,"line":1230},[3710],{"type":318,"tag":456,"props":3711,"children":3712},{"style":463},[3713],{"type":324,"value":3714},"    });\n",{"type":318,"tag":456,"props":3716,"children":3717},{"class":458,"line":1251},[3718],{"type":318,"tag":456,"props":3719,"children":3720},{"emptyLinePlaceholder":1029},[3721],{"type":324,"value":1032},{"type":318,"tag":456,"props":3723,"children":3724},{"class":458,"line":1303},[3725,3730,3734,3738],{"type":318,"tag":456,"props":3726,"children":3727},{"style":489},[3728],{"type":324,"value":3729},"    if",{"type":318,"tag":456,"props":3731,"children":3732},{"style":463},[3733],{"type":324,"value":507},{"type":318,"tag":456,"props":3735,"children":3736},{"style":489},[3737],{"type":324,"value":512},{"type":318,"tag":456,"props":3739,"children":3740},{"style":463},[3741],{"type":324,"value":3742},"response.ok) {\n",{"type":318,"tag":456,"props":3744,"children":3745},{"class":458,"line":1311},[3746,3751,3756,3760,3765],{"type":318,"tag":456,"props":3747,"children":3748},{"style":463},[3749],{"type":324,"value":3750},"      console.",{"type":318,"tag":456,"props":3752,"children":3753},{"style":499},[3754],{"type":324,"value":3755},"error",{"type":318,"tag":456,"props":3757,"children":3758},{"style":463},[3759],{"type":324,"value":590},{"type":318,"tag":456,"props":3761,"children":3762},{"style":593},[3763],{"type":324,"value":3764},"'Failed to fetch authHash'",{"type":318,"tag":456,"props":3766,"children":3767},{"style":463},[3768],{"type":324,"value":601},{"type":318,"tag":456,"props":3770,"children":3771},{"class":458,"line":1319},[3772,3777],{"type":318,"tag":456,"props":3773,"children":3774},{"style":489},[3775],{"type":324,"value":3776},"      return",{"type":318,"tag":456,"props":3778,"children":3779},{"style":463},[3780],{"type":324,"value":624},{"type":318,"tag":456,"props":3782,"children":3783},{"class":458,"line":1366},[3784],{"type":318,"tag":456,"props":3785,"children":3786},{"style":463},[3787],{"type":324,"value":2630},{"type":318,"tag":456,"props":3789,"children":3790},{"class":458,"line":1387},[3791],{"type":318,"tag":456,"props":3792,"children":3793},{"emptyLinePlaceholder":1029},[3794],{"type":324,"value":1032},{"type":318,"tag":456,"props":3796,"children":3797},{"class":458,"line":1423},[3798,3802,3806,3811,3815,3819,3823,3828,3832],{"type":318,"tag":456,"props":3799,"children":3800},{"style":489},[3801],{"type":324,"value":3539},{"type":318,"tag":456,"props":3803,"children":3804},{"style":463},[3805],{"type":324,"value":1200},{"type":318,"tag":456,"props":3807,"children":3808},{"style":554},[3809],{"type":324,"value":3810},"userHash",{"type":318,"tag":456,"props":3812,"children":3813},{"style":463},[3814],{"type":324,"value":1210},{"type":318,"tag":456,"props":3816,"children":3817},{"style":489},[3818],{"type":324,"value":546},{"type":318,"tag":456,"props":3820,"children":3821},{"style":489},[3822],{"type":324,"value":3590},{"type":318,"tag":456,"props":3824,"children":3825},{"style":463},[3826],{"type":324,"value":3827}," response.",{"type":318,"tag":456,"props":3829,"children":3830},{"style":499},[3831],{"type":324,"value":1285},{"type":318,"tag":456,"props":3833,"children":3834},{"style":463},[3835],{"type":324,"value":723},{"type":318,"tag":456,"props":3837,"children":3838},{"class":458,"line":1440},[3839],{"type":318,"tag":456,"props":3840,"children":3841},{"emptyLinePlaceholder":1029},[3842],{"type":324,"value":1032},{"type":318,"tag":456,"props":3844,"children":3845},{"class":458,"line":1464},[3846],{"type":318,"tag":456,"props":3847,"children":3848},{"style":903},[3849],{"type":324,"value":3850},"    // Step 2: Initialize and display Churnkey with the authHash\n",{"type":318,"tag":456,"props":3852,"children":3853},{"class":458,"line":1472},[3854,3859,3863,3867,3871],{"type":318,"tag":456,"props":3855,"children":3856},{"style":463},[3857],{"type":324,"value":3858},"    window.churnkey.",{"type":318,"tag":456,"props":3860,"children":3861},{"style":499},[3862],{"type":324,"value":2353},{"type":318,"tag":456,"props":3864,"children":3865},{"style":463},[3866],{"type":324,"value":590},{"type":318,"tag":456,"props":3868,"children":3869},{"style":593},[3870],{"type":324,"value":3261},{"type":318,"tag":456,"props":3872,"children":3873},{"style":463},[3874],{"type":324,"value":3266},{"type":318,"tag":456,"props":3876,"children":3877},{"class":458,"line":1511},[3878,3883],{"type":318,"tag":456,"props":3879,"children":3880},{"style":463},[3881],{"type":324,"value":3882},"      customerId: customerId, ",{"type":318,"tag":456,"props":3884,"children":3885},{"style":903},[3886],{"type":324,"value":3288},{"type":318,"tag":456,"props":3888,"children":3889},{"class":458,"line":3163},[3890,3895],{"type":318,"tag":456,"props":3891,"children":3892},{"style":463},[3893],{"type":324,"value":3894},"      authHash: userHash, ",{"type":318,"tag":456,"props":3896,"children":3897},{"style":903},[3898],{"type":324,"value":3899},"// required - fetched from backend\n",{"type":318,"tag":456,"props":3901,"children":3902},{"class":458,"line":3193},[3903,3908,3912,3916],{"type":318,"tag":456,"props":3904,"children":3905},{"style":463},[3906],{"type":324,"value":3907},"      subscriptionId: ",{"type":318,"tag":456,"props":3909,"children":3910},{"style":593},[3911],{"type":324,"value":3323},{"type":318,"tag":456,"props":3913,"children":3914},{"style":463},[3915],{"type":324,"value":1411},{"type":318,"tag":456,"props":3917,"children":3918},{"style":903},[3919],{"type":324,"value":3332},{"type":318,"tag":456,"props":3921,"children":3922},{"class":458,"line":3201},[3923,3928,3932,3936],{"type":318,"tag":456,"props":3924,"children":3925},{"style":463},[3926],{"type":324,"value":3927},"      appId: ",{"type":318,"tag":456,"props":3929,"children":3930},{"style":593},[3931],{"type":324,"value":3345},{"type":318,"tag":456,"props":3933,"children":3934},{"style":463},[3935],{"type":324,"value":1411},{"type":318,"tag":456,"props":3937,"children":3938},{"style":903},[3939],{"type":324,"value":3354},{"type":318,"tag":456,"props":3941,"children":3942},{"class":458,"line":3209},[3943,3948,3952,3956],{"type":318,"tag":456,"props":3944,"children":3945},{"style":463},[3946],{"type":324,"value":3947},"      mode: ",{"type":318,"tag":456,"props":3949,"children":3950},{"style":593},[3951],{"type":324,"value":3367},{"type":318,"tag":456,"props":3953,"children":3954},{"style":463},[3955],{"type":324,"value":1411},{"type":318,"tag":456,"props":3957,"children":3958},{"style":903},[3959],{"type":324,"value":3376},{"type":318,"tag":456,"props":3961,"children":3963},{"class":458,"line":3962},31,[3964,3969,3973,3977],{"type":318,"tag":456,"props":3965,"children":3966},{"style":463},[3967],{"type":324,"value":3968},"      provider: ",{"type":318,"tag":456,"props":3970,"children":3971},{"style":593},[3972],{"type":324,"value":3389},{"type":318,"tag":456,"props":3974,"children":3975},{"style":463},[3976],{"type":324,"value":1411},{"type":318,"tag":456,"props":3978,"children":3979},{"style":903},[3980],{"type":324,"value":3398},{"type":318,"tag":456,"props":3982,"children":3984},{"class":458,"line":3983},32,[3985,3990,3994,3998],{"type":318,"tag":456,"props":3986,"children":3987},{"style":463},[3988],{"type":324,"value":3989},"      record: ",{"type":318,"tag":456,"props":3991,"children":3992},{"style":554},[3993],{"type":324,"value":557},{"type":318,"tag":456,"props":3995,"children":3996},{"style":463},[3997],{"type":324,"value":1411},{"type":318,"tag":456,"props":3999,"children":4000},{"style":903},[4001],{"type":324,"value":3419},{"type":318,"tag":456,"props":4003,"children":4005},{"class":458,"line":4004},33,[4006],{"type":318,"tag":456,"props":4007,"children":4008},{"style":463},[4009],{"type":324,"value":3714},{"type":318,"tag":456,"props":4011,"children":4013},{"class":458,"line":4012},34,[4014,4019,4023],{"type":318,"tag":456,"props":4015,"children":4016},{"style":463},[4017],{"type":324,"value":4018},"  } ",{"type":318,"tag":456,"props":4020,"children":4021},{"style":489},[4022],{"type":324,"value":2561},{"type":318,"tag":456,"props":4024,"children":4025},{"style":463},[4026],{"type":324,"value":4027}," (error) {\n",{"type":318,"tag":456,"props":4029,"children":4031},{"class":458,"line":4030},35,[4032,4037,4041,4045,4050],{"type":318,"tag":456,"props":4033,"children":4034},{"style":463},[4035],{"type":324,"value":4036},"    console.",{"type":318,"tag":456,"props":4038,"children":4039},{"style":499},[4040],{"type":324,"value":3755},{"type":318,"tag":456,"props":4042,"children":4043},{"style":463},[4044],{"type":324,"value":590},{"type":318,"tag":456,"props":4046,"children":4047},{"style":593},[4048],{"type":324,"value":4049},"'Error initializing Churnkey:'",{"type":318,"tag":456,"props":4051,"children":4052},{"style":463},[4053],{"type":324,"value":4054},", error);\n",{"type":318,"tag":456,"props":4056,"children":4058},{"class":458,"line":4057},36,[4059],{"type":318,"tag":456,"props":4060,"children":4061},{"style":463},[4062],{"type":324,"value":709},{"type":318,"tag":456,"props":4064,"children":4066},{"class":458,"line":4065},37,[4067],{"type":318,"tag":456,"props":4068,"children":4069},{"style":463},[4070],{"type":324,"value":4071},"});\n",{"type":318,"tag":4073,"props":4074,"children":4076},"h3",{"id":4075},"framework-specific-examples",[4077],{"type":324,"value":4078},"Framework-Specific Examples",{"type":318,"tag":800,"props":4080,"children":4081},{},[4082,4812,5593],{"type":318,"tag":446,"props":4083,"children":4086},{"className":448,"code":4084,"filename":4085,"language":450,"meta":313,"style":313},"import { useState } from 'react';\n\nfunction CancelButton() {\n  const [loading, setLoading] = useState(false);\n\n  const handleCancel = async () => {\n    setLoading(true);\n    try {\n      const customerId = user.customerId; // From your auth context\n\n      const response = await fetch('/api/churnkey', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ customerId }),\n      });\n\n      const { userHash } = await response.json();\n\n      window.churnkey.init('show', {\n        customerId: customerId,\n        authHash: userHash,\n        subscriptionId: user.subscriptionId,\n        appId: 'YOUR_APP_ID',\n        mode: 'live',\n        provider: 'stripe',\n        record: true,\n      });\n    } catch (error) {\n      console.error('Error:', error);\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    \u003Cbutton onClick={handleCancel} disabled={loading}>\n      {loading ? 'Loading...' : 'Cancel Subscription'}\n    \u003C/button>\n  );\n}\n","React",[4087],{"type":318,"tag":348,"props":4088,"children":4089},{"__ignoreMap":313},[4090,4115,4122,4139,4192,4199,4234,4254,4266,4292,4299,4334,4350,4376,4401,4409,4416,4455,4462,4486,4493,4501,4509,4525,4541,4557,4573,4580,4596,4620,4636,4656,4663,4671,4678,4689,4742,4778,4795,4804],{"type":318,"tag":456,"props":4091,"children":4092},{"class":458,"line":459},[4093,4097,4102,4106,4111],{"type":318,"tag":456,"props":4094,"children":4095},{"style":489},[4096],{"type":324,"value":974},{"type":318,"tag":456,"props":4098,"children":4099},{"style":463},[4100],{"type":324,"value":4101}," { useState } ",{"type":318,"tag":456,"props":4103,"children":4104},{"style":489},[4105],{"type":324,"value":984},{"type":318,"tag":456,"props":4107,"children":4108},{"style":593},[4109],{"type":324,"value":4110}," 'react'",{"type":318,"tag":456,"props":4112,"children":4113},{"style":463},[4114],{"type":324,"value":624},{"type":318,"tag":456,"props":4116,"children":4117},{"class":458,"line":480},[4118],{"type":318,"tag":456,"props":4119,"children":4120},{"emptyLinePlaceholder":1029},[4121],{"type":324,"value":1032},{"type":318,"tag":456,"props":4123,"children":4124},{"class":458,"line":495},[4125,4130,4135],{"type":318,"tag":456,"props":4126,"children":4127},{"style":489},[4128],{"type":324,"value":4129},"function",{"type":318,"tag":456,"props":4131,"children":4132},{"style":499},[4133],{"type":324,"value":4134}," CancelButton",{"type":318,"tag":456,"props":4136,"children":4137},{"style":463},[4138],{"type":324,"value":1954},{"type":318,"tag":456,"props":4140,"children":4141},{"class":458,"line":535},[4142,4146,4151,4156,4160,4165,4170,4174,4179,4183,4188],{"type":318,"tag":456,"props":4143,"children":4144},{"style":489},[4145],{"type":324,"value":1195},{"type":318,"tag":456,"props":4147,"children":4148},{"style":463},[4149],{"type":324,"value":4150}," [",{"type":318,"tag":456,"props":4152,"children":4153},{"style":554},[4154],{"type":324,"value":4155},"loading",{"type":318,"tag":456,"props":4157,"children":4158},{"style":463},[4159],{"type":324,"value":1411},{"type":318,"tag":456,"props":4161,"children":4162},{"style":554},[4163],{"type":324,"value":4164},"setLoading",{"type":318,"tag":456,"props":4166,"children":4167},{"style":463},[4168],{"type":324,"value":4169},"] ",{"type":318,"tag":456,"props":4171,"children":4172},{"style":489},[4173],{"type":324,"value":546},{"type":318,"tag":456,"props":4175,"children":4176},{"style":499},[4177],{"type":324,"value":4178}," useState",{"type":318,"tag":456,"props":4180,"children":4181},{"style":463},[4182],{"type":324,"value":590},{"type":318,"tag":456,"props":4184,"children":4185},{"style":554},[4186],{"type":324,"value":4187},"false",{"type":318,"tag":456,"props":4189,"children":4190},{"style":463},[4191],{"type":324,"value":601},{"type":318,"tag":456,"props":4193,"children":4194},{"class":458,"line":565},[4195],{"type":318,"tag":456,"props":4196,"children":4197},{"emptyLinePlaceholder":1029},[4198],{"type":324,"value":1032},{"type":318,"tag":456,"props":4200,"children":4201},{"class":458,"line":604},[4202,4206,4211,4215,4220,4225,4230],{"type":318,"tag":456,"props":4203,"children":4204},{"style":489},[4205],{"type":324,"value":1195},{"type":318,"tag":456,"props":4207,"children":4208},{"style":499},[4209],{"type":324,"value":4210}," handleCancel",{"type":318,"tag":456,"props":4212,"children":4213},{"style":489},[4214],{"type":324,"value":830},{"type":318,"tag":456,"props":4216,"children":4217},{"style":489},[4218],{"type":324,"value":4219}," async",{"type":318,"tag":456,"props":4221,"children":4222},{"style":463},[4223],{"type":324,"value":4224}," () ",{"type":318,"tag":456,"props":4226,"children":4227},{"style":489},[4228],{"type":324,"value":4229},"=>",{"type":318,"tag":456,"props":4231,"children":4232},{"style":463},[4233],{"type":324,"value":1055},{"type":318,"tag":456,"props":4235,"children":4236},{"class":458,"line":627},[4237,4242,4246,4250],{"type":318,"tag":456,"props":4238,"children":4239},{"style":499},[4240],{"type":324,"value":4241},"    setLoading",{"type":318,"tag":456,"props":4243,"children":4244},{"style":463},[4245],{"type":324,"value":590},{"type":318,"tag":456,"props":4247,"children":4248},{"style":554},[4249],{"type":324,"value":557},{"type":318,"tag":456,"props":4251,"children":4252},{"style":463},[4253],{"type":324,"value":601},{"type":318,"tag":456,"props":4255,"children":4256},{"class":458,"line":649},[4257,4262],{"type":318,"tag":456,"props":4258,"children":4259},{"style":489},[4260],{"type":324,"value":4261},"    try",{"type":318,"tag":456,"props":4263,"children":4264},{"style":463},[4265],{"type":324,"value":1055},{"type":318,"tag":456,"props":4267,"children":4268},{"class":458,"line":694},[4269,4274,4278,4282,4287],{"type":318,"tag":456,"props":4270,"children":4271},{"style":489},[4272],{"type":324,"value":4273},"      const",{"type":318,"tag":456,"props":4275,"children":4276},{"style":554},[4277],{"type":324,"value":3544},{"type":318,"tag":456,"props":4279,"children":4280},{"style":489},[4281],{"type":324,"value":830},{"type":318,"tag":456,"props":4283,"children":4284},{"style":463},[4285],{"type":324,"value":4286}," user.customerId; ",{"type":318,"tag":456,"props":4288,"children":4289},{"style":903},[4290],{"type":324,"value":4291},"// From your auth context\n",{"type":318,"tag":456,"props":4293,"children":4294},{"class":458,"line":703},[4295],{"type":318,"tag":456,"props":4296,"children":4297},{"emptyLinePlaceholder":1029},[4298],{"type":324,"value":1032},{"type":318,"tag":456,"props":4300,"children":4301},{"class":458,"line":712},[4302,4306,4310,4314,4318,4322,4326,4330],{"type":318,"tag":456,"props":4303,"children":4304},{"style":489},[4305],{"type":324,"value":4273},{"type":318,"tag":456,"props":4307,"children":4308},{"style":554},[4309],{"type":324,"value":3581},{"type":318,"tag":456,"props":4311,"children":4312},{"style":489},[4313],{"type":324,"value":830},{"type":318,"tag":456,"props":4315,"children":4316},{"style":489},[4317],{"type":324,"value":3590},{"type":318,"tag":456,"props":4319,"children":4320},{"style":499},[4321],{"type":324,"value":3595},{"type":318,"tag":456,"props":4323,"children":4324},{"style":463},[4325],{"type":324,"value":590},{"type":318,"tag":456,"props":4327,"children":4328},{"style":593},[4329],{"type":324,"value":3604},{"type":318,"tag":456,"props":4331,"children":4332},{"style":463},[4333],{"type":324,"value":3266},{"type":318,"tag":456,"props":4335,"children":4336},{"class":458,"line":726},[4337,4342,4346],{"type":318,"tag":456,"props":4338,"children":4339},{"style":463},[4340],{"type":324,"value":4341},"        method: ",{"type":318,"tag":456,"props":4343,"children":4344},{"style":593},[4345],{"type":324,"value":3621},{"type":318,"tag":456,"props":4347,"children":4348},{"style":463},[4349],{"type":324,"value":892},{"type":318,"tag":456,"props":4351,"children":4352},{"class":458,"line":1189},[4353,4358,4363,4367,4371],{"type":318,"tag":456,"props":4354,"children":4355},{"style":463},[4356],{"type":324,"value":4357},"        headers: { ",{"type":318,"tag":456,"props":4359,"children":4360},{"style":593},[4361],{"type":324,"value":4362},"'Content-Type'",{"type":318,"tag":456,"props":4364,"children":4365},{"style":463},[4366],{"type":324,"value":3646},{"type":318,"tag":456,"props":4368,"children":4369},{"style":593},[4370],{"type":324,"value":3651},{"type":318,"tag":456,"props":4372,"children":4373},{"style":463},[4374],{"type":324,"value":4375}," },\n",{"type":318,"tag":456,"props":4377,"children":4378},{"class":458,"line":1222},[4379,4384,4388,4392,4396],{"type":318,"tag":456,"props":4380,"children":4381},{"style":463},[4382],{"type":324,"value":4383},"        body: ",{"type":318,"tag":456,"props":4385,"children":4386},{"style":554},[4387],{"type":324,"value":3676},{"type":318,"tag":456,"props":4389,"children":4390},{"style":463},[4391],{"type":324,"value":2680},{"type":318,"tag":456,"props":4393,"children":4394},{"style":499},[4395],{"type":324,"value":3685},{"type":318,"tag":456,"props":4397,"children":4398},{"style":463},[4399],{"type":324,"value":4400},"({ customerId }),\n",{"type":318,"tag":456,"props":4402,"children":4403},{"class":458,"line":1230},[4404],{"type":318,"tag":456,"props":4405,"children":4406},{"style":463},[4407],{"type":324,"value":4408},"      });\n",{"type":318,"tag":456,"props":4410,"children":4411},{"class":458,"line":1251},[4412],{"type":318,"tag":456,"props":4413,"children":4414},{"emptyLinePlaceholder":1029},[4415],{"type":324,"value":1032},{"type":318,"tag":456,"props":4417,"children":4418},{"class":458,"line":1303},[4419,4423,4427,4431,4435,4439,4443,4447,4451],{"type":318,"tag":456,"props":4420,"children":4421},{"style":489},[4422],{"type":324,"value":4273},{"type":318,"tag":456,"props":4424,"children":4425},{"style":463},[4426],{"type":324,"value":1200},{"type":318,"tag":456,"props":4428,"children":4429},{"style":554},[4430],{"type":324,"value":3810},{"type":318,"tag":456,"props":4432,"children":4433},{"style":463},[4434],{"type":324,"value":1210},{"type":318,"tag":456,"props":4436,"children":4437},{"style":489},[4438],{"type":324,"value":546},{"type":318,"tag":456,"props":4440,"children":4441},{"style":489},[4442],{"type":324,"value":3590},{"type":318,"tag":456,"props":4444,"children":4445},{"style":463},[4446],{"type":324,"value":3827},{"type":318,"tag":456,"props":4448,"children":4449},{"style":499},[4450],{"type":324,"value":1285},{"type":318,"tag":456,"props":4452,"children":4453},{"style":463},[4454],{"type":324,"value":723},{"type":318,"tag":456,"props":4456,"children":4457},{"class":458,"line":1311},[4458],{"type":318,"tag":456,"props":4459,"children":4460},{"emptyLinePlaceholder":1029},[4461],{"type":324,"value":1032},{"type":318,"tag":456,"props":4463,"children":4464},{"class":458,"line":1319},[4465,4470,4474,4478,4482],{"type":318,"tag":456,"props":4466,"children":4467},{"style":463},[4468],{"type":324,"value":4469},"      window.churnkey.",{"type":318,"tag":456,"props":4471,"children":4472},{"style":499},[4473],{"type":324,"value":2353},{"type":318,"tag":456,"props":4475,"children":4476},{"style":463},[4477],{"type":324,"value":590},{"type":318,"tag":456,"props":4479,"children":4480},{"style":593},[4481],{"type":324,"value":3261},{"type":318,"tag":456,"props":4483,"children":4484},{"style":463},[4485],{"type":324,"value":3266},{"type":318,"tag":456,"props":4487,"children":4488},{"class":458,"line":1366},[4489],{"type":318,"tag":456,"props":4490,"children":4491},{"style":463},[4492],{"type":324,"value":3698},{"type":318,"tag":456,"props":4494,"children":4495},{"class":458,"line":1387},[4496],{"type":318,"tag":456,"props":4497,"children":4498},{"style":463},[4499],{"type":324,"value":4500},"        authHash: userHash,\n",{"type":318,"tag":456,"props":4502,"children":4503},{"class":458,"line":1423},[4504],{"type":318,"tag":456,"props":4505,"children":4506},{"style":463},[4507],{"type":324,"value":4508},"        subscriptionId: user.subscriptionId,\n",{"type":318,"tag":456,"props":4510,"children":4511},{"class":458,"line":1440},[4512,4517,4521],{"type":318,"tag":456,"props":4513,"children":4514},{"style":463},[4515],{"type":324,"value":4516},"        appId: ",{"type":318,"tag":456,"props":4518,"children":4519},{"style":593},[4520],{"type":324,"value":3345},{"type":318,"tag":456,"props":4522,"children":4523},{"style":463},[4524],{"type":324,"value":892},{"type":318,"tag":456,"props":4526,"children":4527},{"class":458,"line":1464},[4528,4533,4537],{"type":318,"tag":456,"props":4529,"children":4530},{"style":463},[4531],{"type":324,"value":4532},"        mode: ",{"type":318,"tag":456,"props":4534,"children":4535},{"style":593},[4536],{"type":324,"value":3367},{"type":318,"tag":456,"props":4538,"children":4539},{"style":463},[4540],{"type":324,"value":892},{"type":318,"tag":456,"props":4542,"children":4543},{"class":458,"line":1472},[4544,4549,4553],{"type":318,"tag":456,"props":4545,"children":4546},{"style":463},[4547],{"type":324,"value":4548},"        provider: ",{"type":318,"tag":456,"props":4550,"children":4551},{"style":593},[4552],{"type":324,"value":3389},{"type":318,"tag":456,"props":4554,"children":4555},{"style":463},[4556],{"type":324,"value":892},{"type":318,"tag":456,"props":4558,"children":4559},{"class":458,"line":1511},[4560,4565,4569],{"type":318,"tag":456,"props":4561,"children":4562},{"style":463},[4563],{"type":324,"value":4564},"        record: ",{"type":318,"tag":456,"props":4566,"children":4567},{"style":554},[4568],{"type":324,"value":557},{"type":318,"tag":456,"props":4570,"children":4571},{"style":463},[4572],{"type":324,"value":892},{"type":318,"tag":456,"props":4574,"children":4575},{"class":458,"line":3163},[4576],{"type":318,"tag":456,"props":4577,"children":4578},{"style":463},[4579],{"type":324,"value":4408},{"type":318,"tag":456,"props":4581,"children":4582},{"class":458,"line":3193},[4583,4588,4592],{"type":318,"tag":456,"props":4584,"children":4585},{"style":463},[4586],{"type":324,"value":4587},"    } ",{"type":318,"tag":456,"props":4589,"children":4590},{"style":489},[4591],{"type":324,"value":2561},{"type":318,"tag":456,"props":4593,"children":4594},{"style":463},[4595],{"type":324,"value":4027},{"type":318,"tag":456,"props":4597,"children":4598},{"class":458,"line":3201},[4599,4603,4607,4611,4616],{"type":318,"tag":456,"props":4600,"children":4601},{"style":463},[4602],{"type":324,"value":3750},{"type":318,"tag":456,"props":4604,"children":4605},{"style":499},[4606],{"type":324,"value":3755},{"type":318,"tag":456,"props":4608,"children":4609},{"style":463},[4610],{"type":324,"value":590},{"type":318,"tag":456,"props":4612,"children":4613},{"style":593},[4614],{"type":324,"value":4615},"'Error:'",{"type":318,"tag":456,"props":4617,"children":4618},{"style":463},[4619],{"type":324,"value":4054},{"type":318,"tag":456,"props":4621,"children":4622},{"class":458,"line":3209},[4623,4627,4632],{"type":318,"tag":456,"props":4624,"children":4625},{"style":463},[4626],{"type":324,"value":4587},{"type":318,"tag":456,"props":4628,"children":4629},{"style":489},[4630],{"type":324,"value":4631},"finally",{"type":318,"tag":456,"props":4633,"children":4634},{"style":463},[4635],{"type":324,"value":1055},{"type":318,"tag":456,"props":4637,"children":4638},{"class":458,"line":3962},[4639,4644,4648,4652],{"type":318,"tag":456,"props":4640,"children":4641},{"style":499},[4642],{"type":324,"value":4643},"      setLoading",{"type":318,"tag":456,"props":4645,"children":4646},{"style":463},[4647],{"type":324,"value":590},{"type":318,"tag":456,"props":4649,"children":4650},{"style":554},[4651],{"type":324,"value":4187},{"type":318,"tag":456,"props":4653,"children":4654},{"style":463},[4655],{"type":324,"value":601},{"type":318,"tag":456,"props":4657,"children":4658},{"class":458,"line":3983},[4659],{"type":318,"tag":456,"props":4660,"children":4661},{"style":463},[4662],{"type":324,"value":2630},{"type":318,"tag":456,"props":4664,"children":4665},{"class":458,"line":4004},[4666],{"type":318,"tag":456,"props":4667,"children":4668},{"style":463},[4669],{"type":324,"value":4670},"  };\n",{"type":318,"tag":456,"props":4672,"children":4673},{"class":458,"line":4012},[4674],{"type":318,"tag":456,"props":4675,"children":4676},{"emptyLinePlaceholder":1029},[4677],{"type":324,"value":1032},{"type":318,"tag":456,"props":4679,"children":4680},{"class":458,"line":4030},[4681,4685],{"type":318,"tag":456,"props":4682,"children":4683},{"style":489},[4684],{"type":324,"value":1478},{"type":318,"tag":456,"props":4686,"children":4687},{"style":463},[4688],{"type":324,"value":1872},{"type":318,"tag":456,"props":4690,"children":4691},{"class":458,"line":4057},[4692,4697,4702,4707,4712,4717,4721,4726,4730,4734,4738],{"type":318,"tag":456,"props":4693,"children":4694},{"style":463},[4695],{"type":324,"value":4696},"    \u003C",{"type":318,"tag":456,"props":4698,"children":4699},{"style":469},[4700],{"type":324,"value":4701},"button",{"type":318,"tag":456,"props":4703,"children":4704},{"style":554},[4705],{"type":324,"value":4706}," onClick",{"type":318,"tag":456,"props":4708,"children":4709},{"style":489},[4710],{"type":324,"value":4711},"={",{"type":318,"tag":456,"props":4713,"children":4714},{"style":463},[4715],{"type":324,"value":4716},"handleCancel",{"type":318,"tag":456,"props":4718,"children":4719},{"style":489},[4720],{"type":324,"value":718},{"type":318,"tag":456,"props":4722,"children":4723},{"style":554},[4724],{"type":324,"value":4725}," disabled",{"type":318,"tag":456,"props":4727,"children":4728},{"style":489},[4729],{"type":324,"value":4711},{"type":318,"tag":456,"props":4731,"children":4732},{"style":463},[4733],{"type":324,"value":4155},{"type":318,"tag":456,"props":4735,"children":4736},{"style":489},[4737],{"type":324,"value":718},{"type":318,"tag":456,"props":4739,"children":4740},{"style":463},[4741],{"type":324,"value":477},{"type":318,"tag":456,"props":4743,"children":4744},{"class":458,"line":4065},[4745,4750,4755,4760,4765,4769,4774],{"type":318,"tag":456,"props":4746,"children":4747},{"style":489},[4748],{"type":324,"value":4749},"      {",{"type":318,"tag":456,"props":4751,"children":4752},{"style":463},[4753],{"type":324,"value":4754},"loading ",{"type":318,"tag":456,"props":4756,"children":4757},{"style":489},[4758],{"type":324,"value":4759},"?",{"type":318,"tag":456,"props":4761,"children":4762},{"style":593},[4763],{"type":324,"value":4764}," 'Loading...'",{"type":318,"tag":456,"props":4766,"children":4767},{"style":489},[4768],{"type":324,"value":2466},{"type":318,"tag":456,"props":4770,"children":4771},{"style":593},[4772],{"type":324,"value":4773}," 'Cancel Subscription'",{"type":318,"tag":456,"props":4775,"children":4776},{"style":489},[4777],{"type":324,"value":1517},{"type":318,"tag":456,"props":4779,"children":4781},{"class":458,"line":4780},38,[4782,4787,4791],{"type":318,"tag":456,"props":4783,"children":4784},{"style":463},[4785],{"type":324,"value":4786},"    \u003C/",{"type":318,"tag":456,"props":4788,"children":4789},{"style":469},[4790],{"type":324,"value":4701},{"type":318,"tag":456,"props":4792,"children":4793},{"style":463},[4794],{"type":324,"value":477},{"type":318,"tag":456,"props":4796,"children":4798},{"class":458,"line":4797},39,[4799],{"type":318,"tag":456,"props":4800,"children":4801},{"style":463},[4802],{"type":324,"value":4803},"  );\n",{"type":318,"tag":456,"props":4805,"children":4807},{"class":458,"line":4806},40,[4808],{"type":318,"tag":456,"props":4809,"children":4810},{"style":463},[4811],{"type":324,"value":1517},{"type":318,"tag":446,"props":4813,"children":4818},{"className":4814,"code":4815,"filename":4816,"language":4817,"meta":313,"style":313},"language-vue shiki shiki-themes github-light-default github-light-default github-dark-default","\u003Ctemplate>\n  \u003Cbutton @click=\"handleCancel\" :disabled=\"loading\">\n    {{ loading ? 'Loading...' : 'Cancel Subscription' }}\n  \u003C/button>\n\u003C/template>\n\n\u003Cscript>\nexport default {\n  data() {\n    return {\n      loading: false,\n    };\n  },\n  methods: {\n    async handleCancel() {\n      this.loading = true;\n      try {\n        const customerId = this.$auth.user.customerId; // From your auth\n\n        const response = await fetch('/api/churnkey', {\n          method: 'POST',\n          headers: { 'Content-Type': 'application/json' },\n          body: JSON.stringify({ customerId }),\n        });\n\n        const { userHash } = await response.json();\n\n        window.churnkey.init('show', {\n          customerId: customerId,\n          authHash: userHash,\n          subscriptionId: this.$auth.user.subscriptionId,\n          appId: 'YOUR_APP_ID',\n          mode: 'live',\n          provider: 'stripe',\n          record: true,\n        });\n      } catch (error) {\n        console.error('Error:', error);\n      } finally {\n        this.loading = false;\n      }\n    },\n  },\n};\n\u003C/script>\n","Vue.js","vue",[4819],{"type":318,"tag":348,"props":4820,"children":4821},{"__ignoreMap":313},[4822,4838,4906,4935,4951,4966,4973,4988,5003,5020,5031,5047,5055,5067,5075,5091,5116,5128,5159,5166,5201,5217,5241,5265,5273,5280,5319,5326,5350,5358,5366,5384,5400,5416,5432,5448,5455,5471,5495,5510,5535,5544,5553,5565,5577],{"type":318,"tag":456,"props":4823,"children":4824},{"class":458,"line":459},[4825,4829,4834],{"type":318,"tag":456,"props":4826,"children":4827},{"style":463},[4828],{"type":324,"value":466},{"type":318,"tag":456,"props":4830,"children":4831},{"style":469},[4832],{"type":324,"value":4833},"template",{"type":318,"tag":456,"props":4835,"children":4836},{"style":463},[4837],{"type":324,"value":477},{"type":318,"tag":456,"props":4839,"children":4840},{"class":458,"line":480},[4841,4846,4850,4855,4860,4864,4869,4873,4877,4881,4886,4890,4894,4898,4902],{"type":318,"tag":456,"props":4842,"children":4843},{"style":463},[4844],{"type":324,"value":4845},"  \u003C",{"type":318,"tag":456,"props":4847,"children":4848},{"style":469},[4849],{"type":324,"value":4701},{"type":318,"tag":456,"props":4851,"children":4852},{"style":463},[4853],{"type":324,"value":4854}," @",{"type":318,"tag":456,"props":4856,"children":4857},{"style":554},[4858],{"type":324,"value":4859},"click",{"type":318,"tag":456,"props":4861,"children":4862},{"style":463},[4863],{"type":324,"value":546},{"type":318,"tag":456,"props":4865,"children":4866},{"style":463},[4867],{"type":324,"value":4868},"\"",{"type":318,"tag":456,"props":4870,"children":4871},{"style":463},[4872],{"type":324,"value":4716},{"type":318,"tag":456,"props":4874,"children":4875},{"style":463},[4876],{"type":324,"value":4868},{"type":318,"tag":456,"props":4878,"children":4879},{"style":463},[4880],{"type":324,"value":2466},{"type":318,"tag":456,"props":4882,"children":4883},{"style":554},[4884],{"type":324,"value":4885},"disabled",{"type":318,"tag":456,"props":4887,"children":4888},{"style":463},[4889],{"type":324,"value":546},{"type":318,"tag":456,"props":4891,"children":4892},{"style":463},[4893],{"type":324,"value":4868},{"type":318,"tag":456,"props":4895,"children":4896},{"style":463},[4897],{"type":324,"value":4155},{"type":318,"tag":456,"props":4899,"children":4900},{"style":463},[4901],{"type":324,"value":4868},{"type":318,"tag":456,"props":4903,"children":4904},{"style":463},[4905],{"type":324,"value":477},{"type":318,"tag":456,"props":4907,"children":4908},{"class":458,"line":495},[4909,4914,4918,4922,4926,4930],{"type":318,"tag":456,"props":4910,"children":4911},{"style":463},[4912],{"type":324,"value":4913},"    {{ loading ",{"type":318,"tag":456,"props":4915,"children":4916},{"style":489},[4917],{"type":324,"value":4759},{"type":318,"tag":456,"props":4919,"children":4920},{"style":593},[4921],{"type":324,"value":4764},{"type":318,"tag":456,"props":4923,"children":4924},{"style":489},[4925],{"type":324,"value":2466},{"type":318,"tag":456,"props":4927,"children":4928},{"style":593},[4929],{"type":324,"value":4773},{"type":318,"tag":456,"props":4931,"children":4932},{"style":463},[4933],{"type":324,"value":4934}," }}\n",{"type":318,"tag":456,"props":4936,"children":4937},{"class":458,"line":535},[4938,4943,4947],{"type":318,"tag":456,"props":4939,"children":4940},{"style":463},[4941],{"type":324,"value":4942},"  \u003C/",{"type":318,"tag":456,"props":4944,"children":4945},{"style":469},[4946],{"type":324,"value":4701},{"type":318,"tag":456,"props":4948,"children":4949},{"style":463},[4950],{"type":324,"value":477},{"type":318,"tag":456,"props":4952,"children":4953},{"class":458,"line":565},[4954,4958,4962],{"type":318,"tag":456,"props":4955,"children":4956},{"style":463},[4957],{"type":324,"value":732},{"type":318,"tag":456,"props":4959,"children":4960},{"style":469},[4961],{"type":324,"value":4833},{"type":318,"tag":456,"props":4963,"children":4964},{"style":463},[4965],{"type":324,"value":477},{"type":318,"tag":456,"props":4967,"children":4968},{"class":458,"line":604},[4969],{"type":318,"tag":456,"props":4970,"children":4971},{"emptyLinePlaceholder":1029},[4972],{"type":324,"value":1032},{"type":318,"tag":456,"props":4974,"children":4975},{"class":458,"line":627},[4976,4980,4984],{"type":318,"tag":456,"props":4977,"children":4978},{"style":463},[4979],{"type":324,"value":466},{"type":318,"tag":456,"props":4981,"children":4982},{"style":469},[4983],{"type":324,"value":472},{"type":318,"tag":456,"props":4985,"children":4986},{"style":463},[4987],{"type":324,"value":477},{"type":318,"tag":456,"props":4989,"children":4990},{"class":458,"line":649},[4991,4995,4999],{"type":318,"tag":456,"props":4992,"children":4993},{"style":489},[4994],{"type":324,"value":1120},{"type":318,"tag":456,"props":4996,"children":4997},{"style":489},[4998],{"type":324,"value":1125},{"type":318,"tag":456,"props":5000,"children":5001},{"style":1043},[5002],{"type":324,"value":1055},{"type":318,"tag":456,"props":5004,"children":5005},{"class":458,"line":694},[5006,5011,5016],{"type":318,"tag":456,"props":5007,"children":5008},{"style":499},[5009],{"type":324,"value":5010},"  data",{"type":318,"tag":456,"props":5012,"children":5013},{"style":1043},[5014],{"type":324,"value":5015},"() ",{"type":318,"tag":456,"props":5017,"children":5018},{"style":463},[5019],{"type":324,"value":492},{"type":318,"tag":456,"props":5021,"children":5022},{"class":458,"line":703},[5023,5027],{"type":318,"tag":456,"props":5024,"children":5025},{"style":489},[5026],{"type":324,"value":1257},{"type":318,"tag":456,"props":5028,"children":5029},{"style":463},[5030],{"type":324,"value":1055},{"type":318,"tag":456,"props":5032,"children":5033},{"class":458,"line":712},[5034,5039,5043],{"type":318,"tag":456,"props":5035,"children":5036},{"style":463},[5037],{"type":324,"value":5038},"      loading: ",{"type":318,"tag":456,"props":5040,"children":5041},{"style":554},[5042],{"type":324,"value":4187},{"type":318,"tag":456,"props":5044,"children":5045},{"style":463},[5046],{"type":324,"value":892},{"type":318,"tag":456,"props":5048,"children":5049},{"class":458,"line":726},[5050],{"type":318,"tag":456,"props":5051,"children":5052},{"style":463},[5053],{"type":324,"value":5054},"    };\n",{"type":318,"tag":456,"props":5056,"children":5057},{"class":458,"line":1189},[5058,5063],{"type":318,"tag":456,"props":5059,"children":5060},{"style":463},[5061],{"type":324,"value":5062},"  }",{"type":318,"tag":456,"props":5064,"children":5065},{"style":1043},[5066],{"type":324,"value":892},{"type":318,"tag":456,"props":5068,"children":5069},{"class":458,"line":1222},[5070],{"type":318,"tag":456,"props":5071,"children":5072},{"style":463},[5073],{"type":324,"value":5074},"  methods: {\n",{"type":318,"tag":456,"props":5076,"children":5077},{"class":458,"line":1230},[5078,5083,5087],{"type":318,"tag":456,"props":5079,"children":5080},{"style":489},[5081],{"type":324,"value":5082},"    async",{"type":318,"tag":456,"props":5084,"children":5085},{"style":499},[5086],{"type":324,"value":4210},{"type":318,"tag":456,"props":5088,"children":5089},{"style":463},[5090],{"type":324,"value":1954},{"type":318,"tag":456,"props":5092,"children":5093},{"class":458,"line":1251},[5094,5099,5104,5108,5112],{"type":318,"tag":456,"props":5095,"children":5096},{"style":554},[5097],{"type":324,"value":5098},"      this",{"type":318,"tag":456,"props":5100,"children":5101},{"style":463},[5102],{"type":324,"value":5103},".loading ",{"type":318,"tag":456,"props":5105,"children":5106},{"style":489},[5107],{"type":324,"value":546},{"type":318,"tag":456,"props":5109,"children":5110},{"style":554},[5111],{"type":324,"value":642},{"type":318,"tag":456,"props":5113,"children":5114},{"style":463},[5115],{"type":324,"value":624},{"type":318,"tag":456,"props":5117,"children":5118},{"class":458,"line":1303},[5119,5124],{"type":318,"tag":456,"props":5120,"children":5121},{"style":489},[5122],{"type":324,"value":5123},"      try",{"type":318,"tag":456,"props":5125,"children":5126},{"style":463},[5127],{"type":324,"value":1055},{"type":318,"tag":456,"props":5129,"children":5130},{"class":458,"line":1311},[5131,5136,5140,5144,5149,5154],{"type":318,"tag":456,"props":5132,"children":5133},{"style":489},[5134],{"type":324,"value":5135},"        const",{"type":318,"tag":456,"props":5137,"children":5138},{"style":554},[5139],{"type":324,"value":3544},{"type":318,"tag":456,"props":5141,"children":5142},{"style":489},[5143],{"type":324,"value":830},{"type":318,"tag":456,"props":5145,"children":5146},{"style":554},[5147],{"type":324,"value":5148}," this",{"type":318,"tag":456,"props":5150,"children":5151},{"style":463},[5152],{"type":324,"value":5153},".$auth.user.customerId; ",{"type":318,"tag":456,"props":5155,"children":5156},{"style":903},[5157],{"type":324,"value":5158},"// From your auth\n",{"type":318,"tag":456,"props":5160,"children":5161},{"class":458,"line":1319},[5162],{"type":318,"tag":456,"props":5163,"children":5164},{"emptyLinePlaceholder":1029},[5165],{"type":324,"value":1032},{"type":318,"tag":456,"props":5167,"children":5168},{"class":458,"line":1366},[5169,5173,5177,5181,5185,5189,5193,5197],{"type":318,"tag":456,"props":5170,"children":5171},{"style":489},[5172],{"type":324,"value":5135},{"type":318,"tag":456,"props":5174,"children":5175},{"style":554},[5176],{"type":324,"value":3581},{"type":318,"tag":456,"props":5178,"children":5179},{"style":489},[5180],{"type":324,"value":830},{"type":318,"tag":456,"props":5182,"children":5183},{"style":489},[5184],{"type":324,"value":3590},{"type":318,"tag":456,"props":5186,"children":5187},{"style":499},[5188],{"type":324,"value":3595},{"type":318,"tag":456,"props":5190,"children":5191},{"style":463},[5192],{"type":324,"value":590},{"type":318,"tag":456,"props":5194,"children":5195},{"style":593},[5196],{"type":324,"value":3604},{"type":318,"tag":456,"props":5198,"children":5199},{"style":463},[5200],{"type":324,"value":3266},{"type":318,"tag":456,"props":5202,"children":5203},{"class":458,"line":1387},[5204,5209,5213],{"type":318,"tag":456,"props":5205,"children":5206},{"style":463},[5207],{"type":324,"value":5208},"          method: ",{"type":318,"tag":456,"props":5210,"children":5211},{"style":593},[5212],{"type":324,"value":3621},{"type":318,"tag":456,"props":5214,"children":5215},{"style":463},[5216],{"type":324,"value":892},{"type":318,"tag":456,"props":5218,"children":5219},{"class":458,"line":1423},[5220,5225,5229,5233,5237],{"type":318,"tag":456,"props":5221,"children":5222},{"style":463},[5223],{"type":324,"value":5224},"          headers: { ",{"type":318,"tag":456,"props":5226,"children":5227},{"style":593},[5228],{"type":324,"value":4362},{"type":318,"tag":456,"props":5230,"children":5231},{"style":463},[5232],{"type":324,"value":3646},{"type":318,"tag":456,"props":5234,"children":5235},{"style":593},[5236],{"type":324,"value":3651},{"type":318,"tag":456,"props":5238,"children":5239},{"style":463},[5240],{"type":324,"value":4375},{"type":318,"tag":456,"props":5242,"children":5243},{"class":458,"line":1440},[5244,5249,5253,5257,5261],{"type":318,"tag":456,"props":5245,"children":5246},{"style":463},[5247],{"type":324,"value":5248},"          body: ",{"type":318,"tag":456,"props":5250,"children":5251},{"style":554},[5252],{"type":324,"value":3676},{"type":318,"tag":456,"props":5254,"children":5255},{"style":463},[5256],{"type":324,"value":2680},{"type":318,"tag":456,"props":5258,"children":5259},{"style":499},[5260],{"type":324,"value":3685},{"type":318,"tag":456,"props":5262,"children":5263},{"style":463},[5264],{"type":324,"value":4400},{"type":318,"tag":456,"props":5266,"children":5267},{"class":458,"line":1464},[5268],{"type":318,"tag":456,"props":5269,"children":5270},{"style":463},[5271],{"type":324,"value":5272},"        });\n",{"type":318,"tag":456,"props":5274,"children":5275},{"class":458,"line":1472},[5276],{"type":318,"tag":456,"props":5277,"children":5278},{"emptyLinePlaceholder":1029},[5279],{"type":324,"value":1032},{"type":318,"tag":456,"props":5281,"children":5282},{"class":458,"line":1511},[5283,5287,5291,5295,5299,5303,5307,5311,5315],{"type":318,"tag":456,"props":5284,"children":5285},{"style":489},[5286],{"type":324,"value":5135},{"type":318,"tag":456,"props":5288,"children":5289},{"style":463},[5290],{"type":324,"value":1200},{"type":318,"tag":456,"props":5292,"children":5293},{"style":554},[5294],{"type":324,"value":3810},{"type":318,"tag":456,"props":5296,"children":5297},{"style":463},[5298],{"type":324,"value":1210},{"type":318,"tag":456,"props":5300,"children":5301},{"style":489},[5302],{"type":324,"value":546},{"type":318,"tag":456,"props":5304,"children":5305},{"style":489},[5306],{"type":324,"value":3590},{"type":318,"tag":456,"props":5308,"children":5309},{"style":463},[5310],{"type":324,"value":3827},{"type":318,"tag":456,"props":5312,"children":5313},{"style":499},[5314],{"type":324,"value":1285},{"type":318,"tag":456,"props":5316,"children":5317},{"style":463},[5318],{"type":324,"value":723},{"type":318,"tag":456,"props":5320,"children":5321},{"class":458,"line":3163},[5322],{"type":318,"tag":456,"props":5323,"children":5324},{"emptyLinePlaceholder":1029},[5325],{"type":324,"value":1032},{"type":318,"tag":456,"props":5327,"children":5328},{"class":458,"line":3193},[5329,5334,5338,5342,5346],{"type":318,"tag":456,"props":5330,"children":5331},{"style":463},[5332],{"type":324,"value":5333},"        window.churnkey.",{"type":318,"tag":456,"props":5335,"children":5336},{"style":499},[5337],{"type":324,"value":2353},{"type":318,"tag":456,"props":5339,"children":5340},{"style":463},[5341],{"type":324,"value":590},{"type":318,"tag":456,"props":5343,"children":5344},{"style":593},[5345],{"type":324,"value":3261},{"type":318,"tag":456,"props":5347,"children":5348},{"style":463},[5349],{"type":324,"value":3266},{"type":318,"tag":456,"props":5351,"children":5352},{"class":458,"line":3201},[5353],{"type":318,"tag":456,"props":5354,"children":5355},{"style":463},[5356],{"type":324,"value":5357},"          customerId: customerId,\n",{"type":318,"tag":456,"props":5359,"children":5360},{"class":458,"line":3209},[5361],{"type":318,"tag":456,"props":5362,"children":5363},{"style":463},[5364],{"type":324,"value":5365},"          authHash: userHash,\n",{"type":318,"tag":456,"props":5367,"children":5368},{"class":458,"line":3962},[5369,5374,5379],{"type":318,"tag":456,"props":5370,"children":5371},{"style":463},[5372],{"type":324,"value":5373},"          subscriptionId: ",{"type":318,"tag":456,"props":5375,"children":5376},{"style":554},[5377],{"type":324,"value":5378},"this",{"type":318,"tag":456,"props":5380,"children":5381},{"style":463},[5382],{"type":324,"value":5383},".$auth.user.subscriptionId,\n",{"type":318,"tag":456,"props":5385,"children":5386},{"class":458,"line":3983},[5387,5392,5396],{"type":318,"tag":456,"props":5388,"children":5389},{"style":463},[5390],{"type":324,"value":5391},"          appId: ",{"type":318,"tag":456,"props":5393,"children":5394},{"style":593},[5395],{"type":324,"value":3345},{"type":318,"tag":456,"props":5397,"children":5398},{"style":463},[5399],{"type":324,"value":892},{"type":318,"tag":456,"props":5401,"children":5402},{"class":458,"line":4004},[5403,5408,5412],{"type":318,"tag":456,"props":5404,"children":5405},{"style":463},[5406],{"type":324,"value":5407},"          mode: ",{"type":318,"tag":456,"props":5409,"children":5410},{"style":593},[5411],{"type":324,"value":3367},{"type":318,"tag":456,"props":5413,"children":5414},{"style":463},[5415],{"type":324,"value":892},{"type":318,"tag":456,"props":5417,"children":5418},{"class":458,"line":4012},[5419,5424,5428],{"type":318,"tag":456,"props":5420,"children":5421},{"style":463},[5422],{"type":324,"value":5423},"          provider: ",{"type":318,"tag":456,"props":5425,"children":5426},{"style":593},[5427],{"type":324,"value":3389},{"type":318,"tag":456,"props":5429,"children":5430},{"style":463},[5431],{"type":324,"value":892},{"type":318,"tag":456,"props":5433,"children":5434},{"class":458,"line":4030},[5435,5440,5444],{"type":318,"tag":456,"props":5436,"children":5437},{"style":463},[5438],{"type":324,"value":5439},"          record: ",{"type":318,"tag":456,"props":5441,"children":5442},{"style":554},[5443],{"type":324,"value":557},{"type":318,"tag":456,"props":5445,"children":5446},{"style":463},[5447],{"type":324,"value":892},{"type":318,"tag":456,"props":5449,"children":5450},{"class":458,"line":4057},[5451],{"type":318,"tag":456,"props":5452,"children":5453},{"style":463},[5454],{"type":324,"value":5272},{"type":318,"tag":456,"props":5456,"children":5457},{"class":458,"line":4065},[5458,5463,5467],{"type":318,"tag":456,"props":5459,"children":5460},{"style":463},[5461],{"type":324,"value":5462},"      } ",{"type":318,"tag":456,"props":5464,"children":5465},{"style":489},[5466],{"type":324,"value":2561},{"type":318,"tag":456,"props":5468,"children":5469},{"style":463},[5470],{"type":324,"value":4027},{"type":318,"tag":456,"props":5472,"children":5473},{"class":458,"line":4780},[5474,5479,5483,5487,5491],{"type":318,"tag":456,"props":5475,"children":5476},{"style":463},[5477],{"type":324,"value":5478},"        console.",{"type":318,"tag":456,"props":5480,"children":5481},{"style":499},[5482],{"type":324,"value":3755},{"type":318,"tag":456,"props":5484,"children":5485},{"style":463},[5486],{"type":324,"value":590},{"type":318,"tag":456,"props":5488,"children":5489},{"style":593},[5490],{"type":324,"value":4615},{"type":318,"tag":456,"props":5492,"children":5493},{"style":463},[5494],{"type":324,"value":4054},{"type":318,"tag":456,"props":5496,"children":5497},{"class":458,"line":4797},[5498,5502,5506],{"type":318,"tag":456,"props":5499,"children":5500},{"style":463},[5501],{"type":324,"value":5462},{"type":318,"tag":456,"props":5503,"children":5504},{"style":489},[5505],{"type":324,"value":4631},{"type":318,"tag":456,"props":5507,"children":5508},{"style":463},[5509],{"type":324,"value":1055},{"type":318,"tag":456,"props":5511,"children":5512},{"class":458,"line":4806},[5513,5518,5522,5526,5531],{"type":318,"tag":456,"props":5514,"children":5515},{"style":554},[5516],{"type":324,"value":5517},"        this",{"type":318,"tag":456,"props":5519,"children":5520},{"style":463},[5521],{"type":324,"value":5103},{"type":318,"tag":456,"props":5523,"children":5524},{"style":489},[5525],{"type":324,"value":546},{"type":318,"tag":456,"props":5527,"children":5528},{"style":554},[5529],{"type":324,"value":5530}," false",{"type":318,"tag":456,"props":5532,"children":5533},{"style":463},[5534],{"type":324,"value":624},{"type":318,"tag":456,"props":5536,"children":5538},{"class":458,"line":5537},41,[5539],{"type":318,"tag":456,"props":5540,"children":5541},{"style":463},[5542],{"type":324,"value":5543},"      }\n",{"type":318,"tag":456,"props":5545,"children":5547},{"class":458,"line":5546},42,[5548],{"type":318,"tag":456,"props":5549,"children":5550},{"style":463},[5551],{"type":324,"value":5552},"    },\n",{"type":318,"tag":456,"props":5554,"children":5556},{"class":458,"line":5555},43,[5557,5561],{"type":318,"tag":456,"props":5558,"children":5559},{"style":463},[5560],{"type":324,"value":5062},{"type":318,"tag":456,"props":5562,"children":5563},{"style":1043},[5564],{"type":324,"value":892},{"type":318,"tag":456,"props":5566,"children":5568},{"class":458,"line":5567},44,[5569,5573],{"type":318,"tag":456,"props":5570,"children":5571},{"style":1043},[5572],{"type":324,"value":718},{"type":318,"tag":456,"props":5574,"children":5575},{"style":463},[5576],{"type":324,"value":624},{"type":318,"tag":456,"props":5578,"children":5580},{"class":458,"line":5579},45,[5581,5585,5589],{"type":318,"tag":456,"props":5582,"children":5583},{"style":463},[5584],{"type":324,"value":732},{"type":318,"tag":456,"props":5586,"children":5587},{"style":469},[5588],{"type":324,"value":472},{"type":318,"tag":456,"props":5590,"children":5591},{"style":463},[5592],{"type":324,"value":477},{"type":318,"tag":446,"props":5594,"children":5598},{"className":5595,"code":5596,"filename":961,"language":5597,"meta":313,"style":313},"language-typescript shiki shiki-themes github-light-default github-light-default github-dark-default","'use client';\n\nimport { useState } from 'react';\n\nexport default function CancelButton({ user }: { user: User }) {\n  const [loading, setLoading] = useState(false);\n\n  const handleCancel = async () => {\n    setLoading(true);\n    try {\n      const response = await fetch('/api/churnkey', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ customerId: user.customerId }),\n      });\n\n      const { userHash } = await response.json();\n\n      window.churnkey.init('show', {\n        customerId: user.customerId,\n        authHash: userHash,\n        subscriptionId: user.subscriptionId,\n        appId: process.env.NEXT_PUBLIC_CHURNKEY_APP_ID,\n        mode: 'live',\n        provider: 'stripe',\n        record: true,\n      });\n    } catch (error) {\n      console.error('Error:', error);\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    \u003Cbutton onClick={handleCancel} disabled={loading}>\n      {loading ? 'Loading...' : 'Cancel Subscription'}\n    \u003C/button>\n  );\n}\n","typescript",[5599],{"type":318,"tag":348,"props":5600,"children":5601},{"__ignoreMap":313},[5602,5614,5621,5644,5651,5697,5744,5751,5782,5801,5812,5847,5862,5885,5909,5916,5923,5962,5969,5992,6000,6007,6014,6031,6046,6061,6076,6083,6098,6121,6136,6155,6162,6169,6176,6187,6221,6256,6271,6278],{"type":318,"tag":456,"props":5603,"children":5604},{"class":458,"line":459},[5605,5610],{"type":318,"tag":456,"props":5606,"children":5607},{"style":593},[5608],{"type":324,"value":5609},"'use client'",{"type":318,"tag":456,"props":5611,"children":5612},{"style":463},[5613],{"type":324,"value":624},{"type":318,"tag":456,"props":5615,"children":5616},{"class":458,"line":480},[5617],{"type":318,"tag":456,"props":5618,"children":5619},{"emptyLinePlaceholder":1029},[5620],{"type":324,"value":1032},{"type":318,"tag":456,"props":5622,"children":5623},{"class":458,"line":495},[5624,5628,5632,5636,5640],{"type":318,"tag":456,"props":5625,"children":5626},{"style":489},[5627],{"type":324,"value":974},{"type":318,"tag":456,"props":5629,"children":5630},{"style":463},[5631],{"type":324,"value":4101},{"type":318,"tag":456,"props":5633,"children":5634},{"style":489},[5635],{"type":324,"value":984},{"type":318,"tag":456,"props":5637,"children":5638},{"style":593},[5639],{"type":324,"value":4110},{"type":318,"tag":456,"props":5641,"children":5642},{"style":463},[5643],{"type":324,"value":624},{"type":318,"tag":456,"props":5645,"children":5646},{"class":458,"line":535},[5647],{"type":318,"tag":456,"props":5648,"children":5649},{"emptyLinePlaceholder":1029},[5650],{"type":324,"value":1032},{"type":318,"tag":456,"props":5652,"children":5653},{"class":458,"line":565},[5654,5658,5662,5666,5670,5675,5679,5684,5688,5693],{"type":318,"tag":456,"props":5655,"children":5656},{"style":489},[5657],{"type":324,"value":1120},{"type":318,"tag":456,"props":5659,"children":5660},{"style":489},[5661],{"type":324,"value":1125},{"type":318,"tag":456,"props":5663,"children":5664},{"style":489},[5665],{"type":324,"value":1130},{"type":318,"tag":456,"props":5667,"children":5668},{"style":499},[5669],{"type":324,"value":4134},{"type":318,"tag":456,"props":5671,"children":5672},{"style":1043},[5673],{"type":324,"value":5674},"({ user }",{"type":318,"tag":456,"props":5676,"children":5677},{"style":489},[5678],{"type":324,"value":1152},{"type":318,"tag":456,"props":5680,"children":5681},{"style":1043},[5682],{"type":324,"value":5683}," { user",{"type":318,"tag":456,"props":5685,"children":5686},{"style":489},[5687],{"type":324,"value":1152},{"type":318,"tag":456,"props":5689,"children":5690},{"style":1043},[5691],{"type":324,"value":5692}," User }) ",{"type":318,"tag":456,"props":5694,"children":5695},{"style":463},[5696],{"type":324,"value":492},{"type":318,"tag":456,"props":5698,"children":5699},{"class":458,"line":604},[5700,5704,5708,5712,5716,5720,5724,5728,5732,5736,5740],{"type":318,"tag":456,"props":5701,"children":5702},{"style":489},[5703],{"type":324,"value":1195},{"type":318,"tag":456,"props":5705,"children":5706},{"style":463},[5707],{"type":324,"value":4150},{"type":318,"tag":456,"props":5709,"children":5710},{"style":554},[5711],{"type":324,"value":4155},{"type":318,"tag":456,"props":5713,"children":5714},{"style":463},[5715],{"type":324,"value":1411},{"type":318,"tag":456,"props":5717,"children":5718},{"style":554},[5719],{"type":324,"value":4164},{"type":318,"tag":456,"props":5721,"children":5722},{"style":463},[5723],{"type":324,"value":4169},{"type":318,"tag":456,"props":5725,"children":5726},{"style":489},[5727],{"type":324,"value":546},{"type":318,"tag":456,"props":5729,"children":5730},{"style":499},[5731],{"type":324,"value":4178},{"type":318,"tag":456,"props":5733,"children":5734},{"style":463},[5735],{"type":324,"value":590},{"type":318,"tag":456,"props":5737,"children":5738},{"style":554},[5739],{"type":324,"value":4187},{"type":318,"tag":456,"props":5741,"children":5742},{"style":463},[5743],{"type":324,"value":601},{"type":318,"tag":456,"props":5745,"children":5746},{"class":458,"line":627},[5747],{"type":318,"tag":456,"props":5748,"children":5749},{"emptyLinePlaceholder":1029},[5750],{"type":324,"value":1032},{"type":318,"tag":456,"props":5752,"children":5753},{"class":458,"line":649},[5754,5758,5762,5766,5770,5774,5778],{"type":318,"tag":456,"props":5755,"children":5756},{"style":489},[5757],{"type":324,"value":1195},{"type":318,"tag":456,"props":5759,"children":5760},{"style":499},[5761],{"type":324,"value":4210},{"type":318,"tag":456,"props":5763,"children":5764},{"style":489},[5765],{"type":324,"value":830},{"type":318,"tag":456,"props":5767,"children":5768},{"style":489},[5769],{"type":324,"value":4219},{"type":318,"tag":456,"props":5771,"children":5772},{"style":463},[5773],{"type":324,"value":4224},{"type":318,"tag":456,"props":5775,"children":5776},{"style":489},[5777],{"type":324,"value":4229},{"type":318,"tag":456,"props":5779,"children":5780},{"style":463},[5781],{"type":324,"value":1055},{"type":318,"tag":456,"props":5783,"children":5784},{"class":458,"line":694},[5785,5789,5793,5797],{"type":318,"tag":456,"props":5786,"children":5787},{"style":499},[5788],{"type":324,"value":4241},{"type":318,"tag":456,"props":5790,"children":5791},{"style":463},[5792],{"type":324,"value":590},{"type":318,"tag":456,"props":5794,"children":5795},{"style":554},[5796],{"type":324,"value":557},{"type":318,"tag":456,"props":5798,"children":5799},{"style":463},[5800],{"type":324,"value":601},{"type":318,"tag":456,"props":5802,"children":5803},{"class":458,"line":703},[5804,5808],{"type":318,"tag":456,"props":5805,"children":5806},{"style":489},[5807],{"type":324,"value":4261},{"type":318,"tag":456,"props":5809,"children":5810},{"style":463},[5811],{"type":324,"value":1055},{"type":318,"tag":456,"props":5813,"children":5814},{"class":458,"line":712},[5815,5819,5823,5827,5831,5835,5839,5843],{"type":318,"tag":456,"props":5816,"children":5817},{"style":489},[5818],{"type":324,"value":4273},{"type":318,"tag":456,"props":5820,"children":5821},{"style":554},[5822],{"type":324,"value":3581},{"type":318,"tag":456,"props":5824,"children":5825},{"style":489},[5826],{"type":324,"value":830},{"type":318,"tag":456,"props":5828,"children":5829},{"style":489},[5830],{"type":324,"value":3590},{"type":318,"tag":456,"props":5832,"children":5833},{"style":499},[5834],{"type":324,"value":3595},{"type":318,"tag":456,"props":5836,"children":5837},{"style":463},[5838],{"type":324,"value":590},{"type":318,"tag":456,"props":5840,"children":5841},{"style":593},[5842],{"type":324,"value":3604},{"type":318,"tag":456,"props":5844,"children":5845},{"style":463},[5846],{"type":324,"value":3266},{"type":318,"tag":456,"props":5848,"children":5849},{"class":458,"line":726},[5850,5854,5858],{"type":318,"tag":456,"props":5851,"children":5852},{"style":463},[5853],{"type":324,"value":4341},{"type":318,"tag":456,"props":5855,"children":5856},{"style":593},[5857],{"type":324,"value":3621},{"type":318,"tag":456,"props":5859,"children":5860},{"style":463},[5861],{"type":324,"value":892},{"type":318,"tag":456,"props":5863,"children":5864},{"class":458,"line":1189},[5865,5869,5873,5877,5881],{"type":318,"tag":456,"props":5866,"children":5867},{"style":463},[5868],{"type":324,"value":4357},{"type":318,"tag":456,"props":5870,"children":5871},{"style":593},[5872],{"type":324,"value":4362},{"type":318,"tag":456,"props":5874,"children":5875},{"style":463},[5876],{"type":324,"value":3646},{"type":318,"tag":456,"props":5878,"children":5879},{"style":593},[5880],{"type":324,"value":3651},{"type":318,"tag":456,"props":5882,"children":5883},{"style":463},[5884],{"type":324,"value":4375},{"type":318,"tag":456,"props":5886,"children":5887},{"class":458,"line":1222},[5888,5892,5896,5900,5904],{"type":318,"tag":456,"props":5889,"children":5890},{"style":463},[5891],{"type":324,"value":4383},{"type":318,"tag":456,"props":5893,"children":5894},{"style":554},[5895],{"type":324,"value":3676},{"type":318,"tag":456,"props":5897,"children":5898},{"style":463},[5899],{"type":324,"value":2680},{"type":318,"tag":456,"props":5901,"children":5902},{"style":499},[5903],{"type":324,"value":3685},{"type":318,"tag":456,"props":5905,"children":5906},{"style":463},[5907],{"type":324,"value":5908},"({ customerId: user.customerId }),\n",{"type":318,"tag":456,"props":5910,"children":5911},{"class":458,"line":1230},[5912],{"type":318,"tag":456,"props":5913,"children":5914},{"style":463},[5915],{"type":324,"value":4408},{"type":318,"tag":456,"props":5917,"children":5918},{"class":458,"line":1251},[5919],{"type":318,"tag":456,"props":5920,"children":5921},{"emptyLinePlaceholder":1029},[5922],{"type":324,"value":1032},{"type":318,"tag":456,"props":5924,"children":5925},{"class":458,"line":1303},[5926,5930,5934,5938,5942,5946,5950,5954,5958],{"type":318,"tag":456,"props":5927,"children":5928},{"style":489},[5929],{"type":324,"value":4273},{"type":318,"tag":456,"props":5931,"children":5932},{"style":463},[5933],{"type":324,"value":1200},{"type":318,"tag":456,"props":5935,"children":5936},{"style":554},[5937],{"type":324,"value":3810},{"type":318,"tag":456,"props":5939,"children":5940},{"style":463},[5941],{"type":324,"value":1210},{"type":318,"tag":456,"props":5943,"children":5944},{"style":489},[5945],{"type":324,"value":546},{"type":318,"tag":456,"props":5947,"children":5948},{"style":489},[5949],{"type":324,"value":3590},{"type":318,"tag":456,"props":5951,"children":5952},{"style":463},[5953],{"type":324,"value":3827},{"type":318,"tag":456,"props":5955,"children":5956},{"style":499},[5957],{"type":324,"value":1285},{"type":318,"tag":456,"props":5959,"children":5960},{"style":463},[5961],{"type":324,"value":723},{"type":318,"tag":456,"props":5963,"children":5964},{"class":458,"line":1311},[5965],{"type":318,"tag":456,"props":5966,"children":5967},{"emptyLinePlaceholder":1029},[5968],{"type":324,"value":1032},{"type":318,"tag":456,"props":5970,"children":5971},{"class":458,"line":1319},[5972,5976,5980,5984,5988],{"type":318,"tag":456,"props":5973,"children":5974},{"style":463},[5975],{"type":324,"value":4469},{"type":318,"tag":456,"props":5977,"children":5978},{"style":499},[5979],{"type":324,"value":2353},{"type":318,"tag":456,"props":5981,"children":5982},{"style":463},[5983],{"type":324,"value":590},{"type":318,"tag":456,"props":5985,"children":5986},{"style":593},[5987],{"type":324,"value":3261},{"type":318,"tag":456,"props":5989,"children":5990},{"style":463},[5991],{"type":324,"value":3266},{"type":318,"tag":456,"props":5993,"children":5994},{"class":458,"line":1366},[5995],{"type":318,"tag":456,"props":5996,"children":5997},{"style":463},[5998],{"type":324,"value":5999},"        customerId: user.customerId,\n",{"type":318,"tag":456,"props":6001,"children":6002},{"class":458,"line":1387},[6003],{"type":318,"tag":456,"props":6004,"children":6005},{"style":463},[6006],{"type":324,"value":4500},{"type":318,"tag":456,"props":6008,"children":6009},{"class":458,"line":1423},[6010],{"type":318,"tag":456,"props":6011,"children":6012},{"style":463},[6013],{"type":324,"value":4508},{"type":318,"tag":456,"props":6015,"children":6016},{"class":458,"line":1440},[6017,6022,6027],{"type":318,"tag":456,"props":6018,"children":6019},{"style":463},[6020],{"type":324,"value":6021},"        appId: process.env.",{"type":318,"tag":456,"props":6023,"children":6024},{"style":554},[6025],{"type":324,"value":6026},"NEXT_PUBLIC_CHURNKEY_APP_ID",{"type":318,"tag":456,"props":6028,"children":6029},{"style":463},[6030],{"type":324,"value":892},{"type":318,"tag":456,"props":6032,"children":6033},{"class":458,"line":1464},[6034,6038,6042],{"type":318,"tag":456,"props":6035,"children":6036},{"style":463},[6037],{"type":324,"value":4532},{"type":318,"tag":456,"props":6039,"children":6040},{"style":593},[6041],{"type":324,"value":3367},{"type":318,"tag":456,"props":6043,"children":6044},{"style":463},[6045],{"type":324,"value":892},{"type":318,"tag":456,"props":6047,"children":6048},{"class":458,"line":1472},[6049,6053,6057],{"type":318,"tag":456,"props":6050,"children":6051},{"style":463},[6052],{"type":324,"value":4548},{"type":318,"tag":456,"props":6054,"children":6055},{"style":593},[6056],{"type":324,"value":3389},{"type":318,"tag":456,"props":6058,"children":6059},{"style":463},[6060],{"type":324,"value":892},{"type":318,"tag":456,"props":6062,"children":6063},{"class":458,"line":1511},[6064,6068,6072],{"type":318,"tag":456,"props":6065,"children":6066},{"style":463},[6067],{"type":324,"value":4564},{"type":318,"tag":456,"props":6069,"children":6070},{"style":554},[6071],{"type":324,"value":557},{"type":318,"tag":456,"props":6073,"children":6074},{"style":463},[6075],{"type":324,"value":892},{"type":318,"tag":456,"props":6077,"children":6078},{"class":458,"line":3163},[6079],{"type":318,"tag":456,"props":6080,"children":6081},{"style":463},[6082],{"type":324,"value":4408},{"type":318,"tag":456,"props":6084,"children":6085},{"class":458,"line":3193},[6086,6090,6094],{"type":318,"tag":456,"props":6087,"children":6088},{"style":463},[6089],{"type":324,"value":4587},{"type":318,"tag":456,"props":6091,"children":6092},{"style":489},[6093],{"type":324,"value":2561},{"type":318,"tag":456,"props":6095,"children":6096},{"style":463},[6097],{"type":324,"value":4027},{"type":318,"tag":456,"props":6099,"children":6100},{"class":458,"line":3201},[6101,6105,6109,6113,6117],{"type":318,"tag":456,"props":6102,"children":6103},{"style":463},[6104],{"type":324,"value":3750},{"type":318,"tag":456,"props":6106,"children":6107},{"style":499},[6108],{"type":324,"value":3755},{"type":318,"tag":456,"props":6110,"children":6111},{"style":463},[6112],{"type":324,"value":590},{"type":318,"tag":456,"props":6114,"children":6115},{"style":593},[6116],{"type":324,"value":4615},{"type":318,"tag":456,"props":6118,"children":6119},{"style":463},[6120],{"type":324,"value":4054},{"type":318,"tag":456,"props":6122,"children":6123},{"class":458,"line":3209},[6124,6128,6132],{"type":318,"tag":456,"props":6125,"children":6126},{"style":463},[6127],{"type":324,"value":4587},{"type":318,"tag":456,"props":6129,"children":6130},{"style":489},[6131],{"type":324,"value":4631},{"type":318,"tag":456,"props":6133,"children":6134},{"style":463},[6135],{"type":324,"value":1055},{"type":318,"tag":456,"props":6137,"children":6138},{"class":458,"line":3962},[6139,6143,6147,6151],{"type":318,"tag":456,"props":6140,"children":6141},{"style":499},[6142],{"type":324,"value":4643},{"type":318,"tag":456,"props":6144,"children":6145},{"style":463},[6146],{"type":324,"value":590},{"type":318,"tag":456,"props":6148,"children":6149},{"style":554},[6150],{"type":324,"value":4187},{"type":318,"tag":456,"props":6152,"children":6153},{"style":463},[6154],{"type":324,"value":601},{"type":318,"tag":456,"props":6156,"children":6157},{"class":458,"line":3983},[6158],{"type":318,"tag":456,"props":6159,"children":6160},{"style":463},[6161],{"type":324,"value":2630},{"type":318,"tag":456,"props":6163,"children":6164},{"class":458,"line":4004},[6165],{"type":318,"tag":456,"props":6166,"children":6167},{"style":463},[6168],{"type":324,"value":4670},{"type":318,"tag":456,"props":6170,"children":6171},{"class":458,"line":4012},[6172],{"type":318,"tag":456,"props":6173,"children":6174},{"emptyLinePlaceholder":1029},[6175],{"type":324,"value":1032},{"type":318,"tag":456,"props":6177,"children":6178},{"class":458,"line":4030},[6179,6183],{"type":318,"tag":456,"props":6180,"children":6181},{"style":489},[6182],{"type":324,"value":1478},{"type":318,"tag":456,"props":6184,"children":6185},{"style":463},[6186],{"type":324,"value":1872},{"type":318,"tag":456,"props":6188,"children":6189},{"class":458,"line":4057},[6190,6194,6199,6203,6208,6212,6217],{"type":318,"tag":456,"props":6191,"children":6192},{"style":489},[6193],{"type":324,"value":4696},{"type":318,"tag":456,"props":6195,"children":6196},{"style":463},[6197],{"type":324,"value":6198},"button onClick",{"type":318,"tag":456,"props":6200,"children":6201},{"style":489},[6202],{"type":324,"value":546},{"type":318,"tag":456,"props":6204,"children":6205},{"style":463},[6206],{"type":324,"value":6207},"{handleCancel} disabled",{"type":318,"tag":456,"props":6209,"children":6210},{"style":489},[6211],{"type":324,"value":546},{"type":318,"tag":456,"props":6213,"children":6214},{"style":463},[6215],{"type":324,"value":6216},"{loading}",{"type":318,"tag":456,"props":6218,"children":6219},{"style":489},[6220],{"type":324,"value":477},{"type":318,"tag":456,"props":6222,"children":6223},{"class":458,"line":4065},[6224,6228,6232,6237,6242,6247,6252],{"type":318,"tag":456,"props":6225,"children":6226},{"style":463},[6227],{"type":324,"value":4749},{"type":318,"tag":456,"props":6229,"children":6230},{"style":1043},[6231],{"type":324,"value":4155},{"type":318,"tag":456,"props":6233,"children":6234},{"style":463},[6235],{"type":324,"value":6236}," ? ",{"type":318,"tag":456,"props":6238,"children":6239},{"style":593},[6240],{"type":324,"value":6241},"'Loading...'",{"type":318,"tag":456,"props":6243,"children":6244},{"style":463},[6245],{"type":324,"value":6246}," : ",{"type":318,"tag":456,"props":6248,"children":6249},{"style":593},[6250],{"type":324,"value":6251},"'Cancel Subscription'",{"type":318,"tag":456,"props":6253,"children":6254},{"style":463},[6255],{"type":324,"value":1517},{"type":318,"tag":456,"props":6257,"children":6258},{"class":458,"line":4780},[6259,6263,6267],{"type":318,"tag":456,"props":6260,"children":6261},{"style":489},[6262],{"type":324,"value":4786},{"type":318,"tag":456,"props":6264,"children":6265},{"style":463},[6266],{"type":324,"value":4701},{"type":318,"tag":456,"props":6268,"children":6269},{"style":489},[6270],{"type":324,"value":477},{"type":318,"tag":456,"props":6272,"children":6273},{"class":458,"line":4797},[6274],{"type":318,"tag":456,"props":6275,"children":6276},{"style":463},[6277],{"type":324,"value":4803},{"type":318,"tag":456,"props":6279,"children":6280},{"class":458,"line":4806},[6281],{"type":318,"tag":456,"props":6282,"children":6283},{"style":463},[6284],{"type":324,"value":1517},{"type":318,"tag":319,"props":6286,"children":6288},{"id":6287},"troubleshooting-common-issues",[6289],{"type":324,"value":6290},"Troubleshooting Common Issues",{"type":318,"tag":4073,"props":6292,"children":6294},{"id":6293},"hmac-authentication-error-invalid-authhash",[6295],{"type":324,"value":6296},"HMAC Authentication Error: \"Invalid authHash\"",{"type":318,"tag":326,"props":6298,"children":6299},{},[6300],{"type":324,"value":6301},"If you receive an authentication error when initializing Churnkey, this indicates that the HMAC hash generated by your backend doesn't match what Churnkey expects.",{"type":318,"tag":326,"props":6303,"children":6304},{},[6305],{"type":318,"tag":340,"props":6306,"children":6307},{},[6308],{"type":324,"value":6309},"Verify your HMAC implementation",{"type":318,"tag":326,"props":6311,"children":6312},{},[6313],{"type":324,"value":6314},"Churnkey provides an HMAC verification tool in the dashboard to help you debug authentication issues:",{"type":318,"tag":332,"props":6316,"children":6317},{},[6318,6330,6342,6354,6373,6378],{"type":318,"tag":336,"props":6319,"children":6320},{},[6321,6323,6328],{"type":324,"value":6322},"Navigate to ",{"type":318,"tag":340,"props":6324,"children":6325},{},[6326],{"type":324,"value":6327},"Settings",{"type":324,"value":6329}," (bottom left corner)",{"type":318,"tag":336,"props":6331,"children":6332},{},[6333,6335,6340],{"type":324,"value":6334},"Click ",{"type":318,"tag":340,"props":6336,"children":6337},{},[6338],{"type":324,"value":6339},"Installation",{"type":324,"value":6341}," in the top menu",{"type":318,"tag":336,"props":6343,"children":6344},{},[6345,6347,6352],{"type":324,"value":6346},"Scroll down to the ",{"type":318,"tag":340,"props":6348,"children":6349},{},[6350],{"type":324,"value":6351},"Verify Your Server Implementation",{"type":324,"value":6353}," section",{"type":318,"tag":336,"props":6355,"children":6356},{},[6357,6359,6364,6366,6371],{"type":324,"value":6358},"Select the ",{"type":318,"tag":340,"props":6360,"children":6361},{},[6362],{"type":324,"value":6363},"Production API Key",{"type":324,"value":6365}," or ",{"type":318,"tag":340,"props":6367,"children":6368},{},[6369],{"type":324,"value":6370},"Test API Key",{"type":324,"value":6372}," (depending on which environment you're testing)",{"type":318,"tag":336,"props":6374,"children":6375},{},[6376],{"type":324,"value":6377},"Enter the customerId in the input field",{"type":318,"tag":336,"props":6379,"children":6380},{},[6381],{"type":324,"value":6382},"Compare this hash with what your backend is producing",{"type":318,"tag":326,"props":6384,"children":6385},{"align":435},[6386,6387],{"type":324,"value":438},{"type":318,"tag":440,"props":6388,"children":6391},{"src":6389,"alt":6390},"./img/cancel_flow/hmac_generator.png","HMAC Hash Generator",[],{"type":318,"tag":326,"props":6393,"children":6394},{},[6395],{"type":318,"tag":340,"props":6396,"children":6397},{},[6398],{"type":324,"value":6399},"Common causes of HMAC mismatches:",{"type":318,"tag":6401,"props":6402,"children":6403},"ul",{},[6404,6414,6432],{"type":318,"tag":336,"props":6405,"children":6406},{},[6407,6412],{"type":318,"tag":340,"props":6408,"children":6409},{},[6410],{"type":324,"value":6411},"Extra whitespace",{"type":324,"value":6413},": Make sure there are no leading or trailing spaces in your Customer ID or API Key when generating the hash.",{"type":318,"tag":336,"props":6415,"children":6416},{},[6417,6422,6424,6430],{"type":318,"tag":340,"props":6418,"children":6419},{},[6420],{"type":324,"value":6421},"Encoding issues",{"type":324,"value":6423},": The HMAC hash should be a hexadecimal string. Verify that your implementation uses ",{"type":318,"tag":348,"props":6425,"children":6427},{"className":6426},[],[6428],{"type":324,"value":6429},".digest(\"hex\")",{"type":324,"value":6431}," or equivalent in your language.",{"type":318,"tag":336,"props":6433,"children":6434},{},[6435,6440],{"type":318,"tag":340,"props":6436,"children":6437},{},[6438],{"type":324,"value":6439},"API key mismatch",{"type":324,"value":6441},": Ensure you're using the correct API key for your environment (Test API Key for test mode, Production API Key for live mode).",{"type":318,"tag":4073,"props":6443,"children":6445},{"id":6444},"cancel-flow-modal-not-displaying",[6446],{"type":324,"value":6447},"Cancel Flow Modal Not Displaying",{"type":318,"tag":326,"props":6449,"children":6450},{},[6451,6453,6458],{"type":324,"value":6452},"If the Churnkey modal doesn't appear after clicking the cancel button, this is typically caused by a ",{"type":318,"tag":340,"props":6454,"children":6455},{},[6456],{"type":324,"value":6457},"timing issue",{"type":324,"value":6459}," in server-side rendered (SSR) applications. The Churnkey script attempts to initialize before the page has fully hydrated, preventing the modal from rendering correctly.",{"type":318,"tag":326,"props":6461,"children":6462},{},[6463],{"type":318,"tag":340,"props":6464,"children":6465},{},[6466],{"type":324,"value":6467},"What's happening:",{"type":318,"tag":326,"props":6469,"children":6470},{},[6471,6473,6478,6480,6485],{"type":324,"value":6472},"When your application uses server-side rendering (Next.js, Nuxt, SvelteKit, etc.), the page goes through a hydration process where the server-rendered HTML is converted into an interactive client-side application. If the Churnkey script loads during this hydration phase, ",{"type":318,"tag":348,"props":6474,"children":6476},{"className":6475},[],[6477],{"type":324,"value":353},{"type":324,"value":6479}," may not be fully initialized when you call ",{"type":318,"tag":348,"props":6481,"children":6483},{"className":6482},[],[6484],{"type":324,"value":3231},{"type":324,"value":6486},". While the API call succeeds, the modal interface fails to render.",{"type":318,"tag":326,"props":6488,"children":6489},{},[6490],{"type":318,"tag":340,"props":6491,"children":6492},{},[6493],{"type":324,"value":6494},"Solution:",{"type":318,"tag":326,"props":6496,"children":6497},{},[6498,6500,6505],{"type":324,"value":6499},"Ensure the Churnkey script loads ",{"type":318,"tag":340,"props":6501,"children":6502},{},[6503],{"type":324,"value":6504},"after",{"type":324,"value":6506}," the page has completed hydration. In most modern frameworks, this means loading the script within a client-side lifecycle method or hook.",{"type":318,"tag":326,"props":6508,"children":6509},{},[6510],{"type":318,"tag":340,"props":6511,"children":6512},{},[6513],{"type":324,"value":6514},"Framework-specific implementations:",{"type":318,"tag":800,"props":6516,"children":6517},{},[6518,6828,7176],{"type":318,"tag":446,"props":6519,"children":6521},{"className":448,"code":6520,"filename":4085,"language":450,"meta":313,"style":313},"import { useEffect } from 'react';\n\nfunction App() {\n  useEffect(() => {\n    // Load Churnkey script after component mounts (hydration complete)\n    if (!window.churnkey || !window.churnkey.created) {\n      window.churnkey = { created: true };\n      const script = document.createElement('script');\n      script.src = 'https://assets.churnkey.co/js/app.js?appId=YOUR_APP_ID';\n      script.async = true;\n      document.head.appendChild(script);\n    }\n  }, []);\n\n  return \u003Cdiv>{/* Your app content */}\u003C/div>;\n}\n",[6522],{"type":318,"tag":348,"props":6523,"children":6524},{"__ignoreMap":313},[6525,6549,6556,6572,6593,6601,6632,6656,6692,6712,6732,6750,6757,6765,6772,6821],{"type":318,"tag":456,"props":6526,"children":6527},{"class":458,"line":459},[6528,6532,6537,6541,6545],{"type":318,"tag":456,"props":6529,"children":6530},{"style":489},[6531],{"type":324,"value":974},{"type":318,"tag":456,"props":6533,"children":6534},{"style":463},[6535],{"type":324,"value":6536}," { useEffect } ",{"type":318,"tag":456,"props":6538,"children":6539},{"style":489},[6540],{"type":324,"value":984},{"type":318,"tag":456,"props":6542,"children":6543},{"style":593},[6544],{"type":324,"value":4110},{"type":318,"tag":456,"props":6546,"children":6547},{"style":463},[6548],{"type":324,"value":624},{"type":318,"tag":456,"props":6550,"children":6551},{"class":458,"line":480},[6552],{"type":318,"tag":456,"props":6553,"children":6554},{"emptyLinePlaceholder":1029},[6555],{"type":324,"value":1032},{"type":318,"tag":456,"props":6557,"children":6558},{"class":458,"line":495},[6559,6563,6568],{"type":318,"tag":456,"props":6560,"children":6561},{"style":489},[6562],{"type":324,"value":4129},{"type":318,"tag":456,"props":6564,"children":6565},{"style":499},[6566],{"type":324,"value":6567}," App",{"type":318,"tag":456,"props":6569,"children":6570},{"style":463},[6571],{"type":324,"value":1954},{"type":318,"tag":456,"props":6573,"children":6574},{"class":458,"line":535},[6575,6580,6585,6589],{"type":318,"tag":456,"props":6576,"children":6577},{"style":499},[6578],{"type":324,"value":6579},"  useEffect",{"type":318,"tag":456,"props":6581,"children":6582},{"style":463},[6583],{"type":324,"value":6584},"(() ",{"type":318,"tag":456,"props":6586,"children":6587},{"style":489},[6588],{"type":324,"value":4229},{"type":318,"tag":456,"props":6590,"children":6591},{"style":463},[6592],{"type":324,"value":1055},{"type":318,"tag":456,"props":6594,"children":6595},{"class":458,"line":565},[6596],{"type":318,"tag":456,"props":6597,"children":6598},{"style":903},[6599],{"type":324,"value":6600},"    // Load Churnkey script after component mounts (hydration complete)\n",{"type":318,"tag":456,"props":6602,"children":6603},{"class":458,"line":604},[6604,6608,6612,6616,6620,6624,6628],{"type":318,"tag":456,"props":6605,"children":6606},{"style":489},[6607],{"type":324,"value":3729},{"type":318,"tag":456,"props":6609,"children":6610},{"style":463},[6611],{"type":324,"value":507},{"type":318,"tag":456,"props":6613,"children":6614},{"style":489},[6615],{"type":324,"value":512},{"type":318,"tag":456,"props":6617,"children":6618},{"style":463},[6619],{"type":324,"value":517},{"type":318,"tag":456,"props":6621,"children":6622},{"style":489},[6623],{"type":324,"value":522},{"type":318,"tag":456,"props":6625,"children":6626},{"style":489},[6627],{"type":324,"value":527},{"type":318,"tag":456,"props":6629,"children":6630},{"style":463},[6631],{"type":324,"value":532},{"type":318,"tag":456,"props":6633,"children":6634},{"class":458,"line":627},[6635,6640,6644,6648,6652],{"type":318,"tag":456,"props":6636,"children":6637},{"style":463},[6638],{"type":324,"value":6639},"      window.churnkey ",{"type":318,"tag":456,"props":6641,"children":6642},{"style":489},[6643],{"type":324,"value":546},{"type":318,"tag":456,"props":6645,"children":6646},{"style":463},[6647],{"type":324,"value":551},{"type":318,"tag":456,"props":6649,"children":6650},{"style":554},[6651],{"type":324,"value":557},{"type":318,"tag":456,"props":6653,"children":6654},{"style":463},[6655],{"type":324,"value":562},{"type":318,"tag":456,"props":6657,"children":6658},{"class":458,"line":649},[6659,6663,6668,6672,6676,6680,6684,6688],{"type":318,"tag":456,"props":6660,"children":6661},{"style":489},[6662],{"type":324,"value":4273},{"type":318,"tag":456,"props":6664,"children":6665},{"style":554},[6666],{"type":324,"value":6667}," script",{"type":318,"tag":456,"props":6669,"children":6670},{"style":489},[6671],{"type":324,"value":830},{"type":318,"tag":456,"props":6673,"children":6674},{"style":463},[6675],{"type":324,"value":580},{"type":318,"tag":456,"props":6677,"children":6678},{"style":499},[6679],{"type":324,"value":585},{"type":318,"tag":456,"props":6681,"children":6682},{"style":463},[6683],{"type":324,"value":590},{"type":318,"tag":456,"props":6685,"children":6686},{"style":593},[6687],{"type":324,"value":596},{"type":318,"tag":456,"props":6689,"children":6690},{"style":463},[6691],{"type":324,"value":601},{"type":318,"tag":456,"props":6693,"children":6694},{"class":458,"line":694},[6695,6700,6704,6708],{"type":318,"tag":456,"props":6696,"children":6697},{"style":463},[6698],{"type":324,"value":6699},"      script.src ",{"type":318,"tag":456,"props":6701,"children":6702},{"style":489},[6703],{"type":324,"value":546},{"type":318,"tag":456,"props":6705,"children":6706},{"style":593},[6707],{"type":324,"value":619},{"type":318,"tag":456,"props":6709,"children":6710},{"style":463},[6711],{"type":324,"value":624},{"type":318,"tag":456,"props":6713,"children":6714},{"class":458,"line":703},[6715,6720,6724,6728],{"type":318,"tag":456,"props":6716,"children":6717},{"style":463},[6718],{"type":324,"value":6719},"      script.async ",{"type":318,"tag":456,"props":6721,"children":6722},{"style":489},[6723],{"type":324,"value":546},{"type":318,"tag":456,"props":6725,"children":6726},{"style":554},[6727],{"type":324,"value":642},{"type":318,"tag":456,"props":6729,"children":6730},{"style":463},[6731],{"type":324,"value":624},{"type":318,"tag":456,"props":6733,"children":6734},{"class":458,"line":712},[6735,6740,6745],{"type":318,"tag":456,"props":6736,"children":6737},{"style":463},[6738],{"type":324,"value":6739},"      document.head.",{"type":318,"tag":456,"props":6741,"children":6742},{"style":499},[6743],{"type":324,"value":6744},"appendChild",{"type":318,"tag":456,"props":6746,"children":6747},{"style":463},[6748],{"type":324,"value":6749},"(script);\n",{"type":318,"tag":456,"props":6751,"children":6752},{"class":458,"line":726},[6753],{"type":318,"tag":456,"props":6754,"children":6755},{"style":463},[6756],{"type":324,"value":2630},{"type":318,"tag":456,"props":6758,"children":6759},{"class":458,"line":1189},[6760],{"type":318,"tag":456,"props":6761,"children":6762},{"style":463},[6763],{"type":324,"value":6764},"  }, []);\n",{"type":318,"tag":456,"props":6766,"children":6767},{"class":458,"line":1222},[6768],{"type":318,"tag":456,"props":6769,"children":6770},{"emptyLinePlaceholder":1029},[6771],{"type":324,"value":1032},{"type":318,"tag":456,"props":6773,"children":6774},{"class":458,"line":1230},[6775,6779,6784,6789,6794,6799,6804,6808,6812,6816],{"type":318,"tag":456,"props":6776,"children":6777},{"style":489},[6778],{"type":324,"value":1478},{"type":318,"tag":456,"props":6780,"children":6781},{"style":463},[6782],{"type":324,"value":6783}," \u003C",{"type":318,"tag":456,"props":6785,"children":6786},{"style":469},[6787],{"type":324,"value":6788},"div",{"type":318,"tag":456,"props":6790,"children":6791},{"style":463},[6792],{"type":324,"value":6793},">",{"type":318,"tag":456,"props":6795,"children":6796},{"style":489},[6797],{"type":324,"value":6798},"{",{"type":318,"tag":456,"props":6800,"children":6801},{"style":903},[6802],{"type":324,"value":6803},"/* Your app content */",{"type":318,"tag":456,"props":6805,"children":6806},{"style":489},[6807],{"type":324,"value":718},{"type":318,"tag":456,"props":6809,"children":6810},{"style":463},[6811],{"type":324,"value":732},{"type":318,"tag":456,"props":6813,"children":6814},{"style":469},[6815],{"type":324,"value":6788},{"type":318,"tag":456,"props":6817,"children":6818},{"style":463},[6819],{"type":324,"value":6820},">;\n",{"type":318,"tag":456,"props":6822,"children":6823},{"class":458,"line":1251},[6824],{"type":318,"tag":456,"props":6825,"children":6826},{"style":463},[6827],{"type":324,"value":1517},{"type":318,"tag":446,"props":6829,"children":6831},{"className":5595,"code":6830,"filename":961,"language":5597,"meta":313,"style":313},"'use client';\n\nimport { useEffect } from 'react';\n\nexport default function ChurnkeyProvider({ children }: { children: React.ReactNode }) {\n  useEffect(() => {\n    // Load Churnkey script after client-side hydration\n    if (!window.churnkey || !window.churnkey.created) {\n      window.churnkey = { created: true };\n      const script = document.createElement('script');\n      script.src = `https://assets.churnkey.co/js/app.js?appId=${process.env.NEXT_PUBLIC_CHURNKEY_APP_ID}`;\n      script.async = true;\n      document.head.appendChild(script);\n    }\n  }, []);\n\n  return \u003C>{children}\u003C/>;\n}\n",[6832],{"type":318,"tag":348,"props":6833,"children":6834},{"__ignoreMap":313},[6835,6846,6853,6876,6883,6930,6949,6957,6988,7011,7046,7093,7112,7127,7134,7141,7148,7169],{"type":318,"tag":456,"props":6836,"children":6837},{"class":458,"line":459},[6838,6842],{"type":318,"tag":456,"props":6839,"children":6840},{"style":593},[6841],{"type":324,"value":5609},{"type":318,"tag":456,"props":6843,"children":6844},{"style":463},[6845],{"type":324,"value":624},{"type":318,"tag":456,"props":6847,"children":6848},{"class":458,"line":480},[6849],{"type":318,"tag":456,"props":6850,"children":6851},{"emptyLinePlaceholder":1029},[6852],{"type":324,"value":1032},{"type":318,"tag":456,"props":6854,"children":6855},{"class":458,"line":495},[6856,6860,6864,6868,6872],{"type":318,"tag":456,"props":6857,"children":6858},{"style":489},[6859],{"type":324,"value":974},{"type":318,"tag":456,"props":6861,"children":6862},{"style":463},[6863],{"type":324,"value":6536},{"type":318,"tag":456,"props":6865,"children":6866},{"style":489},[6867],{"type":324,"value":984},{"type":318,"tag":456,"props":6869,"children":6870},{"style":593},[6871],{"type":324,"value":4110},{"type":318,"tag":456,"props":6873,"children":6874},{"style":463},[6875],{"type":324,"value":624},{"type":318,"tag":456,"props":6877,"children":6878},{"class":458,"line":535},[6879],{"type":318,"tag":456,"props":6880,"children":6881},{"emptyLinePlaceholder":1029},[6882],{"type":324,"value":1032},{"type":318,"tag":456,"props":6884,"children":6885},{"class":458,"line":565},[6886,6890,6894,6898,6903,6908,6912,6917,6921,6926],{"type":318,"tag":456,"props":6887,"children":6888},{"style":489},[6889],{"type":324,"value":1120},{"type":318,"tag":456,"props":6891,"children":6892},{"style":489},[6893],{"type":324,"value":1125},{"type":318,"tag":456,"props":6895,"children":6896},{"style":489},[6897],{"type":324,"value":1130},{"type":318,"tag":456,"props":6899,"children":6900},{"style":499},[6901],{"type":324,"value":6902}," ChurnkeyProvider",{"type":318,"tag":456,"props":6904,"children":6905},{"style":1043},[6906],{"type":324,"value":6907},"({ children }",{"type":318,"tag":456,"props":6909,"children":6910},{"style":489},[6911],{"type":324,"value":1152},{"type":318,"tag":456,"props":6913,"children":6914},{"style":1043},[6915],{"type":324,"value":6916}," { children",{"type":318,"tag":456,"props":6918,"children":6919},{"style":489},[6920],{"type":324,"value":1152},{"type":318,"tag":456,"props":6922,"children":6923},{"style":1043},[6924],{"type":324,"value":6925}," React.ReactNode }) ",{"type":318,"tag":456,"props":6927,"children":6928},{"style":463},[6929],{"type":324,"value":492},{"type":318,"tag":456,"props":6931,"children":6932},{"class":458,"line":604},[6933,6937,6941,6945],{"type":318,"tag":456,"props":6934,"children":6935},{"style":499},[6936],{"type":324,"value":6579},{"type":318,"tag":456,"props":6938,"children":6939},{"style":463},[6940],{"type":324,"value":6584},{"type":318,"tag":456,"props":6942,"children":6943},{"style":489},[6944],{"type":324,"value":4229},{"type":318,"tag":456,"props":6946,"children":6947},{"style":463},[6948],{"type":324,"value":1055},{"type":318,"tag":456,"props":6950,"children":6951},{"class":458,"line":627},[6952],{"type":318,"tag":456,"props":6953,"children":6954},{"style":903},[6955],{"type":324,"value":6956},"    // Load Churnkey script after client-side hydration\n",{"type":318,"tag":456,"props":6958,"children":6959},{"class":458,"line":649},[6960,6964,6968,6972,6976,6980,6984],{"type":318,"tag":456,"props":6961,"children":6962},{"style":489},[6963],{"type":324,"value":3729},{"type":318,"tag":456,"props":6965,"children":6966},{"style":463},[6967],{"type":324,"value":507},{"type":318,"tag":456,"props":6969,"children":6970},{"style":489},[6971],{"type":324,"value":512},{"type":318,"tag":456,"props":6973,"children":6974},{"style":463},[6975],{"type":324,"value":517},{"type":318,"tag":456,"props":6977,"children":6978},{"style":489},[6979],{"type":324,"value":522},{"type":318,"tag":456,"props":6981,"children":6982},{"style":489},[6983],{"type":324,"value":527},{"type":318,"tag":456,"props":6985,"children":6986},{"style":463},[6987],{"type":324,"value":532},{"type":318,"tag":456,"props":6989,"children":6990},{"class":458,"line":694},[6991,6995,6999,7003,7007],{"type":318,"tag":456,"props":6992,"children":6993},{"style":463},[6994],{"type":324,"value":6639},{"type":318,"tag":456,"props":6996,"children":6997},{"style":489},[6998],{"type":324,"value":546},{"type":318,"tag":456,"props":7000,"children":7001},{"style":463},[7002],{"type":324,"value":551},{"type":318,"tag":456,"props":7004,"children":7005},{"style":554},[7006],{"type":324,"value":557},{"type":318,"tag":456,"props":7008,"children":7009},{"style":463},[7010],{"type":324,"value":562},{"type":318,"tag":456,"props":7012,"children":7013},{"class":458,"line":703},[7014,7018,7022,7026,7030,7034,7038,7042],{"type":318,"tag":456,"props":7015,"children":7016},{"style":489},[7017],{"type":324,"value":4273},{"type":318,"tag":456,"props":7019,"children":7020},{"style":554},[7021],{"type":324,"value":6667},{"type":318,"tag":456,"props":7023,"children":7024},{"style":489},[7025],{"type":324,"value":830},{"type":318,"tag":456,"props":7027,"children":7028},{"style":463},[7029],{"type":324,"value":580},{"type":318,"tag":456,"props":7031,"children":7032},{"style":499},[7033],{"type":324,"value":585},{"type":318,"tag":456,"props":7035,"children":7036},{"style":463},[7037],{"type":324,"value":590},{"type":318,"tag":456,"props":7039,"children":7040},{"style":593},[7041],{"type":324,"value":596},{"type":318,"tag":456,"props":7043,"children":7044},{"style":463},[7045],{"type":324,"value":601},{"type":318,"tag":456,"props":7047,"children":7048},{"class":458,"line":712},[7049,7053,7057,7062,7067,7071,7076,7080,7084,7089],{"type":318,"tag":456,"props":7050,"children":7051},{"style":463},[7052],{"type":324,"value":6699},{"type":318,"tag":456,"props":7054,"children":7055},{"style":489},[7056],{"type":324,"value":546},{"type":318,"tag":456,"props":7058,"children":7059},{"style":593},[7060],{"type":324,"value":7061}," `https://assets.churnkey.co/js/app.js?appId=${",{"type":318,"tag":456,"props":7063,"children":7064},{"style":463},[7065],{"type":324,"value":7066},"process",{"type":318,"tag":456,"props":7068,"children":7069},{"style":593},[7070],{"type":324,"value":2680},{"type":318,"tag":456,"props":7072,"children":7073},{"style":463},[7074],{"type":324,"value":7075},"env",{"type":318,"tag":456,"props":7077,"children":7078},{"style":593},[7079],{"type":324,"value":2680},{"type":318,"tag":456,"props":7081,"children":7082},{"style":554},[7083],{"type":324,"value":6026},{"type":318,"tag":456,"props":7085,"children":7086},{"style":593},[7087],{"type":324,"value":7088},"}`",{"type":318,"tag":456,"props":7090,"children":7091},{"style":463},[7092],{"type":324,"value":624},{"type":318,"tag":456,"props":7094,"children":7095},{"class":458,"line":726},[7096,7100,7104,7108],{"type":318,"tag":456,"props":7097,"children":7098},{"style":463},[7099],{"type":324,"value":6719},{"type":318,"tag":456,"props":7101,"children":7102},{"style":489},[7103],{"type":324,"value":546},{"type":318,"tag":456,"props":7105,"children":7106},{"style":554},[7107],{"type":324,"value":642},{"type":318,"tag":456,"props":7109,"children":7110},{"style":463},[7111],{"type":324,"value":624},{"type":318,"tag":456,"props":7113,"children":7114},{"class":458,"line":1189},[7115,7119,7123],{"type":318,"tag":456,"props":7116,"children":7117},{"style":463},[7118],{"type":324,"value":6739},{"type":318,"tag":456,"props":7120,"children":7121},{"style":499},[7122],{"type":324,"value":6744},{"type":318,"tag":456,"props":7124,"children":7125},{"style":463},[7126],{"type":324,"value":6749},{"type":318,"tag":456,"props":7128,"children":7129},{"class":458,"line":1222},[7130],{"type":318,"tag":456,"props":7131,"children":7132},{"style":463},[7133],{"type":324,"value":2630},{"type":318,"tag":456,"props":7135,"children":7136},{"class":458,"line":1230},[7137],{"type":318,"tag":456,"props":7138,"children":7139},{"style":463},[7140],{"type":324,"value":6764},{"type":318,"tag":456,"props":7142,"children":7143},{"class":458,"line":1251},[7144],{"type":318,"tag":456,"props":7145,"children":7146},{"emptyLinePlaceholder":1029},[7147],{"type":324,"value":1032},{"type":318,"tag":456,"props":7149,"children":7150},{"class":458,"line":1303},[7151,7155,7160,7165],{"type":318,"tag":456,"props":7152,"children":7153},{"style":489},[7154],{"type":324,"value":1478},{"type":318,"tag":456,"props":7156,"children":7157},{"style":463},[7158],{"type":324,"value":7159}," \u003C>{children}",{"type":318,"tag":456,"props":7161,"children":7162},{"style":489},[7163],{"type":324,"value":7164},"\u003C/>",{"type":318,"tag":456,"props":7166,"children":7167},{"style":463},[7168],{"type":324,"value":624},{"type":318,"tag":456,"props":7170,"children":7171},{"class":458,"line":1311},[7172],{"type":318,"tag":456,"props":7173,"children":7174},{"style":463},[7175],{"type":324,"value":1517},{"type":318,"tag":446,"props":7177,"children":7179},{"className":4814,"code":7178,"filename":4816,"language":4817,"meta":313,"style":313},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003C!-- Your app content -->\n  \u003C/div>\n\u003C/template>\n\n\u003Cscript>\nexport default {\n  mounted() {\n    // Load Churnkey script after component mounts\n    if (!window.churnkey || !window.churnkey.created) {\n      window.churnkey = { created: true };\n      const script = document.createElement('script');\n      script.src = 'https://assets.churnkey.co/js/app.js?appId=YOUR_APP_ID';\n      script.async = true;\n      document.head.appendChild(script);\n    }\n  },\n};\n\u003C/script>\n",[7180],{"type":318,"tag":348,"props":7181,"children":7182},{"__ignoreMap":313},[7183,7198,7213,7221,7236,7251,7258,7273,7288,7304,7312,7343,7366,7401,7420,7439,7454,7461,7472,7483],{"type":318,"tag":456,"props":7184,"children":7185},{"class":458,"line":459},[7186,7190,7194],{"type":318,"tag":456,"props":7187,"children":7188},{"style":463},[7189],{"type":324,"value":466},{"type":318,"tag":456,"props":7191,"children":7192},{"style":469},[7193],{"type":324,"value":4833},{"type":318,"tag":456,"props":7195,"children":7196},{"style":463},[7197],{"type":324,"value":477},{"type":318,"tag":456,"props":7199,"children":7200},{"class":458,"line":480},[7201,7205,7209],{"type":318,"tag":456,"props":7202,"children":7203},{"style":463},[7204],{"type":324,"value":4845},{"type":318,"tag":456,"props":7206,"children":7207},{"style":469},[7208],{"type":324,"value":6788},{"type":318,"tag":456,"props":7210,"children":7211},{"style":463},[7212],{"type":324,"value":477},{"type":318,"tag":456,"props":7214,"children":7215},{"class":458,"line":495},[7216],{"type":318,"tag":456,"props":7217,"children":7218},{"style":903},[7219],{"type":324,"value":7220},"    \u003C!-- Your app content -->\n",{"type":318,"tag":456,"props":7222,"children":7223},{"class":458,"line":535},[7224,7228,7232],{"type":318,"tag":456,"props":7225,"children":7226},{"style":463},[7227],{"type":324,"value":4942},{"type":318,"tag":456,"props":7229,"children":7230},{"style":469},[7231],{"type":324,"value":6788},{"type":318,"tag":456,"props":7233,"children":7234},{"style":463},[7235],{"type":324,"value":477},{"type":318,"tag":456,"props":7237,"children":7238},{"class":458,"line":565},[7239,7243,7247],{"type":318,"tag":456,"props":7240,"children":7241},{"style":463},[7242],{"type":324,"value":732},{"type":318,"tag":456,"props":7244,"children":7245},{"style":469},[7246],{"type":324,"value":4833},{"type":318,"tag":456,"props":7248,"children":7249},{"style":463},[7250],{"type":324,"value":477},{"type":318,"tag":456,"props":7252,"children":7253},{"class":458,"line":604},[7254],{"type":318,"tag":456,"props":7255,"children":7256},{"emptyLinePlaceholder":1029},[7257],{"type":324,"value":1032},{"type":318,"tag":456,"props":7259,"children":7260},{"class":458,"line":627},[7261,7265,7269],{"type":318,"tag":456,"props":7262,"children":7263},{"style":463},[7264],{"type":324,"value":466},{"type":318,"tag":456,"props":7266,"children":7267},{"style":469},[7268],{"type":324,"value":472},{"type":318,"tag":456,"props":7270,"children":7271},{"style":463},[7272],{"type":324,"value":477},{"type":318,"tag":456,"props":7274,"children":7275},{"class":458,"line":649},[7276,7280,7284],{"type":318,"tag":456,"props":7277,"children":7278},{"style":489},[7279],{"type":324,"value":1120},{"type":318,"tag":456,"props":7281,"children":7282},{"style":489},[7283],{"type":324,"value":1125},{"type":318,"tag":456,"props":7285,"children":7286},{"style":1043},[7287],{"type":324,"value":1055},{"type":318,"tag":456,"props":7289,"children":7290},{"class":458,"line":694},[7291,7296,7300],{"type":318,"tag":456,"props":7292,"children":7293},{"style":499},[7294],{"type":324,"value":7295},"  mounted",{"type":318,"tag":456,"props":7297,"children":7298},{"style":1043},[7299],{"type":324,"value":5015},{"type":318,"tag":456,"props":7301,"children":7302},{"style":463},[7303],{"type":324,"value":492},{"type":318,"tag":456,"props":7305,"children":7306},{"class":458,"line":703},[7307],{"type":318,"tag":456,"props":7308,"children":7309},{"style":903},[7310],{"type":324,"value":7311},"    // Load Churnkey script after component mounts\n",{"type":318,"tag":456,"props":7313,"children":7314},{"class":458,"line":712},[7315,7319,7323,7327,7331,7335,7339],{"type":318,"tag":456,"props":7316,"children":7317},{"style":489},[7318],{"type":324,"value":3729},{"type":318,"tag":456,"props":7320,"children":7321},{"style":463},[7322],{"type":324,"value":507},{"type":318,"tag":456,"props":7324,"children":7325},{"style":489},[7326],{"type":324,"value":512},{"type":318,"tag":456,"props":7328,"children":7329},{"style":463},[7330],{"type":324,"value":517},{"type":318,"tag":456,"props":7332,"children":7333},{"style":489},[7334],{"type":324,"value":522},{"type":318,"tag":456,"props":7336,"children":7337},{"style":489},[7338],{"type":324,"value":527},{"type":318,"tag":456,"props":7340,"children":7341},{"style":463},[7342],{"type":324,"value":532},{"type":318,"tag":456,"props":7344,"children":7345},{"class":458,"line":726},[7346,7350,7354,7358,7362],{"type":318,"tag":456,"props":7347,"children":7348},{"style":463},[7349],{"type":324,"value":6639},{"type":318,"tag":456,"props":7351,"children":7352},{"style":489},[7353],{"type":324,"value":546},{"type":318,"tag":456,"props":7355,"children":7356},{"style":463},[7357],{"type":324,"value":551},{"type":318,"tag":456,"props":7359,"children":7360},{"style":554},[7361],{"type":324,"value":557},{"type":318,"tag":456,"props":7363,"children":7364},{"style":463},[7365],{"type":324,"value":562},{"type":318,"tag":456,"props":7367,"children":7368},{"class":458,"line":1189},[7369,7373,7377,7381,7385,7389,7393,7397],{"type":318,"tag":456,"props":7370,"children":7371},{"style":489},[7372],{"type":324,"value":4273},{"type":318,"tag":456,"props":7374,"children":7375},{"style":554},[7376],{"type":324,"value":6667},{"type":318,"tag":456,"props":7378,"children":7379},{"style":489},[7380],{"type":324,"value":830},{"type":318,"tag":456,"props":7382,"children":7383},{"style":463},[7384],{"type":324,"value":580},{"type":318,"tag":456,"props":7386,"children":7387},{"style":499},[7388],{"type":324,"value":585},{"type":318,"tag":456,"props":7390,"children":7391},{"style":463},[7392],{"type":324,"value":590},{"type":318,"tag":456,"props":7394,"children":7395},{"style":593},[7396],{"type":324,"value":596},{"type":318,"tag":456,"props":7398,"children":7399},{"style":463},[7400],{"type":324,"value":601},{"type":318,"tag":456,"props":7402,"children":7403},{"class":458,"line":1222},[7404,7408,7412,7416],{"type":318,"tag":456,"props":7405,"children":7406},{"style":463},[7407],{"type":324,"value":6699},{"type":318,"tag":456,"props":7409,"children":7410},{"style":489},[7411],{"type":324,"value":546},{"type":318,"tag":456,"props":7413,"children":7414},{"style":593},[7415],{"type":324,"value":619},{"type":318,"tag":456,"props":7417,"children":7418},{"style":463},[7419],{"type":324,"value":624},{"type":318,"tag":456,"props":7421,"children":7422},{"class":458,"line":1230},[7423,7427,7431,7435],{"type":318,"tag":456,"props":7424,"children":7425},{"style":463},[7426],{"type":324,"value":6719},{"type":318,"tag":456,"props":7428,"children":7429},{"style":489},[7430],{"type":324,"value":546},{"type":318,"tag":456,"props":7432,"children":7433},{"style":554},[7434],{"type":324,"value":642},{"type":318,"tag":456,"props":7436,"children":7437},{"style":463},[7438],{"type":324,"value":624},{"type":318,"tag":456,"props":7440,"children":7441},{"class":458,"line":1251},[7442,7446,7450],{"type":318,"tag":456,"props":7443,"children":7444},{"style":463},[7445],{"type":324,"value":6739},{"type":318,"tag":456,"props":7447,"children":7448},{"style":499},[7449],{"type":324,"value":6744},{"type":318,"tag":456,"props":7451,"children":7452},{"style":463},[7453],{"type":324,"value":6749},{"type":318,"tag":456,"props":7455,"children":7456},{"class":458,"line":1303},[7457],{"type":318,"tag":456,"props":7458,"children":7459},{"style":463},[7460],{"type":324,"value":2630},{"type":318,"tag":456,"props":7462,"children":7463},{"class":458,"line":1311},[7464,7468],{"type":318,"tag":456,"props":7465,"children":7466},{"style":463},[7467],{"type":324,"value":5062},{"type":318,"tag":456,"props":7469,"children":7470},{"style":1043},[7471],{"type":324,"value":892},{"type":318,"tag":456,"props":7473,"children":7474},{"class":458,"line":1319},[7475,7479],{"type":318,"tag":456,"props":7476,"children":7477},{"style":1043},[7478],{"type":324,"value":718},{"type":318,"tag":456,"props":7480,"children":7481},{"style":463},[7482],{"type":324,"value":624},{"type":318,"tag":456,"props":7484,"children":7485},{"class":458,"line":1366},[7486,7490,7494],{"type":318,"tag":456,"props":7487,"children":7488},{"style":463},[7489],{"type":324,"value":732},{"type":318,"tag":456,"props":7491,"children":7492},{"style":469},[7493],{"type":324,"value":472},{"type":318,"tag":456,"props":7495,"children":7496},{"style":463},[7497],{"type":324,"value":477},{"type":318,"tag":319,"props":7499,"children":7501},{"id":7500},"frequently-asked-questions",[7502],{"type":324,"value":305},{"type":318,"tag":4073,"props":7504,"children":7506},{"id":7505},"why-do-i-need-to-fetch-the-authhash-every-time",[7507],{"type":324,"value":7508},"Why do I need to fetch the authHash every time?",{"type":318,"tag":326,"props":7510,"children":7511},{},[7512],{"type":324,"value":7513},"The authHash must be fetched fresh each time a customer initiates cancellation. Never hardcode the authHash or cache it on the frontend, as this would compromise security. Fetching it from your backend ensures that:",{"type":318,"tag":6401,"props":7515,"children":7516},{},[7517,7522,7527],{"type":318,"tag":336,"props":7518,"children":7519},{},[7520],{"type":324,"value":7521},"Each cancellation request is authenticated through your backend",{"type":318,"tag":336,"props":7523,"children":7524},{},[7525],{"type":324,"value":7526},"Only logged-in customers can generate valid authHash values",{"type":318,"tag":336,"props":7528,"children":7529},{},[7530],{"type":324,"value":7531},"The authHash is tied to the specific customer making the request",{"type":318,"tag":7533,"props":7534,"children":7535},"style",{},[7536],{"type":324,"value":7537},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":313,"searchDepth":495,"depth":495,"links":7539},[7540,7541,7542,7543,7544,7547,7551],{"id":321,"depth":480,"text":9},{"id":383,"depth":480,"text":386},{"id":743,"depth":480,"text":746},{"id":3217,"depth":480,"text":3220},{"id":3430,"depth":480,"text":3433,"children":7545},[7546],{"id":4075,"depth":495,"text":4078},{"id":6287,"depth":480,"text":6290,"children":7548},[7549,7550],{"id":6293,"depth":495,"text":6296},{"id":6444,"depth":495,"text":6447},{"id":7500,"depth":480,"text":305,"children":7552},[7553],{"id":7505,"depth":495,"text":7508},"markdown","content","2.cancel-flows/1.quick-start-guide.md","2.cancel-flows/1.quick-start-guide","md",{"loc":19},[7561,7562],{"_path":6,"title":9,"description":11},{"_path":24,"title":23,"description":26},1775515566644]