WIP 2.0 migration #2

Author: jonasjabari

app/concepts/matestack/ui/bootstrap/apps/admin_template.rb

@@ -1,9 +1,35 @@
 class Matestack::Ui::Bootstrap::Apps::AdminTemplate < Matestack::Ui::App
 
   def response
+    html do
+      head do
+        title "Matestack UI Addon Dummy App"
+
+        unescape csrf_meta_tags
+        # unescape csp_meta_tag
+    
+        meta charset: "utf-8"
+        meta name: "viewport", content: "width=device-width, initial-scale=1"
+    
+        # unescape stylesheet_pack_tag("application", media: "all")
+        unescape javascript_pack_tag("application")
+        # unescape Matestack::Ui::Core::Context.controller.view_context.stylesheet_pack_tag(:application)
+        # unescape Matestack::Ui::Core::Context.controller.view_context.javascript_pack_tag(:application)
+      end
+    end
+    body do
+      matestack do
+        body_response do
+          yield
+        end
+      end
+    end
+  end
+
+  def body_response
     div class: "d-flex flex-row" do
       if should_show_sidebar?
-        bs_sidebar sidebar_navigation_items: sidebar_navigation_items, slots: { sidebar_top: sidebar_top_slot }
+        bs_sidebar sidebar_navigation_items: sidebar_navigation_items, slots: { sidebar_top: method(:sidebar_top_slot) }
       end
       div id: "content", class: "content-wrapper w-100 #{content_background_class}" do
         if should_show_navbar?
@@ -16,7 +42,7 @@ def response
           end
         end
         bs_container class: "my-5 px-4 pt-5" do
-          yield_page slots: { loading_state: loading_state_slot }
+          yield if block_given?
         end
       end
     end
@@ -40,9 +66,7 @@ def should_show_navbar?
   end
 
   def sidebar_top_slot
-    slot do
-      sidebar_top_partial if self.respond_to?(:sidebar_top_partial)
-    end
+    sidebar_top_partial if self.respond_to?(:sidebar_top_partial)
   end
 
   def toasts_partial

app/concepts/matestack/ui/bootstrap/base_component.rb

@@ -0,0 +1,5 @@
+class Matestack::Ui::Bootstrap::BaseComponent < Matestack::Ui::Component
+
+  include Matestack::Ui::Bootstrap::Registry
+
+end

app/concepts/matestack/ui/bootstrap/base_vue_js_component.rb

@@ -0,0 +1,5 @@
+class Matestack::Ui::Bootstrap::BaseVueJsComponent < Matestack::Ui::VueJsComponent
+
+  include Matestack::Ui::Bootstrap::Registry
+
+end

app/concepts/matestack/ui/bootstrap/components/accordion.rb

@@ -1,4 +1,4 @@
-class Matestack::Ui::Bootstrap::Components::Accordion < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::Accordion < Matestack::Ui::Bootstrap::BaseComponent
 
   # [ {header: { class, id, text, size, btn_variant, btn_class }, body: { class, text, multi } } ]
   optional :items # array with 2 Hashes: header and body
@@ -13,7 +13,7 @@ def prepare
   def response
     div accordion_attributes do
       accordion_content_partial if context.items.present?
-      yield
+      yield if block_given?
     end
   end
 
