Ramonda

RMD064 — A css value is not a compiled style block

The css prop takes what the compiler produced — a value with a className, and a properties and values array beside it. The types refuse anything else, so a value that reaches the runtime came from JavaScript that was not checked: a hand-written object, or another library's own shape.

It is ignored and the element renders unstyled, class included. That is a change: measured, a plain object used to throw Cannot read properties of undefined (reading 'length'), which took the render down and named nothing about css.

Write the block and let the transform produce the value:

const panel = @@(
  display: flex;
  gap: 8px;
);

const row = <div css={panel}>a row</div>;

If the value comes from a wrapper on another JSX library, toStyleObject from @ramonda/css is the adapter that turns a compiled block into { className, style }.

Next