"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
exports.__esModule = true;
exports.horizontalScrollData = exports.horizontalScrollColumns = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _vanilla = require("@wix/wix-ui-test-utils/vanilla");
var _2 = _interopRequireDefault(require(".."));
var _TablePrivate = require("../Table.private.driver");
var _Card = _interopRequireDefault(require("../../Card"));
var _Checkbox = _interopRequireDefault(require("../../Checkbox"));
var _ToggleSwitch = _interopRequireDefault(require("../../ToggleSwitch"));
var _DragHandle = require("../../DragHandle/DragHandle");
var _range = _interopRequireDefault(require("../../utils/operators/range"));
var _storySettings = require("../docs/storySettings");
var _testExamples = require("./testExamples");
var _storybookSnapper = require("storybook-snapper");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Table/test/Table.visual.jsx",
  _this = void 0;
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var dataHook = _storySettings.storySettings.dataHook;
var clickFirstRow = function clickFirstRow() {
  var node = document.body;
  var selector = '[data-table-row="dataTableRow"]';
  var elements = node.querySelectorAll(selector);
  elements[0].click();
};
var data = [{
  name: 'Apple Towels',
  SKU: '111222',
  price: '$2.00',
  inventory: 'In stock'
}, {
  name: 'Cyan Towels',
  SKU: '222333',
  price: '$2.00',
  inventory: 'In stock'
}, {
  name: 'Marble Slippers',
  SKU: '333444',
  price: '$14.00',
  inventory: 'In stock'
}, {
  name: 'Red Slippers',
  SKU: '444555',
  price: '$14.00',
  inventory: 'Out of stock'
}];
var columns = [{
  title: 'Name',
  render: function render(row) {
    return /*#__PURE__*/_react["default"].createElement("span", {
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 52,
        columnNumber: 20
      }
    }, row.name);
  },
  width: '30%',
  infoTooltipProps: {
    content: 'This is the name column'
  }
}, {
  title: 'SKU',
  render: function render(row) {
    return /*#__PURE__*/_react["default"].createElement("span", {
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 58,
        columnNumber: 20
      }
    }, row.SKU);
  },
  width: '20%'
}, {
  title: 'Price',
  render: function render(row) {
    return /*#__PURE__*/_react["default"].createElement("span", {
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 63,
        columnNumber: 20
      }
    }, row.price);
  },
  width: '20%'
}, {
  title: 'Inventory',
  render: function render(row) {
    return /*#__PURE__*/_react["default"].createElement("span", {
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 68,
        columnNumber: 20
      }
    }, row.inventory);
  },
  width: '20%'
}];
var dragAndDrop = {
  DroppableTableContext: function DroppableTableContext(_ref) {
    var children = _ref.children;
    return children;
  },
  DraggableTableRow: function DraggableTableRow(_ref2) {
    var children = _ref2.children;
    return children;
  },
  createDragHandleColumn: function createDragHandleColumn() {
    return {
      key: 'drag-handle',
      dataHook: 'drag-handle',
      title: '',
      width: '14px',
      render: function render() {
        return /*#__PURE__*/_react["default"].createElement(_DragHandle.DragHandle, {
          dragHandleSize: "small",
          "aria-label": "Drag to reorder",
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 82,
            columnNumber: 7
          }
        });
      }
    };
  }
};

