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.