lookbook 1.0.8 → 1.1.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (88) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/lookbook/css/lookbook.css +76 -2
  3. data/app/assets/lookbook/js/app.js +20 -2
  4. data/app/{components/lookbook/params_editor/field/component.js → assets/lookbook/js/components/params_input.js} +1 -14
  5. data/app/assets/lookbook/js/lookbook.js +2 -1
  6. data/app/components/lookbook/base_component.rb +2 -3
  7. data/app/components/lookbook/button/component.html.erb +2 -2
  8. data/app/components/lookbook/button/component.rb +6 -1
  9. data/app/components/lookbook/button_group/component.rb +3 -4
  10. data/app/components/lookbook/copy_button/component.html.erb +1 -1
  11. data/app/components/lookbook/debug_menu/component.html.erb +51 -0
  12. data/app/components/lookbook/debug_menu/component.rb +18 -0
  13. data/app/components/lookbook/embed/component.html.erb +3 -3
  14. data/app/components/lookbook/header/component.html.erb +19 -44
  15. data/app/components/lookbook/inspector_panel/component.html.erb +5 -3
  16. data/app/components/lookbook/inspector_panel/component.rb +6 -18
  17. data/app/components/lookbook/nav/component.js +4 -0
  18. data/app/components/lookbook/nav/component.rb +1 -1
  19. data/app/components/lookbook/nav/item/component.html.erb +4 -4
  20. data/app/components/lookbook/nav/item/component.rb +1 -1
  21. data/app/components/lookbook/page_tabs/component.html.erb +4 -4
  22. data/app/components/lookbook/page_tabs/component.rb +1 -1
  23. data/app/components/lookbook/params/editor/component.html.erb +21 -0
  24. data/app/components/lookbook/{params_editor → params/editor}/component.js +1 -1
  25. data/app/components/lookbook/params/editor/component.rb +40 -0
  26. data/app/components/lookbook/params/field/component.css +76 -0
  27. data/app/components/lookbook/params/field/component.html.erb +27 -0
  28. data/app/components/lookbook/params/field/component.js +7 -0
  29. data/app/components/lookbook/params/field/component.rb +101 -0
  30. data/app/components/lookbook/tabs/component.html.erb +2 -2
  31. data/app/components/lookbook/tag_component.rb +1 -0
  32. data/app/components/lookbook/viewport/component.css +1 -1
  33. data/app/components/lookbook/viewport/component.html.erb +11 -0
  34. data/app/controllers/lookbook/previews_controller.rb +1 -1
  35. data/app/helpers/lookbook/component_helper.rb +45 -26
  36. data/app/helpers/lookbook/page_helper.rb +1 -1
  37. data/app/helpers/lookbook/preview_helper.rb +1 -1
  38. data/app/views/layouts/lookbook/application.html.erb +18 -4
  39. data/app/views/layouts/lookbook/page.html.erb +4 -4
  40. data/app/views/layouts/lookbook/shell.html.erb +4 -4
  41. data/app/views/layouts/lookbook/skeleton.html.erb +0 -6
  42. data/app/views/lookbook/error.html.erb +1 -1
  43. data/app/views/lookbook/pages/show.html.erb +2 -2
  44. data/app/views/lookbook/preview.html.erb +1 -1
  45. data/app/views/lookbook/previews/inputs/_color.html.erb +5 -0
  46. data/app/views/lookbook/previews/inputs/_range.html.erb +15 -0
  47. data/app/views/lookbook/previews/inputs/_select.html.erb +5 -0
  48. data/app/views/lookbook/previews/inputs/_text.html.erb +5 -0
  49. data/app/views/lookbook/previews/inputs/_textarea.html.erb +5 -0
  50. data/app/views/lookbook/previews/inputs/_toggle.html.erb +20 -0
  51. data/app/views/lookbook/previews/panels/_content.html.erb +2 -2
  52. data/app/views/lookbook/previews/panels/_notes.html.erb +2 -2
  53. data/app/views/lookbook/previews/panels/_output.html.erb +1 -1
  54. data/app/views/lookbook/previews/panels/_params.html.erb +3 -3
  55. data/app/views/lookbook/previews/panels/_preview.html.erb +1 -1
  56. data/app/views/lookbook/previews/panels/_source.html.erb +2 -2
  57. data/app/views/lookbook/previews/show.html.erb +13 -19
  58. data/lib/lookbook/config.rb +111 -100
  59. data/lib/lookbook/engine.rb +3 -60
  60. data/lib/lookbook/markdown.rb +1 -1
  61. data/lib/lookbook/panels.rb +14 -4
  62. data/lib/lookbook/params.rb +66 -35
  63. data/lib/lookbook/parser.rb +1 -0
  64. data/lib/lookbook/preview.rb +10 -4
  65. data/lib/lookbook/preview_controller.rb +7 -19
  66. data/lib/lookbook/preview_example.rb +1 -1
  67. data/lib/lookbook/source_inspector.rb +10 -4
  68. data/lib/lookbook/store.rb +14 -28
  69. data/lib/lookbook/tag.rb +13 -3
  70. data/lib/lookbook/tag_options.rb +111 -0
  71. data/lib/lookbook/tags.rb +6 -2
  72. data/lib/lookbook/template_parser.rb +72 -0
  73. data/lib/lookbook/theme.rb +1 -1
  74. data/lib/lookbook/utils.rb +23 -0
  75. data/lib/lookbook/version.rb +1 -1
  76. data/lib/lookbook.rb +75 -28
  77. data/public/lookbook-assets/css/lookbook.css +369 -126
  78. data/public/lookbook-assets/css/lookbook.css.map +1 -1
  79. data/public/lookbook-assets/js/embed.js +13 -13
  80. data/public/lookbook-assets/js/embed.js.map +1 -1
  81. data/public/lookbook-assets/js/lookbook.js +701 -612
  82. data/public/lookbook-assets/js/lookbook.js.map +1 -1
  83. metadata +56 -11
  84. data/app/components/lookbook/params_editor/component.html.erb +0 -3
  85. data/app/components/lookbook/params_editor/component.rb +0 -11
  86. data/app/components/lookbook/params_editor/field/component.html.erb +0 -49
  87. data/app/components/lookbook/params_editor/field/component.rb +0 -44
  88. data/lib/lookbook/data.rb +0 -11
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: lookbook
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.0.8
4
+ version: 1.1.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Mark Perkins
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2022-09-15 00:00:00.000000000 Z
11
+ date: 2022-10-11 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: css_parser
@@ -38,6 +38,34 @@ dependencies:
38
38
  - - ">="
