playbook_ui_docs 14.16.0.pre.alpha.PBNTR881advancedtablefullscreen6934 → 14.16.0.pre.alpha.PBNTR933reactdraggablebugdragbtwnexamples7021

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 (12) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx +6 -6
  3. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx +6 -6
  4. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx +6 -6
  5. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.html.erb +8 -8
  6. data/app/pb_kits/playbook/pb_layout/docs/_layout_bracket.jsx +190 -0
  7. data/app/pb_kits/playbook/pb_layout/docs/_layout_bracket.md +5 -0
  8. data/app/pb_kits/playbook/pb_layout/docs/example.yml +1 -0
  9. data/app/pb_kits/playbook/pb_layout/docs/index.js +1 -0
  10. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_highlight.jsx +4 -4
  11. data/dist/playbook-doc.js +1 -1
  12. metadata +4 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 6e55e657bcb4c361e7264222756c44d31dd7bfb1f87bf5d1e01fda483fc02f06
4
- data.tar.gz: c826cfbbe74087b49a799226bef21cf656f4f2468f2a70881ac459bc69f3994d
3
+ metadata.gz: a89d583e88d53e4e6d1fdb0d5238300854fdaa0513d22fc4c8a060d72d0f4b4b
4
+ data.tar.gz: 7533eead3e280775a782882039c8e2caf102432b132c2424f73c59057c258e95
5
5
  SHA512:
6
- metadata.gz: 7a9aa8628b4d9c3802c37ed188526d0ccac27a5b0d993849a984fd8dd80da7d83eea92fdeed1725040fc9cccac4a9d4b7829a53e7e431f24d9b2908aaf50cf43
7
- data.tar.gz: 485cad8cd4ceeae5e53977e1dbe34049d94fd05151d29cab5f79db7ea25dccd950f44323c921f031db6716c3156ea036466ca86173c3243048f1cd7457309336
6
+ metadata.gz: d87b5f1991d2c92b10b89b89c1c26889aa5b25975a039452286ca854c5083a3c9dfa3aca1a0c1d22df0927ab30a32fb8919712580ec99ab21e034146c115ad16
7
+ data.tar.gz: 1f3fe38313cc68855e73e7bd16edbdfbff98c9a2a579b5e16ec07821ebcba16bdea59142faf1ba8abc35599a7e9f8d679f64b444200a9a90af2b125a3b413ab9
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx CHANGED
@@ -12,7 +12,7 @@ const DropdownWithAutocomplete = (props) => {
12
12
  label: "Jasper Furniss",
13
13
  value: "Jasper Furniss",
14
14
  territory: "PHL",
15
- title: "Senior UX Engineer",
15
+ title: "Lead UX Engineer",
16
16
  id: "jasper-furniss",
17
17
  status: "Offline"
18
18
  },
@@ -25,18 +25,18 @@ const DropdownWithAutocomplete = (props) => {
25
25
  status: "Away"
26
26
  },
27
27
  {
28
- label: "Jason Cypret",
29
- value: "Jason Cypret",
28
+ label: "Carlos Lima",
29
+ value: "Carlos Lima",
30
30
  territory: "PHL",
31
- title: "VP of User Experience",
32
- id: "jason-cypret",
31
+ title: "Nitro Developer",
32
+ id: "carlos-lima",
33
33
  status: "Online"
34
34
  },
35
35
  {
36
36
  label: "Courtney Long",
37
37
  value: "Courtney Long",
38
38
  territory: "PHL",
39
- title: "UX Design Mentor",
39
+ title: "Lead UX Designer",
40
40
  id: "courtney-long",
41
41
  status: "Online"
42
42
  }
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx CHANGED
@@ -15,7 +15,7 @@ const DropdownWithAutocompleteAndCustomDisplay = (props) => {
15
15
  label: "Jasper Furniss",
16
16
  value: "Jasper Furniss",
17
17
  territory: "PHL",
18
- title: "Senior UX Engineer",
18
+ title: "Lead UX Engineer",
19
19
  id: "jasper-furniss",
20
20
  status: "Offline"
21
21
  },
@@ -28,18 +28,18 @@ const DropdownWithAutocompleteAndCustomDisplay = (props) => {
28
28
  status: "Away"
29
29
  },
