Merge branch 'master' into 7750-toggle-small-label

carbon-design-system · Feb 5, 2021 · 90a0440 · 90a0440
2 parents 0046d4a + 47665bd
commit 90a0440
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/packages/components/src/components/multi-select/_multi-select.scss b/packages/components/src/components/multi-select/_multi-select.scss
@@ -80,6 +80,11 @@
     @include focus-outline('outline');
   }
 
+  .#{$prefix}--multi-select--filterable.#{$prefix}--multi-select--selected
+    .#{$prefix}--text-input {
+    padding-left: 0;
+  }
+
   .#{$prefix}--multi-select--filterable.#{$prefix}--list-box--disabled:hover
     .#{$prefix}--text-input {
     background-color: $field-01;

diff --git a/packages/react/src/components/DataTable/TableHeader.js b/packages/react/src/components/DataTable/TableHeader.js
@@ -14,6 +14,7 @@ import {
   ArrowsVertical20 as Arrows,
 } from '@carbon/icons-react';
 import { sortStates } from './state/sorting';
+import { useId } from '../../internal/useId';
 
 const { prefix } = settings;
 
@@ -65,6 +66,8 @@ const TableHeader = React.forwardRef(function TableHeader(
   },
   ref
 ) {
+  const uniqueId = useId('table-sort');
+
   if (!isSortable) {
     return (
       <th
@@ -88,7 +91,6 @@ const TableHeader = React.forwardRef(function TableHeader(
       isSortHeader && sortDirection === sortStates.DESC,
   });
   const ariaSort = !isSortHeader ? 'none' : sortDirections[sortDirection];
-  const uniqueId = Math.random();
   const sortDescription = t('carbon.table.header.icon.description', {
     header: children,
     sortDirection,
@@ -103,12 +105,12 @@ const TableHeader = React.forwardRef(function TableHeader(
       colSpan={colSpan}
       ref={ref}
       scope={scope}>
-      <div style={{ display: 'none' }} id={`usage-description-${uniqueId}`}>
+      <div style={{ display: 'none' }} id={uniqueId}>
         {sortDescription}
       </div>
       <button
         type="button"
-        aria-describedby={`usage-description-${uniqueId}`}
+        aria-describedby={uniqueId}
         className={className}
         onClick={onClick}
         {...rest}>

diff --git a/packages/themes/src/g100.js b/packages/themes/src/g100.js
@@ -133,7 +133,7 @@ export const decorative01 = gray70;
 export const buttonSeparator = '#161616';
 
 export const skeleton01 = '#353535';
-export const skeleton02 = gray80;
+export const skeleton02 = gray70;
 
 export {
   // Type