playbook_ui 13.15.0.pre.alpha.PLAY10831873 → 13.15.0.pre.alpha.PLAY10851907

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_dashboard/pbChartsDarkTheme.ts +4 -2
  3. data/app/pb_kits/playbook/pb_dashboard/pbChartsLightTheme.ts +5 -3
  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_stat_value/_icon_stat_value.tsx +2 -3
  11. data/app/pb_kits/playbook/pb_icon_value/_icon_value.tsx +2 -3
  12. data/app/pb_kits/playbook/pb_passphrase/_passphrase.tsx +51 -50
  13. data/app/pb_kits/playbook/pb_person_contact/_person_contact.tsx +20 -19
  14. data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +4 -3
  15. data/app/pb_kits/playbook/pb_popover/_popover.tsx +6 -4
  16. data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.tsx +20 -20
  17. data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.tsx +4 -4
  18. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorButton.tsx +19 -17
  19. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorTypes.ts +1 -1
  20. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/MoreExtensionsDropdown.tsx +23 -21
  21. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/Toolbar.tsx +18 -10
  22. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx +46 -23
  23. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarHistory.tsx +8 -8
  24. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarNodes.tsx +7 -7
  25. data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.tsx +17 -15
  26. data/app/pb_kits/playbook/pb_section_separator/_section_separator.tsx +9 -7
  27. data/app/pb_kits/playbook/pb_select/_select.tsx +1 -1
  28. data/app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.tsx +25 -24
  29. data/app/pb_kits/playbook/pb_selectable_icon/_selectable_icon.tsx +27 -26
  30. data/app/pb_kits/playbook/pb_selectable_list/_selectable_list.tsx +2 -1
  31. data/app/pb_kits/playbook/pb_source/_source.tsx +15 -15
  32. data/dist/playbook-rails.js +2 -2
  33. data/lib/playbook/version.rb +1 -1
  34. metadata +2 -2
@@ -33,7 +33,7 @@ type SelectableCardIconProps = {
33
33
  onChange?: (event: React.FormEvent<HTMLInputElement>) => void,
34
34
  }
35
35
 
36
- const SelectableCardIcon = (props: SelectableCardIconProps) => {
36
+ const SelectableCardIcon = (props: SelectableCardIconProps): React.ReactElement => {
37
37
  const {
38
38
  aria = {},
39
39
  checkmark = false,
@@ -70,36 +70,37 @@ const SelectableCardIcon = (props: SelectableCardIconProps) => {
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} />
93
+ customIcon={customIcon}
94
+ icon={icon}
95
+ inputId={''}
96
+ inputs="disabled"
97
+ name={''}
98
+ text={titleText}
99
+ />
99
100
  <Body
100
- color="light"
101
- dark={dark}
102
- text={bodyText}
101
+ color="light"
102
+ dark={dark}
103
+ text={bodyText}
103
104
  />
104
105
  </>
105
106
  }
@@ -6,10 +6,11 @@ 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'
13
14
 
14
15
  type SelectableIconProps = {
15
16
  aria?: {[key: string]: string},
@@ -17,7 +18,7 @@ type SelectableIconProps = {
17
18
  className?: string,
18
19
  customIcon?: {[key: string] :SVGElement},
19
20
  disabled?: boolean,
20
- data?: Object,
21
+ data?: GenericObject,
21
22
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
22
23
  icon: string,
23
24
  inputId: string,
@@ -44,7 +45,7 @@ const SelectableIcon = ({
44
45
  text,
45
46
  value,
46
47
  ...props
47
- }: SelectableIconProps) => {
48
+ }: SelectableIconProps): React.ReactElement => {
48
49
  const ariaProps = buildAriaProps(aria)
49
50
  const dataProps = buildDataProps(data)
50
51
  const htmlProps = buildHtmlProps(htmlOptions)
@@ -64,22 +65,22 @@ const SelectableIcon = ({
64
65
 
65
66
  return (
66
67
  <div
67
- {...ariaProps}
68
- {...dataProps}
69
- {...htmlProps}
70
- className={classes}
68
+ {...ariaProps}
69
+ {...dataProps}
70
+ {...htmlProps}
71
+ className={classes}
71
72
  >
72
73
  {inputs === 'disabled' && (
73
74
  <>
74
75
  <Icon
75
- customIcon={customIcon}
76
- icon={icon}
77
- size="2x"
76
+ customIcon={customIcon}
77
+ icon={icon}
78
+ size="2x"
78
79
  />
79
80
  <Title
80
- size={4}
81
- tag="h4"
82
- text={text}
81
+ size={4}
82
+ tag="h4"
83
+ text={text}
83
84
  />
84
85
  </>
85
86
  )}
@@ -87,24 +88,24 @@ const SelectableIcon = ({
87
88
  {inputs === 'enabled' && (
88
89
  <>
89
90
  <input
90
- {...props}
91
- checked={checked}
92
- disabled={disabled}
93
- id={inputIdPresent}
94
- name={name}
95
- type={inputType}
96
- value={value}
91
+ {...props}
92
+ checked={checked}
93
+ disabled={disabled}
94
+ id={inputIdPresent}
95
+ name={name}
96
+ type={inputType}
97
+ value={value}
97
98
  />
98
99
  <label htmlFor={inputIdPresent}>
99
100
  <Icon
100
- customIcon={customIcon}
101
- icon={icon}
102
- size="2x"
101
+ customIcon={customIcon}
102
+ icon={icon}
103
+ size="2x"
103
104
  />
104
105
  <Title
105
- size={4}
106
- tag="h4"
107
- text={text}
106
+ size={4}
107
+ tag="h4"
108
+ text={text}
108
109
  />
109
110
  </label>
110
111
  </>
@@ -7,12 +7,13 @@ 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'
10
11
 
11
12
  type SelectableListProps = {
12
13
  aria?: {[key: string]: string },
13
14
  children?: React.ReactElement[],
14
15
  className?: string,
15
- data?: object,
16
+ data?: GenericObject,
16
17
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
17
18
  id?: string,
18
19
  variant?: 'checkbox' | 'radio',
@@ -32,7 +32,7 @@ const Source = ({
32
32
  source,
33
33
  type = 'inbound',
34
34
  user = {},
35
- }: SourceProps) => {
35
+ }: SourceProps): React.ReactElement => {
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>