Field Editors screenshot

Field Editors

Author Avatar Theme by Contentful
Updated: 19 May 2025
151 Stars

React components and extensions for building Contentful entry editor

Categories

Overview:

The @contentful/field-editorslerna is a monorepo that contains all the field editors and apps developed by Contentful. These field editors and apps are built using the App SDK and allow users to understand how each editor works, fork existing apps, or create their own apps based on existing Contentful components’ source code. The project uses Typescript, React, Forma36 (a design system & component library by Contentful), and is managed using Lerna. Code in the repository is automatically formatted with Prettier and checked with ESLint on every commit using Git hooks.

Features:

  • Available field editors: The repository contains a variety of field editors that can be used in custom Contentful apps, including single line editor, multi line editor, dropdown, tags, list, checkbox, radio, boolean, rating, number, URL, JSON, location, date, markdown, slug, entry reference/media, and rich text.
  • Shared packages: The repository also includes shared packages that simplify the development and testing of field and entry apps.
  • GlobalStyled component: To achieve the same field editor look as in the Contentful UI, the repository provides a GlobalStyled component that needs to be rendered.

Installation:

To get started and contribute to the @contentful/field-editorslerna project, you will need the following:

  • Node.js: version >= 18
  • Yarn: version >= 1.21.1

To install all dependencies and build all packages, run the following commands from the root of the project:

npm install
npm run build

For more information on how to get started and contribute, refer to the CONTRIBUTING.md file in the repository.

Summary:

The @contentful/field-editorslerna is a collection of field editors and apps developed by Contentful. These editors are built using technologies like Typescript, React, and Forma36, and are managed using Lerna. The repository provides a variety of field editors that can be used in custom Contentful apps, along with shared packages to simplify development. Additionally, the repository includes a GlobalStyled component to achieve the same field editor look as in the Contentful UI. Installation and contribution instructions are provided in the repository’s documentation.