playbook_ui 15.6.0.pre.alpha.play266913088 → 15.6.0.pre.rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/Components/RegularTableView.tsx +2 -3
- data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx +0 -4
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx +0 -95
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_control_rails.html.erb +5 -11
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_control_rails.md +1 -7
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.html.erb +163 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx +190 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +1 -4
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +1 -3
- data/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb +2 -2
- data/app/pb_kits/playbook/pb_advanced_table/table_header.rb +0 -57
- data/app/pb_kits/playbook/pb_background/_background.tsx +6 -6
- data/app/pb_kits/playbook/pb_background/background.test.js +1 -5
- data/app/pb_kits/playbook/pb_background/docs/_background_light.html.erb +1 -1
- data/app/pb_kits/playbook/pb_background/docs/_background_light.jsx +1 -0
- data/app/pb_kits/playbook/pb_background/docs/example.yml +2 -2
- data/app/pb_kits/playbook/pb_card/docs/_card_header.md +1 -1
- data/app/pb_kits/playbook/pb_card/docs/_card_highlight.md +1 -1
- data/app/pb_kits/playbook/pb_collapsible/__snapshots__/collapsible.test.js.snap +2 -2
- data/app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleIcon.tsx +8 -10
- data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_icons.jsx +1 -0
- data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_state.jsx +3 -0
- data/app/pb_kits/playbook/pb_contact/_contact.tsx +24 -51
- data/app/pb_kits/playbook/pb_contact/contact.html.erb +19 -53
- data/app/pb_kits/playbook/pb_contact/contact.rb +1 -11
- data/app/pb_kits/playbook/pb_contact/contact.test.js +0 -76
- data/app/pb_kits/playbook/pb_contact/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_contact/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_date_picker/date_picker.test.js +0 -24
- data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +7 -197
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.html.erb +14 -23
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.md +1 -1
- data/app/pb_kits/playbook/pb_dialog/_dialog.tsx +1 -2
- data/app/pb_kits/playbook/pb_dialog/dialog.html.erb +1 -1
- data/app/pb_kits/playbook/pb_dialog/dialog.rb +0 -1
- data/app/pb_kits/playbook/pb_dialog/dialog.test.jsx +0 -14
- data/app/pb_kits/playbook/pb_dialog/dialog_header.html.erb +4 -5
- data/app/pb_kits/playbook/pb_dialog/dialog_header.rb +0 -2
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_compound_components.html.erb +0 -31
- data/app/pb_kits/playbook/pb_dialog/docs/example.yml +0 -4
- data/app/pb_kits/playbook/pb_dialog/docs/index.js +1 -3
- data/app/pb_kits/playbook/pb_distribution_bar/docs/_distribution_bar_custom_colors.md +1 -1
- data/app/pb_kits/playbook/pb_draggable/context/index.tsx +7 -458
- data/app/pb_kits/playbook/pb_draggable/context/types.ts +3 -8
- data/app/pb_kits/playbook/pb_draggable/docs/example.yml +2 -3
- data/app/pb_kits/playbook/pb_draggable/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_draggable/draggable.test.jsx +1 -77
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.html.erb +5 -7
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.html.erb +1 -3
- data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +0 -5
- data/app/pb_kits/playbook/pb_dropdown/dropdown.html.erb +0 -4
- data/app/pb_kits/playbook/pb_dropdown/dropdown.rb +5 -39
- data/app/pb_kits/playbook/pb_dropdown/index.js +3 -171
- data/app/pb_kits/playbook/pb_file_upload/_file_upload.scss +4 -4
- data/app/pb_kits/playbook/pb_filter/Filter/FilterBackground.tsx +3 -3
- data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx +22 -34
- data/app/pb_kits/playbook/pb_home_address_street/city_emphasis.html.erb +12 -16
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_home_address_street/none_emphasis.html.erb +12 -16
- data/app/pb_kits/playbook/pb_home_address_street/street_emphasis.html.erb +12 -16
- data/app/pb_kits/playbook/pb_multiple_users/_multiple_users.scss +0 -10
- data/app/pb_kits/playbook/pb_multiple_users/_multiple_users.tsx +15 -66
- data/app/pb_kits/playbook/pb_multiple_users/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_multiple_users/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_multiple_users/multiple_users.test.js +0 -25
- data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +10 -44
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb +4 -34
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx +7 -16
- data/app/pb_kits/playbook/pb_radio/docs/_radio_error.md +1 -1
- data/app/pb_kits/playbook/pb_select/_select.tsx +3 -8
- data/app/pb_kits/playbook/pb_select/docs/_select_error.md +1 -1
- data/app/pb_kits/playbook/pb_select/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_select/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_select/select.html.erb +2 -2
- data/app/pb_kits/playbook/pb_select/select.rb +1 -3
- data/app/pb_kits/playbook/pb_select/select.test.js +0 -23
- data/app/pb_kits/playbook/pb_table/_table.tsx +33 -187
- data/app/pb_kits/playbook/pb_table/docs/example.yml +0 -4
- data/app/pb_kits/playbook/pb_table/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_table/table.html.erb +12 -68
- data/app/pb_kits/playbook/pb_table/table.rb +3 -22
- data/app/pb_kits/playbook/pb_table/table.test.js +0 -143
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_error.md +1 -1
- data/app/pb_kits/playbook/pb_textarea/docs/_textarea_error.md +1 -1
- data/app/pb_kits/playbook/pb_timeline/_item.tsx +0 -3
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.md +1 -1
- data/app/pb_kits/playbook/pb_timeline/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_timeline/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_timeline/item.html.erb +1 -1
- data/app/pb_kits/playbook/pb_timeline/item.rb +0 -2
- data/app/pb_kits/playbook/pb_timeline/label.html.erb +1 -2
- data/app/pb_kits/playbook/pb_timeline/label.rb +0 -2
- data/app/pb_kits/playbook/pb_timeline/subcomponents/Label.tsx +0 -3
- data/app/pb_kits/playbook/pb_timeline/timeline.test.js +0 -51
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.test.jsx +0 -15
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.tsx +0 -3
- data/app/pb_kits/playbook/pb_typeahead/components/ClearIndicator.tsx +2 -13
- data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx +1 -6
- data/app/pb_kits/playbook/pb_typeahead/components/ValueContainer.tsx +7 -34
- data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_typeahead/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +1 -6
- data/app/pb_kits/playbook/tokens/_colors.scss +1 -2
- data/dist/chunks/_typeahead-kRdz5zPn.js +6 -0
- data/dist/chunks/lib-CgpqUb6l.js +29 -0
- data/dist/chunks/vendor.js +3 -3
- data/dist/menu.yml +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/forms/builder/collection_select_field.rb +1 -9
- data/lib/playbook/forms/builder/select_field.rb +1 -9
- data/lib/playbook/forms/builder/time_zone_select_field.rb +1 -9
- data/lib/playbook/pb_kit_helper.rb +0 -35
- data/lib/playbook/version.rb +2 -2
- metadata +4 -54
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_colors_rails.html.erb +0 -43
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_colors_rails.md +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.jsx +0 -54
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.md +0 -9
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.jsx +0 -80
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.md +0 -3
- data/app/pb_kits/playbook/pb_background/docs/_background_light.md +0 -1
- data/app/pb_kits/playbook/pb_contact/docs/_contact_unstyled.html.erb +0 -33
- data/app/pb_kits/playbook/pb_contact/docs/_contact_unstyled.jsx +0 -46
- data/app/pb_kits/playbook/pb_contact/docs/_contact_unstyled_rails.md +0 -2
- data/app/pb_kits/playbook/pb_contact/docs/_contact_unstyled_react.md +0 -2
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.html.erb +0 -24
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.jsx +0 -60
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.md +0 -3
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible.html.erb +0 -71
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible.jsx +0 -57
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible_rails.md +0 -1
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible_react.md +0 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_dropzone.jsx +0 -180
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_dropzone.md +0 -22
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_default_dates.html.erb +0 -19
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_rails.html.erb +0 -12
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_rails.md +0 -26
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end_rails.html.erb +0 -19
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end_rails.md +0 -1
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_default_rails.html.erb +0 -30
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_default_rails.md +0 -3
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_rails.html.erb +0 -29
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_rails.md +0 -13
- data/app/pb_kits/playbook/pb_dropdown/quickpick_helper.rb +0 -75
- data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx +0 -42
- data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md +0 -1
- data/app/pb_kits/playbook/pb_select/docs/_select_input_options.html.erb +0 -16
- data/app/pb_kits/playbook/pb_select/docs/_select_input_options.jsx +0 -30
- data/app/pb_kits/playbook/pb_select/docs/_select_input_options.md +0 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant.jsx +0 -134
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant.md +0 -34
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_rails.html.erb +0 -101
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_rails.md +0 -33
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination.jsx +0 -180
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination.md +0 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination_rails.html.erb +0 -122
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination_rails.md +0 -3
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.html.erb +0 -60
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.jsx +0 -118
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.md +0 -1
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.html.erb +0 -30
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.jsx +0 -37
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.md +0 -3
- data/app/pb_kits/playbook/utilities/deprecated.ts +0 -73
- data/dist/chunks/_typeahead-CbjBmIDu.js +0 -6
- data/dist/chunks/lib-DxDBrGZX.js +0 -29
|
@@ -4,18 +4,10 @@ module Playbook
|
|
|
4
4
|
module Forms
|
|
5
5
|
class Builder
|
|
6
6
|
def collection_select(name, collection, value_method, text_method, options = {}, html_options = {}, props: {})
|
|
7
|
-
props[:
|
|
8
|
-
props[:input_options][:id] ||= "#{@object_name}_#{name}"
|
|
9
|
-
|
|
10
|
-
props[:label] = @template.label(@object_name, name, for: props[:input_options][:id]) if props[:label] == true
|
|
11
|
-
|
|
7
|
+
props[:label] = @template.label(@object_name, name) if props[:label] == true
|
|
12
8
|
options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
|
|
13
9
|
options[:prompt] = props[:blank_selection] || ""
|
|
14
10
|
html_options[:required] = "required" if props[:required]
|
|
15
|
-
html_options[:id] = props[:input_options][:id]
|
|
16
|
-
html_options[:class] = props[:input_options][:class] if props[:input_options][:class]
|
|
17
|
-
html_options[:data] = (html_options[:data] || {}).merge(props[:input_options][:data] || {})
|
|
18
|
-
|
|
19
11
|
input = super(name, collection, value_method, text_method, options, html_options)
|
|
20
12
|
|
|
21
13
|
@template.pb_rails("select", props: props) do
|
|
@@ -4,18 +4,10 @@ module Playbook
|
|
|
4
4
|
module Forms
|
|
5
5
|
class Builder
|
|
6
6
|
def select(name, choices = nil, options = {}, html_options = {}, props: {}, &block)
|
|
7
|
-
props[:
|
|
8
|
-
props[:input_options][:id] ||= "#{@object_name}_#{name}"
|
|
9
|
-
|
|
10
|
-
props[:label] = @template.label(@object_name, name, for: props[:input_options][:id]) if props[:label] == true
|
|
11
|
-
|
|
7
|
+
props[:label] = @template.label(@object_name, name) if props[:label] == true
|
|
12
8
|
options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
|
|
13
9
|
options[:prompt] = props[:blank_selection] || ""
|
|
14
10
|
html_options[:required] = "required" if props[:required]
|
|
15
|
-
html_options[:id] = props[:input_options][:id]
|
|
16
|
-
html_options[:class] = props[:input_options][:class] if props[:input_options][:class]
|
|
17
|
-
html_options[:data] = (html_options[:data] || {}).merge(props[:input_options][:data] || {})
|
|
18
|
-
|
|
19
11
|
input = super(name, choices, options, html_options, &block)
|
|
20
12
|
|
|
21
13
|
@template.pb_rails("select", props: props) do
|
|
@@ -4,18 +4,10 @@ module Playbook
|
|
|
4
4
|
module Forms
|
|
5
5
|
class Builder
|
|
6
6
|
def time_zone_select_field(name, choices = {}, options = {}, html_options = {}, props: {})
|
|
7
|
-
props[:
|
|
8
|
-
props[:input_options][:id] ||= "#{@object_name}_#{name}"
|
|
9
|
-
|
|
10
|
-
props[:label] = @template.label(@object_name, name, for: props[:input_options][:id]) if props[:label] == true
|
|
11
|
-
|
|
7
|
+
props[:label] = @template.label(@object_name, name) if props[:label] == true
|
|
12
8
|
options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
|
|
13
9
|
options[:prompt] = props[:blank_selection] || ""
|
|
14
10
|
html_options[:required] = "required" if props[:required]
|
|
15
|
-
html_options[:id] = props[:input_options][:id]
|
|
16
|
-
html_options[:class] = props[:input_options][:class] if props[:input_options][:class]
|
|
17
|
-
html_options[:data] = (html_options[:data] || {}).merge(props[:input_options][:data] || {})
|
|
18
|
-
|
|
19
11
|
input = @template.time_zone_select(@object_name, name, choices, options, html_options)
|
|
20
12
|
|
|
21
13
|
@template.pb_rails("select", props: props) do
|
|
@@ -13,40 +13,5 @@ module Playbook
|
|
|
13
13
|
render kit.new(props, &block), &block
|
|
14
14
|
end
|
|
15
15
|
end
|
|
16
|
-
|
|
17
|
-
def deprecated_kit_warning(kit_name, message = nil)
|
|
18
|
-
# Skip in test and production environments
|
|
19
|
-
return "".html_safe if Rails.env.test? || Rails.env.production?
|
|
20
|
-
|
|
21
|
-
# Build the warning message
|
|
22
|
-
base_message = "PLAYBOOK DEPRECATION WARNING\\n ----------------------------\\n The \\\"#{kit_name}\\\" kit is deprecated and will be removed in a future version."
|
|
23
|
-
|
|
24
|
-
full_message = if message
|
|
25
|
-
"#{base_message} #{message}"
|
|
26
|
-
else
|
|
27
|
-
"#{base_message} Please migrate to the recommended alternative"
|
|
28
|
-
end
|
|
29
|
-
|
|
30
|
-
# Escape the message for JavaScript
|
|
31
|
-
escaped_message = full_message.gsub("'", "\\\\'").gsub("\n", "\\n")
|
|
32
|
-
|
|
33
|
-
# Return a self-executing script that checks if we're already warned
|
|
34
|
-
# Uses client-side tracking to ensure one warning per page load
|
|
35
|
-
# Only shows warnings on localhost (matching React behavior)
|
|
36
|
-
script = "<script type=\"text/javascript\">\n"
|
|
37
|
-
script += "(function() {\n"
|
|
38
|
-
script += " var hostname = window.location.hostname;\n"
|
|
39
|
-
script += " var isLocalDev = hostname === 'localhost' || hostname === '127.0.0.1' || hostname.endsWith('.local') || hostname.includes('local.') || !hostname;\n"
|
|
40
|
-
script += " if (!isLocalDev) return;\n"
|
|
41
|
-
script += " if (!window.__PB_WARNED_KITS__) window.__PB_WARNED_KITS__ = new Set();\n"
|
|
42
|
-
script += " if (!window.__PB_WARNED_KITS__.has('#{kit_name}')) {\n"
|
|
43
|
-
script += " window.__PB_WARNED_KITS__.add('#{kit_name}');\n"
|
|
44
|
-
script += " console.warn('#{escaped_message}');\n"
|
|
45
|
-
script += " }\n"
|
|
46
|
-
script += "})();\n"
|
|
47
|
-
script += "</script>"
|
|
48
|
-
|
|
49
|
-
script.html_safe
|
|
50
|
-
end
|
|
51
16
|
end
|
|
52
17
|
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: 15.6.0.pre.
|
|
4
|
+
version: 15.6.0.pre.rc.0
|
|
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: 2025-
|
|
12
|
+
date: 2025-11-24 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: actionpack
|
|
@@ -273,8 +273,6 @@ files:
|
|
|
273
273
|
- app/pb_kits/playbook/pb_advanced_table/advanced_table.rb
|
|
274
274
|
- app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx
|
|
275
275
|
- app/pb_kits/playbook/pb_advanced_table/advanced_table_action_bar.js
|
|
276
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_colors_rails.html.erb
|
|
277
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_colors_rails.md
|
|
278
276
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_control_rails.html.erb
|
|
279
277
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_control_rails.md
|
|
280
278
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta.html.erb
|
|
@@ -302,10 +300,6 @@ files:
|
|
|
302
300
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_vertical_border.jsx
|
|
303
301
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.jsx
|
|
304
302
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.md
|
|
305
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.jsx
|
|
306
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.md
|
|
307
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.jsx
|
|
308
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.md
|
|
309
303
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers.jsx
|
|
310
304
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers.md
|
|
311
305
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers_rails.html.erb
|
|
@@ -493,7 +487,6 @@ files:
|
|
|
493
487
|
- app/pb_kits/playbook/pb_background/docs/_background_image.md
|
|
494
488
|
- app/pb_kits/playbook/pb_background/docs/_background_light.html.erb
|
|
495
489
|
- app/pb_kits/playbook/pb_background/docs/_background_light.jsx
|
|
496
|
-
- app/pb_kits/playbook/pb_background/docs/_background_light.md
|
|
497
490
|
- app/pb_kits/playbook/pb_background/docs/_background_overlay.jsx
|
|
498
491
|
- app/pb_kits/playbook/pb_background/docs/_background_overlay.md
|
|
499
492
|
- app/pb_kits/playbook/pb_background/docs/_background_size.html.erb
|
|
@@ -898,10 +891,6 @@ files:
|
|
|
898
891
|
- app/pb_kits/playbook/pb_contact/docs/_contact_default.md
|
|
899
892
|
- app/pb_kits/playbook/pb_contact/docs/_contact_default_swift.md
|
|
900
893
|
- app/pb_kits/playbook/pb_contact/docs/_contact_props_swift.md
|
|
901
|
-
- app/pb_kits/playbook/pb_contact/docs/_contact_unstyled.html.erb
|
|
902
|
-
- app/pb_kits/playbook/pb_contact/docs/_contact_unstyled.jsx
|
|
903
|
-
- app/pb_kits/playbook/pb_contact/docs/_contact_unstyled_rails.md
|
|
904
|
-
- app/pb_kits/playbook/pb_contact/docs/_contact_unstyled_react.md
|
|
905
894
|
- app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.html.erb
|
|
906
895
|
- app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.jsx
|
|
907
896
|
- app/pb_kits/playbook/pb_contact/docs/_contact_with_detail_swift.md
|
|
@@ -1261,9 +1250,6 @@ files:
|
|
|
1261
1250
|
- app/pb_kits/playbook/pb_dialog/dialog_footer.rb
|
|
1262
1251
|
- app/pb_kits/playbook/pb_dialog/dialog_header.html.erb
|
|
1263
1252
|
- app/pb_kits/playbook/pb_dialog/dialog_header.rb
|
|
1264
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.html.erb
|
|
1265
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.jsx
|
|
1266
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_closeable.md
|
|
1267
1253
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_compound_components.html.erb
|
|
1268
1254
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_compound_components.jsx
|
|
1269
1255
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_compound_components.md
|
|
@@ -1280,10 +1266,6 @@ files:
|
|
|
1280
1266
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.html.erb
|
|
1281
1267
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.jsx
|
|
1282
1268
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.md
|
|
1283
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible.html.erb
|
|
1284
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible.jsx
|
|
1285
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible_rails.md
|
|
1286
|
-
- app/pb_kits/playbook/pb_dialog/docs/_dialog_overflow_visible_react.md
|
|
1287
1269
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_props_swift.md
|
|
1288
1270
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_scrollable.html.erb
|
|
1289
1271
|
- app/pb_kits/playbook/pb_dialog/docs/_dialog_scrollable.jsx
|
|
@@ -1348,8 +1330,6 @@ files:
|
|
|
1348
1330
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_event_listeners_react.md
|
|
1349
1331
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers.html.erb
|
|
1350
1332
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers.jsx
|
|
1351
|
-
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_dropzone.jsx
|
|
1352
|
-
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_dropzone.md
|
|
1353
1333
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_rails.md
|
|
1354
1334
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers_react.md
|
|
1355
1335
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_cards.html.erb
|
|
@@ -1413,21 +1393,12 @@ files:
|
|
|
1413
1393
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_default.jsx
|
|
1414
1394
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick.jsx
|
|
1415
1395
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick.md
|
|
1416
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_default_dates.html.erb
|
|
1417
1396
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_default_dates.jsx
|
|
1418
1397
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_default_dates.md
|
|
1419
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_rails.html.erb
|
|
1420
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_rails.md
|
|
1421
1398
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end.jsx
|
|
1422
1399
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end.md
|
|
1423
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end_rails.html.erb
|
|
1424
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_range_end_rails.md
|
|
1425
1400
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers.jsx
|
|
1426
1401
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers.md
|
|
1427
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_default_rails.html.erb
|
|
1428
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_default_rails.md
|
|
1429
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_rails.html.erb
|
|
1430
|
-
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_quickpick_with_date_pickers_rails.md
|
|
1431
1402
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_separators_hidden.html.erb
|
|
1432
1403
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_separators_hidden.jsx
|
|
1433
1404
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx
|
|
@@ -1493,7 +1464,6 @@ files:
|
|
|
1493
1464
|
- app/pb_kits/playbook/pb_dropdown/index.js
|
|
1494
1465
|
- app/pb_kits/playbook/pb_dropdown/keyboard_accessibility.js
|
|
1495
1466
|
- app/pb_kits/playbook/pb_dropdown/quickpick/index.ts
|
|
1496
|
-
- app/pb_kits/playbook/pb_dropdown/quickpick_helper.rb
|
|
1497
1467
|
- app/pb_kits/playbook/pb_dropdown/scss_partials/_dropdown_animation.scss
|
|
1498
1468
|
- app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownContainer.tsx
|
|
1499
1469
|
- app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownOption.tsx
|
|
@@ -2277,8 +2247,6 @@ files:
|
|
|
2277
2247
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.jsx
|
|
2278
2248
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.md
|
|
2279
2249
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size_swift.md
|
|
2280
|
-
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx
|
|
2281
|
-
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md
|
|
2282
2250
|
- app/pb_kits/playbook/pb_multiple_users/docs/example.yml
|
|
2283
2251
|
- app/pb_kits/playbook/pb_multiple_users/docs/index.js
|
|
2284
2252
|
- app/pb_kits/playbook/pb_multiple_users/multiple_users.html.erb
|
|
@@ -2962,9 +2930,6 @@ files:
|
|
|
2962
2930
|
- app/pb_kits/playbook/pb_select/docs/_select_inline_compact.jsx
|
|
2963
2931
|
- app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.html.erb
|
|
2964
2932
|
- app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.jsx
|
|
2965
|
-
- app/pb_kits/playbook/pb_select/docs/_select_input_options.html.erb
|
|
2966
|
-
- app/pb_kits/playbook/pb_select/docs/_select_input_options.jsx
|
|
2967
|
-
- app/pb_kits/playbook/pb_select/docs/_select_input_options.md
|
|
2968
2933
|
- app/pb_kits/playbook/pb_select/docs/_select_multiple.html.erb
|
|
2969
2934
|
- app/pb_kits/playbook/pb_select/docs/_select_multiple.jsx
|
|
2970
2935
|
- app/pb_kits/playbook/pb_select/docs/_select_multiple.md
|
|
@@ -3272,14 +3237,6 @@ files:
|
|
|
3272
3237
|
- app/pb_kits/playbook/pb_table/docs/_table_with_dynamic_collapsible.jsx
|
|
3273
3238
|
- app/pb_kits/playbook/pb_table/docs/_table_with_dynamic_collapsible_rails.md
|
|
3274
3239
|
- app/pb_kits/playbook/pb_table/docs/_table_with_dynamic_collapsible_react.md
|
|
3275
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant.jsx
|
|
3276
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant.md
|
|
3277
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_rails.html.erb
|
|
3278
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_rails.md
|
|
3279
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination.jsx
|
|
3280
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination.md
|
|
3281
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination_rails.html.erb
|
|
3282
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_with_pagination_rails.md
|
|
3283
3240
|
- app/pb_kits/playbook/pb_table/docs/_table_with_header_style_borderless.html.erb
|
|
3284
3241
|
- app/pb_kits/playbook/pb_table/docs/_table_with_header_style_borderless.jsx
|
|
3285
3242
|
- app/pb_kits/playbook/pb_table/docs/_table_with_header_style_borderless_rails.md
|
|
@@ -3464,9 +3421,6 @@ files:
|
|
|
3464
3421
|
- app/pb_kits/playbook/pb_timeline/docs/_description.md
|
|
3465
3422
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_default.html.erb
|
|
3466
3423
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_default.jsx
|
|
3467
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.html.erb
|
|
3468
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.jsx
|
|
3469
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_show_current_year.md
|
|
3470
3424
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.html.erb
|
|
3471
3425
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.jsx
|
|
3472
3426
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb
|
|
@@ -3696,9 +3650,6 @@ files:
|
|
|
3696
3650
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_error_state.md
|
|
3697
3651
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_inline.html.erb
|
|
3698
3652
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_inline.jsx
|
|
3699
|
-
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.html.erb
|
|
3700
|
-
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.jsx
|
|
3701
|
-
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.md
|
|
3702
3653
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.html.erb
|
|
3703
3654
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.jsx
|
|
3704
3655
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.html.erb
|
|
@@ -3863,7 +3814,6 @@ files:
|
|
|
3863
3814
|
- app/pb_kits/playbook/utilities/_truncate.scss
|
|
3864
3815
|
- app/pb_kits/playbook/utilities/_vertical_align.scss
|
|
3865
3816
|
- app/pb_kits/playbook/utilities/_width.scss
|
|
3866
|
-
- app/pb_kits/playbook/utilities/deprecated.ts
|
|
3867
3817
|
- app/pb_kits/playbook/utilities/flexbox_global_props/_align_content.scss
|
|
3868
3818
|
- app/pb_kits/playbook/utilities/flexbox_global_props/_align_items.scss
|
|
3869
3819
|
- app/pb_kits/playbook/utilities/flexbox_global_props/_align_self.scss
|
|
@@ -3903,9 +3853,9 @@ files:
|
|
|
3903
3853
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
|
3904
3854
|
- app/pb_kits/playbook/utilities/text.ts
|
|
3905
3855
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
|
3906
|
-
- dist/chunks/_typeahead-
|
|
3856
|
+
- dist/chunks/_typeahead-kRdz5zPn.js
|
|
3907
3857
|
- dist/chunks/lazysizes-B7xYodB-.js
|
|
3908
|
-
- dist/chunks/lib-
|
|
3858
|
+
- dist/chunks/lib-CgpqUb6l.js
|
|
3909
3859
|
- dist/chunks/vendor.js
|
|
3910
3860
|
- dist/menu.yml
|
|
3911
3861
|
- dist/playbook-rails-react-bindings.js
|
data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_background_colors_rails.html.erb
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
<% column_definitions = [
|
|
2
|
-
{
|
|
3
|
-
accessor: "year",
|
|
4
|
-
label: "Year",
|
|
5
|
-
cellAccessors: ["quarter", "month", "day"],
|
|
6
|
-
},
|
|
7
|
-
{
|
|
8
|
-
accessor: "newEnrollments",
|
|
9
|
-
label: "New Enrollments",
|
|
10
|
-
column_styling: {
|
|
11
|
-
cell_background_color: ->(row) { row[:newEnrollments].to_i > 20 ? "success_secondary" : "warning_secondary" }
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
accessor: "scheduledMeetings",
|
|
16
|
-
label: "Scheduled Meetings",
|
|
17
|
-
},
|
|
18
|
-
{
|
|
19
|
-
accessor: "attendanceRate",
|
|
20
|
-
label: "Attendance Rate",
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
accessor: "completedClasses",
|
|
24
|
-
label: "Completed Classes",
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
accessor: "classCompletionRate",
|
|
28
|
-
label: "Class Completion Rate",
|
|
29
|
-
column_styling: {
|
|
30
|
-
cell_background_color: "category_1",
|
|
31
|
-
font_color: "white"
|
|
32
|
-
}
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
accessor: "graduatedStudents",
|
|
36
|
-
label: "Graduated Students",
|
|
37
|
-
}
|
|
38
|
-
] %>
|
|
39
|
-
|
|
40
|
-
<%= pb_rails("advanced_table", props: { id: "background-control", table_data: @table_data, column_definitions: column_definitions }) do %>
|
|
41
|
-
<%= pb_rails("advanced_table/table_header", props: { table_id: "background-control", column_definitions: column_definitions }) %>
|
|
42
|
-
<%= pb_rails("advanced_table/table_body", props: { table_id: "background-control", table_data: @table_data, column_definitions: column_definitions }) %>
|
|
43
|
-
<% end %>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
`column_styling` can also be used to control the background color on individual cells in a given column as shown here.
|
data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.jsx
DELETED
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import React from "react"
|
|
2
|
-
import AdvancedTable from '../_advanced_table'
|
|
3
|
-
import colors from '../../tokens/exports/_colors.module.scss'
|
|
4
|
-
import MOCK_DATA from "./advanced_table_mock_data.json"
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const AdvancedTableColumnStylingBackground = (props) => {
|
|
8
|
-
const columnDefinitions = [
|
|
9
|
-
{
|
|
10
|
-
accessor: "year",
|
|
11
|
-
label: "Year",
|
|
12
|
-
cellAccessors: ["quarter", "month", "day"],
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
accessor: "newEnrollments",
|
|
16
|
-
label: "New Enrollments",
|
|
17
|
-
columnStyling:{cellBackgroundColor: colors.error_subtle, headerBackgroundColor: colors.error_subtle},
|
|
18
|
-
},
|
|
19
|
-
{
|
|
20
|
-
accessor: "scheduledMeetings",
|
|
21
|
-
label: "Scheduled Meetings",
|
|
22
|
-
columnStyling:{cellBackgroundColor: colors.info_subtle},
|
|
23
|
-
},
|
|
24
|
-
{
|
|
25
|
-
accessor: "attendanceRate",
|
|
26
|
-
label: "Attendance Rate",
|
|
27
|
-
columnStyling:{cellBackgroundColor: colors.info, headerBackgroundColor: colors.info, fontColor: colors.white, headerFontColor: colors.white},
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
accessor: "completedClasses",
|
|
31
|
-
label: "Completed Classes",
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
accessor: "classCompletionRate",
|
|
35
|
-
label: "Class Completion Rate",
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
accessor: "graduatedStudents",
|
|
39
|
-
label: "Graduated Students",
|
|
40
|
-
},
|
|
41
|
-
]
|
|
42
|
-
|
|
43
|
-
return (
|
|
44
|
-
<div>
|
|
45
|
-
<AdvancedTable
|
|
46
|
-
columnDefinitions={columnDefinitions}
|
|
47
|
-
tableData={MOCK_DATA}
|
|
48
|
-
{...props}
|
|
49
|
-
/>
|
|
50
|
-
</div>
|
|
51
|
-
)
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
export default AdvancedTableColumnStylingBackground
|
data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.md
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
The `columnStyling` prop can also be used to set background color for entire columns.As stated above, `columnStyling` is an object that has several optional key/value pairs, here are the options highlighted in this doc:
|
|
2
|
-
|
|
3
|
-
1) `cellBackgroundColor`: use this to control the background color of all cells in the given column
|
|
4
|
-
2) `headerBackgroundColor`: use this to control the background color of the column header
|
|
5
|
-
3) `fontColor`: use this to control font color for all cells in the given column if needed, for example if using a darker background color.
|
|
6
|
-
4) `headerFontColor`: use this to control font color for the header in the given column if needed, for example if using a darker background color.
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.jsx
DELETED
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import React from "react"
|
|
2
|
-
import AdvancedTable from '../_advanced_table'
|
|
3
|
-
import colors from '../../tokens/exports/_colors.module.scss'
|
|
4
|
-
import MOCK_DATA from "./advanced_table_mock_data.json"
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const AdvancedTableColumnStylingBackgroundMulti = (props) => {
|
|
8
|
-
const columnDefinitions = [
|
|
9
|
-
{
|
|
10
|
-
accessor: "year",
|
|
11
|
-
label: "Year",
|
|
12
|
-
cellAccessors: ["quarter", "month", "day"],
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
label: "Enrollment Data",
|
|
16
|
-
columns: [
|
|
17
|
-
{
|
|
18
|
-
label: "Enrollment Stats",
|
|
19
|
-
columns: [
|
|
20
|
-
{
|
|
21
|
-
accessor: "newEnrollments",
|
|
22
|
-
label: "New Enrollments",
|
|
23
|
-
columnStyling:{cellBackgroundColor: colors.error_subtle, headerBackgroundColor: colors.error_subtle},
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
accessor: "scheduledMeetings",
|
|
27
|
-
label: "Scheduled Meetings",
|
|
28
|
-
},
|
|
29
|
-
],
|
|
30
|
-
},
|
|
31
|
-
],
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
label: "Performance Data",
|
|
35
|
-
columns: [
|
|
36
|
-
{
|
|
37
|
-
label: "Completion Metrics",
|
|
38
|
-
columns: [
|
|
39
|
-
{
|
|
40
|
-
accessor: "completedClasses",
|
|
41
|
-
label: "Completed Classes",
|
|
42
|
-
columnStyling:{cellBackgroundColor: colors.info, headerBackgroundColor: colors.info, fontColor: colors.white, headerFontColor: colors.white},
|
|
43
|
-
},
|
|
44
|
-
{
|
|
45
|
-
accessor: "classCompletionRate",
|
|
46
|
-
label: "Class Completion Rate",
|
|
47
|
-
},
|
|
48
|
-
],
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
label: "Attendance",
|
|
52
|
-
columns: [
|
|
53
|
-
{
|
|
54
|
-
accessor: "attendanceRate",
|
|
55
|
-
label: "Attendance Rate",
|
|
56
|
-
columnStyling:{cellBackgroundColor: colors.info_subtle},
|
|
57
|
-
},
|
|
58
|
-
{
|
|
59
|
-
accessor: "scheduledMeetings",
|
|
60
|
-
label: "Scheduled Meetings",
|
|
61
|
-
},
|
|
62
|
-
],
|
|
63
|
-
},
|
|
64
|
-
],
|
|
65
|
-
},
|
|
66
|
-
];
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
return (
|
|
70
|
-
<div>
|
|
71
|
-
<AdvancedTable
|
|
72
|
-
columnDefinitions={columnDefinitions}
|
|
73
|
-
tableData={MOCK_DATA}
|
|
74
|
-
{...props}
|
|
75
|
-
/>
|
|
76
|
-
</div>
|
|
77
|
-
)
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
export default AdvancedTableColumnStylingBackgroundMulti
|
data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.md
DELETED
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
The `columnStyling` prop can also be used to set background color for entire columns for the multi header variant as well.
|
|
2
|
-
|
|
3
|
-
It should be noted that `headerFontColor` and `headerBackgroundColor` in the multi header variant will only apply to the immediate header for the given column as shown here.
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
By default, the Background kit sets background color to 'light' as seen here.
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
<%= pb_rails("body", props: { color: "default" }) do %>
|
|
2
|
-
<%= pb_rails("contact", props: {
|
|
3
|
-
contact_value: "2125551234",
|
|
4
|
-
icon_enabled: false,
|
|
5
|
-
unstyled: true
|
|
6
|
-
}) %>
|
|
7
|
-
<% end %>
|
|
8
|
-
|
|
9
|
-
<%= pb_rails("body", props: { color: "light" }) do %>
|
|
10
|
-
<%= pb_rails("contact", props: {
|
|
11
|
-
contact_value: "12125551234",
|
|
12
|
-
icon_enabled: false,
|
|
13
|
-
unstyled: true
|
|
14
|
-
}) %>
|
|
15
|
-
<% end %>
|
|
16
|
-
|
|
17
|
-
<%= pb_rails("body", props: { color: "lighter" }) do %>
|
|
18
|
-
<%= pb_rails("contact", props: {
|
|
19
|
-
contact_value: "4155551234",
|
|
20
|
-
icon_enabled: false,
|
|
21
|
-
unstyled: true
|
|
22
|
-
}) %>
|
|
23
|
-
<% end %>
|
|
24
|
-
|
|
25
|
-
<%= pb_rails("body", props: { color: "default" }) do %>
|
|
26
|
-
<%= pb_rails("contact", props: {
|
|
27
|
-
contact_type: "extension",
|
|
28
|
-
contact_value: "1234",
|
|
29
|
-
icon_enabled: false,
|
|
30
|
-
unstyled: true
|
|
31
|
-
}) %>
|
|
32
|
-
<% end %>
|
|
33
|
-
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import Contact from "../../pb_contact/_contact"
|
|
3
|
-
import Body from "../../pb_body/_body"
|
|
4
|
-
|
|
5
|
-
const ContactUnstyled = (props) => {
|
|
6
|
-
return (
|
|
7
|
-
<div>
|
|
8
|
-
<Body color="default">
|
|
9
|
-
<Contact
|
|
10
|
-
contactValue="2125551234"
|
|
11
|
-
iconEnabled={false}
|
|
12
|
-
unstyled
|
|
13
|
-
{...props}
|
|
14
|
-
/>
|
|
15
|
-
</Body>
|
|
16
|
-
<Body color="light">
|
|
17
|
-
<Contact
|
|
18
|
-
contactValue="12125551234"
|
|
19
|
-
iconEnabled={false}
|
|
20
|
-
unstyled
|
|
21
|
-
{...props}
|
|
22
|
-
/>
|
|
23
|
-
</Body>
|
|
24
|
-
<Body color="lighter">
|
|
25
|
-
<Contact
|
|
26
|
-
contactValue="4155551234"
|
|
27
|
-
iconEnabled={false}
|
|
28
|
-
unstyled
|
|
29
|
-
{...props}
|
|
30
|
-
/>
|
|
31
|
-
</Body>
|
|
32
|
-
<Body color="default">
|
|
33
|
-
<Contact
|
|
34
|
-
contactType="extension"
|
|
35
|
-
contactValue="1234"
|
|
36
|
-
iconEnabled={false}
|
|
37
|
-
unstyled
|
|
38
|
-
{...props}
|
|
39
|
-
/>
|
|
40
|
-
</Body>
|
|
41
|
-
</div>
|
|
42
|
-
)
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
export default ContactUnstyled
|
|
46
|
-
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
Use the Contact kit with `icon_enabled: false` and `unstyled: true` to display phone numbers with full typography control. When `unstyled: true`, the Contact kit renders just the formatted text without a Body wrapper, allowing you to wrap it in your own Typography kit to control the color and styling.
|
|
2
|
-
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
Use the Contact kit with `iconEnabled={false}` and `unstyled` to display phone numbers with full typography control. With `unstyled`, the Contact kit renders just the formatted text without a Body wrapper, allowing you to wrap it in your own Typography kit to control the color and styling.
|
|
2
|
-
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
<%= pb_rails("flex", props:{wrap:true}) do %>
|
|
2
|
-
<%= pb_rails("button", props: { text: "Open Simple Dialog", data: {"open-dialog": "dialog-simple"}, margin_right:"md" }) %>
|
|
3
|
-
<%= pb_rails("button", props: { text: "Open Complex Dialog", data: {"open-dialog": "dialog-complex2"} }) %>
|
|
4
|
-
<% end %>
|
|
5
|
-
|
|
6
|
-
<%= pb_rails("dialog", props: {
|
|
7
|
-
id:"dialog-simple",
|
|
8
|
-
size: "sm",
|
|
9
|
-
title: "Header Title is the Title Prop",
|
|
10
|
-
text: "Hello Body Text, Nice to meet ya.",
|
|
11
|
-
cancel_button: "Cancel Button",
|
|
12
|
-
closeable: false,
|
|
13
|
-
confirm_button: "Okay",
|
|
14
|
-
confirm_button_id: "confirm-button-simple"
|
|
15
|
-
}) %>
|
|
16
|
-
|
|
17
|
-
<%= pb_rails("dialog", props: {
|
|
18
|
-
id:"dialog-complex2",
|
|
19
|
-
size: "sm"
|
|
20
|
-
}) do %>
|
|
21
|
-
<%= pb_rails("dialog/dialog_header", props: { id: "dialog-complex2", title:"Header Title inside Dialog Header", closeable: false } ) %>
|
|
22
|
-
<%= pb_rails("dialog/dialog_body", props:{text: "Hello Body Text, Nice to meet ya."}) %>
|
|
23
|
-
<%= pb_rails("dialog/dialog_footer", props: {cancel_button: "Cancel Button", confirm_button: "Okay", confirm_button_id:"confirm-complex2", id: "dialog-complex2"}) %>
|
|
24
|
-
<% end %>
|