ShareModal API
API reference docs for theShareModalwidget. For examples and details on the usage of this widget, visit the widget demo page.
Props
| Props | Type | Description | Default |
|---|---|---|---|
translations | object | Translations object for the ShareModal. title key is required. description and optionLabels are optional. If optionLabels are undefined then shareOption should be provided. | _ |
translations.title | string | title key is required prop | _ |
translations.description | object | description key is optional prop | _ |
translations.content | string |
| _ |
translations.description.primary | string | Primary text inside the share modal. | _ |
translations.description.secondary | string | Secondary text inside the share modal. | _ |
translations.optionLabels | copyLabel | emailLabel | facebookLabel | messengerLabel | whatsappLabel | All keys in optionLabels are optional, a default option will be rendered only if a corresponding key is provided. | _ |
onClose | function | Callback triggered on closing the share modal and will activate upon pressing "Esc" or clicking on the overlay. | _ |
onEscPress? | (event: KeyboardEvent) => void | Callback fired when "Esc" key is pressed along with onClose. | _ |
onOverlayClick? | function | Callback fired when the overlay is clicked along with onClose | _ |
closeOnEsc? | boolean | If set to false, the share modal will not close when the Esc key is pressed, and the Esc keydown event along with the onClose callback won't be attached. Similarly, onEscPress will have no effect. | true |
open | boolean | When set to true, the dialog will be mounted to DOM. | _ |
size? | number | The size of the Modal 'Dialog' box in pixels. | 640 |
togglePoint? | number | The screen width at which the modal should switch to a mobile-friendly layout. Deprecated with backwards compatibility ⚠️ (The logic will be handled internally in future) | 768 |
mobileFriendly? | boolean | Indicates if the share modal should be render Sheet in responsive view. | true |
closeOnOverlayClick? | boolean | If set to false, the share modal will not close when the overlay is clicked, and the onClose callback won’t be attached. Similarly, onOverlayClick will have no effect. | true |
avatarProps? | object | To render image before the heading, contains label and src | _ |
avatarProps.label | string | Aria label content for the image added before the heading. | _ |
avatarProps.src | string | Url content for the image added before the heading. | _ |
|
|
To render image before the heading, contains | _ |
|
|
Aria label content for the image added before the heading. | _ |
|
|
Url content for the image added before the heading. | _ |
link | string | Link to be shared | _ |
shareOptions? | Array of Objects | To have custom share options, If no share options are passed, the default share options will be displayed | _ |
closeButtonProps? | object | To render and customise share modal close button contains label and onClick | _ |
closeButtonProps.label | string | Aria label content for the close Icon button. | _ |
closeButtonProps.onClick | function | Callback function to be invoked when the close button is clicked. | _ |