New custom JSON field type example

I’ve been unsuccessfully trying to write a plugin with a custom collection field type for a week (my first NocoBase plugin).

The closest example I found is the @nocobase/map-plugin. It uses JSON to store the field value(s). For example Circle is stored as [value.x, value.y, value.radius] in a JSON column in a database.

What I would like to achieve is a simplified plugin which doesn’t use the Map visualization but instead uses 3 Input components to enter the three values for a Circle: value.x, value.y, value.radius. Something like this:

const CircleEditable: FC<CircleProps> = ({ value, disabled, onChange, ...otherProps }) => {
  return (
    <Space direction="vertical" align="center">
      <Input maxLength={60} value={value.x} disabled={disabled} />
      <Input maxLength={60} value={value.y} disabled={disabled} />
      <Input maxLength={60} value={value.radius} disabled={disabled} />
    </Space>
  );
};

This simple example of a custom field type could be used in the documentation but I’m willing to sponsor it if somebody is willing to create it.

I would expect that a copy of the @nocobase/map-plugin could be used and replacing its Map components with a simpler text-input-only Circle component. I would expect that changes are required only in the client part of the plugin.

Is anybody up to the task? I guess we can use the direct messages to communicate the payment details.