lookbook 2.3.4 → 2.3.12

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 699b3598051a4b9f584d5c0bb703142b16988603b8cc2c99dcd0d2dee5191aa9
-  data.tar.gz: f6893f9ffb913df5b41fe54db42f8491d2169c8ba2b4de66ba8c13eac5cce8a6
+  metadata.gz: 634043098ae2ae2c1e529d8ab5359e8b4894cc56679e47b71cc48da249c521ca
+  data.tar.gz: cd679fad55997bf1fc1c0163d0b32b2511f1ce3320190976c878305913fe80b9
 SHA512:
-  metadata.gz: bcca11383c011dd7044d2291f8d39f806624e73281c5df0f60ea5face46e2171222cd9d7d6222fe4a9da5275452ac5f8a8ff95ea3edc0af064232e64e96eb378
-  data.tar.gz: 732624f41ad1a0cbd895a27348cc0cf10373fb823c5f0f36618c9cb1c464ce03baa962754c9c63078c56c681a0aca9be084ffcd5fb7f7bca6897788d50c2b22b
+  metadata.gz: f0d330de3e7379c0f549b713dc61d762fc88af7a5015f57ab3fc4e71b4b74fe8ca66d506177e84d661048196ed07d12abdef2d5e087e9b54468d427356220119
+  data.tar.gz: 37d98a9697d647294fcb4b2f8c718452b57d9a1b4d6941a32a3d8576a42e788ef673b328455cf22a8cbc4fa8afd529a6354034944c1536a9773629b61999cbf1

data/README.md

@@ -49,9 +49,9 @@ To preview changes locally you can run a development version of the docs site:
 
 ### Testing
 
