@lockerverse/react 0.2.74 → 0.2.76

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.
package/README.md CHANGED
@@ -22,11 +22,15 @@ import {
22
22
  type LockerversePaymentSelectionItem,
23
23
  } from "@lockerverse/react/payment";
24
24
  import "@lockerverse/react/payment.css";
25
+ import { useLockerverseWidget } from "@lockerverse/react/widget";
25
26
 
26
27
  export function Checkout() {
28
+ const widget = useLockerverseWidget({
29
+ communitySlug: "auburn",
30
+ widgetSlug: "tailgate-party",
31
+ });
27
32
  return (
28
33
  <LockerversePayment
29
- communitySlug="auburn"
30
34
  metadata={{ source: "community-site" }}
31
35
  onPaymentComplete={(payment) => {
32
36
  console.info("Payment complete", payment.checkoutId);
@@ -36,7 +40,7 @@ export function Checkout() {
36
40
  }}
37
41
  selection={[{ productSlug: "adult", quantity: 1 }]}
38
42
  theme="dark"
39
- widgetSlug="tailgate-party"
43
+ widget={widget}
40
44
  />
41
45
  );
42
46
  }
@@ -44,6 +48,23 @@ export function Checkout() {
44
48
 
45
49
  The original `@lockerverse/react` and `@lockerverse/react/styles.css` payment imports remain supported.
46
50
 
51
+ ## Resource identity
52
+
53
+ A mounted hook or widget keeps one resource identity. Do not change its API,
54
+ environment, community slug, widget slug, or signup slug. To show a different
55
+ resource, remount the owning component with a new React `key`:
56
+
57
+ ```tsx
58
+ <Checkout
59
+ key={`${communitySlug}:${widgetSlug}`}
60
+ communitySlug={communitySlug}
61
+ widgetSlug={widgetSlug}
62
+ />
63
+ ```
64
+
65
+ Selection, theme, callbacks, and other view properties can change without a
66
+ remount. `refresh()` reloads the same resource.
67
+
47
68
  ## Custom Product UI
48
69
 
49
70
  Use `useLockerverseWidget` to build custom Product presentation from the live
@@ -64,27 +85,29 @@ const widgetOptions = {
64
85
  };
65
86
 
66
87
  export function CustomProductCheckout() {
67
- const { error, loading, products, refresh, widget } =
68
- useLockerverseWidget(widgetOptions);
88
+ const widget = useLockerverseWidget(widgetOptions);
69
89
  const [selection, setSelection] =
70
90
  useState<LockerversePaymentSelectionItem | null>(null);
71
91
 
72
- if (loading) {
73
- return <p>Loading {widget?.name ?? "checkout"}...</p>;
92
+ if (widget.loading) {
93
+ return <p>Loading checkout...</p>;
94
+ }
95
+ if (widget.error) {
96
+ return <button onClick={widget.refresh}>Try again</button>;
74
97
  }
75
- if (error) {
76
- return <button onClick={refresh}>Try again</button>;
98
+ if (!widget.catalog) {
99
+ return null;
77
100
  }
78
101
  if (selection) {
79
102
  return (
80
103
  <LockerversePayment
81
- {...widgetOptions}
82
104
  selection={[selection]}
105
+ widget={widget}
83
106
  />
84
107
  );
85
108
  }
86
109
 
87
- return products
110
+ return widget.catalog.products
88
111
  .filter((product) => product.pricingMode === "fixed")
89
112
  .map((product) => (
90
113
  <button
@@ -103,11 +126,19 @@ export function CustomProductCheckout() {
103
126
  }
104
127
  ```
105
128
 
106
- The hook returns immutable catalog data together with `status`, `loading`,
107
- `error`, and `refresh`. The host owns presentation and selection state. Pass the
129
+ The hook returns immutable `catalog` data together with `loading`, `error`, and
130
+ `refresh`. The host owns presentation and selection state. Pass the
108
131
  selected Product slugs to `LockerversePayment`; Lockerverse remains
109
132
  authoritative for availability, pricing, and payment.
110
133
 
134
+ Pass the hook result to `LockerversePayment` with `widget={widget}`. The result
135
+ contains the loaded catalog and its client, so the component requests
136
+ only the authoritative quote without repeated configuration. The host can show
137
+ a local catalog total before checkout. The component uses the same local
138
+ estimate to mount the payment form and Stripe immediately, then replaces it
139
+ with the authoritative quote in the background. Payment confirmation still
140
+ requires the current authoritative quote.
141
+
111
142
  This small example shows fixed-price Products. For a custom-price Product, ask
112
143
  for the amount in the host UI and pass `amountCents` with `productSlug`.
113
144
 
@@ -116,9 +147,8 @@ cadence and configures Stripe Elements for a subscription:
116
147
 
117
148
  ```tsx
118
149
  <LockerversePayment
119
- communitySlug="auburn"
120
150
  selection={[{ productSlug: "monthly-supporter" }]}
121
- widgetSlug="supporter-tiers"
151
+ widget={widget}
122
152
  />
123
153
  ```
124
154
 
@@ -137,15 +167,19 @@ subscription mode.
137
167
 
138
168
  ```tsx
139
169
  import { LockerverseDonateLauncher } from "@lockerverse/react/donate-launcher";
170
+ import { useLockerverseWidget } from "@lockerverse/react/widget";
140
171
  import "@lockerverse/react/payment.css";
141
172
 
142
173
  export function Donate() {
174
+ const widget = useLockerverseWidget({
175
+ communitySlug: "auburn",
176
+ widgetSlug: "general-donations",
177
+ });
143
178
  return (
144
179
  <LockerverseDonateLauncher
145
180
  buttonLabel="Donate"
146
- communitySlug="auburn"
147
181
  position="bottom-right"
148
- widgetSlug="general-donations"
182
+ widget={widget}
149
183
  />
150
184
  );
151
185
  }
@@ -153,18 +187,26 @@ export function Donate() {
153
187
 
154
188
  Use `position="inline"` to place the launcher in the normal page layout. Use
155
189
  `bottom-left` or `bottom-right` for a fixed launcher. Payment callbacks,
156
- branding, themes, metadata, recovery properties, and development API options
157
- are the same as `LockerversePayment`.
190
+ branding, themes, metadata, and recovery properties are the same as
191
+ `LockerversePayment`. API and transport options belong to
192
+ `useLockerverseWidget`.
158
193
 
159
194
  ## Signup
160
195
 
161
196
  The signup entry does not import payment or Stripe code.
162
197
 
163
198
  ```tsx
164
- import { LockerverseSignup } from "@lockerverse/react/signup";
199
+ import {
200
+ LockerverseSignup,
201
+ useLockerverseSignup,
202
+ } from "@lockerverse/react/signup";
165
203
  import "@lockerverse/react/signup.css";
166
204
 
167
205
  export function Signup() {
206
+ const widget = useLockerverseSignup({
207
+ communitySlug: "auburn",
208
+ signupSlug: "tailgate-guests",
209
+ });
168
210
  return (
169
211
  <LockerverseSignup
170
212
  branding={{
@@ -172,11 +214,10 @@ export function Signup() {
172
214
  imageUrl: "https://cdn.example.com/community.png",
173
215
  name: "Auburn",
174
216
  }}
175
- communitySlug="auburn"
176
217
  onSignupComplete={(submission) => {
177
218
  console.info("Signup complete", submission.id);
178
219
  }}
179
- signupSlug="tailgate-guests"
220
+ widget={widget}
180
221
  />
181
222
  );
182
223
  }
@@ -184,15 +225,20 @@ export function Signup() {
184
225
 
185
226
  Pass `googlePlacesApiKey` to enable US address suggestions when the signup asks for an address. Manual address entry always remains available.
186
227
 
187
- For a development HTTPS backend, provide `apiBaseUrl`. The backend supplies the
188
- correct Stripe public key.
228
+ For a development HTTPS backend, provide `apiBaseUrl` to the hook. The backend
229
+ supplies the correct Stripe public key.
189
230
 
190
231
  ```tsx
232
+ const widget = useLockerverseWidget({
233
+ apiBaseUrl: "https://portal-dev.lockerverse.com/api",
234
+ communitySlug: "luis-c",
235
+ environment: "development",
236
+ widgetSlug: "new-payment-widget",
237
+ });
238
+
191
239
  <LockerversePayment
192
- apiBaseUrl="https://portal-dev.lockerverse.com/api"
193
- communitySlug="luis-c"
194
240
  selection={[{ productSlug: "adult", quantity: 1 }]}
195
- widgetSlug="new-payment-widget"
241
+ widget={widget}
196
242
  />
197
243
  ```
198
244
 
@@ -202,11 +248,12 @@ Use `theme="dark"` or `theme="light"`. Lockerverse applies the community brandin
202
248
 
203
249
  ```tsx
204
250
  <LockerversePayment
205
- // ...checkout props
251
+ selection={selection}
206
252
  style={{
207
253
  "--lockerverse-accent": "#ff6b35",
208
254
  "--lockerverse-radius": "14px",
209
255
  }}
256
+ widget={widget}
210
257
  />
211
258
  ```
212
259
 
@@ -238,7 +285,7 @@ const recovery = savedRecovery
238
285
  : null;
239
286
 
240
287
  <LockerversePayment
241
- // ...checkout props
288
+ selection={selection}
242
289
  resumePayment={recovery}
243
290
  onPaymentRecoveryChange={(nextRecovery) => {
244
291
  if (nextRecovery) {
@@ -247,6 +294,7 @@ const recovery = savedRecovery
247
294
  sessionStorage.removeItem(recoveryKey);
248
295
  }
249
296
  }}
297
+ widget={widget}
250
298
  />
251
299
  ```
252
300
 
@@ -0,0 +1,2 @@
1
+ import{useRef as e}from"react";function t(e,t){return e.apiBaseUrl===t.apiBaseUrl&&e.communitySlug===t.communitySlug&&e.environment===t.environment&&e.slug===t.slug}function n(n,r){if(!t(e(r).current,r))throw TypeError(`Lockerverse ${n} identity cannot change after initialization. Remount with a new React key.`)}export{n as t};
2
+ //# sourceMappingURL=immutable-resource-identity.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"immutable-resource-identity.js","names":[],"sources":["../src/immutable-resource-identity.ts"],"sourcesContent":["import { useRef } from \"react\";\n\ntype LockerverseResourceIdentity = {\n apiBaseUrl: string | undefined;\n communitySlug: string;\n environment: string | undefined;\n slug: string;\n};\n\nfunction hasSameIdentity(\n initial: LockerverseResourceIdentity,\n current: LockerverseResourceIdentity\n) {\n return (\n initial.apiBaseUrl === current.apiBaseUrl &&\n initial.communitySlug === current.communitySlug &&\n initial.environment === current.environment &&\n initial.slug === current.slug\n );\n}\n\nexport function useImmutableResourceIdentity(\n resource: \"payment widget\" | \"signup\",\n identity: LockerverseResourceIdentity\n) {\n const initial = useRef(identity);\n if (!hasSameIdentity(initial.current, identity)) {\n throw new TypeError(\n `Lockerverse ${resource} identity cannot change after initialization. Remount with a new React key.`\n );\n }\n}\n"],"mappings":"+BASA,SAAS,EACP,EACA,EACA,CACA,OACE,EAAQ,aAAe,EAAQ,YAC/B,EAAQ,gBAAkB,EAAQ,eAClC,EAAQ,cAAgB,EAAQ,aAChC,EAAQ,OAAS,EAAQ,IAE7B,CAEA,SAAgB,EACd,EACA,EACA,CAEA,GAAI,CAAC,EADW,EAAO,CACI,CAAC,CAAC,QAAS,CAAQ,EAC5C,MAAU,UACR,eAAe,EAAS,4EAC1B,CAEJ"}
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
+ import { n as useLockerverseWidget, t as UseLockerverseWidgetResult } from "./use-lockerverse-widget.js";
1
2
  import { a as LockerversePaymentRecovery, c as LockerversePaymentTheme, i as LockerversePaymentProps, l as LockerversePaymentUncertain, n as LockerverseDonateLauncherProps, o as LockerversePaymentSelectionItem, r as LockerversePaymentBranding, s as LockerversePaymentStyle, t as LockerverseDonateLauncherPosition, u as LockerverseStripeLoader } from "./types.js";
2
3
  import { t as LockerverseDonateLauncher } from "./lockerverse-donate-launcher.js";
3
4
  import { t as LockerversePayment } from "./lockerverse-payment.js";
4
- import { n as UseLockerverseWidgetResult, r as useLockerverseWidget, t as LockerverseWidgetStatus } from "./use-lockerverse-widget.js";
5
- export { LockerverseDonateLauncher, type LockerverseDonateLauncherPosition, type LockerverseDonateLauncherProps, LockerversePayment, type LockerversePaymentBranding, type LockerversePaymentProps, type LockerversePaymentRecovery, type LockerversePaymentSelectionItem, type LockerversePaymentStyle, type LockerversePaymentTheme, type LockerversePaymentUncertain, type LockerverseStripeLoader, type LockerverseWidgetStatus, type UseLockerverseWidgetResult, useLockerverseWidget };
5
+ export { LockerverseDonateLauncher, type LockerverseDonateLauncherPosition, type LockerverseDonateLauncherProps, LockerversePayment, type LockerversePaymentBranding, type LockerversePaymentProps, type LockerversePaymentRecovery, type LockerversePaymentSelectionItem, type LockerversePaymentStyle, type LockerversePaymentTheme, type LockerversePaymentUncertain, type LockerverseStripeLoader, type UseLockerverseWidgetResult, useLockerverseWidget };
@@ -1,6 +1,6 @@
1
1
  import { n as LockerverseDonateLauncherProps } from "./types.js";
2
2
  //#region src/lockerverse-donate-launcher.d.ts
3
- declare function LockerverseDonateLauncher({ buttonLabel, position, ...paymentProps }: LockerverseDonateLauncherProps): import("react").JSX.Element;
3
+ declare function LockerverseDonateLauncher({ buttonLabel, position, widget, ...paymentProps }: LockerverseDonateLauncherProps): import("react").JSX.Element;
4
4
  //#endregion
5
5
  export { LockerverseDonateLauncher as t };
6
6
  //# sourceMappingURL=lockerverse-donate-launcher.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"lockerverse-donate-launcher.d.ts","names":[],"sources":["../src/lockerverse-donate-launcher.tsx"],"mappings":";;iBA+uBgB,4BACd,aACA,aACG,gBACF,iDAA8B,IAAA"}
1
+ {"version":3,"file":"lockerverse-donate-launcher.d.ts","names":[],"sources":["../src/lockerverse-donate-launcher.tsx"],"mappings":";;iBA0jBgB,4BACd,aACA,UACA,WACG,gBACF,iDAA8B,IAAA"}
@@ -1,2 +1,2 @@
1
- import{t as e}from"./lockerverse-payment.js";import{Dialog as t}from"@base-ui/react/dialog";import{createLockerverseCheckoutClient as n}from"@lockerverse/sdk/checkout";import{createElement as r,useEffect as i,useRef as a,useState as o}from"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";const u=new Intl.NumberFormat(`en-US`,{currency:`USD`,style:`currency`}),d=/^(?:0|[1-9]\d*)(?:\.\d{1,2})?$/,f=[1e3,2500,5e3,1e4];function p(e){if(!d.test(e))return null;let t=Math.round(Number(e)*100);return Number.isSafeInteger(t)&&t>0?t:null}function m(e,t){let n=``;return t===`monthly`&&(n=`/month`),t===`annually`&&(n=`/year`),`${u.format(e/100)}${n}`}function h({customAmounts:e,product:t,quantities:n,recurringProductId:r,setCustomAmounts:i,setQuantities:a,setRecurringProductId:o}){let s=n[t.id]??0;if(t.pricingMode===`fixed`&&t.paymentOption===`one-time`){let e=Math.min(t.maximumQuantity??1/0,t.inventoryQuantity??1/0);return l(`span`,{className:`lockerverse-launcher__quantity`,children:[c(`button`,{"aria-label":`Decrease ${t.name} quantity`,disabled:s===0,onClick:()=>{o(null),a(e=>{let n=e[t.id]??0,r=t.minimumQuantity??1;return{...e,[t.id]:n<=r?0:n-1}})},type:`button`,children:`−`}),c(`output`,{"aria-label":`${t.name} quantity`,children:s}),c(`button`,{"aria-label":`Increase ${t.name} quantity`,disabled:s>=e,onClick:()=>{o(null),a(e=>{let n=e[t.id]??0;return{...e,[t.id]:n===0?t.minimumQuantity??1:n+1}})},type:`button`,children:`+`})]})}return t.pricingMode===`custom`&&t.paymentOption===`one-time`?l(`span`,{className:`lockerverse-launcher__custom-amount`,children:[c(`span`,{"aria-hidden":`true`,children:`$`}),c(`input`,{"aria-label":`${t.name} amount`,min:(t.minimumAmountCents??1)/100,name:`amount-${t.slug}`,onChange:e=>{o(null),i(n=>({...n,[t.id]:e.target.value}))},placeholder:`0.00`,step:`0.01`,type:`number`,value:e[t.id]??``}),t.minimumAmountCents===null?null:l(`small`,{children:[`Minimum `,u.format(t.minimumAmountCents/100)]})]}):c(`button`,{"aria-label":`Select ${t.name}`,"aria-pressed":r===t.id,className:`lockerverse-launcher__select`,onClick:()=>{a({}),i({}),o(e=>e===t.id?null:t.id)},type:`button`,children:`Select`})}function g({variant:e=`default`,...t}){let{customAmounts:n,product:r,quantities:i,recurringProductId:a}=t,o=p(n[r.id]??``),s=a===r.id||r.paymentOption===`one-time`&&(r.pricingMode===`fixed`&&(i[r.id]??0)>0||r.pricingMode===`custom`&&o!==null&&(r.minimumAmountCents===null||o>=r.minimumAmountCents));return l(`article`,{className:`lockerverse-launcher__product lockerverse-launcher__product--${e}`,"data-selected":s||void 0,children:[l(`span`,{className:`lockerverse-launcher__product-copy`,children:[c(`strong`,{className:`lockerverse-launcher__product-name`,children:r.name}),r.description?c(`small`,{children:r.description}):null,r.amountCents===null?null:c(`span`,{className:`lockerverse-launcher__product-price`,children:m(r.amountCents,r.paymentOption)})]}),c(h,{...t})]})}function _({customAmounts:e,product:t,setCustomAmounts:n,setRecurringProductId:r}){let i=e[t.id]??``,a=p(i),o=f.filter(e=>t.minimumAmountCents===null||e>=t.minimumAmountCents),s=o.includes(a??0),d=e=>{r(null),n(n=>({...n,[t.id]:e}))};return c(`div`,{className:`lockerverse-launcher__donation-option`,children:l(`fieldset`,{className:`lockerverse-launcher__donation-choices`,children:[l(`legend`,{className:`lockerverse-launcher__sr-only`,children:[t.name,` amount`]}),c(`button`,{"aria-pressed":i===``,onClick:()=>d(``),type:`button`,children:`No thanks`}),o.map(e=>c(`button`,{"aria-pressed":a===e,onClick:()=>d(String(e/100)),type:`button`,children:u.format(e/100).replace(`.00`,``)},e)),c(`label`,{className:`lockerverse-launcher__donation-other`,"data-selected":i!==``&&!s||void 0,children:c(`input`,{"aria-label":`${t.name} amount`,min:(t.minimumAmountCents??1)/100,name:`amount-${t.slug}`,onChange:e=>d(e.target.value),placeholder:`Other $`,step:`0.01`,type:`number`,value:s?``:i})})]})})}function v({products:e,variant:t=`default`,...n}){return c(`div`,{className:`lockerverse-launcher__product-list`,children:e.map(e=>t===`donation`?r(_,{...n,key:e.id,product:e}):r(g,{...n,key:e.id,product:e,variant:t}))})}function y(e,t){let n=0,r=0;for(let i of t){let t=e.products.find(e=>e.slug===i.productSlug);if(t){if(`quantity`in i){n+=i.quantity,r+=(t.amountCents??0)*i.quantity;continue}n+=1,r+=`amountCents`in i?i.amountCents:t.amountCents??0}}return{amountCents:r,itemCount:n}}function b(){return c(`div`,{"aria-label":`Loading donation options`,className:`lockerverse-launcher__loading`,role:`status`,children:[0,1,2].map(e=>c(`span`,{"aria-hidden":`true`,className:`lockerverse-launcher__loading-row`},e))})}function x(e,t,n,r){if(r){let t=e.products.find(e=>e.id===r&&e.paymentOption!==`one-time`);return t?[{productSlug:t.slug}]:[]}return e.products.flatMap(e=>{let r=t[e.id]??0;if(e.pricingMode===`fixed`&&e.paymentOption===`one-time`&&r>0)return[{productSlug:e.slug,quantity:r}];let i=p(n[e.id]??``);return e.pricingMode===`custom`&&e.paymentOption===`one-time`&&i!==null&&(e.minimumAmountCents===null||i>=e.minimumAmountCents)?[{amountCents:i,productSlug:e.slug}]:[]})}function S({catalog:e,onContinue:t,...n}){let r=x(e,n.quantities,n.customAmounts,n.recurringProductId),i=y(e,r),a=e.products.filter(e=>e.paymentOption===`one-time`&&e.pricingMode===`custom`),o=e.products.filter(e=>!a.includes(e));return l(`form`,{className:`lockerverse-launcher__products`,onSubmit:e=>{e.preventDefault(),r.length>0&&t(r)},children:[o.length>0?c(`section`,{className:`lockerverse-launcher__section`,children:c(v,{...n,products:o})}):null,a.length>0?l(`section`,{className:`lockerverse-launcher__donation`,children:[l(`header`,{className:`lockerverse-launcher__section-header`,children:[c(`h3`,{children:`Add a donation`}),c(`p`,{children:`Choose an amount to add to this order.`})]}),c(v,{...n,products:a,variant:`donation`})]}):null,e.products.length>0?l(`footer`,{className:`lockerverse-launcher__footer`,children:[l(`p`,{"aria-live":`polite`,className:`lockerverse-launcher__summary`,children:[c(`span`,{children:i.itemCount===0?`No items selected`:`${i.itemCount} ${i.itemCount===1?`item`:`items`} selected`}),i.itemCount===0?null:c(`strong`,{children:u.format(i.amountCents/100)})]}),c(`button`,{className:`lockerverse-launcher__continue`,disabled:r.length===0,type:`submit`,children:`Continue`})]}):null]})}function C({onEdit:t,paymentProps:n,selection:r,style:i}){return l(`div`,{className:`lockerverse-launcher__checkout`,children:[c(`header`,{className:`lockerverse-launcher__checkout-toolbar`,children:c(`button`,{className:`lockerverse-launcher__back`,onClick:t,type:`button`,children:`Edit order`})}),c(e,{...n,selection:r,style:i})]})}function w({catalog:e,checkout:n}){return n?l(s,{children:[c(t.Title,{className:`lockerverse-launcher__sr-only`,children:`Checkout`}),c(t.Description,{className:`lockerverse-launcher__sr-only`,children:`Review the order and complete payment.`})]}):e?l(`header`,{className:`lockerverse-launcher__header`,children:[e.community?l(`div`,{className:`lockerverse-launcher__brand`,children:[e.community.imageUrl?c(`img`,{alt:`${e.community.name} logo`,height:`28`,src:e.community.imageUrl,width:`28`}):null,c(`span`,{children:e.community.name})]}):null,c(t.Title,{className:`lockerverse-launcher__title`,children:e.widget.title??e.widget.name}),c(t.Description,{className:`lockerverse-launcher__description`,children:e.widget.description??`Choose your options, then continue to checkout.`})]}):l(`header`,{className:`lockerverse-launcher__header`,children:[c(t.Title,{className:`lockerverse-launcher__title`,children:`Donate`}),c(t.Description,{className:`lockerverse-launcher__description`,children:`Choose your options, then continue to checkout.`})]})}function T(e,t){return e.apiBaseUrl===t.apiBaseUrl&&e.communitySlug===t.communitySlug&&e.environment===t.environment&&e.fetch===t.fetch&&e.widgetSlug===t.widgetSlug}function E({buttonLabel:e,onOpenChange:r,open:a,paymentProps:s,position:u}){let[d,f]=o(null),[p,m]=o(null),[h,g]=o({}),[_,v]=o({}),[y,x]=o(null),[T,E]=o(!1),[D,O]=o(0),{apiBaseUrl:k,communitySlug:A,environment:j,fetch:M,onError:N,requestTimeoutMs:P,sentryDsn:F,widgetSlug:I}=s,L={...d?.community?{"--lockerverse-accent":d.community.accentColor}:{},...s.style};i(()=>{if(!(a&&d===null))return;let e=!0;return n(s).load().then(t=>{e&&(f(t),E(!1))}).catch(()=>{e&&E(!0)}),()=>{e=!1}},[k,d,A,j,M,D,N,a,P,F,I]);let R=c(b,{});return T&&(R=l(`div`,{role:`alert`,children:[c(`p`,{children:`Unable to load donation options.`}),c(`button`,{onClick:()=>{E(!1),O(e=>e+1)},type:`button`,children:`Retry`})]})),d&&(R=c(S,{catalog:d,customAmounts:h,onContinue:m,quantities:_,recurringProductId:y,setCustomAmounts:g,setQuantities:v,setRecurringProductId:x})),p&&(R=c(C,{onEdit:()=>m(null),paymentProps:s,selection:p,style:L})),l(t.Root,{onOpenChange:r,open:a,children:[c(t.Trigger,{className:`lockerverse-launcher lockerverse-launcher--${u}`,"data-lockerverse-theme":s.theme??`dark`,style:L,children:e}),l(t.Portal,{children:[c(t.Backdrop,{className:`lockerverse-launcher__backdrop`}),c(t.Viewport,{className:`lockerverse-launcher__viewport`,children:l(t.Popup,{className:`lockerverse-launcher__dialog`,"data-lockerverse-theme":s.theme??`dark`,style:L,children:[c(w,{catalog:d,checkout:p!==null}),c(t.Close,{"aria-label":`Close donation dialog`,className:`lockerverse-launcher__close`,children:c(`span`,{"aria-hidden":`true`,children:`×`})}),R]})})]})]})}function D({buttonLabel:e=`Donate`,position:t=`inline`,...n}){let[r,i]=o(!1),s={apiBaseUrl:n.apiBaseUrl,communitySlug:n.communitySlug,environment:n.environment,fetch:n.fetch,widgetSlug:n.widgetSlug},l=a(s),u=a(0);return T(l.current,s)||(l.current=s,u.current+=1),c(E,{buttonLabel:e,onOpenChange:i,open:r,paymentProps:n,position:t},u.current)}export{D as t};
1
+ import{t as e}from"./lockerverse-payment.js";import{Dialog as t}from"@base-ui/react/dialog";import{createElement as n,useState as r}from"react";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";const s=new Intl.NumberFormat(`en-US`,{currency:`USD`,style:`currency`}),c=/^(?:0|[1-9]\d*)(?:\.\d{1,2})?$/,l=[1e3,2500,5e3,1e4];function u(e){if(!c.test(e))return null;let t=Math.round(Number(e)*100);return Number.isSafeInteger(t)&&t>0?t:null}function d(e,t){let n=``;return t===`monthly`&&(n=`/month`),t===`annually`&&(n=`/year`),`${s.format(e/100)}${n}`}function f({customAmounts:e,product:t,quantities:n,recurringProductId:r,setCustomAmounts:i,setQuantities:c,setRecurringProductId:l}){let u=n[t.id]??0;if(t.pricingMode===`fixed`&&t.paymentOption===`one-time`){let e=Math.min(t.maximumQuantity??1/0,t.inventoryQuantity??1/0);return o(`span`,{className:`lockerverse-launcher__quantity`,children:[a(`button`,{"aria-label":`Decrease ${t.name} quantity`,disabled:u===0,onClick:()=>{l(null),c(e=>{let n=e[t.id]??0,r=t.minimumQuantity??1;return{...e,[t.id]:n<=r?0:n-1}})},type:`button`,children:`−`}),a(`output`,{"aria-label":`${t.name} quantity`,children:u}),a(`button`,{"aria-label":`Increase ${t.name} quantity`,disabled:u>=e,onClick:()=>{l(null),c(e=>{let n=e[t.id]??0;return{...e,[t.id]:n===0?t.minimumQuantity??1:n+1}})},type:`button`,children:`+`})]})}return t.pricingMode===`custom`&&t.paymentOption===`one-time`?o(`span`,{className:`lockerverse-launcher__custom-amount`,children:[a(`span`,{"aria-hidden":`true`,children:`$`}),a(`input`,{"aria-label":`${t.name} amount`,min:(t.minimumAmountCents??1)/100,name:`amount-${t.slug}`,onChange:e=>{l(null),i(n=>({...n,[t.id]:e.target.value}))},placeholder:`0.00`,step:`0.01`,type:`number`,value:e[t.id]??``}),t.minimumAmountCents===null?null:o(`small`,{children:[`Minimum `,s.format(t.minimumAmountCents/100)]})]}):a(`button`,{"aria-label":`Select ${t.name}`,"aria-pressed":r===t.id,className:`lockerverse-launcher__select`,onClick:()=>{c({}),i({}),l(e=>e===t.id?null:t.id)},type:`button`,children:`Select`})}function p({variant:e=`default`,...t}){let{customAmounts:n,product:r,quantities:i,recurringProductId:s}=t,c=u(n[r.id]??``),l=s===r.id||r.paymentOption===`one-time`&&(r.pricingMode===`fixed`&&(i[r.id]??0)>0||r.pricingMode===`custom`&&c!==null&&(r.minimumAmountCents===null||c>=r.minimumAmountCents));return o(`article`,{className:`lockerverse-launcher__product lockerverse-launcher__product--${e}`,"data-selected":l||void 0,children:[o(`span`,{className:`lockerverse-launcher__product-copy`,children:[a(`strong`,{className:`lockerverse-launcher__product-name`,children:r.name}),r.description?a(`small`,{children:r.description}):null,r.amountCents===null?null:a(`span`,{className:`lockerverse-launcher__product-price`,children:d(r.amountCents,r.paymentOption)})]}),a(f,{...t})]})}function m({customAmounts:e,product:t,setCustomAmounts:n,setRecurringProductId:r}){let i=e[t.id]??``,c=u(i),d=l.filter(e=>t.minimumAmountCents===null||e>=t.minimumAmountCents),f=d.includes(c??0),p=e=>{r(null),n(n=>({...n,[t.id]:e}))};return a(`div`,{className:`lockerverse-launcher__donation-option`,children:o(`fieldset`,{className:`lockerverse-launcher__donation-choices`,children:[o(`legend`,{className:`lockerverse-launcher__sr-only`,children:[t.name,` amount`]}),a(`button`,{"aria-pressed":i===``,onClick:()=>p(``),type:`button`,children:`No thanks`}),d.map(e=>a(`button`,{"aria-pressed":c===e,onClick:()=>p(String(e/100)),type:`button`,children:s.format(e/100).replace(`.00`,``)},e)),a(`label`,{className:`lockerverse-launcher__donation-other`,"data-selected":i!==``&&!f||void 0,children:a(`input`,{"aria-label":`${t.name} amount`,min:(t.minimumAmountCents??1)/100,name:`amount-${t.slug}`,onChange:e=>p(e.target.value),placeholder:`Other $`,step:`0.01`,type:`number`,value:f?``:i})})]})})}function h({products:e,variant:t=`default`,...r}){return a(`div`,{className:`lockerverse-launcher__product-list`,children:e.map(e=>t===`donation`?n(m,{...r,key:e.id,product:e}):n(p,{...r,key:e.id,product:e,variant:t}))})}function g(e,t){let n=0,r=0;for(let i of t){let t=e.products.find(e=>e.slug===i.productSlug);if(t){if(`quantity`in i){n+=i.quantity,r+=(t.amountCents??0)*i.quantity;continue}n+=1,r+=`amountCents`in i?i.amountCents:t.amountCents??0}}return{amountCents:r,itemCount:n}}function _(){return a(`div`,{"aria-label":`Loading donation options`,className:`lockerverse-launcher__loading`,role:`status`,children:[0,1,2].map(e=>a(`span`,{"aria-hidden":`true`,className:`lockerverse-launcher__loading-row`},e))})}function v(e,t,n,r){if(r){let t=e.products.find(e=>e.id===r&&e.paymentOption!==`one-time`);return t?[{productSlug:t.slug}]:[]}return e.products.flatMap(e=>{let r=t[e.id]??0;if(e.pricingMode===`fixed`&&e.paymentOption===`one-time`&&r>0)return[{productSlug:e.slug,quantity:r}];let i=u(n[e.id]??``);return e.pricingMode===`custom`&&e.paymentOption===`one-time`&&i!==null&&(e.minimumAmountCents===null||i>=e.minimumAmountCents)?[{amountCents:i,productSlug:e.slug}]:[]})}function y({catalog:e,onContinue:t,...n}){let r=v(e,n.quantities,n.customAmounts,n.recurringProductId),i=g(e,r),c=e.products.filter(e=>e.paymentOption===`one-time`&&e.pricingMode===`custom`),l=e.products.filter(e=>!c.includes(e));return o(`form`,{className:`lockerverse-launcher__products`,onSubmit:e=>{e.preventDefault(),r.length>0&&t(r)},children:[l.length>0?a(`section`,{className:`lockerverse-launcher__section`,children:a(h,{...n,products:l})}):null,c.length>0?o(`section`,{className:`lockerverse-launcher__donation`,children:[o(`header`,{className:`lockerverse-launcher__section-header`,children:[a(`h3`,{children:`Add a donation`}),a(`p`,{children:`Choose an amount to add to this order.`})]}),a(h,{...n,products:c,variant:`donation`})]}):null,e.products.length>0?o(`footer`,{className:`lockerverse-launcher__footer`,children:[o(`p`,{"aria-live":`polite`,className:`lockerverse-launcher__summary`,children:[a(`span`,{children:i.itemCount===0?`No items selected`:`${i.itemCount} ${i.itemCount===1?`item`:`items`} selected`}),i.itemCount===0?null:a(`strong`,{children:s.format(i.amountCents/100)})]}),a(`button`,{className:`lockerverse-launcher__continue`,disabled:r.length===0,type:`submit`,children:`Continue`})]}):null]})}function b({onEdit:t,paymentProps:n,selection:r,style:i,widget:s}){return o(`div`,{className:`lockerverse-launcher__checkout`,children:[a(`header`,{className:`lockerverse-launcher__checkout-toolbar`,children:a(`button`,{className:`lockerverse-launcher__back`,onClick:t,type:`button`,children:`Edit order`})}),a(e,{...n,selection:r,style:i,widget:s})]})}function x({catalog:e,checkout:n}){return n?o(i,{children:[a(t.Title,{className:`lockerverse-launcher__sr-only`,children:`Checkout`}),a(t.Description,{className:`lockerverse-launcher__sr-only`,children:`Review the order and complete payment.`})]}):e?o(`header`,{className:`lockerverse-launcher__header`,children:[e.community?o(`div`,{className:`lockerverse-launcher__brand`,children:[e.community.imageUrl?a(`img`,{alt:`${e.community.name} logo`,height:`28`,src:e.community.imageUrl,width:`28`}):null,a(`span`,{children:e.community.name})]}):null,a(t.Title,{className:`lockerverse-launcher__title`,children:e.widget.title??e.widget.name}),a(t.Description,{className:`lockerverse-launcher__description`,children:e.widget.description??`Choose your options, then continue to checkout.`})]}):o(`header`,{className:`lockerverse-launcher__header`,children:[a(t.Title,{className:`lockerverse-launcher__title`,children:`Donate`}),a(t.Description,{className:`lockerverse-launcher__description`,children:`Choose your options, then continue to checkout.`})]})}function S({buttonLabel:e=`Donate`,position:n=`inline`,widget:i,...s}){let[c,l]=r(null),[u,d]=r({}),[f,p]=r({}),[m,h]=r(null),{catalog:g,error:v,loading:S}=i,C={...g?.community?{"--lockerverse-accent":g.community.accentColor}:{},...s.style},w;return w=S?a(_,{}):v?o(`div`,{role:`alert`,children:[a(`p`,{children:`Unable to load donation options.`}),a(`button`,{onClick:i.refresh,type:`button`,children:`Retry`})]}):g?a(y,{catalog:g,customAmounts:u,onContinue:l,quantities:f,recurringProductId:m,setCustomAmounts:d,setQuantities:p,setRecurringProductId:h}):a(_,{}),!(S||v)&&c&&g&&(w=a(b,{onEdit:()=>l(null),paymentProps:s,selection:c,style:C,widget:i})),o(t.Root,{children:[a(t.Trigger,{className:`lockerverse-launcher lockerverse-launcher--${n}`,"data-lockerverse-theme":s.theme??`dark`,style:C,children:e}),o(t.Portal,{children:[a(t.Backdrop,{className:`lockerverse-launcher__backdrop`}),a(t.Viewport,{className:`lockerverse-launcher__viewport`,children:o(t.Popup,{className:`lockerverse-launcher__dialog`,"data-lockerverse-theme":s.theme??`dark`,style:C,children:[a(x,{catalog:g,checkout:c!==null}),a(t.Close,{"aria-label":`Close donation dialog`,className:`lockerverse-launcher__close`,children:a(`span`,{"aria-hidden":`true`,children:`×`})}),w]})})]})]})}export{S as t};
2
2
  //# sourceMappingURL=lockerverse-donate-launcher.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"lockerverse-donate-launcher.js","names":[],"sources":["../src/lockerverse-donate-launcher.tsx"],"sourcesContent":["import { Dialog } from \"@base-ui/react/dialog\";\nimport {\n createLockerverseCheckoutClient,\n type LockerverseCatalog,\n type LockerverseProduct,\n} from \"@lockerverse/sdk/checkout\";\nimport {\n type Dispatch,\n type ReactNode,\n type SetStateAction,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { LockerversePayment } from \"./lockerverse-payment.tsx\";\nimport type {\n LockerverseDonateLauncherProps,\n LockerversePaymentSelectionItem,\n LockerversePaymentStyle,\n} from \"./types.ts\";\n\nconst usd = new Intl.NumberFormat(\"en-US\", {\n currency: \"USD\",\n style: \"currency\",\n});\nconst decimalAmountPattern = /^(?:0|[1-9]\\d*)(?:\\.\\d{1,2})?$/;\nconst suggestedDonationAmountsCents = [1000, 2500, 5000, 10_000];\n\nfunction parseAmountCents(value: string) {\n if (!decimalAmountPattern.test(value)) {\n return null;\n }\n const amountCents = Math.round(Number(value) * 100);\n return Number.isSafeInteger(amountCents) && amountCents > 0\n ? amountCents\n : null;\n}\n\nfunction formatProductPrice(\n amountCents: number,\n paymentOption: \"one-time\" | \"monthly\" | \"annually\"\n) {\n let cadence = \"\";\n if (paymentOption === \"monthly\") {\n cadence = \"/month\";\n }\n if (paymentOption === \"annually\") {\n cadence = \"/year\";\n }\n return `${usd.format(amountCents / 100)}${cadence}`;\n}\n\ntype LauncherProductControlProps = {\n customAmounts: Record<string, string>;\n product: LockerverseProduct;\n quantities: Record<string, number>;\n recurringProductId: string | null;\n setCustomAmounts: Dispatch<SetStateAction<Record<string, string>>>;\n setQuantities: Dispatch<SetStateAction<Record<string, number>>>;\n setRecurringProductId: Dispatch<SetStateAction<string | null>>;\n};\n\nfunction LauncherProductControl({\n customAmounts,\n product,\n quantities,\n recurringProductId,\n setCustomAmounts,\n setQuantities,\n setRecurringProductId,\n}: LauncherProductControlProps) {\n const quantity = quantities[product.id] ?? 0;\n if (product.pricingMode === \"fixed\" && product.paymentOption === \"one-time\") {\n const maximum = Math.min(\n product.maximumQuantity ?? Number.POSITIVE_INFINITY,\n product.inventoryQuantity ?? Number.POSITIVE_INFINITY\n );\n return (\n <span className=\"lockerverse-launcher__quantity\">\n <button\n aria-label={`Decrease ${product.name} quantity`}\n disabled={quantity === 0}\n onClick={() => {\n setRecurringProductId(null);\n setQuantities((current) => {\n const currentQuantity = current[product.id] ?? 0;\n const minimum = product.minimumQuantity ?? 1;\n return {\n ...current,\n [product.id]:\n currentQuantity <= minimum ? 0 : currentQuantity - 1,\n };\n });\n }}\n type=\"button\"\n >\n −\n </button>\n <output aria-label={`${product.name} quantity`}>{quantity}</output>\n <button\n aria-label={`Increase ${product.name} quantity`}\n disabled={quantity >= maximum}\n onClick={() => {\n setRecurringProductId(null);\n setQuantities((current) => {\n const currentQuantity = current[product.id] ?? 0;\n return {\n ...current,\n [product.id]:\n currentQuantity === 0\n ? (product.minimumQuantity ?? 1)\n : currentQuantity + 1,\n };\n });\n }}\n type=\"button\"\n >\n +\n </button>\n </span>\n );\n }\n\n if (\n product.pricingMode === \"custom\" &&\n product.paymentOption === \"one-time\"\n ) {\n return (\n <span className=\"lockerverse-launcher__custom-amount\">\n <span aria-hidden=\"true\">$</span>\n <input\n aria-label={`${product.name} amount`}\n min={(product.minimumAmountCents ?? 1) / 100}\n name={`amount-${product.slug}`}\n onChange={(event) => {\n setRecurringProductId(null);\n setCustomAmounts((current) => ({\n ...current,\n [product.id]: event.target.value,\n }));\n }}\n placeholder=\"0.00\"\n step=\"0.01\"\n type=\"number\"\n value={customAmounts[product.id] ?? \"\"}\n />\n {product.minimumAmountCents === null ? null : (\n <small>Minimum {usd.format(product.minimumAmountCents / 100)}</small>\n )}\n </span>\n );\n }\n\n return (\n <button\n aria-label={`Select ${product.name}`}\n aria-pressed={recurringProductId === product.id}\n className=\"lockerverse-launcher__select\"\n onClick={() => {\n setQuantities({});\n setCustomAmounts({});\n setRecurringProductId((current) =>\n current === product.id ? null : product.id\n );\n }}\n type=\"button\"\n >\n Select\n </button>\n );\n}\n\ntype LauncherProductOptionProps = LauncherProductControlProps & {\n variant?: \"default\" | \"donation\";\n};\n\nfunction LauncherProductOption({\n variant = \"default\",\n ...props\n}: LauncherProductOptionProps) {\n const { customAmounts, product, quantities, recurringProductId } = props;\n const customAmount = parseAmountCents(customAmounts[product.id] ?? \"\");\n const isSelected =\n recurringProductId === product.id ||\n (product.paymentOption === \"one-time\" &&\n ((product.pricingMode === \"fixed\" && (quantities[product.id] ?? 0) > 0) ||\n (product.pricingMode === \"custom\" &&\n customAmount !== null &&\n (product.minimumAmountCents === null ||\n customAmount >= product.minimumAmountCents))));\n return (\n <article\n className={`lockerverse-launcher__product lockerverse-launcher__product--${variant}`}\n data-selected={isSelected || undefined}\n >\n <span className=\"lockerverse-launcher__product-copy\">\n <strong className=\"lockerverse-launcher__product-name\">\n {product.name}\n </strong>\n {product.description ? <small>{product.description}</small> : null}\n {product.amountCents === null ? null : (\n <span className=\"lockerverse-launcher__product-price\">\n {formatProductPrice(product.amountCents, product.paymentOption)}\n </span>\n )}\n </span>\n <LauncherProductControl {...props} />\n </article>\n );\n}\n\nfunction LauncherDonationOption({\n customAmounts,\n product,\n setCustomAmounts,\n setRecurringProductId,\n}: LauncherProductControlProps) {\n const amount = customAmounts[product.id] ?? \"\";\n const amountCents = parseAmountCents(amount);\n const suggestions = suggestedDonationAmountsCents.filter(\n (suggestion) =>\n product.minimumAmountCents === null ||\n suggestion >= product.minimumAmountCents\n );\n const isSuggestedAmount = suggestions.includes(amountCents ?? 0);\n const setAmount = (value: string) => {\n setRecurringProductId(null);\n setCustomAmounts((current) => ({\n ...current,\n [product.id]: value,\n }));\n };\n\n return (\n <div className=\"lockerverse-launcher__donation-option\">\n <fieldset className=\"lockerverse-launcher__donation-choices\">\n <legend className=\"lockerverse-launcher__sr-only\">\n {product.name} amount\n </legend>\n <button\n aria-pressed={amount === \"\"}\n onClick={() => setAmount(\"\")}\n type=\"button\"\n >\n No thanks\n </button>\n {suggestions.map((suggestion) => (\n <button\n aria-pressed={amountCents === suggestion}\n key={suggestion}\n onClick={() => setAmount(String(suggestion / 100))}\n type=\"button\"\n >\n {usd.format(suggestion / 100).replace(\".00\", \"\")}\n </button>\n ))}\n <label\n className=\"lockerverse-launcher__donation-other\"\n data-selected={amount !== \"\" && !isSuggestedAmount ? true : undefined}\n >\n <input\n aria-label={`${product.name} amount`}\n min={(product.minimumAmountCents ?? 1) / 100}\n name={`amount-${product.slug}`}\n onChange={(event) => setAmount(event.target.value)}\n placeholder=\"Other $\"\n step=\"0.01\"\n type=\"number\"\n value={isSuggestedAmount ? \"\" : amount}\n />\n </label>\n </fieldset>\n </div>\n );\n}\n\ntype LauncherProductListProps = Omit<LauncherProductControlProps, \"product\"> & {\n products: LockerverseProduct[];\n variant?: LauncherProductOptionProps[\"variant\"];\n};\n\nfunction LauncherProductList({\n products,\n variant = \"default\",\n ...controlProps\n}: LauncherProductListProps) {\n return (\n <div className=\"lockerverse-launcher__product-list\">\n {products.map((product) =>\n variant === \"donation\" ? (\n <LauncherDonationOption\n {...controlProps}\n key={product.id}\n product={product}\n />\n ) : (\n <LauncherProductOption\n {...controlProps}\n key={product.id}\n product={product}\n variant={variant}\n />\n )\n )}\n </div>\n );\n}\n\nfunction getSelectionSummary(\n catalog: LockerverseCatalog,\n selection: LockerversePaymentSelectionItem[]\n) {\n let itemCount = 0;\n let amountCents = 0;\n for (const item of selection) {\n const product = catalog.products.find(\n (candidate) => candidate.slug === item.productSlug\n );\n if (!product) {\n continue;\n }\n if (\"quantity\" in item) {\n itemCount += item.quantity;\n amountCents += (product.amountCents ?? 0) * item.quantity;\n continue;\n }\n itemCount += 1;\n amountCents +=\n \"amountCents\" in item ? item.amountCents : (product.amountCents ?? 0);\n }\n return { amountCents, itemCount };\n}\n\nfunction LauncherLoading() {\n return (\n <div\n aria-label=\"Loading donation options\"\n className=\"lockerverse-launcher__loading\"\n role=\"status\"\n >\n {[0, 1, 2].map((item) => (\n <span\n aria-hidden=\"true\"\n className=\"lockerverse-launcher__loading-row\"\n key={item}\n />\n ))}\n </div>\n );\n}\n\nfunction createLauncherSelection(\n catalog: LockerverseCatalog,\n quantities: Record<string, number>,\n customAmounts: Record<string, string>,\n recurringProductId: string | null\n): LockerversePaymentSelectionItem[] {\n if (recurringProductId) {\n const product = catalog.products.find(\n (candidate) =>\n candidate.id === recurringProductId &&\n candidate.paymentOption !== \"one-time\"\n );\n return product ? [{ productSlug: product.slug }] : [];\n }\n\n return catalog.products.flatMap(\n (product): LockerversePaymentSelectionItem[] => {\n const quantity = quantities[product.id] ?? 0;\n if (\n product.pricingMode === \"fixed\" &&\n product.paymentOption === \"one-time\" &&\n quantity > 0\n ) {\n return [{ productSlug: product.slug, quantity }];\n }\n const amountCents = parseAmountCents(customAmounts[product.id] ?? \"\");\n if (\n product.pricingMode === \"custom\" &&\n product.paymentOption === \"one-time\" &&\n amountCents !== null &&\n (product.minimumAmountCents === null ||\n amountCents >= product.minimumAmountCents)\n ) {\n return [{ amountCents, productSlug: product.slug }];\n }\n return [];\n }\n );\n}\n\ntype LauncherSelectionStateProps = Omit<LauncherProductControlProps, \"product\">;\n\ntype LauncherCatalogProps = LauncherSelectionStateProps & {\n catalog: LockerverseCatalog;\n onContinue: (selection: LockerversePaymentSelectionItem[]) => void;\n};\n\nfunction LauncherCatalog({\n catalog,\n onContinue,\n ...selectionState\n}: LauncherCatalogProps) {\n const draftSelection = createLauncherSelection(\n catalog,\n selectionState.quantities,\n selectionState.customAmounts,\n selectionState.recurringProductId\n );\n const summary = getSelectionSummary(catalog, draftSelection);\n const donationProducts = catalog.products.filter(\n (product) =>\n product.paymentOption === \"one-time\" && product.pricingMode === \"custom\"\n );\n const orderProducts = catalog.products.filter(\n (product) => !donationProducts.includes(product)\n );\n\n return (\n <form\n className=\"lockerverse-launcher__products\"\n onSubmit={(event) => {\n event.preventDefault();\n if (draftSelection.length > 0) {\n onContinue(draftSelection);\n }\n }}\n >\n {orderProducts.length > 0 ? (\n <section className=\"lockerverse-launcher__section\">\n <LauncherProductList {...selectionState} products={orderProducts} />\n </section>\n ) : null}\n {donationProducts.length > 0 ? (\n <section className=\"lockerverse-launcher__donation\">\n <header className=\"lockerverse-launcher__section-header\">\n <h3>Add a donation</h3>\n <p>Choose an amount to add to this order.</p>\n </header>\n <LauncherProductList\n {...selectionState}\n products={donationProducts}\n variant=\"donation\"\n />\n </section>\n ) : null}\n {catalog.products.length > 0 ? (\n <footer className=\"lockerverse-launcher__footer\">\n <p aria-live=\"polite\" className=\"lockerverse-launcher__summary\">\n <span>\n {summary.itemCount === 0\n ? \"No items selected\"\n : `${summary.itemCount} ${summary.itemCount === 1 ? \"item\" : \"items\"} selected`}\n </span>\n {summary.itemCount === 0 ? null : (\n <strong>{usd.format(summary.amountCents / 100)}</strong>\n )}\n </p>\n <button\n className=\"lockerverse-launcher__continue\"\n disabled={draftSelection.length === 0}\n type=\"submit\"\n >\n Continue\n </button>\n </footer>\n ) : null}\n </form>\n );\n}\n\ntype LauncherPaymentProps = Omit<\n LockerverseDonateLauncherProps,\n \"buttonLabel\" | \"position\"\n>;\n\ntype LauncherCheckoutProps = {\n onEdit: () => void;\n paymentProps: LauncherPaymentProps;\n selection: LockerversePaymentSelectionItem[];\n style: LockerversePaymentStyle;\n};\n\nfunction LauncherCheckout({\n onEdit,\n paymentProps,\n selection,\n style,\n}: LauncherCheckoutProps) {\n return (\n <div className=\"lockerverse-launcher__checkout\">\n <header className=\"lockerverse-launcher__checkout-toolbar\">\n <button\n className=\"lockerverse-launcher__back\"\n onClick={onEdit}\n type=\"button\"\n >\n Edit order\n </button>\n </header>\n <LockerversePayment\n {...paymentProps}\n selection={selection}\n style={style}\n />\n </div>\n );\n}\n\nfunction LauncherDialogHeading({\n catalog,\n checkout,\n}: {\n catalog: LockerverseCatalog | null;\n checkout: boolean;\n}) {\n if (checkout) {\n return (\n <>\n <Dialog.Title className=\"lockerverse-launcher__sr-only\">\n Checkout\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__sr-only\">\n Review the order and complete payment.\n </Dialog.Description>\n </>\n );\n }\n\n if (!catalog) {\n return (\n <header className=\"lockerverse-launcher__header\">\n <Dialog.Title className=\"lockerverse-launcher__title\">\n Donate\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__description\">\n Choose your options, then continue to checkout.\n </Dialog.Description>\n </header>\n );\n }\n\n return (\n <header className=\"lockerverse-launcher__header\">\n {catalog.community ? (\n <div className=\"lockerverse-launcher__brand\">\n {catalog.community.imageUrl ? (\n <img\n alt={`${catalog.community.name} logo`}\n height=\"28\"\n src={catalog.community.imageUrl}\n width=\"28\"\n />\n ) : null}\n <span>{catalog.community.name}</span>\n </div>\n ) : null}\n <Dialog.Title className=\"lockerverse-launcher__title\">\n {catalog.widget.title ?? catalog.widget.name}\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__description\">\n {catalog.widget.description ??\n \"Choose your options, then continue to checkout.\"}\n </Dialog.Description>\n </header>\n );\n}\n\ntype LauncherCatalogIdentity = {\n apiBaseUrl: LockerverseDonateLauncherProps[\"apiBaseUrl\"] | undefined;\n communitySlug: LockerverseDonateLauncherProps[\"communitySlug\"];\n environment: LockerverseDonateLauncherProps[\"environment\"] | undefined;\n fetch: LockerverseDonateLauncherProps[\"fetch\"] | undefined;\n widgetSlug: LockerverseDonateLauncherProps[\"widgetSlug\"];\n};\n\nfunction hasSameCatalogIdentity(\n previous: LauncherCatalogIdentity,\n next: LauncherCatalogIdentity\n) {\n return (\n previous.apiBaseUrl === next.apiBaseUrl &&\n previous.communitySlug === next.communitySlug &&\n previous.environment === next.environment &&\n previous.fetch === next.fetch &&\n previous.widgetSlug === next.widgetSlug\n );\n}\n\ntype DonateLauncherIdentityScopeProps = {\n buttonLabel: string;\n onOpenChange: (open: boolean) => void;\n open: boolean;\n paymentProps: Omit<\n LockerverseDonateLauncherProps,\n \"buttonLabel\" | \"position\"\n >;\n position: NonNullable<LockerverseDonateLauncherProps[\"position\"]>;\n};\n\nfunction DonateLauncherIdentityScope({\n buttonLabel,\n onOpenChange,\n open,\n paymentProps,\n position,\n}: DonateLauncherIdentityScopeProps) {\n const [catalog, setCatalog] = useState<LockerverseCatalog | null>(null);\n const [selection, setSelection] = useState<\n LockerversePaymentSelectionItem[] | null\n >(null);\n const [customAmounts, setCustomAmounts] = useState<Record<string, string>>(\n {}\n );\n const [quantities, setQuantities] = useState<Record<string, number>>({});\n const [recurringProductId, setRecurringProductId] = useState<string | null>(\n null\n );\n const [loadError, setLoadError] = useState(false);\n const [loadRevision, setLoadRevision] = useState(0);\n const {\n apiBaseUrl,\n communitySlug,\n environment,\n fetch,\n onError,\n requestTimeoutMs,\n sentryDsn,\n widgetSlug,\n } = paymentProps;\n const launcherStyle: LockerversePaymentStyle = {\n ...(catalog?.community\n ? { \"--lockerverse-accent\": catalog.community.accentColor }\n : {}),\n ...paymentProps.style,\n };\n\n useEffect(() => {\n if (!(open && catalog === null)) {\n return;\n }\n let active = true;\n const client = createLockerverseCheckoutClient(paymentProps);\n client\n .load()\n .then((nextCatalog) => {\n if (active) {\n setCatalog(nextCatalog);\n setLoadError(false);\n }\n })\n .catch(() => {\n if (active) {\n setLoadError(true);\n }\n });\n return () => {\n active = false;\n };\n }, [\n apiBaseUrl,\n catalog,\n communitySlug,\n environment,\n fetch,\n loadRevision,\n onError,\n open,\n requestTimeoutMs,\n sentryDsn,\n widgetSlug,\n ]);\n\n let content: ReactNode = <LauncherLoading />;\n if (loadError) {\n content = (\n <div role=\"alert\">\n <p>Unable to load donation options.</p>\n <button\n onClick={() => {\n setLoadError(false);\n setLoadRevision((revision) => revision + 1);\n }}\n type=\"button\"\n >\n Retry\n </button>\n </div>\n );\n }\n if (catalog) {\n content = (\n <LauncherCatalog\n catalog={catalog}\n customAmounts={customAmounts}\n onContinue={setSelection}\n quantities={quantities}\n recurringProductId={recurringProductId}\n setCustomAmounts={setCustomAmounts}\n setQuantities={setQuantities}\n setRecurringProductId={setRecurringProductId}\n />\n );\n }\n if (selection) {\n content = (\n <LauncherCheckout\n onEdit={() => setSelection(null)}\n paymentProps={paymentProps}\n selection={selection}\n style={launcherStyle}\n />\n );\n }\n\n return (\n <Dialog.Root onOpenChange={onOpenChange} open={open}>\n <Dialog.Trigger\n className={`lockerverse-launcher lockerverse-launcher--${position}`}\n data-lockerverse-theme={paymentProps.theme ?? \"dark\"}\n style={launcherStyle}\n >\n {buttonLabel}\n </Dialog.Trigger>\n <Dialog.Portal>\n <Dialog.Backdrop className=\"lockerverse-launcher__backdrop\" />\n <Dialog.Viewport className=\"lockerverse-launcher__viewport\">\n <Dialog.Popup\n className=\"lockerverse-launcher__dialog\"\n data-lockerverse-theme={paymentProps.theme ?? \"dark\"}\n style={launcherStyle}\n >\n <LauncherDialogHeading\n catalog={catalog}\n checkout={selection !== null}\n />\n <Dialog.Close\n aria-label=\"Close donation dialog\"\n className=\"lockerverse-launcher__close\"\n >\n <span aria-hidden=\"true\">×</span>\n </Dialog.Close>\n {content}\n </Dialog.Popup>\n </Dialog.Viewport>\n </Dialog.Portal>\n </Dialog.Root>\n );\n}\n\nexport function LockerverseDonateLauncher({\n buttonLabel = \"Donate\",\n position = \"inline\",\n ...paymentProps\n}: LockerverseDonateLauncherProps) {\n const [open, setOpen] = useState(false);\n const catalogIdentity: LauncherCatalogIdentity = {\n apiBaseUrl: paymentProps.apiBaseUrl,\n communitySlug: paymentProps.communitySlug,\n environment: paymentProps.environment,\n fetch: paymentProps.fetch,\n widgetSlug: paymentProps.widgetSlug,\n };\n const previousCatalogIdentity = useRef(catalogIdentity);\n const identityRevision = useRef(0);\n if (\n !hasSameCatalogIdentity(previousCatalogIdentity.current, catalogIdentity)\n ) {\n previousCatalogIdentity.current = catalogIdentity;\n identityRevision.current += 1;\n }\n\n return (\n <DonateLauncherIdentityScope\n buttonLabel={buttonLabel}\n key={identityRevision.current}\n onOpenChange={setOpen}\n open={open}\n paymentProps={paymentProps}\n position={position}\n />\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"lockerverse-donate-launcher.js","names":[],"sources":["../src/lockerverse-donate-launcher.tsx"],"sourcesContent":["import { Dialog } from \"@base-ui/react/dialog\";\nimport type {\n LockerverseCatalog,\n LockerverseProduct,\n} from \"@lockerverse/sdk/checkout\";\nimport {\n type Dispatch,\n type ReactNode,\n type SetStateAction,\n useState,\n} from \"react\";\nimport { LockerversePayment } from \"./lockerverse-payment.tsx\";\nimport type {\n LockerverseDonateLauncherProps,\n LockerversePaymentProps,\n LockerversePaymentSelectionItem,\n LockerversePaymentStyle,\n} from \"./types.ts\";\nimport type { UseLockerverseWidgetResult } from \"./use-lockerverse-widget.ts\";\n\nconst usd = new Intl.NumberFormat(\"en-US\", {\n currency: \"USD\",\n style: \"currency\",\n});\nconst decimalAmountPattern = /^(?:0|[1-9]\\d*)(?:\\.\\d{1,2})?$/;\nconst suggestedDonationAmountsCents = [1000, 2500, 5000, 10_000];\n\nfunction parseAmountCents(value: string) {\n if (!decimalAmountPattern.test(value)) {\n return null;\n }\n const amountCents = Math.round(Number(value) * 100);\n return Number.isSafeInteger(amountCents) && amountCents > 0\n ? amountCents\n : null;\n}\n\nfunction formatProductPrice(\n amountCents: number,\n paymentOption: \"one-time\" | \"monthly\" | \"annually\"\n) {\n let cadence = \"\";\n if (paymentOption === \"monthly\") {\n cadence = \"/month\";\n }\n if (paymentOption === \"annually\") {\n cadence = \"/year\";\n }\n return `${usd.format(amountCents / 100)}${cadence}`;\n}\n\ntype LauncherProductControlProps = {\n customAmounts: Record<string, string>;\n product: LockerverseProduct;\n quantities: Record<string, number>;\n recurringProductId: string | null;\n setCustomAmounts: Dispatch<SetStateAction<Record<string, string>>>;\n setQuantities: Dispatch<SetStateAction<Record<string, number>>>;\n setRecurringProductId: Dispatch<SetStateAction<string | null>>;\n};\n\nfunction LauncherProductControl({\n customAmounts,\n product,\n quantities,\n recurringProductId,\n setCustomAmounts,\n setQuantities,\n setRecurringProductId,\n}: LauncherProductControlProps) {\n const quantity = quantities[product.id] ?? 0;\n if (product.pricingMode === \"fixed\" && product.paymentOption === \"one-time\") {\n const maximum = Math.min(\n product.maximumQuantity ?? Number.POSITIVE_INFINITY,\n product.inventoryQuantity ?? Number.POSITIVE_INFINITY\n );\n return (\n <span className=\"lockerverse-launcher__quantity\">\n <button\n aria-label={`Decrease ${product.name} quantity`}\n disabled={quantity === 0}\n onClick={() => {\n setRecurringProductId(null);\n setQuantities((current) => {\n const currentQuantity = current[product.id] ?? 0;\n const minimum = product.minimumQuantity ?? 1;\n return {\n ...current,\n [product.id]:\n currentQuantity <= minimum ? 0 : currentQuantity - 1,\n };\n });\n }}\n type=\"button\"\n >\n −\n </button>\n <output aria-label={`${product.name} quantity`}>{quantity}</output>\n <button\n aria-label={`Increase ${product.name} quantity`}\n disabled={quantity >= maximum}\n onClick={() => {\n setRecurringProductId(null);\n setQuantities((current) => {\n const currentQuantity = current[product.id] ?? 0;\n return {\n ...current,\n [product.id]:\n currentQuantity === 0\n ? (product.minimumQuantity ?? 1)\n : currentQuantity + 1,\n };\n });\n }}\n type=\"button\"\n >\n +\n </button>\n </span>\n );\n }\n\n if (\n product.pricingMode === \"custom\" &&\n product.paymentOption === \"one-time\"\n ) {\n return (\n <span className=\"lockerverse-launcher__custom-amount\">\n <span aria-hidden=\"true\">$</span>\n <input\n aria-label={`${product.name} amount`}\n min={(product.minimumAmountCents ?? 1) / 100}\n name={`amount-${product.slug}`}\n onChange={(event) => {\n setRecurringProductId(null);\n setCustomAmounts((current) => ({\n ...current,\n [product.id]: event.target.value,\n }));\n }}\n placeholder=\"0.00\"\n step=\"0.01\"\n type=\"number\"\n value={customAmounts[product.id] ?? \"\"}\n />\n {product.minimumAmountCents === null ? null : (\n <small>Minimum {usd.format(product.minimumAmountCents / 100)}</small>\n )}\n </span>\n );\n }\n\n return (\n <button\n aria-label={`Select ${product.name}`}\n aria-pressed={recurringProductId === product.id}\n className=\"lockerverse-launcher__select\"\n onClick={() => {\n setQuantities({});\n setCustomAmounts({});\n setRecurringProductId((current) =>\n current === product.id ? null : product.id\n );\n }}\n type=\"button\"\n >\n Select\n </button>\n );\n}\n\ntype LauncherProductOptionProps = LauncherProductControlProps & {\n variant?: \"default\" | \"donation\";\n};\n\nfunction LauncherProductOption({\n variant = \"default\",\n ...props\n}: LauncherProductOptionProps) {\n const { customAmounts, product, quantities, recurringProductId } = props;\n const customAmount = parseAmountCents(customAmounts[product.id] ?? \"\");\n const isSelected =\n recurringProductId === product.id ||\n (product.paymentOption === \"one-time\" &&\n ((product.pricingMode === \"fixed\" && (quantities[product.id] ?? 0) > 0) ||\n (product.pricingMode === \"custom\" &&\n customAmount !== null &&\n (product.minimumAmountCents === null ||\n customAmount >= product.minimumAmountCents))));\n return (\n <article\n className={`lockerverse-launcher__product lockerverse-launcher__product--${variant}`}\n data-selected={isSelected || undefined}\n >\n <span className=\"lockerverse-launcher__product-copy\">\n <strong className=\"lockerverse-launcher__product-name\">\n {product.name}\n </strong>\n {product.description ? <small>{product.description}</small> : null}\n {product.amountCents === null ? null : (\n <span className=\"lockerverse-launcher__product-price\">\n {formatProductPrice(product.amountCents, product.paymentOption)}\n </span>\n )}\n </span>\n <LauncherProductControl {...props} />\n </article>\n );\n}\n\nfunction LauncherDonationOption({\n customAmounts,\n product,\n setCustomAmounts,\n setRecurringProductId,\n}: LauncherProductControlProps) {\n const amount = customAmounts[product.id] ?? \"\";\n const amountCents = parseAmountCents(amount);\n const suggestions = suggestedDonationAmountsCents.filter(\n (suggestion) =>\n product.minimumAmountCents === null ||\n suggestion >= product.minimumAmountCents\n );\n const isSuggestedAmount = suggestions.includes(amountCents ?? 0);\n const setAmount = (value: string) => {\n setRecurringProductId(null);\n setCustomAmounts((current) => ({\n ...current,\n [product.id]: value,\n }));\n };\n\n return (\n <div className=\"lockerverse-launcher__donation-option\">\n <fieldset className=\"lockerverse-launcher__donation-choices\">\n <legend className=\"lockerverse-launcher__sr-only\">\n {product.name} amount\n </legend>\n <button\n aria-pressed={amount === \"\"}\n onClick={() => setAmount(\"\")}\n type=\"button\"\n >\n No thanks\n </button>\n {suggestions.map((suggestion) => (\n <button\n aria-pressed={amountCents === suggestion}\n key={suggestion}\n onClick={() => setAmount(String(suggestion / 100))}\n type=\"button\"\n >\n {usd.format(suggestion / 100).replace(\".00\", \"\")}\n </button>\n ))}\n <label\n className=\"lockerverse-launcher__donation-other\"\n data-selected={amount !== \"\" && !isSuggestedAmount ? true : undefined}\n >\n <input\n aria-label={`${product.name} amount`}\n min={(product.minimumAmountCents ?? 1) / 100}\n name={`amount-${product.slug}`}\n onChange={(event) => setAmount(event.target.value)}\n placeholder=\"Other $\"\n step=\"0.01\"\n type=\"number\"\n value={isSuggestedAmount ? \"\" : amount}\n />\n </label>\n </fieldset>\n </div>\n );\n}\n\ntype LauncherProductListProps = Omit<LauncherProductControlProps, \"product\"> & {\n products: LockerverseProduct[];\n variant?: LauncherProductOptionProps[\"variant\"];\n};\n\nfunction LauncherProductList({\n products,\n variant = \"default\",\n ...controlProps\n}: LauncherProductListProps) {\n return (\n <div className=\"lockerverse-launcher__product-list\">\n {products.map((product) =>\n variant === \"donation\" ? (\n <LauncherDonationOption\n {...controlProps}\n key={product.id}\n product={product}\n />\n ) : (\n <LauncherProductOption\n {...controlProps}\n key={product.id}\n product={product}\n variant={variant}\n />\n )\n )}\n </div>\n );\n}\n\nfunction getSelectionSummary(\n catalog: LockerverseCatalog,\n selection: LockerversePaymentSelectionItem[]\n) {\n let itemCount = 0;\n let amountCents = 0;\n for (const item of selection) {\n const product = catalog.products.find(\n (candidate) => candidate.slug === item.productSlug\n );\n if (!product) {\n continue;\n }\n if (\"quantity\" in item) {\n itemCount += item.quantity;\n amountCents += (product.amountCents ?? 0) * item.quantity;\n continue;\n }\n itemCount += 1;\n amountCents +=\n \"amountCents\" in item ? item.amountCents : (product.amountCents ?? 0);\n }\n return { amountCents, itemCount };\n}\n\nfunction LauncherLoading() {\n return (\n <div\n aria-label=\"Loading donation options\"\n className=\"lockerverse-launcher__loading\"\n role=\"status\"\n >\n {[0, 1, 2].map((item) => (\n <span\n aria-hidden=\"true\"\n className=\"lockerverse-launcher__loading-row\"\n key={item}\n />\n ))}\n </div>\n );\n}\n\nfunction createLauncherSelection(\n catalog: LockerverseCatalog,\n quantities: Record<string, number>,\n customAmounts: Record<string, string>,\n recurringProductId: string | null\n): LockerversePaymentSelectionItem[] {\n if (recurringProductId) {\n const product = catalog.products.find(\n (candidate) =>\n candidate.id === recurringProductId &&\n candidate.paymentOption !== \"one-time\"\n );\n return product ? [{ productSlug: product.slug }] : [];\n }\n\n return catalog.products.flatMap(\n (product): LockerversePaymentSelectionItem[] => {\n const quantity = quantities[product.id] ?? 0;\n if (\n product.pricingMode === \"fixed\" &&\n product.paymentOption === \"one-time\" &&\n quantity > 0\n ) {\n return [{ productSlug: product.slug, quantity }];\n }\n const amountCents = parseAmountCents(customAmounts[product.id] ?? \"\");\n if (\n product.pricingMode === \"custom\" &&\n product.paymentOption === \"one-time\" &&\n amountCents !== null &&\n (product.minimumAmountCents === null ||\n amountCents >= product.minimumAmountCents)\n ) {\n return [{ amountCents, productSlug: product.slug }];\n }\n return [];\n }\n );\n}\n\ntype LauncherSelectionStateProps = Omit<LauncherProductControlProps, \"product\">;\n\ntype LauncherCatalogProps = LauncherSelectionStateProps & {\n catalog: LockerverseCatalog;\n onContinue: (selection: LockerversePaymentSelectionItem[]) => void;\n};\n\nfunction LauncherCatalog({\n catalog,\n onContinue,\n ...selectionState\n}: LauncherCatalogProps) {\n const draftSelection = createLauncherSelection(\n catalog,\n selectionState.quantities,\n selectionState.customAmounts,\n selectionState.recurringProductId\n );\n const summary = getSelectionSummary(catalog, draftSelection);\n const donationProducts = catalog.products.filter(\n (product) =>\n product.paymentOption === \"one-time\" && product.pricingMode === \"custom\"\n );\n const orderProducts = catalog.products.filter(\n (product) => !donationProducts.includes(product)\n );\n\n return (\n <form\n className=\"lockerverse-launcher__products\"\n onSubmit={(event) => {\n event.preventDefault();\n if (draftSelection.length > 0) {\n onContinue(draftSelection);\n }\n }}\n >\n {orderProducts.length > 0 ? (\n <section className=\"lockerverse-launcher__section\">\n <LauncherProductList {...selectionState} products={orderProducts} />\n </section>\n ) : null}\n {donationProducts.length > 0 ? (\n <section className=\"lockerverse-launcher__donation\">\n <header className=\"lockerverse-launcher__section-header\">\n <h3>Add a donation</h3>\n <p>Choose an amount to add to this order.</p>\n </header>\n <LauncherProductList\n {...selectionState}\n products={donationProducts}\n variant=\"donation\"\n />\n </section>\n ) : null}\n {catalog.products.length > 0 ? (\n <footer className=\"lockerverse-launcher__footer\">\n <p aria-live=\"polite\" className=\"lockerverse-launcher__summary\">\n <span>\n {summary.itemCount === 0\n ? \"No items selected\"\n : `${summary.itemCount} ${summary.itemCount === 1 ? \"item\" : \"items\"} selected`}\n </span>\n {summary.itemCount === 0 ? null : (\n <strong>{usd.format(summary.amountCents / 100)}</strong>\n )}\n </p>\n <button\n className=\"lockerverse-launcher__continue\"\n disabled={draftSelection.length === 0}\n type=\"submit\"\n >\n Continue\n </button>\n </footer>\n ) : null}\n </form>\n );\n}\n\ntype LauncherPaymentProps = Omit<\n LockerversePaymentProps,\n \"selection\" | \"widget\"\n>;\n\ntype LauncherCheckoutProps = {\n onEdit: () => void;\n paymentProps: LauncherPaymentProps;\n selection: LockerversePaymentSelectionItem[];\n style: LockerversePaymentStyle;\n widget: UseLockerverseWidgetResult;\n};\n\nfunction LauncherCheckout({\n onEdit,\n paymentProps,\n selection,\n style,\n widget,\n}: LauncherCheckoutProps) {\n return (\n <div className=\"lockerverse-launcher__checkout\">\n <header className=\"lockerverse-launcher__checkout-toolbar\">\n <button\n className=\"lockerverse-launcher__back\"\n onClick={onEdit}\n type=\"button\"\n >\n Edit order\n </button>\n </header>\n <LockerversePayment\n {...paymentProps}\n selection={selection}\n style={style}\n widget={widget}\n />\n </div>\n );\n}\n\nfunction LauncherDialogHeading({\n catalog,\n checkout,\n}: {\n catalog: LockerverseCatalog | null;\n checkout: boolean;\n}) {\n if (checkout) {\n return (\n <>\n <Dialog.Title className=\"lockerverse-launcher__sr-only\">\n Checkout\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__sr-only\">\n Review the order and complete payment.\n </Dialog.Description>\n </>\n );\n }\n\n if (!catalog) {\n return (\n <header className=\"lockerverse-launcher__header\">\n <Dialog.Title className=\"lockerverse-launcher__title\">\n Donate\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__description\">\n Choose your options, then continue to checkout.\n </Dialog.Description>\n </header>\n );\n }\n\n return (\n <header className=\"lockerverse-launcher__header\">\n {catalog.community ? (\n <div className=\"lockerverse-launcher__brand\">\n {catalog.community.imageUrl ? (\n <img\n alt={`${catalog.community.name} logo`}\n height=\"28\"\n src={catalog.community.imageUrl}\n width=\"28\"\n />\n ) : null}\n <span>{catalog.community.name}</span>\n </div>\n ) : null}\n <Dialog.Title className=\"lockerverse-launcher__title\">\n {catalog.widget.title ?? catalog.widget.name}\n </Dialog.Title>\n <Dialog.Description className=\"lockerverse-launcher__description\">\n {catalog.widget.description ??\n \"Choose your options, then continue to checkout.\"}\n </Dialog.Description>\n </header>\n );\n}\n\nexport function LockerverseDonateLauncher({\n buttonLabel = \"Donate\",\n position = \"inline\",\n widget,\n ...paymentProps\n}: LockerverseDonateLauncherProps) {\n const [selection, setSelection] = useState<\n LockerversePaymentSelectionItem[] | null\n >(null);\n const [customAmounts, setCustomAmounts] = useState<Record<string, string>>(\n {}\n );\n const [quantities, setQuantities] = useState<Record<string, number>>({});\n const [recurringProductId, setRecurringProductId] = useState<string | null>(\n null\n );\n const { catalog, error, loading } = widget;\n const launcherStyle: LockerversePaymentStyle = {\n ...(catalog?.community\n ? { \"--lockerverse-accent\": catalog.community.accentColor }\n : {}),\n ...paymentProps.style,\n };\n\n let content: ReactNode;\n if (loading) {\n content = <LauncherLoading />;\n } else if (error) {\n content = (\n <div role=\"alert\">\n <p>Unable to load donation options.</p>\n <button onClick={widget.refresh} type=\"button\">\n Retry\n </button>\n </div>\n );\n } else if (catalog) {\n content = (\n <LauncherCatalog\n catalog={catalog}\n customAmounts={customAmounts}\n onContinue={setSelection}\n quantities={quantities}\n recurringProductId={recurringProductId}\n setCustomAmounts={setCustomAmounts}\n setQuantities={setQuantities}\n setRecurringProductId={setRecurringProductId}\n />\n );\n } else {\n content = <LauncherLoading />;\n }\n if (!(loading || error) && selection && catalog) {\n content = (\n <LauncherCheckout\n onEdit={() => setSelection(null)}\n paymentProps={paymentProps}\n selection={selection}\n style={launcherStyle}\n widget={widget}\n />\n );\n }\n\n return (\n <Dialog.Root>\n <Dialog.Trigger\n className={`lockerverse-launcher lockerverse-launcher--${position}`}\n data-lockerverse-theme={paymentProps.theme ?? \"dark\"}\n style={launcherStyle}\n >\n {buttonLabel}\n </Dialog.Trigger>\n <Dialog.Portal>\n <Dialog.Backdrop className=\"lockerverse-launcher__backdrop\" />\n <Dialog.Viewport className=\"lockerverse-launcher__viewport\">\n <Dialog.Popup\n className=\"lockerverse-launcher__dialog\"\n data-lockerverse-theme={paymentProps.theme ?? \"dark\"}\n style={launcherStyle}\n >\n <LauncherDialogHeading\n catalog={catalog}\n checkout={selection !== null}\n />\n <Dialog.Close\n aria-label=\"Close donation dialog\"\n className=\"lockerverse-launcher__close\"\n >\n <span aria-hidden=\"true\">×</span>\n </Dialog.Close>\n {content}\n </Dialog.Popup>\n </Dialog.Viewport>\n </Dialog.Portal>\n </Dialog.Root>\n );\n}\n"],"mappings":"gNAoBA,MAAM,EAAM,IAAI,KAAK,aAAa,QAAS,CACzC,SAAU,MACV,MAAO,UACT,CAAC,EACK,EAAuB,iCACvB,EAAgC,CAAC,IAAM,KAAM,IAAM,GAAM,EAE/D,SAAS,EAAiB,EAAe,CACvC,GAAI,CAAC,EAAqB,KAAK,CAAK,EAClC,OAAO,KAET,IAAM,EAAc,KAAK,MAAM,OAAO,CAAK,EAAI,GAAG,EAClD,OAAO,OAAO,cAAc,CAAW,GAAK,EAAc,EACtD,EACA,IACN,CAEA,SAAS,EACP,EACA,EACA,CACA,IAAI,EAAU,GAOd,OANI,IAAkB,YACpB,EAAU,UAER,IAAkB,aACpB,EAAU,SAEL,GAAG,EAAI,OAAO,EAAc,GAAG,IAAI,GAC5C,CAYA,SAAS,EAAuB,CAC9B,gBACA,UACA,aACA,qBACA,mBACA,gBACA,yBAC8B,CAC9B,IAAM,EAAW,EAAW,EAAQ,KAAO,EAC3C,GAAI,EAAQ,cAAgB,SAAW,EAAQ,gBAAkB,WAAY,CAC3E,IAAM,EAAU,KAAK,IACnB,EAAQ,iBAAmB,IAC3B,EAAQ,mBAAqB,GAC/B,EACA,OACE,EAAC,OAAD,CAAM,UAAU,iCAAhB,SAAA,CACE,EAAC,SAAD,CACE,aAAY,YAAY,EAAQ,KAAK,WACrC,SAAU,IAAa,EACvB,YAAe,CACb,EAAsB,IAAI,EAC1B,EAAe,GAAY,CACzB,IAAM,EAAkB,EAAQ,EAAQ,KAAO,EACzC,EAAU,EAAQ,iBAAmB,EAC3C,MAAO,CACL,GAAG,GACF,EAAQ,IACP,GAAmB,EAAU,EAAI,EAAkB,CACvD,CACF,CAAC,CACH,EACA,KAAK,SACN,SAAA,GAEO,CAAA,EACR,EAAC,SAAD,CAAQ,aAAY,GAAG,EAAQ,KAAK,WAAa,SAAA,CAAiB,CAAA,EAClE,EAAC,SAAD,CACE,aAAY,YAAY,EAAQ,KAAK,WACrC,SAAU,GAAY,EACtB,YAAe,CACb,EAAsB,IAAI,EAC1B,EAAe,GAAY,CACzB,IAAM,EAAkB,EAAQ,EAAQ,KAAO,EAC/C,MAAO,CACL,GAAG,GACF,EAAQ,IACP,IAAoB,EACf,EAAQ,iBAAmB,EAC5B,EAAkB,CAC1B,CACF,CAAC,CACH,EACA,KAAK,SACN,SAAA,GAEO,CAAA,CACJ,GAEV,CAgCA,OA7BE,EAAQ,cAAgB,UACxB,EAAQ,gBAAkB,WAGxB,EAAC,OAAD,CAAM,UAAU,sCAAhB,SAAA,CACE,EAAC,OAAD,CAAM,cAAY,OAAO,SAAA,GAAO,CAAA,EAChC,EAAC,QAAD,CACE,aAAY,GAAG,EAAQ,KAAK,SAC5B,KAAM,EAAQ,oBAAsB,GAAK,IACzC,KAAM,UAAU,EAAQ,OACxB,SAAW,GAAU,CACnB,EAAsB,IAAI,EAC1B,EAAkB,IAAa,CAC7B,GAAG,GACF,EAAQ,IAAK,EAAM,OAAO,KAC7B,EAAE,CACJ,EACA,YAAY,OACZ,KAAK,OACL,KAAK,SACL,MAAO,EAAc,EAAQ,KAAO,EACrC,CAAA,EACA,EAAQ,qBAAuB,KAAO,KACrC,EAAC,QAAD,CAAA,SAAA,CAAO,WAAS,EAAI,OAAO,EAAQ,mBAAqB,GAAG,CAAS,CAAA,CAAA,CAElE,IAKR,EAAC,SAAD,CACE,aAAY,UAAU,EAAQ,OAC9B,eAAc,IAAuB,EAAQ,GAC7C,UAAU,+BACV,YAAe,CACb,EAAc,CAAC,CAAC,EAChB,EAAiB,CAAC,CAAC,EACnB,EAAuB,GACrB,IAAY,EAAQ,GAAK,KAAO,EAAQ,EAC1C,CACF,EACA,KAAK,SACN,SAAA,QAEO,CAAA,CAEZ,CAMA,SAAS,EAAsB,CAC7B,UAAU,UACV,GAAG,GAC0B,CAC7B,GAAM,CAAE,gBAAe,UAAS,aAAY,sBAAuB,EAC7D,EAAe,EAAiB,EAAc,EAAQ,KAAO,EAAE,EAC/D,EACJ,IAAuB,EAAQ,IAC9B,EAAQ,gBAAkB,aACvB,EAAQ,cAAgB,UAAY,EAAW,EAAQ,KAAO,GAAK,GAClE,EAAQ,cAAgB,UACvB,IAAiB,OAChB,EAAQ,qBAAuB,MAC9B,GAAgB,EAAQ,qBAClC,OACE,EAAC,UAAD,CACE,UAAW,gEAAgE,IAC3E,gBAAe,GAAc,IAAA,GAF/B,SAAA,CAIE,EAAC,OAAD,CAAM,UAAU,qCAAhB,SAAA,CACE,EAAC,SAAD,CAAQ,UAAU,qCACf,SAAA,EAAQ,IACH,CAAA,EACP,EAAQ,YAAc,EAAC,QAAD,CAAA,SAAQ,EAAQ,WAAmB,CAAA,EAAI,KAC7D,EAAQ,cAAgB,KAAO,KAC9B,EAAC,OAAD,CAAM,UAAU,sCACb,SAAA,EAAmB,EAAQ,YAAa,EAAQ,aAAa,CAC1D,CAAA,CAEJ,CACN,CAAA,EAAA,EAAC,EAAD,CAAwB,GAAI,CAAQ,CAAA,CAC7B,GAEb,CAEA,SAAS,EAAuB,CAC9B,gBACA,UACA,mBACA,yBAC8B,CAC9B,IAAM,EAAS,EAAc,EAAQ,KAAO,GACtC,EAAc,EAAiB,CAAM,EACrC,EAAc,EAA8B,OAC/C,GACC,EAAQ,qBAAuB,MAC/B,GAAc,EAAQ,kBAC1B,EACM,EAAoB,EAAY,SAAS,GAAe,CAAC,EACzD,EAAa,GAAkB,CACnC,EAAsB,IAAI,EAC1B,EAAkB,IAAa,CAC7B,GAAG,GACF,EAAQ,IAAK,CAChB,EAAE,CACJ,EAEA,OACE,EAAC,MAAD,CAAK,UAAU,wCACb,SAAA,EAAC,WAAD,CAAU,UAAU,yCAApB,SAAA,CACE,EAAC,SAAD,CAAQ,UAAU,gCAAlB,SAAA,CACG,EAAQ,KAAK,SACR,IACR,EAAC,SAAD,CACE,eAAc,IAAW,GACzB,YAAe,EAAU,EAAE,EAC3B,KAAK,SACN,SAAA,WAEO,CAAA,EACP,EAAY,IAAK,GAChB,EAAC,SAAD,CACE,eAAc,IAAgB,EAE9B,YAAe,EAAU,OAAO,EAAa,GAAG,CAAC,EACjD,KAAK,SAEJ,SAAA,EAAI,OAAO,EAAa,GAAG,CAAC,CAAC,QAAQ,MAAO,EAAE,CACzC,EALD,CAKC,CACT,EACD,EAAC,QAAD,CACE,UAAU,uCACV,gBAAe,IAAW,IAAM,CAAC,GAA2B,IAAA,GAE5D,SAAA,EAAC,QAAD,CACE,aAAY,GAAG,EAAQ,KAAK,SAC5B,KAAM,EAAQ,oBAAsB,GAAK,IACzC,KAAM,UAAU,EAAQ,OACxB,SAAW,GAAU,EAAU,EAAM,OAAO,KAAK,EACjD,YAAY,UACZ,KAAK,OACL,KAAK,SACL,MAAO,EAAoB,GAAK,CACjC,CAAA,CACI,CAAA,CACC,GACP,CAAA,CAET,CAOA,SAAS,EAAoB,CAC3B,WACA,UAAU,UACV,GAAG,GACwB,CAC3B,OACE,EAAC,MAAD,CAAK,UAAU,qCACZ,SAAA,EAAS,IAAK,GACb,IAAY,WACV,EAAC,EAAD,CACE,GAAI,EACJ,IAAK,EAAQ,GACJ,SACV,CAAA,EAED,EAAC,EAAD,CACE,GAAI,EACJ,IAAK,EAAQ,GACJ,UACA,SACV,CAAA,CAEL,CACG,CAAA,CAET,CAEA,SAAS,EACP,EACA,EACA,CACA,IAAI,EAAY,EACZ,EAAc,EAClB,IAAK,IAAM,KAAQ,EAAW,CAC5B,IAAM,EAAU,EAAQ,SAAS,KAC9B,GAAc,EAAU,OAAS,EAAK,WACzC,EACK,KAGL,IAAI,aAAc,EAAM,CACtB,GAAa,EAAK,SAClB,IAAgB,EAAQ,aAAe,GAAK,EAAK,SACjD,QACF,CACA,GAAa,EACb,GACE,gBAAiB,EAAO,EAAK,YAAe,EAAQ,aAAe,CAHrE,CAIF,CACA,MAAO,CAAE,cAAa,WAAU,CAClC,CAEA,SAAS,GAAkB,CACzB,OACE,EAAC,MAAD,CACE,aAAW,2BACX,UAAU,gCACV,KAAK,SAEJ,SAAA,CAAC,EAAG,EAAG,CAAC,CAAC,CAAC,IAAK,GACd,EAAC,OAAD,CACE,cAAY,OACZ,UAAU,mCAEX,EADM,CACN,CACF,CACE,CAAA,CAET,CAEA,SAAS,EACP,EACA,EACA,EACA,EACmC,CACnC,GAAI,EAAoB,CACtB,IAAM,EAAU,EAAQ,SAAS,KAC9B,GACC,EAAU,KAAO,GACjB,EAAU,gBAAkB,UAChC,EACA,OAAO,EAAU,CAAC,CAAE,YAAa,EAAQ,IAAK,CAAC,EAAI,CAAC,CACtD,CAEA,OAAO,EAAQ,SAAS,QACrB,GAA+C,CAC9C,IAAM,EAAW,EAAW,EAAQ,KAAO,EAC3C,GACE,EAAQ,cAAgB,SACxB,EAAQ,gBAAkB,YAC1B,EAAW,EAEX,MAAO,CAAC,CAAE,YAAa,EAAQ,KAAM,UAAS,CAAC,EAEjD,IAAM,EAAc,EAAiB,EAAc,EAAQ,KAAO,EAAE,EAUpE,OARE,EAAQ,cAAgB,UACxB,EAAQ,gBAAkB,YAC1B,IAAgB,OACf,EAAQ,qBAAuB,MAC9B,GAAe,EAAQ,oBAElB,CAAC,CAAE,cAAa,YAAa,EAAQ,IAAK,CAAC,EAE7C,CAAC,CACV,CACF,CACF,CASA,SAAS,EAAgB,CACvB,UACA,aACA,GAAG,GACoB,CACvB,IAAM,EAAiB,EACrB,EACA,EAAe,WACf,EAAe,cACf,EAAe,kBACjB,EACM,EAAU,EAAoB,EAAS,CAAc,EACrD,EAAmB,EAAQ,SAAS,OACvC,GACC,EAAQ,gBAAkB,YAAc,EAAQ,cAAgB,QACpE,EACM,EAAgB,EAAQ,SAAS,OACpC,GAAY,CAAC,EAAiB,SAAS,CAAO,CACjD,EAEA,OACE,EAAC,OAAD,CACE,UAAU,iCACV,SAAW,GAAU,CACnB,EAAM,eAAe,EACjB,EAAe,OAAS,GAC1B,EAAW,CAAc,CAE7B,EAPF,SAAA,CASG,EAAc,OAAS,EACtB,EAAC,UAAD,CAAS,UAAU,gCACjB,SAAA,EAAC,EAAD,CAAqB,GAAI,EAAgB,SAAU,CAAgB,CAAA,CAC5D,CAAA,EACP,KACH,EAAiB,OAAS,EACzB,EAAC,UAAD,CAAS,UAAU,iCAAnB,SAAA,CACE,EAAC,SAAD,CAAQ,UAAU,uCAAlB,SAAA,CACE,EAAC,KAAD,CAAA,SAAI,gBAAkB,CAAA,EACtB,EAAC,IAAD,CAAA,SAAG,wCAAyC,CAAA,CACtC,CACR,CAAA,EAAA,EAAC,EAAD,CACE,GAAI,EACJ,SAAU,EACV,QAAQ,UACT,CAAA,CACM,CACP,CAAA,EAAA,KACH,EAAQ,SAAS,OAAS,EACzB,EAAC,SAAD,CAAQ,UAAU,+BAAlB,SAAA,CACE,EAAC,IAAD,CAAG,YAAU,SAAS,UAAU,gCAAhC,SAAA,CACE,EAAC,OAAD,CAAA,SACG,EAAQ,YAAc,EACnB,oBACA,GAAG,EAAQ,UAAU,GAAG,EAAQ,YAAc,EAAI,OAAS,QAAQ,UACnE,CAAA,EACL,EAAQ,YAAc,EAAI,KACzB,EAAC,SAAD,CAAA,SAAS,EAAI,OAAO,EAAQ,YAAc,GAAG,CAAU,CAAA,CAExD,CACH,CAAA,EAAA,EAAC,SAAD,CACE,UAAU,iCACV,SAAU,EAAe,SAAW,EACpC,KAAK,SACN,SAAA,UAEO,CAAA,CACF,CACN,CAAA,EAAA,IACA,GAEV,CAeA,SAAS,EAAiB,CACxB,SACA,eACA,YACA,QACA,UACwB,CACxB,OACE,EAAC,MAAD,CAAK,UAAU,iCAAf,SAAA,CACE,EAAC,SAAD,CAAQ,UAAU,yCAChB,SAAA,EAAC,SAAD,CACE,UAAU,6BACV,QAAS,EACT,KAAK,SACN,SAAA,YAEO,CAAA,CACF,CAAA,EACR,EAAC,EAAD,CACE,GAAI,EACO,YACJ,QACC,QACT,CAAA,CACE,GAET,CAEA,SAAS,EAAsB,CAC7B,UACA,YAIC,CA2BD,OA1BI,EAEA,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,EAAO,MAAR,CAAc,UAAU,gCAAgC,SAAA,UAE1C,CAAA,EACd,EAAC,EAAO,YAAR,CAAoB,UAAU,gCAAgC,SAAA,wCAE1C,CAAA,CACpB,CAAA,CAAA,EAID,EAcH,EAAC,SAAD,CAAQ,UAAU,+BAAlB,SAAA,CACG,EAAQ,UACP,EAAC,MAAD,CAAK,UAAU,8BAAf,SAAA,CACG,EAAQ,UAAU,SACjB,EAAC,MAAD,CACE,IAAK,GAAG,EAAQ,UAAU,KAAK,OAC/B,OAAO,KACP,IAAK,EAAQ,UAAU,SACvB,MAAM,IACP,CAAA,EACC,KACJ,EAAC,OAAD,CAAA,SAAO,EAAQ,UAAU,IAAW,CAAA,CACjC,CACH,CAAA,EAAA,KACJ,EAAC,EAAO,MAAR,CAAc,UAAU,8BACrB,SAAA,EAAQ,OAAO,OAAS,EAAQ,OAAO,IAC5B,CAAA,EACd,EAAC,EAAO,YAAR,CAAoB,UAAU,oCAC3B,SAAA,EAAQ,OAAO,aACd,iDACgB,CAAA,CACd,IAjCN,EAAC,SAAD,CAAQ,UAAU,+BAAlB,SAAA,CACE,EAAC,EAAO,MAAR,CAAc,UAAU,8BAA8B,SAAA,QAExC,CAAA,EACd,EAAC,EAAO,YAAR,CAAoB,UAAU,oCAAoC,SAAA,iDAE9C,CAAA,CACd,GA4Bd,CAEA,SAAgB,EAA0B,CACxC,cAAc,SACd,WAAW,SACX,SACA,GAAG,GAC8B,CACjC,GAAM,CAAC,EAAW,GAAgB,EAEhC,IAAI,EACA,CAAC,EAAe,GAAoB,EACxC,CAAC,CACH,EACM,CAAC,EAAY,GAAiB,EAAiC,CAAC,CAAC,EACjE,CAAC,EAAoB,GAAyB,EAClD,IACF,EACM,CAAE,UAAS,QAAO,WAAY,EAC9B,EAAyC,CAC7C,GAAI,GAAS,UACT,CAAE,uBAAwB,EAAQ,UAAU,WAAY,EACxD,CAAC,EACL,GAAG,EAAa,KAClB,EAEI,EAwCJ,MAvCA,CAyBE,EAzBE,EACQ,EAAC,EAAD,CAAkB,CAAA,EACnB,EAEP,EAAC,MAAD,CAAK,KAAK,QAAV,SAAA,CACE,EAAC,IAAD,CAAA,SAAG,kCAAmC,CAAA,EACtC,EAAC,SAAD,CAAQ,QAAS,EAAO,QAAS,KAAK,SAAS,SAAA,OAEvC,CAAA,CACL,IAEE,EAEP,EAAC,EAAD,CACW,UACM,gBACf,WAAY,EACA,aACQ,qBACF,mBACH,gBACQ,uBACxB,CAAA,EAGO,EAAC,EAAD,CAAkB,CAAA,EAE1B,EAAE,GAAW,IAAU,GAAa,IACtC,EACE,EAAC,EAAD,CACE,WAAc,EAAa,IAAI,EACjB,eACH,YACX,MAAO,EACC,QACT,CAAA,GAKH,EAAC,EAAO,KAAR,CAAA,SAAA,CACE,EAAC,EAAO,QAAR,CACE,UAAW,8CAA8C,IACzD,yBAAwB,EAAa,OAAS,OAC9C,MAAO,EAEN,SAAA,CACa,CAAA,EAChB,EAAC,EAAO,OAAR,CAAA,SAAA,CACE,EAAC,EAAO,SAAR,CAAiB,UAAU,gCAAkC,CAAA,EAC7D,EAAC,EAAO,SAAR,CAAiB,UAAU,iCACzB,SAAA,EAAC,EAAO,MAAR,CACE,UAAU,+BACV,yBAAwB,EAAa,OAAS,OAC9C,MAAO,EAHT,SAAA,CAKE,EAAC,EAAD,CACW,UACT,SAAU,IAAc,IACzB,CAAA,EACD,EAAC,EAAO,MAAR,CACE,aAAW,wBACX,UAAU,8BAEV,SAAA,EAAC,OAAD,CAAM,cAAY,OAAO,SAAA,GAAO,CAAA,CACpB,CAAA,EACb,CACW,GACC,CAAA,CACJ,CAAA,CAAA,CACJ,CAAA,CAAA,CAEjB"}
@@ -1,6 +1,6 @@
1
1
  import { i as LockerversePaymentProps } from "./types.js";
2
2
  //#region src/lockerverse-payment.d.ts
3
- declare function LockerversePayment({ apiBaseUrl, branding, className, communitySlug, environment, fetch, metadata, onError, onPaymentComplete, onPaymentRecoveryChange, onPaymentUncertain, requestTimeoutMs, resumePayment, selection, sentryDsn, style, stripeLoader, theme, widgetSlug, ...sectionProps }: LockerversePaymentProps): import("react").JSX.Element;
3
+ declare function LockerversePayment({ widget, ...viewProps }: LockerversePaymentProps): import("react").JSX.Element;
4
4
  //#endregion
5
5
  export { LockerversePayment as t };
6
6
  //# sourceMappingURL=lockerverse-payment.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"lockerverse-payment.d.ts","names":[],"sources":["../src/lockerverse-payment.tsx"],"mappings":";;iBAggCgB,qBACd,YACA,UACA,WACA,eACA,aACA,OACA,UACA,SACA,mBACA,yBACA,oBACA,kBACA,eACA,WACA,WACA,OACA,cACA,OACA,eACG,gBACF,0CAAuB,IAAA"}
1
+ {"version":3,"file":"lockerverse-payment.d.ts","names":[],"sources":["../src/lockerverse-payment.tsx"],"mappings":";;iBAiSgB,qBACd,WACG,aACF,0CAAuB,IAAA"}