S Affixed Input Wrapper: Prefix & Suffix

To affix a symbol before or after a field.

This is an isolated feature from Bootstrap Input Group.

Use Cases

• APCD “Total Claims Value”
• Core Portal to replace Bootstrap .input-group*

* Bootstrap .input-group requires extra markup, which can make it cumbersome to combine React JSX components without the components having “external knowledge”.

Known Bugs

1. A s-affixed-input-wrapper__suffix overlaps with browser controls e.g.
   • <input type="number"> arrows
   • <input type="date"> calendar
   • <input type="time"> clock