chore: bump carbon packages

.github/README.MD

@@ -22,29 +22,33 @@
   <a href="https://www.npmjs.com/package/carbon-addons-iot-react">
     <img src="https://img.shields.io/npm/v/carbon-addons-iot-react/next" alt="@next npm version release" />
   </a>
+  <br/>
+  <a href="https://carbon-design-system.github.io/carbon-addons-iot-react">
+    <img src="https://img.shields.io/badge/view%20%40next-storybook-ff4785" alt="view @next storybook" />
+  </a>
+  <br/>
   <a href="https://github.com/carbon-design-system/carbon-addons-iot-react/actions?query=workflow%3ABuild+branch%3Amaster">
     <img src="https://img.shields.io/github/workflow/status/carbon-design-system/carbon-addons-iot-react/Build/master" alt="Build Status" />
   </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" />
   </a>
+  <br/>
   <a href="https://github.com/carbon-design-system/carbon-addons-iot-react/blob/master/LICENSE">
     <img src="https://img.shields.io/badge/license-Apache--2.0-blue.svg" alt="Carbon add-ons for Watson IoT is released under the Apache-2.0 license" />
   </a>
   <a href="https://github.com/carbon-design-system/carbon-addons-iot-react/blob/master/.github/CONTRIBUTING.MD">
     <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome" />
   </a>
