playbook_ui 11.3.0 → 11.4.0.pre.alpha.rubytheme1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (86) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/index.js +1 -0
  3. data/app/pb_kits/playbook/pb_button/_button.tsx +6 -6
  4. data/app/pb_kits/playbook/pb_circle_icon_button/{_circle_icon_button.jsx → _circle_icon_button.tsx} +6 -10
  5. data/app/pb_kits/playbook/pb_contact/contact.test.js +45 -1
  6. data/app/pb_kits/playbook/pb_currency/{_currency.jsx → _currency.tsx} +17 -12
  7. data/app/pb_kits/playbook/pb_date/_date.tsx +101 -0
  8. data/app/pb_kits/playbook/pb_date_picker/date_picker.test.js +10 -9
  9. data/app/pb_kits/playbook/pb_date_time/{_date_time.jsx → _date_time.tsx} +2 -5
  10. data/app/pb_kits/playbook/pb_date_time/dateTime.test.js +110 -0
  11. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_align.jsx +1 -1
  12. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_default.jsx +1 -1
  13. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_size.jsx +1 -1
  14. data/app/pb_kits/playbook/pb_dialog/_dialog.jsx +32 -14
  15. data/app/pb_kits/playbook/pb_dialog/_dialog.scss +5 -0
  16. data/app/pb_kits/playbook/pb_dialog/child_kits/_dialog_body.jsx +2 -2
  17. data/app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.jsx +22 -4
  18. data/app/pb_kits/playbook/pb_dialog/child_kits/_dialog_header.jsx +3 -3
  19. data/app/pb_kits/playbook/pb_dialog/dialog.test.jsx +79 -17
  20. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.jsx +55 -93
  21. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.jsx +79 -42
  22. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx +80 -0
  23. data/app/pb_kits/playbook/pb_hashtag/_hashtag.tsx +10 -1
  24. data/app/pb_kits/playbook/pb_hashtag/docs/_hashtag_link.html.erb +5 -0
  25. data/app/pb_kits/playbook/pb_hashtag/docs/_hashtag_link.jsx +26 -0
  26. data/app/pb_kits/playbook/pb_hashtag/docs/_hashtag_link.md +1 -0
  27. data/app/pb_kits/playbook/pb_hashtag/docs/example.yml +2 -0
  28. data/app/pb_kits/playbook/pb_hashtag/docs/index.js +1 -0
  29. data/app/pb_kits/playbook/pb_hashtag/hashtag.html.erb +1 -1
  30. data/app/pb_kits/playbook/pb_hashtag/hashtag.rb +6 -0
  31. data/app/pb_kits/playbook/pb_hashtag/hashtag.test.js +54 -0
  32. data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.jsx +3 -0
  33. data/app/pb_kits/playbook/pb_home_address_street/city_emphasis.html.erb +2 -1
  34. data/app/pb_kits/playbook/pb_home_address_street/city_emphasis.rb +2 -0
  35. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_link.html.erb +12 -0
  36. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_link.jsx +23 -0
  37. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_link.md +1 -0
  38. data/app/pb_kits/playbook/pb_home_address_street/docs/example.yml +3 -0
  39. data/app/pb_kits/playbook/pb_home_address_street/docs/index.js +1 -0
  40. data/app/pb_kits/playbook/pb_home_address_street/home_address_street.rb +4 -0
  41. data/app/pb_kits/playbook/pb_home_address_street/street_emphasis.html.erb +2 -1
  42. data/app/pb_kits/playbook/pb_home_address_street/street_emphasis.rb +4 -1
  43. data/app/pb_kits/playbook/pb_icon/_icon.tsx +1 -0
  44. data/app/pb_kits/playbook/pb_icon_circle/{_icon_circle.jsx → _icon_circle.tsx} +2 -4
  45. data/app/pb_kits/playbook/pb_kit/{dateTime.js → dateTime.ts} +5 -6
  46. data/app/pb_kits/playbook/pb_label_pill/{_label_pill.jsx → _label_pill.tsx} +2 -4
  47. data/app/pb_kits/playbook/pb_label_value/_label_value.jsx +1 -1
  48. data/app/pb_kits/playbook/pb_logistic/_logistic.jsx +1 -1
  49. data/app/pb_kits/playbook/pb_pill/_pill.tsx +1 -1
  50. data/app/pb_kits/playbook/pb_section_separator/{_section_separator.jsx → _section_separator.tsx} +7 -8
  51. data/app/pb_kits/playbook/pb_time/_time.tsx +92 -0
  52. data/app/pb_kits/playbook/pb_time/docs/_time_align.jsx +1 -1
  53. data/app/pb_kits/playbook/pb_time/docs/_time_default.jsx +1 -1
  54. data/app/pb_kits/playbook/pb_time/docs/_time_sizes.jsx +1 -1
  55. data/app/pb_kits/playbook/pb_time/docs/_time_timestamp.jsx +1 -1
  56. data/app/pb_kits/playbook/pb_time/docs/_time_timezone.jsx +1 -1
  57. data/app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx +1 -1
  58. data/app/pb_kits/playbook/pb_title/_title.tsx +1 -1
  59. data/app/pb_kits/playbook/pb_tooltip/_tooltip.scss +49 -6
  60. data/app/pb_kits/playbook/pb_tooltip/_tooltip.tsx +144 -0
  61. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.jsx +59 -0
  62. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.md +5 -0
  63. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon.erb +10 -0
  64. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon.jsx +52 -0
  65. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon.md +1 -0
  66. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_interaction.jsx +40 -0
  67. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_interaction.md +1 -0
  68. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_margin.jsx +39 -0
  69. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_margin.md +3 -0
  70. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_with_icon_circle.html.erb +1 -1
  71. data/app/pb_kits/playbook/pb_tooltip/docs/example.yml +7 -1
  72. data/app/pb_kits/playbook/pb_tooltip/docs/index.js +4 -0
  73. data/app/pb_kits/playbook/pb_tooltip/tooltip.test.jsx +50 -0
  74. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_without_pills.html.erb +37 -0
  75. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_without_pills.md +1 -0
  76. data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +1 -0
  77. data/app/pb_kits/playbook/pb_typeahead/typeahead.html.erb +2 -2
  78. data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +10 -2
  79. data/app/pb_kits/playbook/pb_weekday_stacked/_weekday_stacked.jsx +1 -1
  80. data/app/pb_kits/playbook/playbook-doc.js +2 -0
  81. data/app/pb_kits/playbook/tokens/_colors.scss +74 -74
  82. data/lib/playbook/version.rb +2 -2
  83. metadata +37 -15
  84. data/app/pb_kits/playbook/pb_date/_date.jsx +0 -138
  85. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.jsx +0 -93
  86. data/app/pb_kits/playbook/pb_time/_time.jsx +0 -90
