Merge branch 'main' into breakpoint-helpers

carbon-design-system · Jul 19, 2022 · d479160 · d479160
2 parents b586d9f + e9465f8
commit d479160
Show file tree

Hide file tree

Showing 77 changed files with 2,418 additions and 5,534 deletions.
diff --git a/.yarn/cache/postcss-loader-npm-7.0.0-e0a0c61fcd-b8e51e9989.zip b/.yarn/cache/postcss-loader-npm-7.0.0-e0a0c61fcd-b8e51e9989.zip
diff --git a/docs/release.md b/docs/release.md
@@ -144,6 +144,9 @@ Friday of a sprint. To make the switch, you will need to:
 
 ### Post release
 
+- [ ] Update the
+      [release radar wiki page](https://github.com/carbon-design-system/carbon/wiki/Release-radar)
+
 After a release has switched packages from `next` to `latest`, it is important
 to monitor channels on Slack and issues on GitHub in case breaking changes may
 have occurred in the release.

diff --git a/e2e/components/Notifications/Notifications-test.e2e.js b/e2e/components/Notifications/Notifications-test.e2e.js
@@ -16,24 +16,24 @@ test.describe('Notifications', () => {
     test.describe(theme, () => {
       test('toast @vrt', async ({ page }) => {
         await snapshotStory(page, {
-          component: 'Notifications',
-          id: 'components-notifications--toast',
+          component: 'Toast',
+          id: 'components-notifications-toast--default',
           theme,
         });
       });
 
       test('inline @vrt', async ({ page }) => {
         await snapshotStory(page, {
-          component: 'Notifications',
-          id: 'components-notifications--inline',
+          component: 'Inline',
+          id: 'components-notifications-inline--default',
           theme,
         });
       });
 
       test('actionable @vrt', async ({ page }) => {
         await snapshotStory(page, {
-          component: 'Notifications',
-          id: 'components-notifications--actionable',
+          component: 'Actionable',
+          id: 'components-notifications-actionable--default',
           theme,
         });
       });
@@ -42,8 +42,8 @@ test.describe('Notifications', () => {
 
   test('accessibility-checker @avt', async ({ page }) => {
     await visitStory(page, {
-      component: 'Notifications',
-      id: 'components-notifications--toast',
+      component: 'Toast',
+      id: 'components-notifications-toast--default',
       globals: {
         theme: 'white',
       },

diff --git a/e2e/icons-react/__snapshots__/PublicAPI-test.js.snap b/e2e/icons-react/__snapshots__/PublicAPI-test.js.snap
@@ -784,6 +784,7 @@ Array [
   "IbmCloud",
   "IbmCloudDedicatedHost",
   "IbmCloudInternetServices",
+  "IbmCloudKubernetesService",
   "IbmCloudPakApplications",
   "IbmCloudPakBusinessAutomation",
   "IbmCloudPakData",

diff --git a/e2e/icons-vue/__snapshots__/PublicAPI-test.js.snap b/e2e/icons-vue/__snapshots__/PublicAPI-test.js.snap
@@ -3121,6 +3121,10 @@ Array [
   "IbmCloudInternetServices20",
   "IbmCloudInternetServices24",
   "IbmCloudInternetServices32",
+  "IbmCloudKubernetesService16",
+  "IbmCloudKubernetesService20",
+  "IbmCloudKubernetesService24",
+  "IbmCloudKubernetesService32",
   "IbmCloudPakApplications16",
   "IbmCloudPakApplications20",
   "IbmCloudPakApplications24",

diff --git a/e2e/icons/__snapshots__/PublicAPI-test.js.snap b/e2e/icons/__snapshots__/PublicAPI-test.js.snap
@@ -3120,6 +3120,10 @@ Array [
   "IbmCloudInternetServices20",
   "IbmCloudInternetServices24",
   "IbmCloudInternetServices32",
+  "IbmCloudKubernetesService16",
+  "IbmCloudKubernetesService20",
+  "IbmCloudKubernetesService24",
+  "IbmCloudKubernetesService32",
   "IbmCloudPakApplications16",
   "IbmCloudPakApplications20",
   "IbmCloudPakApplications24",

diff --git a/packages/grid/scss/_css-grid.scss b/packages/grid/scss/_css-grid.scss
@@ -247,21 +247,21 @@
         $span: $columns * 0.75;
         --cds-grid-columns: #{$span};
 
-        grid-column: span #{$span} / span #{$span};
+        grid-column: span list.slash($span, span) #{$span};
       }
 
       .#{$prefix}--#{$name}\:col-span-50 {
         $span: $columns * 0.5;
         --cds-grid-columns: #{$span};
 
-        grid-column: span #{$span} / span #{$span};
+        grid-column: span list.slash($span, span) #{$span};
       }
 
       .#{$prefix}--#{$name}\:col-span-25 {
         $span: $columns * 0.25;
         --cds-grid-columns: #{$span};
 
-        grid-column: span #{$span} / span #{$span};
+        grid-column: span list.slash($span, span) #{$span};
       }
     } @else {
       @include breakpoint($name) {
@@ -279,21 +279,21 @@
           $span: $columns * 0.75;
           --cds-grid-columns: #{$span};
 
-          grid-column: span #{$span} / span #{$span};
+          grid-column: span list.slash($span, span) #{$span};
         }
 
         .#{$prefix}--#{$name}\:col-span-50 {
           $span: $columns * 0.5;
           --cds-grid-columns: #{$span};
 
-          grid-column: span #{$span} / span #{$span};
+          grid-column: span list.slash($span, span) #{$span};
         }
 
         .#{$prefix}--#{$name}\:col-span-25 {
           $span: $columns * 0.25;
           --cds-grid-columns: #{$span};
 
-          grid-column: span #{$span} / span #{$span};
+          grid-column: span list.slash($span, span) #{$span};
         }
       }
     }
@@ -426,7 +426,7 @@
     @if is-smallest-breakpoint($key, $breakpoints) {
       --cds-grid-columns: #{$span};
 
-      grid-column: span #{$span} / span #{$span};
+      grid-column: span list.slash($span, span) #{$span};
     } @else {
       $previous-breakpoint: breakpoint-prev($key, $breakpoints);
       $previous-column-count: get-column-count(
@@ -439,7 +439,7 @@
         @include breakpoint($key) {
           --cds-grid-columns: #{$span};
 
-          grid-column: span #{$span} / span #{$span};
+          grid-column: span list.slash($span, span) #{$span};
         }
       }
     }

diff --git a/packages/grid/scss/_flex-grid.scss b/packages/grid/scss/_flex-grid.scss
@@ -70,13 +70,8 @@
     // Add a `max-width` to ensure content within each column does not blow out
     // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
     // do not appear to require this.
-    @if meta.function-exists('div', 'math') {
-      max-width: math.percentage(math.div($span, $columns));
-      flex: 0 0 math.percentage(math.div($span, $columns));
-    } @else {
-      max-width: math.percentage(($span / $columns));
-      flex: 0 0 math.percentage(($span / $columns));
-    }
+    max-width: math.percentage(math.div($span, $columns));
+    flex: 0 0 math.percentage(math.div($span, $columns));
   }
 }
 
@@ -87,11 +82,7 @@
 /// @group @carbon/grid
 @mixin -make-col-offset($span, $columns) {
   $offset: 0;
-  @if meta.function-exists('div', 'math') {
-    $offset: math.div($span, $columns);
-  } @else {
-    $offset: ($span / $columns);
-  }
+  $offset: math.div($span, $columns);
   @if $offset == 0 {
     margin-left: 0;
   } @else {

diff --git a/packages/grid/scss/_mixins.scss b/packages/grid/scss/_mixins.scss
@@ -64,13 +64,8 @@
     // Add a `max-width` to ensure content within each column does not blow out
     // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
     // do not appear to require this.
-    @if meta.function-exists('div', 'math') {
-      max-width: math.percentage(math.div($span, $columns));
-      flex: 0 0 math.percentage(math.div($span, $columns));
-    } @else {
-      max-width: math.percentage(($span / $columns));
-      flex: 0 0 math.percentage(($span / $columns));
-    }
+    max-width: math.percentage(math.div($span, $columns));
+    flex: 0 0 math.percentage(math.div($span, $columns));
   }
 }
 
@@ -81,11 +76,7 @@
 /// @group @carbon/grid
 @mixin -make-col-offset($span, $columns) {
   $offset: 0;
-  @if meta.function-exists('div', 'math') {
-    $offset: math.div($span, $columns);
-  } @else {
-    $offset: ($span / $columns);
-  }
+  $offset: math.div($span, $columns);
   @if $offset == 0 {
     margin-left: 0;
   } @else {

diff --git a/packages/icons/categories.yml b/packages/icons/categories.yml
@@ -560,6 +560,7 @@ categories:
           - ibm--open-enterprise-languages
           - ibm-cloud--dedicated-host
           - ibm-cloud--internet-services
+          - ibm-cloud--kubernetes-service
           - ibm-cloud--security-compliance-center
           - ibm-cloud--subnets
           - ibm-cloud--transit-gateway

diff --git a/packages/icons/icons.yml b/packages/icons/icons.yml
@@ -5370,7 +5370,7 @@
     - 32
 - name: data-quality-definition
   friendly_name: Data quality definition
-  aliases: 
+  aliases:
     - data quality
     - definition
     - data
@@ -8823,7 +8823,7 @@
     - 32
 - name: ibm--open-enterprise-languages
   friendly_name: IBM® Open Enterprise Languages
-  aliases: 
+  aliases:
     - Open Enterprise Languages
     - z16
   sizes:
@@ -8866,6 +8866,16 @@
     - cloud
   sizes:
     - 32
+- name: ibm-cloud--kubernetes-service
+  friendly_name: IBM Cloud® Kubernetes Services
+  aliases:
+    - services
+    - cloud
+    - hybrid
+    - IBM Cloud®
+    - Kubernetes
+  sizes:
+    - 32
 - name: ibm-cloud--security-compliance-center
   friendly_name: IBM Cloud® Security and Compliance Center
   aliases:
@@ -8922,13 +8932,13 @@
     - 32
 - name: ibm-cloud-pak--business-automation
   friendly_name: IBM Cloud Pak® for Business Automation
-  aliases: 
+  aliases:
     - enterprise
     - app
     - automation
     - IBM Cloud Pak®
     - cloud
-    - hybrid    
+    - hybrid
   sizes:
     - 32
 - name: ibm-cloud-pak--data
@@ -8952,8 +8962,8 @@
   sizes:
     - 32
 - name: ibm-cloud-pak--MANTA-automated-data-lineage
-  friendly_name: MANTA Automated Data Lineage for IBM Cloud Pak® for Data 
-  aliases: 
+  friendly_name: MANTA Automated Data Lineage for IBM Cloud Pak® for Data
+  aliases:
     - data
     - IBM Cloud Pak® for Data
     - data lineage
@@ -9046,8 +9056,8 @@
   sizes:
     - 32
 - name: ibm-z--cloud-mod-stack
-  friendly_name: IBM Z® Cloud Modernization Stack 
-  aliases: 
+  friendly_name: IBM Z® Cloud Modernization Stack
+  aliases:
     - cloud
     - modernization
     - IBM Z®
@@ -9056,8 +9066,8 @@
   sizes:
     - 32
 - name: ibm-z-cloud--provisioning
-  friendly_name: 	IBM Z® and Cloud Modernization Stack Provisioning
-  aliases: 
+  friendly_name: IBM Z® and Cloud Modernization Stack Provisioning
+  aliases:
     - IBM Z®
     - cloud
     - provisioning
@@ -9066,8 +9076,8 @@
   sizes:
     - 32
 - name: ibm-z-os--package-manager
-  friendly_name: IBM® z/OS Package Manager 
-  aliases: 
+  friendly_name: IBM® z/OS Package Manager
+  aliases:
     - IBM Z®
     - cloud
     - mainframe
@@ -10831,7 +10841,7 @@
     - 32
 - name: logo--kubernetes
   friendly_name: Logo Kubernetes
-  aliases: 
+  aliases:
     - brand
     - emblem
     - logotype
@@ -11529,14 +11539,14 @@
     - 32
 - name: microservices--1
   friendly_name: Microservices 1
-  aliases: 
+  aliases:
     - microservices 1
     - systems
   sizes:
     - 32
 - name: microservices--2
   friendly_name: Microservices 2
-  aliases: 
+  aliases:
     - microservices 2
     - systems
   sizes:
@@ -14646,7 +14656,7 @@
     - 32
 - name: rule--data-quality
   friendly_name: Rule data quality
-  aliases: 
+  aliases:
     - rule
     - governance
     - control
@@ -15268,7 +15278,7 @@
     - 32
 - name: service-id
   friendly_name: Service ID
-  aliases: 
+  aliases:
     - service ID
     - identification
     - settings
@@ -19492,7 +19502,7 @@
     - 32
 - name: workflow-automation
   friendly_name: Workflow automation
-  aliases: 
+  aliases:
     - workflow
     - automation
     - gear

diff --git a/packages/icons/src/svg/32/ibm-cloud--kubernetes-service.svg b/packages/icons/src/svg/32/ibm-cloud--kubernetes-service.svg