Merge branch 'dashboard-editor' of github.com:carbon-design-system/ca…

…rbon-addons-iot-react into dashboard-editor

.github/workflows/build.yml

@@ -0,0 +1,23 @@
+name: Build
+
+on: [push, pull_request]
+
+jobs:
+  build:
+    name: '`yarn build`'
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
+      - name: Run build
+        run: yarn build

.github/workflows/format.yml

@@ -0,0 +1,23 @@
+name: Format
+
+on: [push, pull_request]
+
+jobs:
+  format:
+    name: '`yarn format:check`'
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
+      - name: Check formatting
+        run: yarn format:check

.github/workflows/lint.yml

@@ -0,0 +1,23 @@
+name: Lint
+
+on: [push, pull_request]
+
+jobs:
+  lint:
+    name: '`yarn lint`'
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
+      - name: Run linters
+        run: yarn lint

.github/workflows/publish.yml

@@ -0,0 +1,51 @@
+name: Publish
+
+# We should search around on semantic release github issues to see if there's any known issues with github actions running our publish command
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
+      - name: Validate formatting
+        run: yarn format:check
+
+      - name: Lint
+        run: yarn lint
+
+      - name: Test, collect coverage
+        run: yarn test --maxWorkers=2 --ci --logHeapUsage --coverage
+
+      - name: Coveralls
+        uses: coverallsapp/github-action@master
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Build
+        run: yarn build
+
+      - name: Publish
+        env:
+          GH_TOKEN: ${{ secrets.GH_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+        # Dry-run only for now for testing purposes. Travis CI does the actual publish currently.
+        # https://semantic-release.gitbook.io/semantic-release/usage/configuration#dryrun
+        run: yarn publish-npm --dry-run

.github/workflows/test.yml

@@ -0,0 +1,28 @@
+name: Test
+
+on: [push, pull_request]
+
+jobs:
+  test:
+    name: '`yarn test`'
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
+      - name: Run tests, collect coverage
+        run: yarn test --maxWorkers=2 --ci --logHeapUsage --coverage
+
+      - name: Coveralls
+        uses: coverallsapp/github-action@master
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}

.travis.yml

@@ -21,13 +21,9 @@ cache:
 install:
   - yarn install
   - yarn list
-  - yarn build
 
 script:
-  - yarn format:check
-  - yarn lint
-  - travis_wait yarn test --maxWorkers=2 --ci --logHeapUsage --coverage && cat
-    ./coverage/lcov.info | yarn run coveralls && rm -rf ./coverage # report coveralls status
+  - yarn build
 
 after_success:
   - yarn publish-npm

README.MD

@@ -7,7 +7,10 @@
   Carbon add-ons for Watson IoT
 </h1>
 
-> Carbon add-ons for Watson IoT is an open-source react component library built by IBM Watson Internet Of Things. With the Carbon Design System and IBM Design Language as its foundation, the library consists of working code, resources, and a vibrant community of contributors.
+> Carbon add-ons for Watson IoT is an open-source react component library built
+> by IBM Watson Internet Of Things. With the Carbon Design System and IBM Design
+> Language as its foundation, the library consists of working code, resources,
+> and a vibrant community of contributors.
 
 <p align="center">
   <a href="https://carbon-addons-iot-react.com">
@@ -20,7 +23,7 @@
     <img src="https://travis-ci.org/carbon-design-system/carbon-addons-iot-react.svg?branch=master" alt="Build Status" />
   </a>
   <a href="https://www.npmjs.com/package/carbon-addons-iot-react">
-    <img src="https://img.shields.io/npm/v/carbon-addons-iot-react/master.svg" alt="master release" />
+    <img src="https://img.shields.io/npm/v/carbon-addons-iot-react/latest" alt="Current npm version release" />
   </a>
   <a href="https://coveralls.io/github/carbon-design-system/carbon-addons-iot-react?branch=master">
     <img src="https://coveralls.io/repos/github/carbon-design-system/carbon-addons-iot-react/badge.svg?branch=master" alt="Coverage Report" />
@@ -41,29 +44,36 @@ Run the following command using [npm](https://www.npmjs.com/):
 npm install carbon-addons-iot-react d3@">=5.0.0 <=5.14.2"
 ```
 
-If you prefer [Yarn Classic](https://classic.yarnpkg.com/), use the following command instead:
+If you prefer [Yarn Classic](https://classic.yarnpkg.com/), use the following
+command instead:
 
 ```bash
 yarn add carbon-addons-iot-react d3@">=5.0.0 <=5.14.2"
 ```
 
-> _Note `d3` is a peer dependency due to the usage of `@carbon/charts` in various components. The required version range is specified in [our package.json](https://github.com/carbon-design-system/carbon-addons-iot-react/search?l=JSON&q=peerDependencies+d3)_
+> _Note `d3` is a peer dependency due to the usage of `@carbon/charts` in
+> various components. The required version range is specified in
+> [our package.json](https://github.com/carbon-design-system/carbon-addons-iot-react/search?l=JSON&q=peerDependencies+d3)_
 
-You can then import any component that you need by doing the following in your project:
+You can then import any component that you need by doing the following in your
+project:
 
 ```js
 import { AddCard } from 'carbon-addons-iot-react';
 ```
 
 ## 🚀 Quick Start
 
-If you'd like to test drive everything here, run the following command to create a new project preconfigured with everything you need to begin to build an application.
+If you'd like to test drive everything here, run the following command to create
+a new project preconfigured with everything you need to begin to build an
+application.
 
 ```sh
 npx create-iot-react-app <app-name>
 ```
 
-More [info on `create-iot-react-app` here](https://github.com/davidicus/create-iot-react-app)
+More
+[info on `create-iot-react-app` here](https://github.com/davidicus/create-iot-react-app)
 
 ## Styling
 
@@ -90,30 +100,44 @@ Compiled CSS files are provided for ease of use getting started.
 
 A sass entrypoint is available at `scss/styles.scss` for use in your project.
 
-Using sass files (instead of the compiled .css) infers usage of a SCSS pre-processor. All Sass files use the `*.scss` file extension. For transpiling Sass code, use node-sass based Sass compilers, for example, WebPack sass-loader or gulp-sass. Make sure your build process uses autoprefixer to ensure vendor prefixes are automatically added to your output CSS.
+Using sass files (instead of the compiled .css) infers usage of a SCSS
+pre-processor. All Sass files use the `*.scss` file extension. For transpiling
+Sass code, use node-sass based Sass compilers, for example, WebPack sass-loader
+or gulp-sass. Make sure your build process uses autoprefixer to ensure vendor
+prefixes are automatically added to your output CSS.
 
-Feedback and improvement requests regarding this configuration would be appreciated, [please open an issue](https://github.com/carbon-design-system/carbon-addons-iot-react/issues/new?assignees=&labels=%3Ahammer%3A++Enhancement&template=feature-request-or-enhancement.md&title=%5BComponentName%5D+request_title).
+Feedback and improvement requests regarding this configuration would be
+appreciated,
+[please open an issue](https://github.com/carbon-design-system/carbon-addons-iot-react/issues/new?assignees=&labels=%3Ahammer%3A++Enhancement&template=feature-request-or-enhancement.md&title=%5BComponentName%5D+request_title).
 
 ## Dependencies
 
-Usage of this package does not require you to install additional Carbon packages; `carbon-components`, `carbon-components-react`, or `@carbon` packages (`@carbon/grid`, `@carbon-layout`, etc) as peer dependencies. You may still need these packages if you use them directly in your project.
+Usage of this package does not require you to install additional Carbon
+packages; `carbon-components`, `carbon-components-react`, or `@carbon` packages
+(`@carbon/grid`, `@carbon-layout`, etc) as peer dependencies. You may still need
+these packages if you use them directly in your project.
 
 ## 📚 Docs
 
-You can find more information about how to use each component by checking out the [Storybook](https://carbon-addons-iot-react.com/).
+You can find more information about how to use each component by checking out
+the [Storybook](https://carbon-addons-iot-react.com/).
 
 ## 🤲 Contributing
 
-Please check out our [Contribution Guidelines](./.github/CONTRIBUTING.MD) for more info on how you can help out!
+Please check out our [Contribution Guidelines](./.github/CONTRIBUTING.MD) for
+more info on how you can help out!
 
 ## Testing
 
-You can find our component test statement [here](./src/components/COMPONENT_TEST)
+You can find our component test statement
+[here](./src/components/COMPONENT_TEST)
 
-If you are using our project with Jest tests, due to it's dependency on d3, you may have to add some mock to your Jest setup script. See this issue for more details: https://github.com/facebook/jest/issues/5379
+If you are using our project with Jest tests, due to it's dependency on d3, you
+may have to add some mock to your Jest setup script. See this issue for more
+details: https://github.com/facebook/jest/issues/5379
 
-Here's an example setup script, update your jest config to point to a setup script:
-setupFiles: ['setupJest.js'],
+Here's an example setup script, update your jest config to point to a setup
+script: setupFiles: ['setupJest.js'],
 
 ```js
 setupJest.js contents:

src/components/Table/TableHead/TableHead.jsx

@@ -381,7 +381,7 @@ const TableHead = ({
               ? matchingColumnMeta.align
               : 'start';
           const hasOverflow = Array.isArray(
-            matchingColumnMeta.overflowMenuItems
+            matchingColumnMeta?.overflowMenuItems
           );
 
           // Increases the minimum width of the Header when the overflow button is present

src/components/TableCard/TableCard.test.jsx

@@ -586,4 +586,43 @@ describe('TableCard', () => {
     expect(screen.queryAllByText(/^Medium$/g)).toHaveLength(1);
     expect(screen.queryAllByText(/^Lowest$/g)).toHaveLength(5);
   });
+  it('can be resized without crashing', () => {
+    const { rerender } = render(
+      <TableCard
+        id="table-list"
+        title="Testing resize"
+        content={{
+          columns: tableColumns,
+        }}
+        values={tableData}
+        size={CARD_SIZES.LARGE}
+      />
+    );
+
+    rerender(
+      <TableCard
+        id="table-list"
+        title="Testing resize"
+        content={{
+          columns: tableColumns,
+        }}
+        values={tableData}
+        size={CARD_SIZES.LARGEWIDE}
+      />
+    );
+
+    rerender(
+      <TableCard
+        id="table-list"
+        title="Testing resize"
+        content={{
+          columns: tableColumns,
+        }}
+        values={tableData}
+        size={CARD_SIZES.LARGE}
+      />
+    );
+
+    expect(screen.getByText('Testing resize')).toBeInTheDocument();
+  });
 });

src/components/ValueCard/Attribute.jsx

@@ -81,6 +81,7 @@ const propTypes = {
   /** Number of attributes that the parent ValueCard is trying to display */
   attributeCount: PropTypes.number.isRequired,
   locale: PropTypes.string,
+  customFormatter: PropTypes.func,
 };
 
 const defaultProps = {
@@ -95,6 +96,7 @@ const defaultProps = {
   renderIconByName: null,
   secondaryValue: null,
   locale: 'en',
+  customFormatter: null,
 };
 
 /**
@@ -117,6 +119,7 @@ const Attribute = ({
   renderIconByName,
   size, // eslint-disable-line react/prop-types
   locale,
+  customFormatter,
 }) => {
   // Checks size property against new size naming convention and reassigns to closest supported size if necessary.
   const newSize = getUpdatedCardSize(size);
@@ -193,6 +196,7 @@ const Attribute = ({
               allowedToWrap={allowWrap}
               wrapCompact={wrapCompact}
               locale={locale}
+              customFormatter={customFormatter}
             />
             <UnitRenderer
               value={value}

src/components/ValueCard/ValueCard.jsx

@@ -263,6 +263,7 @@ const ValueCard = ({
   dataState,
   id,
   locale,
+  customFormatter,
   ...others
 }) => {
   const availableActions = {
@@ -384,6 +385,7 @@ const ValueCard = ({
                                 ),
                           }
                         }
+                        customFormatter={customFormatter}
                       />
                       {isMini && <Spacer />}
                       <AttributeLabel