new mechanism to handle help more in line with how carbon works

This commit is contained in:
burnettk 2023-01-30 11:53:35 -05:00
parent bd9ef740e6
commit 799ea492dd
3 changed files with 18 additions and 7 deletions

View File

@ -85,6 +85,11 @@ export default function BaseInputTemplate<
labelToUse = `${labelToUse}*`;
}
let helperText = null;
if (uiSchema && uiSchema['ui:help']) {
helperText = uiSchema['ui:help'];
}
let invalid = false;
let errorMessageForField = null;
if (rawErrors && rawErrors.length > 0) {
@ -103,6 +108,7 @@ export default function BaseInputTemplate<
name={id}
className="input"
labelText={labelToUse}
helperText={helperText}
invalid={invalid}
invalidText={errorMessageForField}
autoFocus={autofocus}

View File

@ -7,10 +7,8 @@ import FormHelperText from '@mui/material/FormHelperText';
* @param props - The `FieldHelpProps` to be rendered
*/
export default function FieldHelpTemplate(props: FieldHelpProps) {
const { idSchema, help } = props;
if (!help) {
return null;
}
const id = `${idSchema.$id}__help`;
return <FormHelperText id={id}>{help}</FormHelperText>;
// ui:help is handled by helperText in all carbon widgets.
// see BaseInputTemplate/BaseInputTemplate.tsx and
// SelectWidget/SelectWidget.tsx
return null;
}

View File

@ -41,6 +41,10 @@ function SelectWidget({
} else if (schema && schema.title) {
labelToUse = schema.title;
}
let helperText = null;
if (uiSchema && uiSchema['ui:help']) {
helperText = uiSchema['ui:help'];
}
if (required) {
labelToUse = `${labelToUse}*`;
}
@ -52,13 +56,16 @@ function SelectWidget({
errorMessageForField = `${labelToUse.replace(/\*$/, '')} ${rawErrors[0]}`;
}
// maybe use placeholder somehow. it was previously jammed into the helperText field,
// but allowing ui:help to grab that spot seems much more appropriate.
return (
<Select
id={id}
name={id}
labelText={labelToUse}
select
helperText={placeholder}
helperText={helperText}
value={typeof value === 'undefined' ? emptyValue : value}
disabled={disabled || readonly}
autoFocus={autofocus}