ui_bibz 2.0.0.beta2.6 → 2.0.0

data/lib/ui_bibz/utils/internationalization.rb

@@ -1,3 +1,6 @@
+# Transalte with array of translation
+#
+#   => UiBibz::Utils::Internationalization.new("ui_bibz.table.actions.#{ @store.model.to_s.underscore }.show", default: defaults).translate
 module UiBibz::Utils
   class Internationalization
 

data/lib/ui_bibz/version.rb

@@ -1,3 +1,3 @@
 module UiBibz
-  VERSION = "2.0.0.beta2.6"
+  VERSION = "2.0.0"
 end

data/test/factories/user.rb

@@ -1,4 +1,4 @@
-FactoryGirl.define do
+FactoryBot.define do
   factory :user do
     name_fr "Name fr"
     name_en "Name en"

data/test/simple_form_test.rb

@@ -73,7 +73,7 @@ class SimpleFormTest < ActionView::TestCase
       f.input :price, as: :ui_formula_field
     end
 
-    expected = "<form class=\"simple_form edit_user\" id=\"edit_user_1\" action=\"/users/1\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><input type=\"hidden\" name=\"_method\" value=\"patch\" /><div class=\"form-group ui_formula_field optional user_price\"><label class=\"control-label ui_formula_field optional\" for=\"user_price\">Price</label><div class=\"formula_field input-group ui_surround_field\"><input type=\"text\" name=\"user[price_formula]\" id=\"user_price_formula\" value=\"1+2\" class=\"ui_formula_field optional formula-field form-control\" formula_field_value=\"1+2\" /><span class=\"formula-field-sign input-group-addon\">=</span><input type=\"text\" name=\"user[price]\" id=\"user_price\" value=\"3.0\" class=\"formula-field-result form-control\" readonly=\"readonly\" /><span data-toggle=\"tooltip\" class=\"formula-field-alert input-group-addon\"><i class=\"glyph-danger glyph fa fa-exclamation-triangle\"></i></span></div></div></form>"
+    expected = "<form class=\"simple_form edit_user\" id=\"edit_user_1\" action=\"/users/1\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><input type=\"hidden\" name=\"_method\" value=\"patch\" /><div class=\"form-group ui_formula_field optional user_price\"><label class=\"control-label ui_formula_field optional\" for=\"user_price\">Price</label><div class=\"formula_field input-group ui_surround_field\"><input type=\"text\" name=\"user[price_formula]\" id=\"user_price_formula\" value=\"1+2\" class=\"ui_formula_field optional formula-field form-control\" formula_field_value=\"1+2\" /><span class=\"formula-field-sign input-group-addon\">=</span><input type=\"text\" name=\"user[price]\" id=\"user_price\" value=\"3.0\" class=\"formula-field-result form-control\" readonly=\"readonly\" /><span data-toggle=\"tooltip\" class=\"formula-field-alert input-group-addon\"><i class=\"glyph-danger glyph fas fa-exclamation-triangle\"></i></span></div></div></form>"
 
     assert_equal expected, actual
   end
@@ -171,7 +171,7 @@ class SimpleFormTest < ActionView::TestCase
     end
 
     expected = "<form class=\"simple_form edit_user\" id=\"edit_user_1\" action=\"/users/1\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><input type=\"hidden\" name=\"_method\" value=\"patch\" /><div class=\"form-group ui_select_field optional user_name_fr\"><label class=\"control-label ui_select_field optional\" for=\"user_name_fr\">Name fr</label><div class=\"field-refresh input-group ui_surround_field\"><select name=\"user[name_fr]\" id=\"user_name_fr\" class=\"select-field form-control\"><option value=\"1\">test1</option>
-<option value=\"2\">test2</option></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#user_name_fr&quot;,&quot;url&quot;:&quot;&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div></div></form>"
+<option value=\"2\">test2</option></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#user_name_fr&quot;,&quot;url&quot;:&quot;&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div></div></form>"
 
     assert_equal expected, actual
   end

data/test/support/factory_bot.rb

@@ -0,0 +1,9 @@
+require 'factory_bot'
+FactoryBot.find_definitions
+# for Spec expectation style
+#class MiniTest::Test
+  #include FactoryGirl::Syntax::Methods
+#end
+class ActiveSupport::TestCase
+  include FactoryBot::Syntax::Methods
+end

data/test/test_helper.rb

@@ -20,4 +20,3 @@ Dir["#{File.dirname(__FILE__)}/support/**/*.rb"].each { |f| require f }
 if ActiveSupport::TestCase.respond_to?(:fixture_path=)
   ActiveSupport::TestCase.fixture_path = File.expand_path("../fixtures", __FILE__)
 end
