Atlaskit datePicker hidden by the container div

[MANJUPREM]

I am using atlaskit date picker and DateTime picker. I am facing issue with position datePicker hidden by the container div. In issue pannel

• atlaskit/datetime-picker - version 10.0.1
• Reactjs - 16.13.0

<DatePicker
  label={label}
  isRequired={Data1.required}
  onChange={(e) => this.onChangeField(e, key, type, 'Date')}
  defaultValue={defValue}
  isDisabled={!this.props.isEditIssuePermission}
  dateFormat="DD/MM/YYYY"
  placeholder="Select Date"
/>

[m.ahrens]

Hi,

you could try adding a menuPortal to the DatePicker’s select props.
Should look something like this then:

<DatePicker
  label={label}
  isRequired={Data1.required}
  onChange={(e) => this.onChangeField(e, key, type, 'Date')}
  defaultValue={defValue}
  isDisabled={!this.props.isEditIssuePermission}
  dateFormat="DD/MM/YYYY"
  placeholder="Select Date"
  selectProps={{
	menuPortalTarget: document.body,
	styles: {
	   menuPortal: (base: any) => ({
	      ...base,
	      zIndex: 9999,
	   }),
    },
  }}
/>

For more info, view React-Select documentation.