@churnkey/react 0.2.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/{chunk-ZEYUKGAR.cjs → chunk-2VQNWZWO.cjs} +33 -23
  2. package/dist/chunk-2VQNWZWO.cjs.map +1 -0
  3. package/dist/{chunk-YSNMTOAW.cjs → chunk-42SJA62X.cjs} +9 -7
  4. package/dist/chunk-42SJA62X.cjs.map +1 -0
  5. package/dist/{chunk-EHZJAQQ5.cjs → chunk-LVUDBCQ2.cjs} +20 -2
  6. package/dist/chunk-LVUDBCQ2.cjs.map +1 -0
  7. package/dist/{chunk-SXGORJOX.js → chunk-SQ35G4LA.js} +19 -3
  8. package/dist/chunk-SQ35G4LA.js.map +1 -0
  9. package/dist/{chunk-OL5HQUE4.js → chunk-UNSSI6KX.js} +33 -23
  10. package/dist/chunk-UNSSI6KX.js.map +1 -0
  11. package/dist/{chunk-CPCWJTSG.js → chunk-YZERGV7F.js} +6 -4
  12. package/dist/chunk-YZERGV7F.js.map +1 -0
  13. package/dist/core.cjs +20 -12
  14. package/dist/core.d.cts +14 -3
  15. package/dist/core.d.ts +14 -3
  16. package/dist/core.js +2 -2
  17. package/dist/headless.cjs +3 -3
  18. package/dist/headless.d.cts +5 -1
  19. package/dist/headless.d.ts +5 -1
  20. package/dist/headless.js +2 -2
  21. package/dist/index.cjs +166 -135
  22. package/dist/index.cjs.map +1 -1
  23. package/dist/index.d.cts +7 -7
  24. package/dist/index.d.ts +7 -7
  25. package/dist/index.js +73 -50
  26. package/dist/index.js.map +1 -1
  27. package/dist/{step-graph-Cbi0DRHX.d.cts → step-graph-ChlSCUGk.d.cts} +39 -19
  28. package/dist/{step-graph-Cbi0DRHX.d.ts → step-graph-ChlSCUGk.d.ts} +39 -19
  29. package/dist/styles.css +50 -11
  30. package/package.json +10 -10
  31. package/dist/chunk-CPCWJTSG.js.map +0 -1
  32. package/dist/chunk-EHZJAQQ5.cjs.map +0 -1
  33. package/dist/chunk-OL5HQUE4.js.map +0 -1
  34. package/dist/chunk-SXGORJOX.js.map +0 -1
  35. package/dist/chunk-YSNMTOAW.cjs.map +0 -1
  36. package/dist/chunk-ZEYUKGAR.cjs.map +0 -1
package/dist/index.cjs CHANGED
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
- var chunkYSNMTOAW_cjs = require('./chunk-YSNMTOAW.cjs');
4
- var chunkEHZJAQQ5_cjs = require('./chunk-EHZJAQQ5.cjs');
5
- var chunkZEYUKGAR_cjs = require('./chunk-ZEYUKGAR.cjs');
3
+ var chunk42SJA62X_cjs = require('./chunk-42SJA62X.cjs');
4
+ var chunkLVUDBCQ2_cjs = require('./chunk-LVUDBCQ2.cjs');
5
+ var chunk2VQNWZWO_cjs = require('./chunk-2VQNWZWO.cjs');
6
6
  var react = require('react');
7
7
  var jsxRuntime = require('react/jsx-runtime');
8
8
 
@@ -20,28 +20,29 @@ function RichText({ html, as = "p", className }) {
20
20
  function DefaultConfirm({
21
21
  title,
22
22
  description,
23
+ subscriptions,
23
24
  losses,
24
25
  lossesLabel,
25
26
  confirmLabel,
26
27
  goBackLabel,
27
- periodEnd,
28
28
  onConfirm,
29
29
  onGoBack,
30
30
  isProcessing,
31
31
  classNames
32
32
  }) {
33
33
  const hasLosses = Array.isArray(losses) && losses.length > 0;
34
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-confirm", classNames?.root), children: [
35
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: title }),
36
- description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
37
- hasLosses && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-loss-block", classNames?.lossList), children: [
38
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkEHZJAQQ5_cjs.cn("ck-loss-label", classNames?.lossLabel), children: lossesLabel ?? "You'll lose access to:" }),
39
- /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "ck-loss-list", children: losses.map((item) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: chunkEHZJAQQ5_cjs.cn("ck-loss-item", classNames?.lossItem), children: [
40
- /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: chunkEHZJAQQ5_cjs.cn("ck-loss-bullet", classNames?.lossBullet), children: "\u25CF" }),
34
+ const periodEnd = chunkLVUDBCQ2_cjs.formatPeriodEnd(subscriptions);
35
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-confirm", classNames?.root), children: [
36
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: title }),
37
+ description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
38
+ hasLosses && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-loss-block", classNames?.lossList), children: [
39
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkLVUDBCQ2_cjs.cn("ck-loss-label", classNames?.lossLabel), children: lossesLabel ?? "You'll lose access to:" }),
40
+ /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "ck-loss-list", children: losses.map((item) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: chunkLVUDBCQ2_cjs.cn("ck-loss-item", classNames?.lossItem), children: [
41
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: chunkLVUDBCQ2_cjs.cn("ck-loss-bullet", classNames?.lossBullet), children: "\u25CF" }),
41
42
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: item })
42
43
  ] }, item)) })
