After a recent publish from Plasmic Studio, I got a deployment error Type error: Type 'Ref<HTMLElement> | undefined' is not assignable to type 'LegacyRef<HTMLDivElement> | undefined'.
It seems to be related to my navigation component (a Plasmic Studio-made component containing the built-in plasmic_nav
component), but I don’t think I had made any relevant code/database changes so I’m puzzled as to what’s going on.
did you manage to figure this out? having the same issue
I hadn’t - hoping someone will respond
can you paste your TopNavNew.tsx?
// This is a skeleton starter React component generated by Plasmic.
// This file is owned by you, feel free to edit as you see fit.
import * as React from "react";
import {
PlasmicTopNavNew,
DefaultTopNavNewProps
} from "./plasmic/swingon_swing/PlasmicTopNavNew";
import { HTMLElementRefOf } from "@plasmicapp/react-web";
// Your component props start with props for variants and slots you defined
// in Plasmic, but you can add more here, like event handlers that you can
// attach to named nodes in your component.
//
// If you don't want to expose certain variants or slots as a prop, you can use
// Omit to hide them:
//
// interface TopNavNewProps extends Omit<DefaultTopNavNewProps, "hideProps1"|"hideProp2"> {
// // etc.
// }
//
// You can also stop extending from DefaultTopNavNewProps altogether and have
// total control over the props for your component.
export interface TopNavNewProps extends DefaultTopNavNewProps { }
function TopNavNew_(props: TopNavNewProps, ref: HTMLElementRefOf<"nav">) {
// Use PlasmicTopNavNew to render this component as it was
// designed in Plasmic, by activating the appropriate variants,
// attaching the appropriate event handlers, etc. You
// can also install whatever React hooks you need here to manage state or
// fetch data.
//
// Props you can pass into PlasmicTopNavNew are:
// 1. Variants you want to activate,
// 2. Contents for slots you want to fill,
// 3. Overrides for any named node in the component to attach behavior and data,
// 4. Props to set on the root node.
//
// By default, we are just piping all TopNavNewProps here, but feel free
// to do whatever works for you.
return <PlasmicTopNavNew root={{ ref }} {...props} />;
}
const TopNavNew = React.forwardRef(TopNavNew_);
export default TopNavNew;
I think you just need to switch HTMLElementRefOf<"nav">
to whatever the current root element type is… This file is owned by you so you are free to edit it
Thanks @chungwu!
Changing HTMLElementRefOf<"nav">
to HTMLElementRefOf<"div">
did the trick~ (@wispy_wildebeest)
In retrospect, I must have added a parent div
to my component in Plasmic Studio, but the plasmicops bot didn’t update the component in my codebase