diff --git a/.changeset/sweet-ghosts-act.md b/.changeset/sweet-ghosts-act.md deleted file mode 100644 index 8e7ce2adf..000000000 --- a/.changeset/sweet-ghosts-act.md +++ /dev/null @@ -1,106 +0,0 @@ ---- -"@coinbase/onchainkit": minor ---- - -- **feat**: Moved the `onError` and `onSuccess` lifecycle listeners from the `` component to the `` component. By @zizzamia #1139 - -Breaking Changes -OnchainKit standardizes lifecycle listeners with three callbacks: `onError`, `onSuccess`, and `onStatus`. The `onError` and `onSuccess` callbacks handle only the `error` and `success` states, respectively. In contrast, the `onStatus` callback provides more granular phases of each component's experience. - -Before, we used `onError` and `onSuccess` in the `` component. -```ts -const handleOnError = useCallback((error) => { - console.log(error); -}, []); - -const handleOnSuccess = useCallback((response) => { - console.log(response); -}, []); - -... - - - - - - - - -``` - -After, we use `onStatus` in the `` component. -```ts -const handleOnStatus = useCallback((lifeCycleStatus: LifeCycleStatus) => { - console.log('Status:', lifeCycleStatus); -}, []); - -... - - - - - - - - -``` - -The `onStatus` callback will expose -```ts -export type LifeCycleStatus = - | { - statusName: 'init'; - statusData: null; - } - | { - statusName: 'error'; - statusData: SwapError; - } - | { - statusName: 'amountChange'; - statusData: null; - } - | { - statusName: 'transactionPending'; - statusData: null; - } - | { - statusName: 'transactionApproved'; - statusData: { - transactionHash: Hex; - transactionType: 'ERC20' | 'Permit2'; - }; - } - | { - statusName: 'success'; - statusData: { - transactionReceipt: TransactionReceipt; - }; - }; -``` diff --git a/CHANGELOG.md b/CHANGELOG.md index 7ffbfa8f7..79c4c5603 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,115 @@ # Changelog +## 0.30.0 + +### Minor Changes + +- ed2379e: - **feat**: Moved the `onError` and `onSuccess` lifecycle listeners from the `` component to the `` component. By @zizzamia #1139 + + Breaking Changes + OnchainKit standardizes lifecycle listeners with three callbacks: `onError`, `onSuccess`, and `onStatus`. The `onError` and `onSuccess` callbacks handle only the `error` and `success` states, respectively. In contrast, the `onStatus` callback provides more granular phases of each component's experience. + + Before, we used `onError` and `onSuccess` in the `` component. + + ```ts + const handleOnError = useCallback((error) => { + console.log(error); + }, []); + + const handleOnSuccess = useCallback((response) => { + console.log(response); + }, []); + + ... + + + + + + + + + ``` + + After, we use `onStatus` in the `` component. + + ```ts + const handleOnStatus = useCallback((lifeCycleStatus: LifeCycleStatus) => { + console.log('Status:', lifeCycleStatus); + }, []); + + ... + + + + + + + + + ``` + + The `onStatus` callback will expose + + ```ts + export type LifeCycleStatus = + | { + statusName: "init"; + statusData: null; + } + | { + statusName: "error"; + statusData: SwapError; + } + | { + statusName: "amountChange"; + statusData: null; + } + | { + statusName: "transactionPending"; + statusData: null; + } + | { + statusName: "transactionApproved"; + statusData: { + transactionHash: Hex; + transactionType: "ERC20" | "Permit2"; + }; + } + | { + statusName: "success"; + statusData: { + transactionReceipt: TransactionReceipt; + }; + }; + ``` + ## 0.29.5 ### Patch Changes diff --git a/package.json b/package.json index 9869672b9..af3f0c6c0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@coinbase/onchainkit", - "version": "0.29.5", + "version": "0.30.0", "type": "module", "repository": "https://github.com/coinbase/onchainkit.git", "license": "MIT",