"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.StackableTable = exports.ScrollableTable = exports.MultiHeaderTable = void 0;

var _react = _interopRequireDefault(require("react"));

var _Table = _interopRequireDefault(require("./Table"));

var _TableCaption = _interopRequireDefault(require("./TableCaption"));

var _TableHead = _interopRequireDefault(require("./TableHead"));

var _TableRow = _interopRequireDefault(require("./TableRow"));

var _TableCell = _interopRequireDefault(require("./TableCell"));

var _TableBody = _interopRequireDefault(require("./TableBody"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _default = {
  title: 'Components/Table',
  component: _Table.default,
  argTypes: {
    dense: {
      table: {
        disable: true
      }
    }
  }
};
exports.default = _default;
var tableTemplateData = {
  headings: [{
    displayName: 'Document title',
    propName: 'documentTitle'
  }, {
    displayName: 'Description',
    propName: 'description'
  }, {
    displayName: 'Links',
    propName: 'links'
  }, {
    displayName: 'Year',
    propName: 'year'
  }],
  data: [{
    documentTitle: 'Declaration of Independence',
    description: 'Statement adopted by the Continental Congress declaring independence from the British Empire.',
    links: /*#__PURE__*/_react.default.createElement("a", {
      href: "# "
    }, ' ', "https://billofrightsinstitute.org/founding-documents/declaration-of-independence/"),
    year: '1776'
  }, {
    documentTitle: 'Bill of Rights',
    description: 'The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms.',
    links: /*#__PURE__*/_react.default.createElement("a", {
      href: "# "
    }, "https://billofrightsinstitute.org/founding-documents/bill-of-rights/"),
    year: '1791'
  }]
};
var multiHeaderTableData = {
  headings: [{
    displayName: 'Name',
    propName: 'name',
    bodyComponent: 'th'
  }, {
    displayName: 'Street',
    propName: 'street'
  }, {
    displayName: 'ZIP code',
    propName: 'zipcode'
  }, {
    displayName: 'Employer',
    propName: 'employer'
  }, {
    displayName: 'Industry',
    propName: 'industry'
  }],
  data: [{
    name: 'John Doe',
    street: '123 Braavos Ave.',
    zipcode: '20005',
    employer: 'Acme Co.',
    industry: 'Healthcare'
  }, {
    name: 'John Doe',
    street: "456 King's Landing",
    zipcode: '20005',
    employer: 'Acme Co.',
    industry: 'Healthcare'
  }]
};

var Template = function Template(args) {
  return /*#__PURE__*/_react.default.createElement(_Table.default, args, /*#__PURE__*/_react.default.createElement(_TableCaption.default, null, "Table"), /*#__PURE__*/_react.default.createElement(_TableHead.default, null, /*#__PURE__*/_react.default.createElement(_TableRow.default, null, tableTemplateData.headings.map(function (_ref) {
    var displayName = _ref.displayName;
    return /*#__PURE__*/_react.default.createElement(_TableCell.default, {
      key: displayName
    }, displayName);
  }))), /*#__PURE__*/_react.default.createElement(_TableBody.default, null, tableTemplateData.data.map(function (dataItem, index) {
    return /*#__PURE__*/_react.default.createElement(_TableRow.default, {
      key: index
    }, tableTemplateData.headings.map(function (heading) {
      return /*#__PURE__*/_react.default.createElement(_TableCell.default, {
        key: "".concat(heading.displayName, "-").concat(dataItem[heading.propName]),
        stackedTitle: heading.displayName
      }, dataItem[heading.propName]);
    }));
  })));
};

var ScrollableTable = Template.bind({});
exports.ScrollableTable = ScrollableTable;
ScrollableTable.args = {
  scrollable: true
};
var StackableTable = Template.bind({});
exports.StackableTable = StackableTable;
StackableTable.args = {
  stackable: true,
  stackableBreakpoint: 'md'
};

var MultiHeaderTable = function MultiHeaderTable() {
  return /*#__PURE__*/_react.default.createElement(_Table.default, null, /*#__PURE__*/_react.default.createElement(_TableCaption.default, null, "Household members"), /*#__PURE__*/_react.default.createElement("col", null), /*#__PURE__*/_react.default.createElement("colgroup", {
    span: "2"
  }), /*#__PURE__*/_react.default.createElement("colgroup", {
    span: "2"
  }), /*#__PURE__*/_react.default.createElement(_TableHead.default, null, /*#__PURE__*/_react.default.createElement(_TableRow.default, null, /*#__PURE__*/_react.default.createElement(_TableCell.default, {
    component: "td",
    rowSpan: "1"
  }), /*#__PURE__*/_react.default.createElement(_TableCell.default, {
    component: "th",
    colSpan: "2",
    scope: "colgroup"
  }, "Address"), /*#__PURE__*/_react.default.createElement(_TableCell.default, {
    colSpan: "2",
    scope: "colgroup"
  }, "Employment")), /*#__PURE__*/_react.default.createElement(_TableRow.default, null, multiHeaderTableData.headings.map(function (_ref2) {
    var displayName = _ref2.displayName;
    return /*#__PURE__*/_react.default.createElement(_TableCell.default, {
      component: "th",
      scope: "col",
      key: displayName
    }, displayName);
  }))), /*#__PURE__*/_react.default.createElement(_TableBody.default, null, multiHeaderTableData.data.map(function (dataItem, index) {
    return /*#__PURE__*/_react.default.createElement(_TableRow.default, {
      key: index
    }, multiHeaderTableData.headings.map(function (heading) {
      return /*#__PURE__*/_react.default.createElement(_TableCell.default, {
        key: "".concat(heading.displayName, "-").concat(dataItem[heading.displayName]),
        component: heading.bodyComponent || 'td'
      }, dataItem[heading.propName]);
    }));
  })));
};

exports.MultiHeaderTable = MultiHeaderTable;