43
44
  ] }),
44
- periodEnd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: chunkEHZJAQQ5_cjs.cn("ck-period-end", classNames?.periodEndNotice), children: [
45
+ periodEnd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: chunkLVUDBCQ2_cjs.cn("ck-period-end", classNames?.periodEndNotice), children: [
45
46
  "Your access continues until ",
46
47
  periodEnd,
47
48
  "."
@@ -50,13 +51,13 @@ function DefaultConfirm({
50
51
  "button",
51
52
  {
52
53
  type: "button",
53
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-danger", classNames?.confirmButton),
54
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-danger", classNames?.confirmButton),
54
55
  onClick: onConfirm,
55
56
  disabled: isProcessing,
56
57
  children: isProcessing ? "Processing..." : confirmLabel
57
58
  }
58
59
  ),
59
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.goBackButton), onClick: onGoBack, children: goBackLabel })
60
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.goBackButton), onClick: onGoBack, children: goBackLabel })
60
61
  ] });
61
62
  }
62
63
  function DefaultFeedback({
@@ -75,13 +76,13 @@ function DefaultFeedback({
75
76
  const isUnderMin = hasMin && value.length > 0 && value.length < minLength;
76
77
  const isValid = !required || value.length >= minLength;
77
78
  const placeholderText = placeholder ?? (hasMin ? `At least ${minLength} characters\u2026` : "Type your thoughts\u2026");
78
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-feedback", classNames?.root), children: [
79
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: title }),
80
- description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
79
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-feedback", classNames?.root), children: [
80
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: title }),
81
+ description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
81
82
  /* @__PURE__ */ jsxRuntime.jsxs(
82
83
  "div",
83
84
  {
84
- className: chunkEHZJAQQ5_cjs.cn(
85
+ className: chunkLVUDBCQ2_cjs.cn(
85
86
  "ck-feedback-field",
86
87
  focused && "ck-feedback-field--focused",
87
88
  isUnderMin && "ck-feedback-field--invalid"
@@ -90,7 +91,7 @@ function DefaultFeedback({
90
91
  /* @__PURE__ */ jsxRuntime.jsx(
91
92
  "textarea",
92
93
  {
93
- className: chunkEHZJAQQ5_cjs.cn("ck-textarea", classNames?.textarea),
94
+ className: chunkLVUDBCQ2_cjs.cn("ck-textarea", classNames?.textarea),
94
95
  placeholder: placeholderText,
95
96
  value,
96
97
  onChange: (e) => onChange(e.target.value),
@@ -102,7 +103,7 @@ function DefaultFeedback({
102
103
  hasMin && /* @__PURE__ */ jsxRuntime.jsxs(
103
104
  "div",
104
105
  {
105
- className: chunkEHZJAQQ5_cjs.cn(
106
+ className: chunkLVUDBCQ2_cjs.cn(
106
107
  "ck-character-count",
107
108
  isUnderMin && "ck-character-count--invalid",
108
109
  classNames?.characterCount
@@ -121,7 +122,7 @@ function DefaultFeedback({
121
122
  "button",
122
123
  {
123
124
  type: "button",
124
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.submitButton),
125
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.submitButton),
125
126
  onClick: onSubmit,
126
127
  disabled: !isValid,
127
128
  children: "Continue"
@@ -140,21 +141,21 @@ function DefaultContactOffer({
140
141
  }) {
141
142
  const headline = title ?? offer.copy.headline;
142
143
  const body = description ?? offer.copy.body;
143
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
144
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
145
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
146
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card", classNames?.card), children: [
144
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
145
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
146
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
147
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card", classNames?.card), children: [
147
148
  /* @__PURE__ */ jsxRuntime.jsx(
148
149
  "button",
149
150
  {
150
151
  type: "button",
151
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
152
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
152
153
  onClick: () => onAccept(),
153
154
  disabled: isProcessing,
154
155
  children: isProcessing ? "Processing..." : offer.copy.cta
155
156
  }
156
157
  ),
157
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
158
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
158
159
  ] })
159
160
  ] });
160
161
  }
@@ -170,11 +171,11 @@ function DefaultDiscountOffer({
170
171
  const o = offer;
171
172
  const headline = title ?? offer.copy.headline;
172
173
  const body = description ?? offer.copy.body;
173
- const phrase = chunkEHZJAQQ5_cjs.discountPhrase(o);
174
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
175
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
176
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
177
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card", classNames?.card), children: [
174
+ const phrase = chunkLVUDBCQ2_cjs.discountPhrase(o);
175
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
176
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
177
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
178
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card", classNames?.card), children: [
178
179
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-offer-details ck-offer-discount", children: [
179
180
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-offer-discount-eyebrow", children: "Limited-time offer" }),
180
181
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-offer-discount-phrase", children: phrase })
@@ -183,13 +184,13 @@ function DefaultDiscountOffer({
183
184
  "button",
184
185
  {
185
186
  type: "button",
186
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
187
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
187
188
  onClick: () => onAccept(),
188
189
  disabled: isProcessing,
189
190
  children: isProcessing ? "Processing..." : offer.copy.cta
190
191
  }
191
192
  ),
192
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
193
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
193
194
  ] })
194
195
  ] });
195
196
  }
@@ -209,19 +210,19 @@ function DefaultPauseOffer({
209
210
  const body = description ?? offer.copy.body;
210
211
  const resume = /* @__PURE__ */ new Date();
211
212
  resume.setMonth(resume.getMonth() + months);
212
- const resumeDate = chunkEHZJAQQ5_cjs.formatMonthDayLong(resume);
213
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
214
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
215
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
216
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card ck-pause-card", classNames?.card), children: [
213
+ const resumeDate = chunkLVUDBCQ2_cjs.formatMonthDayLong(resume);
214
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
215
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
216
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
217
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card ck-pause-card", classNames?.card), children: [
217
218
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-pause-eyebrow", children: "We'll see you back on" }),
218
219
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-pause-date", children: resumeDate }),
219
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkEHZJAQQ5_cjs.cn("ck-pause-chips", classNames?.pauseSlider), children: Array.from({ length: max }, (_, i) => i + 1).map((m) => /* @__PURE__ */ jsxRuntime.jsxs(
220
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkLVUDBCQ2_cjs.cn("ck-pause-chips", classNames?.pauseSlider), children: Array.from({ length: max }, (_, i) => i + 1).map((m) => /* @__PURE__ */ jsxRuntime.jsxs(
220
221
  "button",
221
222
  {
222
223
  type: "button",
223
224
  onClick: () => setMonths(m),
224
- className: chunkEHZJAQQ5_cjs.cn("ck-pause-chip", m === months && "ck-pause-chip--selected"),
225
+ className: chunkLVUDBCQ2_cjs.cn("ck-pause-chip", m === months && "ck-pause-chip--selected"),
225
226
  "aria-pressed": m === months,
226
227
  children: [
227
228
  m,
@@ -236,13 +237,13 @@ function DefaultPauseOffer({
236
237
  "button",
237
238
  {
238
239
  type: "button",
239
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
240
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
240
241
  onClick: () => onAccept({ months }),
241
242
  disabled: isProcessing,
242
243
  children: isProcessing ? "Processing..." : offer.copy.cta
243
244
  }
244
245
  ),
245
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
246
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
246
247
  ] });
247
248
  }
248
249
  function Checkmark({ color = "currentColor", size = 14 }) {
@@ -251,6 +252,7 @@ function Checkmark({ color = "currentColor", size = 14 }) {
251
252
  function DefaultPlanChangeOffer({
252
253
  title,
253
254
  description,
255
+ subscriptions,
254
256
  offer,
255
257
  onAccept,
256
258
  onDecline,
@@ -259,31 +261,42 @@ function DefaultPlanChangeOffer({
259
261
  }) {
260
262
  const o = offer;
261
263
  const plans = o.plans ?? [];
262
- const [selectedPlanId, setSelectedPlanId] = react.useState(plans[0]?.id ?? null);
264
+ const currentPlanId = subscriptions[0]?.items[0]?.price.id;
265
+ const initialPlanId = plans.find((p) => p.id !== currentPlanId)?.id ?? null;
266
+ const [selectedPlanId, setSelectedPlanId] = react.useState(initialPlanId);
263
267
  const selectedPlan = plans.find((p) => p.id === selectedPlanId) ?? null;
264
268
  const headline = title ?? offer.copy.headline;
265
269
  const body = description ?? offer.copy.body;
266
270
  const ctaLabel = isProcessing ? "Processing..." : selectedPlan?.name ? `Switch to ${selectedPlan.name}` : offer.copy.cta;
267
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
268
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
269
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
270
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card", classNames?.card), children: [
271
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
272
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
273
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
274
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card", classNames?.card), children: [
271
275
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-offer-details ck-plan-grid", children: plans.map((plan) => {
272
276
  const interval = plan.duration?.interval ?? "month";
273
277
  const currency = plan.amount.currency ?? "USD";
274
278
  const isSelected = plan.id === selectedPlanId;
279
+ const isCurrent = plan.id === currentPlanId;
275
280
  return /* @__PURE__ */ jsxRuntime.jsxs(
276
281
  "button",
277
282
  {
278
283
  type: "button",
279
284
  onClick: () => setSelectedPlanId(plan.id),
280
- className: chunkEHZJAQQ5_cjs.cn("ck-plan-card", isSelected && "ck-plan-card--selected"),
285
+ disabled: isCurrent,
286
+ className: chunkLVUDBCQ2_cjs.cn(
287
+ "ck-plan-card",
288
+ isSelected && "ck-plan-card--selected",
289
+ isCurrent && "ck-plan-card--current"
290
+ ),
281
291
  "aria-pressed": isSelected,
282
292
  children: [
283
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-plan-name", children: plan.name ?? plan.id }),
293
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-plan-name", children: [
294
+ plan.name ?? plan.id,
295
+ isCurrent && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ck-plan-current-badge", children: "Current" })
296
+ ] }),
284
297
  plan.tagline && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-plan-tagline", children: plan.tagline }),
285
298
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-plan-price-row", children: [
286
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ck-plan-amount", children: chunkEHZJAQQ5_cjs.formatPriceFromMinor(plan.amount.value, currency) }),
299
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ck-plan-amount", children: chunkLVUDBCQ2_cjs.formatPriceFromMinor(plan.amount.value, currency) }),
287
300
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ck-plan-period", children: [
288
301
  "/",
289
302
  interval
@@ -303,13 +316,13 @@ function DefaultPlanChangeOffer({
303
316
  "button",
304
317
  {
305
318
  type: "button",
306
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
319
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
307
320
  onClick: () => selectedPlanId && onAccept({ planId: selectedPlanId }),
308
321
  disabled: isProcessing || !selectedPlanId,
309
322
  children: ctaLabel
310
323
  }
311
324
  ),
312
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
325
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
313
326
  ] })
314
327
  ] });
315
328
  }
@@ -317,15 +330,15 @@ function DefaultRedirectOffer({ title, description, offer, onDecline, classNames
317
330
  const url = offer.url;
318
331
  const headline = title ?? offer.copy.headline;
319
332
  const body = description ?? offer.copy.body;
320
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
321
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
322
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
323
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card", classNames?.card), children: [
333
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
334
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
335
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
336
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card", classNames?.card), children: [
324
337
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-offer-details", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: "ck-redirect-link", children: [
325
338
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: offer.copy.cta }),
326
339
  /* @__PURE__ */ jsxRuntime.jsx(ExternalIcon, {})
327
340
  ] }) }),
328
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
341
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
329
342
  ] })
330
343
  ] });