data/app/pb_kits/playbook/pb_time/_time.jsx DELETED
@@ -1,90 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import classnames from 'classnames'
5
-
6
- import DateTime from '../pb_kit/dateTime.js'
7
- import { buildCss } from '../utilities/props'
8
- import { globalProps } from '../utilities/globalProps'
9
-
10
- import Body from '../pb_body/_body'
11
- import Caption from '../pb_caption/_caption'
12
- import Icon from '../pb_icon/_icon'
13
-
14
- type TimeProps = {
15
- align?: 'left' | 'center' | 'right',
16
- className?: string | array<string>,
17
- data?: string,
18
- date: string,
19
- dark?: boolean,
20
- id?: string,
21
- showIcon?: boolean,
22
- size?: 'md' | 'sm',
23
- showTimezone?: boolean,
24
- timeZone?: string,
25
- }
26
-
27
- const Time = (props: TimeProps) => {
28
- const { align, className, date, showIcon, size, timeZone, showTimezone = true } = props
29
- const classes = classnames(
30
- buildCss('pb_time_kit', align, size),
31
- globalProps(props),
32
- className
33
- )
34
-
35
- const dateTimestamp = new DateTime({ value: date, zone: timeZone })
36
-
37
- return (
38
- <div className={classes}>
39
- <If condition={showIcon}>
40
- <Body
41
- color="light"
42
- tag="span"
43
- >
44
- <Icon
45
- fixedWidth
46
- icon="clock"
47
- size={size === 'md' ? '' : 'sm'}
48
- />
49
- </Body>
50
- {' '}
51
- </If>
52
-
53
- <time dateTime={date}>
54
- <span>
55
- <If condition={size === 'md'}>
56
- <Body
57
- className="pb_time"
58
- tag="span"
59
- text={dateTimestamp.toTimeWithMeridian()}
60
- />
61
- {' '}
62
- <If condition={showTimezone}>
63
- <Body
64
- color="light"
65
- tag="span"
66
- text={dateTimestamp.toTimezone()}
67
- />
68
- </If>
69
- <Else />
70
- <Caption
71
- color="light"
72
- tag="span"
73
- text={dateTimestamp.toTimeWithMeridian()}
74
- />
75
- {' '}
76
- <If condition={showTimezone}>
77
- <Caption
78
- color="light"
79
- tag="span"
80
- text={dateTimestamp.toTimezone()}
81
- />
82
- </If>
83
- </If>
84
- </span>
85
- </time>
86
- </div>
87
- )
88
- }
89
-
90
- export default Time