-
Notifications
You must be signed in to change notification settings - Fork 126
/
EmergencyNote.jsx
80 lines (74 loc) · 2.18 KB
/
EmergencyNote.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
import React from 'react';
import PropTypes from 'prop-types';
import CrisisLineConnectButton from './CrisisLineConnectButton';
const EmergencyNote = props => {
const { dropDownFlag } = props;
const content = () => (
<>
<div className="vads-u-margin-bottom--2">
<p>
Your care team may take up to <strong>3 business days</strong> to
reply.
</p>
<p>
If you need help sooner, use one of these urgent communication
options:
</p>
<ul>
<li>
<strong>If you’re in crisis or having thoughts of suicide,</strong>{' '}
connect with our Veterans Crisis Line. We offer confidential support
anytime, day or night.
</li>
<CrisisLineConnectButton />
<li>
<strong>If you think your life or health is in danger,</strong> Call{' '}
<va-telephone contact="911" /> or go to the nearest emergency room.
</li>
</ul>
</div>
</>
);
return (
<>
{dropDownFlag ? (
<va-alert-expandable
status="info"
trigger="Only use messages for non-urgent needs"
>
<div className="vads-u-padding-x--1 vads-u-padding-bottom--1">
{content()}
</div>
</va-alert-expandable>
) : (
<va-alert
uswds
background-only
class="vads-u-margin-bottom--1"
close-btn-aria-label="Close notification"
disable-analytics="false"
full-width="false"
status="warning"
visible="true"
show-icon={dropDownFlag}
>
<p>
{' '}
<i
className="fas fa-exclamation-triangle vads-u-margin-right--1p5"
aria-hidden="true"
/>
<strong className="vads-u-margin-left--0p25">
Don’t use messages for emergencies
</strong>
</p>
{content()}
</va-alert>
)}
</>
);
};
EmergencyNote.propTypes = {
dropDownFlag: PropTypes.bool,
};
export default EmergencyNote;