Type Alias CommentThreadUI
Type Alias
Type Signature
type CommentThreadUI =
| SlotConfigurationCallback<{ id: string }>
| {
comment?: BaseSlot;
editor?: SlotConfigurationCallback<{ id: string }>;
footer?: SlotConfigurationCallback<{ id: string }>;
header?: SlotConfigurationCallback<{ id: string }>;
}
| SlotConfigurationCallback<{ id: string }>
| {
comment?: BaseSlot;
editor?: SlotConfigurationCallback<{ id: string }>;
footer?: SlotConfigurationCallback<{ id: string }>;
header?: SlotConfigurationCallback<{ id: string }>;
}
Example
Customize the entire comment thread:
NutrientViewer.load({
// ... Your configuration.
ui: {
commentThread: (getInstance, id) => ({
render: (params) => {
// Return a DOM Node
const div = document.createElement("div");
div.innerText = `This is a custom UI for the comment thread: ${id}`;
return div;
},
}),
},
});
Add a custom header to the comment thread by customizing the header slot:
NutrientViewer.load({
// ... Your configuration.
ui: {
commentThread: {
header: () => {
return {
render: () => {
const div = document.createElement("div");
div.style.backgroundColor = "lightgreen";
div.style.padding = "5px";
div.innerText = "This is a custom header for the comment thread.";
return div;
},
};
},
},
},
});
Use this to customize comment thread or its slots.