From b44a6407d58d0d42f3aaeac9aee928ec1be900c4 Mon Sep 17 00:00:00 2001
From: PhatNH4 <phatnh4@vng.com.vn>
Date: Fri, 23 Aug 2024 15:05:38 +0700
Subject: [PATCH] integrate Checkout SDK option two

---
 app-config.json                          |   12 +-
 package-lock.json                        | 1184 ++++++++++++++++------
 package.json                             |    6 +-
 src/components/navigation.tsx            |    6 +-
 src/components/payment-icon.tsx          |  217 ++++
 src/hooks.ts                             |   43 +-
 src/pages/cart/delivery.tsx              |   19 +-
 src/pages/cart/payment-method-picker.tsx |   35 +
 src/pages/cart/preview.tsx               |   10 +-
 src/pages/result.tsx                     |  164 ++-
 src/state.ts                             |   12 +-
 src/utils/config.ts                      |    6 +
 src/utils/product.ts                     |   25 +-
 zmp-template.json                        |    4 +-
 14 files changed, 1308 insertions(+), 435 deletions(-)
 create mode 100644 src/components/payment-icon.tsx
 create mode 100644 src/pages/cart/payment-method-picker.tsx

diff --git a/app-config.json b/app-config.json
index 6595088..711ae7d 100644
--- a/app-config.json
+++ b/app-config.json
@@ -1,6 +1,6 @@
 {
   "app": {
-    "title": "ZaUI Coffee",
+    "title": "ZaUI Café",
     "headerColor": "",
     "textColor": "black",
     "statusBarColor": "#ffffff",
@@ -15,17 +15,11 @@
   "listCSS": [],
   "listSyncJS": [],
   "listAsyncJS": [],
-  "pages": [
-    "/user",
-    "/form",
-    "/dynamic-route",
-    "/about",
-    "/404"
-  ],
+  "pages": ["/user", "/form", "/dynamic-route", "/about", "/404"],
   "template": {
     "primaryColor": "#006af5",
     "prefixCurrencySymbol": false,
     "currencySymbol": "đ",
     "headerLogo": ""
   }
-}
\ No newline at end of file
+}
diff --git a/package-lock.json b/package-lock.json
index f5d0af9..a1c546f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19,7 +19,7 @@
         "react-router-dom": "^6.8.2",
         "recoil": "^0.7.7",
         "swiper": "^9.1.0",
-        "zmp-sdk": "^2.39.9",
+        "zmp-sdk": "^2.40.0-beta.3",
         "zmp-ui": "^1.6.0-rc.6"
       },
       "devDependencies": {
@@ -33,11 +33,24 @@
         "postcss-cli": "^8.3.1",
         "postcss-preset-env": "^6.7.0",
         "sass": "^1.58.3",
-        "tailwindcss": "^3.2.7",
-        "vite": "^2.6.14",
+        "tailwindcss": "^3.4.10",
+        "vite": "^2.9.18",
         "vite-tsconfig-paths": "^4.0.5"
       }
     },
+    "node_modules/@alloc/quick-lru": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
+      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@ampproject/remapping": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.0.tgz",
@@ -473,6 +486,126 @@
         "node": ">=4.0.0"
       }
     },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz",
+      "integrity": "sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@isaacs/cliui": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^5.1.2",
+        "string-width-cjs": "npm:string-width@^4.2.0",
+        "strip-ansi": "^7.0.1",
+        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+        "wrap-ansi": "^8.1.0",
+        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.0.1.tgz",
+      "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@isaacs/cliui/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz",
@@ -494,9 +627,10 @@
       }
     },
     "node_modules/@jridgewell/set-array": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
-      "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
+      "license": "MIT",
       "engines": {
         "node": ">=6.0.0"
       }
@@ -507,12 +641,13 @@
       "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw=="
     },
     "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.17",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz",
-      "integrity": "sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==",
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "license": "MIT",
       "dependencies": {
-        "@jridgewell/resolve-uri": "3.1.0",
-        "@jridgewell/sourcemap-codec": "1.4.14"
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
     "node_modules/@nicolo-ribaudo/chokidar-2": {
@@ -556,6 +691,17 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@pkgjs/parseargs": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/@react-spring/animated": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/@react-spring/animated/-/animated-9.6.1.tgz",
@@ -844,38 +990,6 @@
         "node": ">=12.0.0"
       }
     },
-    "node_modules/acorn": {
-      "version": "7.4.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
-      "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
-      "dev": true,
-      "bin": {
-        "acorn": "bin/acorn"
-      },
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
-    "node_modules/acorn-node": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/acorn-node/-/acorn-node-1.8.2.tgz",
-      "integrity": "sha512-8mt+fslDufLYntIoPAaIMUe/lrbrehIiwmR3t2k9LljIzoigEPF27eLk2hy8zSGzmR/ogr7zbRKINMo1u0yh5A==",
-      "dev": true,
-      "dependencies": {
-        "acorn": "^7.0.0",
-        "acorn-walk": "^7.0.0",
-        "xtend": "^4.0.2"
-      }
-    },
-    "node_modules/acorn-walk": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
-      "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
     "node_modules/ansi-regex": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -895,6 +1009,13 @@
         "node": ">=4"
       }
     },
+    "node_modules/any-promise": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
+      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -1342,15 +1463,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/defined": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.1.tgz",
-      "integrity": "sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==",
-      "dev": true,
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/dependency-graph": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/dependency-graph/-/dependency-graph-0.9.0.tgz",
@@ -1360,23 +1472,6 @@
         "node": ">= 0.6.0"
       }
     },
-    "node_modules/detective": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/detective/-/detective-5.2.1.tgz",
-      "integrity": "sha512-v9XE1zRnz1wRtgurGu0Bs8uHKFSTdteYZNbIPFVhUZ39L/S79ppMpdmVOZAnoz1jfEFodc48n6MX483Xo3t1yw==",
-      "dev": true,
-      "dependencies": {
-        "acorn-node": "^1.8.2",
-        "defined": "^1.0.0",
-        "minimist": "^1.2.6"
-      },
-      "bin": {
-        "detective": "bin/detective.js"
-      },
-      "engines": {
-        "node": ">=0.8.0"
-      }
-    },
     "node_modules/didyoumean": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
@@ -1415,6 +1510,13 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/eastasianwidth": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.4.315",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.315.tgz",
@@ -1431,254 +1533,381 @@
       "integrity": "sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw=="
     },
     "node_modules/esbuild": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.13.15.tgz",
-      "integrity": "sha512-raCxt02HBKv8RJxE8vkTSCXGIyKHdEdGfUmiYb8wnabnaEmHzyW7DCHb5tEN0xU8ryqg5xw54mcwnYkC4x3AIw==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.14.54.tgz",
+      "integrity": "sha512-Cy9llcy8DvET5uznocPyqL3BFRrFXSVqbgpMJ9Wz8oVjZlh/zUSNbPRbov0VX7VxN2JH1Oa0uNxZ7eLRb62pJA==",
       "dev": true,
       "hasInstallScript": true,
+      "license": "MIT",
       "bin": {
         "esbuild": "bin/esbuild"
       },
