fix(all): remove multi, use isMulti only

rvsia · rvsia · commit ca7901914445 · 2020-03-18T16:20:20.000+01:00
diff --git a/packages/common/src/demoschema.js b/packages/common/src/demoschema.js
@@ -53,8 +53,7 @@ const superSchema = {
                 ? [
                     ...genereateField(curr, 'isClearable', { isClearable: true }),
                     ...genereateField(curr, 'isSearchable', { isSearchable: true }),
-                    ...genereateField(curr, 'isMulti', { isMulti: true }),
-                    ...genereateField(curr, 'multi', { multi: true })
+                    ...genereateField(curr, 'isMulti', { isMulti: true })
                   ]
                 : []),
               ...(curr === 'checkbox'
diff --git a/packages/common/src/select/index.js b/packages/common/src/select/index.js
@@ -57,18 +57,16 @@ Select.defaultProps = {
   pluckSingleValue: true
 };
 
-const DataDrivenSelect = ({ multi, ...props }) => {
-  const isMulti = props.isMulti || multi;
+const DataDrivenSelect = ({ isMulti, ...props }) => {
   const closeMenuOnSelect = !isMulti;
   return <Select hideSelectedOptions={false} isMulti={isMulti} {...props} closeMenuOnSelect={closeMenuOnSelect} />;
 };
 
 DataDrivenSelect.propTypes = {
   value: PropTypes.any,
   onChange: PropTypes.func,
-  multi: PropTypes.bool,
-  placeholder: PropTypes.string,
   isMulti: PropTypes.bool,
+  placeholder: PropTypes.string,
   classNamePrefix: PropTypes.string.isRequired
 };
 
diff --git a/packages/mui-component-mapper/src/components/select.js b/packages/mui-component-mapper/src/components/select.js
@@ -34,12 +34,12 @@ const Select = (props) => {
         {...input}
         options={options.filter((option) => Object.prototype.hasOwnProperty.call(option, 'value') && option.value !== null)}
         placeholder={placeholder || 'Please choose'}
-        value={options.filter(({ value }) => (rest.multi ? input.value.includes(value) : value === input.value))}
-        isMulti={rest.multi}
+        value={options.filter(({ value }) => (rest.isMulti ? input.value.includes(value) : value === input.value))}
+        isMulti={rest.isMulti}
         isSearchable={!!isSearchable}
         isClearable={false}
         hideSelectedOptions={false}
-        closeMenuOnSelect={!rest.multi}
+        closeMenuOnSelect={!rest.isMulti}
         noOptionsMessage={() => 'No option found'}
         invalid={invalid}
         isDisabled={isDisabled}
@@ -50,7 +50,7 @@ const Select = (props) => {
             shrink: true
           }
         }}
-        onChange={(option) => input.onChange(rest.multi ? selectValue(option) : option ? option.value : undefined)}
+        onChange={(option) => input.onChange(rest.isMulti ? selectValue(option) : option ? option.value : undefined)}
         input={input}
         label={label}
         isRequired={isRequired}
diff --git a/packages/parsers/src/parsers/miq.js b/packages/parsers/src/parsers/miq.js
@@ -74,7 +74,7 @@ const miqParser = (
         }
 
         if (field.options.force_multi_value) {
-          newField.multi = true;
+          newField.isMulti = true;
         }
 
         if (options.length !== 0) {
diff --git a/packages/parsers/src/tests/miq/miq-schemas/output.js b/packages/parsers/src/tests/miq/miq-schemas/output.js
@@ -265,7 +265,7 @@ const output = {
                   title: 'Dropdown multiselect',
                   dataType: 'string',
                   component: componentTypes.SELECT,
-                  multi: true,
+                  isMulti: true,
                   options: [
                     {
                       label: '<None>',
diff --git a/packages/pf3-component-mapper/demo/demo-schemas/sandbox.js b/packages/pf3-component-mapper/demo/demo-schemas/sandbox.js
@@ -50,7 +50,7 @@ const output = {
                   label: 'bar'
                 }
               ],
-              multi: true
+              isMulti: true
             },
             {
               title: 'Text boxes',
@@ -409,7 +409,7 @@ const output = {
                   title: 'Dropdown multiselect',
                   dataType: 'string',
                   component: components.SELECT,
-                  multi: true,
+                  isMulti: true,
                   options: [
                     {
                       label: '<None>',
@@ -459,7 +459,7 @@ const output = {
                   label: 'Clearable dropdown',
                   title: 'Clearable dropdown',
                   component: components.SELECT,
-                  multi: true,
+                  isMulti: true,
                   isClearable: true,
                   options: [
                     {
diff --git a/packages/pf3-component-mapper/demo/index.js b/packages/pf3-component-mapper/demo/index.js
@@ -26,7 +26,7 @@ const selectSchema = {
     component: 'select',
     name: 'async-single',
     label: 'Async single',
-    multi: true,
+    isMulti: true,
     loadOptions
   },{
     component: 'select',
@@ -39,7 +39,7 @@ const selectSchema = {
     name: 'async-multi-search',
     label: 'Async multi search',
     isSearchable: true,
-    multi: true,
+    isMulti: true,
     loadOptions
   }, {
     component: 'select',
@@ -61,7 +61,7 @@ const selectSchema = {
     validateOnMount: true,
     isDisabled: true,
     isClearable: true,
-    multi: true,
+    isMulti: true,
     isSearchable: true,
     placeholder: 'Placeholder',
     validate: [{
@@ -84,7 +84,7 @@ const selectSchema = {
     isRequired: true,
     validateOnMount: true,
     isClearable: true,
-    multi: false,
+    isMulti: false,
     isSearchable: true,
     placeholder: 'Placeholder',
     validate: [{
diff --git a/packages/pf3-component-mapper/src/components/select/select.js b/packages/pf3-component-mapper/src/components/select/select.js
@@ -171,13 +171,12 @@ class Select extends Component {
       const [title, isPlaceholder] = getDropdownText(input.value, props.placeholder, options);
       const searchableInput = {
         ...input,
-        onChange:
-          props.isMulti || props.multi
-            ? input.onChange
-            : (...args) => {
-                this.handleToggleOpen();
-                return input.onChange(...args);
-              }
+        onChange: props.isMulti
+          ? input.onChange
+          : (...args) => {
+              this.handleToggleOpen();
+              return input.onChange(...args);
+            }
       };
       return (
         <div className={`${props.classNamePrefix}-button`}>
@@ -217,7 +216,7 @@ class Select extends Component {
                 tabSelectsValue={false}
                 menuIsOpen
                 backspaceRemovesValue={false}
-                isMulti={props.isMulti || props.multi}
+                isMulti={props.isMulti}
                 placeholder="Search..."
                 components={{
                   ClearIndicator,
diff --git a/packages/pf3-component-mapper/src/tests/form-fields/select/select.test.js b/packages/pf3-component-mapper/src/tests/form-fields/select/select.test.js
@@ -86,7 +86,7 @@ describe('<SelectField />', () => {
     const wrapper = mount(
       <SelectField
         {...initialProps}
-        multi
+        isMulti
         input={{
           name: 'select-input',
           onChange: changeSpy,
diff --git a/packages/pf4-component-mapper/demo/demo-schemas/sandbox.js b/packages/pf4-component-mapper/demo/demo-schemas/sandbox.js
@@ -259,7 +259,7 @@ const output = {
                   dataType: 'string',
                   isSearchable: true,
                   isClearable: true,
-                  multi: true,
+                  isMulti: true,
                   component: components.SELECT,
                   loadOptions: asyncLoadOptions
                 },
@@ -270,7 +270,7 @@ const output = {
                   dataType: 'string',
                   isSearchable: true,
                   isClearable: false,
-                  multi: true,
+                  isMulti: true,
                   component: components.SELECT,
                   options: [
                     {
@@ -326,7 +326,7 @@ const output = {
                   dataType: 'string',
                   component: components.SELECT,
                   isSearchable: true,
-                  multi: true,
+                  isMulti: true,
                   simpleValue: false,
                   options: [
                     {
@@ -397,7 +397,7 @@ const output = {
                   name: 'dropdown_list_5',
                   label: 'Creatable multi select',
                   component: components.SELECT,
-                  multi: true,
+                  isMulti: true,
                   isClearable: true,
                   selectVariant: 'createable',
                   options: [
diff --git a/packages/pf4-component-mapper/src/components/select/select.js b/packages/pf4-component-mapper/src/components/select/select.js
@@ -187,12 +187,12 @@ Select.defaultProps = {
   menuIsPortal: false
 };
 
-const DataDrivenSelect = ({ multi, ...props }) => <Select hideSelectedOptions={false} isMulti={multi} {...props} closeMenuOnSelect={!multi} />;
+const DataDrivenSelect = ({ isMulti, ...props }) => <Select hideSelectedOptions={false} isMulti={isMulti} {...props} closeMenuOnSelect={!isMulti} />;
 
 DataDrivenSelect.propTypes = {
   value: PropTypes.any,
   onChange: PropTypes.func,
-  multi: PropTypes.bool,
+  isMulti: PropTypes.bool,
   placeholder: PropTypes.string
 };
 
diff --git a/packages/pf4-component-mapper/src/tests/select/select.test.js b/packages/pf4-component-mapper/src/tests/select/select.test.js
@@ -133,7 +133,7 @@ describe('<Select />', () => {
 
   it('should map props correctly from DataDrivenSelect to Select', () => {
     const props = {
-      multi: true,
+      isMulti: true,
       options: [
         { label: 'a', value: 1 },
         { label: 'b', value: 2 }
diff --git a/packages/react-form-renderer/src/tests/parsers/output.js b/packages/react-form-renderer/src/tests/parsers/output.js
@@ -265,7 +265,7 @@ const output = {
                   title: 'Dropdown multiselect',
                   dataType: 'string',
                   component: componentTypes.SELECT,
-                  multi: true,
+                  isMulti: true,
                   options: [
                     {
                       label: '<None>',
diff --git a/packages/react-renderer-demo/src/app/pages/live-editor.js b/packages/react-renderer-demo/src/app/pages/live-editor.js
@@ -285,7 +285,7 @@ const baseStructure = {
                   title: 'Dropdown multiselect',
                   dataType: 'string',
                   component: components.SELECT,
-                  multi: true,
+                  isMulti: true,
                   options: [
                     {
                       label: '<None>',
diff --git a/packages/react-renderer-demo/src/app/pages/renderer/component-api.md b/packages/react-renderer-demo/src/app/pages/renderer/component-api.md
@@ -79,7 +79,7 @@ All those components provides a shared group of props:
 |options|array|Options in format of { label: 'Label', value: value }|
 |loadOptions|function|A function for loading a options asynchronously|
 |loadingMessage|node/string|A message which will shown as a placeholder during the loading|
-|simpleValue|boolean|Simple value (no multi)|
+|simpleValue|boolean|Simple value (no isMulti)|
 |isMulti|boolean|Allows to choose more options|
 |isClearable|boolean|Allows to clear the selected option|
 |isSearchable|boolean|Allows to search in the options|
diff --git a/packages/react-renderer-demo/src/app/pages/renderer/migration-guide.md b/packages/react-renderer-demo/src/app/pages/renderer/migration-guide.md
@@ -153,6 +153,10 @@ import { componentMapper } from '@data-driven-forms/pf4-component-mapper'
 
 -   predictSteps prop is now removed, wizard always predicts steps
 
+### multi removed for selects
+
+-   use isMulti instead
+
 </Grid>
 <Grid item xs={false} md={2}>
   <ListOfContents file="renderer/migration-guide" />
diff --git a/packages/react-renderer-demo/src/app/src/components/navigation/examples-definitions.js b/packages/react-renderer-demo/src/app/src/components/navigation/examples-definitions.js
@@ -181,7 +181,7 @@ export const baseExamples = [
         value: 'Select'
       },
       {
-        name: 'multi',
+        name: 'isMulti',
         title: 'Multi'
       },
       {

Original file line number	Diff line number	Diff line change
`@@ -74,7 +74,7 @@ const miqParser = (`
`74`	`74`	`}`
`75`	`75`
`76`	`76`	`if (field.options.force_multi_value) {`
`77`		`- newField.multi = true;`
	`77`	`+ newField.isMulti = true;`
`78`	`78`	`}`
`79`	`79`
`80`	`80`	`if (options.length !== 0) {`
Original file line number	Diff line number	Diff line change
`@@ -265,7 +265,7 @@ const output = {`
`265`	`265`	`title: 'Dropdown multiselect',`
`266`	`266`	`dataType: 'string',`
`267`	`267`	`component: componentTypes.SELECT,`
`268`		`- multi: true,`
	`268`	`+ isMulti: true,`
`269`	`269`	`options: [`
`270`	`270`	`{`
`271`	`271`	`label: '<None>',`