[6.x] Forms 2: Visualize Responses

[jaygeorge]

This pull request implements a Summary view for form submissions — charts and insights that visualize responses without needing to export them.

The whole feature is only available when the statamic/forms-pro addon is installed.

The Summary view

A toggle at the top of the submissions listing switches between the Submissions and Summary views. Each chartable field gets its own chart widget, and any filters or search applied to the listing narrow the summary too.

You may switch between percentages and response counts using a toggle at the top left. You can also toggle field numbering beside it.

Charts

Statamic ships with five chart types:

Chart	Default for
Pie chart	Multiple Choice
Bar chart	Checkboxes, Dropdown, Image Choice, Yes/No, Toggle, Star Rating, and free-text fields
Column chart	Number, Currency, Opinion Scale
Lollipop chart	Dictionary
Ranking	Ranking

The base Chart class does some heavy lifting in props():

• Answers are counted against the fieldtype's chart options (or options derived from the answers themselves)
• Numeric answers are binned into ranges when there are more than 10 distinct values
• Anything beyond a chart's $limit (4 pie segments, 5 bar/lollipop rows) is grouped into an "Other" item. Pie charts implement drilldownProps() so clicking the Other segment drills into a breakdown of what's inside it.

Customizing the layout

Users who can configure the form will see a Customize Charts button where they can add charts, reorder charts or switch a chart's type (any chart may be used with any field), and remove charts.

The layout is saved to the form itself, so everyone sees the same summary. A form that hasn't been customised shows every chartable field with its default chart.

Extension points

• Fieldtypes opt into the summary with three new methods on FormFieldtype: defaultChart(), chartOptions(Collection $values) (the full set of ChartOptions answers are counted against — supporting labels, icons, images and badges), and insights().
• Custom charts and insights are auto-discovered from app/FormCharts / app/FormInsights. Addons can use FormCharts / FormInsights folders, or the $formCharts / $formInsights service provider properties.
• On the frontend, a chart's Vue component (named by its $component property) receives the output of props() plus metric and accessibleLabel props, and a summary slot containing the field's insights. The core chart components (PieChart, HorizontalBarChart, VerticalBarChart, HorizontalLollipopChart) are exported from @statamic/cms/ui for addons to build on.