import React from 'react';
import { addStoryInGroup, COMPOSITIONS } from '../../../.storybook/utils';
import { DataGrid, IconMenu, MenuItem, Link, Button, ButtonGroup } from '../../index';
import { rows1 } from '../../static/data/datagrid';

var handleRowSelectionChange = function handleRowSelectionChange(selectedRows) {
  console.log("onSelectionChange - selected row indexes: ".concat(selectedRows));
};

export default {
  component: DataGrid,
  title: addStoryInGroup(COMPOSITIONS, 'DataGrid'),
  parameters: {
    design: {
      type: 'figma',
      url: 'https://www.figma.com/file/LHH25GN90ljQaBEUNMsdJn/Desktop-components?node-id=503%3A4737'
    }
  }
};
export var DefaultStory = function DefaultStory(args) {
  return /*#__PURE__*/React.createElement(DataGrid, args, /*#__PURE__*/React.createElement(DataGrid.HeaderRowOverlay, {
    numSelectedRowsLabel: function numSelectedRowsLabel(numSelectedRows) {
      return numSelectedRows === 1 ? 'sélectionné' : 'sélectionnés';
    }
  }, /*#__PURE__*/React.createElement(Button, {
    size: "small",
    level: "primary",
    label: "Marks as paid"
  }), /*#__PURE__*/React.createElement(ButtonGroup, {
    segmented: true,
    marginHorizontal: 3
  }, /*#__PURE__*/React.createElement(Button, {
    size: "small",
    label: "Book"
  }), /*#__PURE__*/React.createElement(Button, {
    size: "small",
    label: "Merge"
  })), /*#__PURE__*/React.createElement(Button, {
    size: "small",
    level: "destructive",
    label: "Delete"
  })), /*#__PURE__*/React.createElement(DataGrid.HeaderRow, null, /*#__PURE__*/React.createElement(DataGrid.HeaderCell, {
    onClick: function onClick() {
      return console.log('onClick: column sort');
    },
    sorted: "asc"
  }, "Invoice"), /*#__PURE__*/React.createElement(DataGrid.HeaderCell, {
    onClick: function onClick() {
      return console.log('onClick: column sort');
    },
    align: "right"
  }, "Amount"), /*#__PURE__*/React.createElement(DataGrid.HeaderCell, {
    flex: 5,
    onClick: function onClick() {
      return console.log('onClick: column sort');
    }
  }, "Customer"), /*#__PURE__*/React.createElement(DataGrid.HeaderCell, {
    onClick: function onClick() {
      return console.log('onClick: column sort');
    }
  }, "Due date"), /*#__PURE__*/React.createElement(DataGrid.HeaderCell, {
    flex: "min-width"
  })), rows1.map(function (row, index) {
    return /*#__PURE__*/React.createElement(DataGrid.BodyRow, {
      key: index,
      onClick: function onClick(event) {
        return console.log('onClick:', row.column5, event);
      }
    }, /*#__PURE__*/React.createElement(DataGrid.Cell, null, /*#__PURE__*/React.createElement(Link, {
      href: "#",
      onClick: function onClick(event) {
        return event.stopPropagation();
      },
      inherit: false
    }, row.column5), ' '), /*#__PURE__*/React.createElement(DataGrid.Cell, {
      align: "right",
      strong: true
    }, ' ', "\u20AC ".concat(row.column3)), /*#__PURE__*/React.createElement(DataGrid.Cell, {
      flex: 5
    }, row.column2), /*#__PURE__*/React.createElement(DataGrid.Cell, {
      soft: true
    }, row.column4), /*#__PURE__*/React.createElement(DataGrid.Cell, {
      align: "right",
      flex: "min-width",
      preventOverflow: false
    }, /*#__PURE__*/React.createElement(IconMenu, {
      position: "top-right",
      onClick: function onClick(event) {
        event.stopPropagation();
      }
    }, /*#__PURE__*/React.createElement(MenuItem, {
      label: "Duplicate row",
      onClick: function onClick(event) {
        console.log('onClick: duplicate row');
        event.stopPropagation();
      }
    }), /*#__PURE__*/React.createElement(MenuItem, {
      label: "Inactive row",
      onClick: function onClick(event) {
        console.log('onClick: inactivate row');
        event.stopPropagation();
      }
    }), /*#__PURE__*/React.createElement(MenuItem, {
      label: "Remove row",
      onClick: function onClick(event) {
        console.log('onClick: remove row');
        event.stopPropagation();
      }
    }))));
  }), /*#__PURE__*/React.createElement(DataGrid.FooterRow, {
    backgroundColor: "neutral"
  }, /*#__PURE__*/React.createElement(DataGrid.Cell, {
    align: "right"
  }, "".concat(rows1.length, " rows in total"))));
};
DefaultStory.args = {
  comparableId: 1,
  onSelectionChange: handleRowSelectionChange,
  selectable: true
};