diff options
18 files changed, 28 insertions, 125 deletions
diff --git a/packages/website/ts/components/inputs/hash_input.tsx b/packages/website/ts/components/inputs/hash_input.tsx index 5a3d34fe6..28305637d 100644 --- a/packages/website/ts/components/inputs/hash_input.tsx +++ b/packages/website/ts/components/inputs/hash_input.tsx @@ -1,10 +1,11 @@ import { Order, ZeroEx } from '0x.js'; +import { Styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import ReactTooltip = require('react-tooltip'); import { Blockchain } from 'ts/blockchain'; import { FakeTextField } from 'ts/components/ui/fake_text_field'; -import { HashData, Styles } from 'ts/types'; +import { HashData } from 'ts/types'; import { constants } from 'ts/utils/constants'; const styles: Styles = { diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index 894edf0a8..b569a9165 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -1,4 +1,5 @@ import { ZeroEx } from '0x.js'; +import { styles } from '@0xproject/react-shared'; import { BigNumber } from '@0xproject/utils'; import DharmaLoanFrame from 'dharma-loan-frame'; import * as _ from 'lodash'; @@ -29,7 +30,6 @@ import { EtherscanLinkSuffixes, Networks, ScreenWidths, - Styles, Token, TokenByAddress, TokenVisibility, diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index b2b2d2ebd..829225440 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -1,3 +1,4 @@ +import { styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import Drawer from 'material-ui/Drawer'; import Menu from 'material-ui/Menu'; @@ -14,7 +15,7 @@ import { Identicon } from 'ts/components/ui/identicon'; import { DocsInfo } from 'ts/pages/documentation/docs_info'; import { NestedSidebarMenu } from 'ts/pages/shared/nested_sidebar_menu'; import { Dispatcher } from 'ts/redux/dispatcher'; -import { Deco, DocsMenu, Key, MenuSubsectionsBySection, ProviderType, Styles, WebsitePaths } from 'ts/types'; +import { Deco, DocsMenu, Key, MenuSubsectionsBySection, ProviderType, WebsitePaths } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; import { Translate } from 'ts/utils/translate'; diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index 699bef7a8..ce5f7eb6c 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -1,3 +1,4 @@ +import { styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import CircularProgress from 'material-ui/CircularProgress'; import * as React from 'react'; @@ -23,7 +24,6 @@ import { Networks, Property, SolidityMethod, - Styles, SupportedDocJson, TypeDefinitionByName, TypescriptMethod, diff --git a/packages/website/ts/pages/documentation/event_definition.tsx b/packages/website/ts/pages/documentation/event_definition.tsx index e62c9ecbd..7ac17e608 100644 --- a/packages/website/ts/pages/documentation/event_definition.tsx +++ b/packages/website/ts/pages/documentation/event_definition.tsx @@ -1,9 +1,9 @@ +import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title'; import * as _ from 'lodash'; import * as React from 'react'; import { DocsInfo } from 'ts/pages/documentation/docs_info'; import { Type } from 'ts/pages/documentation/type'; -import { AnchorTitle } from 'ts/pages/shared/anchor_title'; -import { Event, EventArg, HeaderSizes } from 'ts/types'; +import { Event, EventArg } from 'ts/types'; import { colors } from 'ts/utils/colors'; interface EventDefinitionProps { diff --git a/packages/website/ts/pages/documentation/method_block.tsx b/packages/website/ts/pages/documentation/method_block.tsx index d2c96bf8c..e1f09346b 100644 --- a/packages/website/ts/pages/documentation/method_block.tsx +++ b/packages/website/ts/pages/documentation/method_block.tsx @@ -1,11 +1,11 @@ +import { AnchorTitle, HeaderSizes, Styles } from '@0xproject/react-shared/anchor_title'; import * as _ from 'lodash'; import * as React from 'react'; import { Comment } from 'ts/pages/documentation/comment'; import { DocsInfo } from 'ts/pages/documentation/docs_info'; import { MethodSignature } from 'ts/pages/documentation/method_signature'; import { SourceLink } from 'ts/pages/documentation/source_link'; -import { AnchorTitle } from 'ts/pages/shared/anchor_title'; -import { HeaderSizes, Parameter, SolidityMethod, Styles, TypeDefinitionByName, TypescriptMethod } from 'ts/types'; +import { Parameter, SolidityMethod, TypeDefinitionByName, TypescriptMethod } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { typeDocUtils } from 'ts/utils/typedoc_utils'; diff --git a/packages/website/ts/pages/documentation/type.tsx b/packages/website/ts/pages/documentation/type.tsx index b306fa053..2fec4c95f 100644 --- a/packages/website/ts/pages/documentation/type.tsx +++ b/packages/website/ts/pages/documentation/type.tsx @@ -1,3 +1,4 @@ +import { constants as sharedConstants, utils as sharedUtils } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import { Link as ScrollLink } from 'react-scroll'; @@ -178,12 +179,12 @@ export function Type(props: TypeProps): any { <ScrollLink to={typeDefinitionAnchorId} offset={0} - duration={constants.DOCS_SCROLL_DURATION_MS} - containerId={constants.DOCS_CONTAINER_ID} + duration={sharedConstants.DOCS_SCROLL_DURATION_MS} + containerId={sharedConstants.DOCS_CONTAINER_ID} > {_.isUndefined(typeDefinition) || utils.isUserOnMobile() ? ( <span - onClick={utils.setUrlHash.bind(null, typeDefinitionAnchorId)} + onClick={sharedUtils.setUrlHash.bind(null, typeDefinitionAnchorId)} style={{ color: colors.lightBlueA700, cursor: 'pointer' }} > {typeName} @@ -192,7 +193,7 @@ export function Type(props: TypeProps): any { <span data-tip={true} data-for={id} - onClick={utils.setUrlHash.bind(null, typeDefinitionAnchorId)} + onClick={sharedUtils.setUrlHash.bind(null, typeDefinitionAnchorId)} style={{ color: colors.lightBlueA700, cursor: 'pointer', diff --git a/packages/website/ts/pages/documentation/type_definition.tsx b/packages/website/ts/pages/documentation/type_definition.tsx index 02bf63258..32c388ace 100644 --- a/packages/website/ts/pages/documentation/type_definition.tsx +++ b/packages/website/ts/pages/documentation/type_definition.tsx @@ -1,3 +1,4 @@ +import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title'; import * as _ from 'lodash'; import * as React from 'react'; import { Comment } from 'ts/pages/documentation/comment'; @@ -7,8 +8,7 @@ import { Enum } from 'ts/pages/documentation/enum'; import { Interface } from 'ts/pages/documentation/interface'; import { MethodSignature } from 'ts/pages/documentation/method_signature'; import { Type } from 'ts/pages/documentation/type'; -import { AnchorTitle } from 'ts/pages/shared/anchor_title'; -import { CustomType, CustomTypeChild, HeaderSizes, KindString, TypeDocTypes } from 'ts/types'; +import { CustomType, CustomTypeChild, KindString, TypeDocTypes } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/pages/faq/faq.tsx b/packages/website/ts/pages/faq/faq.tsx index 34175abdc..bcbc628f1 100644 --- a/packages/website/ts/pages/faq/faq.tsx +++ b/packages/website/ts/pages/faq/faq.tsx @@ -1,3 +1,4 @@ +import { styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import * as DocumentTitle from 'react-document-title'; @@ -5,7 +6,7 @@ import { Footer } from 'ts/components/footer'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { Question } from 'ts/pages/faq/question'; import { Dispatcher } from 'ts/redux/dispatcher'; -import { FAQQuestion, FAQSection, Styles, WebsitePaths } from 'ts/types'; +import { FAQQuestion, FAQSection, WebsitePaths } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; diff --git a/packages/website/ts/pages/shared/anchor_title.tsx b/packages/website/ts/pages/shared/anchor_title.tsx deleted file mode 100644 index 0270618a0..000000000 --- a/packages/website/ts/pages/shared/anchor_title.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import * as React from 'react'; -import { Link as ScrollLink } from 'react-scroll'; -import { HeaderSizes, Styles } from 'ts/types'; -import { constants } from 'ts/utils/constants'; -import { utils } from 'ts/utils/utils'; - -const headerSizeToScrollOffset: { [headerSize: string]: number } = { - h2: -20, - h3: 0, -}; - -interface AnchorTitleProps { - title: string | React.ReactNode; - id: string; - headerSize: HeaderSizes; - shouldShowAnchor: boolean; -} - -interface AnchorTitleState { - isHovering: boolean; -} - -const styles: Styles = { - anchor: { - fontSize: 20, - transform: 'rotate(45deg)', - cursor: 'pointer', - }, - headers: { - WebkitMarginStart: 0, - WebkitMarginEnd: 0, - fontWeight: 'bold', - display: 'block', - }, - h1: { - fontSize: '1.8em', - }, - h2: { - fontSize: '1.5em', - fontWeight: 400, - }, - h3: { - fontSize: '1.17em', - }, -}; - -export class AnchorTitle extends React.Component<AnchorTitleProps, AnchorTitleState> { - constructor(props: AnchorTitleProps) { - super(props); - this.state = { - isHovering: false, - }; - } - public render() { - let opacity = 0; - if (this.props.shouldShowAnchor) { - opacity = this.state.isHovering ? 0.6 : 1; - } - return ( - <div className="relative flex" style={{ ...styles[this.props.headerSize], ...styles.headers }}> - <div className="inline-block" style={{ paddingRight: 4 }}> - {this.props.title} - </div> - <ScrollLink - to={this.props.id} - offset={headerSizeToScrollOffset[this.props.headerSize]} - duration={constants.DOCS_SCROLL_DURATION_MS} - containerId={constants.DOCS_CONTAINER_ID} - > - <i - className="zmdi zmdi-link" - onClick={utils.setUrlHash.bind(utils, this.props.id)} - style={{ ...styles.anchor, opacity }} - onMouseOver={this._setHoverState.bind(this, true)} - onMouseOut={this._setHoverState.bind(this, false)} - /> - </ScrollLink> - </div> - ); - } - private _setHoverState(isHovering: boolean) { - this.setState({ - isHovering, - }); - } -} diff --git a/packages/website/ts/pages/shared/markdown_link_block.tsx b/packages/website/ts/pages/shared/markdown_link_block.tsx index e4553c87f..b1f68c915 100644 --- a/packages/website/ts/pages/shared/markdown_link_block.tsx +++ b/packages/website/ts/pages/shared/markdown_link_block.tsx @@ -1,3 +1,4 @@ +import { utils as sharedUtils } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import { configs } from 'ts/utils/configs'; @@ -41,6 +42,6 @@ export class MarkdownLinkBlock extends React.Component<MarkdownLinkBlockProps, M private _onHashUrlClick(href: string) { const hash = href.split('#')[1]; utils.scrollToHash(hash, configs.SCROLL_CONTAINER_ID); - utils.setUrlHash(hash); + sharedUtils.setUrlHash(hash); } } diff --git a/packages/website/ts/pages/shared/markdown_section.tsx b/packages/website/ts/pages/shared/markdown_section.tsx index 7253072d9..18cbf70c0 100644 --- a/packages/website/ts/pages/shared/markdown_section.tsx +++ b/packages/website/ts/pages/shared/markdown_section.tsx @@ -1,12 +1,11 @@ +import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title'; import * as _ from 'lodash'; import RaisedButton from 'material-ui/RaisedButton'; import * as React from 'react'; import * as ReactMarkdown from 'react-markdown'; import { Element as ScrollElement } from 'react-scroll'; -import { AnchorTitle } from 'ts/pages/shared/anchor_title'; import { MarkdownCodeBlock } from 'ts/pages/shared/markdown_code_block'; import { MarkdownLinkBlock } from 'ts/pages/shared/markdown_link_block'; -import { HeaderSizes } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx index 82a40eb7e..abbd34c98 100644 --- a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx +++ b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx @@ -1,11 +1,11 @@ +import { constants, Styles, utils as sharedUtils } from '@0xproject/react-shared'; import * as _ from 'lodash'; import MenuItem from 'material-ui/MenuItem'; import * as React from 'react'; import { Link as ScrollLink } from 'react-scroll'; import { VersionDropDown } from 'ts/pages/shared/version_drop_down'; -import { MenuSubsectionsBySection, Styles } from 'ts/types'; +import { MenuSubsectionsBySection } from 'ts/types'; import { colors } from 'ts/utils/colors'; -import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; interface NestedSidebarMenuProps { @@ -171,7 +171,7 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N } private _onMenuItemClick(name: string): void { const id = utils.getIdFromName(name); - utils.setUrlHash(id); + sharedUtils.setUrlHash(id); this.props.onMenuItemClick(); } } diff --git a/packages/website/ts/pages/shared/section_header.tsx b/packages/website/ts/pages/shared/section_header.tsx index 52a1f30d9..758aec574 100644 --- a/packages/website/ts/pages/shared/section_header.tsx +++ b/packages/website/ts/pages/shared/section_header.tsx @@ -1,7 +1,6 @@ +import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title'; import * as React from 'react'; import { Element as ScrollElement } from 'react-scroll'; -import { AnchorTitle } from 'ts/pages/shared/anchor_title'; -import { HeaderSizes } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/pages/wiki/wiki.tsx b/packages/website/ts/pages/wiki/wiki.tsx index 4bb6052a2..d65834a9a 100644 --- a/packages/website/ts/pages/wiki/wiki.tsx +++ b/packages/website/ts/pages/wiki/wiki.tsx @@ -1,3 +1,4 @@ +import { HeaderSizes, styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import CircularProgress from 'material-ui/CircularProgress'; import RaisedButton from 'material-ui/RaisedButton'; @@ -9,7 +10,7 @@ import { MarkdownSection } from 'ts/pages/shared/markdown_section'; import { NestedSidebarMenu } from 'ts/pages/shared/nested_sidebar_menu'; import { SectionHeader } from 'ts/pages/shared/section_header'; import { Dispatcher } from 'ts/redux/dispatcher'; -import { Article, ArticlesBySection, HeaderSizes, Styles, WebsitePaths } from 'ts/types'; +import { Article, ArticlesBySection, WebsitePaths } from 'ts/types'; import { colors } from 'ts/utils/colors'; import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 28663270e..c1b23ce1e 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -156,10 +156,6 @@ export interface TrackedTokensByUserAddress { [userAddress: string]: TrackedTokensByNetworkId; } -export interface Styles { - [name: string]: React.CSSProperties; -} - export interface ProfileInfo { name: string; title?: string; @@ -535,12 +531,6 @@ export enum TokenVisibility { TRACKED = 'TRACKED', } -export enum HeaderSizes { - H1 = 'h1', - H2 = 'h2', - H3 = 'h3', -} - export interface DoxityDocObj { [contractName: string]: DoxityContractObj; } diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index 3476b7375..1f87fe189 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -4,8 +4,6 @@ import { Networks } from 'ts/types'; export const constants = { DECIMAL_PLACES_ETH: 18, DECIMAL_PLACES_ZRX: 18, - DOCS_SCROLL_DURATION_MS: 0, - DOCS_CONTAINER_ID: 'documentation', GENESIS_ORDER_BLOCK_BY_NETWORK_ID: { 1: 4145578, 42: 3117574, diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index a1e045af7..a1e11c85a 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -152,9 +152,6 @@ export const utils = { const etherScanPrefix = networkName === Networks.Mainnet ? '' : `${networkName.toLowerCase()}.`; return `https://${etherScanPrefix}etherscan.io/${suffix}/${addressOrTxHash}`; }, - setUrlHash(anchorId: string) { - window.location.hash = anchorId; - }, async isU2FSupportedAsync(): Promise<boolean> { const w = window as any; return new Promise((resolve: (isSupported: boolean) => void) => { |