An example of modern Framer override APIs

modern-framer-override.tsx

import type { ComponentType } from "react"
import { createStore } from "https://framer.com/m/framer/store.js@^1.0.0"

const useStore = createStore({
  myVariant: "A"
})

export function withSetVariant(Component): ComponentType {
    return (props) => {
        const [variant, setVariant] = useStore()
        return <Component {...props} onClick={() => setVariant({ myVariant: "B" })} />
    }
}

export function withMyVariant(Component): ComponentType {
    return (props) => {
        const [variant] = useStore()
        return <Component {...props} variant={variant} />
    }
}