@mictonode/widget 0.3.9

package/lib/wallet/wallets/MetamaskWallet.ts

@@ -0,0 +1,173 @@
+import { AbstractWallet, Account, WalletArgument, WalletName, extractChainId, keyType } from '../Wallet';
+import { fromBase64, fromBech32, toHex, fromHex, toBase64 } from '@cosmjs/encoding';
+import {
+    Registry,
+    encodePubkey,
+    makeAuthInfoBytes,
+} from '@cosmjs/proto-signing';
+import { Transaction } from '../../utils/type';
+import { TxRaw } from 'cosmjs-types/cosmos/tx/v1beta1/tx';
+import { hashMessage } from '@ethersproject/hash';
+import { computePublicKey, recoverPublicKey } from '@ethersproject/signing-key';
+import { ethToEthermint, ethermintToEth } from '../../utils/format';
+import { AminoTypes, createDefaultAminoConverters } from "@cosmjs/stargate"
+import { Chain, createTxRawEIP712, signatureToWeb3Extension } from "@tharsis/transactions";
+import { createEIP712, generateFee, generateMessageWithMultipleTransactions, generateTypes } from "@tharsis/eip712";
+import { defaultMessageAdapter } from '../EthermintMessageAdapter';
+import { Any } from "cosmjs-types/google/protobuf/any";
+import { PubKey } from 'cosmjs-types/cosmos/crypto/secp256k1/keys'
+
+export class MetamaskWallet implements AbstractWallet {
+    name: WalletName.Metamask;
+    chainId: string;
+    registry: Registry;
+    prefix: string;
+    aminoTypes = new AminoTypes(createDefaultAminoConverters())
+
+    constructor(arg: WalletArgument, registry: Registry) {
+        this.chainId = arg.chainId || 'cosmoshub';
+        this.registry = registry;
+        this.prefix = arg.prefix || 'evmos'
+    }
+
+    async getAccounts(): Promise<Account[]> {
+        // @ts-ignore
+        if (!window.ethereum || !window.ethereum.request) {
+            throw new Error('Please install Metamask extension');
+        }
+
+        // @ts-ignore46
+        const accounts = await window.ethereum.request({
+            method: 'eth_requestAccounts',
+        });
+
+        const message = 'Verify Public Key';
+        // @ts-ignore
+        const signature = await window?.ethereum?.request({
+            method: 'personal_sign',
+            params: [message, accounts[0], ''],
+        });
+
+        const uncompressedPk = recoverPublicKey(
+            hashMessage(message),
+            signature
+        );
+        const hexPk = computePublicKey(uncompressedPk, true);
+        const pk = toBase64(fromHex(hexPk.replace('0x', '')));
+
+        const connected = accounts.map((address) => ({
+            address: ethToEthermint(address, this.prefix),
+            algo: 'secp256k1',
+            pubkey: pk,
+        }))
+
+        localStorage.setItem("metamask-connected", JSON.stringify(connected))
+
+        return connected;
+    }
+
+    async getConnectedAccounts()  {
+        const connected = localStorage.getItem("metamask-connected")
+        if(connected) {
+            return JSON.parse(connected) as Account[]
+        }
+        return this.getAccounts()
+    }
+
+    async supportCoinType(coinType?: string): Promise<boolean> {
+        // Here, you can check if Metamask supports a specific type of cryptocurrency.
+        return true;
+    }
+
+    async sign(transaction: Transaction): Promise<TxRaw | Uint8Array> {
+        const { signerAddress, messages, fee, signerData } =
+            transaction;
+
+        const senderHexAddress = ethermintToEth(signerAddress);
+        const chain: Chain = {
+            chainId: extractChainId(signerData.chainId),
+            cosmosChainId: signerData.chainId,
+        }
+
+        // getAccounts
+        const accounts = await this.getConnectedAccounts(); 
+        const account = accounts.find(acc => ethermintToEth(acc.address) === senderHexAddress );
+        if (!account) {
+            throw new Error('Account not found');
+        }
+
+        console.log("account:", account)
+
+        const pubkeyBytes = String(account.pubkey)
+        console.log("toBase64(pubkeyBytes)", pubkeyBytes)
+
+        const sender = {
+            accountAddress: transaction.signerAddress,
+            sequence: transaction.signerData.sequence,
+            accountNumber: transaction.signerData.accountNumber,
+            pubkey: pubkeyBytes,
+        }
+
+        const fees = generateFee(transaction.fee.amount[0].amount, transaction.fee.amount[0].denom, transaction.fee.gas, transaction.signerAddress)
+
+        const msgs = transaction.messages.map(x => this.aminoTypes.toAmino(x))
+        const toSignTx = generateMessageWithMultipleTransactions(
+            sender.accountNumber.toString(),
+            sender.sequence.toString(),
+            transaction.signerData.chainId,
+            transaction.memo,
+            fees,
+            msgs,
+        )
+
+        const types = generateTypes(defaultMessageAdapter[transaction.messages[0].typeUrl].getTypes())
+        const eip712Payload = createEIP712(types, chain.chainId, toSignTx)
+
+        // Obtaining the data required for MetaMask signature
+        // @ts-ignore
+        // const acc = await window.ethereum.request({ method: 'eth_requestAccounts' });
+        // console.log("accounts: ", acc)
+
+        // const eip712Payload = JSON.stringify(messages[0]);
+
+        // Signing an EIP-712 payload using MetaMask.
+        // @ts-ignore
+        const signature = await window.ethereum.request({
+            method: 'eth_signTypedData_v4',
+            params: [senderHexAddress, JSON.stringify(eip712Payload)],
+        });
+
+        // Creating a TxRaw object after signing.
+        const signatureBytes = fromHex(signature.replace('0x', ''));
+        const txBodyBytes = this.registry.encode({
+            typeUrl: '/cosmos.tx.v1beta1.TxBody',
+            value: { messages },
+        });
+
+        
+
+        // NOTE: assume ethsecp256k1 by default because after mainnet is the only one that is going to be supported
+        const pubkey = Any.fromPartial({
+            typeUrl: keyType(signerData.chainId),
+            value: PubKey.encode({
+                key: fromBase64(pubkeyBytes),
+            }).finish()
+        })
+        const authInfoBytes = makeAuthInfoBytes(
+            [{ pubkey, sequence: signerData.sequence }],
+            fee.amount,
+            Number(fee.gas),
+            undefined, // feeGranter
+            undefined // feePayer
+        );
+
+        //  Using TxRaw.fromPartial to create a TxRaw object with attribute values.
+        const signedTx: TxRaw = TxRaw.fromPartial({
+            bodyBytes: txBodyBytes,
+            authInfoBytes: authInfoBytes,
+            signatures: [signatureBytes],
+        });
+
+        return signedTx;        // Create the txRaw
+    }   
+}

package/lib/wallet/wallets/OKXWallet.ts

@@ -0,0 +1,202 @@
+import { fromBase64, fromHex } from '@cosmjs/encoding';
+import { makeAuthInfoBytes, makeSignBytes, makeSignDoc, Registry, TxBodyEncodeObject } from '@cosmjs/proto-signing';
+
+import { serializeSignDoc } from '@cosmjs/amino/build/signdoc';
+
+import { AbstractWallet, Account, IChain, WalletArgument, WalletName } from '../Wallet';
+import { Transaction } from '../../utils/type';
+import { TxRaw } from 'cosmjs-types/cosmos/tx/v1beta1/tx';
+import { Any } from 'cosmjs-types/google/protobuf/any';
+import { PubKey } from 'cosmjs-types/cosmos/crypto/secp256k1/keys';
+import { SignMode } from 'cosmjs-types/cosmos/tx/signing/v1beta1/signing';
+import { AminoTypes, createDefaultAminoConverters, createIbcAminoConverters } from '@cosmjs/stargate';
+import { makeSignDoc as makeSignDocAmino } from '@cosmjs/amino';
+import { createWasmAminoConverters } from '@cosmjs/cosmwasm-stargate';
+import { Buffer } from 'buffer';
+
+export class OKXWallet implements AbstractWallet {
+  name: WalletName.OKX = WalletName.OKX;
+  chainId: string;
+  chain: IChain;
+  registry: Registry;
+  conf: WalletArgument;
+  aminoTypes = new AminoTypes({
+    ...createDefaultAminoConverters(),
+    ...createIbcAminoConverters(),
+    ...createWasmAminoConverters(),
+  });
+
+  connectEventNamesOnWindow: string[] = [];
+
+  constructor(arg: WalletArgument, chain: IChain, registry: Registry) {
+    this.chainId = arg.chainId || "cosmoshub";
+    // @ts-ignore
+
+    this.registry = registry;
+    this.conf = arg;
+    this.chain = chain;
+  }
+  async getAccounts(): Promise<Account[]> {
+    // @ts-ignore
+
+    if (!window?.okxwallet) {
+      throw new Error("Please install OKX wallet extension");
+    }
+    // @ts-ignore
+    const connectRes = await window.okxwallet.bitcoin.connect();
+    console.log("connectRes: ", connectRes);
+
+    // @ts-ignore
+    const accounts = await window.okxwallet.bitcoin.getAccounts();
+
+    // @ts-ignore
+    const pbk = await window.okxwallet.bitcoin.getPublicKey();
+
+    return [
+        {
+            address: accounts[0],
+            pubkey: fromHex(pbk),
+            algo: 'segwit',
+        },
+    ];
+  }
+  supportCoinType(): Promise<boolean> {
+    return Promise.resolve(true);
+  }
+
+  isEthermint() {
+    return this.conf.hdPath && this.conf.hdPath.startsWith("m/44'/60");
+  }
+
+  async sign(transaction: Transaction): Promise<TxRaw> {
+    // return this.signDirect(transaction);
+    return this.signAmino(transaction);
+  }
+  // @deprecated use signAmino instead
+  // because signDirect is not supported ledger wallet
+  async signDirect(transaction: Transaction): Promise<TxRaw> {
+    const accouts = await this.getAccounts();
+
+    const accountFromSigner = accouts[0];
+    if (!accountFromSigner) {
+      throw new Error("Failed to retrieve account from signer");
+    }
+    const pubkey = Any.fromPartial({
+      typeUrl: "/cosmos.crypto.segwit.PubKey",
+      value: PubKey.encode({
+        key: accountFromSigner.pubkey,
+      }).finish(),
+    });
+
+    const txBodyEncodeObject: TxBodyEncodeObject = {
+      typeUrl: "/cosmos.tx.v1beta1.TxBody",
+      value: {
+        messages: transaction.messages,
+        memo: transaction.memo,
+      },
+    };
+
+    const txBodyBytes = this.registry.encode(txBodyEncodeObject);
+    const gasLimit = Number(transaction.fee.gas);
+    const authInfoBytes = makeAuthInfoBytes(
+      [{ pubkey, sequence: transaction.signerData.sequence }],
+      transaction.fee.amount,
+      gasLimit,
+      transaction.fee.granter,
+      transaction.fee.payer
+    );
+
+    const signDoc = makeSignDoc(
+      txBodyBytes,
+      authInfoBytes,
+      transaction.chainId,
+      transaction.signerData.accountNumber
+    );
+    console.log("signDoc: ", signDoc);
+
+    const signDocBuffer = makeSignBytes(signDoc);
+
+    const signString = Buffer.from(signDocBuffer).toString();
+
+    // @ts-ignore
+    const signature = await window.okxwallet.bitcoin.signMessage(
+      signString,
+      "ecdsa"
+    );
+
+    const signed = signDoc;
+
+    return TxRaw.fromPartial({
+      bodyBytes: signed.bodyBytes,
+      authInfoBytes: signed.authInfoBytes,
+      signatures: [fromBase64(signature)],
+    });
+  }
+
+  async signAmino(tx: Transaction): Promise<TxRaw> {
+    const accouts = await this.getAccounts();
+
+    const accountFromSigner = accouts[0];
+    if (!accountFromSigner) {
+      throw new Error("Failed to retrieve account from signer");
+    }
+    const pubkey = Any.fromPartial({
+      typeUrl: "/cosmos.crypto.segwit.PubKey",
+      value: PubKey.encode({
+        key: accountFromSigner.pubkey,
+      }).finish(),
+    });
+
+    const signMode = SignMode.SIGN_MODE_LEGACY_AMINO_JSON;
+    const msgs = tx.messages.map((msg) => this.aminoTypes.toAmino(msg));
+    const signDoc = makeSignDocAmino(
+      msgs,
+      tx.fee,
+      tx.chainId,
+      tx.memo,
+      tx.signerData.accountNumber,
+      tx.signerData.sequence
+    );
+
+    const signed = signDoc;
+
+    const signDocBuffer = serializeSignDoc(signDoc);
+
+    const signString = Buffer.from(signDocBuffer).toString();
+
+    // @ts-ignore
+    const signature = await window.okxwallet.bitcoin.signMessage(
+      signString,
+      "ecdsa"
+    );
+
+    const signedTxBody = {
+      messages: signed.msgs.map((msg) => this.aminoTypes.fromAmino(msg)),
+      memo: signed.memo,
+    };
+
+    const signedTxBodyEncodeObject: TxBodyEncodeObject = {
+      typeUrl: "/cosmos.tx.v1beta1.TxBody",
+      value: signedTxBody,
+    };
+
+    const signedTxBodyBytes = this.registry.encode(signedTxBodyEncodeObject);
+
+    const signedGasLimit = Number(signed.fee.gas);
+    const signedSequence = Number(signed.sequence);
+    const signedAuthInfoBytes = makeAuthInfoBytes(
+      [{ pubkey, sequence: signedSequence }],
+      signed.fee.amount,
+      signedGasLimit,
+      signed.fee.granter,
+      signed.fee.payer,
+      signMode
+    );
+
+    return TxRaw.fromPartial({
+      bodyBytes: signedTxBodyBytes,
+      authInfoBytes: signedAuthInfoBytes,
+      signatures: [fromBase64(signature)],
+    });
+  }
+}

