Skip to content

Commit 8fc8c3c

Browse files
ChilledsonChilledson
authored
Merge pull request #23 from tebexjaames/Tebex-694-payment-method-option
Tebex 694 - Add defaultPaymentMethod option, expose CheckoutZoidProps type
2 parents 90d2433 + 07a1efc commit 8fc8c3c

15 files changed

+266
-25
lines changed

‎dist/tebex.cjs

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12506,7 +12506,7 @@
1250612506
return html;
1250712507
};
1250812508

12509-
var _Checkout_instances, _Checkout_didRender, _Checkout_onRender, _Checkout_resolveLocale, _Checkout_resolveTheme, _Checkout_resolveColors, _Checkout_resolvePopupOnMobile, _Checkout_resolveEndpoint, _Checkout_resolveCloseOnClickOutside, _Checkout_resolveCloseOnEsc, _Checkout_onRequestLightboxClose, _Checkout_showLightbox, _Checkout_buildComponent, _Checkout_renderComponent;
12509+
var _Checkout_instances, _Checkout_didRender, _Checkout_onRender, _Checkout_resolveLocale, _Checkout_resolveTheme, _Checkout_resolveColors, _Checkout_resolvePopupOnMobile, _Checkout_resolveEndpoint, _Checkout_resolveCloseOnClickOutside, _Checkout_resolveCloseOnEsc, _Checkout_resolveDefaultPaymentMethod, _Checkout_onRequestLightboxClose, _Checkout_showLightbox, _Checkout_buildComponent, _Checkout_renderComponent;
1251012510
const DEFAULT_WIDTH = "800px";
1251112511
const DEFAULT_HEIGHT = "760px";
1251212512
const THEME_NAMES = [
@@ -12537,6 +12537,7 @@
1253712537
this.colors = [];
1253812538
this.closeOnClickOutside = false;
1253912539
this.closeOnEsc = false;
12540+
this.defaultPaymentMethod = undefined;
1254012541
this.popupOnMobile = false;
1254112542
this.endpoint = "https://pay.tebex.io";
1254212543
this.isOpen = false;
@@ -12564,6 +12565,7 @@
1256412565
this.endpoint = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveEndpoint).call(this, options) ?? this.endpoint;
1256512566
this.closeOnClickOutside = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveCloseOnClickOutside).call(this, options) ?? this.closeOnClickOutside;
1256612567
this.closeOnEsc = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveCloseOnEsc).call(this, options) ?? this.closeOnEsc;
12568+
this.defaultPaymentMethod = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveDefaultPaymentMethod).call(this, options) ?? this.defaultPaymentMethod;
1256712569
}
1256812570
/**
1256912571
* Subscribe to Tebex checkout events, such as when the embed is closed or when a payment is completed.
@@ -12729,6 +12731,14 @@
1272912731
return null;
1273012732
}
1273112733
return options.closeOnEsc;
12734+
}, _Checkout_resolveDefaultPaymentMethod = function _Checkout_resolveDefaultPaymentMethod(options) {
12735+
if (isNullOrUndefined(options.defaultPaymentMethod))
12736+
return null;
12737+
if (!isNonEmptyString(options.defaultPaymentMethod)) {
12738+
warn(`invalid default payment method option "${options.defaultPaymentMethod}" - must be a non-empty string`);
12739+
return null;
12740+
}
12741+
return options.defaultPaymentMethod;
1273212742
}, _Checkout_showLightbox = async function _Checkout_showLightbox() {
1273312743
if (!this.lightbox)
1273412744
this.lightbox = new Lightbox();
@@ -12768,6 +12778,7 @@
1276812778
colors: this.colors,
1276912779
closeOnClickOutside: this.closeOnClickOutside,
1277012780
closeOnEsc: this.closeOnEsc,
12781+
defaultPaymentMethod: this.defaultPaymentMethod,
1277112782
theme: this.theme,
1277212783
onOpenWindow: (url) => {
1277312784
window.open(url);
@@ -12791,7 +12802,7 @@
1279112802
origin: url.origin,
1279212803
path: url.pathname,
1279312804
params: url.search,
12794-
version: "1.6.1",
12805+
version: "1.7.0",
1279512806
});
1279612807
await this.zoid.renderTo(window, container, popup ? "popup" : "iframe");
1279712808
__classPrivateFieldSet(this, _Checkout_didRender, true, "f");
@@ -12950,6 +12961,7 @@
1295012961
colors: colors,
1295112962
closeOnClickOutside: getAttribute(this, "close-on-click-outside") !== null,
1295212963
closeOnEsc: getAttribute(this, "close-on-esc") !== null,
12964+
defaultPaymentMethod: getAttribute(this, "default-payment-method"),
1295312965
popupOnMobile: getAttribute(this, "popup-on-mobile") !== null,
1295412966
endpoint: getAttribute(this, "endpoint"),
1295512967
});
@@ -13000,7 +13012,7 @@
1300013012
/**
1300113013
* Current Tebex.js package version
1300213014
*/
13003-
const version = "1.6.1";
13015+
const version = "1.7.0";
1300413016
/**
1300513017
* Tebex checkout API
1300613018
*/