+      "engines": {
+        "node": ">=12"
+      },
       "optionalDependencies": {
-        "esbuild-android-arm64": "0.13.15",
-        "esbuild-darwin-64": "0.13.15",
-        "esbuild-darwin-arm64": "0.13.15",
-        "esbuild-freebsd-64": "0.13.15",
-        "esbuild-freebsd-arm64": "0.13.15",
-        "esbuild-linux-32": "0.13.15",
-        "esbuild-linux-64": "0.13.15",
-        "esbuild-linux-arm": "0.13.15",
-        "esbuild-linux-arm64": "0.13.15",
-        "esbuild-linux-mips64le": "0.13.15",
-        "esbuild-linux-ppc64le": "0.13.15",
-        "esbuild-netbsd-64": "0.13.15",
-        "esbuild-openbsd-64": "0.13.15",
-        "esbuild-sunos-64": "0.13.15",
-        "esbuild-windows-32": "0.13.15",
-        "esbuild-windows-64": "0.13.15",
-        "esbuild-windows-arm64": "0.13.15"
+        "@esbuild/linux-loong64": "0.14.54",
+        "esbuild-android-64": "0.14.54",
+        "esbuild-android-arm64": "0.14.54",
+        "esbuild-darwin-64": "0.14.54",
+        "esbuild-darwin-arm64": "0.14.54",
+        "esbuild-freebsd-64": "0.14.54",
+        "esbuild-freebsd-arm64": "0.14.54",
+        "esbuild-linux-32": "0.14.54",
+        "esbuild-linux-64": "0.14.54",
+        "esbuild-linux-arm": "0.14.54",
+        "esbuild-linux-arm64": "0.14.54",
+        "esbuild-linux-mips64le": "0.14.54",
+        "esbuild-linux-ppc64le": "0.14.54",
+        "esbuild-linux-riscv64": "0.14.54",
+        "esbuild-linux-s390x": "0.14.54",
+        "esbuild-netbsd-64": "0.14.54",
+        "esbuild-openbsd-64": "0.14.54",
+        "esbuild-sunos-64": "0.14.54",
+        "esbuild-windows-32": "0.14.54",
+        "esbuild-windows-64": "0.14.54",
+        "esbuild-windows-arm64": "0.14.54"
+      }
+    },
+    "node_modules/esbuild-android-64": {
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.54.tgz",
+      "integrity": "sha512-Tz2++Aqqz0rJ7kYBfz+iqyE3QMycD4vk7LBRyWaAVFgFtQ/O8EJOnVmTOiDWYZ/uYzB4kvP+bqejYdVKzE5lAQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
       }
     },
     "node_modules/esbuild-android-arm64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.13.15.tgz",
-      "integrity": "sha512-m602nft/XXeO8YQPUDVoHfjyRVPdPgjyyXOxZ44MK/agewFFkPa8tUo6lAzSWh5Ui5PB4KR9UIFTSBKh/RrCmg==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.54.tgz",
+      "integrity": "sha512-F9E+/QDi9sSkLaClO8SOV6etqPd+5DgJje1F9lOWoNncDdOBL2YF59IhsWATSt0TLZbYCf3pNlTHvVV5VfHdvg==",
       "cpu": [
         "arm64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "android"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-darwin-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.13.15.tgz",
-      "integrity": "sha512-ihOQRGs2yyp7t5bArCwnvn2Atr6X4axqPpEdCFPVp7iUj4cVSdisgvEKdNR7yH3JDjW6aQDw40iQFoTqejqxvQ==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.54.tgz",
+      "integrity": "sha512-jtdKWV3nBviOd5v4hOpkVmpxsBy90CGzebpbO9beiqUYVMBtSc0AL9zGftFuBon7PNDcdvNCEuQqw2x0wP9yug==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-darwin-arm64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.13.15.tgz",
-      "integrity": "sha512-i1FZssTVxUqNlJ6cBTj5YQj4imWy3m49RZRnHhLpefFIh0To05ow9DTrXROTE1urGTQCloFUXTX8QfGJy1P8dQ==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.54.tgz",
+      "integrity": "sha512-OPafJHD2oUPyvJMrsCvDGkRrVCar5aVyHfWGQzY1dWnzErjrDuSETxwA2HSsyg2jORLY8yBfzc1MIpUkXlctmw==",
       "cpu": [
         "arm64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-freebsd-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.13.15.tgz",
-      "integrity": "sha512-G3dLBXUI6lC6Z09/x+WtXBXbOYQZ0E8TDBqvn7aMaOCzryJs8LyVXKY4CPnHFXZAbSwkCbqiPuSQ1+HhrNk7EA==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.54.tgz",
+      "integrity": "sha512-OKwd4gmwHqOTp4mOGZKe/XUlbDJ4Q9TjX0hMPIDBUWWu/kwhBAudJdBoxnjNf9ocIB6GN6CPowYpR/hRCbSYAg==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "freebsd"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-freebsd-arm64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.13.15.tgz",
-      "integrity": "sha512-KJx0fzEDf1uhNOZQStV4ujg30WlnwqUASaGSFPhznLM/bbheu9HhqZ6mJJZM32lkyfGJikw0jg7v3S0oAvtvQQ==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.54.tgz",
+      "integrity": "sha512-sFwueGr7OvIFiQT6WeG0jRLjkjdqWWSrfbVwZp8iMP+8UHEHRBvlaxL6IuKNDwAozNUmbb8nIMXa7oAOARGs1Q==",
       "cpu": [
         "arm64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "freebsd"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-32": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.13.15.tgz",
-      "integrity": "sha512-ZvTBPk0YWCLMCXiFmD5EUtB30zIPvC5Itxz0mdTu/xZBbbHJftQgLWY49wEPSn2T/TxahYCRDWun5smRa0Tu+g==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.54.tgz",
+      "integrity": "sha512-1ZuY+JDI//WmklKlBgJnglpUL1owm2OX+8E1syCD6UAxcMM/XoWd76OHSjl/0MR0LisSAXDqgjT3uJqT67O3qw==",
       "cpu": [
         "ia32"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.13.15.tgz",
-      "integrity": "sha512-eCKzkNSLywNeQTRBxJRQ0jxRCl2YWdMB3+PkWFo2BBQYC5mISLIVIjThNtn6HUNqua1pnvgP5xX0nHbZbPj5oA==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.54.tgz",
+      "integrity": "sha512-EgjAgH5HwTbtNsTqQOXWApBaPVdDn7XcK+/PtJwZLT1UmpLoznPd8c5CxqsH2dQK3j05YsB3L17T8vE7cp4cCg==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-arm": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.13.15.tgz",
-      "integrity": "sha512-wUHttDi/ol0tD8ZgUMDH8Ef7IbDX+/UsWJOXaAyTdkT7Yy9ZBqPg8bgB/Dn3CZ9SBpNieozrPRHm0BGww7W/jA==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.54.tgz",
+      "integrity": "sha512-qqz/SjemQhVMTnvcLGoLOdFpCYbz4v4fUo+TfsWG+1aOu70/80RV6bgNpR2JCrppV2moUQkww+6bWxXRL9YMGw==",
       "cpu": [
         "arm"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-arm64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.13.15.tgz",
-      "integrity": "sha512-bYpuUlN6qYU9slzr/ltyLTR9YTBS7qUDymO8SV7kjeNext61OdmqFAzuVZom+OLW1HPHseBfJ/JfdSlx8oTUoA==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.54.tgz",
+      "integrity": "sha512-WL71L+0Rwv+Gv/HTmxTEmpv0UgmxYa5ftZILVi2QmZBgX3q7+tDeOQNqGtdXSdsL8TQi1vIaVFHUPDe0O0kdig==",
       "cpu": [
         "arm64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-mips64le": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.13.15.tgz",
-      "integrity": "sha512-KlVjIG828uFPyJkO/8gKwy9RbXhCEUeFsCGOJBepUlpa7G8/SeZgncUEz/tOOUJTcWMTmFMtdd3GElGyAtbSWg==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.54.tgz",
+      "integrity": "sha512-qTHGQB8D1etd0u1+sB6p0ikLKRVuCWhYQhAHRPkO+OF3I/iSlTKNNS0Lh2Oc0g0UFGguaFZZiPJdJey3AGpAlw==",
       "cpu": [
         "mips64el"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-linux-ppc64le": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.13.15.tgz",
-      "integrity": "sha512-h6gYF+OsaqEuBjeesTBtUPw0bmiDu7eAeuc2OEH9S6mV9/jPhPdhOWzdeshb0BskRZxPhxPOjqZ+/OqLcxQwEQ==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.54.tgz",
+      "integrity": "sha512-j3OMlzHiqwZBDPRCDFKcx595XVfOfOnv68Ax3U4UKZ3MTYQB5Yz3X1mn5GnodEVYzhtZgxEBidLWeIs8FDSfrQ==",
       "cpu": [
         "ppc64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-riscv64": {
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.54.tgz",
+      "integrity": "sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/esbuild-linux-s390x": {
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.54.tgz",
+      "integrity": "sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-netbsd-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.13.15.tgz",
-      "integrity": "sha512-3+yE9emwoevLMyvu+iR3rsa+Xwhie7ZEHMGDQ6dkqP/ndFzRHkobHUKTe+NCApSqG5ce2z4rFu+NX/UHnxlh3w==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.54.tgz",
+      "integrity": "sha512-PR01lmIMnfJTgeU9VJTDY9ZerDWVFIUzAtJuDHwwceppW7cQWjBBqP48NdeRtoP04/AtO9a7w3viI+PIDr6d+w==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "netbsd"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-openbsd-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.13.15.tgz",
-      "integrity": "sha512-wTfvtwYJYAFL1fSs8yHIdf5GEE4NkbtbXtjLWjM3Cw8mmQKqsg8kTiqJ9NJQe5NX/5Qlo7Xd9r1yKMMkHllp5g==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.54.tgz",
+      "integrity": "sha512-Qyk7ikT2o7Wu76UsvvDS5q0amJvmRzDyVlL0qf5VLsLchjCa1+IAvd8kTBgUxD7VBUUVgItLkk609ZHUc1oCaw==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "openbsd"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-sunos-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.13.15.tgz",
-      "integrity": "sha512-lbivT9Bx3t1iWWrSnGyBP9ODriEvWDRiweAs69vI+miJoeKwHWOComSRukttbuzjZ8r1q0mQJ8Z7yUsDJ3hKdw==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.54.tgz",
+      "integrity": "sha512-28GZ24KmMSeKi5ueWzMcco6EBHStL3B6ubM7M51RmPwXQGLe0teBGJocmWhgwccA1GeFXqxzILIxXpHbl9Q/Kw==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "sunos"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-windows-32": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.13.15.tgz",
-      "integrity": "sha512-fDMEf2g3SsJ599MBr50cY5ve5lP1wyVwTe6aLJsM01KtxyKkB4UT+fc5MXQFn3RLrAIAZOG+tHC+yXObpSn7Nw==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.54.tgz",
+      "integrity": "sha512-T+rdZW19ql9MjS7pixmZYVObd9G7kcaZo+sETqNH4RCkuuYSuv9AGHUVnPoP9hhuE1WM1ZimHz1CIBHBboLU7w==",
       "cpu": [
         "ia32"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-windows-64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.13.15.tgz",
-      "integrity": "sha512-9aMsPRGDWCd3bGjUIKG/ZOJPKsiztlxl/Q3C1XDswO6eNX/Jtwu4M+jb6YDH9hRSUflQWX0XKAfWzgy5Wk54JQ==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.54.tgz",
+      "integrity": "sha512-AoHTRBUuYwXtZhjXZbA1pGfTo8cJo3vZIcWGLiUcTNgHpJJMC1rVA44ZereBHMJtotyN71S8Qw0npiCIkW96cQ==",
       "cpu": [
         "x64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/esbuild-windows-arm64": {
-      "version": "0.13.15",
-      "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.13.15.tgz",
-      "integrity": "sha512-zzvyCVVpbwQQATaf3IG8mu1IwGEiDxKkYUdA4FpoCHi1KtPa13jeScYDjlW0Qh+ebWzpKfR2ZwvqAQkSWNcKjA==",
+      "version": "0.14.54",
+      "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.54.tgz",
+      "integrity": "sha512-M0kuUvXhot1zOISQGXwWn6YtS+Y/1RT9WrVIOywZnJHo3jCDyewAc79aKNQWFCQm+xNHVTq9h8dZKvygoXQQRg==",
       "cpu": [
         "arm64"
       ],
       "dev": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "engines": {
+        "node": ">=12"
+      }
     },
     "node_modules/escalade": {
       "version": "3.1.1",
@@ -1707,10 +1936,11 @@
       "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
     },
     "node_modules/fast-glob": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz",
-      "integrity": "sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==",
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
+      "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
         "@nodelib/fs.walk": "^1.2.3",
@@ -1762,6 +1992,23 @@
       "deprecated": "flatten is deprecated in favor of utility frameworks such as lodash.",
       "dev": true
     },
+    "node_modules/foreground-child": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.0.tgz",
+      "integrity": "sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "cross-spawn": "^7.0.0",
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/fraction.js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -1815,9 +2062,13 @@
       }
     },
     "node_modules/function-bind": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
     },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
@@ -1932,17 +2183,6 @@
       "resolved": "https://registry.npmjs.org/hamt_plus/-/hamt_plus-1.0.2.tgz",
       "integrity": "sha512-t2JXKaehnMb9paaYA7J0BX8QQAY8lwfQ9Gjf4pg/mk4krt+cmwmU652HOoWonf+7+EQV97ARPMhhVgU1ra2GhA=="
     },
-    "node_modules/has": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
-      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-      "dependencies": {
-        "function-bind": "^1.1.1"
-      },
-      "engines": {
-        "node": ">= 0.4.0"
-      }
-    },
     "node_modules/has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@@ -1951,6 +2191,18 @@
         "node": ">=4"
       }
     },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz",
@@ -1999,11 +2251,15 @@
       }
     },
     "node_modules/is-core-module": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.11.0.tgz",
-      "integrity": "sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==",
+      "version": "2.15.1",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.15.1.tgz",
+      "integrity": "sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==",
+      "license": "MIT",
       "dependencies": {
-        "has": "^1.0.3"
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -2053,6 +2309,32 @@
       "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
       "dev": true
     },
+    "node_modules/jackspeak": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "@isaacs/cliui": "^8.0.2"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      },
+      "optionalDependencies": {
+        "@pkgjs/parseargs": "^0.11.0"
+      }
+    },
+    "node_modules/jiti": {
+      "version": "1.21.6",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz",
+      "integrity": "sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jiti": "bin/jiti.js"
+      }
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -2093,14 +2375,22 @@
       }
     },
     "node_modules/lilconfig": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.0.6.tgz",
