diff options
author | Brandon Millman <brandon.millman@gmail.com> | 2018-10-03 07:13:16 +0800 |
---|---|---|
committer | Brandon Millman <brandon.millman@gmail.com> | 2018-10-03 07:13:16 +0800 |
commit | 343b922ec11a6108caaf3095e59be0e56d45ee4a (patch) | |
tree | ad38a124853c4cd153f5a290a0dc461447f8c799 /packages/react-docs/src/components | |
parent | 6deb027bdf4e57f8918fd2413f0fdc55311508d3 (diff) | |
parent | f1ecb8c5cb28a0a7ca6f7ad2ff11194091df62a4 (diff) | |
download | dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar.gz dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar.bz2 dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar.lz dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar.xz dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.tar.zst dexon-sol-tools-343b922ec11a6108caaf3095e59be0e56d45ee4a.zip |
Merge branch 'development' into feature/asset-buyer/improve-asset-buyer-manager
* development: (178 commits)
Change cache key back to repo from repo-built
Change the lint command back
Merge build & install
Remove deps cache all together
Cache all nested node_modules directories
Explicitly specify yarn cache folder
Ignore linter issues
Fix linter issue
Separate deps and built caches
Build tslint rules before running linter
Cache yarn cache directory without node modules
Run linter before prettier as it fails more often
Add yarn cache path
Split CI install and build steps
Move bundle-size out of static tests and don't wait for a build with static tests
Introduce a build:ci command that doesn't build webpack bundles
Measure only one bundle size as they're the same
Fix linter errors
Fix no_website CI builds
Check bundle size on CI
...
Diffstat (limited to 'packages/react-docs/src/components')
10 files changed, 78 insertions, 53 deletions
diff --git a/packages/react-docs/src/components/custom_enum.tsx b/packages/react-docs/src/components/custom_enum.tsx index c4252d9e2..fa7c43146 100644 --- a/packages/react-docs/src/components/custom_enum.tsx +++ b/packages/react-docs/src/components/custom_enum.tsx @@ -2,7 +2,7 @@ import { logUtils } from '@0xproject/utils'; import * as _ from 'lodash'; import * as React from 'react'; -import { CustomType } from '../types'; +import { CustomType } from '@0xproject/types'; const STRING_ENUM_CODE_PREFIX = ' strEnum('; diff --git a/packages/react-docs/src/components/documentation.tsx b/packages/react-docs/src/components/documentation.tsx index 9d9b5141a..a23111297 100644 --- a/packages/react-docs/src/components/documentation.tsx +++ b/packages/react-docs/src/components/documentation.tsx @@ -9,24 +9,23 @@ import { Styles, utils as sharedUtils, } from '@0xproject/react-shared'; -import * as _ from 'lodash'; -import CircularProgress from 'material-ui/CircularProgress'; -import * as React from 'react'; -import * as semver from 'semver'; - -import { DocsInfo } from '../docs_info'; import { - AddressByContractName, DocAgnosticFormat, Event, ExternalExportToLink, Property, SolidityMethod, - SupportedDocJson, TypeDefinitionByName, TypescriptFunction, TypescriptMethod, -} from '../types'; +} from '@0xproject/types'; +import * as _ from 'lodash'; +import CircularProgress from 'material-ui/CircularProgress'; +import * as React from 'react'; +import * as semver from 'semver'; + +import { DocsInfo } from '../docs_info'; +import { AddressByContractName, SupportedDocJson } from '../types'; import { constants } from '../utils/constants'; import { Badge } from './badge'; @@ -219,11 +218,11 @@ export class Documentation extends React.Component<DocumentationProps, Documenta _.isEmpty(docSection.events); const sortedTypes = _.sortBy(docSection.types, 'name'); - const typeDefs = _.map(sortedTypes, customType => { + const typeDefs = _.map(sortedTypes, (customType, i) => { return ( <TypeDefinition sectionName={sectionName} - key={`type-${customType.name}`} + key={`type-${customType.name}-${i}`} customType={customType} docsInfo={this.props.docsInfo} typeDefinitionByName={typeDefinitionByName} @@ -330,7 +329,7 @@ export class Documentation extends React.Component<DocumentationProps, Documenta return <div>{externalExports}</div>; } private _renderNetworkBadgesIfExists(sectionName: string): React.ReactNode { - if (this.props.docsInfo.type !== SupportedDocJson.Doxity) { + if (this.props.docsInfo.type !== SupportedDocJson.SolDoc) { return null; } @@ -354,7 +353,7 @@ export class Documentation extends React.Component<DocumentationProps, Documenta key={`badge-${networkName}-${sectionName}`} href={linkIfExists} target="_blank" - style={{ color: colors.white, textDecoration: 'none' }} + style={{ color: colors.white, textDecoration: 'none', marginTop: 8 }} > <Badge title={networkName} backgroundColor={networkNameToColor[networkName]} /> </a> diff --git a/packages/react-docs/src/components/event_definition.tsx b/packages/react-docs/src/components/event_definition.tsx index 6cb80c6b0..37236275b 100644 --- a/packages/react-docs/src/components/event_definition.tsx +++ b/packages/react-docs/src/components/event_definition.tsx @@ -1,9 +1,9 @@ import { AnchorTitle, colors, HeaderSizes } from '@0xproject/react-shared'; +import { Event, EventArg } from '@0xproject/types'; import * as _ from 'lodash'; import * as React from 'react'; import { DocsInfo } from '../docs_info'; -import { Event, EventArg } from '../types'; import { Type } from './type'; diff --git a/packages/react-docs/src/components/interface.tsx b/packages/react-docs/src/components/interface.tsx index 93b10e96d..cad7d6c46 100644 --- a/packages/react-docs/src/components/interface.tsx +++ b/packages/react-docs/src/components/interface.tsx @@ -1,8 +1,9 @@ import * as _ from 'lodash'; import * as React from 'react'; +import { CustomType, TypeDefinitionByName } from '@0xproject/types'; + import { DocsInfo } from '../docs_info'; -import { CustomType, TypeDefinitionByName } from '../types'; import { Signature } from './signature'; import { Type } from './type'; @@ -19,9 +20,9 @@ export interface InterfaceProps { export const Interface: React.SFC<InterfaceProps> = (props: InterfaceProps): any => { const type = props.type; - const properties = _.map(type.children, property => { + const properties = _.map(type.children, (property, i) => { return ( - <span key={`property-${property.name}-${property.type}-${type.name}`}> + <span key={`property-${property.name}-${property.type}-${type.name}-${i}`}> {property.name}:{' '} {property.type && !_.isUndefined(property.type.method) ? ( <Signature diff --git a/packages/react-docs/src/components/property_block.tsx b/packages/react-docs/src/components/property_block.tsx index f181e21d2..8434e8682 100644 --- a/packages/react-docs/src/components/property_block.tsx +++ b/packages/react-docs/src/components/property_block.tsx @@ -1,8 +1,8 @@ import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared'; +import { Property, TypeDefinitionByName } from '@0xproject/types'; import * as React from 'react'; import { DocsInfo } from '../docs_info'; -import { Property, TypeDefinitionByName } from '../types'; import { constants } from '../utils/constants'; import { Comment } from './comment'; diff --git a/packages/react-docs/src/components/signature.tsx b/packages/react-docs/src/components/signature.tsx index bf9c8be24..1f3dd0ee8 100644 --- a/packages/react-docs/src/components/signature.tsx +++ b/packages/react-docs/src/components/signature.tsx @@ -1,8 +1,9 @@ import * as _ from 'lodash'; import * as React from 'react'; +import { Parameter, Type as TypeDef, TypeDefinitionByName, TypeParameter } from '@0xproject/types'; + import { DocsInfo } from '../docs_info'; -import { Parameter, Type as TypeDef, TypeDefinitionByName, TypeParameter } from '../types'; import { Type } from './type'; @@ -18,12 +19,14 @@ export interface SignatureProps { callPath?: string; docsInfo: DocsInfo; isInPopover: boolean; + isFallback?: boolean; } const defaultProps = { shouldHideMethodName: false, shouldUseArrowSyntax: false, callPath: '', + isFallback: false, }; export const Signature: React.SFC<SignatureProps> = (props: SignatureProps) => { @@ -33,6 +36,7 @@ export const Signature: React.SFC<SignatureProps> = (props: SignatureProps) => { props.docsInfo, sectionName, props.isInPopover, + props.name, props.typeDefinitionByName, ); const paramStringArray: any[] = []; @@ -74,7 +78,7 @@ export const Signature: React.SFC<SignatureProps> = (props: SignatureProps) => { return ( <span style={{ fontSize: 15 }}> {props.callPath} - {methodName} + {props.isFallback ? '' : methodName} {typeParameterIfExists}({hasMoreThenTwoParams && <br />} {paramStringArray}) {props.returnType && ( @@ -100,9 +104,10 @@ function renderParameters( docsInfo: DocsInfo, sectionName: string, isInPopover: boolean, + name: string, typeDefinitionByName?: TypeDefinitionByName, ): React.ReactNode[] { - const params = _.map(parameters, (p: Parameter) => { + const params = _.map(parameters, (p: Parameter, i: number) => { const isOptional = p.isOptional; const hasDefaultValue = !_.isUndefined(p.defaultValue); const type = ( @@ -115,9 +120,14 @@ function renderParameters( /> ); return ( - <span key={`param-${p.type}-${p.name}`}> - {p.name} - {isOptional && '?'}: {type} + <span key={`param-${JSON.stringify(p.type)}-${name}-${i}`}> + {!_.isEmpty(p.name) && ( + <span> + {p.name} + {isOptional && '?'}:{' '} + </span> + )} + {type} {hasDefaultValue && ` = ${p.defaultValue}`} </span> ); @@ -134,14 +144,19 @@ function renderTypeParameter( ): React.ReactNode { const typeParam = ( <span> - {`<${typeParameter.name} extends `} - <Type - type={typeParameter.type} - sectionName={sectionName} - typeDefinitionByName={typeDefinitionByName} - docsInfo={docsInfo} - isInPopover={isInPopover} - /> + {`<${typeParameter.name}`} + {!_.isUndefined(typeParameter.type) && ( + <span> + {' extends '} + <Type + type={typeParameter.type} + sectionName={sectionName} + typeDefinitionByName={typeDefinitionByName} + docsInfo={docsInfo} + isInPopover={isInPopover} + /> + </span> + )} {`>`} </span> ); diff --git a/packages/react-docs/src/components/signature_block.tsx b/packages/react-docs/src/components/signature_block.tsx index 05145dc23..5ec82983a 100644 --- a/packages/react-docs/src/components/signature_block.tsx +++ b/packages/react-docs/src/components/signature_block.tsx @@ -1,9 +1,15 @@ import { AnchorTitle, colors, HeaderSizes, Styles } from '@0xproject/react-shared'; +import { + Parameter, + SolidityMethod, + TypeDefinitionByName, + TypescriptFunction, + TypescriptMethod, +} from '@0xproject/types'; import * as _ from 'lodash'; import * as React from 'react'; import { DocsInfo } from '../docs_info'; -import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptFunction, TypescriptMethod } from '../types'; import { constants } from '../utils/constants'; import { Comment } from './comment'; @@ -26,7 +32,6 @@ export interface SignatureBlockState { const styles: Styles = { chip: { fontSize: 13, - backgroundColor: colors.lightBlueA700, color: colors.white, height: 11, borderRadius: 14, @@ -44,6 +49,8 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu public render(): React.ReactNode { const method = this.props.method; + const isFallback = (method as SolidityMethod).isFallback; + const hasExclusivelyNamedParams = !_.isUndefined(_.find(method.parameters, p => !_.isEmpty(p.name))); return ( <div id={`${this.props.sectionName}-${method.name}`} @@ -57,10 +64,11 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu {(method as TypescriptMethod).isStatic && this._renderChip('Static')} {(method as SolidityMethod).isConstant && this._renderChip('Constant')} {(method as SolidityMethod).isPayable && this._renderChip('Payable')} + {isFallback && this._renderChip('Fallback', colors.lightGreenA700)} <div style={{ lineHeight: 1.3 }}> <AnchorTitle headerSize={HeaderSizes.H3} - title={method.name} + title={isFallback ? '' : method.name} id={`${this.props.sectionName}-${method.name}`} shouldShowAnchor={this.state.shouldShowAnchor} /> @@ -78,6 +86,7 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu typeDefinitionByName={this.props.typeDefinitionByName} docsInfo={this.props.docsInfo} isInPopover={false} + isFallback={isFallback} /> </code> {(method as TypescriptMethod).source && ( @@ -89,12 +98,13 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu )} {method.comment && <Comment comment={method.comment} className="py2" />} {method.parameters && - !_.isEmpty(method.parameters) && ( + !_.isEmpty(method.parameters) && + hasExclusivelyNamedParams && ( <div> <h4 className="pb1 thin" style={{ borderBottom: '1px solid #e1e8ed' }}> ARGUMENTS </h4> - {this._renderParameterDescriptions(method.parameters)} + {this._renderParameterDescriptions(method.parameters, method.name)} </div> )} {method.returnComment && ( @@ -108,19 +118,19 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu </div> ); } - private _renderChip(text: string): React.ReactNode { + private _renderChip(text: string, backgroundColor: string = colors.lightBlueA700): React.ReactNode { return ( - <div className="p1 mr1" style={styles.chip}> + <div className="p1 mr1" style={{ ...styles.chip, backgroundColor }}> {text} </div> ); } - private _renderParameterDescriptions(parameters: Parameter[]): React.ReactNode { - const descriptions = _.map(parameters, parameter => { + private _renderParameterDescriptions(parameters: Parameter[], name: string): React.ReactNode { + const descriptions = _.map(parameters, (parameter: Parameter, i: number) => { const isOptional = parameter.isOptional; return ( <div - key={`param-description-${parameter.name}`} + key={`param-description-${parameter.name}-${name}-${i}`} className="flex pb1 mb2" style={{ borderBottom: '1px solid #f0f4f7' }} > diff --git a/packages/react-docs/src/components/source_link.tsx b/packages/react-docs/src/components/source_link.tsx index c60435ea6..3096ad8d5 100644 --- a/packages/react-docs/src/components/source_link.tsx +++ b/packages/react-docs/src/components/source_link.tsx @@ -1,8 +1,7 @@ import { colors } from '@0xproject/react-shared'; +import { Source } from '@0xproject/types'; import * as React from 'react'; -import { Source } from '../types'; - export interface SourceLinkProps { source: Source; sourceUrl: string; diff --git a/packages/react-docs/src/components/type.tsx b/packages/react-docs/src/components/type.tsx index 5f7601ce1..5c018f5dd 100644 --- a/packages/react-docs/src/components/type.tsx +++ b/packages/react-docs/src/components/type.tsx @@ -1,4 +1,5 @@ import { colors, constants as sharedConstants, utils as sharedUtils } from '@0xproject/react-shared'; +import { Type as TypeDef, TypeDefinitionByName, TypeDocTypes } from '@0xproject/types'; import { errorUtils } from '@0xproject/utils'; import * as _ from 'lodash'; import * as React from 'react'; @@ -6,13 +7,12 @@ import { Link as ScrollLink } from 'react-scroll'; import * as ReactTooltip from 'react-tooltip'; import { DocsInfo } from '../docs_info'; -import { Type as TypeDef, TypeDefinitionByName, TypeDocTypes } from '../types'; -import { constants } from '../utils/constants'; import { Signature } from './signature'; import { TypeDefinition } from './type_definition'; const basicJsTypes = ['string', 'number', 'undefined', 'null', 'boolean']; +const basicSolidityTypes = ['bytes', 'bytes4', 'bytes32', 'uint8', 'uint256', 'address']; const defaultProps = {}; @@ -80,7 +80,7 @@ export const Type: React.SFC<TypeProps> = (props: TypeProps): any => { case TypeDocTypes.Array: typeName = type.elementType.name; - if (_.includes(basicJsTypes, typeName)) { + if (_.includes(basicJsTypes, typeName) || _.includes(basicSolidityTypes, typeName)) { typeNameColor = colors.orange; } break; @@ -168,10 +168,10 @@ export const Type: React.SFC<TypeProps> = (props: TypeProps): any => { break; case TypeDocTypes.Tuple: - const tupleTypes = _.map(type.tupleElements, t => { + const tupleTypes = _.map(type.tupleElements, (t, i) => { return ( <Type - key={`type-tuple-${t.name}-${t.typeDocType}`} + key={`type-tuple-${t.name}-${t.typeDocType}-${i}`} type={t} sectionName={props.sectionName} typeDefinitionByName={props.typeDefinitionByName} @@ -221,7 +221,7 @@ export const Type: React.SFC<TypeProps> = (props: TypeProps): any => { const id = Math.random().toString(); const typeDefinitionAnchorId = isExportedClassReference ? props.type.name - : `${constants.TYPES_SECTION_NAME}-${typeName}`; + : `${props.docsInfo.typeSectionName}-${typeName}`; typeName = ( <ScrollLink to={typeDefinitionAnchorId} diff --git a/packages/react-docs/src/components/type_definition.tsx b/packages/react-docs/src/components/type_definition.tsx index 8d1f88490..9a3e50a1b 100644 --- a/packages/react-docs/src/components/type_definition.tsx +++ b/packages/react-docs/src/components/type_definition.tsx @@ -1,10 +1,11 @@ import { AnchorTitle, colors, HeaderSizes } from '@0xproject/react-shared'; +import { CustomType, CustomTypeChild, TypeDefinitionByName, TypeDocTypes } from '@0xproject/types'; import { errorUtils } from '@0xproject/utils'; import * as _ from 'lodash'; import * as React from 'react'; import { DocsInfo } from '../docs_info'; -import { CustomType, CustomTypeChild, KindString, TypeDefinitionByName, TypeDocTypes } from '../types'; +import { KindString, SupportedDocJson } from '../types'; import { constants } from '../utils/constants'; import { Comment } from './comment'; @@ -45,7 +46,7 @@ export class TypeDefinition extends React.Component<TypeDefinitionProps, TypeDef let codeSnippet: React.ReactNode; switch (customType.kindString) { case KindString.Interface: - typePrefix = 'Interface'; + typePrefix = this.props.docsInfo.type === SupportedDocJson.SolDoc ? 'Struct' : 'Interface'; codeSnippet = ( <Interface type={customType} |