playbook_ui 14.6.2.pre.alpha.PLAY1551tiptapextbump4350 → 14.6.2.pre.alpha.PLAY1613darkdatetimecolors4432
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 +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/Components/CustomCell.tsx +8 -1
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +21 -28
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx +37 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.jsx +13 -2
- data/app/pb_kits/playbook/pb_card/_card.tsx +11 -4
- data/app/pb_kits/playbook/pb_date/_date.scss +3 -0
- data/app/pb_kits/playbook/pb_dialog/_dialog.tsx +5 -1
- data/app/pb_kits/playbook/pb_dropdown/_dropdown.tsx +8 -7
- data/app/pb_kits/playbook/pb_flex/_flex.tsx +3 -1
- data/app/pb_kits/playbook/pb_flex/_flex_item.tsx +8 -2
- data/app/pb_kits/playbook/pb_flex/flex_item.html.erb +3 -6
- data/app/pb_kits/playbook/pb_flex/flex_item.rb +7 -2
- data/app/pb_kits/playbook/pb_form_pill/_form_pill.scss +6 -2
- data/app/pb_kits/playbook/pb_form_pill/_form_pill.tsx +30 -26
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb +24 -1
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx +25 -2
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_rails.md +3 -0
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md +1 -0
- data/app/pb_kits/playbook/pb_form_pill/form_pill.html.erb +46 -8
- data/app/pb_kits/playbook/pb_popover/_popover.tsx +1 -1
- data/app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading.scss +37 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading.tsx +67 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading_mixins.scss +40 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_border_radius.jsx +51 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_border_radius.md +1 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_color.jsx +26 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_color.md +1 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_default.html.erb +1 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_default.jsx +11 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_height_width.jsx +59 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_height_width.md +3 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_layout.jsx +20 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_layout.md +3 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/example.yml +13 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/docs/index.js +5 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.html.erb +12 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.rb +8 -0
- data/app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.test.jsx +81 -0
- data/app/pb_kits/playbook/pb_timeline/_item.tsx +59 -23
- data/app/pb_kits/playbook/pb_timeline/_timeline.tsx +8 -0
- data/app/pb_kits/playbook/pb_timeline/detail.html.erb +3 -0
- data/app/pb_kits/playbook/pb_timeline/detail.rb +11 -0
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb +43 -0
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx +68 -0
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.md +2 -0
- data/app/pb_kits/playbook/pb_timeline/docs/example.yml +2 -1
- data/app/pb_kits/playbook/pb_timeline/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_timeline/item.html.erb +17 -21
- data/app/pb_kits/playbook/pb_timeline/item.rb +4 -0
- data/app/pb_kits/playbook/pb_timeline/label.html.erb +12 -0
- data/app/pb_kits/playbook/pb_timeline/label.rb +13 -0
- data/app/pb_kits/playbook/pb_timeline/step.html.erb +14 -0
- data/app/pb_kits/playbook/pb_timeline/step.rb +16 -0
- data/app/pb_kits/playbook/pb_timeline/subcomponents/Detail.tsx +29 -0
- data/app/pb_kits/playbook/pb_timeline/subcomponents/Label.tsx +38 -0
- data/app/pb_kits/playbook/pb_timeline/subcomponents/Step.tsx +42 -0
- data/app/pb_kits/playbook/pb_timeline/subcomponents/index.tsx +3 -0
- data/app/pb_kits/playbook/pb_timeline/timeline.test.js +84 -0
- data/app/pb_kits/playbook/utilities/_hover.scss +46 -43
- data/app/pb_kits/playbook/utilities/globalPropNames.mjs +4 -0
- data/app/pb_kits/playbook/utilities/globalProps.ts +44 -2
- data/dist/chunks/_typeahead-DhLic2Fe.js +22 -0
- data/dist/chunks/_weekday_stacked-Mx8TYP5I.js +45 -0
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +4 -1
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/hover.rb +4 -1
- data/lib/playbook/kit_base.rb +43 -5
- data/lib/playbook/version.rb +1 -1
- metadata +37 -5
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.md +0 -1
- data/dist/chunks/_typeahead-BV_n6U5W.js +0 -22
- data/dist/chunks/_weekday_stacked-BLVPFG6h.js +0 -45
data/lib/playbook/hover.rb
CHANGED
@@ -4,6 +4,7 @@ module Playbook
|
|
4
4
|
module Hover
|
5
5
|
def self.included(base)
|
6
6
|
base.prop :hover
|
7
|
+
base.prop :group_hover, type: Playbook::Props::Boolean, default: false
|
7
8
|
end
|
8
9
|
|
9
10
|
def hover_options
|
@@ -38,7 +39,8 @@ module Playbook
|
|
38
39
|
|
39
40
|
def hover_props
|
40
41
|
selected_props = hover_options.keys.select { |sk| try(sk) }
|
41
|
-
|
42
|
+
|
43
|
+
return nil if selected_props.nil? && group_hover.nil?
|
42
44
|
|
43
45
|
responsive = selected_props.present? && try(selected_props.first).is_a?(::Hash)
|
44
46
|
css = ""
|
@@ -58,6 +60,7 @@ module Playbook
|
|
58
60
|
end
|
59
61
|
end
|
60
62
|
|
63
|
+
css += "group_hover " if group_hover
|
61
64
|
css.strip unless css.blank?
|
62
65
|
end
|
63
66
|
end
|
data/lib/playbook/kit_base.rb
CHANGED
@@ -73,15 +73,15 @@ module Playbook
|
|
73
73
|
prop :aria, type: Playbook::Props::HashProp, default: {}
|
74
74
|
prop :html_options, type: Playbook::Props::HashProp, default: {}
|
75
75
|
prop :children, type: Playbook::Props::Proc
|
76
|
+
prop :style, type: Playbook::Props::HashProp, default: {}
|
77
|
+
prop :height
|
78
|
+
prop :min_height
|
79
|
+
prop :max_height
|
76
80
|
|
77
81
|
def object
|
78
82
|
self
|
79
83
|
end
|
80
84
|
|
81
|
-
def combined_html_options
|
82
|
-
default_html_options.merge(html_options.deep_merge(data_attributes))
|
83
|
-
end
|
84
|
-
|
85
85
|
# rubocop:disable Layout/CommentIndentation
|
86
86
|
# pb_content_tag information (potentially to be abstracted into its own dev doc in the future)
|
87
87
|
# The pb_content_tag generates HTML content tags for rails kits with flexible options.
|
@@ -110,15 +110,48 @@ module Playbook
|
|
110
110
|
end
|
111
111
|
# rubocop:enable Style/OptionalBooleanParameter
|
112
112
|
|
113
|
+
def combined_html_options
|
114
|
+
merged = default_html_options.dup
|
115
|
+
|
116
|
+
html_options.each do |key, value|
|
117
|
+
if key == :style && value.is_a?(Hash)
|
118
|
+
# Convert style hash to CSS string
|
119
|
+
merged[:style] = value.map { |k, v| "#{k.to_s.gsub('_', '-')}: #{v}" }.join("; ")
|
120
|
+
else
|
121
|
+
merged[key] = value
|
122
|
+
end
|
123
|
+
end
|
124
|
+
|
125
|
+
inline_styles = dynamic_inline_props
|
126
|
+
merged[:style] = if inline_styles.present?
|
127
|
+
merged[:style].present? ? "#{merged[:style]}; #{inline_styles}" : inline_styles
|
128
|
+
end
|
129
|
+
|
130
|
+
merged.deep_merge(data_attributes)
|
131
|
+
end
|
132
|
+
|
133
|
+
def global_inline_props
|
134
|
+
{
|
135
|
+
height: height,
|
136
|
+
min_height: min_height,
|
137
|
+
max_height: max_height,
|
138
|
+
}.compact
|
139
|
+
end
|
140
|
+
|
113
141
|
private
|
114
142
|
|
115
143
|
def default_options
|
116
|
-
{
|
144
|
+
options = {
|
117
145
|
id: id,
|
118
146
|
data: data,
|
119
147
|
class: classname,
|
120
148
|
aria: aria,
|
121
149
|
}
|
150
|
+
|
151
|
+
inline_styles = dynamic_inline_props
|
152
|
+
options[:style] = inline_styles if inline_styles.present? && !html_options.key?(:style)
|
153
|
+
|
154
|
+
options
|
122
155
|
end
|
123
156
|
|
124
157
|
def default_html_options
|
@@ -131,5 +164,10 @@ module Playbook
|
|
131
164
|
aria: aria,
|
132
165
|
}.transform_keys { |key| key.to_s.tr("_", "-").to_sym }
|
133
166
|
end
|
167
|
+
|
168
|
+
def dynamic_inline_props
|
169
|
+
styles = global_inline_props.map { |key, value| "#{key.to_s.gsub('_', '-')}: #{value}" if value.present? }.compact
|
170
|
+
styles.join("; ").presence
|
171
|
+
end
|
134
172
|
end
|
135
173
|
end
|
data/lib/playbook/version.rb
CHANGED
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: 14.6.2.pre.alpha.
|
4
|
+
version: 14.6.2.pre.alpha.PLAY1613darkdatetimecolors4432
|
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: 2024-11-
|
12
|
+
date: 2024-11-08 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -1385,7 +1385,8 @@ files:
|
|
1385
1385
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_tag.jsx
|
1386
1386
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb
|
1387
1387
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx
|
1388
|
-
- app/pb_kits/playbook/pb_form_pill/docs/
|
1388
|
+
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_rails.md
|
1389
|
+
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md
|
1389
1390
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.html.erb
|
1390
1391
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.jsx
|
1391
1392
|
- app/pb_kits/playbook/pb_form_pill/docs/example.yml
|
@@ -2432,6 +2433,24 @@ files:
|
|
2432
2433
|
- app/pb_kits/playbook/pb_selectable_list/selectable_list.test.js
|
2433
2434
|
- app/pb_kits/playbook/pb_selectable_list/selectable_list_item.html.erb
|
2434
2435
|
- app/pb_kits/playbook/pb_selectable_list/selectable_list_item.rb
|
2436
|
+
- app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading.scss
|
2437
|
+
- app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading.tsx
|
2438
|
+
- app/pb_kits/playbook/pb_skeleton_loading/_skeleton_loading_mixins.scss
|
2439
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_border_radius.jsx
|
2440
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_border_radius.md
|
2441
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_color.jsx
|
2442
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_color.md
|
2443
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_default.html.erb
|
2444
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_default.jsx
|
2445
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_height_width.jsx
|
2446
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_height_width.md
|
2447
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_layout.jsx
|
2448
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_layout.md
|
2449
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/example.yml
|
2450
|
+
- app/pb_kits/playbook/pb_skeleton_loading/docs/index.js
|
2451
|
+
- app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.html.erb
|
2452
|
+
- app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.rb
|
2453
|
+
- app/pb_kits/playbook/pb_skeleton_loading/skeleton_loading.test.jsx
|
2435
2454
|
- app/pb_kits/playbook/pb_source/_source.scss
|
2436
2455
|
- app/pb_kits/playbook/pb_source/_source.tsx
|
2437
2456
|
- app/pb_kits/playbook/pb_source/docs/_description.md
|
@@ -2738,11 +2757,16 @@ files:
|
|
2738
2757
|
- app/pb_kits/playbook/pb_timeline/_item.tsx
|
2739
2758
|
- app/pb_kits/playbook/pb_timeline/_timeline.scss
|
2740
2759
|
- app/pb_kits/playbook/pb_timeline/_timeline.tsx
|
2760
|
+
- app/pb_kits/playbook/pb_timeline/detail.html.erb
|
2761
|
+
- app/pb_kits/playbook/pb_timeline/detail.rb
|
2741
2762
|
- app/pb_kits/playbook/pb_timeline/docs/_description.md
|
2742
2763
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_default.html.erb
|
2743
2764
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_default.jsx
|
2744
2765
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.html.erb
|
2745
2766
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.jsx
|
2767
|
+
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb
|
2768
|
+
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx
|
2769
|
+
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.md
|
2746
2770
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.html.erb
|
2747
2771
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.jsx
|
2748
2772
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.md
|
@@ -2750,6 +2774,14 @@ files:
|
|
2750
2774
|
- app/pb_kits/playbook/pb_timeline/docs/index.js
|
2751
2775
|
- app/pb_kits/playbook/pb_timeline/item.html.erb
|
2752
2776
|
- app/pb_kits/playbook/pb_timeline/item.rb
|
2777
|
+
- app/pb_kits/playbook/pb_timeline/label.html.erb
|
2778
|
+
- app/pb_kits/playbook/pb_timeline/label.rb
|
2779
|
+
- app/pb_kits/playbook/pb_timeline/step.html.erb
|
2780
|
+
- app/pb_kits/playbook/pb_timeline/step.rb
|
2781
|
+
- app/pb_kits/playbook/pb_timeline/subcomponents/Detail.tsx
|
2782
|
+
- app/pb_kits/playbook/pb_timeline/subcomponents/Label.tsx
|
2783
|
+
- app/pb_kits/playbook/pb_timeline/subcomponents/Step.tsx
|
2784
|
+
- app/pb_kits/playbook/pb_timeline/subcomponents/index.tsx
|
2753
2785
|
- app/pb_kits/playbook/pb_timeline/timeline.html.erb
|
2754
2786
|
- app/pb_kits/playbook/pb_timeline/timeline.rb
|
2755
2787
|
- app/pb_kits/playbook/pb_timeline/timeline.test.js
|
@@ -3119,8 +3151,8 @@ files:
|
|
3119
3151
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3120
3152
|
- app/pb_kits/playbook/utilities/text.ts
|
3121
3153
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3122
|
-
- dist/chunks/_typeahead-
|
3123
|
-
- dist/chunks/_weekday_stacked-
|
3154
|
+
- dist/chunks/_typeahead-DhLic2Fe.js
|
3155
|
+
- dist/chunks/_weekday_stacked-Mx8TYP5I.js
|
3124
3156
|
- dist/chunks/lazysizes-B7xYodB-.js
|
3125
3157
|
- dist/chunks/lib-D-mTv-kp.js
|
3126
3158
|
- dist/chunks/pb_form_validation-BkWGwJsl.js
|
@@ -1 +0,0 @@
|
|
1
|
-
For pills with longer text, the `truncate` global prop can be used to truncate the label within each Form Pill. See [here](https://playbook.powerapp.cloud/visual_guidelines/truncate) for more information on the truncate global prop.
|