tutorbook
tutorbook copied to clipboard
Remove pre-filled workaround for notch styling
trafficstars
Right now (in @tutorbook/subject-select), I'm using a this.state.inputValueWorkaround field to ensure that the input value contains a non-breaking space (i.e. &nsbp; or \xa0) whenever there are subjects selected (i.e. when there are chips within the TextField).
Workaround below (in src/subject-select/lib/subject-select.tsx on line 87):
/**
* Workaround for styling the input as if it has content. If there are
* subjects selected (in the given `subjects` object), this will return a
* string containing a space (`' '`) so that the `TextField` styles itself as
* if it were filled.
* @todo Ideally, remove this workaround. But instead, make the `&nsbp;`
* actually show up as a non-breaking space (i.e. nothing).
* @see {@link https://github.com/jamesmfriedman/rmwc/issues/601}
* @return {string} The input value (either `' '` or `''`).
*/
getInputValue(
subjects: { [subject: string]: boolean } = this.state.subjects,
): string {
const selected = Object.values(subjects).reduce((a, b) => a || b, false);
return selected ? '\xa0' : '';
}
See this issue and this issue for more info on how I went about implementing our SubjectSelect component.
This will stay open until these two issues are resolved by @jamesmfriedman: