FieldtypeFlex – Structured content with native ProcessWire Inputfields

[interrobang]

Hi everyone,

I'd like to introduce FieldtypeFlex, a new ProcessWire fieldtype I've been working on. It's now available as a 0.4.0 pre-release, and I'd be interested in feedback from the community.

The idea is to define and manage structured content within a single ProcessWire field, without having to create separate ProcessWire fields for every property.

FieldtypeFlex uses native ProcessWire Inputfields for editing, so things like TinyMCE, images, Page references, multilingual inputs and conditional fields can be used within the same structure.

Main features

• Code-defined structures: Define properties using PHP, JSON or native Inputfield objects.
• Objects: Group related properties into fixed, nested structures.
• Repeatable Rows: Create typed content blocks that editors can add, duplicate, reorder and hide. Rows can also be nested.
• Native Inputfields: Reuse familiar ProcessWire inputs, settings and validation.
• Files and images: Work with ProcessWire-compatible Pagefile and Pageimage objects, including image resizing and custom file metadata.
• Selectors: Query pages by properties inside Objects and Rows.
• Schema evolution: Unknown properties are preserved during ordinary saves, with tools for renaming and cleaning up obsolete properties.

Flex fields can also be used inside native ProcessWire Repeaters.

A small example

A field definition can look like this:

return [
    'heading' => ['type' => 'text'],
    'blocks' => [
        'type' => 'rows',
        'types' => [
            'text' => [
                'children' => [
                    'body' => ['type' => 'TinyMCE'],
                ],
            ],
            'gallery' => [
                'children' => [
                    'images' => [
                        'type' => 'image',
                        'maxFiles' => 10,
                    ],
                ],
            ],
        ],
    ],
];

The content is then accessible through the regular ProcessWire API:

echo $page->content->heading;

foreach($page->content->blocks as $block) {
    if($block->rowType() === 'text') {
        echo $block->body;
    } elseif($block->rowType() === 'gallery') {
        foreach($block->images as $image) {
            echo $image->size(800, 600)->url;
        }
    }
}

Properties inside Flex fields can also be queried using ProcessWire selectors:

$matches = $pages->find(
    'content.blocks.text.body*=ProcessWire'
);

Editor preview

Watch the short editor demo

Requirements

• ProcessWire 3.0.259+
• PHP 8.1+
• MySQL 8.0+ or MariaDB 10.11+
• InnoDB

The repository includes installation instructions, a quick start, configuration examples and an API reference.

GitHub: phlppschrr/FieldtypeFlex

I'd appreciate any feedback, bug reports or suggestions, particularly from people interested in trying it with different ProcessWire setups.

Thanks for taking a look!

[adrian]

Hey @interrobang - looks cool. I am curious, could you provide some details about the pros and cons of this compared with https://processwire.com/modules/mystique/ and https://processwire.com/blog/posts/custom-fields-module/

At the moment, I am not sure if I would know which is the right solution for a particular setup.

Thanks!

[interrobang]

Thanks! There's definitely quite a bit of overlap.

Mystique and ProFields Custom Fields cover many of the same basics.
FieldtypeFlex adds nested Objects, repeatable Rows (similar to ReapeaterMatrix), File/Image fields and more advanced selectors if you need them. 

ProFields Custom Fields has the advantage of ListerPro integration (not yet tested with FieldtypeFlex) and ProFields support from Ryan. Once repeatable properties and File/Image support are added, I'd probably prefer it over my own module. 

I built FieldtypeFlex mainly because I wanted those features now, while still using native ProcessWire Inputfields. It has a pretty extensive test suite, although it's still a pre-release.