Merge pull request #5 from nathanjdunn/feature/bootstrap-4-addons

Bootstrap 4 Addons

Author: sdebacker

src/TypiCMS/BootForms/Elements/InputGroup.php

@@ -31,12 +31,12 @@ public function type($type)
         return $this;
     }
 
-    protected function renderAddons($addons)
+    protected function renderAddons($addons, $class)
     {
         $html = '';
 
         foreach ($addons as $addon) {
-            $html .= '<span class="input-group-addon">';
+            $html .= sprintf('<span class="input-group-%s">', $class);
             $html .= $addon;
             $html .= '</span>';
         }
@@ -47,9 +47,9 @@ protected function renderAddons($addons)
     public function render()
     {
         $html = '<div class="input-group">';
-        $html .= $this->renderAddons($this->beforeAddon);
+        $html .= $this->renderAddons($this->beforeAddon, 'prepend');
         $html .= parent::render();
-        $html .= $this->renderAddons($this->afterAddon);
+        $html .= $this->renderAddons($this->afterAddon, 'append');
         $html .= '</div>';
 
         return $html;

tests/BasicFormBuilderTest.php

@@ -563,21 +563,21 @@ public function testCanSetGroupData()
 
     public function testRenderInputGroupWithBeforeAddon()
     {
-        $expected = '<div class="form-group"><label for="username">Username</label><div class="input-group"><span class="input-group-addon">@</span><input type="text" name="username" id="username" class="form-control"></div></div>';
+        $expected = '<div class="form-group"><label for="username">Username</label><div class="input-group"><span class="input-group-prepend">@</span><input type="text" name="username" id="username" class="form-control"></div></div>';
         $result = $this->form->inputGroup('Username', 'username')->beforeAddon('@')->render();
         $this->assertEquals($expected, $result);
     }
 
     public function testRenderInputGroupWithAfterAddon()
     {
-        $expected = '<div class="form-group"><label for="site">Site</label><div class="input-group"><input type="text" name="site" id="site" class="form-control"><span class="input-group-addon">.com.br</span></div></div>';
+        $expected = '<div class="form-group"><label for="site">Site</label><div class="input-group"><input type="text" name="site" id="site" class="form-control"><span class="input-group-append">.com.br</span></div></div>';
         $result = $this->form->inputGroup('Site', 'site')->afterAddon('.com.br')->render();
         $this->assertEquals($expected, $result);
     }
 
     public function testRenderInputGroupChangeTypeWithBothAddon()
     {
-        $expected = '<div class="form-group"><label for="secret">Secret</label><div class="input-group"><span class="input-group-addon">before</span><input type="password" name="secret" id="secret" class="form-control"><span class="input-group-addon">after</span></div></div>';
+        $expected = '<div class="form-group"><label for="secret">Secret</label><div class="input-group"><span class="input-group-prepend">before</span><input type="password" name="secret" id="secret" class="form-control"><span class="input-group-append">after</span></div></div>';
         $result = $this->form
             ->inputGroup('Secret', 'secret')
             ->type('password')

tests/InputGroupTest.php

@@ -20,7 +20,7 @@ public function testCanRenderBeforeAddon()
         $input = new InputGroup('username');
         $this->assertEquals($input, $input->beforeAddon('@'));
 
-        $expected = '<div class="input-group"><span class="input-group-addon">@</span><input type="text" name="username"></div>';
+        $expected = '<div class="input-group"><span class="input-group-prepend">@</span><input type="text" name="username"></div>';
         $result = $input->render();
         $this->assertEquals($expected, $result);
     }
@@ -31,7 +31,7 @@ public function testCanRenderAfterAddonAndType()
         $this->assertEquals($input, $input->type('email'));
         $this->assertEquals($input, $input->afterAddon('@domain.com'));
 
-        $expected = '<div class="input-group"><input type="email" name="mail"><span class="input-group-addon">@domain.com</span></div>';
+        $expected = '<div class="input-group"><input type="email" name="mail"><span class="input-group-append">@domain.com</span></div>';
         $result = $input->render();
         $this->assertEquals($expected, $result);
     }