Configure Fields

Melony offers a variety of field types to handle different kinds of data. Each field type has its own set of configuration options, in addition to the common options shared by all fields.

Common Field Properties

All field types in Melony share these common properties:

• label: (string) The display label for the field.
• description: (string) Additional information about the field.
• isRequired: (boolean) Whether the field is mandatory.
• isList: (boolean) Whether the field represents a list of values.
• isUnique: (boolean) Whether the field value must be unique across all records.
• isId: (boolean) Whether the field is used as the primary identifier.
• isReadOnly: (boolean) Whether the field can be edited.
• default: (any) The default value for the field.
• isDisplayField: (boolean) Whether this field should be used as the display representation of the record.
• documentation: (string) Extended documentation for the field.
• components: (object) Custom components for displaying and editing the field.
• hasAccess: (function) A function to determine if the current user has access to this field.
• filterable: (boolean) Whether the field can be used in filters.
• sortable: (boolean) Whether the field can be sorted.

Specific Field Types

TextField

• type: "text"
• maxLength: (number) Maximum allowed length of the text.
• minLength: (number) Minimum required length of the text.

NumberField

• type: "number"
• max: (number) Maximum allowed value.
• min: (number) Minimum allowed value.

CheckboxField

• type: "checkbox"

ColorField

• type: "color"

RelationshipField

• type: "relationship"
• getSuggestions: (function) Async function to fetch suggestions based on user input.
• valueAsNumber: (boolean) Whether the relationship value should be treated as a number.
• displayField: (string) The field from the related entity to use for display.
• titleKey: (string) The key to use for the title in suggestions.
• colorKey: (string) The key to use for color coding in suggestions.
• imageKey: (string) The key to use for images in suggestions.

SelectField

• type: "select"
• options: (array) An array of objects with label and value properties.

RichTextField

• type: "rich"

ImageField

• type: "image"

EmailField

• type: "email"

PasswordField

• type: "password"

Usage Example

Here's an example of how to define fields with various types and configurations:

const fields: Record<string, Field> = {
  title: {
    label: "Title",
    type: "text",
    isRequired: true,
    maxLength: 100,
    filterable: true,
    sortable: true,
  },
  description: {
    label: "Description",
    type: "rich",
    isRequired: false,
  },
  amount: {
    label: "Amount",
    type: "number",
    min: 0,
    hasAccess: async ({ user }) => {
      "use server";
      return user?.email === "admin@example.com";
    },
  },
  status: {
    label: "Status",
    type: "select",
    options: [
      { label: "Pending", value: "pending" },
      { label: "In Progress", value: "in_progress" },
      { label: "Completed", value: "completed" },
    ],
    filterable: true,
  },
  assignee: {
    label: "Assignee",
    type: "relationship",
    getSuggestions: getUserSuggestions,
    displayField: "fullName",
  },
};

This example demonstrates how to configure various field types with their specific properties, as well as common properties like filterable and sortable.