playbook_ui 15.0.0.pre.alpha.stimulusbutton10763 → 15.0.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/_playbook.scss +0 -3
- data/app/pb_kits/playbook/pb_advanced_table/Components/RegularTableView.tsx +11 -24
- data/app/pb_kits/playbook/pb_advanced_table/Components/VirtualizedTableView.tsx +7 -7
- data/app/pb_kits/playbook/pb_advanced_table/Utilities/RowUtils.ts +2 -7
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +13 -67
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_vertical_border.jsx +2 -2
- data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +1 -0
- data/app/pb_kits/playbook/pb_button/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_card/_card.scss +4 -12
- data/app/pb_kits/playbook/pb_card/_card.tsx +3 -3
- data/app/pb_kits/playbook/pb_card/_card_mixin.scss +0 -10
- data/app/pb_kits/playbook/pb_card/docs/_card_highlight.html.erb +0 -3
- data/app/pb_kits/playbook/pb_card/docs/_card_highlight.jsx +0 -8
- data/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx +0 -2
- data/app/pb_kits/playbook/pb_circle_icon_button/circle_icon_button.html.erb +0 -1
- data/app/pb_kits/playbook/pb_collapsible/__snapshots__/collapsible.test.js.snap +0 -1
- data/app/pb_kits/playbook/pb_contact/_contact.tsx +0 -5
- data/app/pb_kits/playbook/pb_contact/contact.rb +0 -4
- data/app/pb_kits/playbook/pb_contact/contact.test.js +1 -21
- data/app/pb_kits/playbook/pb_contact/docs/_contact_default.html.erb +1 -16
- data/app/pb_kits/playbook/pb_contact/docs/_contact_default.jsx +0 -15
- data/app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.html.erb +0 -6
- data/app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.jsx +0 -6
- data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +4 -6
- data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +4 -48
- data/app/pb_kits/playbook/pb_dialog/_close_icon.tsx +1 -5
- data/app/pb_kits/playbook/pb_dialog/_dialog.tsx +8 -6
- data/app/pb_kits/playbook/pb_dialog/dialog.html.erb +1 -1
- data/app/pb_kits/playbook/pb_dialog/dialogHelper.js +65 -0
- data/app/pb_kits/playbook/pb_dialog/dialog_header.html.erb +2 -2
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx +0 -9
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/fixed_confirmation_toast.html.erb +3 -3
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +0 -1
- data/app/pb_kits/playbook/pb_icon/_icon.tsx +2 -13
- data/app/pb_kits/playbook/pb_icon/icon.rb +1 -9
- data/app/pb_kits/playbook/pb_icon_button/_icon_button.tsx +0 -1
- data/app/pb_kits/playbook/pb_icon_button/icon_button.html.erb +1 -2
- data/app/pb_kits/playbook/pb_icon_circle/icon_circle.html.erb +1 -1
- data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx +1 -3
- data/app/pb_kits/playbook/pb_loading_inline/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_loading_inline/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_loading_inline/loading_inline.html.erb +1 -1
- data/app/pb_kits/playbook/pb_loading_inline/loading_inline.rb +0 -11
- data/app/pb_kits/playbook/pb_nav/_item.tsx +5 -19
- data/app/pb_kits/playbook/pb_nav/_nav.scss +0 -27
- data/app/pb_kits/playbook/pb_nav/_nav.test.js +0 -16
- data/app/pb_kits/playbook/pb_nav/_nav.tsx +0 -5
- data/app/pb_kits/playbook/pb_nav/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_nav/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_nav/item.html.erb +2 -6
- data/app/pb_kits/playbook/pb_nav/nav.rb +1 -6
- data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.html.erb +3 -3
- data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_common.html.erb +3 -3
- data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_confirmation.html.erb +3 -3
- data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_meter_settings.html.erb +3 -3
- data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_strength_change.html.erb +3 -3
- data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.html.erb +2 -2
- data/app/pb_kits/playbook/pb_section_separator/_section_separator.scss +5 -13
- data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_children.html.erb +0 -23
- data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_children.jsx +7 -45
- data/app/pb_kits/playbook/pb_section_separator/section_separator.html.erb +1 -4
- data/app/pb_kits/playbook/pb_text_input/_text_input.tsx +0 -3
- data/app/pb_kits/playbook/pb_text_input/docs/example.yml +0 -3
- data/app/pb_kits/playbook/pb_text_input/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_text_input/text_input.rb +3 -2
- data/app/pb_kits/playbook/pb_text_input/text_input.test.js +0 -38
- data/app/pb_kits/playbook/pb_timestamp/_timestamp.tsx +8 -24
- data/app/pb_kits/playbook/pb_timestamp/docs/_time_stamp_default.md +1 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.html.erb +10 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.jsx +9 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.html.erb +17 -3
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.jsx +15 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.html.erb +2 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.jsx +2 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.html.erb +14 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.jsx +14 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.html.erb +4 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.jsx +4 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated.jsx +1 -0
- data/app/pb_kits/playbook/pb_timestamp/docs/example.yml +6 -18
- data/app/pb_kits/playbook/pb_timestamp/docs/index.js +0 -6
- data/app/pb_kits/playbook/pb_timestamp/timestamp.rb +7 -29
- data/app/pb_kits/playbook/pb_timestamp/timestamp.test.js +4 -69
- data/dist/chunks/{_line_graph-C9stNsP3.js → _line_graph-CIyKqNGy.js} +1 -1
- data/dist/chunks/_typeahead-B-mDRLxH.js +6 -0
- data/dist/chunks/_weekday_stacked-B_lp1Spt.js +37 -0
- data/dist/chunks/{lib-QZuu1ltS.js → lib-DgtxnJqa.js} +2 -2
- data/dist/chunks/{pb_form_validation-CleM960_.js → pb_form_validation-_NsOWfBS.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +1 -15
- data/dist/playbook-doc.js +2 -2
- 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/engine.rb +1 -0
- data/lib/playbook/forms/builder/form_field_builder.rb +2 -37
- data/lib/playbook/kit_base.rb +2 -23
- data/lib/playbook/version.rb +2 -2
- metadata +28 -116
- data/app/pb_kits/playbook/pb_button/docs/_button_managed_disabled.html.erb +0 -29
- data/app/pb_kits/playbook/pb_button/docs/_button_managed_disabled.md +0 -5
- data/app/pb_kits/playbook/pb_button/docs/_button_managed_disabled_helper.html.erb +0 -18
- data/app/pb_kits/playbook/pb_button/docs/_button_managed_disabled_helper.md +0 -5
- data/app/pb_kits/playbook/pb_button/index.js +0 -99
- data/app/pb_kits/playbook/pb_contact/docs/_contact_default.md +0 -5
- data/app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_variant.html.erb +0 -5
- data/app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_variant.jsx +0 -24
- data/app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.html.erb +0 -6
- data/app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.jsx +0 -39
- data/app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.md +0 -1
- data/app/pb_kits/playbook/pb_pb_bar_graph/_pb_bar_graph.scss +0 -0
- data/app/pb_kits/playbook/pb_pb_bar_graph/_pb_bar_graph.tsx +0 -62
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors.html.erb +0 -35
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors.jsx +0 -49
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors_rails.md +0 -1
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors_react.md +0 -2
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_default.html.erb +0 -38
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_default.jsx +0 -51
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.html.erb +0 -46
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.jsx +0 -62
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.md +0 -3
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_horizontal.html.erb +0 -47
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_horizontal.jsx +0 -60
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend.html.erb +0 -25
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend.jsx +0 -36
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_non_clickable.jsx +0 -44
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_position.html.erb +0 -100
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_position.jsx +0 -126
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_negative_numbers.html.erb +0 -32
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_negative_numbers.jsx +0 -48
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_secondary_y_axis.html.erb +0 -68
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_secondary_y_axis.jsx +0 -81
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.html.erb +0 -31
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.jsx +0 -42
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.md +0 -2
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_stacked.html.erb +0 -35
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_stacked.jsx +0 -51
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/example.yml +0 -27
- data/app/pb_kits/playbook/pb_pb_bar_graph/docs/index.js +0 -11
- data/app/pb_kits/playbook/pb_pb_bar_graph/pbBarGraphTheme.ts +0 -106
- data/app/pb_kits/playbook/pb_pb_bar_graph/pb_bar_graph.html.erb +0 -1
- data/app/pb_kits/playbook/pb_pb_bar_graph/pb_bar_graph.rb +0 -28
- data/app/pb_kits/playbook/pb_pb_bar_graph/pbbargraph.test.jsx +0 -31
- data/app/pb_kits/playbook/pb_pb_circle_chart/_pb_circle_chart.scss +0 -3
- data/app/pb_kits/playbook/pb_pb_circle_chart/_pb_circle_chart.tsx +0 -62
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.html.erb +0 -31
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.jsx +0 -81
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.html.erb +0 -25
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.jsx +0 -40
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.md +0 -5
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.html.erb +0 -27
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.jsx +0 -39
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.md +0 -5
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.html.erb +0 -93
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.jsx +0 -131
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.md +0 -14
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_labels.html.erb +0 -42
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_labels.jsx +0 -58
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_legend.html.erb +0 -24
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_legend.jsx +0 -38
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_default.html.erb +0 -22
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_default.jsx +0 -33
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_inner_sizes.html.erb +0 -118
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_inner_sizes.jsx +0 -144
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_live_data.jsx +0 -60
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_rounded.html.erb +0 -24
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_rounded.jsx +0 -42
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_with_title.html.erb +0 -38
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_with_title.jsx +0 -52
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/example.yml +0 -29
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/index.js +0 -11
- data/app/pb_kits/playbook/pb_pb_circle_chart/pbCircleChartTheme.ts +0 -88
- data/app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.html.erb +0 -1
- data/app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.rb +0 -28
- data/app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.test.jsx +0 -51
- data/app/pb_kits/playbook/pb_section_separator/section_separator.test.js +0 -165
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.html.erb +0 -41
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.jsx +0 -80
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.md +0 -5
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.html.erb +0 -12
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.jsx +0 -25
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.html.erb +0 -4
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.jsx +0 -17
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.html.erb +0 -18
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.jsx +0 -44
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated.md +0 -5
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.html.erb +0 -16
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.jsx +0 -30
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.html.erb +0 -16
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.jsx +0 -30
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.md +0 -1
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.html.erb +0 -26
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.jsx +0 -41
- data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.md +0 -1
- data/dist/chunks/_typeahead-D3MtsWXG.js +0 -6
- data/dist/chunks/_weekday_stacked-BMwekyel.js +0 -37
- data/dist/chunks/componentRegistry-DzmmLR2x.js +0 -1
data/lib/playbook/engine.rb
CHANGED
@@ -4,58 +4,23 @@ module Playbook
|
|
4
4
|
module Forms
|
5
5
|
class Builder
|
6
6
|
class FormFieldBuilder < Module
|
7
|
-
MASK_PATTERNS = {
|
8
|
-
"currency" => '^\$\d{1,3}(?:,\d{3})*(?:\.\d{2})?$',
|
9
|
-
"zip_code" => '\d{5}',
|
10
|
-
"postal_code" => '\d{5}-\d{4}',
|
11
|
-
"ssn" => '\d{3}-\d{2}-\d{4}',
|
12
|
-
"credit_card" => '\d{4} \d{4} \d{4} \d{4}',
|
13
|
-
"cvv" => '\d{3,4}',
|
14
|
-
}.freeze
|
15
|
-
|
16
7
|
def initialize(method_name, kit_name:)
|
17
8
|
define_method method_name do |name, props: {}, **options, &block|
|
18
|
-
props
|
9
|
+
props[:label] = @template.label(@object_name, name) if props[:label] == true
|
19
10
|
options = Hash(options)
|
20
11
|
|
21
12
|
options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
|
22
13
|
options[:required] = true if props[:required]
|
23
14
|
options[:placeholder] = props[:placeholder] || ""
|
24
|
-
options[:type] = props[:type] if props.key?(:type)
|
25
|
-
options[:value] = props[:value] if props.key?(:value)
|
26
|
-
options[:disabled] = true if props.key?(:disabled) && props[:disabled]
|
27
|
-
if props.key?(:disabled)
|
28
|
-
cursor_style = props[:disabled] ? "not-allowed" : "pointer"
|
29
|
-
existing_style = options[:style] || ""
|
30
|
-
|
31
|
-
options[:style] =
|
32
|
-
existing_style.empty? ? "cursor: #{cursor_style}" : "#{existing_style}; cursor: #{cursor_style}"
|
33
|
-
end
|
34
|
-
if props.key?(:autocomplete)
|
35
|
-
options[:autocomplete] = props[:autocomplete] == true ? nil : (props[:autocomplete].presence || "off")
|
36
|
-
end
|
37
|
-
if props.key?(:mask) && props[:mask].present?
|
38
|
-
options[:mask] = props[:mask]
|
39
|
-
options[:data] = (options[:data] || {}).merge(pb_input_mask: true)
|
40
|
-
options[:pattern] = MASK_PATTERNS[props[:mask]]
|
41
|
-
end
|
42
15
|
|
43
16
|
if props.key?(:validation)
|
44
17
|
validation = props[:validation]
|
45
18
|
options[:pattern] = validation[:pattern] if validation[:pattern].present?
|
46
|
-
options[:data] =
|
19
|
+
options[:data] = { message: validation[:message] } if validation[:message].present?
|
47
20
|
end
|
48
21
|
|
49
22
|
input = super(name, **options, &block)
|
50
23
|
|
51
|
-
input_id = input[/\bid="([^"]+)"/, 1] || "#{@object_name}_#{name}"
|
52
|
-
|
53
|
-
if props[:label] == true
|
54
|
-
props[:label] = @template.label(@object_name, name)
|
55
|
-
elsif props[:label].is_a?(String)
|
56
|
-
props[:label] = @template.label_tag(input_id, props[:label])
|
57
|
-
end
|
58
|
-
|
59
24
|
@template.pb_rails(kit_name, props: props) do
|
60
25
|
input
|
61
26
|
end
|
data/lib/playbook/kit_base.rb
CHANGED
@@ -122,7 +122,7 @@ module Playbook
|
|
122
122
|
html_options.each do |key, value|
|
123
123
|
if key == :style && value.is_a?(Hash)
|
124
124
|
# Convert style hash to CSS string
|
125
|
-
merged[:style] = value.map { |k, v| "#{k.to_s.
|
125
|
+
merged[:style] = value.map { |k, v| "#{k.to_s.gsub('_', '-')}: #{v}" }.join("; ")
|
126
126
|
else
|
127
127
|
merged[key] = value
|
128
128
|
end
|
@@ -136,27 +136,6 @@ module Playbook
|
|
136
136
|
merged.deep_merge(data_attributes)
|
137
137
|
end
|
138
138
|
|
139
|
-
# Custom react_component helper to replace Webpacker React
|
140
|
-
# This will render a div with data attributes for the component name and props
|
141
|
-
# The mounting script will look for these divs and mount the appropriate React components
|
142
|
-
# Sister def in app/helpers/react_helper in playbook-website. Any changes here should be reflected there.
|
143
|
-
def react_component(component_name, props = {}, html_options = {})
|
144
|
-
# Convert props to JSON for the data attribute
|
145
|
-
props_json = props.to_json
|
146
|
-
|
147
|
-
# Build the HTML attributes
|
148
|
-
html_attrs = {
|
149
|
-
"data-pb-react-component" => component_name,
|
150
|
-
"data-pb-react-props" => props_json,
|
151
|
-
}
|
152
|
-
|
153
|
-
# Merge with any additional HTML options
|
154
|
-
html_attrs.merge!(html_options)
|
155
|
-
|
156
|
-
# Return the div element
|
157
|
-
content_tag(:div, "", html_attrs)
|
158
|
-
end
|
159
|
-
|
160
139
|
def global_inline_props
|
161
140
|
{
|
162
141
|
height: height,
|
@@ -193,7 +172,7 @@ module Playbook
|
|
193
172
|
end
|
194
173
|
|
195
174
|
def dynamic_inline_props
|
196
|
-
styles = global_inline_props.map { |key, value| "#{key.to_s.
|
175
|
+
styles = global_inline_props.map { |key, value| "#{key.to_s.gsub('_', '-')}: #{value}" if inline_validator(key, value) }.compact
|
197
176
|
styles.join("; ").presence
|
198
177
|
end
|
199
178
|
|
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.0.0
|
4
|
+
version: 15.0.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-09-
|
12
|
+
date: 2025-09-08 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -53,6 +53,20 @@ dependencies:
|
|
53
53
|
- - ">="
|
54
54
|
- !ruby/object:Gem::Version
|
55
55
|
version: 5.2.4.5
|
56
|
+
- !ruby/object:Gem::Dependency
|
57
|
+
name: react-rails
|
58
|
+
requirement: !ruby/object:Gem::Requirement
|
59
|
+
requirements:
|
60
|
+
- - '='
|
61
|
+
- !ruby/object:Gem::Version
|
62
|
+
version: 2.6.1
|
63
|
+
type: :runtime
|
64
|
+
prerelease: false
|
65
|
+
version_requirements: !ruby/object:Gem::Requirement
|
66
|
+
requirements:
|
67
|
+
- - '='
|
68
|
+
- !ruby/object:Gem::Version
|
69
|
+
version: 2.6.1
|
56
70
|
- !ruby/object:Gem::Dependency
|
57
71
|
name: view_component
|
58
72
|
requirement: !ruby/object:Gem::Requirement
|
@@ -68,19 +82,19 @@ dependencies:
|
|
68
82
|
- !ruby/object:Gem::Version
|
69
83
|
version: 2.83.0
|
70
84
|
- !ruby/object:Gem::Dependency
|
71
|
-
name:
|
85
|
+
name: webpacker-react
|
72
86
|
requirement: !ruby/object:Gem::Requirement
|
73
87
|
requirements:
|
74
|
-
- - "
|
88
|
+
- - "~>"
|
75
89
|
- !ruby/object:Gem::Version
|
76
|
-
version:
|
90
|
+
version: 0.3.2
|
77
91
|
type: :runtime
|
78
92
|
prerelease: false
|
79
93
|
version_requirements: !ruby/object:Gem::Requirement
|
80
94
|
requirements:
|
81
|
-
- - "
|
95
|
+
- - "~>"
|
82
96
|
- !ruby/object:Gem::Version
|
83
|
-
version:
|
97
|
+
version: 0.3.2
|
84
98
|
- !ruby/object:Gem::Dependency
|
85
99
|
name: brakeman
|
86
100
|
requirement: !ruby/object:Gem::Requirement
|
@@ -628,10 +642,6 @@ files:
|
|
628
642
|
- app/pb_kits/playbook/pb_button/docs/_button_loading.html.erb
|
629
643
|
- app/pb_kits/playbook/pb_button/docs/_button_loading.jsx
|
630
644
|
- app/pb_kits/playbook/pb_button/docs/_button_loading.md
|
631
|
-
- app/pb_kits/playbook/pb_button/docs/_button_managed_disabled.html.erb
|
632
|
-
- app/pb_kits/playbook/pb_button/docs/_button_managed_disabled.md
|
633
|
-
- app/pb_kits/playbook/pb_button/docs/_button_managed_disabled_helper.html.erb
|
634
|
-
- app/pb_kits/playbook/pb_button/docs/_button_managed_disabled_helper.md
|
635
645
|
- app/pb_kits/playbook/pb_button/docs/_button_options.html.erb
|
636
646
|
- app/pb_kits/playbook/pb_button/docs/_button_options.jsx
|
637
647
|
- app/pb_kits/playbook/pb_button/docs/_button_props_swift.md
|
@@ -646,7 +656,6 @@ files:
|
|
646
656
|
- app/pb_kits/playbook/pb_button/docs/_footer.md
|
647
657
|
- app/pb_kits/playbook/pb_button/docs/example.yml
|
648
658
|
- app/pb_kits/playbook/pb_button/docs/index.js
|
649
|
-
- app/pb_kits/playbook/pb_button/index.js
|
650
659
|
- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar.scss
|
651
660
|
- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar.tsx
|
652
661
|
- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar_dark.scss
|
@@ -880,7 +889,6 @@ files:
|
|
880
889
|
- app/pb_kits/playbook/pb_contact/contact.test.js
|
881
890
|
- app/pb_kits/playbook/pb_contact/docs/_contact_default.html.erb
|
882
891
|
- app/pb_kits/playbook/pb_contact/docs/_contact_default.jsx
|
883
|
-
- app/pb_kits/playbook/pb_contact/docs/_contact_default.md
|
884
892
|
- app/pb_kits/playbook/pb_contact/docs/_contact_default_swift.md
|
885
893
|
- app/pb_kits/playbook/pb_contact/docs/_contact_props_swift.md
|
886
894
|
- app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.html.erb
|
@@ -1212,6 +1220,7 @@ files:
|
|
1212
1220
|
- app/pb_kits/playbook/pb_dialog/dialog.html.erb
|
1213
1221
|
- app/pb_kits/playbook/pb_dialog/dialog.rb
|
1214
1222
|
- app/pb_kits/playbook/pb_dialog/dialog.test.jsx
|
1223
|
+
- app/pb_kits/playbook/pb_dialog/dialogHelper.js
|
1215
1224
|
- app/pb_kits/playbook/pb_dialog/dialog_body.html.erb
|
1216
1225
|
- app/pb_kits/playbook/pb_dialog/dialog_body.rb
|
1217
1226
|
- app/pb_kits/playbook/pb_dialog/dialog_footer.html.erb
|
@@ -2082,8 +2091,6 @@ files:
|
|
2082
2091
|
- app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_custom.jsx
|
2083
2092
|
- app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_default.html.erb
|
2084
2093
|
- app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_default.jsx
|
2085
|
-
- app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_variant.html.erb
|
2086
|
-
- app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_variant.jsx
|
2087
2094
|
- app/pb_kits/playbook/pb_loading_inline/docs/example.yml
|
2088
2095
|
- app/pb_kits/playbook/pb_loading_inline/docs/index.js
|
2089
2096
|
- app/pb_kits/playbook/pb_loading_inline/loading_inline.html.erb
|
@@ -2269,9 +2276,6 @@ files:
|
|
2269
2276
|
- app/pb_kits/playbook/pb_nav/docs/_description.md
|
2270
2277
|
- app/pb_kits/playbook/pb_nav/docs/_horizontal_nav.html.erb
|
2271
2278
|
- app/pb_kits/playbook/pb_nav/docs/_horizontal_nav.jsx
|
2272
|
-
- app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.html.erb
|
2273
|
-
- app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.jsx
|
2274
|
-
- app/pb_kits/playbook/pb_nav/docs/_horizontal_nav_extendedunderline.md
|
2275
2279
|
- app/pb_kits/playbook/pb_nav/docs/_nav_horizontal_bold_swift.md
|
2276
2280
|
- app/pb_kits/playbook/pb_nav/docs/_nav_horizontal_default_swift.md
|
2277
2281
|
- app/pb_kits/playbook/pb_nav/docs/_nav_horizontal_subtle_no_highlight_swift.md
|
@@ -2410,71 +2414,6 @@ files:
|
|
2410
2414
|
- app/pb_kits/playbook/pb_passphrase/passphrase.html.erb
|
2411
2415
|
- app/pb_kits/playbook/pb_passphrase/passphrase.rb
|
2412
2416
|
- app/pb_kits/playbook/pb_passphrase/passphrase.test.jsx
|
2413
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/_pb_bar_graph.scss
|
2414
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/_pb_bar_graph.tsx
|
2415
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors.html.erb
|
2416
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors.jsx
|
2417
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors_rails.md
|
2418
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_colors_react.md
|
2419
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_default.html.erb
|
2420
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_default.jsx
|
2421
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.html.erb
|
2422
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.jsx
|
2423
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_height.md
|
2424
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_horizontal.html.erb
|
2425
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_horizontal.jsx
|
2426
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend.html.erb
|
2427
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend.jsx
|
2428
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_non_clickable.jsx
|
2429
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_position.html.erb
|
2430
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_legend_position.jsx
|
2431
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_negative_numbers.html.erb
|
2432
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_negative_numbers.jsx
|
2433
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_secondary_y_axis.html.erb
|
2434
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_secondary_y_axis.jsx
|
2435
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.html.erb
|
2436
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.jsx
|
2437
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_spline.md
|
2438
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_stacked.html.erb
|
2439
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/_pb_bar_graph_stacked.jsx
|
2440
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/example.yml
|
2441
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/docs/index.js
|
2442
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/pbBarGraphTheme.ts
|
2443
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/pb_bar_graph.html.erb
|
2444
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/pb_bar_graph.rb
|
2445
|
-
- app/pb_kits/playbook/pb_pb_bar_graph/pbbargraph.test.jsx
|
2446
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/_pb_circle_chart.scss
|
2447
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/_pb_circle_chart.tsx
|
2448
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.html.erb
|
2449
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.jsx
|
2450
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.html.erb
|
2451
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.jsx
|
2452
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.md
|
2453
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.html.erb
|
2454
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.jsx
|
2455
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_custom_tooltip.md
|
2456
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.html.erb
|
2457
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.jsx
|
2458
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_legend_position.md
|
2459
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_labels.html.erb
|
2460
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_labels.jsx
|
2461
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_legend.html.erb
|
2462
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_data_with_legend.jsx
|
2463
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_default.html.erb
|
2464
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_default.jsx
|
2465
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_inner_sizes.html.erb
|
2466
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_inner_sizes.jsx
|
2467
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_live_data.jsx
|
2468
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_rounded.html.erb
|
2469
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_rounded.jsx
|
2470
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_with_title.html.erb
|
2471
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_with_title.jsx
|
2472
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/example.yml
|
2473
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/docs/index.js
|
2474
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/pbCircleChartTheme.ts
|
2475
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.html.erb
|
2476
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.rb
|
2477
|
-
- app/pb_kits/playbook/pb_pb_circle_chart/pb_circle_chart.test.jsx
|
2478
2417
|
- app/pb_kits/playbook/pb_person/_person.scss
|
2479
2418
|
- app/pb_kits/playbook/pb_person/_person.tsx
|
2480
2419
|
- app/pb_kits/playbook/pb_person/docs/_description.md
|
@@ -2765,7 +2704,6 @@ files:
|
|
2765
2704
|
- app/pb_kits/playbook/pb_section_separator/docs/index.js
|
2766
2705
|
- app/pb_kits/playbook/pb_section_separator/section_separator.html.erb
|
2767
2706
|
- app/pb_kits/playbook/pb_section_separator/section_separator.rb
|
2768
|
-
- app/pb_kits/playbook/pb_section_separator/section_separator.test.js
|
2769
2707
|
- app/pb_kits/playbook/pb_select/_select.scss
|
2770
2708
|
- app/pb_kits/playbook/pb_select/_select.tsx
|
2771
2709
|
- app/pb_kits/playbook/pb_select/docs/_description.md
|
@@ -3173,9 +3111,6 @@ files:
|
|
3173
3111
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_add_on.html.erb
|
3174
3112
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_add_on.jsx
|
3175
3113
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_add_on_swift.md
|
3176
|
-
- app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.html.erb
|
3177
|
-
- app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.jsx
|
3178
|
-
- app/pb_kits/playbook/pb_text_input/docs/_text_input_autocomplete.md
|
3179
3114
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_custom.html.erb
|
3180
3115
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_custom.jsx
|
3181
3116
|
- app/pb_kits/playbook/pb_text_input/docs/_text_input_default.html.erb
|
@@ -3313,47 +3248,25 @@ files:
|
|
3313
3248
|
- app/pb_kits/playbook/pb_timestamp/_timestamp.tsx
|
3314
3249
|
- app/pb_kits/playbook/pb_timestamp/docs/_description.md
|
3315
3250
|
- app/pb_kits/playbook/pb_timestamp/docs/_footer.md
|
3251
|
+
- app/pb_kits/playbook/pb_timestamp/docs/_time_stamp_default.md
|
3316
3252
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.html.erb
|
3317
3253
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.jsx
|
3318
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align.md
|
3319
3254
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_align_swift.md
|
3320
3255
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.html.erb
|
3321
3256
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.jsx
|
3322
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default.md
|
3323
3257
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_default_swift.md
|
3324
3258
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.html.erb
|
3325
3259
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.jsx
|
3326
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed.md
|
3327
3260
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_elapsed_swift.md
|
3328
3261
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_props_swift.md
|
3329
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.html.erb
|
3330
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.jsx
|
3331
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_current_year.md
|
3332
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.html.erb
|
3333
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.jsx
|
3334
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_date.md
|
3335
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.html.erb
|
3336
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.jsx
|
3337
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_show_time.md
|
3338
3262
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.html.erb
|
3339
3263
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.jsx
|
3340
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones.md
|
3341
3264
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_timezones_swift.md
|
3342
3265
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.html.erb
|
3343
3266
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.jsx
|
3344
3267
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.md
|
3345
3268
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated.html.erb
|
3346
3269
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated.jsx
|
3347
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated.md
|
3348
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.html.erb
|
3349
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.jsx
|
3350
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_current_year.md
|
3351
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.html.erb
|
3352
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.jsx
|
3353
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_date.md
|
3354
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.html.erb
|
3355
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.jsx
|
3356
|
-
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_show_time.md
|
3357
3270
|
- app/pb_kits/playbook/pb_timestamp/docs/_timestamp_updated_swift.md
|
3358
3271
|
- app/pb_kits/playbook/pb_timestamp/docs/example.yml
|
3359
3272
|
- app/pb_kits/playbook/pb_timestamp/docs/index.js
|
@@ -3707,13 +3620,12 @@ files:
|
|
3707
3620
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3708
3621
|
- app/pb_kits/playbook/utilities/text.ts
|
3709
3622
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3710
|
-
- dist/chunks/_line_graph-
|
3711
|
-
- dist/chunks/_typeahead-
|
3712
|
-
- dist/chunks/_weekday_stacked-
|
3713
|
-
- dist/chunks/componentRegistry-DzmmLR2x.js
|
3623
|
+
- dist/chunks/_line_graph-CIyKqNGy.js
|
3624
|
+
- dist/chunks/_typeahead-B-mDRLxH.js
|
3625
|
+
- dist/chunks/_weekday_stacked-B_lp1Spt.js
|
3714
3626
|
- dist/chunks/lazysizes-B7xYodB-.js
|
3715
|
-
- dist/chunks/lib-
|
3716
|
-
- dist/chunks/pb_form_validation-
|
3627
|
+
- dist/chunks/lib-DgtxnJqa.js
|
3628
|
+
- dist/chunks/pb_form_validation-_NsOWfBS.js
|
3717
3629
|
- dist/chunks/vendor.js
|
3718
3630
|
- dist/menu.yml
|
3719
3631
|
- dist/playbook-doc.js
|
@@ -1,29 +0,0 @@
|
|
1
|
-
<br/>
|
2
|
-
<%= pb_rails("button", props: { text: "Disable Buttons", variant: "link", id: "toggle-disabled-demo" }) %>
|
3
|
-
<%= pb_rails("button", props: { text: "Enable Buttons", variant: "link", id: "toggle-enabled-demo" }) %>
|
4
|
-
<br/>
|
5
|
-
<%= pb_rails("button", props: { text: "I am a Normal Button", id: "normal_managed_button", data:{pb_button_managed: true}, margin_bottom: "lg" }) %>
|
6
|
-
<br/>
|
7
|
-
<%= pb_rails("button", props: { text: "I am an <a> Button", id: "a_tag_managed_button", tag:"a", data:{pb_button_managed: true}, link: "http://google.com", margin_right: "lg" }) %>
|
8
|
-
|
9
|
-
<script>
|
10
|
-
document.addEventListener('DOMContentLoaded', function () {
|
11
|
-
const disableTrigger = document.querySelector('#toggle-disabled-demo')
|
12
|
-
const enableTrigger = document.querySelector('#toggle-enabled-demo')
|
13
|
-
|
14
|
-
// Managed Buttons
|
15
|
-
const btn = document.querySelector('#normal_managed_button');
|
16
|
-
const link = document.querySelector('#a_tag_managed_button');
|
17
|
-
|
18
|
-
disableTrigger.addEventListener('click', (e) => {
|
19
|
-
// Disable both default button and a tag button
|
20
|
-
btn.setAttribute('disabled', true)
|
21
|
-
link.setAttribute('aria-disabled', 'true')
|
22
|
-
});
|
23
|
-
enableTrigger.addEventListener('click', (e) => {
|
24
|
-
// Enable both default button and a tag button
|
25
|
-
btn.removeAttribute('disabled')
|
26
|
-
link.removeAttribute('aria-disabled')
|
27
|
-
});
|
28
|
-
});
|
29
|
-
</script>
|
@@ -1,5 +0,0 @@
|
|
1
|
-
If needing to toggle the disabled state of the Button dynmically, you can now do so in rails using the `pb-button-managed` data attribute.
|
2
|
-
|
3
|
-
If your button has `data:{ pb-button-managed: true }` on it, you can then toggle state via attributes: for buttons set/remove disabled, for links set/remove aria-disabled="true". This will handle disabling the button, preventing clicks as well as all style changes so you don't have to.
|
4
|
-
|
5
|
-
Click to enable or disable the buttons above and view the code snippet below for details!
|
@@ -1,18 +0,0 @@
|
|
1
|
-
<%= pb_rails("button", props: { text: "Disable Button", variant: "link", id: "toggle-disabled-demo-with-helper" }) %>
|
2
|
-
<%= pb_rails("button", props: { text: "Enable Button", variant: "link", id: "toggle-enabled-demo-with-helper" }) %>
|
3
|
-
<br/>
|
4
|
-
<%= pb_rails("button", props: { text: "Watch me Change!", id: "managed_button_with_helper", data:{pb_button_managed: true} }) %>
|
5
|
-
|
6
|
-
<script>
|
7
|
-
document.addEventListener('DOMContentLoaded', function () {
|
8
|
-
const demoBtn = document.querySelector('#managed_button_with_helper')
|
9
|
-
|
10
|
-
const disable = document.querySelector('#toggle-disabled-demo-with-helper')
|
11
|
-
const enable = document.querySelector('#toggle-enabled-demo-with-helper')
|
12
|
-
|
13
|
-
disable.addEventListener('click', (e) => {demoBtn._pbButton.disable()});
|
14
|
-
|
15
|
-
enable.addEventListener('click', (e) => {demoBtn._pbButton.enable()});
|
16
|
-
|
17
|
-
});
|
18
|
-
</script>
|
@@ -1,5 +0,0 @@
|
|
1
|
-
The disabled state for the button can also be toggled via small helpers available through the `pb-button-managed` data attribute.
|
2
|
-
|
3
|
-
If your button has `data:{ pb-button-managed: true }` on it, you can then toggle state via the provided `_pbButton.disable()` and `_pbButton.enable()` helpers as shoen in the code snippet below.
|
4
|
-
|
5
|
-
Click to enable or disable the buttons above!
|
@@ -1,99 +0,0 @@
|
|
1
|
-
import PbEnhancedElement from "../pb_enhanced_element"
|
2
|
-
|
3
|
-
const BUTTON_SELECTOR = "[data-pb-button-managed]"
|
4
|
-
|
5
|
-
export default class PbButton extends PbEnhancedElement {
|
6
|
-
static get selector() {
|
7
|
-
return BUTTON_SELECTOR
|
8
|
-
}
|
9
|
-
|
10
|
-
connect() {
|
11
|
-
this._attrManaged = this._attributesPresent()
|
12
|
-
this.element._pbButton = this
|
13
|
-
|
14
|
-
this._onClick = (e) => {
|
15
|
-
if (this.isDisabled()) {
|
16
|
-
e.preventDefault()
|
17
|
-
e.stopImmediatePropagation()
|
18
|
-
}
|
19
|
-
}
|
20
|
-
this.element.addEventListener("click", this._onClick, true)
|
21
|
-
|
22
|
-
if (this._attrManaged) this._syncClassesFromAttributes()
|
23
|
-
|
24
|
-
this._observer = new MutationObserver(() => {
|
25
|
-
this._attrManaged = true
|
26
|
-
this._syncClassesFromAttributes()
|
27
|
-
})
|
28
|
-
this._observer.observe(this.element, {
|
29
|
-
attributes: true,
|
30
|
-
attributeFilter: ["disabled", "aria-disabled"],
|
31
|
-
})
|
32
|
-
}
|
33
|
-
|
34
|
-
disconnect() {
|
35
|
-
this.element.removeEventListener("click", this._onClick, true)
|
36
|
-
this._observer?.disconnect()
|
37
|
-
delete this.element._pbButton
|
38
|
-
}
|
39
|
-
|
40
|
-
disable() { this.setDisabled(true) }
|
41
|
-
enable() { this.setDisabled(false) }
|
42
|
-
|
43
|
-
setDisabled(state) {
|
44
|
-
if (this._isButton()) {
|
45
|
-
state
|
46
|
-
? this.element.setAttribute("disabled", "disabled")
|
47
|
-
: this.element.removeAttribute("disabled")
|
48
|
-
} else {
|
49
|
-
state
|
50
|
-
? this.element.setAttribute("aria-disabled", "true")
|
51
|
-
: this.element.removeAttribute("aria-disabled")
|
52
|
-
}
|
53
|
-
this._attrManaged = true
|
54
|
-
this._applyClassState(state)
|
55
|
-
}
|
56
|
-
|
57
|
-
isDisabled() {
|
58
|
-
if (this._isButton()) {
|
59
|
-
if (this.element.hasAttribute("disabled")) return true
|
60
|
-
if (this._attrManaged && !this.element.hasAttribute("disabled")) return false
|
61
|
-
} else {
|
62
|
-
const aria = this.element.getAttribute("aria-disabled")
|
63
|
-
if (aria === "true") return true
|
64
|
-
if (this._attrManaged && aria !== "true") return false
|
65
|
-
}
|
66
|
-
return this.element.classList.contains("pb_button_disabled")
|
67
|
-
}
|
68
|
-
|
69
|
-
_isButton() {
|
70
|
-
return this.element.tagName === "BUTTON"
|
71
|
-
}
|
72
|
-
|
73
|
-
_attributesPresent() {
|
74
|
-
return this.element.hasAttribute("disabled") || this.element.hasAttribute("aria-disabled")
|
75
|
-
}
|
76
|
-
|
77
|
-
_syncClassesFromAttributes() {
|
78
|
-
const state = this._attrDisabledState()
|
79
|
-
const disabled = (state === null) ? false : state
|
80
|
-
this._applyClassState(disabled)
|
81
|
-
}
|
82
|
-
|
83
|
-
_attrDisabledState() {
|
84
|
-
if (this._isButton()) {
|
85
|
-
return this.element.hasAttribute("disabled") ? true : null
|
86
|
-
} else {
|
87
|
-
const aria = this.element.getAttribute("aria-disabled")
|
88
|
-
if (aria === "true") return true
|
89
|
-
if (aria === "false") return false
|
90
|
-
return this.element.hasAttribute("aria-disabled") ? false : null
|
91
|
-
}
|
92
|
-
}
|
93
|
-
|
94
|
-
_applyClassState(disabled) {
|
95
|
-
this.element.classList.toggle("pb_button_disabled", !!disabled)
|
96
|
-
this.element.classList.toggle("pb_button_enabled", !disabled)
|
97
|
-
}
|
98
|
-
}
|
99
|
-
|
@@ -1,5 +0,0 @@
|
|
1
|
-
The Contact kit automatically formats US phone numbers when the `contactType` / `contact_type` is one of: `home` (default), `work`, `cell`, `work-cell`, `wrong-phone`.
|
2
|
-
|
3
|
-
- Use `email` to display emails.
|
4
|
-
- Use `international` to display International phone numbers exactly as provided (no formatting applied).
|
5
|
-
- Use `extension` to display four digit phone extensions.
|
@@ -1,24 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { LoadingInline } from 'playbook-ui'
|
3
|
-
|
4
|
-
const LoadingInlineVariant = (props) => {
|
5
|
-
return (
|
6
|
-
<div>
|
7
|
-
<LoadingInline
|
8
|
-
text=" Dotted Spinner"
|
9
|
-
variant="dotted"
|
10
|
-
{...props}
|
11
|
-
/>
|
12
|
-
|
13
|
-
<br />
|
14
|
-
|
15
|
-
<LoadingInline
|
16
|
-
text=" Solid Spinner"
|
17
|
-
variant="solid"
|
18
|
-
{...props}
|
19
|
-
/>
|
20
|
-
</div>
|
21
|
-
)
|
22
|
-
}
|
23
|
-
|
24
|
-
export default LoadingInlineVariant
|
@@ -1,6 +0,0 @@
|
|
1
|
-
<%= pb_rails("nav", props: { orientation: "horizontal", extended_underline: true }) do %>
|
2
|
-
<%= pb_rails("nav/item", props: { text: "About", link: "#" }) %>
|
3
|
-
<%= pb_rails("nav/item", props: { text: "Case Studies", link: "#", active: true }) %>
|
4
|
-
<%= pb_rails("nav/item", props: { text: "Service ", link: "#" }) %>
|
5
|
-
<%= pb_rails("nav/item", props: { text: "Contacts", link: "#" }) %>
|
6
|
-
<% end %>
|
@@ -1,39 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import Nav from '../_nav'
|
4
|
-
import NavItem from '../_item'
|
5
|
-
|
6
|
-
const HorizontalNavExtendedunderline = (props) => {
|
7
|
-
return (
|
8
|
-
<Nav
|
9
|
-
extendedUnderline
|
10
|
-
link="#"
|
11
|
-
orientation="horizontal"
|
12
|
-
{...props}
|
13
|
-
>
|
14
|
-
<NavItem
|
15
|
-
link="#"
|
16
|
-
text="About"
|
17
|
-
{...props}
|
18
|
-
/>
|
19
|
-
<NavItem
|
20
|
-
active
|
21
|
-
link="#"
|
22
|
-
text="Case Studies"
|
23
|
-
{...props}
|
24
|
-
/>
|
25
|
-
<NavItem
|
26
|
-
link="#"
|
27
|
-
text="Service"
|
28
|
-
{...props}
|
29
|
-
/>
|
30
|
-
<NavItem
|
31
|
-
link="#"
|
32
|
-
text="Contacts"
|
33
|
-
{...props}
|
34
|
-
/>
|
35
|
-
</Nav>
|
36
|
-
)
|
37
|
-
}
|
38
|
-
|
39
|
-
export default HorizontalNavExtendedunderline
|
@@ -1 +0,0 @@
|
|
1
|
-
The optional `extendedUnderline`/`extended_underline` prop can be used with the default `normal` variant of the horizontal orientation of the nav to extend the underline to take up the full width of the container.
|
File without changes
|