diff --git a/.babelrc b/.babelrc index 2e4e9a6a..d3014957 100644 --- a/.babelrc +++ b/.babelrc @@ -1,9 +1,4 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-transform-runtime"], - "env": { - "test": { - "plugins": ["@babel/plugin-transform-class-properties"] - } - } + "plugins": ["@babel/plugin-transform-runtime"] } diff --git a/src/private/Link.js b/src/private/Link.js index d42bfad0..46204781 100644 --- a/src/private/Link.js +++ b/src/private/Link.js @@ -29,69 +29,56 @@ function isExternalLink(external_link, href) { return external_link; } -class Link extends Component { - /** - * This component can be used either as a dash-core-components style link or - * as a styled HTML anchor - */ - constructor(props) { - super(props); - this.updateLocation = this.updateLocation.bind(this); - } - - updateLocation(e) { +function Link({ + children, + preOnClick, + target, + linkTarget, + href, + download, + external_link, + disabled, + ...otherProps +}) { + const updateLocation = e => { const hasModifiers = e.metaKey || e.shiftKey || e.altKey || e.ctrlKey; if (hasModifiers) { return; } - if (this.props.disabled) { + if (disabled) { e.preventDefault(); return; } - if (this.props.preOnClick) { - this.props.preOnClick(); + if (preOnClick) { + preOnClick(); } - const {external_link, href} = this.props; if (href && !isExternalLink(external_link, href)) { // prevent anchor from updating location e.preventDefault(); - const {href} = this.props; window.history.pushState({}, '', href); window.dispatchEvent(new CustomEvent('_dashprivate_pushstate')); // scroll back to top window.scrollTo(0, 0); } - } + }; - render() { - const { - children, - preOnClick, - target, - linkTarget, - href, - download, - external_link, - ...otherProps - } = this.props; - const linkIsExternal = href && isExternalLink(external_link, href); - /** - * ideally, we would use cloneElement however - * that doesn't work with dash's recursive - * renderTree implementation for some reason - */ - return ( - this.updateLocation(e)} - > - {children} - - ); - } + const linkIsExternal = href && isExternalLink(external_link, href); + /** + * ideally, we would use cloneElement however + * that doesn't work with dash's recursive + * renderTree implementation for some reason + */ + return ( + updateLocation(e)} + > + {children} + + ); } Link.propTypes = {