@clockpay/react-native 1.0.0
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 +113 -0
- package/lib/commonjs/api/client.js +73 -0
- package/lib/commonjs/api/client.js.map +1 -0
- package/lib/commonjs/api/endpoints.js +11 -0
- package/lib/commonjs/api/endpoints.js.map +1 -0
- package/lib/commonjs/components/bottom-sheet.js +137 -0
- package/lib/commonjs/components/bottom-sheet.js.map +1 -0
- package/lib/commonjs/components/icons.js +129 -0
- package/lib/commonjs/components/icons.js.map +1 -0
- package/lib/commonjs/components/payment-button.js +106 -0
- package/lib/commonjs/components/payment-button.js.map +1 -0
- package/lib/commonjs/components/payment-sheet.js +156 -0
- package/lib/commonjs/components/payment-sheet.js.map +1 -0
- package/lib/commonjs/components/views/status-view.js +109 -0
- package/lib/commonjs/components/views/status-view.js.map +1 -0
- package/lib/commonjs/components/views/transfer-view.js +162 -0
- package/lib/commonjs/components/views/transfer-view.js.map +1 -0
- package/lib/commonjs/components/views/verify-view.js +98 -0
- package/lib/commonjs/components/views/verify-view.js.map +1 -0
- package/lib/commonjs/hooks/use-countdown.js +24 -0
- package/lib/commonjs/hooks/use-countdown.js.map +1 -0
- package/lib/commonjs/index.js +13 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/internal/constants.js +42 -0
- package/lib/commonjs/internal/constants.js.map +1 -0
- package/lib/commonjs/internal/format.js +29 -0
- package/lib/commonjs/internal/format.js.map +1 -0
- package/lib/commonjs/internal/theme.js +24 -0
- package/lib/commonjs/internal/theme.js.map +1 -0
- package/lib/commonjs/package.json +1 -0
- package/lib/commonjs/types.js +6 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/module/api/client.js +67 -0
- package/lib/module/api/client.js.map +1 -0
- package/lib/module/api/endpoints.js +7 -0
- package/lib/module/api/endpoints.js.map +1 -0
- package/lib/module/components/bottom-sheet.js +133 -0
- package/lib/module/components/bottom-sheet.js.map +1 -0
- package/lib/module/components/icons.js +120 -0
- package/lib/module/components/icons.js.map +1 -0
- package/lib/module/components/payment-button.js +103 -0
- package/lib/module/components/payment-button.js.map +1 -0
- package/lib/module/components/payment-sheet.js +152 -0
- package/lib/module/components/payment-sheet.js.map +1 -0
- package/lib/module/components/views/status-view.js +105 -0
- package/lib/module/components/views/status-view.js.map +1 -0
- package/lib/module/components/views/transfer-view.js +157 -0
- package/lib/module/components/views/transfer-view.js.map +1 -0
- package/lib/module/components/views/verify-view.js +94 -0
- package/lib/module/components/views/verify-view.js.map +1 -0
- package/lib/module/hooks/use-countdown.js +21 -0
- package/lib/module/hooks/use-countdown.js.map +1 -0
- package/lib/module/index.js +4 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/internal/constants.js +37 -0
- package/lib/module/internal/constants.js.map +1 -0
- package/lib/module/internal/format.js +24 -0
- package/lib/module/internal/format.js.map +1 -0
- package/lib/module/internal/theme.js +21 -0
- package/lib/module/internal/theme.js.map +1 -0
- package/lib/module/package.json +1 -0
- package/lib/module/types.js +4 -0
- package/lib/module/types.js.map +1 -0
- package/lib/typescript/api/client.d.ts +17 -0
- package/lib/typescript/api/client.d.ts.map +1 -0
- package/lib/typescript/api/endpoints.d.ts +5 -0
- package/lib/typescript/api/endpoints.d.ts.map +1 -0
- package/lib/typescript/components/bottom-sheet.d.ts +18 -0
- package/lib/typescript/components/bottom-sheet.d.ts.map +1 -0
- package/lib/typescript/components/icons.d.ts +12 -0
- package/lib/typescript/components/icons.d.ts.map +1 -0
- package/lib/typescript/components/payment-button.d.ts +7 -0
- package/lib/typescript/components/payment-button.d.ts.map +1 -0
- package/lib/typescript/components/payment-sheet.d.ts +17 -0
- package/lib/typescript/components/payment-sheet.d.ts.map +1 -0
- package/lib/typescript/components/views/status-view.d.ts +12 -0
- package/lib/typescript/components/views/status-view.d.ts.map +1 -0
- package/lib/typescript/components/views/transfer-view.d.ts +13 -0
- package/lib/typescript/components/views/transfer-view.d.ts.map +1 -0
- package/lib/typescript/components/views/verify-view.d.ts +10 -0
- package/lib/typescript/components/views/verify-view.d.ts.map +1 -0
- package/lib/typescript/hooks/use-countdown.d.ts +8 -0
- package/lib/typescript/hooks/use-countdown.d.ts.map +1 -0
- package/lib/typescript/index.d.ts +3 -0
- package/lib/typescript/index.d.ts.map +1 -0
- package/lib/typescript/internal/constants.d.ts +20 -0
- package/lib/typescript/internal/constants.d.ts.map +1 -0
- package/lib/typescript/internal/format.d.ts +7 -0
- package/lib/typescript/internal/format.d.ts.map +1 -0
- package/lib/typescript/internal/theme.d.ts +13 -0
- package/lib/typescript/internal/theme.d.ts.map +1 -0
- package/lib/typescript/types.d.ts +67 -0
- package/lib/typescript/types.d.ts.map +1 -0
- package/package.json +70 -0
- package/src/api/client.ts +76 -0
- package/src/api/endpoints.ts +4 -0
- package/src/components/bottom-sheet.tsx +144 -0
- package/src/components/icons.tsx +90 -0
- package/src/components/payment-button.tsx +112 -0
- package/src/components/payment-sheet.tsx +149 -0
- package/src/components/views/status-view.tsx +61 -0
- package/src/components/views/transfer-view.tsx +112 -0
- package/src/components/views/verify-view.tsx +69 -0
- package/src/hooks/use-countdown.ts +20 -0
- package/src/index.ts +10 -0
- package/src/internal/constants.ts +34 -0
- package/src/internal/format.ts +21 -0
- package/src/internal/theme.ts +28 -0
- package/src/types.ts +73 -0
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.formatTime = formatTime;
|
|
7
|
+
exports.resolveNetworkCode = resolveNetworkCode;
|
|
8
|
+
exports.truncateMiddle = truncateMiddle;
|
|
9
|
+
var _constants = require("./constants");
|
|
10
|
+
/** Formats a number of seconds as `MM:SS`. */
|
|
11
|
+
function formatTime(totalSeconds) {
|
|
12
|
+
const safe = Math.max(0, totalSeconds);
|
|
13
|
+
const minutes = Math.floor(safe / 60);
|
|
14
|
+
const seconds = safe % 60;
|
|
15
|
+
return `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
/** Resolves the on-chain code used to verify a transaction for a given checkout. */
|
|
19
|
+
function resolveNetworkCode(network, fallback) {
|
|
20
|
+
const key = network?.toLowerCase() ?? '';
|
|
21
|
+
return _constants.NETWORK_CODES[key] ?? fallback ?? '';
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/** Truncates a long address for compact display: `0x1234…abcd`. */
|
|
25
|
+
function truncateMiddle(value, lead = 10, tail = 8) {
|
|
26
|
+
if (value.length <= lead + tail + 1) return value;
|
|
27
|
+
return `${value.slice(0, lead)}…${value.slice(-tail)}`;
|
|
28
|
+
}
|
|
29
|
+
//# sourceMappingURL=format.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_constants","require","formatTime","totalSeconds","safe","Math","max","minutes","floor","seconds","String","padStart","resolveNetworkCode","network","fallback","key","toLowerCase","NETWORK_CODES","truncateMiddle","value","lead","tail","length","slice"],"sourceRoot":"..\\..\\..\\src","sources":["internal/format.ts"],"mappings":";;;;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAEA;AACO,SAASC,UAAUA,CAACC,YAAoB,EAAU;EACvD,MAAMC,IAAI,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,YAAY,CAAC;EACtC,MAAMI,OAAO,GAAGF,IAAI,CAACG,KAAK,CAACJ,IAAI,GAAG,EAAE,CAAC;EACrC,MAAMK,OAAO,GAAGL,IAAI,GAAG,EAAE;EACzB,OAAO,GAAGM,MAAM,CAACH,OAAO,CAAC,CAACI,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAID,MAAM,CAACD,OAAO,CAAC,CAACE,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AAClF;;AAEA;AACO,SAASC,kBAAkBA,CAACC,OAAgB,EAAEC,QAAiB,EAAU;EAC9E,MAAMC,GAAG,GAAGF,OAAO,EAAEG,WAAW,CAAC,CAAC,IAAI,EAAE;EACxC,OAAOC,wBAAa,CAACF,GAAG,CAAC,IAAID,QAAQ,IAAI,EAAE;AAC7C;;AAEA;AACO,SAASI,cAAcA,CAACC,KAAa,EAAEC,IAAI,GAAG,EAAE,EAAEC,IAAI,GAAG,CAAC,EAAU;EACzE,IAAIF,KAAK,CAACG,MAAM,IAAIF,IAAI,GAAGC,IAAI,GAAG,CAAC,EAAE,OAAOF,KAAK;EACjD,OAAO,GAAGA,KAAK,CAACI,KAAK,CAAC,CAAC,EAAEH,IAAI,CAAC,IAAID,KAAK,CAACI,KAAK,CAAC,CAACF,IAAI,CAAC,EAAE;AACxD","ignoreList":[]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.resolveTheme = resolveTheme;
|
|
7
|
+
var _constants = require("./constants");
|
|
8
|
+
/** Concrete colours/values resolved from an {@link ClockPayAppearance}. */
|
|
9
|
+
|
|
10
|
+
/** Resolves an appearance object into concrete style values for the RN UI. */
|
|
11
|
+
function resolveTheme(appearance) {
|
|
12
|
+
const a = appearance ?? {};
|
|
13
|
+
const variant = a.variant ?? 'outline';
|
|
14
|
+
const accent = a.buttonColor ?? _constants.DEFAULT_ACCENT;
|
|
15
|
+
return {
|
|
16
|
+
accent: a.modalAccentColor ?? accent,
|
|
17
|
+
radius: a.borderRadius ?? 8,
|
|
18
|
+
buttonBg: variant === 'solid' ? accent : '#ffffff',
|
|
19
|
+
buttonFg: a.buttonTextColor ?? (variant === 'solid' ? '#ffffff' : accent),
|
|
20
|
+
buttonBorder: accent,
|
|
21
|
+
fontFamily: a.fontFamily
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
//# sourceMappingURL=theme.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_constants","require","resolveTheme","appearance","a","variant","accent","buttonColor","DEFAULT_ACCENT","modalAccentColor","radius","borderRadius","buttonBg","buttonFg","buttonTextColor","buttonBorder","fontFamily"],"sourceRoot":"..\\..\\..\\src","sources":["internal/theme.ts"],"mappings":";;;;;;AACA,IAAAA,UAAA,GAAAC,OAAA;AAEA;;AAUA;AACO,SAASC,YAAYA,CAACC,UAA+B,EAAiB;EAC3E,MAAMC,CAAC,GAAGD,UAAU,IAAI,CAAC,CAAC;EAC1B,MAAME,OAAO,GAAGD,CAAC,CAACC,OAAO,IAAI,SAAS;EACtC,MAAMC,MAAM,GAAGF,CAAC,CAACG,WAAW,IAAIC,yBAAc;EAE9C,OAAO;IACLF,MAAM,EAAEF,CAAC,CAACK,gBAAgB,IAAIH,MAAM;IACpCI,MAAM,EAAEN,CAAC,CAACO,YAAY,IAAI,CAAC;IAC3BC,QAAQ,EAAEP,OAAO,KAAK,OAAO,GAAGC,MAAM,GAAG,SAAS;IAClDO,QAAQ,EAAET,CAAC,CAACU,eAAe,KAAKT,OAAO,KAAK,OAAO,GAAG,SAAS,GAAGC,MAAM,CAAC;IACzES,YAAY,EAAET,MAAM;IACpBU,UAAU,EAAEZ,CAAC,CAACY;EAChB,CAAC;AACH","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type":"commonjs"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sourceRoot":"..\\..\\src","sources":["types.ts"],"mappings":"","ignoreList":[]}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import axios, { AxiosError } from 'axios';
|
|
4
|
+
import { endpoints } from './endpoints';
|
|
5
|
+
import { resolveApiBaseUrl } from '../internal/constants';
|
|
6
|
+
/** Normalizes an unknown thrown value into a useful `Error`. */
|
|
7
|
+
function toError(error, fallback) {
|
|
8
|
+
if (error instanceof AxiosError) {
|
|
9
|
+
const message = error.response?.data?.message ?? error.message;
|
|
10
|
+
return new Error(message || fallback);
|
|
11
|
+
}
|
|
12
|
+
if (error instanceof Error) return error;
|
|
13
|
+
return new Error(fallback);
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* A small, typed wrapper around the ClockPay REST API.
|
|
18
|
+
*
|
|
19
|
+
* Each client carries its own public key on a dedicated axios instance. The base
|
|
20
|
+
* URL is selected from the key's environment prefix (`cpay_test_pk_` → dev
|
|
21
|
+
* gateway, `cpay_live_pk_` → live gateway) unless `apiBaseUrl` overrides it.
|
|
22
|
+
*/
|
|
23
|
+
export class ClockPayClient {
|
|
24
|
+
constructor(publicKey, apiBaseUrl) {
|
|
25
|
+
if (!publicKey) {
|
|
26
|
+
throw new Error('ClockPay: a publicKey is required.');
|
|
27
|
+
}
|
|
28
|
+
this.http = axios.create({
|
|
29
|
+
baseURL: resolveApiBaseUrl(publicKey, apiBaseUrl),
|
|
30
|
+
headers: {
|
|
31
|
+
Accept: 'application/json',
|
|
32
|
+
'Content-Type': 'application/json',
|
|
33
|
+
'clock-pub-key': publicKey
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
/** Initiates a checkout for the given client secret. */
|
|
39
|
+
async initiatePayment(clientSecret) {
|
|
40
|
+
if (!clientSecret) {
|
|
41
|
+
throw new Error('ClockPay: a clientSecret is required.');
|
|
42
|
+
}
|
|
43
|
+
try {
|
|
44
|
+
const {
|
|
45
|
+
data
|
|
46
|
+
} = await this.http.post(endpoints.initiatePayment, {
|
|
47
|
+
clientSecret
|
|
48
|
+
});
|
|
49
|
+
return data;
|
|
50
|
+
} catch (error) {
|
|
51
|
+
throw toError(error, 'Failed to initiate payment.');
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/** Verifies an on-chain transaction by hash. */
|
|
56
|
+
async verifyCrypto(payload) {
|
|
57
|
+
try {
|
|
58
|
+
const {
|
|
59
|
+
data
|
|
60
|
+
} = await this.http.post(endpoints.verifyCrypto, payload);
|
|
61
|
+
return data;
|
|
62
|
+
} catch (error) {
|
|
63
|
+
throw toError(error, 'Failed to verify transaction.');
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
//# sourceMappingURL=client.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["axios","AxiosError","endpoints","resolveApiBaseUrl","toError","error","fallback","message","response","data","Error","ClockPayClient","constructor","publicKey","apiBaseUrl","http","create","baseURL","headers","Accept","initiatePayment","clientSecret","post","verifyCrypto","payload"],"sourceRoot":"..\\..\\..\\src","sources":["api/client.ts"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAA4B,OAAO;AAC7D,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,iBAAiB,QAAQ,uBAAuB;AAOzD;AACA,SAASC,OAAOA,CAACC,KAAc,EAAEC,QAAgB,EAAS;EACxD,IAAID,KAAK,YAAYJ,UAAU,EAAE;IAC/B,MAAMM,OAAO,GACVF,KAAK,CAACG,QAAQ,EAAEC,IAAI,EAAuCF,OAAO,IACnEF,KAAK,CAACE,OAAO;IACf,OAAO,IAAIG,KAAK,CAACH,OAAO,IAAID,QAAQ,CAAC;EACvC;EACA,IAAID,KAAK,YAAYK,KAAK,EAAE,OAAOL,KAAK;EACxC,OAAO,IAAIK,KAAK,CAACJ,QAAQ,CAAC;AAC5B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMK,cAAc,CAAC;EAG1BC,WAAWA,CAACC,SAAiB,EAAEC,UAAmB,EAAE;IAClD,IAAI,CAACD,SAAS,EAAE;MACd,MAAM,IAAIH,KAAK,CAAC,oCAAoC,CAAC;IACvD;IACA,IAAI,CAACK,IAAI,GAAGf,KAAK,CAACgB,MAAM,CAAC;MACvBC,OAAO,EAAEd,iBAAiB,CAACU,SAAS,EAAEC,UAAU,CAAC;MACjDI,OAAO,EAAE;QACPC,MAAM,EAAE,kBAAkB;QAC1B,cAAc,EAAE,kBAAkB;QAClC,eAAe,EAAEN;MACnB;IACF,CAAC,CAAC;EACJ;;EAEA;EACA,MAAMO,eAAeA,CAACC,YAAoB,EAA6B;IACrE,IAAI,CAACA,YAAY,EAAE;MACjB,MAAM,IAAIX,KAAK,CAAC,uCAAuC,CAAC;IAC1D;IACA,IAAI;MACF,MAAM;QAAED;MAAK,CAAC,GAAG,MAAM,IAAI,CAACM,IAAI,CAACO,IAAI,CACnCpB,SAAS,CAACkB,eAAe,EACzB;QAAEC;MAAa,CACjB,CAAC;MACD,OAAOZ,IAAI;IACb,CAAC,CAAC,OAAOJ,KAAK,EAAE;MACd,MAAMD,OAAO,CAACC,KAAK,EAAE,6BAA6B,CAAC;IACrD;EACF;;EAEA;EACA,MAAMkB,YAAYA,CAChBC,OAA4B,EACG;IAC/B,IAAI;MACF,MAAM;QAAEf;MAAK,CAAC,GAAG,MAAM,IAAI,CAACM,IAAI,CAACO,IAAI,CACnCpB,SAAS,CAACqB,YAAY,EACtBC,OACF,CAAC;MACD,OAAOf,IAAI;IACb,CAAC,CAAC,OAAOJ,KAAK,EAAE;MACd,MAAMD,OAAO,CAACC,KAAK,EAAE,+BAA+B,CAAC;IACvD;EACF;AACF","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["endpoints","Object","freeze","initiatePayment","verifyCrypto"],"sourceRoot":"..\\..\\..\\src","sources":["api/endpoints.ts"],"mappings":";;AAAA,OAAO,MAAMA,SAAS,GAAGC,MAAM,CAACC,MAAM,CAAC;EACrCC,eAAe,EAAE,0BAA0B;EAC3CC,YAAY,EAAE;AAChB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useEffect, useRef, useState } from 'react';
|
|
4
|
+
import { Animated, Dimensions, Modal, PanResponder, Pressable, StyleSheet, View } from 'react-native';
|
|
5
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
|
+
const SCREEN_HEIGHT = Dimensions.get('window').height;
|
|
7
|
+
const DISMISS_THRESHOLD = 120;
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* A Stripe-style bottom sheet: slides up from the bottom over a dimmed backdrop,
|
|
11
|
+
* with drag-to-dismiss on the handle. Built on RN primitives — no native deps.
|
|
12
|
+
*/
|
|
13
|
+
export function BottomSheet({
|
|
14
|
+
visible,
|
|
15
|
+
onClose,
|
|
16
|
+
onClosed,
|
|
17
|
+
closeOnBackdropPress = true,
|
|
18
|
+
children
|
|
19
|
+
}) {
|
|
20
|
+
const translateY = useRef(new Animated.Value(SCREEN_HEIGHT)).current;
|
|
21
|
+
const backdrop = useRef(new Animated.Value(0)).current;
|
|
22
|
+
const [mounted, setMounted] = useState(visible);
|
|
23
|
+
const animateIn = () => {
|
|
24
|
+
Animated.parallel([Animated.timing(translateY, {
|
|
25
|
+
toValue: 0,
|
|
26
|
+
duration: 280,
|
|
27
|
+
useNativeDriver: true
|
|
28
|
+
}), Animated.timing(backdrop, {
|
|
29
|
+
toValue: 1,
|
|
30
|
+
duration: 280,
|
|
31
|
+
useNativeDriver: true
|
|
32
|
+
})]).start();
|
|
33
|
+
};
|
|
34
|
+
const animateOut = () => {
|
|
35
|
+
Animated.parallel([Animated.timing(translateY, {
|
|
36
|
+
toValue: SCREEN_HEIGHT,
|
|
37
|
+
duration: 220,
|
|
38
|
+
useNativeDriver: true
|
|
39
|
+
}), Animated.timing(backdrop, {
|
|
40
|
+
toValue: 0,
|
|
41
|
+
duration: 220,
|
|
42
|
+
useNativeDriver: true
|
|
43
|
+
})]).start(() => {
|
|
44
|
+
setMounted(false);
|
|
45
|
+
onClosed?.();
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
if (visible) {
|
|
50
|
+
setMounted(true);
|
|
51
|
+
// Defer so the sheet starts off-screen before animating in.
|
|
52
|
+
requestAnimationFrame(animateIn);
|
|
53
|
+
} else if (mounted) {
|
|
54
|
+
animateOut();
|
|
55
|
+
}
|
|
56
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
57
|
+
}, [visible]);
|
|
58
|
+
const panResponder = useRef(PanResponder.create({
|
|
59
|
+
onMoveShouldSetPanResponder: (_, g) => g.dy > 6 && Math.abs(g.dy) > Math.abs(g.dx),
|
|
60
|
+
onPanResponderMove: (_, g) => {
|
|
61
|
+
if (g.dy > 0) translateY.setValue(g.dy);
|
|
62
|
+
},
|
|
63
|
+
onPanResponderRelease: (_, g) => {
|
|
64
|
+
if (g.dy > DISMISS_THRESHOLD) onClose();else Animated.spring(translateY, {
|
|
65
|
+
toValue: 0,
|
|
66
|
+
useNativeDriver: true,
|
|
67
|
+
bounciness: 4
|
|
68
|
+
}).start();
|
|
69
|
+
}
|
|
70
|
+
})).current;
|
|
71
|
+
return /*#__PURE__*/_jsx(Modal, {
|
|
72
|
+
visible: mounted,
|
|
73
|
+
transparent: true,
|
|
74
|
+
animationType: "none",
|
|
75
|
+
statusBarTranslucent: true,
|
|
76
|
+
onRequestClose: onClose,
|
|
77
|
+
children: /*#__PURE__*/_jsxs(View, {
|
|
78
|
+
style: styles.root,
|
|
79
|
+
children: [/*#__PURE__*/_jsx(Animated.View, {
|
|
80
|
+
style: [styles.backdrop, {
|
|
81
|
+
opacity: backdrop
|
|
82
|
+
}],
|
|
83
|
+
children: /*#__PURE__*/_jsx(Pressable, {
|
|
84
|
+
style: StyleSheet.absoluteFill,
|
|
85
|
+
onPress: closeOnBackdropPress ? onClose : undefined
|
|
86
|
+
})
|
|
87
|
+
}), /*#__PURE__*/_jsxs(Animated.View, {
|
|
88
|
+
style: [styles.sheet, {
|
|
89
|
+
transform: [{
|
|
90
|
+
translateY
|
|
91
|
+
}]
|
|
92
|
+
}],
|
|
93
|
+
children: [/*#__PURE__*/_jsx(View, {
|
|
94
|
+
style: styles.handleArea,
|
|
95
|
+
...panResponder.panHandlers,
|
|
96
|
+
children: /*#__PURE__*/_jsx(View, {
|
|
97
|
+
style: styles.handle
|
|
98
|
+
})
|
|
99
|
+
}), children]
|
|
100
|
+
})]
|
|
101
|
+
})
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
const styles = StyleSheet.create({
|
|
105
|
+
root: {
|
|
106
|
+
flex: 1,
|
|
107
|
+
justifyContent: 'flex-end'
|
|
108
|
+
},
|
|
109
|
+
backdrop: {
|
|
110
|
+
...StyleSheet.absoluteFillObject,
|
|
111
|
+
backgroundColor: 'rgba(15,23,42,0.45)'
|
|
112
|
+
},
|
|
113
|
+
sheet: {
|
|
114
|
+
backgroundColor: '#ffffff',
|
|
115
|
+
borderTopLeftRadius: 24,
|
|
116
|
+
borderTopRightRadius: 24,
|
|
117
|
+
paddingHorizontal: 20,
|
|
118
|
+
paddingBottom: 32,
|
|
119
|
+
maxHeight: '92%'
|
|
120
|
+
},
|
|
121
|
+
handleArea: {
|
|
122
|
+
alignItems: 'center',
|
|
123
|
+
paddingTop: 10,
|
|
124
|
+
paddingBottom: 6
|
|
125
|
+
},
|
|
126
|
+
handle: {
|
|
127
|
+
width: 40,
|
|
128
|
+
height: 5,
|
|
129
|
+
borderRadius: 3,
|
|
130
|
+
backgroundColor: '#CBD5E1'
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
//# sourceMappingURL=bottom-sheet.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","useState","Animated","Dimensions","Modal","PanResponder","Pressable","StyleSheet","View","jsx","_jsx","jsxs","_jsxs","SCREEN_HEIGHT","get","height","DISMISS_THRESHOLD","BottomSheet","visible","onClose","onClosed","closeOnBackdropPress","children","translateY","Value","current","backdrop","mounted","setMounted","animateIn","parallel","timing","toValue","duration","useNativeDriver","start","animateOut","requestAnimationFrame","panResponder","create","onMoveShouldSetPanResponder","_","g","dy","Math","abs","dx","onPanResponderMove","setValue","onPanResponderRelease","spring","bounciness","transparent","animationType","statusBarTranslucent","onRequestClose","style","styles","root","opacity","absoluteFill","onPress","undefined","sheet","transform","handleArea","panHandlers","handle","flex","justifyContent","absoluteFillObject","backgroundColor","borderTopLeftRadius","borderTopRightRadius","paddingHorizontal","paddingBottom","maxHeight","alignItems","paddingTop","width","borderRadius"],"sourceRoot":"..\\..\\..\\src","sources":["components/bottom-sheet.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import Svg, { Path, Circle } from 'react-native-svg';
|
|
4
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
+
/** ClockPay brandmark. */
|
|
6
|
+
export function LogoIcon({
|
|
7
|
+
size = 16
|
|
8
|
+
}) {
|
|
9
|
+
const height = size;
|
|
10
|
+
const width = 23 / 28 * size;
|
|
11
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
12
|
+
width: width,
|
|
13
|
+
height: height,
|
|
14
|
+
viewBox: "0 0 23 28",
|
|
15
|
+
fill: "none",
|
|
16
|
+
children: [/*#__PURE__*/_jsx(Path, {
|
|
17
|
+
d: "M22.7193 20.6621H6.78613V27.548H22.7193V20.6621Z",
|
|
18
|
+
fill: "#26A9E1"
|
|
19
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
20
|
+
d: "M11.3619 15.9327C12.5385 15.9327 13.4923 14.9649 13.4923 13.7711C13.4923 12.5772 12.5385 11.6094 11.3619 11.6094C10.1854 11.6094 9.23157 12.5772 9.23157 13.7711C9.23157 14.9649 10.1854 15.9327 11.3619 15.9327Z",
|
|
21
|
+
fill: "#26A9E1"
|
|
22
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
23
|
+
d: "M22.7193 0V6.88589H6.79088V20.6577H0V0H22.7193Z",
|
|
24
|
+
fill: "#26A9E1"
|
|
25
|
+
})]
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
export function CloseIcon({
|
|
29
|
+
size = 24,
|
|
30
|
+
color = '#1E1E1E'
|
|
31
|
+
}) {
|
|
32
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
33
|
+
width: size,
|
|
34
|
+
height: size,
|
|
35
|
+
viewBox: "0 0 32 32",
|
|
36
|
+
fill: "none",
|
|
37
|
+
children: [/*#__PURE__*/_jsx(Path, {
|
|
38
|
+
d: "M20 12L12 19.9995M20 20L12 12.0005",
|
|
39
|
+
stroke: color,
|
|
40
|
+
strokeWidth: 2,
|
|
41
|
+
strokeLinecap: "round",
|
|
42
|
+
strokeLinejoin: "round"
|
|
43
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
44
|
+
d: "M3.33325 15.9999C3.33325 10.0288 3.33325 7.04324 5.18824 5.18824C7.04324 3.33325 10.0288 3.33325 15.9999 3.33325C21.971 3.33325 24.9566 3.33325 26.8117 5.18824C28.6666 7.04324 28.6666 10.0288 28.6666 15.9999C28.6666 21.971 28.6666 24.9566 26.8117 26.8117C24.9566 28.6666 21.971 28.6666 15.9999 28.6666C10.0288 28.6666 7.04324 28.6666 5.18824 26.8117C3.33325 24.9566 3.33325 21.971 3.33325 15.9999Z",
|
|
45
|
+
stroke: color,
|
|
46
|
+
strokeWidth: 2
|
|
47
|
+
})]
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
export function CopyIcon({
|
|
51
|
+
size = 18,
|
|
52
|
+
color = '#27AAE1'
|
|
53
|
+
}) {
|
|
54
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
55
|
+
width: size,
|
|
56
|
+
height: size,
|
|
57
|
+
viewBox: "0 0 20 21",
|
|
58
|
+
fill: "none",
|
|
59
|
+
children: [/*#__PURE__*/_jsx(Path, {
|
|
60
|
+
d: "M7.5 13C7.5 10.643 7.5 9.4645 8.23223 8.73223C8.9645 8 10.143 8 12.5 8H13.3333C15.6903 8 16.8688 8 17.6011 8.73223C18.3333 9.4645 18.3333 10.643 18.3333 13V13.8333C18.3333 16.1903 18.3333 17.3688 17.6011 18.1011C16.8688 18.8333 15.6903 18.8333 13.3333 18.8333H12.5C10.143 18.8333 8.9645 18.8333 8.23223 18.1011C7.5 17.3688 7.5 16.1903 7.5 13.8333V13Z",
|
|
61
|
+
stroke: color,
|
|
62
|
+
strokeWidth: 1.25,
|
|
63
|
+
strokeLinecap: "round",
|
|
64
|
+
strokeLinejoin: "round"
|
|
65
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
66
|
+
d: "M14.1664 8.00033C14.1644 5.53608 14.1272 4.25967 13.4098 3.38568C13.2713 3.2169 13.1166 3.06214 12.9478 2.92363C12.0258 2.16699 10.6561 2.16699 7.9165 2.16699C5.17694 2.16699 3.80715 2.16699 2.8852 2.92363C2.71641 3.06213 2.56165 3.2169 2.42314 3.38568C1.6665 4.30764 1.6665 5.67743 1.6665 8.41699C1.6665 11.1566 1.6665 12.5263 2.42314 13.4483C2.56165 13.6171 2.71641 13.7718 2.8852 13.9103C3.75918 14.6277 5.0356 14.6649 7.49984 14.6669",
|
|
67
|
+
stroke: color,
|
|
68
|
+
strokeWidth: 1.25,
|
|
69
|
+
strokeLinecap: "round",
|
|
70
|
+
strokeLinejoin: "round"
|
|
71
|
+
})]
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
export function InfoIcon({
|
|
75
|
+
size = 16
|
|
76
|
+
}) {
|
|
77
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
78
|
+
width: size,
|
|
79
|
+
height: size,
|
|
80
|
+
viewBox: "0 0 12 12",
|
|
81
|
+
fill: "none",
|
|
82
|
+
children: [/*#__PURE__*/_jsx(Path, {
|
|
83
|
+
d: "M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z",
|
|
84
|
+
fill: "#9DAAD2"
|
|
85
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
86
|
+
d: "M6 8V6",
|
|
87
|
+
stroke: "#FAFBFF",
|
|
88
|
+
strokeLinecap: "round",
|
|
89
|
+
strokeLinejoin: "round"
|
|
90
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
91
|
+
d: "M6 4H6.005",
|
|
92
|
+
stroke: "#FAFBFF",
|
|
93
|
+
strokeLinecap: "round",
|
|
94
|
+
strokeLinejoin: "round"
|
|
95
|
+
})]
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
export function CheckIcon({
|
|
99
|
+
size = 48
|
|
100
|
+
}) {
|
|
101
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
102
|
+
width: size,
|
|
103
|
+
height: size,
|
|
104
|
+
viewBox: "0 0 24 24",
|
|
105
|
+
fill: "none",
|
|
106
|
+
children: [/*#__PURE__*/_jsx(Circle, {
|
|
107
|
+
cx: 12,
|
|
108
|
+
cy: 12,
|
|
109
|
+
r: 10,
|
|
110
|
+
fill: "#22c55e"
|
|
111
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
112
|
+
d: "M8 12.5L11 15.5L16 9.5",
|
|
113
|
+
stroke: "#fff",
|
|
114
|
+
strokeWidth: 2,
|
|
115
|
+
strokeLinecap: "round",
|
|
116
|
+
strokeLinejoin: "round"
|
|
117
|
+
})]
|
|
118
|
+
});
|
|
119
|
+
}
|
|
120
|
+
//# sourceMappingURL=icons.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Svg","Path","Circle","jsx","_jsx","jsxs","_jsxs","LogoIcon","size","height","width","viewBox","fill","children","d","CloseIcon","color","stroke","strokeWidth","strokeLinecap","strokeLinejoin","CopyIcon","InfoIcon","CheckIcon","cx","cy","r"],"sourceRoot":"..\\..\\..\\src","sources":["components/icons.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useMemo, useState } from 'react';
|
|
4
|
+
import { ActivityIndicator, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
|
|
5
|
+
import { ClockPayClient } from '../api/client';
|
|
6
|
+
import { resolveTheme } from '../internal/theme';
|
|
7
|
+
import { PaymentSheet } from './payment-sheet';
|
|
8
|
+
import { LogoIcon } from './icons';
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* Drop-in payment button for React Native. Renders a "Pay with Clockpay" trigger
|
|
12
|
+
* that initiates a checkout and opens a Stripe-style bottom-sheet payment modal.
|
|
13
|
+
*/
|
|
14
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
15
|
+
export function PaymentButton({
|
|
16
|
+
publicKey,
|
|
17
|
+
clientSecret,
|
|
18
|
+
appearance,
|
|
19
|
+
label = 'Pay with Clockpay',
|
|
20
|
+
disabled,
|
|
21
|
+
apiBaseUrl,
|
|
22
|
+
redirectUrl,
|
|
23
|
+
onSuccess,
|
|
24
|
+
onError,
|
|
25
|
+
onClose
|
|
26
|
+
}) {
|
|
27
|
+
const [checkout, setCheckout] = useState(null);
|
|
28
|
+
const [visible, setVisible] = useState(false);
|
|
29
|
+
const [loading, setLoading] = useState(false);
|
|
30
|
+
const theme = useMemo(() => resolveTheme(appearance), [appearance]);
|
|
31
|
+
const initiate = async () => {
|
|
32
|
+
if (loading) return;
|
|
33
|
+
setLoading(true);
|
|
34
|
+
try {
|
|
35
|
+
const client = new ClockPayClient(publicKey, apiBaseUrl);
|
|
36
|
+
const response = await client.initiatePayment(clientSecret);
|
|
37
|
+
setCheckout(response.data);
|
|
38
|
+
setVisible(true);
|
|
39
|
+
} catch (error) {
|
|
40
|
+
onError?.(error instanceof Error ? error : new Error('Payment initialization failed.'));
|
|
41
|
+
} finally {
|
|
42
|
+
setLoading(false);
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
const handleClosed = () => {
|
|
46
|
+
setCheckout(null);
|
|
47
|
+
onClose?.();
|
|
48
|
+
};
|
|
49
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
50
|
+
children: [/*#__PURE__*/_jsx(TouchableOpacity, {
|
|
51
|
+
activeOpacity: 0.8,
|
|
52
|
+
disabled: disabled || loading,
|
|
53
|
+
onPress: initiate,
|
|
54
|
+
style: [styles.button, {
|
|
55
|
+
backgroundColor: theme.buttonBg,
|
|
56
|
+
borderColor: theme.buttonBorder,
|
|
57
|
+
borderRadius: theme.radius,
|
|
58
|
+
opacity: disabled || loading ? 0.6 : 1
|
|
59
|
+
}],
|
|
60
|
+
children: loading ? /*#__PURE__*/_jsx(ActivityIndicator, {
|
|
61
|
+
size: "small",
|
|
62
|
+
color: theme.buttonFg
|
|
63
|
+
}) : /*#__PURE__*/_jsxs(_Fragment, {
|
|
64
|
+
children: [/*#__PURE__*/_jsx(LogoIcon, {
|
|
65
|
+
size: 16
|
|
66
|
+
}), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
|
|
67
|
+
style: [styles.label, {
|
|
68
|
+
color: theme.buttonFg,
|
|
69
|
+
fontFamily: theme.fontFamily
|
|
70
|
+
}],
|
|
71
|
+
children: label
|
|
72
|
+
}) : label]
|
|
73
|
+
})
|
|
74
|
+
}), checkout && /*#__PURE__*/_jsx(PaymentSheet, {
|
|
75
|
+
visible: visible,
|
|
76
|
+
checkout: checkout,
|
|
77
|
+
publicKey: publicKey,
|
|
78
|
+
apiBaseUrl: apiBaseUrl,
|
|
79
|
+
theme: theme,
|
|
80
|
+
redirectUrl: redirectUrl,
|
|
81
|
+
onRequestClose: () => setVisible(false),
|
|
82
|
+
onClosed: handleClosed,
|
|
83
|
+
onSuccess: onSuccess,
|
|
84
|
+
onError: onError
|
|
85
|
+
})]
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
const styles = StyleSheet.create({
|
|
89
|
+
button: {
|
|
90
|
+
flexDirection: 'row',
|
|
91
|
+
alignItems: 'center',
|
|
92
|
+
justifyContent: 'center',
|
|
93
|
+
gap: 8,
|
|
94
|
+
paddingVertical: 14,
|
|
95
|
+
paddingHorizontal: 16,
|
|
96
|
+
borderWidth: 2
|
|
97
|
+
},
|
|
98
|
+
label: {
|
|
99
|
+
fontSize: 15,
|
|
100
|
+
fontWeight: '600'
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
//# sourceMappingURL=payment-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useMemo","useState","ActivityIndicator","StyleSheet","Text","TouchableOpacity","View","ClockPayClient","resolveTheme","PaymentSheet","LogoIcon","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","PaymentButton","publicKey","clientSecret","appearance","label","disabled","apiBaseUrl","redirectUrl","onSuccess","onError","onClose","checkout","setCheckout","visible","setVisible","loading","setLoading","theme","initiate","client","response","initiatePayment","data","error","Error","handleClosed","children","activeOpacity","onPress","style","styles","button","backgroundColor","buttonBg","borderColor","buttonBorder","borderRadius","radius","opacity","size","color","buttonFg","fontFamily","onRequestClose","onClosed","create","flexDirection","alignItems","justifyContent","gap","paddingVertical","paddingHorizontal","borderWidth","fontSize","fontWeight"],"sourceRoot":"..\\..\\..\\src","sources":["components/payment-button.tsx"],"mappings":";;AAAA,SAASA,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACzC,SAASC,iBAAiB,EAAEC,UAAU,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,cAAc;AAE1F,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,QAAQ,QAAQ,SAAS;;AAElC;AACA;AACA;AACA;AAHA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAIA,OAAO,SAASC,aAAaA,CAAC;EAC5BC,SAAS;EACTC,YAAY;EACZC,UAAU;EACVC,KAAK,GAAG,mBAAmB;EAC3BC,QAAQ;EACRC,UAAU;EACVC,WAAW;EACXC,SAAS;EACTC,OAAO;EACPC;AACkB,CAAC,EAAE;EACrB,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAG5B,QAAQ,CAAsB,IAAI,CAAC;EACnE,MAAM,CAAC6B,OAAO,EAAEC,UAAU,CAAC,GAAG9B,QAAQ,CAAC,KAAK,CAAC;EAC7C,MAAM,CAAC+B,OAAO,EAAEC,UAAU,CAAC,GAAGhC,QAAQ,CAAC,KAAK,CAAC;EAE7C,MAAMiC,KAAK,GAAGlC,OAAO,CAAC,MAAMQ,YAAY,CAACY,UAAU,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEnE,MAAMe,QAAQ,GAAG,MAAAA,CAAA,KAAY;IAC3B,IAAIH,OAAO,EAAE;IACbC,UAAU,CAAC,IAAI,CAAC;IAChB,IAAI;MACF,MAAMG,MAAM,GAAG,IAAI7B,cAAc,CAACW,SAAS,EAAEK,UAAU,CAAC;MACxD,MAAMc,QAAQ,GAAG,MAAMD,MAAM,CAACE,eAAe,CAACnB,YAAY,CAAC;MAC3DU,WAAW,CAACQ,QAAQ,CAACE,IAAI,CAAC;MAC1BR,UAAU,CAAC,IAAI,CAAC;IAClB,CAAC,CAAC,OAAOS,KAAK,EAAE;MACdd,OAAO,GAAGc,KAAK,YAAYC,KAAK,GAAGD,KAAK,GAAG,IAAIC,KAAK,CAAC,gCAAgC,CAAC,CAAC;IACzF,CAAC,SAAS;MACRR,UAAU,CAAC,KAAK,CAAC;IACnB;EACF,CAAC;EAED,MAAMS,YAAY,GAAGA,CAAA,KAAM;IACzBb,WAAW,CAAC,IAAI,CAAC;IACjBF,OAAO,GAAG,CAAC;EACb,CAAC;EAED,oBACEX,KAAA,CAACV,IAAI;IAAAqC,QAAA,gBACH/B,IAAA,CAACP,gBAAgB;MACfuC,aAAa,EAAE,GAAI;MACnBtB,QAAQ,EAAEA,QAAQ,IAAIU,OAAQ;MAC9Ba,OAAO,EAAEV,QAAS;MAClBW,KAAK,EAAE,CACLC,MAAM,CAACC,MAAM,EACb;QACEC,eAAe,EAAEf,KAAK,CAACgB,QAAQ;QAC/BC,WAAW,EAAEjB,KAAK,CAACkB,YAAY;QAC/BC,YAAY,EAAEnB,KAAK,CAACoB,MAAM;QAC1BC,OAAO,EAAEjC,QAAQ,IAAIU,OAAO,GAAG,GAAG,GAAG;MACvC,CAAC,CACD;MAAAW,QAAA,EAEDX,OAAO,gBACNpB,IAAA,CAACV,iBAAiB;QAACsD,IAAI,EAAC,OAAO;QAACC,KAAK,EAAEvB,KAAK,CAACwB;MAAS,CAAE,CAAC,gBAEzD1C,KAAA,CAAAF,SAAA;QAAA6B,QAAA,gBACE/B,IAAA,CAACF,QAAQ;UAAC8C,IAAI,EAAE;QAAG,CAAE,CAAC,EACrB,OAAOnC,KAAK,KAAK,QAAQ,gBACxBT,IAAA,CAACR,IAAI;UAAC0C,KAAK,EAAE,CAACC,MAAM,CAAC1B,KAAK,EAAE;YAAEoC,KAAK,EAAEvB,KAAK,CAACwB,QAAQ;YAAEC,UAAU,EAAEzB,KAAK,CAACyB;UAAW,CAAC,CAAE;UAAAhB,QAAA,EAClFtB;QAAK,CACF,CAAC,GAEPA,KACD;MAAA,CACD;IACH,CACe,CAAC,EAElBO,QAAQ,iBACPhB,IAAA,CAACH,YAAY;MACXqB,OAAO,EAAEA,OAAQ;MACjBF,QAAQ,EAAEA,QAAS;MACnBV,SAAS,EAAEA,SAAU;MACrBK,UAAU,EAAEA,UAAW;MACvBW,KAAK,EAAEA,KAAM;MACbV,WAAW,EAAEA,WAAY;MACzBoC,cAAc,EAAEA,CAAA,KAAM7B,UAAU,CAAC,KAAK,CAAE;MACxC8B,QAAQ,EAAEnB,YAAa;MACvBjB,SAAS,EAAEA,SAAU;MACrBC,OAAO,EAAEA;IAAQ,CAClB,CACF;EAAA,CACG,CAAC;AAEX;AAEA,MAAMqB,MAAM,GAAG5C,UAAU,CAAC2D,MAAM,CAAC;EAC/Bd,MAAM,EAAE;IACNe,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE,QAAQ;IACxBC,GAAG,EAAE,CAAC;IACNC,eAAe,EAAE,EAAE;IACnBC,iBAAiB,EAAE,EAAE;IACrBC,WAAW,EAAE;EACf,CAAC;EACDhD,KAAK,EAAE;IAAEiD,QAAQ,EAAE,EAAE;IAAEC,UAAU,EAAE;EAAM;AAC3C,CAAC,CAAC","ignoreList":[]}
|