From 18de89b73dccf2cca7cb80f8d053136011fbbcf1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jesu=CC=81s=20Pe=CC=81rez?= Date: Thu, 18 Dec 2025 01:11:17 +0000 Subject: [PATCH] chore: add examples --- examples/01-basic/README.md | 36 +++ examples/01-basic/base_from.toml | 47 +++ examples/01-basic/debug_simple.toml | 17 ++ examples/01-basic/form.toml | 47 +++ .../01-basic/form_with_grouped_items.toml | 143 ++++++++++ examples/01-basic/form_with_sections.toml | 123 ++++++++ examples/02-advanced/README.md | 62 ++++ examples/02-advanced/conditional_form.toml | 99 +++++++ .../02-advanced/conditional_required_demo.rs | 80 ++++++ .../02-advanced/conditional_sections.toml | 161 +++++++++++ examples/02-advanced/display_items_demo.toml | 78 +++++ examples/03-styling/README.md | 45 +++ examples/03-styling/custom_border_form.toml | 43 +++ examples/03-styling/fancy_borders_form.toml | 57 ++++ examples/04-backends/README.md | 54 ++++ examples/04-backends/cli/README.md | 37 +++ .../04-backends/cli/autocompletion_demo.rs | 247 ++++++++++++++++ examples/04-backends/tui/README.md | 47 +++ .../tui/form_with_autocompletion.rs | 244 ++++++++++++++++ examples/04-backends/tui/tui_survey_form.toml | 194 +++++++++++++ examples/04-backends/web/README.md | 58 ++++ .../web/web_registration_form.toml | 269 ++++++++++++++++++ examples/05-fragments/README.md | 60 ++++ examples/05-fragments/agreement_section.toml | 45 +++ .../05-fragments/custom_border_section.toml | 25 ++ .../05-fragments/employee_info_section.toml | 52 ++++ examples/05-fragments/enterprise_section.toml | 38 +++ .../05-fragments/fancy_border_section.toml | 34 +++ .../form_with_groups_includes.toml | 48 ++++ examples/05-fragments/header.toml | 15 + examples/05-fragments/premium_section.toml | 25 ++ examples/05-fragments/support_section.toml | 31 ++ examples/06-integrations/README.md | 29 ++ examples/06-integrations/i18n/README.md | 85 ++++++ .../i18n/registration_i18n.toml | 54 ++++ .../06-integrations/i18n/test_i18n_form.toml | 18 ++ examples/06-integrations/nickel/README.md | 69 +++++ .../06-integrations/nickel/nickel_schema.ncl | 81 ++++++ .../nickel/nickel_template.ncl.j2 | 56 ++++ examples/09-templates/README.md | 74 +++++ .../employee_onboarding/README.md | 112 ++++++++ .../employee_onboarding_form.toml | 30 ++ .../09-templates/library_catalog/README.md | 187 ++++++++++++ .../library_catalog/library_example.rs | 83 ++++++ .../09-templates/onboarding_template.toml | 57 ++++ .../09-templates/user_registration/README.md | 128 +++++++++ .../user_registration/registration_form.toml | 48 ++++ .../user_registration_form.toml | 63 ++++ examples/README.md | 242 ++++++++++++++++ 49 files changed, 3977 insertions(+) create mode 100644 examples/01-basic/README.md create mode 100644 examples/01-basic/base_from.toml create mode 100644 examples/01-basic/debug_simple.toml create mode 100644 examples/01-basic/form.toml create mode 100644 examples/01-basic/form_with_grouped_items.toml create mode 100644 examples/01-basic/form_with_sections.toml create mode 100644 examples/02-advanced/README.md create mode 100644 examples/02-advanced/conditional_form.toml create mode 100644 examples/02-advanced/conditional_required_demo.rs create mode 100644 examples/02-advanced/conditional_sections.toml create mode 100644 examples/02-advanced/display_items_demo.toml create mode 100644 examples/03-styling/README.md create mode 100644 examples/03-styling/custom_border_form.toml create mode 100644 examples/03-styling/fancy_borders_form.toml create mode 100644 examples/04-backends/README.md create mode 100644 examples/04-backends/cli/README.md create mode 100644 examples/04-backends/cli/autocompletion_demo.rs create mode 100644 examples/04-backends/tui/README.md create mode 100644 examples/04-backends/tui/form_with_autocompletion.rs create mode 100644 examples/04-backends/tui/tui_survey_form.toml create mode 100644 examples/04-backends/web/README.md create mode 100644 examples/04-backends/web/web_registration_form.toml create mode 100644 examples/05-fragments/README.md create mode 100644 examples/05-fragments/agreement_section.toml create mode 100644 examples/05-fragments/custom_border_section.toml create mode 100644 examples/05-fragments/employee_info_section.toml create mode 100644 examples/05-fragments/enterprise_section.toml create mode 100644 examples/05-fragments/fancy_border_section.toml create mode 100644 examples/05-fragments/form_with_groups_includes.toml create mode 100644 examples/05-fragments/header.toml create mode 100644 examples/05-fragments/premium_section.toml create mode 100644 examples/05-fragments/support_section.toml create mode 100644 examples/06-integrations/README.md create mode 100644 examples/06-integrations/i18n/README.md create mode 100644 examples/06-integrations/i18n/registration_i18n.toml create mode 100644 examples/06-integrations/i18n/test_i18n_form.toml create mode 100644 examples/06-integrations/nickel/README.md create mode 100644 examples/06-integrations/nickel/nickel_schema.ncl create mode 100644 examples/06-integrations/nickel/nickel_template.ncl.j2 create mode 100644 examples/09-templates/README.md create mode 100644 examples/09-templates/employee_onboarding/README.md create mode 100644 examples/09-templates/employee_onboarding/employee_onboarding_form.toml create mode 100644 examples/09-templates/library_catalog/README.md create mode 100644 examples/09-templates/library_catalog/library_example.rs create mode 100644 examples/09-templates/onboarding_template.toml create mode 100644 examples/09-templates/user_registration/README.md create mode 100644 examples/09-templates/user_registration/registration_form.toml create mode 100644 examples/09-templates/user_registration/user_registration_form.toml create mode 100644 examples/README.md diff --git a/examples/01-basic/README.md b/examples/01-basic/README.md new file mode 100644 index 0000000..9f9576f --- /dev/null +++ b/examples/01-basic/README.md @@ -0,0 +1,36 @@ +# Basic Forms + +Simple form examples for getting started with typedialog. + +## Files + +- **form.toml** - Minimal form structure +- **form_with_sections.toml** - Organizing fields into sections +- **form_with_grouped_items.toml** - Grouping related fields +- **base_from.toml** - Base template for extending forms +- **debug_simple.toml** - Simple form for testing/debugging + +## Usage + +### CLI Backend +```bash +cargo run --example form +``` + +### TUI Backend +```bash +cargo run -p typedialog-tui --example tui_survey_form +``` + +### Web Backend +Build your form in TOML and serve with the web backend: +```bash +cargo run -p typedialog-web -- --config form.toml +``` + +## Features Demonstrated + +- Basic field definitions +- Sections and grouping +- Simple validation +- TOML syntax basics diff --git a/examples/01-basic/base_from.toml b/examples/01-basic/base_from.toml new file mode 100644 index 0000000..06ef64a --- /dev/null +++ b/examples/01-basic/base_from.toml @@ -0,0 +1,47 @@ +name = "Simple Contact Form" +description = "A basic contact form with all field types" + +[[fields]] +name = "name" +type = "text" +prompt = "Your name" +placeholder = "John Doe" +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "Your email" +placeholder = "john@example.com" +required = true + +[[fields]] +name = "subject" +type = "text" +prompt = "Subject" +required = true + +[[fields]] +name = "message" +type = "editor" +prompt = "Your message" +file_extension = "txt" + +[[fields]] +name = "priority" +type = "select" +prompt = "Priority level" +options = ["Low", "Medium", "High", "Urgent"] +required = true + +[[fields]] +name = "category" +type = "multiselect" +prompt = "Message categories" +options = ["Bug Report", "Feature Request", "Documentation", "Other"] + +[[fields]] +name = "newsletter" +type = "confirm" +prompt = "Subscribe to updates?" +default = false diff --git a/examples/01-basic/debug_simple.toml b/examples/01-basic/debug_simple.toml new file mode 100644 index 0000000..b46c2c5 --- /dev/null +++ b/examples/01-basic/debug_simple.toml @@ -0,0 +1,17 @@ +name = "Simple Debug Form" +description = "Two fields to test form execution flow" +locale = "en-US" + +[[fields]] +name = "first_name" +type = "text" +prompt = "First Name" +required = true +order = 1 + +[[fields]] +name = "last_name" +type = "text" +prompt = "Last Name" +required = true +order = 2 diff --git a/examples/01-basic/form.toml b/examples/01-basic/form.toml new file mode 100644 index 0000000..06ef64a --- /dev/null +++ b/examples/01-basic/form.toml @@ -0,0 +1,47 @@ +name = "Simple Contact Form" +description = "A basic contact form with all field types" + +[[fields]] +name = "name" +type = "text" +prompt = "Your name" +placeholder = "John Doe" +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "Your email" +placeholder = "john@example.com" +required = true + +[[fields]] +name = "subject" +type = "text" +prompt = "Subject" +required = true + +[[fields]] +name = "message" +type = "editor" +prompt = "Your message" +file_extension = "txt" + +[[fields]] +name = "priority" +type = "select" +prompt = "Priority level" +options = ["Low", "Medium", "High", "Urgent"] +required = true + +[[fields]] +name = "category" +type = "multiselect" +prompt = "Message categories" +options = ["Bug Report", "Feature Request", "Documentation", "Other"] + +[[fields]] +name = "newsletter" +type = "confirm" +prompt = "Subscribe to updates?" +default = false diff --git a/examples/01-basic/form_with_grouped_items.toml b/examples/01-basic/form_with_grouped_items.toml new file mode 100644 index 0000000..47abca0 --- /dev/null +++ b/examples/01-basic/form_with_grouped_items.toml @@ -0,0 +1,143 @@ +name = "Form with Grouped Display Items" +description = "Demonstrates grouping related display items together" + +# Main header (no group - always shown) +[[items]] +name = "main_header" +type = "header" +title = "āœØ Grouped Items Example" +border_top = true +border_bottom = true +align = "center" + +# Account selection +[[fields]] +name = "account_type" +type = "select" +prompt = "Select account type" +options = ["Personal", "Premium", "Enterprise"] +required = true + +# PREMIUM GROUP - All these items are grouped together +[[items]] +name = "premium_header" +type = "section" +title = "šŸŒŸ Premium Features" +group = "premium" +when = "account_type == Premium" +border_top = true + +[[items]] +name = "premium_features" +type = "section" +content = "āœ“ Unlimited storage\nāœ“ Advanced analytics\nāœ“ Priority support\nāœ“ Custom branding" +group = "premium" +when = "account_type == Premium" + +[[items]] +name = "premium_price" +type = "section" +content = "Pricing: $29/month" +group = "premium" +when = "account_type == Premium" +border_bottom = true + +[[fields]] +name = "premium_payment" +type = "select" +prompt = "Payment method" +options = ["Credit Card", "Bank Transfer", "PayPal"] +when = "account_type == Premium" +required = true + +# ENTERPRISE GROUP - All these items grouped together +[[items]] +name = "enterprise_header" +type = "section" +title = "šŸ›ļø Enterprise Solution" +group = "enterprise" +when = "account_type == Enterprise" +border_top = true + +[[items]] +name = "enterprise_features" +type = "section" +content = "āœ“ Unlimited everything\nāœ“ Dedicated support\nāœ“ Custom integration\nāœ“ SLA guarantee\nāœ“ On-premise option" +group = "enterprise" +when = "account_type == Enterprise" + +[[items]] +name = "enterprise_note" +type = "section" +content = "āš ļø Requires enterprise agreement" +group = "enterprise" +when = "account_type == Enterprise" + +[[items]] +name = "enterprise_contact_info" +type = "section" +content = "Contact our sales team for pricing" +group = "enterprise" +when = "account_type == Enterprise" +border_bottom = true + +[[fields]] +name = "enterprise_contact_email" +type = "text" +prompt = "Your email" +when = "account_type == Enterprise" +required = true + +# SUPPORT GROUP - Organized support options +[[items]] +name = "support_section_header" +type = "section" +title = "šŸ“ž Support Options" +group = "support" +border_top = true + +[[items]] +name = "support_info" +type = "section" +content = "Choose your preferred support level" +group = "support" + +[[fields]] +name = "support_level" +type = "select" +prompt = "Support Level" +options = ["Basic", "Standard", "Premium"] +group = "support" +required = true + +[[items]] +name = "support_footer" +type = "section" +content = "Support is available 24/7" +group = "support" +border_bottom = true + +# FINAL GROUP - Completion items +[[items]] +name = "final_header" +type = "section" +title = "āœ… Complete Registration" +group = "final" +border_top = true + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "I agree to the terms and conditions" +group = "final" +required = true + +[[items]] +name = "final_cta" +type = "cta" +title = "Ready?" +content = "Click submit to complete your registration" +group = "final" +align = "center" +border_top = true +border_bottom = true diff --git a/examples/01-basic/form_with_sections.toml b/examples/01-basic/form_with_sections.toml new file mode 100644 index 0000000..d2a64e2 --- /dev/null +++ b/examples/01-basic/form_with_sections.toml @@ -0,0 +1,123 @@ +name = "Professional Service Registration" +description = "Multi-section registration form with headers and CTAs" + +# Header section +[[items]] +name = "main_header" +type = "header" +title = "šŸŽÆ Professional Services Registration" +border_top = true +border_bottom = true +align = "center" + +# Welcome section +[[items]] +name = "welcome" +type = "section" +content = "Welcome to our professional services platform. Please fill in your information to get started." + +# Contact information section header +[[items]] +name = "contact_header" +type = "section_header" +title = "šŸ“‹ Contact Information" +border_top = true +margin_left = 0 + +# Contact fields +[[fields]] +name = "full_name" +type = "text" +prompt = "Full Name" +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "Email Address" +required = true + +[[fields]] +name = "phone" +type = "text" +prompt = "Phone Number" +required = false + +# Services section +[[items]] +name = "services_header" +type = "section_header" +title = "šŸ”§ Services Selection" +border_top = true +margin_left = 0 + +[[fields]] +name = "primary_service" +type = "select" +prompt = "Primary Service Needed" +options = ["Consulting", "Development", "Design", "Support"] +required = true + +[[fields]] +name = "additional_services" +type = "multiselect" +prompt = "Additional Services" +options = ["Training", "Documentation", "Maintenance", "Security Audit"] + +# Preferences section +[[items]] +name = "prefs_header" +type = "section_header" +title = "āš™ļø Preferences" +border_top = true +margin_left = 0 + +[[fields]] +name = "experience_level" +type = "select" +prompt = "Your Experience Level" +options = ["Beginner", "Intermediate", "Advanced", "Expert"] + +[[fields]] +name = "preferred_contact" +type = "select" +prompt = "Preferred Contact Method" +options = ["Email", "Phone", "Video Call"] + +# Agreement section +[[items]] +name = "agreement_header" +type = "section_header" +title = "šŸ“œ Agreement" +border_top = true +margin_left = 0 + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "I agree to the terms and conditions" +default = false +required = true + +[[fields]] +name = "agree_privacy" +type = "confirm" +prompt = "I agree to the privacy policy" +default = false +required = true + +[[fields]] +name = "marketing_consent" +type = "confirm" +prompt = "I consent to receive marketing communications" +default = false + +# Footer with CTA +[[items]] +name = "final_cta" +type = "cta" +title = "Thank you for your information!" +content = "Click submit to complete your registration." +border_top = true +border_bottom = true +align = "center" diff --git a/examples/02-advanced/README.md b/examples/02-advanced/README.md new file mode 100644 index 0000000..8f5d863 --- /dev/null +++ b/examples/02-advanced/README.md @@ -0,0 +1,62 @@ +# Advanced Features + +Examples showcasing conditional logic, dynamic fields, and complex forms. + +## Files + +### Conditional Logic +- **conditional_form.toml** - Fields that show/hide based on conditions +- **conditional_sections.toml** - Sections visible based on form state +- **conditional_required_demo.rs** - Programmatic example with conditional validation + +### Dynamic Display +- **display_items_demo.toml** - Complex item rendering and formatting + +## Usage + +### TOML Forms (CLI/Web) +```bash +# CLI +cargo run --example conditional_form + +# Web +cargo run -p typedialog-web -- --config conditional_form.toml +``` + +### Rust Examples (with full control) +```bash +cargo run --example conditional_required_demo +``` + +## Features Demonstrated + +- **Conditional visibility** - Show/hide fields based on other fields +- **Conditional requirements** - Change validation rules dynamically +- **Section collapsing** - Organize complex forms hierarchically +- **Custom display logic** - Complex field rendering +- **State management** - Track form state and dependencies + +## Patterns + +### Conditional Field Example +```toml +[fields.experience] +type = "select" +label = "Experience Level" +options = ["Junior", "Senior"] + +[fields.years] +type = "number" +label = "Years of Experience" +visible_when = { experience = "Senior" } +required_when = { experience = "Senior" } +``` + +### Conditional Section Example +```toml +[sections.advanced_options] +visible_when = { show_advanced = true } + +[sections.advanced_options.fields.custom_setting] +type = "text" +``` diff --git a/examples/02-advanced/conditional_form.toml b/examples/02-advanced/conditional_form.toml new file mode 100644 index 0000000..549a7a2 --- /dev/null +++ b/examples/02-advanced/conditional_form.toml @@ -0,0 +1,99 @@ +name = "User Account Setup" +description = "Setup account with conditional fields based on user type" + +# First, select account type +[[fields]] +name = "account_type" +type = "select" +prompt = "What type of account do you want?" +options = ["Personal", "Business", "Developer"] +required = true + +# Business name is only shown if account_type == Business +[[fields]] +name = "business_name" +type = "text" +prompt = "Enter your business name" +placeholder = "Acme Corporation" +when = "account_type == Business" +required = true + +# Business registration is only needed for Business +[[fields]] +name = "business_registration" +type = "text" +prompt = "Business registration number" +placeholder = "123-456-789" +when = "account_type == Business" + +# Developer specific fields +[[fields]] +name = "github_username" +type = "text" +prompt = "GitHub username (optional)" +when = "account_type == Developer" + +[[fields]] +name = "preferred_language" +type = "select" +prompt = "Preferred programming language" +options = ["Rust", "Python", "Go", "Java", "JavaScript"] +when = "account_type == Developer" + +# Email (required for all) +[[fields]] +name = "email" +type = "text" +prompt = "Email address" +placeholder = "user@example.com" +required = true + +# Enable 2FA +[[fields]] +name = "enable_2fa" +type = "confirm" +prompt = "Enable two-factor authentication?" +default = true +required = true + +# 2FA method only if enabled +[[fields]] +name = "2fa_method" +type = "select" +prompt = "Choose 2FA method" +options = ["TOTP", "SMS", "Email"] +when = "enable_2fa == true" +required = true + +# Phone number for SMS 2FA +[[fields]] +name = "phone_number" +type = "text" +prompt = "Phone number (for SMS 2FA)" +placeholder = "+1234567890" +when = "2fa_method == SMS" +required = true + +# Newsletter subscription +[[fields]] +name = "subscribe_newsletter" +type = "confirm" +prompt = "Subscribe to our newsletter?" +default = false + +# Newsletter frequency (only if subscribed) +[[fields]] +name = "newsletter_frequency" +type = "select" +prompt = "How often would you like to receive newsletters?" +options = ["Weekly", "Monthly", "Quarterly"] +when = "subscribe_newsletter == true" +required = true + +# Terms and conditions (always required) +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "I agree to the terms and conditions *" +default = false +required = true diff --git a/examples/02-advanced/conditional_required_demo.rs b/examples/02-advanced/conditional_required_demo.rs new file mode 100644 index 0000000..466d76d --- /dev/null +++ b/examples/02-advanced/conditional_required_demo.rs @@ -0,0 +1,80 @@ +//! Conditional and Required Fields Demonstration +//! +//! This example demonstrates: +//! 1. Required fields (marked with * - must be filled) +//! 2. Optional fields (can be skipped by pressing Enter) +//! 3. Conditional fields (only shown if condition is met) +//! +//! Run with: cargo run --example conditional_required_demo + +use typedialog::form_parser; + +fn main() -> typedialog::Result<()> { + println!("ā•”ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•—"); + println!("ā•‘ Conditional & Required Fields Demonstration ā•‘"); + println!("ā•šā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•\n"); + + println!("šŸ“‹ FEATURES:\n"); + println!(" āœ“ Required fields (*) - Must have a value"); + println!(" āœ“ Optional fields - Can be empty (press Enter)"); + println!(" āœ“ Conditional fields - Only shown when conditions are met\n"); + + println!("šŸ’” TRY THIS:\n"); + println!(" 1. Select 'Business' as account type"); + println!(" 2. Notice: Business name field appears"); + println!(" 3. Enable 2FA"); + println!(" 4. Select '2FA method'"); + println!(" 5. If you select 'SMS', phone number field appears\n"); + + println!("ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€ā”€\n"); + + // Load and execute the conditional form + let form = form_parser::load_from_file("examples/conditional_form.toml")?; + let results = form_parser::execute(form)?; + + // Display results + println!("\nā•”ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•—"); + println!("ā•‘ Form Completed! ā•‘"); + println!("ā•šā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•\n"); + + println!("šŸ“Š Submitted Values:\n"); + + // Create a nice display of results + for (key, value) in &results { + match value { + serde_json::Value::String(s) => { + println!(" {} = \"{}\"", key, s); + } + serde_json::Value::Bool(b) => { + let icon = if *b { "āœ“" } else { "āœ—" }; + println!(" {} = {} ({})", key, b, icon); + } + serde_json::Value::Array(arr) => { + println!(" {} = [", key); + for item in arr { + if let serde_json::Value::String(s) = item { + println!(" \"{}\"", s); + } + } + println!(" ]"); + } + _ => { + println!(" {} = {}", key, value); + } + } + } + + println!("\nšŸ’” Key Insights:\n"); + println!(" ā€¢ Fields with * are required - form won't proceed without them"); + println!(" ā€¢ Fields marked (optional) can be skipped - just press Enter"); + println!(" ā€¢ Some fields only appeared because their 'when' condition was met"); + println!(" ā€¢ Example: 'phone_number' only shows if 2fa_method == SMS\n"); + + println!("šŸ“ JSON Output:\n"); + let json = serde_json::to_string_pretty(&results)?; + println!("{}\n", json); + + println!("āœØ Conditional and Required Fields Working Perfectly!\n"); + + Ok(()) +} diff --git a/examples/02-advanced/conditional_sections.toml b/examples/02-advanced/conditional_sections.toml new file mode 100644 index 0000000..21ef47a --- /dev/null +++ b/examples/02-advanced/conditional_sections.toml @@ -0,0 +1,161 @@ +name = "Dynamic Section Management" +description = "Form with sections that appear/disappear based on selections" + +# Main header (always visible) +[[items]] +name = "main_header" +type = "header" +title = "āœØ Dynamic Form with Conditional Sections" +border_top = true +border_bottom = true +align = "center" + +# Instructions (always visible) +[[items]] +name = "instructions" +type = "section" +content = "Select your preferences below. Additional sections will appear based on your choices." +margin_left = 2 + +# Account type selection +[[fields]] +name = "account_type" +type = "select" +prompt = "What type of account do you need?" +options = ["Personal", "Business", "Enterprise"] +required = true + +# Business section (only if account_type == Business) +[[items]] +name = "business_section_header" +type = "section" +title = "šŸ¢ Business Information" +border_top = true +when = "account_type == Business" + +[[fields]] +name = "company_name" +type = "text" +prompt = "Company Name" +when = "account_type == Business" +required = true + +[[fields]] +name = "company_size" +type = "select" +prompt = "Company Size" +options = ["1-10", "11-50", "51-200", "200+"] +when = "account_type == Business" + +# Enterprise section (only if account_type == Enterprise) +[[items]] +name = "enterprise_section_header" +type = "section" +title = "šŸ›ļø Enterprise Setup" +border_top = true +when = "account_type == Enterprise" + +[[items]] +name = "enterprise_warning" +type = "section" +content = "āš ļø Enterprise accounts require additional verification and support setup." +when = "account_type == Enterprise" + +[[fields]] +name = "enterprise_contact" +type = "text" +prompt = "Enterprise Account Manager Email" +when = "account_type == Enterprise" +required = true + +# Infrastructure selection (visible for Business & Enterprise) +[[items]] +name = "infrastructure_header" +type = "section" +title = "šŸ”§ Infrastructure Preferences" +border_top = true +when = "account_type == Business" + +[[items]] +name = "infrastructure_header_enterprise" +type = "section" +title = "šŸ”§ Infrastructure Preferences" +border_top = true +when = "account_type == Enterprise" + +[[fields]] +name = "hosting_preference" +type = "select" +prompt = "Preferred Hosting" +options = ["Cloud", "On-Premise", "Hybrid"] +when = "account_type == Business" + +[[fields]] +name = "hosting_preference_enterprise" +type = "select" +prompt = "Preferred Hosting" +options = ["Cloud", "On-Premise", "Hybrid", "Multi-Cloud"] +when = "account_type == Enterprise" + +# Support level selection +[[items]] +name = "support_header" +type = "section" +title = "šŸ’¬ Support Options" +border_top = true +margin_left = 0 + +[[fields]] +name = "support_level" +type = "select" +prompt = "Support Level" +options = ["Community", "Basic", "Premium", "Enterprise"] +required = true + +# Premium support details (only if support_level == Premium) +[[items]] +name = "premium_support_info" +type = "section" +title = "ā­ Premium Support Includes" +content = "āœ“ 24/7 Phone Support\nāœ“ Dedicated Account Manager\nāœ“ Priority Queue\nāœ“ SLA Guarantees" +border_top = true +when = "support_level == Premium" + +# Enterprise support details (only if support_level == Enterprise) +[[items]] +name = "enterprise_support_info" +type = "section" +title = "ā­ā­ Enterprise Support Includes" +content = "āœ“ 24/7 Dedicated Support Line\nāœ“ Dedicated Technical Team\nāœ“ Custom SLA\nāœ“ Onsite Support Available" +border_top = true +when = "support_level == Enterprise" + +[[fields]] +name = "support_email" +type = "text" +prompt = "Support Contact Email" +when = "support_level == Premium" +required = true + +[[fields]] +name = "support_email_enterprise" +type = "text" +prompt = "Support Contact Email" +when = "support_level == Enterprise" +required = true + +# Final section +[[items]] +name = "final_section" +type = "section" +title = "āœ… Ready to Complete" +content = "Review your selections above and click submit to create your account." +border_top = true +border_bottom = true +align = "center" + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "I agree to the terms and conditions" +required = true diff --git a/examples/02-advanced/display_items_demo.toml b/examples/02-advanced/display_items_demo.toml new file mode 100644 index 0000000..c2b78fb --- /dev/null +++ b/examples/02-advanced/display_items_demo.toml @@ -0,0 +1,78 @@ +name = "Display Items Showcase" +description = "Demonstrates all display item types and attributes" + +# Basic Header +[[items]] +name = "header_basic" +type = "header" +title = "Basic Header" + +# Header with borders +[[items]] +name = "header_bordered" +type = "header" +title = "Header with Borders" +border_top = true +border_bottom = true + +# Header centered +[[items]] +name = "header_centered" +type = "header" +title = "Centered Header" +border_top = true +border_bottom = true +align = "center" + +# Simple section with content +[[items]] +name = "info_section" +type = "section" +content = "This is a simple information section. It contains text that guides the user." + +# Section with borders +[[items]] +name = "important_info" +type = "section" +title = "Important Information" +content = "This section has both title and content with a border on top." +border_top = true + +# Multi-line content section +[[items]] +name = "multiline_section" +type = "section" +title = "Features" +content = "āœ“ Feature One\nāœ“ Feature Two\nāœ“ Feature Three\nāœ“ Feature Four" +border_bottom = true + +# Example field +[[fields]] +name = "example_field" +type = "text" +prompt = "Enter something" + +# Left-aligned section +[[items]] +name = "instructions" +type = "section" +content = "Please follow the instructions above." +margin_left = 2 + +# Call To Action +[[items]] +name = "cta_submit" +type = "cta" +title = "Ready?" +content = "Click submit when you're done!" +border_top = true +border_bottom = true +align = "center" + +# Right-aligned footer +[[items]] +name = "footer" +type = "footer" +content = "Ā© 2024 Your Company. All rights reserved." +align = "right" +margin_left = 0 diff --git a/examples/03-styling/README.md b/examples/03-styling/README.md new file mode 100644 index 0000000..996eba1 --- /dev/null +++ b/examples/03-styling/README.md @@ -0,0 +1,45 @@ +# Styling & Custom Appearance + +Examples of custom borders, themes, and visual styling. + +## Files + +- **custom_border_form.toml** - Custom border definitions +- **fancy_borders_form.toml** - Advanced border styling + +## Usage + +### CLI Backend +```bash +cargo run --example custom_border_form +cargo run --example fancy_borders_form +``` + +### Web Backend +```bash +cargo run -p typedialog-web -- --config custom_border_form.toml +``` + +## Features Demonstrated + +- Custom border styles +- Section separators +- Visual hierarchy +- Theme customization +- Character-based borders (for CLI) + +## Border Options + +Borders can use: +- `simple` - Basic ASCII borders +- `double` - Double-line borders +- `rounded` - Rounded corners +- `thick` - Thick lines +- Custom border characters + +Example: +```toml +[sections.main] +title = "Main Section" +border = "double" +``` diff --git a/examples/03-styling/custom_border_form.toml b/examples/03-styling/custom_border_form.toml new file mode 100644 index 0000000..425d72c --- /dev/null +++ b/examples/03-styling/custom_border_form.toml @@ -0,0 +1,43 @@ +name = "Custom Border Demo Form" +description = "Demonstrates custom border_top_char, border_top_len, border_bottom_char, border_bottom_len" + +# Standard border with default ā• +[[items]] +name = "header_group" +type = "group" +order = 1 +includes = ["fragments/header.toml"] + +# Custom border with different top and bottom styles +[[items]] +name = "custom_group" +type = "group" +order = 2 +includes = ["fragments/custom_border_section.toml"] + +# Simple field +[[fields]] +name = "project_name" +type = "text" +prompt = "Project name" +required = true +order = 3 + +# Different border styles with corners and margin +[[items]] +name = "footer" +type = "section" +title = "āœ“ Complete!" +content = "Thank you for filling out this form" +border_top = true +border_bottom = true +order = 4 +margin_left = 2 +border_top_l = "ā”Œ" +border_top_char = "ā”€" +border_top_len = 40 +border_top_r = "ā”" +border_bottom_l = "ā””" +border_bottom_char = "ā”€" +border_bottom_len = 40 +border_bottom_r = "ā”˜" diff --git a/examples/03-styling/fancy_borders_form.toml b/examples/03-styling/fancy_borders_form.toml new file mode 100644 index 0000000..e911bda --- /dev/null +++ b/examples/03-styling/fancy_borders_form.toml @@ -0,0 +1,57 @@ +name = "Fancy Borders Demo" +description = "Demonstrates custom corner characters with fancy Unicode borders" + +# Fancy bordered header - border at margin 0, content at margin 2 +[[items]] +name = "fancy_header" +type = "section" +title = "āœØ Welcome to Fancy Forms āœØ" +border_top = true +border_bottom = true +order = 1 +border_margin_left = 0 +content_margin_left = 2 +border_top_l = "ā•­" +border_top_char = "ā”€" +border_top_len = 35 +border_top_r = "ā•®" +border_bottom_l = "ā•°" +border_bottom_char = "ā”€" +border_bottom_len = 35 +border_bottom_r = "ā•Æ" + +# Include fancy border fragment - margin settings are in the fragment items +[[items]] +name = "fancy_group" +type = "group" +order = 2 +includes = ["fragments/fancy_border_section.toml"] + +# Simple field +[[fields]] +name = "favorite_style" +type = "select" +prompt = "Your favorite border style" +options = ["Fancy Unicode", "Simple ASCII", "Mixed Styles"] +required = true +order = 3 + +# Box border for footer - border at 0, content at 2 +[[items]] +name = "box_footer" +type = "section" +title = "āœ“ All Done!" +content = "Thanks for exploring fancy borders!" +border_top = true +border_bottom = true +order = 4 +border_margin_left = 0 +content_margin_left = 2 +border_top_l = "ā”Œ" +border_top_char = "ā”€" +border_top_len = 40 +border_top_r = "ā”" +border_bottom_l = "ā””" +border_bottom_char = "ā”€" +border_bottom_len = 40 +border_bottom_r = "ā”˜" diff --git a/examples/04-backends/README.md b/examples/04-backends/README.md new file mode 100644 index 0000000..b78fe95 --- /dev/null +++ b/examples/04-backends/README.md @@ -0,0 +1,54 @@ +# Backend-Specific Examples + +Examples demonstrating each backend (CLI, TUI, Web) with features unique to that platform. + +## CLI Backend + +See: `cli/README.md` + +Interactive command-line forms with: +- Inline validation +- Progress tracking +- Terminal-based UI + +## TUI Backend + +See: `tui/README.md` + +Text User Interface forms with: +- Interactive navigation +- Real-time feedback +- Mouse/keyboard support + +## Web Backend + +See: `web/README.md` + +Web-based form rendering with: +- HTML/CSS styling +- Browser compatibility +- REST API integration + +## Common Examples Format + +Each backend can use TOML form definitions or Rust code: + +**TOML** - Configuration-driven (faster iteration): +```bash +cargo run -p typedialog-web -- --config registration_form.toml +``` + +**Rust** - Programmatic control (advanced customization): +```bash +cargo run --example form_with_autocompletion +``` + +## Feature Compatibility Matrix + +| Feature | CLI | TUI | Web | +|---------|-----|-----|-----| +| Conditional Fields | āœ“ | āœ“ | āœ“ | +| Autocompletion | āœ“ | āœ“ | āœ“ | +| Validation | āœ“ | āœ“ | āœ“ | +| Custom Styling | āœ— | āœ“ | āœ“ | +| i18n Support | āœ“ | āœ“ | āœ“ | diff --git a/examples/04-backends/cli/README.md b/examples/04-backends/cli/README.md new file mode 100644 index 0000000..32b0475 --- /dev/null +++ b/examples/04-backends/cli/README.md @@ -0,0 +1,37 @@ +# CLI Backend Examples + +Command-line interface form examples. + +## Files + +- **autocompletion_demo.rs** - Field autocomplete and suggestions + +## Running Examples + +```bash +cargo run --example autocompletion_demo +``` + +## Features + +### Autocompletion +Suggests values as user types: +- Email domain completion +- Name suggestions +- Pre-filled lists +- Custom completion logic + +## Use Cases + +- Server management +- Configuration wizards +- Admin tools +- Batch form entry +- Scripting integration + +## I/O Handling + +CLI forms read from stdin and write to stdout, making them: +- Pipe-friendly +- Scriptable +- Integration-friendly with other tools diff --git a/examples/04-backends/cli/autocompletion_demo.rs b/examples/04-backends/cli/autocompletion_demo.rs new file mode 100644 index 0000000..7cb6367 --- /dev/null +++ b/examples/04-backends/cli/autocompletion_demo.rs @@ -0,0 +1,247 @@ +//! Comprehensive autocompletion demonstration +//! +//! This example showcases all three autocompletion strategies: +//! 1. HistoryCompleter - Remembers previously entered values +//! 2. FilterCompleter - Dynamically filters available options +//! 3. PatternCompleter - Provides pattern-based suggestions +//! +//! Run with: cargo run --example autocompletion_demo + +use typedialog::autocompletion::{FilterCompleter, HistoryCompleter, PatternCompleter, PatternType}; + +fn main() { + println!("=== typedialog Autocompletion Demo ===\n"); + + // ============================================================ + // 1. HISTORY-BASED AUTOCOMPLETION + // ============================================================ + println!("1ļøāƒ£ HISTORY-BASED AUTOCOMPLETION"); + println!(" (Remembers previously entered emails)\n"); + + let mut email_history = HistoryCompleter::new(5); + + // Simulate adding previous email entries + let previous_emails = vec![ + "alice.johnson@company.com", + "bob.smith@example.org", + "charlie.brown@gmail.com", + "diana.prince@outlook.com", + "eve.wilson@enterprise.net", + ]; + + for email in &previous_emails { + email_history.add(email.to_string()); + } + + println!(" Previous emails in history:"); + for (i, email) in email_history.get_history().iter().enumerate() { + println!(" {}. {}", i + 1, email); + } + + // Demonstrate suggestions + println!("\n Searching for 'alice':"); + let suggestions = email_history.suggest("alice"); + for suggestion in suggestions { + println!(" ā†’ {}", suggestion); + } + + println!("\n Searching for '@company':"); + let suggestions = email_history.suggest("@company"); + for suggestion in suggestions { + println!(" ā†’ {}", suggestion); + } + + // Get first completion + if let Some(first) = email_history.complete("charlie") { + println!("\n First match for 'charlie': {}", first); + } + + // ============================================================ + // 2. FILTER-BASED AUTOCOMPLETION + // ============================================================ + println!("\n\n2ļøāƒ£ FILTER-BASED AUTOCOMPLETION"); + println!(" (Dynamically filters available options)\n"); + + let roles = vec![ + "Administrator".to_string(), + "Developer".to_string(), + "DevOps Engineer".to_string(), + "Database Administrator".to_string(), + "Security Analyst".to_string(), + "Quality Assurance".to_string(), + "Project Manager".to_string(), + "User".to_string(), + "Guest".to_string(), + ]; + + let role_completer = FilterCompleter::new(roles.clone()); + + println!(" Available roles:"); + for (i, role) in roles.iter().enumerate() { + println!(" {}. {}", i + 1, role); + } + + // Filter by "admin" + println!("\n Filtering by 'admin':"); + let filtered = role_completer.filter("admin"); + for role in &filtered { + println!(" ā†’ {}", role); + } + + // Filter by "dev" + println!("\n Filtering by 'dev':"); + let filtered = role_completer.filter("dev"); + for role in &filtered { + println!(" ā†’ {}", role); + } + + // Get first matching + if let Some(first) = role_completer.complete("sec") { + println!("\n First match for 'sec': {}", first); + } + + // ============================================================ + // 3. PATTERN-BASED AUTOCOMPLETION + // ============================================================ + println!("\n\n3ļøāƒ£ PATTERN-BASED AUTOCOMPLETION"); + println!(" (Provides intelligent suggestions)\n"); + + // Email pattern + println!(" šŸ“§ EMAIL PATTERN:"); + let mut email_completer = PatternCompleter::new(PatternType::Email); + email_completer.add_suggestion("@mycompany.com".to_string()); + email_completer.add_suggestion("@internal.corp".to_string()); + + println!(" Built-in suggestions:"); + for suggestion in email_completer.suggest("@") { + println!(" ā†’ {}", suggestion); + } + + println!("\n Smart completion for 'john':"); + if let Some(completion) = email_completer.complete("john") { + println!(" ā†’ john{}", completion); + } + + // URL pattern + println!("\n šŸ”— URL PATTERN:"); + let url_completer = PatternCompleter::new(PatternType::Url); + println!(" Available protocols:"); + for protocol in url_completer.suggest("") { + println!(" ā†’ {}", protocol); + } + + println!("\n Completion for empty input:"); + if let Some(completion) = url_completer.complete("") { + println!(" ā†’ {}", completion); + } + + // File path pattern + println!("\n šŸ“ FILE PATH PATTERN:"); + let path_completer = PatternCompleter::new(PatternType::FilePath); + println!(" Available path prefixes:"); + for prefix in path_completer.suggest("") { + println!(" ā†’ {}", prefix); + } + + // IPv4 pattern + println!("\n šŸŒ IPv4 ADDRESS PATTERN:"); + let ipv4_completer = PatternCompleter::new(PatternType::IPv4); + println!(" Common subnet suggestions:"); + for subnet in ipv4_completer.suggest("") { + println!(" ā†’ {}", subnet); + } + + println!("\n Filtering by '192':"); + for subnet in ipv4_completer.suggest("192") { + println!(" ā†’ {}", subnet); + } + + // Port pattern + println!("\n šŸ”Œ PORT PATTERN:"); + let port_completer = PatternCompleter::new(PatternType::Port); + println!(" Common ports:"); + for port in port_completer.suggest("") { + println!(" ā†’ {}", port); + } + + println!("\n Smart completion for '8':"); + if let Some(completion) = port_completer.complete("8") { + println!(" ā†’ localhost{}", completion); + } + + // ============================================================ + // 4. COMBINED EXAMPLE - MULTI-FIELD FORM + // ============================================================ + println!("\n\n4ļøāƒ£ COMBINED EXAMPLE - MULTI-FIELD FORM"); + println!(" (Using all three completers together)\n"); + + struct UserForm { + email: String, + role: String, + website: String, + ip_address: String, + } + + println!(" Simulating user registration form with autocompletion:\n"); + + // Email field with history + println!(" Field 1: Email (with history)"); + let mut email_hist = HistoryCompleter::new(3); + email_hist.add("previous@example.com".to_string()); + email_hist.add("old@domain.com".to_string()); + println!(" Suggestions for 'prev': {:?}", email_hist.suggest("prev")); + + // Role field with filtering + println!("\n Field 2: Role (with filtering)"); + let roles = vec!["Admin".to_string(), "User".to_string(), "Moderator".to_string()]; + let role_filter = FilterCompleter::new(roles); + println!(" Filtered options for 'ad': {:?}", role_filter.filter("ad")); + + // Website field with pattern + println!("\n Field 3: Website (with URL pattern)"); + let url_pattern = PatternCompleter::new(PatternType::Url); + println!(" Suggestions for empty: {:?}", url_pattern.suggest("")); + println!(" Smart completion: {:?}", url_pattern.complete("")); + + // IP field with pattern + println!("\n Field 4: IP Address (with IPv4 pattern)"); + let ip_pattern = PatternCompleter::new(PatternType::IPv4); + println!(" Common networks: {:?}", ip_pattern.suggest("")); + println!(" Completion for '10': {:?}", ip_pattern.complete("10")); + + // ============================================================ + // 5. ADVANCED USAGE - CHAINED COMPLETIONS + // ============================================================ + println!("\n\n5ļøāƒ£ ADVANCED USAGE - CHAINED COMPLETIONS\n"); + + println!(" Building auto-suggestion pipeline:"); + + // Step 1: User types email prefix + let typed = "user"; + println!(" User types: '{}' (for email)", typed); + + // Step 2: Try pattern-based completion first + let mut email_pat = PatternCompleter::new(PatternType::Email); + email_pat.add_suggestion("@work.com".to_string()); + if let Some(completion) = email_pat.complete(typed) { + println!(" Pattern suggests: {}{}", typed, completion); + } + + // Step 3: Fall back to history + let mut hist = HistoryCompleter::new(10); + hist.add("user.account@company.com".to_string()); + hist.add("username@domain.org".to_string()); + let history_matches = hist.suggest(typed); + if !history_matches.is_empty() { + println!(" History has {} matches: {:?}", history_matches.len(), history_matches); + } + + // ============================================================ + // Summary + // ============================================================ + println!("\n\n=== Summary ==="); + println!("āœ“ HistoryCompleter: Remembers & suggests previous values"); + println!("āœ“ FilterCompleter: Dynamically filters available options"); + println!("āœ“ PatternCompleter: Smart suggestions for common patterns"); + println!("\nAll three can be combined for powerful autocompletion!"); +} diff --git a/examples/04-backends/tui/README.md b/examples/04-backends/tui/README.md new file mode 100644 index 0000000..117aeaa --- /dev/null +++ b/examples/04-backends/tui/README.md @@ -0,0 +1,47 @@ +# TUI Backend Examples + +Text User Interface form examples - interactive terminal-based forms. + +## Files + +- **form_with_autocompletion.rs** - Advanced TUI form with completion suggestions +- **tui_survey_form.toml** - Interactive survey in TUI format + +## Running Examples + +```bash +cargo run -p typedialog-tui --example form_with_autocompletion +``` + +## Features + +### Interactive Navigation +- Tab/Shift+Tab for field navigation +- Arrow keys for selections +- Mouse support + +### Autocompletion +- Real-time suggestions +- Arrow key selection +- Tab to autocomplete + +### Visual Feedback +- Highlighting active fields +- Error messages inline +- Progress indication + +## Use Cases + +- Data entry applications +- System administration tools +- Interactive surveys +- Config builders +- Terminal dashboards + +## Keyboard Shortcuts + +- `Tab` - Next field +- `Shift+Tab` - Previous field +- `Up/Down` - Navigate options +- `Enter` - Confirm/Submit +- `Esc` - Cancel diff --git a/examples/04-backends/tui/form_with_autocompletion.rs b/examples/04-backends/tui/form_with_autocompletion.rs new file mode 100644 index 0000000..8c2c9cc --- /dev/null +++ b/examples/04-backends/tui/form_with_autocompletion.rs @@ -0,0 +1,244 @@ +//! Form with Autocompletion Integration +//! +//! This example demonstrates how to use autocompletion helpers with interactive forms. +//! It shows practical integration patterns for: +//! - Email addresses with pattern-based suggestions +//! - Username with history +//! - Country selection with filtering +//! - Website URLs with pattern guidance +//! +//! Run with: cargo run --example form_with_autocompletion + +use typedialog::autocompletion::{FilterCompleter, HistoryCompleter, PatternCompleter, PatternType}; +use typedialog::prompts; + +fn main() -> typedialog::Result<()> { + println!("ā•”ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•—"); + println!("ā•‘ User Registration with Autocompletion ā•‘"); + println!("ā•šā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•\n"); + + // Initialize completers for different fields + let mut username_history = HistoryCompleter::new(5); + let mut email_history = HistoryCompleter::new(10); + + // Pre-populate with previous entries (simulating loaded history) + username_history.add("alice_smith".to_string()); + username_history.add("alice.smith".to_string()); + username_history.add("asmith2024".to_string()); + + email_history.add("alice@company.com".to_string()); + email_history.add("alice.smith@example.org".to_string()); + email_history.add("alice@personal.com".to_string()); + + // Country completer for quick filtering + let countries = vec![ + "United States".to_string(), + "Canada".to_string(), + "Mexico".to_string(), + "United Kingdom".to_string(), + "Germany".to_string(), + "France".to_string(), + "Spain".to_string(), + "Italy".to_string(), + "Other".to_string(), + ]; + let country_completer = FilterCompleter::new(countries.clone()); + + // Email pattern for smart suggestions + let mut email_pattern = PatternCompleter::new(PatternType::Email); + email_pattern.add_suggestion("@company.com".to_string()); + email_pattern.add_suggestion("@company.org".to_string()); + + // URL pattern for website input + let url_pattern = PatternCompleter::new(PatternType::Url); + + // ============================================================ + // SECTION 1: USERNAME INPUT WITH HISTORY + // ============================================================ + println!("šŸ“‹ SECTION 1: Account Information\n"); + + println!("šŸ’” Available usernames (from history):"); + for (i, name) in username_history.get_history().iter().enumerate() { + println!(" {}. {}", i + 1, name); + } + println!(); + + let username = prompts::text( + "Enter username (start typing to see suggestions)", + None, + None, + )?; + + // Add to history for future sessions + username_history.add(username.clone()); + + println!("āœ“ Username: {}\n", username); + + // ============================================================ + // SECTION 2: EMAIL WITH PATTERN SUGGESTIONS + // ============================================================ + println!("šŸ“§ SECTION 2: Email Information\n"); + + println!("Available email domains:"); + for domain in email_pattern.suggest("@") { + println!(" {}", domain); + } + println!(); + + let email = prompts::text( + "Enter email address", + None, + Some("user@company.com"), + )?; + + // Add to history + email_history.add(email.clone()); + + println!("āœ“ Email: {}\n", email); + + // Show email pattern suggestions + if !email.contains('@') { + if let Some(suggestion) = email_pattern.complete(&email) { + println!("šŸ’” Pattern suggestion: {}{}\n", email, suggestion); + } + } + + // ============================================================ + // SECTION 3: PASSWORD INPUT + // ============================================================ + println!("šŸ”’ SECTION 3: Security\n"); + + let _password = prompts::password( + "Enter password (minimum 8 characters)", + false, + )?; + + println!("āœ“ Password: ā€¢ā€¢ā€¢ā€¢ā€¢ā€¢ā€¢ā€¢\n"); + + let _confirm = prompts::password( + "Confirm password", + false, + )?; + + println!("āœ“ Confirmed\n"); + + // ============================================================ + // SECTION 4: LOCATION WITH FILTERED SELECTION + // ============================================================ + println!("šŸŒ SECTION 4: Location\n"); + + // Demonstrate filtering + let countries_for_dialog = vec![ + "United States".to_string(), + "Canada".to_string(), + "Mexico".to_string(), + "United Kingdom".to_string(), + "Germany".to_string(), + "France".to_string(), + "Spain".to_string(), + "Italy".to_string(), + "Other".to_string(), + ]; + + println!("Available countries (filtered example):"); + let filtered = country_completer.filter("united"); + for country in &filtered { + println!(" āœ“ {}", country); + } + println!(); + + let country = prompts::select( + "Select your country", + countries_for_dialog, + None, + false, + )?; + + println!("āœ“ Country: {}\n", country); + + // ============================================================ + // SECTION 5: COMPANY INFORMATION + // ============================================================ + println!("šŸ¢ SECTION 5: Company Information\n"); + + let company = prompts::text( + "Company name (optional)", + None, + Some("Acme Corporation"), + )?; + + println!("āœ“ Company: {}\n", company); + + // ============================================================ + // SECTION 6: WEBSITE URL WITH PATTERN + // ============================================================ + println!("šŸ”— SECTION 6: Online Presence\n"); + + println!("Available protocols for URL:"); + for protocol in url_pattern.suggest("") { + println!(" {}", protocol); + } + println!(); + + let website = prompts::text( + "Company website", + None, + Some("https://"), + )?; + + println!("āœ“ Website: {}\n", website); + + // ============================================================ + // SECTION 7: CONFIRMATION + // ============================================================ + println!("āœ… SECTION 7: Preferences\n"); + + let subscribe = prompts::confirm( + "Subscribe to our newsletter for updates?", + Some(true), + None, + )?; + + println!("āœ“ Newsletter subscription: {}\n", if subscribe { "Yes" } else { "No" }); + + // ============================================================ + // SUMMARY + // ============================================================ + println!("ā•”ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•—"); + println!("ā•‘ Registration Complete! ā•‘"); + println!("ā•šā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•ā•\n"); + + println!("šŸ“ Summary of Registration:\n"); + println!(" Username: {}", username); + println!(" Email: {}", email); + println!(" Country: {}", country); + println!(" Company: {}", if company.is_empty() { "(not provided)" } else { &company }); + println!(" Website: {}", if website.is_empty() { "(not provided)" } else { &website }); + println!(" Newsletter: {}\n", if subscribe { "āœ“ Subscribed" } else { "āœ— Not subscribed" }); + + // ============================================================ + // AUTOCOMPLETION INSIGHTS + // ============================================================ + println!("šŸ’” Autocompletion Insights:\n"); + + println!(" šŸ“Š Username History ({}): ", username_history.get_history().len()); + for name in username_history.get_history() { + println!(" - {}", name); + } + println!(); + + println!(" šŸ“Š Email History ({}): ", email_history.get_history().len()); + for email_addr in email_history.get_history() { + println!(" - {}", email_addr); + } + println!(); + + println!(" šŸ’” Pattern Completions:"); + println!(" - Email patterns: {}", email_pattern.suggest("@").len()); + println!(" - URL patterns: {}", url_pattern.suggest("").len()); + println!(" - Available countries: {}", countries.len()); + + println!("\nāœØ All three autocompletion strategies integrated successfully!"); + + Ok(()) +} diff --git a/examples/04-backends/tui/tui_survey_form.toml b/examples/04-backends/tui/tui_survey_form.toml new file mode 100644 index 0000000..804a92b --- /dev/null +++ b/examples/04-backends/tui/tui_survey_form.toml @@ -0,0 +1,194 @@ +name = "User Experience Survey" +description = "Comprehensive TUI survey with visual elements and grouped sections" +locale = "en-US" + +# Welcome header with fancy Unicode borders +[[items]] +name = "welcome_header" +type = "section" +title = "šŸ“‹ User Experience Survey" +content = "Help us improve by sharing your feedback" +border_top = true +border_bottom = true +order = 1 +border_margin_left = 0 +content_margin_left = 2 +border_top_l = "ā•­" +border_top_char = "ā”€" +border_top_len = 45 +border_top_r = "ā•®" +border_bottom_l = "ā•°" +border_bottom_char = "ā”€" +border_bottom_len = 45 +border_bottom_r = "ā•Æ" + +# Personal Information section header +[[items]] +name = "personal_info_header" +type = "section_header" +title = "šŸ‘¤ Personal Information" +order = 2 +margin_left = 2 + +# Personal information fields +[[fields]] +name = "full_name" +type = "text" +prompt = "Full name" +placeholder = "Jane Smith" +required = true +group = "personal_info" +order = 3 + +[[fields]] +name = "email" +type = "text" +prompt = "Email address" +placeholder = "jane@example.com" +required = true +group = "personal_info" +order = 4 + +[[fields]] +name = "phone" +type = "text" +prompt = "Phone number (optional)" +placeholder = "+1-555-0123" +group = "personal_info" +order = 5 + +# Product experience section +[[items]] +name = "product_header" +type = "section_header" +title = "ā­ Product Experience" +order = 6 +margin_left = 2 + +[[fields]] +name = "overall_satisfaction" +type = "select" +prompt = "Overall satisfaction with product" +options = ["Very Unsatisfied", "Unsatisfied", "Neutral", "Satisfied", "Very Satisfied"] +required = true +group = "product" +order = 7 + +[[fields]] +name = "usage_frequency" +type = "select" +prompt = "How often do you use this product?" +options = ["Daily", "Weekly", "Monthly", "Occasionally", "Never"] +required = true +group = "product" +order = 8 + +[[fields]] +name = "features_used" +type = "multiselect" +prompt = "Which features do you use? (select all that apply)" +options = ["Dashboard", "Analytics", "Reporting", "API Integration", "Mobile App", "Notifications", "Collaboration Tools"] +page_size = 5 +vim_mode = true +group = "product" +order = 9 + +# Feedback section +[[items]] +name = "feedback_header" +type = "section_header" +title = "šŸ’¬ Feedback" +order = 10 +margin_left = 2 + +[[fields]] +name = "improvements" +type = "editor" +prompt = "What improvements would you suggest?" +file_extension = "txt" +prefix_text = "# Please describe desired improvements\n" +group = "feedback" +order = 11 + +[[fields]] +name = "biggest_pain_point" +type = "select" +prompt = "What's your biggest pain point?" +options = [ + "Performance issues", + "Confusing UI/UX", + "Missing features", + "Documentation", + "Customer support", + "Pricing", + "Other" +] +required = true +group = "feedback" +order = 12 + +# Preferences section +[[items]] +name = "preferences_header" +type = "section_header" +title = "āš™ļø Preferences" +order = 13 +margin_left = 2 + +[[fields]] +name = "contact_preference" +type = "select" +prompt = "Preferred contact method" +options = ["Email", "Phone", "SMS", "In-app notification", "No contact"] +default = "Email" +required = true +group = "preferences" +order = 14 + +[[fields]] +name = "newsletter_opt_in" +type = "confirm" +prompt = "Subscribe to our newsletter for updates?" +default = "false" +group = "preferences" +order = 15 + +[[fields]] +name = "beta_features" +type = "confirm" +prompt = "Interested in testing beta features?" +default = "false" +group = "preferences" +order = 16 + +# Advanced options (conditional) +[[fields]] +name = "device_types" +type = "multiselect" +prompt = "Which devices do you use? (optional)" +options = ["Desktop", "Laptop", "Tablet", "Mobile", "Smartwatch"] +when = "beta_features == true" +page_size = 4 +vim_mode = true +group = "preferences" +order = 17 + +# Closing footer +[[items]] +name = "closing_footer" +type = "section" +title = "āœ“ Thank You!" +content = "Your feedback helps us build better products" +border_top = true +border_bottom = true +order = 100 +border_margin_left = 0 +content_margin_left = 2 +border_top_l = "ā”Œ" +border_top_char = "ā”€" +border_top_len = 50 +border_top_r = "ā”" +border_bottom_l = "ā””" +border_bottom_char = "ā”€" +border_bottom_len = 50 +border_bottom_r = "ā”˜" diff --git a/examples/04-backends/web/README.md b/examples/04-backends/web/README.md new file mode 100644 index 0000000..709db28 --- /dev/null +++ b/examples/04-backends/web/README.md @@ -0,0 +1,58 @@ +# Web Backend Examples + +Web-based form rendering examples using HTML/CSS. + +## Files + +- **web_registration_form.toml** - User registration form for web + +## Running Examples + +```bash +cargo run -p typedialog-web -- --config web_registration_form.toml +``` + +Then open browser to `http://localhost:3000` (or configured port). + +## Features + +### Web-Specific Capabilities +- HTML form rendering +- CSS styling +- Responsive design +- Browser validation +- AJAX submission + +### Client-Side Validation +- Real-time field validation +- Error messages +- Success feedback +- Field-level helpers + +## Use Cases + +- Public registration forms +- Survey applications +- Customer feedback +- Data collection +- SaaS onboarding + +## Form Structure + +Web forms use the same TOML format but support additional web-specific properties: + +```toml +[fields.email] +type = "email" +label = "Email Address" +placeholder = "you@example.com" +help_text = "We'll never share your email" +``` + +## Integration + +Forms are served via: +- REST API endpoints +- HTML templates +- JSON submission +- Configurable styling diff --git a/examples/04-backends/web/web_registration_form.toml b/examples/04-backends/web/web_registration_form.toml new file mode 100644 index 0000000..1d41e00 --- /dev/null +++ b/examples/04-backends/web/web_registration_form.toml @@ -0,0 +1,269 @@ +name = "User Registration" +description = "Web-optimized registration form with account setup and preferences" +locale = "en-US" + +# Account Credentials Section +[[items]] +name = "account_section" +type = "section_header" +title = "Create Your Account" +order = 1 + +[[fields]] +name = "username" +type = "text" +prompt = "Username" +placeholder = "Choose a unique username" +required = true +group = "account" +order = 2 + +[[fields]] +name = "email" +type = "text" +prompt = "Email Address" +placeholder = "your.email@example.com" +required = true +group = "account" +order = 3 + +[[fields]] +name = "password" +type = "password" +prompt = "Password" +required = true +group = "account" +order = 4 + +[[fields]] +name = "confirm_password" +type = "password" +prompt = "Confirm Password" +required = true +group = "account" +order = 5 + +# Profile Information Section +[[items]] +name = "profile_section" +type = "section_header" +title = "Profile Information" +order = 10 + +[[fields]] +name = "first_name" +type = "text" +prompt = "First Name" +placeholder = "Jane" +required = true +group = "profile" +order = 11 + +[[fields]] +name = "last_name" +type = "text" +prompt = "Last Name" +placeholder = "Smith" +required = true +group = "profile" +order = 12 + +[[fields]] +name = "display_name" +type = "text" +prompt = "Display Name (optional)" +placeholder = "How you'll appear to other users" +group = "profile" +order = 13 + +[[fields]] +name = "birth_date" +type = "date" +prompt = "Date of Birth" +min_date = "1950-01-01" +max_date = "2006-12-31" +week_start = "Sun" +group = "profile" +order = 14 + +[[fields]] +name = "bio" +type = "editor" +prompt = "About Me" +file_extension = "md" +group = "profile" +order = 15 + +# Account Settings Section +[[items]] +name = "settings_section" +type = "section_header" +title = "Account Settings" +order = 20 + +[[fields]] +name = "account_type" +type = "select" +prompt = "Account Type" +options = ["Personal", "Business", "Organization"] +default = "Personal" +required = true +group = "settings" +order = 21 + +[[fields]] +name = "subscription_plan" +type = "select" +prompt = "Subscription Plan" +options = ["Free", "Pro", "Enterprise"] +default = "Free" +required = true +group = "settings" +order = 22 + +# Conditional fields for Business/Organization accounts +[[fields]] +name = "company_name" +type = "text" +prompt = "Company Name" +placeholder = "Your Organization" +when = "account_type != Personal" +required = true +group = "settings" +order = 23 + +[[fields]] +name = "company_url" +type = "text" +prompt = "Company Website" +placeholder = "https://example.com" +when = "account_type != Personal" +group = "settings" +order = 24 + +# Premium features (conditional on subscription) +[[fields]] +name = "api_access" +type = "confirm" +prompt = "Enable API Access?" +when = "subscription_plan != Free" +default = "false" +group = "settings" +order = 25 + +[[fields]] +name = "team_members_count" +type = "custom" +prompt = "How many team members?" +custom_type = "i32" +default = "1" +when = "subscription_plan == Enterprise" +group = "settings" +order = 26 + +# Preferences Section +[[items]] +name = "preferences_section" +type = "section_header" +title = "Communication Preferences" +order = 30 + +[[fields]] +name = "notifications_email" +type = "confirm" +prompt = "Send me email notifications?" +default = "true" +group = "preferences" +order = 31 + +[[fields]] +name = "marketing_emails" +type = "confirm" +prompt = "Subscribe to marketing emails and updates?" +default = "false" +group = "preferences" +order = 32 + +[[fields]] +name = "notification_frequency" +type = "select" +prompt = "Email notification frequency" +options = ["Immediate", "Daily Digest", "Weekly Summary", "Monthly Summary", "Never"] +when = "notifications_email == true" +default = "Daily Digest" +group = "preferences" +order = 33 + +[[fields]] +name = "interests" +type = "multiselect" +prompt = "Topics you're interested in:" +options = [ + "Product Updates", + "Security Alerts", + "Performance Tips", + "Community News", + "Educational Content", + "Exclusive Offers" +] +page_size = 4 +group = "preferences" +order = 34 + +# Privacy & Legal Section +[[items]] +name = "legal_section" +type = "section_header" +title = "Privacy & Legal" +order = 40 + +[[fields]] +name = "terms_accepted" +type = "confirm" +prompt = "I agree to the Terms of Service" +required = true +group = "legal" +order = 41 + +[[fields]] +name = "privacy_policy_accepted" +type = "confirm" +prompt = "I have read and accept the Privacy Policy" +required = true +group = "legal" +order = 42 + +[[fields]] +name = "data_processing" +type = "confirm" +prompt = "I consent to data processing as described" +required = true +group = "legal" +order = 43 + +# Optional secondary contact +[[fields]] +name = "enable_secondary_contact" +type = "confirm" +prompt = "Add secondary contact information?" +default = "false" +group = "legal" +order = 44 + +[[fields]] +name = "secondary_email" +type = "text" +prompt = "Secondary Email Address" +placeholder = "alternative@example.com" +when = "enable_secondary_contact == true" +group = "legal" +order = 45 + +[[fields]] +name = "recovery_phone" +type = "text" +prompt = "Recovery Phone Number" +placeholder = "+1-555-0123" +when = "enable_secondary_contact == true" +group = "legal" +order = 46 diff --git a/examples/05-fragments/README.md b/examples/05-fragments/README.md new file mode 100644 index 0000000..cdca60d --- /dev/null +++ b/examples/05-fragments/README.md @@ -0,0 +1,60 @@ +# Form Fragments & Composition + +Reusable form components and modular form building. + +## Files + +### Fragments (Reusable Components) +- **header.toml** - Header/intro section +- **custom_border_section.toml** - Styled section template +- **fancy_border_section.toml** - Advanced border styling +- **employee_info_section.toml** - Employee data fields +- **agreement_section.toml** - Legal/policy acceptance +- **support_section.toml** - Support tier selection +- **premium_section.toml** - Premium features section +- **enterprise_section.toml** - Enterprise tier section + +### Examples Using Fragments +- **form_with_groups_includes.toml** - Demonstrates fragment inclusion + +## Usage Pattern + +### Include Fragments in Your Forms + +```toml +# main_form.toml +[includes] +header = "fragments/header.toml" +employee = "fragments/employee_info_section.toml" +agreement = "fragments/agreement_section.toml" + +[sections.main] +title = "Employee Onboarding" +``` + +### Build Complex Forms from Reusable Parts + +```bash +# Each fragment can be tested independently +cargo run --example form_with_groups_includes +``` + +## Benefits + +- **DRY** - Write common sections once +- **Maintainability** - Update fragments in one place +- **Reusability** - Share across multiple forms +- **Modularity** - Compose complex forms from simple parts +- **Consistency** - Unified styling and structure + +## Fragment Library + +Use these as templates for your own fragments: + +| Fragment | Purpose | Fields | +|----------|---------|--------| +| header | Form introduction | Title, description | +| employee_info | Standard employee data | Name, email, phone | +| agreement | Policy acceptance | Checkbox, text | +| support | Tier selection | Radio buttons | +| border_section | Custom styled container | Any fields | diff --git a/examples/05-fragments/agreement_section.toml b/examples/05-fragments/agreement_section.toml new file mode 100644 index 0000000..5fd378b --- /dev/null +++ b/examples/05-fragments/agreement_section.toml @@ -0,0 +1,45 @@ +name = "agreement_fragment" + +[[items]] +name = "agreement_header" +type = "section" +title = "āœ… Terms & Conditions" +border_top = true +order = 1 +margin_left = 2 + +[[items]] +name = "agreement_info" +type = "section" +content = "Please review and agree to our terms before proceeding" +order = 2 +margin_left = 2 + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "I agree to the terms and conditions" +required = true +order = 3 + +[[fields]] +name = "agree_privacy" +type = "confirm" +prompt = "I agree to the privacy policy" +required = true +order = 4 + +[[fields]] +name = "agree_marketing" +type = "confirm" +prompt = "I consent to receive marketing communications" +default = "false" +order = 5 + +[[items]] +name = "agreement_footer" +type = "section" +content = "Click submit to complete your registration" +border_bottom = true +align = "center" +order = 6 diff --git a/examples/05-fragments/custom_border_section.toml b/examples/05-fragments/custom_border_section.toml new file mode 100644 index 0000000..d0030fc --- /dev/null +++ b/examples/05-fragments/custom_border_section.toml @@ -0,0 +1,25 @@ +name = "custom_border_fragment" + +[[items]] +name = "custom_section_header" +type = "section" +title = "šŸŽØ Custom Border Styles" +border_top = true +order = 1 +border_top_char = "-" +border_top_len = 50 + +[[items]] +name = "custom_info" +type = "section" +content = "Top border uses '-' (50 chars), bottom border uses '*' (40 chars)" +order = 2 + +[[items]] +name = "custom_section_footer" +type = "section" +content = "You can have different styles for top and bottom borders!" +border_bottom = true +order = 3 +border_bottom_char = "*" +border_bottom_len = 40 diff --git a/examples/05-fragments/employee_info_section.toml b/examples/05-fragments/employee_info_section.toml new file mode 100644 index 0000000..0aa5013 --- /dev/null +++ b/examples/05-fragments/employee_info_section.toml @@ -0,0 +1,52 @@ +name = "employee_fragment" + +[[items]] +name = "employee_header" +type = "section" +title = "šŸ‘¤ Employee Information" +border_top = true +order = 1 +margin_left = 2 + +[[items]] +name = "employee_info" +type = "section" +content = "Please provide your employment details" +order = 2 +margin_left = 2 + +[[fields]] +name = "employee_name" +type = "text" +prompt = "Full Name" +required = true +order = 3 + +[[fields]] +name = "employee_email" +type = "text" +prompt = "Work Email" +required = true +order = 4 + +[[fields]] +name = "employee_department" +type = "select" +prompt = "Department" +options = ["Engineering", "Sales", "Marketing", "HR", "Finance"] +required = true +order = 5 + +[[fields]] +name = "employee_start_date" +type = "date" +prompt = "Start Date" +required = true +order = 6 + +[[items]] +name = "employee_footer" +type = "section" +content = "Please ensure all information is accurate" +border_bottom = true +order = 7 diff --git a/examples/05-fragments/enterprise_section.toml b/examples/05-fragments/enterprise_section.toml new file mode 100644 index 0000000..019504d --- /dev/null +++ b/examples/05-fragments/enterprise_section.toml @@ -0,0 +1,38 @@ +name = "enterprise_fragment" + +[[items]] +name = "enterprise_header" +type = "section" +title = "šŸ›ļø Enterprise Solution" +border_top = true +order = 1 +margin_left = 2 + +[[items]] +name = "enterprise_warning" +type = "section" +content = "āš ļø Requires enterprise agreement and custom setup" +order = 2 +margin_left = 2 + +[[items]] +name = "enterprise_features" +type = "section" +content = "āœ“ Unlimited everything\nāœ“ Dedicated support team\nāœ“ Custom integration\nāœ“ SLA guarantee\nāœ“ On-premise option\nāœ“ 24/7 phone support" +border_bottom = true +order = 3 +margin_left = 2 + +[[fields]] +name = "enterprise_contact_name" +type = "text" +prompt = "Enterprise contact person" +required = true +order = 4 + +[[fields]] +name = "enterprise_contact_email" +type = "text" +prompt = "Contact email" +required = true +order = 5 diff --git a/examples/05-fragments/fancy_border_section.toml b/examples/05-fragments/fancy_border_section.toml new file mode 100644 index 0000000..1be18fd --- /dev/null +++ b/examples/05-fragments/fancy_border_section.toml @@ -0,0 +1,34 @@ +name = "fancy_border_fragment" + +[[items]] +name = "fancy_header" +type = "section" +title = "ā•”ā•ā•ā•ā•ā•ā•ā•ā• FANCY BORDER ā•ā•ā•ā•ā•ā•ā•ā•ā•—" +border_top = true +order = 1 +border_margin_left = 0 +content_margin_left = 4 +border_top_l = "ā•”" +border_top_char = "ā•" +border_top_len = 35 +border_top_r = "ā•—" + +[[items]] +name = "fancy_content" +type = "section" +content = "This demonstrates fancy corner characters and borders" +order = 2 +margin_left = 4 + +[[items]] +name = "fancy_footer" +type = "section" +content = "You can create beautiful box designs with Unicode!" +border_bottom = true +order = 3 +border_margin_left = 0 +content_margin_left = 4 +border_bottom_l = "ā•š" +border_bottom_char = "ā•" +border_bottom_len = 35 +border_bottom_r = "ā•" diff --git a/examples/05-fragments/form_with_groups_includes.toml b/examples/05-fragments/form_with_groups_includes.toml new file mode 100644 index 0000000..600d689 --- /dev/null +++ b/examples/05-fragments/form_with_groups_includes.toml @@ -0,0 +1,48 @@ +name = "Modular Form with Groups & Includes" +description = "Compose form from reusable fragment files" + +# Include main header from fragment (paths relative to this file) +[[items]] +name = "main_group" +type = "group" +order = 1 +includes = ["fragments/header.toml"] + +# Account type selection +[[fields]] +name = "account_plan" +type = "select" +prompt = "Select your plan" +options = ["Personal", "Premium", "Enterprise"] +required = true +order = 2 + +# Premium section - conditionally loaded from fragment +[[items]] +name = "premium_group" +type = "group" +order = 3 +when = "account_plan == Premium" +includes = ["fragments/premium_section.toml"] + +# Enterprise section - conditionally loaded from fragment +[[items]] +name = "enterprise_group" +type = "group" +order = 4 +when = "account_plan == Enterprise" +includes = ["fragments/enterprise_section.toml"] + +# Support section - always included from fragment +[[items]] +name = "support_group" +type = "group" +order = 5 +includes = ["fragments/support_section.toml"] + +# Agreement section - always included from fragment +[[items]] +name = "agreement_group" +type = "group" +order = 6 +includes = ["fragments/agreement_section.toml"] diff --git a/examples/05-fragments/header.toml b/examples/05-fragments/header.toml new file mode 100644 index 0000000..1633b09 --- /dev/null +++ b/examples/05-fragments/header.toml @@ -0,0 +1,15 @@ +name = "header_fragment" + +[[items]] +name = "main_header" +type = "header" +title = "āœØ Form with Modular Sections" +border_top = true +border_bottom = true +align = "center" +order = 1 +margin_left = 0 +border_top_char = "ā•" +border_top_len = 60 +border_bottom_char = "ā•" +border_bottom_len = 60 diff --git a/examples/05-fragments/premium_section.toml b/examples/05-fragments/premium_section.toml new file mode 100644 index 0000000..fd3e228 --- /dev/null +++ b/examples/05-fragments/premium_section.toml @@ -0,0 +1,25 @@ +name = "premium_fragment" + +[[items]] +name = "premium_header" +type = "section" +title = "šŸŒŸ Premium Features" +border_top = true +order = 1 +margin_left = 2 + +[[items]] +name = "premium_features" +type = "section" +content = "āœ“ Unlimited storage\nāœ“ Advanced analytics\nāœ“ Priority support\nāœ“ Custom branding\nāœ“ API access" +border_bottom = true +order = 2 +margin_left = 2 + +[[fields]] +name = "premium_payment_method" +type = "select" +prompt = "Payment method" +options = ["Credit Card", "Bank Transfer", "PayPal"] +required = true +order = 3 diff --git a/examples/05-fragments/support_section.toml b/examples/05-fragments/support_section.toml new file mode 100644 index 0000000..6e68668 --- /dev/null +++ b/examples/05-fragments/support_section.toml @@ -0,0 +1,31 @@ +name = "support_fragment" + +[[items]] +name = "support_header" +type = "section" +title = "šŸ“ž Support Options" +border_top = true +order = 1 +margin_left = 2 + +[[items]] +name = "support_info" +type = "section" +content = "Choose your preferred support level" +order = 2 +margin_left = 2 + +[[fields]] +name = "support_level" +type = "select" +prompt = "Support Level" +options = ["Basic", "Standard", "Premium"] +required = true +order = 3 + +[[items]] +name = "support_footer" +type = "section" +content = "Support is available 24/7 for Premium plans" +border_bottom = true +order = 4 diff --git a/examples/06-integrations/README.md b/examples/06-integrations/README.md new file mode 100644 index 0000000..8fdf6de --- /dev/null +++ b/examples/06-integrations/README.md @@ -0,0 +1,29 @@ +# Integrations + +Advanced integrations with external tools and systems. + +## Nickel Configuration Language + +See: `nickel/README.md` + +Using Nickel for type-safe, programmable form schemas. + +## Internationalization (i18n) + +See: `i18n/README.md` + +Multi-language form support. + +## Available Integrations + +| Integration | Purpose | Files | +|-------------|---------|-------| +| Nickel | Type-safe schema generation | nickel/ | +| i18n | Multi-language support | i18n/ | + +## Future Integrations + +- JSON Schema validation +- Database integration +- API code generation +- GraphQL integration diff --git a/examples/06-integrations/i18n/README.md b/examples/06-integrations/i18n/README.md new file mode 100644 index 0000000..0c3abe6 --- /dev/null +++ b/examples/06-integrations/i18n/README.md @@ -0,0 +1,85 @@ +# Internationalization (i18n) + +Multi-language form support examples. + +## Files + +- **registration_i18n.toml** - Registration form with i18n strings +- **test_i18n_form.toml** - Test form for language support + +## Usage + +### Running with Different Languages + +```bash +# English (default) +LANG=en cargo run --example test_i18n_form + +# Spanish +LANG=es cargo run --example test_i18n_form + +# French +LANG=fr cargo run --example test_i18n_form +``` + +## Form Definition with i18n + +Forms use language keys instead of hardcoded text: + +```toml +[fields.email] +type = "email" +label = "fields.email.label" # References translation key +help_text = "fields.email.help" +``` + +## Translation Files + +Translations are stored in `locales/` directory: + +``` +locales/ +ā”œā”€ā”€ en.json +ā”œā”€ā”€ es.json +ā”œā”€ā”€ fr.json +ā””ā”€ā”€ de.json +``` + +## Translation Format + +```json +{ + "fields": { + "email": { + "label": "Email Address", + "help": "Enter your email address" + } + } +} +``` + +## Supported Languages + +Add translations by creating new locale files: +- `en` - English (default) +- `es` - Spanish +- `fr` - French +- `de` - German +- `ja` - Japanese +- (add more as needed) + +## Language Selection + +Languages are detected from: +1. `LANG` environment variable +2. `--lang` command-line argument +3. Browser `Accept-Language` header (web) +4. User preference in form + +## Best Practices + +- Use descriptive translation keys +- Keep translations organized by feature +- Include context for translators +- Test with different language lengths +- Consider RTL languages (Arabic, Hebrew) diff --git a/examples/06-integrations/i18n/registration_i18n.toml b/examples/06-integrations/i18n/registration_i18n.toml new file mode 100644 index 0000000..1dba81a --- /dev/null +++ b/examples/06-integrations/i18n/registration_i18n.toml @@ -0,0 +1,54 @@ +name = "user_registration" +description = "Register a new user account with multi-language support" +locale = "es-ES" + +[[items]] +name = "header" +type = "header" +title = "forms.registration.title" +i18n = true +border_top = true +border_bottom = true + +[[items]] +name = "description" +type = "section" +content = "Complete the form to create your account" + +[[fields]] +name = "username" +type = "text" +prompt = "forms.registration.username-prompt" +placeholder = "forms.registration.username-placeholder" +i18n = true +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "forms.registration.email-prompt" +placeholder = "forms.registration.email-placeholder" +i18n = true +required = true + +[[fields]] +name = "role" +type = "select" +prompt = "forms.registration.role-prompt" +options = ["forms.registration.roles.admin", "forms.registration.roles.user", "forms.registration.roles.guest"] +i18n = true +required = true + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "forms.registration.registration-confirm-prompt" +i18n = true +required = true +default = false + +[[items]] +name = "footer" +type = "footer" +content = "Your data will be securely stored and protected." +border_top = true diff --git a/examples/06-integrations/i18n/test_i18n_form.toml b/examples/06-integrations/i18n/test_i18n_form.toml new file mode 100644 index 0000000..6a33f49 --- /dev/null +++ b/examples/06-integrations/i18n/test_i18n_form.toml @@ -0,0 +1,18 @@ +name = "test_i18n" +description = "Test i18n form" +locale = "es-ES" + +[[fields]] +name = "username" +type = "text" +prompt = "registration-username-prompt" +placeholder = "registration-username-placeholder" +i18n = true + +[[fields]] +name = "role" +type = "select" +prompt = "role-prompt" +options = ["role-admin", "role-user", "role-guest"] +i18n = true +default = "role-user" diff --git a/examples/06-integrations/nickel/README.md b/examples/06-integrations/nickel/README.md new file mode 100644 index 0000000..9830cfb --- /dev/null +++ b/examples/06-integrations/nickel/README.md @@ -0,0 +1,69 @@ +# Nickel Integration + +Type-safe form schema generation using Nickel configuration language. + +## Files + +- **nickel_schema.ncl** - Type-safe form schema definition +- **nickel_template.ncl.j2** - Jinja2 template for schema generation + +## About Nickel + +Nickel is a powerful configuration language that provides: +- Strong typing +- Validation rules +- Reusable schemas +- Inheritance and composition + +## Usage + +### Generate Form from Nickel Schema + +```bash +# Process template through Jinja2 +j2 nickel_template.ncl.j2 > form_schema.ncl + +# Generate TOML from Nickel +nickel eval nickel_schema.ncl > form_config.toml + +# Run form +cargo run -p typedialog-web -- --config form_config.toml +``` + +### Example Nickel Schema + +```nickel +{ + form = { + title = "Registration", + fields = { + email = { + type = "email", + required = true, + label = "Email Address", + } + } + } +} +``` + +## Benefits + +- **Type Safety** - Catch schema errors at compile time +- **Inheritance** - Reuse common field definitions +- **Validation** - Built-in schema validation +- **Macros** - Generate repetitive fields +- **Documentation** - Self-documenting schemas + +## Advanced Features + +- Field inheritance +- Custom validators +- Conditional schemas +- Template-driven generation +- Schema composition + +## Learn More + +- [Nickel Language](https://nickel-lang.org) +- [Nickel Documentation](https://nickel-lang.org/user-manual) diff --git a/examples/06-integrations/nickel/nickel_schema.ncl b/examples/06-integrations/nickel/nickel_schema.ncl new file mode 100644 index 0000000..2bd0e65 --- /dev/null +++ b/examples/06-integrations/nickel/nickel_schema.ncl @@ -0,0 +1,81 @@ +# Example Nickel schema for TypeDialog form generation +# +# This demonstrates how to structure a Nickel configuration schema +# that TypeDialog can parse and convert to interactive forms. + +{ + # Application configuration group + app = { + name : String + | doc "Application name" + = "my-app", + + version : String + | doc "Application version (semantic versioning)" + = "1.0.0", + + environment : String + | doc "Environment (development, staging, production)" + = "development", + }, + + # Server configuration group + server = { + host : String + | doc "Server hostname or IP address" + = "0.0.0.0", + + port : Number + | doc "Server port number" + = 8080, + + workers : Number + | doc "Number of worker threads" + = 4, + }, + + # Database configuration group + database = { + url : String + | doc "Database connection URL" + = "postgresql://localhost/myapp", + + pool_size : Number + | doc "Database connection pool size" + = 10, + + read_timeout : Number + | doc "Read timeout in seconds" + = 30, + }, + + # TLS/SSL configuration + tls = { + enabled : Bool + | doc "Enable TLS/SSL" + = false, + + cert_path : String + | doc "Path to TLS certificate" + = "", + + key_path : String + | doc "Path to TLS private key" + = "", + }, + + # Features configuration (optional group) + features = { + monitoring : Bool + | doc "Enable monitoring and metrics" + = false, + + caching : Bool + | doc "Enable response caching" + = true, + + cors : Bool + | doc "Enable CORS headers" + = true, + }, +} diff --git a/examples/06-integrations/nickel/nickel_template.ncl.j2 b/examples/06-integrations/nickel/nickel_template.ncl.j2 new file mode 100644 index 0000000..37b0cc5 --- /dev/null +++ b/examples/06-integrations/nickel/nickel_template.ncl.j2 @@ -0,0 +1,56 @@ +# Example Nickel template for TypeDialog metaprogramming +# +# This template demonstrates dynamic Nickel code generation using +# form results and Jinja2 template syntax. +# +# Usage: typedialog nickel-template template.ncl.j2 results.json -o output.ncl + +# Generated Nickel configuration from form results +{ + app = { + name : String = "{{ app_name }}", + version : String = "{{ app_version }}", + {%- if app_environment %} + environment : String = "{{ app_environment }}", + {%- endif %} + }, + + server = { + host : String = "{{ server_host }}", + port : Number = {{ server_port }}, + {%- if server_workers %} + workers : Number = {{ server_workers }}, + {%- endif %} + }, + + database = { + url : String = "{{ database_url }}", + {%- if database_pool_size %} + pool_size : Number = {{ database_pool_size }}, + {%- endif %} + }, + + {%- if tls_enabled %} + tls = { + enabled : Bool = {{ tls_enabled }}, + {%- if tls_cert_path %} + cert_path : String = "{{ tls_cert_path }}", + {%- endif %} + {%- if tls_key_path %} + key_path : String = "{{ tls_key_path }}", + {%- endif %} + }, + {%- endif %} + + features = { + {%- if features_monitoring %} + monitoring : Bool = {{ features_monitoring }}, + {%- endif %} + {%- if features_caching %} + caching : Bool = {{ features_caching }}, + {%- endif %} + {%- if features_cors %} + cors : Bool = {{ features_cors }}, + {%- endif %} + }, +} diff --git a/examples/09-templates/README.md b/examples/09-templates/README.md new file mode 100644 index 0000000..0dd4bbb --- /dev/null +++ b/examples/09-templates/README.md @@ -0,0 +1,74 @@ +# Real-World Templates + +Complete, production-ready form templates for common use cases. + +## Available Templates + +### Employee Onboarding + +See: `employee_onboarding/` + +Complete employee onboarding workflow: +- Personal information +- Employment details +- Policy agreements +- Emergency contacts +- Benefits selection + +### User Registration + +See: `user_registration/` + +User registration and sign-up flow: +- Account information +- Contact details +- Password setup +- Email verification +- Terms acceptance + +### Library Catalog + +See: `library_catalog/` + +Library management system: +- Book information +- Author details +- Inventory tracking +- Checkout system +- Lending rules + +## Using These Templates + +### As-is + +```bash +# Run employee onboarding form +cargo run -p typedialog-web -- --config examples/09-templates/employee_onboarding/form.toml + +# Run user registration +cargo run -p typedialog-web -- --config examples/09-templates/user_registration/form.toml +``` + +### As Starting Points + +Copy and customize for your needs: +- Modify fields for your domain +- Add backend-specific logic +- Integrate with your database +- Add validation and error handling + +## Template Structure + +Each template includes: +- `form.toml` - Form definition +- `README.md` - Template documentation +- `example.json` - Sample submission data (if applicable) + +## Common Patterns + +All templates demonstrate: +- **Validation** - Field-level validation rules +- **Sections** - Logical form organization +- **Conditional Logic** - Show/hide fields based on input +- **Error Handling** - Clear error messages +- **Accessibility** - Labels and descriptions diff --git a/examples/09-templates/employee_onboarding/README.md b/examples/09-templates/employee_onboarding/README.md new file mode 100644 index 0000000..e6cffd1 --- /dev/null +++ b/examples/09-templates/employee_onboarding/README.md @@ -0,0 +1,112 @@ +# Employee Onboarding Template + +Complete employee onboarding form workflow. + +## Files + +- **employee_onboarding_form.toml** - Main onboarding form +- **onboarding_template.toml** - Alternative onboarding template + +## Sections + +1. **Personal Information** + - Full name + - Email address + - Phone number + - Date of birth (optional) + +2. **Employment Details** + - Job title + - Department + - Start date + - Reports to + +3. **Address Information** + - Street address + - City, state, zip + - Country + +4. **Emergency Contact** + - Contact name + - Relationship + - Phone number + +5. **Policy Agreements** + - Employee handbook acknowledgment + - Confidentiality agreement + - Code of conduct + - Data privacy consent + +6. **Benefits Selection** + - Health insurance tier + - 401k enrollment + - Direct deposit setup + +## Running the Form + +### CLI +```bash +cargo run --example employee_onboarding_form +``` + +### TUI +```bash +cargo run -p typedialog-tui -- \ + --config examples/09-templates/employee_onboarding/employee_onboarding_form.toml +``` + +### Web +```bash +cargo run -p typedialog-web -- \ + --config examples/09-templates/employee_onboarding/employee_onboarding_form.toml +``` + +## Expected Output + +The form produces JSON: +```json +{ + "first_name": "John", + "last_name": "Doe", + "email": "john@company.com", + "phone": "+1-555-0123", + "job_title": "Software Engineer", + "department": "Engineering", + "start_date": "2024-01-15", + "handbook_agreed": true, + "benefits_tier": "Gold" +} +``` + +## Customization + +### Add Fields +Edit the TOML to add: +- Health screening questions +- IT equipment assignments +- Training preferences +- Background check authorization + +### Add Validation +```toml +[fields.email] +type = "email" +label = "Work Email" +pattern = "@company\\.com$" # Must be company email +``` + +### Conditional Sections +Show benefits section only if: +```toml +[sections.benefits] +visible_when = { employment_type = "Full-Time" } +``` + +## Integration + +After form submission: +1. Store data in employee management system +2. Trigger background check process +3. Create email account +4. Assign IT equipment +5. Send welcome package diff --git a/examples/09-templates/employee_onboarding/employee_onboarding_form.toml b/examples/09-templates/employee_onboarding/employee_onboarding_form.toml new file mode 100644 index 0000000..a698542 --- /dev/null +++ b/examples/09-templates/employee_onboarding/employee_onboarding_form.toml @@ -0,0 +1,30 @@ +name = "Employee Onboarding Form" +description = "Compose employee form from reusable fragments" + +# Include main header (path relative to this file's directory) +[[items]] +name = "header_group" +type = "group" +order = 1 +includes = ["fragments/header.toml"] + +# Employee information section with fields +[[items]] +name = "employee_group" +type = "group" +order = 2 +includes = ["fragments/employee_info_section.toml"] + +# Reuse support section from previous form +[[items]] +name = "support_group" +type = "group" +order = 3 +includes = ["fragments/support_section.toml"] + +# Reuse agreement section from previous form +[[items]] +name = "agreement_group" +type = "group" +order = 4 +includes = ["fragments/agreement_section.toml"] diff --git a/examples/09-templates/library_catalog/README.md b/examples/09-templates/library_catalog/README.md new file mode 100644 index 0000000..1130330 --- /dev/null +++ b/examples/09-templates/library_catalog/README.md @@ -0,0 +1,187 @@ +# Library Catalog Template + +Library management and book catalog system. + +## Files + +- **library_example.rs** - Complete Rust implementation of library system + +## Features + +### Book Information +- ISBN +- Title +- Author(s) +- Publisher +- Publication date +- Edition +- Language +- Total pages + +### Inventory Management +- Number of copies +- Available copies +- Location (shelf, building) +- Condition status +- Last inventory date + +### Patron Management +- Member ID +- Name +- Email +- Phone +- Address +- Membership tier +- Lending privileges + +### Checkout System +- Book selection +- Checkout date +- Due date +- Renewal options +- Late fees +- Hold requests + +### Lending Rules +- Loan period (varies by type) +- Renewal limits +- Maximum books per member +- Overdue penalties +- Reservation system + +## Running the Example + +### CLI Interactive +```bash +cargo run --example library_example +``` + +### Programmatic +The Rust implementation provides: +- Full library API +- Persistence layer +- Validation logic +- Report generation + +## Data Model + +```json +{ + "book": { + "isbn": "978-0-13-110362-7", + "title": "The C Programming Language", + "author": "Brian W. Kernighan", + "total_copies": 5, + "available_copies": 3 + }, + "member": { + "id": "MEM-12345", + "name": "Alice Johnson", + "tier": "premium", + "max_books": 10, + "current_books": 3 + }, + "checkout": { + "member_id": "MEM-12345", + "book_isbn": "978-0-13-110362-7", + "checkout_date": "2024-01-15", + "due_date": "2024-02-15", + "renewable": true + } +} +``` + +## Use Cases + +### Patron Workflows +- New member registration +- Book search and discovery +- Checkout and renewal +- Hold requests +- Fine payment + +### Librarian Tools +- Add/update book information +- Manage inventory +- Process checkouts +- Generate reports +- Manage late returns + +### Administrative +- Member management +- Lending policy configuration +- Overdue report generation +- Collection analysis +- Usage statistics + +## Customization + +### Add Genres/Categories +```rust +pub struct Book { + isbn: String, + title: String, + genre: String, // Add this + categories: Vec, // Add this +} +``` + +### Implement Reservations +```rust +pub struct Reservation { + member_id: String, + book_isbn: String, + queue_position: u32, + created_date: DateTime, +} +``` + +### Add Rating/Reviews +```rust +pub struct Review { + member_id: String, + book_isbn: String, + rating: u8, // 1-5 + comment: String, +} +``` + +## Database Integration + +Example: Store with SQLite/PostgreSQL + +```sql +CREATE TABLE books ( + isbn VARCHAR(13) PRIMARY KEY, + title VARCHAR(255), + author VARCHAR(255), + total_copies INT, + available_copies INT +); + +CREATE TABLE members ( + id VARCHAR(20) PRIMARY KEY, + name VARCHAR(255), + email VARCHAR(255), + tier VARCHAR(50) +); + +CREATE TABLE checkouts ( + id SERIAL PRIMARY KEY, + member_id VARCHAR(20), + book_isbn VARCHAR(13), + checkout_date DATE, + due_date DATE, + return_date DATE +); +``` + +## Features Demonstrated + +- Complex data structures +- State management +- Business logic +- Validation rules +- Interactive menus +- Error handling +- Persistence patterns diff --git a/examples/09-templates/library_catalog/library_example.rs b/examples/09-templates/library_catalog/library_example.rs new file mode 100644 index 0000000..f3d8ecb --- /dev/null +++ b/examples/09-templates/library_catalog/library_example.rs @@ -0,0 +1,83 @@ +//! Example of using typedialog as a library +//! +//! Run with: cargo run --example library_example + +use typedialog::{prompts, form_parser}; + +fn main() -> typedialog::Result<()> { + println!("\n=== typedialog Library Examples ===\n"); + + // Example 1: Simple text input + println!("--- Text Input Example ---"); + let name = prompts::text("What is your name?", Some("Alice"), Some("e.g., John Doe"))?; + println!("You entered: {}\n", name); + + // Example 2: Confirmation + println!("--- Confirmation Example ---"); + let confirmed = prompts::confirm("Do you want to continue?", Some(true), None)?; + println!("Confirmed: {}\n", confirmed); + + // Example 3: Selection from list + println!("--- Selection Example ---"); + let options = vec!["Rust".to_string(), "Python".to_string(), "JavaScript".to_string()]; + let language = prompts::select("Choose your favorite language", options, Some(3), false)?; + println!("You selected: {}\n", language); + + // Example 4: Multiple selections + println!("--- Multi-Select Example ---"); + let frameworks = vec![ + "Actix".to_string(), + "Tokio".to_string(), + "Rocket".to_string(), + "Axum".to_string(), + ]; + let selected = prompts::multi_select( + "Which frameworks have you used?", + frameworks, + Some(2), + false, + )?; + println!("You selected: {:?}\n", selected); + + // Example 5: Password input + println!("--- Password Example ---"); + let password = prompts::password("Enter a password", true)?; + println!("Password length: {}\n", password.len()); + + // Example 6: Date selection + println!("--- Date Example ---"); + let date = prompts::date( + "Select your birth date", + Some("2000-01-01"), + Some("1900-01-01"), + Some("2024-12-31"), + "Mon", + )?; + println!("Selected date: {}\n", date); + + // Example 7: Custom type + println!("--- Custom Type Example ---"); + let port = prompts::custom("Enter port number", "u16", Some("8080"))?; + println!("Port: {}\n", port); + + // Example 8: Load and execute form from TOML + println!("--- Form Example ---"); + match form_parser::load_from_file("examples/registration_form.toml") { + Ok(form) => { + println!("Executing form: {}\n", form.name); + match form_parser::execute(form) { + Ok(results) => { + println!("Form results:"); + for (key, value) in results { + println!(" {}: {}", key, value); + } + } + Err(e) => eprintln!("Error executing form: {}", e), + } + } + Err(e) => eprintln!("Error loading form: {}", e), + } + + println!("\n=== Done ===\n"); + Ok(()) +} diff --git a/examples/09-templates/onboarding_template.toml b/examples/09-templates/onboarding_template.toml new file mode 100644 index 0000000..ef7799a --- /dev/null +++ b/examples/09-templates/onboarding_template.toml @@ -0,0 +1,57 @@ +name = "employee_onboarding" +description = "Employee onboarding with dynamic templates" + +[[items]] +name = "welcome" +type = "section" +template = "Welcome to the team, {{ env.USER }}!" + +[[items]] +name = "instructions" +type = "section" +content = "Please complete the following information to get started." + +[[fields]] +name = "full_name" +type = "text" +prompt = "What is your full name?" +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "Enter your work email address" +default = "{{ env.USER }}@company.com" +required = true + +[[fields]] +name = "department" +type = "select" +prompt = "Which department are you joining?" +options = ["Engineering", "Marketing", "Sales", "Support", "HR"] +required = true + +[[fields]] +name = "start_date" +type = "date" +prompt = "What is your start date?" +required = true + +[[fields]] +name = "manager_name" +type = "text" +prompt = "Who is your manager?" +required = true + +[[fields]] +name = "office_location" +type = "select" +prompt = "Which office location?" +options = ["New York", "San Francisco", "London", "Remote"] +required = true + +[[items]] +name = "closing" +type = "footer" +content = "Thank you for completing your onboarding! Welcome aboard!" +border_top = true diff --git a/examples/09-templates/user_registration/README.md b/examples/09-templates/user_registration/README.md new file mode 100644 index 0000000..bda4aac --- /dev/null +++ b/examples/09-templates/user_registration/README.md @@ -0,0 +1,128 @@ +# User Registration Template + +User sign-up and registration form. + +## Files + +- **user_registration_form.toml** - Modern registration form +- **registration_form.toml** - Alternative registration template + +## Form Sections + +### Account Setup +- Email address (with validation) +- Password (with strength indicator) +- Password confirmation +- Username (optional) + +### Personal Information +- Full name +- Age/Date of birth +- Phone number + +### Preferences +- Newsletter subscription +- Marketing communications +- Privacy notifications + +### Terms & Conditions +- Terms of service agreement +- Privacy policy acceptance +- Marketing opt-in (optional) + +## Running the Form + +### CLI +```bash +cargo run --example user_registration_form +``` + +### TUI +```bash +cargo run -p typedialog-tui -- \ + --config examples/09-templates/user_registration/user_registration_form.toml +``` + +### Web (Recommended) +```bash +cargo run -p typedialog-web -- \ + --config examples/09-templates/user_registration/user_registration_form.toml +``` + +Open browser to `http://localhost:3000` + +## Expected Output + +```json +{ + "email": "user@example.com", + "password": "hashedpassword", + "full_name": "Jane Doe", + "date_of_birth": "1990-05-15", + "phone": "+1-555-0123", + "newsletter_subscribed": true, + "terms_agreed": true, + "privacy_agreed": true +} +``` + +## Validation Rules + +- **Email** - Must be valid and unique +- **Password** - Min 8 chars, uppercase, number, special char +- **Phone** - Valid phone format +- **Age** - Must be 18+ (if applicable) +- **Terms** - Must be checked + +## Customization + +### Add Fields +```toml +[fields.referral_code] +type = "text" +label = "Referral Code (Optional)" +required = false +validation = { pattern = "^[A-Z0-9]{6,}$" } +``` + +### Add Email Verification +```toml +[fields.email_verify] +type = "email" +label = "Confirm Email" +validation = { must_match = "email" } +``` + +### Password Strength Indicator +```toml +[fields.password] +type = "password" +label = "Password" +help = "Min 8 chars, uppercase, number, special char" +validation = { + min_length = 8, + require_uppercase = true, + require_number = true, + require_special = true +} +``` + +## Integration + +Post-submission workflow: +1. Create user account +2. Hash and store password +3. Send verification email +4. Store preferences +5. Trigger welcome email +6. Create user profile +7. Initialize user settings + +## Security Considerations + +- Passwords over HTTPS only +- Rate limit registration (prevent abuse) +- Verify email before full access +- CAPTCHA for bot prevention +- Log registration attempts +- Password hashing (bcrypt/argon2) diff --git a/examples/09-templates/user_registration/registration_form.toml b/examples/09-templates/user_registration/registration_form.toml new file mode 100644 index 0000000..3afbe8d --- /dev/null +++ b/examples/09-templates/user_registration/registration_form.toml @@ -0,0 +1,48 @@ +name = "user_registration" +description = "Simple user registration form" + +[[fields]] +name = "username" +type = "text" +prompt = "Enter username" +placeholder = "john_doe" + +[[fields]] +name = "email" +type = "text" +prompt = "Enter email" +placeholder = "user@example.com" + +[[fields]] +name = "password" +type = "password" +prompt = "Enter password" + +[[fields]] +name = "confirm_password" +type = "password" +prompt = "Confirm password" + +[[fields]] +name = "agree_terms" +type = "confirm" +prompt = "Do you agree to the terms and conditions?" +default = "false" + +[[fields]] +name = "newsletter" +type = "confirm" +prompt = "Subscribe to our newsletter?" +default = "true" + +[[fields]] +name = "role" +type = "select" +prompt = "Select your role" +options = ["Admin", "User", "Guest"] + +[[fields]] +name = "interests" +type = "multiselect" +prompt = "Select your interests" +options = ["Technology", "Design", "Business", "Marketing"] diff --git a/examples/09-templates/user_registration/user_registration_form.toml b/examples/09-templates/user_registration/user_registration_form.toml new file mode 100644 index 0000000..68dc6d1 --- /dev/null +++ b/examples/09-templates/user_registration/user_registration_form.toml @@ -0,0 +1,63 @@ +name = "user_registration" +description = "User registration form with autocompletion examples" + +[[fields]] +name = "username" +type = "text" +prompt = "Enter username" +required = true + +[[fields]] +name = "email" +type = "text" +prompt = "Enter your email address" +placeholder = "user@example.com" +required = true + +[[fields]] +name = "password" +type = "password" +prompt = "Enter password" +required = true + +[[fields]] +name = "confirm_password" +type = "password" +prompt = "Confirm password" +required = true + +[[fields]] +name = "country" +type = "select" +prompt = "Select your country" +options = ["United States", "Canada", "Mexico", "United Kingdom", "Germany", "France", "Spain", "Italy", "Other"] + +[[fields]] +name = "company" +type = "text" +prompt = "Enter company name" +placeholder = "Acme Corporation" + +[[fields]] +name = "website" +type = "text" +prompt = "Enter company website" +placeholder = "https://example.com" + +[[fields]] +name = "subscribe" +type = "confirm" +prompt = "Subscribe to newsletter?" +default = true + +[[fields]] +name = "interests" +type = "multiselect" +prompt = "Select your interests" +options = ["Technology", "Design", "Marketing", "Business", "Development", "Data Science"] + +[[fields]] +name = "agreed_terms" +type = "confirm" +prompt = "Do you agree to the terms and conditions?" +default = false diff --git a/examples/README.md b/examples/README.md new file mode 100644 index 0000000..f3710d4 --- /dev/null +++ b/examples/README.md @@ -0,0 +1,242 @@ + +
+ TypeDialog Logo +
+ +# TypeDialog Examples + +Complete example collection organized by feature category and backend implementation. + +## Quick Start + +### First Time? +Start here: [`01-basic/`](01-basic/) + +```bash +# Run a simple form +cargo run --example form + +# Or with a specific backend +cargo run -p typedialog-tui --example form_with_autocompletion +``` + +## Example Categories + +### 1. **Basic Forms** ā†’ [`01-basic/`](01-basic/) +Simple form structures for getting started. +- Form fundamentals +- Sections and grouping +- Basic validation +- **Best for:** Learning the syntax, quick prototypes + +### 2. **Advanced Features** ā†’ [`02-advanced/`](02-advanced/) +Conditional logic, dynamic fields, complex forms. +- Conditional visibility +- Required field rules +- State management +- **Best for:** Complex workflows, conditional UX + +### 3. **Styling & Appearance** ā†’ [`03-styling/`](03-styling/) +Custom borders, themes, and visual design. +- Border styles +- Visual hierarchy +- Theme customization +- **Best for:** CLI aesthetics, branded interfaces + +### 4. **Backend-Specific** ā†’ [`04-backends/`](04-backends/) +Implementation details for each backend. + +| Backend | Path | Best For | +|---------|------|----------| +| **CLI** | [`04-backends/cli/`](04-backends/cli/) | Scripting, server tools, pipes | +| **TUI** | [`04-backends/tui/`](04-backends/tui/) | Interactive terminal apps, dashboards | +| **Web** | [`04-backends/web/`](04-backends/web/) | SaaS, public forms, browsers | + +**Running forms by backend:** +```bash +# CLI (default) +cargo run --example form + +# TUI +cargo run -p typedialog-tui --example form_with_autocompletion + +# Web +cargo run -p typedialog-web -- --config form.toml +``` + +### 5. **Fragments & Composition** ā†’ [`05-fragments/`](05-fragments/) +Reusable components and form composition. +- Fragment templates +- Includes and inheritance +- Component libraries +- **Best for:** Large projects, DRY principle, multiple forms + +### 6. **Integrations** ā†’ [`06-integrations/`](06-integrations/) +External tool integrations. + +| Integration | Path | +|-------------|------| +| **Nickel** (Type-safe schemas) | [`06-integrations/nickel/`](06-integrations/nickel/) | +| **i18n** (Multi-language) | [`06-integrations/i18n/`](06-integrations/i18n/) | + +### 9. **Real-World Templates** ā†’ [`09-templates/`](09-templates/) +Production-ready examples for common use cases. + +| Template | Path | Use Case | +|----------|------|----------| +| **Employee Onboarding** | [`09-templates/employee_onboarding/`](09-templates/employee_onboarding/) | HR systems | +| **User Registration** | [`09-templates/user_registration/`](09-templates/user_registration/) | SaaS, apps | +| **Library Catalog** | [`09-templates/library_catalog/`](09-templates/library_catalog/) | Management systems | + +## Learning Path + +``` +START HERE + ā†“ +01-basic/ ā† Understand form structure + ā†“ +02-advanced/ ā† Add conditional logic + ā†“ +03-styling/ ā† Customize appearance + ā†“ +04-backends/ ā† Choose your backend + ā”œā†’ 04-backends/cli/ ā† Scripting + ā”œā†’ 04-backends/tui/ ā† Interactive UX + ā””ā†’ 04-backends/web/ ā† Web deployment + ā†“ +05-fragments/ ā† Scale to multiple forms + ā†“ +06-integrations/ ā† Advanced integrations + ā†“ +09-templates/ ā† Deploy to production +``` + +## Common Tasks + +### Run a Basic Example +```bash +cargo run --example form +``` + +### Try Different Backends +```bash +# CLI +cargo run --example form + +# TUI +cargo run -p typedialog-tui --example tui_survey_form + +# Web +cargo run -p typedialog-web -- --config examples/04-backends/web/web_registration_form.toml +``` + +### Use with TOML Configuration +```bash +cargo run -p typedialog-web -- --config examples/01-basic/form_with_sections.toml +``` + +### Use with Rust Code +```bash +cargo run --example form_with_autocompletion +``` + +### Test Conditional Logic +```bash +cargo run --example conditional_required_demo +``` + +### Try Multi-Language Support +```bash +LANG=es cargo run --example test_i18n_form +``` + +## File Types + +### TOML (`.toml`) +Configuration-driven forms - fastest iteration. +```bash +cargo run -p typedialog-web -- --config form.toml +``` + +### Rust (`.rs`) +Programmatic forms - maximum control. +```bash +cargo run --example form_example +``` + +### Nickel (`.ncl`) +Type-safe schema generation. +```bash +nickel eval schema.ncl > form.toml +``` + +## Backend Compatibility + +| Feature | CLI | TUI | Web | +|---------|-----|-----|-----| +| TOML forms | āœ“ | āœ“ | āœ“ | +| Rust code | āœ“ | āœ“ | - | +| Conditional fields | āœ“ | āœ“ | āœ“ | +| Autocompletion | āœ“ | āœ“ | āœ“ | +| Custom styling | - | āœ“ | āœ“ | +| Validation | āœ“ | āœ“ | āœ“ | +| i18n support | āœ“ | āœ“ | āœ“ | +| Fragments | āœ“ | āœ“ | āœ“ | + +## Tips + +### For CLI Forms +- Use for scripts and automation +- Good for piping between tools +- Minimal dependencies + +### For TUI Forms +- Create interactive dashboards +- Better UX than CLI +- Keyboard shortcuts available +- Mouse support + +### For Web Forms +- Public-facing forms +- Rich styling options +- Browser validation +- Mobile-friendly +- RESTful API integration + +## Troubleshooting + +**"Example not found"** +- Check example is in `examples/` directory +- Use `--example` flag with cargo + +**"Feature not compiled"** +- Run: `cargo build --all-features` +- Check feature flags in Cargo.toml + +**"Form not displaying"** +- For web: Check terminal output for port +- For TUI: Ensure terminal supports the feature +- For CLI: Check input/output redirection + +## Next Steps + +1. Read the category README for your use case +2. Copy and modify an example form +3. Consult [`06-integrations/`](06-integrations/) for advanced features +4. Deploy a template from [`09-templates/`](09-templates/) +5. Integrate with your application + +## Contributing Examples + +To add new examples: +1. Create in appropriate category +2. Add README explaining the example +3. Include usage instructions +4. List features demonstrated +5. Provide expected output + +--- + +**Start with:** [`01-basic/README.md`](01-basic/README.md) +**Need specific backend?** Check [`04-backends/`](04-backends/) +**Want real-world example?** See [`09-templates/`](09-templates/)