playbook_ui 12.23.0 → 12.24.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown756

Sign up to get free protection for your applications and to get access to all the features.
Files changed (57) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_swift.md +1 -0
  3. data/app/pb_kits/playbook/pb_avatar/docs/example.yml +2 -0
  4. data/app/pb_kits/playbook/pb_card/_card.tsx +1 -0
  5. data/app/pb_kits/playbook/pb_date/_date.tsx +96 -42
  6. data/app/pb_kits/playbook/pb_date/date.html.erb +22 -2
  7. data/app/pb_kits/playbook/pb_date/date.rb +2 -0
  8. data/app/pb_kits/playbook/pb_date/docs/_date_unstyled.html.erb +30 -0
  9. data/app/pb_kits/playbook/pb_date/docs/_date_unstyled.jsx +47 -0
  10. data/app/pb_kits/playbook/pb_date/docs/_date_unstyled.md +1 -0
  11. data/app/pb_kits/playbook/pb_date/docs/example.yml +4 -4
  12. data/app/pb_kits/playbook/pb_date/docs/index.js +1 -0
  13. data/app/pb_kits/playbook/pb_date_picker/_date_picker.scss +26 -0
  14. data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +99 -95
  15. data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +3 -2
  16. data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +1 -1
  17. data/app/pb_kits/playbook/pb_date_picker/date_picker.test.js +44 -1
  18. data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +34 -2
  19. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick.html.erb +8 -0
  20. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick.jsx +18 -0
  21. data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +2 -0
  22. data/app/pb_kits/playbook/pb_date_picker/docs/index.js +2 -1
  23. data/app/pb_kits/playbook/pb_date_picker/plugins/quickPick.tsx +164 -0
  24. data/app/pb_kits/playbook/pb_date_picker/sass_partials/_calendar_input_icon.scss +3 -2
  25. data/app/pb_kits/playbook/pb_date_picker/sass_partials/_quick_pick_styles.scss +75 -0
  26. data/app/pb_kits/playbook/pb_docs/kit_example.html.erb +6 -1
  27. data/app/pb_kits/playbook/pb_docs/kit_example.rb +13 -4
  28. data/app/pb_kits/playbook/pb_nav/_item.tsx +1 -1
  29. data/app/pb_kits/playbook/pb_nav/_subtle_mixin.scss +1 -1
  30. data/app/pb_kits/playbook/pb_time/_time.tsx +71 -35
  31. data/app/pb_kits/playbook/pb_time/docs/_time_unstyled.html.erb +37 -0
  32. data/app/pb_kits/playbook/pb_time/docs/_time_unstyled.jsx +58 -0
  33. data/app/pb_kits/playbook/pb_time/docs/_time_unstyled.md +1 -0
  34. data/app/pb_kits/playbook/pb_time/docs/example.yml +2 -0
  35. data/app/pb_kits/playbook/pb_time/docs/index.js +1 -0
  36. data/app/pb_kits/playbook/pb_time/time.html.erb +26 -7
  37. data/app/pb_kits/playbook/pb_time/time.rb +2 -0
  38. data/app/pb_kits/playbook/pb_title/_title.scss +3 -1
  39. data/app/pb_kits/playbook/pb_title/_title.tsx +3 -2
  40. data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.html.erb +1 -0
  41. data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.jsx +11 -6
  42. data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.md +2 -2
  43. data/app/pb_kits/playbook/pb_title/title.rb +10 -3
  44. data/app/pb_kits/playbook/pb_title/title.test.js +3 -3
  45. data/app/pb_kits/playbook/tokens/_screen_sizes.scss +19 -0
  46. data/app/pb_kits/playbook/utilities/_spacing.scss +27 -1
  47. data/app/pb_kits/playbook/utilities/globalProps.ts +61 -16
  48. data/dist/playbook-rails.js +323 -0
  49. data/lib/playbook/pb_doc_helper.rb +4 -1
  50. data/lib/playbook/spacing.rb +20 -5
  51. data/lib/playbook/version.rb +2 -2
  52. data/lib/playbook.rb +1 -2
  53. metadata +23 -41
  54. data/app/pb_kits/playbook/pb_docs/kit_api.html.erb +0 -311
  55. data/app/pb_kits/playbook/pb_docs/kit_api.rb +0 -149
  56. data/lib/playbook/markdown/helper.rb +0 -132
  57. data/lib/playbook/markdown.rb +0 -3
