playbook_ui 14.8.0.pre.alpha.PBNTR713dropdowncustomtriggerbug4696 → 14.8.0.pre.alpha.PLAY1598floatinguiupgrade4563

Sign up to get free protection for your applications and to get access to all the features.
Files changed (52) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +0 -1
  3. data/app/pb_kits/playbook/pb_checkbox/checkbox.html.erb +2 -2
  4. data/app/pb_kits/playbook/pb_checkbox/checkbox.rb +4 -0
  5. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.html.erb +7 -84
  6. data/app/pb_kits/playbook/pb_dropdown/_dropdown.scss +0 -1
  7. data/app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb +1 -0
  8. data/app/pb_kits/playbook/pb_dropdown/dropdown_container.rb +4 -0
  9. data/app/pb_kits/playbook/pb_dropdown/utilities/subComponentHelper.tsx +2 -13
  10. data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +2 -2
  11. data/app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.html.erb +1 -1
  12. data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +12 -63
  13. data/app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_default.html.erb +1 -2
  14. data/app/pb_kits/playbook/pb_table/_table.tsx +24 -103
  15. data/app/pb_kits/playbook/pb_table/docs/index.js +0 -1
  16. data/app/pb_kits/playbook/pb_table/styles/_all.scss +0 -2
  17. data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb +0 -47
  18. data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx +0 -59
  19. data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss +0 -3
  20. data/app/pb_kits/playbook/pb_typeahead/index.ts +3 -29
  21. data/app/pb_kits/playbook/pb_typeahead/typeahead.html.erb +2 -5
  22. data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +0 -4
  23. data/app/pb_kits/playbook/utilities/_max_width.scss +0 -4
  24. data/app/pb_kits/playbook/utilities/_min_width.scss +1 -1
  25. data/app/pb_kits/playbook/utilities/globalPropNames.mjs +1 -0
  26. data/app/pb_kits/playbook/utilities/globalProps.ts +0 -24
  27. data/dist/chunks/_typeahead-DUfnbpvK.js +22 -0
  28. data/dist/chunks/_weekday_stacked-CFiZk2PV.js +45 -0
  29. data/dist/chunks/{lib-SyD3buPZ.js → lib-BC6ESsxG.js} +1 -1
  30. data/dist/chunks/{pb_form_validation-Dt8UJgrJ.js → pb_form_validation-B_Z9rEbg.js} +1 -1
  31. data/dist/chunks/vendor.js +1 -1
  32. data/dist/playbook-doc.js +1 -1
  33. data/dist/playbook-rails-react-bindings.js +1 -1
  34. data/dist/playbook-rails.js +1 -1
  35. data/dist/playbook.css +1 -1
  36. data/lib/playbook/classnames.rb +0 -3
  37. data/lib/playbook/forms/builder/typeahead_field.rb +0 -13
  38. data/lib/playbook/kit_base.rb +1 -16
  39. data/lib/playbook/version.rb +1 -1
  40. metadata +6 -16
  41. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.jsx +0 -87
  42. data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_react.md +0 -2
  43. data/app/pb_kits/playbook/pb_table/styles/_scroll.scss +0 -4
  44. data/app/pb_kits/playbook/pb_table/styles/_sticky_columns.scss +0 -18
  45. data/app/pb_kits/playbook/tokens/_height.scss +0 -19
  46. data/app/pb_kits/playbook/tokens/exports/_height.module.scss +0 -37
  47. data/app/pb_kits/playbook/utilities/_height.scss +0 -33
  48. data/dist/chunks/_typeahead-C8Q_fFYF.js +0 -22
  49. data/dist/chunks/_weekday_stacked-CUJfwh5E.js +0 -45
  50. data/lib/playbook/height.rb +0 -29
  51. data/lib/playbook/max_height.rb +0 -29
  52. data/lib/playbook/min_height.rb +0 -29
