UIElement rotation's roll axis swapped

[digital quartz]

it seems that Roll is acting more like an inverse of Yaw rather than acting on its own axis.

import { GameObject, HorizontalAlignment, Rotator, UIElement, VerticalAlignment, refObject } from "@tabletop-playground/api";
import { jsxInTTPG, render } from "jsx-in-ttpg";

const DEG = [
    [0, 0, 0],
    [0, 0, 90],
    [0, 90, 0],
    [0, 90, 90],
    [90, 0, 0],
    [90, 0, 90],
    [90, 90, 0],
    [90, 90, 90],
];

((obj: GameObject) => {
    DEG.forEach((set, i) => {
        const color = `r${set.map((e) => (e === 0 ? "0" : "8")).join("")}8`;

        const eachUI = new UIElement();
        eachUI.useTransparency = true;
        eachUI.twoSided = true;
        eachUI.widget = render(
            <border color={color}>
                <layout width={300} height={300} valign={VerticalAlignment.Fill} halign={HorizontalAlignment.Fill}>
                    {DEG[i].toString()}
                </layout>
            </border>
        );
        eachUI.rotation = new Rotator(DEG[i][0], DEG[i][1], DEG[i][2]);
        obj.addUI(eachUI);
    });
})(refObject);

(can convert to non JSX if you want)

(I suspect somewhere in the UIElement.rotation setter an axis is swapped or the order of rotator axes is wonky since rotator is YZX but all intuition elsewhere says that axis order is XYZ)

also tried using Rotator.fromAxisAngles

import { GameObject, HorizontalAlignment, Rotator, UIElement, Vector, VerticalAlignment, refObject } from "@tabletop-playground/api";
import { jsxInTTPG, render } from "jsx-in-ttpg";

const DEG = [
    [0, 0, 1],
    [0, 1, 0],
    [1, 0, 0],
];

((obj: GameObject) => {
    DEG.forEach((set, i) => {
        const color = `r${set.map((e) => (e === 0 ? "0" : "8")).join("")}c`;
        // const color = "r0008";

        const eachUI = new UIElement();
        eachUI.useTransparency = true;
        eachUI.twoSided = true;
        eachUI.widget = render(
            <border color={color}>
                <layout width={300} height={300} valign={VerticalAlignment.Fill} halign={HorizontalAlignment.Fill}>
                    {DEG[i].toString()}
                </layout>
            </border>
        );
        // eachUI.rotation = new Rotator(DEG[i][0], DEG[i][1], DEG[i][2]); //is actually YZX, but treating it like XYZ anyways
        eachUI.rotation = Rotator.fromAxisAngle(new Vector(DEG[i][0], DEG[i][1], DEG[i][2]), 90);
        obj.addUI(eachUI);
    });
})(refObject);

[echo kettle]

Confirming roll is being treated as negative yaw. ```typescript
import {
Border,
Rotator,
Text,
Vector,
UIElement,
refCard,
} from "@tabletop-playground/api";

const rots = [
new Rotator(0, 0, 0),
new Rotator(30, 0, 0),
new Rotator(0, 30, 0),
new Rotator(0, 0, 30),
];
rots.forEach((rot, index) => {
const ui = new UIElement();
ui.position = new Vector(0, index * 6, 1);
ui.rotation = rot;
ui.widget = new Border().setChild(
new Text().setText(
[ P=${Math.round(rot.pitch)},
Y=${Math.round(rot.yaw)},
R=${Math.round(rot.roll)},
].join("\n")
)
);
refCard.addUI(ui);
});