-

data/test/ui/core/boxes/card_test.rb

@@ -57,7 +57,7 @@ class CardTest < ActionView::TestCase
       p.body 'state'
       p.footer 'state'
     end
-    expected = "<div class=\"state card\"><div class=\"card-header\"><i class=\"glyph fa fa-eye\"></i> state</div><div class=\"card-body\">state</div><div class=\"card-footer\">state</div></div>"
+    expected = "<div class=\"state card\"><div class=\"card-header\"><i class=\"glyph fas fa-eye\"></i>  state</div><div class=\"card-body\">state</div><div class=\"card-footer\">state</div></div>"
 
     assert_equal expected, actual
   end

data/test/ui/core/component_test.rb

@@ -4,7 +4,7 @@ class ComponentTest < ActionView::TestCase
 
   test 'create complex component' do
     actual = UiBibz::Ui::Core::Component.new('New component', { state: :active, glyph: 'add' }, { class: 'new-class' }).render
-    expected = '<i class="glyph fa fa-add"></i> New component'
+    expected = '<i class="glyph fas fa-add"></i>  New component'
 
     assert_equal expected, actual
   end
@@ -17,4 +17,11 @@ class ComponentTest < ActionView::TestCase
 
     assert_equal expected, actual
   end
+
+  test 'create component without text and glyph' do
+    actual = UiBibz::Ui::Core::Component.new('My text', { glyph: 'diamond', text: false }).render
+    expected = "<i title=\"My text\" class=\"glyph fas fa-diamond\"></i>"
+
+    assert_equal expected, actual
+  end
 end

data/test/ui/core/forms/buttons/button_group_test.rb

@@ -45,7 +45,7 @@ class ButtonGroupTest < ActionView::TestCase
         d.link 'Link 1', url: '#link1', glyph: 'eye'
       end
     end
-    expected = "<div class=\"btn-group\" role=\"group\"><div id=\"dropdown-test\" class=\"dropup btn-group\"><button class=\"btn btn-success dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"dropdown-test\">Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"dropdown-test\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fa fa-eye\"></i> Link 1</a></div></div></div>"
+    expected = "<div class=\"btn-group\" role=\"group\"><div id=\"dropdown-test\" class=\"dropup btn-group\"><button class=\"btn btn-success dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"dropdown-test\">Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"dropdown-test\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fas fa-eye\"></i>  Link 1</a></div></div></div>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/buttons/button_link_test.rb

@@ -75,7 +75,7 @@ class ButtonLinkTest < ActionView::TestCase
 
   test 'button_link glyph' do
     actual   = ui_button_link('state', glyph: 'diamond')
-    expected = "<a class=\"btn-secondary btn\" role=\"button\" href=\"#\"><i class=\"glyph fa fa-diamond\"></i> state</a>"
+    expected = "<a class=\"btn-secondary btn\" role=\"button\" href=\"#\"><i class=\"glyph fas fa-diamond\"></i>  state</a>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/buttons/button_refresh_test.rb

@@ -4,7 +4,7 @@ class ButtonRefreshTest < ActionView::TestCase
 
   test "button" do
     actual   = UiBibz::Ui::Core::Forms::Buttons::ButtonRefresh.new('state', status: :success, connect: { target: { url: '/'}}).render
-    expected = "<span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-success ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> state</span>"
+    expected = "<span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-success ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i>  state</span>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/buttons/button_test.rb

@@ -68,14 +68,14 @@ class ButtonTest < ActionView::TestCase
 
   test 'button glyph' do
     actual   = ui_button('state', glyph: 'diamond')
-    expected = "<button class=\"btn\"><i class=\"glyph fa fa-diamond\"></i> state</button>"
+    expected = "<button class=\"btn\"><i class=\"glyph fas fa-diamond\"></i>  state</button>"
 
     assert_equal expected, actual
   end
 
   test 'button glyph without text' do
     actual   = ui_button('state', glyph: 'diamond', text: false)
-    expected = "<button class=\"btn without-text\" title=\"state\"><i class=\"glyph fa fa-diamond\"></i>  </button>"
+    expected = "<button class=\"btn without-text\"><i title=\"state\" class=\"glyph fas fa-diamond\"></i></button>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/choices/choice_group_test.rb

@@ -28,7 +28,7 @@ class ChoiceGroupTest < ActionView::TestCase
       bc.choice 'Radio 1', glyph: 'diamond', status: :primary
       bc.choice 'Radio 2', state: :active
     end
-    expected = "<div data-toggle=\"buttons\" class=\"btn-group btn-group-lg button-choice\"><label class=\"btn-outline-primary btn btn-lg radio\"><input type=\"radio\" autocomplete=\"off\" /><i class=\"glyph fa fa-diamond\"></i> Radio 1</label><label class=\"active btn-outline-secondary btn btn-lg radio\" aria-pressed=\"true\"><input type=\"radio\" autocomplete=\"off\" checked=\"checked\" />Radio 2</label></div>"
+    expected = "<div data-toggle=\"buttons\" class=\"btn-group btn-group-lg button-choice\"><label class=\"btn-outline-primary btn btn-lg radio\"><input type=\"radio\" autocomplete=\"off\" /><i class=\"glyph fas fa-diamond\"></i>  Radio 1</label><label class=\"active btn-outline-secondary btn btn-lg radio\" aria-pressed=\"true\"><input type=\"radio\" autocomplete=\"off\" checked=\"checked\" />Radio 2</label></div>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/dropdowns/dropdown_test.rb

@@ -37,7 +37,7 @@ class DropdownTest < ActionView::TestCase
       d.divider
       d.link 'Link3', url: '#link3'
     end
-    expected = "<div class=\"dropup\"><button class=\"btn btn-success dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"#{ actual.id }\"><i class=\"glyph fa fa-diamond\"></i> Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"#{ actual.id }\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fa fa-eye\"></i> Link 1</a><h6 class=\"dropdown-header\" role=\"presentation\">header</h6><a class=\"dropdown-item\" href=\"#link2\">Link 2</a><div class=\"dropdown-divider\"></div><a class=\"dropdown-item\" href=\"#link3\">Link3</a></div></div>"
+    expected = "<div class=\"dropup\"><button class=\"btn btn-success dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"#{ actual.id }\"><i class=\"glyph fas fa-diamond\"></i> Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"#{ actual.id }\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fas fa-eye\"></i>  Link 1</a><h6 class=\"dropdown-header\" role=\"presentation\">header</h6><a class=\"dropdown-item\" href=\"#link2\">Link 2</a><div class=\"dropdown-divider\"></div><a class=\"dropdown-item\" href=\"#link3\">Link3</a></div></div>"
 
     assert_equal expected, actual.render
   end

data/test/ui/core/forms/numbers/formula_field_test.rb

@@ -4,7 +4,7 @@ class FormulaFieldTest < ActionView::TestCase
 
     test 'formula_field' do
       actual = UiBibz::Ui::Core::Forms::Numbers::FormulaField.new('value').render
-      expected = "<div class=\"formula_field input-group ui_surround_field\"><input type=\"text\" name=\"value_formula\" id=\"value_formula\" class=\"formula-field form-control\" /><span class=\"formula-field-sign input-group-addon\">=</span><input type=\"text\" name=\"value\" id=\"value\" class=\"formula-field-result form-control\" readonly=\"readonly\" /><span data-toggle=\"tooltip\" class=\"formula-field-alert input-group-addon\"><i class=\"glyph-danger glyph fa fa-exclamation-triangle\"></i></span></div>"
+      expected = "<div class=\"formula_field input-group ui_surround_field\"><input type=\"text\" name=\"value_formula\" id=\"value_formula\" class=\"formula-field form-control\" /><span class=\"formula-field-sign input-group-addon\">=</span><input type=\"text\" name=\"value\" id=\"value\" class=\"formula-field-result form-control\" readonly=\"readonly\" /><span data-toggle=\"tooltip\" class=\"formula-field-alert input-group-addon\"><i class=\"glyph-danger glyph fas fa-exclamation-triangle\"></i></span></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/forms/selects/dropdown_select_field_test.rb

@@ -76,7 +76,7 @@ class DropdownSelectFieldTest < ActionView::TestCase
 
     test 'dropdown_select_field refresh' do
       actual = UiBibz::Ui::Core::Forms::Selects::DropdownSelectField.new('test', { refresh: { mode: 'local', target: { data: [] }}}).render
-      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"test\" id=\"test\" class=\"dropdown-select-field\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;local&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test&quot;,&quot;url&quot;:&quot;&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div>"
+      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"test\" id=\"test\" class=\"dropdown-select-field\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;local&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test&quot;,&quot;url&quot;:&quot;&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/forms/selects/multi_select_field_test.rb

@@ -24,7 +24,7 @@ class MultiSelectFieldTest < ActionView::TestCase
 
     test 'Multi select Field refresh option' do
       actual = UiBibz::Ui::Core::Forms::Selects::MultiSelectField.new('test', { refresh: { target: { url: '/'}}}).render
-      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"test[]\" id=\"test\" class=\"btn-secondary multi-select-field\" multiple=\"multiple\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div>"
+      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"test[]\" id=\"test\" class=\"btn-secondary multi-select-field\" multiple=\"multiple\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/forms/selects/select_field_test.rb