-      "integrity": "sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
+      "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=10"
       }
     },
+    "node_modules/lines-and-columns": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
+      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/locate-path": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
@@ -2189,13 +2479,14 @@
         "node": "*"
       }
     },
-    "node_modules/minimist": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
-      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
+    "node_modules/minipass": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
+      "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
       "dev": true,
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
+      "license": "ISC",
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
       }
     },
     "node_modules/ms": {
@@ -2203,11 +2494,30 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
+    "node_modules/mz": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
+      "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "any-promise": "^1.0.0",
+        "object-assign": "^4.0.1",
+        "thenify-all": "^1.0.0"
+      }
+    },
     "node_modules/nanoid": {
-      "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz",
-      "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==",
+      "version": "3.3.7",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
+      "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
       "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
       "bin": {
         "nanoid": "bin/nanoid.cjs"
       },
@@ -2308,6 +2618,13 @@
         "node": ">=6"
       }
     },
+    "node_modules/package-json-from-dist": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.0.tgz",
+      "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0"
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -2333,10 +2650,34 @@
         "node": ">=8"
       }
     },
-    "node_modules/path-parse": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="
+    "node_modules/path-parse": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="
+    },
+    "node_modules/path-scurry": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^10.2.0",
+        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/path-type": {
       "version": "4.0.0",
@@ -2348,9 +2689,10 @@
       }
     },
     "node_modules/picocolors": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
-      "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
+      "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==",
+      "license": "ISC"
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -2371,6 +2713,16 @@
         "node": ">=6"
       }
     },
+    "node_modules/pirates": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
+      "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/pngjs": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
@@ -2380,9 +2732,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.21",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz",
-      "integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==",
+      "version": "8.4.41",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
+      "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
       "dev": true,
       "funding": [
         {
@@ -2392,12 +2744,17 @@
         {
           "type": "tidelift",
           "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
         }
       ],
+      "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.4",
-        "picocolors": "^1.0.0",
-        "source-map-js": "^1.0.2"
+        "nanoid": "^3.3.7",
+        "picocolors": "^1.0.1",
+        "source-map-js": "^1.2.0"
       },
       "engines": {
         "node": "^10 || ^12 || >=14"
@@ -3216,17 +3573,18 @@
       }
     },
     "node_modules/postcss-import": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-14.1.0.tgz",
-      "integrity": "sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==",
+      "version": "15.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
+      "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "postcss-value-parser": "^4.0.0",
         "read-cache": "^1.0.0",
         "resolve": "^1.1.7"
       },
       "engines": {
-        "node": ">=10.0.0"
+        "node": ">=14.0.0"
       },
       "peerDependencies": {
         "postcss": "^8.0.0"
@@ -3420,20 +3778,27 @@
       }
     },
     "node_modules/postcss-nested": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.0.tgz",
-      "integrity": "sha512-0DkamqrPcmkBDsLn+vQDIrtkSbNkv5AD/M322ySo9kqFkCIYklym2xEmWkwo+Y3/qZo34tzEPNUw4y7yMCdv5w==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz",
+      "integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==",
       "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
       "dependencies": {
-        "postcss-selector-parser": "^6.0.10"
+        "postcss-selector-parser": "^6.1.1"
       },
       "engines": {
         "node": ">=12.0"
       },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
       "peerDependencies": {
         "postcss": "^8.2.14"
       }
@@ -3443,6 +3808,7 @@
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
       "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "cssesc": "bin/cssesc"
       },
@@ -3451,10 +3817,11 @@
       }
     },
     "node_modules/postcss-nested/node_modules/postcss-selector-parser": {
-      "version": "6.0.11",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz",
-      "integrity": "sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==",
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
+      "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -3938,18 +4305,6 @@
         }
       ]
     },
-    "node_modules/quick-lru": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-5.1.1.tgz",
-      "integrity": "sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/raven-js": {
       "version": "3.27.2",
       "resolved": "https://registry.npmjs.org/raven-js/-/raven-js-3.27.2.tgz",
@@ -4110,11 +4465,12 @@
       "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
     },
     "node_modules/resolve": {
-      "version": "1.22.1",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.1.tgz",
-      "integrity": "sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==",
+      "version": "1.22.8",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",
+      "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",
+      "license": "MIT",
       "dependencies": {
-        "is-core-module": "^2.9.0",
+        "is-core-module": "^2.13.0",
         "path-parse": "^1.0.7",
         "supports-preserve-symlinks-flag": "^1.0.0"
       },
@@ -4136,10 +4492,11 @@
       }
     },
     "node_modules/rollup": {
-      "version": "2.79.1",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.79.1.tgz",
-      "integrity": "sha512-uKxbd0IhMZOhjAiD5oAFp7BqvkA4Dv47qpOCtaNvng4HBwdbWtdOh8f5nZNuk2rp51PMGk3bzfWu5oayNEuYnw==",
+      "version": "2.77.3",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.77.3.tgz",
+      "integrity": "sha512-/qxNTG7FbmefJWoeeYJFbHehJ2HNWnjkAFRKzWN/45eNBBF/r8lo992CwcJXEzyVxs5FmfId+vTSTQDb+bxA+g==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "rollup": "dist/bin/rollup"
       },
@@ -4232,6 +4589,19 @@
         "node": ">=8"
       }
     },
+    "node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/slash": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
@@ -4250,10 +4620,11 @@
       }
     },
     "node_modules/source-map-js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
       "dev": true,
+      "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4276,6 +4647,22 @@
         "node": ">=8"
       }
     },
+    "node_modules/string-width-cjs": {
+      "name": "string-width",
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/strip-ansi": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
@@ -4287,6 +4674,105 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-ansi-cjs": {
+      "name": "strip-ansi",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/sucrase": {
+      "version": "3.35.0",
+      "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
+      "integrity": "sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.2",
+        "commander": "^4.0.0",
+        "glob": "^10.3.10",
+        "lines-and-columns": "^1.1.6",
+        "mz": "^2.7.0",
+        "pirates": "^4.0.1",
+        "ts-interface-checker": "^0.1.9"
+      },
+      "bin": {
+        "sucrase": "bin/sucrase",
+        "sucrase-node": "bin/sucrase-node"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/sucrase/node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
+      "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/set-array": "^1.2.1",
+        "@jridgewell/sourcemap-codec": "^1.4.10",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/sucrase/node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/sucrase/node_modules/glob": {
+      "version": "10.4.5",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
+      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/sucrase/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/supports-color": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -4331,52 +4817,43 @@
       }
     },
     "node_modules/tailwindcss": {
-      "version": "3.2.7",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.2.7.tgz",
-      "integrity": "sha512-B6DLqJzc21x7wntlH/GsZwEXTBttVSl1FtCzC8WP4oBc/NKef7kaax5jeihkkCEWc831/5NDJ9gRNDK6NEioQQ==",
+      "version": "3.4.10",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.10.tgz",
+      "integrity": "sha512-KWZkVPm7yJRhdu4SRSl9d4AK2wM3a50UsvgHZO7xY77NQr2V+fIrEuoDGQcbvswWvFGbS2f6e+jC/6WJm1Dl0w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
+        "@alloc/quick-lru": "^5.2.0",
         "arg": "^5.0.2",
         "chokidar": "^3.5.3",
-        "color-name": "^1.1.4",
-        "detective": "^5.2.1",
         "didyoumean": "^1.2.2",
         "dlv": "^1.1.3",
-        "fast-glob": "^3.2.12",
+        "fast-glob": "^3.3.0",
         "glob-parent": "^6.0.2",
         "is-glob": "^4.0.3",
-        "lilconfig": "^2.0.6",
+        "jiti": "^1.21.0",
+        "lilconfig": "^2.1.0",
         "micromatch": "^4.0.5",
         "normalize-path": "^3.0.0",
         "object-hash": "^3.0.0",
         "picocolors": "^1.0.0",
-        "postcss": "^8.0.9",
-        "postcss-import": "^14.1.0",
-        "postcss-js": "^4.0.0",
-        "postcss-load-config": "^3.1.4",
-        "postcss-nested": "6.0.0",
+        "postcss": "^8.4.23",
+        "postcss-import": "^15.1.0",
+        "postcss-js": "^4.0.1",
+        "postcss-load-config": "^4.0.1",
+        "postcss-nested": "^6.0.1",
         "postcss-selector-parser": "^6.0.11",
-        "postcss-value-parser": "^4.2.0",
-        "quick-lru": "^5.1.1",
-        "resolve": "^1.22.1"
+        "resolve": "^1.22.2",
+        "sucrase": "^3.32.0"
       },
       "bin": {
         "tailwind": "lib/cli.js",
         "tailwindcss": "lib/cli.js"
       },
       "engines": {
-        "node": ">=12.13.0"
-      },
-      "peerDependencies": {
-        "postcss": "^8.0.9"
+        "node": ">=14.0.0"
       }
     },
-    "node_modules/tailwindcss/node_modules/color-name": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
-    },
     "node_modules/tailwindcss/node_modules/cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -4401,6 +4878,55 @@
         "node": ">=10.13.0"
       }
     },
+    "node_modules/tailwindcss/node_modules/postcss-load-config": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
+      "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "lilconfig": "^3.0.0",
+        "yaml": "^2.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      },
+      "peerDependencies": {
+        "postcss": ">=8.0.9",
+        "ts-node": ">=9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "postcss": {
+          "optional": true
+        },
+        "ts-node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/tailwindcss/node_modules/postcss-load-config/node_modules/lilconfig": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.2.tgz",
+      "integrity": "sha512-eop+wDAvpItUys0FWkHIKeC9ybYrTGbU41U5K7+bttZZeohvnY7M9dZ5kB21GNWiFT2q1OoPTvncPCgSOVO5ow==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antonk52"
+      }
+    },
     "node_modules/tailwindcss/node_modules/postcss-selector-parser": {
       "version": "6.0.11",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz",
@@ -4414,12 +4940,48 @@
         "node": ">=4"
       }
     },
