<VeltWireframe>
    <VeltNotificationsPanelWireframe>
        <VeltNotificationsPanelWireframe.Title />
        <VeltNotificationsPanelWireframe.ReadAllButton />

        <VeltNotificationsPanelWireframe.Skeleton />

        {/* Header with Tabs */}
        <VeltNotificationsPanelWireframe.Header />

        {/* Main Content */}
        <VeltNotificationsPanelWireframe.Content>
        
            {/* For You Tab */}
            <VeltNotificationsPanelWireframe.Content.ForYou />

            {/* Documents Tab */}
            <VeltNotificationsPanelWireframe.Content.Documents />

            {/* People Tab */}
            <VeltNotificationsPanelWireframe.Content.People />

            {/* All Tab */}
            <VeltNotificationsPanelWireframe.Content.All />

        </VeltNotificationsPanelWireframe.Content>

    </VeltNotificationsPanelWireframe>
</VeltWireframe>

We recommend that you familiarize yourselves with Customization Concepts before attempting to modify any components.

Default Component

Here’s how the default component looks like:

<VeltWireframe>
    <VeltNotificationsPanelWireframe>
        <VeltNotificationsPanelWireframe.Title />
        <VeltNotificationsPanelWireframe.ReadAllButton />

        <VeltNotificationsPanelWireframe.Skeleton />

        {/* Header with Tabs */}
        <VeltNotificationsPanelWireframe.Header />

        {/* Main Content */}
        <VeltNotificationsPanelWireframe.Content>
        
            {/* For You Tab */}
            <VeltNotificationsPanelWireframe.Content.ForYou />

            {/* Documents Tab */}
            <VeltNotificationsPanelWireframe.Content.Documents />

            {/* People Tab */}
            <VeltNotificationsPanelWireframe.Content.People />

            {/* All Tab */}
            <VeltNotificationsPanelWireframe.Content.All />

        </VeltNotificationsPanelWireframe.Content>

    </VeltNotificationsPanelWireframe>
</VeltWireframe>