@@ -13,7 +13,7 @@ class SelectFieldTest < ActionView::TestCase
 
     test "Select Field refresh" do
       actual   = UiBibz::Ui::Core::Forms::Selects::SelectField.new('example', refresh: { target: { url: '/' }}).render
-      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"example\" id=\"example\" class=\"select-field form-control\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#example&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div>"
+      expected = "<div class=\"field-refresh input-group ui_surround_field\"><select name=\"example\" id=\"example\" class=\"select-field form-control\"></select><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#example&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/forms/surrounds/surround_field_test.rb

@@ -6,7 +6,7 @@ class SurroundFieldTest < ActionView::TestCase
       actual = UiBibz::Ui::Core::Forms::Surrounds::SurroundField.new.tap do |sf|
         sf.glyph 'pencil'
       end.render
-      expected = "<div class=\"input-group ui_surround_field\"><span class=\"input-group-addon\"><i class=\"glyph fa fa-pencil\"></i></span></div>"
+      expected = "<div class=\"input-group ui_surround_field\"><span class=\"input-group-addon\"><i class=\"glyph fas fa-pencil\"></i></span></div>"
 
       assert_equal expected, actual
     end
@@ -30,7 +30,7 @@ class SurroundFieldTest < ActionView::TestCase
           d.link 'Link3', url: '#link3'
         end
       end.render
-      expected = "<div class=\"input-group ui_surround_field\"><div id=\"dropdown-test\" class=\"dropdown input-group-btn\"><button class=\"btn btn-secondary dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"dropdown-test\">Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"dropdown-test\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fa fa-eye\"></i> Link 1</a><h6 class=\"dropdown-header\" role=\"presentation\">header</h6><a class=\"dropdown-item\" href=\"#link2\">Link 2</a><div class=\"dropdown-divider\"></div><a class=\"dropdown-item\" href=\"#link3\">Link3</a></div></div></div>"
+      expected = "<div class=\"input-group ui_surround_field\"><div id=\"dropdown-test\" class=\"dropdown input-group-btn\"><button class=\"btn btn-secondary dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\" id=\"dropdown-test\">Dropdown <span class=\"caret\"></span></button><div class=\"dropdown-menu\" arial-labelledby=\"dropdown-test\"><a class=\"dropdown-item\" href=\"#link1\"><i class=\"glyph fas fa-eye\"></i>  Link 1</a><h6 class=\"dropdown-header\" role=\"presentation\">header</h6><a class=\"dropdown-item\" href=\"#link2\">Link 2</a><div class=\"dropdown-divider\"></div><a class=\"dropdown-item\" href=\"#link3\">Link3</a></div></div></div>"
 
       assert_equal expected, actual
     end
@@ -50,7 +50,7 @@ class SurroundFieldTest < ActionView::TestCase
         sf.addon '€'
         sf.glyph 'pencil'
       end.render
-      expected = "<div class=\"input-group ui_surround_field\"><div class=\"input-group-btn\"><button class=\"btn\">Submit</button></div><span class=\"input-group-addon\">€</span><span class=\"input-group-addon\"><i class=\"glyph fa fa-pencil\"></i></span></div>"
+      expected = "<div class=\"input-group ui_surround_field\"><div class=\"input-group-btn\"><button class=\"btn\">Submit</button></div><span class=\"input-group-addon\">€</span><span class=\"input-group-addon\"><i class=\"glyph fas fa-pencil\"></i></span></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/forms/texts/auto_complete_field_test.rb

@@ -15,7 +15,7 @@ class AutoCompleteFieldTest < ActionView::TestCase
     options  = options_for_select(2.times.map{ |i| "option #{i}" })
     actual = UiBibz::Ui::Core::Forms::Texts::AutoCompleteField.new('test', { option_tags: options, refresh: { target: { url: '/'}} }, { id: 'test' }).render
     expected = "<div class=\"field-refresh input-group ui_surround_field\"><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control auto-complete-field\" autocomplete=\"true\" list=\"test-datalist\" /><datalist id=\"test-datalist\"><option value=\"option 0\">option 0</option>
-<option value=\"option 1\">option 1</option></datalist><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test-datalist&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div>"
+<option value=\"option 1\">option 1</option></datalist><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test-datalist&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div>"
 
     assert_equal expected, actual
   end
