matestack-ui-bootstrap 1.4.0 → 1.5.0

data/app/concepts/matestack/ui/bootstrap/registry.rb

@@ -10,7 +10,6 @@ module Matestack::Ui::Bootstrap::Registry
     bs_btn_group: Matestack::Ui::Bootstrap::Components::ButtonGroup,
     bs_card: Matestack::Ui::Bootstrap::Components::Card,
     bs_carousel: Matestack::Ui::Bootstrap::Components::Carousel,
-    bs_chart: Matestack::Ui::Bootstrap::Components::Chart,
     bs_close: Matestack::Ui::Bootstrap::Components::Close,
     bs_collapse: Matestack::Ui::Bootstrap::Components::Collapse,
     bs_dropdown: Matestack::Ui::Bootstrap::Components::Dropdown,
@@ -37,13 +36,12 @@ module Matestack::Ui::Bootstrap::Registry
     bs_form_checkbox: Matestack::Ui::Bootstrap::Form::Checkbox,
     bs_form_radio: Matestack::Ui::Bootstrap::Form::Radio,
     bs_form_switch: Matestack::Ui::Bootstrap::Form::Switch,
-    bs_form_submit: Matestack::Ui::Bootstrap::Form::Submit,
-    bs_form_date: Matestack::Ui::Bootstrap::Form::Date,
+    bs_form_submit: Matestack::Ui::Bootstrap::Form::Submit
   }
 
   CONTENT = {
     bs_figure: Matestack::Ui::Bootstrap::Content::Figure,
-    bs_smart_collection: Matestack::Ui::Bootstrap::Content::Collection::Collection,
+    bs_smart_collection: Matestack::Ui::Bootstrap::Content::SmartCollection::Collection,
   }
 
   LAYOUTS = {

data/app/helpers/matestack/ui/bootstrap/application_helper.rb

@@ -2,12 +2,16 @@
 
 require "webpacker/helper"
 
-module MyEngine
-  module ApplicationHelper
-    include ::Webpacker::Helper
+module Matestack
+  module Ui
+    module Bootstrap
+      module ApplicationHelper
+        include ::Webpacker::Helper
 
-    def current_webpacker_instance
-      MyEngine.webpacker
+        def current_webpacker_instance
+          Matestack::Ui::Bootstrap::Engine.webpacker
+        end
+      end
     end
   end
 end

data/app/javascript/matestack-ui-bootstrap/index.js

@@ -7,17 +7,15 @@ import "./stylesheets/matestack-ui-bootstrap.scss";
 
 import '../../concepts/matestack/ui/bootstrap/components/alert'
 import '../../concepts/matestack/ui/bootstrap/components/carousel'
-import '../../concepts/matestack/ui/bootstrap/components/chart'
 import '../../concepts/matestack/ui/bootstrap/components/collapse'
 import '../../concepts/matestack/ui/bootstrap/components/dropdown'
 import '../../concepts/matestack/ui/bootstrap/components/modal'
 import '../../concepts/matestack/ui/bootstrap/components/toast'
 import '../../concepts/matestack/ui/bootstrap/components/popover'
 import '../../concepts/matestack/ui/bootstrap/components/tooltip'
-import '../../concepts/matestack/ui/bootstrap/form/date'
 import '../../concepts/matestack/ui/bootstrap/layout/sidebar'
 import '../../concepts/matestack/ui/bootstrap/layout/sidebar.scss'
-import '../../concepts/matestack/ui/bootstrap/content/collection/collection.scss'
+import '../../concepts/matestack/ui/bootstrap/content/smart_collection/collection.scss'
 
 const MatestackUiBootstrap = {}
 

data/app/matestack/bootstrap/form/submit.rb

@@ -0,0 +1,20 @@
+class Bootstrap::Form::Submit < Matestack::Ui::Component
+
+  optional :button_variant
+  optional :spinner_variant
+  optional :text
+  optional :loading_text
+
+  def response
+    form_submit do
+      btn size: options[:size], class: "#{options[:class]}", variant: button_variant || :primary, attributes: { "v-if": "!loading" } do
+        plain text || "Submit"
+      end
+      btn size: options[:size], class: "#{options[:class_loading]}", variant: button_variant || :primary, attributes: { disabled: true, "v-if": "loading" } do
+        spinner variant: spinner_variant || :light, size: :sm
+        plain loading_text || "Loading..."
+      end
+    end
+  end
+
+end

data/lib/matestack/ui/bootstrap/engine.rb

@@ -7,7 +7,7 @@ module Matestack
         # https://github.com/rails/webpacker/blob/5-x-stable/docs/engines.md
         initializer "webpacker.proxy" do |app|
           insert_middleware = begin
-                              MyEngine.webpacker.config.dev_server.present?
+                              Matestack::Ui::Bootstrap::Engine.webpacker.config.dev_server.present?
                             rescue
                               nil
                             end
@@ -16,7 +16,7 @@ module Matestack
           app.middleware.insert_before(
             0, Webpacker::DevServerProxy, # "Webpacker::DevServerProxy" if Rails version < 5
             ssl_verify_none: true,
-            webpacker: MyEngine.webpacker
+            webpacker: Matestack::Ui::Bootstrap::Engine.webpacker
           )
         end
 

data/lib/matestack/ui/bootstrap/version.rb

@@ -1,7 +1,7 @@
 module Matestack
   module Ui
     module Bootstrap
-      VERSION = '1.4.0'
+      VERSION = '1.5.0'
     end
   end
 end

data/lib/tasks/matestack/ui/bootstrap_tasks.rake

@@ -39,28 +39,28 @@ namespace :matestack_ui_bootstrap do
   end
 end
 
-def yarn_install_available?
-  rails_major = Rails::VERSION::MAJOR
-  rails_minor = Rails::VERSION::MINOR
-
-  rails_major > 5 || (rails_major == 5 && rails_minor >= 1)
-end
-
-def enhance_assets_precompile
-  # yarn:install was added in Rails 5.1
-  deps = yarn_install_available? ? [] : ["my_engine:webpacker:yarn_install"]
-  Rake::Task["assets:precompile"].enhance(deps) do
-    Rake::Task["my_engine:webpacker:compile"].invoke
-  end
-end
-
-# Compile packs after we've compiled all other assets during precompilation
-skip_webpacker_precompile = %w(no false n f).include?(ENV["WEBPACKER_PRECOMPILE"])
-
-unless skip_webpacker_precompile
-  if Rake::Task.task_defined?("assets:precompile")
-    enhance_assets_precompile
-  else
-    Rake::Task.define_task("assets:precompile" => "my_engine:webpacker:compile")
-  end
-end
+# def yarn_install_available?
+#   rails_major = Rails::VERSION::MAJOR
+#   rails_minor = Rails::VERSION::MINOR
+#
+#   rails_major > 5 || (rails_major == 5 && rails_minor >= 1)
+# end
+#
+# def enhance_assets_precompile
+#   # yarn:install was added in Rails 5.1
+#   deps = yarn_install_available? ? [] : ["app:matestack_ui_bootstrap:webpacker:yarn_install"]
+#   Rake::Task["assets:precompile"].enhance(deps) do
+#     Rake::Task["app:matestack_ui_bootstrap:webpacker:compile"].invoke
+#   end
+# end
+#
+# # Compile packs after we've compiled all other assets during precompilation
+# skip_webpacker_precompile = %w(no false n f).include?(ENV["WEBPACKER_PRECOMPILE"])
+#
+# unless skip_webpacker_precompile
+#   if Rake::Task.task_defined?("assets:precompile")
+#     enhance_assets_precompile
+#   else
+#     Rake::Task.define_task("assets:precompile" => "app:matestack_ui_bootstrap:webpacker:compile")
+#   end
+# end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: matestack-ui-bootstrap
 version: !ruby/object:Gem::Version
-  version: 1.4.0
+  version: 1.5.0
 platform: ruby
 authors:
 - Jonas Jabari
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-02-11 00:00:00.000000000 Z
+date: 2021-03-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: matestack-ui-core
@@ -49,8 +49,6 @@ files:
 - app/concepts/matestack/ui/bootstrap/components/card.rb
 - app/concepts/matestack/ui/bootstrap/components/carousel.js
 - app/concepts/matestack/ui/bootstrap/components/carousel.rb
-- app/concepts/matestack/ui/bootstrap/components/chart.js
-- app/concepts/matestack/ui/bootstrap/components/chart.rb
 - app/concepts/matestack/ui/bootstrap/components/close.rb
 - app/concepts/matestack/ui/bootstrap/components/collapse.js
 - app/concepts/matestack/ui/bootstrap/components/collapse.rb
@@ -75,18 +73,15 @@ files:
 - app/concepts/matestack/ui/bootstrap/components/toast.rb
 - app/concepts/matestack/ui/bootstrap/components/tooltip.js
 - app/concepts/matestack/ui/bootstrap/components/tooltip.rb
-- app/concepts/matestack/ui/bootstrap/content/collection/collection.rb
-- app/concepts/matestack/ui/bootstrap/content/collection/collection.scss
-- app/concepts/matestack/ui/bootstrap/content/collection/content.rb
-- app/concepts/matestack/ui/bootstrap/content/collection/filter.rb
-- app/concepts/matestack/ui/bootstrap/content/collection/paginate.rb
 - app/concepts/matestack/ui/bootstrap/content/figure.rb
+- app/concepts/matestack/ui/bootstrap/content/smart_collection/collection.rb
+- app/concepts/matestack/ui/bootstrap/content/smart_collection/collection.scss
+- app/concepts/matestack/ui/bootstrap/content/smart_collection/content.rb
+- app/concepts/matestack/ui/bootstrap/content/smart_collection/filter.rb
+- app/concepts/matestack/ui/bootstrap/content/smart_collection/paginate.rb
 - app/concepts/matestack/ui/bootstrap/form/checkbox.rb
-- app/concepts/matestack/ui/bootstrap/form/date.js
-- app/concepts/matestack/ui/bootstrap/form/date.rb
 - app/concepts/matestack/ui/bootstrap/form/input.rb
 - app/concepts/matestack/ui/bootstrap/form/radio.rb
-- app/concepts/matestack/ui/bootstrap/form/select.haml
 - app/concepts/matestack/ui/bootstrap/form/select.rb
 - app/concepts/matestack/ui/bootstrap/form/submit.rb
 - app/concepts/matestack/ui/bootstrap/form/switch.rb
@@ -102,6 +97,7 @@ files:
 - app/javascript/matestack-ui-bootstrap/index.js
 - app/javascript/matestack-ui-bootstrap/stylesheets/matestack-ui-bootstrap.scss
 - app/javascript/packs/matestack-ui-bootstrap.js
+- app/matestack/bootstrap/form/submit.rb
 - config/routes.rb
 - config/webpack/development.js
 - config/webpack/environment.js

data/app/concepts/matestack/ui/bootstrap/components/chart.js

@@ -1,232 +0,0 @@
-import Chart from 'chart.js';
-
-MatestackUiCore.Vue.component('matestack-ui-bootstrap-chart', {
-  mixins: [MatestackUiCore.componentMixin],
-
-  data() {
-    return {
-      chartJsInstance: undefined,
-      defaultColor: undefined,
-      fontColor: undefined,
-      fontFamily: undefined
-    };
-  },
-
-  methods: {
-    getThemeColor: function(key){
-      const style = getComputedStyle(document.body);
-      return style.getPropertyValue('--bs-'+key);
-    },
-    getThemeColorArray: function(keysArray){
-      let result = []
-      const style = getComputedStyle(document.body);
-      keysArray.forEach(function(key){
-        result.push(style.getPropertyValue('--bs-'+key))
-      })
-      return result;
-    },
-    drawBarChart: function(chartElement){
-      const self = this;
-      this.componentConfig["datasets"].forEach(function(item){
-        if (item["backgroundColor"] === undefined){
-          item["backgroundColor"] = self.getThemeColor("primary")
-        }else{
-          if(Array.isArray(item["backgroundColor"])){
-            item["backgroundColor"] = self.getThemeColorArray(item["backgroundColor"])
-          }else{
-            item["backgroundColor"] = self.getThemeColor(item["backgroundColor"])
-          }
-        }
-        item["hoverBackgroundColor"] = "rgba(0, 0, 0, 0.1)"
-        if (item["barThickness"] === undefined){
-          item["barThickness"] = 10;
-        }
-      })
-      this.chartJsInstance = new Chart(chartElement, {
-        type: 'bar',
-        data: {
-            labels: this.componentConfig["labels"],
-            datasets: this.componentConfig["datasets"]
-        },
-        options: {
-            legend: {
-              display: this.componentConfig["display_legend"],
-            },
-            scales: {
-                yAxes: [{
-                    display: this.componentConfig["display_y_axes"],
-                    gridLines: {
-                      display: false,
-                    },
-                    ticks: {
-                        beginAtZero: true
-                    }
-                }],
-                xAxes: [{
-                    display: this.componentConfig["display_x_axes"],
-                    gridLines: {
-                      display: false,
-                    },
-                    ticks: {
-                        beginAtZero: true
-                    }
-                }]
-            }
-        }
-      });
-    },
-    drawLineChart: function(chartElement){
-      const self = this;
-      this.componentConfig["datasets"].forEach(function(item){
-        if (item["borderColor"] === undefined){
-          item["borderColor"] = self.getThemeColor("primary")
-        }else{
-          item["borderColor"] = self.getThemeColor(item["borderColor"])
-        }
-        item["hoverBackgroundColor"] = "rgba(0, 0, 0, 0.1)"
-        if (item["fill"] === undefined){
-          item["fill"] = false;
-        }
-      })
-      this.chartJsInstance = new Chart(chartElement, {
-        type: 'line',
-        data: {
-            labels: this.componentConfig["labels"],
-            datasets: this.componentConfig["datasets"]
-        },
-        options: {
-            legend: {
-              display: this.componentConfig["display_legend"],
-            },
-            scales: {
-                yAxes: [{
-                    display: this.componentConfig["display_y_axes"],
-                    gridLines: {
-                      display: false,
-                    },
-                    ticks: {
-                        beginAtZero: true
-                    }
-                }],
-                xAxes: [{
-                    display: this.componentConfig["display_x_axes"],
-                    gridLines: {
-                      display: false,
-                    },
-                    ticks: {
-                        beginAtZero: true
-                    }
-                }]
-            }
-        }
-      });
-    },
-    drawDoughnutChart: function(chartElement){
-      const self = this;
-      this.componentConfig["datasets"].forEach(function(item){
-        if (item["backgroundColor"] === undefined){
-          item["backgroundColor"] = self.getThemeColor("primary")
-        }else{
-          if(Array.isArray(item["backgroundColor"])){
-            item["backgroundColor"] = self.getThemeColorArray(item["backgroundColor"])
-          }else{
-            item["backgroundColor"] = self.getThemeColor(item["backgroundColor"])
-          }
-        }
-        item["hoverBackgroundColor"] = "rgba(0, 0, 0, 0.1)"
-        if (item["borderColor"] === undefined){
-          item["borderColor"] = self.getThemeColor("white")
-        }else{
-          item["borderColor"] = self.getThemeColor(item["borderColor"])
-        }
-        if (item["hoverBorderColor"] === undefined){
-          item["hoverBorderColor"] = self.getThemeColor("white")
-        }else{
-          item["hoverBorderColor"] = self.getThemeColor(item["hoverBorderColor"])
-        }
-        if (item["borderWidth"] === undefined){
-          item["borderWidth"] = 10
-        }
-        if (item["weight"] === undefined){
-          item["weight"] = 1
-        }
-      })
-      this.chartJsInstance = new Chart(chartElement, {
-        type: 'doughnut',
-        data: {
-            labels: this.componentConfig["labels"],
-            datasets: this.componentConfig["datasets"]
-        },
-        options: {
-            legend: {
-              display: this.componentConfig["display_legend"],
-            },
-            cutoutPercentage: this.componentConfig["cutout_percentage"]
-        }
-      });
-    },
-    drawPieChart: function(chartElement){
-      const self = this;
-      this.componentConfig["datasets"].forEach(function(item){
-        if (item["backgroundColor"] === undefined){
-          item["backgroundColor"] = self.getThemeColor("primary")
-        }else{
-          if(Array.isArray(item["backgroundColor"])){
-            item["backgroundColor"] = self.getThemeColorArray(item["backgroundColor"])
-          }else{
-            item["backgroundColor"] = self.getThemeColor(item["backgroundColor"])
-          }
-        }
-        item["hoverBackgroundColor"] = "rgba(0, 0, 0, 0.1)"
-      })
-      this.chartJsInstance = new Chart(chartElement, {
-        type: 'pie',
-        data: {
-            labels: this.componentConfig["labels"],
-            datasets: this.componentConfig["datasets"]
-        },
-        options: {
-            legend: {
-              display: this.componentConfig["display_legend"],
-            }
-        }
-      });
-    },
-  },
-
-  mounted: function() {
-    const style = getComputedStyle(document.body);
-
-    this.defaultColor = style.getPropertyValue('--bs-primary');
-    this.fontColor = style.getPropertyValue('--bs-secondary');
-    this.fontFamily = style.getPropertyValue('--bs-font-sans-serif');
-
-    Chart.defaults.global.defaultFontColor = this.fontColor
-    Chart.defaults.global.defaultFontFamily = this.fontFamily
-    Chart.defaults.global.defaultColor = this.fontFamily
-
-    const chartElement = this.$refs.chart
-
-    if(this.componentConfig["type"] == "bar"){
-      this.drawBarChart(chartElement);
-    }
-    if(this.componentConfig["type"] == "line"){
-      this.drawLineChart(chartElement);
-    }
-    if(this.componentConfig["type"] == "doughnut"){
-      this.drawDoughnutChart(chartElement);
-    }
-    if(this.componentConfig["type"] == "pie"){
-      this.drawPieChart(chartElement);
-    }
-
-  },
-
-  created: function() {
-
-  },
-
-  beforeDestroy: function() {
-
-  },
-});