import _extends from "@babel/runtime/helpers/extends";
// Copyright 1999-2020. Plesk International GmbH. All rights reserved.
import React, { useState } from 'react';
import List from './List';
import ListActions from './ListActions';
import ListAction from './ListAction';
export const Basic = args => /*#__PURE__*/React.createElement(List, args);
Basic.args = {
  columns: [{
    key: 'col1',
    title: 'Countr 2',
    type: 'title'
  }, {
    key: 'col2',
    title: 'Population',
    align: 'right'
  }],
  data: [{
    key: '1',
    col1: 'China',
    col2: '1 433 783 686'
  }, {
    key: '2',
    col1: 'India',
    col2: '1 366 417 754'
  }, {
    key: '3',
    col1: 'United States',
    col2: '329 064 917'
  }, {
    key: '4',
    col1: ' Indonesia',
    col2: '270 625 568'
  }, {
    key: '5',
    col1: 'Pakistan',
    col2: '216 565 318'
  }]
};
export const Vertical = Basic.bind(null);
Vertical.args = { ...Basic.args,
  vertical: 480
};
export const Nested = Basic.bind(null);
Nested.args = { ...Basic.args,
  data: [{
    key: '1',
    col1: 'China',
    col2: '1 433 783 686',
    data: [{
      key: '2',
      col1: 'Guangdong',
      col2: '113 460 126'
    }, {
      key: '3',
      col1: 'Shandong',
      col2: '100 471 831'
    }]
  }, {
    key: '4',
    col1: 'India',
    col2: '1 366 417 754',
    data: [{
      key: '5',
      col1: 'Uttar Pradesh',
      col2: '237 882 725'
    }, {
      key: '6',
      col1: 'Bihar',
      col2: '124 799 926'
    }]
  }]
};
export const NestedFullFeatured = Nested.bind(null);
NestedFullFeatured.args = { ...Nested.args,
  onSelectionChange: () => {},
  renderRowBody: () => null
};
export const ExpandedList = Nested.bind(null);
ExpandedList.args = { ...Nested.args,
  onSelectionChange: () => {},
  renderRowBody: () => 'row body',
  expandedRows: ['1', '2', '4', '6']
};
export const Reorderable = args => {
  const {
    data: initialData,
    ...props
  } = args;
  const [data, setData] = useState(initialData);

  const handleReorderEnd = ({
    oldIndex,
    newIndex
  }) => {
    const nextData = [...data];
    nextData.splice(newIndex, 0, nextData.splice(oldIndex, 1)[0]);
    setData(nextData);
  };

  return /*#__PURE__*/React.createElement(Basic, _extends({
    data: data,
    reorderable: true,
    onReorderEnd: handleReorderEnd
  }, props));
};
Reorderable.args = { ...Basic.args
};
export const ReorderableFullFeatured = Reorderable.bind(null);
ReorderableFullFeatured.args = { ...Reorderable.args,
  columns: [...Reorderable.args.columns, {
    key: 'actions',
    type: 'actions',
    // eslint-disable-next-line react/display-name
    render: () => /*#__PURE__*/React.createElement(ListActions, null, /*#__PURE__*/React.createElement(ListAction, {
      icon: "clip",
      primary: true
    }), /*#__PURE__*/React.createElement(ListAction, {
      icon: "clock",
      primary: true
    }), /*#__PURE__*/React.createElement(ListAction, {
      icon: "clone",
      primary: true
    }))
  }],
  onSelectionChange: () => {},
  renderRowBody: () => null
};