Basic

The basic templates is the default go-to template if are not sure how the layout will be. By default the template uses a "Next" button. This can be overriden by using the primaryButtonProps.

Usage

No Image

<ActionCardBasicTemplate title="Basic Template Title" description="This is a basic template description" onPress={() => console.log("Pressed 'Next' button")}/>

With image

import svg from "..."
//With svg icon<ActionCardBasicTemplate title="Basic Template Title" description="This is a basic template description" imageProps={{variant: "icon", SVGImg: svg}} onPress={() => console.log("Pressed 'Next' button")}/>

Different Primary Button

When using a different primary button there is no need to pass the onPress prop, as the onPress that will be used is in the primaryButtonProps's object.

<ActionCardBasicTemplate title="Basic Template Title" description="This is a basic template description" primaryButtonProps={{label: "Custom Primary", onPress: () => console.log("Primary Button Pressed")}}/>

note

The primaryButtonProps's variant will always be 'black primary'. Therefor it is not necessary to specify it.

With Secondary Button

<ActionCardBasicTemplate title="Basic Template Title" description="This is a basic template description" secondaryButtonProps={{label: "Secondary Button", onPress: () => console.log("Secondary Button Pressed")}}/>

note

The secondaryButtonProps's variant will always be 'secondary'. Therefor it is not necessary to specify it.

Props

Name	Type	Default	Description
title*	string	undefined	The card title
description*	string	undefined	The card description
imageProps	ActionCardImageProps	undefined	The props used for the image. See props here
children	JSX.Element	undefined	children
primaryButtonProps	ActionCardButtonProps	undefined	The props used for the primary button. See props here
secondaryButtonProps	ActionCardButtonProps	undefined	The props used for the primary button. See props here
onPress	function () => any	undefined	Callback that is called when pressing the 'next' button. Irrelevant when using primaryButtonProps.

*required