331
344
  }
@@ -365,11 +378,11 @@ function DefaultTrialExtensionOffer({
365
378
  const body = description ?? offer.copy.body;
366
379
  const end = /* @__PURE__ */ new Date();
367
380
  end.setDate(end.getDate() + o.days);
368
- const newEnd = chunkEHZJAQQ5_cjs.formatMonthDay(end);
369
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
370
- headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: headline }),
371
- body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
372
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-offer-card", classNames?.card), children: [
381
+ const newEnd = chunkLVUDBCQ2_cjs.formatMonthDay(end);
382
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-offer", classNames?.root), children: [
383
+ headline && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: headline }),
384
+ body && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: body, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
385
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-offer-card", classNames?.card), children: [
373
386
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-offer-details ck-trial-block", children: [
374
387
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-trial-badge", children: [
375
388
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-trial-days", children: [
@@ -387,13 +400,13 @@ function DefaultTrialExtensionOffer({
387
400
  "button",
388
401
  {
389
402
  type: "button",
390
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
403
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.acceptButton),
391
404
  onClick: () => onAccept(),
392
405
  disabled: isProcessing,
393
406
  children: isProcessing ? "Processing..." : offer.copy.cta
394
407
  }
395
408
  ),
396
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
409
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button-link", classNames?.declineButton), onClick: onDecline, children: offer.copy.declineCta })
397
410
  ] })
398
411
  ] });
399
412
  }
@@ -428,11 +441,11 @@ function pickOfferComponent(type, components) {
428
441
  }
429
442
  }
430
443
  function DefaultSuccess({ title, description, onClose, classNames }) {
431
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-success", classNames?.root), children: [
432
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkEHZJAQQ5_cjs.cn("ck-success-icon", classNames?.icon), children: /* @__PURE__ */ jsxRuntime.jsx(Checkmark, { color: "currentColor", size: 26 }) }),
433
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: title }),
434
- description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
435
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-success-actions", children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.closeButton), onClick: onClose, children: "Done" }) })
444
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-success", classNames?.root), children: [
445
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkLVUDBCQ2_cjs.cn("ck-success-icon", classNames?.icon), children: /* @__PURE__ */ jsxRuntime.jsx(Checkmark, { color: "currentColor", size: 26 }) }),
446
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: title }),
447
+ description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
448
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-success-actions", children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.closeButton), onClick: onClose, children: "Done" }) })
436
449
  ] });
437
450
  }
438
451
  function DefaultReasonButton({ reason, index, isSelected, onSelect }) {
@@ -443,9 +456,8 @@ function DefaultReasonButton({ reason, index, isSelected, onSelect }) {
443
456
  type: "button",
444
457
  role: "radio",
445
458
  "aria-checked": isSelected,
446
- tabIndex: isSelected ? 0 : -1,
447
459
  onClick: () => onSelect(reason.id),
448
- className: chunkEHZJAQQ5_cjs.cn("ck-reason-button", isSelected && "ck-reason-button--selected"),
460
+ className: chunkLVUDBCQ2_cjs.cn("ck-reason-button", isSelected && "ck-reason-button--selected"),
449
461
  children: [
450
462
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "ck-reason-badge", children: isSelected ? /* @__PURE__ */ jsxRuntime.jsx(Checkmark, { color: "#fff", size: 12 }) : letter }),
451
463
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ck-reason-label", children: reason.label })
@@ -459,57 +471,44 @@ function DefaultSurvey({
459
471
  reasons,
460
472
  selectedReason,
461
473
  onSelectReason,
474
+ followupResponse,
475
+ onFollowupResponseChange,
462
476
  onNext,
463
477
  classNames,
464
478
  components
465
479
  }) {
466
480
  const ReasonButton = components?.ReasonButton ?? DefaultReasonButton;
467
- const listRef = react.useRef(null);
468
- const handleKeyDown = react.useCallback(
469
- (e) => {
470
- if (e.key !== "ArrowDown" && e.key !== "ArrowUp") return;
471
- e.preventDefault();
472
- const currentIdx = reasons.findIndex((r) => r.id === selectedReason);
473
- let nextIdx;
474
- if (e.key === "ArrowDown") {
475
- nextIdx = currentIdx < reasons.length - 1 ? currentIdx + 1 : 0;
476
- } else {
477
- nextIdx = currentIdx > 0 ? currentIdx - 1 : reasons.length - 1;
478
- }
479
- onSelectReason(reasons[nextIdx].id);
480
- const buttons = listRef.current?.querySelectorAll('[role="radio"]');
481
- buttons?.[nextIdx]?.focus();
482
- },
483
- [reasons, selectedReason, onSelectReason]
484
- );
485
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkEHZJAQQ5_cjs.cn("ck-step ck-step-survey", classNames?.root), children: [
486
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkEHZJAQQ5_cjs.cn("ck-step-title", classNames?.title), children: title }),
487
- description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkEHZJAQQ5_cjs.cn("ck-step-description", classNames?.description) }),
488
- /* @__PURE__ */ jsxRuntime.jsx(
489
- "div",
481
+ const selected = reasons.find((r) => r.id === selectedReason);
482
+ const showFollowup = selected?.freeform === true;
483
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkLVUDBCQ2_cjs.cn("ck-step ck-step-survey", classNames?.root), children: [
484
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: chunkLVUDBCQ2_cjs.cn("ck-step-title", classNames?.title), children: title }),
485
+ description && /* @__PURE__ */ jsxRuntime.jsx(RichText, { html: description, className: chunkLVUDBCQ2_cjs.cn("ck-step-description", classNames?.description) }),
486
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkLVUDBCQ2_cjs.cn("ck-reason-list", classNames?.reasonList), role: "radiogroup", "aria-label": title, children: reasons.map((reason, i) => /* @__PURE__ */ jsxRuntime.jsx(
487
+ ReasonButton,
490
488
  {
491
- ref: listRef,
492
- className: chunkEHZJAQQ5_cjs.cn("ck-reason-list", classNames?.reasonList),
493
- role: "radiogroup",
494
- "aria-label": title,
495
- onKeyDown: handleKeyDown,
496
- children: reasons.map((reason, i) => /* @__PURE__ */ jsxRuntime.jsx(
497
- ReasonButton,
498
- {
499
- reason,
500
- index: i,
501
- isSelected: selectedReason === reason.id,
502
- onSelect: onSelectReason
503
- },
504
- reason.id
505
- ))
489
+ reason,
490
+ index: i,
491
+ isSelected: selectedReason === reason.id,
492
+ onSelect: onSelectReason
493
+ },
494
+ reason.id
495
+ )) }),
496
+ showFollowup && /* @__PURE__ */ jsxRuntime.jsx(
497
+ "textarea",
498
+ {
499
+ className: chunkLVUDBCQ2_cjs.cn("ck-reason-followup", classNames?.followupInput),
500
+ placeholder: "Tell us more (optional)",
501
+ rows: 3,
502
+ value: followupResponse,
503
+ onChange: (e) => onFollowupResponseChange(e.target.value),
504
+ "aria-label": "Additional detail"
506
505
  }
507
506
  ),
