Add website to mono repo, update packages to align with existing sub-packages, use new subscribeAsync 0x.js method
This commit is contained in:
174
packages/website/ts/pages/documentation/method_block.tsx
Normal file
174
packages/website/ts/pages/documentation/method_block.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
import * as _ from 'lodash';
|
||||
import * as React from 'react';
|
||||
import * as ReactMarkdown from 'react-markdown';
|
||||
import {Chip} from 'material-ui/Chip';
|
||||
import {colors} from 'material-ui/styles';
|
||||
import {
|
||||
TypeDocNode,
|
||||
Styles,
|
||||
TypeDefinitionByName,
|
||||
TypescriptMethod,
|
||||
SolidityMethod,
|
||||
Parameter,
|
||||
HeaderSizes,
|
||||
} from 'ts/types';
|
||||
import {utils} from 'ts/utils/utils';
|
||||
import {SourceLink} from 'ts/pages/documentation/source_link';
|
||||
import {MethodSignature} from 'ts/pages/documentation/method_signature';
|
||||
import {AnchorTitle} from 'ts/pages/shared/anchor_title';
|
||||
import {Comment} from 'ts/pages/documentation/comment';
|
||||
import {typeDocUtils} from 'ts/utils/typedoc_utils';
|
||||
|
||||
interface MethodBlockProps {
|
||||
method: SolidityMethod|TypescriptMethod;
|
||||
libraryVersion: string;
|
||||
typeDefinitionByName: TypeDefinitionByName;
|
||||
}
|
||||
|
||||
interface MethodBlockState {
|
||||
shouldShowAnchor: boolean;
|
||||
}
|
||||
|
||||
const styles: Styles = {
|
||||
chip: {
|
||||
fontSize: 13,
|
||||
backgroundColor: colors.lightBlueA700,
|
||||
color: 'white',
|
||||
height: 11,
|
||||
borderRadius: 14,
|
||||
marginTop: 19,
|
||||
lineHeight: 0.8,
|
||||
},
|
||||
};
|
||||
|
||||
export class MethodBlock extends React.Component<MethodBlockProps, MethodBlockState> {
|
||||
constructor(props: MethodBlockProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
shouldShowAnchor: false,
|
||||
};
|
||||
}
|
||||
public render() {
|
||||
const method = this.props.method;
|
||||
if (typeDocUtils.isPrivateOrProtectedProperty(method.name)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
id={method.name}
|
||||
style={{overflow: 'hidden', width: '100%'}}
|
||||
className="pb4"
|
||||
onMouseOver={this.setAnchorVisibility.bind(this, true)}
|
||||
onMouseOut={this.setAnchorVisibility.bind(this, false)}
|
||||
>
|
||||
{!method.isConstructor &&
|
||||
<div className="flex">
|
||||
{(method as TypescriptMethod).isStatic &&
|
||||
this.renderChip('Static')
|
||||
}
|
||||
{(method as SolidityMethod).isConstant &&
|
||||
this.renderChip('Constant')
|
||||
}
|
||||
{(method as SolidityMethod).isPayable &&
|
||||
this.renderChip('Payable')
|
||||
}
|
||||
<AnchorTitle
|
||||
headerSize={HeaderSizes.H3}
|
||||
title={method.name}
|
||||
id={method.name}
|
||||
shouldShowAnchor={this.state.shouldShowAnchor}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
<code className="hljs">
|
||||
<MethodSignature
|
||||
method={method}
|
||||
typeDefinitionByName={this.props.typeDefinitionByName}
|
||||
/>
|
||||
</code>
|
||||
{(method as TypescriptMethod).source &&
|
||||
<SourceLink
|
||||
version={this.props.libraryVersion}
|
||||
source={(method as TypescriptMethod).source}
|
||||
/>
|
||||
}
|
||||
{method.comment &&
|
||||
<Comment
|
||||
comment={method.comment}
|
||||
className="py2"
|
||||
/>
|
||||
}
|
||||
{method.parameters && !_.isEmpty(method.parameters) &&
|
||||
<div>
|
||||
<h4
|
||||
className="pb1 thin"
|
||||
style={{borderBottom: '1px solid #e1e8ed'}}
|
||||
>
|
||||
ARGUMENTS
|
||||
</h4>
|
||||
{this.renderParameterDescriptions(method.parameters)}
|
||||
</div>
|
||||
}
|
||||
{method.returnComment &&
|
||||
<div className="pt1 comment">
|
||||
<h4
|
||||
className="pb1 thin"
|
||||
style={{borderBottom: '1px solid #e1e8ed'}}
|
||||
>
|
||||
RETURNS
|
||||
</h4>
|
||||
<Comment
|
||||
comment={method.returnComment}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
private renderChip(text: string) {
|
||||
return (
|
||||
<div
|
||||
className="p1 mr1"
|
||||
style={styles.chip}
|
||||
>
|
||||
{text}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
private renderParameterDescriptions(parameters: Parameter[]) {
|
||||
const descriptions = _.map(parameters, parameter => {
|
||||
const isOptional = parameter.isOptional;
|
||||
return (
|
||||
<div
|
||||
key={`param-description-${parameter.name}`}
|
||||
className="flex pb1 mb2"
|
||||
style={{borderBottom: '1px solid #f0f4f7'}}
|
||||
>
|
||||
<div className="col lg-col-1 md-col-1 sm-hide xs-hide" />
|
||||
<div className="col lg-col-3 md-col-3 sm-col-12 col-12">
|
||||
<div className="bold">
|
||||
{parameter.name}
|
||||
</div>
|
||||
<div className="pt1" style={{color: colors.grey500, fontSize: 14}}>
|
||||
{isOptional && 'optional'}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col lg-col-8 md-col-8 sm-col-12 col-12">
|
||||
{parameter.comment &&
|
||||
<Comment
|
||||
comment={parameter.comment}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
return descriptions;
|
||||
}
|
||||
private setAnchorVisibility(shouldShowAnchor: boolean) {
|
||||
this.setState({
|
||||
shouldShowAnchor,
|
||||
});
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user