@akinon/pz-one-click-checkout 1.89.0-rc.2 → 1.89.0-rc.21

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/CHANGELOG.md CHANGED
@@ -1,5 +1,65 @@
1
1
  # @akinon/pz-one-click-checkout
2
2
 
3
+ ## 1.89.0-rc.21
4
+
5
+ ### Minor Changes
6
+
7
+ - e974d8e: ZERO-3406: Fix rc build
8
+
9
+ ## 1.89.0-rc.20
10
+
11
+ ## 1.89.0-rc.19
12
+
13
+ ## 1.89.0-rc.18
14
+
15
+ ## 1.89.0-rc.17
16
+
17
+ ## 1.89.0-rc.16
18
+
19
+ ## 1.89.0-rc.15
20
+
21
+ ## 1.89.0-rc.14
22
+
23
+ ## 1.89.0-rc.13
24
+
25
+ ## 1.89.0-rc.12
26
+
27
+ ## 1.89.0-rc.11
28
+
29
+ ### Minor Changes
30
+
31
+ - 99b3fd6: ZERO-3375: Add custom UI rendering option for OneClickCheckoutButton
32
+
33
+ ## 1.89.0-rc.10
34
+
35
+ ### Minor Changes
36
+
37
+ - 64699d3f: ZERO-2761: Fix invalid import for plugin module
38
+ - 7727ae55: ZERO-3073: Refactor basket page to use server-side data fetching and simplify component structure
39
+ - 33377cfd: ZERO-3267: Refactor import statement for ROUTES in error-page component
40
+ - c759d6b: ZERO-3336: Add data-testid attribute to OneClickCheckoutButton for improved testing
41
+
42
+ ## 1.89.0-rc.9
43
+
44
+ ### Minor Changes
45
+
46
+ - 64699d3f: ZERO-2761: Fix invalid import for plugin module
47
+ - 7727ae55: ZERO-3073: Refactor basket page to use server-side data fetching and simplify component structure
48
+ - 33377cfd: ZERO-3267: Refactor import statement for ROUTES in error-page component
49
+ - c759d6b: ZERO-3336: Add data-testid attribute to OneClickCheckoutButton for improved testing
50
+
51
+ ## 1.89.0-rc.8
52
+
53
+ ## 1.89.0-rc.7
54
+
55
+ ## 1.89.0-rc.6
56
+
57
+ ## 1.89.0-rc.5
58
+
59
+ ## 1.89.0-rc.4
60
+
61
+ ## 1.89.0-rc.3
62
+
3
63
  ## 1.89.0-rc.2
4
64
 
5
65
  ## 1.89.0-rc.1
package/README.md CHANGED
@@ -25,7 +25,43 @@ npx @akinon/projectzero@latest --plugins
25
25
  | content | `React.ReactNode` | It is used to create custom content. |
26
26
  | openMiniBasket | `boolean` | Manages the opening status of the minibasket. |
27
27
  | translations.buttonText | `string` | The text of the button. |
28
+ | customUIRender | `React.ReactNode` | Optional function to fully customize the button rendering. Receives onClick, disabled, loading, provider, productError and content props. |
28
29
 
29
- ```
30
+ ### Customizing Checkout Button
31
+
32
+ ```javascript
33
+ import PluginModule, { Component } from '@akinon/next/components/plugin-module';
34
+
35
+ <PluginModule
36
+ component={Component.OneClickCheckoutButtons}
37
+ props={{
38
+ customUIRender: ({
39
+ onClick,
40
+ disabled,
41
+ loading,
42
+ provider,
43
+ productError,
44
+ content
45
+ }) => (
46
+ <>
47
+ <button
48
+ onClick={onClick}
49
+ disabled={disabled}
50
+ className="relative w-full py-3 bg-[#ff2000] text-black hover:bg-[#547ee7] text-sm font-semibold flex items-center justify-center"
51
+ >
52
+ {loading && (
53
+ <span className="absolute left-3 w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin" />
54
+ )}
55
+ {loading ? 'Please wait...' : content ?? `Buy with ${provider.name}`}
56
+ </button>
30
57
 
58
+ {productError && (
59
+ <div className="mt-4 text-xs text-center text-[#d72b01]">
60
+ {productError}
61
+ </div>
62
+ )}
63
+ </>
64
+ )
65
+ }}
66
+ />;
31
67
  ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@akinon/pz-one-click-checkout",
3
- "version": "1.89.0-rc.2",
3
+ "version": "1.89.0-rc.21",
4
4
  "main": "./src/index.ts",
5
5
  "module": "./src/index.ts",
6
6
  "license": "MIT",
@@ -19,6 +19,14 @@ export interface OneClickCheckoutProps {
19
19
  buttonText?: string;
20
20
  };
21
21
  content?: React.ReactNode;
22
+ customUIRender?: (props: {
23
+ onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
24
+ disabled: boolean;
25
+ loading: boolean;
26
+ provider: OneClickCheckoutButtonProps['provider'];
27
+ productError?: string | null;
28
+ content?: React.ReactNode;
29
+ }) => React.ReactNode;
22
30
  }
23
31
 
24
32
  export interface OneClickCheckoutButtonProps extends OneClickCheckoutProps {
@@ -27,7 +27,8 @@ export const OneClickCheckoutButton = (props: OneClickCheckoutButtonProps) => {
27
27
  onError,
28
28
  provider,
29
29
  translations,
30
- content
30
+ content,
31
+ customUIRender
31
32
  } = props;
32
33
 
33
34
  const [disabled, setDisabled] = useState(isDisabled);
@@ -101,6 +102,17 @@ export const OneClickCheckoutButton = (props: OneClickCheckoutButtonProps) => {
101
102
  setDisabled(false);
102
103
  };
103
104
 
105
+ if (customUIRender) {
106
+ return customUIRender({
107
+ onClick: (e) => handleOnClick(e, provider?.pk),
108
+ disabled,
109
+ loading: disabled,
110
+ provider,
111
+ content,
112
+ productError
113
+ });
114
+ }
115
+
104
116
  return (
105
117
  <>
106
118
  <Button
@@ -120,7 +132,7 @@ export const OneClickCheckoutButton = (props: OneClickCheckoutButtonProps) => {
120
132
  >
121
133
  {content
122
134
  ? content
123
- : translations?.buttonText ?? `${provider.name} Checkout`}
135
+ : translations?.buttonText ?? `${provider?.name} Checkout`}
124
136
 
125
137
  {disabled && (
126
138
  <div className="absolute flex justify-center items-center bg-[#000000] opacity-50 w-full h-full">