FigmaPreview macro

[iSapozhnik]

Pretty cool idea, thanks for making it public.
Have you considered/explored already a way to embed this functionality into a custom preview macro?
I imagine this kind of an API:

#FigmaPreview(fileID: "<file-id>", node: "<nide-id>", accessToken: "<access-token>") {
    ContentView()
}

[artemnovichkov]

Hi, thank you for the feedback! And you're absolutely right, that's what I'm exploring right now. Here is my rough version:

public struct FigmaPreviewMacro: ExpressionMacro {
    public static func expansion(
        of node: some FreestandingMacroExpansionSyntax,
        in context: some MacroExpansionContext
    ) -> ExprSyntax {
        guard node.argumentList.count == 3 else {
            fatalError("compiler bug: the macro does not have arguments")
        }

        guard let trailingClosure = node.trailingClosure else {
            fatalError("compiler bug: the macro does not have arguments")
        }

        let arguments = node.argumentList.compactMap { $0 }
        let lastArgument = node.argumentList.last!.expression


        return """
        #Preview {\(trailingClosure.statements)
            .compare(\(arguments[0])\(arguments[1].label!): \(arguments[1].expression))
            .environment(\\.figmaAccessToken, \(arguments[2].expression))
        }
        """
    }
}

And a call looks like:

#FigmaPreview(with: "1", componentID: "2", figmaAccessToken: "3") {
    Text("hello, world!")
}

[iSapozhnik]

Were you able to get Canvas to work?

[artemnovichkov]

If you're asking about the macro, I'm going to publish it this week.

[iSapozhnik]

Great looking forward!
In my case, I was working on a custom preview macro that spins up our design system (loads custom fonts, etc) and I could not make Canvas work. Like with normal #Preview the moment you type #Preview it immediately picks this up and shows the Preview Canvas. Which never happened with the custom one I was building. Anyhow a different topic :)

[artemnovichkov]

Hah, its a bit tricky 🙂 I tried to use the same name for my macro like:

#Preview(with: "", componentID: "", figmaAccessToken: "") {
    ContentView()
        .frame(width: 400, height: 100)
}

It triggers the Canvas, but won't show the content:

[iSapozhnik]

Yes, it is a bit tricky. Do you think it's even possible?

[artemnovichkov]

I'm not sure. I didn't find relevant information on the internet about this case.