@@ -84,8 +84,11 @@ module Playbook
84
84
  def pb_doc_render_clickable_title(kit, type)
85
85
  url = "#"
86
86
  begin
87
- url = if type == "react"
87
+ url = case type
88
+ when "react"
88
89
  kit_show_reacts_path(kit)
90
+ when "swift"
91
+ kit_show_swift_path(kit)
89
92
  else
90
93
  kit_show_path(kit)
91
94
  end
@@ -50,17 +50,32 @@ module Playbook
50
50
  end
51
51
 
52
52
  def spacing_values
53
- %w[none xxs xs sm md lg xl]
53
+ %w[none xxs xs sm md lg xl auto initial inherit]
54
+ end
55
+
56
+ def screen_size_values
57
+ %w[xs sm md lg xl]
54
58
  end
55
59
 
56
60
  def spacing_props
57
61
  selected_props = spacing_options.keys.select { |sk| try(sk) }
58
62
  return nil unless selected_props.present?
59
63
 
60
- selected_props.map do |k|
61
- spacing_value = send(k)
62
- "#{spacing_options[k]}_#{spacing_value}" if spacing_values.include? spacing_value
63
- end.compact.join(" ")
64
+ responsive = selected_props.present? && try(selected_props.first).is_a?(::Hash)
65
+ css = ""
66
+ selected_props.each do |prop|
67
+ spacing_value = send(prop)
68
+ prefix = spacing_options[prop]
69
+ if responsive
70
+ spacing_value.each do |key, value|
71
+ css += "#{prefix}_#{key}_#{value} " if screen_size_values.include?(key.to_s) && spacing_values.include?(value.to_s)
72
+ end
73
+ elsif spacing_values.include?(spacing_value)
74
+ css += "#{prefix}_#{spacing_value} "
75
+ end
76
+ end
77
+
78
+ css.strip unless css.blank?
64
79
  end
65
80
 
66
81
  def max_width_props
@@ -1,6 +1,6 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- PREVIOUS_VERSION = "12.22.0"
5
- VERSION = "12.23.0"
4
+ PREVIOUS_VERSION = "12.24.0"
5
+ VERSION = "12.24.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown756"
6
6
  end
data/lib/playbook.rb CHANGED
@@ -8,10 +8,9 @@ require "playbook/props"
8
8
  require "playbook/forms"
9
9
  require "playbook/pb_forms_helper"
10
10
  require "playbook/pb_kit_helper"
11
- require "playbook/pb_doc_helper"
11
+ require "playbook/pb_doc_helper" # Duplicated from website (Temp)
12
12
  require "playbook/kit_base"
13
13
  require "playbook/kit_resolver"
14
- require "playbook/markdown"
15
14
 
16
15
  module Playbook
17
16
  ROOT_PATH = Pathname.new(File.join(__dir__, ".."))
metadata CHANGED
@@ -1,15 +1,15 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 12.23.0
4
+ version: 12.24.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown756
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
8
8
  - Power Devs
9
- autorequire:
9
+ autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2023-05-23 00:00:00.000000000 Z
12
+ date: 2023-06-09 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -67,34 +67,6 @@ dependencies:
67
67
  - - '='
68
68
  - !ruby/object:Gem::Version
69
69
  version: 2.6.1
70
- - !ruby/object:Gem::Dependency
71
- name: redcarpet
72
- requirement: !ruby/object:Gem::Requirement
73
- requirements:
74
- - - "~>"
75
- - !ruby/object:Gem::Version
76
- version: '3.6'
77
- type: :runtime
78
- prerelease: false
79
- version_requirements: !ruby/object:Gem::Requirement
80
- requirements:
81
- - - "~>"
82
- - !ruby/object:Gem::Version
83
- version: '3.6'
84
- - !ruby/object:Gem::Dependency
85
- name: rouge
86
- requirement: !ruby/object:Gem::Requirement
87
- requirements:
88
- - - "~>"
89
- - !ruby/object:Gem::Version
90
- version: '3.15'
91
- type: :runtime
92
- prerelease: false
93
- version_requirements: !ruby/object:Gem::Requirement
94
- requirements:
95
- - - "~>"
96
- - !ruby/object:Gem::Version
97
- version: '3.15'
98
70
  - !ruby/object:Gem::Dependency
99
71
  name: view_component
100
72
  requirement: !ruby/object:Gem::Requirement
@@ -283,7 +255,9 @@ dependencies:
283
255
  - - '='
284
256
  - !ruby/object:Gem::Version
