From 8f5162e70fd321240f4016e172d85db9c34b689e Mon Sep 17 00:00:00 2001
From: Ikko Eltociear Ashimine <eltociear@gmail.com>
Date: Thu, 7 Nov 2024 12:36:14 +0900
Subject: [PATCH 1/9] docs: update cip102.md

minor fix
---
 packages/mesh-contract/src/royalties/cip102.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/mesh-contract/src/royalties/cip102.md b/packages/mesh-contract/src/royalties/cip102.md
index 91d6d691a..b7cad9da2 100644
--- a/packages/mesh-contract/src/royalties/cip102.md
+++ b/packages/mesh-contract/src/royalties/cip102.md
@@ -165,7 +165,7 @@ See the [CIP-0068 Extension Boilerplate](https://github.com/cardano-foundation/C
 ### Acceptance Criteria
 
 - [x] This CIP should receive feedback, criticism, and refinement from: CIP Editors and the community of people involved with NFT projects to review any weaknesses or areas of improvement.
-- [x] Guidelines and examples of publication of data as well as discovery and validation should be included as part of of criteria for acceptance.
+- [x] Guidelines and examples of publication of data as well as discovery and validation should be included as part of criteria for acceptance.
 - [x] Minimal reference implementation making use of [Lucid](https://github.com/spacebudz/lucid) (off-chain), [PlutusTx](https://github.com/input-output-hk/plutus) (on-chain): [Reference Implementation](https://github.com/SamDelaney/CIP_102_Reference).
 - [ ] Implementation and use demonstrated by the community: NFT Projects, Blockchain Explorers, Wallets, Marketplaces.
 
@@ -181,4 +181,4 @@ This CIP is licensed under [CC-BY-4.0](https://creativecommons.org/licenses/by/4
 
 [CIP-0027]: https://github.com/cardano-foundation/CIPs/tree/master/CIP-0027
 [CIP-0067]: https://github.com/cardano-foundation/CIPs/tree/master/CIP-0067
-[CIP-0068]: https://github.com/cardano-foundation/CIPs/tree/master/CIP-0068
\ No newline at end of file
+[CIP-0068]: https://github.com/cardano-foundation/CIPs/tree/master/CIP-0068

From 9d2c6951569629f31a93f7aa5d63a40df3f3b5b7 Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 09:56:31 +0800
Subject: [PATCH 2/9] update guides

---
 .../components/sections/hero-two-sections.tsx |  2 +-
 apps/playground/src/pages/guides/aiken.mdx    |  8 ++++++
 .../src/pages/guides/custom-provider.mdx      | 10 +++++++
 .../src/pages/guides/minting-on-nodejs.mdx    |  6 +++++
 .../pages/guides/multisig-minting/demo.tsx    |  1 -
 .../pages/guides/multisig-minting/index.mdx   | 12 +++++++++
 apps/playground/src/pages/guides/nextjs.mdx   | 26 +++++++++++++++----
 .../guides/prove-wallet-ownership/demo.tsx    |  1 -
 .../guides/prove-wallet-ownership/index.mdx   | 15 ++++++++++-
 .../guides/smart-contract-transactions.mdx    |  9 +++++++
 .../src/pages/guides/standalone.mdx           |  8 +++++-
 .../src/pages/guides/vesting/demo.tsx         |  1 -
 .../src/pages/guides/vesting/index.mdx        | 13 +++++++++-
 13 files changed, 100 insertions(+), 12 deletions(-)

diff --git a/apps/playground/src/components/sections/hero-two-sections.tsx b/apps/playground/src/components/sections/hero-two-sections.tsx
index 6b525d7cf..33ec15fb1 100644
--- a/apps/playground/src/components/sections/hero-two-sections.tsx
+++ b/apps/playground/src/components/sections/hero-two-sections.tsx
@@ -42,7 +42,7 @@ export default function HeroTwoSections({
 
           {code && <Codeblock data={code} />}
 
-          {children && children}
+          {children && <div className="my-1">{children}</div>}
         </div>
         <div className="hidden lg:col-span-5 lg:mt-0 lg:flex">
           {typeof image === "string" ? <img src={image} /> : image}
diff --git a/apps/playground/src/pages/guides/aiken.mdx b/apps/playground/src/pages/guides/aiken.mdx
index 51a105bd6..44281f821 100644
--- a/apps/playground/src/pages/guides/aiken.mdx
+++ b/apps/playground/src/pages/guides/aiken.mdx
@@ -2,12 +2,20 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guideaiken } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'System setup', to: 'systemsetup' },
+    { label: 'Writing a smart contract with Aiken', to: 'writingasmartcontractwithaiken' },
+    { label: 'Creating locking transaction', to: 'creatinglockingtransaction' },
+    { label: 'Unlocking assets', to: 'unlockingassets' },
+  ]
+
   return (
     <LayoutImageHeaderAndBody
       title={guideaiken.title}
       description={guideaiken.description}
       image={guideaiken.image}
       cover={guideaiken.cover}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
diff --git a/apps/playground/src/pages/guides/custom-provider.mdx b/apps/playground/src/pages/guides/custom-provider.mdx
index a5283c494..64ea93240 100644
--- a/apps/playground/src/pages/guides/custom-provider.mdx
+++ b/apps/playground/src/pages/guides/custom-provider.mdx
@@ -2,12 +2,22 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guideprovider } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'How does it work?', to: 'howdoesitwork' },
+    { label: 'Implement your own provider', to: 'implementyourownprovider' },
+    {
+      label: 'Implement Constructor and Functions',
+      to: 'implementconstructorandfunctions'
+    }
+  ]
+
   return (
     <LayoutImageHeaderAndBody
       title={guideprovider.title}
       description={guideprovider.description}
       image={guideprovider.image}
       cover={guideprovider.cover}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
diff --git a/apps/playground/src/pages/guides/minting-on-nodejs.mdx b/apps/playground/src/pages/guides/minting-on-nodejs.mdx
index 11a0974c7..e0d0f76f6 100644
--- a/apps/playground/src/pages/guides/minting-on-nodejs.mdx
+++ b/apps/playground/src/pages/guides/minting-on-nodejs.mdx
@@ -2,12 +2,18 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guidenodejs } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'System setup', to: 'systemsetup' },
+    { label: 'Build the minting transaction', to: 'buildthemintingtransaction' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guidenodejs.title}
       description={guidenodejs.description}
       image={guidenodejs.image}
       cover={guidenodejs.cover}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
