exm-form

The Exmg Form enhances form design by offering a more intuitive layout visualization, streamlining the user experience with several key features. These include:

- Automated form validity checks, ensuring data integrity
- Dynamic submit button control, which enables or disables the button based on form completeness
- JSON output capability, allowing for easy data serialization and integration
- A loading spinner, providing a visual indicator for asynchronous form submissions

Installation

``sh
npm install @exmg/exm-form
`

Example Usage

$3

`html



`js
async function doFormAction(e: CustomEvent) {
const formDialog = e.target as ExmForm;
try {
formDialog.submitting = true;
// Do server call
// Show success message
} catch (error) {
console.error(error instanceof Error ? error.message : 'Unknown error');
} finally {
formDialog.submitting = false;
}
}
`

API

$3

| Name | Type | Default | Description |
| ----------------- | --------- | -------- | --------------------------------------------------------- |
| submitBtn | string | Save | Submit button copy |
| cancelBtn | string | Cancel | Cancel button copy |
| submitting | boolean | false | Indicated form submit in progress and disables the button |
| hasAsideContent | boolean` | false | Indicated if form has a side help section |

For other options see the m3 docs:

- Material 3 Button Docs

Additional references

- Demo / Docs