From 8677a7d0d0a3e0a89b608cd30c488348cda51fea Mon Sep 17 00:00:00 2001
From: Wilmer Arambula <42547589+terabytesoftw@users.noreply.github.com>
Date: Sat, 6 Jan 2024 18:29:50 -0300
Subject: [PATCH] Add HasLabelItemClass trait and corresponding test. (#210)

---
 src/Attribute/Custom/HasLabelItemClass.php    |  28 ++
 src/Input/Base/AbstractChoiceList.php         |  15 +-
 src/Input/Base/AbstractInputChoice.php        |   2 +-
 .../Custom/HasLabelItemClassTest.php          |  20 ++
 tests/Input/Checkbox/RenderTest.php           |   2 +-
 tests/Input/ChoiceList/CheckboxListTest.php   | 309 ++++++++++--------
 tests/Input/ChoiceList/RadioListTest.php      | 239 ++++++++------
 tests/Input/Radio/RenderTest.php              |   2 +-
 8 files changed, 357 insertions(+), 260 deletions(-)
 create mode 100644 src/Attribute/Custom/HasLabelItemClass.php
 create mode 100644 tests/Attribute/Custom/HasLabelItemClassTest.php

diff --git a/src/Attribute/Custom/HasLabelItemClass.php b/src/Attribute/Custom/HasLabelItemClass.php
new file mode 100644
index 00000000..ac02c873
--- /dev/null
+++ b/src/Attribute/Custom/HasLabelItemClass.php
@@ -0,0 +1,28 @@
+<?php
+
+declare(strict_types=1);
+
+namespace PHPForge\Html\Attribute\Custom;
+
+/**
+ * Is used by widgets that implement label item class method.
+ */
+trait HasLabelItemClass
+{
+    protected string $labelItemClass = '';
+
+    /**
+     * Set a new label item class that will be used for the label item.
+     *
+     * @param string $value The label item class to be used for the label item.
+     *
+     * @return static A new instance of the current class with the specified label item class.
+     */
+    public function labelItemClass(string $value): static
+    {
+        $new = clone $this;
+        $new->labelItemClass = $value;
+
+        return $new;
+    }
+}
diff --git a/src/Input/Base/AbstractChoiceList.php b/src/Input/Base/AbstractChoiceList.php
index 988067bb..8352360b 100644
--- a/src/Input/Base/AbstractChoiceList.php
+++ b/src/Input/Base/AbstractChoiceList.php
@@ -22,6 +22,7 @@ abstract class AbstractChoiceList extends Element implements CheckedValueInterfa
     use Attribute\Custom\HasContainer;
     use Attribute\Custom\HasEnclosedByLabel;
     use Attribute\Custom\HasLabel;
+    use Attribute\Custom\HasLabelItemClass;
     use Attribute\Custom\HasSeparator;
     use Attribute\Custom\HasTemplate;
     use Attribute\Custom\HasWidgetValidation;
@@ -46,6 +47,7 @@ public function loadDefaultDefinitions(): array
     {
         return [
             'container()' => [true],
+            'id()' => [$this->generateId('choice-')],
             'template()' => ['{label}\n{tag}'],
         ];
     }
@@ -64,13 +66,10 @@ protected function run(): string
 
         $attributes = $this->attributes;
         $containerAttributes = $this->containerAttributes;
-        $id = $this->generateId('choice-');
-        $items = $this->items;
-        $labelTag = '';
         $listItems = [];
 
         if ($this->ariaDescribedBy === true) {
-            $attributes['aria-describedby'] = "$id-help";
+            $attributes['aria-describedby'] = "$this->id-help";
         }
 
         if (array_key_exists('autofocus', $attributes) && is_bool($attributes['autofocus'])) {
@@ -87,12 +86,12 @@ protected function run(): string
 
         unset($attributes['value']);
 
-        foreach ($items as $item) {
+        foreach ($this->items as $item) {
             $listItem = $item
                 ->attributes($attributes)
                 ->checked($this->checkedValue === $item->getValue())
                 ->enclosedByLabel($this->enclosedByLabel)
-                ->id(null)
+                ->labelClass($this->labelItemClass)
                 ->separator($this->separator);
 
             if ($this->enclosedByLabel === true) {
@@ -107,7 +106,7 @@ protected function run(): string
             true => Tag::widget()
                 ->attributes($containerAttributes)
                 ->content($choiceTag)
-                ->id($id)
+                ->id($this->id)
                 ->tagName($this->containerTag)
                 ->render(),
             default => $choiceTag,
@@ -116,7 +115,7 @@ protected function run(): string
         return $this->renderTemplate(
             $this->template,
             [
-                '{label}' => $this->renderLabelTag($id),
+                '{label}' => $this->renderLabelTag($this->id),
                 '{tag}' => $tag,
             ],
         );
diff --git a/src/Input/Base/AbstractInputChoice.php b/src/Input/Base/AbstractInputChoice.php
index 3bf2866b..5a00c4d5 100644
--- a/src/Input/Base/AbstractInputChoice.php
+++ b/src/Input/Base/AbstractInputChoice.php
@@ -96,7 +96,7 @@ protected function buildChoiceTag(string $type): string
         if ($this->enclosedByLabel) {
             $tag = $this->renderEnclosedByLabel($tag);
         } else {
-            $labelTag = $this->renderLabelTag($this->getId() ?? '');
+            $labelTag = $this->renderLabelTag($id);
         }
 
         $choiceTag = $this->prepareTemplate($tag, $labelTag);
diff --git a/tests/Attribute/Custom/HasLabelItemClassTest.php b/tests/Attribute/Custom/HasLabelItemClassTest.php
new file mode 100644
index 00000000..0f9beff0
--- /dev/null
+++ b/tests/Attribute/Custom/HasLabelItemClassTest.php
@@ -0,0 +1,20 @@
+<?php
+
+declare(strict_types=1);
+
+namespace PHPForge\Html\Tests\Attribute\Custom;
+
+use PHPForge\Html\Attribute\Custom\HasLabelItemClass;
+use PHPUnit\Framework\TestCase;
+
+final class HasLabelItemClassTest extends TestCase
+{
+    public function testImmutability(): void
+    {
+        $instance = new class () {
+            use HasLabelItemClass;
+        };
+
+        $this->assertNotSame($instance, $instance->labelItemClass(''));
+    }
+}
diff --git a/tests/Input/Checkbox/RenderTest.php b/tests/Input/Checkbox/RenderTest.php
index 06236efd..48ead245 100644
--- a/tests/Input/Checkbox/RenderTest.php
+++ b/tests/Input/Checkbox/RenderTest.php
@@ -39,7 +39,7 @@ public function testAttributes(): void
             <<<HTML
             <input class="class" id="checkbox-6582f2d099e8b" type="checkbox">
             HTML,
-            Checkbox::widget()->attributes(['class' => 'class'])->id('checkbox-6582f2d099e8b')->render()
+            Checkbox::widget()->attributes(['class' => 'class', 'id' => 'checkbox-6582f2d099e8b'])->render()
         );
     }
 
diff --git a/tests/Input/ChoiceList/CheckboxListTest.php b/tests/Input/ChoiceList/CheckboxListTest.php
index 13d02fff..655669a7 100644
--- a/tests/Input/ChoiceList/CheckboxListTest.php
+++ b/tests/Input/ChoiceList/CheckboxListTest.php
@@ -19,18 +19,18 @@ public function testAriaDescribedBy(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1" aria-describedby="MyWidget">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2" aria-describedby="MyWidget">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1" aria-describedby="MyWidget">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2" aria-describedby="MyWidget">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->ariaDescribedBy('MyWidget')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -42,18 +42,18 @@ public function testAriaLabel(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1" aria-label="MyWidget">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2" aria-label="MyWidget">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1" aria-label="MyWidget">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2" aria-label="MyWidget">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->ariaLabel('MyWidget')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -65,18 +65,18 @@ public function testAttributes(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input class="class" name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input class="class" name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input class="class" id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input class="class" id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->attributes(['class' => 'class'])
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -88,18 +88,18 @@ public function testAutofocus(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89" autofocus>
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->autofocus()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -111,18 +111,18 @@ public function testClass(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input class="class" name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input class="class" name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input class="class" id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input class="class" id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->class('class')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -134,18 +134,18 @@ public function testContainerAttributes(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div class="class" id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->containerAttributes(['class' => 'class'])
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -157,18 +157,18 @@ public function testContainerClass(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div class="class" id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->containerClass('class')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -180,18 +180,18 @@ public function testContainerTag(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <article id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </article>
             HTML,
             Choicelist::widget()
                 ->containerTag('article')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -202,16 +202,16 @@ public function testContainerWithFalse(): void
     {
         Assert::equalsWithoutLE(
             <<<HTML
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             HTML,
             Choicelist::widget()
                 ->container(false)
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -223,16 +223,16 @@ public function testEnclosedByLabel(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <label><input name="CheckboxForm[text]" type="checkbox" value="1">Female</label>
-            <label><input name="CheckboxForm[text]" type="checkbox" value="2">Male</label>
+            <label for="checkbox-6599b6a33dd96"><input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">Female</label>
+            <label for="checkbox-6599b6a33dd97"><input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->enclosedByLabel(true)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -244,18 +244,18 @@ public function testGenerateAriaDescribedBy(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1" aria-describedby="choice-list-65858c272ea89-help">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2" aria-describedby="choice-list-65858c272ea89-help">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1" aria-describedby="choice-list-65858c272ea89-help">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2" aria-describedby="choice-list-65858c272ea89-help">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->ariaDescribedBy(true)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -267,17 +267,17 @@ public function testId(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="id">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="id-checkbox-1" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="id-checkbox-1">Female</label>
+            <input id="id-checkbox-2" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="id-checkbox-2">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('id')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('id-checkbox-1')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('id-checkbox-2')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -290,17 +290,17 @@ public function testLabel(): void
             <<<HTML
             <label for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->labelContent('Select your gender?')
                 ->name('CheckboxForm[text]')
@@ -314,20 +314,20 @@ public function testLabelAttributes(): void
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
-                ->labelContent('Select your gender?')
                 ->labelAttributes(['class' => 'class'])
+                ->labelContent('Select your gender?')
                 ->name('CheckboxForm[text]')
                 ->render(),
         );
@@ -339,20 +339,45 @@ public function testLabelClass(): void
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
-                ->labelContent('Select your gender?')
                 ->labelClass('class')
+                ->labelContent('Select your gender?')
+                ->name('CheckboxForm[text]')
+                ->render(),
+        );
+    }
+
+    public function testLabelItemClass(): void
+    {
+        Assert::equalsWithoutLE(
+            <<<HTML
+            <label for="choice-list-65858c272ea89">Select your gender?</label>
+            <div id="choice-list-65858c272ea89">
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label class="class" for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label class="class" for="checkbox-6599b6a33dd97">Male</label>
+            </div>
+            HTML,
+            Choicelist::widget()
+                ->id('choice-list-65858c272ea89')
+                ->items(
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
+                )
+                ->labelContent('Select your gender?')
+                ->labelItemClass('class')
                 ->name('CheckboxForm[text]')
                 ->render(),
         );
@@ -364,20 +389,20 @@ public function testName(): void
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
-                ->labelContent('Select your gender?')
                 ->labelClass('class')
+                ->labelContent('Select your gender?')
                 ->name('CheckboxForm[text]')
                 ->render(),
         );
@@ -388,20 +413,20 @@ public function testNotLabel(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
-                ->labelContent('Select your gender?')
                 ->labelClass('class')
+                ->labelContent('Select your gender?')
                 ->name('CheckboxForm[text]')
                 ->notLabel()
                 ->render(),
@@ -413,17 +438,17 @@ public function testRender(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="red">
-            <label>Red</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="blue">
-            <label>Blue</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="red">
+            <label for="checkbox-6599b6a33dd96">Red</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="blue">
+            <label for="checkbox-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Red')->value('red'),
-                    Checkbox::widget()->labelContent('Blue')->value('blue'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -435,17 +460,17 @@ public function testSeparator(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="red">
-            <label>Red</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="blue">
-            <label>Blue</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="red">
+            <label for="checkbox-6599b6a33dd96">Red</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="blue">
+            <label for="checkbox-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Red')->value('red'),
-                    Checkbox::widget()->labelContent('Blue')->value('blue'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('CheckboxForm[text]')
                 ->separator(PHP_EOL)
@@ -458,17 +483,17 @@ public function testTabindex(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89" tabindex="1">
-            <input name="CheckboxForm[text]" type="checkbox" value="red">
-            <label>Red</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="blue">
-            <label>Blue</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="red">
+            <label for="checkbox-6599b6a33dd96">Red</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="blue">
+            <label for="checkbox-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Red')->value('red'),
-                    Checkbox::widget()->labelContent('Blue')->value('blue'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('CheckboxForm[text]')
                 ->tabIndex(1)
@@ -481,22 +506,22 @@ public function testTemplate(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="red">
-            <label>Red</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="blue">
-            <label>Blue</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="red">
+            <label for="checkbox-6599b6a33dd96">Red</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="blue">
+            <label for="checkbox-6599b6a33dd97">Blue</label>
             </div>
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             HTML,
             Choicelist::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Red')->value('red'),
-                    Checkbox::widget()->labelContent('Blue')->value('blue'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
-                ->name('CheckboxForm[text]')
-                ->labelContent('Select your gender?')
                 ->labelClass('class')
+                ->labelContent('Select your gender?')
+                ->name('CheckboxForm[text]')
                 ->template('{tag}\n{label}')
                 ->render(),
         );
@@ -507,18 +532,18 @@ public function testValue(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1" checked>
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1" checked>
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->checkedValue(1)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
@@ -530,18 +555,18 @@ public function testValueWithNull(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="CheckboxForm[text]" type="checkbox" value="1">
-            <label>Female</label>
-            <input name="CheckboxForm[text]" type="checkbox" value="2">
-            <label>Male</label>
+            <input id="checkbox-6599b6a33dd96" name="CheckboxForm[text]" type="checkbox" value="1">
+            <label for="checkbox-6599b6a33dd96">Female</label>
+            <input id="checkbox-6599b6a33dd97" name="CheckboxForm[text]" type="checkbox" value="2">
+            <label for="checkbox-6599b6a33dd97">Male</label>
             </div>
             HTML,
             Choicelist::widget()
                 ->checkedValue(null)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Checkbox::widget()->labelContent('Female')->value(1),
-                    Checkbox::widget()->labelContent('Male')->value(2),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Checkbox::widget()->id('checkbox-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('CheckboxForm[text]')
                 ->render(),
diff --git a/tests/Input/ChoiceList/RadioListTest.php b/tests/Input/ChoiceList/RadioListTest.php
index ba4bb596..62aeb63d 100644
--- a/tests/Input/ChoiceList/RadioListTest.php
+++ b/tests/Input/ChoiceList/RadioListTest.php
@@ -19,18 +19,18 @@ public function testAttributes(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input class="class" name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input class="class" name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input class="class" id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input class="class" id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->attributes(['class' => 'class'])
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -42,18 +42,18 @@ public function testAutofocus(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89" autofocus>
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->autofocus()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -65,18 +65,18 @@ public function testClass(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input class="class" name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input class="class" name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input class="class" id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input class="class" id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->class('class')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -88,18 +88,18 @@ public function testContainerAttributes(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div class="class" id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->containerAttributes(['class' => 'class'])
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -111,18 +111,18 @@ public function testContainerClass(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div class="class" id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->containerClass('class')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -134,18 +134,18 @@ public function testContainerTag(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <article id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </article>
             HTML,
             ChoiceList::widget()
                 ->containerTag('article')
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -156,16 +156,16 @@ public function testContainerWithFalse(): void
     {
         Assert::equalsWithoutLE(
             <<<HTML
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             HTML,
             ChoiceList::widget()
                 ->container(false)
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -177,16 +177,16 @@ public function testEnclosedByLabel(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <label><input name="radioform[text]" type="radio" value="1">Female</label>
-            <label><input name="radioform[text]" type="radio" value="2">Male</label>
+            <label for="radio-6599b6a33dd96"><input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">Female</label>
+            <label for="radio-6599b6a33dd97"><input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->enclosedByLabel(true)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -198,17 +198,17 @@ public function testId(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="id">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="id-radio-1" name="radioform[text]" type="radio" value="1">
+            <label for="id-radio-1">Female</label>
+            <input id="id-radio-2" name="radioform[text]" type="radio" value="2">
+            <label for="id-radio-2">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('id')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('id-radio-1')->labelContent('Female')->value(1),
+                    Radio::widget()->id('id-radio-2')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -221,17 +221,17 @@ public function testLabel(): void
             <<<HTML
             <label for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->labelContent('Select your gender?')
                 ->name('radioform[text]')
@@ -245,20 +245,20 @@ public function testLabelAttributes(): void
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
-                ->labelContent('Select your gender?')
                 ->labelAttributes(['class' => 'class'])
+                ->labelContent('Select your gender?')
                 ->name('radioform[text]')
                 ->render(),
         );
@@ -270,17 +270,17 @@ public function testLabelClass(): void
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->labelContent('Select your gender?')
                 ->labelClass('class')
@@ -289,23 +289,48 @@ public function testLabelClass(): void
         );
     }
 
+    public function testLabelItemClass(): void
+    {
+        Assert::equalsWithoutLE(
+            <<<HTML
+            <label for="choice-list-65858c272ea89">Select your gender?</label>
+            <div id="choice-list-65858c272ea89">
+            <input id="radio-6599b6a33dd96" name="CheckboxForm[text]" type="radio" value="1">
+            <label class="class" for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="CheckboxForm[text]" type="radio" value="2">
+            <label class="class" for="radio-6599b6a33dd97">Male</label>
+            </div>
+            HTML,
+            Choicelist::widget()
+                ->id('choice-list-65858c272ea89')
+                ->items(
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
+                )
+                ->labelContent('Select your gender?')
+                ->labelItemClass('class')
+                ->name('CheckboxForm[text]')
+                ->render(),
+        );
+    }
+
     public function testName(): void
     {
         Assert::equalsWithoutLE(
             <<<HTML
             <label class="class" for="choice-list-65858c272ea89">Select your gender?</label>
             <div id="choice-list-65858c272ea89">
-            <input name="RadioList" type="radio" value="1">
-            <label>Female</label>
-            <input name="RadioList" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="RadioList" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="RadioList" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->labelContent('Select your gender?')
                 ->labelClass('class')
@@ -320,17 +345,17 @@ public function testRender(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="red">
-            <label>Red</label>
-            <input name="radioform[text]" type="radio" value="blue">
-            <label>Blue</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="red">
+            <label for="radio-6599b6a33dd96">Red</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="blue">
+            <label for="radio-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Red')->value('red'),
-                    Radio::widget()->labelContent('Blue')->value('blue'),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -342,17 +367,17 @@ public function testSeparator(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="red">
-            <label>Red</label>
-            <input name="radioform[text]" type="radio" value="blue">
-            <label>Blue</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="red">
+            <label for="radio-6599b6a33dd96">Red</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="blue">
+            <label for="radio-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Red')->value('red'),
-                    Radio::widget()->labelContent('Blue')->value('blue'),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('radioform[text]')
                 ->separator(PHP_EOL)
@@ -365,17 +390,17 @@ public function testTabindex(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89" tabindex="1">
-            <input name="radioform[text]" type="radio" value="red">
-            <label>Red</label>
-            <input name="radioform[text]" type="radio" value="blue">
-            <label>Blue</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="red">
+            <label for="radio-6599b6a33dd96">Red</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="blue">
+            <label for="radio-6599b6a33dd97">Blue</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Red')->value('red'),
-                    Radio::widget()->labelContent('Blue')->value('blue'),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Red')->value('red'),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Blue')->value('blue'),
                 )
                 ->name('radioform[text]')
                 ->tabIndex(1)
@@ -388,18 +413,18 @@ public function testValue(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1" checked>
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1" checked>
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->checkedValue(1)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
@@ -411,18 +436,18 @@ public function testValueWithNull(): void
         Assert::equalsWithoutLE(
             <<<HTML
             <div id="choice-list-65858c272ea89">
-            <input name="radioform[text]" type="radio" value="1">
-            <label>Female</label>
-            <input name="radioform[text]" type="radio" value="2">
-            <label>Male</label>
+            <input id="radio-6599b6a33dd96" name="radioform[text]" type="radio" value="1">
+            <label for="radio-6599b6a33dd96">Female</label>
+            <input id="radio-6599b6a33dd97" name="radioform[text]" type="radio" value="2">
+            <label for="radio-6599b6a33dd97">Male</label>
             </div>
             HTML,
             ChoiceList::widget()
                 ->checkedValue(null)
                 ->id('choice-list-65858c272ea89')
                 ->items(
-                    Radio::widget()->labelContent('Female')->value(1),
-                    Radio::widget()->labelContent('Male')->value(2),
+                    Radio::widget()->id('radio-6599b6a33dd96')->labelContent('Female')->value(1),
+                    Radio::widget()->id('radio-6599b6a33dd97')->labelContent('Male')->value(2),
                 )
                 ->name('radioform[text]')
                 ->render(),
diff --git a/tests/Input/Radio/RenderTest.php b/tests/Input/Radio/RenderTest.php
index 86e6b415..dba19fb5 100644
--- a/tests/Input/Radio/RenderTest.php
+++ b/tests/Input/Radio/RenderTest.php
@@ -36,7 +36,7 @@ public function testAttributes(): void
             <<<HTML
             <input class="class" id="radio-6582f2d099e8b" type="radio">
             HTML,
-            Radio::widget()->attributes(['class' => 'class'])->id('radio-6582f2d099e8b')->render()
+            Radio::widget()->attributes(['class' => 'class', 'id' => 'radio-6582f2d099e8b'])->render()
         );
     }