matestack-ui-core 0.6.0 → 0.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6e54bd9269c669fa0d87f2052258961731162454a99417077e2102e5d391aee2
-  data.tar.gz: dbfb0a72d64c215d714c0340667e5f61c19fc0908875b5e1150be97c0c364f61
+  metadata.gz: 99d5baa395a0bbd08fb3dd6ba51de334b3408399aa7bde23057fc1e2c6fd7f8a
+  data.tar.gz: 3cc9af9f8129174ae0628119476dc6c4760ffe49d6edca24478afacb74494818
 SHA512:
-  metadata.gz: b15dcdaa3f71f73c99adf5971ded4c558968c8e93f555e7b8593bf40a074ff7e72fbbff295ac939556aff71c29a1f439588445e01e74fc8af3406726139fb674
-  data.tar.gz: 767db8f8b1757b356178db83bba45da3427ba2195425670be4a0cc4912382ed2df6d9a19464d7d2d8dcfb805a000c2dca9962761de3966f525580839b06de77f
+  metadata.gz: b998a602726e454b65525852bfe72e7c604c18ac4f9f789afbd0c6321c0cc752ad9837cc4b90da71789080bfc1f672d768d3b1240029e0f4c740e8b72edd7dd8
+  data.tar.gz: acf096659352f4eca3c0f7861e291e3cbe022b8a0cb17c5391163057a60941cceef4cf604c9b3dfc26b8553f8475d466959880ed60116ff28a842985728712f0

data/README.md

