{
  "page_ir": {
    "page_id": "reservations_list",
    "page_goal": "Staff-facing reservations management page with table listing all reservations, filters, summary stats, and actions to view details, cancel, or process pickup",
    "style": {
      "tone": "professional",
      "theme": "light",
      "density": "comfortable",
      "color_intent": "neutral with colored status badges"
    },
    "accessibility": {
      "required_labels": [
        "search_book_input",
        "search_member_input",
        "status_filter",
        "date_range_filter",
        "reservations_table"
      ],
      "skip_navigation": true,
      "focus_management": true,
      "announce_changes": []
    },
    "responsive": {
      "breakpoints": {
        "sm": 576,
        "md": 768,
        "lg": 1024,
        "xl": 1200
      },
      "collapse_rules": [
        "stats_row collapses to vertical on sm",
        "filters_row wraps on md"
      ],
      "hidden_on_small": [
        "queue_position_column",
        "expiry_date_column"
      ],
      "stack_on_small": []
    },
    "constraints": [
      "Role must be administrator or librarian to access this page"
    ],
    "seo_title": null,
    "seo_description": null
  },
  "data_ir": {
    "types": {},
    "state": {
      "reservations": {
        "type": "array",
        "initial": [],
        "required": true,
        "constraints": {},
        "item_type": null
      },
      "loading": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "filterStatus": {
        "type": "string",
        "initial": "",
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "searchBook": {
        "type": "string",
        "initial": "",
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "searchMember": {
        "type": "string",
        "initial": "",
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "dateRange": {
        "type": "array",
        "initial": [],
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "pagination": {
        "type": "object",
        "initial": {
          "current": 1,
          "pageSize": 20,
          "total": 0
        },
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "detailModalVisible": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "cancelModalVisible": {
        "type": "boolean",
        "initial": false,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "selectedReservation": {
        "type": "object",
        "initial": null,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "totalActive": {
        "type": "number",
        "initial": 0,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "readyForPickup": {
        "type": "number",
        "initial": 0,
        "required": false,
        "constraints": {},
        "item_type": null
      },
      "expiredToday": {
        "type": "number",
        "initial": 0,
        "required": false,
        "constraints": {},
        "item_type": null
      }
    },
    "derived": {
      "filteredReservations": {
        "type": "array",
        "expr": "state.reservations",
        "deps": []
      }
    }
  },
  "data_fetch_ir": {
    "endpoints": {
      "69880b2d2eac495c98d8273ff508baf2": {
        "endpoint_id": "69880b2d2eac495c98d8273ff508baf2",
        "module": "Circulation",
        "endpoint": "/circulation/reservations",
        "method": "GET",
        "path_params": {},
        "query_params": {
          "limit": "$state.pagination.pageSize",
          "offset": "($state.pagination.current - 1) * $state.pagination.pageSize",
          "reservation_status": "$state.filterStatus || undefined",
          "book_id": "$state.searchBook || undefined",
          "member_id": "$state.searchMember || undefined"
        },
        "body": null,
        "fields": [
          "id",
          "book_id",
          "member_id",
          "reservation_date",
          "expiry_date",
          "queue_position",
          "status",
          "notified_date",
          "created_at",
          "updated_at"
        ],
        "response_target": "reservations",
        "response_transform": null,
        "trigger": "on_mount",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "c9f790254afe44cca78b944d3ebb5135": {
        "endpoint_id": "c9f790254afe44cca78b944d3ebb5135",
        "module": "Circulation",
        "endpoint": "/circulation/reservations/{reservation_id}/details",
        "method": "GET",
        "path_params": {
          "reservation_id": "$state.selectedReservation.id"
        },
        "query_params": {},
        "body": null,
        "fields": [
          "id",
          "book",
          "member",
          "reservation_date",
          "expiry_date",
          "queue_position",
          "status",
          "notified_date",
          "created_at",
          "updated_at"
        ],
        "response_target": "selectedReservation",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "63857a389c724a63877d52feaaac0fee": {
        "endpoint_id": "63857a389c724a63877d52feaaac0fee",
        "module": "Circulation",
        "endpoint": "/circulation/reservations/{reservation_id}/cancel",
        "method": "POST",
        "path_params": {
          "reservation_id": "$state.selectedReservation.id"
        },
        "query_params": {},
        "body": null,
        "fields": [
          "id",
          "book_id",
          "member_id",
          "reservation_date",
          "expiry_date",
          "queue_position",
          "status",
          "notified_date"
        ],
        "response_target": "cancelReservation_data",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      },
      "f0a993837dc74aae936c43cb5f5b4bf5": {
        "endpoint_id": "f0a993837dc74aae936c43cb5f5b4bf5",
        "module": "Circulation",
        "endpoint": "/circulation/reservations/{reservation_id}/expire",
        "method": "POST",
        "path_params": {
          "reservation_id": "$state.selectedReservation.id"
        },
        "query_params": {},
        "body": null,
        "fields": [
          "id",
          "book_id",
          "member_id",
          "reservation_date",
          "expiry_date",
          "queue_position",
          "status",
          "notified_date"
        ],
        "response_target": "expireReservation_data",
        "response_transform": null,
        "trigger": "manual",
        "depends_on": [],
        "debounce_ms": null,
        "loading_field": null,
        "error_field": null
      }
    }
  },
  "data_model_ir": {
    "entities": {
      "reservation": {
        "name": "Reservation",
        "backend_module": "Circulation",
        "fields": [
          "id",
          "book_id",
          "member_id",
          "reservation_date",
          "expiry_date",
          "queue_position",
          "status",
          "notified_date",
          "created_at",
          "updated_at"
        ],
        "computed": [],
        "display_fields": [
          "id",
          "book_id",
          "member_id",
          "reservation_date",
          "queue_position",
          "status",
          "expiry_date"
        ],
        "search_fields": [],
        "filters": [
          "status",
          "book_id",
          "member_id"
        ],
        "default_sort": null,
        "default_sort_dir": "asc"
      }
    },
    "relationships": []
  },
  "behaviour_ir": {
    "events": {
      "onStatusFilterChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.filterStatus",
            "expr": "event.value"
          },
          {
            "target": "state.pagination.current",
            "expr": "1"
          }
        ],
        "description": ""
      },
      "onBookSearchChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.searchBook",
            "expr": "event.value"
          },
          {
            "target": "state.pagination.current",
            "expr": "1"
          }
        ],
        "description": ""
      },
      "onMemberSearchChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.searchMember",
            "expr": "event.value"
          },
          {
            "target": "state.pagination.current",
            "expr": "1"
          }
        ],
        "description": ""
      },
      "onDateRangeChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.dateRange",
            "expr": "event.value"
          },
          {
            "target": "state.pagination.current",
            "expr": "1"
          }
        ],
        "description": ""
      },
      "onPageChange": {
        "type": "mutation",
        "updates": [
          {
            "target": "state.pagination.current",
            "expr": "event.page"
          },
          {
            "target": "state.pagination.pageSize",
            "expr": "event.pageSize"
          }
        ],
        "description": ""
      }
    },
    "actions": {
      "dadb1b6ef4de4fedb58778d00e61ee8b": {
        "action_id": "dadb1b6ef4de4fedb58778d00e61ee8b",
        "trigger": "button_click",
        "target_component_id": "reservations_table",
        "operation": "read",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.loading",
            "expr": "true"
          }
        ],
        "api_endpoint": "69880b2d2eac495c98d8273ff508baf2",
        "api_body": null,
        "side_effects": [],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "070f5b4a36e344b189be6ee578155f21": {
        "action_id": "070f5b4a36e344b189be6ee578155f21",
        "trigger": "button_click",
        "target_component_id": "detail_modal",
        "operation": "read",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.selectedReservation",
            "expr": "event.record"
          },
          {
            "target": "state.detailModalVisible",
            "expr": "true"
          }
        ],
        "api_endpoint": "c9f790254afe44cca78b944d3ebb5135",
        "api_body": null,
        "side_effects": [
          {
            "type": "modal_open",
            "config": {
              "modal_id": "detail_modal"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "8d6ef616e9f4430f9f01756baa373497": {
        "action_id": "8d6ef616e9f4430f9f01756baa373497",
        "trigger": "button_click",
        "target_component_id": "cancel_modal",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.selectedReservation",
            "expr": "event.record"
          },
          {
            "target": "state.cancelModalVisible",
            "expr": "true"
          }
        ],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "modal_open",
            "config": {
              "modal_id": "cancel_modal"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "76c90d485a7c45b0b2f590c71221653f": {
        "action_id": "76c90d485a7c45b0b2f590c71221653f",
        "trigger": "form_submit",
        "target_component_id": "cancel_modal",
        "operation": "update",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": true,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.cancelModalVisible",
            "expr": "false"
          }
        ],
        "api_endpoint": "63857a389c724a63877d52feaaac0fee",
        "api_body": null,
        "side_effects": [
          {
            "type": "modal_close",
            "config": {
              "modal_id": "cancel_modal"
            }
          },
          {
            "type": "toast",
            "config": {
              "message": "Reservation cancelled successfully",
              "type": "success"
            }
          },
          {
            "type": "refresh",
            "config": {}
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "6e5a372ef61a4d3f983a170ef6f435bd": {
        "action_id": "6e5a372ef61a4d3f983a170ef6f435bd",
        "trigger": "button_click",
        "target_component_id": "reservations_table",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": true,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "navigate",
            "config": {
              "path": "/circulation/checkout"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "4a611c0bf1924a9fbdad03b9bd070c3f": {
        "action_id": "4a611c0bf1924a9fbdad03b9bd070c3f",
        "trigger": "button_click",
        "target_component_id": "detail_modal",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.detailModalVisible",
            "expr": "false"
          },
          {
            "target": "state.selectedReservation",
            "expr": "null"
          }
        ],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "modal_close",
            "config": {
              "modal_id": "detail_modal"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "f70d4818c3334bc8ab29b998ba19f07f": {
        "action_id": "f70d4818c3334bc8ab29b998ba19f07f",
        "trigger": "button_click",
        "target_component_id": "cancel_modal",
        "operation": "custom",
        "description": "",
        "payload": {},
        "guard": null,
        "requires_confirmation": false,
        "confirmation_message": null,
        "validation_rules": [],
        "validation_messages": {},
        "updates": [
          {
            "target": "state.cancelModalVisible",
            "expr": "false"
          }
        ],
        "api_endpoint": null,
        "api_body": null,
        "side_effects": [
          {
            "type": "modal_close",
            "config": {
              "modal_id": "cancel_modal"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      },
      "6fb2e4b8c86646a5a45af0688331ddf2": {
        "action_id": "6fb2e4b8c86646a5a45af0688331ddf2",
        "trigger": "button_click",
        "target_component_id": "back_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": "navigate",
            "config": {
              "path": "/librarian/dashboard"
            }
          }
        ],
        "then": null,
        "catch": null,
        "data_action": null
      }
    },
    "feedback": {
      "dadb1b6ef4de4fedb58778d00e61ee8b": {
        "action_id": "dadb1b6ef4de4fedb58778d00e61ee8b",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": null,
        "error_message": "Failed to load reservations",
        "ui_updates": []
      },
      "070f5b4a36e344b189be6ee578155f21": {
        "action_id": "070f5b4a36e344b189be6ee578155f21",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": null,
        "error_message": "Failed to load reservation details",
        "ui_updates": []
      },
      "76c90d485a7c45b0b2f590c71221653f": {
        "action_id": "76c90d485a7c45b0b2f590c71221653f",
        "loading_indicator": "spinner",
        "loading_text": null,
        "success_message": "Reservation cancelled successfully",
        "error_message": "Failed to cancel reservation",
        "ui_updates": []
      },
      "6e5a372ef61a4d3f983a170ef6f435bd": {
        "action_id": "6e5a372ef61a4d3f983a170ef6f435bd",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "ui_updates": []
      },
      "4a611c0bf1924a9fbdad03b9bd070c3f": {
        "action_id": "4a611c0bf1924a9fbdad03b9bd070c3f",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "ui_updates": []
      },
      "f70d4818c3334bc8ab29b998ba19f07f": {
        "action_id": "f70d4818c3334bc8ab29b998ba19f07f",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "ui_updates": []
      },
      "8d6ef616e9f4430f9f01756baa373497": {
        "action_id": "8d6ef616e9f4430f9f01756baa373497",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "ui_updates": []
      },
      "6fb2e4b8c86646a5a45af0688331ddf2": {
        "action_id": "6fb2e4b8c86646a5a45af0688331ddf2",
        "loading_indicator": null,
        "loading_text": null,
        "success_message": null,
        "error_message": null,
        "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": "Layout",
        "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",
          "background": "#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": {
          "display": "flex",
          "justifyContent": "space-between",
          "alignItems": "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
      },
      "header_left": {
        "type": "div",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {},
        "dynamic_props": {},
        "styles": {
          "display": "flex",
          "alignItems": "center",
          "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
      },
      "back_button": {
        "type": "Button",
        "label": "Back to Dashboard",
        "description": null,
        "bind": null,
        "onClick": "navigateToDashboard",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "text",
          "icon": "ArrowLeftOutlined"
        },
        "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
      },
      "page_title": {
        "type": "Typography.Title",
        "label": "Reservations Management",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "level": 3
        },
        "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
      },
      "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": {
          "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
      },
      "stat_active_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
      },
      "stat_active_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": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "stat_active_statistic": {
        "type": "Statistic",
        "label": "Total Active Reservations",
        "description": null,
        "bind": "state.totalActive",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "valueStyle": {
            "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
      },
      "stat_ready_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
      },
      "stat_ready_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": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "stat_ready_statistic": {
        "type": "Statistic",
        "label": "Ready for Pickup",
        "description": null,
        "bind": "state.readyForPickup",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "valueStyle": {
            "color": "#52c41a"
          }
        },
        "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
      },
      "stat_expired_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
      },
      "stat_expired_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": {},
        "dynamic_styles": {},
        "class_name": null,
        "dynamic_class": null,
        "transitions": [],
        "visible_when": null,
        "disabled_when": null,
        "repeat": null,
        "slots": {},
        "a11y_role": null,
        "a11y_label": null
      },
      "stat_expired_statistic": {
        "type": "Statistic",
        "label": "Expired Today",
        "description": null,
        "bind": "state.expiredToday",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "valueStyle": {
            "color": "#ff4d4f"
          }
        },
        "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
      },
      "filters_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": {
          "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
      },
      "filters_row": {
        "type": "Row",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "gutter": [
            16,
            16
          ],
          "align": "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
      },
      "filter_status_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 6
        },
        "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
      },
      "status_filter": {
        "type": "Select",
        "label": "Status",
        "description": null,
        "bind": "state.filterStatus",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "Filter by status",
          "allowClear": true,
          "options": [
            {
              "label": "Pending",
              "value": "PENDING"
            },
            {
              "label": "Ready",
              "value": "READY"
            },
            {
              "label": "Fulfilled",
              "value": "FULFILLED"
            },
            {
              "label": "Cancelled",
              "value": "CANCELLED"
            },
            {
              "label": "Expired",
              "value": "EXPIRED"
            }
          ],
          "style": {
            "width": "100%"
          }
        },
        "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
      },
      "filter_book_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 6
        },
        "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
      },
      "search_book_input": {
        "type": "Input.Search",
        "label": "Book Search",
        "description": null,
        "bind": "state.searchBook",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "Search by book title or ID",
          "allowClear": 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
      },
      "filter_member_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 6
        },
        "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
      },
      "search_member_input": {
        "type": "Input.Search",
        "label": "Member Search",
        "description": null,
        "bind": "state.searchMember",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "placeholder": "Search by member name or ID",
          "allowClear": 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
      },
      "filter_date_col": {
        "type": "Col",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "xs": 24,
          "sm": 12,
          "md": 6
        },
        "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
      },
      "date_range_filter": {
        "type": "DatePicker.RangePicker",
        "label": "Date Range",
        "description": null,
        "bind": "state.dateRange",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "style": {
            "width": "100%"
          },
          "placeholder": [
            "Start Date",
            "End Date"
          ]
        },
        "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
      },
      "table_card": {
        "type": "Card",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bodyStyle": {
            "padding": 0
          }
        },
        "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
      },
      "reservations_table": {
        "type": "Table",
        "label": "Reservations Table",
        "description": null,
        "bind": "state.reservations",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "rowKey": "id",
          "loading": "state.loading",
          "pagination": {
            "current": "state.pagination.current",
            "pageSize": "state.pagination.pageSize",
            "total": "state.pagination.total",
            "showSizeChanger": true,
            "showTotal": true
          },
          "columns": [
            {
              "title": "Reservation ID",
              "dataIndex": "id",
              "key": "id",
              "width": 120,
              "ellipsis": true
            },
            {
              "title": "Book",
              "dataIndex": "book_id",
              "key": "book_id"
            },
            {
              "title": "Member",
              "dataIndex": "member_id",
              "key": "member_id"
            },
            {
              "title": "Reservation Date",
              "dataIndex": "reservation_date",
              "key": "reservation_date",
              "sorter": true
            },
            {
              "title": "Queue Position",
              "dataIndex": "queue_position",
              "key": "queue_position",
              "width": 100,
              "align": "center"
            },
            {
              "title": "Status",
              "dataIndex": "status",
              "key": "status",
              "width": 140,
              "render": "tag",
              "tagColorMap": {
                "PENDING": "blue",
                "READY": "green",
                "FULFILLED": "cyan",
                "CANCELLED": "default",
                "EXPIRED": "red"
              }
            },
            {
              "title": "Expiry Date",
              "dataIndex": "expiry_date",
              "key": "expiry_date"
            },
            {
              "title": "Actions",
              "key": "actions",
              "width": 220,
              "fixed": "right"
            }
          ]
        },
        "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
      },
      "detail_modal": {
        "type": "Modal",
        "label": "Reservation Details",
        "description": null,
        "bind": "state.detailModalVisible",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "width": 640,
          "footer": null
        },
        "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
      },
      "detail_descriptions": {
        "type": "Descriptions",
        "label": null,
        "description": null,
        "bind": "state.selectedReservation",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "bordered": true,
          "column": 2,
          "items": [
            {
              "label": "Reservation ID",
              "field": "id"
            },
            {
              "label": "Status",
              "field": "status"
            },
            {
              "label": "Book",
              "field": "book"
            },
            {
              "label": "Member",
              "field": "member"
            },
            {
              "label": "Reservation Date",
              "field": "reservation_date"
            },
            {
              "label": "Expiry Date",
              "field": "expiry_date"
            },
            {
              "label": "Queue Position",
              "field": "queue_position"
            },
            {
              "label": "Notified Date",
              "field": "notified_date"
            },
            {
              "label": "Created At",
              "field": "created_at"
            },
            {
              "label": "Updated At",
              "field": "updated_at"
            }
          ]
        },
        "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
      },
      "cancel_modal": {
        "type": "Modal",
        "label": "Cancel Reservation",
        "description": null,
        "bind": "state.cancelModalVisible",
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "width": 480,
          "okText": "Confirm Cancel",
          "okButtonProps": {
            "danger": 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
      },
      "cancel_form": {
        "type": "Form",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "layout": "vertical"
        },
        "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
      },
      "cancel_reason_field": {
        "type": "Form.Item",
        "label": "Cancellation Reason",
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "name": "reason",
          "rules": [
            {
              "required": true,
              "message": "Please provide a reason for cancellation"
            }
          ]
        },
        "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
      },
      "cancel_reason_input": {
        "type": "Input.TextArea",
        "label": null,
        "description": null,
        "bind": null,
        "onClick": null,
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "rows": 4,
          "placeholder": "Enter reason for cancelling this reservation..."
        },
        "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
      },
      "action_view_button": {
        "type": "Button",
        "label": "View Details",
        "description": null,
        "bind": null,
        "onClick": "viewDetails",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "link",
          "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
      },
      "action_cancel_button": {
        "type": "Button",
        "label": "Cancel",
        "description": null,
        "bind": null,
        "onClick": "openCancelModal",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "link",
          "size": "small",
          "danger": 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
      },
      "action_pickup_button": {
        "type": "Button",
        "label": "Process Pickup",
        "description": null,
        "bind": null,
        "onClick": "processPickup",
        "onChange": null,
        "onSubmit": null,
        "onHover": null,
        "onKeyPress": null,
        "props": {
          "type": "link",
          "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
      }
    }
  },
  "layout_ir": {
    "root": "main_container",
    "children": {
      "main_container": [
        "page_header",
        "stats_row",
        "filters_card",
        "table_card",
        "detail_modal",
        "cancel_modal"
      ],
      "page_header": [
        "header_left"
      ],
      "header_left": [
        "back_button",
        "page_title"
      ],
      "stats_row": [
        "stat_active_col",
        "stat_ready_col",
        "stat_expired_col"
      ],
      "stat_active_col": [
        "stat_active_card"
      ],
      "stat_active_card": [
        "stat_active_statistic"
      ],
      "stat_ready_col": [
        "stat_ready_card"
      ],
      "stat_ready_card": [
        "stat_ready_statistic"
      ],
      "stat_expired_col": [
        "stat_expired_card"
      ],
      "stat_expired_card": [
        "stat_expired_statistic"
      ],
      "filters_card": [
        "filters_row"
      ],
      "filters_row": [
        "filter_status_col",
        "filter_book_col",
        "filter_member_col",
        "filter_date_col"
      ],
      "filter_status_col": [
        "status_filter"
      ],
      "filter_book_col": [
        "search_book_input"
      ],
      "filter_member_col": [
        "search_member_input"
      ],
      "filter_date_col": [
        "date_range_filter"
      ],
      "table_card": [
        "reservations_table"
      ],
      "detail_modal": [
        "detail_descriptions"
      ],
      "cancel_modal": [
        "cancel_form"
      ],
      "cancel_form": [
        "cancel_reason_field"
      ],
      "cancel_reason_field": [
        "cancel_reason_input"
      ]
    },
    "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": "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
      },
      "header_left": {
        "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
      },
      "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
      },
      "filters_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
      },
      "filters_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
      },
      "table_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
      },
      "detail_modal": {
        "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
      },
      "cancel_modal": {
        "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
      },
      "cancel_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
      }
    },
    "layout_zones": [
      {
        "zone_id": "main_zone",
        "component": "main_container",
        "anchor": "top-left",
        "size_hint": "full-width",
        "z_layer": "base",
        "notes": "Root page container"
      },
      {
        "zone_id": "detail_modal_zone",
        "component": "detail_modal",
        "anchor": "center",
        "size_hint": "640px",
        "z_layer": "overlay",
        "notes": "Reservation detail modal overlay"
      },
      {
        "zone_id": "cancel_modal_zone",
        "component": "cancel_modal",
        "anchor": "center",
        "size_hint": "480px",
        "z_layer": "overlay",
        "notes": "Cancel reservation modal overlay"
      }
    ],
    "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
}
