Articles in this section
Category / Section

How to Remove Titles and Make SymbolPalette Static in React Diagram?

2 mins read

The Syncfusion® React Diagram allows you to create and manage various types of diagrams, including customizable symbol palettes. By default, the SymbolPalette comes with titles and expand/collapse icons for each palette. However, there may be situations where you want to remove these titles and prevent the palettes from being expandable. This article will show you how to remove titles from the SymbolPalette and make the palette static (non-expandable).

Hiding the Header Using CSS
There is no direct property to hide the header, but we can achieve this functionality by using CSS. Add the following CSS to hide the header from view and ensure it does not take up space in the layout. The !important flag is used to ensure it takes priority over other styles.

.e-acrdn-header {
   display: none !important;
} 

The .e-acrdn-header class is used to hide an element (likely the header of an accordion) from the page. The display: none property ensures the element is completely hidden from view and does not take up space in the layout. The !important flag is used to override any other conflicting styles that may attempt to display this element.

Removing Titles from the Palette Configuration
Remove the title property from the palette configuration to ensure that no titles are displayed for the palettes.

let palettes = [
   {
       id: 'flow',
       expanded: true,
       symbols: [
           // Add your symbols here
       ]
   },
]; 

You can find a working example of this implementation on StackBlitz

Conclusion
I hope you enjoyed learning how to remove title from symbol palette and Make palette static with no titles, not expandable using React Diagram. You can refer to our React Diagram feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications.

You can also explore our React Diagram example to understand how to create and manipulate data. For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion®, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied