robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

22500 Phase 2: extract text and multiline leaf renderers

Browse Source
This commit is contained in:
robbond
2026-04-07 09:45:19 +01:00
parent 5b9498b3ef
commit aa4d1fad1e
4 changed files with 168 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/elements/index.js
+2 -129
View File
@@ -46,82 +46,8 @@ import {
getPickListTranslation
} from "./helpers/translationHelpers";
import { RenderRichMultiline } from "./fields/renderRichMultiline";
const RenderTextfield = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
errorMsg,
meta: { touched, error },
...custom
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label " htmlFor={id} id={id + "_label"}>
{FieldsTranslations(label)}
</label>
{!custom.hasOwnProperty("showErrorBottom")
? touched &&
error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{error}
</span>
)
: ""}
<input
{...input}
type={custom.type}
className={className}
name={name}
id={id}
maxLength={
custom.hasOwnProperty("maxFieldLength")
? custom.maxFieldLength
? custom.maxFieldLength
: 100
: 200
}
pattern={
custom.hasOwnProperty("pattern")
? custom.pattern
: undefined
}
/>
{custom.hasOwnProperty("showErrorBottom")
? touched &&
error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{error}
</span>
)
: ""}
</div>
</>
);
};
import { RenderTextfield } from "./fields/renderTextfield";
import { RenderMultiline } from "./fields/renderMultiline";
export function Textfield(props) {
const {
@@ -284,59 +210,6 @@ export function Textfield(props) {
}
}
const RenderMultiline = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
errorMsg,
meta: { touched, error },
...custom
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
{/* <label className="govuk-label " htmlFor={id} id={id + "_label"}>
{FieldsTranslations(label)}s
</label> */}
{touched && error && (
<span id={id + "-error"} className="govuk-error-message">
<span className="govuk-visually-hidden">Error:</span>{" "}
{touched &&
((error && (
<span>{errorMsg ? errorMsg : error}</span>
)) ||
(warning && <span>{warning}</span>))}
</span>
)}
<textarea
id={id}
name={id}
rows={rows}
className={className}
{...input}
maxLength={
custom.hasOwnProperty("maxFieldLength")
? custom.maxFieldLength
? custom.maxFieldLength
: 800
: 800
}
></textarea>
</div>
</>
);
};
export function MultiLinefield(props) {
const {
name,