Merge branch 'main' into combobox-ref

carbon-design-system · Jul 8, 2021 · d379845 · d379845
2 parents fa6e87d + 0f73241
commit d379845
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 7 deletions.
diff --git a/packages/components/src/components/list-box/_list-box.scss b/packages/components/src/components/list-box/_list-box.scss
@@ -754,6 +754,9 @@ $list-box-menu-width: rem(300px);
   .#{$prefix}--list-box--up.#{$prefix}--dropdown--sm
     .#{$prefix}--list-box__menu,
   .#{$prefix}--list-box--up.#{$prefix}--list-box--sm
+    .#{$prefix}--list-box__menu,
+  .#{$prefix}--list-box--up
+    .#{$prefix}--list-box--sm
     .#{$prefix}--list-box__menu {
     bottom: 2rem;
   }
@@ -766,6 +769,9 @@ $list-box-menu-width: rem(300px);
   .#{$prefix}--list-box--up.#{$prefix}--dropdown--lg
     .#{$prefix}--list-box__menu,
   .#{$prefix}--list-box--up.#{$prefix}--list-box--lg
+    .#{$prefix}--list-box__menu,
+  .#{$prefix}--list-box--up
+    .#{$prefix}--list-box--lg
     .#{$prefix}--list-box__menu {
     bottom: 3rem;
   }

diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap
@@ -985,9 +985,7 @@ Map {
         "overflowMenuOnHover": Object {
           "type": "bool",
         },
-        "shouldShowBorder": Object {
-          "type": "bool",
-        },
+        "shouldShowBorder": [Function],
         "size": Object {
           "args": Array [
             Array [
@@ -1624,9 +1622,7 @@ Map {
       "overflowMenuOnHover": Object {
         "type": "bool",
       },
-      "shouldShowBorder": Object {
-        "type": "bool",
-      },
+      "shouldShowBorder": [Function],
       "size": Object {
         "args": Array [
           Array [
@@ -3566,6 +3562,7 @@ Map {
       "defaultProps": Object {
         "ariaLabel": "Choose an item",
         "compareItems": [Function],
+        "direction": "bottom",
         "disabled": false,
         "filterItems": [Function],
         "initialSelectedItems": Array [],
@@ -3585,6 +3582,15 @@ Map {
           "isRequired": true,
           "type": "func",
         },
+        "direction": Object {
+          "args": Array [
+            Array [
+              "top",
+              "bottom",
+            ],
+          ],
+          "type": "oneOf",
+        },
         "disabled": Object {
           "type": "bool",
         },

diff --git a/packages/react/src/components/DataTable/Table.js b/packages/react/src/components/DataTable/Table.js
@@ -9,6 +9,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { settings } from 'carbon-components';
+import deprecate from '../../prop-types/deprecate.js';
 
 const { prefix } = settings;
 
@@ -70,7 +71,12 @@ Table.propTypes = {
   /**
    * `false` If true, will remove the table border
    */
-  shouldShowBorder: PropTypes.bool,
+  shouldShowBorder: deprecate(
+    PropTypes.bool,
+    'The `shouldShowBorder` prop has been deprecated and can be safely removed.' +
+      'This prop will be removed in the next major release of ' +
+      '`carbon-components-react`'
+  ),
 
   /**
    *  Change the row height of table. Currently supports `xs`, `sm`, `md`, `lg`, and `xl`.

diff --git a/packages/react/src/components/MultiSelect/FilterableMultiSelect.js b/packages/react/src/components/MultiSelect/FilterableMultiSelect.js
@@ -35,6 +35,11 @@ export default class FilterableMultiSelect extends React.Component {
      */
     ariaLabel: PropTypes.string,
 
+    /**
+     * Specify the direction of the multiselect dropdown. Can be either top or bottom.
+     */
+    direction: PropTypes.oneOf(['top', 'bottom']),
+
     /**
      * Disable the control
      */
@@ -165,6 +170,7 @@ export default class FilterableMultiSelect extends React.Component {
   static defaultProps = {
     ariaLabel: 'Choose an item',
     compareItems: defaultCompareItems,
+    direction: 'bottom',
     disabled: false,
     filterItems: defaultFilterItems,
     initialSelectedItems: [],
@@ -277,6 +283,7 @@ export default class FilterableMultiSelect extends React.Component {
     const {
       ariaLabel,
       className: containerClassName,
+      direction,
       disabled,
       filterItems,
       items,
@@ -312,6 +319,7 @@ export default class FilterableMultiSelect extends React.Component {
         [`${prefix}--multi-select__wrapper--inline--invalid`]:
           inline && invalid,
         [`${prefix}--list-box__wrapper--inline--invalid`]: inline && invalid,
+        [`${prefix}--list-box--up`]: direction === 'top',
       }
     );
     const helperId = !helperText

diff --git a/...act/src/components/MultiSelect/__tests__/__snapshots__/FilterableMultiSelect-test.js.snap b/...act/src/components/MultiSelect/__tests__/__snapshots__/FilterableMultiSelect-test.js.snap
@@ -4,6 +4,7 @@ exports[`MultiSelect.Filterable should render 1`] = `
 <MultiSelect.Filterable
   ariaLabel="Choose an item"
   compareItems={[Function]}
+  direction="bottom"
   disabled={false}
   filterItems={[Function]}
   id="test-filterable-multiselect"