diff --git a/ui/app/components/ui/identicon/identicon.component.js b/ui/app/components/ui/identicon/identicon.component.js index 5fed06304..740957af7 100644 --- a/ui/app/components/ui/identicon/identicon.component.js +++ b/ui/app/components/ui/identicon/identicon.component.js @@ -26,7 +26,12 @@ export default class Identicon extends PureComponent { } static defaultProps = { + addBorder: false, + address: undefined, + className: undefined, diameter: 46, + image: undefined, + useBlockie: false, } renderImage () { diff --git a/ui/app/components/ui/identicon/identicon.stories.js b/ui/app/components/ui/identicon/identicon.stories.js new file mode 100644 index 000000000..69d4d2721 --- /dev/null +++ b/ui/app/components/ui/identicon/identicon.stories.js @@ -0,0 +1,45 @@ +import React from 'react' +import { text, boolean } from '@storybook/addon-knobs/react' +import Identicon from './identicon.component' +import { number } from '@storybook/addon-knobs' + +export default { title: 'Identicon' } + +const diameterOptions = { + range: true, + min: 10, + max: 200, + step: 1, +} +export const standard = () => ( + +) + +export const image = () => ( + +) + +export const blockie = () => ( + +) + +// The border size is hard-coded in CSS, and was designed with this size identicon in mind +const withBorderDiameter = 32 + +export const withBorder = () => ( + +)