playbook_ui 14.9.0.pre.alpha.play1742globalheightfixes4766 → 14.9.0.pre.rc.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/_playbook.scss +0 -2
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +17 -61
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta.html.erb +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_sort.html.erb +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -3
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_advanced_table/table_row.html.erb +1 -3
- data/app/pb_kits/playbook/pb_advanced_table/table_row.rb +0 -15
- data/app/pb_kits/playbook/pb_background/_background.tsx +2 -8
- data/app/pb_kits/playbook/pb_button/_button.scss +0 -6
- data/app/pb_kits/playbook/pb_button/_button.tsx +3 -1
- data/app/pb_kits/playbook/pb_button/_button_mixins.scss +0 -15
- data/app/pb_kits/playbook/pb_button/button.rb +1 -1
- data/app/pb_kits/playbook/pb_button/docs/_button_default.html.erb +0 -1
- data/app/pb_kits/playbook/pb_button/docs/_button_default.jsx +0 -8
- data/app/pb_kits/playbook/pb_button/docs/_button_default.md +1 -1
- data/app/pb_kits/playbook/pb_checkbox/checkbox.html.erb +2 -2
- data/app/pb_kits/playbook/pb_checkbox/checkbox.rb +4 -0
- data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.html.erb +7 -84
- data/app/pb_kits/playbook/pb_collapsible/_collapsible.tsx +1 -3
- data/app/pb_kits/playbook/pb_currency/_currency.tsx +3 -7
- data/app/pb_kits/playbook/pb_currency/currency.html.erb +2 -2
- data/app/pb_kits/playbook/pb_currency/currency.rb +1 -17
- data/app/pb_kits/playbook/pb_currency/currency.test.js +3 -40
- data/app/pb_kits/playbook/pb_currency/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_currency/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_drawer/_drawer.scss +0 -1
- data/app/pb_kits/playbook/pb_drawer/_drawer.tsx +45 -159
- data/app/pb_kits/playbook/pb_drawer/docs/example.yml +1 -1
- data/app/pb_kits/playbook/pb_drawer/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_dropdown/_dropdown.scss +0 -1
- data/app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb +1 -0
- data/app/pb_kits/playbook/pb_dropdown/dropdown_container.rb +4 -0
- data/app/pb_kits/playbook/pb_dropdown/utilities/subComponentHelper.tsx +2 -13
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +2 -2
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.html.erb +1 -1
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +12 -63
- data/app/pb_kits/playbook/pb_image/_image.tsx +1 -3
- data/app/pb_kits/playbook/pb_layout/_layout.tsx +14 -36
- data/app/pb_kits/playbook/pb_overlay/_overlay.tsx +1 -3
- data/app/pb_kits/playbook/pb_pagination/_pagination.tsx +2 -2
- data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.tsx +3 -5
- data/app/pb_kits/playbook/pb_progress_simple/progress_simple.html.erb +2 -3
- data/app/pb_kits/playbook/pb_progress_simple/progress_simple.rb +0 -5
- data/app/pb_kits/playbook/pb_section_separator/_section_separator.tsx +1 -3
- data/app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_default.html.erb +1 -2
- data/app/pb_kits/playbook/pb_table/_table.tsx +25 -109
- data/app/pb_kits/playbook/pb_table/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_table/styles/_all.scss +0 -2
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb +0 -47
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx +0 -59
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss +0 -3
- data/app/pb_kits/playbook/pb_typeahead/index.ts +3 -29
- data/app/pb_kits/playbook/pb_typeahead/typeahead.html.erb +2 -5
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +0 -4
- data/app/pb_kits/playbook/utilities/_max_width.scss +9 -29
- data/app/pb_kits/playbook/utilities/_min_width.scss +2 -6
- data/app/pb_kits/playbook/utilities/globalPropNames.mjs +1 -1
- data/app/pb_kits/playbook/utilities/globalProps.ts +4 -37
- data/dist/chunks/_typeahead-D0PihN_3.js +22 -0
- data/dist/chunks/_weekday_stacked-uMIX8f-A.js +45 -0
- data/dist/chunks/{lib-SyD3buPZ.js → lib-BC6ESsxG.js} +1 -1
- data/dist/chunks/{pb_form_validation-Dt8UJgrJ.js → pb_form_validation-B_Z9rEbg.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +0 -321
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/classnames.rb +0 -4
- data/lib/playbook/forms/builder/typeahead_field.rb +0 -13
- data/lib/playbook/kit_base.rb +1 -16
- data/lib/playbook/spacing.rb +0 -21
- data/lib/playbook/version.rb +2 -2
- metadata +6 -28
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.html.erb +0 -53
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.md +0 -5
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination.jsx +0 -50
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination.md +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination_with_props.jsx +0 -57
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination_with_props.md +0 -5
- data/app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_pagination_mock_data.json +0 -5600
- data/app/pb_kits/playbook/pb_currency/docs/_currency_negative.html.erb +0 -4
- data/app/pb_kits/playbook/pb_currency/docs/_currency_negative.jsx +0 -16
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_menu.jsx +0 -31
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_menu.md +0 -6
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.jsx +0 -87
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_react.md +0 -2
- data/app/pb_kits/playbook/pb_table/styles/_scroll.scss +0 -4
- data/app/pb_kits/playbook/pb_table/styles/_sticky_columns.scss +0 -18
- data/app/pb_kits/playbook/tokens/_height.scss +0 -19
- data/app/pb_kits/playbook/tokens/exports/_height.module.scss +0 -37
- data/app/pb_kits/playbook/utilities/_height.scss +0 -33
- data/app/pb_kits/playbook/utilities/_width.scss +0 -45
- data/dist/chunks/_typeahead-B8fkIeXA.js +0 -22
- data/dist/chunks/_weekday_stacked-DjRTXEi-.js +0 -45
- data/lib/playbook/height.rb +0 -29
- data/lib/playbook/max_height.rb +0 -29
- data/lib/playbook/min_height.rb +0 -29
@@ -1,31 +0,0 @@
|
|
1
|
-
import React from "react";
|
2
|
-
import { Button, Drawer, Icon, Title } from "playbook-ui";
|
3
|
-
|
4
|
-
const DrawerMenu = () => {
|
5
|
-
|
6
|
-
return (
|
7
|
-
<>
|
8
|
-
<Button id="menuButton"
|
9
|
-
padding="sm"
|
10
|
-
>
|
11
|
-
<Icon icon="bars"
|
12
|
-
size="3x"
|
13
|
-
/>
|
14
|
-
</Button>
|
15
|
-
<Drawer
|
16
|
-
behavior="push"
|
17
|
-
closeBreakpoint="md"
|
18
|
-
menuButtonID="menuButton"
|
19
|
-
overlay={false}
|
20
|
-
placement="left"
|
21
|
-
size="lg"
|
22
|
-
withinElement
|
23
|
-
>
|
24
|
-
<Title paddingBottom="md">A really neat menu</Title>
|
25
|
-
<Button text="This Button does nothing" />
|
26
|
-
</Drawer>
|
27
|
-
</>
|
28
|
-
);
|
29
|
-
};
|
30
|
-
|
31
|
-
export default DrawerMenu;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
Our drawer kit can fulfill your responsive menu needs! Using the `closeBreakpoint` prop you can have the menu close on smaller screens like phones/tablets.
|
2
|
-
|
3
|
-
Set a menu button with the `menuButtonID` props. When the Drawer is open, the menu button will be hidden. But when your Brakpoint closes the drawer, you can toggle the Drawer open/close with your menu butotn.
|
4
|
-
|
5
|
-
Also use the `withinElement` props to have the Drawer open within a specific element, instead of the default behavior of it taking up the entire screen size.
|
6
|
-
|
@@ -1,87 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import Table from '../_table'
|
3
|
-
|
4
|
-
const TableStickyLeftColumns = () => {
|
5
|
-
return (
|
6
|
-
<Table
|
7
|
-
responsive="scroll"
|
8
|
-
size="md"
|
9
|
-
stickyLeftcolumn={["1", "2", "3"]}
|
10
|
-
>
|
11
|
-
<thead>
|
12
|
-
<tr>
|
13
|
-
<th id="1">{'Column 1'}</th>
|
14
|
-
<th id="2">{'Column 2'}</th>
|
15
|
-
<th id="3">{'Column 3'}</th>
|
16
|
-
<th>{'Column 4'}</th>
|
17
|
-
<th>{'Column 5'}</th>
|
18
|
-
<th>{'Column 6'}</th>
|
19
|
-
<th>{'Column 7'}</th>
|
20
|
-
<th>{'Column 8'}</th>
|
21
|
-
<th>{'Column 9'}</th>
|
22
|
-
<th>{'Column 10'}</th>
|
23
|
-
<th>{'Column 11'}</th>
|
24
|
-
<th>{'Column 12'}</th>
|
25
|
-
<th>{'Column 13'}</th>
|
26
|
-
<th>{'Column 14'}</th>
|
27
|
-
<th>{'Column 15'}</th>
|
28
|
-
</tr>
|
29
|
-
</thead>
|
30
|
-
<tbody>
|
31
|
-
<tr>
|
32
|
-
<td id="1">{'Value 1'}</td>
|
33
|
-
<td id="2">{'Value 2'}</td>
|
34
|
-
<td id="3">{'Value 3'}</td>
|
35
|
-
<td>{'Value 4'}</td>
|
36
|
-
<td>{'Value 5'}</td>
|
37
|
-
<td>{'Value 6'}</td>
|
38
|
-
<td>{'Value 7'}</td>
|
39
|
-
<td>{'Value 8'}</td>
|
40
|
-
<td>{'Value 9'}</td>
|
41
|
-
<td>{'Value 10'}</td>
|
42
|
-
<td>{'Value 11'}</td>
|
43
|
-
<td>{'Value 12'}</td>
|
44
|
-
<td>{'Value 13'}</td>
|
45
|
-
<td>{'Value 14'}</td>
|
46
|
-
<td>{'Value 15'}</td>
|
47
|
-
</tr>
|
48
|
-
<tr>
|
49
|
-
<td id="1">{'Value 1'}</td>
|
50
|
-
<td id="2">{'Value 2'}</td>
|
51
|
-
<td id="3">{'Value 3'}</td>
|
52
|
-
<td>{'Value 4'}</td>
|
53
|
-
<td>{'Value 5'}</td>
|
54
|
-
<td>{'Value 6'}</td>
|
55
|
-
<td>{'Value 7'}</td>
|
56
|
-
<td>{'Value 8'}</td>
|
57
|
-
<td>{'Value 9'}</td>
|
58
|
-
<td>{'Value 10'}</td>
|
59
|
-
<td>{'Value 11'}</td>
|
60
|
-
<td>{'Value 12'}</td>
|
61
|
-
<td>{'Value 13'}</td>
|
62
|
-
<td>{'Value 14'}</td>
|
63
|
-
<td>{'Value 15'}</td>
|
64
|
-
</tr>
|
65
|
-
<tr>
|
66
|
-
<td id="1">{'Value 1'}</td>
|
67
|
-
<td id="2">{'Value 2'}</td>
|
68
|
-
<td id="3">{'Value 3'}</td>
|
69
|
-
<td>{'Value 4'}</td>
|
70
|
-
<td>{'Value 5'}</td>
|
71
|
-
<td>{'Value 6'}</td>
|
72
|
-
<td>{'Value 7'}</td>
|
73
|
-
<td>{'Value 8'}</td>
|
74
|
-
<td>{'Value 9'}</td>
|
75
|
-
<td>{'Value 10'}</td>
|
76
|
-
<td>{'Value 11'}</td>
|
77
|
-
<td>{'Value 12'}</td>
|
78
|
-
<td>{'Value 13'}</td>
|
79
|
-
<td>{'Value 14'}</td>
|
80
|
-
<td>{'Value 15'}</td>
|
81
|
-
</tr>
|
82
|
-
</tbody>
|
83
|
-
</Table>
|
84
|
-
)
|
85
|
-
}
|
86
|
-
|
87
|
-
export default TableStickyLeftColumns
|
@@ -1,18 +0,0 @@
|
|
1
|
-
@import "../../tokens/colors";
|
2
|
-
|
3
|
-
[class^="pb_table"] {
|
4
|
-
.sticky {
|
5
|
-
position: sticky !important;
|
6
|
-
left: 0;
|
7
|
-
z-index: 1;
|
8
|
-
background-color: white;
|
9
|
-
}
|
10
|
-
|
11
|
-
.with-border {
|
12
|
-
border-right: 1px solid $border_light !important;
|
13
|
-
}
|
14
|
-
|
15
|
-
.sticky-shadow {
|
16
|
-
box-shadow: 4px 0 10px rgba(60, 106, 172, 0.16) !important;
|
17
|
-
}
|
18
|
-
}
|
@@ -1,19 +0,0 @@
|
|
1
|
-
|
2
|
-
$height_auto: auto !default;
|
3
|
-
$height_xs: 320px !default;
|
4
|
-
$height_sm: 480px !default;
|
5
|
-
$height_md: 768px !default;
|
6
|
-
$height_lg: 1024px !default;
|
7
|
-
$height_xl: 1280px !default;
|
8
|
-
$height_2xl: 1440px !default;
|
9
|
-
$height_3xl: 1920px !default;
|
10
|
-
$heights: (
|
11
|
-
height_auto: $height_auto,
|
12
|
-
height_xs: $height_xs,
|
13
|
-
height_sm: $height_sm,
|
14
|
-
height_md: $height_md,
|
15
|
-
height_lg: $height_lg,
|
16
|
-
height_xl: $height_xl,
|
17
|
-
height_xxl: $height_2xl,
|
18
|
-
height_xxxl: $height_3xl
|
19
|
-
);
|
@@ -1,37 +0,0 @@
|
|
1
|
-
@import "../height";
|
2
|
-
|
3
|
-
:export {
|
4
|
-
@mixin export_height($height_list) {
|
5
|
-
@each $name, $value in $height_list {
|
6
|
-
.#{$name} {
|
7
|
-
height: $value;
|
8
|
-
}
|
9
|
-
}
|
10
|
-
}
|
11
|
-
|
12
|
-
@include export_height($heights);
|
13
|
-
}
|
14
|
-
|
15
|
-
:export {
|
16
|
-
@mixin export_max_height($height_list) {
|
17
|
-
@each $name, $value in $height_list {
|
18
|
-
.max_#{$name} {
|
19
|
-
max-height: $value;
|
20
|
-
}
|
21
|
-
}
|
22
|
-
}
|
23
|
-
|
24
|
-
@include export_max_height($heights);
|
25
|
-
}
|
26
|
-
|
27
|
-
:export {
|
28
|
-
@mixin export_min_height($height_list) {
|
29
|
-
@each $name, $value in $height_list {
|
30
|
-
.min_#{$name} {
|
31
|
-
min-height: $value;
|
32
|
-
}
|
33
|
-
}
|
34
|
-
}
|
35
|
-
|
36
|
-
@include export_min_height($heights);
|
37
|
-
}
|
@@ -1,33 +0,0 @@
|
|
1
|
-
@import "../tokens/exports/height.module";
|
2
|
-
|
3
|
-
@mixin export_height($height_list) {
|
4
|
-
@each $name, $value in $height_list {
|
5
|
-
.#{$name} {
|
6
|
-
height: $value;
|
7
|
-
}
|
8
|
-
}
|
9
|
-
}
|
10
|
-
|
11
|
-
@mixin export_max_height($height_list) {
|
12
|
-
@each $name, $value in $height_list {
|
13
|
-
.max_#{$name} {
|
14
|
-
max-height: $value;
|
15
|
-
}
|
16
|
-
}
|
17
|
-
}
|
18
|
-
|
19
|
-
@mixin export_min_height($height_list) {
|
20
|
-
@each $name, $value in $height_list {
|
21
|
-
.min_#{$name} {
|
22
|
-
min-height: $value;
|
23
|
-
}
|
24
|
-
}
|
25
|
-
}
|
26
|
-
|
27
|
-
@include export_height($heights);
|
28
|
-
@include export_max_height($heights);
|
29
|
-
@include export_min_height($heights);
|
30
|
-
|
31
|
-
.height-resize {
|
32
|
-
resize: vertical;
|
33
|
-
}
|
@@ -1,45 +0,0 @@
|
|
1
|
-
@import "../tokens/container";
|
2
|
-
|
3
|
-
.width_none {
|
4
|
-
width: none;
|
5
|
-
}
|
6
|
-
|
7
|
-
.width_0 {
|
8
|
-
width: map-get($containers, 'none');
|
9
|
-
}
|
10
|
-
|
11
|
-
.width_0_percent {
|
12
|
-
width: map-get($containers, 'none');
|
13
|
-
}
|
14
|
-
|
15
|
-
.width_xxs {
|
16
|
-
width: $container_xxs;
|
17
|
-
}
|
18
|
-
|
19
|
-
.width_xs {
|
20
|
-
width: $container_xs;
|
21
|
-
}
|
22
|
-
|
23
|
-
.width_sm {
|
24
|
-
width: $container_sm;
|
25
|
-
}
|
26
|
-
|
27
|
-
.width_md {
|
28
|
-
width: $container_md;
|
29
|
-
}
|
30
|
-
|
31
|
-
.width_lg {
|
32
|
-
width: $container_lg;
|
33
|
-
}
|
34
|
-
|
35
|
-
.width_xl {
|
36
|
-
width: $container_xl;
|
37
|
-
}
|
38
|
-
|
39
|
-
.width_xxl {
|
40
|
-
width: $container_xxl;
|
41
|
-
}
|
42
|
-
|
43
|
-
.width_100_percent {
|
44
|
-
width: $container_100;
|
45
|
-
}
|