Skip to content

Documenting ViewComponent slots#75

Merged
koppen merged 1 commit intomainfrom
koppen/yard-slot-plugin
Jan 31, 2026
Merged

Documenting ViewComponent slots#75
koppen merged 1 commit intomainfrom
koppen/yard-slot-plugin

Conversation

@koppen
Copy link
Copy Markdown
Member

@koppen koppen commented Jan 31, 2026

Summary

Adds a custom YARD plugin that defines the @viewcomponent_slot tag for documenting ViewComponent slots. This allows developers to document slots in a structured way, similar to how @param works for method parameters.

The tag accepts types (optional), a slot name, and a description, and is rendered in the generated documentation as a styled list section.

Test plan

  • Run bundle exec rake docs:refresh_registry to generate docs with the new plugin
  • Verify slot documentation is parsed correctly in YARD registry
  • Check that the "Slots" section renders properly in the demo docs view

🤖 Generated with Claude Code

@koppen koppen changed the title Add @viewcomponent_slot YARD tag for documenting slots Documenting ViewComponent slots Jan 31, 2026
@koppen koppen requested a review from Copilot January 31, 2026 21:26
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR adds a custom YARD plugin to enable structured documentation of ViewComponent slots using the @viewcomponent_slot tag. The implementation follows YARD's conventions for custom tags and provides rendering in the documentation viewer.

Changes:

  • Added a YARD plugin that defines the @viewcomponent_slot tag with type, name, and description support
  • Updated the documentation view template to render slot documentation in a "Slots" section
  • Added @viewcomponent_slot documentation to three existing components (Card, Breadcrumb, and InputField)
  • Modified the Rakefile to load the custom YARD plugin during documentation generation
  • Regenerated YARD registry files to include the new slot documentation

Reviewed changes

Copilot reviewed 7 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
lib/yard/flowbite_viewcomponent.rb New YARD plugin defining the @viewcomponent_slot tag for documenting ViewComponent slots
demo/app/views/docs/components/show.html.erb Added rendering logic for the "Slots" section displaying documented slots with types and descriptions
Rakefile Updated the docs:refresh_registry task to load the custom YARD plugin with the -e flag
app/components/flowbite/card.rb Added @viewcomponent_slot documentation for the title slot
app/components/flowbite/breadcrumb.rb Added @viewcomponent_slot documentation for the items slot
app/components/flowbite/input_field.rb Added @viewcomponent_slot documentation for hint, input, and label slots
demo/.yardoc/objects/root.dat Regenerated YARD registry file with the new slot documentation
demo/.yardoc/checksums Updated checksums for files with new slot documentation

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

<li>
<span class="name"><%= slot_tag.name %></span>
<% if slot_tag.types&.any? %>
<span class="type">(<%= slot_tag.types.map { |t| link_to(t, "#") }.join(", ").html_safe %>)</span>
Copy link

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using html_safe on user-provided content from link_to can introduce XSS vulnerabilities. The slot_tag.types values come from YARD documentation tags, but treating them as safe HTML without proper sanitization is risky. Consider using safe_join instead to properly escape each type before joining them, or ensure that the types are already properly escaped by the link_to helper before joining.

Suggested change
<span class="type">(<%= slot_tag.types.map { |t| link_to(t, "#") }.join(", ").html_safe %>)</span>
<span class="type">(<%= safe_join(slot_tag.types.map { |t| link_to(t, "#") }, ", ") %>)</span>

Copilot uses AI. Check for mistakes.
<li>
<span class="name"><%= slot_tag.name %></span>
<% if slot_tag.types&.any? %>
<span class="type">(<%= slot_tag.types.map { |t| link_to(t, "#") }.join(", ").html_safe %>)</span>
Copy link

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The links generated for slot types point to "#" which doesn't navigate anywhere useful. Consider implementing proper links to the actual type documentation, or if the links aren't functional yet, use a <span> or <code> tag instead of generating non-functional anchor tags.

Suggested change
<span class="type">(<%= slot_tag.types.map { |t| link_to(t, "#") }.join(", ").html_safe %>)</span>
<span class="type">(<%= slot_tag.types.join(", ") %>)</span>

Copilot uses AI. Check for mistakes.
@koppen koppen merged commit b61ed34 into main Jan 31, 2026
12 checks passed
@koppen koppen deleted the koppen/yard-slot-plugin branch January 31, 2026 21:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants