💬 Feedback Needed: Finalizing componentAnimation API for TypingFX

[mayank1513]

Hello TypingFX community! 👋

We're currently refining the componentAnimation feature in TypingFX and would greatly appreciate your insights to help shape its final API design.

🧪 Current Behavior (Beta)

The componentAnimation prop is in beta and offers two modes:

1. Default ("typing"): Assumes the component is pure and extracts its JSX for typing animations, treating it similarly to static content.
2. Custom Wrapper: By providing an object like { wrapper: 'div', props: { className: 'my-wrapper' } }, TypingFX wraps the component without extracting its JSX, applying fade-in (5s) and fade-out (3s) animations to the wrapper. This approach is beneficial for components with side effects or internal state.

Currently, to customize these animations, you need to override the CSS classes:

.tfx_component.tfx_type {
  animation: fadein 5s;
}

.tfx_component.tfx_del {
  animation: fadeout 3s;
}

❓ Seeking Your Feedback

We'd love to hear your thoughts on the following:

• API Design: Is the current structure of the componentAnimation prop intuitive and flexible for your use cases?
• Customization: Would you prefer more granular control over the animation timings and styles directly through props?
• Use Cases: Are there specific scenarios or component behaviors that the current implementation doesn't accommodate well?

Your feedback is invaluable in ensuring TypingFX meets the needs of its users. Please share your experiences, suggestions, or any challenges you've encountered with the componentAnimation feature.

Looking forward to your insights!

Best regards,