* ui-signer pureComponentify * ui-react pureCompify * Status queue prop * ui-app Button * ui-app InputExtrinsic * apps, app-rpc, ui-app, ui-react * app-extrinsics, app-explorer, apps * fixes for tslint * more linter fixes * Update index.tsx * Update index.tsx * Update Nonce.tsx * Update index.tsx * Update Results.tsx * Update index.tsx * Update Queries.tsx * Update NodeInfo.tsx * Update index.tsx * Update Item.tsx * style fixes * TSLINTs
42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
// Copyright 2017-2018 @polkadot/ui-react authors & contributors
|
|
// This software may be modified and distributed under the terms
|
|
// of the ISC license. See the LICENSE file for details.
|
|
|
|
import React from 'react';
|
|
|
|
import Container from './index';
|
|
|
|
type DemoProps = {
|
|
attrs: { [index: string]: any },
|
|
attrsReq: Array<string>,
|
|
children: any, // node?
|
|
component: string
|
|
};
|
|
|
|
export default class Demo extends React.PureComponent<DemoProps> {
|
|
render () {
|
|
const { attrs, attrsReq, children, component } = this.props;
|
|
const allAttrs = Object.assign({ className: '"..."', style: '{...}' }, attrs);
|
|
const attrsText = Object
|
|
.keys(allAttrs)
|
|
.map((attr) => {
|
|
const value = allAttrs[attr];
|
|
const bool = value === 'bool';
|
|
const opt = bool || !attrsReq.includes(attr);
|
|
|
|
return `${opt ? '[' : ''}${attr}${bool ? '' : '='}${bool ? '' : value}${opt ? ']' : ''}`;
|
|
})
|
|
.sort()
|
|
.join('\n ');
|
|
|
|
return (
|
|
<Container className='ui--DemoContainer'>
|
|
<pre className='ui--DemoHeader'>
|
|
{`<${component}\n ${attrsText}\n/>`}
|
|
</pre>
|
|
{children}
|
|
</Container>
|
|
);
|
|
}
|
|
}
|