package/lib/wallet/wallets/UnisatWallet.ts

@@ -0,0 +1,198 @@
+import { fromBase64, fromHex } from '@cosmjs/encoding';
+import { makeAuthInfoBytes, makeSignBytes, makeSignDoc, Registry, TxBodyEncodeObject } from '@cosmjs/proto-signing';
+
+import { AbstractWallet, Account, IChain, WalletArgument, WalletName } from '../Wallet';
+import { Transaction } from '../../utils/type';
+import { TxRaw } from 'cosmjs-types/cosmos/tx/v1beta1/tx';
+import { Any } from 'cosmjs-types/google/protobuf/any';
+import { PubKey } from 'cosmjs-types/cosmos/crypto/secp256k1/keys';
+import { SignMode } from 'cosmjs-types/cosmos/tx/signing/v1beta1/signing';
+import { AminoTypes, createDefaultAminoConverters, createIbcAminoConverters } from '@cosmjs/stargate';
+import { makeSignDoc as makeSignDocAmino } from '@cosmjs/amino';
+import { createWasmAminoConverters } from '@cosmjs/cosmwasm-stargate';
+import { Buffer } from 'buffer';
+
+import { serializeSignDoc } from '@cosmjs/amino/build/signdoc';
+
+export class UnisatWallet implements AbstractWallet {
+  name: WalletName.Unisat = WalletName.Unisat;
+  chainId: string;
+  chain: IChain;
+  registry: Registry;
+  conf: WalletArgument;
+  aminoTypes = new AminoTypes({
+    ...createDefaultAminoConverters(),
+    ...createIbcAminoConverters(),
+    ...createWasmAminoConverters(),
+  });
+
+  connectEventNamesOnWindow: string[] = [];
+
+  constructor(arg: WalletArgument, chain: IChain, registry: Registry) {
+    this.chainId = arg.chainId || "cosmoshub";
+    // @ts-ignore
+
+    this.registry = registry;
+    this.conf = arg;
+    this.chain = chain;
+  }
+  async getAccounts(): Promise<Account[]> {
+    // @ts-ignore
+
+    if (typeof window?.unisat === "undefined") {
+      throw new Error("Please install UniSat wallet extension");
+    }
+    // @ts-ignore
+    await window.unisat.requestAccounts();
+
+    // @ts-ignore
+    const accounts = await window.unisat.getAccounts();
+
+    // @ts-ignore
+    const pbk = await window.unisat.getPublicKey();
+
+    return [
+        {
+            address: accounts[0],
+            pubkey: fromHex(pbk),
+            algo: "segwit",
+        },
+    ];
+  }
+  supportCoinType(): Promise<boolean> {
+    return Promise.resolve(true);
+  }
+
+  isEthermint() {
+    return this.conf.hdPath && this.conf.hdPath.startsWith("m/44'/60");
+  }
+
+  async sign(transaction: Transaction): Promise<TxRaw> {
+    return this.signAmino(transaction);
+  }
+  // @deprecated use signAmino instead
+  // because signDirect is not supported ledger wallet
+  async signDirect(transaction: Transaction): Promise<TxRaw> {
+    const accouts = await this.getAccounts();
+
+    const accountFromSigner = accouts[0];
+    if (!accountFromSigner) {
+      throw new Error("Failed to retrieve account from signer");
+    }
+    const pubkey = Any.fromPartial({
+      typeUrl: "/cosmos.crypto.segwit.PubKey",
+      value: PubKey.encode({
+        key: accountFromSigner.pubkey,
+      }).finish(),
+    });
+
+    const txBodyEncodeObject: TxBodyEncodeObject = {
+      typeUrl: "/cosmos.tx.v1beta1.TxBody",
+      value: {
+        messages: transaction.messages,
+        memo: transaction.memo,
+      },
+    };
+
+    const txBodyBytes = this.registry.encode(txBodyEncodeObject);
+    console.log("txBodyBytes: ", this.registry);
+    const gasLimit = Number(transaction.fee.gas);
+    const authInfoBytes = makeAuthInfoBytes(
+      [{ pubkey, sequence: transaction.signerData.sequence }],
+      transaction.fee.amount,
+      gasLimit,
+      transaction.fee.granter,
+      transaction.fee.payer
+    );
+
+    const signDoc = makeSignDoc(
+      txBodyBytes,
+      authInfoBytes,
+      transaction.chainId,
+      transaction.signerData.accountNumber
+    );
+    console.log("signDoc: ", signDoc);
+
+    const signDocBuffer = makeSignBytes(signDoc);
+
+    const signString = new TextDecoder().decode(signDocBuffer);
+
+    // @ts-ignore
+    const signature = await window.unisat.signMessage(signString);
+    console.log("result22: ", signature);
+
+    const signed = signDoc;
+    console.log("signed: ", signed);
+
+    return TxRaw.fromPartial({
+      bodyBytes: signed.bodyBytes,
+      authInfoBytes: signed.authInfoBytes,
+      signatures: [fromBase64(signature)],
+    });
+  }
+
+  async signAmino(tx: Transaction): Promise<TxRaw> {
+    const accouts = await this.getAccounts();
+
+    const accountFromSigner = accouts[0];
+    if (!accountFromSigner) {
+      throw new Error("Failed to retrieve account from signer");
+    }
+    const pubkey = Any.fromPartial({
+      typeUrl: "/cosmos.crypto.segwit.PubKey",
+      value: PubKey.encode({
+        key: accountFromSigner.pubkey,
+      }).finish(),
+    });
+
+    const signMode = SignMode.SIGN_MODE_LEGACY_AMINO_JSON;
+    const msgs = tx.messages.map((msg) => this.aminoTypes.toAmino(msg));
+    const signDoc = makeSignDocAmino(
+      msgs,
+      tx.fee,
+      tx.chainId,
+      tx.memo,
+      tx.signerData.accountNumber,
+      tx.signerData.sequence
+    );
+
+    const signed = signDoc;
+
+    const signDocBuffer = serializeSignDoc(signDoc);
+
+    const signString = Buffer.from(signDocBuffer).toString();
+
+    // @ts-ignore
+    const signature = await window.unisat.signMessage(signString);
+    console.log("signature: ", signature);
+
+    const signedTxBody = {
+      messages: signed.msgs.map((msg) => this.aminoTypes.fromAmino(msg)),
+      memo: signed.memo,
+    };
+
+    const signedTxBodyEncodeObject: TxBodyEncodeObject = {
+      typeUrl: "/cosmos.tx.v1beta1.TxBody",
+      value: signedTxBody,
+    };
+
+    const signedTxBodyBytes = this.registry.encode(signedTxBodyEncodeObject);
+
+    const signedGasLimit = Number(signed.fee.gas);
+    const signedSequence = Number(signed.sequence);
+    const signedAuthInfoBytes = makeAuthInfoBytes(
+      [{ pubkey, sequence: signedSequence }],
+      signed.fee.amount,
+      signedGasLimit,
+      signed.fee.granter,
+      signed.fee.payer,
+      signMode
+    );
+
+    return TxRaw.fromPartial({
+      bodyBytes: signedTxBodyBytes,
+      authInfoBytes: signedAuthInfoBytes,
+      signatures: [fromBase64(signature)],
+    });
+  }
+}

