matestack-ui-core 1.3.1 → 2.1.0

data/app/concepts/matestack/ui/core/component/children.haml

@@ -1,2 +0,0 @@
-- @children.each do |child|
-  = child.show

data/app/concepts/matestack/ui/core/component/dynamic.haml

@@ -1,6 +0,0 @@
-%component{dynamic_tag_attributes}
-  %div{class: "matestack-async-component-wrapper", "v-bind:class": "{ 'loading': loading === true }"}
-    %div{"v-if": "asyncTemplate == null"}
-      = render_content
-    %div{"v-if": "asyncTemplate != null"}
-      %v-runtime-template{":template":"asyncTemplate"}

data/app/concepts/matestack/ui/core/component/dynamic.rb

@@ -1,47 +0,0 @@
-module Matestack::Ui::Core::Component
-  class Dynamic < Base
-
-    def initialize(*_args)
-      super
-    end
-
-    def show
-      render :dynamic_without_rerender
-    end
-
-    private
-
-    def dynamic_tag_attributes
-      attrs = {
-        "is": get_vue_js_name,
-        "ref": component_id,
-        ":params":  params.except(:controller, :action).to_json,
-        ":component-config": component_config.to_json,
-        "inline-template": true,
-      }
-      attrs.merge!(options[:attributes]) unless options[:attributes].nil?
-      attrs
-    end
-
-    def get_vue_js_name
-      self.class.vue_js_name
-    end
-
-    class << self
-
-      def inherited(subclass)
-        super # do not overwrite inherited implementation of Base
-        subclass.vue_js_component_name vue_js_name unless self == Matestack::Ui::Core::Component::Dynamic
-      end
-
-      def vue_js_component_name(name)
-        @vue_js_name = name.to_s
-      end
-
-      def vue_js_name
-        @vue_js_name ||= self.name.split(/(?=[A-Z])/).join("-").downcase.gsub("::", "")
-      end
-    end
-
-  end
-end

data/app/concepts/matestack/ui/core/component/dynamic_without_rerender.haml

@@ -1,2 +0,0 @@
-%component{dynamic_tag_attributes}
-  = render_content

data/app/concepts/matestack/ui/core/component/static.rb

@@ -1,7 +0,0 @@
-module Matestack::Ui::Core::Component
-  class Static < Base
-    def show
-      render_content
-    end
-  end
-end

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

@@ -1,5 +0,0 @@
-%data{ html_attributes }
-  - if text.blank? && block_given?
-    = yield
-  - else
-    = text

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

@@ -1,6 +0,0 @@
-module Matestack::Ui::Core::Data
-  class Data < Matestack::Ui::Core::Component::Static
-    html_attributes :value
-    optional :text
-  end
-end

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

@@ -1,3 +0,0 @@
-%datalist{ html_attributes }
-  - if block_given?
-    = yield

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

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

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