‎dist/tebex.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/tebex.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/tebex.mjs

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12500,7 +12500,7 @@ const spinnerRender = ({ doc, props }) => {
1250012500
return html;
1250112501
};
1250212502

12503-
var _Checkout_instances, _Checkout_didRender, _Checkout_onRender, _Checkout_resolveLocale, _Checkout_resolveTheme, _Checkout_resolveColors, _Checkout_resolvePopupOnMobile, _Checkout_resolveEndpoint, _Checkout_resolveCloseOnClickOutside, _Checkout_resolveCloseOnEsc, _Checkout_onRequestLightboxClose, _Checkout_showLightbox, _Checkout_buildComponent, _Checkout_renderComponent;
12503+
var _Checkout_instances, _Checkout_didRender, _Checkout_onRender, _Checkout_resolveLocale, _Checkout_resolveTheme, _Checkout_resolveColors, _Checkout_resolvePopupOnMobile, _Checkout_resolveEndpoint, _Checkout_resolveCloseOnClickOutside, _Checkout_resolveCloseOnEsc, _Checkout_resolveDefaultPaymentMethod, _Checkout_onRequestLightboxClose, _Checkout_showLightbox, _Checkout_buildComponent, _Checkout_renderComponent;
1250412504
const DEFAULT_WIDTH = "800px";
1250512505
const DEFAULT_HEIGHT = "760px";
1250612506
const THEME_NAMES = [
@@ -12531,6 +12531,7 @@ class Checkout {
1253112531
this.colors = [];
1253212532
this.closeOnClickOutside = false;
1253312533
this.closeOnEsc = false;
12534+
this.defaultPaymentMethod = undefined;
1253412535
this.popupOnMobile = false;
1253512536
this.endpoint = "https://pay.tebex.io";
1253612537
this.isOpen = false;
@@ -12558,6 +12559,7 @@ class Checkout {
1255812559
this.endpoint = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveEndpoint).call(this, options) ?? this.endpoint;
1255912560
this.closeOnClickOutside = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveCloseOnClickOutside).call(this, options) ?? this.closeOnClickOutside;
1256012561
this.closeOnEsc = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveCloseOnEsc).call(this, options) ?? this.closeOnEsc;
12562+
this.defaultPaymentMethod = __classPrivateFieldGet(this, _Checkout_instances, "m", _Checkout_resolveDefaultPaymentMethod).call(this, options) ?? this.defaultPaymentMethod;
1256112563
}
1256212564
/**
1256312565
* Subscribe to Tebex checkout events, such as when the embed is closed or when a payment is completed.
@@ -12723,6 +12725,14 @@ _Checkout_didRender = new WeakMap(), _Checkout_onRender = new WeakMap(), _Checko
1272312725
return null;
1272412726
}
1272512727
return options.closeOnEsc;
12728+
}, _Checkout_resolveDefaultPaymentMethod = function _Checkout_resolveDefaultPaymentMethod(options) {
12729+
if (isNullOrUndefined(options.defaultPaymentMethod))
12730+
return null;
12731+
if (!isNonEmptyString(options.defaultPaymentMethod)) {
12732+
warn(`invalid default payment method option "${options.defaultPaymentMethod}" - must be a non-empty string`);
12733+
return null;
12734+
}
12735+
return options.defaultPaymentMethod;
1272612736
}, _Checkout_showLightbox = async function _Checkout_showLightbox() {
1272712737
if (!this.lightbox)
1272812738
this.lightbox = new Lightbox();
@@ -12762,6 +12772,7 @@ _Checkout_didRender = new WeakMap(), _Checkout_onRender = new WeakMap(), _Checko
1276212772
colors: this.colors,
1276312773
closeOnClickOutside: this.closeOnClickOutside,
1276412774
closeOnEsc: this.closeOnEsc,
12775+
defaultPaymentMethod: this.defaultPaymentMethod,
1276512776
theme: this.theme,
1276612777
onOpenWindow: (url) => {
1276712778
window.open(url);
@@ -12785,7 +12796,7 @@ _Checkout_didRender = new WeakMap(), _Checkout_onRender = new WeakMap(), _Checko
1278512796
origin: url.origin,
1278612797
path: url.pathname,
1278712798
params: url.search,
12788-
version: "1.6.1",
12799+
version: "1.7.0",
1278912800
});
1279012801
await this.zoid.renderTo(window, container, popup ? "popup" : "iframe");
1279112802
__classPrivateFieldSet(this, _Checkout_didRender, true, "f");
@@ -12944,6 +12955,7 @@ const defineTebexCheckout = () => {
1294412955
colors: colors,
1294512956
closeOnClickOutside: getAttribute(this, "close-on-click-outside") !== null,
1294612957
closeOnEsc: getAttribute(this, "close-on-esc") !== null,
12958+
defaultPaymentMethod: getAttribute(this, "default-payment-method"),
1294712959
popupOnMobile: getAttribute(this, "popup-on-mobile") !== null,
1294812960
endpoint: getAttribute(this, "endpoint"),
1294912961
});
@@ -12994,7 +13006,7 @@ if (isEnvBrowser())
1299413006
/**
1299513007
* Current Tebex.js package version
1299613008
*/
12997-
const version = "1.6.1";
13009+
const version = "1.7.0";
1299813010
/**
1299913011
* Tebex checkout API
1300013012
*/

