Craft UX #

A Flutter package that provides a comprehensive collection of reusable UI components and utilities for building beautiful, consistent, and dynamic user interfaces with advanced form handling capabilities.

Features #

• Dynamic Form Builder: Create complex forms from JSON definitions
• HTTP Client Provider: Easy API integration with Dio
• Advanced Form Handling: Validation, conditional fields, and auto-fill
• Custom UI Components: Dropdowns, date pickers, amount fields, and more
• Provider-based State Management: Efficient state management with ChangeNotifier
• Form Validation: Built-in validation with custom rules and conditional validation
• Multi-select Dropdowns: Advanced dropdown with search and multi-selection
• Auto-fill Support: Automatic field population based on selections
• Responsive Design: Mobile-first design with customizable themes
• Type Safety: Robust type handling for form values and API responses

Getting started #

Add this to your package's pubspec.yaml file:

dependencies:
  craft_ux: ^1.0.7

Usage #

Here's a simple example of how to use the Dynamic Form:

import 'package:flutter/material.dart';
import 'package:craft_ux/craft_ux.dart';
import 'package:dio/dio.dart';

void main() {
  final dio = Dio(BaseOptions(
    baseUrl: 'https://your-api.com',
    headers: {'Authorization': 'Bearer your-token'},
  ));
  
  runApp(
    MaterialApp(
      home: DynamicForm(
        componentName: 'my_form',
        formJson: formDefinition,
        dio: dio,
        onSubmitSuccess: (data, isValid) {
          print('Form submitted: $data, Valid: $isValid');
        },
      ),
    ),
  );
}

For more examples, check out the /example directory in the repository.

Form Definition Example #

{
  "title": "User Registration",
  "sections": [
    {
      "title": "Personal Information",
      "fields": [
        {
          "name": "first_name",
          "label": "First Name",
          "fieldType": "text",
          "validation": {
            "required": true,
            "minLength": 2,
            "maxLength": 30
          }
        },
        {
          "name": "email",
          "label": "Email",
          "fieldType": "text",
          "validation": {
            "required": true,
            "regex": {
              "pattern": "^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}\$",
              "message": "Please enter a valid email address"
            }
          }
        }
      ]
    }
  ]
}

Additional information #

Documentation #

For detailed documentation, visit our documentation site.

Contributing #

We welcome contributions! Please see our contributing guide for details.

Issues and feedback #

Please file issues and feature requests on the GitHub repository.

License #

This project is licensed under the MIT License - see the LICENSE file for details.

Publishing #

Pre-publishing Checklist #

Before publishing a new version, ensure:

1. Update Version: Increment version in pubspec.yaml
2. Update CHANGELOG: Add entry for new version in CHANGELOG.md
3. Test Package: Run tests and verify functionality
4. Update Documentation: Ensure README.md is current
5. Check Dependencies: Verify all dependencies are up to date

Publishing Commands #

# 1. Validate package without publishing
dart pub publish --dry-run

# 2. Publish to pub.dev
dart pub publish

# 3. Force publish (skip some checks)
dart pub publish --force

Version Management #

• Follow semantic versioning (MAJOR.MINOR.PATCH)
• Update version in pubspec.yaml
• Document changes in CHANGELOG.md
• Tag releases in Git repository

Login to pub.dev #

dart pub login

Enter your pub.dev credentials when prompted.