fix: linting and log removal

carbon-design-system · Apr 27, 2019 · d573898 · d573898
1 parent e102684
commit d573898
Show file tree

Hide file tree

Showing 14 changed files with 101 additions and 97 deletions.
diff --git a/example/package.json b/example/package.json
@@ -3,7 +3,8 @@
   "version": "0.0.7",
   "scripts": {
     "develop": "gatsby develop",
-    "build": "gatsby build"
+    "build": "gatsby build",
+    "serve": "gatsby serve"
   },
   "dependencies": {
     "gatsby": "^2.3.5",

diff --git a/gatsby-theme-carbon/index.js b/gatsby-theme-carbon/index.js
@@ -2,5 +2,5 @@ export { AnchorLinks, AnchorLink } from './src/components/AnchorLinks';
 export { default as PageDescription } from './src/components/PageDescription';
 export { default as Video } from './src/components/Video';
 export { default as DoDontExample } from './src/components/DoDontExample';
-export { default as ImageComponent } from './src/components/ImageComponent';
+export { default as ImageComponent } from './src/components/ImageComponent'; // in progress
 export { Row, Column } from './src/components/Grid';
diff --git a/gatsby-theme-carbon/src/components/AnchorLinks/AnchorLinks.js b/gatsby-theme-carbon/src/components/AnchorLinks/AnchorLinks.js
@@ -8,7 +8,6 @@ const { prefix } = settings;
 export default class AnchorLinks extends React.Component {
   render() {
     const { children, small } = this.props;
-    console.log('child', children);
     const isColumn = React.Children.count(children) > 6;
     const classNames = classnames({
       [`${prefix}--anchor-links__list`]: true,

diff --git a/gatsby-theme-carbon/src/components/DoDontExample/DoDontExample.js b/gatsby-theme-carbon/src/components/DoDontExample/DoDontExample.js
@@ -17,7 +17,7 @@ export default class DoDontExample extends React.Component {
     /** text displayed in the example card */
     text: PropTypes.string,
     /** path to the image displayed in the example card, starting under `src` folder. e.g.: `content/guidelines/content/img-test.svg` */
-    imgpath: PropTypes.string,
+    // imgpath: PropTypes.string,
     /** mark card as true? if not defined, card will be marked as false */
     correct: PropTypes.bool,
     /** default to false, set to true for dark background */
@@ -72,7 +72,7 @@ export default class DoDontExample extends React.Component {
               <CheckmarkFilled24 className={iconClassNames} />
             ) : (
               <Misuse24 className={iconClassNames} />
-            )} 
+            )}
             <div className={`${prefix}--example__content`}>
               {children}
               {text ? (

diff --git a/gatsby-theme-carbon/src/components/EditLink.js b/gatsby-theme-carbon/src/components/EditLink.js
@@ -1,21 +1,21 @@
-import React from "react";
-import PropTypes from "prop-types";
-import { css } from "@emotion/core";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { css } from '@emotion/core';
 
-const repository = "https://github.com/temporary/master/tree";
+const repository = 'https://github.com/temporary/master/tree';
 
 const rowCss = css({
-  position: "relative",
-  bottom: "calc(-160px + 0.875rem + 32px)"
+  position: 'relative',
+  bottom: 'calc(-160px + 0.875rem + 32px)',
 });
 
 const aCss = ({ typeStyles, colors }) => ({
   ...typeStyles.bodyShort01,
   color: colors.text02,
-  transition: ".11s",
-  ":hover": {
-    color: colors.text01
-  }
+  transition: '.11s',
+  ':hover': {
+    color: colors.text01,
+  },
 });
 
 export default class EditLink extends React.Component {
@@ -38,10 +38,10 @@ export default class EditLink extends React.Component {
 EditLink.propTypes = {
   repositoryUrl: PropTypes.string,
   fileType: PropTypes.string,
-  slug: PropTypes.string.isRequired
+  slug: PropTypes.string.isRequired,
 };
 
 EditLink.defaultProps = {
   repositoryUrl: repository.url,
-  fileType: "mdx"
+  fileType: 'mdx',
 };
diff --git a/gatsby-theme-carbon/src/components/Homepage/Homepage.js b/gatsby-theme-carbon/src/components/Homepage/Homepage.js
@@ -1,6 +1,6 @@
-import React from "react";
-import ArrowRightIcon from "@carbon/icons-react/es/arrow--right/24";
-import { Link } from "gatsby";
+import React from 'react';
+import ArrowRightIcon from '@carbon/icons-react/es/arrow--right/24';
+import { Link } from 'gatsby';
 
 export const HomepageHeader = () => {
   const homeTitle = (

diff --git a/gatsby-theme-carbon/src/components/ImageComponent/ImageComponent.js b/gatsby-theme-carbon/src/components/ImageComponent/ImageComponent.js
@@ -1,10 +1,10 @@
-import React, { Component } from "react";
-import classnames from "classnames";
-import PropTypes from "prop-types";
-import { settings } from "carbon-components";
-import Overlay from "../Overlay";
-import Close32 from "@carbon/icons-react/es/close/32";
-import ZoomIn20 from "@carbon/icons-react/es/zoom--in/20";
+import React, { Component } from 'react';
+import classnames from 'classnames';
+import PropTypes from 'prop-types';
+import { settings } from 'carbon-components';
+import Close32 from '@carbon/icons-react/es/close/32';
+import ZoomIn20 from '@carbon/icons-react/es/zoom--in/20';
+import Overlay from '../Overlay';
 
 const { prefix } = settings;
 
@@ -14,30 +14,30 @@ class ImageComponent extends Component {
     children: PropTypes.node,
     className: PropTypes.string,
     bg: PropTypes.string,
-    zoom: PropTypes.bool
+    zoom: PropTypes.bool,
   };
 
   static defaultProps = {
-    zoom: false
+    zoom: false,
   };
 
   state = {
-    showOverlay: false
+    showOverlay: false,
   };
 
   componentDidMount() {
-    document.addEventListener("keydown", this.handleKeyboardEvent, false);
+    document.addEventListener('keydown', this.handleKeyboardEvent, false);
   }
 
   componentWillUnmount() {
-    document.removeEventListener("keydown", this.handleKeyboardEvent, false);
+    document.removeEventListener('keydown', this.handleKeyboardEvent, false);
   }
 
   handleKeyboardEvent = e => {
-    const key = e.key;
-    if (this.state.showOverlay && key === "Escape") {
+    const { key } = e;
+    if (this.state.showOverlay && key === 'Escape') {
       this.setState({ showOverlay: false }, () => {
-        document.body.style.overflow = "visible";
+        document.body.style.overflow = 'visible';
       });
     }
   };
@@ -46,14 +46,14 @@ class ImageComponent extends Component {
     if (this.props.zoom) {
       if (window.innerWidth < 672) return;
       this.setState({ showOverlay: true }, () => {
-        document.body.style.overflow = "hidden";
+        document.body.style.overflow = 'hidden';
       });
     }
   };
 
   handleCloseClick = () => {
     this.setState({ showOverlay: false }, () => {
-      document.body.style.overflow = "visible";
+      document.body.style.overflow = 'visible';
     });
   };
 
@@ -63,11 +63,11 @@ class ImageComponent extends Component {
     const imgComponentClasses = classnames(className, {
       [`${prefix}--image-component`]: true,
       [`${prefix}--image-component--no-caption`]: caption === undefined,
-      [`${prefix}--transparent-bg`]: bg === "none"
+      [`${prefix}--transparent-bg`]: bg === 'none',
     });
 
     const imgWrapperClasses = classnames({
-      [`${prefix}--image-component-wrapper-zoom`]: zoom 
+      [`${prefix}--image-component-wrapper-zoom`]: zoom,
     });
 
     if (this.state.showOverlay)

diff --git a/gatsby-theme-carbon/src/components/LeftNav/LeftNavItem.js b/gatsby-theme-carbon/src/components/LeftNav/LeftNavItem.js
@@ -31,7 +31,7 @@ export default class LeftNavItem extends React.Component {
     });
   };
 
-  renderSubNavItems = (items, location, category) => {
+  renderSubNavItems = (items, location) => {
     const isActive = item => {
       const titleSlug = slugify(item.title, { lower: true });
       return location.pathname.includes(titleSlug);

diff --git a/gatsby-theme-carbon/src/components/Overlay.js b/gatsby-theme-carbon/src/components/Overlay.js
@@ -10,11 +10,12 @@ export default class Overlay extends React.Component {
     /** caption (optional) */
     caption: PropTypes.string,
     /** default to false, set to true for dark background */
-    dark: PropTypes.string,
+    // dark: PropTypes.string,
     show: PropTypes.bool,
   };
+
   state = {
-    showOverlay: false,
+    // showOverlay: false,
   };
 
   getImage(reactTree, image) {
@@ -34,15 +35,16 @@ export default class Overlay extends React.Component {
 
   render() {
     const image = this.getImage(this.props.children, {});
-    //const { children } = this.props;
+    // const { children } = this.props;
     const displayTitle = image.title ? image.title : this.props.caption;
 
     return (
       <div className={`${prefix}--overlay-content`}>
         <div className={`${prefix}--overlay-bg`} />
         <div className={`${prefix}--overlay-leftArea`} show={this.props.show}>
           <div
-            className={`${prefix}--overlay-caption ${prefix}--type-heading-02`}>
+            className={`${prefix}--overlay-caption ${prefix}--type-heading-02`}
+          >
             {displayTitle}
           </div>
         </div>

diff --git a/gatsby-theme-carbon/src/components/PageHeader/PageHeader.js b/gatsby-theme-carbon/src/components/PageHeader/PageHeader.js
@@ -1,5 +1,5 @@
-import React from "react";
-import PropTypes from "prop-types";
+import React from 'react';
+import PropTypes from 'prop-types';
 
 const PageHeader = ({ children, title }) => (
   <div className="page-header">
@@ -28,7 +28,7 @@ PageHeader.propTypes = {
   /**
    * Specify the title for the page
    */
-  title: PropTypes.string
+  title: PropTypes.string,
 };
 
 export default PageHeader;
diff --git a/gatsby-theme-carbon/src/components/PageTable/PageTable.js b/gatsby-theme-carbon/src/components/PageTable/PageTable.js
@@ -1,10 +1,10 @@
-import React from "react";
-import PropTypes from "prop-types";
-import classnames from "classnames";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
 
 export default class PageTable extends React.Component {
   static propTypes = {
-    children: PropTypes.node
+    children: PropTypes.node,
   };
 
   render() {
@@ -17,10 +17,10 @@ export default class PageTable extends React.Component {
     }
 
     const classNames = classnames({
-      "bx--col-lg-8 bx--col-md-6": gridSize < 4,
-      "bx--col-lg-12": gridSize > 3,
-      "bx--col-no-gutter": true,
-      "page-table__container": true
+      'bx--col-lg-8 bx--col-md-6': gridSize < 4,
+      'bx--col-lg-12': gridSize > 3,
+      'bx--col-no-gutter': true,
+      'page-table__container': true,
     });
 
     return (

diff --git a/gatsby-theme-carbon/src/components/Row.js b/gatsby-theme-carbon/src/components/Row.js
@@ -1,12 +1,12 @@
-import React from "react";
-import PropTypes from "prop-types";
-import { ClassNames } from "@emotion/core";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ClassNames } from '@emotion/core';
 
 const Row = ({ children, type, className }) => (
   <ClassNames>
     {({ cx }) => (
-      <div className={cx("bx--row", className)}>
-        <div className={cx("bx--col-lg-7", type === "p" && "bx--col-md-6")}>
+      <div className={cx('bx--row', className)}>
+        <div className={cx('bx--col-lg-7', type === 'p' && 'bx--col-md-6')}>
           {children}
         </div>
       </div>
@@ -15,12 +15,12 @@ const Row = ({ children, type, className }) => (
 );
 
 Row.defaultProps = {
-  type: "node"
+  type: 'node',
 };
 
 Row.propTypes = {
   // eslint-disable-next-line react/no-typos
-  type: PropTypes.elementType
+  type: PropTypes.elementType,
 };
 
 export default Row;
diff --git a/gatsby-theme-carbon/src/styles/index.scss b/gatsby-theme-carbon/src/styles/index.scss
@@ -1,18 +1,18 @@
 //---------------------------------------
 // Carbon Components
 //---------------------------------------
-@import "~@carbon/elements/scss/layout/convert";
-@import "~@carbon/elements/scss/layout/breakpoint";
-@import "~@carbon/elements/scss/layout/layout";
-@import "~@carbon/elements/scss/grid/grid";
+@import '~@carbon/elements/scss/layout/convert';
+@import '~@carbon/elements/scss/layout/breakpoint';
+@import '~@carbon/elements/scss/layout/layout';
+@import '~@carbon/elements/scss/grid/grid';
 
-@import "~@carbon/elements/scss/type/type";
-@import "~@carbon/elements/scss/type/font-face/sans";
-@import "~@carbon/elements/scss/type/font-face/serif";
-@import "~@carbon/elements/scss/type/font-face/mono";
-@import "~@carbon/elements/scss/type/classes";
+@import '~@carbon/elements/scss/type/type';
+@import '~@carbon/elements/scss/type/font-face/sans';
+@import '~@carbon/elements/scss/type/font-face/serif';
+@import '~@carbon/elements/scss/type/font-face/mono';
+@import '~@carbon/elements/scss/type/classes';
 
-@import "~@carbon/elements/scss/colors/colors";
+@import '~@carbon/elements/scss/colors/colors';
 
 @include carbon--type-reset();
 // @include carbon--font-face-mono();
@@ -22,37 +22,37 @@
 
 $feature-flags: (
   ui-shell: true,
-  grid-columns-16: false
+  grid-columns-16: false,
 );
 
-$prefix: "bx";
+$prefix: 'bx';
 
-@import "~carbon-components/scss/globals/scss/styles";
+@import '~carbon-components/scss/globals/scss/styles';
 
-@import "~@carbon/addons-website/scss/components/website-grid";
-@import "~@carbon/addons-website/scss/components/404";
-@import "~@carbon/addons-website/scss/components/website-footer";
-@import "~@carbon/addons-website/scss/components/website-switcher";
-@import "~@carbon/addons-website/scss/components/website-header";
-@import "~@carbon/addons-website/scss/components/website-header-nav";
-@import "~@carbon/addons-website/scss/components/website-side-nav";
-@import "~@carbon/addons-website/scss/components/website-back-to-top-btn";
-@import "~@carbon/addons-website/scss/components/website-code-snippet";
+@import '~@carbon/addons-website/scss/components/website-grid';
+@import '~@carbon/addons-website/scss/components/404';
+@import '~@carbon/addons-website/scss/components/website-footer';
+@import '~@carbon/addons-website/scss/components/website-switcher';
+@import '~@carbon/addons-website/scss/components/website-header';
+@import '~@carbon/addons-website/scss/components/website-header-nav';
+@import '~@carbon/addons-website/scss/components/website-side-nav';
+@import '~@carbon/addons-website/scss/components/website-back-to-top-btn';
+@import '~@carbon/addons-website/scss/components/website-code-snippet';
 
-$font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
+$font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
 
 //---------------------------------------
 // Page styles
 //---------------------------------------
 
-@import "page";
-
-@import "../components/Homepage/homepage.scss";
-@import "../components/GlobalSearch/global-search.scss";
-@import "../components/NextPrevious/next-previous.scss";
-@import "../components/PageHeader/page-header.scss";
-@import "../components/PageTable/page-table.scss";
-@import "../components/PageTabs/page-tabs.scss";
-@import "../components/DoDontExample/do-dont-example.scss";
-@import "../components/AnchorLinks/anchor-links.scss";
-@import "../components/ImageComponent/image-component.scss";
+@import 'page';
+
+@import '../components/Homepage/homepage.scss';
+@import '../components/GlobalSearch/global-search.scss';
+@import '../components/NextPrevious/next-previous.scss';
+@import '../components/PageHeader/page-header.scss';
+@import '../components/PageTable/page-table.scss';
+@import '../components/PageTabs/page-tabs.scss';
+@import '../components/DoDontExample/do-dont-example.scss';
+@import '../components/AnchorLinks/anchor-links.scss';
+@import '../components/ImageComponent/image-component.scss';