View Metadata

Overview

View metadata defines how SolidX presents models and fields to end users.

If field metadata answers "what does this field mean?", view metadata answers "how should this field appear here?"

This page is the primary reference for:

• top-level view records
• layout attrs
• field-node attrs inside layouts
• widget selection through editWidget and viewWidget
• widget-specific attrs
• real metadata examples for form, list, and tree rendering

For field semantics, validation intent, persistence behavior, and field-level attrs, see Field Metadata.

How To Read This Page

SolidX has multiple view families, but not all of them need the same kind of documentation.

• form and list are the primary homes for field widget documentation
• tree reuses the same field-column widgets as list
• card and kanban are driven more by card composition and card widgets than by per-field widget catalogs

That is why the field list is repeated here by view family. The field contract lives on the field metadata page; the rendering contract lives here.

Common View Shape

Every view record follows the same top-level pattern:

{
  "name": "application-list-view",
  "displayName": "Applications",
  "type": "list",
  "context": "{}",
  "moduleUserKey": "merchant-onboarding",
  "modelUserKey": "application",
  "layout": {
    "type": "list",
    "attrs": {},
    "children": []
  }
}

View Metadata Attributes

List View

Use list when users need a tabular view over many records.

Common list Layout Attrs

Common list Field-Node Attrs

These attrs belong to the layout node, not to the field metadata entity:

shortText

By default, shortText renders as a standard text column.

The default list renderer is DefaultTextListWidget, which is used automatically when no custom viewWidget is set. This default path also respects the list-level truncateAfter attr, so it is the main way to control truncation for long textual values in list and tree views.

{
  "type": "field",
  "attrs": {
    "name": "bankUserId",
    "isSearchable": true
  }
}

{
  "type": "field",
  "attrs": {
    "name": "paymentGatewayAccessSecret",
    "viewWidget": "maskedShortTextList",
    "sortable": true,
    "filterable": true,
    "isSearchable": true
  }
}

longText

In list and tree views, longText reuses the standard text-column path.

Unlike form rendering, longText does not currently have dedicated list or tree widgets of its own. It behaves like a text column and relies on the same shared truncation and search mechanics as other text-style scalar fields.

{
  "type": "field",
  "attrs": {
    "name": "description"
  }
}

richText

In list and tree views, richText reuses the standard text-column path.

It does not currently have dedicated list or tree widgets of its own. In these views, it behaves like a text column and relies on the same shared truncation and search mechanics as other text-style scalar fields.

{
  "type": "field",
  "attrs": {
    "name": "content",
    "label": "Content",
    "sortable": true,
    "filterable": true
  }
}

No additional list or tree widgets are currently registered specifically for richText.

json

Core form rendering is supported for json, but list and tree support is currently limited.

The core list-column dispatch does not currently include a dedicated json renderer, so JSON fields should not be assumed to have the same out-of-the-box list support as scalar text fields.

{
  "type": "field",
  "attrs": {
    "name": "deviceRecognitionVerdict"
  }
}

No dedicated core list or tree widgets are currently registered specifically for json.

int

By default, int renders as a numeric column that reuses the shared text-style cell widget while preserving numeric table alignment.

The core list-column path routes int through SolidIntColumn, which applies numeric cell styling and then renders values through DefaultTextListWidget unless a custom viewWidget is provided.

{
  "type": "field",
  "attrs": {
    "name": "pageCount",
    "label": "Page Count"
  }
}

No additional core list or tree widgets are currently registered specifically for int.

bigint

In list and tree views, bigint currently reuses the same numeric column path used for int.

The core list-column path routes bigint through SolidBigintColumn, which delegates to SolidIntColumn. As a result, bigint receives numeric table alignment but still renders through DefaultTextListWidget by default.

{
  "type": "field",
  "attrs": {
    "name": "id"
  }
}

No additional core list or tree widgets are currently registered specifically for bigint.

decimal

By default, decimal renders as a numeric column that reuses the shared text-style cell widget while preserving numeric table alignment.

The core list-column path routes decimal through SolidDecimalColumn, which delegates to the same numeric column implementation used for int. This means decimal values inherit the standard text-cell rendering behavior unless a custom viewWidget is provided.

{
  "type": "field",
  "attrs": {
    "name": "latePaymentFees",
    "sortable": true,
    "filterable": true,
    "isSearchable": true
  }
}

No additional core list or tree widgets are currently registered specifically for decimal.

boolean

By default, boolean renders as a compact true-or-false column.

The default list renderer is DefaultBooleanListWidget, which turns the stored boolean value into readable output such as Yes and No. This default path is also where column-level label overrides such as trueLabel and falseLabel are applied.

{
  "type": "field",
  "attrs": {
    "name": "isDuplicate",
    "trueLabel": "Duplicate",
    "falseLabel": "Not-Duplicate"
  }
}

No additional core list or tree widgets are currently registered specifically for boolean.

date

By default, date renders as a date-formatted column rather than as plain text.

The default list renderer is DefaultDateListWidget, which delegates value formatting to the shared date-view component. At the list level, formatting is controlled through the layout format attr.

{
  "type": "field",
  "attrs": {
    "name": "doj",
    "sortable": true
  }
}

No additional core list or tree widgets are currently registered specifically for date.

datetime

By default, datetime renders as a formatted date-time column rather than as plain text.

The default list renderer is DefaultDateTimeListWidget, which delegates value formatting to the shared date-view component with time display enabled. At the list level, formatting is controlled through the layout format attr.

{
  "type": "field",
  "attrs": {
    "name": "startTime",
    "format": "DD/MM/YYYY HH:mm:ss"
  }
}

No additional core list or tree widgets are currently registered specifically for datetime.

time

In list and tree views, time currently reuses the standard text-column path.

The core list-column dispatch sends time fields through a dedicated column wrapper, but that wrapper falls back to DefaultTextListWidget. As a result, time currently behaves more like a text field in list and tree views than like a dedicated time-only renderer.

{
  "type": "field",
  "attrs": {
    "name": "startTime",
    "format": "DD/MM/YYYY HH:mm:ss"
  }
}

No additional core list or tree widgets are currently registered specifically for time.

email

In list and tree views, email reuses the standard text-column path.

The core list-column dispatch sends email fields through the same shared renderer used for text-like scalar fields. This means email addresses inherit the standard truncation, search, and text-cell behavior rather than using a dedicated email-specific list widget.

{
  "type": "field",
  "attrs": {
    "name": "email",
    "isSearchable": true
  }
}

No additional core list or tree widgets are currently registered specifically for email.

password

Core list and tree rendering should not be assumed for password.

The core list-column dispatch does not currently include a dedicated password renderer, and password fields are generally not intended for ordinary list presentation.

{
  "type": "field",
  "attrs": {
    "name": "password"
  }
}

No additional core list or tree widgets are currently registered specifically for password.

selectionStatic

By default, selectionStatic renders as a text-style column whose visible value is derived from the authored option labels.

The list path uses DefaultTextListWidget through the shared text-column renderer. For single-select values, that shared renderer maps stored values to their human-readable labels using selectionStaticValues, so list and tree views show the authored label rather than the raw stored token.

{
  "type": "field",
  "attrs": {
    "name": "status",
    "isSearchable": true
  }
}

No additional core list or tree widgets are currently registered specifically for selectionStatic.

selectionDynamic

By default, selectionDynamic renders as a text-style column whose visible value comes directly from the data returned for the row.

Unlike selectionStatic, the core list path does not perform provider lookups or label mapping at render time. The shared text widget simply displays the current row value as supplied by the dataset.

{
  "type": "field",
  "attrs": {
    "name": "couponVenueType"
  }
}

No additional core list or tree widgets are currently registered specifically for selectionDynamic.

many-to-one

In list and tree views, many-to-one renders as one related record.

By default, the column uses DefaultRelationManyToOneListWidget, which displays the related value as an interactive text cell. When the column is enabled, the cell can open the related record directly.

{
  "type": "field",
  "attrs": {
    "name": "institute",
    "sortable": true,
    "filterable": true,
    "isSearchable": true
  }
}

{
  "type": "field",
  "attrs": {
    "viewWidget": "SolidManyToOneRelationAvatarListWidget",
    "label": "Client",
    "name": "client",
    "isSearchable": true,
    "searchField": "client.nameOfBusiness",
    "searchMatchMode": "$contains"
  }
}

one-to-many

In list and tree views, one-to-many renders as a compact summary of the related collection.

By default, the column uses DefaultRelationOneToManyListWidget, which shows the first related label and a +N indicator when additional related records are present.

{
  "type": "field",
  "attrs": {
    "name": "questionPossibleAnswersMaster",
    "label": "Possible Response",
    "isSearchable": true
  }
}

many-to-many

In list and tree views, many-to-many renders as a compact summary of the related membership set.

By default, the column uses DefaultRelationManyToManyListWidget, which shows the first related label and a +N indicator when additional related records are present.

{
  "type": "field",
  "attrs": {
    "name": "domains",
    "isSearchable": true,
    "searchField": "domains.name",
    "searchMatchMode": "$contains"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "respondentUser",
    "viewWidget": "SolidManyToManyRelationAvatarListWidget",
    "isSearchable": true
  }
}

mediaSingle

In list and tree views, mediaSingle renders as a thumbnail or file-style preview for the stored asset.

By default, the column uses DefaultMediaSingleListWidget, which shows an inline preview for image, audio, and video assets and falls back to a file-style preview for document-heavy uploads.

{
  "type": "field",
  "attrs": {
    "name": "logo",
    "sortable": true,
    "filterable": true,
    "isSearchable": true
  }
}

mediaMultiple

In list and tree views, mediaMultiple renders as a preview of the first asset plus a count for the remaining items.

By default, the column uses DefaultMediaMultipleListWidget, which shows the lead asset, adds a +N count when more files are present, and supports preview or download flows depending on the media type.

{
  "type": "field",
  "attrs": {
    "name": "payByLinkInvoiceFile"
  }
}

computed

In list and tree views, computed does not use a dedicated widget family of its own.

Instead, SolidX renders the field using the same column style that would normally be used for the computed value type, such as text, numeric, boolean, date, or datetime.

{
  "type": "field",
  "attrs": {
    "name": "transactionId"
  }
}

Tree View

Use tree when the same dataset needs to be understood hierarchically.

Tree views reuse the same field-column widgets as list views. In practice, that means the shortText widget coverage documented in the list section above also applies to tree unless a tree-specific renderer is introduced later.

Form View

Use form when users are creating, editing, or inspecting a single record.

Common form Layout Attrs

Common form Field-Node Attrs

These attrs belong to the layout node, not to the field metadata entity:

shortText

By default, shortText renders as a standard single-line text input in edit mode and as plain text in view mode.

The default edit renderer is DefaultShortTextFormEditWidget, and the default view renderer is DefaultShortTextFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "bankUserId"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "paymentGatewayAccessSecret",
    "viewWidget": "maskedShortTextForm",
    "editWidget": "maskedShortTextEdit"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "paymentGatewayAccessSecret",
    "viewWidget": "maskedShortTextForm",
    "editWidget": "maskedShortTextEdit"
  }
}

{
  "type": "field",
  "attrs": {
    "label": "Vendor Name",
    "name": "name",
    "viewWidget": "SolidShortTextFieldAvatarWidget"
  }
}

longText

By default, longText renders as a multiline text area in edit mode and as a default read-only text display in view mode.

The default edit renderer is DefaultLongTextFormEditWidget.

longText supports richer form-side rendering than list-side rendering. Depending on the chosen widget, it can be edited as plain multiline text, as a structured JSON editor, or as a code editor.

{
  "type": "field",
  "attrs": {
    "name": "description"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "templateFields",
    "editWidget": "jsonEditor",
    "viewWidget": "jsonViewer",
    "jsonSchemaShowPreview": false,
    "jsonSchema": {
      "name": {
        "required": true,
        "type": "string"
      },
      "displayName": {
        "required": true,
        "type": "string"
      },
      "datatype": {
        "required": true,
        "type": "selectionStatic",
        "allowedValues": [
          "string",
          "numeric",
          "datetime"
        ]
      },
      "description": {
        "required": true,
        "type": "longText"
      }
    }
  }
}

{
  "type": "field",
  "attrs": {
    "name": "templateFields",
    "editWidget": "jsonEditor",
    "viewWidget": "jsonViewer",
    "jsonSchemaShowPreview": false,
    "jsonSchema": {
      "name": {
        "required": true,
        "type": "string"
      },
      "displayName": {
        "required": true,
        "type": "string"
      },
      "datatype": {
        "required": true,
        "type": "selectionStatic",
        "allowedValues": [
          "string",
          "numeric",
          "datetime"
        ]
      },
      "description": {
        "required": true,
        "type": "longText"
      }
    }
  }
}

{
  "type": "field",
  "attrs": {
    "name": "defaultValue",
    "editWidget": "codeEditor",
    "editorLanguage": "json"
  }
}

richText

By default, richText renders as a rich-text editor in edit mode and as formatted HTML content in view mode.

The supported richText widget surface is intentionally simple at the moment: one default edit widget and one default view widget.

{
  "type": "field",
  "attrs": {
    "name": "content",
    "label": "content"
  }
}

No additional form widgets are currently registered specifically for richText.

json

By default, json renders in forms using a JSON-oriented code editor in both edit and view modes.

The supported core json widget surface is intentionally simple at the moment: one default edit widget and one default view widget.

{
  "type": "field",
  "attrs": {
    "name": "metadata"
  }
}

No additional core form widgets are currently registered specifically for json.

int

By default, int renders as a number input in edit mode and as a plain numeric read-only value in view mode.

The default edit path uses DefaultIntegerFormEditWidget. The default view path uses DefaultIntegerFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "pageCount"
  }
}

SolidIntegerSliderStyleFormEditWidget

{
  "type": "field",
  "attrs": {
    "name": "weightage",
    "editWidget": "integerSlider"
  }
}

No additional core form view widgets are currently registered specifically for int.

bigint

By default, bigint reuses the same whole-number editing experience as int.

The form field factory currently routes bigint through SolidIntegerField, so the default edit path uses DefaultIntegerFormEditWidget and the default view path uses DefaultIntegerFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "id"
  }
}

No additional core form widgets are currently registered specifically for bigint.

decimal

By default, decimal renders as a number input in edit mode and as a plain numeric read-only value in view mode.

The default edit path uses DefaultDecimalFormEditWidget. The default view path uses DefaultDecimalFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "latePaymentFees"
  }
}

No additional core form widgets are currently registered specifically for decimal.

boolean

By default, boolean renders as a checkbox-style control in edit mode and as a readable true-or-false value in view mode.

The default edit path resolves through the booleanCheckbox alias to SolidBooleanCheckboxStyleFormEditWidget. The default view path uses DefaultBooleanFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "isPBLEnabled",
    "checkboxLabel": "IS PBL Enabled"
  }
}

DefaultBooleanFormEditWidget

{
  "type": "field",
  "attrs": {
    "name": "discrepencyClear",
    "editWidget": "booleanSelectbox",
    "trueLabel": "Yes",
    "falseLabel": "No"
  }
}

SolidBooleanSwitchStyleFormEditWidget

{
  "type": "field",
  "attrs": {
    "name": "accessToSystem",
    "editWidget": "SolidBooleanSwitchStyleFormEditWidget"
  }
}

No additional core form view widgets are currently registered specifically for boolean.

date

By default, date renders as a date picker in edit mode and as a formatted date in view mode.

The default edit path uses DefaultDateFormEditWidget. The default view path uses DefaultDateFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "dateOfApproval",
    "label": "Date of Approval",
    "format": "DD/MM/YYYY HH:mm:ss",
    "className": "col-6"
  }
}

No additional core form widgets are currently registered specifically for date.

datetime

By default, datetime renders as a date-time picker in edit mode and as a formatted date-time value in view mode.

The default edit path uses DefaultDateTimeFormEditWidget. The default view path uses DefaultDateTimeFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "startTime",
    "format": "DD/MM/YYYY HH:mm:ss"
  }
}

No additional core form widgets are currently registered specifically for datetime.

time

By default, time renders as a time-only picker in edit mode and as a formatted time value in view mode.

The default edit path uses DefaultTimeFormEditWidget. The default view path uses DefaultTimeFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "startTime"
  }
}

No additional core form widgets are currently registered specifically for time.

email

By default, email renders as an email-oriented input in edit mode and as plain read-only text in view mode.

The default edit path uses DefaultEmailFormEditWidget. The default read-only display follows the shared plain-text view path used for text-like scalar fields.

{
  "type": "field",
  "attrs": {
    "name": "payByLinkCustomerEmailAddress"
  }
}

No additional core form widgets are currently registered specifically for email.

password

By default, password uses two different edit experiences depending on context and a masked read-only view.

When a record is being created, the default create path uses DefaultPasswordFormCreateWidget, which includes password and confirm-password inputs. When an existing record is being edited, the default edit path uses DefaultPasswordFormEditWidget, which opens a controlled change-password dialog. The default view path uses DefaultPasswordFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "password"
  }
}

No additional core form widgets are currently registered specifically for password.

selectionStatic

By default, selectionStatic renders as an autocomplete-driven picker in edit mode and as the authored label in view mode.

The default edit path uses DefaultSelectionStaticAutocompleteFormEditWidget. The default view path uses DefaultSelectionStaticFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "type"
  }
}

SolidSelectionStaticRadioFormEditWidget

Important note: this widget supports single-select only. When multiSelect or isMultiSelect is enabled, the widget reports that the render mode is not supported.

Example coming soon..

SolidSelectionStaticSelectButtonFormEditWidget

Important note: this widget supports single-select only. When multiSelect or isMultiSelect is enabled, the widget reports that the render mode is not supported.

{
  "type": "field",
  "attrs": {
    "name": "enableSeo",
    "editWidget": "SolidSelectionStaticSelectButtonFormEditWidget"
  }
}

No additional core form view widgets are currently registered specifically for selectionStatic.

selectionDynamic

By default, selectionDynamic renders as a provider-backed autocomplete in edit mode and as the current selected label or value in view mode.

The default edit path uses DefaultSelectionDynamicFormEditWidget. The default view path uses DefaultSelectionDynamicFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "couponVenueType"
  }
}

No additional core form widgets are currently registered specifically for selectionDynamic.

many-to-one

By default, many-to-one renders as an autocomplete-based relation picker in edit mode and as a simple related-value display in view mode.

The default edit path uses DefaultRelationManyToOneFormEditWidget. The default view path uses DefaultRelationManyToOneFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "institute"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "assignedTo",
    "label": "Assigned To",
    "viewWidget": "PseudoRelationManyToOneFormWidget",
    "editWidget": "PseudoRelationManyToOneFormWidget",
    "parentModelName": "employee",
    "childModelName": "frmsLead",
    "parentFieldName": "employeeName",
    "childFieldName": "assignedTo",
    "childModuleName": "frms",
    "parentModuleName": "peoples",
    "parentFieldLabels": [
      "employeeId",
      "employeeName"
    ]
  }
}

{
  "type": "field",
  "attrs": {
    "label": "Organisation",
    "name": "client",
    "viewWidget": "SolidRelationFieldAvatarFormWidget"
  }
}

one-to-many

By default, one-to-many renders as an embedded child-collection manager in both edit and view modes.

The default edit path uses DefaultRelationOneToManyFormEditWidget. The default view path uses DefaultRelationOneToManyFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "questionPossibleAnswersMaster"
  }
}

{
  "type": "custom",
  "attrs": {
    "name": "employeeDetails",
    "widget": "PseudoRelationOneToManyFormWidget",
    "parentModelName": "employee",
    "childModelName": "employeeDetail",
    "parentFieldName": "employeeId",
    "childFieldName": "employeeId",
    "inlineCreate": "false",
    "childModuleName": "peoples",
    "parentModuleName": "peoples"
  }
}

many-to-many

By default, many-to-many renders as a relation picker in edit mode and as a list-style relation browser in view mode.

The default edit path uses DefaultRelationManyToManyAutoCompleteFormEditWidget. The default view path uses DefaultRelationManyToManyListFormEditWidget.

{
  "type": "field",
  "attrs": {
    "name": "domains"
  }
}

{
  "type": "field",
  "attrs": {
    "name": "users",
    "editWidget": "DefaultRelationManyToManyCheckBoxFormEditWidget",
    "showLabel": false
  }
}

mediaSingle

By default, mediaSingle renders as a single-file upload and preview experience in edit mode and as a preview or download surface in view mode.

The default edit path uses DefaultMediaSingleFormEditWidget. The default view path uses DefaultMediaSingleFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "logo"
  }
}

mediaMultiple

By default, mediaMultiple renders as a multi-file upload and preview experience in edit mode and as a gallery-style preview or download surface in view mode.

The default edit path uses DefaultMediaMultipleFormEditWidget. The default view path uses DefaultMediaMultipleFormViewWidget.

{
  "type": "field",
  "attrs": {
    "name": "payByLinkInvoiceFile"
  }
}

computed

By default, computed renders as a read-only field and is hidden while a new record is still being created.

The default experience uses the built-in computed-field renderer for both edit and view modes.

{
  "type": "field",
  "attrs": {
    "name": "transactionId",
    "readonly": true
  }
}

Best Practices

Card And Kanban Views

card and kanban views are usually documented at the card-composition level rather than at the individual field-widget level.

They remain important view families, but they do not currently need the same per-field widget catalog that list, tree, and form need.

See Also

• Field Metadata
• Model Metadata