Merged in fix/restore-generated-id-inputs (pull request #1829)

fix: restore generated id for inputs

Approved-by: Arvid Norlin

apps/scandic-web/components/TempDesignSystem/Form/Input/AriaInputWithLabel/index.tsx

@@ -2,6 +2,7 @@ import { cx } from "class-variance-authority"
 import {
   type ForwardedRef,
   forwardRef,
+  useId,
   useImperativeHandle,
   useRef,
 } from "react"
@@ -20,6 +21,12 @@ const AriaInputWithLabel = forwardRef(function AriaInputWithLabelComponent(
 ) {
   const ref = useRef<HTMLInputElement>(null)
 
+  // Unique id is required for multiple inputs of same name appearing multiple times
+  // on same page. This will inherited by parent label element.
+  // Shouldn't really be needed if we don't set id though.
+  const uniqueId = useId()
+  const inputId = `${uniqueId}-${props.name}`
+
   useImperativeHandle(forwardedRef, () => ref.current as HTMLInputElement)
 
   return (
@@ -38,6 +45,7 @@ const AriaInputWithLabel = forwardRef(function AriaInputWithLabelComponent(
           {...props}
           className={cx(styles.input, props.className)}
           ref={ref}
+          id={inputId}
         />
       </Body>
       <Label required={props.required}>{label}</Label>