playbook_ui 14.11.1.pre.alpha.PLAY17445539 → 14.11.1.pre.alpha.hfhbrakemanplaybook5370

Sign up to get free protection for your applications and to get access to all the features.
Files changed (76) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.md +2 -2
  3. data/app/pb_kits/playbook/pb_button/button.html.erb +3 -2
  4. data/app/pb_kits/playbook/pb_checkbox/checkbox.html.erb +6 -1
  5. data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +6 -2
  6. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.md +1 -1
  7. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.html.erb +9 -3
  8. data/app/pb_kits/playbook/pb_draggable/docs/example.yml +0 -1
  9. data/app/pb_kits/playbook/pb_drawer/_drawer.scss +177 -154
  10. data/app/pb_kits/playbook/pb_drawer/_drawer.tsx +264 -162
  11. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_borders.jsx +45 -3
  12. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_breakpoints.jsx +1 -0
  13. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_default.jsx +16 -9
  14. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_menu.jsx +19 -44
  15. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_menu.md +3 -21
  16. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_overlay.jsx +21 -16
  17. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_sizes.jsx +19 -2
  18. data/app/pb_kits/playbook/pb_drawer/docs/example.yml +1 -2
  19. data/app/pb_kits/playbook/pb_drawer/docs/index.js +0 -1
  20. data/app/pb_kits/playbook/pb_drawer/drawer.test.jsx +5 -5
  21. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.md +1 -1
  22. data/app/pb_kits/playbook/pb_dropdown/dropdown.html.erb +12 -7
  23. data/app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb +14 -9
  24. data/app/pb_kits/playbook/pb_dropdown/dropdown_option.html.erb +11 -6
  25. data/app/pb_kits/playbook/pb_dropdown/dropdown_trigger.html.erb +14 -8
  26. data/app/pb_kits/playbook/pb_list/item.html.erb +8 -30
  27. data/app/pb_kits/playbook/pb_list/item.rb +0 -7
  28. data/app/pb_kits/playbook/pb_list/list.html.erb +11 -31
  29. data/app/pb_kits/playbook/pb_list/list.rb +0 -4
  30. data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx +1 -6
  31. data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +12 -30
  32. data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +1 -3
  33. data/app/pb_kits/playbook/pb_phone_number_input/docs/index.js +0 -1
  34. data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb +0 -3
  35. data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.test.js +1 -20
  36. data/app/pb_kits/playbook/pb_radio/_radio.scss +8 -12
  37. data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.jsx +3 -8
  38. data/app/pb_kits/playbook/pb_selectable_list/selectable_list.html.erb +3 -17
  39. data/app/pb_kits/playbook/pb_selectable_list/selectable_list.rb +0 -3
  40. data/app/pb_kits/playbook/pb_selectable_list/selectable_list_item.html.erb +4 -11
  41. data/app/pb_kits/playbook/pb_selectable_list/selectable_list_item.rb +0 -3
  42. data/app/pb_kits/playbook/pb_table/_table.tsx +3 -2
  43. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_rails.md +2 -2
  44. data/app/pb_kits/playbook/pb_table/docs/example.yml +0 -2
  45. data/app/pb_kits/playbook/pb_table/index.ts +34 -93
  46. data/app/pb_kits/playbook/pb_table/styles/_scroll.scss +5 -6
  47. data/app/pb_kits/playbook/pb_table/table.html.erb +1 -1
  48. data/app/pb_kits/playbook/pb_table/table.rb +2 -17
  49. data/app/pb_kits/playbook/pb_timeline/_timeline.scss +30 -30
  50. data/dist/chunks/{_typeahead-vFuUQM5F.js → _typeahead-BNULwihE.js} +2 -2
  51. data/dist/chunks/_weekday_stacked-BKWemDAe.js +45 -0
  52. data/dist/chunks/{lib-OFT985dg.js → lib-B7sgJtGS.js} +2 -2
  53. data/dist/chunks/{pb_form_validation-CrsXd1-Y.js → pb_form_validation-C5Cc0-1v.js} +1 -1
  54. data/dist/chunks/vendor.js +1 -1
  55. data/dist/playbook-doc.js +1 -1
  56. data/dist/playbook-rails-react-bindings.js +1 -1
  57. data/dist/playbook-rails.js +1 -1
  58. data/dist/playbook.css +1 -1
  59. data/lib/playbook/version.rb +1 -1
  60. metadata +6 -21
  61. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.md +0 -5
  62. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.html.erb +0 -38
  63. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md +0 -3
  64. data/app/pb_kits/playbook/pb_drawer/context.ts +0 -11
  65. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_behavior.jsx +0 -38
  66. data/app/pb_kits/playbook/pb_drawer/hooks/useBreakpoint.tsx +0 -73
  67. data/app/pb_kits/playbook/pb_drawer/hooks/useDrawerAnimation.tsx +0 -21
  68. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.html.erb +0 -15
  69. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.jsx +0 -24
  70. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.md +0 -1
  71. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns.html.erb +0 -74
  72. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns_rails.md +0 -3
  73. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns.html.erb +0 -74
  74. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns_rails.md +0 -3
  75. data/app/pb_kits/playbook/pb_table/utilities/addDataTitle.ts +0 -22
  76. data/dist/chunks/_weekday_stacked-DG3A22sS.js +0 -45