‎dist/types/checkout.d.ts

Lines changed: 34 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import { Unsubscribe } from "nanoevents";
1+
/// <reference path="../../src/types/zoid.d.ts" />
2+
import { type ZoidComponent, type ZoidComponentInstance } from "zoid";
3+
import { type Unsubscribe } from "nanoevents";
24
import { Lightbox } from "./lightbox";
35
import { type CssDimension, type Implements } from "./utils";
46
export declare const THEME_NAMES: readonly ["auto", "default", "light", "dark"];
@@ -37,10 +39,14 @@ export type CheckoutOptions = {
3739
* @default false
3840
*/
3941
closeOnEsc?: boolean;
42+
/**
43+
* Select a payment method to highlight on the checkout by passing its ident.
44+
* @default undefined
45+
*/
46+
defaultPaymentMethod?: string;
4047
/**
4148
* Whether to still display a popup on mobile or not. If `false` or undefined, then calling `launch()` will open a new window on mobile devices.
4249
* @default false
43-
* @internal
4450
*/
4551
popupOnMobile?: boolean;
4652
/**
@@ -74,6 +80,29 @@ export type CheckoutEventMap = Implements<Record<CheckoutEvent, Function>, {
7480
"payment:complete": (e: Event) => void;
7581
"payment:error": (e: Event) => void;
7682
}>;
83+
/**
84+
* Props passed through Zoid component.
85+
* @internal
86+
*/
87+
export type CheckoutZoidProps = {
88+
locale: string;
89+
colors: CheckoutColorDefinition[];
90+
closeOnClickOutside: boolean;
91+
closeOnEsc: boolean;
92+
defaultPaymentMethod?: string;
93+
theme: CheckoutTheme;
94+
onOpenWindow: (url: string) => void;
95+
onClosePopup: () => Promise<void>;
96+
onPaymentComplete: (e: any) => void;
97+
onPaymentError: (e: any) => void;
98+
isApplePayAvailable: boolean;
99+
isEmbedded: boolean;
100+
referrer: string;
101+
origin: string;
102+
path: string;
103+
params: string;
104+
version: string;
105+
};
77106
/**
78107
* Tebex checkout instance.
79108
*/
@@ -85,6 +114,7 @@ export default class Checkout {
85114
colors: CheckoutColorDefinition[];
86115
closeOnClickOutside: boolean;
87116
closeOnEsc: boolean;
117+
defaultPaymentMethod?: string;
88118
popupOnMobile: boolean;
89119
endpoint: string;
90120
isOpen: boolean;
@@ -95,8 +125,8 @@ export default class Checkout {
95125
"payment:error": (e: Event) => void;
96126
}>;
97127
lightbox: Lightbox;
98-
component: any;
99-
zoid: any;
128+
component: ZoidComponent<CheckoutZoidProps>;
129+
zoid: ZoidComponentInstance;
100130
/**
101131
* Configure the Tebex checkout settings.
102132
*/

‎dist/types/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export declare const version: string;
88
* Tebex checkout API
99
*/
1010
export declare const checkout: Checkout;
11+
export type { CheckoutOptions, CheckoutColorDefinition, CheckoutEvent, CheckoutEventMap, CheckoutTheme, CheckoutZoidProps } from "./checkout";
1112
/**
1213
* Legacy APIs
1314
* @deprecated

‎package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@tebexio/tebex.js",
3-
"version": "1.6.1",
3+
"version": "1.7.0",
44
"description": "Integrate Tebex Checkout directly into your own website or game using our embedded checkout experience.",
55
"type": "module",
66
"main": "dist/tebex.cjs",

‎src/checkout.ts

Lines changed: 56 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
1-
import zoid from "zoid";
2-
import { createNanoEvents, Unsubscribe } from "nanoevents";
1+
import zoid, {
2+
type ZoidComponent,
3+
type ZoidComponentInstance
4+
} from "zoid";
5+
6+
import {
7+
createNanoEvents,
8+
type Unsubscribe
9+
} from "nanoevents";
310

411
import { Lightbox } from "./lightbox";
512
import { spinnerRender } from "./spinner";
@@ -75,10 +82,14 @@ export type CheckoutOptions = {
7582
* @default false
7683
*/
7784
closeOnEsc?: boolean;
85+
/**
86+
* Select a payment method to highlight on the checkout by passing its ident.
87+
* @default undefined
88+
*/
89+
defaultPaymentMethod?: string;
7890
/**
7991
* Whether to still display a popup on mobile or not. If `false` or undefined, then calling `launch()` will open a new window on mobile devices.
8092
* @default false
81-
* @internal
8293
*/
8394
popupOnMobile?: boolean;
8495
/**
@@ -117,6 +128,30 @@ export type CheckoutEventMap = Implements<Record<CheckoutEvent, Function>, {
117128
"payment:error": (e: Event) => void;
118129
}>;
119130

131+
/**
132+
* Props passed through Zoid component.
133+
* @internal
134+
*/
135+
export type CheckoutZoidProps = {
136+
locale: string;
137+
colors: CheckoutColorDefinition[];
138+
closeOnClickOutside: boolean;
139+
closeOnEsc: boolean;
140+
defaultPaymentMethod?: string;
141+
theme: CheckoutTheme;
142+
onOpenWindow: (url: string) => void;
143+
onClosePopup: () => Promise<void>;
144+
onPaymentComplete: (e: any) => void;
145+
onPaymentError: (e: any) => void;
146+
isApplePayAvailable: boolean;
147+
isEmbedded: boolean;
148+
referrer: string;
149+
origin: string;
150+
path: string;
151+
params: string;
152+
version: string;
153+
};
154+
120155
/**
121156
* Tebex checkout instance.
122157
*/
@@ -125,18 +160,19 @@ export default class Checkout {
125160
ident: string = null;
126161
locale: string = null;
127162
theme: CheckoutTheme = "default";
128-
colors: CheckoutColorDefinition[] = [];
163+
colors: CheckoutColorDefinition[] = [];
129164
closeOnClickOutside = false;
130165
closeOnEsc = false;
166+
defaultPaymentMethod?: string = undefined;
131167
popupOnMobile = false;
132168
endpoint = "https://pay.tebex.io";
133169

134170
isOpen = false;
135171
emitter = createNanoEvents<CheckoutEventMap>();
136172
lightbox: Lightbox = null;
137173

138-
component: any = null;
139-
zoid: any = null;
174+
component: ZoidComponent<CheckoutZoidProps> = null;
175+
zoid: ZoidComponentInstance = null;
140176

141177
#didRender = false;
142178
#onRender: Function;
@@ -154,6 +190,7 @@ export default class Checkout {
154190
this.endpoint = this.#resolveEndpoint(options) ?? this.endpoint;
155191
this.closeOnClickOutside = this.#resolveCloseOnClickOutside(options) ?? this.closeOnClickOutside;
156192
this.closeOnEsc = this.#resolveCloseOnEsc(options) ?? this.closeOnEsc;
193+
this.defaultPaymentMethod = this.#resolveDefaultPaymentMethod(options) ?? this.defaultPaymentMethod;
157194
}
158195

159196
/**
@@ -367,6 +404,18 @@ export default class Checkout {
367404
return options.closeOnEsc;
368405
}
369406

407+
#resolveDefaultPaymentMethod(options: CheckoutOptions) {
408+
if (isNullOrUndefined(options.defaultPaymentMethod))
409+
return null;
410+
411+
if (!isNonEmptyString(options.defaultPaymentMethod)) {
412+
warn(`invalid default payment method option "${ options.defaultPaymentMethod }" - must be a non-empty string`);
413+
return null;
414+
}
415+
416+
return options.defaultPaymentMethod;
417+
}
418+
370419
#onRequestLightboxClose = async () => {
371420
if (this.isOpen)
372421
await this.close();
@@ -421,6 +470,7 @@ export default class Checkout {
421470
colors: this.colors,
422471
closeOnClickOutside: this.closeOnClickOutside,
423472
closeOnEsc: this.closeOnEsc,
473+
defaultPaymentMethod: this.defaultPaymentMethod,
424474
theme: this.theme,
425475
onOpenWindow: (url) => {
426476
window.open(url);

‎src/index.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,15 @@ export const version = __VERSION__;
1313
*/
1414
export const checkout = new Checkout();
1515

16+
export type {
17+
CheckoutOptions,
18+
CheckoutColorDefinition,
19+
CheckoutEvent,
20+
CheckoutEventMap,
21+
CheckoutTheme,
22+
CheckoutZoidProps
23+
} from "./checkout";
24+
1625
/**
1726
* Legacy APIs
1827
* @deprecated

0 commit comments

Comments
 (0)