// Mirrors the Cairo handoff (RowLevelIndicator) — 8 data columns × 150px,
// rows 1 & 3 carry errors.
var handoffData = [{
  name: 'Wireless Headphones',
  price: 249.99,
  category: 'Electronics',
  sku: '',
  stock: 0,
  supplier: '',
  location: '',
  notes: ''
}, {
  name: 'Cotton T-Shirt',
  price: 29.99,
  category: 'Clothing',
  sku: '',
  stock: 0,
  supplier: '',
  location: '',
  notes: ''
}, {
  name: 'Science Fiction Novel',
  price: -5,
  category: 'Books',
  sku: '',
  stock: 0,
  supplier: '',
  location: '',
  notes: ''
}, {
  name: 'Bluetooth Speaker',
  price: 89.99,
  category: 'Electronics',
  sku: '',
  stock: 0,
  supplier: '',
  location: '',
  notes: ''
}];
var handoffColumns = [{
  title: 'Product Name',
  render: function render(row) {
    return row.name;
  },
  width: 150
}, {
  title: 'Price ($)',
  render: function render(row) {
    return row.price;
  },
  width: 150,
  align: 'end'
}, {
  title: 'Category',
  render: function render(row) {
    return row.category;
  },
  width: 150
}, {
  title: 'SKU',
  render: function render(row) {
    return row.sku;
  },
  width: 150
}, {
  title: 'Stock',
  render: function render(row) {
    return row.stock;
  },
  width: 150,
  align: 'end'
}, {
  title: 'Supplier',
  render: function render(row) {
    return row.supplier;
  },
  width: 150
}, {
  title: 'Location',
  render: function render(row) {
    return row.location;
  },
  width: 150
}, {
  title: 'Notes',
  render: function render(row) {
    return row.notes;
  },
  width: 150
}];
var tablePrivateTestkitFactory = (0, _vanilla.testkitFactoryCreator)(_TablePrivate.tablePrivateDriverFactory);
var createDriver = function createDriver() {
  return tablePrivateTestkitFactory({
    wrapper: document.body,
    dataHook: dataHook
  });
};
var getHorizontalScrollColumnContent = function getHorizontalScrollColumnContent(columnIndex, rowIndex) {
  return columnIndex === 1 && rowIndex === 2 ? 'A very long column text that should span multiple lines and grow the row height.' : "Value ".concat(columnIndex + 1, "-").concat(rowIndex + 1);
};
var horizontalScrollColumnCount = 20;
var horizontalScrollRowCount = 4;
var horizontalScrollData = exports.horizontalScrollData = (0, _range["default"])(0, horizontalScrollRowCount).map(function (rowIndex) {
  return (0, _range["default"])(0, horizontalScrollColumnCount).reduce(function (rows, columnIndex) {
    return _objectSpread(_objectSpread({}, rows), {}, (0, _defineProperty2["default"])({}, "value".concat(columnIndex + 1), getHorizontalScrollColumnContent(columnIndex, rowIndex)));
  }, {});
});
var horizontalScrollColumns = exports.horizontalScrollColumns = (0, _range["default"])(0, horizontalScrollColumnCount).map(function (columnIndex) {
  return {
    title: "Column ".concat(columnIndex + 1),
    render: function render(row) {
      return row["value".concat(columnIndex + 1)];
    },
    width: 150,
    infoTooltipProps: {
      content: 'Tooltip!'
    }
  };
});
var rowVerticalPaddingValues = ['large', 'medium', 'small', 'tiny', 'xTiny', 'xxTiny'];
var rowVerticalPaddingTests = rowVerticalPaddingValues.map(function (rowVerticalPadding) {
  return {
    it: "Should display the table row with \"".concat(rowVerticalPadding, "\" rowVerticalPadding"),
    props: {
      data: data,
      columns: columns,
      rowVerticalPadding: rowVerticalPadding
    }
  };
});
var rowVerticalPaddingTestsWithExpandableRow = rowVerticalPaddingValues.map(function (rowVerticalPadding) {
  return {
    it: "Should display the table expanded row with \"".concat(rowVerticalPadding, "\" rowVerticalPadding"),
    props: {
      rowDetails: function rowDetails(row) {
        return /*#__PURE__*/_react["default"].createElement("span", {
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 209,
            columnNumber: 11
          }
        }, "This is an expandable space where you see the row details.");
      },
      data: data,
      columns: columns,
      rowVerticalPadding: rowVerticalPadding
    },
    componentDidMount: function componentDidMount(done) {
      clickFirstRow();
      done();
    }
  };
});
var stickyFirstTwoColumns = {
  it: 'Should show table with two sticky columns',
  props: {
    horizontalScroll: true,
    showSelection: true,
    stickyColumns: 2,
    data: horizontalScrollData,
    columns: horizontalScrollColumns
  },
  componentDidMount: function componentDidMount(done) {
    createDriver().scrollHorizontallyTo(200);
    done();
  }
};
var tests = [{
  describe: 'Basic',
  its: [{
    it: 'Should display the table with data',
    props: {
      data: data,
      columns: columns
    }
  }, {
    it: 'Should display the table with "standard" skin',
    props: {
      data: data,
      columns: columns
    }
  }, {
    it: 'Should display the table with "neutral" skin',
    props: {
      data: data,
      columns: columns,
      skin: 'neutral'
    }
  }, {
    it: 'Should display the table with aligned columns',
    props: {
      data: [{
        name: 'Apple Towels',
        visible: true,
        onSale: false,
        price: '$22.99'
      }, {
        name: 'Cyan Towls',
        visible: false,
        onSale: false,
        price: '$145.99'
      }, {
        name: 'Marble Slippers',
        visible: false,
        onSale: false,
        price: '$125,265.00'
      }, {
        name: 'Red Slippers',
        visible: false,
        onSale: false,
        price: '$1,265.69'
      }],
      columns: [{
        title: 'Name',
        render: function render(row) {
          return /*#__PURE__*/_react["default"].createElement("span", {
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 298,
              columnNumber: 30
            }
          }, row.name);
        },
        width: '30%'
      }, {
        title: 'Visibility',
        render: function render(row) {
          return /*#__PURE__*/_react["default"].createElement("span", {
            style: {
              display: 'inline-flex',
              alignItems: 'center'
            },
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 304,
              columnNumber: 17
            }
          }, /*#__PURE__*/_react["default"].createElement(_ToggleSwitch["default"], {
            checked: row.visible,
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 305,
              columnNumber: 19
            }
          }), /*#__PURE__*/_react["default"].createElement("span", {
            style: {
              marginLeft: 12
            },
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 306,
              columnNumber: 19
            }
          }, row.visible ? 'Visible' : 'Hidden'));
        },
        width: '20%',
        align: 'start'
      }, {
        title: 'On Sale',
        render: function render() {
          return /*#__PURE__*/_react["default"].createElement(_Checkbox["default"], {
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 316,
              columnNumber: 29
            }
          });
        },
        width: '20%',
        align: 'center',
        infoTooltipProps: {
          content: 'I am a Tooltip!'
        }
      }, {
        title: 'Price',
        render: function render(row) {
          return /*#__PURE__*/_react["default"].createElement("span", {
            __self: _this,
            __source: {
              fileName: _jsxFileName,
              lineNumber: 325,
              columnNumber: 30
            }
          }, row.price);
        },
        width: '20%',
        align: 'end'
      }]
    }
  }, {
    it: 'Should display the table with selection',
    props: {
      data: data,
      columns: columns,
      showSelection: true
    }
  }, {
    it: 'Should display the table with selection with unselectable row',
    props: {
      data: [].concat(data, [{
        name: 'Unselectable Product',
        SKU: '123123',
        price: '$6.00',
        inventory: 'In stock',
        unselectable: true
      }]),
      columns: columns,
      showSelection: true
    }
  }, {
    it: 'Should display the table with selection but without Select All column title',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      hideBulkSelectionCheckbox: true
    }
  }, {
    it: 'Should display the table with disabled selection',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      selectionDisabled: true
    }
  }, {
    it: 'Should display the table with disabled selection but without Select All column title',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      hideBulkSelectionCheckbox: true,
      selectionDisabled: true
    }
  }, {
    it: 'Should display the table without column titles',
    props: {
      data: data,
      columns: columns,
      children: /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        titleBarVisible: false,
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 390,
          columnNumber: 21
        }
      })
    }
  }, {
    it: 'Should display the table with hidden column titles',
    props: {
      data: data,
      columns: columns,
      children: /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        titleBarDisplay: false,
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 398,
          columnNumber: 21
        }
      })
    }
  }, {
    it: 'with active row',
    props: {
      data: data,
      columns: columns,
      isRowActive: function isRowActive(_, rowNum) {
        return rowNum === 1;
      }
    }
  }].concat((0, _toConsumableArray2["default"])(rowVerticalPaddingTests), (0, _toConsumableArray2["default"])(rowVerticalPaddingTestsWithExpandableRow), [{
    it: "Should display the table with expanded row details without padding",
    props: {
      rowDetails: function rowDetails(row) {
        return /*#__PURE__*/_react["default"].createElement("span", {
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 416,
            columnNumber: 15
          }
        }, "This is an expandable space where you see the row details.");
      },
      data: data,
      columns: columns,
      removeRowDetailsPadding: true,
      rowVerticalPadding: 'large'
    },
    componentDidMount: function componentDidMount(done) {
      clickFirstRow();
      done();
    }
  }])
}, {
  describe: 'Toolbar',
  its: [{
    it: 'Should display the table with toolbar',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      children: [/*#__PURE__*/_react["default"].createElement(_2["default"].ToolbarContainer, {
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 443,
          columnNumber: 13
        }
      }, function () {
        return /*#__PURE__*/_react["default"].createElement(_testExamples.ToolbarExample, {
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 444,
            columnNumber: 22
          }
        });
      }), /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 446,
          columnNumber: 13
        }
      })]
    }
  }, {
    it: 'Should display the table with toolbar with bulk selection checkbox',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      hideBulkSelectionCheckbox: true,
      children: [/*#__PURE__*/_react["default"].createElement(_2["default"].ToolbarContainer, {
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 458,
          columnNumber: 13
        }
      }, function () {
        return /*#__PURE__*/_react["default"].createElement(_testExamples.ToolbarWithBulSelectionCheckboxExample, {
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 459,
            columnNumber: 22
          }
        });
      }), /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 461,
          columnNumber: 13
        }
      })]
    }
  }, {
    it: 'Should display the table with toolbar and without column titles',
    props: {
      data: data,
      columns: columns,
      children: [/*#__PURE__*/_react["default"].createElement(_testExamples.ToolbarExample, {
        key: "toolbar",
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 471,
          columnNumber: 13
        }
      }), /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        key: "content",
        titleBarVisible: false,
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 472,
          columnNumber: 13
        }
      })]
    }
  }]
}, {
  describe: 'EmptyState',
  its: [{
    it: 'Should display the table with EmptyState',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      children: /*#__PURE__*/_react["default"].createElement(_testExamples.EmptyStateExample, {
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 487,
          columnNumber: 21
        }
      })
    }
  }, {
    it: 'Should display the table with toolbar and EmptyState',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      children: [/*#__PURE__*/_react["default"].createElement(_testExamples.ToolbarExample, {
        key: "toolbar",
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 497,
          columnNumber: 13
        }
      }), /*#__PURE__*/_react["default"].createElement(_testExamples.EmptyStateExample, {
        key: "emptystate",
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 498,
          columnNumber: 13
        }
      })]
    }
  }]
}, {
  describe: 'rowStatus',
  its: [{
    it: 'Should render the status indicator when rowStatus returns a value',
    props: {
      data: data,
      columns: columns,
      rowStatus: function rowStatus(_row, rowNum) {
        return rowNum % 2 === 0 ? {
          status: 'error',
          messages: ["SKU: SKU is required (row ".concat(rowNum + 1, ")")]
        } : null;
      }
    }
  }, {
    it: 'Should coexist with showSelection',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      rowStatus: function rowStatus(_row, rowNum) {
        return rowNum === 0 ? {
          status: 'error',
          messages: ['SKU: SKU is required']
        } : null;
      }
    }
  }, {
    it: 'Should coexist with showSelection and showRowNumbers',
    props: {
      data: data,
      columns: columns,
      showSelection: true,
      showRowNumbers: true,
      rowStatus: function rowStatus(_row, rowNum) {
        return rowNum === 0 ? {
          status: 'error',
          messages: ['SKU: SKU is required']
        } : null;
      }
    }
  }, {
    it: 'Should coexist with drag handle',
    props: {
      data: data,
      columns: columns,
      dragAndDrop: dragAndDrop,
      rowStatus: function rowStatus(_row, rowNum) {
        return rowNum === 0 ? {
          status: 'error',
          messages: ['SKU: SKU is required']
        } : null;
      }
    }
  }, {
    it: 'Should show two errors for two cells in the same row',
    props: {
      data: data,
      columns: columns,
      rowStatus: function rowStatus(_row, rowNum) {
        return rowNum === 0 ? {
          status: 'error',
          messages: ['SKU: SKU is required', 'Price ($): Must be greater than 0']
        } : null;
      }
    }
  }, {
    it: 'Should match the Cairo handoff layout',
    props: {
      data: handoffData,
      columns: handoffColumns,
      showSelection: true,
      showRowNumbers: true,
      horizontalScroll: true,
      stickyColumns: 1,
      rowStatus: function rowStatus(_row, rowNum) {
        if (rowNum === 0) {
          return {
            status: 'error',
            messages: ['SKU: SKU is required']
          };
        }
        if (rowNum === 2) {
          return {
            status: 'error',
            messages: ['SKU: SKU is required', 'Price ($): Price must be positive']
          };
        }
        return null;
      }
    }
  }, {
    it: 'Should render both supported statuses (error + warning)',
    props: {
      data: data,
      columns: columns,
      rowStatus: function rowStatus(_row, rowNum) {
        var _variants$rowNum;
        var variants = [{
          status: 'error',
          messages: ['SKU: SKU is required']
        }, {
          status: 'warning',
          messages: ['Inventory: Low stock']
        }];
        return (_variants$rowNum = variants[rowNum]) !== null && _variants$rowNum !== void 0 ? _variants$rowNum : null;
      }
    }
  }, {
    it: 'Should reserve space when rowStatus is provided but returns null for every row',
    props: {
      data: data,
      columns: columns,
      rowStatus: function rowStatus() {
        return null;
      }
    }
  }, {
    it: 'Should NOT reserve space when rowStatus prop is omitted',
    props: {
      data: data,
      columns: columns
    }
  }]
}, {
  describe: 'Sticky and Horizontal Scroll',
  its: [{
    it: 'Should display the table with horizontal scroll',
    props: {
      horizontalScroll: true,
      data: horizontalScrollData,
      columns: horizontalScrollColumns
    }
  }, {
    it: 'Should show left shadow on scroll',
    props: {
      horizontalScroll: true,
      data: horizontalScrollData,
      columns: horizontalScrollColumns
    },
    componentDidMount: function componentDidMount(done) {
      createDriver().scrollHorizontallyTo(250);
      done();
    }
  }, {
    it: 'Should sticky first bulk selection column',
    props: {
      horizontalScroll: true,
      showSelection: true,
      stickyColumns: 1,
      data: horizontalScrollData,
      columns: horizontalScrollColumns
    },
    componentDidMount: function componentDidMount(done) {
      createDriver().scrollHorizontallyTo(200);
      done();
    }
  }, stickyFirstTwoColumns, {
    it: 'Should support selection, highlight and active with sticky columns',
    props: {
      horizontalScroll: true,
      showSelection: true,
      stickyColumns: 2,
      data: horizontalScrollData,
      columns: horizontalScrollColumns,
      isRowHighlight: function isRowHighlight(_, rowNum) {
        return rowNum % 2 === 0;
      },
      isRowActive: function isRowActive(_, rowNum) {
        return rowNum === 3;
      }
    },
    componentDidMount: function componentDidMount(done) {
      var driver = createDriver();
      driver.scrollHorizontallyTo(200);
      driver.clickRowCheckbox(1);
      done();
    }
  }, {
    it: 'Should sticky columns when table content and titlebar are rendered separately',
    props: {
      horizontalScroll: true,
      stickyColumns: 2,
      data: horizontalScrollData,
      columns: horizontalScrollColumns,
      children: [/*#__PURE__*/_react["default"].createElement(_2["default"].Titlebar, {
        key: "titlebar",
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 699,
          columnNumber: 13
        }
      }), /*#__PURE__*/_react["default"].createElement(_2["default"].Content, {
        key: "content",
        titleBarVisible: false,
        __self: void 0,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 700,
          columnNumber: 13
        }
      })]
    },
    componentDidMount: function componentDidMount(done) {
      createDriver().scrollHorizontallyTo(200);
      done();
    }
  }]
}];
var TableWrapper = function TableWrapper(_ref3) {
  var props = _ref3.props,
    componentDidMount = _ref3.componentDidMount,
    done = _ref3.done;
  (0, _react.useEffect)(function () {
    componentDidMount && componentDidMount(done);
  }, [componentDidMount, done]);
  return /*#__PURE__*/_react["default"].createElement("div", {
    style: {
      backgroundColor: '#DFE5EB',
      padding: '20px'
    },
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 718,
      columnNumber: 5
    }
  }, /*#__PURE__*/_react["default"].createElement(_Card["default"], {
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 719,
      columnNumber: 7
    }
  }, /*#__PURE__*/_react["default"].createElement(_2["default"], (0, _extends2["default"])({
    dataHook: dataHook
  }, props, {
    componentDidMount: componentDidMount,
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 720,
      columnNumber: 9
    }
  }))));
};
tests.forEach(function (_ref4) {
  var describe = _ref4.describe,
    its = _ref4.its;
  its.forEach(function (_ref5) {
    var it = _ref5.it,
      props = _ref5.props,
      componentDidMount = _ref5.componentDidMount;
    (0, _storybookSnapper.visualize)("Table/".concat(describe), function () {
      (0, _storybookSnapper.snap)(it, function (done) {
        return /*#__PURE__*/_react["default"].createElement(TableWrapper, {
          props: props,
          componentDidMount: componentDidMount,
          done: done,
          __self: _this,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 734,
            columnNumber: 9
          }
        });
      });
    });
  });
});