This commit is contained in:
Jaco
2023-03-05 11:02:25 +02:00
committed by GitHub
parent a3b5206107
commit 581a360226
36 changed files with 245 additions and 1673 deletions
+4 -1
View File
@@ -1,10 +1,13 @@
# CHANGELOG
## master
## 3.0.1 Mar 5, 2023
Changes:
- Remove `@polkadot/ui-assets` package
- Swap TS -> JS compiler to use tsc (from babel)
- Adjust all tests to use `node:test` runner (ESM variants)
- Bump to `@polkadot/util` 11.0.1
## 2.12.1 Feb 20, 2023
-7
View File
@@ -16,10 +16,3 @@ Additionally some shared libraries, that are not dependent on any framework -
- [ui-keyring](packages/ui-keyring/) A browser-specific wrapper around the base [@polkadot/util-keyring](https://github.com/polkadot-js/util/) library
- [ui-settings](packages/ui-settings/) A browser local storage wrapper for app settings & configuration
- [ui-shared](packages/ui-shared) Shared logic that is used across UI components, e.g. for icon generation
## examples
In addition to the above packages, there are examples available for integration of `ui-keyring`, `ui-settings` & the relevant `*-identicon` package. These are
- [example-react](packages/example-react) - start with `yarn example:react` and view on `http://localhost:8080`
- [example-vue](packages/example-vue) - start with `yarn example:vue` and view on `http://localhost:8080`
-16
View File
@@ -1,16 +0,0 @@
// Copyright 2017-2023 @polkadot/ui authors & contributors
// SPDX-License-Identifier: Apache-2.0
const base = require('@polkadot/dev/config/babel-config-cjs.cjs');
module.exports = Object.keys(base).reduce((config, key) => {
config[key] = base[key];
if (key === 'plugins') {
config[key] = config[key].concat([
'transform-vue-template'
]);
}
return config;
}, {});
-10
View File
@@ -1,10 +0,0 @@
// Copyright 2017-2023 @polkadot/ui authors & contributors
// SPDX-License-Identifier: Apache-2.0
import nodeCrypto from 'crypto';
window.crypto ??= {
getRandomValues: function (buffer) {
return nodeCrypto.randomFillSync(buffer);
}
};
+5 -15
View File
@@ -11,7 +11,7 @@
},
"sideEffects": false,
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"versions": {
"git": "2.12.2-5-x",
"npm": "2.12.1"
@@ -24,29 +24,19 @@
"build:release": "polkadot-ci-ghact-build",
"build:rollup": "polkadot-exec-rollup --config",
"clean": "polkadot-dev-clean-build",
"example:react": "yarn build && cd packages/example-react && yarn polkadot-exec-webpack --config webpack.config.cjs",
"example:vue": "yarn build && cd packages/example-vue && yarn polkadot-exec-webpack --config webpack.config.cjs",
"lint": "polkadot-dev-run-lint",
"postinstall": "polkadot-dev-yarn-only",
"test": "polkadot-dev-run-test --env browser",
"test:one": "polkadot-dev-run-test --env browser"
},
"devDependencies": {
"@babel/core": "^7.21.0",
"@babel/runtime": "^7.21.0",
"@polkadot/dev": "^0.69.25",
"@polkadot/x-bundle": "^10.4.2",
"@types/node": "^18.14.5",
"babel-loader": "^8.3.0",
"babel-plugin-transform-vue-template": "^0.4.2",
"empty": "^0.10.1",
"process": "^0.11.10",
"@polkadot/dev": "^0.69.27",
"@polkadot/x-bundle": "^11.0.1",
"@types/node": "^18.14.6",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-is": "^18.2.0",
"react-native": "^0.71.3",
"stream-browserify": "^3.0.0",
"vue-template-compiler": "^2.7.14"
"react-native": "^0.71.3"
},
"resolutions": {
"typescript": "^4.9.5"
View File
View File
-3
View File
@@ -1,3 +0,0 @@
# @polkadot/example-react
A versy basic React example with `@polkadot/ui-keyring`, `@polkadot/ui-settings` & `@polkadot/react-identicon`
-37
View File
@@ -1,37 +0,0 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css" />
<style>
#example {
padding: 0.5em;
}
button {
cursor: pointer;
padding: 0.5rem 0.75rem;
}
label {
display: block;
margin: 0.25rem 0;
opacity: 0.5;
}
section {
padding: 0.5rem 1rem;
}
textarea {
resize: none;
}
.icon {
margin-right: 0.75rem;
}
</style>
</head>
<body>
<div id="example"></div>
<script src="./build/main.js"></script>
</body>
</html>
-22
View File
@@ -1,22 +0,0 @@
{
"author": "Jaco Greeff <jacogr@gmail.com>",
"bugs": "https://github.com/polkadot-js/ui/issues",
"contributors": [],
"description": "A very basic example with ui-* & react-* packages",
"homepage": "https://github.com/polkadot-js/ui/tree/master/packages/example-react#readme",
"license": "Apache-2.0",
"maintainers": [],
"name": "@polkadot/example-react",
"private": true,
"repository": {
"directory": "packages/example-react",
"type": "git",
"url": "https://github.com/polkadot-js/ui.git"
},
"sideEffects": false,
"version": "2.12.2-5-x",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0"
}
}
@@ -1,6 +0,0 @@
// Copyright 2017-2023 @polkadot/example-react authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Empty template, auto-generated by @polkadot/dev
export default [];
@@ -1,11 +0,0 @@
// Copyright 2017-2023 @polkadot/example-react authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Do not edit, auto-generated by @polkadot/dev
import { detectPackage } from '@polkadot/util';
import others from './detectOther';
import { packageInfo } from './packageInfo';
detectPackage(packageInfo, null, others);
-121
View File
@@ -1,121 +0,0 @@
// Copyright 2017-2023 @polkadot/example-react authors & contributors
// SPDX-License-Identifier: Apache-2.0
import React, { useCallback, useEffect, useState } from 'react';
import ReactDOM from 'react-dom';
import { Identicon } from '@polkadot/react-identicon';
import { keyring } from '@polkadot/ui-keyring';
import { settings } from '@polkadot/ui-settings';
import { cryptoWaitReady, mnemonicGenerate } from '@polkadot/util-crypto';
interface Props {
className?: string;
}
const rootElement = document.getElementById('example');
if (!rootElement) {
throw new Error('Unable to find element with id \'example\'');
}
function App ({ className }: Props): React.ReactElement<Props> | null {
const [address, setAddress] = useState<string | null>(null);
const [phrase, setPhrase] = useState<string | null>(null);
const [ss58Format, setSS58Format] = useState(42);
const _onClickNew = useCallback(
(): void => {
const phrase = mnemonicGenerate(12);
const { address } = keyring.createFromUri(phrase);
setAddress(keyring.encodeAddress(address, ss58Format));
setPhrase(phrase);
},
[ss58Format]
);
const _onChangeSS58Format = useCallback(
({ currentTarget: { value } }: React.SyntheticEvent<HTMLSelectElement>): void => {
setSS58Format(parseInt(value, 10));
},
[]
);
useEffect((): void => {
_onClickNew();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
useEffect((): void => {
address && setAddress(keyring.encodeAddress(address, ss58Format));
}, [address, ss58Format]);
if (!address || !phrase) {
return null;
}
return (
<div className={className}>
<section>
<button onClick={_onClickNew}>another random address</button>
</section>
<section>
<label>phrase</label>
<textarea
cols={40}
readOnly
rows={4}
value={phrase}
/>
</section>
<section>
<label>icons</label>
<Identicon
className='icon'
value={address}
/>
<Identicon
className='icon'
theme='polkadot'
value={address}
/>
<Identicon
className='icon'
theme='beachball'
value={address}
/>
</section>
<section>
<label>address</label>
{address}
</section>
<section>
<label>ss58 format</label>
<select
onChange={_onChangeSS58Format}
value={ss58Format}
>
{settings.availablePrefixes
.filter((_, index): boolean => index !== 0)
.map(({ text, value }): React.ReactNode => (
<option
key={value}
value={value}
>
{text}
</option>
))
}
</select>
</section>
</div>
);
}
cryptoWaitReady()
.then((): void => {
keyring.loadAll({ ss58Format: 42, type: 'sr25519' });
ReactDOM.render(<App />, rootElement);
})
.catch(console.error);
@@ -1,6 +0,0 @@
// Copyright 2017-2023 @polkadot/example-react authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Do not edit, auto-generated by @polkadot/dev
export const packageInfo = { name: '@polkadot/example-react', path: 'auto', type: 'auto', version: '2.12.2-5-x' };
@@ -1,12 +0,0 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"baseUrl": "..",
"outDir": "./build",
"rootDir": "./src"
},
"references": [
{ "path": "../react-identicon/tsconfig.build.json" },
{ "path": "../ui-keyring/tsconfig.build.json" }
]
}
-53
View File
@@ -1,53 +0,0 @@
// Copyright 2017-2023 @polkadot/example-react authors & contributors
// SPDX-License-Identifier: Apache-2.0
const path = require('path');
const { WebpackPluginServe } = require('webpack-plugin-serve');
module.exports = {
context: __dirname,
devtool: 'eval-cheap-source-map',
entry: './src/index.tsx',
mode: 'development',
module: {
rules: [
{
exclude: /(node_modules)/,
test: /\.(ts|tsx)$/,
use: [
{
loader: 'babel-loader',
options: require('../../babel.config.cjs')
}
]
}
]
},
output: {
chunkFilename: '[name].[chunkhash:8].js',
filename: '[name].js',
globalObject: '(typeof self !== \'undefined\' ? self : this)',
path: path.join(__dirname, 'build')
},
plugins: [
new WebpackPluginServe({
hmr: false, // switch off, Chrome WASM memory leak
liveReload: false, // explict off, overrides hmr
port: 8080,
progress: false, // since we have hmr off, disable
static: __dirname
})
],
resolve: {
alias: {
'@polkadot/react-identicon': path.resolve(__dirname, '../react-identicon/build'),
'@polkadot/ui-keyring': path.resolve(__dirname, '../ui-keyring/build'),
'@polkadot/ui-settings': path.resolve(__dirname, '../ui-settings/build'),
'@polkadot/ui-shared': path.resolve(__dirname, '../ui-shared/build')
},
extensions: ['.js', '.ts', '.tsx'],
fallback: {}
},
target: 'web',
watch: true
};
View File
View File
-3
View File
@@ -1,3 +0,0 @@
# @polkadot/example-vue
A versy basic Vue.js example with `@polkadot/ui-keyring`, `@polkadot/ui-settings` & `@polkadot/vue-identicon`
-38
View File
@@ -1,38 +0,0 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css" />
<style>
#example {
padding: 0.5em;
}
button {
cursor: pointer;
padding: 0.5rem 0.75rem;
}
label {
display: block;
margin: 0.25rem 0;
opacity: 0.5;
}
section {
padding: 0.5rem 1rem;
}
textarea {
resize: none;
}
.icon {
display: inline-block;
margin-right: 0.75rem;
}
</style>
</head>
<body>
<div id="example"></div>
<script src="./build/main.js"></script>
</body>
</html>
-22
View File
@@ -1,22 +0,0 @@
{
"author": "Jaco Greeff <jacogr@gmail.com>",
"bugs": "https://github.com/polkadot-js/ui/issues",
"contributors": [],
"description": "A very basic example with ui-* & vue-* packages",
"homepage": "https://github.com/polkadot-js/ui/tree/master/packages/example-vue#readme",
"license": "Apache-2.0",
"maintainers": [],
"name": "@polkadot/example-vue",
"private": true,
"repository": {
"directory": "packages/example-vue",
"type": "git",
"url": "https://github.com/polkadot-js/ui.git"
},
"sideEffects": false,
"version": "2.12.2-5-x",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0"
}
}
-6
View File
@@ -1,6 +0,0 @@
// Copyright 2017-2023 @polkadot/example-vue authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Empty template, auto-generated by @polkadot/dev
export default [];
-11
View File
@@ -1,11 +0,0 @@
// Copyright 2017-2023 @polkadot/example-vue authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Do not edit, auto-generated by @polkadot/dev
import { detectPackage } from '@polkadot/util';
import others from './detectOther';
import { packageInfo } from './packageInfo';
detectPackage(packageInfo, null, others);
-99
View File
@@ -1,99 +0,0 @@
// Copyright 2017-2023 @polkadot/example-vue authors & contributors
// SPDX-License-Identifier: Apache-2.0
import type { Prefix } from '@polkadot/util-crypto/address/types';
import Vue, { VNode } from 'vue';
import { keyring } from '@polkadot/ui-keyring';
import { settings } from '@polkadot/ui-settings';
import { cryptoWaitReady, mnemonicGenerate } from '@polkadot/util-crypto';
import Identicon from '@polkadot/vue-identicon';
interface Account {
address: string;
phrase: string;
}
interface Data extends Account {
ss58Format: Prefix;
ss58Options: { text: string; value: string | number }[];
}
const ss58Options = settings.availablePrefixes.filter((_, index): boolean => index !== 0);
function generateAccount (ss58Format: Prefix = 42): Account {
const phrase = mnemonicGenerate(12);
const { address } = keyring.createFromUri(phrase);
return {
address: keyring.encodeAddress(address, ss58Format),
phrase
};
}
const Example = Vue.extend({
components: {
Identicon
},
data: function (): Data {
return {
...generateAccount(),
ss58Format: 42,
ss58Options
};
},
methods: {
onClickNew: function (): void {
const { address, phrase } = generateAccount(this.ss58Format);
this.address = address;
this.phrase = phrase;
}
},
name: 'Example',
template: `
<div id="example">
<section>
<button v-on:click="onClickNew">another random address</button>
</section>
<section>
<label>phrase</label>
<textarea :cols="40" :rows="4" readonly v-model="phrase" />
</section>
<section>
<label>icons</label>
<Identicon class='icon' :value="address" />
<Identicon class='icon' :value="address" :theme="'polkadot'" />
<Identicon class='icon' :value="address" :theme="'beachball'" />
</section>
<section>
<label>address</label>
{{ address }}
</section>
<section>
<label>ss58 format</label>
<select v-model="ss58Format">
<option v-for="option in ss58Options" v-bind:value="option.value">
{{ option.text }}
</option>
</select>
</section>
</div>
`,
watch: {
ss58Format: function (): void {
this.address = keyring.encodeAddress(this.address, this.ss58Format);
}
}
});
cryptoWaitReady()
.then((): void => {
keyring.loadAll({ ss58Format: 42, type: 'sr25519' });
new Vue({
render: (h): VNode => h(Example)
}).$mount('#example');
})
.catch(console.error);
-6
View File
@@ -1,6 +0,0 @@
// Copyright 2017-2023 @polkadot/example-vue authors & contributors
// SPDX-License-Identifier: Apache-2.0
// Do not edit, auto-generated by @polkadot/dev
export const packageInfo = { name: '@polkadot/example-vue', path: 'auto', type: 'auto', version: '2.12.2-5-x' };
-12
View File
@@ -1,12 +0,0 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"baseUrl": "..",
"outDir": "./build",
"rootDir": "./src"
},
"references": [
{ "path": "../ui-keyring/tsconfig.build.json" },
{ "path": "../vue-identicon/tsconfig.build.json" }
]
}
-52
View File
@@ -1,52 +0,0 @@
// Copyright 2017-2023 @polkadot/example-vue authors & contributors
// SPDX-License-Identifier: Apache-2.0
const path = require('path');
const { WebpackPluginServe } = require('webpack-plugin-serve');
module.exports = {
context: __dirname,
devtool: 'eval-cheap-source-map',
entry: './src/index.ts',
mode: 'development',
module: {
rules: [
{
exclude: /(node_modules)/,
test: /\.(ts|tsx)$/,
use: [
{
loader: 'babel-loader',
options: require('../../babel.config.cjs')
}
]
}
]
},
output: {
chunkFilename: '[name].[chunkhash:8].js',
filename: '[name].js',
globalObject: '(typeof self !== \'undefined\' ? self : this)',
path: path.join(__dirname, 'build')
},
plugins: [
new WebpackPluginServe({
hmr: false, // switch off, Chrome WASM memory leak
liveReload: false, // explict off, overrides hmr
port: 8080,
progress: false, // since we have hmr off, disable
static: __dirname
})
],
resolve: {
alias: {
'@polkadot/ui-keyring': path.resolve(__dirname, '../ui-keyring/build'),
'@polkadot/ui-settings': path.resolve(__dirname, '../ui-settings/build'),
'@polkadot/ui-shared': path.resolve(__dirname, '../ui-shared/build'),
'@polkadot/vue-identicon': path.resolve(__dirname, '../vue-identicon/build')
},
extensions: ['.js', '.ts', '.tsx']
},
target: 'web',
watch: true
};
+8 -8
View File
@@ -17,20 +17,20 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/keyring": "^10.4.2",
"@polkadot/ui-settings": "2.12.2-5-x",
"@polkadot/ui-shared": "2.12.2-5-x",
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"@polkadot/keyring": "^11.0.1",
"@polkadot/ui-settings": "3.0.0",
"@polkadot/ui-shared": "3.0.0",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"color": "^3.2.1",
"ethereum-blockies-base64": "^1.0.2",
"jdenticon": "3.2.0",
"react-copy-to-clipboard": "^5.1.0",
"styled-components": "^5.3.8"
"styled-components": "^5.3.8",
"tslib": "^2.5.0"
},
"devDependencies": {
"@types/react-copy-to-clipboard": "^5.0.4",
+6 -6
View File
@@ -17,16 +17,16 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/ui-settings": "2.12.2-5-x",
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"@polkadot/ui-settings": "3.0.0",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"qrcode-generator": "^1.4.4",
"react-qr-reader": "^2.2.1",
"styled-components": "^5.3.8"
"styled-components": "^5.3.8",
"tslib": "^2.5.0"
},
"devDependencies": {
"@types/react-qr-reader": "^2.1.4",
+6 -6
View File
@@ -17,14 +17,14 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/ui-shared": "2.12.2-5-x",
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"react-native-svg": "^12.5.1"
"@polkadot/ui-shared": "3.0.0",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"react-native-svg": "^12.5.1",
"tslib": "^2.5.0"
},
"devDependencies": {
"@types/react-native": "^0.71.3"
+8 -8
View File
@@ -16,17 +16,17 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/keyring": "^10.4.2",
"@polkadot/ui-settings": "2.12.2-5-x",
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"mkdirp": "^2.1.4",
"@polkadot/keyring": "^11.0.1",
"@polkadot/ui-settings": "3.0.0",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"mkdirp": "^2.1.5",
"rxjs": "^7.8.0",
"store": "^2.0.12"
"store": "^2.0.12",
"tslib": "^2.5.0"
},
"devDependencies": {
"@types/mkdirp": "^1.0.2",
+5 -5
View File
@@ -17,14 +17,14 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/networks": "^10.4.2",
"@polkadot/util": "^10.4.2",
"@polkadot/networks": "^11.0.1",
"@polkadot/util": "^11.0.1",
"eventemitter3": "^4.0.7",
"store": "^2.0.12"
"store": "^2.0.12",
"tslib": "^2.5.0"
},
"devDependencies": {
"@types/store": "^2.0.2"
+5 -5
View File
@@ -17,15 +17,15 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"color": "^3.2.1"
"color": "^3.2.1",
"tslib": "^2.5.0"
},
"devDependencies": {
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"@types/color": "^3.0.3",
"@types/xmlserializer": "^0.6.3",
"xmlserializer": "^0.6.1"
+6 -6
View File
@@ -17,14 +17,14 @@
"./detectPackage.cjs"
],
"type": "module",
"version": "2.12.2-5-x",
"version": "3.0.0",
"main": "index.js",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@polkadot/ui-shared": "2.12.2-5-x",
"@polkadot/util": "^10.4.2",
"@polkadot/util-crypto": "^10.4.2",
"jdenticon": "3.2.0"
"@polkadot/ui-shared": "3.0.0",
"@polkadot/util": "^11.0.1",
"@polkadot/util-crypto": "^11.0.1",
"jdenticon": "3.2.0",
"tslib": "^2.5.0"
},
"devDependencies": {
"vue": "^2.7.14"
-2
View File
@@ -4,8 +4,6 @@
},
"files": [],
"references": [
{ "path": "./packages/example-react/tsconfig.build.json" },
{ "path": "./packages/example-vue/tsconfig.build.json" },
{ "path": "./packages/react-identicon/tsconfig.build.json" },
{ "path": "./packages/react-qr/tsconfig.build.json" },
{ "path": "./packages/reactnative-identicon/tsconfig.build.json" },
+192 -1058
View File
File diff suppressed because it is too large Load Diff