FeedbackSection Component

FeedbackSection

A user feedback submission form organism with category selection, message input, and success state. Perfect for bug reports, feature requests, and general feedback collection.

Basic Feedback Form

Send Feedback

Help us improve by sharing your thoughts, reporting issues, or suggesting new features.

Thank you for your feedback!

We appreciate you taking the time to help us improve.

Category *

Your Message *

Custom Categories

Report an Issue

Let us know about any problems you've encountered.

Thank you for your feedback!

We appreciate you taking the time to help us improve.

Category *

Your Message *

Usage Example

<x-interface-frameworks.feedback-section
    title="Send Feedback"
    description="Help us improve by sharing your thoughts."
    :categories="['Bug Report', 'Feature Request', 'General Feedback', 'Other']"
    action="/api/feedback"
    method="POST"
/>

Props

Prop	Type	Default	Description
title	string	'Send Feedback'	Form title
description	string	'Help us improve...'	Form description
categories	array	['Bug Report', ...]	Feedback category options
action	string\|null	null	Form action URL
method	string	'POST'	Form HTTP method
class	string	''	Additional CSS classes

Slots

Slot	Description
fields	Additional form fields to include

Accessibility Features

Form elements have proper label associations
Required fields marked with required attribute
Submit button disabled state prevents invalid submission
Success message announced to screen readers
Loading state communicated visually and semantically