PHPackages neos/form-fusionrenderer - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Framework](/categories/framework) 4. / 5. neos/form-fusionrenderer ActiveNeos-package[Framework](/categories/framework) neos/form-fusionrenderer ======================== Flow Form Framework preset for Fusion based Form rendering 2.3.3(1y ago)8220.1k↓14.7%16[4 issues](https://github.com/neos/form-fusionrenderer/issues)[2 PRs](https://github.com/neos/form-fusionrenderer/pulls)2MITPHP Since Aug 29Pushed 1y ago4 watchersCompare [ Source](https://github.com/neos/form-fusionrenderer)[ Packagist](https://packagist.org/packages/neos/form-fusionrenderer)[ Fund](https://shop.neos.io/neosfunding/)[ RSS](/packages/neos-form-fusionrenderer/feed)WikiDiscussions main Synced 1mo ago READMEChangelog (10)Dependencies (3)Versions (16)Used By (2) Neos.Form.FusionRenderer ======================== [](#neosformfusionrenderer) A [Flow Form Framework](https://github.com/neos/form) preset for [Fusion](https://neos.readthedocs.io/en/stable/CreatingASite/Fusion/index.html) based Form rendering The Flow Form Framework comes with a preset that uses [Fluid](http://flowframework.readthedocs.io/en/stable/TheDefinitiveGuide/PartIII/Templating.html)to render Form Elements by default. This package allows to use `Fusion` instead to render Forms. Related Packages ---------------- [](#related-packages) Make sure to have a look at the other Flow Form Framework [Related Packages](https://github.com/neos/form/#related-packages) Usage ----- [](#usage) Install this package using [composer](https://getcomposer.org/): ``` composer require neos/form-fusionrenderer ``` > **Note:** This package requires the `neos/form` package in version 4.1 or higher Afterwards a new Form preset `fusion` is available to be used/extended. This preset extends the `default` preset of the Flow Form Framework and it comes with a Fusion prototype for each of the `default` Form Element definitions. When using it together with the `Neos.NodeTypes.Form` package the preset can be changed like this: ``` prototype(Neos.NodeTypes.Form:Form) { presetName = 'fusion' } ``` When rendering a form from Fluid, the preset can be set in the corresponding ViewHelper: ``` {namespace form=Neos\Form\ViewHelpers} ``` > **Note:** It's recommended to extend/create your own preset to adjust it to your needs See [Form Framework documentation](https://flow-form-framework.readthedocs.io/en/stable/adjusting-form-output.html#presets-explained)for more details about presets. ### Adjust the rendering [](#adjust-the-rendering) By default the `fusion` preset renders a form similar to what the `default`preset renders (if the Fluid Templates haven't been modified) with the following exceptions: - The `ImageUpload` & `FileUpload` fields won't render any inline JavaScript - The `DatePicker` field won't render a JS based date picker but use the HTML5 type attribute instead The Fusion prototypes for rendering Form Elements are expected to have the same name as the corresponding Form Element definition, including namespace. So for the `Neos.Form:SingleLineText` there is a corresponding Fusion prototype with the same name for example. Any valid Fusion object can be used and they will have access to the following context variables: - `formRuntime` The current `Neos\Form\Core\Runtime\FormRuntime` instance - `element` The actual `Neos\Form\Core\Model\FormElementInterface` instance representing the current Form Element - `containerElement` The parent `Neos\Form\Cor\Model\AbstractSection` (e.g. Section or Page) of the current Form Element All provided Form Element prototypes extend the [Neos.Form.FusionRenderer:FormElement](Resources/Private/Fusion/Core/FormElement.fusion)to make it easier to adjust the rendering for all elements. > **Tip:** Have a look at the existing Form Element Fusion Prototypes to see how simple they are **Important:** When overriding Fusion prototypes make sure that the [Package loading order](http://flowframework.readthedocs.io/en/stable/TheDefinitiveGuide/PartIII/PackageManagement.html#loading-order) is set correctly (i.e. that the package with the customizations has a dependency to the `neos/form-fusionrenderer` package) or else they might not have any effect. #### Example: Render Form Element label as placeholder [](#example-render-form-element-label-as-placeholder) To render Form Element labels as placeholders of the corresponding input field, the folling Fusion snippet works: ``` prototype(Neos.Form.FusionRenderer:FormElement) { # remove the whole label rendering label > # set the fields "placeholder" attribute to the Form Element Label fieldContainer.field.attributes.placeholder = ${element.label} } ``` ### Adding custom Form Element Types [](#adding-custom-form-element-types) This package comes with Fusion Prototypes for all Form Element definitions of the `default` preset. The real strength of the Form Framework comes with custom presets and Form Elements. #### Example: Custom Email address Form Element [](#example-custom-email-address-form-element) Rather than using the `SingleLineText` Element with the `EmailAddressValidator`it's a good idea to create a custom field for email addresses. This makes it easier to adjust the looks and behavior of the field and makes it much easier to use. First, the new Form Element definition is needed in the respective Form preset (We assume the `fusion` preset here): *Settings.yaml*: ``` Neos: Form: presets: 'fusion': formElementTypes: 'Your.Package:EmailAddress': superTypes: 'Neos.Form:FormElement': true 'Neos.Form:TextMixin': true validators: - identifier: 'Neos.Flow:EmailAddress' ``` > **Note:** In this and the following examples, feel free to replace "Your.Package" with your own package key Now that `Your.Package:EmailAddress` Form Element can be used in any Form Definition that is rendered via the `fusion` preset. Trying to render it, however, will lead to an exception: ``` The Fusion object `Your.Package:EmailAddress` is not completely defined (missing property `@class`). Most likely you didn't inherit from a basic object. ``` Let's change this. First configure FusionRenderer to include your custom Fusion code: ``` Neos: Form: FusionRenderer: fusionAutoInclude: 'Your.Package': true ``` then define the rendering in your own fusion: *EmailAddressFormElement.fusion*: ``` prototype(Your.Package:EmailAddress) < prototype(Neos.Form.FusionRenderer:FormElement) { fieldContainer { field { tagName = 'input' attributes { type = 'email' name = ${elementName} value = ${elementValue} } } } } ``` That's all. Most of the rendering logic is defined in the `Neos.Form.FusionRenderer:FormElement` object, only the tag name and some attributes have to be specified. > **Note:** In the Form Element definition we attached the `EmailAddressValidator`, so this doesn't have to be added manually. In addition we set the input type attribute to `email` which adds browser validation, too #### Example: Custom Composite Form Element [](#example-custom-composite-form-element) Another very good use for custom Form Elements are composite elements. Those are elements that render more than one input. The `Neos.Form:PasswordWithConfirmation`Form Element is one example of the `default` preset. Let's add a custom Field that renders honorific title, given name and family name fields at once. First we add the Form Element definition *Settings.yaml*: ``` Neos: Form: presets: 'fusion': formElementTypes: 'Your.Package:NameAndTitle': superTypes: 'Neos.Form:FormElement': true properties: # options for the honorific title options: 'mr': 'Mr.' 'mrs': 'Mrs.' 'dr': 'Dr.' ``` And the corresponding Fusion object to render the Form Element: *NameAndTitleFormElement.fusion*: ``` prototype(Your.Package:NameAndTitle) < prototype(Neos.Form.FusionRenderer:FormElement) { fieldContainer { field = Neos.Fusion:Join { title = Neos.Form.FusionRenderer:FormElementField { tagName = 'select' attributes { name = ${elementName + '[title]'} } content = Neos.Form.FusionRenderer:SelectOptions { itemRenderer = Neos.Fusion:Tag { tagName = 'option' attributes.value = ${optionValue} attributes.selected = ${optionSelected} content = ${optionLabel} } } } givenName = Neos.Form.FusionRenderer:FormElementField { tagName = 'input' attributes { type = 'text' name = ${elementName + '[givenName]'} value = ${elementValue.givenName} } } familyName = Neos.Form.FusionRenderer:FormElementField { tagName = 'input' attributes { type = 'text' name = ${elementName + '[familyName]'} value = ${elementValue.familyName} } } } } } ``` In this case we replace the `field` to be an `Neos.Fusion:Join`. > **Note:** The element type of the composite element will be `array`, you can refer to the individual values (e.g. in the ConfirmationFinisher message) via dot-syntax (for example `theElement.givenName`) ### Health Score 47 — FairBetter than 94% of packages Maintenance37 Infrequent updates — may be unmaintained Popularity43 Moderate usage in the ecosystem Community26 Small or concentrated contributor base Maturity71 Established project with proven stability Bus Factor1 Top contributor holds 50.7% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~253 days Recently: every ~49 days Total 12 Last Release 392d ago Major Versions 1.0.2 → 2.0.02019-11-13 ### Community Maintainers ![](https://avatars.githubusercontent.com/u/11575267?v=4)[Neos](/maintainers/neos)[@neos](https://github.com/neos) --- Top Contributors [![bwaidelich](https://avatars.githubusercontent.com/u/307571?v=4)](https://github.com/bwaidelich "bwaidelich (35 commits)")[![daniellienert](https://avatars.githubusercontent.com/u/642226?v=4)](https://github.com/daniellienert "daniellienert (10 commits)")[![markusguenther](https://avatars.githubusercontent.com/u/1014126?v=4)](https://github.com/markusguenther "markusguenther (8 commits)")[![dlubitz](https://avatars.githubusercontent.com/u/13046100?v=4)](https://github.com/dlubitz "dlubitz (7 commits)")[![fdchriswaechter](https://avatars.githubusercontent.com/u/110408213?v=4)](https://github.com/fdchriswaechter "fdchriswaechter (2 commits)")[![kdambekalns](https://avatars.githubusercontent.com/u/95873?v=4)](https://github.com/kdambekalns "kdambekalns (2 commits)")[![theilm](https://avatars.githubusercontent.com/u/1016315?v=4)](https://github.com/theilm "theilm (1 commits)")[![c4ll-m3-j4ck](https://avatars.githubusercontent.com/u/7119811?v=4)](https://github.com/c4ll-m3-j4ck "c4ll-m3-j4ck (1 commits)")[![mhsdesign](https://avatars.githubusercontent.com/u/85400359?v=4)](https://github.com/mhsdesign "mhsdesign (1 commits)")[![midalmis](https://avatars.githubusercontent.com/u/45658374?v=4)](https://github.com/midalmis "midalmis (1 commits)")[![christophengelmayer](https://avatars.githubusercontent.com/u/3295750?v=4)](https://github.com/christophengelmayer "christophengelmayer (1 commits)") --- Tags formfusionhacktoberfest ### Embed Badge ![Health badge](/badges/neos-form-fusionrenderer/health.svg) ``` [![Health](https://phpackages.com/badges/neos-form-fusionrenderer/health.svg)](https://phpackages.com/packages/neos-form-fusionrenderer) ``` ### Alternatives [laravel/framework The Laravel Framework. 34.7k509.9M17.0k](/packages/laravel-framework)[shopware/platform The Shopware e-commerce core 3.3k1.5M3](/packages/shopware-platform)[magento/community-edition Magento 2 (Open Source) 12.1k52.1k10](/packages/magento-community-edition)[drupal/core Drupal is an open source content management platform powering millions of websites and applications. 19562.3M1.3k](/packages/drupal-core)[sulu/sulu Core framework that implements the functionality of the Sulu content management system 1.3k1.3M152](/packages/sulu-sulu)[silverstripe/framework The SilverStripe framework 7213.5M2.5k](/packages/silverstripe-framework) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)