Documentation Index
Fetch the complete documentation index at: https://docs.velt.dev/llms.txt
Use this file to discover all available pages before exploring further.
React / Next.js
Other Frameworks
<VeltWireframe>
<VeltNotificationsToolWireframe>
<VeltNotificationsToolWireframe.Icon />
<VeltNotificationsToolWireframe.UnreadIcon />
<VeltNotificationsToolWireframe.UnreadCount />
<VeltNotificationsToolWireframe.Label />
</VeltNotificationsToolWireframe>
</VeltWireframe>
<velt-wireframe style="display:none;">
<velt-notifications-tool-wireframe>
<velt-notifications-tool-icon-wireframe></velt-notifications-tool-icon-wireframe>
<velt-notifications-tool-unread-icon-wireframe></velt-notifications-tool-unread-icon-wireframe>
<velt-notifications-tool-unread-count-wireframe></velt-notifications-tool-unread-count-wireframe>
<velt-notifications-tool-label-wireframe></velt-notifications-tool-label-wireframe>
</velt-notifications-tool-wireframe>
</velt-wireframe>
Styling
Disable ShadowDOM
- By default, ShadowDOM is used to ensure that your app’s CSS does not interfere with the styling of the SDK components.
- Disable the shadow dom to apply your custom CSS to the component.
Default: true
Example
React / Next.js
Other Frameworks
<VeltNotificationsTool shadowDom={false} panelShadowDom={false} />
<velt-notifications-tool shadow-dom="false" panel-shadow-dom="false"></velt-notifications-tool>
Dark Mode
Default: false
React / Next.js
Other Frameworks
<VeltNotificationsTool darkMode={true} />
<velt-notifications-tool dark-mode="true"></velt-notifications-tool>
Variant
You can define and use variants for the Notification Tool or the Notification Panel.
variant: For the Notification Tool.panelVariant: For the Notification Panel.
React / Next.js
Other Frameworks
<VeltNotificationsTool variant='tool1' panelVariant='panel1'/>
<velt-notifications-tool variant='tool1' panel-variant='panel1'/>
