lookbook 0.3.1 → 0.3.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e1f01b55ea75634f7e4cf2f7fe438ce6b56042daa5d7f178e50d0db7c267a644
-  data.tar.gz: 81fddb93ab9aed2d51a59ecd00deced19c97a395ced5de3223db0d229f3a57dd
+  metadata.gz: 7079abdbe93ab54ba45d95752d1506c90d7aa0734afff9fc4bd947984d2dede9
+  data.tar.gz: ff9f78726cb4b6686ced040eca344e8585ea8ec16931d670591692400e7307ff
 SHA512:
-  metadata.gz: 535340241df2352ba1c0fa5983f178cdb76d5fc39f0b4c9bcc8c34e4dc782177a4110f85a47ac6632064ac52b064f6936fe9cb764d5a5f2a8b527c9a80342bff
-  data.tar.gz: 1d580f19491db04693d6e31941c198c4b1416665836d90436e84ddf4dadad7e325612be88c959fd2fff1900c061e2e54e2b8cbf82cda5ce947addcdba7bd251d
+  metadata.gz: edcf8e461252b4d18101019c6636bb4a2b298691abac0d8154a4eb30a66a8cb836c3b60b9e63533c66753fc336005ef78e9e8cabac11330c3db0447ec22a9475
+  data.tar.gz: fd329c551311cf634c92544226fb5c5fe6104146945e1498cae010a18694fba46b01ce0fc3d86ae1a4b9ff51cb9a10030f4223e0fff601d7b081dc687f3b62d5

data/app/controllers/lookbook/app_controller.rb

@@ -95,7 +95,7 @@ module Lookbook
             html: preview_controller.render_example_to_string(@preview, example.name)
           }
         end
-        joined = render_to_string "./preview_group", locals: {examples: examples}, layout: nil
+        joined = render_to_string "lookbook/preview_group", locals: {examples: examples}, layout: nil
         preview_controller.render_in_layout_to_string(joined, @preview.lookbook_layout)
       else
         preview_controller.request.params[:path] = "#{@preview.preview_name}/#{@example.name}".chomp("/")

data/app/views/lookbook/app/index.html.erb

@@ -1,5 +1,5 @@
 <div class="flex flex-col h-full min-h-fill w-full">
-  <%= render "./shared/header" %>
+  <%= render "shared/header" %>
   <div class="flex flex-col items-center justify-center h-full min-h-fill">
     <div class="p-4 text-center">
       <svg class="feather w-10 h-10 text-gray-300 mx-auto">
@@ -8,4 +8,4 @@
       <h5 class="mt-4 text-gray-400 text-base">Select a preview to get started</h5>
     </div>
   </div>
-</div>
+</div>

data/app/views/lookbook/app/show.html.erb

@@ -1 +1 @@
-<%= render "./workbench" %>
+<%= render "shared/workbench" %>

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

@@ -21,14 +21,14 @@
   <div
     x-data="page"
     x-effect="updateTitle"
-    @refresh.document="fetchHTML().then(doc => $dispatch('document:updated', {doc}))" 
+    @refresh.document="fetchHTML().then(doc => $dispatch('document:updated', {doc}))"
     @popstate.window="fetchHTML().then(doc => { $dispatch('document:loaded', {doc}); sidebarOpenMobile = false})"
     @sidebar:toggle.window="sidebarOpenMobile = !sidebarOpenMobile"
     :style="`grid-template-columns: ${$store.nav.width}px 1px 1fr;`"
     class="md:grid w-screen h-screen"
   >
     <div class="h-full bg-gray-100 overflow-hidden" x-show="$screen('md') || sidebarOpenMobile" x-cloak>
-      <%= render "./sidebar" %>
+      <%= render "shared/sidebar" %>
     </div>
     <div x-data="split(splitProps)" class="h-full gutter border-r border-gray-300 relative" x-show="$screen('md')" x-cloak>
       <div class="w-[9px] h-full bg-transparent hover:bg-indigo-100 hover:bg-opacity-20 transition absolute top-0 bottom-0 transform -translate-x-1/2 cursor-[col-resize] z-10"></div>

data/app/views/lookbook/nav/_collection.html.erb

@@ -1,5 +1,5 @@
-<%= render "./nav/node", node: node do %>
+<%= render "nav/node", node: node do %>
   <% node.items.each do |item| %>
