Selectable Icon

Close

<div class="pb--doc-demo-row">

  <%= pb_rails("selectable_icon", props: {
    icon: "dollar-sign", 
    input_id: 1, 
    checked: true, 
    text: "US Dollar" 
  }) %>
  
  <%= pb_rails("selectable_icon", props: {
    icon: "euro-sign", 
    input_id: 2, 
    text: "Euro" 
  }) %>
  
  <%= pb_rails("selectable_icon", props: {
    icon: "yen-sign", 
    input_id: 3, 
    disabled: true, 
    text: "Yen" 
  }) %>

</div>

Close

<div class="pb--doc-demo-row">

  <%= pb_rails("selectable_icon", props: {
    icon: "cassette-tape",
    input_id: 4,
    multi: false,
    name: "select",
    text: "Cassette"
  }) %>

  <%= pb_rails("selectable_icon", props: {
    icon: "compact-disc",
    input_id: 5,
    multi: false,
    name: "select",
    text: "CD"
  }) %>

  <%= pb_rails("selectable_icon", props: {
    icon: "album-collection",
    input_id: 6,
    multi: false,
    name: "select",
    text: "Vinyl"
  }) %>

</div>

Close

<div class="pb--doc-demo-row">

  <%= pb_rails("selectable_icon", props: {
    icon: "dollar-sign",
    input_id: "options-id",
    checked: true,
    text: "US Dollar",
    input_options: {
      class: "input-class",
      name: "overwriting-name",
      value: "overwriting-value",
    }
  }) %>

</div>