diff --git a/frontend/components/HashListForm.js b/frontend/components/HashListForm.js index d20f0fe6..a6cf3830 100644 --- a/frontend/components/HashListForm.js +++ b/frontend/components/HashListForm.js @@ -15,8 +15,11 @@ export const HashListForm = ({ hash_list, onChange, onDelete, + defaultValue, + component, }) => { const colorMode = useEditorColorMode(); + const _default = defaultValue || ""; const handleInputChange = (e, index) => { const { value } = e.target; @@ -46,15 +49,16 @@ export const HashListForm = ({ // Add empty element here so the rendered structure and input focus sticks // while typing in the new item. - const list_plus_new = list ? [...list, ""] : [""]; + const list_plus_new = list ? [...list, _default] : [_default]; + const InputComponent = component || Input; return ( {label} {list_plus_new?.map((value, index) => ( - - + handleInputChange(e, index)} placeholder={`Item ${index + 1}`} @@ -65,6 +69,7 @@ export const HashListForm = ({ onClick={() => handleRemoveClick(index)} cursor={index < list?.length ? "pointer" : "default"} color={index < list?.length ? "inherit" : "transparent"} + style={{ marginTop: "12px" }} /> ))} diff --git a/frontend/json_form/fields/HashList.js b/frontend/json_form/fields/HashList.js index ac8be5ab..ff933f75 100644 --- a/frontend/json_form/fields/HashList.js +++ b/frontend/json_form/fields/HashList.js @@ -9,6 +9,8 @@ export const HashList = ({ config, onChange, onDelete, + defaultValue, + component, }) => { const hashField = `${name}_hash`; @@ -31,6 +33,8 @@ export const HashList = ({ onDelete={onDelete} label={getLabel(name)} isRequired + defaultValue={defaultValue} + component={component} /> ); };