pezkuwichain/pezkuwi-ui
1
0
Fork 0
mirror of https://github.com/pezkuwichain/pezkuwi-ui.git synced 2026-06-13 03:01:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Convert all to named imports (#414)

Browse Source
This commit is contained in:
Jaco Greeff
2020-12-09 01:41:44 +01:00
committed by GitHub
parent a5434d4428
commit 7e494673e0
69 changed files with 175 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui-shared/src/icons/beachball/colors.spec.ts
+2 -2
View File
@@ -3,8 +3,8 @@
import type { ColorGen } from './types';
import newColors from './colors';
import newSeeder from './seeder';
import { colors as newColors } from './colors';
import { seeder as newSeeder } from './seeder';
describe('colors', (): void => {
let colors: ColorGen;
packages/ui-shared/src/icons/beachball/colors.ts
+1 -1
View File
@@ -11,7 +11,7 @@ import { COLORS } from './defaults';
const WOBBLE = 30;
export default function colors (seeder: Seeder): ColorGen {
export function colors (seeder: Seeder): ColorGen {
const amount = (seeder() * WOBBLE) - (WOBBLE / 2);
const all = COLORS.map((hex): Color =>
Color(hex).rotate(amount)
packages/ui-shared/src/icons/beachball/container.spec.ts
+1 -1
View File
@@ -1,7 +1,7 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import container from './container';
import { container } from './container';
describe('container', (): void => {
it('applies default styles', (): void => {
packages/ui-shared/src/icons/beachball/container.ts
+1 -1
View File
@@ -3,7 +3,7 @@
// Copyright 2016 Dan Finlay
export default function container (diameter: number, background = 'white', className = '', _style: { [index: string]: string } = {}): HTMLElement {
export function container (diameter: number, background = 'white', className = '', _style: { [index: string]: string } = {}): HTMLElement {
const element = document.createElement('div');
const style = Object.assign({
background,
packages/ui-shared/src/icons/beachball/demo.ts
+2 -2
View File
@@ -6,7 +6,7 @@
import { isNull } from '@polkadot/util';
import { encodeAddress, randomAsU8a } from '@polkadot/util-crypto';
import identicon from '.';
import { beachballIcon } from '.';
const element = document.getElementById('demo');
@@ -18,7 +18,7 @@ function generateIcon (seed: string = encodeAddress(randomAsU8a(32))): void {
}
element.appendChild(
identicon(seed, { isAlternative: false, size: 100 }, 'padded')
beachballIcon(seed, { isAlternative: false, size: 100 }, 'padded')
);
console.log(`Icon generated in ${(Date.now() - start)}ms`);
packages/ui-shared/src/icons/beachball/index.spec.ts
+3 -3
View File
@@ -3,13 +3,13 @@
import xmlserializer from 'xmlserializer';
import generate from '.';
import { beachballIcon } from '.';
describe('identicon', (): void => {
it('generates a basic [0,..,0] identicon', (): void => {
expect(
xmlserializer.serializeToString(
generate(new Uint8Array(32), { isAlternative: false, size: 256 })
beachballIcon(new Uint8Array(32), { isAlternative: false, size: 256 })
)
).toEqual(
'<div xmlns="http://www.w3.org/1999/xhtml" class="" style="background: white; border-radius: 128px; display: inline-block; height: 256px; margin: 0px; overflow: hidden; padding: 0px; width: 256px;"><div class="" style="background: rgb(20, 20, 20); border-radius: 128px; display: inline-block; height: 256px; margin: 0px; overflow: hidden; padding: 0px; width: 256px;"><svg xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="256" height="256"><circle cx="128" cy="140.8" r="128" fill="hsl(212.10000000000002, 65.6%, 55.5%)"/><circle cx="128" cy="153.6" r="102.4" fill="hsl(9.800000000000011, 90.7%, 57.6%)"/><circle cx="128" cy="166.4" r="76.8" fill="hsl(345, 85.7%, 86.3%)"/><circle cx="128" cy="179.2" r="51.2" fill="hsl(261.9, 100%, 87.3%)"/><circle cx="128" cy="192" r="25.6" fill="hsl(345, 100%, 25.1%)"/></svg></div></div>'
@@ -19,7 +19,7 @@ describe('identicon', (): void => {
it('allows overrides', (): void => {
expect(
xmlserializer.serializeToString(
generate(new Uint8Array(32), { isAlternative: false, size: 100 }, 'testClass', { display: 'block' })
beachballIcon(new Uint8Array(32), { isAlternative: false, size: 100 }, 'testClass', { display: 'block' })
)
).toEqual(
'<div xmlns="http://www.w3.org/1999/xhtml" class="testClass" style="background: white; border-radius: 50px; display: block; height: 100px; margin: 0px; overflow: hidden; padding: 0px; width: 100px;"><div class="" style="background: rgb(20, 20, 20); border-radius: 50px; display: inline-block; height: 100px; margin: 0px; overflow: hidden; padding: 0px; width: 100px;"><svg xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="100" height="100"><circle cx="50" cy="55" r="50" fill="hsl(212.10000000000002, 65.6%, 55.5%)"/><circle cx="50" cy="60" r="40" fill="hsl(9.800000000000011, 90.7%, 57.6%)"/><circle cx="50" cy="65" r="30" fill="hsl(345, 85.7%, 86.3%)"/><circle cx="50" cy="70" r="20" fill="hsl(261.9, 100%, 87.3%)"/><circle cx="50" cy="75" r="10" fill="hsl(345, 100%, 25.1%)"/></svg></div></div>'
packages/ui-shared/src/icons/beachball/index.ts
+8 -8
View File
@@ -5,26 +5,26 @@
import type { Options } from '../types';
import newShape from './shape/circle';
import newElement from './svg/element';
import colors from './colors';
import newContainer from './container';
import { circle } from './shape/circle';
import { element } from './svg/element';
import { colors } from './colors';
import { container as newContainer } from './container';
import { SHAPE_COUNT } from './defaults';
import newSeeder from './seeder';
import { seeder as newSeeder } from './seeder';
export default function generate (seed: string | Uint8Array, { size = 256 }: Options, className = '', style?: { [index: string]: string }): HTMLElement {
export function beachballIcon (seed: string | Uint8Array, { size = 256 }: Options, className = '', style?: { [index: string]: string }): HTMLElement {
const seeder = newSeeder(seed);
const colorGen = colors(seeder);
const outer = newContainer(size, 'white', className, style);
const container = newContainer(size, colorGen());
const svg = newElement(size);
const svg = element(size);
outer.appendChild(container);
container.appendChild(svg);
for (let count = 0; count < SHAPE_COUNT; count++) {
const fill = colorGen();
const shape = newShape(seeder, fill, size, count);
const shape = circle(seeder, fill, size, count);
svg.appendChild(shape);
}
packages/ui-shared/src/icons/beachball/seeder.spec.ts
+1 -1
View File
@@ -3,7 +3,7 @@
import type { Seeder } from './types';
import newSeeder from './seeder';
import { seeder as newSeeder } from './seeder';
describe('seeder', (): void => {
let seeder: Seeder;
packages/ui-shared/src/icons/beachball/seeder.ts
+1 -1
View File
@@ -7,7 +7,7 @@ import { isU8a, stringToU8a } from '@polkadot/util';
const DIVISOR = 256 * 256;
export default function seeder (_seed: string | Uint8Array = new Uint8Array(32)): Seeder {
export function seeder (_seed: string | Uint8Array = new Uint8Array(32)): Seeder {
const seed: Uint8Array = isU8a(_seed)
? _seed
: stringToU8a(_seed);
packages/ui-shared/src/icons/beachball/shape/circle.spec.ts
+2 -2
View File
@@ -3,8 +3,8 @@
import xmlserializer from 'xmlserializer';
import seeder from '../seeder';
import circle from './circle';
import { seeder } from '../seeder';
import { circle } from './circle';
describe('circle', (): void => {
it('creates a circle shape', (): void => {
packages/ui-shared/src/icons/beachball/shape/circle.ts
+2 -2
View File
@@ -6,9 +6,9 @@
import type { Seeder } from '../types';
import { SHAPE_COUNT } from '../defaults';
import newCircle from '../svg/circle';
import { circle as newCircle } from '../svg/circle';
export default function circle (seeder: Seeder, fill: string, diameter: number, count: number): Element {
export function circle (seeder: Seeder, fill: string, diameter: number, count: number): Element {
const center = diameter / 2;
const angle = seeder() * 360;
const radius = (((SHAPE_COUNT - count) / SHAPE_COUNT) * (diameter / 2)) + ((diameter / 8) * seeder());
packages/ui-shared/src/icons/beachball/shape/square.ts
+2 -2
View File
@@ -6,9 +6,9 @@
import type { Seeder } from '../types';
import { SHAPE_COUNT } from '../defaults';
import newRect from '../svg/rect';
import { rect as newRect } from '../svg/rect';
export default function square (seeder: Seeder, fill: string, diameter: number, count: number): Element {
export function square (seeder: Seeder, fill: string, diameter: number, count: number): Element {
const center = diameter / 2;
const svg = newRect(diameter);
const firstRot = seeder();
packages/ui-shared/src/icons/beachball/svg/circle.spec.ts
+3 -3
View File
@@ -1,14 +1,14 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import xmlserializer from 'xmlserializer';
import { serializeToString } from 'xmlserializer';
import circle from './circle';
import { circle } from './circle';
describe('circle', (): void => {
it('creates a basic SVG circle element', (): void => {
expect(
xmlserializer.serializeToString(
serializeToString(
circle(123, 12, 34)
)
).toEqual('<circle xmlns="http://www.w3.org/2000/svg" cx="12" cy="34" r="123"/>');
packages/ui-shared/src/icons/beachball/svg/circle.ts
+3 -3
View File
@@ -1,10 +1,10 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import createSvg from './svg';
import { svg } from './svg';
export default function circle (r: number, cx: number, cy: number): Element {
const elem = createSvg('circle');
export function circle (r: number, cx: number, cy: number): Element {
const elem = svg('circle');
elem.setAttributeNS('', 'cx', `${cx}`);
elem.setAttributeNS('', 'cy', `${cy}`);
packages/ui-shared/src/icons/beachball/svg/element.spec.ts
+3 -3
View File
@@ -1,14 +1,14 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import xmlserializer from 'xmlserializer';
import { serializeToString } from 'xmlserializer';
import element from './element';
import { element } from './element';
describe('element', (): void => {
it('creates a basic SVG element', (): void => {
expect(
xmlserializer.serializeToString(
serializeToString(
element(123)
)
).toEqual('<svg xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="123" height="123"/>');
packages/ui-shared/src/icons/beachball/svg/element.ts
+3 -3
View File
@@ -3,10 +3,10 @@
// Copyright 2016 Dan Finlay
import createSvg from './svg';
import { svg } from './svg';
export default function element (size: number, type = 'svg', x = 0, y = 0): Element {
const elem = createSvg(type);
export function element (size: number, type = 'svg', x = 0, y = 0): Element {
const elem = svg(type);
elem.setAttributeNS('', 'x', `${x}`);
elem.setAttributeNS('', 'y', `${y}`);
packages/ui-shared/src/icons/beachball/svg/rect.spec.ts
+3 -3
View File
@@ -1,14 +1,14 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import xmlserializer from 'xmlserializer';
import { serializeToString } from 'xmlserializer';
import rect from './rect';
import { rect } from './rect';
describe('rect', (): void => {
it('creates a basic SVG rect element', (): void => {
expect(
xmlserializer.serializeToString(
serializeToString(
rect(123)
)
).toEqual('<rect xmlns="http://www.w3.org/2000/svg" x="0" y="0" width="123" height="123" rx="7.6875" ry="7.6875"/>');
packages/ui-shared/src/icons/beachball/svg/rect.ts
+3 -3
View File
@@ -1,10 +1,10 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import createElement from './element';
import { element } from './element';
export default function rect (size: number): Element {
const elem = createElement(size, 'rect');
export function rect (size: number): Element {
const elem = element(size, 'rect');
elem.setAttributeNS('', 'rx', `${size / 16}`);
elem.setAttributeNS('', 'ry', `${size / 16}`);
packages/ui-shared/src/icons/beachball/svg/svg.spec.ts
+3 -3
View File
@@ -1,14 +1,14 @@
// Copyright 2017-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import xmlserializer from 'xmlserializer';
import { serializeToString } from 'xmlserializer';
import svg from './svg';
import { svg } from './svg';
describe('svg', (): void => {
it('creates a basic SVG element', (): void => {
expect(
xmlserializer.serializeToString(
serializeToString(
svg('rect')
)
).toEqual('<rect xmlns="http://www.w3.org/2000/svg"/>');
packages/ui-shared/src/icons/beachball/svg/svg.ts
+1 -1
View File
@@ -5,6 +5,6 @@
const SVG_NS = 'http://www.w3.org/2000/svg';
export default function svg (type: string): Element {
export function svg (type: string): Element {
return document.createElementNS(SVG_NS, type);
}
packages/ui-shared/src/icons/index.ts
+2 -2
View File
@@ -1,5 +1,5 @@
// Copyright 2018-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
export { default as beachballIcon } from './beachball';
export { default as polkadotIcon } from './polkadot';
export { beachballIcon } from './beachball';
export { polkadotIcon } from './polkadot';
packages/ui-shared/src/icons/polkadot.spec.ts
+2 -2
View File
@@ -1,12 +1,12 @@
// Copyright 2018-2020 @polkadot/ui-shared authors & contributors
// SPDX-License-Identifier: Apache-2.0
import generate from './polkadot';
import { polkadotIcon } from './polkadot';
describe('polkadotIcon', (): void => {
it('generates the correct points from known', (): void => {
expect(
generate('5Dqvi1p4C7EhPPFKCixpF3QiaJEaDwWrR9gfWR5eUsfC39TX', { isAlternative: false })
polkadotIcon('5Dqvi1p4C7EhPPFKCixpF3QiaJEaDwWrR9gfWR5eUsfC39TX', { isAlternative: false })
).toEqual([
{ cx: 32, cy: 32, fill: '#eee', r: 32 },
{ cx: 32, cy: 8, fill: 'hsl(196, 65%, 53%)', r: 5 },
packages/ui-shared/src/icons/polkadot.ts
+1 -1
View File
@@ -131,7 +131,7 @@ function getColors (address: string): string[] {
/**
* @description Generate a array of the circles that make up an identicon
*/
export default function generate (address: string, { isAlternative }: Options): Circle[] {
export function polkadotIcon (address: string, { isAlternative }: Options): Circle[] {
const colors = getColors(address);
return [OUTER_CIRCLE].concat(