[CI Skip] release/stable 3.3.1

skip-checks: true

CHANGELOG.md

@@ -1,5 +1,25 @@
 # CHANGELOG
 
+## 3.3.1 May 7, 2023
+
+Contributed:
+
+- Adjust `vue-identicon` to be Vue 3 compatible (Thanks to https://github.com/Gavin-Gong)
+
+Changes:
+
+- Bump to `@polkadot/util` 12.1.2
+
+
+## 3.2.2 Apr 29, 2023
+
+Changes:
+
+- Add missing `react-is` peer dependency for `styled-components`
+- Adjust compilation output for `__internal__` class fields
+- Bump to `@polkadot/util` 12.1.1
+
+
 ## 3.2.1 Apr 22, 2023
 
 Changes:

CONTRIBUTORS

@@ -1,4 +1,4 @@
-     708	Jaco                          	3.2.1 (#752)
+     712	Jaco                          	3.3.1 (#757)
        7	YJ                            	fix #224: decrease frame size to 1024, set multipart bool (#225)
        4	Antoine Estienne              	Refactor logic to better use prefix (#491)
        4	kwingram25                    	fix ff api url issue (#289)
@@ -33,4 +33,5 @@
        1	WoeOm                         	add darwinia ss58 (#379)
        1	yuhui1208                     	[Stores] make FileStroe read key safely  (#338)
        1	Yuri                          	Add webpack 5 support (#557)
+       1	Zen                           	feat: adapt Vue 3.x (#755)
        1	菩提                            	fix some bugs  (#260)

package.json

@@ -14,10 +14,10 @@
   },
   "sideEffects": false,
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "versions": {
-    "git": "3.2.1",
-    "npm": "3.2.1"
+    "git": "3.3.1",
+    "npm": "3.3.1"
   },
   "workspaces": [
     "packages/*"
@@ -33,9 +33,9 @@
     "test:one": "polkadot-dev-run-test --env browser"
   },
   "devDependencies": {
-    "@polkadot/dev": "^0.73.2",
-    "@polkadot/x-bundle": "^12.0.1",
-    "@types/node": "^18.15.13",
+    "@polkadot/dev": "^0.73.11",
+    "@polkadot/x-bundle": "^12.1.2",
+    "@types/node": "^20.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-is": "^18.2.0",

packages/react-identicon/package.json

@@ -18,25 +18,24 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/keyring": "^12.0.1",
-    "@polkadot/ui-settings": "3.2.1",
-    "@polkadot/ui-shared": "3.2.1",
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/keyring": "^12.1.2",
+    "@polkadot/ui-settings": "3.3.1",
+    "@polkadot/ui-shared": "3.3.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "ethereum-blockies-base64": "^1.0.2",
     "jdenticon": "3.2.0",
     "react-copy-to-clipboard": "^5.1.0",
-    "styled-components": "^5.3.9",
+    "styled-components": "^5.3.10",
     "tslib": "^2.5.0"
   },
   "devDependencies": {
     "@types/react-copy-to-clipboard": "^5.0.4",
-    "@types/react-dom": "^18.0.11",
+    "@types/react-dom": "^18.2.4",
     "@types/styled-components": "^5.1.26",
-    "styled-components": "^5.3.9",
     "xmlserializer": "^0.6.1"
   },
   "peerDependencies": {
@@ -45,7 +44,6 @@
     "@polkadot/util-crypto": "*",
     "react": "*",
     "react-dom": "*",
-    "react-is": "*",
-    "styled-components": "*"
+    "react-is": "*"
   }
 }

packages/react-identicon/src/bundle.ts

@@ -2,6 +2,5 @@
 // SPDX-License-Identifier: Apache-2.0
 
 export * from './icons/index.js';
-
 export { Identicon } from './Identicon.js';
 export { packageInfo } from './packageInfo.js';

packages/react-identicon/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/react-identicon', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/react-identicon', path: 'auto', type: 'auto', version: '3.3.1' };

packages/react-qr/package.json

@@ -18,15 +18,15 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/ui-settings": "3.2.1",
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/ui-settings": "3.3.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "qrcode-generator": "^1.4.4",
     "react-qr-reader": "^2.2.1",
-    "styled-components": "^5.3.9",
+    "styled-components": "^5.3.10",
     "tslib": "^2.5.0"
   },
   "devDependencies": {
@@ -38,6 +38,6 @@
     "@polkadot/util-crypto": "*",
     "react": "*",
     "react-dom": "*",
-    "styled-components": "*"
+    "react-is": "*"
   }
 }

packages/react-qr/src/bundle.ts

@@ -3,7 +3,7 @@
 
 export { QrDisplayAddress } from './DisplayAddress.js';
 export { QrDisplayPayload } from './DisplayPayload.js';
-export { QrScanAddress } from './ScanAddress.js';
-export { QrScanSignature } from './ScanSignature.js';
 export { QrNetworkSpecs } from './NetworkSpecs.js';
 export { packageInfo } from './packageInfo.js';
+export { QrScanAddress } from './ScanAddress.js';
+export { QrScanSignature } from './ScanSignature.js';

packages/react-qr/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/react-qr', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/react-qr', path: 'auto', type: 'auto', version: '3.3.1' };

packages/react-qr/src/util.ts

@@ -13,9 +13,10 @@ export function encodeNumber (value: number): Uint8Array {
 }
 
 export function encodeString (value: string): Uint8Array {
-  const u8a = new Uint8Array(value.length);
+  const count = value.length;
+  const u8a = new Uint8Array(count);
 
-  for (let i = 0; i < value.length; i++) {
+  for (let i = 0; i < count; i++) {
     u8a[i] = value.charCodeAt(i);
   }
 

packages/reactnative-identicon/package.json

@@ -18,12 +18,12 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/ui-shared": "3.2.1",
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/ui-shared": "3.3.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "react-native-svg": "^12.5.1",
     "tslib": "^2.5.0"
   },

packages/reactnative-identicon/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/reactnative-identicon', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/reactnative-identicon', path: 'auto', type: 'auto', version: '3.3.1' };

packages/ui-keyring/package.json

@@ -17,15 +17,15 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/keyring": "^12.0.1",
-    "@polkadot/ui-settings": "3.2.1",
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/keyring": "^12.1.2",
+    "@polkadot/ui-settings": "3.3.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "mkdirp": "^2.1.6",
-    "rxjs": "^7.8.0",
+    "rxjs": "^7.8.1",
     "store": "^2.0.12",
     "tslib": "^2.5.0"
   },

packages/ui-keyring/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/ui-keyring', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/ui-keyring', path: 'auto', type: 'auto', version: '3.3.1' };

packages/ui-settings/package.json

@@ -18,12 +18,12 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/networks": "^12.0.1",
-    "@polkadot/util": "^12.0.1",
-    "eventemitter3": "^5.0.0",
+    "@polkadot/networks": "^12.1.2",
+    "@polkadot/util": "^12.1.2",
+    "eventemitter3": "^5.0.1",
     "store": "^2.0.12",
     "tslib": "^2.5.0"
   },

packages/ui-settings/src/bundle.ts

@@ -3,8 +3,8 @@
 
 import { Settings, settings } from './Settings.js';
 
-export { ENDPOINT_DEFAULT, ICON_DEFAULT, ICON_DEFAULT_HOST, LANGUAGE_DEFAULT, LOCKING_DEFAULT, PREFIX_DEFAULT, UIMODE_DEFAULT, UITHEME_DEFAULT } from './defaults/index.js';
 export { chains } from './defaults/chains.js';
+export { ENDPOINT_DEFAULT, ICON_DEFAULT, ICON_DEFAULT_HOST, LANGUAGE_DEFAULT, LOCKING_DEFAULT, PREFIX_DEFAULT, UIMODE_DEFAULT, UITHEME_DEFAULT } from './defaults/index.js';
 export { packageInfo } from './packageInfo.js';
 
-export { settings, Settings };
+export { Settings, settings };

packages/ui-settings/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/ui-settings', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/ui-settings', path: 'auto', type: 'auto', version: '3.3.1' };

