matestack-ui-bootstrap 1.5.1 → 2.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/LICENSE +17 -5
- data/lib/matestack/ui/bootstrap.rb +96 -17
- data/{app/concepts → lib}/matestack/ui/bootstrap/apps/admin_template.rb +14 -7
- data/lib/matestack/ui/bootstrap/base_component.rb +13 -0
- data/lib/matestack/ui/bootstrap/base_vue_js_component.rb +13 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/accordion.rb +18 -16
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/alert.js +12 -9
- data/lib/matestack/ui/bootstrap/components/alert.rb +43 -0
- data/lib/matestack/ui/bootstrap/components/avatar.rb +27 -0
- data/lib/matestack/ui/bootstrap/components/badge.rb +32 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/breadcrumb.rb +12 -10
- data/lib/matestack/ui/bootstrap/components/button.rb +71 -0
- data/lib/matestack/ui/bootstrap/components/button_group.rb +36 -0
- data/lib/matestack/ui/bootstrap/components/card.rb +105 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/carousel.js +21 -18
- data/lib/matestack/ui/bootstrap/components/carousel.rb +103 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/close.rb +10 -9
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/collapse.js +20 -17
- data/lib/matestack/ui/bootstrap/components/collapse.rb +54 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/dropdown.js +5 -2
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/dropdown.rb +29 -25
- data/lib/matestack/ui/bootstrap/components/icon.rb +21 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/list_group.rb +32 -29
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/modal.js +24 -21
- data/lib/matestack/ui/bootstrap/components/modal.rb +121 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/navbar.rb +37 -28
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/page_heading.rb +7 -5
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/pagination.rb +11 -9
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/popover.js +4 -1
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/popover.rb +25 -21
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/progress.rb +19 -19
- data/lib/matestack/ui/bootstrap/components/scrollspy.rb +50 -0
- data/lib/matestack/ui/bootstrap/components/section_card.rb +33 -0
- data/lib/matestack/ui/bootstrap/components/spinner.rb +35 -0
- data/lib/matestack/ui/bootstrap/components/tab_nav.rb +79 -0
- data/lib/matestack/ui/bootstrap/components/tab_nav_content.rb +35 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/toast.js +22 -19
- data/lib/matestack/ui/bootstrap/components/toast.rb +113 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/tooltip.js +4 -1
- data/{app/concepts → lib}/matestack/ui/bootstrap/components/tooltip.rb +20 -18
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/figure.rb +4 -2
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/smart_collection/collection.rb +22 -16
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/smart_collection/collection.scss +0 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/smart_collection/content.rb +23 -19
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/smart_collection/filter.rb +6 -2
- data/{app/concepts → lib}/matestack/ui/bootstrap/content/smart_collection/paginate.rb +16 -11
- data/lib/matestack/ui/bootstrap/form/checkbox.rb +81 -0
- data/lib/matestack/ui/bootstrap/form/input.rb +116 -0
- data/lib/matestack/ui/bootstrap/form/radio.rb +55 -0
- data/lib/matestack/ui/bootstrap/form/select.rb +63 -0
- data/lib/matestack/ui/bootstrap/form/submit.rb +20 -0
- data/lib/matestack/ui/bootstrap/form/switch.rb +32 -0
- data/lib/matestack/ui/bootstrap/index.js +24 -0
- data/lib/matestack/ui/bootstrap/layout/column.rb +49 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/layout/container.rb +12 -9
- data/lib/matestack/ui/bootstrap/layout/row.rb +25 -0
- data/{app/concepts → lib}/matestack/ui/bootstrap/layout/sidebar.js +5 -2
- data/{app/concepts → lib}/matestack/ui/bootstrap/layout/sidebar.rb +10 -10
- data/{app/concepts → lib}/matestack/ui/bootstrap/layout/sidebar.scss +0 -0
- data/lib/matestack/ui/bootstrap/registry.rb +169 -0
- data/{app/javascript/matestack-ui-bootstrap → lib/matestack/ui/bootstrap}/stylesheets/matestack-ui-bootstrap.scss +0 -0
- data/lib/matestack/ui/bootstrap/version.rb +1 -1
- metadata +67 -72
- data/app/assets/images/avatar-placeholder.png +0 -0
- data/app/assets/images/icons/bootstrap-icons.svg +0 -1
- data/app/concepts/matestack/ui/bootstrap/components/alert.rb +0 -34
- data/app/concepts/matestack/ui/bootstrap/components/avatar.rb +0 -27
- data/app/concepts/matestack/ui/bootstrap/components/badge.rb +0 -30
- data/app/concepts/matestack/ui/bootstrap/components/button.rb +0 -69
- data/app/concepts/matestack/ui/bootstrap/components/button_group.rb +0 -36
- data/app/concepts/matestack/ui/bootstrap/components/card.rb +0 -100
- data/app/concepts/matestack/ui/bootstrap/components/carousel.rb +0 -86
- data/app/concepts/matestack/ui/bootstrap/components/collapse.rb +0 -43
- data/app/concepts/matestack/ui/bootstrap/components/icon.rb +0 -19
- data/app/concepts/matestack/ui/bootstrap/components/modal.rb +0 -106
- data/app/concepts/matestack/ui/bootstrap/components/scrollspy.rb +0 -48
- data/app/concepts/matestack/ui/bootstrap/components/section_card.rb +0 -31
- data/app/concepts/matestack/ui/bootstrap/components/spinner.rb +0 -31
- data/app/concepts/matestack/ui/bootstrap/components/tab_nav.rb +0 -83
- data/app/concepts/matestack/ui/bootstrap/components/tab_nav_content.rb +0 -32
- data/app/concepts/matestack/ui/bootstrap/components/toast.rb +0 -99
- data/app/concepts/matestack/ui/bootstrap/form/checkbox.rb +0 -99
- data/app/concepts/matestack/ui/bootstrap/form/input.rb +0 -112
- data/app/concepts/matestack/ui/bootstrap/form/radio.rb +0 -57
- data/app/concepts/matestack/ui/bootstrap/form/select.rb +0 -53
- data/app/concepts/matestack/ui/bootstrap/form/submit.rb +0 -21
- data/app/concepts/matestack/ui/bootstrap/form/switch.rb +0 -99
- data/app/concepts/matestack/ui/bootstrap/layout/column.rb +0 -47
- data/app/concepts/matestack/ui/bootstrap/layout/row.rb +0 -15
- data/app/concepts/matestack/ui/bootstrap/pages/devise/sign_in.rb +0 -40
- data/app/concepts/matestack/ui/bootstrap/registry.rb +0 -61
- data/app/helpers/matestack/ui/bootstrap/application_helper.rb +0 -17
- data/app/javascript/matestack-ui-bootstrap/index.js +0 -24
- data/app/javascript/packs/matestack-ui-bootstrap.js +0 -2
- data/app/matestack/bootstrap/form/submit.rb +0 -20
- data/config/routes.rb +0 -2
- data/lib/matestack/ui/bootstrap/engine.rb +0 -26
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: f24abf9d50eab0b8ff52106c6f2d559ac00d602afbaebd5d6b726ffab4ae2850
|
4
|
+
data.tar.gz: cd128499828c67b5d9bb48e280c3e33bf90cb29c610342f1e05f787e45552b4f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: f8f72a07d838be79818ad3d81f54d43c3f71ee9fe891300d9502be17beb199c05d8f373c41ab8088f781462c303638cdebc42bc2168a4a90ab96f40b513dc398
|
7
|
+
data.tar.gz: 87cad9cea3d33c8c738919dfe7607e7e4b1bedce8af88404b88c4d19a8bf8e14b489af12445cde79b4a0e01ebd5d0ec06bb7a495f6cb4e37a0aaa4b97223ac60
|
data/LICENSE
CHANGED
@@ -1,8 +1,20 @@
|
|
1
1
|
Copyright (c) Matestack GmbH
|
2
2
|
|
3
|
-
|
4
|
-
|
5
|
-
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
6
10
|
|
7
|
-
|
8
|
-
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
@@ -1,27 +1,106 @@
|
|
1
|
-
# require 'trailblazer'
|
2
|
-
# require 'trailblazer/rails'
|
3
|
-
# require 'trailblazer/cell'
|
4
|
-
# require 'cell/rails'
|
5
|
-
# require 'cell/haml'
|
6
|
-
|
7
1
|
require "matestack/ui/core"
|
8
|
-
|
2
|
+
|
3
|
+
base_path = 'matestack/ui/bootstrap'
|
4
|
+
require "#{base_path}/version"
|
5
|
+
|
6
|
+
module Matestack
|
7
|
+
module Ui
|
8
|
+
module Bootstrap
|
9
|
+
end
|
10
|
+
end
|
11
|
+
end
|
12
|
+
|
13
|
+
require "#{base_path}/base_component"
|
14
|
+
require "#{base_path}/base_vue_js_component"
|
15
|
+
|
16
|
+
module Matestack
|
17
|
+
module Ui
|
18
|
+
module Bootstrap
|
19
|
+
module Apps
|
20
|
+
end
|
21
|
+
end
|
22
|
+
end
|
23
|
+
end
|
24
|
+
require "#{base_path}/apps/admin_template"
|
9
25
|
|
10
26
|
module Matestack
|
11
27
|
module Ui
|
12
28
|
module Bootstrap
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
29
|
+
module Layout
|
30
|
+
end
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|
34
|
+
require "#{base_path}/layout/row"
|
35
|
+
require "#{base_path}/layout/column"
|
36
|
+
require "#{base_path}/layout/container"
|
37
|
+
require "#{base_path}/layout/sidebar"
|
38
|
+
|
39
|
+
module Matestack
|
40
|
+
module Ui
|
41
|
+
module Bootstrap
|
42
|
+
module Components
|
43
|
+
end
|
44
|
+
end
|
45
|
+
end
|
46
|
+
end
|
47
|
+
require "#{base_path}/components/collapse"
|
48
|
+
require "#{base_path}/components/navbar"
|
49
|
+
require "#{base_path}/components/page_heading"
|
50
|
+
require "#{base_path}/components/section_card"
|
51
|
+
require "#{base_path}/components/carousel"
|
52
|
+
require "#{base_path}/components/tooltip"
|
53
|
+
require "#{base_path}/components/alert"
|
54
|
+
require "#{base_path}/components/breadcrumb"
|
55
|
+
require "#{base_path}/components/tab_nav"
|
56
|
+
require "#{base_path}/components/progress"
|
57
|
+
require "#{base_path}/components/toast"
|
58
|
+
require "#{base_path}/components/accordion"
|
59
|
+
require "#{base_path}/components/avatar"
|
60
|
+
require "#{base_path}/components/close"
|
61
|
+
require "#{base_path}/components/card"
|
62
|
+
require "#{base_path}/components/dropdown"
|
63
|
+
require "#{base_path}/components/modal"
|
64
|
+
require "#{base_path}/components/list_group"
|
65
|
+
require "#{base_path}/components/scrollspy"
|
66
|
+
require "#{base_path}/components/button"
|
67
|
+
require "#{base_path}/components/spinner"
|
68
|
+
require "#{base_path}/components/pagination"
|
69
|
+
require "#{base_path}/components/tab_nav_content"
|
70
|
+
require "#{base_path}/components/popover"
|
71
|
+
require "#{base_path}/components/badge"
|
72
|
+
require "#{base_path}/components/button_group"
|
73
|
+
require "#{base_path}/components/icon"
|
74
|
+
|
75
|
+
module Matestack
|
76
|
+
module Ui
|
77
|
+
module Bootstrap
|
78
|
+
module Content
|
79
|
+
module SmartCollection
|
23
80
|
end
|
24
81
|
end
|
25
82
|
end
|
26
83
|
end
|
27
84
|
end
|
85
|
+
require "#{base_path}/content/figure"
|
86
|
+
require "#{base_path}/content/smart_collection/collection"
|
87
|
+
require "#{base_path}/content/smart_collection/content"
|
88
|
+
require "#{base_path}/content/smart_collection/filter"
|
89
|
+
require "#{base_path}/content/smart_collection/paginate"
|
90
|
+
|
91
|
+
module Matestack
|
92
|
+
module Ui
|
93
|
+
module Bootstrap
|
94
|
+
module Form
|
95
|
+
end
|
96
|
+
end
|
97
|
+
end
|
98
|
+
end
|
99
|
+
require "#{base_path}/form/checkbox"
|
100
|
+
require "#{base_path}/form/input"
|
101
|
+
require "#{base_path}/form/radio"
|
102
|
+
require "#{base_path}/form/select"
|
103
|
+
require "#{base_path}/form/submit"
|
104
|
+
require "#{base_path}/form/switch"
|
105
|
+
|
106
|
+
require "#{base_path}/registry"
|
@@ -1,9 +1,19 @@
|
|
1
|
+
require_relative "../registry"
|
2
|
+
|
1
3
|
class Matestack::Ui::Bootstrap::Apps::AdminTemplate < Matestack::Ui::App
|
2
4
|
|
3
|
-
|
5
|
+
include Matestack::Ui::Bootstrap::Registry
|
6
|
+
|
7
|
+
def response(&block)
|
8
|
+
matestack do
|
9
|
+
body_response(&block)
|
10
|
+
end
|
11
|
+
end
|
12
|
+
|
13
|
+
def body_response(&block)
|
4
14
|
div class: "d-flex flex-row" do
|
5
15
|
if should_show_sidebar?
|
6
|
-
bs_sidebar sidebar_navigation_items: sidebar_navigation_items, slots: { sidebar_top: sidebar_top_slot }
|
16
|
+
bs_sidebar sidebar_navigation_items: sidebar_navigation_items, slots: { sidebar_top: method(:sidebar_top_slot) }
|
7
17
|
end
|
8
18
|
div id: "content", class: "content-wrapper w-100 #{content_background_class}" do
|
9
19
|
if should_show_navbar?
|
@@ -16,7 +26,7 @@ class Matestack::Ui::Bootstrap::Apps::AdminTemplate < Matestack::Ui::App
|
|
16
26
|
end
|
17
27
|
end
|
18
28
|
bs_container class: "my-5 px-4 pt-5" do
|
19
|
-
|
29
|
+
yield if block_given?
|
20
30
|
end
|
21
31
|
end
|
22
32
|
end
|
@@ -40,9 +50,7 @@ class Matestack::Ui::Bootstrap::Apps::AdminTemplate < Matestack::Ui::App
|
|
40
50
|
end
|
41
51
|
|
42
52
|
def sidebar_top_slot
|
43
|
-
|
44
|
-
sidebar_top_partial if self.respond_to?(:sidebar_top_partial)
|
45
|
-
end
|
53
|
+
sidebar_top_partial if self.respond_to?(:sidebar_top_partial)
|
46
54
|
end
|
47
55
|
|
48
56
|
def toasts_partial
|
@@ -81,5 +89,4 @@ class Matestack::Ui::Bootstrap::Apps::AdminTemplate < Matestack::Ui::App
|
|
81
89
|
"bg-light"
|
82
90
|
end
|
83
91
|
|
84
|
-
|
85
92
|
end
|
@@ -1,33 +1,36 @@
|
|
1
|
-
|
1
|
+
require_relative "../base_component"
|
2
|
+
|
3
|
+
class Matestack::Ui::Bootstrap::Components::Accordion < Matestack::Ui::Bootstrap::BaseComponent
|
2
4
|
|
3
5
|
# [ {header: { class, id, text, size, btn_variant, btn_class }, body: { class, text, multi } } ]
|
4
6
|
optional :items # array with 2 Hashes: header and body
|
5
7
|
optional :open
|
6
8
|
optional :variant
|
7
|
-
optional attributes
|
9
|
+
optional :attributes, class: { as: :bs_class }
|
10
|
+
optional :id
|
8
11
|
|
9
|
-
def
|
10
|
-
@accordion_id = (
|
12
|
+
def prepare
|
13
|
+
@accordion_id = (context.id.present? ? context.id : "matestack-accordion-#{SecureRandom.hex(3)}")
|
11
14
|
end
|
12
15
|
|
13
16
|
def response
|
14
17
|
div accordion_attributes do
|
15
|
-
accordion_content_partial if items.present?
|
16
|
-
|
18
|
+
accordion_content_partial if context.items.present?
|
19
|
+
yield if block_given?
|
17
20
|
end
|
18
21
|
end
|
19
22
|
|
20
23
|
protected
|
21
24
|
|
22
25
|
def accordion_content_partial
|
23
|
-
items.each_with_index do | item, index |
|
26
|
+
context.items.each_with_index do | item, index |
|
24
27
|
div class: "accordion-item" do
|
25
28
|
heading class: "accordion-header #{item[:header][:class]}", id: (item[:header][:id] || "header-#{index}"), size: (item[:header][:size] || 2) do
|
26
29
|
button class: "accordion-button", text:item[:header][:text],
|
27
30
|
data: { "bs-toggle": "collapse", "bs-target": "#collapse-#{(item[:header][:id] || "header-#{index}") }" },
|
28
|
-
|
31
|
+
"aria-expanded": "false", "aria-controls": "collapse-#{(item[:header][:id] || "header-#{index}")}", type: "button"
|
29
32
|
end
|
30
|
-
bs_collapse class: "accordion-collapse #{ 'show' if open || item[:open] }", id: "collapse-#{(item[:header][:id] || "header-#{index}")}", labelledby: (item[:header][:id] || "header-#{index}"),
|
33
|
+
bs_collapse class: "accordion-collapse #{ 'show' if context.open || item[:open] }", id: "collapse-#{(item[:header][:id] || "header-#{index}")}", labelledby: (item[:header][:id] || "header-#{index}"),
|
31
34
|
parent: @accordion_id, multi: (item[:body][:multi] || false) do
|
32
35
|
div class: "accordion-body #{item[:body][:class]}" do
|
33
36
|
plain item[:body][:text]
|
@@ -38,19 +41,18 @@ class Matestack::Ui::Bootstrap::Components::Accordion < Matestack::Ui::Component
|
|
38
41
|
end
|
39
42
|
|
40
43
|
def accordion_attributes
|
41
|
-
|
44
|
+
options.merge(
|
42
45
|
id: @accordion_id,
|
43
|
-
class: accordion_classes
|
44
|
-
attributes
|
45
|
-
)
|
46
|
+
class: accordion_classes
|
47
|
+
).merge(context.attributes || {})
|
46
48
|
end
|
47
49
|
|
48
50
|
def accordion_classes
|
49
51
|
[].tap do |classes|
|
50
52
|
classes << 'accordion'
|
51
|
-
classes << 'open' if open
|
52
|
-
classes << 'accordion-flush' if variant == :flush
|
53
|
-
classes << bs_class
|
53
|
+
classes << 'open' if context.open
|
54
|
+
classes << 'accordion-flush' if context.variant == :flush
|
55
|
+
classes << context.bs_class
|
54
56
|
end.join(' ').strip
|
55
57
|
end
|
56
58
|
end
|
@@ -1,6 +1,9 @@
|
|
1
1
|
import * as bootstrap from 'bootstrap'
|
2
|
+
import Vue from 'vue/dist/vue.esm'
|
2
3
|
|
3
|
-
MatestackUiCore
|
4
|
+
import MatestackUiCore from 'matestack-ui-core'
|
5
|
+
|
6
|
+
Vue.component('matestack-ui-bootstrap-alert', {
|
4
7
|
mixins: [MatestackUiCore.componentMixin],
|
5
8
|
|
6
9
|
data() {
|
@@ -28,25 +31,25 @@ MatestackUiCore.Vue.component('matestack-ui-bootstrap-alert', {
|
|
28
31
|
created: function() {
|
29
32
|
const self = this
|
30
33
|
// close_on event registration
|
31
|
-
if(self.
|
32
|
-
var close_events = self.
|
34
|
+
if(self.props["close_on"] != undefined){
|
35
|
+
var close_events = self.props["close_on"].split(",")
|
33
36
|
close_events.forEach(close_event => MatestackUiCore.matestackEventHub.$on(close_event.trim(), self.close));
|
34
37
|
}
|
35
38
|
// dispose_on event registration
|
36
|
-
if(self.
|
37
|
-
var dispose_events = self.
|
39
|
+
if(self.props["dispose_on"] != undefined){
|
40
|
+
var dispose_events = self.props["dispose_on"].split(",")
|
38
41
|
dispose_events.forEach(dispose_event => MatestackUiCore.matestackEventHub.$on(dispose_event.trim(), self.dispose));
|
39
42
|
}
|
40
43
|
},
|
41
44
|
|
42
45
|
beforeDestroy: function() {
|
43
46
|
const self = this
|
44
|
-
if(self.
|
45
|
-
var closen_events = self.
|
47
|
+
if(self.props["close_on"] != undefined){
|
48
|
+
var closen_events = self.props["close_on"].split(",")
|
46
49
|
closen_events.forEach(close_event => MatestackUiCore.matestackEventHub.$off(close_event.trim(), self.close));
|
47
50
|
}
|
48
|
-
if(self.
|
49
|
-
var dispose_events = self.
|
51
|
+
if(self.props["dispose_on"] != undefined){
|
52
|
+
var dispose_events = self.props["dispose_on"].split(",")
|
50
53
|
dispose_events.forEach(dispose_event => MatestackUiCore.matestackEventHub.$off(dispose_event.trim(), self.dispose));
|
51
54
|
}
|
52
55
|
},
|
@@ -0,0 +1,43 @@
|
|
1
|
+
require_relative "../base_vue_js_component"
|
2
|
+
|
3
|
+
class Matestack::Ui::Bootstrap::Components::Alert < Matestack::Ui::Bootstrap::BaseVueJsComponent
|
4
|
+
vue_name "matestack-ui-bootstrap-alert"
|
5
|
+
|
6
|
+
optional :title, :variant, :dismissible, :animate, :title_size, class: { as: :bs_class }
|
7
|
+
optional :close_on, :dispose_on # event names on which occourences we close or dispose the modal
|
8
|
+
|
9
|
+
def response
|
10
|
+
div alert_attributes do
|
11
|
+
heading context.title, size: (context.title_size || 4), class: 'alert-heading' if context.title
|
12
|
+
plain context.text if context.text
|
13
|
+
yield if block_given?
|
14
|
+
bs_close dismiss: "alert" if context.dismissible
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
protected
|
19
|
+
|
20
|
+
def vue_props
|
21
|
+
{}.tap do |props|
|
22
|
+
props[:close_on] = context.close_on
|
23
|
+
props[:dispose_on] = context.dispose_on
|
24
|
+
end
|
25
|
+
end
|
26
|
+
|
27
|
+
def alert_classes
|
28
|
+
classes = ['alert']
|
29
|
+
classes << "alert-#{context.variant || "primary"}"
|
30
|
+
classes << "alert-dismissible" if context.dismissible
|
31
|
+
classes << "fade show" if context.animate
|
32
|
+
classes << context.bs_class
|
33
|
+
classes.join(' ')
|
34
|
+
end
|
35
|
+
|
36
|
+
def alert_attributes
|
37
|
+
{}.tap do |attrs|
|
38
|
+
attrs[:class] = alert_classes,
|
39
|
+
attrs[:role] = :alert
|
40
|
+
end
|
41
|
+
end
|
42
|
+
|
43
|
+
end
|
@@ -0,0 +1,27 @@
|
|
1
|
+
class Matestack::Ui::Bootstrap::Components::Avatar < Matestack::Ui::Bootstrap::BaseComponent
|
2
|
+
|
3
|
+
optional :bg_variant, :text_variant, :img_path, :size, class: { as: :bs_class }
|
4
|
+
|
5
|
+
def response
|
6
|
+
if context.text.present? && context.img_path.nil?
|
7
|
+
div class: "rounded-circle bg-#{context.bg_variant || 'primary'} text-#{context.text_variant || 'white'} text-center p-2 #{context.bs_class}",
|
8
|
+
style: "height: #{height}px; width: #{width}px; display: inline-block;" do
|
9
|
+
plain context.text
|
10
|
+
end
|
11
|
+
else
|
12
|
+
div class: "rounded-circle text-#{context.text_variant || 'white'} text-center p-2 #{context.bs_class}",
|
13
|
+
style: "height: #{height}px; width: #{width}px; display: inline-block; background-image: url(#{context.img_path}); background-size: contain;" do
|
14
|
+
plain context.text
|
15
|
+
end
|
16
|
+
end
|
17
|
+
end
|
18
|
+
|
19
|
+
def height
|
20
|
+
context.size || 40
|
21
|
+
end
|
22
|
+
|
23
|
+
def width
|
24
|
+
context.size || 40
|
25
|
+
end
|
26
|
+
|
27
|
+
end
|
@@ -0,0 +1,32 @@
|
|
1
|
+
require_relative "../base_component"
|
2
|
+
|
3
|
+
class Matestack::Ui::Bootstrap::Components::Badge < Matestack::Ui::Bootstrap::BaseComponent
|
4
|
+
|
5
|
+
optional class: { as: :bs_class }
|
6
|
+
optional :variant, :rounded, :visually_hidden
|
7
|
+
|
8
|
+
def response
|
9
|
+
span badge_attributes do
|
10
|
+
plain context.text if context.text
|
11
|
+
yield if block_given?
|
12
|
+
end
|
13
|
+
span context.visually_hidden, class: "visually-hidden" if context.visually_hidden.present?
|
14
|
+
end
|
15
|
+
|
16
|
+
protected
|
17
|
+
|
18
|
+
def badge_attributes
|
19
|
+
options.merge(
|
20
|
+
class: badge_classes
|
21
|
+
)
|
22
|
+
end
|
23
|
+
|
24
|
+
def badge_classes
|
25
|
+
[].tap do |classes|
|
26
|
+
classes << 'badge'
|
27
|
+
classes << (context.variant.present? ? "bg-#{context.variant}" : "bg-secondary")
|
28
|
+
classes << "rounded-pill" if context.rounded
|
29
|
+
classes << context.bs_class
|
30
|
+
end.join(' ').strip
|
31
|
+
end
|
32
|
+
end
|