-Lookbook uses [RSpec](https://relishapp.com/rspec) for testing.
+Lookbook uses [RSpec](https://relishapp.com/rspec). [Appraisal](https://github.com/thoughtbot/appraisal) is used to run tests against different Ruby and Rails versions.
 
-Tests can be run using the `rake spec` or `bundle exec rspec` commands.
+Tests can be run using the `bundle exec appraisal rspec` command.
 
 The dummy app that the tests are being run against can be viewed by running the `bin/dummy` command and then browsing to http://localhost:9292/lookbook
 

data/app/components/lookbook/base_component.rb

@@ -3,6 +3,7 @@ module Lookbook
     send(:include, Lookbook::Engine.routes.url_helpers) # YARD parsing workaround: https://github.com/lsegal/yard/issues/546
     include Lookbook::UiElementsHelper
     include Lookbook::ClassNamesHelper if Engine.runtime_context.rails_older_than?("6.1.0")
+    include ERB::Util # for json_escape
 
     def initialize(alpine_data: [], **html_attrs)
       @alpine_data ||= alpine_data

data/app/components/lookbook/button/component.html.erb

@@ -2,7 +2,7 @@
   id: id,
   icon: icon,
   **button_attrs,
-  "x-on:keydown.esc.stop": "hideDropdown",
+  "x-on:keydown.esc.stop.document": "hideDropdown",
   "x-on:navigation:complete.window": "updateDropdown") do %>
   <%= content %>
 <% end %>

data/app/components/lookbook/button/component.js

@@ -6,7 +6,12 @@ export default function buttonComponent() {
   let dropdown = null;
 
   return {
+    updateAfterNavigate: true,
+
     init() {
+      this.updateAfterNavigate =
+        this.$el.dataset.updateAfterNavigate !== "false";
+
       if (this.$refs.tooltip) {
         tooltip = initTooltip(this, {
           target: this.$refs.icon,
@@ -51,9 +56,11 @@ export default function buttonComponent() {
     updateDropdown() {
       if (dropdown) {
         dropdown.hide();
-        this.$nextTick(() => {
-          dropdown.setContent(this.dropdownContent);
-        });
+        if (this.updateAfterNavigate) {
+          this.$nextTick(() => {
+            dropdown.setContent(this.dropdownContent);
+          });
+        }
       }
     },
 

data/app/components/lookbook/display_options/editor/component.html.erb

@@ -1,6 +1,6 @@
 <%= render_component_tag class: "px-2" do %>
   <% if fields.many? %>
-    <%= lookbook_render :button, id: "display-options-dropdown-button", icon: :settings, tooltip: "Display options" do |button| %>
+    <%= lookbook_render :button, id: "display-options-dropdown-button", icon: :settings, tooltip: "Display options", data: {update_after_navigate: false} do |button| %>
       <% button.with_dropdown do %>
         <div class="p-3 space-y-3">
           <%= safe_join(fields) %>

data/app/components/lookbook/filter/component.html.erb

@@ -11,7 +11,7 @@
       x-on:keydown.f.window="if (!($event.shiftKey || $event.metaKey || $event.ctrlKey || $event.altKey)) { focus(); $event.preventDefault(); $event.stopPropagation(); }"
       x-on:keydown.stop>
       <button class="text-lookbook-icon-button-stroke hover:text-lookbook-icon-button-stroke-hover focus:ring-0 focus:outline-none absolute top-1/2 right-3 -translate-y-1/2" x-on:click="clear" x-bind:class="{hidden: !active}">
-        <%= icon  :x, size: 3 %>
+        <%= icon  :x, size: 4 %>
       </button>
   </div>
-<% end %>
+<% end %>

data/app/components/lookbook/params/editor/component.rb

@@ -9,7 +9,7 @@ module Lookbook
       def initialize(**html_attrs)
         @field_count = -1
         @@input_styles = {}
-        super(**html_attrs)
+        super
       end
 
       def before_render

data/app/components/lookbook/params/field/component.rb

@@ -14,7 +14,7 @@ module Lookbook
         styles, html = StylesExtractor.call(render_input)
         Editor::Component.add_styles(param.input, styles)
 
-        escaped_value = json_escape(param.value.to_s).gsub("\n", '\n')
+        escaped_value = html_escape(json_escape(param.value.to_s).gsub("\n", '\n'))
         wrapper_attrs = {
           data: {"param-input": param.input},
           "x-data": "paramsInputComponent({name: \"#{param.name}\", value: \"#{escaped_value}\"})"

data/app/components/lookbook/tab_panels/component.rb

@@ -8,7 +8,7 @@ module Lookbook
 
     def initialize(**html_attrs)
       @panel_counter = 0
-      super(**html_attrs)
+      super
     end
 
     protected

data/app/controllers/lookbook/previews_controller.rb

@@ -39,13 +39,17 @@ module Lookbook
     def show
       raise_not_found("Preview not found") unless @target
 
-      @preview_html = preview_controller.process(
-        :render_in_layout_to_string,
-        "lookbook/previews/group",
-        inspector_data,
-        layout: @preview.layout,
-        append_html: (iframe_content_scripts if embedded?)
-      )
+      @preview_html = if Lookbook.config.preview_single_pass_rendering && !inspector_data.scenarios.many?
+        inspector_data.scenarios.first.output + (iframe_content_scripts if embedded?)
+      else
+        preview_controller.process(
+          :render_in_layout_to_string,
+          "lookbook/previews/group",
+          inspector_data,
+          layout: @preview.layout,
+          append_html: (iframe_content_scripts if embedded?)
+        )
+      end
     end
 
     private

data/app/views/layouts/lookbook/skeleton.html.erb

@@ -5,6 +5,8 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
 
+  <%= csrf_meta_tags %>
+
   <link href="<%= lookbook_asset_path("/css/lookbook.css") %>" rel="stylesheet">
   <link href="<%= lookbook_asset_path("/css/themes/#{@config.ui_theme}.css") %>" rel="stylesheet">
 

data/app/views/lookbook/inspector/panels/_notes.html.erb

@@ -11,7 +11,7 @@
     <% end %>
   </div>
 <% else %>
-  <div class="p-4 w-full h-full bg-lookbook-prose-bg">
+  <div class="p-4 w-full min-h-full h-max bg-lookbook-prose-bg">
     <%= lookbook_render :prose do %>
       <%== items.any? ? items.first.notes : "<em class='opacity-50'>No notes provided.</em>" %>
     <% end %>

data/app/views/lookbook/previews/preview.html.erb

@@ -1,6 +1,10 @@
 <% if @render_args[:component] %>
   <% if defined?(Phlex::SGML) && @render_args[:component].is_a?(Phlex::SGML) %>
-    <%= raw(@render_args[:component].call(view_context: self, &@render_args[:block])) %>
+    <% if defined?(Phlex::VERSION) && Gem::Version.new(Phlex::VERSION) >= Gem::Version.new("2.0.0") %>
+      <%= raw(@render_args[:component].call(context: { rails_view_context: self }, &@render_args[:block])) %>
+    <% else %>
+      <%= raw(@render_args[:component].call(view_context: self, &@render_args[:block])) %>
+    <% end %>
   <% else %>
     <%= render(@render_args[:component], @render_args[:args], &@render_args[:block]) %>
   <% end %>

data/config/app.yml

@@ -25,6 +25,7 @@ shared:
   preview_type_default: view_component
   preview_sort_scenarios: false
   preview_disable_error_handling: false
+  preview_single_pass_rendering: false
 
   page_collection_label: "Pages"
   page_nav_filter: false

data/lib/lookbook/engine.rb

@@ -14,11 +14,11 @@ module Lookbook
       )
     end
 
-    initializer "lookbook.set_autoload_paths" do
+    initializer "lookbook.set_autoload_paths", before: :set_autoload_paths do |app|
       if opts.autoload_previews && opts.preview_paths.any?
-        paths_to_add = opts.preview_paths - ActiveSupport::Dependencies.autoload_paths
+        paths_to_add = opts.preview_paths - app.config.autoload_paths
         filtered_paths = paths_to_add.filter { |p| !Engine.component_paths.include?(p) }
-        ActiveSupport::Dependencies.autoload_paths.concat(filtered_paths) if filtered_paths.any?
+        app.config.autoload_paths.concat(filtered_paths) if filtered_paths.any?
       end
     end
 
@@ -37,26 +37,50 @@ module Lookbook
       if opts.using_view_component
         vc_config = Engine.host_config.view_component
 
-        opts.preview_paths += vc_config.preview_paths
+        if vc_config.key?(:previews)
+          # New config style (ViewComponent >= 4.0)
+          opts.preview_paths += vc_config.previews.paths
 
-        # sync preview controller and layout setting between Lookbook and ViewComponent
-        if opts.preview_controller == "Lookbook::PreviewController" ||
-            vc_config.preview_controller != ViewComponent::Config.defaults.preview_controller
-          opts.preview_controller = vc_config.preview_controller
-        else
-          vc_config.preview_controller = opts.preview_controller
-        end
+          if opts.preview_controller == "Lookbook::PreviewController" ||
+              vc_config.previews.controller != "ViewComponentsController"
+            opts.preview_controller = vc_config.previews.controller
+          else
+            vc_config.previews.controller = opts.preview_controller
+          end
 
-        if opts.preview_layout.nil? || vc_config.default_preview_layout.present?
-          opts.preview_layout = vc_config.default_preview_layout
+          if opts.preview_layout.nil? || vc_config.previews.default_layout.present?
+            opts.preview_layout = vc_config.previews.default_layout
+          else
+            vc_config.previews.default_layout = opts.preview_layout
+          end
+
+          vc_config.previews.enabled = true
+
+          if vc_config.generate.path.present?
+            opts.component_paths << vc_config.generate.path
+          end
         else
-          vc_config.default_preview_layout = opts.preview_layout
-        end
+          # Legacy config style (ViewComponent < 4.0)
+          opts.preview_paths += vc_config.preview_paths
+
+          if opts.preview_controller == "Lookbook::PreviewController" ||
+              vc_config.preview_controller != ViewComponent::Config.defaults.preview_controller
+            opts.preview_controller = vc_config.preview_controller
+          else
+            vc_config.preview_controller = opts.preview_controller
+          end
 
-        vc_config.show_previews = true
+          if opts.preview_layout.nil? || vc_config.default_preview_layout.present?
+            opts.preview_layout = vc_config.default_preview_layout
+          else
+            vc_config.default_preview_layout = opts.preview_layout
+          end
 
-        if vc_config.view_component_path.present?
-          opts.component_paths << vc_config.view_component_path
+          vc_config.show_previews = true
+
+          if vc_config.view_component_path.present?
+            opts.component_paths << vc_config.view_component_path
+          end
         end
 
         ViewComponent::Preview.extend(Lookbook::PreviewAfterRender)

data/lib/lookbook/preview_controller_actions.rb

@@ -16,8 +16,13 @@ module Lookbook
         @render_args = @preview.render_args(@scenario_name, params: params.permit!)
         template = @render_args[:template]
         locals = @render_args[:locals]
-        opts = {}
-        opts[:layout] = nil
+
+        opts = if Lookbook.config.preview_single_pass_rendering && !scenario.group.present?
+          determine_layout(preview.layout)
+        else
+          {layout: nil}
+        end
+
         opts[:assigns] = @render_args[:assigns] || {}
         opts[:locals] = locals if locals.present?
 

data/lib/lookbook/preview_parser.rb

@@ -6,15 +6,14 @@ module Lookbook
       @paths = paths
       @after_parse_callbacks = []
       @after_parse_once_callbacks = []
-      @parsing = false
+      @parsing = Mutex.new
 
       define_tags(tags)
       YARD::Parser::SourceParser.after_parse_list { run_callbacks }
     end
 
     def parse(files = nil, &block)
-      unless @parsing
-        @parsing = true
+      @parsing.synchronize do
         @after_parse_once_callbacks << block if block
         files_list = files ? files.select { |file| file.to_s.end_with?(".rb") } : paths
 
@@ -43,7 +42,6 @@ module Lookbook
     def run_callbacks
       callbacks.each { |cb| cb.call(YARD::Registry) }
       @after_parse_once_callbacks = []
-      @parsing = false
     end
 
     def define_tags(tags = nil)

data/lib/lookbook/stores/config_store.rb

@@ -63,6 +63,10 @@ module Lookbook
       store[:preview_disable_error_handling] = value
     end
 
+    def preview_single_pass_rendering=(value)
+      store[:preview_single_pass_rendering] = value
+    end
+
     def ui_theme=(name)
       name = name.to_s
       if Theme.valid_theme?(name)

data/lib/lookbook/support/errors/config_error.rb

@@ -1,7 +1,7 @@
 module Lookbook
   class ConfigError < Error
     def initialize(msg = nil, scope: "config", **kwargs)
-      super(msg, scope: scope, **kwargs)
+      super
     end
   end
 end

data/lib/lookbook/support/errors/parser_error.rb

@@ -1,7 +1,7 @@
 module Lookbook
   class ParserError < Error
     def initialize(msg = nil, scope: "parser", **kwargs)
-      super(msg, scope: scope, **kwargs)
+      super
     end
   end
 end

data/lib/lookbook/support/errors/preview_template_error.rb

@@ -1,7 +1,7 @@
 module Lookbook
   class PreviewTemplateError < Error
     def initialize(msg = nil, scope: "preview", **kwargs)
-      super(msg, scope: scope, **kwargs)
+      super
     end
   end
 end

data/lib/lookbook/support/errors/template_error.rb

@@ -1,7 +1,7 @@
 module Lookbook
   class TemplateError < Error
     def initialize(msg = nil, scope: "template", **kwargs)
-      super(msg, scope: scope, **kwargs)
+      super
     end
   end
 end

data/lib/lookbook/support/store.rb

@@ -27,7 +27,7 @@ module Lookbook
       if name.to_s.end_with?("=")
         args[0] = normalize_value(args[0])
       end
-      super(name, *args)
+      super
     end
 
     def respond_to_missing?(name, include_private)

data/lib/lookbook/support/utils/utils.rb

@@ -12,7 +12,7 @@ module Lookbook
       end
 
       def name(str)
-        str.to_s.parameterize.tr("-", "_")
+        str.to_s.dup.force_encoding("UTF-8").parameterize.tr("-", "_")
       end
 
       def symbolize_name(str)

data/lib/lookbook/tags/param_tag.rb

@@ -28,7 +28,10 @@ module Lookbook
     def value_default
       default_value_parts = object.parameters.find { |parts| parts[0].chomp(":") == name }
       if default_value_parts
-        host_class_instance.instance_eval(default_value_parts[1])
+        # fix issue with YARD argument parser not splitting args correctly (leaving a trailing comma or bracket)
+        # when one or more of the argument values is a negative number.
+        cleaned_value = default_value_parts[1].start_with?("-") ? default_value_parts[1].sub(/[,\)]$/, "") : default_value_parts[1]
+        host_class_instance.instance_eval(cleaned_value)
       else
         raise ParserError.new "Unknown method parameter '#{name}'"
       end

data/lib/lookbook/tags/yard_tag.rb

@@ -5,7 +5,7 @@ module Lookbook
         tag_name = self.class.name.demodulize.underscore.chomp("_tag")
         super(tag_name, args.first, nil, @name)
       else
-        super(*args)
+        super
       end
     end
 

data/lib/lookbook/version.rb

@@ -1,3 +1,3 @@
 module Lookbook
-  VERSION = "2.3.4"
+  VERSION = "2.3.12"
 end