@@ -24,7 +24,7 @@ class AutoCompleteFieldTest < ActionView::TestCase
     options  = options_for_select(2.times.map{ |i| "option #{i}" })
     actual = UiBibz::Ui::Core::Forms::Texts::AutoCompleteField.new('test', { option_tags: options, append: 'Append content', refresh: { target: { url: '/'}} }, { id: 'test' }).render
     expected = "<div class=\"field-refresh input-group ui_surround_field\"><span class=\"input-group-addon\">Append content</span><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control auto-complete-field\" autocomplete=\"true\" list=\"test-datalist\" /><datalist id=\"test-datalist\"><option value=\"option 0\">option 0</option>
-<option value=\"option 1\">option 1</option></datalist><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test-datalist&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fa fa-refresh\"></i> </span></div></div>"
+<option value=\"option 1\">option 1</option></datalist><div class=\"input-group-btn\"><span data-connect=\"{&quot;events&quot;:&quot;click&quot;,&quot;mode&quot;:&quot;remote&quot;,&quot;target&quot;:{&quot;selector&quot;:&quot;#test-datalist&quot;,&quot;url&quot;:&quot;/&quot;,&quot;data&quot;:[]}}\" class=\"btn-secondary ui-bibz-connect btn input-refresh-button\"><i class=\"glyph fas fa-sync-alt\"></i> </span></div></div>"
 
     assert_equal expected, actual
   end

data/test/ui/core/forms/texts/text_field_test.rb

@@ -18,7 +18,7 @@ class TextFieldTest < ActionView::TestCase
 
     test 'text_field size' do
       actual = UiBibz::Ui::Core::Forms::Texts::TextField.new('test', size: :xs, append: '1', prepend: '2').render
-      expected = "<div class=\"input-group-xs input-group ui_surround_field\"><span class=\"input-group-addon\">1</span><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control\" /><span class=\"input-group-addon\">2</span></div>"
+      expected = "<div class=\"input-group-xs input-group ui_surround_field\"><span class=\"input-group-addon\">1</span><input type=\"text\" name=\"test\" id=\"test\" class=\"form-control form-control-xs\" /><span class=\"input-group-addon\">2</span></div>"
 
       assert_equal expected, actual
     end

data/test/ui/core/icons/glyph_test.rb

@@ -1,29 +1,31 @@
 require 'test_helper'
 
+
 class GlyphTest < ActionView::TestCase
   include UiBibz::Helpers::Ui::CoreHelper
 
   test 'create glyph with a name' do
     actual   = ui_glyph('add')
-    expected = '<i class="glyph fa fa-add"></i>'
+    expected = '<i class="glyph fas fa-add"></i>'
     assert_equal expected, actual
   end
 
   test 'create glyph with hash' do
     actual   = ui_glyph({ name: 'add', size: 3, type: 'li'})
-    expected = '<i class="glyph fa fa-add fa-3x fa-li"></i>'
+    expected = '<i class="glyph fas fa-add fa-3x fa-li"></i>'
     assert_equal expected, actual
   end
 
   test 'create glyph with name and hash' do
     actual   = ui_glyph('add', { size: 3, type: 'li' })
-    expected = '<i class="glyph fa fa-add fa-3x fa-li"></i>'
+    expected = '<i class="glyph fas fa-add fa-3x fa-li"></i>'
     assert_equal expected, actual
   end
 
   test 'create glyph with label' do
     actual   = ui_glyph('add', { label: 'Example' })
-    expected = "<i class=\"glyph fa fa-add\"></i> Example"
+    expected = "<i class=\"glyph fas fa-add\"></i> Example"
     assert_equal expected, actual
   end
+
 end

data/test/ui/core/icons/star_test.rb

@@ -5,37 +5,37 @@ class StarTest < ActionView::TestCase
 
     test "stars with 1" do
       actual   = ui_star(1)
-      expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i></span>"
       assert_equal expected, actual
     end
 
     test "stars with 2.1" do
       actual   = ui_star(2.1)
-      expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star-half-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i></span>"
       assert_equal expected, actual
     end
 
     test "stars with 3.6 with status danger" do
       actual   = ui_star(3.6, { status: :danger })
-      expected = "<span class=\"stars-notation\"><i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star\"></i> <i class=\"glyph-danger glyph fa fa-star-half-o\"></i> <i class=\"glyph-danger glyph fa fa-star-o\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph-danger glyph fas fa-star\"></i> <i class=\"glyph-danger glyph fas fa-star\"></i> <i class=\"glyph-danger glyph fas fa-star\"></i> <i class=\"glyph-danger glyph fas fa-star-half-o\"></i> <i class=\"glyph-danger glyph fas fa-star-o\"></i></span>"
       assert_equal expected, actual
     end
 
     test "stars with 4.9" do
       actual   = ui_star(4.9)
-      expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star-half-o\"></i></span>"
       assert_equal expected, actual
     end
 
     test "stars with 5" do
       actual   = ui_star(5)
-      expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i></span>"
       assert_equal expected, actual
     end
 
     test "stars with number options 11.2" do
       actual   = ui_star(2.5, { num: 11.2 })
-      expected = "<span class=\"stars-notation\"><i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star\"></i> <i class=\"glyph fa fa-star-half-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i> <i class=\"glyph fa fa-star-o\"></i></span>"
+      expected = "<span class=\"stars-notation\"><i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star\"></i> <i class=\"glyph fas fa-star-half-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i> <i class=\"glyph fas fa-star-o\"></i></span>"
       assert_equal expected, actual
     end
 

data/test/ui/core/navigations/breadcrumb_test.rb

@@ -8,7 +8,7 @@ class BreadcrumbTest < ActionView::TestCase
       b.link 'Home', url: '#home', glyph: 'home'
       b.link 'state', { url: '#state', state: :active }
     end
-    expected = "<ol class=\"breadcrumb\"><li class=\"breadcrumb-item\"><a href=\"#home\"><i class=\"glyph fa fa-home\"></i> Home</a></li><li class=\"active breadcrumb-item\"><a href=\"#state\">state</a></li></ol>"
+    expected = "<ol class=\"breadcrumb\"><li class=\"breadcrumb-item\"><a href=\"#home\"><i class=\"glyph fas fa-home\"></i>  Home</a></li><li class=\"active breadcrumb-item\"><a href=\"#state\">state</a></li></ol>"
 
     assert_equal expected, actual
   end

data/test/ui/core/navigations/navbar_test.rb

@@ -31,7 +31,7 @@ class NavbarTest < ActionView::TestCase
       end
       nb.text 'test'
     end
-    expected = "<nav class=\"navbar navbar-light navbar-expand-lg\"><a class=\"navbar-brand\" href=\"/\">Brand</a><button class=\"navbar-toggler hidden-sm-up\" type=\"button\" data-toggle=\"collapse\" data-target=\"##{ actual.id }\">☰</button><div class=\"collapse navbar-collapse\" id=\"#{ actual.id }\"><ul class=\"navbar-nav\"><li class=\"nav-item\"><a class=\"active nav-link\" href=\"#Home\">Home</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#profile\">Profile</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#messages\">Messages</a></li></ul><form type=\"form_tag\" position=\"right\" class=\"navbar-form form-inline pull-right my-2 my-lg-0\" action=\"#\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><button class=\"btn\">Search</button></form><span class=\"navbar-text\">test</span></div></nav>"
+    expected = "<nav class=\"navbar navbar-light navbar-expand-lg\"><a class=\"navbar-brand\" href=\"/\">Brand</a><button class=\"navbar-toggler hidden-sm-up\" type=\"button\" data-toggle=\"collapse\" data-target=\"##{ actual.id }\">☰</button><div class=\"collapse navbar-collapse\" id=\"#{ actual.id }\"><ul class=\"navbar-nav\"><li class=\"nav-item\"><a class=\"active nav-link\" href=\"#Home\">Home</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#profile\">Profile</a></li><li class=\"nav-item\"><a class=\"nav-link\" href=\"#messages\">Messages</a></li></ul><form type=\"form_tag\" position=\"right\" class=\"navbar-form form-inline my-lg-0 my-2\" action=\"#\" accept-charset=\"UTF-8\" method=\"post\"><input name=\"utf8\" type=\"hidden\" value=\"&#x2713;\" /><button class=\"btn\">Search</button></form><span class=\"navbar-text\">test</span></div></nav>"
 
     assert_equal expected, actual.render
   end

data/test/ui/core/notifications/alert_test.rb

@@ -14,7 +14,7 @@ class AlertTest < ActionView::TestCase
       a.header 'Information'
       a.body 'Body text'
     end
-    expected = "<div class=\"alert-success alert alert-dismissible\" role=\"alert\"><h4 class=\"alert-header\"><i class=\"glyph fa fa-thumbs-o-up\"></i> Information<button type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\"><span aria-hidden=\"true\">×</span><span class=\"sr-only\">Close</span></button></h4><hr /><p class=\"alert-body mb-0\">Body text</p></div>"
+    expected = "<div class=\"alert-success alert alert-dismissible\" role=\"alert\"><h4 class=\"alert-header\"><i class=\"glyph fas fa-thumbs-o-up\"></i>  Information<button type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\"><span aria-hidden=\"true\">×</span><span class=\"sr-only\">Close</span></button></h4><hr /><p class=\"alert-body mb-0\">Body text</p></div>"
 
     assert_equal expected, actual
   end

