@lockerverse/react 0.2.75 → 0.2.77

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,28 +85,29 @@ const widgetOptions = {
64
85
  };
65
86
 
66
87
  export function CustomProductCheckout() {
67
- const { catalog, 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
- catalog={catalog}
83
104
  selection={[selection]}
105
+ widget={widget}
84
106
  />
85
107
  );
86
108
  }
87
109
 
88
- return products
110
+ return widget.catalog.products
89
111
  .filter((product) => product.pricingMode === "fixed")
90
112
  .map((product) => (
91
113
  <button
@@ -104,15 +126,18 @@ export function CustomProductCheckout() {
104
126
  }
105
127
  ```
106
128
 
107
- The hook returns immutable catalog data together with `status`, `loading`,
108
- `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
109
131
  selected Product slugs to `LockerversePayment`; Lockerverse remains
110
132
  authoritative for availability, pricing, and payment.
111
133
 
112
- Pass the hook's `catalog` to `LockerversePayment` to reuse the loaded widget.
113
- The payment component requests only the authoritative quote instead of loading
114
- the same catalog again. A catalog is accepted only with the same API,
115
- environment, community, and widget configuration that loaded it.
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.
116
141
 
117
142
  This small example shows fixed-price Products. For a custom-price Product, ask
118
143
  for the amount in the host UI and pass `amountCents` with `productSlug`.
@@ -122,9 +147,8 @@ cadence and configures Stripe Elements for a subscription:
122
147
 
123
148
  ```tsx
124
149
  <LockerversePayment
125
- communitySlug="auburn"
126
150
  selection={[{ productSlug: "monthly-supporter" }]}
127
- widgetSlug="supporter-tiers"
151
+ widget={widget}
128
152
  />
129
153
  ```
130
154
 
@@ -143,15 +167,19 @@ subscription mode.
143
167
 
144
168
  ```tsx
145
169
  import { LockerverseDonateLauncher } from "@lockerverse/react/donate-launcher";
170
+ import { useLockerverseWidget } from "@lockerverse/react/widget";
146
171
  import "@lockerverse/react/payment.css";
147
172
 
148
173
  export function Donate() {
174
+ const widget = useLockerverseWidget({
175
+ communitySlug: "auburn",
176
+ widgetSlug: "general-donations",
177
+ });
149
178
  return (
150
179
  <LockerverseDonateLauncher
151
180
  buttonLabel="Donate"
152
- communitySlug="auburn"
153
181
  position="bottom-right"
154
- widgetSlug="general-donations"
182
+ widget={widget}
155
183
  />
156
184
  );
157
185
  }
@@ -159,18 +187,26 @@ export function Donate() {
159
187
 
160
188
  Use `position="inline"` to place the launcher in the normal page layout. Use
161
189
  `bottom-left` or `bottom-right` for a fixed launcher. Payment callbacks,
162
- branding, themes, metadata, recovery properties, and development API options
163
- 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`.
164
193
 
165
194
  ## Signup
166
195
 
167
196
  The signup entry does not import payment or Stripe code.
168
197
 
169
198
  ```tsx
170
- import { LockerverseSignup } from "@lockerverse/react/signup";
199
+ import {
200
+ LockerverseSignup,
201
+ useLockerverseSignup,
202
+ } from "@lockerverse/react/signup";
171
203
  import "@lockerverse/react/signup.css";
172
204
 
173
205
  export function Signup() {
206
+ const widget = useLockerverseSignup({
207
+ communitySlug: "auburn",
208
+ signupSlug: "tailgate-guests",
209
+ });
174
210
  return (
175
211
  <LockerverseSignup
176
212
  branding={{
@@ -178,11 +214,10 @@ export function Signup() {
178
214
  imageUrl: "https://cdn.example.com/community.png",
179
215
  name: "Auburn",
180
216
  }}
181
- communitySlug="auburn"
182
217
  onSignupComplete={(submission) => {
183
218
  console.info("Signup complete", submission.id);
184
219
  }}
185
- signupSlug="tailgate-guests"
220
+ widget={widget}
186
221
  />
187
222
  );
188
223
  }
@@ -190,15 +225,20 @@ export function Signup() {
190
225
 
191
226
  Pass `googlePlacesApiKey` to enable US address suggestions when the signup asks for an address. Manual address entry always remains available.
192
227
 
193
- For a development HTTPS backend, provide `apiBaseUrl`. The backend supplies the
194
- correct Stripe public key.
228
+ For a development HTTPS backend, provide `apiBaseUrl` to the hook. The backend
229
+ supplies the correct Stripe public key.
195
230
 
196
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
+
197
239
  <LockerversePayment
198
- apiBaseUrl="https://portal-dev.lockerverse.com/api"
199
- communitySlug="luis-c"
200
240
  selection={[{ productSlug: "adult", quantity: 1 }]}
201
- widgetSlug="new-payment-widget"
241
+ widget={widget}
202
242
  />
203
243
  ```
204
244
 
@@ -208,11 +248,12 @@ Use `theme="dark"` or `theme="light"`. Lockerverse applies the community brandin
208
248
 
209
249
  ```tsx
210
250
  <LockerversePayment
211
- // ...checkout props
251
+ selection={selection}
212
252
  style={{
213
253
  "--lockerverse-accent": "#ff6b35",
214
254
  "--lockerverse-radius": "14px",
215
255
  }}
256
+ widget={widget}
216
257
  />
217
258
  ```
218
259
 
@@ -244,7 +285,7 @@ const recovery = savedRecovery
244
285
  : null;
245
286
 
246
287
  <LockerversePayment
247
- // ...checkout props
288
+ selection={selection}
248
289
  resumePayment={recovery}
249
290
  onPaymentRecoveryChange={(nextRecovery) => {
250
291
  if (nextRecovery) {
@@ -253,6 +294,7 @@ const recovery = savedRecovery
253
294
  sessionStorage.removeItem(recoveryKey);
254
295
  }
255
296
  }}
297
+ widget={widget}
256
298
  />
257
299
  ```
258
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":"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"}
@@ -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, catalog: preloadedCatalog, 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,SAAS,kBACT,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"}