@@ -1,5 +0,0 @@
-%dd{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

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

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

@@ -1,5 +0,0 @@
-%del{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

@@ -1,6 +0,0 @@
-module Matestack::Ui::Core::Del
-  class Del < Matestack::Ui::Core::Component::Static
-    html_attributes :cite, :datetime
-    optional :text
-  end
-end

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

@@ -1,3 +0,0 @@
-%details{ html_attributes }
-  - if block_given?
-    = yield

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

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

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

@@ -1,5 +0,0 @@
-%dfn{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

@@ -1,6 +0,0 @@
-module Matestack::Ui::Core::Dfn
-  class Dfn < Matestack::Ui::Core::Component::Static
-    optional :text
-  end
-end
-    

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

@@ -1,5 +0,0 @@
-%dialog{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

@@ -1,6 +0,0 @@
-module Matestack::Ui::Core::Dialog
-  class Dialog < Matestack::Ui::Core::Component::Static
-    html_attributes :open
-    optional :text
-  end
-end

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

@@ -1,3 +0,0 @@
-%div{ html_attributes }
-  - if block_given?
-    = yield

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

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

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

@@ -1,5 +0,0 @@
-%dl{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

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

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

@@ -1,5 +0,0 @@
-%dt{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

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

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

@@ -1,5 +0,0 @@
-%em{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

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

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

@@ -1,5 +0,0 @@
-%fieldset{ html_attributes }
-  - if text.nil? && block_given?
-    = yield
-  - else
-    = text

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

@@ -1,6 +0,0 @@
-module Matestack::Ui::Core::Fieldset
-  class Fieldset < Matestack::Ui::Core::Component::Static
-    html_attributes :disabled, :form, :name
-    optional :text
-  end
-end

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

@@ -1,3 +0,0 @@
-%figure{ html_attributes }
-  - if block_given?
-    = yield

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

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

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

@@ -1,3 +0,0 @@
-%footer{ html_attributes }
-  - if block_given?
-    = yield

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

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

data/app/concepts/matestack/ui/core/form/checkbox/base.rb

@@ -1,120 +0,0 @@
-require_relative '../utils'
-require_relative '../has_errors'
-module Matestack::Ui::Core::Form::Checkbox
-  class Base < Matestack::Ui::Core::Component::Dynamic
-    include Matestack::Ui::Core::Form::Utils
-    include Matestack::Ui::Core::Form::HasInputHtmlAttributes
-    include Matestack::Ui::Core::Form::HasErrors
-
-    requires :key
-    optional :value, :false_value, :multiple, :init, for: { as: :input_for }, label: { as: :input_label }, options: { as: :checkbox_options }
-
-    def component_id
-      "checkbox-component-for-#{attr_key}"
-    end
-
-    def input_key
-      "$parent.data[\"#{key}\"]"
-    end
-
-    def error_key
-      "$parent.errors[\"#{key}\"]"
-    end
-
-    def change_event
-      "inputChanged('#{attr_key}')"
-    end
-
-    def render_options
-      # multiple
-      if checkbox_options
-        checkbox_options.to_a.each do |item|
-          input html_attributes.merge(
-            attributes: vue_attributes,
-            type: :checkbox,
-            id: "#{id_for_item(item_value(item))}",
-            name: item_name(item),
-            value: item_value(item)
-          )
-          label text: item_name(item), for: id_for_item(item_value(item))
-        end
-      # checked/unchecked checkbox (true/false checkbox)
-      else
-        input html_attributes.merge(
-          attributes: vue_attributes_for_single_input,
-          type: :hidden,
-          id: id_for_item(value),
-          value: (false_value || 0)
-        )
-
-        input html_attributes.merge(
-          attributes: vue_attributes_for_single_input,
-          type: :checkbox,
-          id: id_for_item(value),
-          value: checked_value
-        )
-
-        label text: input_label, for: id_for_item(value)
-      end
-    end
-
-    def vue_attributes
-      (options[:attributes] || {}).merge({
-        "@change": change_event,
-        ref: "select.multiple.#{attr_key}",
-        'init-value': init_value,
-        'v-bind:class': "{ '#{input_error_class}': #{error_key} }",
-        'value-type': value_type,
-        "#{v_model_type}": input_key,
-      })
-    end
-
-    def vue_attributes_for_single_input
-      (options[:attributes] || {}).merge({
-        "@change": change_event,
-        ref: "input.#{attr_key}",
-        'init-value': init_value_for_single_input,
-        'v-bind:class': "{ '#{input_error_class}': #{error_key} }",
-        "#{v_model_type}": input_key
-      })
-    end
-
-    def init_value_for_single_input
-      if init_value == true || init_value == 1
-        return "true"
-      end
-      if init_value == false || init_value == 0
-        return "false"
-      end
-    end
-
-    def value_type
-      item_value(checkbox_options.first).is_a?(Integer) ? Integer : nil
-    end
-
-    def item_value(item)
-      item.is_a?(Array) ? item.last : item
-    end
-
-    def item_name(item)
-      item.is_a?(Array) ? item.first : item
-    end
-
-    def checked_value
-      value || 1
-    end
-
-    def v_model_type
-      if checkbox_options && checkbox_options.first.is_a?(Integer)
-        'v-model.number'
-      else
-        'v-model'
-      end
-    end
-
-    def id_for_item(value)
-      "#{html_attributes[:id]}_#{value}"
-    end
-
-  end
-end

data/app/concepts/matestack/ui/core/form/checkbox/checkbox.rb

@@ -1,16 +0,0 @@
-require_relative './base'
-
-module Matestack::Ui::Core::Form::Checkbox
-  class Checkbox < Base
-
-    vue_js_component_name "matestack-ui-core-form-checkbox"
-
-    def response
-      div class: "matestack-ui-core-form-checkbox" do
-        render_options
-        render_errors
-      end
-    end
-
-  end
-end

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

@@ -1,2 +0,0 @@
-%form{ form_attributes }
-  = yield

data/app/concepts/matestack/ui/core/form/form.js

@@ -1,275 +0,0 @@
-import Vue from "vue/dist/vue.esm";
-import Vuex from "vuex";
-import axios from "axios";
-
-import matestackEventHub from "../js/event-hub";
-import componentMixin from "../component/component";
-
-const componentDef = {
-  mixins: [componentMixin],
-  data: function () {
-    return {
-      data: {},
-      errors: {},
-      loading: false
-    };
-  },
-  methods: {
-    initDataKey: function (key, initValue) {
-      this.data[key] = initValue;
-    },
-    updateFormValue: function (key, value) {
-      this.data[key] = value;
-    },
-    hasErrors: function(){
-      //https://stackoverflow.com/a/27709663/13886137
-      for (var key in this.errors) {
-        if (this.errors[key] !== null && this.errors[key] != ""){
-          return true;
-        }
-      }
-      return false;
-    },
-    resetErrors: function (key) {
-      if (this.errors[key]) {
-        this.errors[key] = null;
-      }
-    },
-    setProps: function (flat, newVal) {
-      for (var i in flat) {
-        if (flat[i] === null){
-          flat[i] = newVal;
-        } else if (flat[i] instanceof File){
-          flat[i] = newVal;
-          this.$refs["input-component-for-"+i].value = newVal
-        } else if (flat[i] instanceof Array) {
-          if(flat[i][0] instanceof File){
-            flat[i] = newVal
-            this.$refs["input-component-for-"+i].value = newVal
-          }
-        } else if (typeof flat[i] === "object" && !(flat[i] instanceof Array)) {
-          setProps(flat[i], newVal);
-        } else {
-          flat[i] = newVal;
-        }
-      }
-    },
-    initValues: function () {
-      let self = this;
-      let data = {};
-      for (let key in self.$refs) {
-        if (key.startsWith("input-component")) {
-          self.$refs[key].initialize()
-        }
-        if (key.startsWith("textarea-component")) {
-          self.$refs[key].initialize()
-        }
-        if (key.startsWith("select-component")) {
-          self.$refs[key].initialize()
-        }
-        if (key.startsWith("radio-component")) {
-          self.$refs[key].initialize()
-        }
-        if (key.startsWith("checkbox-component")) {
-          self.$refs[key].initialize()
-        }
-      }
-    },
-    shouldResetFormOnSuccessfulSubmit() {
-      const self = this;
-      if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["reset"] != undefined) {
-        return self.componentConfig["success"]["reset"];
-      } else {
-        return self.shouldResetFormOnSuccessfulSubmitByDefault();
-      }
-    },
-    shouldResetFormOnSuccessfulSubmitByDefault() {
-      const self = this;
-      if (self.componentConfig["method"] == "put") {
-        return false;
-      } else {
-        return true;
-      }
-    },
-    perform: function(){
-      const self = this
-      var form = self.$el.tagName == 'FORM' ? self.$el : self.$el.querySelector('form');
-      if(form.checkValidity()){
-        self.loading = true;
-        if (self.componentConfig["emit"] != undefined) {
-          matestackEventHub.$emit(self.componentConfig["emit"]);
-        }
-        if (self.componentConfig["delay"] != undefined) {
-          setTimeout(function () {
-            self.sendRequest()
-          }, parseInt(self.componentConfig["delay"]));
-        } else {
-          self.sendRequest()
-        }
-      } else {
-        matestackEventHub.$emit('static_form_errors');
-      }
-    },
-    sendRequest: function(){
-      const self = this;
-      let payload = {};
-      payload[self.componentConfig["for"]] = self.data;
-      let axios_config = {};
-      if (self.componentConfig["multipart"] == true ) {
-        let form_data = new FormData();
-        for (let key in self.data) {
-          if (key.endsWith("[]")) {
-            for (let i in self.data[key]) {
-              let file = self.data[key][i];
-              form_data.append(self.componentConfig["for"] + "[" + key.slice(0, -2) + "][]", file);
-            }
-          } else {
-            if (self.data[key] != null){
-              form_data.append(self.componentConfig["for"] + "[" + key + "]", self.data[key]);
-            }
-          }
-        }
-        axios_config = {
-          method: self.componentConfig["method"],
-          url: self.componentConfig["submit_path"],
-          data: form_data,
-          headers: {
-            "X-CSRF-Token": document.getElementsByName("csrf-token")[0].getAttribute("content"),
-            "Content-Type": "multipart/form-data",
-          },
-        };
-      } else {
-        axios_config = {
-          method: self.componentConfig["method"],
-          url: self.componentConfig["submit_path"],
-          data: payload,
-          headers: {
-            "X-CSRF-Token": document.getElementsByName("csrf-token")[0].getAttribute("content"),
-            "Content-Type": "application/json",
-          },
-        };
-      }
-      axios(axios_config)
-        .then(function (response) {
-          self.loading = false;
-          if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["emit"] != undefined) {
-            matestackEventHub.$emit(self.componentConfig["success"]["emit"], response.data);
-          }
-          // transition handling
-          if (self.componentConfig["success"] != undefined
-            && self.componentConfig["success"]["transition"] != undefined
-            && (
-              self.componentConfig["success"]["transition"]["follow_response"] == undefined
-              ||
-              self.componentConfig["success"]["transition"]["follow_response"] === false
-            )
-            && self.$store != undefined
-          ) {
-            let path = self.componentConfig["success"]["transition"]["path"]
-            self.$store.dispatch('navigateTo', {url: path, backwards: false})
-            return;
-          }
-          if (self.componentConfig["success"] != undefined
-            && self.componentConfig["success"]["transition"] != undefined
-            && self.componentConfig["success"]["transition"]["follow_response"] === true
-            && self.$store != undefined
-          ) {
-            let path = response.data["transition_to"] || response.request.responseURL
-            self.$store.dispatch('navigateTo', {url: path, backwards: false})
-            return;
-          }
-          // redirect handling
-          if (self.componentConfig["success"] != undefined
-            && self.componentConfig["success"]["redirect"] != undefined
-            && (
-              self.componentConfig["success"]["redirect"]["follow_response"] == undefined
-              ||
-              self.componentConfig["success"]["redirect"]["follow_response"] === false
-            )
-            && self.$store != undefined
-          ) {
-            let path = self.componentConfig["success"]["redirect"]["path"]
-            window.location.href = path
-            return;
-          }
-          if (self.componentConfig["success"] != undefined
-            && self.componentConfig["success"]["redirect"] != undefined
-            && self.componentConfig["success"]["redirect"]["follow_response"] === true
-            && self.$store != undefined
-          ) {
-            let path = response.data["redirect_to"] || response.request.responseURL
-            window.location.href = path
-            return;
-          }
-
-          if (self.shouldResetFormOnSuccessfulSubmit())
-          {
-            self.setProps(self.data, null);
-            self.initValues();
-          }
-        })
-        .catch(function (error) {
-          self.loading = false;
-          if (error.response && error.response.data && error.response.data.errors) {
-            self.errors = error.response.data.errors;
-          }
-          if (self.componentConfig["failure"] != undefined && self.componentConfig["failure"]["emit"] != undefined) {
-            matestackEventHub.$emit(self.componentConfig["failure"]["emit"], error.response.data);
-          }
-          // transition handling
-          if (self.componentConfig["failure"] != undefined
-            && self.componentConfig["failure"]["transition"] != undefined
-            && (
-              self.componentConfig["failure"]["transition"]["follow_response"] == undefined
-              ||
-              self.componentConfig["failure"]["transition"]["follow_response"] === false
-            )
-            && self.$store != undefined
-          ) {
-            let path = self.componentConfig["failure"]["transition"]["path"]
-            self.$store.dispatch('navigateTo', {url: path, backwards: false})
-            return;
-          }
-          if (self.componentConfig["failure"] != undefined
-            && self.componentConfig["failure"]["transition"] != undefined
-            && self.componentConfig["failure"]["transition"]["follow_response"] === true
-            && self.$store != undefined
-          ) {
-            let path = error.response.data["transition_to"] || response.request.responseURL
-            self.$store.dispatch('navigateTo', {url: path, backwards: false})
-            return;
-          }
-          // redirect handling
-          if (self.componentConfig["failure"] != undefined
-            && self.componentConfig["failure"]["redirect"] != undefined
-            && (
-              self.componentConfig["failure"]["redirect"]["follow_response"] == undefined
-              ||
-              self.componentConfig["failure"]["redirect"]["follow_response"] === false
-            )
-            && self.$store != undefined
-          ) {
-            let path = self.componentConfig["failure"]["redirect"]["path"]
-            window.location.href = path
-            return;
-          }
-          if (self.componentConfig["failure"] != undefined
-            && self.componentConfig["failure"]["redirect"] != undefined
-            && self.componentConfig["failure"]["redirect"]["follow_response"] === true
-            && self.$store != undefined
-          ) {
-            let path = error.response.data["redirect_to"] || response.request.responseURL
-            window.location.href = path
-            return;
-          }
-        });
-    },
-  },
-  mounted: function () {
-    this.initValues();
-  },
-};
-
-let component = Vue.component("matestack-ui-core-form", componentDef);
-
-export default componentDef;