From c2d2c7566068c4c9864db231b2ddc162db7bad14 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Tue, 21 May 2024 09:23:15 +0100 Subject: [PATCH 01/25] bump Bootstrap to v5.3.3 --- app/assets/javascripts/ndr_ui/index.js | 1 + lib/ndr_ui/engine.rb | 1 - ndr_ui.gemspec | 3 ++- 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/ndr_ui/index.js b/app/assets/javascripts/ndr_ui/index.js index 217299a..1f5d48e 100644 --- a/app/assets/javascripts/ndr_ui/index.js +++ b/app/assets/javascripts/ndr_ui/index.js @@ -1,3 +1,4 @@ //= require jquery3 //= require jquery_ujs +//= require popper //= require bootstrap diff --git a/lib/ndr_ui/engine.rb b/lib/ndr_ui/engine.rb index f3413e3..ac3fedb 100644 --- a/lib/ndr_ui/engine.rb +++ b/lib/ndr_ui/engine.rb @@ -1,4 +1,3 @@ -require 'bootstrap-sass/engine' require 'jquery-rails' require 'sprockets/railtie' diff --git a/ndr_ui.gemspec b/ndr_ui.gemspec index 200b5b9..640a6ea 100644 --- a/ndr_ui.gemspec +++ b/ndr_ui.gemspec @@ -24,10 +24,11 @@ Gem::Specification.new do |spec| spec.required_ruby_version = '>= 3.0.0' spec.add_dependency 'rails', '>= 6.1', '< 7.1' - spec.add_dependency 'bootstrap-sass', '~> 3.4.1' + spec.add_dependency 'bootstrap', '~> 5.3.3' spec.add_dependency 'jquery-rails', '~> 4.6' spec.add_dependency 'sprockets', '>= 4.0' spec.add_dependency 'sprockets-rails', '>= 3.0.0' + spec.add_dependency 'dartsass-sprockets' # Rails 7.0 and 7.1 do not support sqlite3 2.x; they specify gem "sqlite3", "~> 1.4" # in lib/active_record/connection_adapters/sqlite3_adapter.rb From 5d36bdb561e46ddebf4b40a9fe34af83d7ae5c24 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Tue, 12 Nov 2024 15:04:46 +0000 Subject: [PATCH 02/25] further deleting of `bootstrap-sass` --- app/assets/stylesheets/ndr_ui/index.scss | 2 -- lib/ndr_ui/engine.rb | 1 + 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/app/assets/stylesheets/ndr_ui/index.scss b/app/assets/stylesheets/ndr_ui/index.scss index 831967f..5c10b47 100644 --- a/app/assets/stylesheets/ndr_ui/index.scss +++ b/app/assets/stylesheets/ndr_ui/index.scss @@ -1,5 +1,3 @@ -// "bootstrap-sprockets" must be imported before "bootstrap" and "bootstrap/variables" -@import "bootstrap-sprockets"; @import "bootstrap"; // Fieldsets don't behave properly with Bootstrap in Firefox diff --git a/lib/ndr_ui/engine.rb b/lib/ndr_ui/engine.rb index ac3fedb..2788717 100644 --- a/lib/ndr_ui/engine.rb +++ b/lib/ndr_ui/engine.rb @@ -1,3 +1,4 @@ +require 'bootstrap/engine' require 'jquery-rails' require 'sprockets/railtie' From d6b0a89caa56ef293f200e801c9c0ab9c558c684 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Wed, 13 Nov 2024 15:49:53 +0000 Subject: [PATCH 03/25] require 'popper_js' by default --- lib/ndr_ui/engine.rb | 1 + 1 file changed, 1 insertion(+) diff --git a/lib/ndr_ui/engine.rb b/lib/ndr_ui/engine.rb index 2788717..f9117e8 100644 --- a/lib/ndr_ui/engine.rb +++ b/lib/ndr_ui/engine.rb @@ -1,6 +1,7 @@ require 'bootstrap/engine' require 'jquery-rails' require 'sprockets/railtie' +require 'popper_js' module NdrUi # This is where we define the base class for the engine From 36ece671696b46d312a36394e8a50cd1a20e9a5b Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Sun, 1 Dec 2024 20:07:08 +0000 Subject: [PATCH 04/25] update helpers --- .../{accordion.rb => accordion_helper.rb} | 58 ++++++++++--- app/helpers/ndr_ui/bootstrap/card_helper.rb | 75 ++++++++++++++++ .../ndr_ui/bootstrap/dropdown_helper.rb | 23 +++-- app/helpers/ndr_ui/bootstrap/panel_helper.rb | 87 ------------------- app/helpers/ndr_ui/bootstrap_helper.rb | 35 ++++---- .../ndr_ui/bootstrap/accordion_helper_test.rb | 47 ++++++++++ .../ndr_ui/bootstrap/card_helper_test.rb | 25 ++++++ .../ndr_ui/bootstrap/dropdown_helper_test.rb | 10 +-- .../ndr_ui/bootstrap/panel_helper_test.rb | 61 ------------- test/helpers/ndr_ui/bootstrap_helper_test.rb | 54 ++++++------ 10 files changed, 257 insertions(+), 218 deletions(-) rename app/helpers/ndr_ui/bootstrap/{accordion.rb => accordion_helper.rb} (58%) create mode 100644 app/helpers/ndr_ui/bootstrap/card_helper.rb delete mode 100644 app/helpers/ndr_ui/bootstrap/panel_helper.rb create mode 100644 test/helpers/ndr_ui/bootstrap/accordion_helper_test.rb create mode 100644 test/helpers/ndr_ui/bootstrap/card_helper_test.rb delete mode 100644 test/helpers/ndr_ui/bootstrap/panel_helper_test.rb diff --git a/app/helpers/ndr_ui/bootstrap/accordion.rb b/app/helpers/ndr_ui/bootstrap/accordion_helper.rb similarity index 58% rename from app/helpers/ndr_ui/bootstrap/accordion.rb rename to app/helpers/ndr_ui/bootstrap/accordion_helper.rb index d13342b..48e3bb7 100644 --- a/app/helpers/ndr_ui/bootstrap/accordion.rb +++ b/app/helpers/ndr_ui/bootstrap/accordion_helper.rb @@ -1,5 +1,33 @@ module NdrUi module Bootstrap + module AccordionHelper + # Creates an accordion wrapper and creates a new NdrUi::Bootstrap::Accordion instance + # Creates an plain or nested bootstrap accordion along with bootstrap_accordion_group + # method at NdrUi::Bootstrap::Accordion class. + # + # ==== Signatures + # + # bootstrap_accordion_tag(dom_id) do |accordion| + # #content for accordion items + # end + # + # ==== Examples + # + # <%= bootstrap_accordion_group :fruit do |fruit_accordion| %> + # <% end %> + # # =>
+ def bootstrap_accordion_tag(dom_id, options = {}, &block) + return unless block_given? + + options.stringify_keys! + accordion = ::NdrUi::Bootstrap::Accordion.new(dom_id, self) + seamless = options['seamless'] + content_tag(:div, id: accordion.dom_id.to_s, class: "accordion#{' accordion-flush' if seamless}") do + yield(accordion) + end + end + end + # Creates a plain or nested bootstrap accordion along with bootstrap_accordion_tag helper # method. # Produce the inner html code of an accordion item. @@ -66,13 +94,14 @@ def initialize(accordion_id, template) def bootstrap_accordion_group(heading, options = {}, &block) return unless block_given? + options.stringify_keys! - seamless = options['seamless'] @index += 1 - content = @template.capture(&block) - content = @template.content_tag('div', content, class: 'panel-body') unless seamless - @template.content_tag('div', class: 'panel panel-default') do - div_panel_heading(heading) + div_panel_collapse(content, options['open']) + content = @template.content_tag('div',class: 'accordion-body') do + @template.capture(&block) + end + @template.content_tag('div', class: 'accordion-item') do + accordion_header_tag(heading, options['open']) + accordion_collapse_tag(content, options['open']) end end @@ -82,20 +111,21 @@ def group_id "#{@dom_id}_#{@index}" end - def div_panel_heading(heading) - @template.content_tag('div', class: 'panel-heading') do - @template.content_tag('h4', class: 'panel-title') do - @template.link_to(heading, - "##{group_id}", - 'data-toggle': 'collapse', 'data-parent': "##{@dom_id}") - end + def accordion_header_tag(heading, open_by_default) + @template.content_tag('h2', class: 'accordion-header') do + @template.button_tag(heading, class: "accordion-button#{' collapsed' unless open_by_default}", + type: :button, + 'data-bs-toggle': 'collapse', + 'data-bs-target': "##{group_id}") + end end - def div_panel_collapse(content, open_by_default) + def accordion_collapse_tag(content, open_by_default) @template.content_tag('div', content, id: group_id, - class: "panel-collapse collapse#{' in' if open_by_default}") + class: "accordion-collapse collapse#{' show' if open_by_default}", + 'data-bs-parent': "##{@dom_id}") end end end diff --git a/app/helpers/ndr_ui/bootstrap/card_helper.rb b/app/helpers/ndr_ui/bootstrap/card_helper.rb new file mode 100644 index 0000000..e13ed68 --- /dev/null +++ b/app/helpers/ndr_ui/bootstrap/card_helper.rb @@ -0,0 +1,75 @@ +module NdrUi + module Bootstrap + # This provides accordion + module CardHelper + CARD_TYPES = %w[primary secondary success danger warning info light dark].freeze + + # Creates a bootstrap card wrapper. the heading is wrapped in a card-header. + # The content is not wrapped in a card-body to enable seamless tables and lists. + # + # ==== Signatures + # + # bootstrap_card_tag(heading, options = {}) do + # #content for card + # end + # + # ==== Examples + # + # <%= bootstrap_card_tag 'Apples', type: :warning, id: 'fruit' do %> + # Check it out!! + # <% end %> + # # =>
+ #
+ #

