playbook_ui 10.16.0 → 10.19.0.pre.popover.alpha1
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/_playbook.scss +4 -0
- data/app/pb_kits/playbook/pb_background/background.test.js +22 -0
- data/app/pb_kits/playbook/pb_bar_graph/_bar_graph.jsx +3 -0
- data/app/pb_kits/playbook/pb_bar_graph/bar_graph.rb +3 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.html.erb +26 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.jsx +37 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.md +2 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_body/_body.jsx +1 -1
- data/app/pb_kits/playbook/pb_body/_body_mixins.scss +2 -1
- data/app/pb_kits/playbook/pb_body/body.rb +1 -1
- data/app/pb_kits/playbook/pb_body/body.test.js +29 -0
- data/app/pb_kits/playbook/pb_body/docs/_body_light.html.erb +5 -0
- data/app/pb_kits/playbook/pb_body/docs/_body_light.jsx +5 -0
- data/app/pb_kits/playbook/pb_body/docs/_body_light.md +6 -0
- data/app/pb_kits/playbook/pb_button/_button.jsx +3 -3
- data/app/pb_kits/playbook/pb_button/_button.scss +17 -0
- data/app/pb_kits/playbook/pb_button/button.rb +6 -3
- data/app/pb_kits/playbook/pb_button/button.test.js +13 -0
- data/app/pb_kits/playbook/pb_button/docs/_button_size.html.erb +3 -0
- data/app/pb_kits/playbook/pb_button/docs/_button_size.jsx +26 -0
- data/app/pb_kits/playbook/pb_button/docs/_button_size.md +1 -0
- data/app/pb_kits/playbook/pb_button/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_button/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_caption/_caption.jsx +21 -8
- data/app/pb_kits/playbook/pb_caption/_caption.scss +14 -8
- data/app/pb_kits/playbook/pb_caption/_caption_mixin.scss +27 -0
- data/app/pb_kits/playbook/pb_caption/caption.rb +6 -4
- data/app/pb_kits/playbook/pb_caption/caption.test.js +29 -0
- data/app/pb_kits/playbook/pb_caption/docs/_caption_colors.html.erb +3 -0
- data/app/pb_kits/playbook/pb_caption/docs/_caption_colors.jsx +25 -0
- data/app/pb_kits/playbook/pb_caption/docs/_caption_colors.md +6 -0
- data/app/pb_kits/playbook/pb_caption/docs/example.yml +7 -4
- data/app/pb_kits/playbook/pb_caption/docs/index.js +1 -1
- data/app/pb_kits/playbook/pb_card/_card.jsx +1 -3
- data/app/pb_kits/playbook/pb_card/_card.scss +0 -6
- data/app/pb_kits/playbook/pb_card/_card_mixin.scss +1 -8
- data/app/pb_kits/playbook/pb_card/card.html.erb +2 -0
- data/app/pb_kits/playbook/pb_card/card.rb +0 -8
- data/app/pb_kits/playbook/pb_card/docs/_card_background.html.erb +1 -1
- data/app/pb_kits/playbook/pb_card/docs/_card_content.html.erb +3 -1
- data/app/pb_kits/playbook/pb_card/docs/_card_content.jsx +9 -2
- data/app/pb_kits/playbook/pb_circle_chart/circle_chart.rb +4 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.md +2 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.md +3 -1
- data/app/pb_kits/playbook/pb_date_time_stacked/date_time_stacked.test.js +13 -4
- data/app/pb_kits/playbook/pb_docs/kit_example.rb +4 -0
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/fixed_confirmation_toast.rb +4 -0
- data/app/pb_kits/playbook/pb_flex/_flex.jsx +4 -0
- data/app/pb_kits/playbook/pb_flex/_flex.scss +17 -1
- data/app/pb_kits/playbook/pb_flex/_flex_item.jsx +6 -2
- data/app/pb_kits/playbook/pb_flex/_flex_item.scss +22 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item.html.erb +12 -1
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item.md +2 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.html.erb +89 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.jsx +210 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.md +5 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item_example.jsx +27 -0
- data/app/pb_kits/playbook/pb_flex/docs/_flex_item_example.md +2 -0
- data/app/pb_kits/playbook/pb_flex/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_flex/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_flex/flex.rb +14 -1
- data/app/pb_kits/playbook/pb_flex/flex_item.rb +16 -1
- data/app/pb_kits/playbook/pb_gauge/_gauge.jsx +3 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.html.erb +12 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx +19 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.md +2 -0
- data/app/pb_kits/playbook/pb_gauge/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_gauge/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_gauge/gauge.rb +2 -0
- data/app/pb_kits/playbook/pb_icon/icon.rb +4 -0
- data/app/pb_kits/playbook/pb_icon_circle/_icon_circle.scss +2 -2
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.html.erb +1 -1
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.jsx +1 -1
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.md +1 -0
- data/app/pb_kits/playbook/pb_icon_circle/icon_circle.rb +1 -1
- data/app/pb_kits/playbook/pb_icon_stat_value/icon_stat_value.rb +2 -0
- data/app/pb_kits/playbook/pb_image/_image.jsx +4 -1
- data/app/pb_kits/playbook/pb_image/_image.scss +24 -8
- data/app/pb_kits/playbook/pb_image/docs/_transition_image.html.erb +54 -0
- data/app/pb_kits/playbook/pb_image/docs/_transition_image.jsx +77 -0
- data/app/pb_kits/playbook/pb_image/docs/_transition_image.md +1 -0
- data/app/pb_kits/playbook/pb_image/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_image/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_image/image.html.erb +1 -1
- data/app/pb_kits/playbook/pb_image/image.rb +8 -1
- data/app/pb_kits/playbook/pb_image/image.test.js +9 -4
- data/app/pb_kits/playbook/pb_line_graph/_line_graph.jsx +4 -1
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.html.erb +26 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.jsx +37 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.md +2 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_line_graph/line_graph.rb +3 -0
- data/app/pb_kits/playbook/pb_list/list.rb +2 -0
- data/app/pb_kits/playbook/pb_nav/_bold_mixin.scss +22 -0
- data/app/pb_kits/playbook/pb_nav/_horizontal_nav.scss +17 -1
- data/app/pb_kits/playbook/pb_nav/_vertical_nav.scss +9 -2
- data/app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.html.erb +6 -0
- data/app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.jsx +39 -0
- data/app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.html.erb +6 -0
- data/app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.jsx +39 -0
- data/app/pb_kits/playbook/pb_nav/docs/_horizontal_nav.html.erb +1 -1
- data/app/pb_kits/playbook/pb_nav/docs/_subtle_nav.html.erb +1 -1
- data/app/pb_kits/playbook/pb_nav/docs/example.yml +4 -0
- data/app/pb_kits/playbook/pb_nav/docs/index.js +2 -0
- data/app/pb_kits/playbook/pb_nav/nav.rb +1 -1
- data/app/pb_kits/playbook/pb_popover/_popover.jsx +2 -4
- data/app/pb_kits/playbook/pb_popover/docs/_popover_close.html.erb +7 -7
- data/app/pb_kits/playbook/pb_popover/docs/_popover_scroll_height.jsx +3 -0
- data/app/pb_kits/playbook/pb_popover/docs/_popover_z_index.jsx +1 -0
- data/app/pb_kits/playbook/pb_popover/index.js +4 -9
- data/app/pb_kits/playbook/pb_popover/popover.html.erb +1 -1
- data/app/pb_kits/playbook/pb_select/select.rb +3 -0
- data/app/pb_kits/playbook/pb_source/source.rb +3 -0
- data/app/pb_kits/playbook/pb_text_input/_text_input.scss +63 -14
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_error.html.erb +21 -2
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_error.jsx +12 -3
- data/app/pb_kits/playbook/pb_text_input/text_input.rb +2 -0
- data/app/pb_kits/playbook/pb_title/_title.jsx +6 -4
- data/app/pb_kits/playbook/pb_title/_title.scss +5 -5
- data/app/pb_kits/playbook/pb_title/_title_mixin.scss +17 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_colors.html.erb +4 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_colors.jsx +37 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_colors.md +6 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_light.html.erb +4 -1
- data/app/pb_kits/playbook/pb_title/docs/_title_light.md +3 -0
- data/app/pb_kits/playbook/pb_title/docs/example.yml +2 -2
- data/app/pb_kits/playbook/pb_title/docs/index.js +1 -1
- data/app/pb_kits/playbook/pb_title/title.html.erb +4 -2
- data/app/pb_kits/playbook/pb_title/title.rb +5 -4
- data/app/pb_kits/playbook/pb_title/title.test.js +29 -0
- data/app/pb_kits/playbook/plugins/pb_chart.js +16 -24
- data/app/pb_kits/playbook/tokens/_colors.scss +3 -1
- data/app/pb_kits/playbook/utilities/_cursor.scss +3 -0
- data/app/pb_kits/playbook/utilities/_display.scss +23 -0
- data/app/pb_kits/playbook/utilities/_line_height.scss +11 -0
- data/app/pb_kits/playbook/utilities/_shadow.scss +11 -0
- data/app/pb_kits/playbook/utilities/globalProps.js +25 -1
- data/lib/playbook/classnames.rb +4 -0
- data/lib/playbook/cursor.rb +29 -0
- data/lib/playbook/display.rb +29 -0
- data/lib/playbook/engine.rb +0 -1
- data/lib/playbook/kit_base.rb +8 -0
- data/lib/playbook/line_height.rb +29 -0
- data/lib/playbook/markdown/helper.rb +2 -2
- data/lib/playbook/pb_doc_helper.rb +4 -0
- data/lib/playbook/props/base.rb +2 -2
- data/lib/playbook/shadow.rb +29 -0
- data/lib/playbook/version.rb +2 -2
- data/lib/playbook.rb +3 -0
- metadata +62 -23
- data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.html.erb +0 -1
- data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.jsx +0 -17
- data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.md +0 -3
- data/app/pb_kits/playbook/pb_title/docs/_title_variants.html.erb +0 -1
- data/app/pb_kits/playbook/pb_title/docs/_title_variants.jsx +0 -19
- data/app/pb_kits/playbook/pb_title/docs/_title_variants.md +0 -3
@@ -57,10 +57,34 @@ const zIndexProps = ({ zIndex }) => {
|
|
57
57
|
return css
|
58
58
|
}
|
59
59
|
|
60
|
+
const shadowProps = ({ shadow }) => {
|
61
|
+
let css = ''
|
62
|
+
css += shadow ? `shadow_${shadow} ` : ''
|
63
|
+
return css
|
64
|
+
}
|
65
|
+
|
66
|
+
const lineHeightProps = ({ lineHeight }) => {
|
67
|
+
let css = ''
|
68
|
+
css += lineHeight ? `line_height_${lineHeight} ` : ''
|
69
|
+
return css
|
70
|
+
}
|
71
|
+
|
72
|
+
const displayProps = ({ display }) => {
|
73
|
+
let css = ''
|
74
|
+
css += display ? `display_${display} ` : ''
|
75
|
+
return css
|
76
|
+
}
|
77
|
+
|
78
|
+
const cursorProps = ({ cursor }) => {
|
79
|
+
let css = ''
|
80
|
+
css += cursor ? `cursor_${cursor} ` : ''
|
81
|
+
return css
|
82
|
+
}
|
83
|
+
|
60
84
|
// All Exported as a single function
|
61
85
|
export const globalProps = (props, defaultProps = {}) => {
|
62
86
|
const allProps = { ...props, ...defaultProps }
|
63
|
-
return spacingProps(allProps) + darkProps(allProps) + maxWidthProps(allProps) + zIndexProps(allProps) + numberSpacingProps(allProps)
|
87
|
+
return spacingProps(allProps) + darkProps(allProps) + maxWidthProps(allProps) + zIndexProps(allProps) + numberSpacingProps(allProps) + shadowProps(allProps) + lineHeightProps(allProps) + cursorProps(allProps) + displayProps(allProps)
|
64
88
|
}
|
65
89
|
|
66
90
|
export const deprecatedProps = (kit, props = []) => {
|
data/lib/playbook/classnames.rb
CHANGED
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module Cursor
|
5
|
+
def self.included(base)
|
6
|
+
base.prop :cursor
|
7
|
+
end
|
8
|
+
|
9
|
+
def cursor_props
|
10
|
+
selected_props = cursor_options.keys.select { |sk| try(sk) }
|
11
|
+
return nil unless selected_props.present?
|
12
|
+
|
13
|
+
selected_props.map do |k|
|
14
|
+
cursor_value = send(k)
|
15
|
+
"cursor_#{cursor_value}" if cursor_values.include? cursor_value
|
16
|
+
end.compact.join(" ")
|
17
|
+
end
|
18
|
+
|
19
|
+
def cursor_options
|
20
|
+
{
|
21
|
+
cursor: "cursor",
|
22
|
+
}
|
23
|
+
end
|
24
|
+
|
25
|
+
def cursor_values
|
26
|
+
%w[pointer]
|
27
|
+
end
|
28
|
+
end
|
29
|
+
end
|
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module Display
|
5
|
+
def self.included(base)
|
6
|
+
base.prop :display
|
7
|
+
end
|
8
|
+
|
9
|
+
def display_props
|
10
|
+
selected_props = display_options.keys.select { |sk| try(sk) }
|
11
|
+
return nil unless selected_props.present?
|
12
|
+
|
13
|
+
selected_props.map do |k|
|
14
|
+
display_value = send(k)
|
15
|
+
"display_#{display_value}" if display_values.include? display_value
|
16
|
+
end.compact.join(" ")
|
17
|
+
end
|
18
|
+
|
19
|
+
def display_options
|
20
|
+
{
|
21
|
+
display: "display",
|
22
|
+
}
|
23
|
+
end
|
24
|
+
|
25
|
+
def display_values
|
26
|
+
%w[block inline_block inline flex inline_flex hidden]
|
27
|
+
end
|
28
|
+
end
|
29
|
+
end
|
data/lib/playbook/engine.rb
CHANGED
data/lib/playbook/kit_base.rb
CHANGED
@@ -4,6 +4,10 @@ require "playbook/classnames"
|
|
4
4
|
require "playbook/spacing"
|
5
5
|
require "playbook/z_index"
|
6
6
|
require "playbook/number_spacing"
|
7
|
+
require "playbook/shadow"
|
8
|
+
require "playbook/line_height"
|
9
|
+
require "playbook/display"
|
10
|
+
require "playbook/cursor"
|
7
11
|
|
8
12
|
module Playbook
|
9
13
|
class KitBase < ViewComponent::Base
|
@@ -13,6 +17,10 @@ module Playbook
|
|
13
17
|
include Playbook::Spacing
|
14
18
|
include Playbook::ZIndex
|
15
19
|
include Playbook::NumberSpacing
|
20
|
+
include Playbook::Shadow
|
21
|
+
include Playbook::LineHeight
|
22
|
+
include Playbook::Display
|
23
|
+
include Playbook::Cursor
|
16
24
|
|
17
25
|
prop :id
|
18
26
|
prop :data, type: Playbook::Props::Hash, default: {}
|
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module LineHeight
|
5
|
+
def self.included(base)
|
6
|
+
base.prop :line_height
|
7
|
+
end
|
8
|
+
|
9
|
+
def line_height_props
|
10
|
+
selected_props = line_height_options.keys.select { |sk| try(sk) }
|
11
|
+
return nil unless selected_props.present?
|
12
|
+
|
13
|
+
selected_props.map do |k|
|
14
|
+
line_height_value = send(k)
|
15
|
+
"line_height_#{line_height_value}" if line_height_values.include? line_height_value
|
16
|
+
end.compact.join(" ")
|
17
|
+
end
|
18
|
+
|
19
|
+
def line_height_options
|
20
|
+
{
|
21
|
+
line_height: "line_height",
|
22
|
+
}
|
23
|
+
end
|
24
|
+
|
25
|
+
def line_height_values
|
26
|
+
%w[tightest tighter tight normal loose looser loosest]
|
27
|
+
end
|
28
|
+
end
|
29
|
+
end
|
@@ -80,7 +80,7 @@ module Playbook
|
|
80
80
|
loop do
|
81
81
|
break unless @headers.include?(permalink)
|
82
82
|
|
83
|
-
permalink.gsub!(
|
83
|
+
permalink.gsub!(/_(\d+)$/, "_#{Regexp.last_match(1).to_i + 1}")
|
84
84
|
end
|
85
85
|
end
|
86
86
|
@headers << permalink
|
@@ -121,7 +121,7 @@ module Playbook
|
|
121
121
|
if @list_items[0].include?("[do]") || @list_items[0].include?("[dont]")
|
122
122
|
@element_items = []
|
123
123
|
@list_items.each do |item, _index|
|
124
|
-
item.gsub(%r{
|
124
|
+
item.gsub(%r{<li>(.*)</li>}) do
|
125
125
|
@element_items.push(Regexp.last_match(1))
|
126
126
|
end
|
127
127
|
end
|
@@ -26,6 +26,7 @@ module Playbook
|
|
26
26
|
end
|
27
27
|
|
28
28
|
# Deal with lists of kits, used in Playbook doc and Externally
|
29
|
+
# rubocop:disable Style/StringConcatenation
|
29
30
|
def pb_kits(type: "rails", limit_examples: false, dark_mode: false)
|
30
31
|
display_kits = []
|
31
32
|
kits = get_kits
|
@@ -40,6 +41,7 @@ module Playbook
|
|
40
41
|
end
|
41
42
|
raw("<div class='pb--docItem'>" + display_kits.join("</div><div class='pb--docItem'>") + "</div>")
|
42
43
|
end
|
44
|
+
# rubocop:enable Style/StringConcatenation
|
43
45
|
|
44
46
|
# rubocop:disable Naming/AccessorMethodName
|
45
47
|
def get_kits
|
@@ -48,12 +50,14 @@ module Playbook
|
|
48
50
|
end
|
49
51
|
# rubocop:enable Naming/AccessorMethodName
|
50
52
|
|
53
|
+
# rubocop:disable Style/OptionalBooleanParameter
|
51
54
|
def render_pb_doc_kit(kit, type, limit_examples, code = true, dark_mode = false)
|
52
55
|
title = pb_doc_render_clickable_title(kit, type)
|
53
56
|
ui = raw("<div class='pb--docItem-ui'>
|
54
57
|
#{pb_kit(kit: kit, type: type, show_code: code, limit_examples: limit_examples, dark_mode: dark_mode)}</div>")
|
55
58
|
title + ui
|
56
59
|
end
|
60
|
+
# rubocop:enable Style/OptionalBooleanParameter
|
57
61
|
|
58
62
|
private
|
59
63
|
|
data/lib/playbook/props/base.rb
CHANGED
@@ -7,7 +7,7 @@ module Playbook
|
|
7
7
|
class Base
|
8
8
|
attr_reader :default, :deprecated, :required, :name, :kit
|
9
9
|
|
10
|
-
def initialize(default: nil, deprecated: false, required: false
|
10
|
+
def initialize(name:, kit:, default: nil, deprecated: false, required: false)
|
11
11
|
@default = default
|
12
12
|
@deprecated = deprecated
|
13
13
|
@required = required
|
@@ -39,7 +39,7 @@ module Playbook
|
|
39
39
|
end
|
40
40
|
|
41
41
|
def log(message)
|
42
|
-
logger = ActiveSupport::Logger.new(
|
42
|
+
logger = ActiveSupport::Logger.new($stdout)
|
43
43
|
@logger ||= ActiveSupport::TaggedLogging.new(logger)
|
44
44
|
@logger.log(0, message)
|
45
45
|
end
|
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module Shadow
|
5
|
+
def self.included(base)
|
6
|
+
base.prop :shadow
|
7
|
+
end
|
8
|
+
|
9
|
+
def shadow_props
|
10
|
+
selected_props = shadow_options.keys.select { |sk| try(sk) }
|
11
|
+
return nil unless selected_props.present?
|
12
|
+
|
13
|
+
selected_props.map do |k|
|
14
|
+
shadow_value = send(k)
|
15
|
+
"shadow_#{shadow_value}" if shadow_values.include? shadow_value
|
16
|
+
end.compact.join(" ")
|
17
|
+
end
|
18
|
+
|
19
|
+
def shadow_options
|
20
|
+
{
|
21
|
+
shadow: "shadow",
|
22
|
+
}
|
23
|
+
end
|
24
|
+
|
25
|
+
def shadow_values
|
26
|
+
%w[none deep deeper deepest]
|
27
|
+
end
|
28
|
+
end
|
29
|
+
end
|
data/lib/playbook/version.rb
CHANGED
data/lib/playbook.rb
CHANGED
@@ -1,5 +1,7 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
|
+
require "view_component"
|
4
|
+
|
3
5
|
require "playbook/version"
|
4
6
|
require "playbook/engine"
|
5
7
|
require "playbook/props"
|
@@ -15,6 +17,7 @@ module Playbook
|
|
15
17
|
ROOT_PATH = Pathname.new(File.join(__dir__, ".."))
|
16
18
|
|
17
19
|
class ConflictingPropsError < StandardError; end
|
20
|
+
|
18
21
|
class MissingPropError < StandardError; end
|
19
22
|
|
20
23
|
module_function
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: playbook_ui
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 10.
|
4
|
+
version: 10.19.0.pre.popover.alpha1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Power UX
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date:
|
12
|
+
date: 2022-01-24 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -101,14 +101,14 @@ dependencies:
|
|
101
101
|
requirements:
|
102
102
|
- - "~>"
|
103
103
|
- !ruby/object:Gem::Version
|
104
|
-
version: '2.
|
104
|
+
version: '2.47'
|
105
105
|
type: :runtime
|
106
106
|
prerelease: false
|
107
107
|
version_requirements: !ruby/object:Gem::Requirement
|
108
108
|
requirements:
|
109
109
|
- - "~>"
|
110
110
|
- !ruby/object:Gem::Version
|
111
|
-
version: '2.
|
111
|
+
version: '2.47'
|
112
112
|
- !ruby/object:Gem::Dependency
|
113
113
|
name: webpacker-react
|
114
114
|
requirement: !ruby/object:Gem::Requirement
|
@@ -183,50 +183,50 @@ dependencies:
|
|
183
183
|
name: rspec-rails
|
184
184
|
requirement: !ruby/object:Gem::Requirement
|
185
185
|
requirements:
|
186
|
-
- - ">="
|
187
|
-
- !ruby/object:Gem::Version
|
188
|
-
version: 3.8.0
|
189
186
|
- - "~>"
|
190
187
|
- !ruby/object:Gem::Version
|
191
188
|
version: '3.8'
|
189
|
+
- - ">="
|
190
|
+
- !ruby/object:Gem::Version
|
191
|
+
version: 3.8.0
|
192
192
|
type: :development
|
193
193
|
prerelease: false
|
194
194
|
version_requirements: !ruby/object:Gem::Requirement
|
195
195
|
requirements:
|
196
|
-
- - ">="
|
197
|
-
- !ruby/object:Gem::Version
|
198
|
-
version: 3.8.0
|
199
196
|
- - "~>"
|
200
197
|
- !ruby/object:Gem::Version
|
201
198
|
version: '3.8'
|
199
|
+
- - ">="
|
200
|
+
- !ruby/object:Gem::Version
|
201
|
+
version: 3.8.0
|
202
202
|
- !ruby/object:Gem::Dependency
|
203
203
|
name: rubocop
|
204
204
|
requirement: !ruby/object:Gem::Requirement
|
205
205
|
requirements:
|
206
206
|
- - '='
|
207
207
|
- !ruby/object:Gem::Version
|
208
|
-
version:
|
208
|
+
version: 1.20.0
|
209
209
|
type: :development
|
210
210
|
prerelease: false
|
211
211
|
version_requirements: !ruby/object:Gem::Requirement
|
212
212
|
requirements:
|
213
213
|
- - '='
|
214
214
|
- !ruby/object:Gem::Version
|
215
|
-
version:
|
215
|
+
version: 1.20.0
|
216
216
|
- !ruby/object:Gem::Dependency
|
217
217
|
name: rubocop-performance
|
218
218
|
requirement: !ruby/object:Gem::Requirement
|
219
219
|
requirements:
|
220
220
|
- - "~>"
|
221
221
|
- !ruby/object:Gem::Version
|
222
|
-
version: 1.
|
222
|
+
version: 1.11.5
|
223
223
|
type: :development
|
224
224
|
prerelease: false
|
225
225
|
version_requirements: !ruby/object:Gem::Requirement
|
226
226
|
requirements:
|
227
227
|
- - "~>"
|
228
228
|
- !ruby/object:Gem::Version
|
229
|
-
version: 1.
|
229
|
+
version: 1.11.5
|
230
230
|
- !ruby/object:Gem::Dependency
|
231
231
|
name: spring
|
232
232
|
requirement: !ruby/object:Gem::Requirement
|
@@ -322,6 +322,7 @@ files:
|
|
322
322
|
- app/pb_kits/playbook/pb_background/_background.scss
|
323
323
|
- app/pb_kits/playbook/pb_background/background.html.erb
|
324
324
|
- app/pb_kits/playbook/pb_background/background.rb
|
325
|
+
- app/pb_kits/playbook/pb_background/background.test.js
|
325
326
|
- app/pb_kits/playbook/pb_background/docs/_background_category.html.erb
|
326
327
|
- app/pb_kits/playbook/pb_background/docs/_background_category.jsx
|
327
328
|
- app/pb_kits/playbook/pb_background/docs/_background_category.md
|
@@ -357,6 +358,9 @@ files:
|
|
357
358
|
- app/pb_kits/playbook/pb_bar_graph/barGraphSettings.js
|
358
359
|
- app/pb_kits/playbook/pb_bar_graph/bar_graph.html.erb
|
359
360
|
- app/pb_kits/playbook/pb_bar_graph/bar_graph.rb
|
361
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.html.erb
|
362
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.jsx
|
363
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.md
|
360
364
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.html.erb
|
361
365
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.jsx
|
362
366
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.html.erb
|
@@ -376,10 +380,12 @@ files:
|
|
376
380
|
- app/pb_kits/playbook/pb_body/_body_mixins.scss
|
377
381
|
- app/pb_kits/playbook/pb_body/body.html.erb
|
378
382
|
- app/pb_kits/playbook/pb_body/body.rb
|
383
|
+
- app/pb_kits/playbook/pb_body/body.test.js
|
379
384
|
- app/pb_kits/playbook/pb_body/docs/_body_block.html.erb
|
380
385
|
- app/pb_kits/playbook/pb_body/docs/_body_block.jsx
|
381
386
|
- app/pb_kits/playbook/pb_body/docs/_body_light.html.erb
|
382
387
|
- app/pb_kits/playbook/pb_body/docs/_body_light.jsx
|
388
|
+
- app/pb_kits/playbook/pb_body/docs/_body_light.md
|
383
389
|
- app/pb_kits/playbook/pb_body/docs/_description.md
|
384
390
|
- app/pb_kits/playbook/pb_body/docs/_footer.md
|
385
391
|
- app/pb_kits/playbook/pb_body/docs/example.yml
|
@@ -420,6 +426,9 @@ files:
|
|
420
426
|
- app/pb_kits/playbook/pb_button/docs/_button_loading.md
|
421
427
|
- app/pb_kits/playbook/pb_button/docs/_button_options.html.erb
|
422
428
|
- app/pb_kits/playbook/pb_button/docs/_button_options.jsx
|
429
|
+
- app/pb_kits/playbook/pb_button/docs/_button_size.html.erb
|
430
|
+
- app/pb_kits/playbook/pb_button/docs/_button_size.jsx
|
431
|
+
- app/pb_kits/playbook/pb_button/docs/_button_size.md
|
423
432
|
- app/pb_kits/playbook/pb_button/docs/_footer.md
|
424
433
|
- app/pb_kits/playbook/pb_button/docs/example.yml
|
425
434
|
- app/pb_kits/playbook/pb_button/docs/index.js
|
@@ -442,13 +451,14 @@ files:
|
|
442
451
|
- app/pb_kits/playbook/pb_caption/_caption_mixin.scss
|
443
452
|
- app/pb_kits/playbook/pb_caption/caption.html.erb
|
444
453
|
- app/pb_kits/playbook/pb_caption/caption.rb
|
454
|
+
- app/pb_kits/playbook/pb_caption/caption.test.js
|
445
455
|
- app/pb_kits/playbook/pb_caption/docs/_caption_block.html.erb
|
446
456
|
- app/pb_kits/playbook/pb_caption/docs/_caption_block.jsx
|
457
|
+
- app/pb_kits/playbook/pb_caption/docs/_caption_colors.html.erb
|
458
|
+
- app/pb_kits/playbook/pb_caption/docs/_caption_colors.jsx
|
459
|
+
- app/pb_kits/playbook/pb_caption/docs/_caption_colors.md
|
447
460
|
- app/pb_kits/playbook/pb_caption/docs/_caption_light.html.erb
|
448
461
|
- app/pb_kits/playbook/pb_caption/docs/_caption_light.jsx
|
449
|
-
- app/pb_kits/playbook/pb_caption/docs/_caption_variants.html.erb
|
450
|
-
- app/pb_kits/playbook/pb_caption/docs/_caption_variants.jsx
|
451
|
-
- app/pb_kits/playbook/pb_caption/docs/_caption_variants.md
|
452
462
|
- app/pb_kits/playbook/pb_caption/docs/_description.md
|
453
463
|
- app/pb_kits/playbook/pb_caption/docs/_footer.md
|
454
464
|
- app/pb_kits/playbook/pb_caption/docs/example.yml
|
@@ -521,6 +531,7 @@ files:
|
|
521
531
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.jsx
|
522
532
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb
|
523
533
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.jsx
|
534
|
+
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.md
|
524
535
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.html.erb
|
525
536
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.jsx
|
526
537
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_inner_sizes.html.erb
|
@@ -861,6 +872,9 @@ files:
|
|
861
872
|
- app/pb_kits/playbook/pb_flex/docs/_flex_inline.md
|
862
873
|
- app/pb_kits/playbook/pb_flex/docs/_flex_item.html.erb
|
863
874
|
- app/pb_kits/playbook/pb_flex/docs/_flex_item.md
|
875
|
+
- app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.html.erb
|
876
|
+
- app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.jsx
|
877
|
+
- app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.md
|
864
878
|
- app/pb_kits/playbook/pb_flex/docs/_flex_item_example.jsx
|
865
879
|
- app/pb_kits/playbook/pb_flex/docs/_flex_item_example.md
|
866
880
|
- app/pb_kits/playbook/pb_flex/docs/_flex_justify.html.erb
|
@@ -930,6 +944,9 @@ files:
|
|
930
944
|
- app/pb_kits/playbook/pb_form_pill/form_pill.rb
|
931
945
|
- app/pb_kits/playbook/pb_gauge/_gauge.jsx
|
932
946
|
- app/pb_kits/playbook/pb_gauge/_gauge.scss
|
947
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.html.erb
|
948
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx
|
949
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.md
|
933
950
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.html.erb
|
934
951
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx
|
935
952
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.html.erb
|
@@ -1024,6 +1041,7 @@ files:
|
|
1024
1041
|
- app/pb_kits/playbook/pb_icon_circle/docs/_footer.md
|
1025
1042
|
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.html.erb
|
1026
1043
|
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.jsx
|
1044
|
+
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.md
|
1027
1045
|
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_default.html.erb
|
1028
1046
|
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_default.jsx
|
1029
1047
|
- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes.html.erb
|
@@ -1066,6 +1084,9 @@ files:
|
|
1066
1084
|
- app/pb_kits/playbook/pb_image/docs/_description.md
|
1067
1085
|
- app/pb_kits/playbook/pb_image/docs/_rounded_image.html.erb
|
1068
1086
|
- app/pb_kits/playbook/pb_image/docs/_rounded_image.jsx
|
1087
|
+
- app/pb_kits/playbook/pb_image/docs/_transition_image.html.erb
|
1088
|
+
- app/pb_kits/playbook/pb_image/docs/_transition_image.jsx
|
1089
|
+
- app/pb_kits/playbook/pb_image/docs/_transition_image.md
|
1069
1090
|
- app/pb_kits/playbook/pb_image/docs/example.yml
|
1070
1091
|
- app/pb_kits/playbook/pb_image/docs/index.js
|
1071
1092
|
- app/pb_kits/playbook/pb_image/image.html.erb
|
@@ -1153,6 +1174,9 @@ files:
|
|
1153
1174
|
- app/pb_kits/playbook/pb_line_graph/_line_graph.jsx
|
1154
1175
|
- app/pb_kits/playbook/pb_line_graph/_line_graph.scss
|
1155
1176
|
- app/pb_kits/playbook/pb_line_graph/docs/_description.md
|
1177
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.html.erb
|
1178
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.jsx
|
1179
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.md
|
1156
1180
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_default.html.erb
|
1157
1181
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_default.jsx
|
1158
1182
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.html.erb
|
@@ -1238,6 +1262,7 @@ files:
|
|
1238
1262
|
- app/pb_kits/playbook/pb_multiple_users_stacked/docs/index.js
|
1239
1263
|
- app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.html.erb
|
1240
1264
|
- app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.rb
|
1265
|
+
- app/pb_kits/playbook/pb_nav/_bold_mixin.scss
|
1241
1266
|
- app/pb_kits/playbook/pb_nav/_horizontal_nav.scss
|
1242
1267
|
- app/pb_kits/playbook/pb_nav/_item.jsx
|
1243
1268
|
- app/pb_kits/playbook/pb_nav/_nav.jsx
|
@@ -1248,6 +1273,10 @@ files:
|
|
1248
1273
|
- app/pb_kits/playbook/pb_nav/docs/_block_nav.jsx
|
1249
1274
|
- app/pb_kits/playbook/pb_nav/docs/_block_no_title_nav.html.erb
|
1250
1275
|
- app/pb_kits/playbook/pb_nav/docs/_block_no_title_nav.jsx
|
1276
|
+
- app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.html.erb
|
1277
|
+
- app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.jsx
|
1278
|
+
- app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.html.erb
|
1279
|
+
- app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.jsx
|
1251
1280
|
- app/pb_kits/playbook/pb_nav/docs/_borderless_nav.html.erb
|
1252
1281
|
- app/pb_kits/playbook/pb_nav/docs/_borderless_nav.jsx
|
1253
1282
|
- app/pb_kits/playbook/pb_nav/docs/_default_nav.html.erb
|
@@ -1838,15 +1867,17 @@ files:
|
|
1838
1867
|
- app/pb_kits/playbook/pb_title/_title.scss
|
1839
1868
|
- app/pb_kits/playbook/pb_title/_title_mixin.scss
|
1840
1869
|
- app/pb_kits/playbook/pb_title/docs/_description.md
|
1870
|
+
- app/pb_kits/playbook/pb_title/docs/_title_colors.html.erb
|
1871
|
+
- app/pb_kits/playbook/pb_title/docs/_title_colors.jsx
|
1872
|
+
- app/pb_kits/playbook/pb_title/docs/_title_colors.md
|
1841
1873
|
- app/pb_kits/playbook/pb_title/docs/_title_light.html.erb
|
1842
1874
|
- app/pb_kits/playbook/pb_title/docs/_title_light.jsx
|
1843
|
-
- app/pb_kits/playbook/pb_title/docs/
|
1844
|
-
- app/pb_kits/playbook/pb_title/docs/_title_variants.jsx
|
1845
|
-
- app/pb_kits/playbook/pb_title/docs/_title_variants.md
|
1875
|
+
- app/pb_kits/playbook/pb_title/docs/_title_light.md
|
1846
1876
|
- app/pb_kits/playbook/pb_title/docs/example.yml
|
1847
1877
|
- app/pb_kits/playbook/pb_title/docs/index.js
|
1848
1878
|
- app/pb_kits/playbook/pb_title/title.html.erb
|
1849
1879
|
- app/pb_kits/playbook/pb_title/title.rb
|
1880
|
+
- app/pb_kits/playbook/pb_title/title.test.js
|
1850
1881
|
- app/pb_kits/playbook/pb_title_count/_title_count.jsx
|
1851
1882
|
- app/pb_kits/playbook/pb_title_count/_title_count.scss
|
1852
1883
|
- app/pb_kits/playbook/pb_title_count/docs/_description.md
|
@@ -2020,9 +2051,13 @@ files:
|
|
2020
2051
|
- app/pb_kits/playbook/types.js
|
2021
2052
|
- app/pb_kits/playbook/utilities/_background_colors.scss
|
2022
2053
|
- app/pb_kits/playbook/utilities/_colors.scss
|
2054
|
+
- app/pb_kits/playbook/utilities/_cursor.scss
|
2055
|
+
- app/pb_kits/playbook/utilities/_display.scss
|
2056
|
+
- app/pb_kits/playbook/utilities/_line_height.scss
|
2023
2057
|
- app/pb_kits/playbook/utilities/_max_width.scss
|
2024
2058
|
- app/pb_kits/playbook/utilities/_number_spacing.scss
|
2025
2059
|
- app/pb_kits/playbook/utilities/_positioning.scss
|
2060
|
+
- app/pb_kits/playbook/utilities/_shadow.scss
|
2026
2061
|
- app/pb_kits/playbook/utilities/_spacing.scss
|
2027
2062
|
- app/pb_kits/playbook/utilities/globalProps.js
|
2028
2063
|
- app/pb_kits/playbook/utilities/props.js
|
@@ -2033,6 +2068,8 @@ files:
|
|
2033
2068
|
- fonts/regular-min.js
|
2034
2069
|
- lib/playbook.rb
|
2035
2070
|
- lib/playbook/classnames.rb
|
2071
|
+
- lib/playbook/cursor.rb
|
2072
|
+
- lib/playbook/display.rb
|
2036
2073
|
- lib/playbook/engine.rb
|
2037
2074
|
- lib/playbook/forms.rb
|
2038
2075
|
- lib/playbook/forms/builder.rb
|
@@ -2045,6 +2082,7 @@ files:
|
|
2045
2082
|
- lib/playbook/forms/builder/typeahead_field.rb
|
2046
2083
|
- lib/playbook/kit_base.rb
|
2047
2084
|
- lib/playbook/kit_resolver.rb
|
2085
|
+
- lib/playbook/line_height.rb
|
2048
2086
|
- lib/playbook/markdown.rb
|
2049
2087
|
- lib/playbook/markdown/helper.rb
|
2050
2088
|
- lib/playbook/markdown/template_handler.rb
|
@@ -2067,6 +2105,7 @@ files:
|
|
2067
2105
|
- lib/playbook/props/percentage.rb
|
2068
2106
|
- lib/playbook/props/proc.rb
|
2069
2107
|
- lib/playbook/props/string.rb
|
2108
|
+
- lib/playbook/shadow.rb
|
2070
2109
|
- lib/playbook/spacing.rb
|
2071
2110
|
- lib/playbook/version.rb
|
2072
2111
|
- lib/playbook/z_index.rb
|
@@ -2086,11 +2125,11 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
2086
2125
|
version: '0'
|
2087
2126
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
2088
2127
|
requirements:
|
2089
|
-
- - "
|
2128
|
+
- - ">"
|
2090
2129
|
- !ruby/object:Gem::Version
|
2091
|
-
version:
|
2130
|
+
version: 1.3.1
|
2092
2131
|
requirements: []
|
2093
|
-
rubygems_version: 3.
|
2132
|
+
rubygems_version: 3.1.6
|
2094
2133
|
signing_key:
|
2095
2134
|
specification_version: 4
|
2096
2135
|
summary: Playbook Design System
|
@@ -1 +0,0 @@
|
|
1
|
-
<%= pb_rails("caption", props: { text: "Subcaption (link)", size: 'xs', variant: "link" }) %>
|
@@ -1,17 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { Caption } from '../../'
|
3
|
-
|
4
|
-
const CaptionVariants = (props) => {
|
5
|
-
return (
|
6
|
-
<div>
|
7
|
-
<Caption
|
8
|
-
size="xs"
|
9
|
-
text="Subcaption (link)"
|
10
|
-
variant="link"
|
11
|
-
{...props}
|
12
|
-
/>
|
13
|
-
</div>
|
14
|
-
)
|
15
|
-
}
|
16
|
-
|
17
|
-
export default CaptionVariants
|
@@ -1 +0,0 @@
|
|
1
|
-
<%= pb_rails("title", props: { text: "Title 4 (link)", tag: "h4", size: 4, variant: "link" }) %>
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import Title from '../_title'
|
4
|
-
|
5
|
-
const TitleVariants = (props) => {
|
6
|
-
return (
|
7
|
-
<div>
|
8
|
-
<Title
|
9
|
-
size={4}
|
10
|
-
tag="h4"
|
11
|
-
text="Title 4 (link)"
|
12
|
-
variant="link"
|
13
|
-
{...props}
|
14
|
-
/>
|
15
|
-
</div>
|
16
|
-
)
|
17
|
-
}
|
18
|
-
|
19
|
-
export default TitleVariants
|