Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

First pass at full-form preview rendering #175

Open
wants to merge 6 commits into
base: main
Choose a base branch
from

Conversation

sergei-maertens
Copy link
Member

@sergei-maertens sergei-maertens commented Aug 15, 2024

  • Set up structure mode
  • Set up webform mode
  • Enable initial integration between edit icon and EditConfiguration

This could get merged without getting in the way :)

* The structure subtree types allow a react component to be specified,
  which will be used to render children/subtrees of a given formio
  component definition. Components that don't support child components
  do not need to provide this.
* The webform preview allows specifying a react component to use to
  display the component as a field in the full form definition. If not
  specified, the panel preview will be used. This is mostly relevant
  for components that support child components and need to render those
  recursively.
The form preview is broken out in two possible render modes, each have
their own top-level component to lock in the context and behaviours.

The structure mode is the most complex, since it will integrate with
the edit modal/form for each individual component, and the controls
for position within the component tree.
The webform preview will actually render the nested components in each
column, and applies the grid layout similar to what the SDK does. There
is no mobile toggle in this preview.

The structure preview groups the columns that are defined, and the
child components within each column.
The content component displays the configured HTML in the webform
preview.

In structure mode, because there is no label, the content is stripped
from HTML tags and truncated to show a short summary.
* in structure mode, we can simply display the template for each item,
  consisting of the nested components
* in webform mode, we currently display a single, fake nested form.
  This will however need to be updated with the add/remove controls
  and Formik's array helpers
Both simply display their nested children.
@sergei-maertens sergei-maertens changed the title Render full form preview First pass at full-form preview rendering Aug 16, 2024
@sergei-maertens sergei-maertens marked this pull request as ready for review August 16, 2024 16:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant