From 0b1ba9f9971bea9003dfb30fca535c17ce62ad08 Mon Sep 17 00:00:00 2001
From: Fabio Berger <me@fabioberger.com>
Date: Tue, 6 Mar 2018 16:31:55 +0100
Subject: Move Documentation to the `@0xproject/react-docs` package

---
 .../react-docs/src/ts/components/method_block.tsx  | 149 +++++++++++++++++++++
 1 file changed, 149 insertions(+)
 create mode 100644 packages/react-docs/src/ts/components/method_block.tsx

(limited to 'packages/react-docs/src/ts/components/method_block.tsx')

diff --git a/packages/react-docs/src/ts/components/method_block.tsx b/packages/react-docs/src/ts/components/method_block.tsx
new file mode 100644
index 000000000..5ed7f42a1
--- /dev/null
+++ b/packages/react-docs/src/ts/components/method_block.tsx
@@ -0,0 +1,149 @@
+import { AnchorTitle, colors, HeaderSizes, Styles } from '@0xproject/react-shared';
+import * as _ from 'lodash';
+import * as React from 'react';
+
+import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptMethod } from '../types';
+import { typeDocUtils } from '../utils/typedoc_utils';
+
+import { Comment } from './comment';
+import { DocsInfo } from './docs_info';
+import { MethodSignature } from './method_signature';
+import { SourceLink } from './source_link';
+
+export interface MethodBlockProps {
+    method: SolidityMethod | TypescriptMethod;
+    sectionName: string;
+    libraryVersion: string;
+    typeDefinitionByName: TypeDefinitionByName;
+    docsInfo: DocsInfo;
+    sourceUrl: string;
+}
+
+export interface MethodBlockState {
+    shouldShowAnchor: boolean;
+}
+
+const styles: Styles = {
+    chip: {
+        fontSize: 13,
+        backgroundColor: colors.lightBlueA700,
+        color: colors.white,
+        height: 11,
+        borderRadius: 14,
+        lineHeight: 0.9,
+    },
+};
+
+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={`${this.props.sectionName}-${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 pb2 pt2">
+                        {(method as TypescriptMethod).isStatic && this._renderChip('Static')}
+                        {(method as SolidityMethod).isConstant && this._renderChip('Constant')}
+                        {(method as SolidityMethod).isPayable && this._renderChip('Payable')}
+                        <div style={{ lineHeight: 1.3 }}>
+                            <AnchorTitle
+                                headerSize={HeaderSizes.H3}
+                                title={method.name}
+                                id={`${this.props.sectionName}-${method.name}`}
+                                shouldShowAnchor={this.state.shouldShowAnchor}
+                            />
+                        </div>
+                    </div>
+                )}
+                <code className="hljs">
+                    <MethodSignature
+                        method={method}
+                        sectionName={this.props.sectionName}
+                        typeDefinitionByName={this.props.typeDefinitionByName}
+                        docsInfo={this.props.docsInfo}
+                    />
+                </code>
+                {(method as TypescriptMethod).source && (
+                    <SourceLink
+                        version={this.props.libraryVersion}
+                        source={(method as TypescriptMethod).source}
+                        sourceUrl={this.props.sourceUrl}
+                    />
+                )}
+                {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="pl2 col lg-col-4 md-col-4 sm-col-12 col-12">
+                        <div
+                            className="bold"
+                            style={{ overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' }}
+                        >
+                            {parameter.name}
+                        </div>
+                        <div className="pt1" style={{ color: colors.grey, fontSize: 14 }}>
+                            {isOptional && 'optional'}
+                        </div>
+                    </div>
+                    <div className="col lg-col-8 md-col-8 sm-col-12 col-12" style={{ paddingLeft: 5 }}>
+                        {parameter.comment && <Comment comment={parameter.comment} />}
+                    </div>
+                </div>
+            );
+        });
+        return descriptions;
+    }
+    private _setAnchorVisibility(shouldShowAnchor: boolean) {
+        this.setState({
+            shouldShowAnchor,
+        });
+    }
+}
-- 
cgit v1.2.3


From 60d95475ebcfc868e54f90350fcca09e45b976ff Mon Sep 17 00:00:00 2001
From: Fabio Berger <me@fabioberger.com>
Date: Tue, 6 Mar 2018 16:45:25 +0100
Subject: Move DocsInfo out of the components folder

---
 packages/react-docs/src/ts/components/method_block.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/react-docs/src/ts/components/method_block.tsx')

diff --git a/packages/react-docs/src/ts/components/method_block.tsx b/packages/react-docs/src/ts/components/method_block.tsx
index 5ed7f42a1..529b9f9c7 100644
--- a/packages/react-docs/src/ts/components/method_block.tsx
+++ b/packages/react-docs/src/ts/components/method_block.tsx
@@ -6,7 +6,7 @@ import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptMethod } fro
 import { typeDocUtils } from '../utils/typedoc_utils';
 
 import { Comment } from './comment';
-import { DocsInfo } from './docs_info';
+import { DocsInfo } from '../docs_info';
 import { MethodSignature } from './method_signature';
 import { SourceLink } from './source_link';
 
-- 
cgit v1.2.3


From e88eba18772015b07c9ae305260c12f1cdf69e8c Mon Sep 17 00:00:00 2001
From: Fabio Berger <me@fabioberger.com>
Date: Tue, 6 Mar 2018 20:55:57 +0100
Subject: Fix tslint errors

---
 packages/react-docs/src/ts/components/method_block.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/react-docs/src/ts/components/method_block.tsx')

diff --git a/packages/react-docs/src/ts/components/method_block.tsx b/packages/react-docs/src/ts/components/method_block.tsx
index 529b9f9c7..029662b3f 100644
--- a/packages/react-docs/src/ts/components/method_block.tsx
+++ b/packages/react-docs/src/ts/components/method_block.tsx
@@ -2,11 +2,11 @@ import { AnchorTitle, colors, HeaderSizes, Styles } from '@0xproject/react-share
 import * as _ from 'lodash';
 import * as React from 'react';
 
+import { DocsInfo } from '../docs_info';
 import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptMethod } from '../types';
 import { typeDocUtils } from '../utils/typedoc_utils';
 
 import { Comment } from './comment';
-import { DocsInfo } from '../docs_info';
 import { MethodSignature } from './method_signature';
 import { SourceLink } from './source_link';
 
-- 
cgit v1.2.3


From 238f3c89a7cfc3c8d6941aac4e108c13f84c6647 Mon Sep 17 00:00:00 2001
From: Fabio Berger <me@fabioberger.com>
Date: Wed, 7 Mar 2018 15:32:37 +0100
Subject: Make sure we apply the appropriate syntax highlighting depending on
 the language of the docs

---
 packages/react-docs/src/ts/components/method_block.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'packages/react-docs/src/ts/components/method_block.tsx')

diff --git a/packages/react-docs/src/ts/components/method_block.tsx b/packages/react-docs/src/ts/components/method_block.tsx
index 029662b3f..44a1db8af 100644
--- a/packages/react-docs/src/ts/components/method_block.tsx
+++ b/packages/react-docs/src/ts/components/method_block.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 
 import { DocsInfo } from '../docs_info';
 import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptMethod } from '../types';
+import { constants } from '../utils/constants';
 import { typeDocUtils } from '../utils/typedoc_utils';
 
 import { Comment } from './comment';
@@ -70,7 +71,7 @@ export class MethodBlock extends React.Component<MethodBlockProps, MethodBlockSt
                         </div>
                     </div>
                 )}
-                <code className="hljs">
+                <code className={`hljs ${constants.TYPE_TO_SYNTAX[this.props.docsInfo.type]}`}>
                     <MethodSignature
                         method={method}
                         sectionName={this.props.sectionName}
-- 
cgit v1.2.3

