playbook_ui 14.13.0 → 14.14.0.pre.alpha.pbntr500currencykithandlingofnullvalues6275
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 -1
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +3 -0
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +6 -5
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.rb +8 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_custom_cell.jsx +75 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.html.erb +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_rails.md +3 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb +33 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md +3 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +2 -1
- data/app/pb_kits/playbook/pb_bar_graph/BarGraphStyles.scss +58 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx +64 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md +1 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +1 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_checkbox/_checkbox.tsx +17 -8
- data/app/pb_kits/playbook/pb_checkbox/checkbox.test.js +16 -0
- data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx +69 -0
- data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.md +1 -0
- data/app/pb_kits/playbook/pb_checkbox/docs/example.yml +2 -1
- data/app/pb_kits/playbook/pb_checkbox/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_currency/_currency.tsx +48 -32
- data/app/pb_kits/playbook/pb_currency/currency.html.erb +15 -8
- data/app/pb_kits/playbook/pb_currency/currency.rb +3 -0
- data/app/pb_kits/playbook/pb_currency/docs/_currency_null_display.html.erb +20 -0
- data/app/pb_kits/playbook/pb_currency/docs/_currency_null_display.jsx +34 -0
- data/app/pb_kits/playbook/pb_currency/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_currency/docs/index.js +2 -1
- data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +3 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.html.erb +2 -2
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.md +4 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.jsx +90 -0
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.md +5 -0
- data/app/pb_kits/playbook/pb_draggable/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_draggable/docs/index.js +2 -1
- data/app/pb_kits/playbook/pb_draggable/subcomponents/DraggableContainer.tsx +7 -4
- data/app/pb_kits/playbook/pb_draggable/subcomponents/DraggableItem.tsx +6 -3
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +1 -0
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -0
- data/app/pb_kits/playbook/pb_icon_button/docs/_icon_button_default.html.erb +1 -2
- data/app/pb_kits/playbook/pb_icon_button/docs/_icon_button_sizes.html.erb +27 -0
- data/app/pb_kits/playbook/pb_icon_button/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_icon_button/icon_button.html.erb +1 -1
- data/app/pb_kits/playbook/pb_icon_button/icon_button.rb +3 -0
- data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.html.erb +1 -6
- data/app/pb_kits/playbook/pb_nav/item.html.erb +7 -19
- data/app/pb_kits/playbook/pb_nav/nav.html.erb +3 -8
- data/app/pb_kits/playbook/pb_online_status/online_status.html.erb +1 -6
- data/app/pb_kits/playbook/pb_overlay/_overlay.tsx +4 -0
- data/app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional.jsx +37 -0
- data/app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional_react.md +1 -0
- data/app/pb_kits/playbook/pb_overlay/docs/example.yml +1 -0
- data/app/pb_kits/playbook/pb_overlay/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_token.tsx +48 -10
- data/app/pb_kits/playbook/pb_popover/popover.html.erb +1 -6
- data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.scss +6 -1
- data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.tsx +7 -5
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.html.erb +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.jsx +7 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.md +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.html.erb +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.jsx +18 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_rails.md +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_react.md +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_progress_pills/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_progress_pills/progress_pills.html.erb +2 -7
- data/app/pb_kits/playbook/pb_progress_pills/progress_pills.rb +6 -0
- data/app/pb_kits/playbook/pb_progress_pills/progress_pills.test.js +26 -1
- data/app/pb_kits/playbook/pb_progress_simple/progress_simple.html.erb +1 -5
- data/app/pb_kits/playbook/pb_progress_step/progress_step.html.erb +1 -5
- data/app/pb_kits/playbook/pb_progress_step/progress_step_item.html.erb +1 -5
- data/app/pb_kits/playbook/pb_radio/radio.html.erb +6 -11
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.html.erb +47 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.jsx +88 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.md +1 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx +1 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.html.erb +51 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_rails.md +2 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.html.erb +96 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.jsx +101 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.md +1 -0
- data/app/pb_kits/playbook/pb_table/docs/example.yml +5 -0
- data/app/pb_kits/playbook/pb_table/docs/index.js +3 -1
- data/app/pb_kits/playbook/pb_table/index.ts +41 -9
- data/app/pb_kits/playbook/pb_table/styles/_collapsible.scss +4 -0
- data/app/pb_kits/playbook/pb_table/subcomponents/_table_body.tsx +29 -2
- data/app/pb_kits/playbook/pb_table/subcomponents/_table_row.tsx +31 -3
- data/app/pb_kits/playbook/pb_table/table_body.html.erb +13 -7
- data/app/pb_kits/playbook/pb_table/table_body.rb +2 -0
- data/app/pb_kits/playbook/pb_table/table_row.html.erb +14 -7
- data/app/pb_kits/playbook/pb_table/table_row.rb +14 -1
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb +14 -0
- data/app/pb_kits/playbook/pb_text_input/index.js +9 -0
- data/app/pb_kits/playbook/pb_text_input/text_input.rb +5 -2
- data/dist/chunks/{_typeahead-btjo1UN5.js → _typeahead-PqkcDf1H.js} +4 -4
- data/dist/chunks/_weekday_stacked-BhC8Xp9l.js +45 -0
- data/dist/chunks/lazysizes-B7xYodB-.js +1 -0
- data/dist/chunks/{lib-DjpLC8uO.js → lib-D3us1bGD.js} +2 -2
- data/dist/chunks/{pb_form_validation-S56UaHZl.js → pb_form_validation-BpihMSOQ.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +0 -7
- 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/forms/builder/time_zone_select_field.rb +19 -0
- data/lib/playbook/forms/builder.rb +1 -0
- data/lib/playbook/version.rb +2 -2
- metadata +37 -24
- data/app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.scss +0 -66
- data/app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.tsx +0 -98
- data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb +0 -28
- data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.rb +0 -42
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.html.erb +0 -19
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.jsx +0 -26
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.html.erb +0 -10
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.jsx +0 -17
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_on_click.jsx +0 -19
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_onclick.html.erb +0 -16
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.html.erb +0 -35
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.jsx +0 -42
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb +0 -13
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml +0 -15
- data/app/pb_kits/playbook/pb_avatar_action_button/docs/index.js +0 -4
- data/app/pb_kits/playbook/pb_avatar_action_button/pb_avatar_action_button.test.js +0 -31
- data/dist/chunks/_weekday_stacked-DeYS_l8v.js +0 -45
- data/dist/chunks/lazysizes-DHz07jlL.js +0 -1
- /data/app/pb_kits/playbook/pb_table/docs/{_table_with_collapsible_with_custom_click.md → _table_with_collapsible_with_custom_click_react.md} +0 -0
@@ -0,0 +1,19 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module Forms
|
5
|
+
class Builder
|
6
|
+
def time_zone_select_field(name, choices = {}, options = {}, html_options = {}, props: {})
|
7
|
+
props[:label] = @template.label(@object_name, name) if props[:label] == true
|
8
|
+
options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
|
9
|
+
options[:prompt] = props[:blank_selection] || ""
|
10
|
+
html_options[:required] = "required" if props[:required]
|
11
|
+
input = @template.time_zone_select(@object_name, name, choices, options, html_options)
|
12
|
+
|
13
|
+
@template.pb_rails("select", props: props) do
|
14
|
+
input
|
15
|
+
end
|
16
|
+
end
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
@@ -15,6 +15,7 @@ module Playbook
|
|
15
15
|
require_relative "builder/phone_number_field"
|
16
16
|
require_relative "builder/dropdown_field"
|
17
17
|
require_relative "builder/star_rating_field"
|
18
|
+
require_relative "builder/time_zone_select_field"
|
18
19
|
|
19
20
|
prepend(FormFieldBuilder.new(:email_field, kit_name: "text_input"))
|
20
21
|
prepend(FormFieldBuilder.new(:number_field, kit_name: "text_input"))
|
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.
|
4
|
+
version: 14.14.0.pre.alpha.pbntr500currencykithandlingofnullvalues6275
|
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-02-
|
12
|
+
date: 2025-02-24 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -288,6 +288,7 @@ files:
|
|
288
288
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.html.erb
|
289
289
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.jsx
|
290
290
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.md
|
291
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_custom_cell.jsx
|
291
292
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.html.erb
|
292
293
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.jsx
|
293
294
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.md
|
@@ -333,7 +334,9 @@ files:
|
|
333
334
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx
|
334
335
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_rails.md
|
335
336
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md
|
337
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb
|
336
338
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx
|
339
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md
|
337
340
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md
|
338
341
|
- app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
|
339
342
|
- app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data.json
|
@@ -384,22 +387,6 @@ files:
|
|
384
387
|
- app/pb_kits/playbook/pb_avatar/docs/_footer.md
|
385
388
|
- app/pb_kits/playbook/pb_avatar/docs/example.yml
|
386
389
|
- app/pb_kits/playbook/pb_avatar/docs/index.js
|
387
|
-
- app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.scss
|
388
|
-
- app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.tsx
|
389
|
-
- app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb
|
390
|
-
- app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.rb
|
391
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.html.erb
|
392
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.jsx
|
393
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.html.erb
|
394
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.jsx
|
395
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_on_click.jsx
|
396
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_onclick.html.erb
|
397
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.html.erb
|
398
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.jsx
|
399
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb
|
400
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml
|
401
|
-
- app/pb_kits/playbook/pb_avatar_action_button/docs/index.js
|
402
|
-
- app/pb_kits/playbook/pb_avatar_action_button/pb_avatar_action_button.test.js
|
403
390
|
- app/pb_kits/playbook/pb_background/_background.scss
|
404
391
|
- app/pb_kits/playbook/pb_background/_background.tsx
|
405
392
|
- app/pb_kits/playbook/pb_background/background.html.erb
|
@@ -450,6 +437,7 @@ files:
|
|
450
437
|
- app/pb_kits/playbook/pb_badge/docs/_description.md
|
451
438
|
- app/pb_kits/playbook/pb_badge/docs/example.yml
|
452
439
|
- app/pb_kits/playbook/pb_badge/docs/index.js
|
440
|
+
- app/pb_kits/playbook/pb_bar_graph/BarGraphStyles.scss
|
453
441
|
- app/pb_kits/playbook/pb_bar_graph/_bar_graph.scss
|
454
442
|
- app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx
|
455
443
|
- app/pb_kits/playbook/pb_bar_graph/barGraph.test.js
|
@@ -478,6 +466,8 @@ files:
|
|
478
466
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.md
|
479
467
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.html.erb
|
480
468
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx
|
469
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx
|
470
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md
|
481
471
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.html.erb
|
482
472
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.jsx
|
483
473
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.md
|
@@ -682,6 +672,8 @@ files:
|
|
682
672
|
- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_swift.md
|
683
673
|
- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_options.html.erb
|
684
674
|
- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_props_swift.md
|
675
|
+
- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx
|
676
|
+
- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.md
|
685
677
|
- app/pb_kits/playbook/pb_checkbox/docs/_description.md
|
686
678
|
- app/pb_kits/playbook/pb_checkbox/docs/example.yml
|
687
679
|
- app/pb_kits/playbook/pb_checkbox/docs/index.js
|
@@ -833,6 +825,8 @@ files:
|
|
833
825
|
- app/pb_kits/playbook/pb_currency/docs/_currency_negative.jsx
|
834
826
|
- app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.html.erb
|
835
827
|
- app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.jsx
|
828
|
+
- app/pb_kits/playbook/pb_currency/docs/_currency_null_display.html.erb
|
829
|
+
- app/pb_kits/playbook/pb_currency/docs/_currency_null_display.jsx
|
836
830
|
- app/pb_kits/playbook/pb_currency/docs/_currency_props_swift.md
|
837
831
|
- app/pb_kits/playbook/pb_currency/docs/_currency_size.html.erb
|
838
832
|
- app/pb_kits/playbook/pb_currency/docs/_currency_size.jsx
|
@@ -1187,6 +1181,8 @@ files:
|
|
1187
1181
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md
|
1188
1182
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.html.erb
|
1189
1183
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.md
|
1184
|
+
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.jsx
|
1185
|
+
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.md
|
1190
1186
|
- app/pb_kits/playbook/pb_draggable/docs/example.yml
|
1191
1187
|
- app/pb_kits/playbook/pb_draggable/docs/index.js
|
1192
1188
|
- app/pb_kits/playbook/pb_draggable/draggable.html.erb
|
@@ -1629,6 +1625,7 @@ files:
|
|
1629
1625
|
- app/pb_kits/playbook/pb_icon/icon.test.js
|
1630
1626
|
- app/pb_kits/playbook/pb_icon_button/_icon_button.scss
|
1631
1627
|
- app/pb_kits/playbook/pb_icon_button/docs/_icon_button_default.html.erb
|
1628
|
+
- app/pb_kits/playbook/pb_icon_button/docs/_icon_button_sizes.html.erb
|
1632
1629
|
- app/pb_kits/playbook/pb_icon_button/docs/example.yml
|
1633
1630
|
- app/pb_kits/playbook/pb_icon_button/icon_button.html.erb
|
1634
1631
|
- app/pb_kits/playbook/pb_icon_button/icon_button.rb
|
@@ -2121,6 +2118,8 @@ files:
|
|
2121
2118
|
- app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.html.erb
|
2122
2119
|
- app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.jsx
|
2123
2120
|
- app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.md
|
2121
|
+
- app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional.jsx
|
2122
|
+
- app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional_react.md
|
2124
2123
|
- app/pb_kits/playbook/pb_overlay/docs/example.yml
|
2125
2124
|
- app/pb_kits/playbook/pb_overlay/docs/index.js
|
2126
2125
|
- app/pb_kits/playbook/pb_overlay/overlay.html.erb
|
@@ -2275,6 +2274,11 @@ files:
|
|
2275
2274
|
- app/pb_kits/playbook/pb_progress_pills/docs/_description.md
|
2276
2275
|
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.html.erb
|
2277
2276
|
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.jsx
|
2277
|
+
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.md
|
2278
|
+
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.html.erb
|
2279
|
+
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.jsx
|
2280
|
+
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_rails.md
|
2281
|
+
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_react.md
|
2278
2282
|
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_status.html.erb
|
2279
2283
|
- app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_status.jsx
|
2280
2284
|
- app/pb_kits/playbook/pb_progress_pills/docs/example.yml
|
@@ -2743,12 +2747,17 @@ files:
|
|
2743
2747
|
- app/pb_kits/playbook/pb_table/docs/_table_vertical_border.jsx
|
2744
2748
|
- app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.html.erb
|
2745
2749
|
- app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.jsx
|
2750
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.html.erb
|
2751
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.jsx
|
2752
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.md
|
2746
2753
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.html.erb
|
2747
2754
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx
|
2748
2755
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_rails.md
|
2749
2756
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_react.md
|
2757
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.html.erb
|
2750
2758
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.jsx
|
2751
|
-
- app/pb_kits/playbook/pb_table/docs/
|
2759
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_rails.md
|
2760
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_react.md
|
2752
2761
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.jsx
|
2753
2762
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.md
|
2754
2763
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.html.erb
|
@@ -2761,6 +2770,9 @@ files:
|
|
2761
2770
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table.md
|
2762
2771
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.html.erb
|
2763
2772
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.md
|
2773
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.html.erb
|
2774
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.jsx
|
2775
|
+
- app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.md
|
2764
2776
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.jsx
|
2765
2777
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.md
|
2766
2778
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.html.erb
|
@@ -3332,11 +3344,11 @@ files:
|
|
3332
3344
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3333
3345
|
- app/pb_kits/playbook/utilities/text.ts
|
3334
3346
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3335
|
-
- dist/chunks/_typeahead-
|
3336
|
-
- dist/chunks/_weekday_stacked-
|
3337
|
-
- dist/chunks/lazysizes-
|
3338
|
-
- dist/chunks/lib-
|
3339
|
-
- dist/chunks/pb_form_validation-
|
3347
|
+
- dist/chunks/_typeahead-PqkcDf1H.js
|
3348
|
+
- dist/chunks/_weekday_stacked-BhC8Xp9l.js
|
3349
|
+
- dist/chunks/lazysizes-B7xYodB-.js
|
3350
|
+
- dist/chunks/lib-D3us1bGD.js
|
3351
|
+
- dist/chunks/pb_form_validation-BpihMSOQ.js
|
3340
3352
|
- dist/chunks/vendor.js
|
3341
3353
|
- dist/menu.yml
|
3342
3354
|
- dist/playbook-doc.js
|
@@ -3372,6 +3384,7 @@ files:
|
|
3372
3384
|
- lib/playbook/forms/builder/phone_number_field.rb
|
3373
3385
|
- lib/playbook/forms/builder/select_field.rb
|
3374
3386
|
- lib/playbook/forms/builder/star_rating_field.rb
|
3387
|
+
- lib/playbook/forms/builder/time_zone_select_field.rb
|
3375
3388
|
- lib/playbook/forms/builder/typeahead_field.rb
|
3376
3389
|
- lib/playbook/height.rb
|
3377
3390
|
- lib/playbook/hover.rb
|
@@ -1,66 +0,0 @@
|
|
1
|
-
[class^=pb_avatar_action_button_kit] {
|
2
|
-
|
3
|
-
$icon_size: 0px;
|
4
|
-
$border_size: 0px;
|
5
|
-
|
6
|
-
$action-colors: (
|
7
|
-
"add": $primary,
|
8
|
-
"remove": $error,
|
9
|
-
);
|
10
|
-
|
11
|
-
@each $key, $value in $action-colors {
|
12
|
-
&[class*=_#{$key}] a {
|
13
|
-
color: $value;
|
14
|
-
}
|
15
|
-
}
|
16
|
-
|
17
|
-
@mixin icon-base {
|
18
|
-
&.dark{
|
19
|
-
background-color: $bg_dark
|
20
|
-
}
|
21
|
-
width: $icon_size;
|
22
|
-
height: $icon_size;
|
23
|
-
position: absolute;
|
24
|
-
background-color: $white;
|
25
|
-
border-radius: $icon_size;
|
26
|
-
font-size: ($icon_size - $border_size * 2);
|
27
|
-
display: flex;
|
28
|
-
justify-content: center;
|
29
|
-
align-items: center;
|
30
|
-
z-index: 1;
|
31
|
-
}
|
32
|
-
|
33
|
-
@each $name, $size in $avatar-sizes {
|
34
|
-
|
35
|
-
&[class*=_#{$name}] {
|
36
|
-
|
37
|
-
$avatar_size: map-get($avatar-sizes, $name);
|
38
|
-
$icon_size: $avatar_size / 2;
|
39
|
-
$border_size: $icon_size / 10;
|
40
|
-
|
41
|
-
position: relative;
|
42
|
-
width: $avatar_size * 1.25;
|
43
|
-
height: $avatar_size * 1.1;
|
44
|
-
display: flex;
|
45
|
-
|
46
|
-
[class^=pb_tooltip_kit] {
|
47
|
-
justify-self: center;
|
48
|
-
}
|
49
|
-
|
50
|
-
&[class*=_bottom] .icon {
|
51
|
-
@include icon-base;
|
52
|
-
top: $icon_size * 1.27;
|
53
|
-
}
|
54
|
-
&[class*=_top] .icon {
|
55
|
-
@include icon-base;
|
56
|
-
bottom: $icon_size * 1.27;
|
57
|
-
}
|
58
|
-
&[class*=_right] .icon {
|
59
|
-
left: $icon_size * 1.5;
|
60
|
-
}
|
61
|
-
&[class*=_left] [class^=pb_avatar_kit] {
|
62
|
-
padding-left: $icon_size / 2;
|
63
|
-
}
|
64
|
-
}
|
65
|
-
}
|
66
|
-
}
|
@@ -1,98 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import classnames from 'classnames'
|
3
|
-
|
4
|
-
import {
|
5
|
-
buildAriaProps,
|
6
|
-
buildCss,
|
7
|
-
buildDataProps,
|
8
|
-
buildHtmlProps } from '../utilities/props'
|
9
|
-
import { globalProps } from '../utilities/globalProps'
|
10
|
-
|
11
|
-
import Avatar from '../pb_avatar/_avatar'
|
12
|
-
import Icon from '../pb_icon/_icon'
|
13
|
-
|
14
|
-
type AvatarActionButtonProps = {
|
15
|
-
action?: "add" | "remove",
|
16
|
-
aria?: {[key: string]: string},
|
17
|
-
linkAriaLabel?: string,
|
18
|
-
className?: string,
|
19
|
-
dark?: boolean,
|
20
|
-
data?: {[key: string]: string},
|
21
|
-
htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
|
22
|
-
id?: string,
|
23
|
-
imageAlt?: string,
|
24
|
-
imageUrl?: string,
|
25
|
-
linkUrl?: string,
|
26
|
-
name?: string,
|
27
|
-
onClick?: React.MouseEventHandler<HTMLSpanElement>,
|
28
|
-
placement?: string,
|
29
|
-
size?: "md" | "lg" | "sm" | "xl" | "xs" | "xxs",
|
30
|
-
}
|
31
|
-
|
32
|
-
const AvatarActionButton = (props: AvatarActionButtonProps): React.ReactElement => {
|
33
|
-
const {
|
34
|
-
action = 'add',
|
35
|
-
aria = {},
|
36
|
-
linkAriaLabel,
|
37
|
-
className,
|
38
|
-
dark = false,
|
39
|
-
data = {},
|
40
|
-
htmlOptions = {},
|
41
|
-
id,
|
42
|
-
imageAlt = '',
|
43
|
-
imageUrl,
|
44
|
-
linkUrl,
|
45
|
-
name,
|
46
|
-
onClick,
|
47
|
-
placement = 'bottom left',
|
48
|
-
size = 'md',
|
49
|
-
} = props
|
50
|
-
|
51
|
-
const ariaProps = buildAriaProps(aria)
|
52
|
-
const dataProps = buildDataProps(data)
|
53
|
-
const htmlProps = buildHtmlProps(htmlOptions)
|
54
|
-
|
55
|
-
const classes = classnames(buildCss(
|
56
|
-
'pb_avatar_action_button_kit',
|
57
|
-
action,
|
58
|
-
placement,
|
59
|
-
size),
|
60
|
-
globalProps(props),
|
61
|
-
className)
|
62
|
-
|
63
|
-
const icons = {
|
64
|
-
add: 'plus-circle',
|
65
|
-
remove: 'times-circle',
|
66
|
-
}
|
67
|
-
|
68
|
-
return (
|
69
|
-
<div
|
70
|
-
{...ariaProps}
|
71
|
-
{...dataProps}
|
72
|
-
{...htmlProps}
|
73
|
-
className={classes}
|
74
|
-
id={id}
|
75
|
-
>
|
76
|
-
<a
|
77
|
-
aria-label={linkAriaLabel}
|
78
|
-
href={linkUrl}
|
79
|
-
onClick={onClick}
|
80
|
-
>
|
81
|
-
<Avatar
|
82
|
-
imageAlt={imageAlt}
|
83
|
-
imageUrl={imageUrl}
|
84
|
-
name={name}
|
85
|
-
size={size}
|
86
|
-
/>
|
87
|
-
<div className={`icon ${dark ? 'dark' : ''}`}>
|
88
|
-
<Icon
|
89
|
-
dark={dark}
|
90
|
-
icon={icons[action]}
|
91
|
-
/>
|
92
|
-
</div>
|
93
|
-
</a>
|
94
|
-
</div>
|
95
|
-
)
|
96
|
-
}
|
97
|
-
|
98
|
-
export default AvatarActionButton
|
@@ -1,28 +0,0 @@
|
|
1
|
-
<%= pb_content_tag do %>
|
2
|
-
<% if object.tooltip_text.present? %>
|
3
|
-
<%= pb_rails("tooltip", props: {
|
4
|
-
trigger_element_id: object.tooltip_id,
|
5
|
-
tooltip_id: "tooltip-2",
|
6
|
-
position: 'top'
|
7
|
-
}) do %>
|
8
|
-
<%= object.tooltip_text %>
|
9
|
-
<% end %>
|
10
|
-
<% end %>
|
11
|
-
|
12
|
-
<%= link_to object.link_url, id: object.tooltip_id, 'aria-label': object.link_aria_label do %>
|
13
|
-
<%= pb_rails("avatar", props: {
|
14
|
-
dark: object.dark,
|
15
|
-
name: object.name,
|
16
|
-
size: object.size,
|
17
|
-
image_alt: object.image_alt,
|
18
|
-
image_url: object.image_url,
|
19
|
-
class: "avatar_action"
|
20
|
-
}) %>
|
21
|
-
<div class="icon <%= object.dark ? 'dark' : '' %> ">
|
22
|
-
<%= pb_rails("icon", props: {
|
23
|
-
dark: object.dark,
|
24
|
-
icon: object.action_icons
|
25
|
-
}) %>
|
26
|
-
</div>
|
27
|
-
<% end %>
|
28
|
-
<% end %>
|
@@ -1,42 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
module Playbook
|
4
|
-
module PbAvatarActionButton
|
5
|
-
class AvatarActionButton < Playbook::KitBase
|
6
|
-
prop :action, type: Playbook::Props::String,
|
7
|
-
default: "add"
|
8
|
-
prop :link_aria_label, type: Playbook::Props::String
|
9
|
-
prop :image_alt, type: Playbook::Props::String
|
10
|
-
prop :image_url, type: Playbook::Props::String
|
11
|
-
prop :link_url, type: Playbook::Props::String, default: "#"
|
12
|
-
prop :tooltip_text, type: Playbook::Props::String
|
13
|
-
prop :tooltip_id, type: Playbook::Props::String
|
14
|
-
prop :name, type: Playbook::Props::String,
|
15
|
-
default: ""
|
16
|
-
prop :size, type: Playbook::Props::Enum,
|
17
|
-
values: %w[xs sm md lg xl],
|
18
|
-
default: "md"
|
19
|
-
prop :placement, type: Playbook::Props::Enum,
|
20
|
-
values: %w[bottom_left bottom_right top_left top_right],
|
21
|
-
default: "bottom_left"
|
22
|
-
|
23
|
-
def classname
|
24
|
-
generate_classname("pb_avatar_action_button_kit", action, size, placement)
|
25
|
-
end
|
26
|
-
|
27
|
-
def action_icons
|
28
|
-
icon_hash = {
|
29
|
-
add: "plus-circle",
|
30
|
-
remove: "times-circle",
|
31
|
-
}
|
32
|
-
# if an 'action' prop is passed that isn't
|
33
|
-
# in the icon_hash an empty string is returned
|
34
|
-
# instead of a null value, which would break the page
|
35
|
-
|
36
|
-
# double pipe ruby syntax below is essentially a reduced if-else statement
|
37
|
-
# if icon_hash[action.to_sym] returns a falsey value, return "" instead
|
38
|
-
icon_hash[action.to_sym] ||= ""
|
39
|
-
end
|
40
|
-
end
|
41
|
-
end
|
42
|
-
end
|
data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.html.erb
DELETED
@@ -1,19 +0,0 @@
|
|
1
|
-
<div class="pb--doc-demo-row">
|
2
|
-
|
3
|
-
<%= pb_rails("avatar_action_button", props: {
|
4
|
-
link_aria_label: "Add Sophia Carden",
|
5
|
-
name: "Sophia Carden",
|
6
|
-
image_alt: "Add Sophia Carden",
|
7
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
8
|
-
action: "add",
|
9
|
-
}) %>
|
10
|
-
|
11
|
-
<%= pb_rails("avatar_action_button", props: {
|
12
|
-
link_aria_label: "Remove Sophia Carden",
|
13
|
-
name: "Sophia Carden",
|
14
|
-
image_alt: "Remove Sophia Carden",
|
15
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
16
|
-
action: "remove",
|
17
|
-
}) %>
|
18
|
-
|
19
|
-
</div>
|
@@ -1,26 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import AvatarActionButton from '../_avatar_action_button'
|
4
|
-
|
5
|
-
const AvatarActionButtonActions = (props) => (
|
6
|
-
<div className="pb--doc-demo-row">
|
7
|
-
<AvatarActionButton
|
8
|
-
action="add"
|
9
|
-
imageAlt="Add Sophia Carden"
|
10
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
11
|
-
linkAriaLabel="Add Sophia Carden"
|
12
|
-
name="Sophia Carden"
|
13
|
-
{...props}
|
14
|
-
/>
|
15
|
-
<AvatarActionButton
|
16
|
-
action="remove"
|
17
|
-
imageAlt="Remove Sophia Carden"
|
18
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
19
|
-
linkAriaLabel="Remove Sophia Carden"
|
20
|
-
name="Sophia Carden"
|
21
|
-
{...props}
|
22
|
-
/>
|
23
|
-
</div>
|
24
|
-
)
|
25
|
-
|
26
|
-
export default AvatarActionButtonActions
|
@@ -1,17 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import AvatarActionButton from '../_avatar_action_button'
|
4
|
-
|
5
|
-
const AvatarActionButtonDefault = (props) => (
|
6
|
-
<div className="pb--doc-demo-row">
|
7
|
-
<AvatarActionButton
|
8
|
-
imageAlt="Sophia Carden"
|
9
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
10
|
-
linkAriaLabel="Sophia Carden"
|
11
|
-
name="Sophia Carden"
|
12
|
-
{...props}
|
13
|
-
/>
|
14
|
-
</div>
|
15
|
-
)
|
16
|
-
|
17
|
-
export default AvatarActionButtonDefault
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import AvatarActionButton from '../_avatar_action_button'
|
4
|
-
|
5
|
-
const AvatarActionButtonOnClick = (props) => (
|
6
|
-
<div className="pb--doc-demo-row">
|
7
|
-
<AvatarActionButton
|
8
|
-
imageAlt="Sophia Carden"
|
9
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
10
|
-
linkAriaLabel="Alert Sophia Carden"
|
11
|
-
linkUrl="https://www.google.com"
|
12
|
-
name="Sophia Carden"
|
13
|
-
onClick={() => alert('clicked!')}
|
14
|
-
{...props}
|
15
|
-
/>
|
16
|
-
</div>
|
17
|
-
)
|
18
|
-
|
19
|
-
export default AvatarActionButtonOnClick
|
data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_onclick.html.erb
DELETED
@@ -1,16 +0,0 @@
|
|
1
|
-
<div class="pb--doc-demo-row">
|
2
|
-
|
3
|
-
<%= pb_rails("avatar_action_button", props: {
|
4
|
-
link_aria_label: "Alert Sophia Carden",
|
5
|
-
name: "Sophia Carden",
|
6
|
-
id: "clickable",
|
7
|
-
link_url: "http://www.google.com",
|
8
|
-
image_alt: "Sophia Carden",
|
9
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
10
|
-
}) %>
|
11
|
-
|
12
|
-
<%= javascript_tag do %>
|
13
|
-
document.querySelector('#clickable').addEventListener('click', () => alert('clickable clicked!'))
|
14
|
-
<% end %>
|
15
|
-
|
16
|
-
</div>
|
data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.html.erb
DELETED
@@ -1,35 +0,0 @@
|
|
1
|
-
<div class="pb--doc-demo-row">
|
2
|
-
|
3
|
-
<%= pb_rails("avatar_action_button", props: {
|
4
|
-
link_aria_label: "Sophia Carden",
|
5
|
-
name: "Sophia Carden",
|
6
|
-
image_alt: "Sophia Carden",
|
7
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
8
|
-
placement: "bottom_left"
|
9
|
-
}) %>
|
10
|
-
|
11
|
-
<%= pb_rails("avatar_action_button", props: {
|
12
|
-
link_aria_label: "Sophia Carden",
|
13
|
-
name: "Sophia Carden",
|
14
|
-
image_alt: "Sophia Carden",
|
15
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
16
|
-
placement: "bottom_right"
|
17
|
-
}) %>
|
18
|
-
|
19
|
-
<%= pb_rails("avatar_action_button", props: {
|
20
|
-
link_aria_label: "Sophia Carden",
|
21
|
-
name: "Sophia Carden",
|
22
|
-
image_alt: "Sophia Carden",
|
23
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
24
|
-
placement: "top_left"
|
25
|
-
}) %>
|
26
|
-
|
27
|
-
<%= pb_rails("avatar_action_button", props: {
|
28
|
-
link_aria_label: "Sophia Carden",
|
29
|
-
name: "Sophia Carden",
|
30
|
-
image_alt: "Sophia Carden",
|
31
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
32
|
-
placement: "top_right"
|
33
|
-
}) %>
|
34
|
-
|
35
|
-
</div>
|
@@ -1,42 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import AvatarActionButton from '../_avatar_action_button'
|
4
|
-
|
5
|
-
const AvatarActionButtonPlacement = (props) => (
|
6
|
-
<div className="pb--doc-demo-row">
|
7
|
-
<AvatarActionButton
|
8
|
-
imageAlt="Sophia Carden"
|
9
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
10
|
-
linkAriaLabel="Sophia Carden"
|
11
|
-
name="Sophia Carden"
|
12
|
-
placement="bottom_left"
|
13
|
-
{...props}
|
14
|
-
/>
|
15
|
-
<AvatarActionButton
|
16
|
-
imageAlt="Sophia Carden"
|
17
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
18
|
-
linkAriaLabel="Sophia Carden"
|
19
|
-
name="Sophia Carden"
|
20
|
-
placement="bottom_right"
|
21
|
-
{...props}
|
22
|
-
/>
|
23
|
-
<AvatarActionButton
|
24
|
-
imageAlt="Sophia Carden"
|
25
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
26
|
-
linkAriaLabel="Sophia Carden"
|
27
|
-
name="Sophia Carden"
|
28
|
-
placement="top_left"
|
29
|
-
{...props}
|
30
|
-
/>
|
31
|
-
<AvatarActionButton
|
32
|
-
imageAlt="Sophia Carden"
|
33
|
-
imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
|
34
|
-
linkAriaLabel="Sophia Carden"
|
35
|
-
name="Sophia Carden"
|
36
|
-
placement="top_right"
|
37
|
-
{...props}
|
38
|
-
/>
|
39
|
-
</div>
|
40
|
-
)
|
41
|
-
|
42
|
-
export default AvatarActionButtonPlacement
|
data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb
DELETED
@@ -1,13 +0,0 @@
|
|
1
|
-
<div class="pb--doc-demo-row">
|
2
|
-
|
3
|
-
<%= pb_rails("avatar_action_button", props: {
|
4
|
-
link_aria_label: "Sophia Carden",
|
5
|
-
name: "Sophia Carden",
|
6
|
-
link_url: "http://www.google.com",
|
7
|
-
image_alt: "Sophia Carden",
|
8
|
-
image_url: "https://randomuser.me/api/portraits/women/8.jpg",
|
9
|
-
tooltip_text: "Tooltip Text",
|
10
|
-
tooltip_id: "avatar_1",
|
11
|
-
}) %>
|
12
|
-
|
13
|
-
</div>
|