285
257
  version: 3.3.1
286
- description: Playbook Design System. Built for Nitro, but powering all.
258
+ description: Playbook UI is built out in Ruby View Components and React Components.
259
+ Playbook takes a modern design approach and applies it in a way that makes it easy
260
+ to support bleeding edge or legacy systems.
287
261
  email:
288
262
  - nitroux@powerhrg.com
289
263
  - dev@powerhrg.com
@@ -311,6 +285,7 @@ files:
311
285
  - app/pb_kits/playbook/pb_avatar/docs/_avatar_status.html.erb
312
286
  - app/pb_kits/playbook/pb_avatar/docs/_avatar_status.jsx
313
287
  - app/pb_kits/playbook/pb_avatar/docs/_avatar_status.md
288
+ - app/pb_kits/playbook/pb_avatar/docs/_avatar_swift.md
314
289
  - app/pb_kits/playbook/pb_avatar/docs/_description.md
315
290
  - app/pb_kits/playbook/pb_avatar/docs/_footer.md
316
291
  - app/pb_kits/playbook/pb_avatar/docs/example.yml
@@ -689,6 +664,9 @@ files:
689
664
  - app/pb_kits/playbook/pb_date/docs/_date_default.jsx
690
665
  - app/pb_kits/playbook/pb_date/docs/_date_timezone.html.erb
691
666
  - app/pb_kits/playbook/pb_date/docs/_date_timezone.md
667
+ - app/pb_kits/playbook/pb_date/docs/_date_unstyled.html.erb
668
+ - app/pb_kits/playbook/pb_date/docs/_date_unstyled.jsx
669
+ - app/pb_kits/playbook/pb_date/docs/_date_unstyled.md
692
670
  - app/pb_kits/playbook/pb_date/docs/_date_variants.html.erb
693
671
  - app/pb_kits/playbook/pb_date/docs/_date_variants.jsx
694
672
  - app/pb_kits/playbook/pb_date/docs/_description.md
@@ -745,6 +723,8 @@ files:
745
723
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
746
724
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions_element.html.erb
747
725
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions_element.jsx
726
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick.html.erb
727
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick.jsx
748
728
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.html.erb
749
729
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.jsx
750
730
  - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_time.html.erb
@@ -759,6 +739,7 @@ files:
759
739
  - app/pb_kits/playbook/pb_date_picker/docs/_description.md
760
740
  - app/pb_kits/playbook/pb_date_picker/docs/example.yml
761
741
  - app/pb_kits/playbook/pb_date_picker/docs/index.js
742
+ - app/pb_kits/playbook/pb_date_picker/plugins/quickPick.tsx
762
743
  - app/pb_kits/playbook/pb_date_picker/plugins/timeSelect.ts
763
744
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_calendar_input_icon.scss
764
745
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_day_styles.scss
@@ -768,6 +749,7 @@ files:
768
749
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_input_styles.scss
769
750
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_month_and_year_styles.scss
770
751
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_overrides.scss
752
+ - app/pb_kits/playbook/pb_date_picker/sass_partials/_quick_pick_styles.scss
771
753
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_time_selection_styles.scss
772
754
  - app/pb_kits/playbook/pb_date_picker/sass_partials/_week_styles.scss
773
755
  - app/pb_kits/playbook/pb_date_range_inline/_date_range_inline.scss
@@ -904,8 +886,6 @@ files:
904
886
  - app/pb_kits/playbook/pb_distribution_bar/docs/_distribution_bar_default.jsx
905
887
  - app/pb_kits/playbook/pb_distribution_bar/docs/example.yml
906
888
  - app/pb_kits/playbook/pb_distribution_bar/docs/index.js
907
- - app/pb_kits/playbook/pb_docs/kit_api.html.erb
908
- - app/pb_kits/playbook/pb_docs/kit_api.rb
909
889
  - app/pb_kits/playbook/pb_docs/kit_example.html.erb
910
890
  - app/pb_kits/playbook/pb_docs/kit_example.rb
911
891
  - app/pb_kits/playbook/pb_enhanced_element/element_observer.ts
@@ -2083,6 +2063,9 @@ files:
2083
2063
  - app/pb_kits/playbook/pb_time/docs/_time_timezone.html.erb
2084
2064
  - app/pb_kits/playbook/pb_time/docs/_time_timezone.jsx
2085
2065
  - app/pb_kits/playbook/pb_time/docs/_time_timezone.md