@@ -1,8 +1,10 @@
 [![CircleCI](https://circleci.com/gh/basemate/matestack-ui-core/tree/master.svg?style=shield)](https://circleci.com/gh/basemate/matestack-ui-core/tree/master)
+[![Gitter](https://badges.gitter.im/basemate/community.svg)](https://gitter.im/basemate/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
+[![Gem Version](https://badge.fury.io/rb/matestack-ui-core.svg)](https://badge.fury.io/rb/matestack-ui-core)
 
 ![matestack logo](./logo.png)
 
-# Matestack: Escape the frontend hustle
+# matestack: Escape the frontend hustle
 
 ## Create maintainable, dynamic and beautiful UIs easily
 
@@ -17,11 +19,15 @@ matestack can progressively replace the classic Rails-View-Layer. You are able t
 it alongside your classic views and incrementally turn your Rails-App into a
 dynamic Web-App.
 
+### Installation:
+
+Click here to see how you can add Matestack UI to your existing Rails application: [Installation Guide](./docs/install)
+
 ### Features:
 
 #### Define your UI in a Ruby Class
 ```ruby
-class Pages::MyPage < Page::Cell::Page
+class Pages::MyPage < Matestack::Ui::Page
 
   def prepare
     @technologies = ["Rails", "Vue.js", "Trailblazer", "Rspec", "Capybara"]
@@ -42,7 +48,7 @@ end
 #### Create a Single Page Application without JavaScript
 
 ```ruby
-class Apps::MyApp < App::Cell::App
+class Apps::MyApp < Matestack::Ui::App
 
   def response
     components{
@@ -51,10 +57,10 @@ class Apps::MyApp < App::Cell::App
       end
       nav do
         transition path: :my_first_page_path do
-          button "Page 1"
+          button text: "Page 1"
         end
         transition path: :my_second_page_path do
-          button "Page 2"
+          button text: "Page 2"
         end
       end
       main do
@@ -70,7 +76,7 @@ end
 ```
 
 ```ruby
-class Pages::MyApp::MyFirstPage < Page::Cell::Page
+class Pages::MyApp::MyFirstPage < Matestack::Ui::Page
 
   def response
     components{
@@ -83,7 +89,7 @@ class Pages::MyApp::MyFirstPage < Page::Cell::Page
 end
 ```
 ```ruby
-class Pages::MyApp::MySecondPage < Page::Cell::Page
+class Pages::MyApp::MySecondPage < Matestack::Ui::Page
 
   def response
     components{
@@ -97,7 +103,7 @@ end
 ```
 #### Handle User Interaction dynamically without JavaScript
 ```ruby
-class Pages::MyPage < Page::Cell::Page
+class Pages::MyPage < Matestack::Ui::Page
 
   def response
     components {
@@ -127,7 +133,7 @@ end
 ```
 #### Handle User Input dynamically without JavaScript
 ```ruby
-class Pages::MyApp::MyFirstPage < Page::Cell::Page
+class Pages::MyApp::MyFirstPage < Matestack::Ui::Page
 
   def prepare
     @my_model = MyModel.new
@@ -167,7 +173,7 @@ end
 ```
 #### Websocket Integration without JavaScript
 ```ruby
-class Pages::MyPage < Page::Cell::Page
+class Pages::MyPage < Matestack::Ui::Page
 
   def prepare
     @comments = Comment.last(5)
@@ -208,6 +214,7 @@ Changelog can be found [here](./CHANGELOG.md)
 ### Roadmap
 
 Scheduled for 0.7.0:
+- Better naming conventions
 - Webpacker/Yarn Integration
 - Advanced Websockets Integration
 - 1:n Relations in Form components
@@ -216,10 +223,9 @@ Scheduled for 0.7.0:
 - Rails View Integration
 - Dockerized Core Development
 
-
 ### Community
 
-TODO: Gitter
+As a low-barrier feedback channel for our early users, we have set up a Gitter chat that can be found [here](https://gitter.im/basemate/community). You are very welcome to ask questions and send us feedback there!
 
 ### Contribution
 

data/app/concepts/{absolute/cell → matestack/ui/core/absolute}/absolute.rb

@@ -1,5 +1,5 @@
-module Absolute::Cell
-  class Absolute < Component::Cell::Static
+module Matestack::Ui::Core::Absolute
+  class Absolute < Matestack::Ui::Core::Component::Static
 
     def setup
       style = "position: absolute;"

data/app/concepts/matestack/ui/core/action/action.haml

@@ -0,0 +1,3 @@
+%a{@tag_attributes, "@click.prevent": "perform", "href": action_path}
+  - if block_given?
+    = yield

data/app/concepts/{action/js → matestack/ui/core/action}/action.js

@@ -2,9 +2,9 @@ import Vue from 'vue/dist/vue.esm'
 import Vuex from 'vuex'
 import axios from 'axios'
 
-import matestackEventHub from 'core/js/event-hub'
+import matestackEventHub from 'js/event-hub'
 
-import componentMixin from 'component/js/component'
+import componentMixin from 'component/component'
 
 const componentDef = {
   mixins: [componentMixin],
@@ -44,6 +44,6 @@ const componentDef = {
   }
 }
 
-let component = Vue.component('action-cell', componentDef)
+let component = Vue.component('matestack-ui-core-action', componentDef)
 
 export default componentDef

data/app/concepts/{action/cell → matestack/ui/core/action}/action.rb

@@ -1,5 +1,5 @@
-module Action::Cell
-  class Action < Component::Cell::Dynamic
+module Matestack::Ui::Core::Action
+  class Action < Matestack::Ui::Core::Component::Dynamic
 
     def setup
       @component_config[:action_path] = action_path

data/app/concepts/{app/view → matestack/ui/core/app}/app.haml

@@ -1,4 +1,4 @@
-%component{"is": "app-cell", "inline-template": true}
+%component{"is": "matestack-ui-core-app", "inline-template": true}
   %div{"class": "matestack_app"}
     - @cells.each do |key, cell|
       = cell.call(:show)

data/app/concepts/{app/js → matestack/ui/core/app}/app.js

@@ -22,6 +22,6 @@ const componentDef = {
   }
 }
 
-let component = Vue.component('app-cell', componentDef)
+let component = Vue.component('matestack-ui-core-app', componentDef)
 
 export default componentDef

data/app/concepts/{app/cell → matestack/ui/core/app}/app.rb

@@ -1,4 +1,4 @@
-module App::Cell
+module Matestack::Ui::Core::App
   class App < Trailblazer::Cell
     include ActionView::Helpers::ActiveModelHelper
     include ActionView::Helpers::ActiveModelInstanceTag
@@ -25,12 +25,35 @@ module App::Cell
     include ActionView::Helpers::TranslationHelper
     include ActionView::Helpers::UrlHelper
     include ::Cell::Haml
-    include ::Matestack::Ui::Core::ApplicationHelper
-    include Shared::Utils::ToCell
+    include Matestack::Ui::Core::ApplicationHelper
+    include Matestack::Ui::Core::ToCell
     # include ::Rails.application.routes.url_helpers
 
     view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
 
+    extend ViewName::Flat
+
+    def self.prefixes
+      _prefixes = super
+      modified_prefixes = _prefixes.map do |prefix|
+        prefix_parts = prefix.split("/")
+
+        if prefix_parts.last.include?(self.name.split("::")[-1].downcase)
+          prefix_parts[0..-2].join("/")
+        else
+          prefix
+        end
+
+      end
+
+      return modified_prefixes
+    end
+
+    def self.views_dir
+      return ""
+    end
+
+
     def initialize(model=nil, options={})
       super
       @nodes = {}
@@ -61,7 +84,7 @@ module App::Cell
     end
 
     def components(&block)
-      @nodes = ::App::Utils::AppNode.build(self, &block)
+      @nodes = Matestack::Ui::Core::AppNode.build(self, &block)
 
       @nodes.each do |key, node|
         @cells[key] = to_cell(key, node["component_name"], node["config"], node["argument"], node["components"], nil)
@@ -69,7 +92,7 @@ module App::Cell
     end
 
     def partial(&block)
-      ::App::Utils::AppNode.build(self, &block)
+      Matestack::Ui::Core::AppNode.build(self, &block)
     end
 
   end

data/app/concepts/{app/js → matestack/ui/core/app}/store.js

@@ -2,7 +2,7 @@ import Vue from 'vue/dist/vue.esm'
 import Vuex from 'vuex'
 import axios from 'axios'
 
-import matestackEventHub from 'core/js/event-hub'
+import matestackEventHub from 'js/event-hub'
 
 Vue.use(Vuex)
 

data/app/concepts/{async/js → matestack/ui/core/async}/async.js

@@ -1,8 +1,8 @@
 import Vue from 'vue/dist/vue.esm'
 
-import matestackEventHub from 'core/js/event-hub'
+import matestackEventHub from 'js/event-hub'
 
-import componentMixin from 'component/js/component'
+import componentMixin from 'component/component'
 
 const componentDef = {
   mixins: [componentMixin],
@@ -52,6 +52,6 @@ const componentDef = {
   },
 }
 
-let component = Vue.component('async-cell', componentDef)
+let component = Vue.component('matestack-ui-core-async', componentDef)
 
 export default componentDef

data/app/concepts/matestack/ui/core/async/async.rb

@@ -0,0 +1,10 @@
+module Matestack::Ui::Core::Async
+    class Async < Matestack::Ui::Core::Component::Dynamic
+
+      def setup
+        @rerender = true
+      end
+
+
+    end
+  end

data/app/concepts/{br/view → matestack/ui/core/br}/br.haml

@@ -1,5 +1,5 @@
 - unless options[:times].nil?
   - options[:times].times do
-    %br
+    %br{@tag_attributes}
 - else
-  %br
+  %br{@tag_attributes}

data/app/concepts/matestack/ui/core/br/br.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Br
+  class Br < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/button/button.rb

@@ -0,0 +1,5 @@
+module Matestack::Ui::Core::Button
+  class Button < Matestack::Ui::Core::Component::Static
+
+  end
+end

data/app/concepts/matestack/ui/core/component/anonym-dynamic-component.js

@@ -0,0 +1,10 @@
+import Vue from 'vue/dist/vue.esm'
+import componentMixin from 'component/component'
+
+const componentDef = {
+  mixins: [componentMixin]
+}
+
+let component = Vue.component('matestack-ui-core-anonym-dynamic-component', componentDef)
+
+export default componentDef

data/app/concepts/{component/js → matestack/ui/core/component}/component.js

@@ -2,7 +2,7 @@ import Vue from 'vue/dist/vue.esm'
 import axios from 'axios'
 import VRuntimeTemplate from "v-runtime-template"
 
-import matestackEventHub from 'core/js/event-hub'
+import matestackEventHub from 'js/event-hub'
 
 const componentMixin = {
   props: ['componentConfig', 'params'],

data/app/concepts/{component/cell → matestack/ui/core/component}/dynamic.rb

@@ -1,5 +1,7 @@
-module Component::Cell
+module Matestack::Ui::Core::Component
   class Dynamic < Trailblazer::Cell
+
+
     include ActionView::Helpers::ActiveModelHelper
     include ActionView::Helpers::ActiveModelInstanceTag
     include ActionView::Helpers::AssetTagHelper
@@ -27,12 +29,34 @@ module Component::Cell
     # include ActionView::Helpers::UrlHelper
     # include ActionView::Helpers::TranslationHelper
     include ::Cell::Haml
-    include ::Matestack::Ui::Core::ApplicationHelper
-    include Shared::Utils::ToCell
+    include Matestack::Ui::Core::ApplicationHelper
+    include Matestack::Ui::Core::ToCell
 
     view_paths << "#{Matestack::Ui::Core::Engine.root}/app/concepts"
     view_paths << "#{::Rails.root}/app/matestack"
 
+    extend ViewName::Flat
+
+    def self.prefixes
+      _prefixes = super
+      modified_prefixes = _prefixes.map do |prefix|
+        prefix_parts = prefix.split("/")
+
+        if prefix_parts.last.include?(self.name.split("::")[-1].downcase)
+          prefix_parts[0..-2].join("/")
+        else
+          prefix
+        end
+
+      end
+
+      return modified_prefixes + _prefixes
+    end
+
+    def self.views_dir
+      return ""
+    end
+
     def initialize(model=nil, options={})
       super
       @component_config = options.except(:context, :children, :url_params, :included_config)
@@ -111,6 +135,7 @@ module Component::Cell
         response &block
           render :response
       else
+        # render(view: self.class.name.split("::")[-1].downcase.to_sym) do
         render do
           render_children
         end
@@ -132,7 +157,7 @@ module Component::Cell
     end
 
     def components(&block)
-      @nodes = ::Component::Utils::ComponentNode.build(self, nil, &block)
+      @nodes = Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
 
       @nodes.each do |key, node|
         @cells[key] = to_cell(key, node["component_name"], node["config"], node["argument"], node["components"], node["included_config"])
@@ -140,11 +165,11 @@ module Component::Cell
     end
 
     def partial(&block)
-      return ::Component::Utils::ComponentNode.build(self, nil, &block)
+      return Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
     end
 
     def slot(&block)
-      return ::Component::Utils::ComponentNode.build(self, nil, &block)
+      return Matestack::Ui::Core::ComponentNode.build(self, nil, &block)
     end
 
     def get_children
@@ -185,17 +210,30 @@ module Component::Cell
         name_parts = self.class.name.split("::")
         module_name = name_parts[0]
         if module_name == "Components"
-          name_parts.shift
+          name_parts[0] = "Custom"
         end
-        name = name_parts[0] + name_parts[1]
-        if name_parts[0] == name_parts[2]
-          name = name_parts[0] + name_parts[1]
-          @component_class =  name.underscore.gsub("_", "-")
+        if name_parts.count > 1
+          if name_parts.include?("Cell")
+            name = name_parts[0] + name_parts[1]
+            if name_parts[0] == name_parts[2]
+              name = name_parts[0] + name_parts[1]
+              @component_class =  name.underscore.gsub("_", "-")
+            else
+              name = name_parts[0] + name_parts[2] + name_parts[1]
+              @component_class = name.underscore.gsub("_", "-")
+            end
+          else
+            if name_parts[-2] == name_parts[-1]
+              @component_class = name_parts[0..-2].join("-").downcase
+            else
+              @component_class = name_parts.join("-").downcase
+            end
+          end
         else
-          name = name_parts[0] + name_parts[2] + name_parts[1]
+          name = name_parts[0]
           @component_class = name.underscore.gsub("_", "-")
         end
-        @component_name = @component_class.gsub("-cell", "")
+        @component_name = @component_class
       end
 
       def set_tag_attributes