app/javascript/spec/notification-drawer/__snapshots__/notification-drawer.spec.js.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Notification drawer tests should render correctly 1`] = `
<Provider
store={
Object {
"clearActions": [Function],
"dispatch": [Function],
"getActions": [Function],
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
}
}
>
<NotificationDrawer
jsRequest={false}
>
<div
id="miq-notifications-drawer-container"
>
<div
className="notification-drawer "
>
<div
className="panel-header"
>
<Button
className="collapsed heading-icon"
hasIconOnly={true}
iconDescription="collapsed"
onClick={[Function]}
onKeyPress={[Function]}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
>
<button
aria-describedby={null}
aria-pressed={null}
className="collapsed heading-icon bx--btn bx--btn--primary bx--tooltip--hidden bx--btn--icon-only bx--tooltip__trigger bx--tooltip--a11y bx--btn--icon-only--top bx--tooltip--align-center"
disabled={false}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyPress={[Function]}
onMouseEnter={[Function]}
onMouseLeave={[Function]}
tabIndex={0}
type="button"
>
<div
className="bx--assistive-text"
onMouseEnter={[Function]}
>
collapsed
</div>
<ForwardRef(ChevronLeft16)
aria-hidden="true"
aria-label="collapsed"
className="bx--btn__icon"
>
<Icon
aria-hidden="true"
aria-label="collapsed"
className="bx--btn__icon"
fill="currentColor"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 16 16"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-hidden="true"
aria-label="collapsed"
className="bx--btn__icon"
fill="currentColor"
focusable="false"
height={16}
preserveAspectRatio="xMidYMid meet"
role="img"
viewBox="0 0 16 16"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M5 8L10 3 10.7 3.7 6.4 8 10.7 12.3 10 13z"
/>
</svg>
</Icon>
</ForwardRef(ChevronLeft16)>
</button>
</Button>
<h3
className="notification-title"
>
Notifications
</h3>
<Button
className="heading-icon closeIcon"
description="Close"
hasIconOnly={true}
iconDescription="Close"
onClick={[Function]}
onKeyPress={[Function]}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
>
<button
aria-describedby={null}
aria-pressed={null}
className="heading-icon closeIcon bx--btn bx--btn--primary bx--tooltip--hidden bx--btn--icon-only bx--tooltip__trigger bx--tooltip--a11y bx--btn--icon-only--top bx--tooltip--align-center"
description="Close"
disabled={false}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyPress={[Function]}
onMouseEnter={[Function]}
onMouseLeave={[Function]}
tabIndex={0}
type="button"
>
<div
className="bx--assistive-text"
onMouseEnter={[Function]}
>
Close
</div>
<ForwardRef(Close16)
aria-hidden="true"
aria-label="Close"
className="bx--btn__icon"
>
<Icon
aria-hidden="true"
aria-label="Close"
className="bx--btn__icon"
fill="currentColor"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-hidden="true"
aria-label="Close"
className="bx--btn__icon"
fill="currentColor"
focusable="false"
height={16}
preserveAspectRatio="xMidYMid meet"
role="img"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M17.4141 16L24 9.4141 22.5859 8 16 14.5859 9.4143 8 8 9.4141 14.5859 16 8 22.5859 9.4143 24 16 17.4141 22.5859 24 24 22.5859 17.4141 16z"
/>
</svg>
</Icon>
</ForwardRef(Close16)>
</button>
</Button>
</div>
<div
className="notification-content"
>
<div>
<Accordion
align="start"
className="Notification-accordion"
>
<ul
className="bx--accordion Notification-accordion bx--accordion--start bx--accordion--md"
>
<AccordionItem
title={
<div
className="events-count"
>
<span>
Events
</span>
<span>
2 New
</span>
</div>
}
>
<li
className="bx--accordion__item"
onAnimationEnd={[Function]}
>
<defaultRenderToggle
aria-controls="accordion-item-6"
aria-expanded={false}
className="bx--accordion__heading"
onClick={[Function]}
onKeyDown={[Function]}
type="button"
>
<button
aria-controls="accordion-item-6"
aria-expanded={false}
className="bx--accordion__heading"
onClick={[Function]}
onKeyDown={[Function]}
type="button"
>
<ForwardRef(ChevronRight16)
className="bx--accordion__arrow"
>
<Icon
className="bx--accordion__arrow"
fill="currentColor"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 16 16"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-hidden={true}
className="bx--accordion__arrow"
fill="currentColor"
focusable="false"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 16 16"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z"
/>
</svg>
</Icon>
</ForwardRef(ChevronRight16)>
<Text
as="div"
className="bx--accordion__title"
>
<div
className="bx--accordion__title"
dir="auto"
>
<div
className="events-count"
>
<span>
Events
</span>
<span>
2 New
</span>
</div>
</div>
</Text>
</button>
</defaultRenderToggle>
<div
className="bx--accordion__content"
id="accordion-item-6"
>
<div
className="notification-accordion-content"
>
<div
className="notification-content-messages"
>
<FeatureToggle(InlineNotification)
className="notification-item-wrapper unread"
hideCloseButton={true}
key="10000000003625"
kind="error"
lowContrast={true}
role="alert"
statusIconDescription="error"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003625"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003625"
disabled={false}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003625"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003625"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed with errors"
>
<InlineNotification
className="notification-item-wrapper unread"
hideCloseButton={true}
iconDescription="closes notification"
kind="error"
lowContrast={true}
notificationType="inline"
onCloseButtonClick={[Function]}
role="alert"
statusIconDescription="error"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003625"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003625"
disabled={false}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003625"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003625"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed with errors"
>
<div
className="notification-item-wrapper unread bx--inline-notification bx--inline-notification--low-contrast bx--inline-notification--error bx--inline-notification--hide-close-button"
kind="error"
role="alert"
>
<div
className="bx--inline-notification__details"
>
<NotificationIcon
iconDescription="error"
kind="error"
notificationType="inline"
>
<ForwardRef(ErrorFilled20)
className="bx--inline-notification__icon"
>
<Icon
className="bx--inline-notification__icon"
fill="currentColor"
height={20}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-hidden={true}
className="bx--inline-notification__icon"
fill="currentColor"
focusable="false"
height={20}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z"
/>
<path
d="M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z"
data-icon-path="inner-path"
opacity="0"
/>
<title>
error
</title>
</svg>
</Icon>
</ForwardRef(ErrorFilled20)>
</NotificationIcon>
<NotificationTextDetails
notificationType="inline"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003625"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003625"
disabled={false}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003625"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003625"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed with errors"
>
<div
className="bx--inline-notification__text-wrapper"
>
<p
className="bx--inline-notification__title"
>
Plan has completed with errors
</p>
<div
className="bx--inline-notification__subtitle"
>
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003625"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<ClickListener
onClickOutside={[Function]}
>
<button
aria-controls={null}
aria-expanded={false}
aria-haspopup={true}
aria-label="open and close options"
className="bx--overflow-menu bx--overflow-menu--md"
floatingmenu="true"
id="10000000003625"
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
open={false}
title="open and close options"
type="button"
>
<ForwardRef(OverflowMenuVertical16)
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
>
<Icon
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
fill="currentColor"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
fill="currentColor"
focusable="false"
height={16}
preserveAspectRatio="xMidYMid meet"
role="img"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<circle
cx="16"
cy="8"
r="2"
/>
<circle
cx="16"
cy="16"
r="2"
/>
<circle
cx="16"
cy="24"
r="2"
/>
<title>
Open and close list of options
</title>
</svg>
</Icon>
</ForwardRef(OverflowMenuVertical16)>
</button>
</ClickListener>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
</div>
</div>
</NotificationTextDetails>
</div>
</div>
</InlineNotification>
</FeatureToggle(InlineNotification)>
<FeatureToggle(InlineNotification)
className="notification-item-wrapper unread"
hideCloseButton={true}
key="10000000003624"
kind="success"
lowContrast={true}
role="alert"
statusIconDescription="success"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003624"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003624"
disabled={true}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003624"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003624"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed successfully"
>
<InlineNotification
className="notification-item-wrapper unread"
hideCloseButton={true}
iconDescription="closes notification"
kind="success"
lowContrast={true}
notificationType="inline"
onCloseButtonClick={[Function]}
role="alert"
statusIconDescription="success"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003624"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003624"
disabled={true}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003624"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003624"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed successfully"
>
<div
className="notification-item-wrapper unread bx--inline-notification bx--inline-notification--low-contrast bx--inline-notification--success bx--inline-notification--hide-close-button"
kind="success"
role="alert"
>
<div
className="bx--inline-notification__details"
>
<NotificationIcon
iconDescription="success"
kind="success"
notificationType="inline"
>
<ForwardRef(CheckmarkFilled20)
className="bx--inline-notification__icon"
>
<Icon
className="bx--inline-notification__icon"
fill="currentColor"
height={20}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-hidden={true}
className="bx--inline-notification__icon"
fill="currentColor"
focusable="false"
height={20}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 20 20"
width={20}
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10,1c-4.9,0-9,4.1-9,9s4.1,9,9,9s9-4,9-9S15,1,10,1z M8.7,13.5l-3.2-3.2l1-1l2.2,2.2l4.8-4.8l1,1L8.7,13.5z"
/>
<path
d="M8.7,13.5l-3.2-3.2l1-1l2.2,2.2l4.8-4.8l1,1L8.7,13.5z"
data-icon-path="inner-path"
fill="none"
opacity="0"
/>
<title>
success
</title>
</svg>
</Icon>
</ForwardRef(CheckmarkFilled20)>
</NotificationIcon>
<NotificationTextDetails
notificationType="inline"
subtitle={
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003624"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<OverflowMenuItem
aria-label="View details"
className="overflow-options details-10000000003624"
disabled={true}
hasDivider={false}
isDelete={false}
itemText="View details"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Mark as read"
className="overflow-options markasread-10000000003624"
disabled={false}
hasDivider={true}
isDelete={false}
itemText="Mark as read"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
<OverflowMenuItem
aria-label="Remove"
className="overflow-options remove-10000000003624"
disabled={false}
hasDivider={false}
isDelete={true}
itemText="Remove"
onClick={[Function]}
onKeyDown={[Function]}
requireTitle={true}
/>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
}
title="Plan has completed successfully"
>
<div
className="bx--inline-notification__text-wrapper"
>
<p
className="bx--inline-notification__title"
>
Plan has completed successfully
</p>
<div
className="bx--inline-notification__subtitle"
>
<div
className="subtitle-div"
>
<div
className="subtitle-div-notification-menu"
>
<OverflowMenu
ariaLabel="open and close options"
direction="bottom"
flipped={true}
floatingmenu="true"
focusTrap={true}
iconDescription="Open and close list of options"
id="10000000003624"
light={false}
menuOffset={[Function]}
menuOffsetFlip={[Function]}
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
onOpen={[Function]}
open={false}
renderIcon={
Object {
"$$typeof": Symbol(react.forward_ref),
"render": [Function],
}
}
selectorPrimaryFocus="[data-overflow-menu-primary-focus]"
title="open and close options"
>
<ClickListener
onClickOutside={[Function]}
>
<button
aria-controls={null}
aria-expanded={false}
aria-haspopup={true}
aria-label="open and close options"
className="bx--overflow-menu bx--overflow-menu--md"
floatingmenu="true"
id="10000000003624"
onClick={[Function]}
onClose={[Function]}
onKeyDown={[Function]}
open={false}
title="open and close options"
type="button"
>
<ForwardRef(OverflowMenuVertical16)
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
>
<Icon
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
fill="currentColor"
height={16}
preserveAspectRatio="xMidYMid meet"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<svg
aria-label="Open and close list of options"
className="bx--overflow-menu__icon"
fill="currentColor"
focusable="false"
height={16}
preserveAspectRatio="xMidYMid meet"
role="img"
viewBox="0 0 32 32"
width={16}
xmlns="http://www.w3.org/2000/svg"
>
<circle
cx="16"
cy="8"
r="2"
/>
<circle
cx="16"
cy="16"
r="2"
/>
<circle
cx="16"
cy="24"
r="2"
/>
<title>
Open and close list of options
</title>
</svg>
</Icon>
</ForwardRef(OverflowMenuVertical16)>
</button>
</ClickListener>
</OverflowMenu>
</div>
<div
className="subtitle-div-notification-time"
>
<span
className="notification-time"
>
Invalid date
|
Invalid date
</span>
</div>
</div>
</div>
</div>
</NotificationTextDetails>
</div>
</div>
</InlineNotification>
</FeatureToggle(InlineNotification)>
<div
className="maxnotifications-text"
>
<span>
Showing 100 items out of 2 total.
</span>
<Button
id="toggleMaxNotifications"
kind="ghost"
onClick={[Function]}
>
<button
aria-describedby={null}
aria-pressed={null}
className="bx--btn bx--btn--ghost"
disabled={false}
id="toggleMaxNotifications"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseEnter={[Function]}
onMouseLeave={[Function]}
tabIndex={0}
type="button"
>
Show all (may take a while)
</button>
</Button>
</div>
</div>
<div
className="notification-footer"
>
<Button
disabled={false}
id="markAllReadBtn"
kind="ghost"
onClick={[Function]}
>
<button
aria-describedby={null}
aria-pressed={null}
className="bx--btn bx--btn--ghost"
disabled={false}
id="markAllReadBtn"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseEnter={[Function]}
onMouseLeave={[Function]}
tabIndex={0}
type="button"
>
Mark All Read
</button>
</Button>
<Button
disabled={false}
id="clearAllBtn"
kind="ghost"
onClick={[Function]}
>
<button
aria-describedby={null}
aria-pressed={null}
className="bx--btn bx--btn--ghost"
disabled={false}
id="clearAllBtn"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseEnter={[Function]}
onMouseLeave={[Function]}
tabIndex={0}
type="button"
>
Clear All
</button>
</Button>
</div>
</div>
</div>
</li>
</AccordionItem>
</ul>
</Accordion>
</div>
</div>
</div>
</div>
</NotificationDrawer>
</Provider>
`;