playbook_ui 13.15.0.pre.alpha.play1141iconkitusinglibrary1956 → 13.15.0.pre.alpha.play10841940

Sign up to get free protection for your applications and to get access to all the features.
Files changed (63) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +33 -40
  3. data/app/pb_kits/playbook/pb_date_picker/plugins/quickPick.tsx +4 -4
  4. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx +30 -44
  5. data/app/pb_kits/playbook/pb_flex/_flex.tsx +4 -4
  6. data/app/pb_kits/playbook/pb_form_group/_form_group.tsx +2 -3
  7. data/app/pb_kits/playbook/pb_form_pill/_form_pill.tsx +4 -7
  8. data/app/pb_kits/playbook/pb_gauge/_gauge.tsx +10 -10
  9. data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx +9 -10
  10. data/app/pb_kits/playbook/pb_icon/_icon.tsx +5 -21
  11. data/app/pb_kits/playbook/pb_icon_stat_value/_icon_stat_value.tsx +2 -3
  12. data/app/pb_kits/playbook/pb_icon_value/_icon_value.tsx +2 -3
  13. data/app/pb_kits/playbook/pb_label_value/_label_value.tsx +1 -1
  14. data/app/pb_kits/playbook/pb_layout/_layout.tsx +2 -1
  15. data/app/pb_kits/playbook/pb_layout/layout.test.js +8 -4
  16. data/app/pb_kits/playbook/pb_legend/_legend.tsx +6 -6
  17. data/app/pb_kits/playbook/pb_lightbox/Carousel/Slides.tsx +4 -4
  18. data/app/pb_kits/playbook/pb_lightbox/Carousel/Thumbnail.tsx +1 -1
  19. data/app/pb_kits/playbook/pb_lightbox/Carousel/index.tsx +3 -3
  20. data/app/pb_kits/playbook/pb_lightbox/Header/_lightbox_header.tsx +30 -22
  21. data/app/pb_kits/playbook/pb_lightbox/_lightbox.tsx +5 -5
  22. data/app/pb_kits/playbook/pb_line_graph/_line_graph.tsx +4 -4
  23. data/app/pb_kits/playbook/pb_list/_list.tsx +15 -15
  24. data/app/pb_kits/playbook/pb_list/_list_item.tsx +1 -1
  25. data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx +9 -9
  26. data/app/pb_kits/playbook/pb_map/_map.tsx +8 -8
  27. data/app/pb_kits/playbook/pb_map/_map_controls.tsx +15 -7
  28. data/app/pb_kits/playbook/pb_map/_map_custom_button.tsx +4 -2
  29. data/app/pb_kits/playbook/pb_message/_message.tsx +1 -1
  30. data/app/pb_kits/playbook/pb_message/_message_mention.tsx +6 -6
  31. data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +46 -42
  32. data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.tsx +20 -20
  33. data/app/pb_kits/playbook/pb_nav/_item.tsx +56 -47
  34. data/app/pb_kits/playbook/pb_nav/_nav.tsx +15 -15
  35. data/app/pb_kits/playbook/pb_passphrase/_passphrase.tsx +50 -51
  36. data/app/pb_kits/playbook/pb_person_contact/_person_contact.tsx +19 -20
  37. data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +3 -4
  38. data/app/pb_kits/playbook/pb_popover/_popover.tsx +4 -6
  39. data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.tsx +20 -20
  40. data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.tsx +4 -4
  41. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorButton.tsx +17 -19
  42. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorTypes.ts +1 -1
  43. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/MoreExtensionsDropdown.tsx +21 -23
  44. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/Toolbar.tsx +10 -18
  45. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx +23 -46
  46. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarHistory.tsx +8 -8
  47. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarNodes.tsx +7 -7
  48. data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.tsx +15 -17
  49. data/app/pb_kits/playbook/pb_section_separator/_section_separator.tsx +7 -9
  50. data/app/pb_kits/playbook/pb_select/_select.scss +4 -13
  51. data/app/pb_kits/playbook/pb_select/_select.tsx +4 -7
  52. data/app/pb_kits/playbook/pb_select/docs/example.yml +0 -2
  53. data/app/pb_kits/playbook/pb_select/docs/index.js +0 -1
  54. data/app/pb_kits/playbook/pb_select/select.rb +1 -6
  55. data/app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.tsx +24 -25
  56. data/app/pb_kits/playbook/pb_selectable_icon/_selectable_icon.tsx +26 -27
  57. data/app/pb_kits/playbook/pb_selectable_list/_selectable_list.tsx +1 -2
  58. data/app/pb_kits/playbook/pb_source/_source.tsx +15 -15
  59. data/dist/playbook-rails.js +4 -4
  60. data/lib/playbook/version.rb +1 -1
  61. metadata +2 -4
  62. data/app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.html.erb +0 -24
  63. data/app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.jsx +0 -38
@@ -33,7 +33,7 @@ type SelectableCardIconProps = {
33
33
  onChange?: (event: React.FormEvent<HTMLInputElement>) => void,
34
34
  }
35
35
 
36
- const SelectableCardIcon = (props: SelectableCardIconProps): React.ReactElement => {
36
+ const SelectableCardIcon = (props: SelectableCardIconProps) => {
37
37
  const {
38
38
  aria = {},
39
39
  checkmark = false,
@@ -70,37 +70,36 @@ const SelectableCardIcon = (props: SelectableCardIconProps): React.ReactElement
70
70
 
71
71
  return (
72
72
  <div
73
- {...ariaProps}
74
- {...dataProps}
75
- {...htmlProps}
76
- className={classes}
73
+ {...ariaProps}
74
+ {...dataProps}
75
+ {...htmlProps}
76
+ className={classes}
77
77
  >
78
78
  <SelectableCard
79
- checked={checked}
80
- customIcon={customIcon}
81
- dark={dark}
82
- disabled={disabled}
83
- icon={checkmark}
84
- inputId={inputId}
85
- multi={multi}
86
- name={name}
87
- onChange={onChange}
88
- value={value}
79
+ checked={checked}
80
+ customIcon={customIcon}
81
+ dark={dark}
82
+ disabled={disabled}
83
+ icon={checkmark}
84
+ inputId={inputId}
85
+ multi={multi}
86
+ name={name}
87
+ onChange={onChange}
88
+ value={value}
89
89
  >
90
90
  {
91
91
  <>
92
92
  <SelectableIcon
93
- customIcon={customIcon}
94
- icon={icon}
95
- inputId={''}
96
- inputs="disabled"
97
- name={''}
98
- text={titleText}
99
- />
93
+ customIcon={customIcon}
94
+ icon={icon}
95
+ inputId={''}
96
+ inputs="disabled"
97
+ name={''}
98
+ text={titleText} />
100
99
  <Body
101
- color="light"
102
- dark={dark}
103
- text={bodyText}
100
+ color="light"
101
+ dark={dark}
102
+ text={bodyText}
104
103
  />
105
104
  </>
106
105
  }
@@ -6,11 +6,10 @@ import {
6
6
  buildAriaProps,
7
7
  buildCss,
8
8
  buildDataProps,
9
- buildHtmlProps
9
+ buildHtmlProps
10
10
  } from '../utilities/props'
11
11
  import Icon from '../pb_icon/_icon'
12
12
  import Title from '../pb_title/_title'
13
- import { GenericObject } from '../types'
14
13
 
15
14
  type SelectableIconProps = {
16
15
  aria?: {[key: string]: string},
@@ -18,7 +17,7 @@ type SelectableIconProps = {
18
17
  className?: string,
19
18
  customIcon?: {[key: string] :SVGElement},
20
19
  disabled?: boolean,
21
- data?: GenericObject,
20
+ data?: Object,
22
21
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
23
22
  icon: string,
24
23
  inputId: string,
@@ -45,7 +44,7 @@ const SelectableIcon = ({
45
44
  text,
46
45
  value,
47
46
  ...props
48
- }: SelectableIconProps): React.ReactElement => {
47
+ }: SelectableIconProps) => {
49
48
  const ariaProps = buildAriaProps(aria)
50
49
  const dataProps = buildDataProps(data)
51
50
  const htmlProps = buildHtmlProps(htmlOptions)
@@ -65,22 +64,22 @@ const SelectableIcon = ({
65
64
 
66
65
  return (
67
66
  <div
68
- {...ariaProps}
69
- {...dataProps}
70
- {...htmlProps}
71
- className={classes}
67
+ {...ariaProps}
68
+ {...dataProps}
69
+ {...htmlProps}
70
+ className={classes}
72
71
  >
73
72
  {inputs === 'disabled' && (
74
73
  <>
75
74
  <Icon
76
- customIcon={customIcon}
77
- icon={icon}
78
- size="2x"
75
+ customIcon={customIcon}
76
+ icon={icon}
77
+ size="2x"
79
78
  />
80
79
  <Title
81
- size={4}
82
- tag="h4"
83
- text={text}
80
+ size={4}
81
+ tag="h4"
82
+ text={text}
84
83
  />
85
84
  </>
86
85
  )}
@@ -88,24 +87,24 @@ const SelectableIcon = ({
88
87
  {inputs === 'enabled' && (
89
88
  <>
90
89
  <input
91
- {...props}
92
- checked={checked}
93
- disabled={disabled}
94
- id={inputIdPresent}
95
- name={name}
96
- type={inputType}
97
- value={value}
90
+ {...props}
91
+ checked={checked}
92
+ disabled={disabled}
93
+ id={inputIdPresent}
94
+ name={name}
95
+ type={inputType}
96
+ value={value}
98
97
  />
99
98
  <label htmlFor={inputIdPresent}>
100
99
  <Icon
101
- customIcon={customIcon}
102
- icon={icon}
103
- size="2x"
100
+ customIcon={customIcon}
101
+ icon={icon}
102
+ size="2x"
104
103
  />
105
104
  <Title
106
- size={4}
107
- tag="h4"
108
- text={text}
105
+ size={4}
106
+ tag="h4"
107
+ text={text}
109
108
  />
110
109
  </label>
111
110
  </>
@@ -7,13 +7,12 @@ import { SelectableListItemProps } from './_item.js'
7
7
 
8
8
  import List from '../pb_list/_list'
9
9
  import SelectableListItem from './_item'
10
- import { GenericObject } from '../types'
11
10
 
12
11
  type SelectableListProps = {
13
12
  aria?: {[key: string]: string },
14
13
  children?: React.ReactElement[],
15
14
  className?: string,
16
- data?: GenericObject,
15
+ data?: object,
17
16
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
18
17
  id?: string,
19
18
  variant?: 'checkbox' | 'radio',
@@ -32,7 +32,7 @@ const Source = ({
32
32
  source,
33
33
  type = 'inbound',
34
34
  user = {},
35
- }: SourceProps): React.ReactElement => {
35
+ }: SourceProps) => {
36
36
  const dataProps = buildDataProps(data)
37
37
  const htmlProps = buildHtmlProps(htmlOptions)
38
38
  const ariaProps = buildAriaProps(aria)
@@ -72,11 +72,11 @@ const Source = ({
72
72
 
73
73
  return (
74
74
  <div
75
- {...ariaProps}
76
- {...dataProps}
77
- {...htmlProps}
78
- className={css}
79
- id={id}
75
+ {...ariaProps}
76
+ {...dataProps}
77
+ {...htmlProps}
78
+ className={css}
79
+ id={id}
80
80
  >
81
81
 
82
82
  <div className="pb__source_layout">
@@ -84,13 +84,13 @@ const Source = ({
84
84
  <>
85
85
  {showIcon() &&
86
86
  <IconCircle
87
- icon={typeIconNames[type]}
88
- size="sm"
87
+ icon={typeIconNames[type]}
88
+ size="sm"
89
89
  />
90
90
  }
91
91
  {!showIcon() &&
92
92
  <Avatar
93
- {...avatar()}
93
+ {...avatar()}
94
94
  />
95
95
  }
96
96
  </>
@@ -98,20 +98,20 @@ const Source = ({
98
98
 
99
99
  <div className="pb__source_content">
100
100
  <Title
101
- size={4}
102
- tag="h4"
103
- text={source}
101
+ size={4}
102
+ tag="h4"
103
+ text={source}
104
104
  />
105
105
 
106
106
  <div className="pb__source_value">
107
107
  <Body
108
- color="light"
109
- text={typeText()}
108
+ color="light"
109
+ text={typeText()}
110
110
  />
111
111
 
112
112
  {user.userId &&
113
113
  <Caption
114
- text={user.userId}
114
+ text={user.userId}
115
115
  />
116
116
  }
117
117
  </div>