@@ -4,12 +4,11 @@ import { debounce } from 'lodash'
4
4
  export default class PbTypeahead extends PbEnhancedElement {
5
5
  _searchInput: HTMLInputElement
6
6
  _resultsElement: HTMLElement
7
- _debouncedSearch: () => void
7
+ _debouncedSearch: Function
8
8
  _resultsLoadingIndicator: HTMLElement
9
9
  _resultOptionTemplate: HTMLElement
10
10
  _resultsOptionCache: Map<string, Array<DocumentFragment>>
11
11
  _searchContext: string
12
- _validSelection: boolean
13
12
 
14
13
  static get selector() {
15
14
  return '[data-pb-typeahead-kit]'
@@ -87,9 +86,6 @@ export default class PbTypeahead extends PbEnhancedElement {
87
86
  const resultOption = (event.target as Element).closest('[data-result-option-item]')
88
87
  if (!resultOption) return
89
88
 
90
- this._validSelection = true
91
- this.removeValidationError()
92
-
93
89
  this.resultsCacheClear()
94
90
  this.searchInputClear()
95
91
  this.clearResults()
@@ -97,28 +93,6 @@ export default class PbTypeahead extends PbEnhancedElement {
97
93
  this.element.dispatchEvent(new CustomEvent('pb-typeahead-kit-result-option-selected', { bubbles: true, detail: { selected: resultOption, typeahead: this } }))
98
94
  }
99
95
 
100
- removeValidationError() {
101
- const inputWrapper = this.searchInput.closest('.text_input_wrapper')
102
- if (inputWrapper) {
103
- const errorMessage = inputWrapper.querySelector('.pb_body_kit_negative') as HTMLElement
104
- if (errorMessage) {
105
- errorMessage.style.display = 'none'
106
- }
107
- this.searchInput.classList.remove('error')
108
- }
109
- }
110
-
111
- showValidationError() {
112
- const inputWrapper = this.searchInput.closest('.text_input_wrapper')
113
- if (inputWrapper) {
114
- const errorMessage = inputWrapper.querySelector('.pb_body_kit_negative') as HTMLElement
115
- if (errorMessage) {
116
- errorMessage.style.display = 'block'
117
- }
118
- this.searchInput.classList.add('error')
119
- }
120
- }
121
-
122
96
  clearResults() {
123
97
  this.resultsElement.innerHTML = ''
124
98
  }
@@ -227,8 +201,8 @@ export default class PbTypeahead extends PbEnhancedElement {
227
201
  }
228
202
 
229
203
  toggleResultsLoadingIndicator(visible: boolean) {
230
- let visibilityProperty = '0'
204
+ var visibilityProperty = '0'
231
205
  if (visible) visibilityProperty = '1'
232
206
  this.resultsLoadingIndicator.style.opacity = visibilityProperty
233
207
  }
234
- }
208
+ }
@@ -17,14 +17,11 @@
17
17
  <%= pb_rails("text_input", props: {
18
18
  type: "search",
19
19
  input_options: object.input_options,
20
+ label: object.label,
20
21
  name: object.name,
21
22
  value: object.value,
22
23
  placeholder: object.placeholder,
23
24
  margin_bottom: "none",
24
- required: object.required,
25
- validation: object.validation,
26
- label: object.label,
27
- id: object.input_options[:id],
28
25
  }) %>
29
26
  <%= pb_rails("list", props: { ordered: false, borderless: false, xpadding: true, role: "status", aria: { live: "polite" }, data: { pb_typeahead_kit_results: true } }) do %>
30
27
  <% end %>
@@ -36,4 +33,4 @@
36
33
  <% end %>
37
34
  </template>
38
35
  <% end %>
39
- <% end %>
36
+ <% end %>
@@ -40,10 +40,6 @@ module Playbook
40
40
  prop :pill_color, type: Playbook::Props::Enum,
41
41
  values: %w[primary neutral success warning error info data_1 data_2 data_3 data_4 data_5 data_6 data_7 data_8 windows siding roofing doors gutters solar insulation accessories],
42
42
  default: "primary"
43
- prop :required, type: Playbook::Props::Boolean,
44
- default: false
45
- prop :validation, type: Playbook::Props::HashProp,
46
- default: {}
47
43
 
48
44
  def classname
49
45
  default_margin_bottom = margin_bottom.present? ? "" : " mb_sm"
@@ -27,7 +27,3 @@
27
27
  .max_width_xxl {
28
28
  max-width: 1320px;
29
29
  }
30
-
31
- .width-resize {
32
- resize: horizontal;
33
- }
@@ -40,6 +40,6 @@
40
40
  min-width: $container_100;
41
41
  }
42
42
 
43
- .width-resize {
43
+ .minwidth-resize {
44
44
  resize: horizontal;
45
45
  }
@@ -7,6 +7,7 @@ export default [
7
7
  "right",
8
8
  "top",
9
9
  "hover",
10
+ "groupHover",
10
11
  "zIndex",
11
12
  "verticalAlign",
12
13
  "truncate",
@@ -361,30 +361,6 @@ const PROP_CATEGORIES: {[key:string]: (props: {[key: string]: any}) => string} =
361
361
  css += maxWidth ? `max_width_${filterClassName(maxWidth)} ` : ''
362
362
  return css.trimEnd()
363
363
  },
364
- minHeightProps: ({ minHeight }: MinHeight) => {
365
- const heightValues = ["auto", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"]
366
- if (heightValues.includes(minHeight)) {
367
- let css = ''
368
- css += minHeight ? `min_height_${filterClassName(minHeight)} ` : ''
369
- return css.trimEnd()
370
- }
371
- },
372
- maxHeightProps: ({ maxHeight }: MaxHeight) => {
373
- const heightValues = ["auto", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"]
374
- if (heightValues.includes(maxHeight)) {
375
- let css = ''
376
- css += maxHeight ? `max_height_${filterClassName(maxHeight)} ` : ''
377
- return css.trimEnd()
378
- }
379
- },
380
- heightProps: ({ height }: Height) => {
381
- const heightValues = ["auto", "xs", "sm", "md", "lg", "xl", "xxl", "xxxl"]
382
- if (heightValues.includes(height)) {
383
- let css = ''
384
- css += height ? `height_${filterClassName(height)} ` : ''
385
- return css.trimEnd()
386
- }
387
- },
388
364
  zIndexProps: (zIndex: ZIndex) => {
389
365
  let css = ''
390
366
  Object.entries(zIndex).forEach((zIndexEntry) => {