-    <%= render "./nav/#{item.type.to_s}", node: item %>
-  <% end %> 
-<% end %>
+    <%= render "nav/#{item.type.to_s}", node: item %>
+  <% end %>
+<% end %>

data/app/views/lookbook/nav/_preview.html.erb

@@ -1,11 +1,11 @@
 <% examples = node.get_examples %>
 <% if examples.many? %>
-  <%= render "./nav/node", node: node, path: show_path(examples.first.path) do %>
+  <%= render "nav/node", node: node, path: show_path(examples.first.path) do %>
     <% examples.each do |example| %>
-      <%= render "./nav/leaf", leaf: example, depth: example.hierarchy_depth + 1 %>
+      <%= render "nav/leaf", leaf: example, depth: example.hierarchy_depth + 1 %>
     <% end %>
   <% end %>
 <% else %>
   <% example = examples.first %>
-  <%= render "./nav/leaf", leaf: example, depth: example.hierarchy_depth, label: node.label, display: :node %>
-<% end %>
+  <%= render "nav/leaf", leaf: example, depth: example.hierarchy_depth, label: node.label, display: :node %>
+<% end %>

data/app/views/lookbook/shared/_header.html.erb

@@ -5,4 +5,4 @@
     </svg>
   </button>
   <%= yield %>
-</header>
+</header>

data/app/views/lookbook/{_sidebar.html.erb → shared/_sidebar.html.erb}

@@ -27,7 +27,7 @@
         <% if @nav.items.any? %>
           <ul x-ref="items">
             <% @nav.items.each do |item| %>
-              <%= render "./nav/#{item.type.to_s}", node: item %>
+              <%= render "nav/#{item.type.to_s}", node: item %>
             <% end %>
           </ul>
           <div class="p-4 text-center" x-show="hidden" x-cloak>
@@ -41,5 +41,5 @@
         <% end %>
       </nav>
     </div>
-  </div>   
-</div>
+  </div>
+</div>

data/app/views/lookbook/{_workbench.html.erb → shared/_workbench.html.erb}

@@ -1,12 +1,12 @@
 <div id="workbench" class="bg-gray-50 h-screen flex flex-col" x-data="workbench">
-  <%= render "./workbench/header" %>
+  <%= render "workbench/header" %>
   <div class="md:grid flex-grow" :style="`grid-template-rows: 1fr 1px ${$store.inspector.height}px`">
-    <%= render "./workbench/preview" %>
+    <%= render "workbench/preview" %>
     <div class="w-full gutter border-t border-gray-300 relative" x-data="split(splitProps)" x-show="$screen('md')">
       <div class="h-[11px] w-full bg-transparent hover:bg-indigo-100 hover:bg-opacity-20 transition absolute left-0 right-0 transform -translate-y-1/2 cursor-[row-resize]"></div>
     </div>
     <% if @inspector %>
-      <%= render "./workbench/inspector", **@inspector %>
+      <%= render "workbench/inspector", **@inspector %>
     <% end %>
-  </div>  
-</div>
+  </div>
+</div>

data/app/views/lookbook/workbench/_header.html.erb

@@ -1,4 +1,4 @@
-<%= render "./shared/header" do %>
+<%= render "shared/header" do %>
   <div class="flex items-center">
     <div class="flex items-center space-x-1">
       <strong class="whitespace-nowrap truncate"><%= @preview.label %></strong>
@@ -36,4 +36,4 @@
       </svg>
     </a>
   </div>
-<% end %>
+<% end %>

data/app/views/lookbook/workbench/_inspector.html.erb

@@ -21,12 +21,12 @@
     <% panes.each do |key, props| %>
       <div class="flex flex-col h-full relative" x-show="active('<%= key %>')" x-cloak>
         <% if props[:clipboard].present? %>
-          <%= render "./shared/clipboard" do %><%= h props[:clipboard].strip %><% end %>
+          <%= render "shared/clipboard" do %><%= h props[:clipboard].strip %><% end %>
         <% end %>
         <div class="flex flex-col h-full overflow-auto">
-          <%= render "./workbench/inspector/#{props[:template]}", key: key, **props %>
+          <%= render "workbench/inspector/#{props[:template]}", key: key, **props %>
         </div>
       </div>
     <% end %>
   </div>
-</div>
+</div>

