Monorepo stuff

Signed-off-by: James Zuccon <zuccon@gmail.com>

packages/vue/README.md

@@ -0,0 +1,3 @@
+# XO Wallet
+
+TODO

packages/vue/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@xo/vue",
+  "version": "0.0.1",
+  "description": "XO Stack Wallet - Vue",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "build-old": "rollup -c",
+    "prepublishOnly": "npm run build"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@xo/primitives": "^0.0.1",
+    "@xo/wallet": "^0.0.1",
+    "vue": "^3.4.38"
+  }
+}

packages/vue/src/index.ts

@@ -0,0 +1,2 @@
+export * from './wallet-hd-vue.js';
+export * from './wallet-p2pkh-vue.js';

packages/vue/src/wallet-hd-vue.ts

@@ -0,0 +1,38 @@
+import { Blockchain, WalletHD } from '@xo/wallet';
+import { WalletP2PKHVue, useWalletP2PKHVue } from './wallet-p2pkh-vue.js';
+
+import { computed, ref, shallowRef } from 'vue';
+
+import { HdPrivateNodeValid } from '@bitauth/libauth';
+
+export class WalletHDVue extends WalletHD<WalletP2PKHVue> {
+  // Reactive State.
+  public rShouldMonitor = ref(false);
+  public rWallets = shallowRef<Array<WalletP2PKHVue>>([]);
+
+  // Computeds.
+  public rBalance = computed(() => {
+    return this.rWallets.value.reduce(
+      (total, node) => total + node.rBalance.value,
+      0
+    );
+  });
+
+  constructor(
+    node: HdPrivateNodeValid,
+    electrum: Blockchain,
+    walletFactory = useWalletP2PKHVue
+  ) {
+    super(node, electrum, walletFactory);
+
+    this.events.on(
+      'walletsUpdated',
+      (wallets) => (this.rWallets.value = wallets)
+    );
+
+    this.events.on(
+      'shouldMonitorUpdated',
+      (shouldMonitor) => (this.rShouldMonitor.value = shouldMonitor)
+    );
+  }
+}

packages/vue/src/wallet-p2pkh-vue.ts

@@ -0,0 +1,47 @@
+import { Transaction } from '@xo/primitives';
+import { type AddressListUnspent, Blockchain, WalletP2PKH } from '@xo/wallet';
+
+import { computed, shallowRef } from 'vue';
+/**
+ * @example
+ * ```ts
+ * const walletP2PKH = WalletP2PKHVue.fromMnemonic('12 words');
+ * ```
+ *
+ * Reactive variables are prefixed with `r`.
+ * ```vue
+ * <div>{{ walletP2PKH.rBalance.value }}</div>
+ * ```
+ */
+export class WalletP2PKHVue extends WalletP2PKH {
+  // Reactive State.
+  public rUnspents = shallowRef<AddressListUnspent['response']>([]);
+  public rTransactions = shallowRef<Array<Transaction>>([]);
+
+  // Computeds.
+  public rBalance = computed(() => {
+    return this.rUnspents.value.reduce(
+      (total, unspent) => total + unspent.value,
+      0
+    );
+  });
+
+  constructor(privateKeyBytes: Uint8Array, electrum: Blockchain) {
+    super(privateKeyBytes, electrum);
+
+    this.events.on('unspentsUpdated', (unspents) => {
+      this.rUnspents.value = unspents;
+    });
+
+    this.events.on('transactionsUpdated', (transactions) => {
+      this.rTransactions.value = transactions;
+    });
+  }
+}
+
+export function useWalletP2PKHVue(
+  privateKeyBytes: Uint8Array,
+  electrum: Blockchain
+): WalletP2PKHVue {
+  return new WalletP2PKHVue(privateKeyBytes, electrum);
+}

packages/vue/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}