@@ -25,7 +25,7 @@ def accordion_content_partial
         heading class: "accordion-header #{item[:header][:class]}", id: (item[:header][:id] || "header-#{index}"), size: (item[:header][:size] || 2) do
           button class: "accordion-button", text:item[:header][:text],
             data: { "bs-toggle": "collapse", "bs-target": "#collapse-#{(item[:header][:id] || "header-#{index}") }" },
-            attributes: { "aria-expanded": "false", "aria-controls": "collapse-#{(item[:header][:id] || "header-#{index}")}", type: "button" }
+            "aria-expanded": "false", "aria-controls": "collapse-#{(item[:header][:id] || "header-#{index}")}", type: "button"
         end
         bs_collapse class: "accordion-collapse #{ 'show' if context.open || item[:open] }", id: "collapse-#{(item[:header][:id] || "header-#{index}")}", labelledby: (item[:header][:id] || "header-#{index}"),
           parent: @accordion_id, multi: (item[:body][:multi] || false) do
@@ -41,7 +41,7 @@ def accordion_attributes
     options.merge(
       id: @accordion_id,
       class: accordion_classes
-      ).merge(context.attributes)
+      ).merge(context.attributes || {})
   end
 
   def accordion_classes

app/concepts/matestack/ui/bootstrap/components/alert.rb

@@ -1,4 +1,4 @@
-class Matestack::Ui::Bootstrap::Components::Alert < Matestack::Ui::VueJsComponent
+class Matestack::Ui::Bootstrap::Components::Alert < Matestack::Ui::Bootstrap::BaseVueJsComponent
   vue_name "matestack-ui-bootstrap-alert"
 
   optional :title, :text, :variant, :dismissible, :animate, :title_size, :class
@@ -8,7 +8,7 @@ def response
     div alert_attributes do
       heading context.title, size: (title_size || 4), class: 'alert-heading' if context.title
       plain context.text if context.text
-      yield
+      yield if block_given?
       bs_close dismiss: "alert" if context.dismissible
     end
   end
@@ -26,8 +26,8 @@ def alert_classes
 
   def alert_attributes
     {}.tap do |attrs|
-      attrs.class = alert_classes,
-      attrs.role = :alert
+      attrs[:class] = alert_classes,
+      attrs[:role] = :alert
     end
   end
 

app/concepts/matestack/ui/bootstrap/components/avatar.rb

@@ -1,4 +1,4 @@
-class Matestack::Ui::Bootstrap::Components::Avatar < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::Avatar < Matestack::Ui::Bootstrap::BaseComponent
 
   optional :text, :bg_variant, :text_variant, :img_path, :size, :class
 

app/concepts/matestack/ui/bootstrap/components/badge.rb

@@ -1,14 +1,14 @@
-class Matestack::Ui::Bootstrap::Components::Badge < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::Badge < Matestack::Ui::Bootstrap::BaseComponent
 
   optional :class
   optional :text, :variant, :rounded, :visually_hidden
 
   def response
     span badge_attributes do
       plain context.text if context.text
-      yield
+      yield if block_given?
     end
-    span class: "visually-hidden", text: context.visually_hidden if context.visually_hidden.present?
+    span context.visually_hidden, class: "visually-hidden" if context.visually_hidden.present?
   end
 
   protected

app/concepts/matestack/ui/bootstrap/components/breadcrumb.rb

@@ -1,4 +1,4 @@
-class Matestack::Ui::Bootstrap::Components::Breadcrumb < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::Breadcrumb < Matestack::Ui::Bootstrap::BaseComponent
 
   optional :items # list of items  with path and text
   optional :class # adding custom class to breadcrumb list
@@ -19,7 +19,7 @@ def response
             end
           end
         end
-        yield
+        yield if block_given?
       end
     end
   end
@@ -29,7 +29,7 @@ def response
   def link_attrs(last = false)
     {}.tap do |hash|
       hash[:class] = "breadcrumb-item #{'active' if last}"
-      hash["aria-current"] = "page" if last
+      hash[:"aria-current"] = "page" if last
     end
   end
 

app/concepts/matestack/ui/bootstrap/components/button.rb

@@ -1,4 +1,4 @@
-class Matestack::Ui::Bootstrap::Components::Button < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::Button < Matestack::Ui::Bootstrap::BaseComponent
 
   optional :text, :type, :variant, :size, :outline
   optional :attributes, :class
@@ -37,16 +37,17 @@ def button_response
 
   def inner_response
     plain text if text
-    yield
+    yield if block_given?
   end
 
   protected
 
   def button_attributes
-    options.merge(
-      type: context.type || 'button',
-      class: button_classes, 
-    ).merge(context.attributes)
+    options.tap do |opts|
+      opts[:type] = context.type || 'button'
+      opts[:class] = button_classes
+      opts.merge(context.attributes || {})
+    end
   end
 
   def button_classes

app/concepts/matestack/ui/bootstrap/components/button_group.rb

@@ -1,12 +1,12 @@
-class Matestack::Ui::Bootstrap::Components::ButtonGroup < Matestack::Ui::Component
+class Matestack::Ui::Bootstrap::Components::ButtonGroup < Matestack::Ui::Bootstrap::BaseComponent
 
   optional :class
   optional :label
   optional :toolbar, :size, :vertical
 
   def response 
     div buttongroup_attributes do
-      yield
+      yield if block_given?
     end
   end
 
@@ -16,7 +16,7 @@ def buttongroup_attributes
     attributes = {}.tap do |hash|
       hash[:class] = buttongroup_classes
       hash[:role] = "#{context.toolbar ? :toolbar : :group}"
-      hash["aria-label"] = 'aria-label': context.label  
+      hash[:"aria-label"] = 'aria-label': context.label  
     end
     options.merge(
       attributes