[Collapsible] Disable initial "open" animation

[rkumorek]

Hey,

I am keen on using Collapsible component with height animation. Currently have this which is basically example copied from docs.

const CollapsibleContent = styled(CollapsiblePrimitive.Content, {
    overflow: "hidden",
    '&[data-state="open"]': {
        animation: `${keyframes({
            from: { height: 0 },
            to: { height: "var(--radix-collapsible-content-height)" },
        })} 200ms ease-out`,
    },
    '&[data-state="closed"]': {
        animation: `${keyframes({
            from: { height: "var(--radix-collapsible-content-height)" },
            to: { height: 0 },
        })} 200ms ease-out`,
    },
});

What happens is when the component is mounted it's animated in which I would like to avoid. What is the best way of disabling initial "open" animation on first render?

Thanks

[jjenzz]

I've created a PR to prevent mount animation when open by default here #977

[rkumorek]

Thank you, that looks great!

Apologies for duplicate discussion (feel free to delete this one if it's possible in favour of 934).