puck icon indicating copy to clipboard operation
puck copied to clipboard

The Slots props type doesn't accept refs for inline mode

Open FedericoBonel opened this issue 1 month ago • 0 comments

Description

There is currently a way to pass a ref to slots, and this is also documented. However, the TypeScript Slot props type doesn't accept this prop and throws an error if passed.

Environment

  • Puck version: 0.20.2

Steps to reproduce

  1. Define a component that uses a slot in inline mode and pass the puck.dragRef to that slot.
SomeSlot: {
  fields: {
    content: { type: "slot" },
  },
  inline: true,
  render: ({ content: Content, puck }) => (
    <Content ref={puck.dragRef} />
  ),
},

What happens

TypeScript throws the following error:

Type '{ style: { height: string }; ref: (element: Element) => void }' is not assignable to type 'IntrinsicAttributes & Omit<DropZoneProps, "zone">'.
  Property 'ref' does not exist on type 'IntrinsicAttributes & Omit<DropZoneProps, "zone">'.

What I expect to happen

TypeScript should not throw an error. The Slot props type should accept ref.

Extra information

The problematic type is defined here. The props should also accept a ref.

FedericoBonel avatar Nov 25 '25 15:11 FedericoBonel