1import React from 'react';
2import data from '../constants/sampleDesserts';
3import DataTable from '../../src/index';
4
5const columns = [
6	{
7		name: 'Name',
8		selector: row => row.name,
9		sortable: true,
10		grow: 2,
11	},
12	{
13		name: 'Type',
14		selector: row => row.type,
15		sortable: true,
16		hide: 'sm',
17	},
18	{
19		name: 'Calories (g)',
20		selector: row => row.calories,
21		sortable: true,
22		right: true,
23	},
24	{
25		name: 'Fat (g)',
26		selector: row => row.fat,
27		sortable: true,
28		right: true,
29		hide: 'md',
30	},
31	{
32		name: 'Carbs (g)',
33		selector: row => row.carbs,
34		sortable: true,
35		right: true,
36		hide: 'md',
37	},
38	{
39		name: 'Protein (g)',
40		selector: row => row.protein,
41		sortable: true,
42		right: true,
43		hide: 'md',
44	},
45	{
46		name: 'Sodium (mg)',
47		selector: row => row.sodium,
48		sortable: true,
49		right: true,
50		hide: 'md',
51	},
52	{
53		name: 'Calcium (%)',
54		selector: row => row.calcium,
55		sortable: true,
56		right: true,
57		hide: 'md',
58	},
59	{
60		name: 'Iron (%)',
61		selector: row => row.iron,
62		sortable: true,
63		right: true,
64		hide: 'md',
65	},
66];
67export const HideOnResize = () => {
68	
69	const handleSort = (column, sortDirection) => console.log(column.selector, sortDirection);
70
71	return <DataTable title="Desserts" columns={columns} data={data} onSort={handleSort} />;
72};
73
74export default {
75	title: 'Columns/Hide On Resize',
76};