playbook_ui_docs 13.20.0.pre.alpha.play1247htmloptions2404 → 13.20.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_date/docs/_date_alignment_swift.md +6 -26
- data/app/pb_kits/playbook/pb_date/docs/_date_default_swift.md +8 -27
- data/app/pb_kits/playbook/pb_message/docs/_description.md +1 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_side_highlight.jsx +25 -24
- data/app/pb_kits/playbook/pb_table/docs/example.yml +2 -6
- data/app/pb_kits/playbook/pb_table/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_add_on.jsx +0 -20
- data/app/pb_kits/playbook/pb_user/docs/_user_props_table.md +1 -2
- data/app/pb_kits/playbook/pb_user/docs/example.yml +0 -1
- data/dist/playbook-doc.js +10 -10
- metadata +7 -15
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.jsx +0 -47
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.md +0 -7
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.html.erb +0 -34
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.jsx +0 -48
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.md +0 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_rails.html.erb +0 -34
- data/app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_rails.md +0 -7
- data/app/pb_kits/playbook/pb_user/docs/_user_presence_indicator_swift.md +0 -30
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 5011fb31c9bf72b1b2be219af9b7a8f72c0c8f55c25ac10454cb7c255499bf44
|
|
4
|
+
data.tar.gz: e2568fe54ac4c2fa1ec5666e5638674db33165cf71f2204c4b8289322547d6dd
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 109f4e1214b129a1f3c46bc38819f68550f4e84d59593eb9287fb6cf58e2b58008769fc6ebd506ab9b59bda021619a6944a4d177db3fcb6490a25d869ca66445
|
|
7
|
+
data.tar.gz: acfc7dd64a983450095c0db2b32bf412dbb55f01adb4de1cbe5901d9d053e72de71146a0b13049ea265fd093b9225fc227ba70362655f9d64df3ad74cf192d4a
|
|
@@ -1,31 +1,11 @@
|
|
|
1
1
|
|
|
2
2
|
|
|
3
3
|
```swift
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
typography: .title4
|
|
10
|
-
)
|
|
11
|
-
}
|
|
12
|
-
.frame(maxWidth: .infinity, alignment: .leading)
|
|
13
|
-
HStack {
|
|
14
|
-
PBDate(
|
|
15
|
-
Date().makeDate(year: 2020, month: 12, day: 25),
|
|
16
|
-
variant: .withIcon(isStandard: true),
|
|
17
|
-
typography: .title4,
|
|
18
|
-
iconSize: .x1
|
|
19
|
-
)
|
|
20
|
-
}
|
|
21
|
-
.frame(maxWidth: .infinity, alignment: .center)
|
|
22
|
-
HStack {
|
|
23
|
-
PBDate(
|
|
24
|
-
Date(),
|
|
25
|
-
variant: .short,
|
|
26
|
-
typography: .title4
|
|
27
|
-
)
|
|
28
|
-
}
|
|
29
|
-
.frame(maxWidth: .infinity, alignment: .trailing)
|
|
4
|
+
|
|
5
|
+
VStack(spacing: Spacing.small) {
|
|
6
|
+
PBDate(Date(), variant: .standard, typography: .title4, alignment: .leading)
|
|
7
|
+
PBDate(Date(), variant: .withIcon(isStandard: true), typography: .title4, iconSize: .x1, alignment: .center)
|
|
8
|
+
PBDate(Date(), variant: .short, typography: .title4, alignment: .trailing)
|
|
30
9
|
}
|
|
10
|
+
|
|
31
11
|
```
|
|
@@ -2,34 +2,15 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
```swift
|
|
5
|
+
|
|
5
6
|
VStack(alignment: .leading, spacing: Spacing.small) {
|
|
6
|
-
PBDate(
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
)
|
|
10
|
-
PBDate(
|
|
11
|
-
Date().makeDate(year: 2012, month: 8, day: 3),
|
|
12
|
-
variant: .standard
|
|
13
|
-
)
|
|
14
|
-
PBDate(
|
|
15
|
-
Date().makeDate(year: 2017, month: 12, day: 3),
|
|
16
|
-
variant: .dayDate(showYear: true)
|
|
17
|
-
)
|
|
7
|
+
PBDate(Date(), variant: .short)
|
|
8
|
+
PBDate(Date(), variant: .dayDate)
|
|
9
|
+
PBDate(Date(), variant: .standard)
|
|
18
10
|
Spacer()
|
|
19
|
-
PBDate(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
typography: .title4
|
|
23
|
-
)
|
|
24
|
-
PBDate(
|
|
25
|
-
Date().makeDate(year: 2012, month: 8, day: 3),
|
|
26
|
-
variant: .standard,
|
|
27
|
-
typography: .title4
|
|
28
|
-
)
|
|
29
|
-
PBDate(
|
|
30
|
-
Date().makeDate(year: 2017, month: 12, day: 3),
|
|
31
|
-
variant: .dayDate(showYear: true),
|
|
32
|
-
typography: .title4
|
|
33
|
-
)
|
|
11
|
+
PBDate(Date(), variant: .short, typography: .title4)
|
|
12
|
+
PBDate(Date(), variant: .dayDate, typography: .title4)
|
|
13
|
+
PBDate(Date(), variant: .standard, typography: .title4)
|
|
34
14
|
}
|
|
15
|
+
|
|
35
16
|
```
|
|
@@ -1 +1 @@
|
|
|
1
|
-
This multi kit
|
|
1
|
+
This multi kit consist of a an avatar, a status, a caption, a body text, and a time stamp. All which can be optional.
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react'
|
|
2
2
|
|
|
3
3
|
import Table from '../_table'
|
|
4
|
+
import TableRow from '../_table_row'
|
|
4
5
|
|
|
5
6
|
const TableSideHighlight = (props) => {
|
|
6
7
|
return (
|
|
@@ -19,7 +20,7 @@ const TableSideHighlight = (props) => {
|
|
|
19
20
|
</tr>
|
|
20
21
|
</thead>
|
|
21
22
|
<tbody>
|
|
22
|
-
<
|
|
23
|
+
<TableRow
|
|
23
24
|
sideHighlightColor="product_1_highlight"
|
|
24
25
|
{...props}
|
|
25
26
|
>
|
|
@@ -28,8 +29,8 @@ const TableSideHighlight = (props) => {
|
|
|
28
29
|
<td>{'Value 3'}</td>
|
|
29
30
|
<td>{'Value 4'}</td>
|
|
30
31
|
<td>{'Value 5'}</td>
|
|
31
|
-
</
|
|
32
|
-
<
|
|
32
|
+
</TableRow>
|
|
33
|
+
<TableRow
|
|
33
34
|
sideHighlightColor="product_2_highlight"
|
|
34
35
|
{...props}
|
|
35
36
|
>
|
|
@@ -38,8 +39,8 @@ const TableSideHighlight = (props) => {
|
|
|
38
39
|
<td>{'Value 3'}</td>
|
|
39
40
|
<td>{'Value 4'}</td>
|
|
40
41
|
<td>{'Value 5'}</td>
|
|
41
|
-
</
|
|
42
|
-
<
|
|
42
|
+
</TableRow>
|
|
43
|
+
<TableRow
|
|
43
44
|
sideHighlightColor="product_3_highlight"
|
|
44
45
|
{...props}
|
|
45
46
|
>
|
|
@@ -48,8 +49,8 @@ const TableSideHighlight = (props) => {
|
|
|
48
49
|
<td>{'Value 3'}</td>
|
|
49
50
|
<td>{'Value 4'}</td>
|
|
50
51
|
<td>{'Value 5'}</td>
|
|
51
|
-
</
|
|
52
|
-
<
|
|
52
|
+
</TableRow>
|
|
53
|
+
<TableRow
|
|
53
54
|
sideHighlightColor="none"
|
|
54
55
|
{...props}
|
|
55
56
|
>
|
|
@@ -58,7 +59,7 @@ const TableSideHighlight = (props) => {
|
|
|
58
59
|
<td>{'Value 3'}</td>
|
|
59
60
|
<td>{'Value 4'}</td>
|
|
60
61
|
<td>{'Value 5'}</td>
|
|
61
|
-
</
|
|
62
|
+
</TableRow>
|
|
62
63
|
</tbody>
|
|
63
64
|
</Table>
|
|
64
65
|
|
|
@@ -78,7 +79,7 @@ const TableSideHighlight = (props) => {
|
|
|
78
79
|
</tr>
|
|
79
80
|
</thead>
|
|
80
81
|
<tbody>
|
|
81
|
-
<
|
|
82
|
+
<TableRow
|
|
82
83
|
sideHighlightColor="success"
|
|
83
84
|
{...props}
|
|
84
85
|
>
|
|
@@ -87,8 +88,8 @@ const TableSideHighlight = (props) => {
|
|
|
87
88
|
<td>{'Value 3'}</td>
|
|
88
89
|
<td>{'Value 4'}</td>
|
|
89
90
|
<td>{'Value 5'}</td>
|
|
90
|
-
</
|
|
91
|
-
<
|
|
91
|
+
</TableRow>
|
|
92
|
+
<TableRow
|
|
92
93
|
sideHighlightColor="warning"
|
|
93
94
|
{...props}
|
|
94
95
|
>
|
|
@@ -97,8 +98,8 @@ const TableSideHighlight = (props) => {
|
|
|
97
98
|
<td>{'Value 3'}</td>
|
|
98
99
|
<td>{'Value 4'}</td>
|
|
99
100
|
<td>{'Value 5'}</td>
|
|
100
|
-
</
|
|
101
|
-
<
|
|
101
|
+
</TableRow>
|
|
102
|
+
<TableRow
|
|
102
103
|
sideHighlightColor="error"
|
|
103
104
|
{...props}
|
|
104
105
|
>
|
|
@@ -107,8 +108,8 @@ const TableSideHighlight = (props) => {
|
|
|
107
108
|
<td>{'Value 3'}</td>
|
|
108
109
|
<td>{'Value 4'}</td>
|
|
109
110
|
<td>{'Value 5'}</td>
|
|
110
|
-
</
|
|
111
|
-
<
|
|
111
|
+
</TableRow>
|
|
112
|
+
<TableRow
|
|
112
113
|
sideHighlightColor="none"
|
|
113
114
|
{...props}
|
|
114
115
|
>
|
|
@@ -117,7 +118,7 @@ const TableSideHighlight = (props) => {
|
|
|
117
118
|
<td>{'Value 3'}</td>
|
|
118
119
|
<td>{'Value 4'}</td>
|
|
119
120
|
<td>{'Value 5'}</td>
|
|
120
|
-
</
|
|
121
|
+
</TableRow>
|
|
121
122
|
</tbody>
|
|
122
123
|
</Table>
|
|
123
124
|
|
|
@@ -137,7 +138,7 @@ const TableSideHighlight = (props) => {
|
|
|
137
138
|
</tr>
|
|
138
139
|
</thead>
|
|
139
140
|
<tbody>
|
|
140
|
-
<
|
|
141
|
+
<TableRow
|
|
141
142
|
sideHighlightColor="category_1"
|
|
142
143
|
{...props}
|
|
143
144
|
>
|
|
@@ -146,8 +147,8 @@ const TableSideHighlight = (props) => {
|
|
|
146
147
|
<td>{'Value 3'}</td>
|
|
147
148
|
<td>{'Value 4'}</td>
|
|
148
149
|
<td>{'Value 5'}</td>
|
|
149
|
-
</
|
|
150
|
-
<
|
|
150
|
+
</TableRow>
|
|
151
|
+
<TableRow
|
|
151
152
|
sideHighlightColor="category_2"
|
|
152
153
|
{...props}
|
|
153
154
|
>
|
|
@@ -156,8 +157,8 @@ const TableSideHighlight = (props) => {
|
|
|
156
157
|
<td>{'Value 3'}</td>
|
|
157
158
|
<td>{'Value 4'}</td>
|
|
158
159
|
<td>{'Value 5'}</td>
|
|
159
|
-
</
|
|
160
|
-
<
|
|
160
|
+
</TableRow>
|
|
161
|
+
<TableRow
|
|
161
162
|
sideHighlightColor="category_3"
|
|
162
163
|
{...props}
|
|
163
164
|
>
|
|
@@ -166,8 +167,8 @@ const TableSideHighlight = (props) => {
|
|
|
166
167
|
<td>{'Value 3'}</td>
|
|
167
168
|
<td>{'Value 4'}</td>
|
|
168
169
|
<td>{'Value 5'}</td>
|
|
169
|
-
</
|
|
170
|
-
<
|
|
170
|
+
</TableRow>
|
|
171
|
+
<TableRow
|
|
171
172
|
sideHighlightColor="none"
|
|
172
173
|
{...props}
|
|
173
174
|
>
|
|
@@ -176,7 +177,7 @@ const TableSideHighlight = (props) => {
|
|
|
176
177
|
<td>{'Value 3'}</td>
|
|
177
178
|
<td>{'Value 4'}</td>
|
|
178
179
|
<td>{'Value 5'}</td>
|
|
179
|
-
</
|
|
180
|
+
</TableRow>
|
|
180
181
|
</tbody>
|
|
181
182
|
</Table>
|
|
182
183
|
</div>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
examples:
|
|
2
2
|
rails:
|
|
3
|
+
# - table_div: Div
|
|
3
4
|
- table_sm: Small
|
|
4
5
|
- table_md: Medium
|
|
5
6
|
- table_lg: Large
|
|
@@ -24,11 +25,9 @@ examples:
|
|
|
24
25
|
- table_with_background_kit: Table With Background Kit
|
|
25
26
|
- table_vertical_border: Vertical Borders
|
|
26
27
|
- table_striped: Striped Table
|
|
27
|
-
- table_with_subcomponents_rails: Table with Sub Components (Table Elements)
|
|
28
|
-
- table_with_subcomponents_as_divs: Table with Sub Components (Divs)
|
|
29
|
-
|
|
30
28
|
|
|
31
29
|
react:
|
|
30
|
+
# - table_div: Div
|
|
32
31
|
- table_sm: Small
|
|
33
32
|
- table_md: Medium
|
|
34
33
|
- table_lg: Large
|
|
@@ -52,6 +51,3 @@ examples:
|
|
|
52
51
|
- table_with_background_kit: Table With Background Kit
|
|
53
52
|
- table_vertical_border: Vertical Borders
|
|
54
53
|
- table_striped: Striped Table
|
|
55
|
-
- table_with_subcomponents: Table with Sub Components (Table Elements)
|
|
56
|
-
- table_with_subcomponents_as_divs: Table with Sub Components (Divs)
|
|
57
|
-
|
|
@@ -22,5 +22,3 @@ export { default as TableWithBackgroundKit } from './_table_with_background_kit.
|
|
|
22
22
|
export { default as TableVerticalBorder } from './_table_vertical_border.jsx'
|
|
23
23
|
export { default as TableStriped } from './_table_striped.jsx'
|
|
24
24
|
export { default as TableDiv } from './_table_div.jsx'
|
|
25
|
-
export { default as TableWithSubcomponents } from './_table_with_subcomponents.jsx'
|
|
26
|
-
export { default as TableWithSubcomponentsAsDivs } from './_table_with_subcomponents_as_divs.jsx'
|
|
@@ -58,16 +58,6 @@ const TextInputAddOn = (props) => {
|
|
|
58
58
|
{...props}
|
|
59
59
|
/>
|
|
60
60
|
</div>
|
|
61
|
-
<div>
|
|
62
|
-
<TextInput
|
|
63
|
-
addOn={{ icon: 'frog', alignment: 'right', border: true }}
|
|
64
|
-
label="Right-Aligned Add On With Child Input"
|
|
65
|
-
onChange={handleUpdateFourthInput}
|
|
66
|
-
{...props}
|
|
67
|
-
>
|
|
68
|
-
<input />
|
|
69
|
-
</TextInput>
|
|
70
|
-
</div>
|
|
71
61
|
<div>
|
|
72
62
|
<TextInput
|
|
73
63
|
addOn={{ icon: 'percent', alignment: 'left', border: false }}
|
|
@@ -86,16 +76,6 @@ const TextInputAddOn = (props) => {
|
|
|
86
76
|
{...props}
|
|
87
77
|
/>
|
|
88
78
|
</div>
|
|
89
|
-
<div>
|
|
90
|
-
<TextInput
|
|
91
|
-
addOn={{ icon: 'frog', alignment: 'left', border: true }}
|
|
92
|
-
label="Left-Aligned Add On With Child Input"
|
|
93
|
-
onChange={handleUpdateFourthInput}
|
|
94
|
-
{...props}
|
|
95
|
-
>
|
|
96
|
-
<input />
|
|
97
|
-
</TextInput>
|
|
98
|
-
</div>
|
|
99
79
|
</>
|
|
100
80
|
)
|
|
101
81
|
}
|
|
@@ -7,5 +7,4 @@
|
|
|
7
7
|
| **orientation** | `Orientation` | Changes the orientation of the User | `.horizontal` | `.horizontal` `.verticle` |
|
|
8
8
|
| **size** | `UserAvatarSize` | Changes the size of the User | `.medium` | `.small` `.medium` `.large` |
|
|
9
9
|
| **territory** | `String` | Adds the User's territory | | |
|
|
10
|
-
| **title** | `String` | Adds a title | | |
|
|
11
|
-
| **status** | `PBAvatar.PresenceStatus?` | An idicator for the current status of the user | `.none` | `.online` `.away` `.offline` |
|
|
10
|
+
| **title** | `String` | Adds a title | | |
|