Show More
When you need to toggle visibility of additional content in a responsive and accessible manner, the ShowMore component provides the functionality.
Basic
The ShowMore component is primarily used to encapsulate content that can be expanded or collapsed. It renders the content as initially hidden, and it expands to show more when interacted with by the user.
Installation
As Text
While the default behavior utilizes a button for interactions, the ShowMore component can also be configured to function as a clickable text element.
Controlled
Gain fine-grained control over the ShowMore component's behavior. This setup ensures you can manage the expanded state externally, ideal for more complex interactions.
Orientation
The default orientation for the ShowMore component is horizontal. However, it can easily be adjusted to a vertical layout to suit different design needs.
Content Reveal
Sometimes you want to hide part of a content, use the Content Reveal!
Initial Appearance
You can specify the initialHeight and initialOpacity by provide the props