diff --git a/CHANGELOG.md b/CHANGELOG.md index c87677ec6..636cc5061 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed +- Repeatable set label acting as add button - Attribute filtering not clearing selected autocomplete value when invalid ## [10.0.0] - 2026-03-31 diff --git a/src/components/renderer/FormElementLabelContainer.tsx b/src/components/renderer/FormElementLabelContainer.tsx index 7b28903a0..0f9e69846 100644 --- a/src/components/renderer/FormElementLabelContainer.tsx +++ b/src/components/renderer/FormElementLabelContainer.tsx @@ -12,6 +12,7 @@ function FormElementLabelContainer({ required, children, leading, + associateLabelWithInput = true, }: { className: string element: FormTypes.FormElementBase @@ -19,20 +20,27 @@ function FormElementLabelContainer({ required: boolean children: React.ReactNode leading?: React.ReactNode + /** When false, render the title as a span (no htmlFor), e.g. repeatable sets with no single control. */ + associateLabelWithInput?: boolean }) { + const labelId = `${id}-label` + const labelClassName = clsx('ob-label', { + 'ob-label__required is-required': required, + }) + return (
{leading} - + {associateLabelWithInput ? ( + + ) : ( + + {element.label} + + )} {element.hint && (element.hintPosition === 'TOOLTIP' || !element.hintPosition) && ( diff --git a/src/form-elements/FormElementRepeatableSet.tsx b/src/form-elements/FormElementRepeatableSet.tsx index 25e4c9eda..e19bc2b73 100644 --- a/src/form-elements/FormElementRepeatableSet.tsx +++ b/src/form-elements/FormElementRepeatableSet.tsx @@ -401,12 +401,12 @@ function FormElementRepeatableSet({ element={element} id={id} required={!!minSetEntries && minSetEntries > 0} + associateLabelWithInput={false} > {element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && ( handleAddEntry(0)} element={element} - id={id} classes={['ob-button-repeatable-set-layout__multiple-add-buttons']} /> )} @@ -445,7 +445,6 @@ function FormElementRepeatableSet({ handleAddEntry(entries.length)} element={element} - id={id} /> )} {(isDirty || displayValidationMessage) &&