To gain access to the OneJS private repo, pm Singtaa via Discord and provide your Invoice Number and GitHub username. The repo offers early access to the latest features and fixes that may not yet be available on the Asset Store. Our Discord channel is also a great resource for community-answered questions.
VERSION
Doc Menu

Dom

OneJS's Dom is a thin wrapper over the underlying VisualElement. Dom basically implements the mininum amount of features that's required from Preact.

The Dom object has 2 properties that are worth mentioning. One is dom.ve, the other is dom.style.

dom.ve is useful for grabbing the actual VisualElement. But because VisualElement is from C#/.Net, sometimes working with it can be a bit verbose. For example, to set the rotate style for a VisualElement, you'd need to do:

ref.current.ve.style.rotate = new StyleRotate(new Rotate(new Angle(-36)))

Which is fairly tedious to write. This is where dom.style comes in. It's a convenience wrapper over the .ve.style counterpart. So you can just do this:

ref.current.style.rotate = -36

Full code example:

import { h, render } from "preact"
import { Dom } from "OneJS/Dom"
import { useRef, useEffect } from "preact/hooks"
import { Angle, Rotate, StyleRotate } from "UnityEngine/UIElements"

const App = () => {
    const ref = useRef<Dom>()

    useEffect(() => {
        // ref.current returns the Dom object
        // ref.current.ve returns the underlying VisualElement
        log(ref.current.ve.resolvedStyle.width)

        // Both the following lines do the same thing
        ref.current.ve.style.rotate = new StyleRotate(new Rotate(new Angle(-36)))
        ref.current.style.rotate = -36
    }, [])

    return <div ref={ref}>Hello</div>
}

render(<App />, document.body)