data/app/pb_kits/playbook/pb_table/table.rb CHANGED
@@ -25,8 +25,6 @@ module Playbook
25
25
  default: false
26
26
  prop :sticky_left_column, type: Playbook::Props::Array,
27
27
  default: []
28
- prop :sticky_right_column, type: Playbook::Props::Array,
29
- default: []
30
28
  prop :vertical_border, type: Playbook::Props::Boolean,
31
29
  default: false
32
30
  prop :striped, type: Playbook::Props::Boolean,
@@ -42,7 +40,7 @@ module Playbook
42
40
  generate_classname(
43
41
  "pb_table", "table-#{size}", single_line_class, dark_class,
44
42
  disable_hover_class, container_class, data_table_class, sticky_class, sticky_left_column_class,
45
- sticky_right_column_class, collapse_class, vertical_border_class, striped_class, outer_padding_class,
43
+ collapse_class, vertical_border_class, striped_class, outer_padding_class,
46
44
  "table-responsive-#{responsive}", separator: " "
47
45
  )
48
46
  end
@@ -85,7 +83,7 @@ module Playbook
85
83
  if sticky_left_column.empty?
86
84
  nil
87
85
  else
88
- sticky_col_classname = "sticky-left-column sticky-left-columns-ids"
86
+ sticky_col_classname = "sticky-left-column sticky-columns"
89
87
  sticky_left_column.each do |id|
90
88
  sticky_col_classname += "-#{id}"
91
89
  end
@@ -94,19 +92,6 @@ module Playbook
94
92
  end
95
93
  end
96
94
 
97
- def sticky_right_column_class
98
- if sticky_right_column.empty?
99
- nil
100
- else
101
- sticky_col_classname = "sticky-right-column sticky-right-columns-ids"
102
- sticky_right_column.each do |id|
103
- sticky_col_classname += "-#{id}"
104
- end
105
-
106
- sticky_col_classname
107
- end
108
- end
109
-
110
95
  def striped_class
111
96
  striped ? "striped" : nil
112
97
  end