data/lib/lookbook/version.rb

@@ -1,3 +1,3 @@
 module Lookbook
-  VERSION = "0.3.1"
+  VERSION = "0.3.2"
 end

data/public/lookbook-assets/app.css

@@ -1456,28 +1456,28 @@ pre[class*="language-"] {
   bottom: 0px;
 }
 
-.top-1\/2 {
-  top: 50%;
-}
-
-.right-2 {
-  right: 0.5rem;
+.top-0 {
+  top: 0px;
 }
 
-.left-0 {
-  left: 0px;
+.bottom-0 {
+  bottom: 0px;
 }
 
 .right-0 {
   right: 0px;
 }
 
-.top-0 {
-  top: 0px;
+.top-1\/2 {
+  top: 50%;
 }
 
-.bottom-0 {
-  bottom: 0px;
+.right-2 {
+  right: 0.5rem;
+}
+
+.left-0 {
+  left: 0px;
 }
 
 .left-4 {
@@ -1493,14 +1493,6 @@ pre[class*="language-"] {
   margin-right: auto;
 }
 
-.ml-4 {
-  margin-left: 1rem;
-}
-
-.mb-1 {
-  margin-bottom: 0.25rem;
-}
-
 .mt-4 {
   margin-top: 1rem;
 }
@@ -1529,6 +1521,14 @@ pre[class*="language-"] {
   margin-right: 0.75rem;
 }
 
+.ml-4 {
+  margin-left: 1rem;
+}
+
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
 .ml-auto {
   margin-left: auto;
 }
@@ -1553,6 +1553,10 @@ pre[class*="language-"] {
   display: none;
 }
 
+.h-screen {
+  height: 100vh;
+}
+
 .h-full {
   height: 100%;
 }
@@ -1561,40 +1565,28 @@ pre[class*="language-"] {
   height: 2.5rem;
 }
 
-.h-5 {
-  height: 1.25rem;
+.h-3\.5 {
+  height: 0.875rem;
 }
 
 .h-3 {
   height: 0.75rem;
 }
 
-.h-screen {
-  height: 100vh;
-}
-
-.h-\[11px\] {
-  height: 11px;
-}
-
-.h-3\.5 {
-  height: 0.875rem;
-}
-
 .h-4 {
   height: 1rem;
 }
 
-.w-5 {
-  width: 1.25rem;
+.h-5 {
+  height: 1.25rem;
 }
 
-.w-full {
-  width: 100%;
+.h-\[11px\] {
+  height: 11px;
 }
 
-.w-3 {
-  width: 0.75rem;
+.w-full {
+  width: 100%;
 }
 
 .w-10 {
@@ -1613,10 +1605,18 @@ pre[class*="language-"] {
   width: 0.875rem;
 }
 
+.w-3 {
+  width: 0.75rem;
+}
+
 .w-4 {
   width: 1rem;
 }
 
+.w-5 {
+  width: 1.25rem;
+}
+
 .max-w-xs {
   max-width: 20rem;
 }
@@ -1633,22 +1633,18 @@ pre[class*="language-"] {
   flex-grow: 1;
 }
 
-.-translate-y-1\/2 {
-  --tw-translate-y: -50%;
-  transform: var(--tw-transform);
-}
-
 .-translate-x-1\/2 {
   --tw-translate-x: -50%;
   transform: var(--tw-transform);
 }
 
-.transform {
+.-translate-y-1\/2 {
+  --tw-translate-y: -50%;
   transform: var(--tw-transform);
 }
 
-.cursor-\[row-resize\] {
-  cursor: row-resize;
+.transform {
+  transform: var(--tw-transform);
 }
 
 .cursor-\[col-resize\] {
@@ -1659,6 +1655,10 @@ pre[class*="language-"] {
   cursor: pointer;
 }
 
+.cursor-\[row-resize\] {
+  cursor: row-resize;
+}
+
 .cursor-auto {
   cursor: auto;
 }
@@ -1754,22 +1754,22 @@ pre[class*="language-"] {
   border-width: 1px;
 }
 
-.border-b {
-  border-bottom-width: 1px;
-}
-
-.border-t {
-  border-top-width: 1px;
-}
-
 .border-r {
   border-right-width: 1px;
 }
 
+.border-b {
+  border-bottom-width: 1px;
+}
+
 .border-l {
   border-left-width: 1px;
 }
 
+.border-t {
+  border-top-width: 1px;
+}
+
 .border-b-2 {
   border-bottom-width: 2px;
 }
@@ -1802,25 +1802,25 @@ pre[class*="language-"] {
   background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
 }
 
-.bg-transparent {
-  background-color: transparent;
-}
-
-.bg-gray-50 {
-  --tw-bg-opacity: 1;
-  background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
-}
-
 .bg-gray-100 {
   --tw-bg-opacity: 1;
   background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
 }
 
+.bg-transparent {
+  background-color: transparent;
+}
+
 .\!bg-indigo-100 {
   --tw-bg-opacity: 1 !important;
   background-color: rgba(224, 231, 255, var(--tw-bg-opacity)) !important;
 }
 
+.bg-gray-50 {
+  --tw-bg-opacity: 1;
+  background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
+}
+
 .p-4 {
   padding: 1rem;
 }
@@ -1833,11 +1833,6 @@ pre[class*="language-"] {
   padding: 0.25rem;
 }
 
-.px-4 {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-
 .py-\[5px\] {
   padding-top: 5px;
   padding-bottom: 5px;
@@ -1853,6 +1848,11 @@ pre[class*="language-"] {
   padding-bottom: 0.5rem;
 }
 
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
 .px-1 {
   padding-left: 0.25rem;
   padding-right: 0.25rem;
@@ -1896,6 +1896,11 @@ pre[class*="language-"] {
   font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
 }
 
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+
 .text-sm {
   font-size: 0.875rem;
   line-height: 1.25rem;
@@ -1906,11 +1911,6 @@ pre[class*="language-"] {
   line-height: 1rem;
 }
 
-.text-base {
-  font-size: 1rem;
-  line-height: 1.5rem;
-}
-
 .text-\[11px\] {
   font-size: 11px;
 }
@@ -1919,19 +1919,14 @@ pre[class*="language-"] {
   font-weight: 700;
 }
 
-.text-gray-400 {
-  --tw-text-opacity: 1;
-  color: rgba(156, 163, 175, var(--tw-text-opacity));
-}
-
-.text-gray-500 {
+.text-gray-300 {
   --tw-text-opacity: 1;
-  color: rgba(107, 114, 128, var(--tw-text-opacity));
+  color: rgba(209, 213, 219, var(--tw-text-opacity));
 }
 
-.text-gray-300 {
+.text-gray-400 {
   --tw-text-opacity: 1;
-  color: rgba(209, 213, 219, var(--tw-text-opacity));
+  color: rgba(156, 163, 175, var(--tw-text-opacity));
 }
 
 .text-red-300 {
@@ -1944,6 +1939,11 @@ pre[class*="language-"] {
   color: rgba(55, 65, 81, var(--tw-text-opacity));
 }
 
+.text-gray-500 {
+  --tw-text-opacity: 1;
+  color: rgba(107, 114, 128, var(--tw-text-opacity));
+}
+
 .text-gray-800 {
   --tw-text-opacity: 1;
   color: rgba(31, 41, 55, var(--tw-text-opacity));

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: lookbook
 version: !ruby/object:Gem::Version
-  version: 0.3.1
+  version: 0.3.2
 platform: ruby
 authors:
 - Mark Perkins
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-10-02 00:00:00.000000000 Z
+date: 2021-10-05 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -207,8 +207,6 @@ files:
 - app/channels/lookbook/reload_channel.rb
 - app/controllers/lookbook/app_controller.rb
 - app/helpers/lookbook/application_helper.rb
-- app/views/lookbook/_sidebar.html.erb
-- app/views/lookbook/_workbench.html.erb
 - app/views/lookbook/app/error.html.erb
 - app/views/lookbook/app/index.html.erb
 - app/views/lookbook/app/not_found.html.erb
@@ -221,6 +219,8 @@ files:
 - app/views/lookbook/preview_group.html.erb
 - app/views/lookbook/shared/_clipboard.html.erb
 - app/views/lookbook/shared/_header.html.erb
+- app/views/lookbook/shared/_sidebar.html.erb
+- app/views/lookbook/shared/_workbench.html.erb
 - app/views/lookbook/workbench/_header.html.erb
 - app/views/lookbook/workbench/_inspector.html.erb
 - app/views/lookbook/workbench/_preview.html.erb