Is registering Vue components supported?

Hey team, just wanted to check if code components are only available in React or am I able to register Vue components?

React only - you can make Vue components only if you’re willing to wrap them in React code component adapters

Thanks @yang

I have one more question:

Is it possible to pass functions for the editor UI to interact with?

I have a LocalStorageItem component I’d like the designers to be able to use with say a TextInput or a Switch etc where they can use the value as a dynamic value and then be able to change it (use case are filters/toggles that are used on multiple pages that need to share a value).

This provides the value but the function comes through as a string:

export default function LocalStorageItem<T>(props: LocalStorageItemProps) {

    const [value, setValue] = useLocalStorage<T>(itemKey);

    return (
            <DataProvider name={props.itemKey} data={{value, updateValue}}>

Data provider is a normal react context so it’s actually able to work with functions and such without issue

I believe the problem in this case is actually the use of local storage, which needs to be able to serialize whatever you give it. Functions are not serializable.

Hey @yang

So I’ve played around with it a bit more - if I try add an onChange interaction to a Switch contained within the LocalStorageItem set to a custom function; I can choose my setValue function as a function from the dynamic values options as in the first image, but it won’t save.

If I try switch to code then it sees that function as a string as in the 2nd image.

Is there a way for me to call that function with the current IsChecked value from the Switch?

Is there a way to register the setValue function as an event handler that could appear here:

hmmm in the Custom function, you should be able to write the function body like ctx.switch.setValue(...) as you did.

I know you’re seeing a red squiggly, and there’s likely a bug with how we are typing the environment there, but otherwise it should work…?

We’re working on better ways for code components to expose actions that you can invoke via the UI :slightly_smiling_face:

Thanks @chungwu - it would be awesome to be able to register event handlers like for those page state variables. I’ll give this another try with the function body even with the red squiggly