playbook_ui 12.29.0 → 12.30.1
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.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_icon/_icon.tsx +27 -1
- data/app/pb_kits/playbook/pb_icon/icon.html.erb +2 -0
- data/app/pb_kits/playbook/pb_icon/icon.rb +5 -0
- data/app/pb_kits/playbook/pb_icon_circle/_icon_circle.scss +5 -0
- data/app/pb_kits/playbook/pb_icon_circle/_icon_circle.tsx +5 -3
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.html.erb +13 -7
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_emoji.html.erb +16 -0
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_emoji.jsx +31 -0
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_emoji.md +1 -0
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes.html.erb +5 -5
- data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes.jsx +6 -0
- data/app/pb_kits/playbook/pb_icon_circle/docs/example.yml +3 -0
- data/app/pb_kits/playbook/pb_icon_circle/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_icon_circle/icon_circle.html.erb +1 -1
- data/app/pb_kits/playbook/pb_icon_circle/icon_circle.rb +2 -0
- data/app/pb_kits/playbook/pb_icon_circle/icon_circle.test.js +97 -0
- data/app/pb_kits/playbook/pb_multi_level_select/_helper_functions.tsx +56 -27
- data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.scss +1 -2
- data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +12 -29
- data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_return_all_selected.md +3 -1
- data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.rb +4 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_data_table.html.erb +0 -14
- data/app/pb_kits/playbook/pb_table/docs/_table_data_table.md +1 -0
- data/app/pb_kits/playbook/pb_table/styles/_structure.scss +12 -0
- data/app/pb_kits/playbook/utilities/globalProps.ts +9 -4
- data/app/pb_kits/playbook/utilities/test/globalProps/flexGrow.test.js +1 -1
- data/app/pb_kits/playbook/utilities/test/globalProps/flexShrink.test.js +1 -1
- data/dist/playbook-rails.js +6 -6
- data/lib/playbook/version.rb +2 -2
- metadata +7 -2
|
@@ -9,6 +9,9 @@ module Playbook
|
|
|
9
9
|
default: []
|
|
10
10
|
prop :return_all_selected, type: Playbook::Props::Boolean,
|
|
11
11
|
default: false
|
|
12
|
+
prop :input_display, type: Playbook::Props::Enum,
|
|
13
|
+
values: %w[pills none],
|
|
14
|
+
default: "pills"
|
|
12
15
|
|
|
13
16
|
def classname
|
|
14
17
|
generate_classname("pb_multi_level_select")
|
|
@@ -17,6 +20,7 @@ module Playbook
|
|
|
17
20
|
def multi_level_select_options
|
|
18
21
|
{
|
|
19
22
|
id: id,
|
|
23
|
+
inputDisplay: input_display,
|
|
20
24
|
name: name,
|
|
21
25
|
treeData: tree_data,
|
|
22
26
|
returnAllSelected: return_all_selected,
|
|
@@ -30,19 +30,5 @@
|
|
|
30
30
|
<td>Value 4</td>
|
|
31
31
|
<td>Value 5</td>
|
|
32
32
|
</tr>
|
|
33
|
-
<tr>
|
|
34
|
-
<td>Value 1</td>
|
|
35
|
-
<td>Value 2</td>
|
|
36
|
-
<td>Value 3</td>
|
|
37
|
-
<td>Value 4</td>
|
|
38
|
-
<td>Value 5</td>
|
|
39
|
-
</tr>
|
|
40
|
-
<tr>
|
|
41
|
-
<td>Value 1</td>
|
|
42
|
-
<td>Value 2</td>
|
|
43
|
-
<td>Value 3</td>
|
|
44
|
-
<td>Value 4</td>
|
|
45
|
-
<td>Value 5</td>
|
|
46
|
-
</tr>
|
|
47
33
|
</tbody>
|
|
48
34
|
<% end %>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Tighter spacing in first- and last-child cells of each row for data-heavy tables.
|
|
@@ -39,10 +39,22 @@
|
|
|
39
39
|
thead tr th {
|
|
40
40
|
padding-top: $cell-pad-sm;
|
|
41
41
|
padding-bottom: $cell-pad-sm;
|
|
42
|
+
&:first-child {
|
|
43
|
+
padding-left: $cell-pad-sm;
|
|
44
|
+
}
|
|
45
|
+
&:last-child {
|
|
46
|
+
padding-right: $cell-pad-sm;
|
|
47
|
+
}
|
|
42
48
|
}
|
|
43
49
|
tbody tr td {
|
|
44
50
|
padding-top: $cell-pad-sm;
|
|
45
51
|
padding-bottom: $cell-pad-sm;
|
|
52
|
+
&:first-child {
|
|
53
|
+
padding-left: $cell-pad-sm;
|
|
54
|
+
}
|
|
55
|
+
&:last-child {
|
|
56
|
+
padding-right: $cell-pad-sm;
|
|
57
|
+
}
|
|
46
58
|
}
|
|
47
59
|
}
|
|
48
60
|
}
|
|
@@ -2,6 +2,7 @@ import { omit } from 'lodash'
|
|
|
2
2
|
import { camelToSnakeCase } from './text'
|
|
3
3
|
|
|
4
4
|
import {
|
|
5
|
+
BitValues,
|
|
5
6
|
Binary,
|
|
6
7
|
Display,
|
|
7
8
|
DisplaySizes,
|
|
@@ -48,7 +49,7 @@ type FlexDirection = {
|
|
|
48
49
|
}
|
|
49
50
|
|
|
50
51
|
type FlexGrow = {
|
|
51
|
-
flexGrow?:
|
|
52
|
+
flexGrow?: Binary
|
|
52
53
|
}
|
|
53
54
|
|
|
54
55
|
type FlexShrink = {
|
|
@@ -316,15 +317,19 @@ const PROP_CATEGORIES: {[key:string]: (props: {[key: string]: any}) => string} =
|
|
|
316
317
|
flexGrowProps: ({ flexGrow }: FlexGrow) => {
|
|
317
318
|
if (typeof flexGrow == 'object') {
|
|
318
319
|
return getResponsivePropClasses(flexGrow, 'flex_grow')
|
|
320
|
+
} else if (BitValues.includes(flexGrow)) {
|
|
321
|
+
return `flex_grow_${flexGrow}`
|
|
319
322
|
} else {
|
|
320
|
-
return
|
|
323
|
+
return ''
|
|
321
324
|
}
|
|
322
325
|
},
|
|
323
326
|
flexShrinkProps: ({ flexShrink }: FlexShrink) => {
|
|
324
327
|
if (typeof flexShrink == 'object') {
|
|
325
328
|
return getResponsivePropClasses(flexShrink, 'flex_shrink')
|
|
329
|
+
} else if (BitValues.includes(flexShrink)) {
|
|
330
|
+
return `flex_shrink_${flexShrink}`
|
|
326
331
|
} else {
|
|
327
|
-
return
|
|
332
|
+
return ''
|
|
328
333
|
}
|
|
329
334
|
},
|
|
330
335
|
justifyContentProps: ({ justifyContent }: JustifyContent) => {
|
|
@@ -392,4 +397,4 @@ export const domSafeProps = (props: {[key: string]: string}): {[key: string]: st
|
|
|
392
397
|
'dark',
|
|
393
398
|
]
|
|
394
399
|
return omit(props, notSafeProps)
|
|
395
|
-
}
|
|
400
|
+
}
|