Publishing to internal NPM

.github/workflows/publish-wallet-kit.yaml

@@ -0,0 +1,34 @@
+name: Publish NPM package
+
+on:
+  push:
+    tags:
+      - '*'
+
+permissions:
+  contents: read
+  packages: write
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+    strategy:
+      matrix:
+        package: [ wallet-kit,react-wallet-kit,wallet-connect,vanilla-wallet-kit ]
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: https://npm.pkg.github.com/
+      - run: yarn install:all
+      - run: yarn build
+      - run: |
+          cd packages/${{ matrix.package }}
+          yarn version --no-git-tag-version --new-version ${{ github.ref_name }}
+          yarn publish
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}

apps/sample-react-app/package.json

@@ -43,11 +43,11 @@
         "@vechain/hardhat-vechain": "^0.1.4",
         "@vechain/hardhat-web3": "^0.1.4",
         "@vechain/picasso": "^2.1.1",
-        "@vechain/react-wallet-kit": "*",
-        "@vechain/vanilla-wallet-kit": "*",
-        "@vechain/wallet-connect": "*",
-        "@vechain/wallet-kit": "*",
         "@vechain/web3-providers-connex": "^1.1.2",
+        "@vechainfoundation/react-wallet-kit": "*",
+        "@vechainfoundation/vanilla-wallet-kit": "*",
+        "@vechainfoundation/wallet-connect": "*",
+        "@vechainfoundation/wallet-kit": "*",
         "buffer": "^6.0.3",
         "crypto-browserify": "^3.12.0",
         "framer-motion": "3.10.6",

apps/sample-react-app/src/App.tsx

@@ -1,8 +1,8 @@
 import type { JSX } from 'react';
 import React from 'react';
 import type { Options } from '@vechain/connex';
-import type { WalletConnectOptions } from '@vechain/wallet-connect';
-import { ConnexProvider } from '@vechain/react-wallet-kit';
+import type { WalletConnectOptions } from '@vechainfoundation/wallet-connect';
+import { ConnexProvider } from '@vechainfoundation/react-wallet-kit';
 import { ChakraProvider } from '@chakra-ui/react';
 import { NavBar, StyledContainer } from './Components/layout';
 import { Homepage } from './Screens/Homepage';

apps/sample-react-app/src/Components/AccountDetailBody.tsx

@@ -1,6 +1,6 @@
 import { Button, HStack, Image, Text, VStack } from '@chakra-ui/react';
 import React, { useMemo } from 'react';
-import type { WalletSource } from '@vechain/wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
 import { WalletSources } from '../Constants';
 import { AddressButton } from './AddressButton';
 

apps/sample-react-app/src/Components/AccountDetailModal.tsx

@@ -1,6 +1,6 @@
 import { HStack, Text } from '@chakra-ui/react';
-import type { WalletSource } from '@vechain/wallet-kit';
-import { useWallet } from '@vechain/react-wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
+import { useWallet } from '@vechainfoundation/react-wallet-kit';
 import React, { useCallback } from 'react';
 import { getPicassoImgSrc } from '../Utils/AccountUtils';
 import { Dialog } from './shared';

apps/sample-react-app/src/Components/SwitchWalletButton.tsx

@@ -1,7 +1,10 @@
 import type { HTMLChakraProps } from '@chakra-ui/react';
 import { useDisclosure } from '@chakra-ui/react';
 import React from 'react';
-import { ConnectWalletButton, useWallet } from '@vechain/react-wallet-kit';
+import {
+    ConnectWalletButton,
+    useWallet,
+} from '@vechainfoundation/react-wallet-kit';
 import { AccountDetailModal } from './AccountDetailModal';
 import { AddressButton } from './AddressButton';
 

apps/sample-react-app/src/Components/layout/NavBar.tsx

@@ -17,7 +17,7 @@ import {
 import type { JSX } from 'react';
 import React from 'react';
 import { Bars3Icon } from '@heroicons/react/24/solid';
-import { useWallet } from '@vechain/react-wallet-kit';
+import { useWallet } from '@vechainfoundation/react-wallet-kit';
 import { AccountDetailBody } from '../AccountDetailBody';
 import { SwitchWalletButton } from '../SwitchWalletButton';
 

apps/sample-react-app/src/Constants/Constants.ts

@@ -1,4 +1,4 @@
-import type { WalletSource } from '@vechain/wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
 
 export const NODE_URL = 'https://testnet.vechain.org/';
 export const NODE_NETWORK = 'test';

apps/sample-react-app/src/Hooks/useCounter.ts

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useConnex } from '@vechain/react-wallet-kit';
+import { useConnex } from '@vechainfoundation/react-wallet-kit';
 import type { abi } from 'thor-devkit';
 
 const _counter: abi.Function.Definition = {

apps/sample-react-app/src/Logos/Logo.tsx

@@ -1,7 +1,7 @@
 import type { HTMLChakraProps } from '@chakra-ui/react';
 import { Image } from '@chakra-ui/react';
 import React from 'react';
-import { VeWorldLogo as VWLogo } from '@vechain/vanilla-wallet-kit';
+import { VeWorldLogo as VWLogo } from '@vechainfoundation/vanilla-wallet-kit';
 
 type IIMage = HTMLChakraProps<'img'>;
 

apps/sample-react-app/src/Screens/components/Counter.tsx

@@ -12,7 +12,7 @@ import {
 import type { JSX } from 'react';
 import React, { useCallback, useMemo } from 'react';
 import { ArrowUpIcon } from '@heroicons/react/24/solid';
-import { useWallet } from '@vechain/react-wallet-kit';
+import { useWallet } from '@vechainfoundation/react-wallet-kit';
 import { StyledCard } from '../../Components/shared';
 import { useCounter } from '../../Hooks/useCounter';
 import { AddressButton } from '../../Components';

apps/sample-vanilla-app/index.js

@@ -1,6 +1,6 @@
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable no-undef */
-import { configureThorModal } from '@vechain/vanilla-wallet-kit';
+import { configureThorModal } from '@vechainfoundation/vanilla-wallet-kit';
 
 const walletConnectOptions = {
     projectId: 'a0b855ceaf109dbc8426479a4c3d38d8',

apps/sample-vanilla-app/package.json

@@ -8,12 +8,12 @@
     "scripts": {
         "build": "parcel build index.html --public-url /vechain-dapp-kit/vanilla",
         "clean": "rm -rf dist",
-        "dev": "parcel index.html --open",
+        "dev": "parcel index.html --open  --port 3001",
         "purge": "yarn clean && rm -rf node_modules",
         "test": "echo \"Error: no test specified\" && exit 1"
     },
     "dependencies": {
-        "@vechain/vanilla-wallet-kit": "*"
+        "@vechainfoundation/vanilla-wallet-kit": "*"
     },
     "devDependencies": {
         "parcel": "^2.10.2"

apps/sample-vue-app/package.json

@@ -31,8 +31,8 @@
         "root": true
     },
     "dependencies": {
-        "@vechain/vanilla-wallet-kit": "*",
-        "@vechain/wallet-kit": "*",
+        "@vechainfoundation/vanilla-wallet-kit": "*",
+        "@vechainfoundation/wallet-kit": "*",
         "core-js": "^3.8.3",
         "node-polyfill-webpack-plugin": "^2.0.1",
         "vue": "^3.2.13",

apps/sample-vue-app/src/connex/ConnexProvider.vue

@@ -4,16 +4,16 @@ import {
     ConnectResponse,
     MultiWalletConnex,
     WalletSource,
-} from '@vechain/wallet-kit';
+} from '@vechainfoundation/wallet-kit';
 import type Connex from '@vechain/connex';
 import {
     ConnexSymbol,
     WalletActionsSymbol,
     WalletStateSymbol,
 } from '@/connex/keys';
 import { WalletActions, WalletState } from '@/connex/types';
-import { WalletConnectOptions } from '@vechain/wallet-connect';
-import { configureThorModal } from '@vechain/vanilla-wallet-kit';
+import { WalletConnectOptions } from '@vechainfoundation/wallet-connect';
+import { configureThorModal } from '@vechainfoundation/vanilla-wallet-kit';
 
 const initWallets = (hasWcOptions: boolean) => {
     const wallets: WalletSource[] = ['sync2'];

apps/sample-vue-app/src/connex/types.d.ts

@@ -1,4 +1,4 @@
-import { ConnectResponse, WalletSource } from '@vechain/wallet-kit';
+import { ConnectResponse, WalletSource } from '@vechainfoundation/wallet-kit';
 
 type WalletState = {
     availableWallets: WalletSource[];

apps/sample-vue-app/src/main.ts

@@ -1,5 +1,5 @@
 import { createApp } from 'vue';
 import App from './App.vue';
-import '@vechain/vanilla-wallet-kit';
+import '@vechainfoundation/vanilla-wallet-kit';
 
 createApp(App).mount('#app');

package.json

@@ -6,8 +6,8 @@
     ],
     "scripts": {
         "build": "turbo run build",
-        "build-react-kit": "turbo run build  --filter='@vechain/react-wallet-kit'",
-        "build:deps": "turbo build --no-daemon --filter='@vechain/*'",
+        "build-react-kit": "turbo run build  --filter='@vechainfoundation/react-wallet-kit'",
+        "build:deps": "turbo build --no-daemon --filter='@vechainfoundation/*'",
         "clean": "rm -rf .turbo .parcel-cache build && npx turbo@latest run clean",
         "cucumber": "yarn && cucumber-js",
         "dev": "turbo run dev --no-daemon",

packages/react-wallet-kit/README.md

@@ -1 +1,92 @@
-# React Vendor
+# `@vechainfoundation/react-wallet-kit`
+
+## Why ?
+
+-   Allow easy interaction with all wallets.
+-   Connex is designed to play nice with one wallet at a time, this library provides a layer on top of Connex to easily
+    allow interaction with all wallets.
+-   Easy setup for wallet connect.
+-   Create your own
+
+## Installation
+
+-   See the parent [README](../../README.md) for installation instructions.
+
+### Build
+
+```bash
+yarn build
+```
+
+## Usage
+
+```bash
+yarn add @vechainfoundation/react-wallet-kit
+```
+
+-   Create the node options
+
+```typescript
+import type { Options } from '@vechain/connex';
+
+const nodeOptions: Omit<Options, 'signer'> = {
+    node: 'https://testnet.vechain.org/',
+    network: 'test',
+};
+```
+
+-   Optional: Configure wallet connect options
+
+```typescript
+import type { WalletConnectOptions } from '@vechainfoundation/wallet-connect';
+
+const walletConnectOptions: WalletConnectOptions = {
+    projectId: '<PROJECT_ID>', // Create your project here: https://cloud.walletconnect.com/sign-up
+    metadata: {
+        name: 'My dApp',
+        description: 'My dApp description',
+        url: window.location.origin, // Your app URL
+        icons: [`${window.location.origin}/images/my-dapp-icon.png`], // Your app Icon
+    },
+};
+```
+
+-   Initialise the `ConnexVendor`
+
+```typescript jsx
+import { ConnexProvider } from '@vechainfoundation/react-wallet-kit';
+
+export const App = (): JSX.Element => {
+    return (
+        <>
+            <ConnexProvider
+                key="connex"
+                nodeOptions={nodeOptions}
+                persistState={false} // Optional - default: false - If true, account and source will be persisted in local storage
+                walletConnectOptions={walletConnectOptions}
+            >
+                <YourApp />
+            </ConnexProvider>
+        </>
+    );
+};
+```
+
+-   Use the hooks provided by the `ConnexProvider`
+
+```typescript jsx
+import { useWallet, useConnex } from '@vechainfoundation/react-wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
+
+// type WalletSource = 'wallet-connect' | 'veworld-extension' | 'sync2' | 'sync';
+const mySource: WalletSource = 'veworld-extension';
+
+const { connect, setSource } = useWallet();
+
+setSource(mySource);
+
+const { account } = await connect();
+
+//Start using Connex thor/ vendor
+const { vendor, thor } = useConnex();
+```

packages/react-wallet-kit/package.json

@@ -1,7 +1,7 @@
 {
-    "name": "@vechain/react-wallet-kit",
+    "name": "@vechainfoundation/react-wallet-kit",
     "version": "0.0.0",
-    "private": true,
+    "private": false,
     "license": "MIT",
     "sideEffects": false,
     "main": "./dist/index.js",
@@ -19,9 +19,9 @@
         "@vechain/connex": "2.1.0",
         "@vechain/connex-framework": "2.1.0",
         "@vechain/picasso": "^2.1.1",
-        "@vechain/vanilla-wallet-kit": "*",
-        "@vechain/wallet-connect": "*",
-        "@vechain/wallet-kit": "*",
+        "@vechainfoundation/vanilla-wallet-kit": "*",
+        "@vechainfoundation/wallet-connect": "*",
+        "@vechainfoundation/wallet-kit": "*",
         "react-icons": "^4.11.0",
         "styled-components": "^6.1.0",
         "thor-devkit": "^2.0.9"

packages/react-wallet-kit/src/ConnectWalletButton/Components/ConnectButtonWithModal.tsx

@@ -1,20 +1,20 @@
-import 'react';
-import { ConnectModalWithButtonWrapped } from './Wrapped/ConnectModalWithButtonWrapped';
 import { useCallback, useContext, useState } from 'react';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
+import type { SourceInfo } from '@vechainfoundation/vanilla-wallet-kit';
 import { ThemeContext } from '../../provider/ThemeProvider';
-import { WalletSource } from '@vechain/wallet-kit';
 import { useWallet } from '../../ConnexProvider';
-import { SourceInfo } from '@vechain/vanilla-wallet-kit';
+import { ConnectModalWithButtonWrapped } from './Wrapped/ConnectModalWithButtonWrapped';
 
 interface ConnectButtonWithModalProps {
     onClose?: () => void;
 }
+
 export const ConnectButtonWithModal = ({
     onClose,
 }: ConnectButtonWithModalProps) => {
     const { theme } = useContext(ThemeContext);
 
     const handleSourceClick = (e: SourceInfo) => {
         _connect(e.id);
     };
 

packages/react-wallet-kit/src/ConnectWalletButton/Components/Wrapped/ConnectModalWithButtonWrapped.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { ConnectButtonWithModal } from '@vechain/vanilla-wallet-kit';
+import { ConnectButtonWithModal } from '@vechainfoundation/vanilla-wallet-kit';
 
 export const ConnectModalWithButtonWrapped = createComponent({
     tagName: 'vwk-connect-button-with-modal',

packages/react-wallet-kit/src/ConnectWalletButton/Constants/Constants.ts

@@ -1,10 +1,10 @@
-import type { WalletSource } from '@vechain/wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
 import {
     Sync2Logo,
     SyncLogo,
     VeWorldLogo,
     WalletConnectLogo,
-} from '@vechain/vanilla-wallet-kit';
+} from '@vechainfoundation/vanilla-wallet-kit';
 
 interface SourceInfo {
     name: string;

packages/react-wallet-kit/src/ConnexProvider.tsx

@@ -6,11 +6,11 @@ import React, {
     useMemo,
     useState,
 } from 'react';
-import type { WalletSource } from '@vechain/wallet-kit';
-import { MultiWalletConnex } from '@vechain/wallet-kit';
+import type { WalletSource } from '@vechainfoundation/wallet-kit';
+import { MultiWalletConnex } from '@vechainfoundation/wallet-kit';
 import type { ConnexContext, ConnexProviderOptions } from './types';
 
-const STORAGE_PREFIX = '@vechain/wallet-kit';
+const STORAGE_PREFIX = '@vechainfoundation/wallet-kit';
 const persist = (key: 'source' | 'account', value: string): void => {
     localStorage.setItem(`${STORAGE_PREFIX}${key}`, value);
 };

packages/react-wallet-kit/src/types.ts

@@ -1,7 +1,10 @@
 import type { Options } from '@vechain/connex';
 import type React from 'react';
-import type { WalletConnectOptions } from '@vechain/wallet-connect';
-import type { ConnectResponse, WalletSource } from '@vechain/wallet-kit';
+import type { WalletConnectOptions } from '@vechainfoundation/wallet-connect';
+import type {
+    ConnectResponse,
+    WalletSource,
+} from '@vechainfoundation/wallet-kit';
 
 export interface AccountState {
     address: string | null;