package/package.json

@@ -0,0 +1,102 @@
+{
+    "name": "@mictonode/widget",
+    "private": false,
+    "version": "0.3.9",
+    "type": "module",
+    "main": "dist/ping-widget.js",
+    "author": {
+        "name": "Alisa | Side Protocol",
+        "email": "alisa@side.one"
+    },
+    "homepage": "https://github.com/ping-pub/ping-widget",
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/ping-pub/ping-widget"
+    },
+    "license": "MIT",
+    "description": "Ping widget",
+    "keywords": [
+        "vue3",
+        "webcomponent",
+        "widget",
+        "explorer",
+        "blockchain",
+        "sidechain",
+        "Side Protocol",
+        "Ping.pub"
+    ],
+    "scripts": {
+        "dev": "vite",
+        "serve": "vite",
+        "build": "node --max_old_space_size=4192 ./node_modules/.bin/vite build",
+        "preview": "vite preview",
+        "trypublish": "npm publish || true"
+    },
+    "dependencies": {
+        "@cosmjs/amino": "^0.32.3",
+        "@cosmjs/cosmwasm-stargate": "^0.32.3",
+        "@cosmjs/encoding": "^0.32.3",
+        "@cosmjs/ledger-amino": "^0.32.3",
+        "@cosmjs/proto-signing": "^0.32.3",
+        "@cosmjs/stargate": "^0.32.3",
+        "@ethersproject/hash": "5.7.0",
+        "@ethersproject/signing-key": "5.7.0",
+        "@initia/initia-registry-types": "^0.0.17",
+        "@initia/initia.js": "0.2.7",
+        "@initia/initia.proto": "^0.2.0",
+        "@initia/opinit.proto": "^0.0.8",
+        "@initia/utils": "0.69.0",
+        "@leapwallet/cosmos-snap-provider": "^0.1.21",
+        "@ledgerhq/hw-transport-web-ble": "^6.27.13",
+        "@ledgerhq/hw-transport-webusb": "^6.27.14",
+        "@metamask/eth-sig-util": "^5.1.0",
+        "@msgpack/msgpack": "^3.0.0-beta2",
+        "@noble/hashes": "^1.4.0",
+        "@ping-pub/chain-registry-client": "^0.0.25",
+        "@types/bignumber.js": "^5.0.0",
+        "@types/numeral": "^2.0.5",
+        "@types/ramda": "^0.30.0",
+        "bech32": "^2.0.0",
+        "bignumber.js": "^9.1.2",
+        "buffer": "^6.0.3",
+        "change-case": "^5.4.4",
+        "cosmjs-types": "0.9.0",
+        "cross-fetch": "^3.1.5",
+        "daisyui": "^3.1.0",
+        "dayjs": "^1.11.7",
+        "ethers": "^6.13.1",
+        "fflate": "^0.8.0",
+        "ky": "^1.3.0",
+        "numeral": "^2.0.6",
+        "osmojs": "^15.2.1",
+        "ping-widget": "^0.0.33",
+        "ramda": "^0.30.1",
+        "vue": "^3.2.47",
+        "vue3-webcomponent-wrapper": "^0.2.0",
+        "zod": "^3.23.8"
+    },
+    "devDependencies": {
+        "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
+        "@iconify/vue": "^4.1.1",
+        "@noble/secp256k1": "^2.1.0",
+        "@rollup/plugin-inject": "^5.0.3",
+        "@types/elliptic": "^6.4.18",
+        "@vitejs/plugin-vue": "^4.1.0",
+        "assert-browserify": "^2.0.0",
+        "autoprefixer": "^10.4.14",
+        "bitcoinjs-lib": "^6.1.5",
+        "buffer": "6.0.3",
+        "crypto-browserify": "^3.12.0",
+        "elliptic": "^6.5.5",
+        "long": "^5.2.0",
+        "path-browserify": "^1.0.1",
+        "postcss": "^8.4.23",
+        "rollup-plugin-polyfill-node": "^0.12.0",
+        "stream-browserify": "^3.0.0",
+        "tailwindcss": "^3.3.2",
+        "typescript": "^5.0.2",
+        "vite": "^4.3.2",
+        "vite-plugin-css-injected-by-js": "^3.1.0",
+        "vue-tsc": "^1.4.2"
+    }
+}

package/postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}