diff --git a/apps/playground/src/pages/guides/multisig-minting/demo.tsx b/apps/playground/src/pages/guides/multisig-minting/demo.tsx
index 64a096a83..f340b98fe 100644
--- a/apps/playground/src/pages/guides/multisig-minting/demo.tsx
+++ b/apps/playground/src/pages/guides/multisig-minting/demo.tsx
@@ -112,7 +112,6 @@ export default function Demo() {
 
   return (
     <>
-      <h2>Demo</h2>
       <p>Connect your wallet and click on the button to mint a token.</p>
       <CardanoWallet />
       <Button
diff --git a/apps/playground/src/pages/guides/multisig-minting/index.mdx b/apps/playground/src/pages/guides/multisig-minting/index.mdx
index b41644cb0..0aa713430 100644
--- a/apps/playground/src/pages/guides/multisig-minting/index.mdx
+++ b/apps/playground/src/pages/guides/multisig-minting/index.mdx
@@ -3,12 +3,22 @@ import { guideminting } from "~/data/links-guides";
 import Demo from "./demo";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'Connect wallet (client)', to: 'connectwalletclient' },
+    { label: 'Build transaction (application)', to: 'buildtransactionapplication' },
+    { label: 'Sign transaction (client)', to: 'signtransactionclient' },
+    { label: 'Sign transaction (application)', to: 'signtransactionapplication' },
+    { label: 'Submit transaction (application)', to: 'submittransactionapplication' },
+    { label: 'Demo', to: 'demo' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guideminting.title}
       description={guideminting.description}
       image={guideminting.image}
       cover={guideminting.cover}
+      sidebarItems={sidebarItems}
     >
       <>
         {children}
@@ -188,3 +198,5 @@ const txHash = await wallet.submitTx(signedTx);
 Voila! You can build any multi-sig transactions!
 
 [Check out the code here](https://github.com/MeshJS/mesh/blob/main/apps/playground/src/pages/guides/multisig-minting/demo.tsx).
+
+## Demo
\ No newline at end of file
diff --git a/apps/playground/src/pages/guides/nextjs.mdx b/apps/playground/src/pages/guides/nextjs.mdx
index 70315fd91..32b05551e 100644
--- a/apps/playground/src/pages/guides/nextjs.mdx
+++ b/apps/playground/src/pages/guides/nextjs.mdx
@@ -2,9 +2,11 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guidenextjs } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
-  // const sidebarItems = [
-  //   { label: 'System setup', to: 'systemsetup' },
-  // ];
+  const sidebarItems = [
+    { label: 'System setup', to: 'systemsetup' },
+    { label: 'Setup Mesh', to: 'setupmesh' },
+    { label: 'See it in action', to: 'seeitinaction' },
+  ];
 
   return (
     <LayoutImageHeaderAndBody
@@ -12,13 +14,15 @@ export default function MDXPage({ children }) {
       description={guidenextjs.description}
       image={guidenextjs.image}
       cover={guidenextjs.cover}
-      // sidebarItems={sidebarItems}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
   );
 }
 
+In this guide, you will get your application running, [check this demo](https://starter-template.meshjs.dev/) to see the final result.
+
 [Next.js](https://nextjs.org/) is a web development framework built on top of Node.js enabling React-based web applications functionalities such as server-side rendering and generating static websites.
 
 Next.js and Mesh are JavaScript libraries, and so we will assume that you have some familiarity with HTML and JavaScript language, but you should be able to follow along even if you are coming from a different programming language. If you don't feel very confident, we recommend going through this [JS tutorial](https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript), or the [MDN JavaScript Reference](https://developer.mozilla.org/en-US/docs/Web/JavaScript) or my preferred method, by watch a few [videos from YouTube](https://www.youtube.com/results?search_query=get+started+with+nextjs).
@@ -43,10 +47,22 @@ Create a new folder for your project, and give the folder a meaningful name. Ope
 
 From the menu options in on your Visual Studio Code, open the **Terminal** and execute this command to create a new NextJs application:
 
-```
+```bash
 npx create-next-app@latest --typescript .
 ```
 
+```bash
+Need to install the following packages:
+Ok to proceed? (y) 
+
+✔ Would you like to use ESLint? … Yes
+✔ Would you like to use Tailwind CSS? … Yes
+✔ Would you like your code inside a `src/` directory? … Yes
+✔ Would you like to use App Router? … No
+✔ Would you like to use Turbopack for next dev? … No
+✔ Would you like to customize the import alias (@/* by default)? … No
+```
+
 ### 3. Start development server
 
 After the installation is complete, start the development server with:
diff --git a/apps/playground/src/pages/guides/prove-wallet-ownership/demo.tsx b/apps/playground/src/pages/guides/prove-wallet-ownership/demo.tsx
index 57bb622f1..43da0d2aa 100644
--- a/apps/playground/src/pages/guides/prove-wallet-ownership/demo.tsx
+++ b/apps/playground/src/pages/guides/prove-wallet-ownership/demo.tsx
@@ -25,7 +25,6 @@ export default function Demo() {
 
   return (
     <>
-      <h2>Demo</h2>
       <p>Connect your wallet and click on the button to sign a message.</p>
       <CardanoWallet />
       <Button
diff --git a/apps/playground/src/pages/guides/prove-wallet-ownership/index.mdx b/apps/playground/src/pages/guides/prove-wallet-ownership/index.mdx
index 3ee163b39..c734e1452 100644
--- a/apps/playground/src/pages/guides/prove-wallet-ownership/index.mdx
+++ b/apps/playground/src/pages/guides/prove-wallet-ownership/index.mdx
@@ -9,12 +9,23 @@ import { guideownership } from "~/data/links-guides";
 import Demo from "./demo";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'How does it work?', to: 'howdoesitwork' },
+    { label: 'Client: Connect Wallet and Get Staking Address', to: 'clientconnectwalletandgetstakingaddress' },
+    { label: 'Server: Generate Nonce and Store in Database', to: 'servergeneratenonceandstoreindatabase' },
+    { label: 'Client: Verify ownership by signing the nonce', to: 'clientverifyownershipbysigningthenonce' },
+    { label: 'Server: Verify Signature', to: 'serververifysignature' },
+    { label: 'Putting It All Together', to: 'puttingitalltogether' },
+    { label: 'Demo', to: 'demo' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guideownership.title}
       description={guideownership.description}
       image={guideownership.image}
       cover={guideownership.cover}
+      sidebarItems={sidebarItems}
     >
       <>
         {children}
@@ -34,7 +45,7 @@ Some example uses of data signing to cryptographically prove ownership:
 - **Authenticate user's action**. If the backend wants to confirm a user's authorization on an off-chain action, for example, engaging in in-game trading.
 - **Off chain account flow**. If you need to display certain data that is off-chain or on a website only to a particular user identified by their wallet, you could use message signing as a means of doing so.
 
-## How does It Work?
+## How does it work?
 
 ![image](/guides/cryptographically-prove-wallet-ownership-process.png)
 
@@ -217,3 +228,5 @@ async function backendVerifySignature(userAddress, signature) {
 ```
 
 There you go! Although this guide shows you how somebody can sign in with wallet, the same technique can be used to authenticate any of a user's actions.
+
+## Demo
diff --git a/apps/playground/src/pages/guides/smart-contract-transactions.mdx b/apps/playground/src/pages/guides/smart-contract-transactions.mdx
index 3d8734adf..ccb0860d1 100644
--- a/apps/playground/src/pages/guides/smart-contract-transactions.mdx
+++ b/apps/playground/src/pages/guides/smart-contract-transactions.mdx
@@ -2,12 +2,21 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guidetransactions } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'Initialize the Plutus script', to: 'initializetheplutusscript' },
+    { label: 'Listing Asset for Sale', to: 'listingassetforsale' },
+    { label: 'Cancel the Listing', to: 'cancelthelisting' },
+    { label: 'Purchase the Listed Asset', to: 'purchasethelistedasset' },
+    { label: 'Update the Listing', to: 'updatethelisting' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guidetransactions.title}
       description={guidetransactions.description}
       image={guidetransactions.image}
       cover={guidetransactions.cover}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
diff --git a/apps/playground/src/pages/guides/standalone.mdx b/apps/playground/src/pages/guides/standalone.mdx
index 405a26423..5b4d03f06 100644
--- a/apps/playground/src/pages/guides/standalone.mdx
+++ b/apps/playground/src/pages/guides/standalone.mdx
@@ -2,12 +2,18 @@ import LayoutImageHeaderAndBody from "~/components/layouts/image-header-and-body
 import { guidestandalone } from "~/data/links-guides";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'System setup', to: 'systemsetup' },
+    { label: 'Make a simple transaction', to: 'makeasimpletransaction' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guidestandalone.title}
       description={guidestandalone.description}
       image={guidestandalone.image}
       cover={guidestandalone.cover}
+      sidebarItems={sidebarItems}
     >
       {children}
     </LayoutImageHeaderAndBody>
@@ -27,7 +33,7 @@ In this tutorial, we'll cover:
 
 Let's get started!
 
-## Setting up
+## System setup
 
 ### Create a package.json file
 
diff --git a/apps/playground/src/pages/guides/vesting/demo.tsx b/apps/playground/src/pages/guides/vesting/demo.tsx
index c576b7aca..650f6160f 100644
--- a/apps/playground/src/pages/guides/vesting/demo.tsx
+++ b/apps/playground/src/pages/guides/vesting/demo.tsx
@@ -4,7 +4,6 @@ import { VestingWithdrawFundDemo } from "../../smart-contracts/vesting/withdraw-
 export default function Demo() {
   return (
     <>
-      <h2>Demo</h2>
       <VestingDepositFundDemo />
       <VestingWithdrawFundDemo />
     </>
diff --git a/apps/playground/src/pages/guides/vesting/index.mdx b/apps/playground/src/pages/guides/vesting/index.mdx
index 2d04b5f76..2c2dc3dd5 100644
--- a/apps/playground/src/pages/guides/vesting/index.mdx
+++ b/apps/playground/src/pages/guides/vesting/index.mdx
@@ -3,12 +3,21 @@ import { guideVesting } from "~/data/links-guides";
 import Demo from "./demo";
 
 export default function MDXPage({ children }) {
+  const sidebarItems = [
+    { label: 'On-Chain code', to: 'onchaincode' },
+    { label: 'Testing', to: 'testing' },
+    { label: 'Compile and build script', to: 'compileandbuildscript' },
+    { label: 'Off-Chain code', to: 'offchaincode' },
+    { label: 'Demo', to: 'demo' },
+  ];
+
   return (
     <LayoutImageHeaderAndBody
       title={guideVesting.title}
       description={guideVesting.description}
       image={guideVesting.image}
       cover={guideVesting.cover}
+      sidebarItems={sidebarItems}
     >
       <>
         {children}
@@ -284,4 +293,6 @@ Run the following command:
 npm run withdraw
 ```
 
-Example of a [successful withdraw transaction](https://preprod.cardanoscan.io/transaction/b108f91a1dcd1b4c0bc978fb7557fc23ad052f1681cca078aa2515f8ab01e05e).
\ No newline at end of file
+Example of a [successful withdraw transaction](https://preprod.cardanoscan.io/transaction/b108f91a1dcd1b4c0bc978fb7557fc23ad052f1681cca078aa2515f8ab01e05e).
+
+## Demo

From 74466d88624a16c1ca8776d463a030af87751363 Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 10:34:04 +0800
Subject: [PATCH 3/9] tx docs update

---
 apps/playground/src/data/catalyst.ts                  | 2 +-
 apps/playground/src/pages/apis/transaction/common.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/playground/src/data/catalyst.ts b/apps/playground/src/data/catalyst.ts
index d4e8f64c6..ae6a8c8d8 100644
--- a/apps/playground/src/data/catalyst.ts
+++ b/apps/playground/src/data/catalyst.ts
@@ -3,7 +3,7 @@ import { LightBulbIcon } from "@heroicons/react/24/solid";
 export const metaCatalyst = {
   link: `/about/catalyst`,
   title: "Project Catalyst",
-  desc: "Here are proposals that we have submitted to Project Catalyst and its progress.",
+  desc: "Proposals that we have submitted to Project Catalyst and its progress.",
   icon: LightBulbIcon,
 };
 
diff --git a/apps/playground/src/pages/apis/transaction/common.tsx b/apps/playground/src/pages/apis/transaction/common.tsx
index eaa6b7de2..ebe2c55cd 100644
--- a/apps/playground/src/pages/apis/transaction/common.tsx
+++ b/apps/playground/src/pages/apis/transaction/common.tsx
@@ -3,7 +3,7 @@ import Codeblock from "~/components/text/codeblock";
 export function Intro() {
   let example = ``;
   example += `import { Transaction } from '@meshsdk/core';\n\n`;
-  example += `const tx = new Transaction({ initiator: wallet, verbose: true });\n`;
+  example += `const tx = new Transaction({ initiator: wallet, fetcher: blockchainProvider, verbose: true });\n`;
   example += `tx.foo(...); // add transaction methods\n`;
   example += `tx.bar(...); // add transaction methods\n\n`;
   example += `const unsignedTx = await tx.build();\n`;

From e821221d1e00dc8c21bb4e395e928e6435ae4a06 Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 11:07:40 +0800
Subject: [PATCH 4/9] update fetch utxo provider

---
 .../src/pages/providers/blockfrost.tsx        |  1 +
 .../pages/providers/fetchers/fetch-utxos.tsx  | 95 +++++++++++++++++++
 .../src/pages/providers/fetchers/index.tsx    |  5 +
 apps/playground/src/pages/providers/koios.tsx |  1 +
 .../src/pages/providers/maestro.tsx           |  1 +
 apps/playground/src/pages/providers/yaci.tsx  |  1 +
 .../mesh-common/src/interfaces/fetcher.ts     |  2 +-
 packages/mesh-provider/src/blockfrost.ts      | 17 +++-
 packages/mesh-provider/src/koios.ts           | 18 ++--
 packages/mesh-provider/src/maestro.ts         |  8 +-
 packages/mesh-provider/src/yaci.ts            |  9 +-
 11 files changed, 144 insertions(+), 14 deletions(-)
 create mode 100644 apps/playground/src/pages/providers/fetchers/fetch-utxos.tsx

diff --git a/apps/playground/src/pages/providers/blockfrost.tsx b/apps/playground/src/pages/providers/blockfrost.tsx
index a55a167ae..0c0dcdc5e 100644
--- a/apps/playground/src/pages/providers/blockfrost.tsx
+++ b/apps/playground/src/pages/providers/blockfrost.tsx
@@ -29,6 +29,7 @@ const ReactPage: NextPage = () => {
     { label: "Fetch Handle", to: "fetchHandle" },
     { label: "Fetch Protocol Parameters", to: "fetchProtocolParameters" },
     { label: "Fetch Transaction Info", to: "fetchTxInfo" },
+    { label: "Fetch UTxOs", to: "fetchUtxos" },
     { label: "Evaluate Tx", to: "evaluateTx" },
     { label: "Submit Tx", to: "submitTx" },
     { label: "On Transaction Confirmed", to: "onTxConfirmed" },
diff --git a/apps/playground/src/pages/providers/fetchers/fetch-utxos.tsx b/apps/playground/src/pages/providers/fetchers/fetch-utxos.tsx
new file mode 100644
index 000000000..2829611bd
--- /dev/null
+++ b/apps/playground/src/pages/providers/fetchers/fetch-utxos.tsx
@@ -0,0 +1,95 @@
+import { useState } from "react";
+
+import Input from "~/components/form/input";
+import InputTable from "~/components/sections/input-table";
+import LiveCodeDemo from "~/components/sections/live-code-demo";
+import TwoColumnsScroll from "~/components/sections/two-columns-scroll";
+import Codeblock from "~/components/text/codeblock";
+import { SupportedFetchers } from ".";
+
+export default function FetcherUtxos({
+  blockchainProvider,
+  provider,
+}: {
+  blockchainProvider: SupportedFetchers;
+  provider: string;
+}) {
+  const [userInput, setUserInput] = useState<string>(
+    "dfd2a2616e6154a092807b1ceebb9ddcadc0f22cf5c8e0e6b0757815083ccb70",
+  );
+  const [userInput2, setUserInput2] = useState<string>("0");
+
+  return (
+    <TwoColumnsScroll
+      sidebarTo="fetchUtxos"
+      title="Fetch UTxOs"
+      leftSection={Left(userInput, userInput2)}
+      rightSection={Right(
+        blockchainProvider,
+        userInput,
+        setUserInput,
+        userInput2,
+        setUserInput2,
+        provider,
+      )}
+    />
+  );
+}
+
+function Left(userInput: string, userInput2: string) {
+  return (
+    <>
+      <p>Get UTxOs for a given hash.</p>
+      <Codeblock data={`await blockchainProvider.fetchUTxOs('${userInput}')`} />
+      <p>Optionally, you can specify the index of the index output.</p>
+      <Codeblock
+        data={`await blockchainProvider.fetchUTxOs('hash_here', ${userInput2})`}
+      />
+    </>
+  );
+}
+
+function Right(
+  blockchainProvider: SupportedFetchers,
+  userInput: string,
+  setUserInput: (value: string) => void,
+  userInput2: string,
+  setUserInput2: (value: string) => void,
+  provider: string,
+) {
+  async function runDemo() {
+    return await blockchainProvider.fetchUTxOs(
+      userInput,
+      userInput2.length > 0 ? parseInt(userInput2) : undefined,
+    );
+  }
+
+  return (
+    <LiveCodeDemo
+      title="Fetch UTxOs"
+      subtitle="Fetch UTxOs given hash"
+      runCodeFunction={runDemo}
+      runDemoShowProviderInit={true}
+      runDemoProvider={provider}
+    >
+      <InputTable
+        listInputs={[
+          <Input
+            value={userInput}
+            onChange={(e) => setUserInput(e.target.value)}
+            placeholder="Hash"
+            label="Hash"
+            key={0}
+          />,
+          <Input
+            value={userInput2}
+            onChange={(e) => setUserInput2(e.target.value)}
+            placeholder="e.g. 0"
+            label="Index (optional)"
+            key={0}
+          />,
+        ]}
+      />
+    </LiveCodeDemo>
+  );
+}
diff --git a/apps/playground/src/pages/providers/fetchers/index.tsx b/apps/playground/src/pages/providers/fetchers/index.tsx
index e988713db..e752913df 100644
--- a/apps/playground/src/pages/providers/fetchers/index.tsx
+++ b/apps/playground/src/pages/providers/fetchers/index.tsx
@@ -18,6 +18,7 @@ import FetcherHandleAddress from "./fetch-handle-address";
 import FetcherProtocolParameters from "./fetch-protocol-parameters";
 import FetcherTransactionInfo from "./fetch-transaction-info";
 import FetcherGet from "./get";
+import FetcherUtxos from "./fetch-utxos";
 
 export default function ProviderFetchers({
   blockchainProvider,
@@ -74,6 +75,10 @@ export default function ProviderFetchers({
         blockchainProvider={blockchainProvider}
         provider={provider}
       />
+      <FetcherUtxos
+        blockchainProvider={blockchainProvider}
+        provider={provider}
+      />
     </>
   );
 }
diff --git a/apps/playground/src/pages/providers/koios.tsx b/apps/playground/src/pages/providers/koios.tsx
index 2f8cc34bc..d6e631a47 100644
--- a/apps/playground/src/pages/providers/koios.tsx
+++ b/apps/playground/src/pages/providers/koios.tsx
@@ -28,6 +28,7 @@ const ReactPage: NextPage = () => {
     { label: "Fetch Handle", to: "fetchHandle" },
     { label: "Fetch Protocol Parameters", to: "fetchProtocolParameters" },
     { label: "Fetch Transaction Info", to: "fetchTxInfo" },
+    { label: "Fetch UTxOs", to: "fetchUtxos" },
     { label: "Submit Tx", to: "submitTx" },
     { label: "On Transaction Confirmed", to: "onTxConfirmed" },
   ];
diff --git a/apps/playground/src/pages/providers/maestro.tsx b/apps/playground/src/pages/providers/maestro.tsx
index ad0738e24..277025c24 100644
--- a/apps/playground/src/pages/providers/maestro.tsx
+++ b/apps/playground/src/pages/providers/maestro.tsx
@@ -29,6 +29,7 @@ const ReactPage: NextPage = () => {
     { label: "Fetch Handle", to: "fetchHandle" },
     { label: "Fetch Protocol Parameters", to: "fetchProtocolParameters" },
     { label: "Fetch Transaction Info", to: "fetchTxInfo" },
+    { label: "Fetch UTxOs", to: "fetchUtxos" },
     { label: "Evaluate Tx", to: "evaluateTx" },
     { label: "Submit Tx", to: "submitTx" },
     { label: "On Transaction Confirmed", to: "onTxConfirmed" },
diff --git a/apps/playground/src/pages/providers/yaci.tsx b/apps/playground/src/pages/providers/yaci.tsx
index 50aa77dd6..4283cdc86 100644
--- a/apps/playground/src/pages/providers/yaci.tsx
+++ b/apps/playground/src/pages/providers/yaci.tsx
@@ -30,6 +30,7 @@ const ReactPage: NextPage = () => {
     { label: "Fetch Handle", to: "fetchHandle" },
     { label: "Fetch Protocol Parameters", to: "fetchProtocolParameters" },
     { label: "Fetch Transaction Info", to: "fetchTxInfo" },
+    { label: "Fetch UTxOs", to: "fetchUtxos" },
     { label: "Evaluate Tx", to: "evaluateTx" },
     { label: "Submit Tx", to: "submitTx" },
     { label: "On Transaction Confirmed", to: "onTxConfirmed" },
diff --git a/packages/mesh-common/src/interfaces/fetcher.ts b/packages/mesh-common/src/interfaces/fetcher.ts
index 3539e893f..26327c716 100644
--- a/packages/mesh-common/src/interfaces/fetcher.ts
+++ b/packages/mesh-common/src/interfaces/fetcher.ts
@@ -27,6 +27,6 @@ export interface IFetcher {
   fetchHandleAddress(handle: string): Promise<string>;
   fetchProtocolParameters(epoch: number): Promise<Protocol>;
   fetchTxInfo(hash: string): Promise<TransactionInfo>;
-  fetchUTxOs(hash: string): Promise<UTxO[]>;
+  fetchUTxOs(hash: string, index?: number): Promise<UTxO[]>;
   get(url: string): Promise<any>;
 }
diff --git a/packages/mesh-provider/src/blockfrost.ts b/packages/mesh-provider/src/blockfrost.ts
index 7e8e57f3f..15f50ab81 100644
--- a/packages/mesh-provider/src/blockfrost.ts
+++ b/packages/mesh-provider/src/blockfrost.ts
@@ -473,7 +473,17 @@ export class BlockfrostProvider
     }
   }
 
-  async fetchUTxOs(hash: string): Promise<UTxO[]> {
+  async fetchUTxO(hash: string, index?: number): Promise<UTxO | undefined> {
+    try {
+      const utxos = await this.fetchUTxOs(hash);
+      const utxo = utxos.find((utxo) => utxo.input.outputIndex === index);
+      return utxo;
+    } catch (error) {
+      throw parseHttpError(error);
+    }
+  }
+
+  async fetchUTxOs(hash: string, index?: number): Promise<UTxO[]> {
     try {
       const { data, status } = await this._axiosInstance.get(
         `txs/${hash}/utxos`,
@@ -485,6 +495,11 @@ export class BlockfrostProvider
           outputsPromises.push(this.toUTxO(output, hash));
         });
         const outputs = await Promise.all(outputsPromises);
+
+        if(index !== undefined) {
+          return outputs.filter((utxo) => utxo.input.outputIndex === index);
+        }
+        
         return outputs;
       }
       throw parseHttpError(data);
diff --git a/packages/mesh-provider/src/koios.ts b/packages/mesh-provider/src/koios.ts
index 058970547..1d5792c05 100644
--- a/packages/mesh-provider/src/koios.ts
+++ b/packages/mesh-provider/src/koios.ts
@@ -109,12 +109,9 @@ export class KoiosProvider implements IFetcher, IListener, ISubmitter {
    */
   async fetchAddressTransactions(address: string): Promise<TransactionInfo[]> {
     try {
-      const { data, status } = await this._axiosInstance.post(
-        `/address_txs`,
-        {
-          _addresses: [address],
-        }
-      );
+      const { data, status } = await this._axiosInstance.post(`/address_txs`, {
+        _addresses: [address],
+      });
       if (status === 200 || status == 202) {
         return data.map((tx: any) => {
           return <TransactionInfo>{
@@ -365,16 +362,21 @@ export class KoiosProvider implements IFetcher, IListener, ISubmitter {
     }
   }
 
-  async fetchUTxOs(hash: string): Promise<UTxO[]> {
+  async fetchUTxOs(hash: string, index?: number): Promise<UTxO[]> {
     try {
       const { data, status } = await this._axiosInstance.post("tx_info", {
         _tx_hashes: [hash],
       });
 
       if (status === 200) {
-        const utxos = data[0].outputs.map((utxo: KoiosUTxO) =>
+        const utxos: UTxO[] = data[0].outputs.map((utxo: KoiosUTxO) =>
           this.toUTxO(utxo, "undefined"),
         );
+
+        if (index !== undefined) {
+          return utxos.filter((utxo) => utxo.input.outputIndex === index);
+        }
+
         return utxos;
       }
       throw parseHttpError(data);
diff --git a/packages/mesh-provider/src/maestro.ts b/packages/mesh-provider/src/maestro.ts
index 72951d194..8e55ba430 100644
--- a/packages/mesh-provider/src/maestro.ts
+++ b/packages/mesh-provider/src/maestro.ts
@@ -210,7 +210,6 @@ export class MaestroProvider
         `assets/${policyId}${assetName}`,
       );
       if (status === 200) {
-        
         const data = timestampedData.data;
         return <AssetMetadata>{
           ...data.asset_standards.cip25_metadata,
@@ -420,7 +419,7 @@ export class MaestroProvider
     }
   }
 
-  async fetchUTxOs(hash: string): Promise<UTxO[]> {
+  async fetchUTxOs(hash: string, index?: number): Promise<UTxO[]> {
     try {
       const { data: timestampedData, status } = await this._axiosInstance.get(
         `transactions/${hash}`,
@@ -429,6 +428,11 @@ export class MaestroProvider
       if (status === 200) {
         const msOutputs = timestampedData.data.outputs as MaestroUTxO[];
         const outputs = msOutputs.map(this.toUTxO);
+
+        if (index !== undefined) {
+          return outputs.filter((utxo) => utxo.input.outputIndex === index);
+        }
+
         return outputs;
       }
       throw parseHttpError(timestampedData);
diff --git a/packages/mesh-provider/src/yaci.ts b/packages/mesh-provider/src/yaci.ts
index bc9862b30..2de7a61c2 100644
--- a/packages/mesh-provider/src/yaci.ts
+++ b/packages/mesh-provider/src/yaci.ts
@@ -29,7 +29,7 @@ import { parseAssetUnit } from "./utils/parse-asset-unit";
 
 /**
  * Yaci DevKit is a development tool designed for rapid and efficient Cardano blockchain development. It allows developers to create and destroy custom Cardano devnets in seconds, providing fast feedback loops and simplifying the iteration process.
- * 
+ *
  * Get started:
  * ```typescript
  * import { YaciProvider } from "@meshsdk/core";
@@ -350,7 +350,7 @@ export class YaciProvider
     }
   }
 
-  async fetchUTxOs(hash: string): Promise<UTxO[]> {
+  async fetchUTxOs(hash: string, index?: number): Promise<UTxO[]> {
     try {
       const { data, status } = await this._axiosInstance.get(
         `txs/${hash}/utxos`,
@@ -362,6 +362,11 @@ export class YaciProvider
           outputsPromises.push(this.toUTxO(output, hash));
         });
         const outputs = await Promise.all(outputsPromises);
+
+        if (index !== undefined) {
+          return outputs.filter((utxo) => utxo.input.outputIndex === index);
+        }
+
         return outputs;
       }
       throw parseHttpError(data);

From 52d74d0e2b9203627176193ae543bbbfd2806f10 Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 11:44:39 +0800
Subject: [PATCH 5/9] update og image

---
 apps/playground/package.json                  |   1 +
 .../src/components/site/metatags.tsx          |  20 +-
 apps/playground/src/pages/404.tsx             |   2 +
 apps/playground/src/pages/api/og.tsx          |  77 +++++
 package-lock.json                             | 273 +++++++++++++++---
 5 files changed, 324 insertions(+), 49 deletions(-)
 create mode 100644 apps/playground/src/pages/api/og.tsx

diff --git a/apps/playground/package.json b/apps/playground/package.json
index e815de1d1..e8bbc59b8 100644
--- a/apps/playground/package.json
+++ b/apps/playground/package.json
@@ -20,6 +20,7 @@
     "@meshsdk/react": "*",
     "@next/mdx": "^14.2.3",
     "@next/third-parties": "^14.2.5",
+    "@vercel/og": "^0.6.3",
     "copy-to-clipboard": "^3.3.3",
     "flowbite": "^2.5.1",
     "flowbite-react": "^0.9.0",
diff --git a/apps/playground/src/components/site/metatags.tsx b/apps/playground/src/components/site/metatags.tsx
index 10d0911e0..86e302c7e 100644
--- a/apps/playground/src/components/site/metatags.tsx
+++ b/apps/playground/src/components/site/metatags.tsx
@@ -4,7 +4,7 @@ export default function Metatags({
   title,
   keywords,
   description,
-  image = "/logo-mesh/mesh.png",
+  image,
 }: {
   title?: string;
   keywords?: string;
@@ -38,20 +38,30 @@ export default function Metatags({
       <meta property="og:site_name" content={title} />
       <meta property="og:type" content="website" />
       <meta property="og:description" content={description} />
-      {image && (
+      {image ? (
         <meta property="og:image" content={`https://meshjs.dev${image}`} />
+      ) : (
+        <meta
+          property="og:image"
+          content={`https://meshjs.dev/api/og?title=${title}`}
+        />
       )}
-      {image && <meta property="og:image:alt" content={title} />}
+      <meta property="og:image:alt" content={title} />
 
       <meta name="twitter:card" content="summary_large_image" />
       <meta name="twitter:site" content="@meshsdk" />
       <meta name="twitter:title" content={title} />
       <meta name="twitter:description" content={description} />
       <meta name="twitter:creator" content="@meshsdk" />
-      {image && (
+      {image ? (
         <meta name="twitter:image" content={`https://meshjs.dev${image}`} />
+      ) : (
+        <meta
+          name="twitter:image"
+          content={`https://meshjs.dev/api/og?title=${title}`}
+        />
       )}
-      {image && <meta name="twitter:image:alt" content={title} />}
+      <meta name="twitter:image:alt" content={title} />
 
       <link
         rel="apple-touch-icon"
diff --git a/apps/playground/src/pages/404.tsx b/apps/playground/src/pages/404.tsx
index 33d0e4dea..87724f9a1 100644
--- a/apps/playground/src/pages/404.tsx
+++ b/apps/playground/src/pages/404.tsx
@@ -11,6 +11,8 @@ const ReactPage: NextPage = () => {
           <div className="mx-auto max-w-screen-sm text-center">
             <p className="mb-8 font-medium text-gray-500 sm:text-2xl dark:text-gray-400">
               Whoops! This page doesn't exist.
+              <br />
+              Check the links below to find what you're looking for.
             </p>
           </div>
         </div>
diff --git a/apps/playground/src/pages/api/og.tsx b/apps/playground/src/pages/api/og.tsx
new file mode 100644
index 000000000..b28f9bc63
--- /dev/null
+++ b/apps/playground/src/pages/api/og.tsx
@@ -0,0 +1,77 @@
+import { NextRequest } from "next/server";
+import { ImageResponse } from "@vercel/og";
+
+export const config = {
+  runtime: "edge",
+};
+
+export default function handler(request: NextRequest) {
+  try {
+    const { searchParams } = new URL(request.url);
+
+    // ?title=<title>
+    const hasTitle = searchParams.has("title");
+    const title = hasTitle
+      ? searchParams.get("title")?.slice(0, 100)
+      : "Mesh JS - Cardano Web3 TypeScript SDK & off-chain Framework";
+
+    return new ImageResponse(
+      (
+        <div
+          style={{
+            backgroundColor: "black",
+            backgroundSize: "150px 150px",
+            height: "100%",
+            width: "100%",
+            display: "flex",
+            textAlign: "center",
+            alignItems: "center",
+            justifyContent: "center",
+            flexDirection: "column",
+            flexWrap: "nowrap",
+          }}
+        >
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              justifyItems: "center",
+            }}
+          >
+            <svg
+              viewBox="0 0 300 200"
+              xmlns="http://www.w3.org/2000/svg"
+              fill="white"
+            >
+              <path d="m289 127-45-60-45-60c-.9-1.3-2.4-2-4-2s-3.1.7-4 2l-37 49.3c-2 2.7-6 2.7-8 0l-37-49.3c-.9-1.3-2.4-2-4-2s-3.1.7-4 2l-45 60-45 60c-1.3 1.8-1.3 4.2 0 6l45 60c.9 1.3 2.4 2 4 2s3.1-.7 4-2l37-49.3c2-2.7 6-2.7 8 0l37 49.3c.9 1.3 2.4 2 4 2s3.1-.7 4-2l37-49.3c2-2.7 6-2.7 8 0l37 49.3c.9 1.3 2.4 2 4 2s3.1-.7 4-2l45-60c1.3-1.8 1.3-4.2 0-6zm-90-103.3 32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0l-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0zm-90 0 32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0l-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0zm-53 152.6-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0zm90 0-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0zm90 0-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0z" />
+            </svg>
+          </div>
+          <div
+            style={{
+              fontSize: 60,
+              fontStyle: "normal",
+              letterSpacing: "-0.025em",
+              color: "white",
+              marginTop: 30,
+              padding: "0 120px",
+              lineHeight: 1.4,
+              whiteSpace: "pre-wrap",
+            }}
+          >
+            {title}
+          </div>
+        </div>
+      ),
+      {
+        width: 1200,
+        height: 630,
+      },
+    );
+  } catch (e: any) {
+    console.log(`${e.message}`);
+    return new Response(`Failed to generate the image`, {
+      status: 500,
+    });
+  }
+}
diff --git a/package-lock.json b/package-lock.json
index 11c40a57d..e84eff185 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -285,6 +285,7 @@
         "@meshsdk/react": "*",
         "@next/mdx": "^14.2.3",
         "@next/third-parties": "^14.2.5",
+        "@vercel/og": "^0.6.3",
         "copy-to-clipboard": "^3.3.3",
         "flowbite": "^2.5.1",
         "flowbite-react": "^0.9.0",
@@ -13002,6 +13003,14 @@
         "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
       }
     },
+    "node_modules/@resvg/resvg-wasm": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/@resvg/resvg-wasm/-/resvg-wasm-2.4.0.tgz",
+      "integrity": "sha512-C7c51Nn4yTxXFKvgh2txJFNweaVcfUPQxwEUFw4aWsCmfiBDJsTSwviIF8EcwjQ6k8bPyMWCl1vw4BdxE569Cg==",
+      "engines": {
+        "node": ">= 10"
+      }
+    },
     "node_modules/@rollup/plugin-alias": {
       "version": "3.1.9",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-alias/-/plugin-alias-3.1.9.tgz",
@@ -13504,17 +13513,30 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@shuding/opentype.js": {
+      "version": "1.4.0-beta.0",
+      "resolved": "https://registry.npmjs.org/@shuding/opentype.js/-/opentype.js-1.4.0-beta.0.tgz",
+      "integrity": "sha512-3NgmNyH3l/Hv6EvsWJbsvpcpUba6R8IREQ83nH83cyakCw7uM1arZKNfHwv1Wz6jgqrF/j4x5ELvR6PnK9nTcA==",
+      "dependencies": {
+        "fflate": "^0.7.3",
+        "string.prototype.codepointat": "^0.2.1"
+      },
+      "bin": {
+        "ot": "bin/ot"
+      },
+      "engines": {
+        "node": ">= 8.0.0"
+      }
+    },
     "node_modules/@sidan-lab/sidan-csl-rs-browser": {
-      "version": "0.9.4",
-      "resolved": "https://registry.npmjs.org/@sidan-lab/sidan-csl-rs-browser/-/sidan-csl-rs-browser-0.9.4.tgz",
-      "integrity": "sha512-+WUeS0aTkh+j/kSjY/qFcXdJQUfhKvZAAxXrjv+i2/EaIphcv1XDGb05CoPUaX+4nUh2lLssFAnc4tEhei3w/w==",
-      "license": "Apache-2.0"
+      "version": "0.9.5",
+      "resolved": "https://registry.npmjs.org/@sidan-lab/sidan-csl-rs-browser/-/sidan-csl-rs-browser-0.9.5.tgz",
+      "integrity": "sha512-Q8XwrjfjzN+X5ulxD8K3/R5uot4j3+hsDmhZycW1qhFsJ+hJ9J5pkBa50j4BHjtOP2UE/o04Yh2CgOwoLXFCnA=="
     },
     "node_modules/@sidan-lab/sidan-csl-rs-nodejs": {
-      "version": "0.9.4",
-      "resolved": "https://registry.npmjs.org/@sidan-lab/sidan-csl-rs-nodejs/-/sidan-csl-rs-nodejs-0.9.4.tgz",
-      "integrity": "sha512-dmuEkPiDWcdlkOiE72HS3EkY8/XwMxR/ottgrcNcUw6fw09CSL5lynqklQEkTgwV060btvhjZ87ELfEda3w/pA==",
-      "license": "Apache-2.0"
+      "version": "0.9.5",
+      "resolved": "https://registry.npmjs.org/@sidan-lab/sidan-csl-rs-nodejs/-/sidan-csl-rs-nodejs-0.9.5.tgz",
+      "integrity": "sha512-l8gYVULmD+ggU79/xKKucKjtbqnIXuh2S3bAQfOPAA3AvN9TJuyT563lABUZIMtVMHkyKWo+Dd4la9EthLuPUw=="
     },
     "node_modules/@sinclair/typebox": {
       "version": "0.27.8",
@@ -14396,6 +14418,19 @@
         "node": ">=20.0.0"
       }
     },
+    "node_modules/@vercel/og": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/@vercel/og/-/og-0.6.3.tgz",
+      "integrity": "sha512-aoCrC9FqkeA+WEEb9CwSmjD0rGlFeNqbUsI41JPmKWR9Hx6FFn86tvH96O5HZMF6VAXTGHxa3nPH3BokROpdgA==",
+      "dependencies": {
+        "@resvg/resvg-wasm": "2.4.0",
+        "satori": "0.10.9",
+        "yoga-wasm-web": "0.3.3"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/@vercel/style-guide": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/@vercel/style-guide/-/style-guide-5.2.0.tgz",
@@ -16009,6 +16044,14 @@
         "node": ">=8"
       }
     },
+    "node_modules/camelize": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.1.tgz",
+      "integrity": "sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001677",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001677.tgz",
@@ -16219,6 +16262,7 @@
       "version": "3.9.0",
       "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-3.9.0.tgz",
       "integrity": "sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==",
+      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -16561,6 +16605,34 @@
         "node": ">= 8"
       }
     },
+    "node_modules/css-background-parser": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/css-background-parser/-/css-background-parser-0.1.0.tgz",
+      "integrity": "sha512-2EZLisiZQ+7m4wwur/qiYJRniHX4K5Tc9w93MT3AS0WS1u5kaZ4FKXlOTBhOjc+CgEgPiGY+fX1yWD8UwpEqUA=="
+    },
+    "node_modules/css-box-shadow": {
+      "version": "1.0.0-3",
+      "resolved": "https://registry.npmjs.org/css-box-shadow/-/css-box-shadow-1.0.0-3.tgz",
+      "integrity": "sha512-9jaqR6e7Ohds+aWwmhe6wILJ99xYQbfmK9QQB9CcMjDbTxPZjwEmUQpU91OG05Xgm8BahT5fW+svbsQGjS/zPg=="
+    },
+    "node_modules/css-color-keywords": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz",
+      "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/css-to-react-native": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.2.0.tgz",
+      "integrity": "sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==",
+      "dependencies": {
+        "camelize": "^1.0.0",
+        "css-color-keywords": "^1.0.0",
+        "postcss-value-parser": "^4.0.2"
+      }
+    },
     "node_modules/cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -17451,6 +17523,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="
+    },
     "node_modules/escape-string-regexp": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
@@ -18465,6 +18542,11 @@
         "bser": "2.1.1"
       }
     },
+    "node_modules/fflate": {
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.7.4.tgz",
+      "integrity": "sha512-5u2V/CDW15QM1XbbgS+0DfPxVB+jUKhWEKuuFuHncbk3tEEqzmoXL+2KyOFuKGqOnmdIy0/davWF1CkuwtibCw=="
+    },
     "node_modules/figlet": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/figlet/-/figlet-1.7.0.tgz",
@@ -19588,6 +19670,17 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/hex-rgb": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/hex-rgb/-/hex-rgb-4.3.0.tgz",
+      "integrity": "sha512-Ox1pJVrDCyGHMG9CFg1tmrRUMRPRsAWYc/PinY0XzJU4K7y7vjNoLKIQ7BR5UJMCxNN8EM1MNDmHWA/B3aZUuw==",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/highlight-words-core": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/highlight-words-core/-/highlight-words-core-1.2.3.tgz",
@@ -19618,6 +19711,7 @@
       "version": "2.8.9",
       "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
       "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
+      "dev": true,
       "license": "ISC"
     },
     "node_modules/html-escaper": {
@@ -21315,6 +21409,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
       "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/json-schema-traverse": {
@@ -21468,6 +21563,23 @@
         "node": ">=10"
       }
     },
+    "node_modules/linebreak": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/linebreak/-/linebreak-1.1.0.tgz",
+      "integrity": "sha512-MHp03UImeVhB7XZtjd0E4n6+3xr5Dq/9xI/5FptGk5FrbDR3zagPa2DS6U8ks/3HjbKWG9Q1M2ufOzxV2qLYSQ==",
+      "dependencies": {
+        "base64-js": "0.0.8",
+        "unicode-trie": "^2.0.0"
+      }
+    },
+    "node_modules/linebreak/node_modules/base64-js": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-0.0.8.tgz",
+      "integrity": "sha512-3XSA2cR/h/73EzlXXdU6YNycmYI7+kicTxks4eJg2g39biHR84slg2+des+p7iHYhbRg/udIS4TD53WabcOUkw==",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/lines-and-columns": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@@ -22699,6 +22811,7 @@
       "version": "4.2.8",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-4.2.8.tgz",
       "integrity": "sha512-fNzuVyifolSLFL4NzpF+wEF4qrgqaaKX0haXPQEdQ7NKAN+WecoKMHV09YcuL/DHxrUsYQOK3MiuDf7Ip2OXfQ==",
+      "dev": true,
       "license": "ISC",
       "engines": {
         "node": ">=8"
@@ -22958,6 +23071,7 @@
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
       "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
+      "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
         "hosted-git-info": "^2.1.4",
@@ -22970,6 +23084,7 @@
       "version": "5.7.2",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
       "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
+      "dev": true,
       "license": "ISC",
       "bin": {
         "semver": "bin/semver"
@@ -26221,6 +26336,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/pako": {
+      "version": "0.2.9",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
+      "integrity": "sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA=="
+    },
     "node_modules/parent-module": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -26233,6 +26353,15 @@
         "node": ">=6"
       }
     },
+    "node_modules/parse-css-color": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/parse-css-color/-/parse-css-color-0.2.1.tgz",
+      "integrity": "sha512-bwS/GGIFV3b6KS4uwpzCFj4w297Yl3uqnSgIPsoQkx7GMLROXfMnWvxfNkL0oh8HVhZA4hvJoEoEIqonfJ3BWg==",
+      "dependencies": {
+        "color-name": "^1.1.4",
+        "hex-rgb": "^4.1.0"
+      }
+    },
     "node_modules/parse-entities": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/parse-entities/-/parse-entities-4.0.1.tgz",
@@ -27779,6 +27908,31 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
       "license": "MIT"
     },
+    "node_modules/satori": {
+      "version": "0.10.9",
+      "resolved": "https://registry.npmjs.org/satori/-/satori-0.10.9.tgz",
+      "integrity": "sha512-XU9EELUEZuioT4acLIpCXxHcFzrsC8muvg0MY28d+TlqwxbkTzBmWbw+3+hnCzXT7YZ0Qm8k3eXktDaEu+qmEw==",
+      "dependencies": {
+        "@shuding/opentype.js": "1.4.0-beta.0",
+        "css-background-parser": "^0.1.0",
+        "css-box-shadow": "1.0.0-3",
+        "css-to-react-native": "^3.0.0",
+        "emoji-regex": "^10.2.1",
+        "escape-html": "^1.0.3",
+        "linebreak": "^1.1.0",
+        "parse-css-color": "^0.2.1",
+        "postcss-value-parser": "^4.2.0",
+        "yoga-wasm-web": "^0.3.3"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/satori/node_modules/emoji-regex": {
+      "version": "10.4.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz",
+      "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw=="
+    },
     "node_modules/scheduler": {
       "version": "0.23.2",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
@@ -28082,6 +28236,7 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
       "integrity": "sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==",
+      "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
         "spdx-expression-parse": "^3.0.0",
@@ -28092,12 +28247,14 @@
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
       "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
+      "dev": true,
       "license": "CC-BY-3.0"
     },
     "node_modules/spdx-expression-parse": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz",
       "integrity": "sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "spdx-exceptions": "^2.1.0",
@@ -28108,6 +28265,7 @@
       "version": "3.0.20",
       "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.20.tgz",
       "integrity": "sha512-jg25NiDV/1fLtSgEgyvVyDunvaNHbuwF9lfNV17gSmPFAlYzdfNBlLtLzXTevwkPj7DhGbmN9VnmJIgLnhvaBw==",
+      "dev": true,
       "license": "CC0-1.0"
     },
     "node_modules/split-ca": {
@@ -28256,6 +28414,11 @@
         "url": "https://github.com/chalk/strip-ansi?sponsor=1"
       }
     },
+    "node_modules/string.prototype.codepointat": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.1.tgz",
+      "integrity": "sha512-2cBVCj6I4IOvEnjgO/hWqXjqBGsY+zwPmHl12Srk9IXSZ56Jwwmy+66XO5Iut/oQVR7t5ihYdLB0GMa4alEUcg=="
+    },
     "node_modules/string.prototype.includes": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/string.prototype.includes/-/string.prototype.includes-2.0.1.tgz",
@@ -28809,6 +28972,11 @@
       "integrity": "sha512-oB7yIimd8SuGptespDAZnNkzIz+NWaJCu2RMsbs4Wmp9zSDUM8Nhi3s2OOcqYuv3mN4hitXc8DVx+LyUmbUDiA==",
       "license": "ISC"
     },
+    "node_modules/tiny-inflate": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz",
+      "integrity": "sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw=="
+    },
     "node_modules/tinyexec": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-0.3.1.tgz",
@@ -29696,6 +29864,15 @@
       "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==",
       "license": "MIT"
     },
+    "node_modules/unicode-trie": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unicode-trie/-/unicode-trie-2.0.0.tgz",
+      "integrity": "sha512-x7bc76x0bm4prf1VLg79uhAzKw8DVboClSN5VxJuQ+LKDOVEW9CdH+VY7SP+vX7xCYQqzzgQpFqz15zeLvAtZQ==",
+      "dependencies": {
+        "pako": "^0.2.5",
+        "tiny-inflate": "^1.0.0"
+      }
+    },
     "node_modules/unified": {
       "version": "11.0.5",
       "resolved": "https://registry.npmjs.org/unified/-/unified-11.0.5.tgz",
@@ -29943,6 +30120,7 @@
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
       "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
+      "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
         "spdx-correct": "^3.0.0",
@@ -30228,6 +30406,7 @@
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz",
       "integrity": "sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==",
+      "dev": true,
       "license": "ISC",
       "dependencies": {
         "imurmurhash": "^0.1.4",
@@ -30241,6 +30420,7 @@
       "version": "3.0.7",
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
       "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
+      "dev": true,
       "license": "ISC"
     },
     "node_modules/ws": {
@@ -30380,6 +30560,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/yoga-wasm-web": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/yoga-wasm-web/-/yoga-wasm-web-0.3.3.tgz",
+      "integrity": "sha512-N+d4UJSJbt/R3wqY7Coqs5pcV0aUj2j9IaQ3rNj9bVCLld8tTGKRa2USARjnvZJWVx1NDmQev8EknoczaOQDOA=="
+    },
     "node_modules/zod": {
       "version": "3.23.8",
       "resolved": "https://registry.npmjs.org/zod/-/zod-3.23.8.tgz",
@@ -30688,7 +30873,7 @@
     },
     "packages/mesh-common": {
       "name": "@meshsdk/common",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
         "bech32": "^2.0.0",
@@ -30705,12 +30890,12 @@
     },
     "packages/mesh-contract": {
       "name": "@meshsdk/contract",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/core": "1.7.12",
-        "@meshsdk/core-csl": "1.7.12"
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/core": "1.7.13",
+        "@meshsdk/core-csl": "1.7.13"
       },
       "devDependencies": {
         "@meshsdk/configs": "*",
@@ -30721,16 +30906,16 @@
     },
     "packages/mesh-core": {
       "name": "@meshsdk/core",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/core-csl": "1.7.12",
-        "@meshsdk/core-cst": "1.7.12",
-        "@meshsdk/provider": "1.7.12",
-        "@meshsdk/react": "1.7.12",
-        "@meshsdk/transaction": "1.7.12",
-        "@meshsdk/wallet": "1.7.12"
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/core-csl": "1.7.13",
+        "@meshsdk/core-cst": "1.7.13",
+        "@meshsdk/provider": "1.7.13",
+        "@meshsdk/react": "1.7.13",
+        "@meshsdk/transaction": "1.7.13",
+        "@meshsdk/wallet": "1.7.13"
       },
       "devDependencies": {
         "@meshsdk/configs": "*",
@@ -30741,12 +30926,12 @@
     },
     "packages/mesh-core-csl": {
       "name": "@meshsdk/core-csl",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@sidan-lab/sidan-csl-rs-browser": "0.9.4",
-        "@sidan-lab/sidan-csl-rs-nodejs": "0.9.4",
+        "@meshsdk/common": "1.7.13",
+        "@sidan-lab/sidan-csl-rs-browser": "0.9.5",
+        "@sidan-lab/sidan-csl-rs-nodejs": "0.9.5",
         "json-bigint": "^1.0.0"
       },
       "devDependencies": {
@@ -30760,7 +30945,7 @@
     },
     "packages/mesh-core-cst": {
       "name": "@meshsdk/core-cst",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
         "@cardano-sdk/core": "0.35.4",
@@ -30769,7 +30954,7 @@
         "@harmoniclabs/cbor": "1.3.0",
         "@harmoniclabs/plutus-data": "1.2.4",
         "@harmoniclabs/uplc": "1.2.4",
-        "@meshsdk/common": "1.7.12",
+        "@meshsdk/common": "1.7.13",
         "@stricahq/bip32ed25519": "^1.1.0",
         "@stricahq/cbors": "^1.0.0",
         "pbkdf2": "^3.1.2"
@@ -30786,11 +30971,11 @@
     },
     "packages/mesh-provider": {
       "name": "@meshsdk/provider",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/core-cst": "1.7.12",
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/core-cst": "1.7.13",
         "@utxorpc/sdk": "0.6.2",
         "@utxorpc/spec": "0.10.1",
         "axios": "^1.7.2"
@@ -30804,12 +30989,12 @@
     },
     "packages/mesh-react": {
       "name": "@meshsdk/react",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/transaction": "1.7.12",
-        "@meshsdk/wallet": "1.7.12",
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/transaction": "1.7.13",
+        "@meshsdk/wallet": "1.7.13",
         "react": "^18.2.0"
       },
       "devDependencies": {
@@ -30824,12 +31009,12 @@
     },
     "packages/mesh-transaction": {
       "name": "@meshsdk/transaction",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/core-csl": "1.7.12",
-        "@meshsdk/core-cst": "1.7.12",
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/core-csl": "1.7.13",
+        "@meshsdk/core-cst": "1.7.13",
         "json-bigint": "^1.0.0"
       },
       "devDependencies": {
@@ -30842,13 +31027,13 @@
     },
     "packages/mesh-wallet": {
       "name": "@meshsdk/wallet",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
-        "@meshsdk/common": "1.7.12",
-        "@meshsdk/core-csl": "1.7.12",
-        "@meshsdk/core-cst": "1.7.12",
-        "@meshsdk/transaction": "1.7.12",
+        "@meshsdk/common": "1.7.13",
+        "@meshsdk/core-csl": "1.7.13",
+        "@meshsdk/core-cst": "1.7.13",
+        "@meshsdk/transaction": "1.7.13",
         "@nufi/dapp-client-cardano": "0.3.5",
         "@nufi/dapp-client-core": "0.3.5"
       },
@@ -30862,7 +31047,7 @@
     },
     "scripts/mesh-cli": {
       "name": "meshjs",
-      "version": "1.7.12",
+      "version": "1.7.13",
       "license": "Apache-2.0",
       "dependencies": {
         "chalk": "5.3.0",

From 2603a1e8e870dfe61f837cffd2c7e55a9916776e Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 11:45:28 +0800
Subject: [PATCH 6/9] bump version

---
 packages/mesh-common/package.json      |  2 +-
 packages/mesh-contract/package.json    |  8 ++++----
 packages/mesh-core-csl/package.json    |  4 ++--
 packages/mesh-core-cst/package.json    |  4 ++--
 packages/mesh-core/package.json        | 16 ++++++++--------
 packages/mesh-provider/package.json    |  6 +++---
 packages/mesh-react/package.json       |  8 ++++----
 packages/mesh-transaction/package.json |  8 ++++----
 packages/mesh-wallet/package.json      | 10 +++++-----
 scripts/mesh-cli/package.json          |  2 +-
 10 files changed, 34 insertions(+), 34 deletions(-)

diff --git a/packages/mesh-common/package.json b/packages/mesh-common/package.json
index 52fb1c9c7..b7e93b6ca 100644
--- a/packages/mesh-common/package.json
+++ b/packages/mesh-common/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/common",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
diff --git a/packages/mesh-contract/package.json b/packages/mesh-contract/package.json
index a0471d11d..096197fc0 100644
--- a/packages/mesh-contract/package.json
+++ b/packages/mesh-contract/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/contract",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -34,9 +34,9 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/core": "1.7.13",
-    "@meshsdk/core-csl": "1.7.13"
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/core": "1.7.14",
+    "@meshsdk/core-csl": "1.7.14"
   },
   "prettier": "@meshsdk/configs/prettier",
   "publishConfig": {
diff --git a/packages/mesh-core-csl/package.json b/packages/mesh-core-csl/package.json
index 68b8939e8..c76498f34 100644
--- a/packages/mesh-core-csl/package.json
+++ b/packages/mesh-core-csl/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/core-csl",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -38,7 +38,7 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
+    "@meshsdk/common": "1.7.14",
     "@sidan-lab/sidan-csl-rs-browser": "0.9.5",
     "@sidan-lab/sidan-csl-rs-nodejs": "0.9.5",
     "json-bigint": "^1.0.0"
diff --git a/packages/mesh-core-cst/package.json b/packages/mesh-core-cst/package.json
index 71d450026..2246e1584 100644
--- a/packages/mesh-core-cst/package.json
+++ b/packages/mesh-core-cst/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/core-cst",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -42,7 +42,7 @@
     "@harmoniclabs/cbor": "1.3.0",
     "@harmoniclabs/plutus-data": "1.2.4",
     "@harmoniclabs/uplc": "1.2.4",
-    "@meshsdk/common": "1.7.13",
+    "@meshsdk/common": "1.7.14",
     "@stricahq/bip32ed25519": "^1.1.0",
     "@stricahq/cbors": "^1.0.0",
     "pbkdf2": "^3.1.2"
diff --git a/packages/mesh-core/package.json b/packages/mesh-core/package.json
index f7e7c2066..ab423ee68 100644
--- a/packages/mesh-core/package.json
+++ b/packages/mesh-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/core",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -33,13 +33,13 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/core-csl": "1.7.13",
-    "@meshsdk/core-cst": "1.7.13",
-    "@meshsdk/provider": "1.7.13",
-    "@meshsdk/react": "1.7.13",
-    "@meshsdk/transaction": "1.7.13",
-    "@meshsdk/wallet": "1.7.13"
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/core-csl": "1.7.14",
+    "@meshsdk/core-cst": "1.7.14",
+    "@meshsdk/provider": "1.7.14",
+    "@meshsdk/react": "1.7.14",
+    "@meshsdk/transaction": "1.7.14",
+    "@meshsdk/wallet": "1.7.14"
   },
   "prettier": "@meshsdk/configs/prettier",
   "publishConfig": {
diff --git a/packages/mesh-provider/package.json b/packages/mesh-provider/package.json
index 9b3273020..1b37f518d 100644
--- a/packages/mesh-provider/package.json
+++ b/packages/mesh-provider/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/provider",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -34,8 +34,8 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/core-cst": "1.7.13",
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/core-cst": "1.7.14",
     "@utxorpc/sdk": "0.6.2",
     "@utxorpc/spec": "0.10.1",
     "axios": "^1.7.2"
diff --git a/packages/mesh-react/package.json b/packages/mesh-react/package.json
index 5c2278cc8..1e8d5e5be 100644
--- a/packages/mesh-react/package.json
+++ b/packages/mesh-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/react",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -30,9 +30,9 @@
   },
   "dependencies": {
     "react": "^18.2.0",
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/transaction": "1.7.13",
-    "@meshsdk/wallet": "1.7.13"
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/transaction": "1.7.14",
+    "@meshsdk/wallet": "1.7.14"
   },
   "devDependencies": {
     "@meshsdk/configs": "*",
diff --git a/packages/mesh-transaction/package.json b/packages/mesh-transaction/package.json
index 2ffedecaa..77dfc0383 100644
--- a/packages/mesh-transaction/package.json
+++ b/packages/mesh-transaction/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/transaction",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -35,9 +35,9 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/core-csl": "1.7.13",
-    "@meshsdk/core-cst": "1.7.13",
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/core-csl": "1.7.14",
+    "@meshsdk/core-cst": "1.7.14",
     "json-bigint": "^1.0.0"
   },
   "prettier": "@meshsdk/configs/prettier",
diff --git a/packages/mesh-wallet/package.json b/packages/mesh-wallet/package.json
index 12c70b344..a2cf32bed 100644
--- a/packages/mesh-wallet/package.json
+++ b/packages/mesh-wallet/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@meshsdk/wallet",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "description": "",
   "main": "./dist/index.cjs",
   "browser": "./dist/index.js",
@@ -35,10 +35,10 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@meshsdk/common": "1.7.13",
-    "@meshsdk/core-csl": "1.7.13",
-    "@meshsdk/core-cst": "1.7.13",
-    "@meshsdk/transaction": "1.7.13",
+    "@meshsdk/common": "1.7.14",
+    "@meshsdk/core-csl": "1.7.14",
+    "@meshsdk/core-cst": "1.7.14",
+    "@meshsdk/transaction": "1.7.14",
     "@nufi/dapp-client-cardano": "0.3.5",
     "@nufi/dapp-client-core": "0.3.5"
   },
diff --git a/scripts/mesh-cli/package.json b/scripts/mesh-cli/package.json
index f436ef1f7..c454d83b6 100644
--- a/scripts/mesh-cli/package.json
+++ b/scripts/mesh-cli/package.json
@@ -3,7 +3,7 @@
   "description": "A quick and easy way to bootstrap your dApps on Cardano using Mesh.",
   "homepage": "https://meshjs.dev",
   "author": "MeshJS",
-  "version": "1.7.13",
+  "version": "1.7.14",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.cjs",

From 94edf4d3d7d63e5261b5d4f297760d3eb261aa58 Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 12:22:46 +0800
Subject: [PATCH 7/9] attempt to improve og

---
 .../src/components/site/metatags.tsx          | 38 ++++++++++++-------
 apps/playground/src/pages/api/og.tsx          |  2 +-
 2 files changed, 26 insertions(+), 14 deletions(-)

diff --git a/apps/playground/src/components/site/metatags.tsx b/apps/playground/src/components/site/metatags.tsx
index 86e302c7e..1c806c1d9 100644
--- a/apps/playground/src/components/site/metatags.tsx
+++ b/apps/playground/src/components/site/metatags.tsx
@@ -4,12 +4,10 @@ export default function Metatags({
   title,
   keywords,
   description,
-  image,
 }: {
   title?: string;
   keywords?: string;
   description?: string;
-  image?: string;
 }) {
   if (description === undefined) {
     description =
@@ -19,49 +17,63 @@ export default function Metatags({
     keywords =
       "developer, tools, cardano, blockchain, sdk, plutus, crypto, web3, metaverse, gaming, ecommerce, nfts, apis, aiken";
   }
+
+  let _title = title;
   if (title === undefined) {
-    title = "Cardano Web3 TypeScript SDK & off-chain Framework";
+    _title = "Mesh JS - Cardano Web3 TypeScript SDK & Off-Chain Framework";
+  } else {
+    title = title + " - Mesh JS";
   }
 
-  title = title + " - Mesh JS";
-
   return (
     <Head>
       <meta name="viewport" content="width=device-width, initial-scale=1" />
       <meta charSet="utf-8" />
 
-      <title>{title}</title>
+      <title>{title ? title : _title}</title>
       <meta name="description" content={description} />
       <meta name="keywords" content={keywords} />
 
-      <meta property="og:title" content={title} />
-      <meta property="og:site_name" content={title} />
+      <meta property="og:title" content={_title} />
+      <meta property="og:site_name" content={_title} />
       <meta property="og:type" content="website" />
       <meta property="og:description" content={description} />
-      {image ? (
+      {/* {image ? (
         <meta property="og:image" content={`https://meshjs.dev${image}`} />
       ) : (
         <meta
           property="og:image"
           content={`https://meshjs.dev/api/og?title=${title}`}
         />
+      )} */}
+      {title && (
+        <meta
+          property="og:image"
+          content={`https://meshjs.dev/api/og?title=${title}`}
+        />
       )}
-      <meta property="og:image:alt" content={title} />
+      <meta property="og:image:alt" content={_title} />
 
       <meta name="twitter:card" content="summary_large_image" />
       <meta name="twitter:site" content="@meshsdk" />
-      <meta name="twitter:title" content={title} />
+      <meta name="twitter:title" content={_title} />
       <meta name="twitter:description" content={description} />
       <meta name="twitter:creator" content="@meshsdk" />
-      {image ? (
+      {/* {image ? (
         <meta name="twitter:image" content={`https://meshjs.dev${image}`} />
       ) : (
         <meta
           name="twitter:image"
           content={`https://meshjs.dev/api/og?title=${title}`}
         />
+      )} */}
+      {title && (
+        <meta
+          property="twitter:image"
+          content={`https://meshjs.dev/api/og?title=${title}`}
+        />
       )}
-      <meta name="twitter:image:alt" content={title} />
+      <meta name="twitter:image:alt" content={_title} />
 
       <link
         rel="apple-touch-icon"
diff --git a/apps/playground/src/pages/api/og.tsx b/apps/playground/src/pages/api/og.tsx
index b28f9bc63..9cad6b535 100644
--- a/apps/playground/src/pages/api/og.tsx
+++ b/apps/playground/src/pages/api/og.tsx
@@ -13,7 +13,7 @@ export default function handler(request: NextRequest) {
     const hasTitle = searchParams.has("title");
     const title = hasTitle
       ? searchParams.get("title")?.slice(0, 100)
-      : "Mesh JS - Cardano Web3 TypeScript SDK & off-chain Framework";
+      : "Mesh JS - Cardano Web3 TypeScript SDK & Off-Chain Framework";
 
     return new ImageResponse(
       (

From 279d4a11f9f18e3e4849411784a11af1e219ee5e Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 12:27:53 +0800
Subject: [PATCH 8/9] fix build error

---
 .../src/components/site/metatags.tsx          | 26 +++++++------------
 1 file changed, 9 insertions(+), 17 deletions(-)

diff --git a/apps/playground/src/components/site/metatags.tsx b/apps/playground/src/components/site/metatags.tsx
index 1c806c1d9..9bfb2de36 100644
--- a/apps/playground/src/components/site/metatags.tsx
+++ b/apps/playground/src/components/site/metatags.tsx
@@ -4,10 +4,12 @@ export default function Metatags({
   title,
   keywords,
   description,
+  image,
 }: {
   title?: string;
   keywords?: string;
   description?: string;
+  image?: string;
 }) {
   if (description === undefined) {
     description =
@@ -38,15 +40,10 @@ export default function Metatags({
       <meta property="og:site_name" content={_title} />
       <meta property="og:type" content="website" />
       <meta property="og:description" content={description} />
-      {/* {image ? (
+      {image && (
         <meta property="og:image" content={`https://meshjs.dev${image}`} />
-      ) : (
-        <meta
-          property="og:image"
-          content={`https://meshjs.dev/api/og?title=${title}`}
-        />
-      )} */}
-      {title && (
+      )}
+      {title && image === undefined && (
         <meta
           property="og:image"
           content={`https://meshjs.dev/api/og?title=${title}`}
@@ -59,15 +56,10 @@ export default function Metatags({
       <meta name="twitter:title" content={_title} />
       <meta name="twitter:description" content={description} />
       <meta name="twitter:creator" content="@meshsdk" />
-      {/* {image ? (
-        <meta name="twitter:image" content={`https://meshjs.dev${image}`} />
-      ) : (
-        <meta
-          name="twitter:image"
-          content={`https://meshjs.dev/api/og?title=${title}`}
-        />
-      )} */}
-      {title && (
+      {image && (
+        <meta property="twitter:image" content={`https://meshjs.dev${image}`} />
+      )}
+      {title && image === undefined && (
         <meta
           property="twitter:image"
           content={`https://meshjs.dev/api/og?title=${title}`}

From 9612b7817fdc2ca9165723c3bf4a3a01bcff2fda Mon Sep 17 00:00:00 2001
From: "Hong Jing (Jingles)" <jinglescode@gmail.com>
Date: Mon, 11 Nov 2024 13:33:57 +0800
Subject: [PATCH 9/9] attempt fix og title

---
 .../src/components/site/metatags.tsx          | 16 ++--
 apps/playground/src/pages/_app.tsx            |  2 -
 apps/playground/src/pages/about/index.tsx     |  2 +
 apps/playground/src/pages/home/index.tsx      | 85 ++++++++++---------
 packages/mesh-provider/src/blockfrost.ts      | 10 ---
 5 files changed, 56 insertions(+), 59 deletions(-)

diff --git a/apps/playground/src/components/site/metatags.tsx b/apps/playground/src/components/site/metatags.tsx
index 9bfb2de36..c5270fe8d 100644
--- a/apps/playground/src/components/site/metatags.tsx
+++ b/apps/playground/src/components/site/metatags.tsx
@@ -15,14 +15,14 @@ export default function Metatags({
     description =
       "Intuitive and easy-to-use Web3 development framework to build amazing applications on Cardano.";
   }
+
   if (keywords === undefined) {
     keywords =
       "developer, tools, cardano, blockchain, sdk, plutus, crypto, web3, metaverse, gaming, ecommerce, nfts, apis, aiken";
   }
 
-  let _title = title;
   if (title === undefined) {
-    _title = "Mesh JS - Cardano Web3 TypeScript SDK & Off-Chain Framework";
+    title = "Mesh JS - Cardano Web3 TypeScript SDK & Off-Chain Framework";
   } else {
     title = title + " - Mesh JS";
   }
@@ -32,12 +32,12 @@ export default function Metatags({
       <meta name="viewport" content="width=device-width, initial-scale=1" />
       <meta charSet="utf-8" />
 
-      <title>{title ? title : _title}</title>
+      {title && <title>{title}</title>}
       <meta name="description" content={description} />
       <meta name="keywords" content={keywords} />
 
-      <meta property="og:title" content={_title} />
-      <meta property="og:site_name" content={_title} />
+      {title && <meta property="og:title" content={title} />}
+      {title && <meta property="og:site_name" content={title} />}
       <meta property="og:type" content="website" />
       <meta property="og:description" content={description} />
       {image && (
@@ -49,11 +49,11 @@ export default function Metatags({
           content={`https://meshjs.dev/api/og?title=${title}`}
         />
       )}
-      <meta property="og:image:alt" content={_title} />
+      {title && <meta property="og:image:alt" content={title} />}
 
       <meta name="twitter:card" content="summary_large_image" />
       <meta name="twitter:site" content="@meshsdk" />
-      <meta name="twitter:title" content={_title} />
+      {title && <meta name="twitter:title" content={title} />}
       <meta name="twitter:description" content={description} />
       <meta name="twitter:creator" content="@meshsdk" />
       {image && (
@@ -65,7 +65,7 @@ export default function Metatags({
           content={`https://meshjs.dev/api/og?title=${title}`}
         />
       )}
-      <meta name="twitter:image:alt" content={_title} />
+      {title && <meta name="twitter:image:alt" content={title} />}
 
       <link
         rel="apple-touch-icon"
diff --git a/apps/playground/src/pages/_app.tsx b/apps/playground/src/pages/_app.tsx
index e2ffc9d81..e646e218a 100644
--- a/apps/playground/src/pages/_app.tsx
+++ b/apps/playground/src/pages/_app.tsx
@@ -9,7 +9,6 @@ import { Toaster } from "react-hot-toast";
 import { MeshProvider } from "@meshsdk/react";
 
 import Footer from "~/components/site/footer";
-import Metatags from "~/components/site/metatags";
 import Navbar from "~/components/site/navbar";
 import Providers from "~/contexts/providers";
 
@@ -19,7 +18,6 @@ export default function App({ Component, pageProps }: AppProps) {
   return (
     <MeshProvider>
       <Providers>
-        <Metatags />
         <div className="cursor-default">
           <header>
             <Navbar />
diff --git a/apps/playground/src/pages/about/index.tsx b/apps/playground/src/pages/about/index.tsx
index 580c41c88..c0d2c690c 100644
--- a/apps/playground/src/pages/about/index.tsx
+++ b/apps/playground/src/pages/about/index.tsx
@@ -1,3 +1,4 @@
+import Metatags from "~/components/site/metatags";
 import AboutHero from "./about-us/hero";
 import AboutIncorporation from "./about-us/incorporation";
 import AboutMeeting from "./about-us/meeting";
@@ -8,6 +9,7 @@ import AboutWhatWorkingOn from "./about-us/what-working-on";
 export default function AboutPage() {
   return (
     <>
+      <Metatags title="About Mesh SDK" />
       <AboutHero />
       <AboutTeam />
       <AboutMeeting />
diff --git a/apps/playground/src/pages/home/index.tsx b/apps/playground/src/pages/home/index.tsx
index 9628ba660..826378b21 100644
--- a/apps/playground/src/pages/home/index.tsx
+++ b/apps/playground/src/pages/home/index.tsx
@@ -3,6 +3,7 @@ import { DocumentCheckIcon } from "@heroicons/react/24/solid";
 
 import Link from "~/components/link";
 import HeroTwoSections from "~/components/sections/hero-two-sections";
+import Metatags from "~/components/site/metatags";
 
 export default function HomePage() {
   const [isSSR, setIsSSR] = useState(true);
@@ -11,44 +12,50 @@ export default function HomePage() {
   }, []);
 
   return (
-    <div className="flex flex-col gap-4">
-      <HeroTwoSections
-        title="Web3 TypeScript SDK & off-chain Framework"
-        description="Mesh is a TypeScript open-source library providing numerous tools to easily build powerful dApps on the Cardano blockchain."
-        link={{ label: "Get started", href: "/getting-started" }}
-        image={
-          <div className="col-span-6 hidden h-96 lg:block">
-            {!isSSR ? (
-              <video className="w-full" autoPlay muted>
-                <source src="/home/starter-template-cli.mp4" type="video/mp4" />
-                Your browser does not support the video tag.
-              </video>
-            ) : (
-              <>
-                <img
-                  src="/logo-mesh/black/logo-mesh-black-512x512.png"
-                  className="dark:hidden"
-                  alt="mockup"
-                />
-                <img
-                  src="/logo-mesh/white/logo-mesh-white-512x512.png"
-                  className="hidden dark:block"
-                  alt="mockup dark"
-                />
-              </>
-            )}
-          </div>
-        }
-        children={
-          <Link
-            href={`/about/catalyst`}
-            className="mr-3 inline-flex items-center justify-center rounded-lg bg-gray-700 px-5 py-3 text-center text-base font-medium text-white hover:bg-gray-800"
-          >
-            Catalyst Proposals
-            <DocumentCheckIcon className="-mr-1 ml-2 h-5 w-5" />
-          </Link>
-        }
-      />
-    </div>
+    <>
+      <Metatags />
+      <div className="flex flex-col gap-4">
+        <HeroTwoSections
+          title="Web3 TypeScript SDK & off-chain Framework"
+          description="Mesh is a TypeScript open-source library providing numerous tools to easily build powerful dApps on the Cardano blockchain."
+          link={{ label: "Get started", href: "/getting-started" }}
+          image={
+            <div className="col-span-6 hidden h-96 lg:block">
+              {!isSSR ? (
+                <video className="w-full" autoPlay muted>
+                  <source
+                    src="/home/starter-template-cli.mp4"
+                    type="video/mp4"
+                  />
+                  Your browser does not support the video tag.
+                </video>
+              ) : (
+                <>
+                  <img
+                    src="/logo-mesh/black/logo-mesh-black-512x512.png"
+                    className="dark:hidden"
+                    alt="mockup"
+                  />
+                  <img
+                    src="/logo-mesh/white/logo-mesh-white-512x512.png"
+                    className="hidden dark:block"
+                    alt="mockup dark"
+                  />
+                </>
+              )}
+            </div>
+          }
+          children={
+            <Link
+              href={`/about/catalyst`}
+              className="mr-3 inline-flex items-center justify-center rounded-lg bg-gray-700 px-5 py-3 text-center text-base font-medium text-white hover:bg-gray-800"
+            >
+              Catalyst Proposals
+              <DocumentCheckIcon className="-mr-1 ml-2 h-5 w-5" />
+            </Link>
+          }
+        />
+      </div>
+    </>
   );
 }
diff --git a/packages/mesh-provider/src/blockfrost.ts b/packages/mesh-provider/src/blockfrost.ts
index 15f50ab81..2a662109a 100644
--- a/packages/mesh-provider/src/blockfrost.ts
+++ b/packages/mesh-provider/src/blockfrost.ts
@@ -473,16 +473,6 @@ export class BlockfrostProvider
     }
   }
 
-  async fetchUTxO(hash: string, index?: number): Promise<UTxO | undefined> {
-    try {
-      const utxos = await this.fetchUTxOs(hash);
-      const utxo = utxos.find((utxo) => utxo.input.outputIndex === index);
-      return utxo;
-    } catch (error) {
-      throw parseHttpError(error);
-    }
-  }
-
   async fetchUTxOs(hash: string, index?: number): Promise<UTxO[]> {
     try {
       const { data, status } = await this._axiosInstance.get(