From 7ae38906926dc09bc10670c361af0d2bf0050426 Mon Sep 17 00:00:00 2001 From: Hsuan Lee Date: Sat, 19 Jan 2019 18:42:04 +0800 Subject: Update dependency packages --- .../react-shared/src/components/anchor_title.tsx | 74 ---------- packages/react-shared/src/components/link.tsx | 150 --------------------- .../src/components/markdown_code_block.tsx | 24 ---- .../src/components/markdown_link_block.tsx | 47 ------- .../src/components/markdown_paragraph_block.tsx | 10 -- .../src/components/markdown_section.tsx | 106 --------------- .../react-shared/src/components/section_header.tsx | 73 ---------- packages/react-shared/src/globals.d.ts | 6 - packages/react-shared/src/index.ts | 12 -- packages/react-shared/src/types.ts | 33 ----- packages/react-shared/src/utils/colors.ts | 59 -------- packages/react-shared/src/utils/constants.ts | 19 --- packages/react-shared/src/utils/utils.ts | 52 ------- 13 files changed, 665 deletions(-) delete mode 100644 packages/react-shared/src/components/anchor_title.tsx delete mode 100644 packages/react-shared/src/components/link.tsx delete mode 100644 packages/react-shared/src/components/markdown_code_block.tsx delete mode 100644 packages/react-shared/src/components/markdown_link_block.tsx delete mode 100644 packages/react-shared/src/components/markdown_paragraph_block.tsx delete mode 100644 packages/react-shared/src/components/markdown_section.tsx delete mode 100644 packages/react-shared/src/components/section_header.tsx delete mode 100644 packages/react-shared/src/globals.d.ts delete mode 100644 packages/react-shared/src/index.ts delete mode 100644 packages/react-shared/src/types.ts delete mode 100644 packages/react-shared/src/utils/colors.ts delete mode 100644 packages/react-shared/src/utils/constants.ts delete mode 100644 packages/react-shared/src/utils/utils.ts (limited to 'packages/react-shared/src') diff --git a/packages/react-shared/src/components/anchor_title.tsx b/packages/react-shared/src/components/anchor_title.tsx deleted file mode 100644 index fccd56de7..000000000 --- a/packages/react-shared/src/components/anchor_title.tsx +++ /dev/null @@ -1,74 +0,0 @@ -import * as React from 'react'; -import styled from 'styled-components'; - -import { Link } from '../components/link'; -import { HeaderSizes, Styles } from '../types'; -import { colors } from '../utils/colors'; - -export interface AnchorTitleProps { - title: string | React.ReactNode; - id: string; - headerSize: HeaderSizes; - shouldShowAnchor: boolean; - isDisabled: boolean; -} - -export interface AnchorTitleState {} - -const styles: Styles = { - h1: { - fontSize: '1.875em', - }, - h2: { - fontSize: '1.5em', - fontWeight: 400, - }, - h3: { - fontSize: '1.17em', - }, -}; - -interface AnchorIconProps { - shouldShowAnchor: boolean; -} - -const AnchorIcon = styled.i` - opacity: ${props => (props.shouldShowAnchor ? 1 : 0)}; - &:hover { - opacity: ${props => (props.shouldShowAnchor ? 0.6 : 0)}; - } - font-size: 20px; - transform: rotate(45deg); - cursor: pointer; -`; - -export class AnchorTitle extends React.Component { - public static defaultProps: Partial = { - isDisabled: false, - }; - public render(): React.ReactNode { - return ( -
-
- {this.props.title} -
- {!this.props.isDisabled && ( - - - - )} -
- ); - } -} diff --git a/packages/react-shared/src/components/link.tsx b/packages/react-shared/src/components/link.tsx deleted file mode 100644 index 2fb19ac11..000000000 --- a/packages/react-shared/src/components/link.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; -import { NavLink as ReactRounterLink } from 'react-router-dom'; -import { Link as ScrollLink } from 'react-scroll'; -import * as validUrl from 'valid-url'; - -import { LinkType } from '../types'; -import { constants } from '../utils/constants'; - -export interface BaseLinkProps { - to: string; - shouldOpenInNewTab?: boolean; - className?: string; - onMouseOver?: (event: React.MouseEvent) => void; - onMouseLeave?: (event: React.MouseEvent) => void; - onMouseEnter?: (event: React.MouseEvent) => void; - textDecoration?: string; - fontColor?: string; -} - -export interface ScrollLinkProps extends BaseLinkProps { - onActivityChanged?: (isActive: boolean) => void; -} - -export interface ReactLinkProps extends BaseLinkProps { - activeStyle?: React.CSSProperties; -} - -export type LinkProps = ReactLinkProps & ScrollLinkProps; - -export interface LinkState {} - -/** - * A generic link component which let's the developer render internal, external and scroll-to-hash links, and - * their associated behaviors with a single link component. Many times we want a menu including a combination of - * internal, external and scroll links and the abstraction of the differences of rendering each types of link - * makes it much easier to do so. - */ -export class Link extends React.Component { - public static defaultProps: Partial = { - shouldOpenInNewTab: false, - className: '', - onMouseOver: _.noop.bind(_), - onMouseLeave: _.noop.bind(_), - onMouseEnter: _.noop.bind(_), - textDecoration: 'none', - fontColor: 'inherit', - }; - private _outerReactScrollSpan: HTMLSpanElement | null; - constructor(props: LinkProps) { - super(props); - this._outerReactScrollSpan = null; - } - public render(): React.ReactNode { - let type: LinkType; - const isReactRoute = _.startsWith(this.props.to, '/'); - const isExternal = validUrl.isWebUri(this.props.to) || _.startsWith(this.props.to, 'mailto:'); - if (isReactRoute) { - type = LinkType.ReactRoute; - } else if (isExternal) { - type = LinkType.External; - } else { - type = LinkType.ReactScroll; - } - - if (type === LinkType.ReactScroll && this.props.shouldOpenInNewTab) { - throw new Error(`Cannot open LinkType.ReactScroll links in new tab. link.to: ${this.props.to}`); - } - - const styleWithDefault = { - textDecoration: this.props.textDecoration, - cursor: 'pointer', - color: this.props.fontColor, - }; - - switch (type) { - case LinkType.External: - return ( - - {this.props.children} - - ); - case LinkType.ReactRoute: - return ( - - {this.props.children} - - ); - case LinkType.ReactScroll: - return ( - (this._outerReactScrollSpan = input)} - onMouseOver={this.props.onMouseOver} - onMouseEnter={this.props.onMouseEnter} - onMouseLeave={this.props.onMouseLeave} - > - - - {this.props.children} - - - - ); - default: - throw new Error(`Unrecognized LinkType: ${type}`); - } - } - private _onActivityChanged(isActive: boolean): void { - if (this.props.onActivityChanged) { - this.props.onActivityChanged(isActive); - } - } - // HACK(fabio): For some reason, the react-scroll link decided to stop the propagation of click events. - // We do however rely on these events being propagated in certain scenarios (e.g when the link - // is within a dropdown we want to close upon being clicked). Because of this, we register the - // click event of an inner span, and pass it around the react-scroll link to an outer span. - private _onClickPropagateClickEventAroundScrollLink(): void { - if (!_.isNull(this._outerReactScrollSpan)) { - this._outerReactScrollSpan.click(); - } - } -} diff --git a/packages/react-shared/src/components/markdown_code_block.tsx b/packages/react-shared/src/components/markdown_code_block.tsx deleted file mode 100644 index 3b28424cd..000000000 --- a/packages/react-shared/src/components/markdown_code_block.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import * as React from 'react'; -import * as HighLight from 'react-highlight'; - -export interface MarkdownCodeBlockProps { - value: string; - language: string; -} - -export interface MarkdownCodeBlockState {} - -export class MarkdownCodeBlock extends React.Component { - // Re-rendering a codeblock causes any use selection to become de-selected. This is annoying when trying - // to copy-paste code examples. We therefore noop re-renders on this component if it's props haven't changed. - public shouldComponentUpdate(nextProps: MarkdownCodeBlockProps, _nextState: MarkdownCodeBlockState): boolean { - return nextProps.value !== this.props.value || nextProps.language !== this.props.language; - } - public render(): React.ReactNode { - return ( - - {this.props.value} - - ); - } -} diff --git a/packages/react-shared/src/components/markdown_link_block.tsx b/packages/react-shared/src/components/markdown_link_block.tsx deleted file mode 100644 index f083a91cf..000000000 --- a/packages/react-shared/src/components/markdown_link_block.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; - -import { constants } from '../utils/constants'; -import { utils } from '../utils/utils'; - -export interface MarkdownLinkBlockProps { - href: string; -} - -export interface MarkdownLinkBlockState {} - -export class MarkdownLinkBlock extends React.Component { - // Re-rendering a linkBlock causes it to remain unclickable. - // We therefore noop re-renders on this component if it's props haven't changed. - public shouldComponentUpdate(nextProps: MarkdownLinkBlockProps, _nextState: MarkdownLinkBlockState): boolean { - return nextProps.href !== this.props.href; - } - public render(): React.ReactNode { - const href = this.props.href; - const isLinkToSection = _.startsWith(href, '#'); - // If protocol is http or https, we can open in a new tab, otherwise don't for security reasons - if (_.startsWith(href, 'http') || _.startsWith(href, 'https')) { - return ( - - {this.props.children} - - ); - } else if (isLinkToSection) { - return ( - - {this.props.children} - - ); - } else { - return {this.props.children}; - } - } - private _onHashUrlClick(href: string): void { - const hash = href.split('#')[1]; - utils.scrollToHash(hash, constants.SCROLL_CONTAINER_ID); - utils.setUrlHash(hash); - } -} diff --git a/packages/react-shared/src/components/markdown_paragraph_block.tsx b/packages/react-shared/src/components/markdown_paragraph_block.tsx deleted file mode 100644 index eeaef8571..000000000 --- a/packages/react-shared/src/components/markdown_paragraph_block.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; - -import { colors } from '../utils/colors'; - -export interface MarkdownParagraphBlockProps {} - -export const MarkdownParagraphBlock: React.StatelessComponent = ({ children }) => { - return {children}; -}; diff --git a/packages/react-shared/src/components/markdown_section.tsx b/packages/react-shared/src/components/markdown_section.tsx deleted file mode 100644 index 42c910c11..000000000 --- a/packages/react-shared/src/components/markdown_section.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; -import * as ReactMarkdown from 'react-markdown'; -import { Element as ScrollElement } from 'react-scroll'; - -import { HeaderSizes } from '../types'; -import { colors } from '../utils/colors'; -import { utils } from '../utils/utils'; - -import { AnchorTitle } from './anchor_title'; -import { Link } from './link'; -import { MarkdownCodeBlock } from './markdown_code_block'; -import { MarkdownLinkBlock } from './markdown_link_block'; -import { MarkdownParagraphBlock } from './markdown_paragraph_block'; - -export interface MarkdownSectionProps { - sectionName: string; - markdownContent: string; - headerSize?: HeaderSizes; - githubLink?: string; - alternativeSectionTitle?: string; -} - -interface DefaultMarkdownSectionProps { - headerSize: HeaderSizes; -} - -type PropsWithDefaults = MarkdownSectionProps & DefaultMarkdownSectionProps; - -export interface MarkdownSectionState { - shouldShowAnchor: boolean; -} - -export class MarkdownSection extends React.Component { - public static defaultProps: Partial = { - headerSize: HeaderSizes.H3, - }; - constructor(props: MarkdownSectionProps) { - super(props); - this.state = { - shouldShowAnchor: false, - }; - } - public render(): React.ReactNode { - const { sectionName, markdownContent, headerSize, githubLink } = this.props as PropsWithDefaults; - - const id = utils.getIdFromName(sectionName); - const formattedSectionName = utils.convertCamelCaseToSpaces(sectionName); - const title = !_.isUndefined(this.props.alternativeSectionTitle) - ? this.props.alternativeSectionTitle - : _.capitalize(formattedSectionName); - return ( -
- -
-
- - - -
-
- {!_.isUndefined(githubLink) && ( -
- - Edit on Github - -
- )} -
-
- -
- -
- ); - } - private _setAnchorVisibility(shouldShowAnchor: boolean): void { - this.setState({ - shouldShowAnchor, - }); - } -} diff --git a/packages/react-shared/src/components/section_header.tsx b/packages/react-shared/src/components/section_header.tsx deleted file mode 100644 index 137b63765..000000000 --- a/packages/react-shared/src/components/section_header.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import * as React from 'react'; -import { Element as ScrollElement } from 'react-scroll'; - -import { HeaderSizes } from '../types'; -import { colors } from '../utils/colors'; -import { utils } from '../utils/utils'; - -import { AnchorTitle } from './anchor_title'; - -export interface SectionHeaderProps { - sectionName: string; - headerSize?: HeaderSizes; -} - -interface DefaultSectionHeaderProps { - headerSize: HeaderSizes; -} - -type PropsWithDefaults = SectionHeaderProps & DefaultSectionHeaderProps; - -export interface SectionHeaderState { - shouldShowAnchor: boolean; -} - -export class SectionHeader extends React.Component { - public static defaultProps: Partial = { - headerSize: HeaderSizes.H2, - }; - constructor(props: SectionHeaderProps) { - super(props); - this.state = { - shouldShowAnchor: false, - }; - } - public render(): React.ReactNode { - const { headerSize } = this.props as PropsWithDefaults; - - const finalSectionName = utils.convertDashesToSpaces(this.props.sectionName); - const id = utils.getIdFromName(finalSectionName); - return ( -
- - - {finalSectionName} - - } - id={id} - shouldShowAnchor={this.state.shouldShowAnchor} - /> - -
- ); - } - private _setAnchorVisibility(shouldShowAnchor: boolean): void { - this.setState({ - shouldShowAnchor, - }); - } -} diff --git a/packages/react-shared/src/globals.d.ts b/packages/react-shared/src/globals.d.ts deleted file mode 100644 index 94e63a32d..000000000 --- a/packages/react-shared/src/globals.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -declare module '*.json' { - const json: any; - /* tslint:disable */ - export default json; - /* tslint:enable */ -} diff --git a/packages/react-shared/src/index.ts b/packages/react-shared/src/index.ts deleted file mode 100644 index 285e1c6b4..000000000 --- a/packages/react-shared/src/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -export { AnchorTitle } from './components/anchor_title'; -export { MarkdownLinkBlock } from './components/markdown_link_block'; -export { MarkdownCodeBlock } from './components/markdown_code_block'; -export { MarkdownSection } from './components/markdown_section'; -export { SectionHeader } from './components/section_header'; -export { Link, LinkProps } from './components/link'; - -export { HeaderSizes, Styles, EtherscanLinkSuffixes, Networks, ALink } from './types'; - -export { utils } from './utils/utils'; -export { constants } from './utils/constants'; -export { colors } from './utils/colors'; diff --git a/packages/react-shared/src/types.ts b/packages/react-shared/src/types.ts deleted file mode 100644 index 9e8dcb6b6..000000000 --- a/packages/react-shared/src/types.ts +++ /dev/null @@ -1,33 +0,0 @@ -export interface Styles { - [name: string]: React.CSSProperties; -} - -export enum HeaderSizes { - H1 = 'h1', - H2 = 'h2', - H3 = 'h3', -} - -export enum EtherscanLinkSuffixes { - Address = 'address', - Tx = 'tx', -} - -export enum Networks { - Mainnet = 'Mainnet', - Kovan = 'Kovan', - Ropsten = 'Ropsten', - Rinkeby = 'Rinkeby', -} - -export enum LinkType { - External = 'EXTERNAL', - ReactScroll = 'REACT_SCROLL', - ReactRoute = 'REACT_ROUTE', -} - -export interface ALink { - title: string; - to: string; - shouldOpenInNewTab?: boolean; -} diff --git a/packages/react-shared/src/utils/colors.ts b/packages/react-shared/src/utils/colors.ts deleted file mode 100644 index a4dd7fefa..000000000 --- a/packages/react-shared/src/utils/colors.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { colors as materialUiColors } from 'material-ui/styles'; - -const baseColors = { - gray40: '#F8F8F8', - grey50: '#FAFAFA', - grey100: '#F5F5F5', - lightestGrey: '#F0F0F0', - greyishPink: '#E6E5E5', - grey300: '#E0E0E0', - beigeWhite: '#E4E4E4', - lightBgGrey: '#EDEDED', - grey325: '#dfdfdf', - grey350: '#CACACA', - grey400: '#BDBDBD', - lightGrey: '#BBBBBB', - grey500: '#9E9E9E', - grey: '#A5A5A5', - darkGrey: '#818181', - landingLinkGrey: '#919191', - linkSectionGrey: '#999999', - greyTheme: '#666666', - grey700: '#616161', - grey750: '#515151', - grey800: '#424242', - darkerGrey: '#393939', - heroGrey: '#404040', - projectsGrey: '#343333', - darkestGrey: '#272727', - lightestBlue: '#E7F1FD', - lightBlue: '#60A4F4', - lightBlueA700: '#0091EA', - lightLinkBlue: '#3289F1', - mediumBlue: '#488AEA', - linkBlue: '#1D5CDE', - darkBlue: '#4D5481', - lightTurquois: '#aefcdc', - turquois: '#058789', - lightPurple: '#A81CA6', - purple: '#690596', - red200: '#EF9A9A', - red: '#E91751', - red500: '#F44336', - red600: '#E53935', - limeGreen: '#66DE75', - lightGreen: '#4DC55C', - lightestGreen: '#89C774', - brightGreen: '#00C33E', - green400: '#66BB6A', - green: '#4DA24B', - amber600: '#FFB300', - orange: '#E69D00', - amber800: '#FF8F00', - darkYellow: '#caca03', -}; - -export const colors = { - ...materialUiColors, - ...baseColors, -}; diff --git a/packages/react-shared/src/utils/constants.ts b/packages/react-shared/src/utils/constants.ts deleted file mode 100644 index 2dca1a078..000000000 --- a/packages/react-shared/src/utils/constants.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { Networks } from '../types'; - -export const constants = { - DOCS_SCROLL_DURATION_MS: 0, - SCROLL_CONTAINER_ID: 'scroll_container', - SCROLL_TOP_ID: 'pageScrollTop', - NETWORK_NAME_BY_ID: { - 1: Networks.Mainnet, - 3: Networks.Ropsten, - 4: Networks.Rinkeby, - 42: Networks.Kovan, - } as { [symbol: number]: string }, - NETWORK_ID_BY_NAME: { - [Networks.Mainnet]: 1, - [Networks.Ropsten]: 3, - [Networks.Rinkeby]: 4, - [Networks.Kovan]: 42, - } as { [networkName: string]: number }, -}; diff --git a/packages/react-shared/src/utils/utils.ts b/packages/react-shared/src/utils/utils.ts deleted file mode 100644 index 142aea85d..000000000 --- a/packages/react-shared/src/utils/utils.ts +++ /dev/null @@ -1,52 +0,0 @@ -import changeCase = require('change-case'); -import isMobile = require('is-mobile'); -import * as _ from 'lodash'; -import { scroller } from 'react-scroll'; - -import { EtherscanLinkSuffixes, Networks } from '../types'; - -import { constants } from './constants'; - -export const utils = { - setUrlHash(anchorId: string): void { - window.location.hash = anchorId; - }, - scrollToHash(hash: string, containerId: string): void { - let finalHash = hash; - if (_.isEmpty(hash)) { - finalHash = constants.SCROLL_TOP_ID; // scroll to the top - } - - scroller.scrollTo(finalHash, { - duration: 0, - offset: 0, - containerId, - }); - }, - isUserOnMobile(): boolean { - const isUserOnMobile = isMobile(); - return isUserOnMobile; - }, - getIdFromName(name: string): string { - const id = name.replace(/ /g, '-'); - return id; - }, - convertDashesToSpaces(text: string): string { - return text.replace(/-/g, ' '); - }, - convertCamelCaseToSpaces(text: string): string { - return changeCase.snake(text).replace(/_/g, ' '); - }, - getEtherScanLinkIfExists( - addressOrTxHash: string, - networkId: number, - suffix: EtherscanLinkSuffixes, - ): string | undefined { - const networkName = constants.NETWORK_NAME_BY_ID[networkId]; - if (_.isUndefined(networkName)) { - return undefined; - } - const etherScanPrefix = networkName === Networks.Mainnet ? '' : `${networkName.toLowerCase()}.`; - return `https://${etherScanPrefix}etherscan.io/${suffix}/${addressOrTxHash}`; - }, -}; -- cgit v1.2.3