@one-payments/react 1.2.0 → 1.2.2
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/dist/index.cjs +2 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +28 -10
- package/dist/index.d.ts +28 -10
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -9,7 +9,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
|
9
9
|
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
10
10
|
|
|
11
11
|
// src/OnePayment.tsx
|
|
12
|
-
var
|
|
12
|
+
var OnePaymentBase = react.createComponent({
|
|
13
13
|
tagName: "one-payment",
|
|
14
14
|
elementClass: webComponents.OnePaymentElement,
|
|
15
15
|
react: React__default.default,
|
|
@@ -19,6 +19,7 @@ var OnePayment = react.createComponent({
|
|
|
19
19
|
onStateChange: "state-change"
|
|
20
20
|
}
|
|
21
21
|
});
|
|
22
|
+
var OnePayment = OnePaymentBase;
|
|
22
23
|
|
|
23
24
|
exports.OnePayment = OnePayment;
|
|
24
25
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/OnePayment.tsx"],"names":["createComponent","OnePaymentElement","React"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"sources":["../src/OnePayment.tsx"],"names":["createComponent","OnePaymentElement","React"],"mappings":";;;;;;;;;;;AA8DA,IAAM,iBAAiBA,qBAAA,CAAgB;AAAA,EACrC,OAAA,EAAS,aAAA;AAAA,EACT,YAAA,EAAcC,+BAAA;AAAA,EACd,KAAA,EAAOC,sBAAA;AAAA,EACP,MAAA,EAAQ;AAAA,IACN,gBAAA,EAAkB,iBAAA;AAAA,IAClB,cAAA,EAAgB,eAAA;AAAA,IAChB,aAAA,EAAe;AAAA;AAEnB,CAAC,CAAA;AAwBM,IAAM,UAAA,GAAa","file":"index.cjs","sourcesContent":["/**\n * React wrapper for <one-payment> web component\n * @module @one-payments/react\n */\n\nimport React from 'react';\nimport { createComponent, EventName } from '@lit/react';\nimport { OnePaymentElement } from '@one-payments/web-components';\nimport type {\n SDKConfig,\n PaymentSucceededPayload,\n PaymentFailedPayload,\n StateChangedPayload,\n Adapters,\n AppearanceOptions,\n} from '@one-payments/core';\n\n/**\n * Typed props interface for OnePayment React component\n */\nexport interface OnePaymentProps {\n config: SDKConfig;\n adapters: Adapters;\n amount: number;\n currency: string;\n orderId: string;\n firstName: string;\n lastName: string;\n email: string;\n excludePaymentMethods?: string[];\n width?: string;\n maxWidth?: string;\n metadata?: Record<string, string | number | boolean>;\n /**\n * Appearance customization options for theming and styling\n *\n * @example\n * ```tsx\n * // Dark theme\n * <OnePayment appearance={{ theme: 'dark' }} />\n *\n * // Custom colors\n * <OnePayment\n * appearance={{\n * theme: 'light',\n * variables: {\n * colorPrimary: '#6366f1',\n * borderRadius: '12px'\n * }\n * }}\n * />\n * ```\n */\n appearance?: AppearanceOptions;\n onPaymentSuccess?: (event: CustomEvent<PaymentSucceededPayload>) => void;\n onPaymentError?: (event: CustomEvent<PaymentFailedPayload>) => void;\n onStateChange?: (event: CustomEvent<StateChangedPayload>) => void;\n}\n\n/**\n * Internal component created by @lit/react\n */\nconst OnePaymentBase = createComponent({\n tagName: 'one-payment',\n elementClass: OnePaymentElement,\n react: React,\n events: {\n onPaymentSuccess: 'payment-success' as EventName<CustomEvent<PaymentSucceededPayload>>,\n onPaymentError: 'payment-error' as EventName<CustomEvent<PaymentFailedPayload>>,\n onStateChange: 'state-change' as EventName<CustomEvent<StateChangedPayload>>,\n },\n});\n\n/**\n * OnePayment React component wrapping <one-payment> custom element\n *\n * @example\n * ```tsx\n * import { OnePayment } from '@one-payments/react';\n * import { createWebAdapters } from '@one-payments/adapters-web';\n *\n * <OnePayment\n * config={{ apiKey: '...', secretKey: '...', environment: 'demo' }}\n * adapters={createWebAdapters()}\n * amount={10000}\n * currency=\"SGD\"\n * orderId=\"order-123\"\n * firstName=\"John\"\n * lastName=\"Doe\"\n * email=\"john@example.com\"\n * appearance={{ theme: 'dark' }}\n * onPaymentSuccess={(e) => console.log('Success:', e.detail)}\n * />\n * ```\n */\nexport const OnePayment = OnePaymentBase as React.ComponentType<OnePaymentProps>;\n"]}
|
package/dist/index.d.cts
CHANGED
|
@@ -1,17 +1,12 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { OnePaymentElement } from '@one-payments/web-components';
|
|
1
|
+
import React from 'react';
|
|
3
2
|
import { SDKConfig, Adapters, AppearanceOptions, PaymentSucceededPayload, PaymentFailedPayload, StateChangedPayload } from '@one-payments/core';
|
|
4
|
-
export { Adapters, PaymentFailedPayload, PaymentIntent, PaymentSucceededPayload, SDKConfig, State, StateChangedPayload } from '@one-payments/core';
|
|
3
|
+
export { Adapters, AppearanceOptions, AppearanceVariables, PaymentFailedPayload, PaymentIntent, PaymentSucceededPayload, SDKConfig, State, StateChangedPayload, ThemeMode } from '@one-payments/core';
|
|
5
4
|
|
|
6
5
|
/**
|
|
7
|
-
* React
|
|
8
|
-
*
|
|
6
|
+
* React wrapper for <one-payment> web component
|
|
7
|
+
* @module @one-payments/react
|
|
9
8
|
*/
|
|
10
|
-
|
|
11
|
-
onPaymentSuccess: string;
|
|
12
|
-
onPaymentError: string;
|
|
13
|
-
onStateChange: string;
|
|
14
|
-
}>;
|
|
9
|
+
|
|
15
10
|
/**
|
|
16
11
|
* Typed props interface for OnePayment React component
|
|
17
12
|
*/
|
|
@@ -53,5 +48,28 @@ interface OnePaymentProps {
|
|
|
53
48
|
onPaymentError?: (event: CustomEvent<PaymentFailedPayload>) => void;
|
|
54
49
|
onStateChange?: (event: CustomEvent<StateChangedPayload>) => void;
|
|
55
50
|
}
|
|
51
|
+
/**
|
|
52
|
+
* OnePayment React component wrapping <one-payment> custom element
|
|
53
|
+
*
|
|
54
|
+
* @example
|
|
55
|
+
* ```tsx
|
|
56
|
+
* import { OnePayment } from '@one-payments/react';
|
|
57
|
+
* import { createWebAdapters } from '@one-payments/adapters-web';
|
|
58
|
+
*
|
|
59
|
+
* <OnePayment
|
|
60
|
+
* config={{ apiKey: '...', secretKey: '...', environment: 'demo' }}
|
|
61
|
+
* adapters={createWebAdapters()}
|
|
62
|
+
* amount={10000}
|
|
63
|
+
* currency="SGD"
|
|
64
|
+
* orderId="order-123"
|
|
65
|
+
* firstName="John"
|
|
66
|
+
* lastName="Doe"
|
|
67
|
+
* email="john@example.com"
|
|
68
|
+
* appearance={{ theme: 'dark' }}
|
|
69
|
+
* onPaymentSuccess={(e) => console.log('Success:', e.detail)}
|
|
70
|
+
* />
|
|
71
|
+
* ```
|
|
72
|
+
*/
|
|
73
|
+
declare const OnePayment: React.ComponentType<OnePaymentProps>;
|
|
56
74
|
|
|
57
75
|
export { OnePayment, type OnePaymentProps };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,17 +1,12 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { OnePaymentElement } from '@one-payments/web-components';
|
|
1
|
+
import React from 'react';
|
|
3
2
|
import { SDKConfig, Adapters, AppearanceOptions, PaymentSucceededPayload, PaymentFailedPayload, StateChangedPayload } from '@one-payments/core';
|
|
4
|
-
export { Adapters, PaymentFailedPayload, PaymentIntent, PaymentSucceededPayload, SDKConfig, State, StateChangedPayload } from '@one-payments/core';
|
|
3
|
+
export { Adapters, AppearanceOptions, AppearanceVariables, PaymentFailedPayload, PaymentIntent, PaymentSucceededPayload, SDKConfig, State, StateChangedPayload, ThemeMode } from '@one-payments/core';
|
|
5
4
|
|
|
6
5
|
/**
|
|
7
|
-
* React
|
|
8
|
-
*
|
|
6
|
+
* React wrapper for <one-payment> web component
|
|
7
|
+
* @module @one-payments/react
|
|
9
8
|
*/
|
|
10
|
-
|
|
11
|
-
onPaymentSuccess: string;
|
|
12
|
-
onPaymentError: string;
|
|
13
|
-
onStateChange: string;
|
|
14
|
-
}>;
|
|
9
|
+
|
|
15
10
|
/**
|
|
16
11
|
* Typed props interface for OnePayment React component
|
|
17
12
|
*/
|
|
@@ -53,5 +48,28 @@ interface OnePaymentProps {
|
|
|
53
48
|
onPaymentError?: (event: CustomEvent<PaymentFailedPayload>) => void;
|
|
54
49
|
onStateChange?: (event: CustomEvent<StateChangedPayload>) => void;
|
|
55
50
|
}
|
|
51
|
+
/**
|
|
52
|
+
* OnePayment React component wrapping <one-payment> custom element
|
|
53
|
+
*
|
|
54
|
+
* @example
|
|
55
|
+
* ```tsx
|
|
56
|
+
* import { OnePayment } from '@one-payments/react';
|
|
57
|
+
* import { createWebAdapters } from '@one-payments/adapters-web';
|
|
58
|
+
*
|
|
59
|
+
* <OnePayment
|
|
60
|
+
* config={{ apiKey: '...', secretKey: '...', environment: 'demo' }}
|
|
61
|
+
* adapters={createWebAdapters()}
|
|
62
|
+
* amount={10000}
|
|
63
|
+
* currency="SGD"
|
|
64
|
+
* orderId="order-123"
|
|
65
|
+
* firstName="John"
|
|
66
|
+
* lastName="Doe"
|
|
67
|
+
* email="john@example.com"
|
|
68
|
+
* appearance={{ theme: 'dark' }}
|
|
69
|
+
* onPaymentSuccess={(e) => console.log('Success:', e.detail)}
|
|
70
|
+
* />
|
|
71
|
+
* ```
|
|
72
|
+
*/
|
|
73
|
+
declare const OnePayment: React.ComponentType<OnePaymentProps>;
|
|
56
74
|
|
|
57
75
|
export { OnePayment, type OnePaymentProps };
|
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@ import { createComponent } from '@lit/react';
|
|
|
3
3
|
import { OnePaymentElement } from '@one-payments/web-components';
|
|
4
4
|
|
|
5
5
|
// src/OnePayment.tsx
|
|
6
|
-
var
|
|
6
|
+
var OnePaymentBase = createComponent({
|
|
7
7
|
tagName: "one-payment",
|
|
8
8
|
elementClass: OnePaymentElement,
|
|
9
9
|
react: React,
|
|
@@ -13,6 +13,7 @@ var OnePayment = createComponent({
|
|
|
13
13
|
onStateChange: "state-change"
|
|
14
14
|
}
|
|
15
15
|
});
|
|
16
|
+
var OnePayment = OnePaymentBase;
|
|
16
17
|
|
|
17
18
|
export { OnePayment };
|
|
18
19
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/OnePayment.tsx"],"names":[],"mappings":";;;;;
|
|
1
|
+
{"version":3,"sources":["../src/OnePayment.tsx"],"names":[],"mappings":";;;;;AA8DA,IAAM,iBAAiB,eAAA,CAAgB;AAAA,EACrC,OAAA,EAAS,aAAA;AAAA,EACT,YAAA,EAAc,iBAAA;AAAA,EACd,KAAA,EAAO,KAAA;AAAA,EACP,MAAA,EAAQ;AAAA,IACN,gBAAA,EAAkB,iBAAA;AAAA,IAClB,cAAA,EAAgB,eAAA;AAAA,IAChB,aAAA,EAAe;AAAA;AAEnB,CAAC,CAAA;AAwBM,IAAM,UAAA,GAAa","file":"index.js","sourcesContent":["/**\n * React wrapper for <one-payment> web component\n * @module @one-payments/react\n */\n\nimport React from 'react';\nimport { createComponent, EventName } from '@lit/react';\nimport { OnePaymentElement } from '@one-payments/web-components';\nimport type {\n SDKConfig,\n PaymentSucceededPayload,\n PaymentFailedPayload,\n StateChangedPayload,\n Adapters,\n AppearanceOptions,\n} from '@one-payments/core';\n\n/**\n * Typed props interface for OnePayment React component\n */\nexport interface OnePaymentProps {\n config: SDKConfig;\n adapters: Adapters;\n amount: number;\n currency: string;\n orderId: string;\n firstName: string;\n lastName: string;\n email: string;\n excludePaymentMethods?: string[];\n width?: string;\n maxWidth?: string;\n metadata?: Record<string, string | number | boolean>;\n /**\n * Appearance customization options for theming and styling\n *\n * @example\n * ```tsx\n * // Dark theme\n * <OnePayment appearance={{ theme: 'dark' }} />\n *\n * // Custom colors\n * <OnePayment\n * appearance={{\n * theme: 'light',\n * variables: {\n * colorPrimary: '#6366f1',\n * borderRadius: '12px'\n * }\n * }}\n * />\n * ```\n */\n appearance?: AppearanceOptions;\n onPaymentSuccess?: (event: CustomEvent<PaymentSucceededPayload>) => void;\n onPaymentError?: (event: CustomEvent<PaymentFailedPayload>) => void;\n onStateChange?: (event: CustomEvent<StateChangedPayload>) => void;\n}\n\n/**\n * Internal component created by @lit/react\n */\nconst OnePaymentBase = createComponent({\n tagName: 'one-payment',\n elementClass: OnePaymentElement,\n react: React,\n events: {\n onPaymentSuccess: 'payment-success' as EventName<CustomEvent<PaymentSucceededPayload>>,\n onPaymentError: 'payment-error' as EventName<CustomEvent<PaymentFailedPayload>>,\n onStateChange: 'state-change' as EventName<CustomEvent<StateChangedPayload>>,\n },\n});\n\n/**\n * OnePayment React component wrapping <one-payment> custom element\n *\n * @example\n * ```tsx\n * import { OnePayment } from '@one-payments/react';\n * import { createWebAdapters } from '@one-payments/adapters-web';\n *\n * <OnePayment\n * config={{ apiKey: '...', secretKey: '...', environment: 'demo' }}\n * adapters={createWebAdapters()}\n * amount={10000}\n * currency=\"SGD\"\n * orderId=\"order-123\"\n * firstName=\"John\"\n * lastName=\"Doe\"\n * email=\"john@example.com\"\n * appearance={{ theme: 'dark' }}\n * onPaymentSuccess={(e) => console.log('Success:', e.detail)}\n * />\n * ```\n */\nexport const OnePayment = OnePaymentBase as React.ComponentType<OnePaymentProps>;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@one-payments/react",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.2",
|
|
4
4
|
"description": "React wrapper for One Payments SDK",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@one-payments/core": "
|
|
33
|
-
"@one-payments/web-components": "
|
|
32
|
+
"@one-payments/core": "^1.2.0",
|
|
33
|
+
"@one-payments/web-components": "^1.2.1",
|
|
34
34
|
"@lit/react": "^1.0.0"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|