Version 4 of Elemental introduces some breaking changes which developers should be aware of.
These changes have been made in order to support Elemental transitioning from a PHP GridField based CMS interface into a React JavaScript interface using the SilverStripe GraphQL API as the backend. The data model and relationships remain largely the same.
ElementalEditor
no longer exists. Types of blocks that can be edited are now defined on the field
(ElementalAreaField
) itself. You can get an ElementalAreaField
by creating one directly:
use DNADesign\Elemental\Forms\ElementalAreaField;
use DNADesign\Elemental\Models\ElementContent;
$area = $page->ElementalArea();
$allowedElements = [ElementContent::class];
$field = ElementalAreaField::create('editor', $area, $allowedElements);
ElementalAreaField
still extends GridField
but this is only used to provide a GridFieldDetailForm
. In order to
customise components of the elemental editor in the CMS, developers must now use the JavaScript Injector and apply React
higher order components to transform the behaviour of individual components.
For more information, see here.
All SiteTree
instances now have the elemental SiteTreeExtension
extension applied (regardless of where you
apply ElementalPageExtension
), in order to provide a consistent API surface for accessing the associated
ElementalArea
(required for GraphQL queries). Developers using more ElementalArea relations than the default will
need to add similar extensions, as well as augment the GraphQL query at
client/src/state/editor/readBlocksForPageQuery.js
.