+    "node_modules/tailwindcss/node_modules/yaml": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.5.0.tgz",
+      "integrity": "sha512-2wWLbGbYDiSqqIKoPjar3MPgB94ErzCtrNE1FdqGuaO0pi2JGjmE8aW8TDZwzU7vuxcGRdL/4gPQwQ7hD5AMSw==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/thenby": {
       "version": "1.3.4",
       "resolved": "https://registry.npmjs.org/thenby/-/thenby-1.3.4.tgz",
       "integrity": "sha512-89Gi5raiWA3QZ4b2ePcEwswC3me9JIg+ToSgtE0JWeCynLnLxNr/f9G+xfo9K+Oj4AFdom8YNJjibIARTJmapQ==",
       "dev": true
     },
+    "node_modules/thenify": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
+      "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "any-promise": "^1.0.0"
+      }
+    },
+    "node_modules/thenify-all": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
+      "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "thenify": ">= 3.1.0 < 4"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
     "node_modules/to-fast-properties": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@@ -4440,6 +5002,13 @@
         "node": ">=8.0"
       }
     },
+    "node_modules/ts-interface-checker": {
+      "version": "0.1.13",
+      "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
+      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
     "node_modules/tsconfck": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/tsconfck/-/tsconfck-2.0.3.tgz",
@@ -4512,15 +5081,16 @@
       "dev": true
     },
     "node_modules/vite": {
-      "version": "2.6.14",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-2.6.14.tgz",
-      "integrity": "sha512-2HA9xGyi+EhY2MXo0+A2dRsqsAG3eFNEVIo12olkWhOmc8LfiM+eMdrXf+Ruje9gdXgvSqjLI9freec1RUM5EA==",
+      "version": "2.9.18",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-2.9.18.tgz",
+      "integrity": "sha512-sAOqI5wNM9QvSEE70W3UGMdT8cyEn0+PmJMTFvTB8wB0YbYUWw3gUbY62AOyrXosGieF2htmeLATvNxpv/zNyQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "esbuild": "^0.13.2",
-        "postcss": "^8.3.8",
-        "resolve": "^1.20.0",
-        "rollup": "^2.57.0"
+        "esbuild": "^0.14.27",
+        "postcss": "^8.4.13",
+        "resolve": "^1.22.0",
+        "rollup": ">=2.59.0 <2.78.0"
       },
       "bin": {
         "vite": "bin/vite.js"
@@ -4592,6 +5162,61 @@
         "node": ">=8"
       }
     },
+    "node_modules/wrap-ansi-cjs": {
+      "name": "wrap-ansi",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/wrap-ansi/node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -4627,15 +5252,6 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
     },
-    "node_modules/xtend": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
-      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.4"
-      }
-    },
     "node_modules/y18n": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
@@ -4689,9 +5305,9 @@
       }
     },
     "node_modules/zmp-sdk": {
-      "version": "2.39.9",
-      "resolved": "https://registry.npmjs.org/zmp-sdk/-/zmp-sdk-2.39.9.tgz",
-      "integrity": "sha512-moOVBKZ9cuEvfQvTGVoNP6/n8daAd9ieevPSQUqV4R4A2TPcHV7phz0hPQYr62siajGOBq085yXDq6TWuUgGuA==",
+      "version": "2.40.0-beta.3",
+      "resolved": "https://registry.npmjs.org/zmp-sdk/-/zmp-sdk-2.40.0-beta.3.tgz",
+      "integrity": "sha512-mGAPbTIVu5C3fVlMoUYwnSYRlGzolAFynvRPCAklJlUdRuGHdlpxEfk+mhRa97DFbeHKiBOaOmELQVgjn2G9yg==",
       "license": "MIT",
       "dependencies": {
         "@babel/cli": "^7.17.6",
diff --git a/package.json b/package.json
index 6f33e09..2ae3fa9 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,7 @@
     "react-router-dom": "^6.8.2",
     "recoil": "^0.7.7",
     "swiper": "^9.1.0",
-    "zmp-sdk": "^2.39.9",
+    "zmp-sdk": "^2.40.0-beta.3",
     "zmp-ui": "^1.6.0-rc.6"
   },
   "devDependencies": {
@@ -44,8 +44,8 @@
     "postcss-cli": "^8.3.1",
     "postcss-preset-env": "^6.7.0",
     "sass": "^1.58.3",
-    "tailwindcss": "^3.2.7",
-    "vite": "^2.6.14",
+    "tailwindcss": "^3.4.10",
+    "vite": "^2.9.18",
     "vite-tsconfig-paths": "^4.0.5"
   }
 }