508
507
  /* @__PURE__ */ jsxRuntime.jsx(
509
508
  "button",
510
509
  {
511
510
  type: "button",
512
- className: chunkEHZJAQQ5_cjs.cn("ck-button ck-button-primary", classNames?.continueButton),
511
+ className: chunkLVUDBCQ2_cjs.cn("ck-button ck-button-primary", classNames?.continueButton),
513
512
  onClick: onNext,
514
513
  disabled: !selectedReason,
515
514
  children: "Continue"
@@ -518,7 +517,7 @@ function DefaultSurvey({
518
517
  ] });
519
518
  }
520
519
  function DefaultBackButton({ onBack, className }) {
521
- return /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-back-button", className), onClick: onBack, children: [
520
+ return /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-back-button", className), onClick: onBack, children: [
522
521
  /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
523
522
  "path",
524
523
  {
@@ -533,7 +532,7 @@ function DefaultBackButton({ onBack, className }) {
533
532
  ] });
534
533
  }
535
534
  function DefaultCloseButton({ onClose, className }) {
536
- return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkEHZJAQQ5_cjs.cn("ck-close-button", className), onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5L5 15M5 5l10 10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) });
535
+ return /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: chunkLVUDBCQ2_cjs.cn("ck-close-button", className), onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 5L5 15M5 5l10 10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) });
537
536
  }
