{
  "dsl": {
    "widgetName": "MainContainer",
    "backgroundColor": "none",
    "rightColumn": 1160,
    "snapColumns": 64,
    "detachFromLayout": true,
    "widgetId": "0",
    "topRow": 0,
    "bottomRow": 1180,
    "containerStyle": "none",
    "snapRows": 128,
    "parentRowSpace": 1,
    "type": "CANVAS_WIDGET",
    "canExtend": true,
    "version": 47,
    "minHeight": 930,
    "parentColumnSpace": 1,
    "dynamicBindingPathList": [],
    "leftColumn": 0,
    "children": [
      {
        "widgetName": "Table2",
        "defaultPageSize": 0,
        "columnOrder": [
          "step",
          "task",
          "status",
          "action"
        ],
        "isVisibleDownload": true,
        "displayName": "Table",
        "iconSVG": "/static/media/icon.db8a9cbd.svg",
        "topRow": 61,
        "bottomRow": 89,
        "isSortable": true,
        "parentRowSpace": 10,
        "type": "TABLE_WIDGET",
        "defaultSelectedRow": "0",
        "hideCard": false,
        "animateLoading": true,
        "parentColumnSpace": 17.265625,
        "dynamicBindingPathList": [
          {
            "key": "primaryColumns.step.computedValue"
          },
          {
            "key": "primaryColumns.task.computedValue"
          },
          {
            "key": "primaryColumns.status.computedValue"
          },
          {
            "key": "primaryColumns.action.computedValue"
          }
        ],
        "leftColumn": 2,
        "primaryColumns": {
          "step": {
            "index": 0,
            "width": 150,
            "id": "step",
            "horizontalAlignment": "LEFT",
            "verticalAlignment": "CENTER",
            "columnType": "text",
            "textSize": "PARAGRAPH",
            "enableFilter": true,
            "enableSort": true,
            "isVisible": true,
            "isCellVisible": true,
            "isDerived": false,
            "label": "step",
            "computedValue": "{{Table2.sanitizedTableData.map((currentRow) => ( currentRow.step))}}",
            "buttonColor": "#03B365",
            "menuColor": "#03B365",
            "labelColor": "#FFFFFF"
          },
          "task": {
            "index": 1,
            "width": 150,
            "id": "task",
            "horizontalAlignment": "LEFT",
            "verticalAlignment": "CENTER",
            "columnType": "text",
            "textSize": "PARAGRAPH",
            "enableFilter": true,
            "enableSort": true,
            "isVisible": true,
            "isCellVisible": true,
            "isDerived": false,
            "label": "task",
            "computedValue": "{{Table2.sanitizedTableData.map((currentRow) => ( currentRow.task))}}",
            "buttonColor": "#03B365",
            "menuColor": "#03B365",
            "labelColor": "#FFFFFF"
          },
          "status": {
            "index": 2,
            "width": 150,
            "id": "status",
            "horizontalAlignment": "LEFT",
            "verticalAlignment": "CENTER",
            "columnType": "text",
            "textSize": "PARAGRAPH",
            "enableFilter": true,
            "enableSort": true,
            "isVisible": true,
            "isCellVisible": true,
            "isDerived": false,
            "label": "status",
            "computedValue": "{{Table2.sanitizedTableData.map((currentRow) => ( currentRow.status))}}",
            "buttonColor": "#03B365",
            "menuColor": "#03B365",
            "labelColor": "#FFFFFF"
          },
          "action": {
            "index": 3,
            "width": 150,
            "id": "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": "{{Table2.sanitizedTableData.map((currentRow) => ( currentRow.action))}}",
            "buttonColor": "#03B365",
            "menuColor": "#03B365",
            "labelColor": "#FFFFFF"
          }
        },
        "delimiter": ",",
        "key": "wk470tvqt8",
        "derivedColumns": {},
        "rightColumn": 36,
        "textSize": "PARAGRAPH",
        "widgetId": "csw61cbjhr",
        "isVisibleFilters": true,
        "tableData": [
          {
            "step": "#1",
            "task": "Drop a table",
            "status": "✅",
            "action": ""
          },
          {
            "step": "#2",
            "task": "Create a query fetch_users with the Mock DB",
            "status": "--",
            "action": ""
          },
          {
            "step": "#3",
            "task": "Bind the query using => fetch_users.data",
            "status": "--",
            "action": ""
          }
        ],
        "isVisible": true,
        "label": "Data",
        "searchKey": "",
        "enableClientSideSearch": true,
        "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": "Select1",
        "isFilterable": false,
        "displayName": "Select",
        "iconSVG": "/static/media/icon.bd99caba.svg",
        "labelText": "Label",
        "topRow": 80,
        "bottomRow": 86.9,
        "parentRowSpace": 10,
        "type": "SELECT_WIDGET",
        "serverSideFiltering": false,
        "hideCard": false,
        "defaultOptionValue": "{\n    \"label\": \"{{Table2.selectedRow.step}}\",\n    \"value\": \"{{Table2.selectedRow.step}}\"\n  }",
        "selectionType": "SINGLE_SELECT",
        "animateLoading": true,
        "parentColumnSpace": 17.265625,
        "dynamicTriggerPathList": [],
        "leftColumn": 39,
        "dynamicBindingPathList": [
          {
            "key": "defaultOptionValue"
          }
        ],
        "options": "[\n  {\n    \"label\": \"#1\",\n    \"value\": \"#1\"\n  },\n  {\n    \"label\": \"#2\",\n    \"value\": \"#2\"\n  }\n]",
        "placeholderText": "Select option",
        "isDisabled": false,
        "key": "vzrxeimovl",
        "isRequired": true,
        "rightColumn": 59,
        "widgetId": "ddz5gr36zl",
        "isVisible": true,
        "version": 1,
        "parentId": "0",
        "renderMode": "CANVAS",
        "isLoading": false
      },
      {
        "widgetName": "Text1",
        "displayName": "Text",
        "iconSVG": "/static/media/icon.97c59b52.svg",
        "topRow": 112,
        "bottomRow": 116,
        "parentRowSpace": 10,
        "type": "TEXT_WIDGET",
        "hideCard": false,
        "animateLoading": true,
        "parentColumnSpace": 17.265625,
        "dynamicTriggerPathList": [],
        "leftColumn": 5,
        "dynamicBindingPathList": [
          {
            "key": "text"
          }
        ],
        "text": "{{Select1.selectedOptionValue}}",
        "key": "5z14mymmyz",
        "rightColumn": 21,
        "textAlign": "LEFT",
        "widgetId": "tvw5xfds57",
        "isVisible": true,
        "fontStyle": "BOLD",
        "textColor": "#231F20",
        "version": 1,
        "parentId": "0",
        "renderMode": "CANVAS",
        "isLoading": false,
        "fontSize": "PARAGRAPH"
      }
    ]
  }
}