measuredco / puck

The visual editor for React
https://puckeditor.com
MIT License
5.32k stars 327 forks source link

Problem overriding custom fields #569

Open BR1G00 opened 3 months ago

BR1G00 commented 3 months ago

If you try to override the inputs using the functions, "fieldLabel" or "fieldTypes", they ignore the custom fields.

Here's a little example


<Puck<Config>
   ....
    overrides={{
      fieldLabel: ({ children, label, icon, el }) => {
         return <FieldLabel label={label} icon={icon} el={el}>
             <div>SOME TEXT</div>
            {children}
        </FieldLabel>
      }
    }}
/>

export const Heading: ComponentConfig<HeadingProps> = {
  label: 'Heading',
  fields: {
    backgroundColor: {
      type: 'custom',
      label: 'Background color',
      render: ({ field, onChange, value }) => {
        return (
            <GradientColorPicker
              colors={vbLightColors}
              value={value}
              isText={false}
              onChange={(color) => {
                onChange(color as string);
              }}
            />
        );
      },
    },
...``` the field overrides ignore my backgroundColor custom component.
BR1G00 commented 4 days ago

@chrisvxd I found a workaround for this problem using FieldLabelInternal, but with the latest canary I can't export it, so this problem persists

chrisvxd commented 1 day ago

@BR1G00 right - FieldLabelInternal is not meant to be exported, so its removal is intentional. Sounds like a bug. I missed this, but marking it with the appropriate tags.