2066
+ - app/pb_kits/playbook/pb_time/docs/_time_unstyled.html.erb
2067
+ - app/pb_kits/playbook/pb_time/docs/_time_unstyled.jsx
2068
+ - app/pb_kits/playbook/pb_time/docs/_time_unstyled.md
2086
2069
  - app/pb_kits/playbook/pb_time/docs/example.yml
2087
2070
  - app/pb_kits/playbook/pb_time/docs/index.js
2088
2071
  - app/pb_kits/playbook/pb_time/time.html.erb
@@ -2430,6 +2413,7 @@ files:
2430
2413
  - app/pb_kits/playbook/utilities/test/globalProps/order.test.js
2431
2414
  - app/pb_kits/playbook/utilities/text.ts
2432
2415
  - dist/menu.yml
2416
+ - dist/playbook-rails.js
2433
2417
  - dist/reset.css
2434
2418
  - lib/playbook.rb
2435
2419
  - lib/playbook/align_content.rb
@@ -2458,8 +2442,6 @@ files:
2458
2442
  - lib/playbook/kit_base.rb
2459
2443
  - lib/playbook/kit_resolver.rb
2460
2444
  - lib/playbook/line_height.rb
2461
- - lib/playbook/markdown.rb
2462
- - lib/playbook/markdown/helper.rb
2463
2445
  - lib/playbook/number_spacing.rb
2464
2446
  - lib/playbook/order.rb
2465
2447
  - lib/playbook/pagination_renderer.rb
@@ -2487,11 +2469,11 @@ files:
2487
2469
  - lib/playbook/version.rb
2488
2470
  - lib/playbook/z_index.rb
2489
2471
  - lib/playbook_ui.rb
2490
- homepage: http://playbook.powerapp.cloud
2472
+ homepage: https://playbook.powerapp.cloud/
2491
2473
  licenses:
2492
2474
  - ISC
2493
2475
  metadata: {}
2494
- post_install_message:
2476
+ post_install_message:
2495
2477
  rdoc_options: []
2496
2478
  require_paths:
2497
2479
  - lib
@@ -2502,12 +2484,12 @@ required_ruby_version: !ruby/object:Gem::Requirement
2502
2484
  version: '0'
2503
2485
  required_rubygems_version: !ruby/object:Gem::Requirement
2504
2486
  requirements:
2505
- - - ">="
2487
+ - - ">"
2506
2488
  - !ruby/object:Gem::Version
2507
- version: '0'
2489
+ version: 1.3.1
2508
2490
  requirements: []
2509
2491
  rubygems_version: 3.3.7
2510
- signing_key:
2492
+ signing_key:
2511
2493
  specification_version: 4
2512
2494
  summary: Playbook Design System
2513
2495
  test_files: []
