{
  "page_ir": {
    "page_id": "loan_calculator",
    "page_goal": "Single-page loan calculator allowing users to input principal, interest rate, and loan term, then view monthly payment, total paid, total interest, and a full amortization schedule table with export/print options.",
    "style": {
      "tone": "professional",
      "theme": "light",
      "density": "comfortable",
      "color_intent": "trustworthy financial tool with clear data presentation"
    },
    "accessibility": {
      "required_labels": [
        "principal_amount_input",
        "interest_rate_input",
        "loan_term_input",
        "term_unit_select",
        "calculate_button",
        "reset_button",
        "amortization_table",
        "export_csv_button",
        "print_button"
      ],
      "skip_navigation": true,
      "focus_management": true,
      "announce_changes": []
    },
    "responsive": {
      "breakpoints": {
        "mobile": 576,
        "tablet": 768,
        "desktop": 1200
      },
      "collapse_rules": [
        "summary_cards_row stacks vertically below 768px",
        "form inputs stack vertically below 576px"
      ],
      "hidden_on_small": [],
      "stack_on_small": []
    },
    "constraints": [
      "Results and amortization schedule hidden until calculation is performed",
      "Calculate button disabled until all fields are valid",
      "All currency values formatted with $ and 2 decimal places with thousand separators"
    ],
    "seo_title": null,
    "seo_description": null
  },
  "data_ir": {
    "types": {},
    "state": {
      "termUnit": {
        "type": "string",
        "initial": "years",
        "required": true,
        "constraints": {
          "enum": [
            "years",
            "months"
          ]
        },
        "item_type": null
      },
      "calculationPerformed": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "isCalculating": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "scheduleCurrentPage": {
        "type": "number",
        "initial": 1,
        "required": false,
        "constraints": {},
        "item_type": null
      }
    },
    "derived": {
      "interestPercentOfPrincipal": {
        "type": "string",
        "expr": "appContext.loanCalculation ? ((appContext.loanCalculation.totalInterestPaid / appContext.loanCalculation.principalAmount) * 100).toFixed(1) + '% of loan amount' : ''",
        "deps": []
      },
      "hasResults": {
        "type": "boolean",
        "expr": "state.calculationPerformed && appContext.loanCalculation !== null",
        "deps": []
      }
    }
  },
  "data_fetch_ir": {
    "endpoints": {
      "adc4e51ef36b4d5d865dfc56d5edb4be": {
        "endpoint_id": "adc4e51ef36b4d5d865dfc56d5edb4be",
        "module": "Loan Calculations",
        "endpoint": "/loan-calculations/",
        "method": "POST",
        "path_params": {},
        "query_params": {},
        "body": {
          "principal_amount": "$form.principal_amount",
          "annual_interest_rate": "$form.annual_interest_rate",
          "loan_term_months": "$form.loan_term_months"
        },
        "fields": [
          "id",
          "principal_amount",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_amount_paid",
          "total_interest_paid"
        ],
        "response_target": "loanCalculation",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "4ae0616c9d374939a68dfa3c0c3cf7a9": {
        "endpoint_id": "4ae0616c9d374939a68dfa3c0c3cf7a9",
        "module": "Loan Calculations",
        "endpoint": "/loan-calculations/{calculation_id}/details",
        "method": "GET",
        "path_params": {
          "calculation_id": "$state.calculationId"
        },
        "query_params": {},
        "body": null,
        "fields": [
          "id",
          "principal_amount",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_amount_paid",
          "total_interest_paid",
          "amortization_schedule_entries"
        ],
        "response_target": "loanCalculationWithSchedule",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      }
    }
  },
  "data_model_ir": {
    "entities": {
      "loanCalculation": {
        "name": "LoanCalculation",
        "backend_module": "Loan Calculations",
        "fields": [
          "id",
          "principal_amount",
          "annual_interest_rate",
          "loan_term_months",
          "monthly_payment",
          "total_amount_paid",
          "total_interest_paid",
          "created_at",
          "updated_at"
        ],
        "computed": [
          "monthly_payment",
          "total_amount_paid",
          "total_interest_paid"
        ],
        "display_fields": [
          "monthly_payment",
          "total_amount_paid",
          "total_interest_paid"
        ],
        "search_fields": [],
        "filters": [],
        "default_sort": null,
        "default_sort_dir": "asc"
      },
      "amortizationScheduleEntry": {
        "name": "AmortizationScheduleEntry",
        "backend_module": "Loan Calculations",
        "fields": [
          "paymentNumber",
          "paymentAmount",
          "principalPortion",
          "interestPortion",
          "remainingBalance"
        ],
        "computed": [],
        "display_fields": [
          "paymentNumber",
          "paymentAmount",
          "principalPortion",
          "interestPortion",
          "remainingBalance"
        ],
        "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": ""
      },
      "onSchedulePageChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.scheduleCurrentPage",
            "expr": "event.page"
          }
        ],
        "description": ""
      }
    },
    "actions": {
      "1b9d5872cb944a26b543c50916ab3da7": {
        "action_id": "1b9d5872cb944a26b543c50916ab3da7",
        "trigger": "form_submit",
        "target_component_id": "loan_form",
        "operation": "create",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [
          {
            "rule_id": "val_0",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal_amount\", \"message\": \"Principal amount is required\", \"rule_id\": \"val_principal_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"principal_amount\", \"message\": \"Principal amount is required\", \"rule_id\": \"val_principal_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_1",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal_amount\", \"message\": \"Principal must be at least $1\", \"rule_id\": \"val_principal_min\", \"type\": \"min\", \"value\": 1}",
            "message": "{\"field\": \"principal_amount\", \"message\": \"Principal must be at least $1\", \"rule_id\": \"val_principal_min\", \"type\": \"min\", \"value\": 1}"
          },
          {
            "rule_id": "val_2",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"principal_amount\", \"message\": \"Principal must be $100,000,000 or less\", \"rule_id\": \"val_principal_max\", \"type\": \"max\", \"value\": 100000000}",
            "message": "{\"field\": \"principal_amount\", \"message\": \"Principal must be $100,000,000 or less\", \"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\": \"Annual interest rate is required\", \"rule_id\": \"val_rate_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Annual 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 must be at least 0.01%\", \"rule_id\": \"val_rate_min\", \"type\": \"min\", \"value\": 0.01}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate must be at least 0.01%\", \"rule_id\": \"val_rate_min\", \"type\": \"min\", \"value\": 0.01}"
          },
          {
            "rule_id": "val_5",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate must be 99.99% or less\", \"rule_id\": \"val_rate_max\", \"type\": \"max\", \"value\": 99.99}",
            "message": "{\"field\": \"annual_interest_rate\", \"message\": \"Interest rate must be 99.99% or less\", \"rule_id\": \"val_rate_max\", \"type\": \"max\", \"value\": 99.99}"
          },
          {
            "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": "adc4e51ef36b4d5d865dfc56d5edb4be",
        "api_body": "{ principal_amount: formValues.principal_amount, annual_interest_rate: formValues.annual_interest_rate, loan_term_months: state.termUnit === 'years' ? formValues.loan_term * 12 : formValues.loan_term }",
        "side_effects": [
          {
            "type": "toast",
            "config": {
              "message": "Loan calculation complete!",
              "type": "success"
            }
          },
          {
            "type": "custom",
            "config": {
              "action": "setCalculationPerformed",
              "value": true
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "5e725a6a56db45eea2945facbd01fbd3": {
        "action_id": "5e725a6a56db45eea2945facbd01fbd3",
        "trigger": "button_click",
        "target_component_id": "results_section",
        "operation": "read",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [],
        "api_endpoint": "4ae0616c9d374939a68dfa3c0c3cf7a9",
        "api_body": null,
        "side_effects": [],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "8260e2b3fd1045818530dba2cc5d4840": {
        "action_id": "8260e2b3fd1045818530dba2cc5d4840",
        "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.calculationPerformed",
            "expr": "false"
          },
          {
            "target": "state.isCalculating",
            "expr": "false"
          },
          {
            "target": "state.scheduleCurrentPage",
            "expr": "1"
          },
          {
            "target": "state.termUnit",
            "expr": "'years'"
          }
        ],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "reset_state",
            "config": {
              "target": "appContext.loanCalculation",
              "value": null
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "622d2b567f57463291dc1dab905828f9": {
        "action_id": "622d2b567f57463291dc1dab905828f9",
        "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": {
              "format": "csv",
              "filename": "amortization_schedule.csv",
              "data_source": "appContext.loanCalculation.amortizationSchedule"
            }
          },
          {
            "type": "toast",
            "config": {
              "message": "CSV exported successfully!",
              "type": "success"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "d834527b413f45c881febc267a39f42f": {
        "action_id": "d834527b413f45c881febc267a39f42f",
        "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": {
              "action": "window.print"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      }
    },
    "feedback": {
      "1b9d5872cb944a26b543c50916ab3da7": {
        "action_id": "1b9d5872cb944a26b543c50916ab3da7",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "Loan calculation complete!",
        "error_message": "Failed to calculate loan. Please check your inputs and try again.",
        "ui_updates": [
          "state.calculationPerformed = true",
          "state.isCalculating = false"
        ]
      },
      "5e725a6a56db45eea2945facbd01fbd3": {
        "action_id": "5e725a6a56db45eea2945facbd01fbd3",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "",
        "error_message": "Failed to load amortization schedule details.",
        "ui_updates": []
      },
      "8260e2b3fd1045818530dba2cc5d4840": {
        "action_id": "8260e2b3fd1045818530dba2cc5d4840",
        "loading_indicator": "none",
        "loading_text": null,
        "success_message": "Calculator reset.",
        "error_message": "",
        "ui_updates": []
      },
      "622d2b567f57463291dc1dab905828f9": {
        "action_id": "622d2b567f57463291dc1dab905828f9",
        "loading_indicator": "none",
        "loading_text": null,
        "success_message": "CSV exported successfully!",
        "error_message": "Failed to export CSV.",
        "ui_updates": []
      },
      "d834527b413f45c881febc267a39f42f": {
        "action_id": "d834527b413f45c881febc267a39f42f",
        "loading_indicator": "none",
        "loading_text": null,
        "success_message": "",
        "error_message": "",
        "ui_updates": []
      }
    }
  },
  "component_ir": {
    "library": "antd",
    "theme": {
      "primaryColor": "#1677ff",
      "secondaryColor": "#000000",
      "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": "#f5f7fa",
          "padding": "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
      },
      "page_content_wrapper": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "maxWidth": "960px",
          "margin": "0 auto",
          "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
      },
      "page_header": {
        "type": "AntTypography.Title",
        "label": "Loan Calculator",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 2
        },
        "dynamic_props": {},
        "styles": {
          "textAlign": "center",
          "marginBottom": "8px",
          "color": "#1a1a1a"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "page_subtitle": {
        "type": "AntTypography.Text",
        "label": "Calculate your monthly payments, total cost, and view a detailed amortization schedule.",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "textAlign": "center",
          "display": "block",
          "marginBottom": "32px",
          "fontSize": "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
      },
      "form_card": {
        "type": "AntCard",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Loan Details",
          "bordered": true
        },
        "dynamic_props": {},
        "styles": {
          "marginBottom": "24px",
          "borderRadius": "8px",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.06)"
        },
        "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": "AntForm",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "layout": "vertical",
          "requiredMark": true,
          "onFinish": "calculateLoan"
        },
        "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": "AntRow",
        "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": "AntCol",
        "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
      },
      "principal_form_item": {
        "type": "AntForm.Item",
        "label": "Principal Amount",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "principal_amount",
          "rules": [
            {
              "required": true,
              "message": "Principal amount is required"
            },
            {
              "type": "number",
              "min": 1,
              "max": 100000000,
              "message": "Principal must be between $1 and $100,000,000"
            }
          ],
          "tooltip": "The total amount of money you are borrowing from the lender."
        },
        "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_amount_input": {
        "type": "AntInputNumber",
        "label": "Principal Amount",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "placeholder": "250,000",
          "min": 1,
          "max": 100000000,
          "formatter": "value => `${value}`.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',')",
          "parser": "value => value.replace(/\\$\\s?|(,*)/g, '')",
          "inputMode": "decimal",
          "aria-label": "Principal Amount"
        },
        "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": "AntCol",
        "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
      },
      "rate_form_item": {
        "type": "AntForm.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": "Annual interest rate is required"
            },
            {
              "type": "number",
              "min": 0.01,
              "max": 99.99,
              "message": "Rate must be between 0.01% and 99.99%"
            }
          ],
          "tooltip": "The annual percentage rate (APR) charged by the lender on your loan balance."
        },
        "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": "AntInputNumber",
        "label": "Annual Interest Rate",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "suffix": "%",
          "placeholder": "6.5",
          "min": 0.01,
          "max": 99.99,
          "step": 0.01,
          "precision": 2,
          "inputMode": "decimal",
          "aria-label": "Annual Interest Rate"
        },
        "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": "AntCol",
        "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
      },
      "term_form_item": {
        "type": "AntForm.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": "number",
              "min": 1,
              "message": "Loan term must be at least 1"
            }
          ],
          "tooltip": "The length of time over which you will repay the loan. Toggle between years and months."
        },
        "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": "AntSpace.Compact",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "block": true
        },
        "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": "AntInputNumber",
        "label": "Loan Term",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "30",
          "min": 1,
          "max": "$derived: state.termUnit === 'years' ? 50 : 600",
          "step": 1,
          "precision": 0,
          "inputMode": "numeric",
          "aria-label": "Loan Term"
        },
        "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": "AntSelect",
        "label": "Term Unit",
        "description": null,
        "bind": "state.termUnit",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "defaultValue": "years",
          "options": [
            {
              "label": "Years",
              "value": "years"
            },
            {
              "label": "Months",
              "value": "months"
            }
          ],
          "onChange": "onTermUnitChange",
          "aria-label": "Term Unit"
        },
        "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_buttons_row": {
        "type": "AntRow",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": 16,
          "justify": "end"
        },
        "dynamic_props": {},
        "styles": {
          "marginTop": "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
      },
      "reset_button_col": {
        "type": "AntCol",
        "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": "AntButton",
        "label": "Reset",
        "description": null,
        "bind": null,
        "onClick": "resetCalculator",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "htmlType": "button",
          "icon": "ClearOutlined",
          "size": "large"
        },
        "dynamic_props": {},
        "styles": {
          "minWidth": "120px"
        },
        "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_col": {
        "type": "AntCol",
        "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": "AntButton",
        "label": "Calculate",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "primary",
          "htmlType": "submit",
          "icon": "CalculatorOutlined",
          "size": "large",
          "loading": "$state.isCalculating"
        },
        "dynamic_props": {},
        "styles": {
          "minWidth": "160px",
          "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
      },
      "results_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "visible": "$derived.hasResults"
        },
        "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_title": {
        "type": "AntTypography.Title",
        "label": "Calculation Results",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 4
        },
        "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
      },
      "summary_cards_row": {
        "type": "AntRow",
        "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
      },
      "monthly_payment_col": {
        "type": "AntCol",
        "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
      },
      "monthly_payment_card": {
        "type": "AntCard",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": true
        },
        "dynamic_props": {},
        "styles": {
          "borderRadius": "8px",
          "textAlign": "center",
          "borderTop": "3px solid #1677ff",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.06)"
        },
        "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_label": {
        "type": "AntTypography.Text",
        "label": "Monthly Payment",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "display": "block",
          "fontSize": "14px",
          "marginBottom": "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
      },
      "monthly_payment_value": {
        "type": "AntStatistic",
        "label": "Monthly Payment",
        "description": null,
        "bind": "appContext.loanCalculation.monthlyPayment",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "fontSize": "32px",
            "fontWeight": "700",
            "color": "#1677ff"
          }
        },
        "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": "AntCol",
        "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_card": {
        "type": "AntCard",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": true
        },
        "dynamic_props": {},
        "styles": {
          "borderRadius": "8px",
          "textAlign": "center",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.06)"
        },
        "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_label": {
        "type": "AntTypography.Text",
        "label": "Total Amount Paid",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "display": "block",
          "fontSize": "14px",
          "marginBottom": "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
      },
      "total_paid_value": {
        "type": "AntStatistic",
        "label": "Total Amount Paid",
        "description": null,
        "bind": "appContext.loanCalculation.totalAmountPaid",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "fontSize": "24px",
            "fontWeight": "600",
            "color": "#1a1a1a"
          }
        },
        "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": "AntCol",
        "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_card": {
        "type": "AntCard",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": true
        },
        "dynamic_props": {},
        "styles": {
          "borderRadius": "8px",
          "textAlign": "center",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.06)"
        },
        "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_label": {
        "type": "AntTypography.Text",
        "label": "Total Interest Paid",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "display": "block",
          "fontSize": "14px",
          "marginBottom": "4px"
        },
        "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_value": {
        "type": "AntStatistic",
        "label": "Total Interest Paid",
        "description": null,
        "bind": "appContext.loanCalculation.totalInterestPaid",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "fontSize": "24px",
            "fontWeight": "600",
            "color": "#cf1322"
          }
        },
        "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_percent_text": {
        "type": "AntTypography.Text",
        "label": null,
        "description": null,
        "bind": "derived.interestPercentOfPrincipal",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "display": "block",
          "fontSize": "12px",
          "marginTop": "4px",
          "color": "#8c8c8c"
        },
        "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.hasResults"
        },
        "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": "AntCard",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": true
        },
        "dynamic_props": {},
        "styles": {
          "borderRadius": "8px",
          "boxShadow": "0 2px 8px rgba(0,0,0,0.06)"
        },
        "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": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "display": "flex",
          "justifyContent": "space-between",
          "alignItems": "center",
          "marginBottom": "16px",
          "flexWrap": "wrap",
          "gap": "12px"
        },
        "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": "AntTypography.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_group": {
        "type": "AntSpace",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "middle"
        },
        "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": "AntButton",
        "label": "Export CSV",
        "description": null,
        "bind": null,
        "onClick": "exportCSV",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "icon": "DownloadOutlined",
          "size": "middle",
          "aria-label": "Export amortization schedule as CSV"
        },
        "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": "AntButton",
        "label": "Print",
        "description": null,
        "bind": null,
        "onClick": "printSchedule",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "icon": "PrinterOutlined",
          "size": "middle",
          "aria-label": "Print amortization schedule"
        },
        "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": "AntTable",
        "label": "Amortization Schedule",
        "description": null,
        "bind": "appContext.loanCalculation.amortizationSchedule",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "columns": [
            {
              "title": "Payment #",
              "dataIndex": "paymentNumber",
              "key": "paymentNumber",
              "width": 100,
              "align": "center"
            },
            {
              "title": "Payment Amount",
              "dataIndex": "paymentAmount",
              "key": "paymentAmount",
              "align": "right",
              "render": "currency"
            },
            {
              "title": "Principal",
              "dataIndex": "principalPortion",
              "key": "principalPortion",
              "align": "right",
              "render": "currency"
            },
            {
              "title": "Interest",
              "dataIndex": "interestPortion",
              "key": "interestPortion",
              "align": "right",
              "render": "currency"
            },
            {
              "title": "Remaining Balance",
              "dataIndex": "remainingBalance",
              "key": "remainingBalance",
              "align": "right",
              "render": "currency"
            }
          ],
          "rowKey": "paymentNumber",
          "pagination": {
            "pageSize": 12,
            "current": "$state.scheduleCurrentPage",
            "onChange": "onSchedulePageChange",
            "showSizeChanger": false,
            "showTotal": "(total, range) => `${range[0]}-${range[1]} of ${total} payments`"
          },
          "size": "middle",
          "bordered": false,
          "striped": true,
          "scroll": {
            "x": 600
          },
          "aria-label": "Amortization Schedule Table"
        },
        "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
      },
      "footer_text": {
        "type": "AntTypography.Text",
        "label": "This calculator provides estimates for informational purposes only. Actual loan terms may vary.",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "dynamic_props": {},
        "styles": {
          "display": "block",
          "textAlign": "center",
          "marginTop": "32px",
          "fontSize": "12px",
          "color": "#8c8c8c"
        },
        "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": [
        "page_content_wrapper"
      ],
      "page_content_wrapper": [
        "page_header",
        "page_subtitle",
        "form_card",
        "results_section",
        "schedule_section",
        "footer_text"
      ],
      "form_card": [
        "loan_form"
      ],
      "loan_form": [
        "form_fields_row",
        "form_buttons_row"
      ],
      "form_fields_row": [
        "principal_col",
        "rate_col",
        "term_col"
      ],
      "principal_col": [
        "principal_form_item"
      ],
      "principal_form_item": [
        "principal_amount_input"
      ],
      "rate_col": [
        "rate_form_item"
      ],
      "rate_form_item": [
        "interest_rate_input"
      ],
      "term_col": [
        "term_form_item"
      ],
      "term_form_item": [
        "term_input_group"
      ],
      "term_input_group": [
        "loan_term_input",
        "term_unit_select"
      ],
      "form_buttons_row": [
        "reset_button_col",
        "calculate_button_col"
      ],
      "reset_button_col": [
        "reset_button"
      ],
      "calculate_button_col": [
        "calculate_button"
      ],
      "results_section": [
        "results_title",
        "summary_cards_row"
      ],
      "summary_cards_row": [
        "monthly_payment_col",
        "total_paid_col",
        "total_interest_col"
      ],
      "monthly_payment_col": [
        "monthly_payment_card"
      ],
      "monthly_payment_card": [
        "monthly_payment_label",
        "monthly_payment_value"
      ],
      "total_paid_col": [
        "total_paid_card"
      ],
      "total_paid_card": [
        "total_paid_label",
        "total_paid_value"
      ],
      "total_interest_col": [
        "total_interest_card"
      ],
      "total_interest_card": [
        "total_interest_label",
        "total_interest_value",
        "interest_percent_text"
      ],
      "schedule_section": [
        "schedule_card"
      ],
      "schedule_card": [
        "schedule_header_row",
        "amortization_table"
      ],
      "schedule_header_row": [
        "schedule_title",
        "schedule_actions_group"
      ],
      "schedule_actions_group": [
        "export_csv_button",
        "print_button"
      ]
    },
    "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
      },
      "page_content_wrapper": {
        "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": 0,
        "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_buttons_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
      },
      "term_input_group": {
        "type": "horizontal",
        "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_section": {
        "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
      },
      "summary_cards_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
      },
      "monthly_payment_card": {
        "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
      },
      "total_paid_card": {
        "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
      },
      "total_interest_card": {
        "type": "vertical",
        "gap": 2,
        "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": 12,
        "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_group": {
        "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
      }
    },
    "layout_zones": [
      {
        "zone_id": "page_zone",
        "component": "page_content_wrapper",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Main centered content area with max-width constraint"
      },
      {
        "zone_id": "form_zone",
        "component": "form_card",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Loan input form card"
      },
      {
        "zone_id": "results_zone",
        "component": "results_section",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Summary stat cards, conditionally visible after calculation"
      },
      {
        "zone_id": "schedule_zone",
        "component": "schedule_section",
        "anchor": "center",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Amortization schedule table with export actions, conditionally visible after 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
}