#beforeChange throws Error on field

1 messages · Page 1 of 1 (latest)

minor anvil
#

Code:
export const PillBlock: Block = {
slug: "PillBlock",
labels: {
singular: "Pill",
plural: "Pills",
},
fields: [
{ name: "title", type: "text", required: true },
backgroundColor({
overrides: { label: "colorClassName ", required: true, name: "colorClassName" },
}),
backgroundColor({
overrides: { label: "colorDarkClassName", required: true, name: "colorDarkClassName" },
}),
backgroundColor({
overrides: { label: "textColorClassName ", required: true, name: "textColorClassName" },
}),
backgroundColor({
overrides: {
label: "textColorDarkClassName",
required: true,
name: "textColorDarkClassName",
hooks: {
beforeChange: [
args => {
console.log(args);

          const pill = args.data!.pills!.find(
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            (el: { id: any }) => el.id === args.siblingData.id
          );
          pill!.textColorDarkClassName = "dark:text-" + args.value;
          return args.data;
        },
      ],
    },
  },
}),

],
};

export const TechnologyCardCms: CollectionConfig = {
.....
{
name: "pills",
type: "blocks",
minRows: 1,
maxRows: 3,
blocks: [PillBlock],
},

],
};

I am trying to add a string to the value before it gets send to db. But i am getting a "Maximum call stack size exceeded" Error, which i guess means something is calling itself. I Have also tried just returning args.data but i am getting the same result.

somber jasperBOT
minor anvil
#

Also besides this, is there a cleaner way that i should go about sending colors when i want to use tailwind?