Defining a valueComponent without defining value/defaultValues throws an error

[rvignesh89]

I'm trying to create a DropdownList with a valueComponent without a defaultValue expecting to display an empty value. I'm doing it like this(using redux-form fields),

<Field
    name="label"
    component={Dropdown}
    itemComponent={LabelDropDownListItem}
    valueField="id"
    textField={item => item.name}
    valueComponent={LabelDropDownListItem}
    data={labels}/>

And the LabelDropDownLisItem looks like this,

const LabelDropDownListItem = CSSModules(({item}) => (
  <div styleName="label-item">
    <div>{item.name}</div>
    <div styleName="label-item__color" style={{background: item.color}} />
  </div>
), styles)

But rendering this causes an exception in my LabelDropDownListItem saying cannot access name of undefined. I thought this behaviour didn't match the documentation so just to see whats happening I went into the code and found this in DropdownListInput.js

      <div className="rw-input rw-dropdown-list-input">
        {!value && placeholder
          ? <span className='rw-placeholder'>{placeholder}</span>
          : Component
            ? <Component item={value} />
            : dataText(value, textField)
        }
      </div>

If I'm correct, since I don't have a value or a placeholder and a valueComponent exists the code tries to render the component for the value which is undefined. I modified the code to the following which does work. Let me know if this makes sense.

      <div className="rw-input rw-dropdown-list-input">
        {!value && placeholder
          ? <span className='rw-placeholder'>{placeholder}</span>
          : value && Component
            ? <Component item={value} />
            : value
              ? dataText(value, textField)
              : ''
        }
      </div>

P.S: Found react-widgets to be really easy to use and highly customisable 👏

[jquense]

Hi there and thanks for the kind words. Yes you need to handle the value possibly being null in your component. I don't think we'll change it since there are use cases where you might want to control how empty values are displayed but we should probably make a note about it n the docs

[rvignesh89]

Alright. And yes, a mention of this in the docs would make it better. Thanks for the info!