From 794b155827868d67f1cec45bbe8c3a3e4be02597 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Sun, 18 Mar 2018 18:44:52 +0100 Subject: Add support for displaying exported functions --- packages/react-docs/src/components/signature.tsx | 131 +++++++++++++++++++++++ 1 file changed, 131 insertions(+) create mode 100644 packages/react-docs/src/components/signature.tsx (limited to 'packages/react-docs/src/components/signature.tsx') diff --git a/packages/react-docs/src/components/signature.tsx b/packages/react-docs/src/components/signature.tsx new file mode 100644 index 000000000..83fb1e246 --- /dev/null +++ b/packages/react-docs/src/components/signature.tsx @@ -0,0 +1,131 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import * as ReactDOM from 'react-dom'; + +import { DocsInfo } from '../docs_info'; +import { Parameter, Type as TypeDef, TypeDefinitionByName, TypeParameter } from '../types'; +import { constants } from '../utils/constants'; + +import { Type } from './type'; + +export interface SignatureProps { + name: string; + returnType: TypeDef; + parameters: Parameter[]; + sectionName: string; + shouldHideMethodName?: boolean; + shouldUseArrowSyntax?: boolean; + typeDefinitionByName?: TypeDefinitionByName; + typeParameter?: TypeParameter; + callPath?: string; + docsInfo: DocsInfo; +} + +const defaultProps = { + shouldHideMethodName: false, + shouldUseArrowSyntax: false, + callPath: '', +}; + +export const Signature: React.SFC = (props: SignatureProps) => { + const sectionName = constants.TYPES_SECTION_NAME; + const parameters = renderParameters(props.parameters, props.docsInfo, sectionName, props.typeDefinitionByName); + const paramStringArray: any[] = []; + // HACK: For now we don't put params on newlines if there are less then 2 of them. + // Ideally we would check the character length of the resulting method signature and + // if it exceeds the available space, put params on their own lines. + const hasMoreThenTwoParams = parameters.length > 2; + _.each(parameters, (param: React.ReactNode, i: number) => { + const finalParam = hasMoreThenTwoParams ? ( + + {param} + + ) : ( + param + ); + paramStringArray.push(finalParam); + const comma = hasMoreThenTwoParams ? ( + + ,
+
+ ) : ( + ', ' + ); + paramStringArray.push(comma); + }); + if (!hasMoreThenTwoParams) { + paramStringArray.pop(); + } + const methodName = props.shouldHideMethodName ? '' : props.name; + const typeParameterIfExists = _.isUndefined(props.typeParameter) + ? undefined + : renderTypeParameter(props.typeParameter, props.docsInfo, sectionName, props.typeDefinitionByName); + return ( + + {props.callPath} + {methodName} + {typeParameterIfExists}({hasMoreThenTwoParams &&
} + {paramStringArray}) + {props.returnType && ( + + {props.shouldUseArrowSyntax ? ' => ' : ': '}{' '} + + + )} +
+ ); +}; + +Signature.defaultProps = defaultProps; + +function renderParameters( + parameters: Parameter[], + docsInfo: DocsInfo, + sectionName: string, + typeDefinitionByName?: TypeDefinitionByName, +) { + const params = _.map(parameters, (p: Parameter) => { + const isOptional = p.isOptional; + const type = ( + + ); + return ( + + {p.name} + {isOptional && '?'}: {type} + + ); + }); + return params; +} + +function renderTypeParameter( + typeParameter: TypeParameter, + docsInfo: DocsInfo, + sectionName: string, + typeDefinitionByName?: TypeDefinitionByName, +) { + const typeParam = ( + + {`<${typeParameter.name} extends `} + + {`>`} + + ); + return typeParam; +} -- cgit v1.2.3