@ng-web-apis/payment-request
Version:
This is a library for declarative use of Payment Request API with Angular
107 lines (95 loc) • 6.58 kB
JavaScript
import * as i0 from '@angular/core';
import { Directive, contentChildren, effect, InjectionToken, inject, Injectable, ElementRef } from '@angular/core';
import { outputFromObservable } from '@angular/core/rxjs-interop';
import { fromEvent, switchMap, from, catchError, of, share, filter } from 'rxjs';
import { WA_WINDOW } from '@ng-web-apis/common';
class WaPaymentItem {
amount;
label;
pending;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaPaymentItem, isStandalone: true, selector: "[waPaymentItem][paymentAmount][paymentLabel]", inputs: { amount: ["paymentAmount", "amount"], label: ["paymentLabel", "label"], pending: ["paymentPending", "pending"] }, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentItem, decorators: [{
type: Directive,
args: [{
selector: '[waPaymentItem][paymentAmount][paymentLabel]',
inputs: ['amount: paymentAmount', 'label: paymentLabel', 'pending: paymentPending'],
}]
}] });
class WaPayment {
total;
id;
modifiers;
shippingOptions;
displayItems;
paymentItems = contentChildren(WaPaymentItem, ...(ngDevMode ? [{ debugName: "paymentItems" }] : []));
sync = effect(() => {
this.displayItems = [...this.paymentItems()];
}, ...(ngDevMode ? [{ debugName: "sync" }] : []));
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPayment, deps: [], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.3.19", type: WaPayment, isStandalone: true, selector: "[waPayment][paymentTotal]", inputs: { total: ["paymentTotal", "total"], id: ["paymentId", "id"], modifiers: ["paymentModifiers", "modifiers"], shippingOptions: ["paymentShippingOptions", "shippingOptions"] }, queries: [{ propertyName: "paymentItems", predicate: WaPaymentItem, isSignal: true }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPayment, decorators: [{
type: Directive,
args: [{
selector: '[waPayment][paymentTotal]',
inputs: [
'total: paymentTotal',
'id: paymentId',
'modifiers: paymentModifiers',
'shippingOptions: paymentShippingOptions',
],
}]
}], propDecorators: { paymentItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => WaPaymentItem), { isSignal: true }] }] } });
const WA_PAYMENT_METHODS = new InjectionToken(ngDevMode ? '[WA_PAYMENT_METHODS]' : '', { factory: () => [{ supportedMethods: 'basic-card' }] });
const WA_PAYMENT_OPTIONS = new InjectionToken(ngDevMode ? '[WA_PAYMENT_OPTIONS]' : '', { factory: () => ({}) });
const WA_PAYMENT_REQUEST_SUPPORT = new InjectionToken(ngDevMode ? '[WA_PAYMENT_REQUEST_SUPPORT]' : '', { factory: () => !!inject(WA_WINDOW).PaymentRequest });
class WaPaymentRequestService {
supported = inject(WA_PAYMENT_REQUEST_SUPPORT);
paymentMethods = inject(WA_PAYMENT_METHODS);
paymentOptions = inject(WA_PAYMENT_OPTIONS);
async request(details, methods = this.paymentMethods, options = this.paymentOptions) {
if (!this.supported) {
return Promise.reject(new Error('Payment Request is not supported in your browser'));
}
// eslint-disable-next-line compat/compat
const gateway = new PaymentRequest(methods, details, options);
return gateway
.canMakePayment()
.then(async (canPay) => canPay
? gateway.show(details)
: Promise.reject(new Error('Payment Request cannot make the payment')));
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentRequestService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentRequestService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentRequestService, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}] });
function isError(item) {
return item instanceof Error || item instanceof DOMException;
}
class WaPaymentSubmit {
paymentHost = inject(WaPayment);
paymentRequest = inject(WaPaymentRequestService);
nativeElement = inject(ElementRef).nativeElement;
methods = inject(WA_PAYMENT_METHODS);
options = inject(WA_PAYMENT_OPTIONS);
requests$ = fromEvent(this.nativeElement, 'click').pipe(switchMap(() => from(this.paymentRequest.request({ ...this.paymentHost }, this.methods, this.options)).pipe(catchError((error) => of(error)))), share());
waPaymentSubmit = outputFromObservable(this.requests$.pipe(filter((response) => !isError(response))));
waPaymentError = outputFromObservable(this.requests$.pipe(filter(isError)));
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentSubmit, deps: [], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaPaymentSubmit, isStandalone: true, selector: "[waPaymentSubmit]", outputs: { waPaymentSubmit: "waPaymentSubmit", waPaymentError: "waPaymentError" }, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaPaymentSubmit, decorators: [{
type: Directive,
args: [{ selector: '[waPaymentSubmit]' }]
}], propDecorators: { waPaymentSubmit: [{ type: i0.Output, args: ["waPaymentSubmit"] }], waPaymentError: [{ type: i0.Output, args: ["waPaymentError"] }] } });
const WaPaymentRequest = [WaPayment, WaPaymentItem, WaPaymentSubmit];
/**
* Generated bundle index. Do not edit.
*/
export { WA_PAYMENT_METHODS, WA_PAYMENT_OPTIONS, WA_PAYMENT_REQUEST_SUPPORT, WaPayment, WaPaymentItem, WaPaymentRequest, WaPaymentRequestService, WaPaymentSubmit };
//# sourceMappingURL=ng-web-apis-payment-request.mjs.map