flutter_declarative_mdx_extensions 0.0.1

A collection of components to customize and extend the flutter_declarative_mdx package.

flutter_declarative_mdx_extensions

Common, production-ready MDX components for use with flutter_declarative_mdx.

This package provides a collection of reusable TagHandler implementations for frequently used input and validation scenarios — particularly for UK financial and personal data.

It is designed to be used alongside flutter_declarative_mdx and offers quick, drop-in components that can be registered via Customizations.

What This Package Provides

The extensions package contains ready-made MDX components organised by domain.

• Financial Components (/financials)
  • SortCode
  • AccountNumber
• Personal Components (/personal)
  • NiNumber

Installation

Add to your pubspec.yaml:

dependencies:
  flutter_declarative_mdx: ^latest
  flutter_declarative_mdx_extensions: ^latest

Usage

Import the extension package:

import 'package:flutter_declarative_mdx_extensions/flutter_declarative_mdx_extensions.dart';

Register the provided components via Customizations:

DeclarativeMdx.fromPageContent(
  mdxContent,
  customizations: Customizations(
    customComponents: [
      SortCodeTagHandler(),
      AccountNumberTagHandler(),
      NINumberTagHandler(),
    ],
  ),
);

Then in your markdown:

Sort Code
<SortCode name="sortCode" label="Sort code" required="true">
</SortCode>
Account Number
<AccountNumber name="accountNumber" label="Account number" required="true">
</AccountNumber>
National Insurance Number
<NINumber name="niNumber" label="National Insurance number" required="true">
</NINumber>

Design Principles

This package aims to:

• Provide sensible defaults for common UK use cases
• Keep implementations lightweight
• Avoid opinionated styling
• Integrate cleanly with ModelStateProvider
• Remain extensible and composable

It is not a full form framework, it simply provides reusable building blocks.

Model Binding

All components:

• Store raw values in the model (digits-only where appropriate)
• Perform client-side validation
• Surface errors inline
• Remain compatible with server-driven workflows

When to Use This Package

Use this extensions package when:

• You are building UK financial flows
• You need quick, consistent validation components
• You want to reduce boilerplate TagHandler code
• You are prototyping workflows rapidly

If you require deeper domain validation (e.g. modulus checking for bank accounts), you may extend these handlers.

Status

This package is evolving alongside flutter_declarative_mdx. APIs may expand as additional common components are identified.

Contributions are welcome.

Related

flutter_declarative_mdx — core rendering library