+
 </p>
 
 ## Installation
 
 **@latest from
 [`master`](https://github.com/carbon-design-system/carbon-addons-iot-react/tree/master)**
-&nbsp; - &nbsp; <a href="https://carbon-design-system.github.io/carbon-addons-iot-react">
-<img valign=middle src="https://img.shields.io/badge/view%20%40latest-storybook-ff4785" alt="view @latest storybook" />
-</a>
 
-```
+```bash
 # with npm
 npm install carbon-addons-iot-react d3@">=5.0.0 <=5.14.2"
 
@@ -54,11 +58,8 @@ yarn add carbon-addons-iot-react d3@">=5.0.0 <=5.14.2"
 
 **@next pre-releases from
 [`next`](https://github.com/carbon-design-system/carbon-addons-iot-react/tree/next)**
-&nbsp; - &nbsp; <a href="https://next.carbon-addons-iot-react.com">
-<img valign=middle src="https://img.shields.io/badge/view%20%40next-storybook-ff4785" alt="view @next storybook" />
-</a>
 
-```
+```bash
 # with npm
 npm install carbon-addons-iot-react@next d3@"^7.0.0"
 
@@ -92,15 +93,15 @@ To test drive everything here, use
 will create a new project that is preconfigured with everything you need to
 begin to build an application.
 
-```
+```bash
 npx create-iot-react-app <app-name>
 ```
 
 ## Styling
 
 What's included
 
-```
+```bash
 carbon-addons-iot-react/
 ├── css
 │   ├── carbon-addons-iot-react.css
@@ -150,7 +151,7 @@ You can find our component test statement
 
 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
+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'],

.github/workflows/test.yml

@@ -51,7 +51,7 @@ jobs:
         if: steps.changes.outputs.react == 'true'
         run: |
           cd packages/react
-          yarn test:ci
+          yarn test:ci --silent
 
       - name: Archive coverage artifacts
         if: ${{ success() }} && steps.changes.outputs.react == 'true'

package.json

@@ -65,8 +65,8 @@
     "husky": "^1.3.1",
     "lerna": "^6.6.2",
     "lint-staged": "^8.1.0",
-    "prettier": "^2.1.2",
-    "prettier-config-carbon": "^0.4.0"
+    "prettier": "^2.8.8",
+    "prettier-config-carbon": "^0.11.0"
   },
   "sideEffects": false,
   "version": "0.0.0-development",

packages/angular/src/table/table.stories.ts

@@ -182,9 +182,8 @@ storiesOf('Components/Table', module)
         customSort: (index: number) => {
           if (simpleMultiHeaderModel.getClosestHeader(index).sorted) {
             // if already sorted flip sorting direction
-            simpleMultiHeaderModel.getClosestHeader(
-              index
-            ).ascending = simpleMultiHeaderModel.getClosestHeader(index).descending;
+            simpleMultiHeaderModel.getClosestHeader(index).ascending =
+              simpleMultiHeaderModel.getClosestHeader(index).descending;
           }
           simpleMultiHeaderModel.sort(index);
         },
@@ -216,9 +215,8 @@ storiesOf('Components/Table', module)
         customSort: (index: number) => {
           if (simpleMultiHeaderModel.getClosestHeader(index).sorted) {
             // if already sorted flip sorting direction
-            simpleMultiHeaderModel.getClosestHeader(
-              index
-            ).ascending = simpleMultiHeaderModel.getClosestHeader(index).descending;
+            simpleMultiHeaderModel.getClosestHeader(index).ascending =
+              simpleMultiHeaderModel.getClosestHeader(index).descending;
           }
           simpleMultiHeaderModel.sort(index);
         },

packages/angular/src/toolkit/table/sterling-table.stories.ts

@@ -12,8 +12,7 @@ const simpleModel = new SCTableModel();
 simpleModel.header = [
   [
     new TableHeaderItem({
-      data:
-        'Name Name Name Name Name Name Name Name Name Name \
+      data: 'Name Name Name Name Name Name Name Name Name Name \
 	Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name \
 	Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name Name \
 	Name Name Name Name Name Name Name Name Name Name \

packages/react/jest.config.js

@@ -27,12 +27,13 @@ module.exports = {
       lines: 90,
     },
     // set coverage to 90 for all items except those who are covered by e2e cypress tests
-    './src/components/**/!(TimeSeriesCard|BarChartCard|DashboardEditor|ListTarget|PageTitleBar|DateTimePickerV2|DateTimePicker|HeaderActionGroup|DashboardEditorCardRenderer|CardCodeEditor|SimpleList|index|ListContent|List|VirtualListContent|TableMultiSortRow|TableColumnCustomizationModal|ListBuilder|SidePanel|ListSpinner|DateTimePickerV2WithTimeSpinner|DateTimePickerV2WithoutTimeSpinner).jsx': {
-      statements: 90,
-      branches: 90,
-      functions: 90,
-      lines: 90,
-    },
+    './src/components/**/!(TimeSeriesCard|BarChartCard|DashboardEditor|ListTarget|PageTitleBar|DateTimePickerV2|DateTimePicker|HeaderActionGroup|DashboardEditorCardRenderer|CardCodeEditor|SimpleList|index|ListContent|List|VirtualListContent|TableMultiSortRow|TableColumnCustomizationModal|ListBuilder|SidePanel|ListSpinner|DateTimePickerV2WithTimeSpinner|DateTimePickerV2WithoutTimeSpinner).jsx':
+      {
+        statements: 90,
+        branches: 90,
+        functions: 90,
+        lines: 90,
+      },
     './src/components/List/ListItem/ListTarget.jsx': {
       branches: 88,
     },

packages/react/package.json

@@ -167,18 +167,18 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.10.2",
-    "@carbon/charts": "0.55.1",
-    "@carbon/charts-react": "0.55.1",
-    "@carbon/colors": "10.37.0",
-    "@carbon/icons-react": "10.49.0",
-    "@carbon/layout": "10.37.0",
-    "@carbon/motion": "10.29.0",
-    "@carbon/pictograms-react": "11.25.0",
-    "@carbon/themes": "10.54.0",
-    "@ibm/telemetry-js": "^1.5.0",
+    "@carbon/charts": "^0.58.2",
+    "@carbon/charts-react": "^0.58.2",
+    "@carbon/colors": "^10.37.4",
+    "@carbon/icons-react": "^10.49.5",
+    "@carbon/layout": "^10.37.4",
+    "@carbon/motion": "^10.29.4",
+    "@carbon/pictograms-react": "^11.63.0",
+    "@carbon/themes": "^10.55.5",
+    "@ibm/telemetry-js": "^1.6.0",
     "@monaco-editor/react": "4.4.5",
-    "carbon-components": "10.56.0",
-    "carbon-components-react": "7.56.0",
+    "carbon-components": "^10.58.12",
+    "carbon-components-react": "^7.59.24",
     "carbon-icons": "^7.0.7",
     "classnames": "^2.5.1",
     "core-js": "3.26.1",
@@ -310,8 +310,8 @@
     "object-assign": "^4.1.1",
     "ol": "^6.5.0",
     "postcss-loader": "^3.0.0",
-    "prettier": "^2.1.2",
-    "prettier-config-carbon": "^0.4.0",
+    "prettier": "^2.8.8",
+    "prettier-config-carbon": "^0.11.0",
     "promise": "^8.0.2",
     "react": ">=16.14.0",
     "react-dom": ">=16.14.0",

packages/react/src/components/BarChartCard/BarChartCard.jsx

@@ -92,9 +92,10 @@ const BarChartCard = ({
   ...others
 }) => {
   // need to deep merge the nested content default props as default props only uses a shallow merge natively
-  const contentWithDefaults = useMemo(() => defaultsDeep({}, content, defaultProps.content), [
-    content,
-  ]);
+  const contentWithDefaults = useMemo(
+    () => defaultsDeep({}, content, defaultProps.content),
+    [content]
+  );
   const mergedI18n = useMemo(() => ({ ...defaultProps.i18n, ...i18n }), [i18n]);
   const {
     title,
@@ -117,10 +118,10 @@ const BarChartCard = ({
 
   const size = useMemo(() => increaseSmallCardSize(sizeProp, 'BarChartCard'), [sizeProp]);
 
-  const resizeHandles = useMemo(() => (isResizable ? getResizeHandles(children) : []), [
-    children,
-    isResizable,
-  ]);
+  const resizeHandles = useMemo(
+    () => (isResizable ? getResizeHandles(children) : []),
+    [children, isResizable]
+  );
 
   const memoizedGenerateSampleValues = useMemo(
     () =>

packages/react/src/components/BarChartCard/__snapshots__/BarChartCard.story.storyshot

@@ -259,9 +259,10 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
               Default
             </div>
             <button
+              aria-controls={null}
               aria-expanded={false}
               aria-haspopup={true}
-              aria-label="open and close list of options"
+              aria-label="Open and close list of options"
               className="iot--card--toolbar-date-range-action bx--overflow-menu bx--overflow-menu--lg"
               data-testid="Card-toolbar-range-picker"
               onClick={[Function]}
@@ -617,9 +618,10 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
               Default
             </div>
             <button
+              aria-controls={null}
               aria-expanded={false}
               aria-haspopup={true}
-              aria-label="open and close list of options"
+              aria-label="Open and close list of options"
               className="iot--card--toolbar-date-range-action bx--overflow-menu bx--overflow-menu--lg"
               data-testid="Card-toolbar-range-picker"
               onClick={[Function]}
@@ -769,9 +771,10 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/C
               Default
             </div>
             <button
+              aria-controls={null}
               aria-expanded={false}
               aria-haspopup={true}
-              aria-label="open and close list of options"
+              aria-label="Open and close list of options"
               className="iot--card--toolbar-date-range-action bx--overflow-menu bx--overflow-menu--lg"
               data-testid="Card-toolbar-range-picker"
               onClick={[Function]}

packages/react/src/components/Breadcrumb/Breadcrumb.story.jsx

@@ -90,8 +90,7 @@ CurrentPageWithAriaCurrent.storyName = 'current page with aria-current';
 
 CurrentPageWithAriaCurrent.parameters = {
   info: {
-    text:
-      'You can specify a BreadcrumbItem component as the current page with the `aria-current` prop by specifying `aria-current="page"`',
+    text: 'You can specify a BreadcrumbItem component as the current page with the `aria-current` prop by specifying `aria-current="page"`',
   },
 };
 

packages/react/src/components/Button/__snapshots__/Button.story.storyshot

@@ -235,7 +235,6 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/B
   >
     <div
       aria-atomic="true"
-      aria-labelledby="loading-id-1"
       aria-live="assertive"
       className="bx--loading bx--loading--small"
     >
@@ -291,7 +290,6 @@ exports[`Storybook Snapshot tests and console checks Storyshots 1 - Watson IoT/B
   >
     <div
       aria-atomic="true"
-      aria-labelledby="loading-id-2"
       aria-live="assertive"
       className="bx--loading bx--loading--small"
     >

packages/react/src/components/Button/_button.scss

@@ -19,7 +19,9 @@
   }
 }
 
