tisho / Switch.framerfx

Utility component for Framer X that lets you switch between different states of an element
31 stars 4 forks source link

Can't use Switch within Component #20

Open vermap0107 opened 3 years ago

vermap0107 commented 3 years ago

Everytime I try using "Switch" within a component, it throws this error

Screenshot 2021-07-07 at 10 05 25 AM
Joelkang commented 2 years ago

I think the way framer sets transitions broke this component (again). I managed to fix it by adding an override to my variants:

import { ComponentType, cloneElement } from "react"

export function fixSwitch(Component): ComponentType {
    return ({ children, ...props }) => {
        const fixedVariants = children.map(
            (variant) =>
                variant &&
                cloneElement(variant, {
                    children: cloneElement(variant.props.children, {
                        transition: "instant", // Or whatever transition you want for the switch
                    }),
                })
        )

        return <Component {...props}>{fixedVariants}</Component>
    }
}

Note that if you have to apply the override to the variant layer and not the switch layer. Apologies but im new to framer and I dont completely understand the mental model