gitlab-lookbook 2.3.14

data/app/controllers/concerns/lookbook/with_preview_controller_concern.rb

@@ -0,0 +1,32 @@
+module Lookbook
+  module WithPreviewControllerConcern
+    extend ActiveSupport::Concern
+
+    def preview_controller
+      @_preview_controller ||= begin
+        # In order to get URL helpers working correctly in the preview,
+        # the request needs to look like it's coming from the host app,
+        # not the Lookbook engine. So we try to get the controller and action
+        # for the root path and use that as the 'fake' request context instead.
+        path_parameters = begin
+          request_path = main_app.respond_to?(:root_path) ? main_app.root_path : "/"
+          Rails.application.routes.recognize_path(request_path)
+        rescue
+          # Fix for authenticated devise paths
+          if main_app.respond_to?(:new_user_session_path)
+            Rails.application.routes.recognize_path(main_app.new_user_session_path)
+          end
+        end
+
+        preview_request = request.clone
+        preview_request.path_parameters = path_parameters if path_parameters.present?
+
+        controller = Engine.preview_controller.new
+        controller.request = preview_request
+        controller.response = response
+
+        controller
+      end
+    end
+  end
+end

data/app/controllers/lookbook/application_controller.rb

@@ -0,0 +1,110 @@
+module Lookbook
+  class ApplicationController < ActionController::Base
+    content_security_policy(false) if respond_to?(:content_security_policy)
+
+    protect_from_forgery with: :exception
+
+    layout "lookbook/application"
+
+    helper Lookbook::ClassNamesHelper if Engine.runtime_context.rails_older_than?("6.1.0")
+    helper Lookbook::ApplicationHelper
+    helper Lookbook::UiElementsHelper
+
+    before_action :disable_annotations
+    after_action :restore_annotations
+
+    before_action :assign_theme_overrides
+    before_action :assign_instance_vars
+
+    rescue_from ActionController::RoutingError do |err|
+      raise Lookbook::RoutingError, err.message, original: err
+    end
+    rescue_from StandardError, with: :handle_error
+
+    def self.controller_path
+      "lookbook"
+    end
+
+    def index
+      landing = Engine.pages.find(&:landing?) || Engine.pages.first
+      if landing.present?
+        redirect_to lookbook_page_path(landing.lookup_path)
+      else
+        render "lookbook/index"
+      end
+    end
+
+    def not_found
+      raise_not_found
+    end
+
+    protected
+
+    def disable_annotations
+      return unless ActionView::Base.respond_to?(:annotate_rendered_view_with_filenames)
+
+      @original_annotations_value = ActionView::Base.annotate_rendered_view_with_filenames
+      ActionView::Base.annotate_rendered_view_with_filenames = false
+    end
+
+    def restore_annotations
+      return if @original_annotations_value.nil?
+
+      ActionView::Base.annotate_rendered_view_with_filenames = @original_annotations_value
+      @original_annotations_value = nil
+    end
+
+    def assign_theme_overrides
+      @theme_overrides ||= Engine.theme.to_css
+    end
+
+    def assign_instance_vars
+      @previews = Engine.previews
+      @pages = Engine.pages
+      @theme = Engine.theme
+      @config = Lookbook.config
+      @engine = Lookbook.engine
+      @embed = !!params[:lookbook_embed]
+      @sidebar_panels = sidebar_panels
+      @blank_slate = @sidebar_panels.none?
+    end
+
+    def raise_not_found(message = "Page not found")
+      raise Lookbook::RoutingError, message
+    end
+
+    def handle_error(err)
+      raise err if Lookbook.config.preview_disable_error_handling
+
+      @error = err.is_a?(Lookbook::Error) ? err : Lookbook::Error.new(original: err)
+      @status_code = get_status_code(err)
+
+      view = (@status_code == :not_found) ? "not_found" : "default"
+      layout = current_layout || "lookbook/skeleton"
+
+      render "lookbook/errors/#{view}", layout: layout, status: @status_code
+    end
+
+    def current_layout
+      self.class.send(:_layout)
+    end
+
+    private
+
+    def sidebar_panels
+      panels_config = Lookbook.config.preview_inspector.sidebar_panels.map(&:to_sym)
+      panels_config.select do |panel|
+        (panel == :pages && Engine.pages.any?) || (panel == :previews && Engine.previews.any?)
+      end
+    end
+
+    def get_status_code(err)
+      if err.respond_to?(:status)
+        err.status
+      else
+        status_map = ActionDispatch::ExceptionWrapper.rescue_responses
+        status_map.fetch(err.class.name, :internal_server_error)
+      end
+    end
+  end
+end

data/app/controllers/lookbook/embeds_controller.rb

@@ -0,0 +1,147 @@
+module Lookbook
+  class EmbedsController < Lookbook::ApplicationController
+    include ActionView::Helpers::SanitizeHelper
+    include TargetableConcern
+    include WithPreviewControllerConcern
+
+    layout "lookbook/embed"
+
+    before_action :permit_embeds
+    before_action :set_options, only: [:show]
+    before_action :set_scenario_choices, only: [:show]
+    before_action :set_panels, only: [:show]
+    before_action :set_actions, only: [:show]
+
+    def self.controller_path
+      "lookbook/embeds"
+    end
+
+    def lookup
+      props = Store.new(params[:props] ? JsonParser.call(sanitize(params[:props])) : {})
+      if props.preview.present?
+        preview = Engine.previews.find_by_preview_class(props.preview)
+        if preview.present?
+          props.scenarios ||= props.scenario || ""
+          scenario = preview.scenario(Array(props.scenarios).first)
+
+          boolean_options = ["display_option_controls"]
+          array_options = ["panels", "actions", "scenarios"]
+          param_prefix = "param_"
+
+          options = {}
+          embed_params = {}
+
+          props.each do |key, value|
+            key = key.to_s.strip.tr("-", "_")
+            value.strip!
+
+            if array_options.include?(key)
+              options[key] = if value == "false"
+                []
+              elsif value == "true"
+                ["*"]
+              else
+                value.split(",").map(&:strip)
+              end
+            elsif boolean_options.include?(key)
+              options[key] = (value == "false") ? false : !!value
+            elsif key.start_with?(param_prefix)
+              embed_params[key.gsub(param_prefix, "")] = value
+            end
+          end
+
+          embed_params[:_options] = SearchParamEncoder.call(options)
+          embed_params.symbolize_keys!
+
+          return redirect_to lookbook_embed_url(scenario ? scenario.lookup_path : preview.lookup_path, embed_params)
+        end
+      end
+
+      raise_not_found("Preview not found")
+    end
+
+    def show
+      @embed = true
+      unless @target
+        @target = @scenario_choices.first || @preview&.default_scenario
+        if @target
+          redirect_to lookbook_embed_path(@target.lookup_path, req_params)
+        else
+          raise_not_found("Preview not found")
+        end
+      end
+    end
+
+    protected
+
+    def embed_options
+      Lookbook.config.preview_embeds
+    end
+
+    def permit_embeds
+      headers["X-Frame-Options"] = embed_options.policy
+    end
+
+    def lookup_entities
+      @target = Engine.previews.find_scenario_by_path(params[:path])
+      @preview = @target.present? ? @target.preview : Engine.previews.find_by_path(params[:path])
+    end
+
+    def set_params
+      @params = []
+      @passed_params = req_params.select { |key, value| !key.to_s.start_with?("_") }
+
+      if @target
+        @params = @target.tags("param").map do |param_tag|
+          Param.from_tag(
+            param_tag,
+            value: @passed_params[param_tag.name.to_sym]
+          )
+        end
+
+        # cast known param values to correct type
+        @params.each do |param|
+          if @passed_params.key?(param.name.to_sym)
+            @passed_params[param.name.to_sym] = param.cast_value
+          end
+        end
+      end
+    end
+
+    def set_options
+      return @options if @options
+
+      options = SearchParamParser.call(req_params[:_options])
+      default_options = embed_options.to_h.except(:policy)
+      @options ||= default_options.merge(options || {})
+    end
+
+    def set_scenario_choices
+      return @scenario_choices ||= [] unless @preview
+
+      named_choices = @options.fetch(:scenarios, [])
+      @scenario_choices = ListResolver.call(named_choices, @preview.scenarios.map(&:name)) do |name|
+        @preview.scenario(name)
+      end
+    end
+
+    def set_actions
+      @actions ||= ListResolver.call(@options.fetch(:actions, []), Embed::Component::ACTIONS)
+    end
+
+    def set_panels
+      return @panels if @panels
+
+      panels = @options.fetch(:panels, [])
+      all_panels = Engine.panels.names.map(&:to_s) - ["preview"]
+      @panels = ListResolver.call(panels, all_panels) do |name|
+        config = Engine.panels.get_panel(name.to_sym)
+        PanelStore.resolve_config(config, inspector_data) if config
+      end
+    end
+
+    def req_params
+      request.query_parameters
+    end
+  end
+end

data/app/controllers/lookbook/inspector_controller.rb

@@ -0,0 +1,18 @@
+module Lookbook
+  class InspectorController < Lookbook::ApplicationController
+    include TargetableConcern
+    include WithPanelsConcern
+    include WithPreviewControllerConcern
+
+    def self.controller_path
+      "lookbook/inspector"
+    end
+
+    def show
+      raise_not_found("Preview not found") unless @target
+
+      @main_panels = main_panels
+      @drawer_panels = drawer_panels
+    end
+  end
+end

data/app/controllers/lookbook/page_controller.rb

@@ -0,0 +1,30 @@
+require "rails/application_controller"
+
+module Lookbook
+  class PageController < Rails::ApplicationController
+    helper UiElementsHelper
+    helper PageHelper
+
+    Lookbook.config.page_paths.each do |path|
+      prepend_view_path Rails.root.join(path)
+    end
+
+    def render_page(page, locals = {})
+      @page = page
+      @pages = Engine.pages
+      @next_page = @pages.next(@page)
+      @previous_page = @pages.previous(@page)
+
+      content = ActionViewConfigHandler.call do
+        render_to_string inline: @page.content, locals: {
+          page: @page,
+          next_page: @next_page,
+          previous_page: @previous_page,
+          pages: @pages
+        }
+      end
+
+      @page.markdown? ? MarkdownRenderer.call(content) : content
+    end
+  end
+end

data/app/controllers/lookbook/pages_controller.rb

@@ -0,0 +1,41 @@
+module Lookbook
+  class PagesController < Lookbook::ApplicationController
+    helper_method :page_controller
+
+    def self.controller_path
+      "lookbook/pages"
+    end
+
+    def index
+      landing = Engine.pages.find(&:landing?) || Engine.pages.first
+      raise_not_found("Page not found") unless landing.present?
+
+      redirect_to lookbook_page_path(landing.path)
+    end
+
+    def show
+      @page = @pages.find_by_path(params[:path])
+      raise_not_found("Page not found") unless @page
+
+      @page_content = page_controller.render_page(@page)
+      @title = @page.title
+      @next_page = @pages.next(@page)
+      @previous_page = @pages.previous(@page)
+    rescue ActionView::Template::Error => err
+      raise Lookbook::TemplateError.new(
+        original: err,
+        file_path: @page.file_path,
+        source: @page.content
+      )
+    end
+
+    protected
+
+    def page_controller
+      controller_class = Lookbook.config.page_controller.constantize
+      controller = controller_class.new
+      controller.request = request
+      controller
+    end
+  end
+end

data/app/controllers/lookbook/preview_controller.rb

@@ -0,0 +1,45 @@
+require "rails/application_controller"
+
+module Lookbook
+  class PreviewController < Rails::ApplicationController
+    content_security_policy(false) if respond_to?(:content_security_policy)
+
+    private
+
+    def set_locale(&block)
+      I18n.with_locale(params[:locale] || I18n.default_locale, &block)
+    end
+
+    # Returns either {} or {layout: value} depending on configuration
+    def determine_layout(layout_override = nil, prepend_views: true)
+      return {} unless defined?(Rails.root)
+
+      layout_declaration = {}
+
+      if !layout_override.nil?
+        # Allow component-level override, even if false (thus no layout rendered)
+        layout_declaration[:layout] = layout_override
+      elsif default_preview_layout.present?
+        layout_declaration[:layout] = default_preview_layout
+      end
+
+      prepend_application_view_paths if layout_declaration[:layout].present? && prepend_views
+
+      layout_declaration
+    end
+
+    def default_preview_layout
+      Lookbook.config.preview_layout
+    end
+
+    def prepend_application_view_paths
+      prepend_view_path Rails.root.join("app/views") if defined?(Rails.root)
+    end
+
+    def prepend_preview_scenarios_view_path
+      prepend_view_path(Engine.preview_paths)
+    end
+
+    alias_method :prepend_preview_examples_view_path, :prepend_preview_scenarios_view_path
+  end
+end

data/app/controllers/lookbook/previews_controller.rb

@@ -0,0 +1,78 @@
+module Lookbook
+  class PreviewsController < Lookbook::ApplicationController
+    include TargetableConcern
+    include WithPreviewControllerConcern
+
+    layout false
+
+    before_action :permit_framing, only: [:show]
+
+    def self.controller_path
+      "lookbook/previews"
+    end
+
+    def index
+      respond_to do |format|
+        format.json do
+          render(
+            json: Lookbook.previews.map do |preview|
+              {
+                name: preview.name,
+                scenarios: preview.scenarios.map { |scenario|
+                  case scenario
+                  when Lookbook::ScenarioEntity
+                    scenario_json(scenario)
+                  when Lookbook::ScenarioGroupEntity
+                    {
+                      name: scenario.name,
+                      examples: scenario.scenarios.map { |s| scenario_json(s) }
+                    }
+                  end
+                }
+              }
+            end
+          )
+        end
+      end
+    end
+
+    def show
+      raise_not_found("Preview not found") unless @target
+
+      @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
+
+    def embedded?
+      params[:lookbook_embed] == "true"
+    end
+
+    def iframe_content_scripts
+      render_to_string("lookbook/partials/_iframe_content_scripts", layout: nil)
+    end
+
+    def scenario_json(scenario)
+      {
+        name: scenario.name,
+        inspect_path: scenario.url_path,
+        preview_path: scenario.preview_path
+      }
+    end
+
+    def permit_framing
+      headers["X-Frame-Options"] = Lookbook.config.preview_embeds.policy if embedded?
+      headers["X-Frame-Options"] = "SAMEORIGIN" if headers["X-Frame-Options"]&.upcase == "DENY"
+    end
+  end
+end

data/app/helpers/lookbook/application_helper.rb

@@ -0,0 +1,27 @@
+module Lookbook
+  module ApplicationHelper
+    def lookbook_asset_path(file, version: true)
+      path = "#{Engine.host_config.relative_url_root}/lookbook-assets/#{file}".gsub("//", "/")
+      version ? "#{path}?v=#{Lookbook::VERSION}" : path
+    end
+
+    def lookbook_landing_path
+      landing = Engine.pages.find(&:landing?) || Engine.pages.first
+      if landing.present?
+        lookbook_page_path landing.lookup_path
+      else
+        lookbook_home_path
+      end
+    end
+
+    # Requests
+
+    def request_frame
+      request.headers["X-Lookbook-Frame"] || "root"
+    end
+
+    def frame_request?
+      request.headers["X-Lookbook-Frame"].present?
+    end
+  end
+end

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