data/test/ui/core/notifications/badge_test.rb

@@ -4,14 +4,14 @@ class BadgeTest < ActionView::TestCase
 
   test 'badge' do
     actual   = ui_badge 'state', status: :success, glyph: 'pencil'
-    expected = "<span class=\"badge-success badge\"><i class=\"glyph fa fa-pencil\"></i> state</span>"
+    expected = "<span class=\"badge-success badge\"><i class=\"glyph fas fa-pencil\"></i>  state</span>"
 
     assert_equal expected, actual
   end
 
   test 'badge pill' do
     actual   = ui_badge 'state', status: :success, type: :pill, glyph: 'pencil'
-    expected = "<span class=\"badge-success badge badge-pill\"><i class=\"glyph fa fa-pencil\"></i> state</span>"
+    expected = "<span class=\"badge-success badge badge-pill\"><i class=\"glyph fas fa-pencil\"></i>  state</span>"
 
     assert_equal expected, actual
   end

data/test/ui/ux/containers/panel_test.rb

@@ -0,0 +1,143 @@
+ require 'test_helper'
+
+class CardTest < ActionView::TestCase
+  include UiBibz::Helpers::Ui::UxHelper
+
+  test 'create panel' do
+    actual = ui_panel do |p|
+      p.header tap: true do |h|
+        h.title 'My header'
+        h.actions size: :sm, outline: true, status: :secondary do |a|
+          a.button 'Minimize', glyph: 'caret-up', text: false
+          a.button 'Options', glyph: 'cog', text: false
+          a.button 'Close', glyph: 'Close', text: false
+        end
+      end
+      p.toolbar justify: true, size: :sm do |t|
+        t.button_group do |bg|
+          bg.button 'Copy'
+          bg.button 'Cut'
+          bg.button 'Paste'
+        end
+        t.spacer 2
+        t.button_group do |bg|
+          bg.button 'Delete'
+        end
+      end
+      p.body 'Body'
+      p.toolbar size: :sm do |t|
+        t.button_group size: :sm do |bg|
+          bg.button 'Add', glyph: 'plus-circle', status: :success, text: false
+          bg.button 'Remove', glyph: 'minus-circle', status: :danger, text: false
+        end
+      end
+      p.footer 'Footer'
+    end
+    expected = "<div class=\"panel\"><div class=\"panel-header justify-content-between\"><div class=\"panel-title\">My header</div><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn-outline-secondary btn btn-sm without-text\"><i title=\"Minimize\" class=\"glyph fas fa-caret-up\"></i></button><button class=\"btn-outline-secondary btn btn-sm without-text\"><i title=\"Options\" class=\"glyph fas fa-cog\"></i></button><button class=\"btn-outline-secondary btn btn-sm without-text\"><i title=\"Close\" class=\"glyph fas fa-Close\"></i></button></div></div><div class=\"btn-toolbar justify-content-between panel-toolbar\" role=\"toolbar\"><div class=\"btn-group btn-group-sm mr-2\" role=\"group\"><button class=\"btn btn-sm\">Copy</button><button class=\"btn btn-sm\">Cut</button><button class=\"btn btn-sm\">Paste</button></div><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn btn-sm\">Delete</button></div></div><div class=\"panel-body\">Body</div><div class=\"btn-toolbar panel-toolbar\" role=\"toolbar\"><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn-success btn btn-sm without-text\"><i title=\"Add\" class=\"glyph fas fa-plus-circle\"></i></button><button class=\"btn-danger btn btn-sm without-text\"><i title=\"Remove\" class=\"glyph fas fa-minus-circle\"></i></button></div></div><div class=\"panel-footer\">Footer</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'panel with group' do
+    actual = ui_panel do |p|
+      p.header tap: true do |h|
+        h.title 'Main panel header'
+      end
+      p.toolbar justify: true, size: :sm do |t|
+        t.button_group do |bg|
+          bg.button 'Copy'
+          bg.button 'Cut'
+          bg.button 'Paste'
+        end
+        t.spacer 2
+        t.button_group do |bg|
+          bg.button 'Delete'
+        end
+      end
+      p.group do |d|
+        d.panel do |b|
+          b.header 'Left Panel Header'
+          b.body 'Left Panel Body'
+          b.footer 'Left Panel Footer'
+        end
+        d.panel do |b|
+          b.header 'Right Panel Header'
+          b.body 'Right Panel Body'
+        end
+      end
+      p.footer 'Main Panel Footer'
+    end
+    expected = "<div class=\"panel\"><div class=\"panel-header justify-content-between\"><div class=\"panel-title\">Main panel header</div></div><div class=\"btn-toolbar justify-content-between panel-toolbar\" role=\"toolbar\"><div class=\"btn-group btn-group-sm mr-2\" role=\"group\"><button class=\"btn btn-sm\">Copy</button><button class=\"btn btn-sm\">Cut</button><button class=\"btn btn-sm\">Paste</button></div><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn btn-sm\">Delete</button></div></div><div class=\"panel-group\"><div class=\"panel\"><div class=\"panel-header justify-content-between\">Left Panel Header</div><div class=\"panel-body\">Left Panel Body</div><div class=\"panel-footer\">Left Panel Footer</div></div><div class=\"panel\"><div class=\"panel-header justify-content-between\">Right Panel Header</div><div class=\"panel-body\">Right Panel Body</div></div></div><div class=\"panel-footer\">Main Panel Footer</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'panel with deck' do
+    actual = ui_panel do |p|
+      p.header tap: true do |h|
+        h.title 'Main panel header'
+      end
+      p.toolbar justify: true, size: :sm do |t|
+        t.button_group do |bg|
+          bg.button 'Copy'
+          bg.button 'Cut'
+          bg.button 'Paste'
+        end
+        t.spacer 2
+        t.button_group do |bg|
+          bg.button 'Delete'
+        end
+      end
+      p.deck do |d|
+        d.panel do |b|
+          b.header 'Left Panel Header'
+          b.body 'Left Panel Body'
+          b.footer 'Left Panel Footer'
+        end
+        d.panel do |b|
+          b.header 'Right Panel Header'
+          b.body 'Right Panel Body'
+        end
+      end
+      p.footer 'Main Panel Footer'
+    end
+    expected = "<div class=\"panel\"><div class=\"panel-header justify-content-between\"><div class=\"panel-title\">Main panel header</div></div><div class=\"btn-toolbar justify-content-between panel-toolbar\" role=\"toolbar\"><div class=\"btn-group btn-group-sm mr-2\" role=\"group\"><button class=\"btn btn-sm\">Copy</button><button class=\"btn btn-sm\">Cut</button><button class=\"btn btn-sm\">Paste</button></div><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn btn-sm\">Delete</button></div></div><div class=\"panel-deck-wrapper\"><div class=\"panel-deck\"><div class=\"panel\"><div class=\"panel-header justify-content-between\">Left Panel Header</div><div class=\"panel-body\">Left Panel Body</div><div class=\"panel-footer\">Left Panel Footer</div></div><div class=\"panel\"><div class=\"panel-header justify-content-between\">Right Panel Header</div><div class=\"panel-body\">Right Panel Body</div></div></div></div><div class=\"panel-footer\">Main Panel Footer</div></div>"
+
+    assert_equal expected, actual
+  end
+
+  test 'panel with column' do
+    actual = ui_panel do |p|
+      p.header tap: true do |h|
+        h.title 'Main panel header'
+      end
+      p.toolbar justify: true, size: :sm do |t|
+        t.button_group do |bg|
+          bg.button 'Copy'
+          bg.button 'Cut'
+          bg.button 'Paste'
+        end
+        t.spacer 2
+        t.button_group do |bg|
+          bg.button 'Delete'
+        end
+      end
+      p.column do |d|
+        d.panel do |b|
+          b.header 'Left Panel Header'
+          b.body 'Left Panel Body'
+          b.footer 'Left Panel Footer'
+        end
+        d.panel do |b|
+          b.header 'Right Panel Header'
+          b.body 'Right Panel Body'
+        end
+      end
+      p.footer 'Main Panel Footer'
+    end
+    expected = "<div class=\"panel\"><div class=\"panel-header justify-content-between\"><div class=\"panel-title\">Main panel header</div></div><div class=\"btn-toolbar justify-content-between panel-toolbar\" role=\"toolbar\"><div class=\"btn-group btn-group-sm mr-2\" role=\"group\"><button class=\"btn btn-sm\">Copy</button><button class=\"btn btn-sm\">Cut</button><button class=\"btn btn-sm\">Paste</button></div><div class=\"btn-group btn-group-sm\" role=\"group\"><button class=\"btn btn-sm\">Delete</button></div></div><div class=\"panel-columns\"><div class=\"panel\"><div class=\"panel-header justify-content-between\">Left Panel Header</div><div class=\"panel-body\">Left Panel Body</div><div class=\"panel-footer\">Left Panel Footer</div></div><div class=\"panel\"><div class=\"panel-header justify-content-between\">Right Panel Header</div><div class=\"panel-body\">Right Panel Body</div></div></div><div class=\"panel-footer\">Main Panel Footer</div></div>"
+
+    assert_equal expected, actual
+  end
+
+end