{
  "page_ir": {
    "page_id": "loan_calculator",
    "page_goal": "Single-page loan calculator that accepts principal, interest rate, and loan term inputs, calculates monthly payment/total interest/total paid, and displays a full amortization schedule with export and print capabilities.",
    "style": {
      "tone": "professional",
      "theme": "light",
      "density": "comfortable",
      "color_intent": "neutral with blue primary accents"
    },
    "accessibility": {
      "required_labels": [
        "loan_amount_input",
        "interest_rate_input",
        "loan_term_input",
        "term_unit_select",
        "calculate_button",
        "reset_button",
        "export_csv_button",
        "print_button",
        "results_card",
        "amortization_table"
      ],
      "skip_navigation": true,
      "focus_management": true,
      "announce_changes": []
    },
    "responsive": {
      "breakpoints": {
        "mobile": 320,
        "tablet": 768,
        "desktop": 1024,
        "wide": 1440
      },
      "collapse_rules": [
        "amortization_table converts to card layout on mobile",
        "form fields stack vertically on mobile"
      ],
      "hidden_on_small": [
        "export_csv_button",
        "print_button"
      ],
      "stack_on_small": []
    },
    "constraints": [
      "All calculations performed via backend POST /calculations/ endpoint",
      "Amortization schedule fetched via GET /calculations/{id}/details",
      "Results and schedule sections hidden until calculation is performed"
    ],
    "seo_title": null,
    "seo_description": null
  },
  "data_ir": {
    "types": {},
    "state": {
      "termUnit": {
        "type": "enum",
        "initial": "months",
        "required": true,
        "constraints": {
          "allowed_values": [
            "months",
            "years"
          ]
        },
        "item_type": null
      },
      "calculationResult": {
        "type": "object",
        "initial": null,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "amortizationSchedule": {
        "type": "array",
        "initial": [],
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "isCalculating": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "hasCalculated": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "calculationId": {
        "type": "string",
        "initial": "",
        "required": false,
        "constraints": {},
        "item_type": null
      }
    },
    "derived": {
      "loanTermDisplay": {
        "type": "string",
        "expr": "calculationResult ? `${calculationResult.loan_term_months} months (${(calculationResult.loan_term_months / 12).toFixed(1)} years)` : ''",
        "deps": []
      },
      "showResults": {
        "type": "boolean",
        "expr": "hasCalculated && calculationResult !== null",
        "deps": []
      }
    }
  },
  "data_fetch_ir": {
    "endpoints": {
      "157c14f819c1403e84fbb4da7bee41af": {
        "endpoint_id": "157c14f819c1403e84fbb4da7bee41af",
        "module": "Loan Calculations",
        "endpoint": "/calculations/",
        "method": "POST",
        "path_params": {},
        "query_params": {},
        "body": {
          "principal": "$form.principal",
          "annual_interest_rate": "$form.annual_interest_rate",
          "loan_term_months": "$form.loan_term_months",
          "calculation_method": "standard_amortization",
          "start_date": null
        },
        "fields": [
          "id",
          "principal",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_interest",
          "total_amount_paid",
          "calculation_method",
          "start_date",
          "created_at",
          "updated_at"
        ],
        "response_target": "calculationResult",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "e5b7be497e7f4fc18e878e9b7641903d": {
        "endpoint_id": "e5b7be497e7f4fc18e878e9b7641903d",
        "module": "Loan Calculations",
        "endpoint": "/calculations/{calculation_id}/details",
        "method": "GET",
        "path_params": {
          "calculation_id": "$state.calculationId"
        },
        "query_params": {},
        "body": null,
        "fields": [
          "id",
          "principal",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_interest",
          "total_amount_paid",
          "calculation_method",
          "start_date",
          "created_at",
          "updated_at",
          "amortization_schedule_entries"
        ],
        "response_target": "amortizationSchedule",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      }
    }
  },
  "data_model_ir": {
    "entities": {
      "calculation": {
        "name": "Calculation",
        "backend_module": "Loan Calculations",
        "fields": [
          "id",
          "principal",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_interest",
          "total_amount_paid",
          "calculation_method",
          "start_date",
          "created_at",
          "updated_at"
        ],
        "computed": [],
        "display_fields": [
          "monthly_payment",
          "total_interest",
          "total_amount_paid",
          "loan_term_months",
          "annual_interest_rate"
        ],
        "search_fields": [],
        "filters": [],
        "default_sort": null,
        "default_sort_dir": "asc"
      },
      "amortization_entry": {
        "name": "AmortizationScheduleEntry",
        "backend_module": "Loan Calculations",
        "fields": [
          "payment_number",
          "payment_date",
          "beginning_balance",
          "payment_amount",
          "principal_payment",
          "interest_payment",
          "ending_balance",
          "cumulative_interest"
        ],
        "computed": [],
        "display_fields": [
          "payment_number",
          "payment_date",
          "beginning_balance",
          "payment_amount",
          "principal_payment",
          "interest_payment",
          "ending_balance",
          "cumulative_interest"
        ],
        "search_fields": [],
        "filters": [],
        "default_sort": null,
        "default_sort_dir": "asc"
      }
    },
    "relationships": []
  },
  "behaviour_ir": {
    "events": {
      "onTermUnitChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.termUnit",
            "expr": "event.value"
          }
        ],
        "description": ""
      }
    },
    "actions": {
      "f8fbb1a74cd74e4babb07bb57a4117f9": {
        "action_id": "f8fbb1a74cd74e4babb07bb57a4117f9",
        "trigger": "form_submit",
        "target_component_id": "loan_form",
        "operation": "create",
        "description": "",
        "payload": {
          "principal": "$form.principal",
          "annual_interest_rate": "$form.annual_interest_rate",
          "loan_term_months": "$derived.computedTermMonths"
        },
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [
          {
            "rule_id": "val_0",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal\", \"message\": \"Loan amount is required\", \"rule_id\": \"val_principal_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"principal\", \"message\": \"Loan amount is required\", \"rule_id\": \"val_principal_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_1",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal\", \"message\": \"Loan amount must be greater than $0\", \"rule_id\": \"val_principal_min\", \"type\": \"min\", \"value\": 1}",
            "message": "{\"field\": \"principal\", \"message\": \"Loan amount must be greater than $0\", \"rule_id\": \"val_principal_min\", \"type\": \"min\", \"value\": 1}"
          },
          {
            "rule_id": "val_2",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal\", \"message\": \"Loan amount cannot exceed $100,000,000\", \"rule_id\": \"val_principal_max\", \"type\": \"max\", \"value\": 100000000}",
            "message": "{\"field\": \"principal\", \"message\": \"Loan amount cannot exceed $100,000,000\", \"rule_id\": \"val_principal_max\", \"type\": \"max\", \"value\": 100000000}"
          },
          {
            "rule_id": "val_3",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate is required\", \"rule_id\": \"val_rate_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate is required\", \"rule_id\": \"val_rate_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_4",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate cannot be negative\", \"rule_id\": \"val_rate_min\", \"type\": \"min\", \"value\": 0}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate cannot be negative\", \"rule_id\": \"val_rate_min\", \"type\": \"min\", \"value\": 0}"
          },
          {
            "rule_id": "val_5",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate cannot exceed 30%\", \"rule_id\": \"val_rate_max\", \"type\": \"max\", \"value\": 30}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate cannot exceed 30%\", \"rule_id\": \"val_rate_max\", \"type\": \"max\", \"value\": 30}"
          },
          {
            "rule_id": "val_6",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"loan_term\", \"message\": \"Loan term is required\", \"rule_id\": \"val_term_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"loan_term\", \"message\": \"Loan term is required\", \"rule_id\": \"val_term_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_7",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"loan_term\", \"message\": \"Loan term must be at least 1\", \"rule_id\": \"val_term_min\", \"type\": \"min\", \"value\": 1}",
            "message": "{\"field\": \"loan_term\", \"message\": \"Loan term must be at least 1\", \"rule_id\": \"val_term_min\", \"type\": \"min\", \"value\": 1}"
          }
        ],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.isCalculating",
            "expr": "true"
          }
        ],
        "api_endpoint": "157c14f819c1403e84fbb4da7bee41af",
        "api_body": "{ principal: form.principal, annual_interest_rate: form.annual_interest_rate, loan_term_months: state.termUnit === 'years' ? form.loan_term * 12 : form.loan_term, calculation_method: 'standard_amortization', start_date: null }",
        "side_effects": [
          {
            "type": "toast",
            "config": {
              "message": "Loan calculated successfully!",
              "type": "success"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "c9c70ed20db2478c8fb6b5ac6266e2b9": {
        "action_id": "c9c70ed20db2478c8fb6b5ac6266e2b9",
        "trigger": "button_click",
        "target_component_id": "results_card",
        "operation": "read",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.hasCalculated",
            "expr": "true"
          },
          {
            "target": "state.isCalculating",
            "expr": "false"
          }
        ],
        "api_endpoint": "e5b7be497e7f4fc18e878e9b7641903d",
        "api_body": null,
        "side_effects": [],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "366ac8e8aee04f848e135be41b40337c": {
        "action_id": "366ac8e8aee04f848e135be41b40337c",
        "trigger": "button_click",
        "target_component_id": "reset_button",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.calculationResult",
            "expr": "null"
          },
          {
            "target": "state.amortizationSchedule",
            "expr": "[]"
          },
          {
            "target": "state.hasCalculated",
            "expr": "false"
          },
          {
            "target": "state.isCalculating",
            "expr": "false"
          },
          {
            "target": "state.calculationId",
            "expr": "''"
          },
          {
            "target": "state.termUnit",
            "expr": "'months'"
          }
        ],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "reset_state",
            "config": {
              "target": "loan_form"
            }
          },
          {
            "type": "toast",
            "config": {
              "message": "Form has been reset",
              "type": "info"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "2f49b1516b9144ab9c80730bc726b193": {
        "action_id": "2f49b1516b9144ab9c80730bc726b193",
        "trigger": "button_click",
        "target_component_id": "export_csv_button",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "download",
            "config": {
              "filename": "loan_schedule_${new Date().toISOString().slice(0,10).replace(/-/g,'')}.csv",
              "format": "csv",
              "data_source": "state.amortizationSchedule"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "6ef79ed9cd854c88bcd983971ac8448a": {
        "action_id": "6ef79ed9cd854c88bcd983971ac8448a",
        "trigger": "button_click",
        "target_component_id": "print_button",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "custom",
            "config": {
              "handler": "window.print()"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      }
    },
    "feedback": {
      "f8fbb1a74cd74e4babb07bb57a4117f9": {
        "action_id": "f8fbb1a74cd74e4babb07bb57a4117f9",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "Loan calculated successfully!",
        "error_message": "Failed to calculate loan. Please check your inputs and try again.",
        "ui_updates": [
          "show results_section",
          "show schedule_section"
        ]
      },
      "c9c70ed20db2478c8fb6b5ac6266e2b9": {
        "action_id": "c9c70ed20db2478c8fb6b5ac6266e2b9",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": null,
        "error_message": "Failed to load amortization schedule.",
        "ui_updates": []
      },
      "366ac8e8aee04f848e135be41b40337c": {
        "action_id": "366ac8e8aee04f848e135be41b40337c",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": "Form has been reset",
        "error_message": null,
        "ui_updates": [
          "hide results_section",
          "hide schedule_section"
        ]
      },
      "2f49b1516b9144ab9c80730bc726b193": {
        "action_id": "2f49b1516b9144ab9c80730bc726b193",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": "CSV exported successfully",
        "error_message": "Failed to export CSV",
        "ui_updates": []
      },
      "6ef79ed9cd854c88bcd983971ac8448a": {
        "action_id": "6ef79ed9cd854c88bcd983971ac8448a",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "ui_updates": []
      }
    }
  },
  "component_ir": {
    "library": "antd",
    "theme": {
      "primaryColor": "#1677ff",
      "secondaryColor": "#52c41a",
      "successColor": null,
      "warningColor": null,
      "errorColor": null,
      "fontFamily": "sans-serif",
      "fontSize": null,
      "borderRadius": 6
    },
    "components": {
      "main_container": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "minHeight": "100vh",
          "width": "100%",
          "backgroundColor": "#f5f5f5",
          "padding": "0"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "header_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "background": "linear-gradient(135deg, #1677ff 0%, #0958d9 100%)",
          "padding": "32px 24px",
          "textAlign": "center"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "header_title": {
        "type": "Typography.Title",
        "label": "Loan Calculator",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 1
        },
        "dynamic_props": {},
        "styles": {
          "color": "#ffffff",
          "margin": "0",
          "fontSize": "32px",
          "fontWeight": 700
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "header_subtitle": {
        "type": "Typography.Text",
        "label": "Calculate your monthly payments, total interest, and view a detailed amortization schedule",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "color": "rgba(255,255,255,0.85)",
          "fontSize": "16px",
          "display": "block",
          "marginTop": "8px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "content_container": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "maxWidth": "1200px",
          "margin": "0 auto",
          "padding": "24px",
          "width": "100%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "form_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Loan Details",
          "bordered": false
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "24px",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.08)",
          "borderRadius": "8px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_form": {
        "type": "Form",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "layout": "vertical",
          "name": "loan_calculator_form",
          "requiredMark": true
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "form_fields_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": [
            24,
            16
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "principal_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 24,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_amount_form_item": {
        "type": "Form.Item",
        "label": "Loan Amount",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "principal",
          "rules": [
            {
              "required": true,
              "message": "Loan amount is required"
            },
            {
              "type": "number",
              "min": 1,
              "max": 100000000,
              "message": "Must be between $1 and $100,000,000",
              "transform": "Number"
            }
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_amount_input": {
        "type": "InputNumber",
        "label": "Loan Amount",
        "description": null,
        "bind": "principal",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "250,000",
          "prefix": "$",
          "min": 1,
          "max": 100000000,
          "precision": 2,
          "formatter": "value => `${value}`.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',')",
          "parser": "value => value.replace(/\\$\\s?|(,*)/g, '')",
          "style": {
            "width": "100%"
          },
          "size": "large"
        },
        "dynamic_props": {},
        "styles": {
          "width": "100%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "rate_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 24,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "interest_rate_form_item": {
        "type": "Form.Item",
        "label": "Annual Interest Rate",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "annual_interest_rate",
          "rules": [
            {
              "required": true,
              "message": "Interest rate is required"
            },
            {
              "type": "number",
              "min": 0,
              "max": 30,
              "message": "Must be between 0% and 30%",
              "transform": "Number"
            }
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "interest_rate_input": {
        "type": "InputNumber",
        "label": "Annual Interest Rate",
        "description": null,
        "bind": "annual_interest_rate",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "4.5",
          "suffix": "%",
          "min": 0,
          "max": 30,
          "precision": 3,
          "step": 0.125,
          "style": {
            "width": "100%"
          },
          "size": "large"
        },
        "dynamic_props": {},
        "styles": {
          "width": "100%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "term_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 24,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_term_form_item": {
        "type": "Form.Item",
        "label": "Loan Term",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "loan_term",
          "rules": [
            {
              "required": true,
              "message": "Loan term is required"
            },
            {
              "type": "integer",
              "min": 1,
              "message": "Must be at least 1",
              "transform": "Number"
            }
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "term_input_group": {
        "type": "Space.Compact",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "style": {
            "width": "100%"
          }
        },
        "dynamic_props": {},
        "styles": {
          "width": "100%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_term_input": {
        "type": "InputNumber",
        "label": "Loan Term",
        "description": null,
        "bind": "loan_term",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "360",
          "min": 1,
          "max": 360,
          "precision": 0,
          "style": {
            "width": "70%"
          },
          "size": "large"
        },
        "dynamic_props": {},
        "styles": {
          "width": "70%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "term_unit_select": {
        "type": "Select",
        "label": "Term Unit",
        "description": null,
        "bind": "state.termUnit",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "defaultValue": "months",
          "style": {
            "width": "30%"
          },
          "size": "large",
          "options": [
            {
              "value": "months",
              "label": "Months"
            },
            {
              "value": "years",
              "label": "Years"
            }
          ]
        },
        "dynamic_props": {},
        "styles": {
          "width": "30%"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "form_actions_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": 16
        },
        "dynamic_props": {},
        "styles": {
          "marginTop": "16px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "calculate_btn_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "calculate_button": {
        "type": "Button",
        "label": "Calculate",
        "description": null,
        "bind": null,
        "onClick": "submitCalculation",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "primary",
          "htmlType": "submit",
          "size": "large",
          "icon": "CalculatorOutlined",
          "loading": "$state.isCalculating"
        },
        "dynamic_props": {},
        "styles": {
          "minWidth": "160px",
          "height": "44px",
          "fontWeight": 600
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "reset_btn_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "reset_button": {
        "type": "Button",
        "label": "Reset",
        "description": null,
        "bind": null,
        "onClick": "resetForm",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "large",
          "icon": "ClearOutlined"
        },
        "dynamic_props": {},
        "styles": {
          "minWidth": "120px",
          "height": "44px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "results_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "visible": "$derived.showResults"
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "24px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "results_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Calculation Results",
          "bordered": false
        },
        "dynamic_props": {},
        "styles": {
          "boxShadow": "0 2px 8px rgba(0,0,0,0.08)",
          "borderRadius": "8px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "results_stats_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": [
            24,
            24
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "monthly_payment_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "monthly_payment_stat": {
        "type": "Statistic",
        "label": "Monthly Payment",
        "description": null,
        "bind": "state.calculationResult.monthly_payment",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Monthly Payment",
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "color": "#1677ff",
            "fontSize": "32px",
            "fontWeight": 700
          }
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "total_interest_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "total_interest_stat": {
        "type": "Statistic",
        "label": "Total Interest Paid",
        "description": null,
        "bind": "state.calculationResult.total_interest",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Total Interest Paid",
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "color": "#faad14",
            "fontSize": "24px",
            "fontWeight": 600
          }
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "total_paid_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 8
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "total_paid_stat": {
        "type": "Statistic",
        "label": "Total Amount Paid",
        "description": null,
        "bind": "state.calculationResult.total_amount_paid",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Total Amount Paid",
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "fontSize": "24px",
            "fontWeight": 600
          }
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_term_display_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 12
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "loan_term_display_stat": {
        "type": "Statistic",
        "label": "Loan Term",
        "description": null,
        "bind": "$derived.loanTermDisplay",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Loan Term",
          "valueStyle": {
            "fontSize": "18px"
          }
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "interest_rate_display_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 12
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "interest_rate_display_stat": {
        "type": "Statistic",
        "label": "Interest Rate",
        "description": null,
        "bind": "state.calculationResult.annual_interest_rate",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Interest Rate",
          "suffix": "%",
          "precision": 3,
          "valueStyle": {
            "fontSize": "18px"
          }
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "visible": "$derived.showResults"
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "24px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": false
        },
        "dynamic_props": {},
        "styles": {
          "boxShadow": "0 2px 8px rgba(0,0,0,0.08)",
          "borderRadius": "8px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_header_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "justify": "space-between",
          "align": "middle"
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "16px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_title_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_title": {
        "type": "Typography.Title",
        "label": "Amortization Schedule",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 4
        },
        "dynamic_props": {},
        "styles": {
          "margin": "0"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_actions_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "schedule_actions_space": {
        "type": "Space",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "export_csv_button": {
        "type": "Button",
        "label": "Export CSV",
        "description": null,
        "bind": null,
        "onClick": "exportCsv",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "text",
          "size": "small",
          "icon": "DownloadOutlined"
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "print_button": {
        "type": "Button",
        "label": "Print",
        "description": null,
        "bind": null,
        "onClick": "printSchedule",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "text",
          "size": "small",
          "icon": "PrinterOutlined"
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "amortization_table": {
        "type": "Table",
        "label": "Amortization Schedule",
        "description": null,
        "bind": "state.amortizationSchedule",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "dataSource": "$state.amortizationSchedule",
          "rowKey": "payment_number",
          "pagination": false,
          "scroll": {
            "y": 500
          },
          "size": "small",
          "sticky": true,
          "rowClassName": "(record, index) => index % 2 === 0 ? 'even-row' : 'odd-row'",
          "columns": [
            {
              "title": "Payment #",
              "dataIndex": "payment_number",
              "key": "payment_number",
              "width": 90,
              "align": "left",
              "fixed": "left"
            },
            {
              "title": "Payment Date",
              "dataIndex": "payment_date",
              "key": "payment_date",
              "width": 120,
              "align": "left",
              "render": "formatDate_MMDDYYYY"
            },
            {
              "title": "Beginning Balance",
              "dataIndex": "beginning_balance",
              "key": "beginning_balance",
              "width": 150,
              "align": "right",
              "render": "formatCurrency"
            },
            {
              "title": "Payment Amount",
              "dataIndex": "payment_amount",
              "key": "payment_amount",
              "width": 140,
              "align": "right",
              "render": "formatCurrency"
            },
            {
              "title": "Principal",
              "dataIndex": "principal_payment",
              "key": "principal_payment",
              "width": 130,
              "align": "right",
              "render": "formatCurrency"
            },
            {
              "title": "Interest",
              "dataIndex": "interest_payment",
              "key": "interest_payment",
              "width": 130,
              "align": "right",
              "render": "formatCurrency"
            },
            {
              "title": "Ending Balance",
              "dataIndex": "ending_balance",
              "key": "ending_balance",
              "width": 150,
              "align": "right",
              "render": "formatCurrency"
            },
            {
              "title": "Cumulative Interest",
              "dataIndex": "cumulative_interest",
              "key": "cumulative_interest",
              "width": 160,
              "align": "right",
              "render": "formatCurrency"
            }
          ]
        },
        "dynamic_props": {},
        "styles": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "empty_state_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "visible": "!$derived.showResults"
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "24px"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "empty_state_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": false
        },
        "dynamic_props": {},
        "styles": {
          "boxShadow": "0 2px 8px rgba(0,0,0,0.08)",
          "borderRadius": "8px",
          "textAlign": "center"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "empty_state_content": {
        "type": "Empty",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "description": "Enter loan details above and click Calculate to see your payment schedule.",
          "image": "Empty.PRESENTED_IMAGE_SIMPLE"
        },
        "dynamic_props": {},
        "styles": {
          "padding": "48px 0"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      }
    }
  },
  "layout_ir": {
    "root": "main_container",
    "children": {
      "main_container": [
        "header_section",
        "content_container"
      ],
      "header_section": [
        "header_title",
        "header_subtitle"
      ],
      "content_container": [
        "form_card",
        "results_section",
        "schedule_section",
        "empty_state_section"
      ],
      "form_card": [
        "loan_form"
      ],
      "loan_form": [
        "form_fields_row",
        "form_actions_row"
      ],
      "form_fields_row": [
        "principal_col",
        "rate_col",
        "term_col"
      ],
      "principal_col": [
        "loan_amount_form_item"
      ],
      "loan_amount_form_item": [
        "loan_amount_input"
      ],
      "rate_col": [
        "interest_rate_form_item"
      ],
      "interest_rate_form_item": [
        "interest_rate_input"
      ],
      "term_col": [
        "loan_term_form_item"
      ],
      "loan_term_form_item": [
        "term_input_group"
      ],
      "term_input_group": [
        "loan_term_input",
        "term_unit_select"
      ],
      "form_actions_row": [
        "calculate_btn_col",
        "reset_btn_col"
      ],
      "calculate_btn_col": [
        "calculate_button"
      ],
      "reset_btn_col": [
        "reset_button"
      ],
      "results_section": [
        "results_card"
      ],
      "results_card": [
        "results_stats_row"
      ],
      "results_stats_row": [
        "monthly_payment_col",
        "total_interest_col",
        "total_paid_col",
        "loan_term_display_col",
        "interest_rate_display_col"
      ],
      "monthly_payment_col": [
        "monthly_payment_stat"
      ],
      "total_interest_col": [
        "total_interest_stat"
      ],
      "total_paid_col": [
        "total_paid_stat"
      ],
      "loan_term_display_col": [
        "loan_term_display_stat"
      ],
      "interest_rate_display_col": [
        "interest_rate_display_stat"
      ],
      "schedule_section": [
        "schedule_card"
      ],
      "schedule_card": [
        "schedule_header_row",
        "amortization_table"
      ],
      "schedule_header_row": [
        "schedule_title_col",
        "schedule_actions_col"
      ],
      "schedule_title_col": [
        "schedule_title"
      ],
      "schedule_actions_col": [
        "schedule_actions_space"
      ],
      "schedule_actions_space": [
        "export_csv_button",
        "print_button"
      ],
      "empty_state_section": [
        "empty_state_card"
      ],
      "empty_state_card": [
        "empty_state_content"
      ]
    },
    "layout": {
      "main_container": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "header_section": {
        "type": "vertical",
        "gap": 4,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "content_container": {
        "type": "vertical",
        "gap": 24,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "form_card": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "loan_form": {
        "type": "vertical",
        "gap": 16,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "form_fields_row": {
        "type": "horizontal",
        "gap": 24,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "form_actions_row": {
        "type": "horizontal",
        "gap": 16,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "results_section": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "results_card": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "results_stats_row": {
        "type": "horizontal",
        "gap": 24,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "schedule_section": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "schedule_card": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "schedule_header_row": {
        "type": "horizontal",
        "gap": 16,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "schedule_actions_space": {
        "type": "horizontal",
        "gap": 8,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "empty_state_section": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      },
      "empty_state_card": {
        "type": "vertical",
        "gap": 0,
        "padding": null,
        "columns": null,
        "column_template": null,
        "row_template": null,
        "align_items": null,
        "justify_content": null,
        "wrap": false,
        "min_height": null,
        "overflow": null
      }
    },
    "layout_zones": [
      {
        "zone_id": "header_zone",
        "component": "header_section",
        "anchor": "top-left",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Full-width blue gradient header"
      },
      {
        "zone_id": "form_zone",
        "component": "form_card",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Input form card centered in content area"
      },
      {
        "zone_id": "results_zone",
        "component": "results_section",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Results summary shown after calculation"
      },
      {
        "zone_id": "schedule_zone",
        "component": "schedule_section",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Amortization schedule table with scrolling"
      },
      {
        "zone_id": "empty_zone",
        "component": "empty_state_section",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Empty state shown before first calculation"
      }
    ],
    "responsive_overrides": []
  },
  "navigation_ir": {
    "tabs": [],
    "modals": {},
    "drawers": {},
    "routes": [],
    "breadcrumb": null,
    "default_tab": null
  },
  "realtime_ir": {
    "timers": {},
    "polling": {}
  },
  "metadata": {
    "ir_version": "3.5",
    "generated_at": "",
    "source_prompt": null,
    "schema_session_id": null,
    "warnings": []
  },
  "page_data_contract": null,
  "schema_ir": null
}