interface CellValue { value: string; rawValue?: number; } interface TableHeader { key: string; label: string; isSortable?: boolean; sort?: "none" | "ascending" | "descending"; cellProps?: { className?: string; }; } interface TableRow { [key: string]: string | number | CellValue | Array; } export const headers: TableHeader[] = [ { key: "col1", label: "No.", }, { key: "col2", label: "Lorem", }, { key: "col3", label: "Ipsum", }, { key: "col4", label: "Dolor", cellProps: { className: "align-right", }, }, ]; export const rows: TableRow[] = [ { col1: { value: "1" }, col2: "Et fugiat", col3: "Voluptate dolore", col4: "579", }, { col1: "2", col2: "Quis deserunt", col3: "Aliqua sint laboris ut", col4: "814", }, { col1: "3", col2: "Voluptate dolore", col3: "Aliqua sint laboris ut", col4: "436", }, ]; const dateHeader: TableHeader = { key: "date", label: "Date", isSortable: true, sort: "none", }; const sortableHeaders = [...headers]; export const unsortedHeaders: TableHeader[] = [dateHeader, ...sortableHeaders]; export const ascendingHeaders: TableHeader[] = [ { ...dateHeader, sort: "ascending" }, ...sortableHeaders, ]; export const descendingHeaders: TableHeader[] = [ { ...dateHeader, sort: "descending" }, ...sortableHeaders, ]; export const sortableRows = rows.map((row) => { const date = new Date( Date.UTC(2017, 12, Math.floor(Math.random() * 31), 0, 0, 0), ); const formattedDate: CellValue = { value: date.toLocaleDateString("en", { weekday: "long", year: "numeric", month: "long", day: "numeric", }), rawValue: date.getTime(), }; return { ...row, date: formattedDate, }; }); export const ascendingRowsByDate = [...sortableRows].sort( (a, b) => (a.date as CellValue).rawValue! - (b.date as CellValue).rawValue!, ); export const descendingRowsByDate = [...sortableRows].sort( (a, b) => (b.date as CellValue).rawValue! - (a.date as CellValue).rawValue!, ); export const expandableTableRows: TableRow[] = [ ...rows.map((r, i) => ({ ...r, col1: "" + (1 + i) })), ].map((row, index) => ({ ...row, expand: new Array(index + 1).fill({ col1: "", col2: "test", col3: "", col4: "436", }), })); expandableTableRows[2] = { col1: "3", col2: "Voluptate dolore", col3: "Aliqua sint laboris ut", col4: "436", }; export const footer: TableRow[] = [ { col1: "", col2: "", col3: "lorem ipsum", col4: "3525", }, ]; export const scrollableHeaders: TableHeader[] = [ ...headers, { key: "col5", label: "Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Sed posuere consectetur est at lobortis. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.", }, ]; export const scrollableRows: TableRow[] = [ ...rows.map((row) => { return { ...row, col5: "Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.", }; }), ]; export const shrinkHeaders: TableHeader[] = [ { key: "col1", label: "Deafult column", }, { key: "col2", label: "Shrink", cellProps: { className: "table__cell--shrink" }, }, ]; export const shrinkRows: TableRow[] = [ { col1: "Et fugiat", col2: "1", }, { col1: "Quis deserunt", col2: "2", }, { col1: "Voluptate dolore", col2: "3", }, ]; export const fillHeaders: TableHeader[] = [ { key: "col1", label: "Deafult column", }, { key: "col2", label: "Fill all available space", cellProps: { className: "table__cell--fill" }, }, ]; export const fillRows: TableRow[] = [ { col1: "Et fugiat", col2: "1", }, { col1: "Quis deserunt", col2: "2", }, { col1: "Voluptate dolore", col2: "3", }, ]; export const responsiveHeaders: TableHeader[] = [ { key: "account", label: "Účel spracovania", }, { key: "legal", label: "Právny základ a doba spracovania", }, ]; export const responsiveRows: TableRow[] = [ { account: "Mesačný poplatok (bez Digitálnej odmeny)", legal: "Právny základ - Súhlas (čl. 6 ods. 1 písm. a) GDPR) a zmluva (čl. 6 ods. 1 písm. b) GDPR) a oprávnený záujem (čl. 6 ods. 1 písm. f) GDPR). Všeobecná doba uchovávania – Počas trvania zmluvného vzťahu.", }, { account: "Online predaj tovarov a poskytovanie doplnkových a asistenčných služieb", legal: "Právny základ - Zmluva (čl. 6 ods. 1 písm. b) GDPR) a oprávnený záujem (čl. 6 ods. 1 písm. f) GDPR). Všeobecná doba uchovávania – Počas trvania zmluvného vzťahu a uplynutia záručnej doby na predaný tovar.", }, ];