{
    "dsl": {
        "widgetName": "MainContainer",
        "backgroundColor": "none",
        "rightColumn": 427,
        "snapColumns": 64,
        "detachFromLayout": true,
        "widgetId": "0",
        "topRow": 0,
        "bottomRow": 1770,
        "containerStyle": "none",
        "snapRows": 177,
        "parentRowSpace": 1,
        "type": "CANVAS_WIDGET",
        "canExtend": true,
        "version": 46,
        "minHeight": 1780,
        "parentColumnSpace": 1,
        "dynamicBindingPathList": [],
        "leftColumn": 0,
        "children": [
            {
                "widgetName": "Table1",
                "defaultPageSize": 0,
                "columnOrder": [
                    "step",
                    "task",
                    "status",
                    "action",
                    "customColumn1",
                    "customColumn2"
                ],
                "aliasMap": {
                  "step": "step",
                  "task": "task",
                  "status": "status",
                  "action": "action",
                  "customColumn1": "customColumn1",
                  "customColumn2": "customColumn2"
                },
                "isVisibleDownload": true,
                "displayName": "Table",
                "iconSVG": "/static/media/icon.db8a9cbd.svg",
                "topRow": 28,
                "bottomRow": 56,
                "isSortable": true,
                "parentRowSpace": 10,
                "type": "TABLE_WIDGET_V2",
                "defaultSelectedRowIndex": "0",
                "hideCard": false,
                "parentColumnSpace": 17.265625,
                "dynamicPropertyPathList": [{"key": "tableData"}],
                "dynamicTriggerPathList": [],
                "dynamicBindingPathList": [
                    {
                        "key": "primaryColumns.step.computedValue"
                    },
                    {
                        "key": "primaryColumns.task.computedValue"
                    },
                    {
                        "key": "primaryColumns.status.computedValue"
                    },
                    {
                        "key": "primaryColumns.action.computedValue"
                    },
                    {
                        "key": "primaryColumns.action.buttonLabel"
                    },
                    {
                        "key": "primaryColumns.action.menuButtonLabel"
                    },
                    {
                        "key": "primaryColumns.customColumn1.menuButtonLabel"
                    }
                ],
                "leftColumn": 2,
                "primaryColumns": {
                    "step": {
                        "index": 0,
                        "width": 150,
                        "id": "step",
                        "alias": "step",
                        "originalId": "step",
                        "horizontalAlignment": "LEFT",
                        "verticalAlignment": "CENTER",
                        "columnType": "text",
                        "textSize": "PARAGRAPH",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isCellVisible": true,
                        "isDerived": false,
                        "label": "step",
                        "computedValue": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( currentRow.step))}}"
                    },
                    "task": {
                        "index": 1,
                        "width": 150,
                        "id": "task",
                        "alias": "task",
                        "originalId": "task",
                        "horizontalAlignment": "LEFT",
                        "verticalAlignment": "CENTER",
                        "columnType": "text",
                        "textSize": "PARAGRAPH",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isCellVisible": true,
                        "isDerived": false,
                        "label": "task",
                        "computedValue": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( currentRow.task))}}"
                    },
                    "status": {
                        "index": 2,
                        "width": 150,
                        "id": "status",
                        "alias": "status",
                        "originalId": "status",
                        "horizontalAlignment": "LEFT",
                        "verticalAlignment": "CENTER",
                        "columnType": "text",
                        "textSize": "PARAGRAPH",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isCellVisible": true,
                        "isDerived": false,
                        "label": "status",
                        "computedValue": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( currentRow.status))}}"
                    },
                    "action": {
                        "index": 3,
                        "width": 150,
                        "id": "action",
                        "alias": "action",
                        "originalId": "action",
                        "horizontalAlignment": "LEFT",
                        "verticalAlignment": "CENTER",
                        "columnType": "button",
                        "textSize": "PARAGRAPH",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isCellVisible": true,
                        "isDisabled": false,
                        "isDerived": false,
                        "label": "action",
                        "onClick": "{{currentRow.step === '#1' ? showAlert('Done', 'success') : currentRow.step === '#2' ? navigateTo('https://docs.appsmith.com/core-concepts/connecting-to-data-sources/querying-a-database',undefined,'NEW_WINDOW') : navigateTo('https://docs.appsmith.com/core-concepts/displaying-data-read/display-data-tables',undefined,'NEW_WINDOW')}}",
                        "computedValue": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( currentRow.action))}}",
                        "buttonLabel": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( 'Action'))}}",
                        "menuButtonLabel": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( 'Open Menu'))}}"
                    },
                    "customColumn1": {
                        "index": 4,
                        "width": 150,
                        "id": "customColumn1",
                        "alias": "customColumn1",
                        "originalId": "customColumn1",
                        "columnType": "menuButton",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isDisabled": false,
                        "isCellVisible": true,
                        "isDerived": true,
                        "label": "customColumn1",
                        "computedValue": "",
                        "buttonStyle": "rgb(3, 179, 101)",
                        "buttonLabelColor": "#FFFFFF",
                        "menuButtonLabel": "{{Table1.processedTableData.map((currentRow, currentIndex) => ( 'Open Menu'))}}",
                        "menuItems": {
                            "menuItemyjwc4mqjn8": {
                                "id": "menuItemyjwc4mqjn8",
                                "label": "Menu Item 1",
                                "widgetId": "ysl7bs8qv3",
                                "isDisabled": false,
                                "isVisible": true
                            }
                        }
                    },
                    "customColumn2": {
                        "index": 5,
                        "width": 150,
                        "id": "customColumn2",
                        "alias": "customColumn2",
                        "originalId": "customColumn2",
                        "columnType": "iconButton",
                        "enableFilter": true,
                        "enableSort": true,
                        "isVisible": true,
                        "isDisabled": false,
                        "isCellVisible": true,
                        "isDerived": true,
                        "label": "customColumn2",
                        "computedValue": "",
                        "buttonStyle": "rgb(3, 179, 101)",
                        "buttonLabelColor": "#FFFFFF"
                    }
                },
                "delimiter": ",",
                "key": "loucuvyjvb",
                "rightColumn": 47,
                "textSize": "PARAGRAPH",
                "widgetId": "ofs3jqui68",
                "isVisibleFilters": true,
                "tableData": "[\n  {\n    \"step\": \"#1\",\n    \"task\": \"Drop a table\",\n    \"status\": \"✅\",\n    \"action\": \"\"\n  },\n  {\n    \"step\": \"#2\",\n    \"task\": \"Create a query fetch_users with the Mock DB\",\n    \"status\": \"--\",\n    \"action\": \"\"\n  },\n  {\n    \"step\": \"#3\",\n    \"task\": \"Bind the query using => fetch_users.data\",\n    \"status\": \"--\",\n    \"action\": \"\"\n  }\n]",
                "isVisible": true,
                "label": "Data",
                "searchKey": "",
                "version": 3,
                "totalRecordsCount": 0,
                "parentId": "0",
                "renderMode": "CANVAS",
                "isLoading": false,
                "horizontalAlignment": "LEFT",
                "isVisibleSearch": true,
                "isVisiblePagination": true,
                "verticalAlignment": "CENTER",
                "columnSizeMap": {
                    "task": 245,
                    "step": 62,
                    "status": 75
                }
            },
            {
                "widgetName": "Text1",
                "displayName": "Text",
                "iconSVG": "/static/media/icon.97c59b52.svg",
                "topRow": 73,
                "bottomRow": 77,
                "parentRowSpace": 10,
                "type": "TEXT_WIDGET",
                "hideCard": false,
                "parentColumnSpace": 17.265625,
                "dynamicTriggerPathList": [],
                "leftColumn": 7,
                "dynamicBindingPathList": [
                    {
                        "key": "text"
                    }
                ],
                "text": "{{Table1.selectedRowIndex}}",
                "key": "r91cgfzjby",
                "rightColumn": 23,
                "textAlign": "LEFT",
                "widgetId": "oftnjwntmu",
                "isVisible": true,
                "fontStyle": "BOLD",
                "textColor": "#231F20",
                "version": 1,
                "parentId": "0",
                "renderMode": "CANVAS",
                "isLoading": false,
                "fontSize": "PARAGRAPH"
            }
        ]
    }
}