fix(component): SHIPPING-1526 adds description to Select & MultiSelect

bigcommerce · Apr 24, 2020 · efa27cd · efa27cd
1 parent 29b073b
commit efa27cd
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 4 deletions.
diff --git a/packages/big-design/src/components/MultiSelect/types.ts b/packages/big-design/src/components/MultiSelect/types.ts
@@ -1,11 +1,12 @@
 import { Placement } from '@popperjs/core';
-import { RefObject } from 'react';
+import React, { RefObject } from 'react';
 
 import { InputProps } from '../Input';
 import { SelectAction, SelectOption } from '../Select';
 
 interface BaseSelect extends Omit<React.HTMLAttributes<HTMLInputElement>, 'children'> {
   action?: SelectAction;
+  description?: React.ReactChild;
   disabled?: boolean;
   error?: InputProps['error'];
   filterable?: boolean;

diff --git a/packages/big-design/src/components/Select/types.ts b/packages/big-design/src/components/Select/types.ts
@@ -1,11 +1,12 @@
 import { Placement } from '@popperjs/core';
-import { RefObject } from 'react';
+import React, { RefObject } from 'react';
 
 import { InputProps } from '../Input';
 import { ListItemProps } from '../List/Item';
 
 interface BaseSelect extends Omit<React.HTMLAttributes<HTMLInputElement>, 'children'> {
   action?: SelectAction;
+  description?: React.ReactChild;
   disabled?: boolean;
   error?: InputProps['error'];
   filterable?: boolean;

diff --git a/packages/docs/PropTables/MultiSelectPropTable.tsx b/packages/docs/PropTables/MultiSelectPropTable.tsx
@@ -3,7 +3,16 @@ import React from 'react';
 import { Code, NextLink, Prop, PropTable, PropTableWrapper } from '../components';
 
 const selectProps: Prop[] = [
-  { name: 'action', types: 'SelectAction', description: 'Action option displayed at the end of the list.' },
+  {
+    name: 'action',
+    types: 'SelectAction',
+    description: 'Action option displayed at the end of the list.'
+  },
+  {
+    name: 'description',
+    types: 'string | FormControlDescription',
+    description: 'Append a description to the select field.'
+  },
   {
     name: 'disabled',
     defaultValue: 'false',

diff --git a/packages/docs/PropTables/SelectPropTable.tsx b/packages/docs/PropTables/SelectPropTable.tsx
@@ -3,7 +3,16 @@ import React from 'react';
 import { Code, NextLink, Prop, PropTable, PropTableWrapper } from '../components';
 
 const selectProps: Prop[] = [
-  { name: 'action', types: 'SelectAction', description: 'Action option displayed at the end of the list.' },
+  {
+    name: 'action',
+    types: 'SelectAction',
+    description: 'Action option displayed at the end of the list.',
+  },
+  {
+    name: 'description',
+    types: 'string | FormControlDescription',
+    description: 'Append a description to the select field.',
+  },
   {
     name: 'disabled',
     defaultValue: 'false',