39
39
  - !ruby/object:Gem::Version
40
40
  version: '0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: activemodel
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - ">="
46
+ - !ruby/object:Gem::Version
47
+ version: '0'
48
+ type: :runtime
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - ">="
53
+ - !ruby/object:Gem::Version
54
+ version: '0'
55
+ - !ruby/object:Gem::Dependency
56
+ name: zeitwerk
57
+ requirement: !ruby/object:Gem::Requirement
58
+ requirements:
59
+ - - "~>"
60
+ - !ruby/object:Gem::Version
61
+ version: '2.5'
62
+ type: :runtime
63
+ prerelease: false
64
+ version_requirements: !ruby/object:Gem::Requirement
65
+ requirements:
66
+ - - "~>"
67
+ - !ruby/object:Gem::Version
68
+ version: '2.5'
41
69
  - !ruby/object:Gem::Dependency
42
70
  name: railties
43
71
  requirement: !ruby/object:Gem::Requirement
@@ -84,16 +112,22 @@ dependencies:
84
112
  name: rouge
85
113
  requirement: !ruby/object:Gem::Requirement
86
114
  requirements:
87
- - - "~>"
115
+ - - ">="
88
116
  - !ruby/object:Gem::Version
89
117
  version: '3.26'
118
+ - - "<"
119
+ - !ruby/object:Gem::Version
120
+ version: '5.0'
90
121
  type: :runtime
91
122
  prerelease: false
92
123
  version_requirements: !ruby/object:Gem::Requirement
93
124
  requirements:
94
- - - "~>"
125
+ - - ">="
95
126
  - !ruby/object:Gem::Version
96
127
  version: '3.26'
128
+ - - "<"
129
+ - !ruby/object:Gem::Version
130
+ version: '5.0'
97
131
  - !ruby/object:Gem::Dependency
98
132
  name: listen
99
133
  requirement: !ruby/object:Gem::Requirement
@@ -165,6 +199,7 @@ files:
165
199
  - app/assets/lookbook/css/tooltip.css
166
200
  - app/assets/lookbook/js/app.js
167
201
  - app/assets/lookbook/js/components/clipboard.js
202
+ - app/assets/lookbook/js/components/params_input.js
168
203
  - app/assets/lookbook/js/components/tooltip.js
169
204
  - app/assets/lookbook/js/config.js
170
205
  - app/assets/lookbook/js/embed.js
@@ -200,6 +235,8 @@ files:
200
235
  - app/components/lookbook/copy_button/component.html.erb
201
236
  - app/components/lookbook/copy_button/component.js
202
237
  - app/components/lookbook/copy_button/component.rb
238
+ - app/components/lookbook/debug_menu/component.html.erb
239
+ - app/components/lookbook/debug_menu/component.rb
203
240
  - app/components/lookbook/dimensions_display/component.html.erb
204
241
  - app/components/lookbook/dimensions_display/component.js
205
242
  - app/components/lookbook/dimensions_display/component.rb
@@ -226,12 +263,13 @@ files:
226
263
  - app/components/lookbook/nav/item/component.rb
227
264
  - app/components/lookbook/page_tabs/component.html.erb
228
265
  - app/components/lookbook/page_tabs/component.rb
229
- - app/components/lookbook/params_editor/component.html.erb
230
- - app/components/lookbook/params_editor/component.js
231
- - app/components/lookbook/params_editor/component.rb
232
- - app/components/lookbook/params_editor/field/component.html.erb
233
- - app/components/lookbook/params_editor/field/component.js
234
- - app/components/lookbook/params_editor/field/component.rb
266
+ - app/components/lookbook/params/editor/component.html.erb
267
+ - app/components/lookbook/params/editor/component.js
268
+ - app/components/lookbook/params/editor/component.rb
269
+ - app/components/lookbook/params/field/component.css
270
+ - app/components/lookbook/params/field/component.html.erb
271
+ - app/components/lookbook/params/field/component.js
272
+ - app/components/lookbook/params/field/component.rb
235
273
  - app/components/lookbook/prose/component.css
236
274
  - app/components/lookbook/prose/component.html.erb
237
275
  - app/components/lookbook/prose/component.rb
@@ -279,6 +317,12 @@ files:
279
317
  - app/views/lookbook/index.html.erb
280
318
  - app/views/lookbook/pages/show.html.erb
281
319
  - app/views/lookbook/preview.html.erb
320
+ - app/views/lookbook/previews/inputs/_color.html.erb
321
+ - app/views/lookbook/previews/inputs/_range.html.erb
322
+ - app/views/lookbook/previews/inputs/_select.html.erb
323
+ - app/views/lookbook/previews/inputs/_text.html.erb
324
+ - app/views/lookbook/previews/inputs/_textarea.html.erb
325
+ - app/views/lookbook/previews/inputs/_toggle.html.erb
282
326
  - app/views/lookbook/previews/panels/_content.html.erb
283
327
  - app/views/lookbook/previews/panels/_notes.html.erb
284
328
  - app/views/lookbook/previews/panels/_output.html.erb
@@ -292,7 +336,6 @@ files:
292
336
  - lib/lookbook/collection.rb
293
337
  - lib/lookbook/component.rb
294
338
  - lib/lookbook/config.rb
295
- - lib/lookbook/data.rb
296
339
  - lib/lookbook/engine.rb
297
340
  - lib/lookbook/entity.rb
298
341
  - lib/lookbook/error.rb
@@ -314,7 +357,9 @@ files:
314
357
  - lib/lookbook/source_inspector.rb
315
358
  - lib/lookbook/store.rb
316
359
  - lib/lookbook/tag.rb
360
+ - lib/lookbook/tag_options.rb
317
361
  - lib/lookbook/tags.rb
362
+ - lib/lookbook/template_parser.rb
318
363
  - lib/lookbook/theme.rb
319
364
  - lib/lookbook/utils.rb
320
365
  - lib/lookbook/version.rb
@@ -1,3 +0,0 @@
1
- <%= render_component_tag do %>
2
- <%= safe_join(fields) %>
3
- <% end %>
@@ -1,11 +0,0 @@
1
- module Lookbook
2
- class ParamsEditor::Component < Lookbook::BaseComponent
3
- renders_many :fields, Lookbook::ParamsEditor::Field::Component
4
-
5
- protected
6
-
7
- def alpine_component
8
- "paramsEditorComponent"
9
- end
10
- end
11
- end
@@ -1,49 +0,0 @@
1
- <%= render_component_tag class: "px-4 py-3" do %>
2
- <div class="flex items-start max-w-[800px]" :class="isNarrowLayout && '!block'">
3
- <label
4
- for="param-<%= name %>"
5
- class="block font-bold cursor-pointer flex-none py-2 w-[140px] truncate pr-2">
6
- <%= label %>
7
- </label>
8
-
9
- <div class="flex-grow">
10
- <% if field_type == "text" %>
11
-
12
- <input
13
- class="form-input"
14
- value="<%= value %>"
15
- type="<%= input_type %>"
16
- x-bind="bindings.input || {}">
17
-
18
- <% elsif field_type == "textarea" %>
19
-
20
- <textarea
21
- class="form-input"
22
- rows="4"
23
- x-bind="bindings.input || {}"><%= value %></textarea>
24
-
25
- <% elsif field_type == "select" %>
26
-
27
- <select
28
- class="form-input"
29
- x-bind="bindings.input || {}"
30
- x-model="value"
31
- name="<%= name %>">
32
- <%= options_for_select(@options || [], value) %>
33
- </select>
34
-
35
- <% elsif field_type == "toggle" %>
36
- <button type="button"
37
- class="<%= value == true ? "bg-lookbook-input-toggle-active" : "bg-lookbook-input-toggle" %> relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-input-border-focus"
38
- role="switch"
39
- @click.stop="value = !value">
40
- <span
41
- aria-hidden="true"
42
- class="<%= value == true ? "translate-x-5" : "translate-x-0" %> pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow ring-0 transition ease-in-out duration-200"
43
- ></span>
44
- </button>
45
- <% end %>
46
- </div>
47
- </div>
48
- <% end %>
49
-
@@ -1,44 +0,0 @@
1
- module Lookbook
2
- class ParamsEditor::Field::Component < Lookbook::BaseComponent
3
- attr_reader :name
4
-
5
- def initialize(input:, name:, default: nil, value: nil, input_type: nil, type: nil, options: nil, **html_attrs)
6
- @input = input
7
- @name = name
8
- @value = value
9
- @default_value = default
10
- @input_type = input_type
11
- @type = type
12
- @options = options
13
- super(**html_attrs)
14
- end
15
-
16
- def label
17
- name.titleize
18
- end
19
-
20
- def value
21
- val = @value.presence || @default_value
22
- @type == "Boolean" ? val == "true" || val == true : val
23
- end
24
-
25
- def field_type
26
- @input.to_s
27
- end
28
-
29
- def input_type
30
- @input_type.nil? && field_type == "text" ? "text" : @input_type
31
- end
32
-
33
- protected
34
-
35
- def alpine_data
36
- escaped_value = json_escape(value.to_json)
37
- "{name: '#{name}', value: #{escaped_value}}"
38
- end
39
-
40
- def alpine_component
41
- "paramsEditorFieldComponent"
42
- end
43
- end
44
- end
data/lib/lookbook/data.rb DELETED
@@ -1,11 +0,0 @@
1
- module Lookbook
2
- module Data
3
- def data
4
- @data ||= Store.new({}, true)
5
- end
6
-
7
- def data=(props)
8
- @data = Store.new(props, true)
9
- end
10
- end
11
- end