packages/ui-shared/package.json

@@ -18,15 +18,15 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
     "colord": "^2.9.3",
     "tslib": "^2.5.0"
   },
   "devDependencies": {
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "@types/xmlserializer": "^0.6.3",
     "xmlserializer": "^0.6.1"
   },

packages/ui-shared/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/ui-shared', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/ui-shared', path: 'auto', type: 'auto', version: '3.3.1' };

packages/vue-identicon/package.json

@@ -18,12 +18,12 @@
     "./detectPackage.cjs"
   ],
   "type": "module",
-  "version": "3.2.1",
+  "version": "3.3.1",
   "main": "index.js",
   "dependencies": {
-    "@polkadot/ui-shared": "3.2.1",
-    "@polkadot/util": "^12.0.1",
-    "@polkadot/util-crypto": "^12.0.1",
+    "@polkadot/ui-shared": "3.3.1",
+    "@polkadot/util": "^12.1.2",
+    "@polkadot/util-crypto": "^12.1.2",
     "jdenticon": "3.2.0",
     "tslib": "^2.5.0"
   },

packages/vue-identicon/src/Identicon.ts

@@ -4,12 +4,13 @@
 import type { VNode } from 'vue';
 import type { Prefix } from '@polkadot/util-crypto/address/types';
 
-import { defineComponent } from 'vue';
+import { defineComponent, h } from 'vue';
 
 import { isHex, isU8a, u8aToHex } from '@polkadot/util';
 import { decodeAddress, encodeAddress } from '@polkadot/util-crypto';
 
 import { Beachball, Empty, Jdenticon, Polkadot } from './icons/index.js';
+import { adaptVNodeAttrs } from './util.js';
 
 interface Account {
   address: string;
@@ -26,7 +27,7 @@ interface Data {
 
 const DEFAULT_SIZE = 64;
 
-function encodeAccount (value: string | Uint8Array, prefix?: Prefix): Account {
+export function encodeAccount (value: string | Uint8Array, prefix?: Prefix): Account {
   try {
     const address = isU8a(value) || isHex(value)
       ? encodeAddress(value as string, prefix)
@@ -81,23 +82,25 @@ export const Identicon = defineComponent({
     }
   },
   props: ['prefix', 'isAlternative', 'size', 'theme', 'value'],
-  render (h): VNode {
+  render (): VNode {
     const { address, iconSize, isAlternativeIcon, publicKey, type } = this.$data;
 
     if (type === 'empty') {
-      return h('Empty', {
-        attrs: {
+      return h(Empty, {
+        ...adaptVNodeAttrs({
           key: address,
           size: iconSize
-        }
+        })
       }, []);
     } else if (type === 'jdenticon') {
-      return h('Jdenticon', {
-        attrs: {
-          key: address,
-          publicKey,
-          size: iconSize
-        }
+      return h(Jdenticon, {
+        ...adaptVNodeAttrs(
+          {
+            key: address,
+            publicKey,
+            size: iconSize
+          }
+        )
       }, []);
     } else if (type === 'substrate') {
       throw new Error('substrate type is not supported');
@@ -105,14 +108,22 @@ export const Identicon = defineComponent({
 
     const cmp = type.charAt(0).toUpperCase() + type.slice(1);
 
-    return h(cmp, {
-      attrs: {
-        address,
-        isAlternative: isAlternativeIcon,
-        key: address,
-        size: iconSize
-      }
-    }, []);
+    if (['Beachball', 'Polkadot'].includes(cmp)) {
+      const component = cmp === 'Beachball'
+        ? Beachball
+        : Polkadot;
+
+      return h(component, {
+        ...adaptVNodeAttrs({
+          address,
+          isAlternative: isAlternativeIcon,
+          key: address,
+          size: iconSize
+        })
+      }, []);
+    } else {
+      return h(cmp, {}, []);
+    }
   },
   watch: {
     value: function (): void {

packages/vue-identicon/src/bundle.ts

@@ -2,5 +2,4 @@
 // SPDX-License-Identifier: Apache-2.0
 
 export { Identicon } from './Identicon.js';
-
 export { packageInfo } from './packageInfo.js';

packages/vue-identicon/src/icons/Beachball.ts

@@ -3,7 +3,7 @@
 
 import type { VNode } from 'vue';
 
-import { defineComponent } from 'vue';
+import { defineComponent, h } from 'vue';
 
 import { beachballIcon } from '@polkadot/ui-shared';
 
@@ -19,7 +19,7 @@ type PropsType = {
  */
 export const Beachball = defineComponent({
   props: ['address', 'size', 'isAlternative'],
-  render (h): VNode {
+  render (): VNode {
     const { address, isAlternative, size } = this.$props as PropsType;
 
     return h({

packages/vue-identicon/src/icons/Jdenticon.ts

@@ -4,7 +4,7 @@
 import type { VNode } from 'vue';
 
 import * as jdenticon from 'jdenticon';
-import { defineComponent } from 'vue';
+import { defineComponent, h } from 'vue';
 
 type PropsType = {
   publicKey: string,
@@ -17,7 +17,7 @@ type PropsType = {
  */
 export const Jdenticon = defineComponent({
   props: ['publicKey', 'size'],
-  render (h): VNode {
+  render (): VNode {
     const { publicKey, size } = this.$props as PropsType;
 
     return h({

packages/vue-identicon/src/icons/Polkadot.ts

@@ -3,10 +3,12 @@
 
 import type { VNode } from 'vue';
 
-import { defineComponent } from 'vue';
+import { defineComponent, h } from 'vue';
 
 import { polkadotIcon } from '@polkadot/ui-shared';
 
+import { adaptVNodeAttrs } from '../util.js';
+
 type propsType = {
   address: string;
   isAlternative: boolean;
@@ -19,18 +21,18 @@ type propsType = {
  */
 export const Polkadot = defineComponent({
   props: ['address', 'isAlternative', 'size'],
-  render (h): VNode {
+  render (): VNode {
     const { address, isAlternative, size } = this.$props as propsType;
     const circles = polkadotIcon(address, { isAlternative }).map(({ cx, cy, fill, r }) =>
-      h('circle', { attrs: { cx, cy, fill, r } }, [])
+      h('circle', { ...adaptVNodeAttrs({ cx, cy, fill, r }) }, [])
     );
 
     return h('svg', {
-      attrs: {
+      ...adaptVNodeAttrs({
         height: size,
         viewBox: '0 0 64 64',
         width: size
-      }
+      })
     }, circles);
   }
 });

packages/vue-identicon/src/packageInfo.ts

@@ -3,4 +3,4 @@
 
 // Do not edit, auto-generated by @polkadot/dev
 
-export const packageInfo = { name: '@polkadot/vue-identicon', path: 'auto', type: 'auto', version: '3.2.1' };
+export const packageInfo = { name: '@polkadot/vue-identicon', path: 'auto', type: 'auto', version: '3.3.1' };

packages/vue-identicon/src/util.ts

@@ -0,0 +1,17 @@
+// Copyright 2017-2023 @polkadot/vue-identicon authors & contributors
+// SPDX-License-Identifier: Apache-2.0
+
+import { version } from 'vue';
+
+const isV3 = version.startsWith('3.');
+
+/**
+ * @internal
+ *
+ * Adjust attributes to be usable in both Vue 2 and Vue 3 components.
+ */
+export function adaptVNodeAttrs (data: Record<string, unknown>): Record<string, unknown> {
+  return isV3
+    ? data
+    : { attrs: data };
+}