playbook_ui 7.16.0.pre.alpha5 → 8.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_date_picker/sass_partials/_flatpickr_styles.scss +0 -3
- data/app/pb_kits/playbook/pb_date_picker/sass_partials/_header_styles.scss +7 -0
- data/app/pb_kits/playbook/pb_date_picker/sass_partials/_overrides.scss +4 -1
- data/app/pb_kits/playbook/pb_docs/kit_api.html.erb +12 -0
- data/app/pb_kits/playbook/pb_docs/kit_api.rb +19 -0
- data/app/pb_kits/playbook/pb_docs/kit_example.html.erb +28 -0
- data/app/pb_kits/playbook/pb_docs/kit_example.rb +46 -0
- data/app/pb_kits/playbook/pb_filter/filter.html.erb +86 -0
- data/app/pb_kits/playbook/pb_filter/filter.rb +9 -5
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +2 -2
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -1
- data/app/pb_kits/playbook/pb_form/docs/_form_simple_form.html.erb +1 -2
- data/app/pb_kits/playbook/pb_form/form.html.erb +7 -0
- data/app/pb_kits/playbook/pb_form/form.rb +12 -14
- data/app/pb_kits/playbook/pb_form/form_builder.rb +1 -1
- data/app/pb_kits/playbook/pb_form/form_builder/action_area.html.erb +3 -0
- data/app/pb_kits/playbook/pb_form/form_builder/action_area.rb +5 -21
- data/app/pb_kits/playbook/pb_form/form_with.html.erb +18 -0
- data/app/pb_kits/playbook/pb_form/form_with.rb +34 -0
- data/app/pb_kits/playbook/pb_form/{_form_simple_form.html.erb → simple_form.html.erb} +3 -3
- data/app/pb_kits/playbook/pb_form/simple_form.rb +63 -0
- data/app/pb_kits/playbook/pb_layout/{_item.html.erb → item.html.erb} +1 -1
- data/app/pb_kits/playbook/pb_layout/item.rb +1 -5
- data/app/pb_kits/playbook/pb_progress_step/_progress_step_item.jsx +2 -5
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +1 -0
- data/lib/playbook.rb +14 -8
- data/lib/playbook/classnames.rb +34 -0
- data/lib/playbook/engine.rb +4 -10
- data/lib/playbook/kit_base.rb +13 -1
- data/lib/playbook/kit_resolver.rb +23 -0
- data/lib/playbook/markdown.rb +4 -0
- data/lib/playbook/markdown/helper.rb +153 -0
- data/lib/playbook/pb_doc_helper.rb +89 -0
- data/lib/playbook/pb_kit_helper.rb +3 -24
- data/lib/playbook/props.rb +3 -118
- data/lib/playbook/spacing.rb +76 -0
- data/lib/playbook/version.rb +1 -1
- data/lib/playbook/z_index.rb +31 -0
- metadata +31 -25
- data/app/controllers/playbook/application_controller.rb +0 -15
- data/app/helpers/playbook/application_helper.rb +0 -30
- data/app/helpers/playbook/pb_doc_helper.rb +0 -206
- data/app/helpers/playbook/pb_sample_helper.rb +0 -64
- data/app/helpers/playbook/redcarpet_helper.rb +0 -151
- data/app/pb_kits/playbook/config/_kit_example.html.erb +0 -23
- data/app/pb_kits/playbook/config/_kit_samples_list.html.erb +0 -3
- data/app/pb_kits/playbook/config/_kit_ui.html.erb +0 -43
- data/app/pb_kits/playbook/config/_pb_kit_api.html.erb +0 -16
- data/app/pb_kits/playbook/pb_filter/_filter.html.erb +0 -6
- data/app/pb_kits/playbook/pb_filter/templates/_core.html.erb +0 -67
- data/app/pb_kits/playbook/pb_filter/templates/_default.html.erb +0 -23
- data/app/pb_kits/playbook/pb_form/_form_form_with.html.erb +0 -13
- data/app/pb_kits/playbook/pb_form/form/form_with_form.rb +0 -39
- data/app/pb_kits/playbook/pb_form/form/simple_form_form.rb +0 -46
- data/app/pb_kits/playbook/pb_form/form_builder/form_with_form_builder.rb +0 -11
- data/app/pb_kits/playbook/pb_form/form_builder/simple_form_builder.rb +0 -25
- data/app/pb_kits/playbook/pb_kit/base.rb +0 -99
@@ -1,23 +0,0 @@
|
|
1
|
-
<%if !@kit_examples[:examples].nil? %>
|
2
|
-
<% if @limit_examples %>
|
3
|
-
<% @kit_examples[:examples].each_with_index do |kit_example, index| %>
|
4
|
-
<% kit_example.each do |key, item| %>
|
5
|
-
<% if index == 0 %>
|
6
|
-
<%= pb_rails("card", props: { classname: "pb--doc", padding:"none" }) do %>
|
7
|
-
<%= render partial: "config/kit_ui", locals: { key: key, type: @type, item: item, show_code: @show_code } %>
|
8
|
-
<% end %>
|
9
|
-
<% elsif index > 0 %>
|
10
|
-
<% break %>
|
11
|
-
<% end %>
|
12
|
-
<% end %>
|
13
|
-
<% end %>
|
14
|
-
<% else %>
|
15
|
-
<% @kit_examples[:examples].each do |kit_example| %>
|
16
|
-
<% kit_example.each do |key, item| %>
|
17
|
-
<%= pb_rails("card", props: { classname: "pb--doc", padding:"none" }) do %>
|
18
|
-
<%= render partial: "config/kit_ui", locals: { key: key, type: @type, item: item, show_code: @show_code } %>
|
19
|
-
<% end %>
|
20
|
-
<% end %>
|
21
|
-
<% end %>
|
22
|
-
<% end %>
|
23
|
-
<% end %>
|
@@ -1,43 +0,0 @@
|
|
1
|
-
|
2
|
-
<% type ||= "rails" %>
|
3
|
-
|
4
|
-
<% if type == "react" %>
|
5
|
-
<% contents = File.read("#{Playbook::Engine.root}/app/pb_kits/playbook/pb_#{@kit_examples[:kit]}/docs/_#{key}.jsx") %>
|
6
|
-
<% else %>
|
7
|
-
<% contents = File.read("#{Playbook::Engine.root}/app/pb_kits/playbook/pb_#{@kit_examples[:kit]}/docs/_#{key}.html.erb") %>
|
8
|
-
<% end %>
|
9
|
-
|
10
|
-
<div class="pb--kit-example">
|
11
|
-
<%= pb_rails("caption", props: { text: item }) %>
|
12
|
-
<br>
|
13
|
-
<% if type == "rails" %>
|
14
|
-
<%= render partial: "pb_#{@kit_examples[:kit]}/docs/#{key}" %>
|
15
|
-
<% elsif type == "react" %>
|
16
|
-
<%= pb_react(key.camelize) %>
|
17
|
-
<% end %>
|
18
|
-
<br>
|
19
|
-
</div>
|
20
|
-
|
21
|
-
<% if @show_code %>
|
22
|
-
<div class="markdown pb--kit-example-markdown <%= cookies[:dark_mode] == "true" ? "dark" : "" %>">
|
23
|
-
<%= markdown(get_per_sample_descriptions(@kit_examples[:kit], key)) %>
|
24
|
-
</div>
|
25
|
-
<div id="code-wrapper">
|
26
|
-
<div class="pb--codeControls">
|
27
|
-
<ul>
|
28
|
-
<li>
|
29
|
-
<a href="#" id="toggle-open" data-toggle="code_example">Code Example</a>
|
30
|
-
</li>
|
31
|
-
</ul>
|
32
|
-
</div>
|
33
|
-
<div class="pb--codeCopy" data-action="toggle" data-togglable="code_example" style="display: none" >
|
34
|
-
<%= pb_rails("section_separator")%>
|
35
|
-
<a href="#" id="toggle-close" data-toggle="false" class="pb--close-toggle">Close</a>
|
36
|
-
<% if type == "rails" %>
|
37
|
-
<pre class="highlight"><%= raw rouge(contents, "erb") %></pre>
|
38
|
-
<% elsif type == "react" %>
|
39
|
-
<pre class="highlight"><%= raw rouge(contents, "react")%></pre>
|
40
|
-
<% end %>
|
41
|
-
</div>
|
42
|
-
</div>
|
43
|
-
<% end %>
|
@@ -1,16 +0,0 @@
|
|
1
|
-
<% if defined?(@kit_api) && @kit_api.present? %>
|
2
|
-
|
3
|
-
<div data-action="toggle" data-togglable="prop_example" class="pb--propsTable">
|
4
|
-
<%= pb_rails("title", props:{text: "Available Props", size:3, margin_bottom:"sm"}) %>
|
5
|
-
<%= pb_rails("card",props:{padding:"none"})do%>
|
6
|
-
<%= pb_rails("list",props: {xpadding:true})do%>
|
7
|
-
<% @kit_api.each_with_index do |(key,value),index| %>
|
8
|
-
<%= pb_rails("list/item") do %>
|
9
|
-
<%= key %>
|
10
|
-
<% end %>
|
11
|
-
<% end %>
|
12
|
-
<% end %>
|
13
|
-
<% end %>
|
14
|
-
</div>
|
15
|
-
|
16
|
-
<% end %>
|
@@ -1,67 +0,0 @@
|
|
1
|
-
|
2
|
-
<%= pb_rails("flex", props: {orientation: "row", padding_right: "lg", vertical: "center"}) do %>
|
3
|
-
|
4
|
-
<% if (object.template != "sort_only") %>
|
5
|
-
<%= pb_rails("circle_icon_button", props: { variant: "secondary", icon: "filter", id:"filter#{object.id}"}) %>
|
6
|
-
<div class="maskContainer">
|
7
|
-
<div class="filters">
|
8
|
-
<div class="left_gradient"></div>
|
9
|
-
<% object.filters.each do |filter| %>
|
10
|
-
<% if filter[:name]== "" %>
|
11
|
-
<div>
|
12
|
-
<%= pb_rails("body", props: {
|
13
|
-
color: "light",
|
14
|
-
padding_left: "xs",
|
15
|
-
size: 4,
|
16
|
-
tag:"h4",
|
17
|
-
text: "No Filter Selected"
|
18
|
-
}) %>
|
19
|
-
</div>
|
20
|
-
<% else %>
|
21
|
-
<div class="filter">
|
22
|
-
<%= pb_rails("caption", props: { text: filter[:name]}) %>
|
23
|
-
<%= pb_rails("title", props: { size: 4, tag:"h4", text: filter[:value]}) %>
|
24
|
-
</div>
|
25
|
-
<% end %>
|
26
|
-
<% end %>
|
27
|
-
<div class="right_gradient"></div>
|
28
|
-
</div>
|
29
|
-
</div>
|
30
|
-
<% if (object.template != "default") %>
|
31
|
-
<%= pb_rails("caption", props: {text: object.result_text, size:"xs", classname:"filter-results"})%>
|
32
|
-
<% end %>
|
33
|
-
<% end %>
|
34
|
-
|
35
|
-
<% if (object.template == "single" ) || (object.template == "sort_only") %>
|
36
|
-
<% unless object.sort_menu == [{}] %>
|
37
|
-
<%= pb_rails("button", props: {variant: "link",id: "sort-button#{object.id}",padding_right: "none"}) do %>
|
38
|
-
<% object.sort_menu.each do |item| %>
|
39
|
-
<% if item[:active] == true %>
|
40
|
-
<%= item[:item] %>
|
41
|
-
<%= pb_rails("icon", props: { icon: object.sort_icon(item[:direction]), fixed_width: true }) %>
|
42
|
-
<% end %>
|
43
|
-
<% end %>
|
44
|
-
<% end %>
|
45
|
-
<% end %>
|
46
|
-
<% end %>
|
47
|
-
|
48
|
-
|
49
|
-
<% end %>
|
50
|
-
|
51
|
-
<% if (object.template == "default")%>
|
52
|
-
<%= pb_rails("section_separator") %>
|
53
|
-
<%= pb_rails("flex", props: {orientation: "row", vertical: "center", spacing: "between", classname: "filter-bottom"}) do %>
|
54
|
-
<%= pb_rails("title_count", props: {title: "Results:",count: object.results, align:"center"}) %>
|
55
|
-
<%= pb_rails("flex", props: {orientation: "row", vertical: "center"}) do %>
|
56
|
-
<%= pb_rails("caption", props: { text: "sort by:"}) %>
|
57
|
-
<%= pb_rails("button", props: {variant: "link", padding_right: "none", id: "sort-button#{object.id}"}) do %>
|
58
|
-
<% object.sort_menu.each do |item| %>
|
59
|
-
<% if item[:active] == true %>
|
60
|
-
<%= item[:item] %>
|
61
|
-
<%= pb_rails("icon", props: { icon: object.sort_icon(item[:direction]), fixed_width: true }) %>
|
62
|
-
<% end %>
|
63
|
-
<% end %>
|
64
|
-
<% end %>
|
65
|
-
<% end %>
|
66
|
-
<% end %>
|
67
|
-
<% end %>
|
@@ -1,23 +0,0 @@
|
|
1
|
-
<% if object.background %>
|
2
|
-
<%= pb_rails("card",props: {padding:"none"}) do%>
|
3
|
-
<%= render partial: 'pb_filter/templates/core', locals: {object: object} %>
|
4
|
-
<% end %>
|
5
|
-
<% else %>
|
6
|
-
<%= render partial: 'pb_filter/templates/core', locals: { object: object} %>
|
7
|
-
<% end %>
|
8
|
-
|
9
|
-
<% if object.template != "sort_only"%>
|
10
|
-
<%= pb_rails("popover", props: {min_width: object.min_width, close_on_click: "outside", trigger_element_id: "filter#{object.id}", tooltip_id: "filter-form#{object.id}", position: 'bottom'}) do %>
|
11
|
-
<%= capture(&object.children) %>
|
12
|
-
<% end %>
|
13
|
-
<%end%>
|
14
|
-
|
15
|
-
<% if object.template != "filter_only"%>
|
16
|
-
<%= pb_rails("popover", props: {classname: "pb_filter_sort_menu", close_on_click: "outside", trigger_element_id: "sort-button#{object.id}", tooltip_id: "sort-filter-btn-tooltip#{object.id}", position: 'bottom', padding: 'none'}) do %>
|
17
|
-
<%= pb_rails("list") do %>
|
18
|
-
<% object.sort_menu.each do |item| %>
|
19
|
-
<%= pb_rails("list/item") do%> <%= pb_rails("button", props: {variant: "link" ,classname: "p-0", text: item[:item], link: item[:link]}) %><% end %>
|
20
|
-
<% end %>
|
21
|
-
<% end %>
|
22
|
-
<% end %>
|
23
|
-
<% end %>
|
@@ -1,13 +0,0 @@
|
|
1
|
-
<%= form_with object.merged_form_system_options do |form| %>
|
2
|
-
<% instance_exec form, &object.children %>
|
3
|
-
|
4
|
-
<% if object.validate %>
|
5
|
-
<% content_for :pb_js do %>
|
6
|
-
<%= javascript_tag do %>
|
7
|
-
window.addEventListener('DOMContentLoaded', function() {
|
8
|
-
PbFormValidation.start()
|
9
|
-
})
|
10
|
-
<% end %>
|
11
|
-
<% end %>
|
12
|
-
<% end %>
|
13
|
-
<% end %>
|
@@ -1,39 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
module Playbook
|
4
|
-
module PbForm
|
5
|
-
class Form
|
6
|
-
class FormWithForm
|
7
|
-
def initialize(form)
|
8
|
-
self.form = form
|
9
|
-
end
|
10
|
-
|
11
|
-
def to_partial_path
|
12
|
-
"pb_form/form_form_with"
|
13
|
-
end
|
14
|
-
|
15
|
-
def merged_form_system_options
|
16
|
-
Hash(form_system_options).merge(
|
17
|
-
class: merged_class,
|
18
|
-
data: { "pb-form-validation": validate }.merge(Hash(form_system_options).fetch(:data, {})),
|
19
|
-
builder: form_builder
|
20
|
-
)
|
21
|
-
end
|
22
|
-
|
23
|
-
private
|
24
|
-
|
25
|
-
attr_accessor :form
|
26
|
-
|
27
|
-
delegate_missing_to :form
|
28
|
-
|
29
|
-
def merged_class
|
30
|
-
"pb-form #{Hash(form_system_options)[:class]}".strip
|
31
|
-
end
|
32
|
-
|
33
|
-
def form_builder
|
34
|
-
FormBuilder::FormWithFormBuilder
|
35
|
-
end
|
36
|
-
end
|
37
|
-
end
|
38
|
-
end
|
39
|
-
end
|
@@ -1,46 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
module Playbook
|
4
|
-
module PbForm
|
5
|
-
class Form
|
6
|
-
class SimpleFormForm
|
7
|
-
def initialize(form)
|
8
|
-
self.form = form
|
9
|
-
end
|
10
|
-
|
11
|
-
def to_partial_path
|
12
|
-
"pb_form/form_simple_form"
|
13
|
-
end
|
14
|
-
|
15
|
-
def merged_form_system_options
|
16
|
-
[
|
17
|
-
Array(form_system_options)[0],
|
18
|
-
Hash(Array(form_system_options)[1]).merge(
|
19
|
-
data: { "pb-form-validation": validate }.merge((form_system_options&.last || {}).fetch(:data, {})),
|
20
|
-
html: merged_html,
|
21
|
-
builder: form_builder
|
22
|
-
),
|
23
|
-
]
|
24
|
-
end
|
25
|
-
|
26
|
-
private
|
27
|
-
|
28
|
-
attr_accessor :form
|
29
|
-
|
30
|
-
delegate_missing_to :form
|
31
|
-
|
32
|
-
def merged_html
|
33
|
-
html_options = Hash(Array(form_system_options)[1])[:html] || {}
|
34
|
-
html_class = html_options[:class]
|
35
|
-
html_options[:class] = "pb-form #{html_class}".strip
|
36
|
-
|
37
|
-
html_options
|
38
|
-
end
|
39
|
-
|
40
|
-
def form_builder
|
41
|
-
FormBuilder::SimpleFormBuilder
|
42
|
-
end
|
43
|
-
end
|
44
|
-
end
|
45
|
-
end
|
46
|
-
end
|
@@ -1,25 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
if defined?(SimpleForm)
|
4
|
-
module Playbook
|
5
|
-
module PbForm
|
6
|
-
module FormBuilder
|
7
|
-
class SimpleFormBuilder < SimpleForm::FormBuilder
|
8
|
-
include FormBuilder
|
9
|
-
|
10
|
-
def input(attribute_name, options = {}, &block)
|
11
|
-
super(
|
12
|
-
attribute_name,
|
13
|
-
options.deep_merge(label: false, input_html: {
|
14
|
-
props: {
|
15
|
-
label: true,
|
16
|
-
},
|
17
|
-
}),
|
18
|
-
&block
|
19
|
-
)
|
20
|
-
end
|
21
|
-
end
|
22
|
-
end
|
23
|
-
end
|
24
|
-
end
|
25
|
-
end
|
@@ -1,99 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
module Playbook
|
4
|
-
module PbKit
|
5
|
-
class Base
|
6
|
-
#============= Default props =============
|
7
|
-
def aria(ui_aria = {})
|
8
|
-
merge_value(configured_aria, ui_aria)
|
9
|
-
end
|
10
|
-
|
11
|
-
def classname(ui_classes = "")
|
12
|
-
concat_value(configured_classname, ui_classes)
|
13
|
-
end
|
14
|
-
|
15
|
-
def data(ui_data = {})
|
16
|
-
merge_value(configured_data, ui_data)
|
17
|
-
end
|
18
|
-
|
19
|
-
def id(ui_id = nil)
|
20
|
-
default_value(configured_id, ui_id)
|
21
|
-
end
|
22
|
-
|
23
|
-
#============= Type checking =============
|
24
|
-
def is_true?(value)
|
25
|
-
is_boolean?(value) && value == true
|
26
|
-
end
|
27
|
-
|
28
|
-
def is_string?(value)
|
29
|
-
value.is_a? String
|
30
|
-
end
|
31
|
-
|
32
|
-
def is_integer?(value)
|
33
|
-
value.is_a? Integer
|
34
|
-
end
|
35
|
-
|
36
|
-
def is_boolean?(value)
|
37
|
-
[true, false].include? value
|
38
|
-
end
|
39
|
-
|
40
|
-
def one_of?(value, options = [])
|
41
|
-
options.include? value
|
42
|
-
end
|
43
|
-
|
44
|
-
def is_set?(value)
|
45
|
-
value != default_configuration
|
46
|
-
end
|
47
|
-
|
48
|
-
#============= Default value =============
|
49
|
-
def default_value(value, default_value)
|
50
|
-
is_set?(value) ? value : default_value
|
51
|
-
end
|
52
|
-
|
53
|
-
def adjusted_value(value, adjusted_value, default_value)
|
54
|
-
is_set?(value) ? adjusted_value : default_value
|
55
|
-
end
|
56
|
-
|
57
|
-
def concat_value(value, value2)
|
58
|
-
is_set?(value) ? value2 + " " + value : value2
|
59
|
-
end
|
60
|
-
|
61
|
-
def merge_value(value, value2)
|
62
|
-
value2 ||= {}
|
63
|
-
is_set?(value) ? value.merge(value2) : value2
|
64
|
-
end
|
65
|
-
|
66
|
-
def one_of_value(value, options = [], default = "")
|
67
|
-
if is_set?(value)
|
68
|
-
options.include?(value) ? value : default
|
69
|
-
else
|
70
|
-
default
|
71
|
-
end
|
72
|
-
end
|
73
|
-
|
74
|
-
def true_value(value, true_value = "", false_value = "")
|
75
|
-
if is_set?(value)
|
76
|
-
is_true?(value) ? true_value : false_value
|
77
|
-
else
|
78
|
-
false_value
|
79
|
-
end
|
80
|
-
end
|
81
|
-
|
82
|
-
def false_value(value, false_value = "", true_value = "")
|
83
|
-
if is_set?(value)
|
84
|
-
is_true?(value) ? true_value : false_value
|
85
|
-
else
|
86
|
-
false_value
|
87
|
-
end
|
88
|
-
end
|
89
|
-
|
90
|
-
private
|
91
|
-
|
92
|
-
DEFAULT = Object.new
|
93
|
-
private_constant :DEFAULT
|
94
|
-
def default_configuration
|
95
|
-
DEFAULT
|
96
|
-
end
|
97
|
-
end
|
98
|
-
end
|
99
|
-
end
|