Apples

+ #
+ #
+ # Check it out!! + #
+ def bootstrap_card_tag(heading, controls = nil, options = {}, &block) + return unless block_given? + + options.stringify_keys! + classes = %w[card mb-3] + classes << "text-bg-#{options.delete('type')}" if CARD_TYPES.include?(options['type'].to_s) + classes += options['class'].to_s.split(' ') + options['class'] = classes.uniq.join(' ') + + header = content_tag(:div, class: 'card-header d-flex') do + concat content_tag(:h4, heading, class: 'card-title') + concat content_tag(:div, controls, class: 'ms-auto') unless controls.blank? + end + + content_tag(:div, header + capture(&block), options) + end + + # Creates a simple bootstrap card body. + # + # ==== Signatures + # + # bootstrap_card_body_tag do + # #content for card body + # end + # + # ==== Examples + # + # <%= bootstrap_card_body_tag do %> + # Check it out!! + # <% end %> + # # =>
Check it out!!
+ def bootstrap_card_body_tag(&block) + return unless block_given? + content_tag(:div, capture(&block), class: 'card-body') + end + + # Creates a bootstrap card wrapper. the heading is wrapped in a card-header. + # The content is wrapped in a ul.list-group to enable seamless lists. + # It doesn't support controls (controls = nil). + def bootstrap_card_list(title, options = {}, &block) + bootstrap_card_tag(title, nil, options) do + content_tag(:div, capture(&block), class: 'list-group list-group-flush') + end + end + + end + end +end diff --git a/app/helpers/ndr_ui/bootstrap/dropdown_helper.rb b/app/helpers/ndr_ui/bootstrap/dropdown_helper.rb index 592a6f3..96564af 100644 --- a/app/helpers/ndr_ui/bootstrap/dropdown_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/dropdown_helper.rb @@ -23,12 +23,18 @@ def bootstrap_list_link_to(*args, &block) name = args.first options = args.second || {} - html_options = args.third - li_options = {} + html_options = args.third || {} - li_options[:class] = 'active' if current_page?(options) + klass = html_options[:class].to_s.split(' ') + if html_options.delete(:mode).to_s == 'nav' + klass << 'nav-link' + else + klass << 'dropdown-item' + end + klass << 'active' if current_page?(options) + html_options[:class] = klass.join(' ') - content_tag(:li, link_to(name, options, html_options), li_options) + content_tag(:li, link_to(name, options, html_options)) end # Creates a Boostrap list header. @@ -43,7 +49,7 @@ def bootstrap_list_link_to(*args, &block) # # => def bootstrap_list_header_tag(name, options = {}) options[:class] = (options[:class].to_s.split(' ') + ['dropdown-header']).join(' ') - content_tag(:li, name, { role: 'presentation' }.merge(options)) + content_tag(:li, content_tag(:h6, name, options)) end # Creates a Boostrap list divider. @@ -55,10 +61,9 @@ def bootstrap_list_header_tag(name, options = {}) # ==== Examples # # <%= bootstrap_list_divider_tag %> - # # =>
  • - def bootstrap_list_divider_tag(options = {}) - options[:class] = (options[:class].to_s.split(' ') + ['divider']).join(' ') - content_tag(:li, '', { role: 'presentation' }.merge(options)) + # # =>
  • + def bootstrap_list_divider_tag + content_tag(:li, content_tag(:hr, '', class: 'dropdown-divider')) end end end diff --git a/app/helpers/ndr_ui/bootstrap/panel_helper.rb b/app/helpers/ndr_ui/bootstrap/panel_helper.rb deleted file mode 100644 index bb2240b..0000000 --- a/app/helpers/ndr_ui/bootstrap/panel_helper.rb +++ /dev/null @@ -1,87 +0,0 @@ -module NdrUi - module Bootstrap - # This provides accordion - module PanelHelper - PANEL_SUBCLASSES = %w( - panel-default - panel-primary - panel-success - panel-info - panel-warning - panel-danger - ).freeze - - # Creates an accordion wrapper and creates a new NdrUi::Bootstrap::Accordion instance - # Creates an plain or nested bootstrap accordion along with bootstrap_accordion_group - # method at NdrUi::Bootstrap::Accordion class. - # - # ==== Signatures - # - # bootstrap_accordion_tag(dom_id) do |accordion| - # #content for accordion items - # end - # - # ==== Examples - # - # <%= bootstrap_accordion_group :fruit do |fruit_accordion| %> - # <% end %> - # # =>
    - def bootstrap_accordion_tag(dom_id, &block) - return unless block_given? - accordion = ::NdrUi::Bootstrap::Accordion.new(dom_id, self) - '
    '.html_safe + - capture { yield(accordion) } + - '
    '.html_safe - end - - # Creates a bootstrap panel wrapper. the heading is wrapped in a panel-heading. - # The content is not wrapped in a panel-body to enable seamless tables and lists. - # - # ==== Signatures - # - # bootstrap_panel_tag(heading, options = {}) do - # #content for panel - # end - # - # ==== Examples - # - # <%= bootstrap_panel_tag 'Apples', class: 'panel-warning', id: 'fruit' do %> - # Check it out!! - # <% end %> - # # =>
    Apples
    - # Check it out!!
    - def bootstrap_panel_tag(heading, options = {}, &block) - return unless block_given? - options.stringify_keys! - classes = %w(panel) - classes += options['class'].to_s.split(' ') if options.include?('class') - classes << 'panel-default' if (classes & PANEL_SUBCLASSES).empty? - options['class'] = classes.uniq.join(' ') - - content_tag(:div, - content_tag(:div, heading, class: 'panel-heading') + - capture(&block), - options) - end - - # Creates a simple bootstrap panel body. - # - # ==== Signatures - # - # bootstrap_panel_body_tag do - # #content for panel body - # end - # - # ==== Examples - # - # <%= bootstrap_panel_body_tag do %> - # Check it out!! - # <% end %> - # # =>
    Check it out!!
    - def bootstrap_panel_body_tag(&block) - return unless block_given? - content_tag(:div, capture(&block), class: 'panel-body') - end - end - end -end diff --git a/app/helpers/ndr_ui/bootstrap_helper.rb b/app/helpers/ndr_ui/bootstrap_helper.rb index c47d85b..6e40ae4 100644 --- a/app/helpers/ndr_ui/bootstrap_helper.rb +++ b/app/helpers/ndr_ui/bootstrap_helper.rb @@ -1,10 +1,11 @@ module NdrUi # Provides helper methods for the Twitter Bootstrap framework module BootstrapHelper # rubocop:disable Metrics/ModuleLength + include ::NdrUi::Bootstrap::AccordionHelper include ::NdrUi::Bootstrap::BreadcrumbsHelper + include ::NdrUi::Bootstrap::CardHelper include ::NdrUi::Bootstrap::DropdownHelper include ::NdrUi::Bootstrap::ModalHelper - include ::NdrUi::Bootstrap::PanelHelper # Creates an alert box of the given +type+. It supports the following alert box types # :alert, :danger, :info and :success. @@ -65,10 +66,10 @@ def bootstrap_alert_tag(*args, &block) end options['class'] = classes.join(' ') - message = button_tag('×'.html_safe, + message = button_tag('', type: 'button', - class: 'close', - "data-dismiss": 'alert') + message if options.delete('dismissible') + class: 'btn-close', + "data-bs-dismiss": 'alert') + message if options.delete('dismissible') content_tag(:div, message, options) end end @@ -100,13 +101,15 @@ def bootstrap_label_tag(type, message) # ==== Examples # # <%= bootstrap_badge_tag(:success, 'Check it out!!') %> - # # => Check it out!! <%# Bootstrap 3 %> + # # => Check it out!! <%# Bootstrap 3 %> # - # TODO: In bootstrap 4, these will likely need to be implemented using "pill labels", - # which will once again allow the `type` argument to colour them. - # - def bootstrap_badge_tag(_type, count) - content_tag(:span, count, class: 'badge') + def bootstrap_badge_tag(type, count) + type_map = { + important: :danger, + default: :secondary + } + style = type_map[type] || type + content_tag(:span, count, class: "badge rounded-pill text-bg-#{style}") end # Creates a simple bootstrap navigation caret. @@ -132,13 +135,15 @@ def bootstrap_caret_tag # ==== Examples # # <%= bootstrap_dropdown_toggle_tag('Check it out!!') %> - # # => Check it - # out!! + # # => def bootstrap_dropdown_toggle_tag(body) link_to(ERB::Util.html_escape(body) + ' '.html_safe + bootstrap_caret_tag, '#', - class: 'dropdown-toggle', - 'data-toggle': 'dropdown') + role: 'button', + class: 'nav-link dropdown-toggle', + 'data-bs-toggle': 'dropdown', + 'aria-expanded': 'false') end # Creates a simple bootstrap icon. @@ -193,7 +198,7 @@ def bootstrap_tab_nav_tag(title, linkto, active = false) # Convenience wrapper for a bootstrap_list_link_to with badge def bootstrap_list_badge_and_link_to(type, count, name, path) - html = content_tag(:div, bootstrap_badge_tag(type, count), class: 'pull-right') + name + html = content_tag(:div, bootstrap_badge_tag(type, count), class: 'float-end') + name bootstrap_list_link_to(html, path) end diff --git a/test/helpers/ndr_ui/bootstrap/accordion_helper_test.rb b/test/helpers/ndr_ui/bootstrap/accordion_helper_test.rb new file mode 100644 index 0000000..b38997e --- /dev/null +++ b/test/helpers/ndr_ui/bootstrap/accordion_helper_test.rb @@ -0,0 +1,47 @@ +require 'test_helper' + +module NdrUi + module Bootstrap + # Test bootstrap accordion helpers + class AccordionHelperTest < ActionView::TestCase + test 'bootstrap_accordion_tag' do + html = bootstrap_accordion_tag :fruit do |fruit_accordion| + inner_html = fruit_accordion.bootstrap_accordion_group 'Apple' do + 'This is an apple.' + end + inner_html += fruit_accordion.bootstrap_accordion_group 'Orange', open: true do + 'This is an orange.' + end + inner_html + end + assert_dom_equal '
    ' \ + '

    ' \ + '

    ' \ + '
    ' \ + '
    This is an apple.
    ' \ + '

    ' \ + '

    ' \ + '
    ' \ + '
    This is an orange.
    ', + html + end + + test 'bootstrap_accordion_tag with seamless option' do + html = bootstrap_accordion_tag :fruit, seamless: true do |fruit_accordion| + fruit_accordion.bootstrap_accordion_group 'Apple' do + 'This is an apple.' + end + end + assert_dom_equal '
    ' \ + '

    ' \ + '
    ' \ + '
    This is an apple.
    ', + html + end + end + end +end diff --git a/test/helpers/ndr_ui/bootstrap/card_helper_test.rb b/test/helpers/ndr_ui/bootstrap/card_helper_test.rb new file mode 100644 index 0000000..afddd90 --- /dev/null +++ b/test/helpers/ndr_ui/bootstrap/card_helper_test.rb @@ -0,0 +1,25 @@ +require 'test_helper' + +module NdrUi + module Bootstrap + # Test bootstrap card helpers + class CardHelperTest < ActionView::TestCase + test 'bootstrap_card_tag' do + html = bootstrap_card_tag 'Apples', nil, type: 'warning', id: 'fruit' do + 'Check it out!!' + end + assert_dom_equal '
    ' \ + '

    Apples

    ' \ + 'Check it out!!
    ', + html + end + + test 'bootstrap_card_body_tag' do + html = bootstrap_card_body_tag do + 'Check it out!!' + end + assert_dom_equal '
    Check it out!!
    ', html + end + end + end +end diff --git a/test/helpers/ndr_ui/bootstrap/dropdown_helper_test.rb b/test/helpers/ndr_ui/bootstrap/dropdown_helper_test.rb index 95f4302..d97293e 100644 --- a/test/helpers/ndr_ui/bootstrap/dropdown_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap/dropdown_helper_test.rb @@ -8,25 +8,25 @@ class DropdownHelperTest < ActionView::TestCase stubs(:inbox_path).returns('/inbox') stubs(:current_page?).returns(false) refute current_page?(inbox_path) - assert_dom_equal "
  • #{link_to('test', inbox_path)}
  • ", + assert_dom_equal "
  • #{link_to('test', inbox_path, class: 'dropdown-item')}
  • ", bootstrap_list_link_to('test', inbox_path) - assert_dom_equal "
  • #{link_to('block', inbox_path)}
  • ", + assert_dom_equal "
  • #{link_to('block', inbox_path, class: 'dropdown-item')}
  • ", bootstrap_list_link_to(inbox_path) { 'block' } stubs(:current_page?).returns(true) assert current_page?(inbox_path) - assert_dom_equal "
  • #{link_to('test', inbox_path)}
  • ", + assert_dom_equal "
  • #{link_to('test', inbox_path, class: 'dropdown-item active')}
  • ", bootstrap_list_link_to('test', inbox_path) end test 'bootstrap_list_header_tag' do - assert_dom_equal '', + assert_dom_equal '
  • ', bootstrap_list_header_tag('Apples') assert bootstrap_list_header_tag(unsafe_string).html_safe?, 'bootstrap_list_header_tag is not html_safe' end test 'bootstrap_list_divider_tag' do - assert_dom_equal '', + assert_dom_equal '
  • ', bootstrap_list_divider_tag assert bootstrap_list_divider_tag.html_safe?, 'bootstrap_list_divider_tag is not html_safe' end diff --git a/test/helpers/ndr_ui/bootstrap/panel_helper_test.rb b/test/helpers/ndr_ui/bootstrap/panel_helper_test.rb deleted file mode 100644 index 25f6982..0000000 --- a/test/helpers/ndr_ui/bootstrap/panel_helper_test.rb +++ /dev/null @@ -1,61 +0,0 @@ -require 'test_helper' - -module NdrUi - module Bootstrap - # Test bootstrap panel helpers - class PanelHelperTest < ActionView::TestCase - test 'bootstrap_accordion_tag' do - html = bootstrap_accordion_tag :fruit do |fruit_accordion| - inner_html = fruit_accordion.bootstrap_accordion_group 'Apple' do - 'This is an apple.' - end - inner_html += fruit_accordion.bootstrap_accordion_group 'Orange', open: true do - 'This is an orange.' - end - inner_html - end - assert_dom_equal '
    ' \ - '
    ' \ - '
    This is an apple.
    ' \ - '
    ' \ - '

    ' \ - 'Orange' \ - '

    ' \ - '
    This is an orange.
    ', - html - end - - test 'bootstrap_accordion_group_with_seamless_option' do - html = bootstrap_accordion_tag :fruit do |fruit_accordion| - fruit_accordion.bootstrap_accordion_group 'Apple', seamless: true do - 'This is an apple.' - end - end - assert_dom_equal '
    ' \ - '
    ' \ - 'This is an apple.
    ', - html - end - - test 'bootstrap_panel_tag' do - html = bootstrap_panel_tag 'Apples', class: 'panel-warning', id: 'fruit' do - 'Check it out!!' - end - assert_dom_equal '
    ' \ - '
    Apples
    Check it out!!
    ', - html - end - - test 'bootstrap_panel_body_tag' do - html = bootstrap_panel_body_tag do - 'Check it out!!' - end - assert_dom_equal '
    Check it out!!
    ', html - end - end - end -end diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index f6a932c..1f4e509 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -9,34 +9,34 @@ module NdrUi class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_alert_tag with message parameter' do assert_dom_equal '
    ' \ - 'Apples
    ', + '' \ + 'Apples', bootstrap_alert_tag(:danger, 'Apples') assert_dom_equal '
    ' \ - 'Apples
    ', + '' \ + 'Apples', bootstrap_alert_tag(:warning, 'Apples') assert_dom_equal '
    ' \ - 'Apples
    ', + '' \ + 'Apples', bootstrap_alert_tag(:info, 'Apples') assert_dom_equal '
    ' \ - '
    ', + '' \ + '', bootstrap_alert_tag(:success, nil) assert_dom_equal '
    ' \ - '
    ', + '' \ + '', bootstrap_alert_tag(:success, '') assert_dom_equal '
    ' \ - 'Apples
    ', + '' \ + 'Apples', bootstrap_alert_tag(:warning, 'Apples', dismissible: true) assert_dom_equal '
    Apples
    ', bootstrap_alert_tag(:warning, 'Apples', dismissible: false) assert_dom_equal '
    ' \ - 'Apples
    ', + '' \ + 'Apples', bootstrap_alert_tag(:warning, 'Apples', dismissible: true, id: 'apple_123') assert_dom_equal '
    Apples
    ', bootstrap_alert_tag(:warning, 'Apples', dismissible: false, id: 'apple_123') @@ -46,13 +46,13 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_alert_tag with message block' do assert_dom_equal '
    ' \ - 'Pears
    ', + '' \ + 'Pears', bootstrap_alert_tag(:info) { 'Pears' } assert_dom_equal '
    ' \ - '
    ', + '' \ + '', bootstrap_alert_tag(:danger) {} assert_dom_equal '
    Pears
    ', @@ -82,12 +82,11 @@ class BootstrapHelperTest < ActionView::TestCase end test 'bootstrap_badge_tag with message parameter' do - assert_dom_equal 'Pears', bootstrap_badge_tag(:default, 'Pears') - assert_dom_equal 'Pears', bootstrap_badge_tag(:success, 'Pears') - assert_dom_equal 'Pears', bootstrap_badge_tag(:warning, 'Pears') - assert_dom_equal 'Pears', bootstrap_badge_tag(:important, 'Pears') - assert_dom_equal 'Pears', bootstrap_badge_tag(:info, 'Pears') - assert_dom_equal 'Pears', bootstrap_badge_tag(:inverse, 'Pears') + assert_dom_equal 'Pears', bootstrap_badge_tag(:default, 'Pears') + assert_dom_equal 'Pears', bootstrap_badge_tag(:success, 'Pears') + assert_dom_equal 'Pears', bootstrap_badge_tag(:warning, 'Pears') + assert_dom_equal 'Pears', bootstrap_badge_tag(:important, 'Pears') + assert_dom_equal 'Pears', bootstrap_badge_tag(:info, 'Pears') assert bootstrap_badge_tag(:warning, unsafe_string).html_safe?, 'bootstrap_badge_tag is not html_safe' end @@ -98,7 +97,8 @@ class BootstrapHelperTest < ActionView::TestCase end test 'bootstrap_dropdown_toggle_tag' do - assert_dom_equal 'Apples ' \ + assert_dom_equal 'Apples ' \ "#{bootstrap_caret_tag}", bootstrap_dropdown_toggle_tag('Apples') assert bootstrap_dropdown_toggle_tag(unsafe_string).html_safe?, @@ -132,8 +132,8 @@ class BootstrapHelperTest < ActionView::TestCase stubs(:current_page?).returns(false) refute current_page?(inbox_path) - html = content_tag(:div, bootstrap_badge_tag(:important, 99), class: 'pull-right') + 'Inbox' - assert_dom_equal "
  • #{link_to(html, inbox_path)}
  • ", + html = content_tag(:div, bootstrap_badge_tag(:important, 99), class: 'float-end') + 'Inbox' + assert_dom_equal "
  • #{link_to(html, inbox_path, class: 'dropdown-item')}
  • ", bootstrap_list_badge_and_link_to(:important, 99, 'Inbox', inbox_path) end From a87c6d3c4ed637b54558cab92ac9972011deb3f7 Mon Sep 17 00:00:00 2001 From: Brian Shand Date: Mon, 2 Dec 2024 14:02:16 +0000 Subject: [PATCH 05/25] GitHub Actions gem installation fix: run tests with psych version 4 --- ndr_ui.gemspec | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/ndr_ui.gemspec b/ndr_ui.gemspec index 3e9a057..91e5bde 100644 --- a/ndr_ui.gemspec +++ b/ndr_ui.gemspec @@ -6,6 +6,8 @@ unless Gem::Version.new(Gem::VERSION) >= Gem::Version.new('3.0.2') raise 'Please update RubyGems to at least 3.0.2 - lower versions build a broken ndr_ui.gem!' end +# We list development dependencies for all Rails versions here. +# Rails version-specific dependencies can go in the relevant Gemfile. # rubocop:disable Gemspec/DevelopmentDependencies Gem::Specification.new do |spec| spec.name = 'ndr_ui' @@ -23,18 +25,23 @@ Gem::Specification.new do |spec| spec.required_ruby_version = '>= 3.0.0' - spec.add_dependency 'rails', '>= 6.1', '< 7.3' spec.add_dependency 'bootstrap', '~> 5.3.3' + spec.add_dependency 'dartsass-sprockets' spec.add_dependency 'jquery-rails', '~> 4.6' + spec.add_dependency 'rails', '>= 6.1', '< 7.3' spec.add_dependency 'sprockets', '>= 4.0' spec.add_dependency 'sprockets-rails', '>= 3.0.0' - spec.add_dependency 'dartsass-sprockets' # Rails 6.1 and 7.0 do not support sqlite3 2.x; they specify gem "sqlite3", "~> 1.4" # in lib/active_record/connection_adapters/sqlite3_adapter.rb # cf. gemfiles/Gemfile.rails70 spec.add_development_dependency 'sqlite3' + # Workaround build issue on GitHub Actions with ruby <= 3.1 when installing sass-embedded + # gem version 1.81.0: NoMethodError: undefined method `parse' for # + # https://bugs.ruby-lang.org/issues/19371 + spec.add_development_dependency 'psych', '< 5' + spec.add_development_dependency 'mocha', '~> 2.0' spec.add_development_dependency 'ndr_dev_support', '>= 6.0' spec.add_development_dependency 'net-smtp' From f526f15d902a0c3838a05f0cbf1be2647ede4e94 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Tue, 3 Dec 2024 19:58:23 +0000 Subject: [PATCH 06/25] more card component tweaks --- app/helpers/ndr_ui/bootstrap/card_helper.rb | 4 ++-- test/helpers/ndr_ui/bootstrap/card_helper_test.rb | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/helpers/ndr_ui/bootstrap/card_helper.rb b/app/helpers/ndr_ui/bootstrap/card_helper.rb index e13ed68..43f1b30 100644 --- a/app/helpers/ndr_ui/bootstrap/card_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/card_helper.rb @@ -30,11 +30,11 @@ def bootstrap_card_tag(heading, controls = nil, options = {}, &block) options.stringify_keys! classes = %w[card mb-3] - classes << "text-bg-#{options.delete('type')}" if CARD_TYPES.include?(options['type'].to_s) + classes << "bg-#{options.delete('type')}-subtle" if CARD_TYPES.include?(options['type'].to_s) classes += options['class'].to_s.split(' ') options['class'] = classes.uniq.join(' ') - header = content_tag(:div, class: 'card-header d-flex') do + header = content_tag(:div, class: "card-header#{' d-flex' if controls.present?}") do concat content_tag(:h4, heading, class: 'card-title') concat content_tag(:div, controls, class: 'ms-auto') unless controls.blank? end diff --git a/test/helpers/ndr_ui/bootstrap/card_helper_test.rb b/test/helpers/ndr_ui/bootstrap/card_helper_test.rb index afddd90..d42adee 100644 --- a/test/helpers/ndr_ui/bootstrap/card_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap/card_helper_test.rb @@ -8,8 +8,8 @@ class CardHelperTest < ActionView::TestCase html = bootstrap_card_tag 'Apples', nil, type: 'warning', id: 'fruit' do 'Check it out!!' end - assert_dom_equal '
    ' \ - '

    Apples

    ' \ + assert_dom_equal '
    ' \ + '

    Apples

    ' \ 'Check it out!!
    ', html end From 62dbc2b56f7a8811c062be5188341dd209cb982b Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Wed, 4 Dec 2024 17:45:14 +0000 Subject: [PATCH 07/25] wells, cards, form (horizontal) --- app/assets/stylesheets/ndr_ui/index.scss | 2 +- app/builders/ndr_ui/bootstrap/readonly.rb | 22 +++++++++--------- app/builders/ndr_ui/bootstrap_builder.rb | 4 +++- app/helpers/ndr_ui/bootstrap/card_helper.rb | 23 +++++++++++++++++++ app/helpers/ndr_ui/bootstrap_helper.rb | 15 +----------- .../bootstrap_builder/datepicker_test.rb | 2 +- .../inline_errors_and_warnings_test.rb | 2 +- .../ndr_ui/bootstrap_builder/readonly_test.rb | 10 ++++---- .../builders/ndr_ui/bootstrap_builder_test.rb | 6 ++--- test/helpers/ndr_ui/bootstrap_helper_test.rb | 6 ++--- 10 files changed, 52 insertions(+), 40 deletions(-) diff --git a/app/assets/stylesheets/ndr_ui/index.scss b/app/assets/stylesheets/ndr_ui/index.scss index 5c10b47..d0df0c0 100644 --- a/app/assets/stylesheets/ndr_ui/index.scss +++ b/app/assets/stylesheets/ndr_ui/index.scss @@ -10,7 +10,7 @@ // for input fields with input-addons, remove background and border when the form is readonly. .input-group { - .form-control-static + .input-group-addon { + .form-control-plaintext + .input-group-addon { background: none; border:0; } diff --git a/app/builders/ndr_ui/bootstrap/readonly.rb b/app/builders/ndr_ui/bootstrap/readonly.rb index f330bd0..6426920 100644 --- a/app/builders/ndr_ui/bootstrap/readonly.rb +++ b/app/builders/ndr_ui/bootstrap/readonly.rb @@ -18,12 +18,12 @@ def self.included(base) # def text_field(method, options = {}, *rest) # return super unless readonly? # readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - # @template.content_tag(:p, readonly_value, class: 'form-control-static') + # @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') # end def #{selector}(method, options = {}, *rest) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end ENDEVAL end @@ -33,12 +33,12 @@ def #{selector}(method, options = {}, *rest) # def text_area(method, options = {}, *rest) # return super unless readonly? # readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - # @template.simple_format(readonly_value, class: 'form-control-static') + # @template.simple_format(readonly_value, class: 'form-control-plaintext') # end def #{selector}(method, options = {}, *rest) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.simple_format(readonly_value, class: 'form-control-static') + @template.simple_format(readonly_value, class: 'form-control-plaintext') end ENDEVAL end @@ -48,12 +48,12 @@ def #{selector}(method, options = {}, *rest) # def select(method, _something, options = {}, *rest) # return super unless readonly? # readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - # @template.content_tag(:p, readonly_value, class: 'form-control-static') + # @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') # end def #{selector}(method, _something, options = {}, *rest) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end ENDEVAL end @@ -63,12 +63,12 @@ def #{selector}(method, _something, options = {}, *rest) # def collection_select(method, collection, value_method, text_method, options = {}, *rest) # return super unless readonly? # readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - # @template.content_tag(:p, readonly_value, class: 'form-control-static') + # @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') # end def #{selector}(method, collection, value_method, text_method, options = {}, *rest) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end ENDEVAL end @@ -78,21 +78,21 @@ def #{selector}(method, collection, value_method, text_method, options = {}, *re def grouped_collection_select(method, collection, group_method, group_label_method, option_key_method, option_value_method, options = {}, html_options = {}) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end # radio_button takes another intermediate argument: def radio_button(method, tag_value, options = {}) return super unless readonly? readonly_value = options.symbolize_keys.fetch(:readonly_value, object.send(method)) - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end # For file_field, the readonly value defaults to nil: def file_field(method, options = {}) return super unless readonly? readonly_value = options.symbolize_keys[:readonly_value] - @template.content_tag(:p, readonly_value, class: 'form-control-static') + @template.content_tag(:p, readonly_value, class: 'form-control-plaintext') end # Hidden fields should be suppressed when the form is readonly: diff --git a/app/builders/ndr_ui/bootstrap_builder.rb b/app/builders/ndr_ui/bootstrap_builder.rb index 672e94f..ff68632 100644 --- a/app/builders/ndr_ui/bootstrap_builder.rb +++ b/app/builders/ndr_ui/bootstrap_builder.rb @@ -93,7 +93,9 @@ def control_group(methods, text = nil, options = {}, control_options = {}, contr end def control_group_options(methods, options) - css_class_options_merge(options, %w(form-group)) do |group_classes| + default_classes = %w[form-group] + default_classes << 'row' if horizontal_mode + css_class_options_merge(options, default_classes) do |group_classes| if object && methods.present? if methods.any? { |method| object.errors[method].present? } group_classes << 'has-error' diff --git a/app/helpers/ndr_ui/bootstrap/card_helper.rb b/app/helpers/ndr_ui/bootstrap/card_helper.rb index 43f1b30..6c0149b 100644 --- a/app/helpers/ndr_ui/bootstrap/card_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/card_helper.rb @@ -58,6 +58,7 @@ def bootstrap_card_tag(heading, controls = nil, options = {}, &block) # # =>
    Check it out!!
    def bootstrap_card_body_tag(&block) return unless block_given? + content_tag(:div, capture(&block), class: 'card-body') end @@ -70,6 +71,28 @@ def bootstrap_card_list(title, options = {}, &block) end end + # Bootstrap v4 dropped Wells for Card component + # create a wrapper for Wells - a Card without heading + def bootstrap_well_tag(options = {}, &block) + return unless block_given? + + options.stringify_keys! + classes = %w[card mb-3] + if CARD_TYPES.include?(options['type'].to_s) + classes << "bg-#{options.delete('type')}-subtle" + else + classes << 'text-bg-light' + end + classes += options['class'].to_s.split(' ') + options['class'] = classes.uniq.join(' ') + + content_tag(:div, options) do + bootstrap_card_body_tag do + capture(&block) + end + end + end + end end end diff --git a/app/helpers/ndr_ui/bootstrap_helper.rb b/app/helpers/ndr_ui/bootstrap_helper.rb index 6e40ae4..96e2455 100644 --- a/app/helpers/ndr_ui/bootstrap_helper.rb +++ b/app/helpers/ndr_ui/bootstrap_helper.rb @@ -229,12 +229,7 @@ def bootstrap_form_for(record_or_name_or_array, *args, &proc) options[:html] ||= {} # :horizontal - if horizontal = options.delete(:horizontal) - # set the form html class for horizontal bootstrap forms - options[:html][:class] ||= '' - classes = (options[:html][:class].split(' ') << 'form-horizontal').uniq.join(' ') - options[:html][:class] = classes - end + horizontal = options.delete(:horizontal) # stimuls controller, default `form_controller` options[:html][:'data-controller'] ||= '' @@ -261,14 +256,6 @@ def bootstrap_form_with(**options, &block) options[:builder] = NdrUi::BootstrapBuilder horizontal = options.delete(:horizontal) - # :horizontal - if horizontal - # set the form html class for horizontal bootstrap forms - options[:html][:class] ||= '' - classes = (options[:html][:class].split(' ') << 'form-horizontal').uniq.join(' ') - options[:html][:class] = classes - end - # stimuls controller, default `form_controller` options[:html][:'data-controller'] ||= '' controllers = (options[:html][:'data-controller'].split(' ') << 'form').uniq.join(' ') diff --git a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb index 9935880..2827ea7 100644 --- a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb @@ -72,7 +72,7 @@ class DatepickerTest < ActionView::TestCase bootstrap_form_for post, readonly: true do |form| assert form.readonly? assert_dom_equal( - '

    2001-02-03

    ' \ + '

    2001-02-03

    ' \ '' \ 'not
    great
    ' \ '
    ', diff --git a/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb b/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb index 235ec73..31e66d4 100644 --- a/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb @@ -103,7 +103,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase bootstrap_form_for post, readonly: true do |form| assert form.readonly? assert_dom_equal( - '

    2001-02-03 00:00:00 UTC

    ' \ + '

    2001-02-03 00:00:00 UTC

    ' \ '' \ 'wrong' \ '', diff --git a/test/builders/ndr_ui/bootstrap_builder/readonly_test.rb b/test/builders/ndr_ui/bootstrap_builder/readonly_test.rb index 8160538..8262af0 100644 --- a/test/builders/ndr_ui/bootstrap_builder/readonly_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/readonly_test.rb @@ -61,7 +61,7 @@ class ReadonlyTest < ActionView::TestCase end assert_select 'input[type=text]#post_created_at' - assert_select 'p.form-control-static', 0 + assert_select 'p.form-control-plaintext', 0 reset_output_buffer! @output_buffer = @@ -69,7 +69,7 @@ class ReadonlyTest < ActionView::TestCase form.text_field :created_at end assert_select 'input[type=text]#post_created_at', 0 - assert_select 'p.form-control-static', text: time.to_s + assert_select 'p.form-control-plaintext', text: time.to_s end test 'readonly fields should show custom value if given' do @@ -81,7 +81,7 @@ class ReadonlyTest < ActionView::TestCase form.text_field :created_at, readonly_value: text end assert_select 'input[type=text]#post_created_at', 0 - assert_select 'p.form-control-static', text: text.to_s + assert_select 'p.form-control-plaintext', text: text.to_s end test 'hidden fields should not display in readonly' do @@ -94,7 +94,7 @@ class ReadonlyTest < ActionView::TestCase end assert_select 'input[type=hidden]#post_created_at' - assert_select 'p.form-control-static', 0 + assert_select 'p.form-control-plaintext', 0 reset_output_buffer! @output_buffer = @@ -102,7 +102,7 @@ class ReadonlyTest < ActionView::TestCase form.hidden_field :created_at end assert_select 'input[type=hidden]#post_created_at', 0 - assert_select 'p.form-control-static', 0 + assert_select 'p.form-control-plaintext', 0 end test 'readonly label should display translated text' do diff --git a/test/builders/ndr_ui/bootstrap_builder_test.rb b/test/builders/ndr_ui/bootstrap_builder_test.rb index 0f3ff5b..c63f7a8 100644 --- a/test/builders/ndr_ui/bootstrap_builder_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder_test.rb @@ -95,7 +95,7 @@ class BootstrapBuilderTest < ActionView::TestCase html = form.control_group(:created_at, 'Created at') do 'Pears' end - assert_dom_equal '
    ' \ + assert_dom_equal '
    ' \ '' \ '
    Pears
    ', html end @@ -121,7 +121,7 @@ class BootstrapBuilderTest < ActionView::TestCase html = form.control_group(:created_at, 'Created at') do 'Pears' end - assert_dom_equal '
    ' \ + assert_dom_equal '
    ' \ '' \ '
    Pears
    ', html end @@ -147,7 +147,7 @@ class BootstrapBuilderTest < ActionView::TestCase html = form.control_group(:created_at, 'Created at') do 'Pears' end - assert_dom_equal '
    ' \ + assert_dom_equal '
    ' \ '' \ '
    Pears
    ', html end diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index 1f4e509..60c3603 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -194,7 +194,7 @@ class BootstrapHelperTest < ActionView::TestCase ) do |form| assert_kind_of BootstrapBuilder, form end - assert_select 'form#preserve_me.form-horizontal[autocomplete=off][action="/posts"]' + assert_select 'form#preserve_me[autocomplete=off][action="/posts"]' end test 'bootstrap_form_for invalid autocomplete option' do @@ -248,7 +248,7 @@ class BootstrapHelperTest < ActionView::TestCase ) do |form| assert_kind_of BootstrapBuilder, form end - assert_select 'form#preserve_me.form-horizontal[autocomplete=off][action="/posts"]' + assert_select 'form#preserve_me[autocomplete=off][action="/posts"]' reset_output_buffer! @output_buffer = bootstrap_form_with( @@ -275,7 +275,7 @@ class BootstrapHelperTest < ActionView::TestCase ) do |form| assert_kind_of BootstrapBuilder, form end - assert_select 'form#preserve_me.form-horizontal[autocomplete=off][action="/posts"]' + assert_select 'form#preserve_me[autocomplete=off][action="/posts"]' end test 'bootstrap_form_with invalid autocomplete option' do From 0fb4b109f71636532ed07c3e96b9a919ec8b5e73 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Mon, 9 Dec 2024 18:00:59 +0000 Subject: [PATCH 08/25] form elements --- app/assets/stylesheets/ndr_ui/index.scss | 2 +- app/builders/ndr_ui/bootstrap/datepicker.rb | 6 ++-- .../ndr_ui/bootstrap/input_group_addons.rb | 6 ++-- app/builders/ndr_ui/bootstrap_builder.rb | 21 ++++++++----- app/helpers/ndr_ui/bootstrap_helper.rb | 21 ++++++------- .../bootstrap_builder/datepicker_test.rb | 6 ++-- .../input_group_addons_test.rb | 8 ++--- .../builders/ndr_ui/bootstrap_builder_test.rb | 30 +++++++++---------- test/helpers/ndr_ui/bootstrap_helper_test.rb | 16 +++++----- 9 files changed, 62 insertions(+), 54 deletions(-) diff --git a/app/assets/stylesheets/ndr_ui/index.scss b/app/assets/stylesheets/ndr_ui/index.scss index d0df0c0..0481aa2 100644 --- a/app/assets/stylesheets/ndr_ui/index.scss +++ b/app/assets/stylesheets/ndr_ui/index.scss @@ -10,7 +10,7 @@ // for input fields with input-addons, remove background and border when the form is readonly. .input-group { - .form-control-plaintext + .input-group-addon { + .form-control-plaintext + .input-group-text { background: none; border:0; } diff --git a/app/builders/ndr_ui/bootstrap/datepicker.rb b/app/builders/ndr_ui/bootstrap/datepicker.rb index 3dfa615..09eed66 100644 --- a/app/builders/ndr_ui/bootstrap/datepicker.rb +++ b/app/builders/ndr_ui/bootstrap/datepicker.rb @@ -14,7 +14,7 @@ module Datepicker # # =>
    # - #
    @@ -37,7 +37,7 @@ def datepicker_field(method, options = {}) # This method returns the date input-group and inline errors and warnings. # The errors and warnings are appended after the group to avoid messing up the - # input-group-addon calendar icon. + # input-group-text calendar icon. def date_input_group(method, options) data = { provide: 'datepicker' } data[:'date-end-date'] = '0d' if options.delete(:no_future) @@ -50,7 +50,7 @@ def date_input_group(method, options) html + @template.content_tag(:span, @template.bootstrap_icon_tag(:calendar), - 'aria-hidden': 'true', class: 'input-group-addon') + 'aria-hidden': 'true', class: 'input-group-text') end + errors end end diff --git a/app/builders/ndr_ui/bootstrap/input_group_addons.rb b/app/builders/ndr_ui/bootstrap/input_group_addons.rb index 1b8411b..594f843 100644 --- a/app/builders/ndr_ui/bootstrap/input_group_addons.rb +++ b/app/builders/ndr_ui/bootstrap/input_group_addons.rb @@ -1,6 +1,6 @@ module NdrUi module Bootstrap - # Provides form builder method for Bootstrap input-group-addon + # Provides form builder method for Bootstrap input-group-text module InputGroupAddons # Identical signature to ActionView::Helpers::FormBuilder#text_field, but adds # :prepend and :append options to prepend and append text to @@ -15,13 +15,13 @@ def text_field(method, options = {}) div_content = [] unless prepend.blank? - div_content << @template.content_tag(:span, prepend, class: 'input-group-addon') + div_content << @template.content_tag(:span, prepend, class: 'input-group-text') end div_content << text_field_without_inline_errors(method, options) unless append.blank? - div_content << @template.content_tag(:span, append, class: 'input-group-addon') + div_content << @template.content_tag(:span, append, class: 'input-group-text') end @template.content_tag(:div, @template.safe_join(div_content), class: 'input-group') diff --git a/app/builders/ndr_ui/bootstrap_builder.rb b/app/builders/ndr_ui/bootstrap_builder.rb index ff68632..43dfd90 100644 --- a/app/builders/ndr_ui/bootstrap_builder.rb +++ b/app/builders/ndr_ui/bootstrap_builder.rb @@ -50,7 +50,7 @@ def self.field_helpers_from_date_helper # <%= form.control_group(:title, 'Demo', {:class => "col-md-6"}, {:id => 'some_id'}, "# Controls go here") %> # # =>
    - # + # #
    # # Controls go here #
    @@ -68,20 +68,25 @@ def control_group(methods, text = nil, options = {}, control_options = {}, contr else methods = [methods].compact unless methods.is_a?(Array) - label_classes = ['control-label'] - label_classes << "col-md-#{label_columns}" if horizontal_mode - label_options = {class: label_classes.join(' ')} - label_options[:tooltip] = options.delete(:tooltip) + label_classes = if horizontal_mode + "col-form-label col-#{label_columns} text-right" + else + 'form-label' + end + label_options = { + class: label_classes, + tooltip: options.delete(:tooltip) + } label_html = if methods.present? label(methods.first, text, label_options) else - @template.content_tag(:span, text, class: label_classes.join(' ')) + @template.content_tag(:span, text, class: label_classes) end control_options = css_class_options_merge(control_options) do |control_classes| # Only add a col-md-N class if none already specified if horizontal_mode && control_classes.none? { |css_class| css_class.start_with?('col-') } - control_classes << "col-md-#{12 - label_columns}" + control_classes << "col-#{12 - label_columns}" end end @@ -93,6 +98,8 @@ def control_group(methods, text = nil, options = {}, control_options = {}, contr end def control_group_options(methods, options) + # .form-group has been deprecated in Bootstrap + # however, we keep this class to do the global margin setting default_classes = %w[form-group] default_classes << 'row' if horizontal_mode css_class_options_merge(options, default_classes) do |group_classes| diff --git a/app/helpers/ndr_ui/bootstrap_helper.rb b/app/helpers/ndr_ui/bootstrap_helper.rb index 96e2455..7930862 100644 --- a/app/helpers/ndr_ui/bootstrap_helper.rb +++ b/app/helpers/ndr_ui/bootstrap_helper.rb @@ -7,6 +7,11 @@ module BootstrapHelper # rubocop:disable Metrics/ModuleLength include ::NdrUi::Bootstrap::DropdownHelper include ::NdrUi::Bootstrap::ModalHelper + TYPE_STYLE_MAP = { + important: :danger, + default: :secondary + } + # Creates an alert box of the given +type+. It supports the following alert box types # :alert, :danger, :info and :success. # @@ -88,8 +93,8 @@ def bootstrap_alert_tag(*args, &block) # # => Check it out!! # def bootstrap_label_tag(type, message) - classes = ['label', "label-#{type}"] - content_tag(:span, message, class: classes.join(' ')) + style = TYPE_STYLE_MAP[type] || type + content_tag(:span, message, class: "badge text-bg-#{style}") end # Creates an bootstrap badge of the given +type+. Bootstrap 3 does not support any types. @@ -101,14 +106,10 @@ def bootstrap_label_tag(type, message) # ==== Examples # # <%= bootstrap_badge_tag(:success, 'Check it out!!') %> - # # => Check it out!! <%# Bootstrap 3 %> + # # => Check it out!! # def bootstrap_badge_tag(type, count) - type_map = { - important: :danger, - default: :secondary - } - style = type_map[type] || type + style = TYPE_STYLE_MAP[type] || type content_tag(:span, count, class: "badge rounded-pill text-bg-#{style}") end @@ -364,7 +365,7 @@ def bootstrap_progressbar_tag(*args) # bootstrap_horizontal_form_group("The Label", [3, 9]) { 'This is the content' } # # => #
    - # + # #
    This is the content
    #
    # @@ -378,7 +379,7 @@ def bootstrap_horizontal_form_group(label = nil, ratio = [2, 10], &block) content = content_tag(:div, class: "col-sm-#{r}" + offset, &block) # Prepend optional label: unless label.nil? - content = content_tag(:label, label, class: "col-sm-#{l} control-label") + content + content = content_tag(:label, label, class: "col-sm-#{l} col-form-label") + content end content_tag(:div, content, class: 'form-group') diff --git a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb index 2827ea7..84420d9 100644 --- a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb @@ -12,7 +12,7 @@ class DatepickerTest < ActionView::TestCase assert_dom_equal( '
    ' \ '' \ - '
    ' \ @@ -31,7 +31,7 @@ class DatepickerTest < ActionView::TestCase assert_dom_equal( '
    ' \ '' \ - '
    ' \ @@ -52,7 +52,7 @@ class DatepickerTest < ActionView::TestCase assert_dom_equal( '
    ' \ '' \ - '
    ' \ diff --git a/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb b/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb index 4ab0fbe..4e9a870 100644 --- a/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb @@ -10,7 +10,7 @@ class InputGroupAddonsTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '
    ' \ - 'apples' \ + 'apples' \ '' \ '
    ' \ '' \ @@ -28,7 +28,7 @@ class InputGroupAddonsTest < ActionView::TestCase assert_dom_equal( '
    ' \ '' \ - 'pears' \ + 'pears' \ '
    ' \ '' \ '' \ @@ -44,9 +44,9 @@ class InputGroupAddonsTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '
    ' \ - 'apples' \ + 'apples' \ '' \ - 'pears' \ + 'pears' \ '
    ' \ '' \ '' \ diff --git a/test/builders/ndr_ui/bootstrap_builder_test.rb b/test/builders/ndr_ui/bootstrap_builder_test.rb index c63f7a8..3d58251 100644 --- a/test/builders/ndr_ui/bootstrap_builder_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder_test.rb @@ -29,14 +29,14 @@ class BootstrapBuilderTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '
    ' \ - '' \ + '' \ '
    Apples
    ', form.control_group(:created_at, 'Created at', {}, {}, 'Apples') ) assert_dom_equal( '
    ' \ - '' \ + '' \ '
    Apples
    ', form.control_group(:created_at, nil, {}, {}, 'Apples') ) @@ -45,26 +45,26 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html html = form.control_group(:created_at, 'Created at', class: 'col-md-2') do 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html html = form.control_group(:created_at, 'Created at', {}, id: 'dom_id') do 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html assert_dom_equal( '
    ' \ - '
    ', @@ -82,7 +82,7 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html end end @@ -96,8 +96,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -109,7 +109,7 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html end end @@ -122,8 +122,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -135,7 +135,7 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ + '' \ '
    Pears
    ', html end end @@ -148,8 +148,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index 60c3603..d43ddd9 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -65,17 +65,17 @@ class BootstrapHelperTest < ActionView::TestCase end test 'bootstrap_label_tag with message parameter' do - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:default, 'Pears') - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:success, 'Pears') - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:warning, 'Pears') - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:danger, 'Pears') - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:info, 'Pears') - assert_dom_equal 'Pears', + assert_dom_equal 'Pears', bootstrap_label_tag(:primary, 'Pears') assert bootstrap_label_tag(:warning, unsafe_string).html_safe?, 'bootstrap_label_tag is not html_safe' @@ -331,13 +331,13 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_horizontal_form_group' do # Test with standard columns: actual = bootstrap_horizontal_form_group('The Label') { 'This is the content' } - expected = '
    ', html html = form.control_group(:created_at, 'Created at', class: 'col-md-2') do 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html html = form.control_group(:created_at, 'Created at', {}, id: 'dom_id') do 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html assert_dom_equal( '
    ' \ @@ -82,8 +82,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -96,8 +96,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -109,8 +109,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -122,8 +122,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -135,8 +135,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end @@ -148,8 +148,8 @@ class BootstrapBuilderTest < ActionView::TestCase 'Pears' end assert_dom_equal '
    ' \ - '' \ - '
    Pears
    ', html + '' \ + '
    Pears
    ', html end end diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index d43ddd9..484343b 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -132,8 +132,9 @@ class BootstrapHelperTest < ActionView::TestCase stubs(:current_page?).returns(false) refute current_page?(inbox_path) - html = content_tag(:div, bootstrap_badge_tag(:important, 99), class: 'float-end') + 'Inbox' - assert_dom_equal "
  • #{link_to(html, inbox_path, class: 'dropdown-item')}
  • ", + html = content_tag(:div, bootstrap_badge_tag(:important, 99), class: 'float-end') + html += 'Inbox' + assert_dom_equal content_tag(:li, link_to(html, inbox_path, class: 'dropdown-item')), bootstrap_list_badge_and_link_to(:important, 99, 'Inbox', inbox_path) end @@ -346,12 +347,6 @@ class BootstrapHelperTest < ActionView::TestCase expected = '
    ' \ 'This is the content
    ' assert_dom_equal expected, actual - - # Test with no label and different columns: - actual = bootstrap_horizontal_form_group([1, 11]) { 'This is the content' } - expected = '
    ' \ - 'This is the content
    ' - assert_dom_equal expected, actual end test 'description_list_name_value_pair' do From 62a65c6982950b1b50c486726ab1fce4420ce296 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Wed, 11 Dec 2024 18:51:07 +0000 Subject: [PATCH 11/25] use correct class name for danger (delete) button. --- app/helpers/ndr_ui/bootstrap_helper.rb | 4 ++-- test/helpers/ndr_ui/bootstrap_helper_test.rb | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/app/helpers/ndr_ui/bootstrap_helper.rb b/app/helpers/ndr_ui/bootstrap_helper.rb index 5eb3819..0afe1b9 100644 --- a/app/helpers/ndr_ui/bootstrap_helper.rb +++ b/app/helpers/ndr_ui/bootstrap_helper.rb @@ -514,7 +514,7 @@ def edit_link(path, options = {}) # ==== Examples # # <%= delete_link('#') %> - # # => # # ' @@ -523,7 +523,7 @@ def delete_link(path, options = {}) defaults = { icon: 'trash icon-white', title: 'Delete', path: path, - class: 'btn btn-xs btn-danger', method: :delete, + class: 'btn btn-xs btn-outline-danger', method: :delete, 'data-confirm': I18n.translate(:'ndr_ui.confirm_delete', locale: options[:locale]) } diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index 484343b..66108fe 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -473,7 +473,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link' do actual = delete_link('#') - expected = '' \ '' assert_dom_equal expected, actual @@ -482,7 +482,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link with resource' do post = Post.create actual = delete_link(post) - expected = '' \ '' @@ -516,7 +516,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link with custom confirm' do actual = delete_link('#', 'data-confirm': 'Really?') - expected = '' \ '' assert_dom_equal expected, actual @@ -528,7 +528,7 @@ class BootstrapHelperTest < ActionView::TestCase actual = inline_controls_for(post) expected = '
    ' \ ' - # + # # # # diff --git a/app/builders/ndr_ui/bootstrap/inline_errors_and_warnings.rb b/app/builders/ndr_ui/bootstrap/inline_errors_and_warnings.rb index bc99e36..efd1437 100644 --- a/app/builders/ndr_ui/bootstrap/inline_errors_and_warnings.rb +++ b/app/builders/ndr_ui/bootstrap/inline_errors_and_warnings.rb @@ -2,7 +2,7 @@ module NdrUi module Bootstrap # Allows us to display errors and warnings in a bootstrap-friendly way module InlineErrorsAndWarnings - # Tag::Base subclass for generating bootstrap span.help-block. + # Tag::Base subclass for generating bootstrap span.form-text. # Allows us to use generate the tag_id properly. class HelpBlock < ActionView::Helpers::Tags::Base def render(&block) @@ -13,7 +13,7 @@ def render(&block) add_default_name_and_id(@options.fetch('html', {})) end - options = { class: 'help-block', data: { feedback_for: feedback_for } } + options = { class: 'form-text', data: { feedback_for: feedback_for } } content_tag(:span, @template_object.capture(&block), options) end end diff --git a/app/helpers/ndr_ui/bootstrap/breadcrumbs_helper.rb b/app/helpers/ndr_ui/bootstrap/breadcrumbs_helper.rb index b0641f0..995707e 100644 --- a/app/helpers/ndr_ui/bootstrap/breadcrumbs_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/breadcrumbs_helper.rb @@ -29,11 +29,11 @@ def bootstrap_breadcrumbs(breadcrumbs) # ==== Examples # # <%= bootstrap_breadcrumb("Fruits", "#fruits", true) %> - # # =>
  • Fruits
  • + # # => def bootstrap_breadcrumb(title, linkto, active = false) content_tag('li', link_to(title, linkto), - active ? { class: 'active' } : {}) + { class: "breadcrumb-item#{active ? ' active' : ''}"}) end end end diff --git a/app/helpers/ndr_ui/bootstrap_helper.rb b/app/helpers/ndr_ui/bootstrap_helper.rb index 0afe1b9..649f0b6 100644 --- a/app/helpers/ndr_ui/bootstrap_helper.rb +++ b/app/helpers/ndr_ui/bootstrap_helper.rb @@ -325,7 +325,7 @@ def button_control_group(*args, &block) # # <%= bootstrap_progressbar_tag(40), type: :danger %> # # =>
    + # class="progress-bar bg-danger" style="width:40%">
    # # ==== Browser compatibility # @@ -343,7 +343,7 @@ def bootstrap_progressbar_tag(*args) classes << 'progress-striped' type = options.delete('type').to_s - type = " progress-bar-#{type}" unless type.blank? + type = " bg-#{type}" unless type.blank? # Animate the progress bar unless something has broken: classes << 'active' unless type == 'danger' @@ -444,12 +444,12 @@ def button_group(&block) # ==== Examples # # <%= new_link('#') %> - # # => + # # => # # # # <%= new_link(Post.new) %> - # # => + # # => # # # @@ -459,7 +459,7 @@ def new_link(path, options = {}) path = new_polymorphic_path(path) if can_generate_polymorphic_path?(path) defaults = { - icon: 'plus-sign', title: 'New', path: path, class: 'btn btn-primary btn-xs' + icon: 'plus-sign', title: 'New', path: path, class: 'btn btn-primary btn-sm' } link_to_with_icon(defaults.merge(options)) @@ -474,7 +474,7 @@ def new_link(path, options = {}) # ==== Examples # # <%= details_link('#') %> - # # => + # # => # # # @@ -493,7 +493,7 @@ def details_link(path, options = {}) # ==== Examples # # <%= edit_link(#) %> - # # => + # # => # # # @@ -514,7 +514,7 @@ def edit_link(path, options = {}) # ==== Examples # # <%= delete_link('#') %> - # # => # # ' @@ -523,7 +523,7 @@ def delete_link(path, options = {}) defaults = { icon: 'trash icon-white', title: 'Delete', path: path, - class: 'btn btn-xs btn-outline-danger', method: :delete, + class: 'btn btn-sm btn-outline-danger', method: :delete, 'data-confirm': I18n.translate(:'ndr_ui.confirm_delete', locale: options[:locale]) } @@ -565,11 +565,11 @@ def inline_controls_for(object, options = {}) # ==== Examples # # <%= link_to_with_icon( { icon: 'trash icon-white', title: 'Delete', path: '#' } ) %> - # # => + # # => # # ' def link_to_with_icon(options = {}) - options[:class] ||= 'btn btn-default btn-xs' + options[:class] ||= 'btn btn-default btn-sm' icon = bootstrap_icon_tag(options.delete(:icon)) content = options.delete(:text) ? icon + ' ' + options[:title] : icon link_to content, options.delete(:path), options diff --git a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb index cd5ee74..8b7ee64 100644 --- a/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/datepicker_test.rb @@ -16,7 +16,7 @@ class DatepickerTest < ActionView::TestCase '' \ '' \ '' \ - '' \ + '' \ '' \ '', form.datepicker_field(:created_at) @@ -35,7 +35,7 @@ class DatepickerTest < ActionView::TestCase '' \ '' \ '' \ - '' \ + '' \ '' \ '', form.datepicker_field(:created_at, no_future: true) @@ -56,7 +56,7 @@ class DatepickerTest < ActionView::TestCase '' \ '' \ '' \ - '' \ + '' \ 'not
    great
    ' \ '
    ', form.datepicker_field(:created_at) @@ -73,7 +73,7 @@ class DatepickerTest < ActionView::TestCase assert form.readonly? assert_dom_equal( '

    2001-02-03

    ' \ - '' \ + '' \ 'not
    great
    ' \ '
    ', form.datepicker_field(:created_at) diff --git a/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb b/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb index 31e66d4..1981450 100644 --- a/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/inline_errors_and_warnings_test.rb @@ -23,13 +23,13 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase end end - test 'each field should have a single help-block' do + test 'each field should have a single form-text' do post = Post.new bootstrap_form_for post do |form| assert_dom_equal( '' \ - '' \ + '' \ '' \ '', form.text_field(:created_at) @@ -37,7 +37,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase end end - test 'should wrap help-block when fields_for a collections' do + test 'should wrap form-text when fields_for a collections' do post = Post.new form_for post do |form| @@ -52,7 +52,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '' \ - '' \ + '' \ '' \ '' \ '', @@ -72,7 +72,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '' \ - '' \ + '' \ 'some
    message
    ' \ '
    ', form.text_field(:created_at) @@ -88,7 +88,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase bootstrap_form_for post do |form| assert_dom_equal( '' \ - '' \ + '' \ 'not
    great
    ' \ '
    ', form.text_field(:created_at) @@ -104,7 +104,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase assert form.readonly? assert_dom_equal( '

    2001-02-03 00:00:00 UTC

    ' \ - '' \ + '' \ 'wrong' \ '', form.text_field(:created_at) @@ -117,7 +117,7 @@ class InlineErrorsAndWarningsTest < ActionView::TestCase expected = <<~HTML.strip HTML diff --git a/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb b/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb index 4e9a870..f4fa7ed 100644 --- a/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb +++ b/test/builders/ndr_ui/bootstrap_builder/input_group_addons_test.rb @@ -13,7 +13,7 @@ class InputGroupAddonsTest < ActionView::TestCase 'apples' \ '' \ '' \ - '' \ + '' \ '' \ '' \ '', @@ -30,7 +30,7 @@ class InputGroupAddonsTest < ActionView::TestCase '' \ 'pears' \ '' \ - '' \ + '' \ '' \ '' \ '', @@ -48,7 +48,7 @@ class InputGroupAddonsTest < ActionView::TestCase '' \ 'pears' \ '' \ - '' \ + '' \ '' \ '' \ '', diff --git a/test/helpers/ndr_ui/bootstrap/breadcrumbs_helper_test.rb b/test/helpers/ndr_ui/bootstrap/breadcrumbs_helper_test.rb index 9eaba0f..7ba660a 100644 --- a/test/helpers/ndr_ui/bootstrap/breadcrumbs_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap/breadcrumbs_helper_test.rb @@ -7,16 +7,16 @@ class BreadcrumbsHelperTest < ActionView::TestCase test 'bootstrap_breadcrumbs' do assert_dom_equal '', bootstrap_breadcrumbs([]) - assert_dom_equal '', + assert_dom_equal '', bootstrap_breadcrumbs([bootstrap_breadcrumb('Fruits', '#fruits')]) end test 'bootstrap_breadcrumb' do - assert_dom_equal '
  • Fruits
  • ', + assert_dom_equal '', bootstrap_breadcrumb('Fruits', '#fruits') - assert_dom_equal '
  • Fruits
  • ', + assert_dom_equal '', bootstrap_breadcrumb('Fruits', '#fruits', false) - assert_dom_equal '
  • Fruits
  • ', + assert_dom_equal '', bootstrap_breadcrumb('Fruits', '#fruits', true) end end diff --git a/test/helpers/ndr_ui/bootstrap_helper_test.rb b/test/helpers/ndr_ui/bootstrap_helper_test.rb index 66108fe..fd4e3a1 100644 --- a/test/helpers/ndr_ui/bootstrap_helper_test.rb +++ b/test/helpers/ndr_ui/bootstrap_helper_test.rb @@ -321,7 +321,7 @@ class BootstrapHelperTest < ActionView::TestCase '
    ', bootstrap_progressbar_tag(40, title: 'Dummy tooltip') assert_dom_equal '
    ' \ - '
    ' \ + '
    ' \ '
    ', bootstrap_progressbar_tag(40, type: :success) end @@ -374,7 +374,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_new_link with path' do actual = new_link('/posts/new') - expected = '' \ + expected = '' \ '' assert_dom_equal format(expected), actual @@ -382,7 +382,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_new_link with resource' do actual = new_link(Post.new) - expected = '' \ + expected = '' \ '' assert_dom_equal format(expected), actual @@ -392,7 +392,7 @@ class BootstrapHelperTest < ActionView::TestCase post = Post.create! actual = new_link([post, Comment.new]) - expected = '' \ + expected = '' \ '' assert_dom_equal format(expected, id: post.id), actual @@ -410,7 +410,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_details_link' do actual = details_link('#') - expected = '' \ + expected = '' \ '' assert_dom_equal expected, actual @@ -419,7 +419,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_details_link with resource' do post = Post.create actual = details_link(post) - expected = '' \ + expected = '' \ '' assert_dom_equal format(expected, id: post.id), actual @@ -429,7 +429,7 @@ class BootstrapHelperTest < ActionView::TestCase post = Post.create! comment = post.comments.create! actual = details_link([post, comment]) - expected = '' \ '' @@ -448,7 +448,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_edit_link' do actual = edit_link('#') - expected = '' \ + expected = '' \ '' assert_dom_equal expected, actual end @@ -456,7 +456,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_edit_link with resource' do post = Post.create actual = edit_link(post) - expected = '' \ + expected = '' \ '' assert_dom_equal format(expected, id: post.id), actual end @@ -473,7 +473,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link' do actual = delete_link('#') - expected = '' \ '' assert_dom_equal expected, actual @@ -482,7 +482,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link with resource' do post = Post.create actual = delete_link(post) - expected = '' \ '' @@ -508,7 +508,7 @@ class BootstrapHelperTest < ActionView::TestCase actual = assert_deprecated(/authorise a non-resource object/, active_support_deprecator) { details_link('#') } - expected = '' \ + expected = '' \ '' assert_equal expected, actual @@ -516,7 +516,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_delete_link with custom confirm' do actual = delete_link('#', 'data-confirm': 'Really?') - expected = '' \ '' assert_dom_equal expected, actual @@ -528,12 +528,12 @@ class BootstrapHelperTest < ActionView::TestCase actual = inline_controls_for(post) expected = '
    ' \ - '
    ' assert_dom_equal expected, actual @@ -549,7 +549,7 @@ class BootstrapHelperTest < ActionView::TestCase actual = inline_controls_for(post) expected = '' assert_dom_equal expected, actual @@ -564,7 +564,7 @@ class BootstrapHelperTest < ActionView::TestCase test 'bootstrap_link_to_with_icon' do actual = link_to_with_icon(icon: 'trash icon-white', title: 'Delete', path: '#') - expected = '' \ + expected = '' \ '' assert_dom_equal expected, actual end From bbf03aab65e3451a7496708a19dca3d9045e5b36 Mon Sep 17 00:00:00 2001 From: Sue Zhou Date: Mon, 30 Dec 2024 13:03:38 +0000 Subject: [PATCH 13/25] general deprecated fix, bs namespace --- .../ndr_ui/bootstrap/accordion_helper.rb | 4 +-- app/helpers/ndr_ui/bootstrap/modal_helper.rb | 20 +++++------ app/helpers/ndr_ui/bootstrap_helper.rb | 12 +++---- .../ndr_ui/bootstrap/modal_helper_test.rb | 34 +++++++++---------- test/helpers/ndr_ui/bootstrap_helper_test.rb | 6 ++-- 5 files changed, 38 insertions(+), 38 deletions(-) diff --git a/app/helpers/ndr_ui/bootstrap/accordion_helper.rb b/app/helpers/ndr_ui/bootstrap/accordion_helper.rb index baa0f03..7b258c4 100644 --- a/app/helpers/ndr_ui/bootstrap/accordion_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/accordion_helper.rb @@ -64,7 +64,7 @@ def bootstrap_accordion_tag(dom_id, options = {}, &_block) #
    #
    #
    - # Apple + # Apple #
    #
    #
    @@ -74,7 +74,7 @@ def bootstrap_accordion_tag(dom_id, options = {}, &_block) #
    #
    #
    - # Orange + # Orange #
    #
    #
    diff --git a/app/helpers/ndr_ui/bootstrap/modal_helper.rb b/app/helpers/ndr_ui/bootstrap/modal_helper.rb index 3443e5d..f938d08 100644 --- a/app/helpers/ndr_ui/bootstrap/modal_helper.rb +++ b/app/helpers/ndr_ui/bootstrap/modal_helper.rb @@ -59,7 +59,7 @@ def bootstrap_modal_header_tag(*args, &block) heading = content_tag(:h4, args.first, class: 'modal-title') heading = button_tag(content_tag(:span, '×', "aria-hidden": 'true'), - type: 'button', class: 'close', "data-dismiss": 'modal', + type: 'button', class: 'btn-close', "data-bs-dismiss": 'modal', "aria-label": 'Close') + heading if options.delete('dismissible') content_tag(:div, heading, class: 'modal-header') @@ -109,21 +109,21 @@ def bootstrap_modal_body_tag(*args, &block) # <%= bootstrap_modal_footer_tag('Button text', readonly: true) # # => # # # <%= bootstrap_modal_footer_tag(readonly: false) do - # button_tag('Non-readonly default', class: 'btn btn-default', "data-dismiss": 'modal') + - # button_tag('Non-readonly primary', class: 'btn btn-primary', "data-dismiss": 'modal') + # button_tag('Non-readonly default', class: 'btn btn-default', "data-bs-dismiss": 'modal') + + # button_tag('Non-readonly primary', class: 'btn btn-primary', "data-bs-dismiss": 'modal') # end %> # # => # @@ -131,7 +131,7 @@ def bootstrap_modal_body_tag(*args, &block) # <%= bootstrap_modal_footer_tag('Button text') %> # # => # @@ -139,7 +139,7 @@ def bootstrap_modal_body_tag(*args, &block) # <%= bootstrap_modal_footer_tag %> # # => #