-
Notifications
You must be signed in to change notification settings - Fork 17
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Create preview for components #52
Comments
When it's ready, do you think we should host the lookbook publicly somewhere? It would help documenting the available components. |
Hi guys, Thanks for the great work you are doing! I was wondering if you managed to create previews using Lookbook for the form components. Thank you in advance for your feedback. |
Hi @dlupu, On one of my project I did the following to preview a form component with lookbook. # spec/components/previews/form/preview.rb
require "view_component/form/test_helpers"
# @hidden
class Form::Preview < ViewComponent::Preview
include ViewComponent::Form::TestHelpers
protected
def form_builder(object_name = nil, object = nil, options = {})
My::FormBuilder.new(object_name, object, template, options)
end
def template
lookup_context = ActionView::LookupContext.new(ActionController::Base.view_paths)
ActionView::Base.new(lookup_context, {}, ActionController::Base.new)
end
end And for example to test class Form::TextAreaComponentPreview < Form::Preview
layout "small_container"
# Form components are used the same way than basic rails forms.
#
# ```erb
# <%= form_with model: @user do |f| %>
# <%= f.text_area :name %>
# <% end %>
# ```
#
# See [https://api.rubyonrails.org/classes/ActionView/Helpers/FormBuilder.html#method-i-text_area](https://api.rubyonrails.org/classes/ActionView/Helpers/FormBuilder.html#method-i-text_area).
def basic(method: :comment)
render Form::TextAreaComponent.new(form_builder, nil, method)
end
end |
It could also be worth considering rendering via form helpers if that's an option, e.g.: <%= fields do |f| %>
<%= f.text_area :name %>
<% end %> Setting the default form builder for previews might get interesting, though. |
config.view_component.preview_paths
config (https://viewcomponent.org/guide/previews.html)lookbook
gemThe text was updated successfully, but these errors were encountered: