lookbook 1.0.0 → 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +4 -4
- data/app/assets/lookbook/js/app.js +1 -0
- data/app/assets/lookbook/js/lib/socket.js +9 -5
- data/app/components/lookbook/base_component.rb +10 -2
- data/app/components/lookbook/copy_button/component.rb +1 -1
- data/app/components/lookbook/dimensions_display/component.rb +1 -4
- data/app/components/lookbook/embed/component.html.erb +5 -5
- data/app/components/lookbook/embed/component.rb +2 -2
- data/app/components/lookbook/header/component.html.erb +4 -4
- data/app/components/lookbook/icon/component.html.erb +1 -1
- data/app/components/lookbook/icon/component.rb +1 -5
- data/app/components/lookbook/inspector_panel/component.rb +1 -2
- data/app/components/lookbook/nav/component.html.erb +1 -1
- data/app/components/lookbook/nav/item/component.rb +2 -2
- data/app/components/lookbook/params_editor/field/component.rb +1 -1
- data/app/components/lookbook/tabs/component.js +2 -2
- data/app/controllers/lookbook/application_controller.rb +10 -1
- data/app/controllers/lookbook/pages_controller.rb +0 -1
- data/app/controllers/lookbook/previews_controller.rb +29 -24
- data/app/helpers/lookbook/component_helper.rb +5 -0
- data/app/views/layouts/lookbook/application.html.erb +6 -36
- data/app/views/lookbook/index.html.erb +3 -3
- data/app/views/lookbook/previews/show.html.erb +3 -3
- data/config/routes.rb +2 -2
- data/lib/lookbook/component.rb +4 -0
- data/lib/lookbook/config.rb +7 -3
- data/lib/lookbook/data.rb +2 -2
- data/lib/lookbook/engine.rb +80 -75
- data/lib/lookbook/page.rb +4 -4
- data/lib/lookbook/parser.rb +19 -11
- data/lib/lookbook/preview.rb +28 -78
- data/lib/lookbook/preview_controller.rb +19 -1
- data/lib/lookbook/preview_example.rb +12 -5
- data/lib/lookbook/source_inspector.rb +2 -2
- data/lib/lookbook/store.rb +2 -2
- data/lib/lookbook/version.rb +1 -1
- data/lib/tasks/lookbook_tasks.rake +1 -2
- data/public/lookbook-assets/css/lookbook.css +8 -34
- data/public/lookbook-assets/css/lookbook.css.map +1 -1
- data/public/lookbook-assets/js/lookbook.js +175 -121
- data/public/lookbook-assets/js/lookbook.js.map +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 95694c758af19ee6a561b2aedfee93d932c663f7027471204da2dce393052a5a
|
4
|
+
data.tar.gz: 1b4f3e4af714af47b6719cbbef7a861ad0ca2341089e2689ef8ed80b9a745867
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 0a148ae5b71546463c003244040e54de07106db6f927e61b77ff35c92d524f37ed59e53646833675a8d1c399968904ffe41891817e85628aa8da879af8aa3bd8
|
7
|
+
data.tar.gz: ee91d909da4634558dbf542802ee770c921f0dfdec0bdc37592977b082a97705957bf7e19cf5168b599e78dca1f5d4222147417262c4b41f90b305a43c2c4f72
|
data/README.md
CHANGED
@@ -1,12 +1,12 @@
|
|
1
1
|
# Lookbook
|
2
2
|
|
3
3
|
<div>
|
4
|
-
<a href="https://rubygems.org/gems/lookbook"><img src="https://img.shields.io/gem/v/lookbook
|
4
|
+
<a href="https://rubygems.org/gems/lookbook"><img src="https://img.shields.io/gem/v/lookbook" alt="Gem version"></a>
|
5
5
|
<a href="https://github.com/allmarkedup/lookbook/actions/workflows/ci.yml"><img src="https://github.com/allmarkedup/lookbook/actions/workflows/ci.yml/badge.svg?branch=main" alt="CI status"></a>
|
6
6
|
</div>
|
7
7
|
<br>
|
8
8
|
|
9
|
-
A tool to help develop, test
|
9
|
+
A tool to help browse, develop, test & document [ViewComponents](https://viewcomponent.org/) in Ruby on Rails apps.
|
10
10
|
|
11
11
|
## Documentation
|
12
12
|
|
@@ -17,9 +17,9 @@ A tool to help develop, test and document [ViewComponents](https://viewcomponent
|
|
17
17
|
|
18
18
|
## Demo
|
19
19
|
|
20
|
-
**Online Demo:** [https://lookbook-demo-app
|
20
|
+
**Online Demo:** [https://lookbook-demo-app.herokuapp.com/lookbook](https://lookbook-demo-app.herokuapp.com/lookbook)
|
21
21
|
|
22
|
-
[](https://lookbook-demo-app
|
22
|
+
[](https://lookbook-demo-app.herokuapp.com/lookbook/)
|
23
23
|
|
24
24
|
|
25
25
|
## Development
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { createConsumer } from "@rails/actioncable";
|
2
|
-
import debounce from "debounce";
|
2
|
+
import { debounce } from "throttle-debounce";
|
3
3
|
import { log } from "../plugins/logger";
|
4
4
|
|
5
5
|
export default function socket(endpoint) {
|
@@ -8,10 +8,14 @@ export default function socket(endpoint) {
|
|
8
8
|
return {
|
9
9
|
addListener(channel, callback) {
|
10
10
|
consumer.subscriptions.create(channel, {
|
11
|
-
received: debounce(
|
12
|
-
|
13
|
-
|
14
|
-
|
11
|
+
received: debounce(
|
12
|
+
200,
|
13
|
+
(data) => {
|
14
|
+
log.debug("Lookbook files changed");
|
15
|
+
callback(data);
|
16
|
+
},
|
17
|
+
{ atBegin: true }
|
18
|
+
),
|
15
19
|
connected() {
|
16
20
|
log.info("Lookbook websocket connected");
|
17
21
|
},
|
@@ -31,11 +31,19 @@ module Lookbook
|
|
31
31
|
nil
|
32
32
|
end
|
33
33
|
|
34
|
+
def alpine_encode(data)
|
35
|
+
if data.is_a? String
|
36
|
+
"\'#{json_escape data}\'"
|
37
|
+
else
|
38
|
+
json_escape data.to_json.tr("\"", "\'")
|
39
|
+
end
|
40
|
+
end
|
41
|
+
|
34
42
|
def prepare_alpine_data(x_data = nil)
|
35
43
|
alpine_component_name = x_data || @html_attrs&.dig(:"x-data") || alpine_component
|
36
44
|
if alpine_component_name.present?
|
37
|
-
args = Array.wrap(alpine_data)
|
38
|
-
args.any? ? "#{alpine_component_name}(#{
|
45
|
+
args = Array.wrap(alpine_data).compact
|
46
|
+
args.any? ? "#{alpine_component_name}(#{args.join(",")})" : alpine_component_name
|
39
47
|
end
|
40
48
|
end
|
41
49
|
end
|
@@ -2,15 +2,12 @@ module Lookbook
|
|
2
2
|
class DimensionsDisplay::Component < Lookbook::BaseComponent
|
3
3
|
def initialize(target:, **html_attrs)
|
4
4
|
@target = target
|
5
|
+
@alpine_data = alpine_encode(@target)
|
5
6
|
super(**html_attrs)
|
6
7
|
end
|
7
8
|
|
8
9
|
protected
|
9
10
|
|
10
|
-
def alpine_data
|
11
|
-
@target.to_json
|
12
|
-
end
|
13
|
-
|
14
11
|
def alpine_component
|
15
12
|
"dimensionsDisplayComponent"
|
16
13
|
end
|
@@ -1,19 +1,19 @@
|
|
1
|
-
<% if @
|
1
|
+
<% if @target.present? %>
|
2
2
|
<%= render_component_tag class: "not-prose border-b border-lookbook-divider rounded-sm overflow-hidden", "@navigation:start.window": "cleanup" do %>
|
3
3
|
|
4
4
|
<%= render_component :toolbar, class: "border border-b-0 border-lookbook-divider" do |toolbar| %>
|
5
5
|
<% toolbar.section padded: true do %>
|
6
6
|
<h3>
|
7
|
-
<%= @
|
7
|
+
<%= @target.preview.label %> (<%= @target.label %>)
|
8
8
|
</h3>
|
9
9
|
<% end %>
|
10
10
|
<% toolbar.section align: :right, divide: :left do %>
|
11
11
|
<%= render_component :button_group do |group| %>
|
12
12
|
<% group.button icon: :eye,
|
13
|
-
href: lookbook_inspect_path(@
|
13
|
+
href: lookbook_inspect_path(@target.path, @params),
|
14
14
|
tooltip: "View in Inspector" %>
|
15
15
|
<% group.button icon: :external_link,
|
16
|
-
href: lookbook_preview_path(@
|
16
|
+
href: lookbook_preview_path(@target.path, @params),
|
17
17
|
tooltip: "Open in new window",
|
18
18
|
target: "_blank" %>
|
19
19
|
<% end %>
|
@@ -28,7 +28,7 @@
|
|
28
28
|
@viewport:resize-complete="resizeIframe"
|
29
29
|
@tabs:change.window="resizeIframe">
|
30
30
|
<%= render_component :viewport,
|
31
|
-
src: lookbook_preview_path(@
|
31
|
+
src: lookbook_preview_path(@target.path, @params.merge(lookbook_embed: true)),
|
32
32
|
alpine_data: "store",
|
33
33
|
resize_height: false,
|
34
34
|
max_height: @max_height,
|
@@ -2,7 +2,7 @@ module Lookbook
|
|
2
2
|
class Embed::Component < Lookbook::BaseComponent
|
3
3
|
def initialize(id:, example:, params: {}, opts: {}, max_height: nil, **html_attrs)
|
4
4
|
@id = id
|
5
|
-
@
|
5
|
+
@target = example
|
6
6
|
@params = params
|
7
7
|
@opts = opts
|
8
8
|
@max_height = max_height
|
@@ -20,7 +20,7 @@ module Lookbook
|
|
20
20
|
end
|
21
21
|
|
22
22
|
def alpine_data
|
23
|
-
[@id
|
23
|
+
[alpine_encode(@id), "$store.pages.embeds"].join(",")
|
24
24
|
end
|
25
25
|
|
26
26
|
def alpine_component
|
@@ -46,11 +46,11 @@
|
|
46
46
|
<span class="opacity-70 mr-1">Lookbook</span>
|
47
47
|
<span class="mr-6">v<%= Lookbook::VERSION %></span>
|
48
48
|
<div class="flex items-center space-x-2">
|
49
|
-
|
50
|
-
<%= icon
|
51
|
-
</a
|
49
|
+
<a href="https://lookbook.build/guide" target="_blank" class="ml-auto opacity-70" title="Documentation">
|
50
|
+
<%= icon :book, size: 3 %>
|
51
|
+
</a>
|
52
52
|
<a href="https://github.com/allmarkedup/lookbook" target="_blank" class="ml-auto opacity-70" title="Github">
|
53
|
-
<%= icon
|
53
|
+
<%= icon :github, size: 3 %>
|
54
54
|
</a>
|
55
55
|
</div>
|
56
56
|
</div>
|
@@ -1,4 +1,4 @@
|
|
1
|
-
<%= render_component_tag :i, style: "height: #{size_rems}; width: #{size_rems}" do %>
|
1
|
+
<%= render_component_tag :i, style: "height: #{size_rems}; width: #{size_rems}; #{@html_attrs[:style]}" do %>
|
2
2
|
<svg>
|
3
3
|
<use :href="`/lookbook-assets/feather-sprite.svg#${iconName}`" x-cloak />
|
4
4
|
</svg>
|
@@ -1,7 +1,7 @@
|
|
1
1
|
module Lookbook
|
2
2
|
class Icon::Component < Lookbook::BaseComponent
|
3
3
|
def initialize(name:, size: 4, **html_attrs)
|
4
|
-
@
|
4
|
+
@alpine_data = name.is_a?(Symbol) ? alpine_encode(name.to_s.tr("_", "-")) : name
|
5
5
|
@size = size || 4
|
6
6
|
super(**html_attrs)
|
7
7
|
end
|
@@ -12,10 +12,6 @@ module Lookbook
|
|
12
12
|
|
13
13
|
protected
|
14
14
|
|
15
|
-
def alpine_data
|
16
|
-
@icon_name
|
17
|
-
end
|
18
|
-
|
19
15
|
def alpine_component
|
20
16
|
"iconComponent"
|
21
17
|
end
|
@@ -25,9 +25,8 @@ module Lookbook
|
|
25
25
|
css_parser.each_selector do |selector, declarations, specificity|
|
26
26
|
@panel_styles += "##{id} #{selector} { #{declarations} }\n"
|
27
27
|
end
|
28
|
-
style_tag.unlink
|
29
28
|
end
|
30
|
-
@panel_html =
|
29
|
+
@panel_html = content.gsub(/<style(?:\s[^>]*)?>.*<\/style>/, "").html_safe
|
31
30
|
end
|
32
31
|
end
|
33
32
|
@panel_html ||= content
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import debounce from "debounce";
|
1
|
+
import { debounce } from "throttle-debounce";
|
2
2
|
import tippy from "~/app/assets/lookbook/js/lib/tippy";
|
3
3
|
import { observeSize } from "@helpers/layout";
|
4
4
|
import { getElementSize } from "@helpers/dom";
|
@@ -49,7 +49,7 @@ export default function tabsComponent(store) {
|
|
49
49
|
|
50
50
|
this.parentObserver = observeSize(
|
51
51
|
this.$root.parentElement,
|
52
|
-
debounce(this.handleResize.bind(this)
|
52
|
+
debounce(10, this.handleResize.bind(this))
|
53
53
|
);
|
54
54
|
|
55
55
|
this.$watch("visibleTabsCount", (value) => {
|
@@ -1,6 +1,9 @@
|
|
1
1
|
module Lookbook
|
2
2
|
class ApplicationController < ActionController::Base
|
3
|
-
|
3
|
+
if respond_to?(:content_security_policy)
|
4
|
+
content_security_policy false, if: -> { Rails.env.development? }
|
5
|
+
end
|
6
|
+
|
4
7
|
protect_from_forgery with: :exception
|
5
8
|
|
6
9
|
helper Lookbook::ApplicationHelper
|
@@ -8,6 +11,7 @@ module Lookbook
|
|
8
11
|
helper Lookbook::ComponentHelper
|
9
12
|
|
10
13
|
before_action :generate_theme_overrides
|
14
|
+
before_action :assign_collections
|
11
15
|
|
12
16
|
def self.controller_path
|
13
17
|
"lookbook"
|
@@ -28,6 +32,11 @@ module Lookbook
|
|
28
32
|
@theme_overrides ||= Lookbook.theme.to_css
|
29
33
|
end
|
30
34
|
|
35
|
+
def assign_collections
|
36
|
+
@previews = Preview.all
|
37
|
+
@pages = Page.all
|
38
|
+
end
|
39
|
+
|
31
40
|
def feature_enabled?(feature)
|
32
41
|
Lookbook::Features.enabled?(feature)
|
33
42
|
end
|
@@ -13,7 +13,7 @@ module Lookbook
|
|
13
13
|
before_action :set_params
|
14
14
|
|
15
15
|
def preview
|
16
|
-
if @
|
16
|
+
if @target
|
17
17
|
begin
|
18
18
|
opts = {layout: @preview.layout}
|
19
19
|
if params[:lookbook_embed] == "true"
|
@@ -32,7 +32,7 @@ module Lookbook
|
|
32
32
|
end
|
33
33
|
|
34
34
|
def show
|
35
|
-
if @
|
35
|
+
if @target
|
36
36
|
begin
|
37
37
|
@main_panels = main_panels
|
38
38
|
@drawer_panels = drawer_panels
|
@@ -52,9 +52,9 @@ module Lookbook
|
|
52
52
|
private
|
53
53
|
|
54
54
|
def lookup_entities
|
55
|
-
@
|
56
|
-
if @
|
57
|
-
@preview = @
|
55
|
+
@target = Lookbook.previews.find_example(params[:path])
|
56
|
+
if @target.present?
|
57
|
+
@preview = @target.preview
|
58
58
|
if params[:path] == @preview&.lookup_path
|
59
59
|
redirect_to lookbook_inspect_path "#{params[:path]}/#{@preview.default_example.name}"
|
60
60
|
end
|
@@ -85,17 +85,17 @@ module Lookbook
|
|
85
85
|
end
|
86
86
|
|
87
87
|
def target_examples
|
88
|
-
@
|
88
|
+
@target.type == :group ? @target.examples : [@target]
|
89
89
|
end
|
90
90
|
|
91
91
|
def set_title
|
92
|
-
@title = @
|
92
|
+
@title = @target.present? ? [@target&.label, @preview&.label].compact.join(" :: ") : "Not found"
|
93
93
|
end
|
94
94
|
|
95
95
|
def set_params
|
96
|
-
if @
|
96
|
+
if @target
|
97
97
|
# cast known params to type
|
98
|
-
@
|
98
|
+
@target.params.each do |param|
|
99
99
|
if preview_controller.params.key?(param[:name])
|
100
100
|
preview_controller.params[param[:name]] = Lookbook::Params.cast(preview_controller.params[param[:name]], param[:type])
|
101
101
|
end
|
@@ -103,7 +103,7 @@ module Lookbook
|
|
103
103
|
# set display and data params
|
104
104
|
preview_controller.params.merge!({
|
105
105
|
lookbook: {
|
106
|
-
display: @
|
106
|
+
display: @target.display_params,
|
107
107
|
data: Lookbook.data
|
108
108
|
}
|
109
109
|
})
|
@@ -113,7 +113,7 @@ module Lookbook
|
|
113
113
|
def preview_params
|
114
114
|
preview_controller.params.permit!
|
115
115
|
preview_controller.params.to_h.select do |key, value|
|
116
|
-
!!@
|
116
|
+
!!@target.params.find { |param| param[:name] == key }
|
117
117
|
end
|
118
118
|
end
|
119
119
|
|
@@ -125,12 +125,7 @@ module Lookbook
|
|
125
125
|
path: params[:path]
|
126
126
|
}
|
127
127
|
|
128
|
-
example = @example
|
129
128
|
preview = @preview
|
130
|
-
preview.define_singleton_method(:params, proc {
|
131
|
-
example.params
|
132
|
-
})
|
133
|
-
|
134
129
|
examples = target_examples.map do |example|
|
135
130
|
render_args = @preview.render_args(example.name, params: preview_controller.params)
|
136
131
|
has_template = render_args[:template] != "view_components/preview"
|
@@ -144,11 +139,18 @@ module Lookbook
|
|
144
139
|
example
|
145
140
|
end
|
146
141
|
|
142
|
+
target = @target.type == :group ? @target : examples.find { |e| e.lookup_path == @target.lookup_path }
|
143
|
+
|
144
|
+
preview.define_singleton_method(:params, proc {
|
145
|
+
target.params
|
146
|
+
})
|
147
|
+
|
147
148
|
@inspector_data ||= Lookbook::Store.new({
|
148
149
|
context: context_data,
|
149
150
|
preview: preview,
|
150
151
|
examples: examples,
|
151
|
-
example:
|
152
|
+
example: examples.first,
|
153
|
+
target: target,
|
152
154
|
data: Lookbook.data,
|
153
155
|
app: Lookbook
|
154
156
|
})
|
@@ -156,22 +158,25 @@ module Lookbook
|
|
156
158
|
|
157
159
|
def panels
|
158
160
|
return @panels if @panels.present?
|
159
|
-
|
160
|
-
|
161
|
+
inspector_data_hash = inspector_data.to_h
|
162
|
+
panel_counts = {}
|
163
|
+
|
164
|
+
@panels = Lookbook.config.inspector_panels.map do |name, config|
|
161
165
|
config_with_defaults = Lookbook.config.inspector_panel_defaults.merge(config)
|
166
|
+
panel_counts[config_with_defaults[:pane].to_sym] ||= 0
|
167
|
+
panel_counts[config_with_defaults[:pane].to_sym] += 1
|
162
168
|
|
163
169
|
callable_data = {
|
164
170
|
name: name.to_s,
|
165
|
-
index_position:
|
166
|
-
**
|
171
|
+
index_position: panel_counts[config_with_defaults[:pane].to_sym],
|
172
|
+
**inspector_data_hash
|
167
173
|
}
|
168
174
|
|
169
175
|
resolved_config = config_with_defaults.transform_values do |value|
|
170
176
|
value.instance_of?(Proc) ? value.call(Lookbook::Store.new(callable_data)) : value
|
171
177
|
end
|
172
178
|
resolved_config[:name] = name.to_s
|
173
|
-
|
174
|
-
@panels << Lookbook::Store.new(resolved_config, deep: false)
|
179
|
+
Store.new(resolved_config)
|
175
180
|
end
|
176
181
|
|
177
182
|
@panels = @panels.select(&:show).sort_by { |p| [p.position, p.label] }
|
@@ -198,7 +203,7 @@ module Lookbook
|
|
198
203
|
{
|
199
204
|
file_path: @preview&.full_path,
|
200
205
|
line_number: 0,
|
201
|
-
source_code: @
|
206
|
+
source_code: @target&.source
|
202
207
|
}
|
203
208
|
elsif exception.is_a?(ActionView::Template::Error) & exception.message.include?("implements a reserved method")
|
204
209
|
message_parts = exception.message.split("\n").first.split
|
@@ -6,6 +6,11 @@ module Lookbook
|
|
6
6
|
render Lookbook::Icon::Component.new(name: name, **attrs)
|
7
7
|
end
|
8
8
|
|
9
|
+
def code(language = :html, **attrs, &block)
|
10
|
+
attrs[:language] ||= language
|
11
|
+
render Lookbook::Code::Component.new(**attrs), &block
|
12
|
+
end
|
13
|
+
|
9
14
|
def render_component(ref, **attrs, &block)
|
10
15
|
klass = component_class(ref)
|
11
16
|
comp = attrs.key?(:content) ? klass.new(**attrs.except(:content)).with_content(attrs[:content]) : klass.new(**attrs)
|
@@ -1,5 +1,5 @@
|
|
1
1
|
<% content_for :shell do %>
|
2
|
-
<% if
|
2
|
+
<% if @previews.any? || @pages.any? %>
|
3
3
|
<%= render_component :split_layout,
|
4
4
|
alpine_data: "$store.layout.main",
|
5
5
|
":class": "$store.layout.mobile && '!block'" do |layout| %>
|
@@ -14,14 +14,14 @@
|
|
14
14
|
cloak: true do %>
|
15
15
|
|
16
16
|
<%= render_component :split_layout,
|
17
|
-
alpine_data: "$store.layout.#{
|
17
|
+
alpine_data: "$store.layout.#{@pages.any? && @previews.any? ? "sidebar" : "singleSectionSidebar"}",
|
18
18
|
style: "height: calc(100vh - 2.5rem);" do |layout| %>
|
19
19
|
|
20
|
-
<% if
|
20
|
+
<% if @previews.any? %>
|
21
21
|
<% layout.pane class: "overflow-hidden" do %>
|
22
22
|
<%= render_component :nav,
|
23
23
|
id: "previews-nav",
|
24
|
-
collection:
|
24
|
+
collection: @previews,
|
25
25
|
alpine_data: "$store.nav.previews",
|
26
26
|
collapse_singles: true do |nav| %>
|
27
27
|
<%= nav.toolbar do |toolbar| %>
|
@@ -34,11 +34,11 @@
|
|
34
34
|
<% end %>
|
35
35
|
<% end %>
|
36
36
|
|
37
|
-
<% if
|
37
|
+
<% if @pages.any? %>
|
38
38
|
<% layout.pane class: "overflow-hidden" do %>
|
39
39
|
<%= render_component :nav,
|
40
40
|
id: "pages-nav",
|
41
|
-
collection:
|
41
|
+
collection: @pages,
|
42
42
|
alpine_data: "$store.nav.pages" do |nav| %>
|
43
43
|
<%= nav.toolbar do |toolbar| %>
|
44
44
|
<% toolbar.section padded: true do %>
|
@@ -49,36 +49,6 @@
|
|
49
49
|
<% end %>
|
50
50
|
<% end %>
|
51
51
|
<% end %>
|
52
|
-
|
53
|
-
<% if Lookbook::Preview.errors.any? %>
|
54
|
-
<div x-data="{hidden: false}" class="flex-none border-t border-lookbook-divider absolute bottom-0 left-0 right-0" x-show="!hidden">
|
55
|
-
<%= render_component :toolbar do |toolbar| %>
|
56
|
-
<% toolbar.section padded: true, class: "flex items-center" do %>
|
57
|
-
<%= icon :alert_triangle, size: 4, class: "text-red-700" %>
|
58
|
-
<span class="ml-2">Preview load errors</span>
|
59
|
-
<% end %>
|
60
|
-
<% toolbar.section align: :right do %>
|
61
|
-
<% render_component :button, icon: :x, "@click": "hidden = !hidden" %>
|
62
|
-
<% end %>
|
63
|
-
<% end %>
|
64
|
-
|
65
|
-
<div class="h-full max-h-[300px] overflow-hidden">
|
66
|
-
<div class="bg-red-50 w-full overflow-auto h-full">
|
67
|
-
<ul class="text-sm divide-y divide-red-200">
|
68
|
-
<% Lookbook::Preview.errors.each do |error| %>
|
69
|
-
<% error = error.is_a?(Lookbook::Error) ? error : Lookbook::Error.new(error) %>
|
70
|
-
<li class="px-4 py-3">
|
71
|
-
<h4 class="break-all leading-tight text-xs ">
|
72
|
-
<%= error.file_name %><%= ":#{error.line_number}" if error.line_number %>
|
73
|
-
</h4>
|
74
|
-
<pre class="text-red-800 text-xs mt-2 whitespace-pre-wrap opacity-80 font-mono"><%= error.message %></pre>
|
75
|
-
</li>
|
76
|
-
<% end %>
|
77
|
-
</ul>
|
78
|
-
</div>
|
79
|
-
</div>
|
80
|
-
</div>
|
81
|
-
<% end %>
|
82
52
|
<% end %>
|
83
53
|
|
84
54
|
<% layout.pane id: "app-main", class: "overflow-hidden h-full", ":class": "$store.layout.mobile && 'w-screen'" do %>
|
@@ -1,13 +1,13 @@
|
|
1
1
|
<div id="landing" class="flex flex-col items-center justify-center h-full w-full">
|
2
|
-
<div class="text-center" id="landing-<%=
|
2
|
+
<div class="text-center" id="landing-<%= @previews.any? ? "with" : "no" %>-content">
|
3
3
|
<h5 class="text-base text-lookbook-blank-slate-title truncate uppercase font-black tracking-wider mb-2">
|
4
4
|
<%= config.project_name %>
|
5
5
|
</h5>
|
6
6
|
<div class="opacity-60">
|
7
|
-
<% if
|
7
|
+
<% if @previews.any? %>
|
8
8
|
<p>Select a preview from the nav to get started.</p>
|
9
9
|
<% else %>
|
10
|
-
<p><a class="underline" href="https://
|
10
|
+
<p><a class="underline" href="https://lookbook.build/guide/previews" target="_blank">Create a preview</a> to get started.</p>
|
11
11
|
<% end %>
|
12
12
|
</div>
|
13
13
|
</div>
|
@@ -25,11 +25,11 @@
|
|
25
25
|
|
26
26
|
<% toolbar.section divide: :left, class: "flex-none relative z-10" do %>
|
27
27
|
<%= render_component :button_group do |group| %>
|
28
|
-
<% if
|
28
|
+
<% if @pages.any? %>
|
29
29
|
<% group.button icon: :code,
|
30
30
|
tooltip: "Copy page embed code",
|
31
31
|
copy: true do %>
|
32
|
-
<%= embed <%= @preview.preview_class %>, :<%= @
|
32
|
+
<%= embed <%= @preview.preview_class %>, :<%= @target.name %>, params: <%= request.query_parameters.deep_symbolize_keys.to_s %> %>
|
33
33
|
<% end %>
|
34
34
|
<% end %>
|
35
35
|
|
@@ -38,7 +38,7 @@
|
|
38
38
|
"@click.stop": "startSpin(); $dispatch('viewport:reload'); stopSpin(500);" %>
|
39
39
|
|
40
40
|
<% group.button icon: :external_link,
|
41
|
-
href: lookbook_preview_path(@
|
41
|
+
href: lookbook_preview_path(@target.lookup_path, request.query_parameters),
|
42
42
|
tooltip: "Open preview in new window",
|
43
43
|
target: "_blank" %>
|
44
44
|
|
data/config/routes.rb
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
Lookbook::Engine.routes.draw do
|
2
|
-
if Lookbook.
|
3
|
-
mount Lookbook::Engine.websocket => Lookbook.config.cable_mount_path
|
2
|
+
if Lookbook::Engine.websocket?
|
3
|
+
mount Lookbook::Engine.websocket => Lookbook.config.cable_mount_path, :as => :cable
|
4
4
|
end
|
5
5
|
|
6
6
|
root to: "application#index", as: :lookbook_home
|