playbook_ui_docs 14.12.0.pre.alpha.play1887homeaddressfix5910 → 14.12.0.pre.alpha.playrailsinputmaskissue5775

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 (31) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx +3 -9
  3. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx +2 -6
  4. data/app/pb_kits/playbook/pb_copy_button/docs/example.yml +3 -3
  5. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/example.yml +0 -1
  6. data/app/pb_kits/playbook/pb_home_address_street/docs/example.yml +0 -2
  7. data/app/pb_kits/playbook/pb_home_address_street/docs/index.js +0 -1
  8. data/app/pb_kits/playbook/pb_link/docs/example.yml +3 -5
  9. data/app/pb_kits/playbook/pb_link/docs/index.js +1 -2
  10. data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tooltip.html.erb +6 -6
  11. data/app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.html.erb +9 -6
  12. data/app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.jsx +9 -6
  13. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb +1 -1
  14. data/app/pb_kits/playbook/pb_user/docs/example.yml +0 -2
  15. data/app/pb_kits/playbook/pb_user/docs/index.js +0 -1
  16. data/dist/playbook-doc.js +1 -1
  17. metadata +3 -16
  18. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.html.erb +0 -2
  19. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.html.erb +0 -5
  20. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb +0 -58
  21. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close_rails.md +0 -3
  22. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.html.erb +0 -11
  23. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting.jsx +0 -22
  24. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_rails.md +0 -1
  25. data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_formatting_react.md +0 -1
  26. data/app/pb_kits/playbook/pb_link/docs/_link_target.html.erb +0 -15
  27. data/app/pb_kits/playbook/pb_link/docs/_link_target.jsx +0 -29
  28. data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.html.erb +0 -42
  29. data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.jsx +0 -59
  30. data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.md +0 -2
  31. /data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/{_fixed_confirmation_toast_auto_close_react.md → _fixed_confirmation_toast_auto_close.md} +0 -0
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: d9692a788d58cdb39cd8a954a05e093cab618877dc02beab3e7839b9f9cb22ab
4
- data.tar.gz: ac937d7df359a2a5bc04397609883a4e1e198c868e7d5b948e9735b576204207
3
+ metadata.gz: eb80eb1a0861971b2451b28917b5c1771d4dcc34ae52a922b48edac720db75a7
4
+ data.tar.gz: eba7cbcd4d1633fd55d45e71da4766e9d4fd9d12473ef2da924ba36155836247
5
5
  SHA512:
6
- metadata.gz: b2f9b230ec249ea3edc25b4eadec3946efa2b65c19fd67ede038c09919c22db467b5eea45c671da0817c53f49a6074d2d8dc1d229823146dd7916f68d7c67fde
7
- data.tar.gz: a90c910b74471d91cfb15b6a76f28577ffc247efc23548bfa4e130da98215c76b2e577c3aa77c5c2e2d41229693042839b76038e21170f5c5bb6360f34a4876f
6
+ metadata.gz: 2091cc316657c8baaa471009629fa1fc4ba800d5544ceda6e7ccdbad025b5eb46a0b5f1267b3a796983059a80e7b1da319999f2bcb71a6f5370451b8755f9d84
7
+ data.tar.gz: d6ce627481d3e08c86394518b299e19aaaae13df3aded45fa9ecaf321f926eec42c17d9da02d1b820f4fabbfe99e396b9e6aaf330f2415bab4dfb986f7e7866d
@@ -1,19 +1,18 @@
1
1
  import React from "react";
2
2
  import { Avatar } from 'playbook-ui'
3
3
 
4
- const AvatarBadgeComponentOverlay = (props) => {
4
+ const AvatarBadgeComponentOverlay = () => {
5
5
  return (
6
6
  <div>
7
7
  <Avatar
8
8
  componentOverlay={{
9
9
  component: "badge",
10
10
  placement: "bottom-right",
11
- text: "12",
11
+ text: "12"
12
12
  }}
13
13
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
14
14
  marginBottom="sm"
15
15
  size="sm"
16
- {...props}
17
16
  />
18
17
 
19
18
  <Avatar
@@ -25,8 +24,6 @@ const AvatarBadgeComponentOverlay = (props) => {
25
24
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
26
25
  marginBottom="sm"
27
26
  size="md"
28
- {...props}
29
-
30
27
  />
31
28
 
32
29
  <Avatar
@@ -39,8 +36,6 @@ const AvatarBadgeComponentOverlay = (props) => {
39
36
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
40
37
  marginBottom="sm"
41
38
  size="lg"
42
- {...props}
43
-
44
39
  />
45
40
 
46
41
  <Avatar
@@ -53,8 +48,7 @@ const AvatarBadgeComponentOverlay = (props) => {
53
48
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
54
49
  marginBottom="sm"
55
50
  size="xl"
56
- {...props}
57
- />
51
+ />
58
52
  </div>
59
53
  )
60
54
  }
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import { Avatar } from 'playbook-ui'
3
3
 
4
- const AvatarCircleIconComponentOverlay = (props) => {
4
+ const AvatarCircleIconComponentOverlay = () => {
5
5
  return (
6
6
  <div>
7
7
  <Avatar
@@ -14,7 +14,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
14
14
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
15
15
  marginBottom="sm"
16
16
  size="sm"
17
- {...props}
18
17
  />
19
18
 
20
19
  <Avatar
@@ -27,7 +26,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
27
26
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
28
27
  marginBottom="sm"
29
28
  size="md"
30
- {...props}
31
29
  />
32
30
 
33
31
  <Avatar
@@ -40,7 +38,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
40
38
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
41
39
  marginBottom="sm"
42
40
  size="lg"
43
- {...props}
44
41
  />
45
42
 
46
43
  <Avatar
@@ -53,8 +50,7 @@ const AvatarCircleIconComponentOverlay = (props) => {
53
50
  imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
54
51
  marginBottom="sm"
55
52
  size="xl"
56
- {...props}
57
- />
53
+ />
58
54
  </div>
59
55
  )
60
56
  }
@@ -1,8 +1,8 @@
1
1
  examples:
2
- rails:
3
- - copy_button_default: Default
4
- - copy_button_from: Copy From
2
+
5
3
 
6
4
  react:
7
5
  - copy_button_default: Default
8
6
  - copy_button_from: Copy From
7
+
8
+
@@ -5,7 +5,6 @@ examples:
5
5
  - fixed_confirmation_toast_multi_line: Multi Line
6
6
  - fixed_confirmation_toast_close: Click to Close
7
7
  - fixed_confirmation_toast_positions: Click to Show Positions
8
- - fixed_confirmation_toast_auto_close: Click to Show Auto Close
9
8
  - fixed_confirmation_toast_children: Children
10
9
  - fixed_confirmation_toast_custom_icon: Custom Icon
11
10
 
@@ -5,14 +5,12 @@ examples:
5
5
  - home_address_street_emphasis: Emphasis
6
6
  - home_address_street_modified: Modified
7
7
  - home_address_street_link: Link
8
- - home_address_street_formatting: Formatting
9
8
 
10
9
  react:
11
10
  - home_address_street_default: Default
12
11
  - home_address_street_emphasis: Emphasis
13
12
  - home_address_street_modified: Modified
14
13
  - home_address_street_link: Link
15
- - home_address_street_formatting: Formatting
16
14
 
17
15
  swift:
18
16
  - home_address_street_default_swift: Default
@@ -2,4 +2,3 @@ export { default as HomeAddressStreetDefault } from './_home_address_street_defa
2
2
  export { default as HomeAddressStreetEmphasis } from './_home_address_street_emphasis.jsx'
3
3
  export { default as HomeAddressStreetModified } from './_home_address_street_modified.jsx'
4
4
  export { default as HomeAddressStreetLink } from './_home_address_street_link.jsx'
5
- export { default as HomeAddressStreetFormatting } from './_home_address_street_formatting.jsx'
@@ -1,18 +1,16 @@
1
1
  examples:
2
-
2
+
3
3
  rails:
4
4
  - link_color: Color
5
5
  - link_underline: Underline
6
6
  - link_icon: Icon
7
7
  - link_disabled: Disabled
8
8
  - link_tag: Tag
9
- - link_target: Target
10
-
11
-
9
+
10
+
12
11
  react:
13
12
  - link_color: Color
14
13
  - link_underline: Underline
15
14
  - link_icon: Icon
16
15
  - link_disabled: Disabled
17
16
  - link_tag: Tag
18
- - link_target: Target
@@ -2,5 +2,4 @@ export { default as LinkColor } from './_link_color.jsx'
2
2
  export { default as LinkUnderline } from './_link_underline.jsx'
3
3
  export { default as LinkIcon } from './_link_icon.jsx'
4
4
  export { default as LinkDisabled } from './_link_disabled.jsx'
5
- export { default as LinkTag } from './_link_tag.jsx'
6
- export { default as LinkTarget } from './_link_target.jsx'
5
+ export { default as LinkTag } from './_link_tag.jsx'
@@ -2,7 +2,7 @@
2
2
  <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-1", tooltip: "Tooltip for step 1", tooltip_position: "right", step_direction: "horizontal" }) do %>
3
3
  step 1
4
4
  <% end %>
5
- <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-2", tooltip: "Tooltip for step 2", tooltip_position: "left", step_direction: "horizontal" }) do %>
5
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-2", tooltip: "Tooltip for step 2", step_direction: "horizontal" }) do %>
6
6
  step 2
7
7
  <% end %>
8
8
  <%= pb_rails("progress_step/progress_step_item", props: {status: "active", classname: "tooltip-trigger-3", tooltip: "Tooltip for step 3", tooltip_position: "left", step_direction: "horizontal" }) do %>
@@ -11,7 +11,7 @@
11
11
  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-4", tooltip: "Tooltip for step 4", tooltip_position: "bottom" }) do %>
12
12
  step 4
13
13
  <% end %>
14
- <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-5", tooltip: "Tooltip for step 5", tooltip_position: "left" }) do %>
14
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-5", tooltip: "Tooltip for step 5" }) do %>
15
15
  step 5
16
16
  <% end %>
17
17
  <% end %>
@@ -19,7 +19,7 @@
19
19
  <br /><br />
20
20
 
21
21
  <%= pb_rails("progress_step", props: {orientation: "vertical"}) do %>
22
- <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-6", tooltip: "Tooltip step 1", step_direction: "vertical", tooltip_position: "left" }) do %>
22
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-6", tooltip: "Tooltip step 1", step_direction: "vertical" }) do %>
23
23
  <% end %>
24
24
  <%= pb_rails("progress_step/progress_step_item", props: {status: "active", classname: "tooltip-trigger-7", tooltip: "Tooltip step 2", tooltip_position: "left"}) do %>
25
25
  <% end %>
@@ -31,10 +31,10 @@
31
31
 
32
32
  <br /><br>
33
33
  <%= pb_rails("progress_step",props:{ variant:"tracker", icon:true}) do %>
34
- <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-10", tooltip: "The order has been received", step_direction: "horizontal" , tooltip_position: "right" }) do %>
34
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "complete", classname: "tooltip-trigger-10", tooltip: "The order has been received", step_direction: "horizontal" , tooltip_position: "right" }) do %>
35
35
  <%= pb_rails("caption", props:{text: "Ordered"})%>
36
36
  <% end %>
37
- <%= pb_rails("progress_step/progress_step_item", props: {status: "active", classname: "tooltip-trigger-11", tooltip:"Item(s) have been shipped", tooltip_position: "right" }) do %>
37
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "active", classname: "tooltip-trigger-11", tooltip:"Item(s) have been shipped" }) do %>
38
38
  <%= pb_rails("caption", props:{text: "Shipped"})%>
39
39
  <% end %>
40
40
  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-12", tooltip:"This step has not been reached", tooltip_position: "left" }) do %>
@@ -50,7 +50,7 @@
50
50
  <%= pb_rails("progress_step/progress_step_item", props: {status: "active", icon: "exclamation-triangle", classname: "tooltip-trigger-14", tooltip: "More details needed before shipment", tooltip_position: "bottom" }) do %>
51
51
  <%= pb_rails("caption", props:{text: "Shipped"})%>
52
52
  <% end %>
53
- <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-15", tooltip: "This step is inactive", tooltip_position: "bottom"}) do %>
53
+ <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-15", tooltip: "This step is inactive"}) do %>
54
54
  <%= pb_rails("caption", props:{text: "Out for Delivery"})%>
55
55
  <% end %>
56
56
  <%= pb_rails("progress_step/progress_step_item", props: {status: "inactive", classname: "tooltip-trigger-16", tooltip: "Estimated delivery: Jun 27", tooltip_position: "left"}) do %>
@@ -39,17 +39,20 @@
39
39
  </tr>
40
40
  </tbody>
41
41
  <% end %>
42
+
42
43
  <%= pb_rails("table", props: { size: "sm", margin_bottom: "lg" }) do %>
43
44
  <colgroup>
44
45
  <%= pb_rails("background", props: { background_color: "error_subtle", tag: "col" }) %>
45
- <%= pb_rails("background", props: { background_color: "info_subtle", tag: "col" }) %>
46
+ <%= pb_rails("background", props: { background_color: "card_light", tag: "col" }) %>
46
47
  <%= pb_rails("background", props: { background_color: "warning_subtle", tag: "col" }) %>
47
48
  </colgroup>
48
- <thead>
49
- <th>Column 1</th>
50
- <th>Column 2</th>
51
- <th>Column 3</th>
52
- </thead>
49
+ <%= pb_rails("background", props: { background_color: "card_light", tag: "thead" }) do %>
50
+ <tr>
51
+ <th>Column 1</th>
52
+ <th>Column 2</th>
53
+ <th>Column 3</th>
54
+ </tr>
55
+ <% end %>
53
56
  <tbody>
54
57
  <tr>
55
58
  <td>Value 1</td>
@@ -68,7 +68,7 @@ const TableWithBackgroundKit = (props) => {
68
68
  tag='col'
69
69
  />
70
70
  <Background
71
- backgroundColor="info_subtle"
71
+ backgroundColor="card_light"
72
72
  tag='col'
73
73
  />
74
74
  <Background
@@ -76,13 +76,16 @@ const TableWithBackgroundKit = (props) => {
76
76
  tag='col'
77
77
  />
78
78
  </colgroup>
79
- <thead>
79
+ <Background
80
+ backgroundColor="card_light"
81
+ tag='thead'
82
+ >
80
83
  <tr>
81
- <th>{'Column 1'}</th>
82
- <th>{'Column 2'}</th>
83
- <th>{'Column 3'}</th>
84
+ <th>{'Column 1'}</th>
85
+ <th>{'Column 2'}</th>
86
+ <th>{'Column 3'}</th>
84
87
  </tr>
85
- </thead>
88
+ </Background>
86
89
  <tbody>
87
90
  <tr>
88
91
  <td>{'Value 1'}</td>
@@ -43,4 +43,4 @@
43
43
  Whoa. I'm a tooltip.
44
44
  <% end %>
45
45
  <% end %>
46
- <% end %>
46
+ <% end %>
@@ -2,7 +2,6 @@ examples:
2
2
 
3
3
  rails:
4
4
  - user_default: Default
5
- - user_light_weight: Light Weight
6
5
  - user_with_territory: With Territory
7
6
  - user_text_only: Text Only
8
7
  - user_size: Horizontal Size
@@ -12,7 +11,6 @@ examples:
12
11
 
13
12
  react:
14
13
  - user_default: Default
15
- - user_light_weight: Light Weight
16
14
  - user_with_territory: With Territory
17
15
  - user_text_only: Text Only
18
16
  - user_size: Horizontal Size
@@ -1,5 +1,4 @@
1
1
  export { default as UserDefault } from './_user_default.jsx'
2
- export { default as UserLightWeight } from './_user_light_weight.jsx'
3
2
  export { default as UserWithTerritory } from './_user_with_territory.jsx'
4
3
  export { default as UserTextOnly } from './_user_text_only.jsx'
5
4
  export { default as UserSize } from './_user_size.jsx'