@@ -0,0 +1,126 @@
+<% content_for :body do %>
+  <% if request_frame == "root" %>
+    <div
+      id="app"
+      x-data="app"
+      x-cloak
+      x-on:popstate.window="handleNavigation"
+      x-on:click.document="hijax"
+      x-on:navigation:start="closeMobileSidebar"
+      x-on:dom:update-complete.window="Lookbook.initEmbeds()"
+      class="w-screen h-screen grid grid-rows-[40px_1fr] relative">
+
+      <%= render "lookbook/partials/user_styles" %>
+
+      <%= lookbook_render :header,
+        id: "app-header",
+        debug_menu: @config.debug_menu,
+        project_name: @config.project_name,
+        project_logo: @config.project_logo %>
+
+      <% unless @blank_slate %>
+        
+        <%= lookbook_render :split_layout,
+          alpine_data: "$store.layout.main",
+          "x-bind:class": "$store.layout.mobile && '!block'" do |layout| %>
+
+          <% layout.with_pane id: "app-sidebar", class: "flex flex-col bg-lookbook-sidebar-bg relative translate-x-0",
+            "x-bind:class": "{
+              'transition': $store.layout.mobile,
+              'translate-x-full': $store.layout.mobile && sidebarHidden,
+              '!absolute right-0 bottom-0 top-[40px] h-[calc(100%_-_40px)] w-full max-w-[420px] z-[1001] border-l border-lookbook-divider': $store.layout.mobile
+            }",
+            "x-on:click.outside": "closeMobileSidebar",
+            cloak: true do %>
+
+            <% if @sidebar_panels.any? %>  
+              <%= lookbook_render :split_layout,
+                alpine_data: "$store.layout.#{@sidebar_panels.many? ? "sidebar" : "singleSectionSidebar"}",
+                style: "height: calc(100vh - 2.5rem);" do |layout| %>
+
+                <% @sidebar_panels.each do |panel| %>
+                  <% if panel == :previews && @previews.any? %>
+                    <% layout.with_pane class: "overflow-hidden" do %>
+                      <%= lookbook_render :nav,
+                        id: "previews-nav",
+                        tree: @previews.to_tree,
+                        alpine_data: "$store.nav.previews" do |nav| %>
+                        <%= nav.with_toolbar do |toolbar| %>
+                          <% toolbar.with_section padded: true do %>
+                            <h4 class="pt-1"><%= @config.preview_collection_label %></h4>
+                          <% end %>
+                          <% toolbar.with_section align: :right, padded: false do %>
+                            <%= lookbook_render :button_group, size: :xs do |group| %>
+                              <% group.with_button icon: :minus_square,
+                                tooltip: "Collapse all",
+                                "x-on:click": "closeAll" %>
+                            <% end %>
+                          <% end %>
+                        <% end %>
+                        <% if @config.preview_nav_filter %>
+                          <% nav.with_filter store: "$store.nav.previews.filter", placeholder: "Filter previews by name&hellip;" %>
+                        <% end %>
+                      <% end %>
+                    <% end %>
+                  <% end %>
+
+                  <% if panel == :pages && @pages.any? %>
+                    <% layout.with_pane class: "overflow-hidden" do %>
+                      <%= lookbook_render :nav,
+                        id: "pages-nav",
+                        tree: @pages.to_tree,
+                        alpine_data: "$store.nav.pages" do |nav| %>
+                        <%= nav.with_toolbar do |toolbar| %>
+                          <% toolbar.with_section padded: true do %>
+                            <h4 class="pt-1"><%= @config.page_collection_label %></h4>
+                          <% end %>
+                          <% toolbar.with_section align: :right, padded: false do %>
+                            <%= lookbook_render :button_group, size: :xs do |group| %>
+                              <% group.with_button icon: :minus_square,
+                                tooltip: "Collapse all",
+                                "x-on:click": "closeAll" %>
+                            <% end %>
+                          <% end %>
+                        <% end %>
+                        <% if @config.page_nav_filter %>
+                          <% nav.with_filter store: "$store.nav.pages.filter", placeholder: "Filter pages by name&hellip;" %>  
+                        <% end %>
+                      <% end %>
+                    <% end %>
+                  <% end %>
+                <% end %>
+              <% end %>
+            <% end %>
+          <% end %>
+
+          <% layout.with_pane id: "app-main", class: "overflow-hidden h-full", "x-bind:class": "$store.layout.mobile && 'w-screen'" do %>
+            <%= content_for?(:main) ? yield(:main) : yield %>
+          <% end %>
+        <% end %>
+      <% else %>
+        <div id="app-main" class="w-screen h-full overflow-hidden">
+          <%= content_for?(:main) ? yield(:main) : yield %>
+        </div>
+      <% end %>
+      
+      <div class="absolute opacity-0 bg-black inset-0 top-[39px] z-[-1] transition-opacity" x-bind:class="($store.layout.mobile && !sidebarHidden) && '!opacity-30 !z-[1000]'" data-cloak></div>
+
+      <% if content_for? :dropdowns %>
+        <div class="hidden">
+          <%= content_for :dropdowns -%>
+        </div>
+      <% end %>
+    </div>
+  <% elsif request_frame == "main" %>
+    <div id="app-main">
+      <%= content_for?(:main) ? yield(:main) : yield %>
+    </div>
+  <% end %>
+<% end %>
+
+<% if frame_request? %>
+  <%= yield :body %>
+<% else %>
+  <%= render template: "layouts/lookbook/skeleton" %>
+<% end %>
+

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

@@ -0,0 +1,34 @@
+<% content_for :body do %>
+  <% if request_frame == "root" %>
+    <div
+      id="app"
+      x-data="app"
+      x-cloak
+      x-on:popstate.window="handleNavigation"
+      x-on:click.document="hijax"
+      class="overflow-hidden">
+      
+      <%= render "lookbook/partials/user_styles" %>
+
+      <div id="app-main" class="contents">
+        <%= content_for?(:main) ? yield(:main) : yield %>
+      </div>
+    </div>
+
+    <% if content_for? :dropdowns %>
+      <div class="hidden">
+        <%= content_for :dropdowns -%>
+      </div>
+    <% end %>
+  <% elsif request_frame == "main" %>
+    <div id="app-main">
+      <%= content_for?(:main) ? yield(:main) : yield %>
+    </div>    
+  <% end %>    
+<% end %>
+
+<% if frame_request? %>
+  <%= yield :body %>
+<% else %>
+  <%= render template: "layouts/lookbook/skeleton" %>
+<% end %>