playbook_ui_docs 13.19.0.pre.alpha.play1174fixconfimationtoastmobilebug2306 → 13.19.0.pre.alpha.play1186collapsiblenaviconcolorbug2321
Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 02f58fc8d21d61aa6839a71c560fe60fdd187f0b2cecfe9b115221fe3b757633
|
4
|
+
data.tar.gz: c3bbb67da585d399d3aebf243b27b9626c8eadced7ecd53e3ad3e6cb460a1f41
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 5b93e3d20a4081a3ad88022827c1a8d8b5041dfb5dbad3ee69b303e5a97df1b37161d9b6c246f0ae1c7c1bbc4db420a6235a35297492e51fc67b726eea7cce6d
|
7
|
+
data.tar.gz: ff550cdce2b9ac1909629653fd472d795e33ed67de040dc5d28905c06eae4e00024ace67f3da6ce87ac9a691e199542b5b770f623ee6e2168f6168559d24fc16
|
@@ -1,36 +1,5 @@
|
|
1
|
-
<%= pb_rails("button", props: { text: "Multiline Example", variant: "primary", data: { toast: "#toast-top-center-multi" } }) %>
|
2
|
-
|
3
1
|
<%= pb_rails("fixed_confirmation_toast", props: {
|
4
|
-
classname: "toast-to-hide",
|
5
|
-
closeable: true,
|
6
|
-
id: "toast-top-center-multi",
|
7
2
|
multi_line: true,
|
8
|
-
text: "
|
3
|
+
text: "Scan to Assign Selected Items. Click here to generate report",
|
9
4
|
status: "tip",
|
10
|
-
vertical: "top",
|
11
|
-
horizontal: "center"
|
12
5
|
}) %>
|
13
|
-
|
14
|
-
<script type="text/javascript">
|
15
|
-
const alltoasts = document.queryselectorall(".toast-to-hide")
|
16
|
-
const allbuttons = document.queryselectorall("button[data-toast]")
|
17
|
-
|
18
|
-
const hidealltoasts = () => {
|
19
|
-
alltoasts.foreach((toast) => {
|
20
|
-
toast.style.display = "none"
|
21
|
-
})
|
22
|
-
}
|
23
|
-
|
24
|
-
hidealltoasts()
|
25
|
-
|
26
|
-
allbuttons.foreach((button) => {
|
27
|
-
button.onclick = () => {
|
28
|
-
hidealltoasts()
|
29
|
-
let toast = document.queryselector(button.getattribute("data-toast"))
|
30
|
-
|
31
|
-
if (toast) {
|
32
|
-
toast.style.display = "flex"
|
33
|
-
}
|
34
|
-
}
|
35
|
-
})
|
36
|
-
</script>
|
data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_multi_line.jsx
CHANGED
@@ -1,52 +1,18 @@
|
|
1
|
+
import React from 'react'
|
1
2
|
|
2
|
-
import React, { useState } from 'react'
|
3
|
-
|
4
|
-
import Button from '../../pb_button/_button'
|
5
3
|
import FixedConfirmationToast from '../_fixed_confirmation_toast'
|
6
4
|
|
7
|
-
const
|
8
|
-
const [state, setState] = useState({
|
9
|
-
open: false,
|
10
|
-
vertical: 'top',
|
11
|
-
horizontal: 'center',
|
12
|
-
})
|
13
|
-
|
14
|
-
const { vertical, horizontal, open } = state
|
15
|
-
|
16
|
-
const handleClick = (newState) => () => {
|
17
|
-
setState({ open: true, ...newState })
|
18
|
-
}
|
19
|
-
|
20
|
-
const handleClose = () => {
|
21
|
-
setState({ ...state, open: false })
|
22
|
-
}
|
23
|
-
|
5
|
+
const FixedConfirmationToastMultiLine = (props) => {
|
24
6
|
return (
|
25
7
|
<div>
|
26
|
-
<Button
|
27
|
-
onClick={handleClick({
|
28
|
-
horizontal: 'center',
|
29
|
-
open: true,
|
30
|
-
vertical: 'top',
|
31
|
-
})}
|
32
|
-
text="Multiline Example"
|
33
|
-
variant="primary"
|
34
|
-
{...props}
|
35
|
-
/>
|
36
|
-
{' '}
|
37
8
|
<FixedConfirmationToast
|
38
|
-
closeable
|
39
|
-
horizontal={horizontal}
|
40
9
|
multiLine
|
41
|
-
onClose={handleClose}
|
42
|
-
open={open}
|
43
10
|
status="tip"
|
44
|
-
text=
|
45
|
-
vertical={vertical}
|
11
|
+
text="Scan to Assign Selected Items. Click here to generate report"
|
46
12
|
{...props}
|
47
13
|
/>
|
48
14
|
</div>
|
49
15
|
)
|
50
16
|
}
|
51
17
|
|
52
|
-
export default
|
18
|
+
export default FixedConfirmationToastMultiLine
|