Open jcubic opened 3 years ago
Thanks for providing me the example. I just realized that JSX implementation on React and Preact are quite different. Let me add JSX implementation support for Preact.
The way it's handled by Babel that transform JSX is that they use Pragma that allow to use different function in Preact the name is h
and in React it's React.creteElement
. I'm not sure if there are other differences please let me know if there are other differences. In my projects I Use SXML I use lisp on top of JavaScript, I would to know if there are other differences that I need to handle properly.
Hi, this issue can be solved if you use Rectangle
in your code instead of rectangle
over here:
const composed = compodraw.composeFromJsx(
h("Rectangle", {x: 210, y: 170, width: 200, height: 150}),
instructs
);
You need to do this because window['compodraw-instructs']
contains an object of instructs, and the instruct it contains is Rectangle
instead of rectangle
, thus while evaluating Compodraw looks for the instruct, rectangle
and it does not find this instruct, raising the error.
I was able to update my demo, with Preact. I'm wondering if it will work if you use JSX+Preact because the example use rectangle
not Rectangle
.
You could try using JSX and Preact, but I think you would have to use Rectangle
instead of rectangle
. As far as I know, it should work with Preact and JSX. Anyway, you should be good to close the issue, if you don't have any other issue.
I think that your library don't work with Preact JSX only with react because it relay on internals of React.
I've created basic example with Preact (sorry no JSX but it shouldn't matter the code is the same)
https://codepen.io/jcubic/pen/PobgJPM?editors=0010
but got error
"rectangle" is not registered in 'withInstructs' at composeFromJsx(jsx, withInstructs) function
I use almost the same code as your basic JSX example but I used Preact instead of React.