debian-mirror-gitlab/app/helpers/dropdowns_helper.rb

136 lines
4.7 KiB
Ruby
Raw Normal View History

2018-12-05 23:21:45 +05:30
# frozen_string_literal: true
2016-06-02 11:05:42 +05:30
module DropdownsHelper
def dropdown_tag(toggle_text, options: {}, &block)
2017-09-10 17:25:29 +05:30
content_tag :div, class: "dropdown #{options[:wrapper_class] if options.key?(:wrapper_class)}" do
2016-06-02 11:05:42 +05:30
data_attr = { toggle: "dropdown" }
2017-09-10 17:25:29 +05:30
if options.key?(:data)
2016-06-02 11:05:42 +05:30
data_attr = options[:data].merge(data_attr)
end
dropdown_output = dropdown_toggle(toggle_text, data_attr, options)
2019-02-15 15:39:39 +05:30
if options.key?(:toggle_link)
dropdown_output = dropdown_toggle_link(toggle_text, data_attr, options)
end
2020-07-28 23:09:34 +05:30
content_tag_options = { class: "dropdown-menu dropdown-select #{options[:dropdown_class] if options.key?(:dropdown_class)}" }
content_tag_options[:data] = { qa_selector: "#{options[:dropdown_qa_selector]}" } if options[:dropdown_qa_selector]
dropdown_output << content_tag(:div, content_tag_options) do
2018-12-05 23:21:45 +05:30
output = []
2016-06-02 11:05:42 +05:30
2017-09-10 17:25:29 +05:30
if options.key?(:title)
2016-06-02 11:05:42 +05:30
output << dropdown_title(options[:title])
end
2017-09-10 17:25:29 +05:30
if options.key?(:filter)
2016-06-02 11:05:42 +05:30
output << dropdown_filter(options[:placeholder])
end
2021-04-29 21:17:54 +05:30
output << content_tag(:div, data: { qa_selector: "dropdown_list_content" }, class: "dropdown-content #{options[:content_class] if options.key?(:content_class)}") do
2017-09-10 17:25:29 +05:30
capture(&block) if block && !options.key?(:footer_content)
2016-06-02 11:05:42 +05:30
end
if block && options[:footer_content]
output << content_tag(:div, class: "dropdown-footer") do
capture(&block)
end
end
output << dropdown_loading
2018-12-05 23:21:45 +05:30
output.join.html_safe
2016-06-02 11:05:42 +05:30
end
dropdown_output.html_safe
end
end
2016-08-24 12:49:21 +05:30
def dropdown_toggle(toggle_text, data_attr, options = {})
2016-11-03 12:29:30 +05:30
default_label = data_attr[:default_label]
2018-10-15 14:42:47 +05:30
content_tag(:button, disabled: options[:disabled], class: "dropdown-menu-toggle #{options[:toggle_class] if options.key?(:toggle_class)}", id: (options[:id] if options.key?(:id)), type: "button", data: data_attr) do
2016-11-03 12:29:30 +05:30
output = content_tag(:span, toggle_text, class: "dropdown-toggle-text #{'is-default' if toggle_text == default_label}")
2021-02-22 17:27:13 +05:30
output << sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
2016-06-02 11:05:42 +05:30
output.html_safe
end
end
2019-02-15 15:39:39 +05:30
def dropdown_toggle_link(toggle_text, data_attr, options = {})
output = content_tag(:a, toggle_text, class: "dropdown-toggle-text #{options[:toggle_class] if options.key?(:toggle_class)}", id: (options[:id] if options.key?(:id)), data: data_attr)
output.html_safe
end
2017-09-10 17:25:29 +05:30
def dropdown_title(title, options: {})
2020-11-24 15:15:51 +05:30
has_back = options.fetch(:back, false)
has_close = options.fetch(:close, true)
container_class = %w[dropdown-title gl-display-flex]
margin_class = []
if has_back && has_close
container_class << 'gl-justify-content-space-between'
elsif has_back
margin_class << 'gl-mr-auto'
elsif has_close
margin_class << 'gl-ml-auto'
end
container_class = container_class.join(' ')
margin_class = margin_class.join(' ')
content_tag :div, class: container_class do
2018-12-05 23:21:45 +05:30
title_output = []
2016-06-02 11:05:42 +05:30
2020-11-24 15:15:51 +05:30
if has_back
title_output << content_tag(:button, class: "dropdown-title-button dropdown-menu-back " + margin_class, aria: { label: "Go back" }, type: "button") do
sprite_icon('arrow-left')
2016-06-02 11:05:42 +05:30
end
end
2020-11-24 15:15:51 +05:30
title_output << content_tag(:span, title, class: margin_class)
2016-06-02 11:05:42 +05:30
2020-11-24 15:15:51 +05:30
if has_close
title_output << content_tag(:button, class: "dropdown-title-button dropdown-menu-close " + margin_class, aria: { label: "Close" }, type: "button") do
sprite_icon('close', size: 16, css_class: 'dropdown-menu-close-icon')
2017-09-10 17:25:29 +05:30
end
2016-06-02 11:05:42 +05:30
end
2018-12-05 23:21:45 +05:30
title_output.join.html_safe
2016-06-02 11:05:42 +05:30
end
end
def dropdown_filter(placeholder, search_id: nil)
2016-06-02 11:05:42 +05:30
content_tag :div, class: "dropdown-input" do
2021-09-04 01:27:46 +05:30
filter_output = search_field_tag search_id, nil, data: { qa_selector: "dropdown_input_field" }, id: nil, class: "dropdown-input-field", placeholder: placeholder, autocomplete: 'off'
2021-01-03 14:25:43 +05:30
filter_output << sprite_icon('search', css_class: 'dropdown-input-search')
2020-11-24 15:15:51 +05:30
filter_output << sprite_icon('close', size: 16, css_class: 'dropdown-input-clear js-dropdown-input-clear')
2016-06-02 11:05:42 +05:30
filter_output.html_safe
end
end
def dropdown_content(&block)
content_tag(:div, class: "dropdown-content") do
if block
capture(&block)
end
end
end
2018-03-17 18:26:18 +05:30
def dropdown_footer(add_content_class: false, &block)
2016-06-02 11:05:42 +05:30
content_tag(:div, class: "dropdown-footer") do
2018-03-17 18:26:18 +05:30
if add_content_class
content_tag(:div, capture(&block), class: "dropdown-footer-content")
else
2016-06-02 11:05:42 +05:30
capture(&block)
end
end
end
def dropdown_loading
2022-05-07 20:08:51 +05:30
spinner = gl_loading_icon(size: "md", css_class: "gl-mt-7")
2021-01-29 00:20:46 +05:30
content_tag(:div, spinner, class: "dropdown-loading")
2016-06-02 11:05:42 +05:30
end
end