[PLAY-235] BUGFIX - Classnames and global props in the list kit for rails

[augustomallmann]

Screens

Breaking Changes

No breaking changes, bug fixing only.

Runway Ticket URL

[PLAY-235]

How to test this

List kit was not generating classnames for its props. Fixed that by replacing the array under list_classname to generate_classname function.

Create a list component using props as follows:

<%= pb_rails("list", props: { align_items: "stretch", flex_grow: 1, max_width: "xs", orientation: "column", padding_top: "sm" }) do %>
    <%= pb_rails("list/item") do %> List Item <% end %>
<% end %>

It should generate the following html:

<div class="pb_list_kit_ pt_sm max_width_xs align_items_stretch flex_grow_1">
  <ul>  
    <li class="pb_item_kit">
     List Item 
    </li>
  </ul>
</div>

Checklist:

• LABELS Add a label: enhancement, bug, improvement, new kit, deprecated, or breaking. See Changelog & Labels for details.
• DEPLOY Please add the Milano label when you are ready for a review.
• SCREENSHOT Please add a screen shot or two.
• SPECS Please cover your changes with specs.
• READ DOCS Please make sure you have read and understand the Playbook Release Process

[thestephenmarshall]

@powerhome/ux-team

[augustomallmann]

FIY: I have to change some test specs, as it was not generating the classnames I believe they were giving false positives. For example:

• the example below is wrong because when you set dark as true, it adds a class dark:
  expect(subject.new(dark: true).list_classname).to eq "pb_list_kit_dark"
• so the correct test should be:
  expect(subject.new(dark: true).list_classname).to eq "pb_list_kit_dark dark"