Pre-launch design sync with Figma spec (#2154)

* Add lookbook + viewcomponent, organize design system file

* Build menu component

* Button updates

* More button fixes

* Replace all menus with new ViewComponent

* Checkpoint: fix tests, all buttons and menus converted

* Split into Link and Button components for clarity

* Button cleanup

* Simplify custom confirmation configuration in views

* Finalize button, link component API

* Add toggle field to custom form builder + Component

* Basic tabs component

* Custom tabs, convert all menu / tab instances in app

* Gem updates

* Centralized icon helper

* Update all icon usage to central helper

* Lint fixes

* Centralize all disclosure instances

* Dialog replacements

* Consolidation of all dialog styles

* Test fixes

* Fix app layout issues, move to component with slots

* Layout simplification

* Flakey test fix

* Fix dashboard mobile issues

* Finalize homepage

* Lint fixes

* Fix shadows and borders in dark mode

* Fix tests

* Remove stale class

* Fix filled icon logic

* Move transparent? to public interface

config/application.rb

@@ -33,5 +33,10 @@ module Maybe
     if Rails.application.credentials.active_record_encryption.present?
       config.active_record.encryption = Rails.application.credentials.active_record_encryption
     end
+
+    config.view_component.preview_controller = "LookbooksController"
+    config.lookbook.preview_display_options = {
+      theme: [ "light", "dark" ] # available in view as params[:theme]
+    }
   end
 end

config/importmap.rb

@@ -5,6 +5,7 @@ pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
 pin "@hotwired/stimulus", to: "stimulus.min.js"
 pin "@hotwired/stimulus-loading", to: "stimulus-loading.js"
 pin_all_from "app/javascript/controllers", under: "controllers"
+pin_all_from "app/components", under: "controllers", to: ""
 pin_all_from "app/javascript/services", under: "services", to: "services"
 pin "@github/hotkey", to: "@github--hotkey.js" # @3.1.0
 pin "@simonwep/pickr", to: "@simonwep--pickr.js" # @1.9.1

config/initializers/assets.rb

@@ -4,4 +4,4 @@
 Rails.application.config.assets.version = "1.0"
 
 # Add additional assets to the asset load path.
-# Rails.application.config.assets.paths << Emoji.images_path
+Rails.application.config.assets.paths << "app/components"

config/initializers/mini_profiler.rb

@@ -0,0 +1,3 @@
+Rails.application.configure do
+  Rack::MiniProfiler.config.skip_paths = [ "/design-system" ]
+end

config/routes.rb

@@ -8,6 +8,8 @@ Rails.application.routes.draw do
     delete :disable
   end
 
+  mount Lookbook::Engine, at: "/design-system"
+
   # Uses basic auth - see config/initializers/sidekiq.rb
   mount Sidekiq::Web => "/sidekiq"