diff --git a/src/components/navigation.tsx b/src/components/navigation.tsx
index eccf065..1156968 100644
--- a/src/components/navigation.tsx
+++ b/src/components/navigation.tsx
@@ -30,7 +30,6 @@ export type TabKeys = keyof typeof tabs;
 export const NO_BOTTOM_NAVIGATION_PAGES = ["/search", "/category", "/result"];
 
 export const Navigation: FC = () => {
-  const [activeTab, setActiveTab] = useState<TabKeys>("/");
   const keyboardVisible = useVirtualKeyboardVisible();
   const navigate = useNavigate();
   const location = useLocation();
@@ -46,8 +45,8 @@ export const Navigation: FC = () => {
   return (
     <BottomNavigation
       id="footer"
-      activeKey={activeTab}
-      onChange={(key: TabKeys) => setActiveTab(key)}
+      activeKey={location.pathname}
+      onChange={navigate}
       className="z-50"
     >
       {Object.keys(tabs).map((path: TabKeys) => (
@@ -56,7 +55,6 @@ export const Navigation: FC = () => {
           label={tabs[path].label}
           icon={tabs[path].icon}
           activeIcon={tabs[path].activeIcon}
-          onClick={() => navigate(path)}
         />
       ))}
     </BottomNavigation>
diff --git a/src/components/payment-icon.tsx b/src/components/payment-icon.tsx
new file mode 100644
index 0000000..369759b
--- /dev/null
+++ b/src/components/payment-icon.tsx
@@ -0,0 +1,217 @@
+import React, { SVGProps } from "react";
+import { Spinner } from "zmp-ui";
+
+export function IconCheck(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width="28"
+      height="28"
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M14.3728 25.6778C7.76148 25.6778 2.38477 20.3011 2.38477 13.6898C2.38477 7.07855 7.76148 1.70184 14.3728 1.70184C20.9841 1.70184 26.3608 7.08178 26.3608 13.6898C26.3608 20.2979 20.9841 25.6778 14.3728 25.6778Z"
+        fill="url(#paint0_linear_2243_5851)"
+      />
+      <path
+        d="M12.465 17.827H12.4666C12.7151 17.8269 12.9534 17.7282 13.129 17.5525C13.129 17.5525 13.129 17.5525 13.1291 17.5525L19.9974 10.6842C20.0861 10.5981 20.1569 10.4952 20.2056 10.3817C20.2548 10.2673 20.2806 10.1444 20.2817 10.02C20.2828 9.89556 20.2591 9.77218 20.2119 9.65703L19.9806 9.7517L20.2119 9.65703C20.1648 9.54188 20.0953 9.43727 20.0073 9.34929C19.9193 9.26132 19.8147 9.19174 19.6995 9.14463C19.5844 9.09752 19.461 9.07381 19.3366 9.0749C19.2122 9.07598 19.0892 9.10182 18.9749 9.15093C18.8613 9.19972 18.7585 9.27051 18.6724 9.3592L12.4715 15.5595L10.3933 13.4472C10.31 13.3541 10.209 13.2786 10.0962 13.2251C9.98102 13.1705 9.85598 13.14 9.72865 13.1354C9.60133 13.1308 9.4744 13.1522 9.35564 13.1983C9.23687 13.2444 9.12875 13.3143 9.0379 13.4036C8.94705 13.4929 8.87537 13.5998 8.82724 13.7178L9.05871 13.8123L8.82724 13.7178C8.77911 13.8358 8.75554 13.9623 8.75798 14.0897C8.76042 14.2171 8.78882 14.3426 8.84143 14.4587C8.89303 14.5725 8.96686 14.6748 9.05855 14.7596L11.8016 17.5459L11.9802 17.3709L11.802 17.5463L11.802 17.5462C11.8885 17.6344 11.9915 17.7046 12.1052 17.7527C12.2191 17.801 12.3414 17.8262 12.465 17.827Z"
+        fill="white"
+        stroke="white"
+        stroke-width="0.5"
+      />
+      <path
+        d="M14.3747 3.15565C20.193 3.15565 24.9089 7.87155 24.9089 13.6899C24.9089 19.5082 20.193 24.2241 14.3747 24.2241C8.55636 24.2241 3.84046 19.5082 3.84046 13.6899C3.84046 7.87155 8.55636 3.15565 14.3747 3.15565ZM14.3747 0.244873C6.96075 0.244873 0.929688 6.27594 0.929688 13.6899C0.929688 21.1038 6.96075 27.1349 14.3747 27.1349C21.7886 27.1349 27.8197 21.1038 27.8197 13.6899C27.8197 6.27594 21.7886 0.244873 14.3747 0.244873Z"
+        fill="white"
+      />
+      <defs>
+        <linearGradient
+          id="paint0_linear_2243_5851"
+          x1="14.3724"
+          y1="39.4178"
+          x2="14.3724"
+          y2="2.46702"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#11888F" />
+          <stop offset="0.00143105" stop-color="#11888F" />
+          <stop offset="0.2913" stop-color="#1FACA2" />
+          <stop offset="0.5629" stop-color="#29C6AF" />
+          <stop offset="0.8071" stop-color="#2FD6B7" />
+          <stop offset="1" stop-color="#31DBBA" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+}
+
+export function IconError(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width="28"
+      height="27"
+      viewBox="0 0 28 27"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M13.7385 26.8994C6.32738 26.8994 0.294922 20.8669 0.294922 13.4558C0.294922 6.0446 6.32738 0.012146 13.7385 0.012146C21.1497 0.012146 27.1821 6.0446 27.1821 13.4558C27.1821 20.8669 21.1497 26.8994 13.7385 26.8994Z"
+        fill="url(#paint0_linear_2243_7961)"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M1.53188 13.4558C1.53188 20.1778 7.00677 25.6584 13.7385 25.6584C20.4703 25.6584 25.9452 20.1778 25.9452 13.4558C25.9452 6.73373 20.4703 1.25309 13.7385 1.25309C7.00677 1.25309 1.53188 6.73372 1.53188 13.4558ZM0.294922 13.4558C0.294922 20.8669 6.32738 26.8994 13.7385 26.8994C21.1497 26.8994 27.1821 20.8669 27.1821 13.4558C27.1821 6.0446 21.1497 0.012146 13.7385 0.012146C6.32738 0.012146 0.294922 6.0446 0.294922 13.4558Z"
+        fill="white"
+        fill-opacity="0.5"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M8.05714 7.324C8.703 6.66461 9.75013 6.66461 10.396 7.324L19.7178 16.8412C20.3637 17.5006 20.3637 18.5697 19.7178 19.2291C19.072 19.8885 18.0248 19.8885 17.379 19.2291L8.05714 9.71186C7.41129 9.05247 7.41129 7.98339 8.05714 7.324Z"
+        fill="white"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M19.7173 7.32401C20.3632 7.9834 20.3632 9.05248 19.7173 9.71187L10.3955 19.2291C9.74962 19.8885 8.70249 19.8885 8.05663 19.2291C7.41078 18.5697 7.41078 17.5006 8.05664 16.8412L17.3785 7.32401C18.0243 6.66462 19.0714 6.66462 19.7173 7.32401Z"
+        fill="white"
+      />
+      <defs>
+        <linearGradient
+          id="paint0_linear_2243_7961"
+          x1="6.19238"
+          y1="26.8994"
+          x2="19.4103"
+          y2="1.97657"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#ED0A0A" />
+          <stop offset="1" stop-color="#FF3D00" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+}
+
+export default function IconPayment() {
+  return (
+    <svg
+      width="55"
+      height="44"
+      viewBox="0 0 55 44"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M46.0625 0.455811H8.36029C3.89836 0.455811 0.28125 4.07292 0.28125 8.53485V35.465C0.28125 39.9269 3.89836 43.544 8.36029 43.544H46.0625C50.5244 43.544 54.1415 39.9269 54.1415 35.465V8.53485C54.1415 4.07292 50.5244 0.455811 46.0625 0.455811Z"
+        fill="url(#paint0_linear_2243_5847)"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M54.1415 16.6138H0.28125V11.2278H54.1415V16.6138Z"
+        fill="url(#paint1_linear_2243_5847)"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M5.66797 30.0789C5.66797 28.5916 6.87368 27.3859 8.36098 27.3859H24.5191C26.0064 27.3859 27.2121 28.5916 27.2121 30.0789C27.2121 31.5663 26.0064 32.772 24.5191 32.772H8.36098C6.87368 32.772 5.66797 31.5663 5.66797 30.0789Z"
+        fill="url(#paint2_linear_2243_5847)"
+      />
+      <defs>
+        <linearGradient
+          id="paint0_linear_2243_5847"
+          x1="-2.67574"
+          y1="48.2728"
+          x2="24.3483"
+          y2="-2.31466"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#1975FF" />
+          <stop offset="0.0909" stop-color="#2C81FE" />
+          <stop offset="0.7229" stop-color="#AFD0FB" />
+          <stop offset="1" stop-color="#E4F0F9" />
+        </linearGradient>
+        <linearGradient
+          id="paint1_linear_2243_5847"
+          x1="27.2095"
+          y1="9.79105"
+          x2="27.2095"
+          y2="18.444"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#F3F8FF" />
+          <stop offset="0.012" stop-color="#EEF5FF" />
+          <stop offset="0.1644" stop-color="#B3D1FF" />
+          <stop offset="0.3112" stop-color="#81B3FF" />
+          <stop offset="0.4488" stop-color="#5B9CFF" />
+          <stop offset="0.5751" stop-color="#408CFF" />
+          <stop offset="0.6862" stop-color="#2F82FF" />
+          <stop offset="0.7702" stop-color="#297EFF" />
+        </linearGradient>
+        <linearGradient
+          id="paint2_linear_2243_5847"
+          x1="16.4406"
+          y1="25.9205"
+          x2="16.4406"
+          y2="33.9605"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#F3F8FF" />
+          <stop offset="0.013" stop-color="#EEF5FF" />
+          <stop offset="0.1771" stop-color="#B3D1FF" />
+          <stop offset="0.3353" stop-color="#81B3FF" />
+          <stop offset="0.4836" stop-color="#5B9CFF" />
+          <stop offset="0.6198" stop-color="#408CFF" />
+          <stop offset="0.7395" stop-color="#2F82FF" />
+          <stop offset="0.8299" stop-color="#297EFF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+}
+
+export function IconPaymentLoading() {
+  return (
+    <div className="[&_.zaui-spinner]:w-[100px] [&_.zaui-spinner]:h-[100px] [&_.zaui-spinner-logo]:flex [&_.zaui-spinner-logo]:justify-center [&_.zaui-spinner-logo]:items-center">
+      <Spinner logo={<IconPayment />}></Spinner>
+    </div>
+  );
+}
+
+export function IconPaymentSuccess() {
+  return (
+    <div
+      className="w-[100px] h-[100px] rounded-full flex items-center justify-center"
+      style={{
+        background:
+          "linear-gradient(0deg, rgba(201, 220, 247, 0.12) 0.59%, #8DAAE733 100%)",
+      }}
+    >
+      <div className="relative">
+        <IconPayment />
+        <IconCheck className="absolute -top-3.5 -right-3.5" />
+      </div>
+    </div>
+  );
+}
+
+export function IconPaymentFail() {
+  return (
+    <div
+      className="w-[100px] h-[100px] rounded-full flex items-center justify-center"
+      style={{
+        background:
+          "linear-gradient(0deg, rgba(201, 220, 247, 0.12) 0.59%, #8DAAE733 100%)",
+      }}
+    >
+      <div className="relative">
+        <IconPayment />
+        <IconError className="absolute -top-3.5 -right-3.5" />
+      </div>
+    </div>
+  );
+}
diff --git a/src/hooks.ts b/src/hooks.ts
index 5b3bc00..27d5752 100644
--- a/src/hooks.ts
+++ b/src/hooks.ts
@@ -1,7 +1,9 @@
 import _ from "lodash";
 import { useEffect, useRef, useState } from "react";
+import { useRecoilCallback } from "recoil";
+import { paymentState } from "state";
 import { matchStatusBarColor } from "utils/device";
-import { EventName, events, Payment } from "zmp-sdk";
+import { CheckoutSDK, EventName, events } from "zmp-sdk";
 import { useNavigate, useSnackbar } from "zmp-ui";
 
 export function useMatchStatusTextColor(visible?: boolean) {
@@ -70,3 +72,42 @@ export function useToBeImplemented() {
       text: "Chức năng dành cho các bên tích hợp phát triển...",
     });
 }
+
+export function usePayment() {
+  const snackbar = useSnackbar();
+  const navigate = useNavigate();
+  const getPaymentMethod = useRecoilCallback(
+    ({ snapshot }) =>
+      () =>
+        snapshot.getPromise(paymentState),
+    []
+  );
+
+  return async (params: { amount: number; desc: string }) => {
+    try {
+      const method = await getPaymentMethod();
+      if (method) {
+        const { orderId } = await CheckoutSDK.purchase({
+          ...params,
+          method: method.method,
+        });
+        navigate("/result", {
+          state: { orderId },
+        });
+      } else {
+        snackbar.openSnackbar({
+          type: "error",
+          text: "Vui lòng chọn phương thức thanh toán.",
+        });
+      }
+    } catch (error: any) {
+      console.warn(error);
+      if (error.code !== -201) {
+        snackbar.openSnackbar({
+          type: "error",
+          text: "Đã có lỗi xảy ra trong quá trình thanh toán. Vui lòng kiểm tra nội dung thông báo lỗi trong cửa sổ console.",
+        });
+      }
+    }
+  };
+}
diff --git a/src/pages/cart/delivery.tsx b/src/pages/cart/delivery.tsx
index 9c135bd..ead030d 100644
--- a/src/pages/cart/delivery.tsx
+++ b/src/pages/cart/delivery.tsx
@@ -7,6 +7,7 @@ import { RequestStorePickerLocation, StorePicker } from "./store-picker";
 import { TimePicker } from "./time-picker";
 import { useRecoilState } from "recoil";
 import { orderNoteState } from "state";
+import { PaymentMethodPicker } from "./payment-method-picker";
 
 export const Delivery: FC = () => {
   const [note, setNote] = useRecoilState(orderNoteState);
@@ -24,20 +25,6 @@ export const Delivery: FC = () => {
               </Suspense>
             ),
           },
-          {
-            left: <Icon icon="zi-clock-1" className="my-auto" />,
-            right: (
-              <Box flex className="space-x-2">
-                <Box className="flex-1 space-y-[2px]">
-                  <TimePicker />
-                  <Text size="xSmall" className="text-gray">
-                    Thời gian nhận hàng
-                  </Text>
-                </Box>
-                <Icon icon="zi-chevron-right" />
-              </Box>
-            ),
-          },
           {
             left: <Icon icon="zi-user" className="my-auto" />,
             right: (
@@ -46,6 +33,10 @@ export const Delivery: FC = () => {
               </Suspense>
             ),
           },
+          {
+            left: <Icon icon="zi-note" className="my-auto" />,
+            right: <PaymentMethodPicker />,
+          },
           {
             left: <Icon icon="zi-note" className="my-auto" />,
             right: (
diff --git a/src/pages/cart/payment-method-picker.tsx b/src/pages/cart/payment-method-picker.tsx
new file mode 100644
index 0000000..845a822
--- /dev/null
+++ b/src/pages/cart/payment-method-picker.tsx
@@ -0,0 +1,35 @@
+import { ListItem } from "components/list-item";
+import React, { FC } from "react";
+import { useRecoilState } from "recoil";
+import { paymentState } from "state";
+import { PAYMENT_CHANNEL_SUBINFOS } from "utils/config";
+import { Payment } from "zmp-sdk";
+
+export const PaymentMethodPicker: FC = () => {
+  const [payment, setPayment] = useRecoilState(paymentState);
+
+  return (
+    <>
+      <ListItem
+        onClick={async () => {
+          const method = await Payment.selectPaymentMethod({
+            selectedMethod: payment ? { method: payment.method } : undefined,
+            channels: Object.keys(PAYMENT_CHANNEL_SUBINFOS).map((method) => ({
+              method,
+              subInfo: PAYMENT_CHANNEL_SUBINFOS[method],
+            })),
+          });
+          setPayment(method);
+        }}
+        title="Phương thức thanh toán"
+        subtitle={
+          payment
+            ? `${payment.displayName} - ${
+                PAYMENT_CHANNEL_SUBINFOS[payment.method]
+              }`
+            : "Chọn phương thức"
+        }
+      />
+    </>
+  );
+};
diff --git a/src/pages/cart/preview.tsx b/src/pages/cart/preview.tsx
index 0c6c38c..940a1c1 100644
--- a/src/pages/cart/preview.tsx
+++ b/src/pages/cart/preview.tsx
@@ -1,13 +1,14 @@
 import { DisplayPrice } from "components/display/price";
+import { usePayment } from "hooks";
 import React, { FC } from "react";
 import { useRecoilValue } from "recoil";
 import { totalPriceState, totalQuantityState } from "state";
-import pay from "utils/product";
 import { Box, Button, Text } from "zmp-ui";
 
 export const CartPreview: FC = () => {
   const quantity = useRecoilValue(totalQuantityState);
   const totalPrice = useRecoilValue(totalPriceState);
+  const pay = usePayment();
 
   return (
     <Box flex className="sticky bottom-0 bg-background p-4 space-x-4">
@@ -28,7 +29,12 @@ export const CartPreview: FC = () => {
         type="highlight"
         disabled={!quantity}
         fullWidth
-        onClick={() => pay(totalPrice)}
+        onClick={() =>
+          pay({
+            amount: totalPrice,
+            desc: "Thanh toán đơn hàng",
+          })
+        }
       >
         Đặt hàng
       </Button>
diff --git a/src/pages/result.tsx b/src/pages/result.tsx
index a20a091..80e3770 100644
--- a/src/pages/result.tsx
+++ b/src/pages/result.tsx
@@ -1,5 +1,5 @@
 import React, { FC, ReactNode, useEffect, useMemo, useState } from "react";
-import { Box, Header, Page, Text } from "zmp-ui";
+import { Box, Button, Header, Page, Spinner, Text, useNavigate } from "zmp-ui";
 import subscriptionDecor from "static/subscription-decor.svg";
 import {
   AsyncCallbackFailObject,
@@ -9,117 +9,91 @@ import {
 import { useLocation } from "react-router";
 import { useResetRecoilState } from "recoil";
 import { cartState } from "state";
+import {
+  IconPaymentFail,
+  IconPaymentLoading,
+  IconPaymentSuccess,
+} from "components/payment-icon";
 
 interface RenderResultProps {
-  title: string;
+  title?: string;
   message: string;
-  color: string;
+  icon: ReactNode;
 }
 
 const CheckoutResultPage: FC = () => {
   const { state } = useLocation();
-  const [paymentResult, setPaymentResult] = useState<
-    CheckTransactionReturns | AsyncCallbackFailObject
-  >();
+  const [paymentResult, setPaymentResult] = useState<boolean>();
+  const navigate = useNavigate();
+  const clearCart = useResetRecoilState(cartState);
 
   useEffect(() => {
-    let timeout;
-
-    const check = () => {
-      let data = state;
-      if (data) {
-        if ("path" in data) {
-          data = data.path;
-        } else if ("data" in data) {
-          data = data.data;
+    if (state && "orderId" in state) {
+      const { orderId } = state;
+      // update order status - this should be done by your server
+      fetch(
+        `https://webvcwaumtpmsarmgbhl.supabase.co/functions/v1/update-order-status`,
+        {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({ orderId, appId: window.APP_ID }),
         }
-      } else {
-        data = new URL(window.location.href).searchParams.toString();
-      }
-      Payment.checkTransaction({
-        data,
-        success: (rs) => {
-          // Kết quả giao dịch khi gọi api thành công
-          setPaymentResult(rs);
-          if (rs.resultCode === 0) {
-            // Thanh toán đang được xử lý
-            timeout = setTimeout(check, 3000);
+      )
+        .then((res) => res.json())
+        .then((json) => {
+          console.warn(json);
+          setPaymentResult(!json.error);
+          if (!json.error) {
+            clearCart();
           }
-        },
-        fail: (err) => {
-          // Kết quả giao dịch khi gọi api thất bại
-          setPaymentResult(err);
-        },
-      });
-    };
-
-    check();
-
-    return () => {
-      clearTimeout(timeout);
-    };
-  }, []);
-
-  const clearCart = useResetRecoilState(cartState);
-  useEffect(() => {
-    if (paymentResult?.resultCode >= 0) {
-      clearCart();
+        });
     }
-  }, [paymentResult]);
+  }, []);
 
-  if (paymentResult) {
-    return (
-      <Page className="flex flex-col">
-        <Header title="Kết quả thanh toán" />
-        {(function (render: (result: RenderResultProps) => ReactNode) {
-          if ("resultCode" in paymentResult) {
-            if (paymentResult.resultCode === 1) {
-              return render({
-                title: "Thanh toán thành công",
-                message: `Cảm ơn bạn đã mua hàng!`,
-                color: "#288F4E",
-              });
-            }
-            if (paymentResult.resultCode === 0) {
-              return render({
-                title: "Thanh toán đang được xử lý",
-                message: `Nhà bán hàng đã nhận được yêu cầu thanh toán của bạn và đang xử lý. Mã giao dịch: ${
-                  (paymentResult as CheckTransactionReturns).orderId
-                }-${(paymentResult as CheckTransactionReturns).transId}`,
-                color: "#F4AA39",
-              });
-            }
-          }
+  return (
+    <Page className="flex flex-col bg-white">
+      <Header title="Kết quả thanh toán" />
+      {(function (render: (result: RenderResultProps) => ReactNode) {
+        if (paymentResult === true) {
+          return render({
+            title: "Thanh toán thành công",
+            message: `Đơn hàng của bạn đã được thanh toán thành công. Đơn hàng của bạn sẽ được xử lý trong thời gian sớm nhất.`,
+            icon: <IconPaymentSuccess />,
+          });
+        }
+        if (paymentResult === false) {
           return render({
             title: "Thanh toán thất bại",
-            message: `Đã có lỗi xảy ra trong quá trình thanh toán, vui lòng thử lại sau! Mã lỗi: ${JSON.stringify(
-              (paymentResult as AsyncCallbackFailObject).code
-            )}`,
-            color: "#DC1F18",
+            message: `Có lỗi trong quá trình xử lý, vui lòng kiểm tra lại hoặc liên hệ Shop để được hỗ trợ`,
+            icon: <IconPaymentFail />,
           });
-        })(({ title, message, color }: RenderResultProps) => (
-          <Box className="p-4 space-y-4 flex-1 flex flex-col justify-center items-center text-center">
-            <div
-              key={+new Date()}
-              className="w-28 h-28 flex items-center justify-center rounded-full animate-spin"
-              style={{
-                backgroundColor: color,
-                animationIterationCount: 1,
-              }}
-            >
-              <img src={subscriptionDecor} />
-            </div>
-            <Text.Title className="font-bold" style={{ color }}>
+        }
+        return render({
+          message: `Hệ thống đang xử lý thanh toán, vui lòng chờ trong ít phút...`,
+          icon: <IconPaymentLoading />,
+        });
+      })(({ title, message, icon }: RenderResultProps) => (
+        <Box className="p-6 space-y-3 flex-1 flex flex-col justify-center items-center text-center">
+          <div className="p-4">{icon}</div>
+          {title && (
+            <Text size="xLarge" className="font-medium">
               {title}
-            </Text.Title>
-            <Text>{message}</Text>
-          </Box>
-        ))}
-      </Page>
-    );
-  }
-
-  return <></>;
+            </Text>
+          )}
+          <Text className="text-[#6F7071]">{message}</Text>
+        </Box>
+      ))}
+      {paymentResult !== undefined && (
+        <div className="p-4">
+          <Button fullWidth onClick={() => navigate("/", { replace: true })}>
+            {paymentResult ? "Hoàn tất" : "Đóng"}
+          </Button>
+        </div>
+      )}
+    </Page>
+  );
 };
 
 export default CheckoutResultPage;
diff --git a/src/state.ts b/src/state.ts
index 3fde7dd..e3fd8d2 100644
--- a/src/state.ts
+++ b/src/state.ts
@@ -1,5 +1,10 @@
 import { atom, selector, selectorFamily } from "recoil";
-import { getLocation, getPhoneNumber, getUserInfo } from "zmp-sdk";
+import {
+  getLocation,
+  getPhoneNumber,
+  getUserInfo,
+  SelectPaymentMethodReturns,
+} from "zmp-sdk";
 import logo from "static/logo.png";
 import { Category } from "types/category";
 import { Product, Variant } from "types/product";
@@ -307,3 +312,8 @@ export const orderNoteState = atom({
   key: "orderNote",
   default: "",
 });
+
+export const paymentState = atom<SelectPaymentMethodReturns | false>({
+  key: "payment",
+  default: false,
+});
diff --git a/src/utils/config.ts b/src/utils/config.ts
index 444e05e..e55d518 100644
--- a/src/utils/config.ts
+++ b/src/utils/config.ts
@@ -3,3 +3,9 @@ import appConfig from "../../app-config.json";
 export function getConfig<T>(getter: (config: typeof appConfig) => T) {
   return getter(appConfig);
 }
+
+export const PAYMENT_CHANNEL_SUBINFOS = {
+  paypal: "ppuser@gmail.com",
+  MASTER_CARD: "ATM ***1122",
+  COD: "Thanh toán khi nhận hàng",
+} as const;
diff --git a/src/utils/product.ts b/src/utils/product.ts
index 60bf09b..83f9c2e 100644
--- a/src/utils/product.ts
+++ b/src/utils/product.ts
@@ -1,7 +1,9 @@
-import { createOrder } from "zmp-sdk";
+import { CheckoutSDK, createOrder, purchase } from "zmp-sdk";
 import { Option, Product } from "types/product";
 import { getConfig } from "./config";
 import { SelectedOptions } from "types/cart";
+import { useRecoilCallback } from "recoil";
+import { paymentState } from "state";
 
 export function calcFinalPrice(product: Product, options?: SelectedOptions) {
   let finalPrice = product.price;
@@ -26,7 +28,7 @@ export function calcFinalPrice(product: Product, options?: SelectedOptions) {
           }
         } else {
           const selecteds = variant.options.filter((o) =>
-            currentOption.includes(o.id),
+            currentOption.includes(o.id)
           );
           selectedOptions.push(...selecteds);
         }
@@ -52,7 +54,7 @@ export function getDummyImage(filename: string) {
 
 export function isIdentical(
   option1: SelectedOptions,
-  option2: SelectedOptions,
+  option2: SelectedOptions
 ) {
   const option1Keys = Object.keys(option1);
   const option2Keys = Object.keys(option2);
@@ -78,20 +80,3 @@ export function isIdentical(
 
   return true;
 }
-
-const pay = (amount: number, description?: string) =>
-  createOrder({
-    desc:
-      description ??
-      `Thanh toán cho ${getConfig((config) => config.app.title)}`,
-    item: [],
-    amount: amount,
-    success: (data) => {
-      console.log("Payment success: ", data);
-    },
-    fail: (err) => {
-      console.log("Payment error: ", err);
-    },
-  });
-
-export default pay;
diff --git a/zmp-template.json b/zmp-template.json
index 1cf0610..0dcb4f1 100644
--- a/zmp-template.json
+++ b/zmp-template.json
@@ -1,5 +1,5 @@
 {
-  "name": "ZaUI Coffee",
+  "name": "ZaUI Café",
   "options": {
     "headerLogo": {
       "title": "Header Logo",
@@ -25,4 +25,4 @@
       "type": "boolean"
     }
   }
-}
\ No newline at end of file
+}