30
30
  {
31
- label: "Jason Cypret",
32
- value: "Jason Cypret",
31
+ label: "Carlos Lima",
32
+ value: "Carlos Lima",
33
33
  territory: "PHL",
34
- title: "VP of User Experience",
35
- id: "jason-cypret",
34
+ title: "Nitro Developer",
35
+ id: "carlos-lima",
36
36
  status: "Online"
37
37
  },
38
38
  {
39
39
  label: "Courtney Long",
40
40
  value: "Courtney Long",
41
41
  territory: "PHL",
42
- title: "UX Design Mentor",
42
+ title: "Lead UX Designer",
43
43
  id: "courtney-long",
44
44
  status: "Online"
45
45
  }
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx CHANGED
@@ -15,7 +15,7 @@ const DropdownWithCustomDisplay = (props) => {
15
15
  label: "Jasper Furniss",
16
16
  value: "Jasper Furniss",
17
17
  territory: "PHL",
18
- title: "Senior UX Engineer",
18
+ title: "Lead UX Engineer",
19
19
  id: "jasper-furniss",
20
20
  status: "Offline"
21
21
  },
@@ -28,18 +28,18 @@ const DropdownWithCustomDisplay = (props) => {
28
28
  status: "Away"
29
29
  },
30
30
  {
31
- label: "Jason Cypret",
32
- value: "Jason Cypret",
31
+ label: "Carlos Lima",
32
+ value: "Carlos Lima",
33
33
  territory: "PHL",
34
- title: "VP of User Experience",
35
- id: "jason-cypret",
34
+ title: "Nitro Developer",
35
+ id: "carlos-lima",
36
36
  status: "Online"
37
37
  },
38
38
  {
39
39
  label: "Courtney Long",
40
40
  value: "Courtney Long",
41
41
  territory: "PHL",
42
- title: "UX Design Mentor",
42
+ title: "Lead UX Designer",
43
43
  id: "courtney-long",
44
44
  status: "Online"
45
45
  }
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.html.erb CHANGED
@@ -1,10 +1,10 @@
1
1
  <%
2
- options = [
2
+ options = [
3
3
  {
4
4
  label: "Jasper Furniss",
5
5
  value: "Jasper Furniss",
6
6
  territory: "PHL",
7
- title: "Senior UX Engineer",
7
+ title: "Lead UX Engineer",
8
8
  id: "jasper-furniss",
9
9
  status: "Offline"
10
10
  },
@@ -17,22 +17,22 @@
17
17
  status: "Away"
18
18
  },
19
19
  {
20
- label: "Jason Cypret",
21
- value: "Jason Cypret",
20
+ label: "Carlos Lima",
21
+ value: "Carlos Lima",
22
22
  territory: "PHL",
23
- title: "VP of User Experience",
24
- id: "jason-cypret",
23
+ title: "Nitro Developer",
24
+ id: "carlos-lima",
25
25
  status: "Online"
26
26
  },
27
27
  {
28
28
  label: "Courtney Long",
29
29
  value: "Courtney Long",
30
30
  territory: "PHL",
31
- title: "UX Design Mentor",
31
+ title: "Lead UX Designer",
32
32
  id: "courtney-long",
33
33
  status: "Online"
34
34
  }
35
- ]
35
+ ];
36
36
 
37
37
  %>
38
38
 
data/app/pb_kits/playbook/pb_layout/docs/_layout_bracket.jsx ADDED
@@ -0,0 +1,190 @@
1
+ import React from 'react'
2
+
3
+ import Layout from '../../pb_layout/_layout'
4
+ import Flex from '../../pb_flex/_flex'
5
+ import Body from '../../pb_body/_body'
6
+ import Caption from '../../pb_caption/_caption'
7
+ import SectionSeparator from '../../pb_section_separator/_section_separator'
8
+
9
+ const LayoutBracket = () => {
10
+ return (
11
+ <div>
12
+ <Layout
13
+ layout="bracket"
14
+ >
15
+ <Layout.RoundLabel>
16
+ <Caption>Wild Card</Caption>
17
+ <SectionSeparator marginY="sm"/>
18
+ </Layout.RoundLabel>
19
+ <Layout.Round marginBottom={{ xs: "md", sm: "md" }}>
20
+ <Layout.Game>
21
+ <Flex justify="between">
22
+ <Body>Packers</Body>
23
+ <Body>10</Body>
24
+ </Flex>
25
+ <Flex justify="between">
26
+ <Body><strong>Eagles</strong></Body>
27
+ <Body>22</Body>
28
+ </Flex>
29
+ </Layout.Game>
30
+ <Layout.Game>
31
+ <Flex justify="between">
32
+ <Body>Vikings</Body>
33
+ <Body>9</Body>
34
+ </Flex>
35
+ <Flex justify="between">
36
+ <Body><strong>Rams</strong></Body>
37
+ <Body>27</Body>
38
+ </Flex>
39
+ </Layout.Game>
40
+ <Layout.Game>
41
+ <Flex justify="between">
42
+ <Body><strong>Lions</strong></Body>
43
+ </Flex>
44
+ <Flex justify="between">
45
+ <Body>BYE</Body>
46
+ </Flex>
47
+ </Layout.Game>
48
+ <Layout.Game>
49
+ <Flex justify="between">
50
+ <Body><strong>Commanders</strong></Body>
51
+ <Body>23</Body>
52
+ </Flex>
53
+ <Flex justify="between">
54
+ <Body>Buccaneers</Body>
55
+ <Body>20</Body>
56
+ </Flex>
57
+ </Layout.Game>
58
+ <Layout.Game>
59
+ <Flex justify="between">
60
+ <Body><strong>Chiefs</strong></Body>
61
+ </Flex>
62
+ <Flex justify="between">
63
+ <Body>BYE</Body>
64
+ </Flex>
65
+ </Layout.Game>
66
+ <Layout.Game>
67
+ <Flex justify="between">
68
+ <Body>Chargers</Body>
69
+ <Body>12</Body>
70
+ </Flex>
71
+ <Flex justify="between">
72
+ <Body><strong>Texans</strong></Body>
73
+ <Body>32</Body>
74
+ </Flex>
75
+ </Layout.Game>
76
+ <Layout.Game>
77
+ <Flex justify="between">
78
+ <Body>Broncos</Body>
79
+ <Body>7</Body>
80
+ </Flex>
81
+ <Flex justify="between">
82
+ <Body><strong>Bills</strong></Body>
83
+ <Body>31</Body>
84
+ </Flex>
85
+ </Layout.Game>
86
+ <Layout.Game>
87
+ <Flex justify="between">
88
+ <Body>Steelers</Body>
89
+ <Body>14</Body>
90
+ </Flex>
91
+ <Flex justify="between">
92
+ <Body><strong>Ravens</strong></Body>
93
+ <Body>28</Body>
94
+ </Flex>
95
+ </Layout.Game>
96
+ </Layout.Round>
97
+ <Layout.RoundLabel>
98
+ <Caption>Divisional</Caption>
99
+ <SectionSeparator marginY="sm"/>
100
+ </Layout.RoundLabel>
101
+ <Layout.Round marginBottom={{ xs: "md", sm: "md" }}>
102
+ <Layout.Game>
103
+ <Flex justify="between">
104
+ <Body>Rams</Body>
105
+ <Body>22</Body>
106
+ </Flex>
107
+ <Flex justify="between">
108
+ <Body><strong>Eagles</strong></Body>
109
+ <Body>28</Body>
110
+ </Flex>
111
+ </Layout.Game>
112
+ <Layout.Game>
113
+ <Flex justify="between">
114
+ <Body><strong>Commanders</strong></Body>
115
+ <Body>45</Body>
116
+ </Flex>
117
+ <Flex justify="between">
118
+ <Body>Lions</Body>
119
+ <Body>31</Body>
120
+ </Flex>
121
+ </Layout.Game>
122
+ <Layout.Game>
123
+ <Flex justify="between">
124
+ <Body>Texans</Body>
125
+ <Body>14</Body>
126
+ </Flex>
127
+ <Flex justify="between">
128
+ <Body><strong>Chiefs</strong></Body>
129
+ <Body>23</Body>
130
+ </Flex>
131
+ </Layout.Game>
132
+ <Layout.Game>
133
+ <Flex justify="between">
134
+ <Body>Ravens</Body>
135
+ <Body>25</Body>
136
+ </Flex>
137
+ <Flex justify="between">
138
+ <Body><strong>Bills</strong></Body>
139
+ <Body>27</Body>
140
+ </Flex>
141
+ </Layout.Game>
142
+ </Layout.Round>
143
+ <Layout.RoundLabel>
144
+ <Caption>Conference</Caption>
145
+ <SectionSeparator marginY="sm"/>
146
+ </Layout.RoundLabel>
147
+ <Layout.Round marginBottom={{ xs: "md", sm: "md" }}>
148
+ <Layout.Game>
149
+ <Flex justify="between">
150
+ <Body>Commanders</Body>
151
+ <Body>23</Body>
152
+ </Flex>
153
+ <Flex justify="between">
154
+ <Body><strong>Eagles</strong></Body>
155
+ <Body>55</Body>
156
+ </Flex>
157
+ </Layout.Game>
158
+ <Layout.Game>
159
+ <Flex justify="between">
160
+ <Body>Bills</Body>
161
+ <Body>29</Body>
162
+ </Flex>
163
+ <Flex justify="between">
164
+ <Body><strong>Chiefs</strong></Body>
165
+ <Body>32</Body>
166
+ </Flex>
167
+ </Layout.Game>
168
+ </Layout.Round>
169
+ <Layout.RoundLabel>
170
+ <Caption>Super Bowl</Caption>
171
+ <SectionSeparator marginY="sm"/>
172
+ </Layout.RoundLabel>
173
+ <Layout.Round>
174
+ <Layout.Game>
175
+ <Flex justify="between">
176
+ <Body>Chiefs</Body>
177
+ <Body>22</Body>
178
+ </Flex>
179
+ <Flex justify="between">
180
+ <Body><strong>Eagles</strong></Body>
181
+ <Body>40</Body>
182
+ </Flex>
183
+ </Layout.Game>
184
+ </Layout.Round>
185
+ </Layout>
186
+ </div>
187
+ )
188
+ }
189
+
190
+ export default LayoutBracket
data/app/pb_kits/playbook/pb_layout/docs/_layout_bracket.md ADDED
@@ -0,0 +1,5 @@
1
+ Use `<Layout.RoundLabel>`, `<Layout.Round>`, and `<Layout.Game>` to make a bracket layout.
2
+
3
+ On mobile devices, `<Layout.RoundLabel>` will display (on desktop these components are hidden) and the bracket will be in one column.
4
+
5
+ Ensure that each `<Layout.Game>` maintains a consistent height for the bracket lines to lay out properly.
data/app/pb_kits/playbook/pb_layout/docs/example.yml CHANGED
@@ -18,4 +18,5 @@ examples:
18
18
  - layout_kanban: Kanban Layout
