Skip to main content

Card Selector

Playground


<%= card_selector_widget enable_search: true, search_label_text: 'Buscar Importador',categories: [
{name: 'Todos', value: 'all'},
{name: 'Empleados', value: 'categoria-1'},
{name: 'Organizacion', value: 'categoria-2'}
],enable_form: false do |widget| %>
<% widget.item do |item|
item.title = 'Empleados'
item.icon = :plus
item.action_path = new_recruiting_selection_process_survey_path
item.category_value = 'all'
item.action_method = :get
item.color = primary
item.tag = 'Importador'
end %>
<% widget.item do |item|
item.title = "Cargos"
item.icon = :file
item.action_path = create_from_template_recruiting_selection_process_surveys_path
item.category_value = 'categoria-1'
item.action_method = :post
item.color = warning
item.tag = 'Modificador'
end %>
<% widget.item do |item|
item.title = "Tratos"
item.icon = :file
item.action_path = create_from_template_recruiting_selection_process_surveys_path
item.category_value = 'categoria-2'
item.action_method = :post
item.color = primary
item.tag = 'Importador'
end %>
<% end %>

lista de parámetros

ParámetroTipoDetalle
itemsBlockTiene subpropiedades que crean cards (title: String, subtitle: String, icon: Symbol, action_path: URL, action_method: type(:post, :get), action_params: [], message_tooltip: String)
categoriesArraysDe igual forma tiene subpropiedades que generan los nav pills (name: String, description: String, value: String y define el id de la categorìa, color: type (:primary, :error))
enable_searchBooleanPara habilitar el buscador
search_label_textStringPara agregar el texto del buscador
enable_formBooleanAltura fija del componente
titleStringEl título del card
subtitleStringEl subtítulo del card
iconoStringIcono que debe aparecer en el card correspondiente a la opción
colorStringColor de los cards si no tiene color la categoría
action_pathStringRuta de la acción que se debe ejecutar al seleccionar la opción
action_methodStringMétodo de la solicitud http correspondiente a action_path
action_paramsStringParámetros que se incluyen en la solicitud correspondiente a action_path
message_tooltipStringParámetro que permite mostrar un mensaje en el tooltip, por defecto es nil
category_valueStringParámetro que permite identificar de que categoría forma parte, por defecto es nil
dataStringPermite agregar opciones adicionales al card, por defecto es nil
tagStringHabilita el chip Escribiendo su texto
message

Hola 👋

Evalúa tu experiencia utilizando nuestro Design System

Déjanos un comentario