Adaptive Forms Core Components adaptive-forms-core-components-introduction

Availability on GitHub: The AEM Adaptive Forms Core Components are open-source and available on GitHub, along with comprehensive documentation. This makes it easier for developers to understand the components and how they work, as well as contribute to their development. The aemcomponents.dev website is also a valuable resource, where developers can see the components in action and access detailed documentation.

BEM Model for Styling: The Core Components follow the BEM (Block Element Modifier) model for styling, which is a well-established and widely used methodology for organizing CSS. This makes it easier for developers to understand how the styles are organized and how to modify them to fit their specific needs.

No Dependency on Third-Party Libraries: One of the advantages of the Core Components is that they have no dependency on third-party JavaScript libraries, including JQuery and Underscore. This makes the components faster and more lightweight, as well as easier to integrate into an existing AEM implementation.

Focus on Performance and Accessibility: The Core Components are built with performance and accessibility in mind, which is reflected in their high Google Lighthouse and web vitals scores. This makes it easier for developers to create accessible and high-performing web pages, which is increasingly important in today’s digital landscape.

Form Components in Sites 30 Template and Themes: The Core Components provide support for form components in the Sites 30 template and themes, making it easier for developers to create and customize forms within AEM.

Easier to Style: The Core Components are easier to style than their foundation component counterparts. The theme creation process is similar to Sites, with the ability to inherit the same theme/CSS from the parent Sites page. Additionally, the BEM model for styling makes it easier to understand and modify the styles.

Accessibility: Adaptive Forms Core Components support accessibility standards and guidelines to ensure that forms can be used by people with disabilities, including those using assistive technologies such as screen readers.

Versioning: You can create and manage multiple versions of a Core Components based Adaptive Forms, engage in collaborative discussions through comments, and attach annotations to specific form components, thereby enhancing the overall form-building experience.

Familiar UI elements and settings: When configuring properties for form components, you see a properties dialog looks just like the ones you are using to for WCM Core Components. This makes it quicker to find the options you need. Like WCM Core Components, for form components, the properties dialog appear in the center of the editor with clear tabs separating basic and advanced options, help text, and accessibility information – all in a tabs format for easy navigation.

Rule Editor: You can add logic and dynamic features to your forms without writing code. You can use the built-in rule editor to:

• Show or hide fields based on user choices
• Enable or disable an object
• Set a value for an object
• Perform calculations
• Set property of an object
• Validate data entry
• Invoke a service (call external functionality)
• Use built-in functions (predefined functions for common tasks)
• Use custom functions (your own code for specific needs)
• Validate fields and panels (ensure that data meets requirements)
• Validate the value of an object
• Execute functions to compute the value of an object
• Invoke a Form Data Model (FDM) service and perform an operation
• Dynamically add styles (change the appearance based on conditions)
• Create other rules (chain actions and logic)
• and more!

The rule editor does not have the code editor. You can use custom functions to add your own code for specific needs to the rule editor.

Pre-filling forms: You can automatically populate certain fields in a form with existing data when a user opens it. This saves users time and effort by eliminating the need to manually enter information that might already be available. The Core Components editor provides an OOTB pre-fill service to populate form fields with the help of a Form Data Model. You can also create custom prefill services for more complex scenarios.

Document of Record (DoR): A Document of Record (DoR) refers to a formal, printable representation of the data submitted through the form. It serves as a permanent record of the information a user entered, providing a snapshot of the submitted data in a user-friendly format, typically a PDF document. You can use the editor to easily configure a custom template or use an OOTB template to generate a DoR.

Form Data Model: An Adaptive Forms Data Model (FDM) acts as a bridge between your Adaptive Forms and your data sources. It essentially defines the structure and organization of the data that your forms collect and interact with. You can use the editor to easily connect your form with a Forms Data Model (FDM).

Form Submissions: A form submission refers to the process of users completing and sending their filled-out forms. This triggers a series of actions defined within the form’s configuration, ultimately leading to the storage or processing of the submitted data. The Adaptive Forms editor offers a variety of options for configuring form submissions. Some of the common submit actions are:

• Send email
• Invoke a Power Automate flow
• Submit to SharePoint
• Invoke a Workfront Fusion
• Submit using Form Data Model (FDM)
• Submit to Azure Blob Storage
• Submit to REST endpoint
• Submit to OneDrive
• Invoke an AEM Workflow

Adaptive Forms Core Components in Sites Page editor: You can enable and use Adaptive Forms Core Components in AEM Page Editor and AEM Experience Fragments to directly create data capture experience along with builidng a Sites page.