2019-08-09 14:56:43 +00:00
import React from "react" ;
2021-03-03 23:59:49 +00:00
import EmptyScreenContainer from "./" ;
2019-09-07 10:42:32 +00:00
import Link from "../link" ;
2021-03-03 23:59:49 +00:00
import CrossIcon from "../../../public/images/cross.react.svg" ;
export default {
title : "Components/EmptyScreenContainer" ,
component : EmptyScreenContainer ,
2021-03-07 11:57:26 +00:00
argTypes : {
onClick : { action : "Reset filter clicked" , table : { disable : true } } ,
} ,
2021-03-03 23:59:49 +00:00
parameters : {
docs : {
description : {
2021-03-07 11:57:26 +00:00
component : "Used to display empty screen page" ,
2021-03-03 23:59:49 +00:00
} ,
} ,
} ,
} ;
const Template = ( args ) => {
return (
2019-08-09 14:56:43 +00:00
< EmptyScreenContainer
2021-03-03 23:59:49 +00:00
{ ... args }
2019-08-09 14:56:43 +00:00
buttons = {
< >
2021-02-20 08:46:32 +00:00
< CrossIcon size = "small" style = { { marginRight : "4px" } } / >
2021-03-03 23:59:49 +00:00
< Link type = "action" isHovered = { true } onClick = { ( e ) => args . onClick ( e ) } >
2019-08-09 14:56:43 +00:00
Reset filter
< / L i n k >
< / >
}
/ >
2021-03-03 23:59:49 +00:00
) ;
} ;
export const Default = Template . bind ( { } ) ;
Default . args = {
2021-03-07 11:57:26 +00:00
imageSrc : "/static/images/empty_screen_filter.png" ,
2021-03-03 23:59:49 +00:00
imageAlt : "Empty Screen Filter image" ,
headerText : "No results matching your search could be found" ,
subheadingText : "No files to be displayed in this section" ,
descriptionText :
"No people matching your filter can be displayed in this section. Please select other filter options or clear filter to view all the people in this section." ,
} ;