playbook_ui 14.4.0.pre.alpha.javascriptassets3924 → 14.4.0.pre.alpha.pbntr523enablekitsforradiofix3825
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/Components/SortIconButton.tsx +4 -23
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx +1 -1
- data/app/pb_kits/playbook/pb_button/_button.tsx +2 -6
- data/app/pb_kits/playbook/pb_contact/_contact.tsx +5 -17
- data/app/pb_kits/playbook/pb_contact/contact.html.erb +6 -14
- data/app/pb_kits/playbook/pb_contact/contact.rb +0 -4
- data/app/pb_kits/playbook/pb_contact/contact.test.js +1 -1
- data/app/pb_kits/playbook/pb_dashboard/pbChartsDarkTheme.ts +6 -2
- data/app/pb_kits/playbook/pb_dashboard/pbChartsLightTheme.ts +7 -2
- data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +3 -4
- data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +1 -1
- data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +0 -4
- data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +3 -6
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_inline.html.erb +1 -1
- data/app/pb_kits/playbook/pb_date_picker/sass_partials/_header_styles.scss +2 -6
- data/app/pb_kits/playbook/pb_dialog/_dialog.scss +0 -2
- data/app/pb_kits/playbook/pb_dialog/dialog_header.html.erb +1 -1
- data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +2 -10
- data/app/pb_kits/playbook/pb_filter/docs/_filter_max_height.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_max_width.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_no_background.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_no_sort.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_only.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_placement.html.erb +1 -5
- data/app/pb_kits/playbook/pb_filter/docs/_filter_single.html.erb +1 -5
- data/app/pb_kits/playbook/pb_map/_map_controls.tsx +1 -7
- data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +4 -15
- data/app/pb_kits/playbook/pb_pagination/docs/_pagination_page_change.jsx +1 -12
- data/app/pb_kits/playbook/pb_pagination/docs/_pagination_page_change_react.md +1 -3
- data/app/pb_kits/playbook/pb_passphrase/_passphrase.tsx +2 -10
- data/app/pb_kits/playbook/pb_popover/docs/_popover_list.html.erb +13 -14
- data/app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx +4 -4
- data/app/pb_kits/playbook/pb_radio/_radio.tsx +1 -1
- data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.html.erb +0 -2
- data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.jsx +2 -5
- data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx +5 -12
- data/app/pb_kits/playbook/pb_select/_select.tsx +2 -5
- data/app/pb_kits/playbook/pb_select/select.html.erb +1 -1
- data/app/pb_kits/playbook/pb_select/select.rb +0 -4
- data/app/pb_kits/playbook/pb_text_input/_text_input.scss +1 -0
- data/app/pb_kits/playbook/pb_tooltip/_tooltip.tsx +13 -17
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss +1 -0
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.test.jsx +0 -14
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.tsx +0 -3
- data/app/pb_kits/playbook/pb_typeahead/components/Control.tsx +5 -6
- data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_typeahead/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_typeahead/typeahead.html.erb +1 -2
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +1 -6
- data/app/pb_kits/playbook/utilities/icons/allicons.tsx +13 -136
- data/dist/chunks/_typeahead-Dl3m9Vf4.js +22 -0
- data/dist/chunks/_weekday_stacked-uTVCUBob.js +45 -0
- data/dist/chunks/lib-D2U4I1U6.js +16 -0
- data/dist/chunks/{pb_form_validation-D9zkwt2b.js → pb_form_validation-zV9OpdSt.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +1 -3
- 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/pagination_renderer.rb +2 -10
- data/lib/playbook/version.rb +1 -1
- metadata +6 -25
- data/app/pb_kits/playbook/pb_drawer/_close_icon.tsx +0 -25
- data/app/pb_kits/playbook/pb_drawer/_drawer.scss +0 -465
- data/app/pb_kits/playbook/pb_drawer/_drawer.tsx +0 -195
- data/app/pb_kits/playbook/pb_drawer/_drawer_context.tsx +0 -3
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_borders.jsx +0 -117
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_breakpoints.jsx +0 -43
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_default.html.erb +0 -1
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_default.jsx +0 -63
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_overlay.jsx +0 -55
- data/app/pb_kits/playbook/pb_drawer/docs/_drawer_sizes.jsx +0 -113
- data/app/pb_kits/playbook/pb_drawer/docs/example.yml +0 -12
- data/app/pb_kits/playbook/pb_drawer/docs/index.js +0 -5
- data/app/pb_kits/playbook/pb_drawer/drawer.html.erb +0 -12
- data/app/pb_kits/playbook/pb_drawer/drawer.rb +0 -8
- data/app/pb_kits/playbook/pb_drawer/drawer.test.jsx +0 -77
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.html.erb +0 -88
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.jsx +0 -60
- data/app/pb_kits/playbook/utilities/icons/angle-down.svg +0 -3
- data/app/pb_kits/playbook/utilities/icons/envelope.svg +0 -3
- data/dist/chunks/_typeahead-BYw0HEgO.js +0 -22
- data/dist/chunks/_weekday_stacked-DumiyWjh.js +0 -45
- data/dist/chunks/lib-CEpcaI8y.js +0 -29
@@ -1,77 +0,0 @@
|
|
1
|
-
import React, { useState } from 'react';
|
2
|
-
import { render, cleanup, fireEvent, screen } from '../utilities/test-utils';
|
3
|
-
import { Drawer, Button } from 'playbook-ui';
|
4
|
-
|
5
|
-
const size = 'sm';
|
6
|
-
|
7
|
-
function DrawerTest({ props }) {
|
8
|
-
const [isOpen, setIsOpen] = useState(false);
|
9
|
-
const close = () => setIsOpen(false);
|
10
|
-
const open = () => setIsOpen(true);
|
11
|
-
|
12
|
-
return (
|
13
|
-
<>
|
14
|
-
<Button onClick={open}>{'Open Drawer'}</Button>
|
15
|
-
<Drawer
|
16
|
-
className="wrapper"
|
17
|
-
onClose={close}
|
18
|
-
opened={isOpen}
|
19
|
-
placement="left"
|
20
|
-
portalClassName="portal"
|
21
|
-
size={size}
|
22
|
-
{...props}
|
23
|
-
>
|
24
|
-
{props && props.children}
|
25
|
-
</Drawer>
|
26
|
-
</>
|
27
|
-
);
|
28
|
-
}
|
29
|
-
|
30
|
-
afterEach(cleanup);
|
31
|
-
|
32
|
-
test('renders with the right border class when border prop is right', async () => {
|
33
|
-
render(<DrawerTest props={{ border: 'right' }} />);
|
34
|
-
|
35
|
-
fireEvent.click(screen.getByText('Open Drawer'));
|
36
|
-
|
37
|
-
const drawer = await screen.findByRole('dialog');
|
38
|
-
expect(drawer).toHaveClass('drawer_border_right');
|
39
|
-
});
|
40
|
-
|
41
|
-
test('renders with the left border class when border prop is left', async () => {
|
42
|
-
render(<DrawerTest props={{ border: 'left' }} />);
|
43
|
-
|
44
|
-
fireEvent.click(screen.getByText('Open Drawer'));
|
45
|
-
|
46
|
-
const drawer = await screen.findByRole('dialog');
|
47
|
-
expect(drawer).toHaveClass('drawer_border_left');
|
48
|
-
});
|
49
|
-
|
50
|
-
test('renders with the full border class when border prop is full', async () => {
|
51
|
-
render(<DrawerTest props={{ border: 'full' }} />);
|
52
|
-
|
53
|
-
fireEvent.click(screen.getByText('Open Drawer'));
|
54
|
-
|
55
|
-
const drawer = await screen.findByRole('dialog');
|
56
|
-
expect(drawer).toHaveClass('drawer_border_full');
|
57
|
-
});
|
58
|
-
|
59
|
-
test('does not have a border class when border prop is none', async () => {
|
60
|
-
render(<DrawerTest props={{ border: 'none' }} />);
|
61
|
-
|
62
|
-
fireEvent.click(screen.getByText('Open Drawer'));
|
63
|
-
|
64
|
-
const drawer = await screen.findByRole('dialog');
|
65
|
-
expect(drawer).not.toHaveClass('drawer_border_right');
|
66
|
-
expect(drawer).not.toHaveClass('drawer_border_left');
|
67
|
-
expect(drawer).not.toHaveClass('drawer_border_full');
|
68
|
-
});
|
69
|
-
|
70
|
-
test('renders the correct size class for a large drawer', async () => {
|
71
|
-
render(<DrawerTest props={{ size: 'lg' }} />);
|
72
|
-
|
73
|
-
fireEvent.click(screen.getByText('Open Drawer'));
|
74
|
-
|
75
|
-
const drawer = await screen.findByRole('dialog');
|
76
|
-
expect(drawer).toHaveClass('pb_drawer pb_drawer_lg_left');
|
77
|
-
});
|
@@ -1,88 +0,0 @@
|
|
1
|
-
<%
|
2
|
-
options = [
|
3
|
-
{ label: 'Orange', value: '#FFA500' },
|
4
|
-
{ label: 'Red', value: '#FF0000' },
|
5
|
-
{ label: 'Green', value: '#00FF00' },
|
6
|
-
{ label: 'Blue', value: '#0000FF' },
|
7
|
-
]
|
8
|
-
%>
|
9
|
-
|
10
|
-
<%= pb_rails("typeahead", props: {
|
11
|
-
id: "typeahead-default",
|
12
|
-
placeholder: "All Colors",
|
13
|
-
options: options,
|
14
|
-
label: "None",
|
15
|
-
name: :foo,
|
16
|
-
is_multi: false,
|
17
|
-
margin_bottom: "none",
|
18
|
-
})
|
19
|
-
%>
|
20
|
-
<%= pb_rails("typeahead", props: {
|
21
|
-
id: "typeahead-default",
|
22
|
-
placeholder: "All Colors",
|
23
|
-
options: options,
|
24
|
-
label: "XXS",
|
25
|
-
name: :foo,
|
26
|
-
is_multi: false,
|
27
|
-
margin_bottom: "xxs",
|
28
|
-
})
|
29
|
-
%>
|
30
|
-
<%= pb_rails("typeahead", props: {
|
31
|
-
id: "typeahead-default",
|
32
|
-
placeholder: "All Colors",
|
33
|
-
options: options,
|
34
|
-
label: "XS",
|
35
|
-
name: :foo,
|
36
|
-
is_multi: false,
|
37
|
-
margin_bottom: "xs",
|
38
|
-
})
|
39
|
-
%>
|
40
|
-
<%= pb_rails("typeahead", props: {
|
41
|
-
id: "typeahead-default",
|
42
|
-
placeholder: "All Colors",
|
43
|
-
options: options,
|
44
|
-
label: "Default - SM",
|
45
|
-
name: :foo,
|
46
|
-
is_multi: false,
|
47
|
-
})
|
48
|
-
%>
|
49
|
-
<%= pb_rails("typeahead", props: {
|
50
|
-
id: "typeahead-default",
|
51
|
-
placeholder: "All Colors",
|
52
|
-
options: options,
|
53
|
-
label: "MD",
|
54
|
-
name: :foo,
|
55
|
-
is_multi: false,
|
56
|
-
margin_bottom: "md",
|
57
|
-
})
|
58
|
-
%>
|
59
|
-
<%= pb_rails("typeahead", props: {
|
60
|
-
id: "typeahead-default",
|
61
|
-
placeholder: "All Colors",
|
62
|
-
options: options,
|
63
|
-
label: "LG",
|
64
|
-
name: :foo,
|
65
|
-
is_multi: false,
|
66
|
-
margin_bottom: "lg",
|
67
|
-
})
|
68
|
-
%>
|
69
|
-
<%= pb_rails("typeahead", props: {
|
70
|
-
id: "typeahead-default",
|
71
|
-
placeholder: "All Colors",
|
72
|
-
options: options,
|
73
|
-
label: "XL",
|
74
|
-
name: :foo,
|
75
|
-
is_multi: false,
|
76
|
-
margin_bottom: "xl",
|
77
|
-
})
|
78
|
-
%>
|
79
|
-
|
80
|
-
<%= javascript_tag defer: "defer" do %>
|
81
|
-
document.addEventListener("pb-typeahead-kit-typeahead-default-result-option-select", function(event) {
|
82
|
-
console.log('Single Option selected')
|
83
|
-
console.dir(event.detail)
|
84
|
-
})
|
85
|
-
document.addEventListener("pb-typeahead-kit-typeahead-default-result-clear", function() {
|
86
|
-
console.log('All options cleared')
|
87
|
-
})
|
88
|
-
<% end %>
|
@@ -1,60 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import Typeahead from '../_typeahead'
|
4
|
-
|
5
|
-
const options = [
|
6
|
-
{ label: 'Orange', value: '#FFA500' },
|
7
|
-
{ label: 'Red', value: '#FF0000' },
|
8
|
-
{ label: 'Green', value: '#00FF00' },
|
9
|
-
{ label: 'Blue', value: '#0000FF' },
|
10
|
-
]
|
11
|
-
|
12
|
-
const TypeaheadMarginBottom = (props) => {
|
13
|
-
return (
|
14
|
-
<>
|
15
|
-
<Typeahead
|
16
|
-
label="None"
|
17
|
-
marginBottom="none"
|
18
|
-
options={options}
|
19
|
-
{...props}
|
20
|
-
/>
|
21
|
-
<Typeahead
|
22
|
-
label="XXS"
|
23
|
-
marginBottom="xxs"
|
24
|
-
options={options}
|
25
|
-
{...props}
|
26
|
-
/>
|
27
|
-
<Typeahead
|
28
|
-
label="XS"
|
29
|
-
marginBottom="xs"
|
30
|
-
options={options}
|
31
|
-
{...props}
|
32
|
-
/>
|
33
|
-
<Typeahead
|
34
|
-
label="Default - SM"
|
35
|
-
options={options}
|
36
|
-
{...props}
|
37
|
-
/>
|
38
|
-
<Typeahead
|
39
|
-
label="MD"
|
40
|
-
marginBottom="md"
|
41
|
-
options={options}
|
42
|
-
{...props}
|
43
|
-
/>
|
44
|
-
<Typeahead
|
45
|
-
label="LG"
|
46
|
-
marginBottom="lg"
|
47
|
-
options={options}
|
48
|
-
{...props}
|
49
|
-
/>
|
50
|
-
<Typeahead
|
51
|
-
label="XL"
|
52
|
-
marginBottom="xl"
|
53
|
-
options={options}
|
54
|
-
{...props}
|
55
|
-
/>
|
56
|
-
</>
|
57
|
-
)
|
58
|
-
}
|
59
|
-
|
60
|
-
export default TypeaheadMarginBottom
|
@@ -1,3 +0,0 @@
|
|
1
|
-
<svg width="30" height="24" viewBox="0 0 30 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
2
|
-
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.54314 7.6905C6.9916 7.26047 7.70376 7.27541 8.13379 7.72387L15 14.8844L21.8662 7.72387C22.2962 7.27541 23.0084 7.26047 23.4568 7.6905C23.9053 8.12053 23.9202 8.83268 23.4902 9.28114L16.0827 17.0062C15.4922 17.6219 14.5078 17.6219 13.9173 17.0062L6.50977 9.28114C6.07975 8.83268 6.09469 8.12053 6.54314 7.6905Z" fill="black"/>
|
3
|
-
</svg>
|
@@ -1,3 +0,0 @@
|
|
1
|
-
<svg width="30" height="25" viewBox="0 0 30 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
2
|
-
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.62488 6.28574C5.62488 6.07863 5.79277 5.91074 5.99988 5.91074H23.9999C24.207 5.91074 24.3749 6.07863 24.3749 6.28574V7.92165L14.9999 13.9502L5.62488 7.92163V6.28574ZM3.37488 8.5181C3.37472 8.52916 3.37472 8.54021 3.37488 8.55126V18.2857C3.37488 19.7355 4.55013 20.9107 5.99988 20.9107H23.9999C25.4496 20.9107 26.6249 19.7355 26.6249 18.2857V8.55315C26.6251 8.54084 26.6251 8.52853 26.6249 8.51621V6.28574C26.6249 4.83599 25.4496 3.66074 23.9999 3.66074H5.99988C4.55013 3.66074 3.37488 4.83599 3.37488 6.28574V8.5181ZM24.3749 10.5967V18.2857C24.3749 18.4928 24.207 18.6607 23.9999 18.6607H5.99988C5.79277 18.6607 5.62488 18.4928 5.62488 18.2857V10.5967L14.1886 16.1036C14.6828 16.4214 15.317 16.4214 15.8112 16.1036L24.3749 10.5967Z" fill="black"/>
|
3
|
-
</svg>
|