Documentation / @frak-labs/components / ButtonShare
Function: ButtonShare()
ButtonShare(
args):Element|null
Defined in: sdk/components/src/components/ButtonShare/ButtonShare.tsx:56
Button to share the current page
Parameters
args
classname?
string = ""
Classname to apply to the button
clickAction?
"embedded-wallet" | "share-modal" | "sharing-page"
Which UI to open on click
Default Value"embedded-wallet"
noRewardText?
string
Fallback text if the reward isn't found
placement?
string
targetInteraction?
"referral" | "create_referral_link" | "purchase" | `custom.${string}`
Target interaction behind this sharing action (will be used to get the right reward to display)
text?
string = "Share and earn!"
Text to display on the button
- To specify where the reward should be displayed, use the placeholder
{REWARD}, e.g.Share and earn up to \{REWARD\}!
"Share and earn!"
useReward?
boolean
Do we display the reward on the share modal?
Default Valuefalse
Returns
Element | null
The share button with <button> tag
Examples
Basic usage:
<frak-button-share></frak-button-share>Using a custom text:
<frak-button-share text="Share and earn!"></frak-button-share>Using a custom class:
<frak-button-share classname="button button-primary"></frak-button-share>Using reward information and fallback text:
<frak-button-share use-reward text="Share and earn up to {REWARD}!" no-reward-text="Share and earn!"></frak-button-share>Using reward information for specific reward and fallback text:
<frak-button-share use-reward text="Share and earn up to {REWARD}!" no-reward-text="Share and earn!" target-interaction="custom.customerMeeting"></frak-button-share>See
- `modalBuilder()` for more info about the modal display
- `getMerchantInformation()` for more info about the estimated reward fetching