@pybara/donate-widget 0.0.0-stage → 1.0.0-beta.1
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/LICENSE +21 -0
- package/README.md +143 -2
- package/dist/config.d.ts +32 -0
- package/dist/i18n/en.d.ts +38 -0
- package/dist/i18n/index.d.ts +10 -0
- package/dist/index.d.ts +14 -0
- package/dist/pybara-donate.iife.js +464 -0
- package/dist/pybara-donate.js +8640 -0
- package/dist/types.d.ts +119 -0
- package/dist/ui/amount-selector.d.ts +28 -0
- package/dist/ui/recurring-options.d.ts +33 -0
- package/dist/ui/styles.d.ts +8 -0
- package/dist/widget.d.ts +55 -0
- package/package.json +64 -4
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Pybara Donate Widget - Type Definitions
|
|
3
|
+
*/
|
|
4
|
+
export type Frequency = 'weekly' | 'monthly' | 'yearly' | 'every2min';
|
|
5
|
+
export interface DonationWidgetConfig {
|
|
6
|
+
/** CSS selector or HTMLElement for widget mount point */
|
|
7
|
+
target: string | HTMLElement;
|
|
8
|
+
/** Recipient's principal ID (payment recipient) */
|
|
9
|
+
recipientPrincipal: string;
|
|
10
|
+
/** Site URL — registry key in pybara-admin/subs recipient registry (e.g., 'https://example.com') */
|
|
11
|
+
siteUrl: string;
|
|
12
|
+
/** Site name — display name for the recipient (e.g., 'Example Charity') */
|
|
13
|
+
siteName: string;
|
|
14
|
+
/** Preset donation amounts in USD */
|
|
15
|
+
presetAmounts?: number[];
|
|
16
|
+
/** Allow custom amount input */
|
|
17
|
+
allowCustom?: boolean;
|
|
18
|
+
/** Enable recurring donation option */
|
|
19
|
+
allowRecurring?: boolean;
|
|
20
|
+
/** Default recurring frequency */
|
|
21
|
+
defaultFrequency?: Frequency;
|
|
22
|
+
/** Default recurring duration in months (3, 6, 12, 24), or null for no end date. Left out, it is 12. */
|
|
23
|
+
defaultDurationInMonths?: number | null;
|
|
24
|
+
/** Enabled token symbols */
|
|
25
|
+
tokens?: string[];
|
|
26
|
+
/** Widget title (above amount selector) */
|
|
27
|
+
title?: string;
|
|
28
|
+
/** Widget description (below title) */
|
|
29
|
+
description?: string;
|
|
30
|
+
/** Message shown after successful donation */
|
|
31
|
+
thankYouMessage?: string;
|
|
32
|
+
/** URL to redirect to after successful donation (optional) */
|
|
33
|
+
thankYouRedirectUrl?: string;
|
|
34
|
+
/** Donate button label */
|
|
35
|
+
buttonLabel?: string;
|
|
36
|
+
/** Primary accent color (hex). Used for buttons, selected states, links. Default: '#7c3aed' */
|
|
37
|
+
primaryColor?: string;
|
|
38
|
+
/** Widget theme. 'auto' samples the surrounding page background at mount. Default: 'light' */
|
|
39
|
+
theme?: 'light' | 'dark' | 'auto';
|
|
40
|
+
/** Display currency (ISO 4217). Amounts shown in this currency; converted to USD for payment. Default: 'USD' */
|
|
41
|
+
currency?: string;
|
|
42
|
+
/** Locale override (auto-detected by default) */
|
|
43
|
+
locale?: string;
|
|
44
|
+
/** Use staging environment */
|
|
45
|
+
staging?: boolean;
|
|
46
|
+
/** Enable debug logging */
|
|
47
|
+
debug?: boolean;
|
|
48
|
+
/** Callback after successful donation */
|
|
49
|
+
onSuccess?: (data: DonationResult) => void;
|
|
50
|
+
/** Callback on donation error */
|
|
51
|
+
onError?: (error: Error) => void;
|
|
52
|
+
/** Callback when widget is closed/cancelled */
|
|
53
|
+
onClose?: () => void;
|
|
54
|
+
/** Store/site base country (ISO 3166-1 alpha-2) */
|
|
55
|
+
siteCountry?: string;
|
|
56
|
+
/** If true, donor name/details are hidden from recipient-facing displays */
|
|
57
|
+
donorIsAnonymous?: boolean;
|
|
58
|
+
/** Free-text message from donor to recipient */
|
|
59
|
+
donorMessage?: string;
|
|
60
|
+
donorFirstName?: string;
|
|
61
|
+
donorLastName?: string;
|
|
62
|
+
/** Donor's email (stored for receipt feature; never publicly displayed) */
|
|
63
|
+
donorEmail?: string;
|
|
64
|
+
donorCompany?: string;
|
|
65
|
+
donorCountry?: string;
|
|
66
|
+
/** Donor mailing address fields (all required together when provided) */
|
|
67
|
+
donorAddressLine1?: string;
|
|
68
|
+
donorAddressLine2?: string;
|
|
69
|
+
donorAddressCity?: string;
|
|
70
|
+
donorAddressState?: string;
|
|
71
|
+
donorAddressPostalCode?: string;
|
|
72
|
+
donorAddressCountry?: string;
|
|
73
|
+
/** TOS version donor accepted (e.g. "1-0") */
|
|
74
|
+
donorTosVersion?: string;
|
|
75
|
+
/** ISO 8601 UTC timestamp of donor TOS acceptance */
|
|
76
|
+
donorTosAcceptedAt?: string;
|
|
77
|
+
/** TOS version accepted by the recipient/site operator */
|
|
78
|
+
recipientTosVersion?: string;
|
|
79
|
+
/** ISO 8601 UTC timestamp of recipient TOS acceptance */
|
|
80
|
+
recipientTosAcceptedAt?: string;
|
|
81
|
+
/** Plugin/integration version forwarding this donation (e.g. "1.2.0") */
|
|
82
|
+
pluginVersion?: string;
|
|
83
|
+
/** Absolute or relative URL to a self-hosted woff2 file. When omitted, no font is loaded. */
|
|
84
|
+
fontUrl?: string;
|
|
85
|
+
}
|
|
86
|
+
export interface DonationResult {
|
|
87
|
+
/** Transaction block height (one-time) or approval block (recurring) */
|
|
88
|
+
blockHeight?: bigint;
|
|
89
|
+
/** Token used for donation */
|
|
90
|
+
token: string;
|
|
91
|
+
/** Amount donated (human-readable) */
|
|
92
|
+
amount: string;
|
|
93
|
+
/** Whether this is a recurring donation */
|
|
94
|
+
recurring: boolean;
|
|
95
|
+
/** Recurring frequency (if recurring) */
|
|
96
|
+
frequency?: Frequency;
|
|
97
|
+
/** Recurring duration in months (if recurring and not unlimited) */
|
|
98
|
+
duration_in_months?: number;
|
|
99
|
+
/** True if the recurring subscription has no end date */
|
|
100
|
+
is_unlimited: boolean;
|
|
101
|
+
/** Donor's principal ID */
|
|
102
|
+
donorPrincipal: string;
|
|
103
|
+
/** Recipient's principal ID */
|
|
104
|
+
recipientPrincipal: string;
|
|
105
|
+
}
|
|
106
|
+
export interface RecurringConfig {
|
|
107
|
+
enabled: boolean;
|
|
108
|
+
frequency: Frequency;
|
|
109
|
+
duration_in_months?: number;
|
|
110
|
+
is_unlimited: boolean;
|
|
111
|
+
}
|
|
112
|
+
/** Internal state for the widget */
|
|
113
|
+
export interface WidgetState {
|
|
114
|
+
selectedAmount: number | null;
|
|
115
|
+
customAmount: string;
|
|
116
|
+
recurring: RecurringConfig;
|
|
117
|
+
isModalOpen: boolean;
|
|
118
|
+
}
|
|
119
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Pybara Donate Widget - Amount Selector
|
|
3
|
+
*
|
|
4
|
+
* Renders preset amount buttons + optional custom amount input.
|
|
5
|
+
* Emits selected amount to parent widget.
|
|
6
|
+
*/
|
|
7
|
+
export interface AmountSelectorConfig {
|
|
8
|
+
presetAmounts: number[];
|
|
9
|
+
allowCustom: boolean;
|
|
10
|
+
currencySymbol: string;
|
|
11
|
+
customPlaceholder: string;
|
|
12
|
+
onAmountChange: (amount: number | null) => void;
|
|
13
|
+
}
|
|
14
|
+
export declare class AmountSelector {
|
|
15
|
+
private config;
|
|
16
|
+
private selectedPreset;
|
|
17
|
+
private customValue;
|
|
18
|
+
private container;
|
|
19
|
+
constructor(config: AmountSelectorConfig);
|
|
20
|
+
render(): HTMLElement;
|
|
21
|
+
/** Select a preset amount and deselect others */
|
|
22
|
+
private selectPreset;
|
|
23
|
+
/** Clear all preset button selections */
|
|
24
|
+
private clearPresetSelection;
|
|
25
|
+
/** Get current selected amount (preset or custom) */
|
|
26
|
+
getAmount(): number | null;
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=amount-selector.d.ts.map
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Translations } from '../i18n/index.js';
|
|
2
|
+
import { Frequency, RecurringConfig } from '../types.js';
|
|
3
|
+
export interface RecurringOptionsConfig {
|
|
4
|
+
defaultFrequency: Frequency;
|
|
5
|
+
defaultDurationInMonths: number;
|
|
6
|
+
defaultIsUnlimited: boolean;
|
|
7
|
+
strings: Translations['recurring'];
|
|
8
|
+
onChange: (config: RecurringConfig) => void;
|
|
9
|
+
}
|
|
10
|
+
export declare class RecurringOptions {
|
|
11
|
+
private config;
|
|
12
|
+
private enabled;
|
|
13
|
+
private frequency;
|
|
14
|
+
private duration_in_months;
|
|
15
|
+
private is_unlimited;
|
|
16
|
+
private container;
|
|
17
|
+
private optionsEl;
|
|
18
|
+
constructor(config: RecurringOptionsConfig);
|
|
19
|
+
render(): HTMLElement;
|
|
20
|
+
/** Create a row of pill-style radio buttons */
|
|
21
|
+
private createPillRow;
|
|
22
|
+
/** Show/hide recurring options based on toggle */
|
|
23
|
+
private updateOptionsVisibility;
|
|
24
|
+
/** Notify parent of config change */
|
|
25
|
+
private emitChange;
|
|
26
|
+
/** Hide the entire recurring section (wallet doesn't support ICRC-2) */
|
|
27
|
+
hide(): void;
|
|
28
|
+
/** Show the recurring section */
|
|
29
|
+
show(): void;
|
|
30
|
+
/** Get current recurring config */
|
|
31
|
+
getConfig(): RecurringConfig;
|
|
32
|
+
}
|
|
33
|
+
//# sourceMappingURL=recurring-options.d.ts.map
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Pybara Donate Widget - Widget Styles (inline CSS for Shadow DOM isolation)
|
|
3
|
+
*
|
|
4
|
+
* Design: Clean, modern, neutral. Matches pybara-ux aesthetic.
|
|
5
|
+
* Font: Outfit (loaded via FontFace API when a fontUrl is provided)
|
|
6
|
+
*/
|
|
7
|
+
export declare const WIDGET_STYLES = "\n :host {\n display: block;\n font-family: 'Pybara Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; /* Outfit, SIL OFL 1.1 \u2014 see assets/fonts/OFL.txt */\n font-weight: 400;\n color: var(--pybara-donate-text);\n outline: transparent;\n line-height: 1.5;\n -webkit-font-smoothing: antialiased;\n\n /* Neutral palette (light \u2014 overridden in dark theme block) */\n --pybara-donate-surface: #ffffff;\n --pybara-donate-panel: #f9fafb;\n --pybara-donate-border: #e5e7eb;\n --pybara-donate-border-strong: #d1d5db;\n --pybara-donate-text: #1a1a2e;\n --pybara-donate-text-mid: #374151;\n --pybara-donate-text-soft: #6b7280;\n --pybara-donate-text-faint: #9ca3af;\n --pybara-donate-error-bg: #fef2f2;\n --pybara-donate-error-border: #fecaca;\n --pybara-donate-error-text: #dc2626;\n --pybara-donate-token-bg: #f3f4f6;\n --pybara-donate-token-ring: #ffffff;\n\n /* Primary-derived (mix base updated to surface) */\n --pybara-donate-primary: #7c3aed;\n --pybara-donate-primary-dark: color-mix(in srgb, var(--pybara-donate-primary) 85%, #000);\n --pybara-donate-primary-light: color-mix(in srgb, var(--pybara-donate-primary-strong) 50%, var(--pybara-donate-surface));\n --pybara-donate-primary-bg: color-mix(in srgb, var(--pybara-donate-primary-strong) 8%, var(--pybara-donate-surface));\n --pybara-donate-primary-bg-hover: color-mix(in srgb, var(--pybara-donate-primary-strong) 5%, var(--pybara-donate-surface));\n\n /* Phase 2 fallbacks (overwritten by JS when primaryColor is hex) */\n --pybara-donate-contrast: #ffffff;\n --pybara-donate-primary-strong: var(--pybara-donate-primary);\n }\n\n * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n .pybara-donate {\n max-width: 420px;\n padding: 24px;\n border-radius: 16px;\n background: var(--pybara-donate-surface);\n border: 1px solid var(--pybara-donate-border);\n }\n\n /* Title & Description */\n .pybara-donate__intro {\n margin-bottom: 20px;\n }\n\n .pybara-donate__title {\n font-size: 20px;\n font-weight: 700;\n color: var(--pybara-donate-text);\n margin-bottom: 4px;\n }\n\n .pybara-donate__description {\n font-size: 14px;\n color: var(--pybara-donate-text-soft);\n }\n\n /* Amount Grid */\n .pybara-donate__amounts {\n display: flex;\n gap: 8px;\n margin-bottom: 16px;\n }\n\n .pybara-donate__amounts > * {\n flex: 1 1 0;\n min-width: 0;\n }\n\n .pybara-donate__amount-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 12px 4px;\n border: 2px solid var(--pybara-donate-border);\n border-radius: 10px;\n background: var(--pybara-donate-surface);\n font-family: inherit;\n font-size: clamp(13px, 3.5vw, 16px);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: 600;\n color: var(--pybara-donate-text);\n cursor: pointer;\n transition: all 0.15s ease;\n user-select: none;\n }\n\n .pybara-donate__amount-btn:hover {\n border-color: var(--pybara-donate-primary-light);\n background: var(--pybara-donate-primary-bg-hover);\n }\n\n .pybara-donate__amount-btn--selected {\n border-color: var(--pybara-donate-primary-strong);\n background: var(--pybara-donate-primary-bg);\n color: var(--pybara-donate-primary-strong);\n }\n\n /* Custom Amount Input */\n .pybara-donate__custom {\n margin-bottom: 16px;\n }\n\n .pybara-donate__custom-input-wrap {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .pybara-donate__custom-prefix {\n position: absolute;\n left: 14px;\n font-size: 16px;\n font-weight: 500;\n color: var(--pybara-donate-text-soft);\n pointer-events: none;\n }\n\n .pybara-donate__custom-input {\n width: 100%;\n padding: 12px 14px 12px 28px;\n border: 2px solid var(--pybara-donate-border);\n border-radius: 10px;\n font-family: inherit;\n font-size: 16px;\n color: var(--pybara-donate-text);\n background: var(--pybara-donate-surface);\n outline: none;\n transition: border-color 0.15s ease;\n }\n\n .pybara-donate__custom-input:focus {\n border-color: var(--pybara-donate-primary-strong);\n }\n\n .pybara-donate__custom-input::placeholder {\n color: var(--pybara-donate-text-faint);\n }\n\n /* Recurring Section */\n .pybara-donate__recurring {\n margin-bottom: 20px;\n padding: 16px;\n border-radius: 10px;\n background: var(--pybara-donate-panel);\n border: 1px solid var(--pybara-donate-border);\n }\n\n .pybara-donate__recurring-toggle {\n display: flex;\n align-items: center;\n gap: 10px;\n cursor: pointer;\n user-select: none;\n }\n\n .pybara-donate__recurring-toggle input[type=\"checkbox\"] {\n appearance: none;\n -webkit-appearance: none;\n width: 20px;\n height: 20px;\n border: 2px solid var(--pybara-donate-border-strong);\n border-radius: 5px;\n background: var(--pybara-donate-surface);\n cursor: pointer;\n position: relative;\n flex-shrink: 0;\n transition: all 0.15s ease;\n }\n\n .pybara-donate__recurring-toggle input[type=\"checkbox\"]:checked {\n background: var(--pybara-donate-primary);\n border-color: var(--pybara-donate-primary);\n }\n\n .pybara-donate__recurring-toggle input[type=\"checkbox\"]:checked::after {\n content: '';\n position: absolute;\n left: 5px;\n top: 1px;\n width: 6px;\n height: 11px;\n border: solid var(--pybara-donate-contrast);\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n }\n\n .pybara-donate__recurring-label {\n font-size: 14px;\n font-weight: 500;\n color: var(--pybara-donate-text-mid);\n }\n\n .pybara-donate__recurring-options {\n margin-top: 14px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n .pybara-donate__recurring-row {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n .pybara-donate__recurring-row-label {\n font-size: 12px;\n font-weight: 500;\n color: var(--pybara-donate-text-soft);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n }\n\n .pybara-donate__pill-group {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n }\n\n .pybara-donate__pill {\n padding: 6px 14px;\n border: 1.5px solid var(--pybara-donate-border);\n border-radius: 20px;\n background: var(--pybara-donate-surface);\n font-family: inherit;\n font-size: 13px;\n font-weight: 500;\n color: var(--pybara-donate-text-mid);\n cursor: pointer;\n transition: all 0.15s ease;\n user-select: none;\n }\n\n .pybara-donate__pill:hover {\n border-color: var(--pybara-donate-primary-light);\n }\n\n .pybara-donate__pill--selected {\n border-color: var(--pybara-donate-primary-strong);\n background: var(--pybara-donate-primary-bg);\n color: var(--pybara-donate-primary-strong);\n font-weight: 600;\n }\n\n /* Donate Button */\n .pybara-donate__submit {\n width: 100%;\n padding: 14px 24px;\n border: none;\n border-radius: 10px;\n background: var(--pybara-donate-primary);\n font-family: inherit;\n font-size: 16px;\n font-weight: 600;\n color: var(--pybara-donate-contrast);\n cursor: pointer;\n transition: all 0.15s ease;\n letter-spacing: 0.01em;\n }\n\n .pybara-donate__submit:hover:not(:disabled) {\n background: var(--pybara-donate-primary-dark);\n transform: translateY(1px);\n }\n\n .pybara-donate__submit:active:not(:disabled) {\n transform: translateY(0);\n }\n\n .pybara-donate__submit:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n /* Error Message */\n .pybara-donate__error {\n margin-top: 8px;\n padding: 8px 12px;\n border-radius: 8px;\n background: var(--pybara-donate-error-bg);\n border: 1px solid var(--pybara-donate-error-border);\n font-size: 13px;\n color: var(--pybara-donate-error-text);\n }\n\n /* Footer */\n .pybara-donate__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-top: 16px;\n }\n\n .pybara-donate__footer-brand {\n display: flex;\n align-items: center;\n gap: 6px;\n text-decoration: none;\n }\n\n .pybara-donate__footer-logo {\n flex-shrink: 0;\n height: 22px;\n width: auto;\n }\n\n .pybara-donate__footer-logo svg {\n height: 100%;\n width: auto;\n display: block;\n }\n\n .pybara-donate__footer-brand-text {\n display: flex;\n flex-direction: column;\n gap: 1px;\n }\n\n .pybara-donate__footer-brand-text strong {\n display: block;\n font-size: 11px;\n font-weight: 700;\n color: var(--pybara-donate-text);\n line-height: 1;\n user-select: none; \n }\n\n .pybara-donate__footer-brand-text span {\n font-size: 9px;\n color: var(--pybara-donate-text-faint);\n line-height: 1;\n user-select: none;\n }\n\n /* Token stack */\n .pybara-donate__footer-tokens {\n display: flex;\n align-items: center;\n filter: grayscale(1);\n transition: filter .15s ease;\n }\n .pybara-donate__footer-tokens:hover {\n filter: grayscale(0);\n }\n\n .pybara-donate__footer-token {\n border-radius: 50%;\n border: 1.5px solid var(--pybara-donate-token-ring);\n overflow: hidden;\n flex-shrink: 0;\n margin-left: -6.5px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);\n background: var(--pybara-donate-token-bg);\n }\n\n .pybara-donate__footer-token:first-child {\n margin-left: 0;\n }\n\n .pybara-donate__footer-token img {\n object-fit: cover;\n display: block;\n }\n\n /* \u2500\u2500 Dark theme \u2500\u2500 */\n /* Surface #1c222a = rgb(28,34,42) \u2014 must stay in sync with widget.ts surface literal */\n :host([data-theme=\"dark\"]) {\n --pybara-donate-surface: #1c222a;\n --pybara-donate-panel: #232b34;\n --pybara-donate-border: #2b333d;\n --pybara-donate-border-strong: #3a4450;\n --pybara-donate-text: #eef1f4;\n --pybara-donate-text-mid: #c6cdd4;\n --pybara-donate-text-soft: #8d97a1;\n --pybara-donate-text-faint: #6d7883;\n --pybara-donate-error-bg: #2a1a1c;\n --pybara-donate-error-border: #5c2b30;\n --pybara-donate-error-text: #f0868f;\n --pybara-donate-token-bg: #2b333d;\n --pybara-donate-token-ring: #1c222a; /* ring matches surface so stack overlap reads */\n --pybara-donate-primary-bg: color-mix(in srgb, var(--pybara-donate-primary-strong) 14%, var(--pybara-donate-surface));\n --pybara-donate-primary-bg-hover: color-mix(in srgb, var(--pybara-donate-primary-strong) 9%, var(--pybara-donate-surface));\n }\n\n";
|
|
8
|
+
//# sourceMappingURL=styles.d.ts.map
|
package/dist/widget.d.ts
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { DonationWidgetConfig } from './types.js';
|
|
2
|
+
export declare class DonationWidget {
|
|
3
|
+
private config;
|
|
4
|
+
private userConfig;
|
|
5
|
+
private state;
|
|
6
|
+
private shadowRoot;
|
|
7
|
+
private adminClient;
|
|
8
|
+
/** Built in mount() — see initCheckoutModal(). */
|
|
9
|
+
private modal;
|
|
10
|
+
/** Set by onSuccess while the success screen is up, so the close that follows redirects instead of counting as a cancellation. */
|
|
11
|
+
private donated;
|
|
12
|
+
private amountSelector;
|
|
13
|
+
private recurringOptions;
|
|
14
|
+
private submitBtn;
|
|
15
|
+
private errorEl;
|
|
16
|
+
private fiatRate;
|
|
17
|
+
private strings;
|
|
18
|
+
private themeObserver;
|
|
19
|
+
private themeMqCleanup;
|
|
20
|
+
constructor(userConfig: DonationWidgetConfig);
|
|
21
|
+
/** Mount the widget into the target element */
|
|
22
|
+
mount(): Promise<void>;
|
|
23
|
+
/** Injects <link rel="preconnect"> for the wallet origin into the host page's own <head> — a one-time hint, safe even if this widget mounts more than once on the same page. */
|
|
24
|
+
private preconnectWallet;
|
|
25
|
+
/**
|
|
26
|
+
* Constructs this.modal — walletUrl/context are known now, well before an
|
|
27
|
+
* amount is picked. close() (called internally on error or close)
|
|
28
|
+
* tears the iframe down for good, so onError and onClose below rebuild
|
|
29
|
+
* a fresh one immediately after — the widget stays ready for a second
|
|
30
|
+
* donation or a retry with its own preloaded iframe, not a stale, already-
|
|
31
|
+
* closed modal instance.
|
|
32
|
+
*/
|
|
33
|
+
private initCheckoutModal;
|
|
34
|
+
/** Build the inline widget DOM */
|
|
35
|
+
private buildWidgetDOM;
|
|
36
|
+
/** Create and initialize the SDK's admin-core read client. */
|
|
37
|
+
private initAdminClient;
|
|
38
|
+
/** Update donate button enabled/disabled state */
|
|
39
|
+
private updateSubmitState;
|
|
40
|
+
/**
|
|
41
|
+
* Build sdkFields for the donation. The field names are the ones settle.mo's donate_and_log() forwards to pybara-admin, so they have to match what the admin canister expects — this widget is the only place the donation-side set is built. token_symbol/price_usd_e4/eur_usd_rate_e4/ donor_principal are deliberately absent here: mode 2 appends those itself once token selection happens inside its own iframe, since this widget has no way to know which token the donor will pick — see mode-2-embedded/index.ts's own computedFields comment in pybara-wallet.
|
|
42
|
+
*/
|
|
43
|
+
private buildSdkFields;
|
|
44
|
+
/** Handle Donate button click — open the checkout modal (mode 2 in an iframe) */
|
|
45
|
+
private handleDonate;
|
|
46
|
+
/** Show inline error message */
|
|
47
|
+
private showError;
|
|
48
|
+
/** Hide inline error message */
|
|
49
|
+
private hideError;
|
|
50
|
+
/** Debug logging */
|
|
51
|
+
private log;
|
|
52
|
+
/** Destroy the widget and clean up */
|
|
53
|
+
destroy(): void;
|
|
54
|
+
}
|
|
55
|
+
//# sourceMappingURL=widget.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,66 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pybara/donate-widget",
|
|
3
|
-
"version": "
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
|
|
3
|
+
"version": "1.0.0-beta.1",
|
|
4
|
+
"description": "Embeddable donation widget for Internet Computer crypto payments",
|
|
5
|
+
"author": "Pybara",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"type": "module",
|
|
8
|
+
"main": "dist/pybara-donate.js",
|
|
9
|
+
"module": "dist/pybara-donate.js",
|
|
10
|
+
"types": "dist/index.d.ts",
|
|
11
|
+
"exports": {
|
|
12
|
+
".": {
|
|
13
|
+
"types": "./dist/index.d.ts",
|
|
14
|
+
"import": "./dist/pybara-donate.js"
|
|
15
|
+
},
|
|
16
|
+
"./dist/pybara-donate.iife.js": "./dist/pybara-donate.iife.js",
|
|
17
|
+
"./package.json": "./package.json"
|
|
18
|
+
},
|
|
19
|
+
"jsdelivr": "dist/pybara-donate.iife.js",
|
|
20
|
+
"unpkg": "dist/pybara-donate.iife.js",
|
|
21
|
+
"files": [
|
|
22
|
+
"dist/pybara-donate.iife.js",
|
|
23
|
+
"dist/pybara-donate.js",
|
|
24
|
+
"dist/**/*.d.ts"
|
|
25
|
+
],
|
|
26
|
+
"scripts": {
|
|
27
|
+
"build": "vite build",
|
|
28
|
+
"dev": "vite serve --config vite.config.dev.ts",
|
|
29
|
+
"type-check": "tsc --noEmit",
|
|
30
|
+
"translate": "node scripts/translate-locale.mjs",
|
|
31
|
+
"update:pybara": "npm install -D @pybara/pybara-sdk@github:pybara/pybara-sdk @pybara/pybara-ux@github:pybara/pybara-ux",
|
|
32
|
+
"prepublishOnly": "npm run type-check && npm run build",
|
|
33
|
+
"release:tag": "git tag donate@$npm_package_version && git push origin donate@$npm_package_version"
|
|
34
|
+
},
|
|
35
|
+
"devDependencies": {
|
|
36
|
+
"@biomejs/biome": "2.5.15",
|
|
37
|
+
"@pybara/pybara-sdk": "github:pybara/pybara-sdk",
|
|
38
|
+
"@pybara/pybara-ux": "github:pybara/pybara-ux",
|
|
39
|
+
"@pybara/widget-core": "0.0.0",
|
|
40
|
+
"@types/node": "^26.6.4",
|
|
41
|
+
"@typescript/typescript6": "6.0.2",
|
|
42
|
+
"typescript": "7.0.2",
|
|
43
|
+
"vite": "8.3.3",
|
|
44
|
+
"vite-plugin-dts": "^5.1.2"
|
|
45
|
+
},
|
|
46
|
+
"keywords": [
|
|
47
|
+
"pybara",
|
|
48
|
+
"donations",
|
|
49
|
+
"crypto",
|
|
50
|
+
"internet-computer",
|
|
51
|
+
"icp",
|
|
52
|
+
"icrc-1",
|
|
53
|
+
"icrc-2",
|
|
54
|
+
"embeddable",
|
|
55
|
+
"widget"
|
|
56
|
+
],
|
|
57
|
+
"homepage": "https://docs.pybara.com/widget/overview/",
|
|
58
|
+
"repository": {
|
|
59
|
+
"type": "git",
|
|
60
|
+
"url": "git+https://github.com/pybara/pybara-widget.git",
|
|
61
|
+
"directory": "packages/donate"
|
|
62
|
+
},
|
|
63
|
+
"publishConfig": {
|
|
64
|
+
"access": "public"
|
|
65
|
+
}
|
|
66
|
+
}
|