Override Switch and useSwitch

[christophevouillamoz]

In Framer it is not possible to add an override as soon useSwitch is used. In the override panel the file is not selected anymore and it is not in the dropdown.

Without the const controls = useSwitch() line of code, it works and you can choose the override as expected in the panel.

I also tried to import the switch package from the import wizard but this will not work, no import button available.

The Code

import { Override } from "framer"
import { useSwitch } from "@framer/tishogeorgiev.switch/code"

export function SwitchSwiper(): Override {
const controls = useSwitch()
var startPointX = 0

function onPanStart(event, info) {
    console.log("PanStart", info.point.x, info.point.y)
    startPointX = info.point.x
}

function onPanEnd(event, info) {
    console.log("PanEnd", info.point.x, info.point.y)

    var startPointDelta = info.point.x - startPointX

    console.log("Pan Result", startPointDelta, info.point.x, startPointX)

    if (startPointDelta < 0) {
        console.log("swipe left")
    } else {
        console.log("swipe right")
    }
}

function onPan(event, info) {
    console.log("Pan", info.point.x, info.point.y)
}

return {
    onPanStart: onPanStart,
    onPanEnd: onPanEnd,
    onPan: onPan,
}

}