fix(core/form-controls): Input, Select, Textarea readonly states

[goncalosard]

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (yarn build) was run locally and any changes were pushed
• Unit tests (yarn test) were run locally and passed
• Visual Regression Tests (yarn visual-regression) were run locally and passed
• Linting (npm lint) was run locally and passed

Pull request type

Please check the type of change your PR introduces:

• Bug fix
• Feature
• Refactoring (no functional changes, no API changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

Issue [IX-143]

What is the new behavior?

• Placeholder are hidden when readonly is active
• Changed cursor style to default when readonly is active

All other topics mentioned on the issue, look already correct.

Code tested

    <form class="needs-validation m-2">
      <input
        class="form-control"
        defaultValue=""
        placeholder="Enter text here"
        type="text"
        readonly
      />
    </form>

    <ix-select readonly selected-indices="1">
      <ix-select-item label="Item 1" value="1"></ix-select-item>
      <ix-select-item label="Item 2" value="2"></ix-select-item>
      <ix-select-item label="Item 3" value="3"></ix-select-item>
      <ix-select-item label="Item 4" value="4"></ix-select-item>
    </ix-select>

    <textarea
      class="form-control"
      placeholder="Enter text here"
      readonly
    ></textarea>

Does this introduce a breaking change?

• Yes
• No

Testing

Other information

[danielleroux]

Overall we should a testcases (visual regression) to test all readonly states

[nuke-ellington]

lgtm