puck icon indicating copy to clipboard operation
puck copied to clipboard

`fieldTransforms` not working when using `resolveFields`

Open n1crack opened this issue 4 months ago • 5 comments

Description

If you use fieldTransforms with fields defined only within resolveFields, then fieldTransforms does not run for those fields.
This occurs both within plugins and when using the overrides and fieldTransforms props. It also happens with custom field types as well as built-in Puck field types.

Environment

  • Puck version: 0.20.0

Replication steps

  1. Define a field transform:
const fieldTransforms = {
  text: ({ value }) => (
    <span>Field transform: {value}</span>
  ),
};
  1. Define a component that uses that field within resolveFields (e.g., Typography.content):
const config = {
  components: {
    Typography: {
      // This applies the transform as expected:
      // fields: { content: { type: "text" } },

      // This does not:
      resolveFields: (data, { fields }) => {
        const content = { type: "text" };

        return { content };
      },
      defaultProps: {
        content: "Enter your text here...",
      },
      render: ({ content }) => <p>{content}</p>,
    },
  },
};
  1. Navigate to the editor.
  2. Drag and drop the component that uses resolveFields (Typography).

What happens

The component renders the resolved field value in the canvas, but does not apply the transform.

What I expect to happen

The component should render the transformed field value in the canvas when a fieldTransforms entry is defined for it, regardless of whether the field was defined using fields or resolveFields.

n1crack avatar Aug 26 '25 04:08 n1crack

I can confirm I can replicate this. I also edited the issue to follow our template.

FedericoBonel avatar Aug 26 '25 07:08 FedericoBonel

I can confirm I can replicate this. I also edited the issue to follow our template.

Sorry about that 😅

n1crack avatar Aug 26 '25 07:08 n1crack

It's all good!

FedericoBonel avatar Aug 26 '25 07:08 FedericoBonel

This is actually related to https://github.com/puckeditor/puck/issues/1034. The current resolveFields API needs reworking, as it is currently transient and only gets called at render-time of the fields.

I've opened https://github.com/puckeditor/puck/issues/1299 to track this centralised blocker.

chrisvxd avatar Sep 05 '25 08:09 chrisvxd

Issue #1325 also noted that contentEditable does not work when it is defined only inside resolve fields. This is due to the same underlying issue, since contentEditable fields rely on field transforms.

FedericoBonel avatar Sep 22 '25 01:09 FedericoBonel