webiny-api-cms-content-models

name

webiny-api-cms-content-models

description

Creating Headless CMS content models via code using the ModelFactory pattern. Use this skill when the developer wants to create, modify, or understand content model definitions, define fields and validators, set up reference fields between models, configure field layouts (including nested layouts inside object or dynamicZone fields), pick the correct Admin UI renderer for a field type (textInput/textInputs, lexicalEditor/lexicalEditors, file/files, objectAccordionSingle/objectAccordionMultiple, etc.), or work with the ModelFactory builder API. Also covers field types (text, longText, number, boolean, datetime, asset, file, ref, object, richText, dynamicZone), list (array) fields via .list() and the singular-vs-plural renderer rule, validation (required, unique, email, pattern, minLength, maxLength, gte, predefinedValues), single-entry (singleton) models via .singleEntry(), model/field tags via .tags(), and field rules via .rules() for access-control and conditional visibility/editability. Includes the correct `fields` projection syntax when querying entries via the SDK: `ref` fields use double-`values.` nesting (e.g. `values.author.values.name`) because they resolve to another entry, while `object` and `dynamicZone` sub-fields are inline and use a single `values.` (e.g. `values.author.name`) — getting this wrong silently returns null.

Creating Content Models via Code

TL;DR

Content models are created using the ModelFactory pattern. You define a class implementing ModelFactory.Interface, use the fluent ModelFactory.Builder API to declare fields, validators, layout, and API names, then export with ModelFactory.createImplementation(). Register in webiny.config.tsx as <Api.Extension>.

The ModelFactory Pattern

Every code-based content model follows the same structure:

import { ModelFactory }  ;

   . {
   () {
     [
      builder
        .({ : , : , :  })
        .()
        .( ({
          
        }))
        .([])
        .()
        .()
        .()
    ];
  }
}

  .({
  : ,
  : []
});