Rework dual list

[Hyperkid123]

Dual list was not proplely updating form state, specifically pristine/dirty states. This was cause due to react refs and async nature of executing events via refs. Proposed solution which adds timeout to manually trigger onBlur and onFocus events is future proof and will probably result in more bugs down the line.

Now the component uses purely React state without any refs which will ensure synchronous behavior.

[Hyperkid123]

@miq-bot add-reviewer @rvsia
@miq-bot add-reviewer @martinpovolny
@miq-bot add-label enhancement

[rvsia]

Looks great! 👍

I made some changes in my catalog-form PR, like adding paddingBottom to lists (because of buttons), could you please converted them here? Thanks!

CTRL+LeftClick on mutliple options doesn't work. 😿

And I think you should implement at least move all to right, it doesn't seem as a big change and it will be probably in the next converted form. 🔢 (MoveAllToLeft is not probably anywhere, it was just a bonus. 🎁 😄 )

[rvsia]

• This issue is caused probably when you don't provide any initialValue:
  Warning: Failed prop type: Invalid prop input.valueof typestringsupplied toDualList, expected an array.

I also noticed, that options are added to right and the value is on the left. I think it should be opposite.

[Hyperkid123]

• This issue is caused probably when you don't provide any initialValue:

Reason why it is not working, is because its expects array of strings. You are comparing array of numbers and strings which will fail. Right now values has to be always strings. If we ever need to changes this to support numbers objects etc, we will write custom equal function. Right now its not needed.

[rvsia]

Tested in UI and everything looks great! 🥇

[miq-bot]

Checked commits Hyperkid123/manageiq-ui-classic@5fa7864~...54aae3f with ruby 2.3.3, rubocop 0.52.1, haml-lint 0.20.0, and yamllint 1.10.0
0 files checked, 0 offenses detected
Everything looks fine. 🍰