diff --git a/Document-Processing/Word/Word-Processor/react/track-changes.md b/Document-Processing/Word/Word-Processor/react/track-changes.md index 5fb23f528f..ddfbae7509 100644 --- a/Document-Processing/Word/Word-Processor/react/track-changes.md +++ b/Document-Processing/Word/Word-Processor/react/track-changes.md @@ -305,6 +305,52 @@ createRoot(document.getElementById('sample')).render(); {% endhighlight %} {% endtabs %} +## Custom Colors for Track Changes + +You can set an array of colors to show track changes such as insertions and deletions in the DOCX editor. Each author is assigned a color in order: the first author gets the first color, the second author gets the next, and so on. If there are more authors than colors, the assignment starts again from the beginning of the array. + +The following example illustrates how to set the color order for track changes in the DOCX Editor + +```typescript + import { useRef, useEffect } from 'react'; +import { + DocumentEditorContainerComponent, + Toolbar, + Inject +} from '@syncfusion/ej2-react-documenteditor'; + +function App() { + const containerRef = useRef(null); + + useEffect(() => { + if (containerRef.current) { + // Access the underlying DocumentEditor instance + const editor = containerRef.current.documentEditorSettings; + + // Update revision colors dynamically + editor.revisionSettings.revisionColors = [ + '#0000ff', + '#bb00ff', + '#c14f16' + ]; + } + }, []); + + return ( + + + + ); +} + +export default App; +``` + ## Filter Changes by User The built-in review panel in the DOCX Editor supports filtering changes based on the user. @@ -319,4 +365,4 @@ Explore how to track and review changes in Word documents using the React DOCX E To learn more about Track Changes in the DOCX Editor component, refer to the video below. -{% youtube "https://www.youtube.com/watch?v=Ke27Mip4bN0" %} \ No newline at end of file +{% youtube "https://www.youtube.com/watch?v=Ke27Mip4bN0" %}