538
537
  function trapFocus(container) {
539
538
  const focusableSelector = [
@@ -563,7 +562,7 @@ function trapFocus(container) {
563
562
  container.addEventListener("keydown", handleKeyDown);
564
563
  return () => container.removeEventListener("keydown", handleKeyDown);
565
564
  }
566
- function DefaultModal({ open, onClose, children, className }) {
565
+ function DefaultModal({ open, onClose, children, className, overlayClassName }) {
567
566
  const overlayRef = react.useRef(null);
568
567
  const modalRef = react.useRef(null);
569
568
  const previousFocusRef = react.useRef(null);
@@ -593,7 +592,7 @@ function DefaultModal({ open, onClose, children, className }) {
593
592
  "div",
594
593
  {
595
594
  ref: overlayRef,
596
- className: "ck-overlay",
595
+ className: chunkLVUDBCQ2_cjs.cn("ck-overlay", overlayClassName),
597
596
  onClick: (e) => {
598
597
  if (e.target === overlayRef.current) onClose();
599
598
  },
@@ -605,7 +604,7 @@ function DefaultModal({ open, onClose, children, className }) {
605
604
  "aria-modal": "true",
606
605
  "aria-labelledby": "ck-dialog-title",
607
606
  tabIndex: -1,
608
- className: chunkEHZJAQQ5_cjs.cn("ck-modal", className),
607
+ className: chunkLVUDBCQ2_cjs.cn("ck-modal", className),
609
608
  children
610
609
  }
611
610
  )
@@ -631,7 +630,7 @@ function useColorScheme(preference) {
631
630
  return system;
632
631
  }
633
632
  function CancelFlow(props) {
634
- const { machine, state, isLoading, loadError, retry } = chunkYSNMTOAW_cjs.useCancelFlowMachine(props);
633
+ const { machine, state, isLoading, loadError, retry } = chunk42SJA62X_cjs.useCancelFlowMachine(props);
635
634
  if (isLoading || loadError) {
636
635
  return /* @__PURE__ */ jsxRuntime.jsx(
637
636
  LoadStatus,
@@ -668,12 +667,12 @@ function LoadStatus({
668
667
  onRetry
669
668
  }) {
670
669
  const scheme = useColorScheme(appearance?.colorScheme);
671
- const appearanceStyle = chunkEHZJAQQ5_cjs.appearanceToStyle(appearance);
670
+ const appearanceStyle = chunkLVUDBCQ2_cjs.appearanceToStyle(appearance);
672
671
  const Modal = components?.Modal ?? DefaultModal;
673
672
  const CloseButton = components?.CloseButton ?? DefaultCloseButton;
674
673
  const handleClose = onClose ?? (() => {
675
674
  });
676
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-cancel-flow", "data-color-scheme": scheme, style: appearanceStyle, children: /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: true, onClose: handleClose, className: classNames?.modal, children: [
675
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-cancel-flow", "data-color-scheme": scheme, style: appearanceStyle, children: /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: true, onClose: handleClose, className: classNames?.modal, overlayClassName: classNames?.overlay, children: [
677
676
  /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { onClose: handleClose, className: classNames?.closeButton }),
678
677
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-content", children: [
679
678
  isLoading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-loading", style: { padding: "32px", textAlign: "center" }, children: [
@@ -721,11 +720,11 @@ function LoadStatus({
721
720
  }
722
721
  function FlowShell({ machine, state, appearance, classNames, components, customComponents }) {
723
722
  const scheme = useColorScheme(appearance?.colorScheme);
724
- const appearanceStyle = chunkEHZJAQQ5_cjs.appearanceToStyle(appearance);
723
+ const appearanceStyle = chunkLVUDBCQ2_cjs.appearanceToStyle(appearance);
725
724
  const Modal = components?.Modal ?? DefaultModal;
726
725
  const CloseButton = components?.CloseButton ?? DefaultCloseButton;
727
726
  const BackButton = components?.BackButton ?? DefaultBackButton;
728
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-cancel-flow", "data-color-scheme": scheme, style: appearanceStyle, children: /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: true, onClose: machine.close, className: classNames?.modal, children: [
727
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ck-cancel-flow", "data-color-scheme": scheme, style: appearanceStyle, children: /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: true, onClose: machine.close, className: classNames?.modal, overlayClassName: classNames?.overlay, children: [
729
728
  /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { onClose: machine.close, className: classNames?.closeButton }),
730
729
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ck-content", children: [
731
730
  machine.canGoBack && /* @__PURE__ */ jsxRuntime.jsx(BackButton, { onBack: machine.back, className: classNames?.backButton }),
@@ -748,11 +747,15 @@ function StepRenderer({
748
747
  return /* @__PURE__ */ jsxRuntime.jsx(
749
748
  Survey,
750
749
  {
751
- title: config?.title ?? chunkEHZJAQQ5_cjs.defaultTitles.survey,
750
+ title: config?.title ?? chunkLVUDBCQ2_cjs.defaultTitles.survey,
752
751
  description: config?.description,
752
+ customer: state.customer,
753
+ subscriptions: state.subscriptions,
753
754
  reasons: machine.reasons,
754
755
  selectedReason: state.selectedReason,
755
756
  onSelectReason: machine.selectReason,
757
+ followupResponse: state.followupResponse,
758
+ onFollowupResponseChange: machine.setFollowupResponse,
756
759
  onNext: machine.next,
757
760
  classNames: config?.classNames,
758
761
  components
@@ -769,12 +772,16 @@ function StepRenderer({
769
772
  {
770
773
  offer,
771
774
  customer: state.customer,
775
+ subscriptions: state.subscriptions,
772
776
  onAccept: machine.accept,
773
777
  onDecline: machine.decline,
774
778
  isProcessing: state.isProcessing
775
779
  }
776
780
  );
777
781
  }
782
+ if (!chunkLVUDBCQ2_cjs.BUILT_IN_OFFER_TYPES.includes(offer.type)) {
783
+ return /* @__PURE__ */ jsxRuntime.jsx(UnregisteredOfferFallback, { offerType: offer.type, onSkip: machine.decline });
784
+ }
778
785
  const Offer = components?.Offer ?? DefaultOffer;
779
786
  const config = stepConfig;
780
787
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -782,6 +789,8 @@ function StepRenderer({
782
789
  {
783
790
  title: config?.title,
784
791
  description: config?.description,
792
+ customer: state.customer,
793
+ subscriptions: state.subscriptions,
785
794
  offer,
786
795
  onAccept: machine.accept,
787
796
  onDecline: machine.decline,
@@ -797,8 +806,10 @@ function StepRenderer({
797
806
  return /* @__PURE__ */ jsxRuntime.jsx(
798
807
  Feedback,
799
808
  {
800
- title: config?.title ?? chunkEHZJAQQ5_cjs.defaultTitles.feedback,
809
+ title: config?.title ?? chunkLVUDBCQ2_cjs.defaultTitles.feedback,
801
810
  description: config?.description,
811
+ customer: state.customer,
812
+ subscriptions: state.subscriptions,
802
813
  placeholder: config?.placeholder,
803
814
  required: config?.required ?? false,
804
815
  minLength: config?.minLength ?? 0,
@@ -815,8 +826,10 @@ function StepRenderer({
815
826
  return /* @__PURE__ */ jsxRuntime.jsx(
816
827
  Confirm,
817
828
  {
818
- title: config?.title ?? chunkEHZJAQQ5_cjs.defaultTitles.confirm,
829
+ title: config?.title ?? chunkLVUDBCQ2_cjs.defaultTitles.confirm,
819
830
  description: config?.description,
831
+ customer: state.customer,
832
+ subscriptions: state.subscriptions,
820
833
  losses: config?.losses,
821
834
  lossesLabel: config?.lossesLabel,
822
835
  confirmLabel: config?.confirmLabel ?? "Cancel subscription",
@@ -839,6 +852,8 @@ function StepRenderer({
839
852
  offer: machine.currentOffer ?? void 0,
840
853
  title: isSaved ? config?.savedTitle ?? "Welcome back!" : config?.cancelledTitle ?? "Subscription cancelled",
841
854
  description: isSaved ? config?.savedDescription ?? "Your offer has been applied." : config?.cancelledDescription ?? "We're sorry to see you go.",
855
+ customer: state.customer,
856
+ subscriptions: state.subscriptions,
842
857
  onClose: machine.close,
843
858
  classNames: config?.classNames
844
859
  }
@@ -860,6 +875,7 @@ function StepRenderer({
860
875
  data: config?.data
861
876
  },
862
877
  customer: state.customer,
878
+ subscriptions: state.subscriptions,
863
879
  onNext: machine.next,
864
880
  onBack: machine.back
865
881
  }
@@ -874,50 +890,65 @@ function UnregisteredStepFallback({ step, onSkip }) {
874
890
  }, [step, onSkip]);
875
891
  return null;
876
892
  }
893
+ function UnregisteredOfferFallback({ offerType, onSkip }) {
894
+ react.useEffect(() => {
895
+ console.warn(`[churnkey] No component registered for offer type "${offerType}". Skipping.`);
896
+ onSkip();
897
+ }, [offerType, onSkip]);
898
+ return null;
899
+ }
877
900
 
878
901
  Object.defineProperty(exports, "useCancelFlow", {
879
902
  enumerable: true,
880
- get: function () { return chunkYSNMTOAW_cjs.useCancelFlow; }
903
+ get: function () { return chunk42SJA62X_cjs.useCancelFlow; }
904
+ });
905
+ Object.defineProperty(exports, "BUILT_IN_OFFER_TYPES", {
906
+ enumerable: true,
907
+ get: function () { return chunkLVUDBCQ2_cjs.BUILT_IN_OFFER_TYPES; }
881
908
  });
882
909
  Object.defineProperty(exports, "BUILT_IN_STEP_TYPES", {
883
910
  enumerable: true,
884
- get: function () { return chunkEHZJAQQ5_cjs.BUILT_IN_STEP_TYPES; }
911
+ get: function () { return chunkLVUDBCQ2_cjs.BUILT_IN_STEP_TYPES; }
885
912
  });
886
913
  Object.defineProperty(exports, "appearanceToStyle", {
887
914
  enumerable: true,
888
- get: function () { return chunkEHZJAQQ5_cjs.appearanceToStyle; }
915
+ get: function () { return chunkLVUDBCQ2_cjs.appearanceToStyle; }
889
916
  });
890
917
  Object.defineProperty(exports, "calculateDiscountedPrice", {
891
918
  enumerable: true,
892
- get: function () { return chunkEHZJAQQ5_cjs.calculateDiscountedPrice; }
919
+ get: function () { return chunkLVUDBCQ2_cjs.calculateDiscountedPrice; }
893
920
  });
894
921
  Object.defineProperty(exports, "cn", {
895
922
  enumerable: true,
896
- get: function () { return chunkEHZJAQQ5_cjs.cn; }
923
+ get: function () { return chunkLVUDBCQ2_cjs.cn; }
897
924
  });
898
925
  Object.defineProperty(exports, "defaultTitles", {
899
926
  enumerable: true,
900
- get: function () { return chunkEHZJAQQ5_cjs.defaultTitles; }
927
+ get: function () { return chunkLVUDBCQ2_cjs.defaultTitles; }
928
+ });
929
+ Object.defineProperty(exports, "formatPeriodEnd", {
930
+ enumerable: true,
931
+ get: function () { return chunkLVUDBCQ2_cjs.formatPeriodEnd; }
901
932
  });
902
933
  Object.defineProperty(exports, "formatPrice", {
903
934
  enumerable: true,
904
- get: function () { return chunkEHZJAQQ5_cjs.formatPrice; }
935
+ get: function () { return chunkLVUDBCQ2_cjs.formatPrice; }
905
936
  });
906
937
  Object.defineProperty(exports, "AnalyticsClient", {
907
938
  enumerable: true,
908
- get: function () { return chunkZEYUKGAR_cjs.AnalyticsClient; }
939
+ get: function () { return chunk2VQNWZWO_cjs.AnalyticsClient; }
909
940
  });
910
941
  Object.defineProperty(exports, "CancelFlowMachine", {
911
942
  enumerable: true,
912
- get: function () { return chunkZEYUKGAR_cjs.CancelFlowMachine; }
943
+ get: function () { return chunk2VQNWZWO_cjs.CancelFlowMachine; }
913
944
  });
914
945
  Object.defineProperty(exports, "ChurnkeyApi", {
915
946
  enumerable: true,
916
- get: function () { return chunkZEYUKGAR_cjs.ChurnkeyApi; }
947
+ get: function () { return chunk2VQNWZWO_cjs.ChurnkeyApi; }
917
948
  });
918
949
  Object.defineProperty(exports, "decodeSessionToken", {
919
950
  enumerable: true,
920
- get: function () { return chunkZEYUKGAR_cjs.decodeSessionToken; }
951
+ get: function () { return chunk2VQNWZWO_cjs.decodeSessionToken; }
921
952
  });
922
953
  exports.CancelFlow = CancelFlow;
923
954
  exports.DefaultBackButton = DefaultBackButton;