data/app/pb_kits/playbook/pb_timeline/_timeline.scss CHANGED
@@ -50,7 +50,7 @@ $gap_lg: $height_from_top + $space_lg;
50
50
  >div {
51
51
  &:last-child {
52
52
  flex-basis: auto !important;
53
- [class^=pb_timeline_item_step] {
53
+ [class=pb_timeline_item_step] {
54
54
  [class=pb_timeline_item_connector] {
55
55
  opacity: 0;
56
56
  }
@@ -66,25 +66,29 @@ $gap_lg: $height_from_top + $space_lg;
66
66
  [class*=pb_timeline_item_kit] {
67
67
  &[class*=_solid] {
68
68
  flex-basis: 100%;
69
- [class^=pb_timeline_item_step] {
69
+ [class=pb_timeline_item_left_block] {
70
+ height: 0px;
71
+ }
72
+ [class=pb_timeline_item_step] {
70
73
  @include flex_wrapper(row);
71
- align-items: center;
72
74
  margin-top: $space_xs;
73
75
  margin-bottom: $space_xs;
74
76
  [class=pb_timeline_item_connector] {
75
- @include pb_timeline_line_solid($connector_width, $connector_width, 0 $icon_margin 0 $icon_margin );
77
+ @include pb_timeline_line_solid($connector_width, $connector_width, $height_from_top $icon_margin 0 $icon_margin );
76
78
  }
77
79
  }
78
80
  }
79
81
  &[class*=_dotted] {
80
82
  flex-basis: 100%;
81
- [class^=pb_timeline_item_step] {
83
+ [class=pb_timeline_item_left_block] {
84
+ height: 0;
85
+ }
86
+ [class=pb_timeline_item_step] {
82
87
  @include flex_wrapper(row);
83
- align-items: center;
84
88
  margin-top: $space_xs;
85
89
  margin-bottom: $space_xs;
86
90
  [class=pb_timeline_item_connector] {
87
- @include pb_timeline_line_dotted_horizontal($connector_width, $connector_width, 0 $icon_margin 0 $icon_margin );
91
+ @include pb_timeline_line_dotted_horizontal($connector_width, $connector_width, $height_from_top $icon_margin 0 $icon_margin );
88
92
  }
89
93
  }
90
94
  }
@@ -95,7 +99,7 @@ $gap_lg: $height_from_top + $space_lg;
95
99
  >div {
96
100
  &:last-child {
97
101
  flex-basis: auto !important;
98
- [class^=pb_timeline_item_step] {
102
+ [class=pb_timeline_item_step] {
99
103
  [class=pb_timeline_item_connector] {
100
104
  opacity: 0;
101
105
  }
@@ -125,12 +129,12 @@ $gap_lg: $height_from_top + $space_lg;
125
129
  }
126
130
  }
127
131
  }
128
- [class^=pb_timeline_item_step] {
132
+ [class=pb_timeline_item_step] {
129
133
  @include flex_wrapper(row);
130
134
  margin-top: $space_xs;
131
135
  margin-bottom: $space_xs;
132
136
  [class=pb_timeline_item_connector] {
133
- @include pb_timeline_line_solid($connector_width, $connector_width, 0 $icon_margin 0 $icon_margin );
137
+ @include pb_timeline_line_solid($connector_width, $connector_width, $height_from_top $icon_margin 0 $icon_margin );
134
138
  }
135
139
  }
136
140
  }
@@ -149,12 +153,12 @@ $gap_lg: $height_from_top + $space_lg;
149
153
  }
150
154
  }
151
155
  }
152
- [class^=pb_timeline_item_step] {
156
+ [class=pb_timeline_item_step] {
153
157
  @include flex_wrapper(row);
154
158
  margin-top: $space_xs;
155
159
  margin-bottom: $space_xs;
156
160
  [class=pb_timeline_item_connector] {
157
- @include pb_timeline_line_dotted_horizontal($connector_width, $connector_width, 0 $icon_margin 0 $icon_margin );
161
+ @include pb_timeline_line_dotted_horizontal($connector_width, $connector_width, $height_from_top $icon_margin 0 $icon_margin );
158
162
  }
159
163
  }
160
164
  }
@@ -166,7 +170,7 @@ $gap_lg: $height_from_top + $space_lg;
166
170
  align-items: flex-start;
167
171
  align-self: auto;
168
172
  >div:last-child {
169
- [class^=pb_timeline_item_step] {
173
+ [class=pb_timeline_item_step] {
170
174
  [class=pb_timeline_item_connector] {
171
175
  opacity: 0;
172
176
  }
@@ -176,14 +180,13 @@ $gap_lg: $height_from_top + $space_lg;
176
180
  @include flex_wrapper(row);
177
181
  &[class*=_solid] {
178
182
  flex-basis: 100%;
179
- [class^=pb_timeline_item_step] {
183
+ [class=pb_timeline_item_step] {
180
184
  @include flex_wrapper(column);
181
- align-items: center;
182
185
  align-content: flex-start;
183
186
  margin-right: $space_sm;
184
187
  margin-left: $space_sm;
185
188
  [class=pb_timeline_item_connector] {
186
- @include pb_timeline_line_solid($connector_width, $connector_width, $icon_margin 0 $icon_margin 0);
189
+ @include pb_timeline_line_solid($connector_width, $connector_width, $icon_margin 0 $icon_margin $height_from_top);
187
190
  }
188
191
  }
189
192
  [class=pb_timeline_item_left_block] {
@@ -197,13 +200,12 @@ $gap_lg: $height_from_top + $space_lg;
197
200
  }
198
201
  &[class*=_dotted] {
199
202
  flex-basis: 100%;
200
- [class^=pb_timeline_item_step] {
203
+ [class=pb_timeline_item_step] {
201
204
  @include flex_wrapper(column);
202
- align-items: center;
203
205
  margin-right: $space_sm;
204
206
  margin-left: $space_sm;
205
207
  [class=pb_timeline_item_connector] {
206
- @include pb_timeline_line_dotted_vertical($connector_width, $connector_width, $icon_margin 0 $icon_margin 0);
208
+ @include pb_timeline_line_dotted_vertical($connector_width, $connector_width, $icon_margin 0 $icon_margin $height_from_top);
207
209
  }
208
210
  }
209
211
  [class=pb_timeline_item_left_block] {
@@ -221,7 +223,7 @@ $gap_lg: $height_from_top + $space_lg;
221
223
  align-items: flex-start;
222
224
  align-self: auto;
223
225
  >div:last-child {
224
- [class^=pb_timeline_item_step] {
226
+ [class=pb_timeline_item_step] {
225
227
  [class=pb_timeline_item_connector] {
226
228
  opacity: 0;
227
229
  }
@@ -231,14 +233,13 @@ $gap_lg: $height_from_top + $space_lg;
231
233
  @include flex_wrapper(row);
232
234
  &[class*=_solid] {
233
235
  flex-basis: 100%;
234
- [class^=pb_timeline_item_step] {
236
+ [class=pb_timeline_item_step] {
235
237
  @include flex_wrapper(column);
236
- align-items: center;
237
238
  align-content: flex-start;
238
239
  margin-right: $space_sm;
239
240
  margin-left: $space_sm;
240
241
  [class=pb_timeline_item_connector] {
241
- @include pb_timeline_line_solid($connector_width, $connector_width, $icon_margin 0 $icon_margin 0);
242
+ @include pb_timeline_line_solid($connector_width, $connector_width, $icon_margin 0 $icon_margin $height_from_top);
242
243
  }
243
244
  }
244
245
  [class=pb_timeline_item_left_block] {
@@ -252,13 +253,12 @@ $gap_lg: $height_from_top + $space_lg;
252
253
  }
253
254
  &[class*=_dotted] {
254
255
  flex-basis: 100%;
255
- [class^=pb_timeline_item_step] {
256
+ [class=pb_timeline_item_step] {
256
257
  @include flex_wrapper(column);
257
- align-items: center;
258
258
  margin-right: $space_sm;
259
259
  margin-left: $space_sm;
260
260
  [class=pb_timeline_item_connector] {
261
- @include pb_timeline_line_dotted_vertical($connector_width, $connector_width, $icon_margin 0 $icon_margin 0);
261
+ @include pb_timeline_line_dotted_vertical($connector_width, $connector_width, $icon_margin 0 $icon_margin $height_from_top);
262
262
  }
263
263
  }
264
264
  [class=pb_timeline_item_left_block] {
@@ -274,7 +274,7 @@ $gap_lg: $height_from_top + $space_lg;
274
274
  }
275
275
  &[class*=_gap_xs] {
276
276
  [class*=pb_timeline_item_kit] {
277
- [class^=pb_timeline_item_step] {
277
+ [class=pb_timeline_item_step] {
278
278
  [class=pb_timeline_item_connector] {
279
279
  height: $gap_xs !important;
280
280
  }
@@ -283,7 +283,7 @@ $gap_lg: $height_from_top + $space_lg;
283
283
  }
284
284
  &[class*=_gap_sm] {
285
285
  [class*=pb_timeline_item_kit] {
286
- [class^=pb_timeline_item_step] {
286
+ [class=pb_timeline_item_step] {
287
287
  [class=pb_timeline_item_connector] {
288
288
  height: $gap_sm !important;
289
289
  }
@@ -292,7 +292,7 @@ $gap_lg: $height_from_top + $space_lg;
292
292
  }
293
293
  &[class*=_gap_md] {
294
294
  [class*=pb_timeline_item_kit] {
295
- [class^=pb_timeline_item_step] {
295
+ [class=pb_timeline_item_step] {
296
296
  [class=pb_timeline_item_connector] {
297
297
  height: $gap_md !important;
298
298
  }
@@ -301,7 +301,7 @@ $gap_lg: $height_from_top + $space_lg;
301
301
  }
302
302
  &[class*=_gap_lg] {
303
303
  [class*=pb_timeline_item_kit] {
304
- [class^=pb_timeline_item_step] {
304
+ [class=pb_timeline_item_step] {
305
305
  [class=pb_timeline_item_connector] {
306
306
  height: $gap_lg !important;
307
307
  }