@@ -1,311 +0,0 @@
1
- <% if !local_prop_data.present? %>
2
- <div data-action="toggle" data-togglable="prop_example" class="pb--propsTable">
3
- <%= pb_rails("title", props: { text: "Available Props", size: 3, margin_bottom: "sm" }) %>
4
- <%= pb_rails("card", props: { padding: "none" }) do %>
5
- <%= pb_rails("card/card_body", props: { padding: "sm" }) do %>
6
- <%= pb_rails("nav", props: { orientation: "horizontal", variant: "subtle" }) do %>
7
- <%= pb_rails("nav/item", props: { text: "Global Props", link: "#", active: true }) %>
8
- <% end %>
9
- <% end %>
10
- <%= pb_rails("section_separator") %>
11
- <%= pb_rails("card/card_body", props: {}) do %>
12
- <%= pb_rails("table", props: {container: false, disable_hover: true }) do %>
13
- <thead>
14
- <tr>
15
- <th>Props</th>
16
- <th>Type</th>
17
- <th>Values</th>
18
- </tr>
19
- </thead>
20
- <tbody>
21
- <% global_prop_data.each do |key, value|%>
22
- <tr>
23
- <td>
24
- <%= pb_rails("title", props: { text: key, tag: "h4", size: 4 }) %>
25
- </td>
26
- <td>
27
- <%= pb_rails("card", props: {
28
- classname: "card",
29
- padding: "xxs",
30
- background: "light",
31
- border_none: true,
32
- border_radius: "sm"
33
- }) do %>
34
- <%= pb_rails("body", props: {
35
- classname: "kearning"
36
- }) do %>
37
- <% if key =~ /^padding|^margin/ %>
38
- <%= "array" %>
39
- <% else %>
40
- <%= value[:type].to_s.downcase %>
41
- <% end %>
42
- <% end %>
43
- <% end %>
44
- </td>
45
- <td>
46
- <% if key =~ /^padding|^margin/ %>
47
- <% padding_margin_values.each do |item| %>
48
- <%= pb_rails("card", props: {
49
- flex_direction: "row",
50
- classname: "card",
51
- padding: "xxs",
52
- background: "light",
53
- border_none: true,
54
- border_radius: "sm",
55
- margin: "xxs"
56
- }) do %>
57
- <%= pb_rails("body", props: {
58
- classname: "kearning"
59
- }) do %>
60
- <%= item %>
61
- <% end %>
62
- <% end %>
63
- <% end %>
64
- <% else %>
65
- <% if value[:values].present? %>
66
- <% value[:values].each do |item| %>
67
- <% if item != nil %>
68
- <%= pb_rails("card", props: {
69
- flex_direction: "row",
70
- classname: "card",
71
- padding: "xxs",
72
- background: "light",
73
- border_none: true,
74
- border_radius: "sm",
75
- margin: "xxs"
76
- }) do %>
77
- <%= pb_rails("body", props: {
78
- classname: "kearning"
79
- }) do %>
80
- <%= item %>
81
- <% end %>
82
- <% end %>
83
- <% end %>
84
- <% end %>
85
- <% end %>
86
- <% end %>
87
- </td>
88
- </tr>
89
- <% end %>
90
- </tbody>
91
- <% end %>
92
- <% end %>
93
- <% end %>
94
- </div>
95
- <% else %>
96
- <div data-action="toggle" data-togglable="prop_example" class="pb--propsTable">
97
- <%= pb_rails("title", props: { text: "Available Props", size: 3, margin_bottom: "sm" }) %>
98
- <%= pb_rails("card", props: { padding: "none" }) do %>
99
- <%= pb_rails("card/card_body", props: { padding: "sm" }) do %>
100
- <%= pb_rails("nav", props: { orientation: "horizontal", variant: "subtle" }) do %>
101
- <% if local_prop_data.present? %>
102
- <%= pb_rails("nav/item", props: { text: "Kit Props", link: "#", active: true, id: "local-button-active", classname: "local-active" }) %>
103
- <% end %>
104
- <% if local_prop_data.present? %>
105
- <%= pb_rails("nav/item", props: { text: "Kit Props", link: "#", id: "local-button", classname: "global-active" }) %>
106
- <% end %>
107
- <%= pb_rails("nav/item", props: { text: "Global Props", link: "#", active: true, id: "global-button-active", classname: "global-active" }) %>
108
- <%= pb_rails("nav/item", props: { text: "Global Props", link: "#", id: "global-button", classname: "local-active" }) %>
109
- <% end %>
110
- <% end %>
111
- <%= pb_rails("section_separator") %>
112
- <%= pb_rails("card/card_body", props: {}) do %>
113
- <%= pb_rails("table", props: {container: false, disable_hover: true, id: "global-prop-table", classname: "global-active"}) do %>
114
- <thead>
115
- <tr>
116
- <th>Props</th>
117
- <th>Type</th>
118
- <th>Values</th>
119
- </tr>
120
- </thead>
121
- <tbody>
122
- <% global_prop_data.each do |key, value|%>
123
- <tr>
124
- <td>
125
- <%= pb_rails("title", props: { text: key, tag: "h4", size: 4 }) %>
126
- </td>
127
- <td>
128
- <%= pb_rails("card", props: {
129
- classname: "card",
130
- padding: "xxs",
131
- background: "light",
132
- border_none: true,
133
- border_radius: "sm"
134
- }) do %>
135
- <%= pb_rails("body", props: {
136
- classname: "kearning"
137
- }) do %>
138
- <% if key =~ /^padding|^margin/ %>
139
- <%= "array" %>
140
- <% else %>
141
- <%= value[:type].to_s.downcase %>
142
- <% end %>
143
- <% end %>
144
- <% end %>
145
- </td>
146
- <td>
147
- <% if key =~ /^padding|^margin/ %>
148
- <% padding_margin_values.each do |item| %>
149
- <%= pb_rails("card", props: {
150
- flex_direction: "row",
151
- classname: "card",
152
- padding: "xxs",
153
- background: "light",
154
- border_none: true,
155
- border_radius: "sm",
156
- margin: "xxs"
157
- }) do %>
158
- <%= pb_rails("body", props: {
159
- classname: "kearning"
160
- }) do %>
161
- <%= item %>
162
- <% end %>
163
- <% end %>
164
- <% end %>
165
- <% else %>
166
- <% if value[:values].present? %>
167
- <% value[:values].each do |item| %>
168
- <% if item != nil %>
169
- <%= pb_rails("card", props: {
170
- flex_direction: "row",
171
- classname: "card",
172
- padding: "xxs",
173
- background: "light",
174
- border_none: true,
175
- border_radius: "sm",
176
- margin: "xxs"
177
- }) do %>
178
- <%= pb_rails("body", props: {
179
- classname: "kearning"
180
- }) do %>
181
- <%= item %>
182
- <% end %>
183
- <% end %>
184
- <% end %>
185
- <% end %>
186
- <% end %>
187
- <% end %>
188
- </td>
189
- </tr>
190
- <% end %>
191
- </tbody>
192
- <% end %>
193
- <%= pb_rails("table", props: {container: false, disable_hover: true, id: "local-prop-table", classname: "local-active"}) do %>
194
- <thead>
195
- <tr>
196
- <th>Props</th>
197
- <th>Type</th>
198
- <th>Values</th>
199
- <th>Default</th>
200
- </tr>
201
- </thead>
202
- <tbody>
203
- <% local_prop_data.each do |key, value|%>
204
- <tr>
205
- <td>
206
- <%= pb_rails("title", props: { text: key, tag: "h4", size: 4 }) %>
207
- </td>
208
- <td>
209
- <%= pb_rails("card", props: {
210
- classname: "card",
211
- padding: "xxs",
212
- background: "light",
213
- border_none: true,
214
- border_radius: "sm"
215
- }) do %>
216
- <%= pb_rails("body", props: {
217
- classname: "kearning"
218
- }) do %>
219
- <%= value[:type].downcase %>
220
- <% end %>
221
- <% end %>
222
- </td>
223
- <td>
224
- <% if value[:values].present? %>
225
- <% value[:values].each do |item| %>
226
- <% if item != nil %>
227
- <%= pb_rails("card", props: {
228
- flex_direction: "row",
229
- classname: "card",
230
- padding: "xxs",
231
- background: "light",
232
- border_none: true,
233
- border_radius: "sm",
234
- margin: "xxs"
235
- }) do %>
236
- <%= pb_rails("body", props: {
237
- classname: "kearning"
238
- }) do %>
239
- <%= item %>
240
- <% end %>
241
- <% end %>
242
- <% end %>
243
- <% end %>
244
- <% end %>
245
- </td>
246
- <td>
247
- <% if value[:default].present? || value[:default].is_a?(TrueClass) || value[:default].is_a?(FalseClass) %>
248
- <%= pb_rails("card", props: {
249
- classname: "card",
250
- padding: "xxs",
251
- background: "light",
252
- border_none: true,
253
- border_radius: "sm"
254
- }) do %>
255
- <%= pb_rails("body", props: {
256
- classname: "kearning"
257
- }) do %>
258
- <%= value[:default] %>
259
- <% end %>
260
- <% end %>
261
- <% end %>
262
- </td>
263
- </tr>
264
- <% end %>
265
- </tbody>
266
- <% end %>
267
- <% end %>
268
- <% end %>
269
- </div>
270
- <% end %>
271
-
272
- <script>
273
-
274
- const globalNavAndTable = document.querySelectorAll('.global-active');
275
- const localNavAndTable = document.querySelectorAll('.local-active');
276
-
277
- globalNavAndTable.forEach(element => {
278
- element.style.display = 'none';
279
- });
280
-
281
- const globalButton = document.getElementById("global-button");
282
- if (globalButton) {
283
- globalButton.addEventListener("click", showGlobal);
284
- }
285
-
286
- const localButton = document.getElementById("local-button");
287
- if (localButton) {
288
- localButton.addEventListener("click", showLocal);
289
- }
290
-
291
- function showGlobal() {
292
- localNavAndTable.forEach(element => {
293
- element.style.display = 'none';
294
- });
295
-
296
- globalNavAndTable.forEach(element => {
297
- element.style.display = 'table';
298
- });
299
- }
300
-
301
- function showLocal() {
302
- localNavAndTable.forEach(element => {
303
- element.style.display = 'table';
304
- });
305
-
306
- globalNavAndTable.forEach(element => {
307
- element.style.display = 'none';
308
- });
309
- }
310
-
311
- </script>