{
  "page_ir": {
    "page_id": "sip_calculator",
    "page_goal": "Single-page SIP Calculator that allows users to input monthly investment, annual return rate, and investment period to calculate and visualize future value of systematic investment plans",
    "style": {
      "tone": "professional",
      "theme": "light",
      "density": "comfortable",
      "color_intent": "financial, trust-building with blue primary and green for returns"
    },
    "accessibility": {
      "required_labels": [
        "Monthly Investment input",
        "Annual Return Rate input",
        "Investment Period input",
        "Period Unit selector",
        "Calculate button",
        "Reset button",
        "Total Investment result",
        "Estimated Returns result",
        "Future Value result",
        "Investment Growth Chart",
        "Investment Composition Chart"
      ],
      "skip_navigation": true,
      "focus_management": true,
      "announce_changes": []
    },
    "responsive": {
      "breakpoints": {
        "mobile": 576,
        "tablet": 768,
        "desktop": 1200
      },
      "collapse_rules": [
        "Stack input and results vertically on mobile and tablet",
        "Show side-by-side on desktop"
      ],
      "hidden_on_small": [],
      "stack_on_small": []
    },
    "constraints": [
      "All elements visible without scrolling on desktop",
      "Calculation triggered with 300ms debounce on input change",
      "Real-time inline validation on blur and change",
      "Keyboard navigation supported"
    ],
    "seo_title": null,
    "seo_description": null
  },
  "data_ir": {
    "types": {},
    "state": {
      "calculationResult": {
        "type": "object",
        "initial": {
          "calculation_result_id": "",
          "total_investment": 0,
          "estimated_returns": 0,
          "future_value": 0,
          "chart_data_points": []
        },
        "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
      }
    },
    "derived": {
      "roiPercentage": {
        "type": "number",
        "expr": "state.calculationResult.total_investment > 0 ? ((state.calculationResult.estimated_returns / state.calculationResult.total_investment) * 100).toFixed(2) : 0",
        "deps": []
      },
      "investmentProportion": {
        "type": "number",
        "expr": "state.calculationResult.future_value > 0 ? ((state.calculationResult.total_investment / state.calculationResult.future_value) * 100).toFixed(1) : 0",
        "deps": []
      },
      "returnsProportion": {
        "type": "number",
        "expr": "state.calculationResult.future_value > 0 ? ((state.calculationResult.estimated_returns / state.calculationResult.future_value) * 100).toFixed(1) : 0",
        "deps": []
      }
    }
  },
  "data_fetch_ir": {
    "endpoints": {
      "3ba7a85df461444bb82bab5b3a347f92": {
        "endpoint_id": "3ba7a85df461444bb82bab5b3a347f92",
        "module": "SIP Calculation",
        "endpoint": "/sip-calculation/calculations/compute",
        "method": "POST",
        "path_params": {},
        "query_params": {},
        "body": {
          "monthly_investment": "$form.monthly_investment",
          "annual_return_rate": "$form.annual_return_rate",
          "investment_period": "$form.investment_period",
          "period_unit": "$form.period_unit"
        },
        "fields": [
          "calculation_result_id",
          "total_investment",
          "estimated_returns",
          "future_value",
          "chart_data_points"
        ],
        "response_target": "calculationResult",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "3906b847b7bc4006bb137ff3fc8ac153": {
        "endpoint_id": "3906b847b7bc4006bb137ff3fc8ac153",
        "module": "SIP Calculation",
        "endpoint": "/sip-calculation/calculations/reset",
        "method": "POST",
        "path_params": {},
        "query_params": {},
        "body": null,
        "fields": [
          "calculation_result_id",
          "total_investment",
          "estimated_returns",
          "future_value",
          "chart_data_points"
        ],
        "response_target": "calculationResult",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      }
    }
  },
  "data_model_ir": {
    "entities": {
      "calculation_input": {
        "name": "CalculationInput",
        "backend_module": "SIP Calculation",
        "fields": [
          "id",
          "monthly_investment",
          "annual_return_rate",
          "investment_period",
          "period_unit",
          "created_at",
          "updated_at"
        ],
        "computed": [],
        "display_fields": [
          "monthly_investment",
          "annual_return_rate",
          "investment_period",
          "period_unit"
        ],
        "search_fields": [],
        "filters": [],
        "default_sort": null,
        "default_sort_dir": "asc"
      },
      "calculation_result": {
        "name": "CalculationResult",
        "backend_module": "SIP Calculation",
        "fields": [
          "id",
          "calculation_input_id",
          "total_investment",
          "estimated_returns",
          "future_value",
          "calculation_timestamp",
          "created_at",
          "updated_at"
        ],
        "computed": [],
        "display_fields": [
          "total_investment",
          "estimated_returns",
          "future_value"
        ],
        "search_fields": [],
        "filters": [],
        "default_sort": null,
        "default_sort_dir": "asc"
      },
      "chart_data_point": {
        "name": "ChartDataPoint",
        "backend_module": "SIP Calculation",
        "fields": [
          "id",
          "calculation_result_id",
          "period",
          "invested_amount",
          "projected_value",
          "created_at",
          "updated_at"
        ],
        "computed": [],
        "display_fields": [
          "period",
          "invested_amount",
          "projected_value"
        ],
        "search_fields": [],
        "filters": [
          "calculation_result_id"
        ],
        "default_sort": null,
        "default_sort_dir": "asc"
      }
    },
    "relationships": []
  },
  "behaviour_ir": {
    "events": {
      "onInputChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.isCalculating",
            "expr": "true"
          }
        ],
        "description": ""
      },
      "onCalculationComplete": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.isCalculating",
            "expr": "false"
          },
          {
            "target": "state.hasCalculated",
            "expr": "true"
          }
        ],
        "description": ""
      }
    },
    "actions": {
      "073c967184df447494bbeca4a4f39780": {
        "action_id": "073c967184df447494bbeca4a4f39780",
        "trigger": "form_submit",
        "target_component_id": "sip_form",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [
          {
            "rule_id": "val_0",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment is required\", \"rule_id\": \"val_monthly_investment_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment is required\", \"rule_id\": \"val_monthly_investment_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_1",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment must be at least $1\", \"rule_id\": \"val_monthly_investment_min\", \"type\": \"min\", \"value\": 1}",
            "message": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment must be at least $1\", \"rule_id\": \"val_monthly_investment_min\", \"type\": \"min\", \"value\": 1}"
          },
          {
            "rule_id": "val_2",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment cannot exceed $10,000,000\", \"rule_id\": \"val_monthly_investment_max\", \"type\": \"max\", \"value\": 10000000}",
            "message": "{\"field\": \"monthly_investment\", \"message\": \"Monthly investment cannot exceed $10,000,000\", \"rule_id\": \"val_monthly_investment_max\", \"type\": \"max\", \"value\": 10000000}"
          },
          {
            "rule_id": "val_3",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate is required\", \"rule_id\": \"val_annual_return_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate is required\", \"rule_id\": \"val_annual_return_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_4",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate must be at least 0.1%\", \"rule_id\": \"val_annual_return_min\", \"type\": \"min\", \"value\": 0.1}",
            "message": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate must be at least 0.1%\", \"rule_id\": \"val_annual_return_min\", \"type\": \"min\", \"value\": 0.1}"
          },
          {
            "rule_id": "val_5",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate cannot exceed 50%\", \"rule_id\": \"val_annual_return_max\", \"type\": \"max\", \"value\": 50}",
            "message": "{\"field\": \"annual_return_rate\", \"message\": \"Annual return rate cannot exceed 50%\", \"rule_id\": \"val_annual_return_max\", \"type\": \"max\", \"value\": 50}"
          },
          {
            "rule_id": "val_6",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"investment_period\", \"message\": \"Investment period is required\", \"rule_id\": \"val_period_required\", \"type\": \"required\"}",
            "message": "{\"field\": \"investment_period\", \"message\": \"Investment period is required\", \"rule_id\": \"val_period_required\", \"type\": \"required\"}"
          },
          {
            "rule_id": "val_7",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"investment_period\", \"message\": \"Investment period must be at least 1\", \"rule_id\": \"val_period_min\", \"type\": \"min\", \"value\": 1}",
            "message": "{\"field\": \"investment_period\", \"message\": \"Investment period must be at least 1\", \"rule_id\": \"val_period_min\", \"type\": \"min\", \"value\": 1}"
          },
          {
            "rule_id": "val_8",
            "field": null,
            "type": "custom",
            "value": null,
            "expression": "{\"field\": \"investment_period\", \"message\": \"Investment period cannot exceed 40 years (480 months)\", \"rule_id\": \"val_period_max\", \"type\": \"max\", \"value\": 480}",
            "message": "{\"field\": \"investment_period\", \"message\": \"Investment period cannot exceed 40 years (480 months)\", \"rule_id\": \"val_period_max\", \"type\": \"max\", \"value\": 480}"
          }
        ],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.isCalculating",
            "expr": "true"
          }
        ],
        "api_endpoint": "3ba7a85df461444bb82bab5b3a347f92",
        "api_body": "{ monthly_investment: formValues.monthly_investment, annual_return_rate: formValues.annual_return_rate, investment_period: formValues.investment_period, period_unit: formValues.period_unit }",
        "side_effects": [],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "3906b847b7bc4006bb137ff3fc8ac153": {
        "action_id": "3906b847b7bc4006bb137ff3fc8ac153",
        "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.hasCalculated",
            "expr": "false"
          }
        ],
        "api_endpoint": "3906b847b7bc4006bb137ff3fc8ac153",
        "api_body": "{}",
        "side_effects": [
          {
            "type": "toast",
            "config": {
              "message": "Calculator reset to default values",
              "type": "info"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      }
    },
    "feedback": {
      "073c967184df447494bbeca4a4f39780": {
        "action_id": "073c967184df447494bbeca4a4f39780",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "Calculation complete",
        "error_message": "Calculation failed. Please check your inputs.",
        "ui_updates": []
      },
      "3906b847b7bc4006bb137ff3fc8ac153": {
        "action_id": "3906b847b7bc4006bb137ff3fc8ac153",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "Calculator reset successfully",
        "error_message": "Failed to reset calculator",
        "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%",
          "padding": "24px",
          "backgroundColor": "#f5f5f5"
        },
        "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": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "textAlign": "center",
          "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
      },
      "page_title": {
        "type": "Typography.Title",
        "label": "SIP Calculator",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 2
        },
        "dynamic_props": {},
        "styles": {
          "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
      },
      "page_subtitle": {
        "type": "Typography.Text",
        "label": "Calculate the future value of your Systematic Investment Plan",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "secondary"
        },
        "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
      },
      "info_tooltip": {
        "type": "Tooltip",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "SIP (Systematic Investment Plan) allows you to invest a fixed amount regularly. Formula: FV = P × ({[1 + i]^n – 1} / i) × (1 + i), where P = monthly investment, i = monthly rate of return, n = number of months"
        },
        "dynamic_props": {},
        "styles": {
          "marginLeft": "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
      },
      "info_icon": {
        "type": "InfoCircleOutlined",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "color": "#1677ff",
          "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
      },
      "content_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
      },
      "input_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "md": 10,
          "lg": 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
      },
      "input_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Investment Parameters"
        },
        "dynamic_props": {},
        "styles": {
          "height": "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
      },
      "sip_form": {
        "type": "Form",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "layout": "vertical",
          "initialValues": {
            "monthly_investment": 500,
            "annual_return_rate": 12,
            "investment_period": 10,
            "period_unit": "YEARS"
          }
        },
        "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_investment_field": {
        "type": "Form.Item",
        "label": "Monthly Investment ($)",
        "description": null,
        "bind": "monthly_investment",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "monthly_investment",
          "rules": [
            {
              "required": true,
              "message": "Please enter monthly investment"
            },
            {
              "type": "number",
              "min": 1,
              "max": 10000000,
              "message": "Value must be between $1 and $10,000,000"
            }
          ],
          "tooltip": "Amount you plan to invest every month"
        },
        "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_investment_input": {
        "type": "InputNumber",
        "label": null,
        "description": null,
        "bind": "monthly_investment",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "min": 1,
          "max": 10000000,
          "precision": 2,
          "style": {
            "width": "100%"
          },
          "placeholder": "Enter monthly investment",
          "aria-label": "Monthly Investment input"
        },
        "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
      },
      "annual_return_field": {
        "type": "Form.Item",
        "label": "Annual Return Rate (%)",
        "description": null,
        "bind": "annual_return_rate",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "annual_return_rate",
          "rules": [
            {
              "required": true,
              "message": "Please enter annual return rate"
            },
            {
              "type": "number",
              "min": 0.1,
              "max": 50,
              "message": "Value must be between 0.1% and 50%"
            }
          ],
          "tooltip": "Expected annual rate of return on your investment"
        },
        "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
      },
      "annual_return_input": {
        "type": "InputNumber",
        "label": null,
        "description": null,
        "bind": "annual_return_rate",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "suffix": "%",
          "min": 0.1,
          "max": 50,
          "precision": 2,
          "style": {
            "width": "100%"
          },
          "placeholder": "Enter annual return rate",
          "aria-label": "Annual Return Rate input"
        },
        "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
      },
      "investment_period_field": {
        "type": "Form.Item",
        "label": "Investment Period",
        "description": null,
        "bind": "investment_period",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "investment_period",
          "rules": [
            {
              "required": true,
              "message": "Please enter investment period"
            },
            {
              "type": "number",
              "min": 1,
              "max": 480,
              "message": "Value must be between 1 and 40 years (480 months)"
            }
          ],
          "tooltip": "Duration of your investment"
        },
        "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
      },
      "period_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
      },
      "investment_period_input": {
        "type": "InputNumber",
        "label": null,
        "description": null,
        "bind": "investment_period",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "min": 1,
          "max": 480,
          "precision": 0,
          "style": {
            "width": "70%"
          },
          "placeholder": "Enter period",
          "aria-label": "Investment Period input"
        },
        "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
      },
      "period_unit_field": {
        "type": "Form.Item",
        "label": null,
        "description": null,
        "bind": "period_unit",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "period_unit",
          "noStyle": 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
      },
      "period_unit_select": {
        "type": "Select",
        "label": null,
        "description": null,
        "bind": "period_unit",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "options": [
            {
              "label": "Years",
              "value": "YEARS"
            },
            {
              "label": "Months",
              "value": "MONTHS"
            }
          ],
          "style": {
            "width": "30%"
          },
          "aria-label": "Period Unit selector"
        },
        "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": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "display": "flex",
          "gap": "12px",
          "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_button": {
        "type": "Button",
        "label": "Calculate",
        "description": null,
        "bind": null,
        "onClick": "calculateSIP",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "primary",
          "htmlType": "submit",
          "size": "large",
          "block": false,
          "aria-label": "Calculate button"
        },
        "dynamic_props": {},
        "styles": {
          "flex": 1
        },
        "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": "resetCalculator",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "large",
          "block": false,
          "aria-label": "Reset button"
        },
        "dynamic_props": {},
        "styles": {
          "flex": 1
        },
        "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_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "md": 14,
          "lg": 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
      },
      "results_section": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "display": "flex",
          "flexDirection": "column",
          "gap": "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
      },
      "stats_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": [
            16,
            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
      },
      "total_investment_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 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_investment_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {
          "borderTop": "3px solid #1677ff"
        },
        "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_investment_statistic": {
        "type": "Statistic",
        "label": "Total Investment",
        "description": null,
        "bind": "state.calculationResult.total_investment",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "color": "#1677ff"
          },
          "aria-label": "Total Investment result"
        },
        "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
      },
      "estimated_returns_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 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
      },
      "estimated_returns_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {
          "borderTop": "3px solid #52c41a"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "estimated_returns_statistic": {
        "type": "Statistic",
        "label": "Estimated Returns",
        "description": null,
        "bind": "state.calculationResult.estimated_returns",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "color": "#52c41a"
          },
          "aria-label": "Estimated Returns result"
        },
        "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
      },
      "future_value_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 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
      },
      "future_value_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {
          "borderTop": "3px solid #722ed1",
          "boxShadow": "0 2px 8px rgba(114, 46, 209, 0.15)"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "future_value_statistic": {
        "type": "Statistic",
        "label": "Future Value (Maturity)",
        "description": null,
        "bind": "state.calculationResult.future_value",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "prefix": "$",
          "precision": 2,
          "valueStyle": {
            "color": "#722ed1",
            "fontWeight": "bold"
          },
          "aria-label": "Future Value result"
        },
        "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
      },
      "breakdown_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Investment Breakdown",
          "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
      },
      "breakdown_content": {
        "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-around",
          "alignItems": "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
      },
      "investment_proportion_text": {
        "type": "Typography.Text",
        "label": null,
        "description": null,
        "bind": "derived.investmentProportion",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "strong": true
        },
        "dynamic_props": {},
        "styles": {
          "color": "#1677ff"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "returns_proportion_text": {
        "type": "Typography.Text",
        "label": null,
        "description": null,
        "bind": "derived.returnsProportion",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "strong": true
        },
        "dynamic_props": {},
        "styles": {
          "color": "#52c41a"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "roi_text": {
        "type": "Typography.Text",
        "label": null,
        "description": null,
        "bind": "derived.roiPercentage",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "strong": true
        },
        "dynamic_props": {},
        "styles": {
          "color": "#722ed1"
        },
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "charts_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": [
            16,
            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
      },
      "line_chart_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "lg": 14
        },
        "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
      },
      "line_chart_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Investment Growth Over Time",
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {
          "height": "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
      },
      "growth_line_chart": {
        "type": "LineChart",
        "label": "Investment Growth Chart",
        "description": null,
        "bind": "state.calculationResult.chart_data_points",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xField": "period",
          "yFields": [
            "invested_amount",
            "projected_value"
          ],
          "seriesNames": [
            "Total Invested",
            "Projected Value"
          ],
          "colors": [
            "#1677ff",
            "#52c41a"
          ],
          "showLegend": true,
          "showTooltip": true,
          "height": 280,
          "aria-label": "Investment Growth Chart"
        },
        "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
      },
      "pie_chart_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "lg": 10
        },
        "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
      },
      "pie_chart_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "title": "Investment Composition",
          "size": "small"
        },
        "dynamic_props": {},
        "styles": {
          "height": "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
      },
      "composition_donut_chart": {
        "type": "DonutChart",
        "label": "Investment Composition Chart",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "data": [
            {
              "label": "Total Investment",
              "valueKey": "state.calculationResult.total_investment",
              "color": "#1677ff"
            },
            {
              "label": "Estimated Returns",
              "valueKey": "state.calculationResult.estimated_returns",
              "color": "#52c41a"
            }
          ],
          "showLabels": true,
          "showPercentage": true,
          "showAbsoluteValues": true,
          "height": 280,
          "aria-label": "Investment Composition Chart"
        },
        "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
      }
    }
  },
  "layout_ir": {
    "root": "main_container",
    "children": {
      "main_container": [
        "page_header",
        "content_row"
      ],
      "page_header": [
        "page_title",
        "page_subtitle",
        "info_tooltip"
      ],
      "info_tooltip": [
        "info_icon"
      ],
      "content_row": [
        "input_col",
        "results_col"
      ],
      "input_col": [
        "input_card"
      ],
      "input_card": [
        "sip_form"
      ],
      "sip_form": [
        "monthly_investment_field",
        "annual_return_field",
        "investment_period_field",
        "form_actions"
      ],
      "monthly_investment_field": [
        "monthly_investment_input"
      ],
      "annual_return_field": [
        "annual_return_input"
      ],
      "investment_period_field": [
        "period_input_group"
      ],
      "period_input_group": [
        "investment_period_input",
        "period_unit_field"
      ],
      "period_unit_field": [
        "period_unit_select"
      ],
      "form_actions": [
        "calculate_button",
        "reset_button"
      ],
      "results_col": [
        "results_section"
      ],
      "results_section": [
        "stats_row",
        "breakdown_card",
        "charts_row"
      ],
      "stats_row": [
        "total_investment_col",
        "estimated_returns_col",
        "future_value_col"
      ],
      "total_investment_col": [
        "total_investment_card"
      ],
      "total_investment_card": [
        "total_investment_statistic"
      ],
      "estimated_returns_col": [
        "estimated_returns_card"
      ],
      "estimated_returns_card": [
        "estimated_returns_statistic"
      ],
      "future_value_col": [
        "future_value_card"
      ],
      "future_value_card": [
        "future_value_statistic"
      ],
      "breakdown_card": [
        "breakdown_content"
      ],
      "breakdown_content": [
        "investment_proportion_text",
        "returns_proportion_text",
        "roi_text"
      ],
      "charts_row": [
        "line_chart_col",
        "pie_chart_col"
      ],
      "line_chart_col": [
        "line_chart_card"
      ],
      "line_chart_card": [
        "growth_line_chart"
      ],
      "pie_chart_col": [
        "pie_chart_card"
      ],
      "pie_chart_card": [
        "composition_donut_chart"
      ]
    },
    "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_header": {
        "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_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
      },
      "sip_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_actions": {
        "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
      },
      "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
      },
      "stats_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
      },
      "breakdown_content": {
        "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
      },
      "charts_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
      },
      "period_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
      }
    },
    "layout_zones": [
      {
        "zone_id": "main_zone",
        "component": "main_container",
        "anchor": "top-left",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Root container spanning full viewport"
      }
    ],
    "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
}