19
19
  - layout_content: Content Layout
20
20
  - layout_masonry: Masonry Layout
21
+ - layout_bracket: Bracket Layout
21
22
 
data/app/pb_kits/playbook/pb_layout/docs/index.js CHANGED
@@ -7,4 +7,5 @@ export { default as LayoutKanbanResponsive } from './_layout_kanban_responsive.j
7
7
  export { default as LayoutCollectionDetail } from './_layout_collection_detail.jsx'
8
8
  export { default as LayoutContent } from './_layout_content.jsx'
9
9
  export { default as LayoutMasonry } from './_layout_masonry.jsx'
10
+ export { default as LayoutBracket } from './_layout_bracket.jsx'
10
11
 
data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_highlight.jsx CHANGED
@@ -18,18 +18,18 @@ const USERS = [
18
18
  territory: "PHL",
19
19
  },
20
20
  {
21
- name: "Jason Cypret",
22
- title: "Vice President of User Experience",
21
+ name: "Carlos Lima",
22
+ title: "Nitro Developer",
23
23
  territory: "PHL",
24
24
  },
25
25
  {
26
26
  name: "Stephen Marshall",
27
- title: "Senior User Experience Engineer",
27
+ title: "Senior Nitro Developer",
28
28
  territory: "PHL",
29
29
  },
30
30
  {
31
31
  name: "Jasper Furniss",
32
- title: "Senior User Experience Engineer",
32
+ title: "Lead User Experience Engineer",
33
33
  territory: "PHL",
34
34
  },
35
35
  ];