Open and close the sidebar from anywhere
To display a series of comments or threaded conversations on your page, we strongly recommend using Cord Threaded Comments, combined with Cord Notification List for better customizability and a more native feel.
The SidebarLauncher
component allows you to replace that default button with a customizable one that you can choose to place anywhere in your application UI.
By itself, the Sidebar
component will add a floating launcher button, positioned fixed in the bottom-right corner of your app in the browser; clicking this launcher opens and closes the sidebar.
This component pairs well with:
If you use this component, remember to pass showLauncher={false}
to <Sidebar />
.
import { Sidebar, SidebarLauncher } from "@cord-sdk/react";
export const Example = () => (
<body>
<div id="header">
<SidebarLauncher label="Collaborate" inboxBadgeStyle="badge" />
</div>
<Sidebar showLauncher={false} />
</body>
);
Comment
.Comment icon
.badge_with_count
, badge
or
none
.badge_with_count
.false
.