-.#{$iot-prefix}--btn.#{$prefix}--btn.#{$prefix}--btn--ghost.#{$prefix}--btn--icon-only:not(.#{$iot-prefix}--btn-icon-selection--selected).#{$iot-prefix}--btn-icon-selection--recommended {
+.#{$iot-prefix}--btn.#{$prefix}--btn.#{$prefix}--btn--ghost.#{$prefix}--btn--icon-only:not(
+    .#{$iot-prefix}--btn-icon-selection--selected
+  ).#{$iot-prefix}--btn-icon-selection--recommended {
   border: 1px solid $support-02;
 }
 
@@ -79,7 +81,9 @@
   // For Carbon v.11 when the button sizes are adjusted we should take the oportunity to
   // see if we can remove this global ghost padding.
   .#{$iot-prefix}--btn.#{$prefix}--btn--ghost {
-    &:not(.#{$prefix}--btn--sm.#{$prefix}--btn--icon-only):not(.#{$iot-prefix}--menu-button__trigger) {
+    &:not(.#{$prefix}--btn--sm.#{$prefix}--btn--icon-only):not(
+        .#{$iot-prefix}--menu-button__trigger
+      ) {
       padding-left: $spacing-05;
       padding-right: $spacing-05;
     }

packages/react/src/components/Card/Card.test.e2e.jsx

@@ -199,7 +199,7 @@ describe('Card', () => {
       />
     );
 
-    cy.findByRole('button', { name: 'open and close list of options' }).click();
+    cy.findByRole('button', { name: 'Open and close list of options' }).click();
     cy.findByRole('menu').then(($el) => {
       const menu = $el[0].getBoundingClientRect();
       expect(menu.width).to.be.greaterThan(160);

packages/react/src/components/Card/CardTitle.jsx

@@ -196,7 +196,8 @@ export const CardTitle = (
           {
             [`${iotPrefix}--card--title--text--wrapped`]:
               hasTitleWrap && !subtitle && !hasExternalTitleTextTooltip,
-            [`${iotPrefix}--card-title__title-text--has-title-text-tooltip`]: hasExternalTitleTextTooltip,
+            [`${iotPrefix}--card-title__title-text--has-title-text-tooltip`]:
+              hasExternalTitleTextTooltip,
           }
         )}
         triggerText={title}

packages/react/src/components/Card/CardTypeContent.jsx

@@ -35,9 +35,10 @@ const CardTypeContent = ({ testId, isExpanded, type, data, content }) => {
   const listRef = useRef(null);
   const [listHeight, setListHeight] = useState();
 
-  const contentWithDefaults = useMemo(() => defaultsDeep({}, content, defaultProps.content), [
-    content,
-  ]);
+  const contentWithDefaults = useMemo(
+    () => defaultsDeep({}, content, defaultProps.content),
+    [content]
+  );
 
   const options = getChartOptions(type, data.length > 1, contentWithDefaults);