playbook_ui 12.5.0 → 12.6.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (50) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +2 -0
  3. data/app/pb_kits/playbook/data/menu.yml +2 -1
  4. data/app/pb_kits/playbook/index.js +1 -0
  5. data/app/pb_kits/playbook/pb_button/_button_mixins.scss +2 -2
  6. data/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.scss +1 -1
  7. data/app/pb_kits/playbook/pb_filter/Filter/CurrentFilters.tsx +72 -0
  8. data/app/pb_kits/playbook/pb_filter/Filter/{FilterBackground.jsx → FilterBackground.tsx} +12 -14
  9. data/app/pb_kits/playbook/pb_filter/Filter/{FilterDouble.jsx → FilterDouble.tsx} +7 -8
  10. data/app/pb_kits/playbook/pb_filter/Filter/{FilterSingle.jsx → FilterSingle.tsx} +25 -25
  11. data/app/pb_kits/playbook/pb_filter/Filter/{FiltersPopover.jsx → FiltersPopover.tsx} +13 -11
  12. data/app/pb_kits/playbook/pb_filter/Filter/{ResultsCount.jsx → ResultsCount.tsx} +39 -14
  13. data/app/pb_kits/playbook/pb_filter/Filter/{SortMenu.jsx → SortMenu.tsx} +6 -6
  14. data/app/pb_kits/playbook/pb_filter/Filter/{index.jsx → index.tsx} +17 -10
  15. data/app/pb_kits/playbook/pb_filter/{_filter.jsx → _filter.tsx} +0 -2
  16. data/app/pb_kits/playbook/pb_list/_list.tsx +2 -2
  17. data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.scss +86 -0
  18. data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +81 -0
  19. data/app/pb_kits/playbook/pb_multi_level_select/_multi_select_helper.tsx +30 -0
  20. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.jsx +86 -0
  21. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.md +3 -0
  22. data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +6 -0
  23. data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +1 -0
  24. data/app/pb_kits/playbook/pb_multi_level_select/helper_functions.ts +60 -0
  25. data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.test.jsx +40 -0
  26. data/app/pb_kits/playbook/pb_person_contact/{_person_contact.jsx → _person_contact.tsx} +19 -22
  27. data/app/pb_kits/playbook/pb_person_contact/person_contact.test.js +112 -0
  28. data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +61 -47
  29. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.html.erb +3 -0
  30. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_only_countries.html.erb +4 -0
  31. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.html.erb +4 -0
  32. data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +4 -1
  33. data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.html.erb +1 -15
  34. data/app/pb_kits/playbook/pb_popover/_popover.tsx +33 -32
  35. data/app/pb_kits/playbook/playbook-doc.js +2 -0
  36. data/app/pb_kits/playbook/tokens/_animation-curves.scss +30 -30
  37. data/app/pb_kits/playbook/tokens/_border_radius.scss +15 -16
  38. data/app/pb_kits/playbook/tokens/_colors.scss +3 -1
  39. data/app/pb_kits/playbook/tokens/_display.scss +6 -6
  40. data/app/pb_kits/playbook/tokens/_line_height.scss +7 -7
  41. data/app/pb_kits/playbook/tokens/_opacity.scss +10 -10
  42. data/app/pb_kits/playbook/tokens/_positioning.scss +11 -11
  43. data/app/pb_kits/playbook/tokens/_screen_sizes.scss +10 -10
  44. data/app/pb_kits/playbook/tokens/_shadows.scss +4 -4
  45. data/app/pb_kits/playbook/tokens/_spacing.scss +6 -6
  46. data/app/pb_kits/playbook/tokens/_transition.scss +3 -3
  47. data/app/pb_kits/playbook/tokens/_typography.scss +35 -46
  48. data/lib/playbook/version.rb +2 -2
  49. metadata +25 -12
  50. data/app/pb_kits/playbook/pb_filter/Filter/CurrentFilters.jsx +0 -76
data/app/pb_kits/playbook/pb_filter/Filter/CurrentFilters.jsx DELETED
@@ -1,76 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import { isEmpty, map, omitBy } from 'lodash'
5
-
6
- import Body from '../../pb_body/_body'
7
- import Caption from '../../pb_caption/_caption'
8
- import Title from '../../pb_title/_title'
9
-
10
- export type FilterDescription = {
11
- [key: string]: ?string | boolean,
12
- }
13
-
14
- export type CurrentFiltersProps = {
15
- dark: boolean,
16
- filters: FilterDescription,
17
- }
18
-
19
- const hiddenFilters = (value) => isEmpty(value) && value !== true
20
-
21
- const CurrentFilters = ({ dark, filters }: CurrentFiltersProps) => {
22
- const displayableFilters = omitBy(filters, hiddenFilters)
23
-
24
- return (
25
- <div className="maskContainer">
26
- <If condition={isEmpty(filters)}>
27
- <div className="filters">
28
- <Body
29
- color="light"
30
- paddingLeft="xs"
31
- size={4}
32
- tag="h4"
33
- text="No Filter Selected"
34
- />
35
- </div>
36
- </If>
37
- <If condition={!isEmpty(filters)}>
38
- <div className="filters">
39
- <div className="left_gradient" />
40
- {map(displayableFilters, (value, name) => (
41
- <div
42
- className="filter"
43
- key={`filter-${name}`}
44
- >
45
- <Choose>
46
- <When condition={value === true}>
47
- <Title
48
- dark={dark}
49
- size={4}
50
- tag="h4"
51
- text={name}
52
- />
53
- </When>
54
- <Otherwise>
55
- <Caption
56
- dark={dark}
57
- text={name}
58
- />
59
- <Title
60
- dark={dark}
61
- size={4}
62
- tag="h4"
63
- text={value}
64
- />
65
- </Otherwise>
66
- </Choose>
67
- </div>
68
- ))}
69
- <div className="right_gradient" />
70
- </div>
71
- </If>
72
- </div>
73
- )
74
- }
75
-
76
- export default CurrentFilters