@dfds-ui/experiences 0.9.16-alpha.f2dcf885 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/dynamic-table/DynamicTable.d.ts +29 -4
- package/cjs/dynamic-table/DynamicTable.js +173 -54
- package/cjs/dynamic-table/DynamicTable.styles.d.ts +5 -12
- package/cjs/dynamic-table/DynamicTable.styles.js +29 -25
- package/dynamic-table/DynamicTable.d.ts +29 -4
- package/dynamic-table/DynamicTable.js +188 -54
- package/dynamic-table/DynamicTable.styles.d.ts +5 -12
- package/dynamic-table/DynamicTable.styles.js +17 -16
- package/package.json +9 -9
- package/cjs/dynamic-table/Body/TableBody.d.ts +0 -4
- package/cjs/dynamic-table/Body/TableBody.js +0 -57
- package/cjs/dynamic-table/Body/TableBody.types.d.ts +0 -10
- package/cjs/dynamic-table/Body/TableBody.types.js +0 -5
- package/cjs/dynamic-table/Body/TableCell.d.ts +0 -4
- package/cjs/dynamic-table/Body/TableCell.js +0 -30
- package/cjs/dynamic-table/Body/TableCell.styles.d.ts +0 -16
- package/cjs/dynamic-table/Body/TableCell.styles.js +0 -45
- package/cjs/dynamic-table/Body/TableCell.types.d.ts +0 -7
- package/cjs/dynamic-table/Body/TableCell.types.js +0 -5
- package/cjs/dynamic-table/Body/TableRow.d.ts +0 -4
- package/cjs/dynamic-table/Body/TableRow.js +0 -51
- package/cjs/dynamic-table/Body/TableRow.styles.d.ts +0 -10
- package/cjs/dynamic-table/Body/TableRow.styles.js +0 -43
- package/cjs/dynamic-table/Body/TableRow.types.d.ts +0 -10
- package/cjs/dynamic-table/Body/TableRow.types.js +0 -5
- package/cjs/dynamic-table/DynamicTable.types.d.ts +0 -25
- package/cjs/dynamic-table/DynamicTable.types.js +0 -5
- package/cjs/dynamic-table/Head/TableHead.d.ts +0 -4
- package/cjs/dynamic-table/Head/TableHead.js +0 -85
- package/cjs/dynamic-table/Head/TableHead.styles.d.ts +0 -24
- package/cjs/dynamic-table/Head/TableHead.styles.js +0 -88
- package/cjs/dynamic-table/Head/TableHead.types.d.ts +0 -35
- package/cjs/dynamic-table/Head/TableHead.types.js +0 -5
- package/cjs/dynamic-table/Skeleton/SkeletonTable.styles.d.ts +0 -4
- package/cjs/dynamic-table/Skeleton/SkeletonTable.styles.js +0 -28
- package/cjs/dynamic-table/Skeleton/helpers/createSkeletonRows.d.ts +0 -3
- package/cjs/dynamic-table/Skeleton/helpers/createSkeletonRows.js +0 -40
- package/cjs/dynamic-table/helpers/getHeaderRow.d.ts +0 -3
- package/cjs/dynamic-table/helpers/getHeaderRow.js +0 -27
- package/cjs/dynamic-table/stories/headerRow.d.ts +0 -3
- package/cjs/dynamic-table/stories/headerRow.js +0 -25
- package/cjs/dynamic-table/stories/headerRowSortable.d.ts +0 -3
- package/cjs/dynamic-table/stories/headerRowSortable.js +0 -28
- package/cjs/dynamic-table/stories/tableRows.d.ts +0 -3
- package/cjs/dynamic-table/stories/tableRows.js +0 -76
- package/dynamic-table/Body/TableBody.d.ts +0 -4
- package/dynamic-table/Body/TableBody.js +0 -52
- package/dynamic-table/Body/TableBody.types.d.ts +0 -10
- package/dynamic-table/Body/TableBody.types.js +0 -1
- package/dynamic-table/Body/TableCell.d.ts +0 -4
- package/dynamic-table/Body/TableCell.js +0 -17
- package/dynamic-table/Body/TableCell.styles.d.ts +0 -16
- package/dynamic-table/Body/TableCell.styles.js +0 -34
- package/dynamic-table/Body/TableCell.types.d.ts +0 -7
- package/dynamic-table/Body/TableCell.types.js +0 -1
- package/dynamic-table/Body/TableRow.d.ts +0 -4
- package/dynamic-table/Body/TableRow.js +0 -39
- package/dynamic-table/Body/TableRow.styles.d.ts +0 -10
- package/dynamic-table/Body/TableRow.styles.js +0 -23
- package/dynamic-table/Body/TableRow.types.d.ts +0 -10
- package/dynamic-table/Body/TableRow.types.js +0 -1
- package/dynamic-table/DynamicTable.types.d.ts +0 -25
- package/dynamic-table/DynamicTable.types.js +0 -1
- package/dynamic-table/Head/TableHead.d.ts +0 -4
- package/dynamic-table/Head/TableHead.js +0 -69
- package/dynamic-table/Head/TableHead.styles.d.ts +0 -24
- package/dynamic-table/Head/TableHead.styles.js +0 -71
- package/dynamic-table/Head/TableHead.types.d.ts +0 -35
- package/dynamic-table/Head/TableHead.types.js +0 -1
- package/dynamic-table/Skeleton/SkeletonTable.styles.d.ts +0 -4
- package/dynamic-table/Skeleton/SkeletonTable.styles.js +0 -18
- package/dynamic-table/Skeleton/helpers/createSkeletonRows.d.ts +0 -3
- package/dynamic-table/Skeleton/helpers/createSkeletonRows.js +0 -43
- package/dynamic-table/helpers/getHeaderRow.d.ts +0 -3
- package/dynamic-table/helpers/getHeaderRow.js +0 -19
- package/dynamic-table/stories/headerRow.d.ts +0 -3
- package/dynamic-table/stories/headerRow.js +0 -18
- package/dynamic-table/stories/headerRowSortable.d.ts +0 -3
- package/dynamic-table/stories/headerRowSortable.js +0 -21
- package/dynamic-table/stories/tableRows.d.ts +0 -3
- package/dynamic-table/stories/tableRows.js +0 -67
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
const headerRowSortable = [{
|
|
8
|
-
displayName: 'ID',
|
|
9
|
-
key: 'id',
|
|
10
|
-
sortable: true
|
|
11
|
-
}, {
|
|
12
|
-
displayName: 'Pallets',
|
|
13
|
-
key: 'pallets'
|
|
14
|
-
}, {
|
|
15
|
-
displayName: 'From',
|
|
16
|
-
key: 'from',
|
|
17
|
-
sortable: true
|
|
18
|
-
}, {
|
|
19
|
-
displayName: 'To',
|
|
20
|
-
key: 'to',
|
|
21
|
-
sortable: true
|
|
22
|
-
}, {
|
|
23
|
-
displayName: 'Price',
|
|
24
|
-
key: 'price',
|
|
25
|
-
textAlign: 'right'
|
|
26
|
-
}];
|
|
27
|
-
var _default = headerRowSortable;
|
|
28
|
-
exports.default = _default;
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _react2 = require("@emotion/react");
|
|
11
|
-
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
const Currency = () => (0, _react2.jsx)("span", {
|
|
15
|
-
style: {
|
|
16
|
-
fontSize: '10px'
|
|
17
|
-
}
|
|
18
|
-
}, "EUR");
|
|
19
|
-
|
|
20
|
-
const tableRows = [{
|
|
21
|
-
id: '1001',
|
|
22
|
-
pallets: 10,
|
|
23
|
-
from: 'Copenhagen',
|
|
24
|
-
to: 'Stockholm',
|
|
25
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "200"))
|
|
26
|
-
}, {
|
|
27
|
-
id: '1002',
|
|
28
|
-
pallets: 41,
|
|
29
|
-
from: 'Istanbul',
|
|
30
|
-
to: 'London',
|
|
31
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "320"))
|
|
32
|
-
}, {
|
|
33
|
-
id: '1003',
|
|
34
|
-
pallets: 9,
|
|
35
|
-
from: 'Delphi',
|
|
36
|
-
to: 'Madrid',
|
|
37
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "1574"))
|
|
38
|
-
}, {
|
|
39
|
-
id: '1004',
|
|
40
|
-
pallets: 52,
|
|
41
|
-
from: 'Stockholm',
|
|
42
|
-
to: 'Amsterdam',
|
|
43
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "945.50"))
|
|
44
|
-
}, {
|
|
45
|
-
id: '1005',
|
|
46
|
-
pallets: 4,
|
|
47
|
-
from: 'London',
|
|
48
|
-
to: 'Paris',
|
|
49
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "850"))
|
|
50
|
-
}, {
|
|
51
|
-
id: '1006',
|
|
52
|
-
pallets: 33,
|
|
53
|
-
from: 'Madrid',
|
|
54
|
-
to: 'Berlin',
|
|
55
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "2000"))
|
|
56
|
-
}, {
|
|
57
|
-
id: '1007',
|
|
58
|
-
pallets: 17,
|
|
59
|
-
from: 'Berlin',
|
|
60
|
-
to: 'Oslo',
|
|
61
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "887"))
|
|
62
|
-
}, {
|
|
63
|
-
id: '1008',
|
|
64
|
-
pallets: 14,
|
|
65
|
-
from: 'Oslo',
|
|
66
|
-
to: 'Cairo',
|
|
67
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "2400"))
|
|
68
|
-
}, {
|
|
69
|
-
id: '1009',
|
|
70
|
-
pallets: 23,
|
|
71
|
-
from: 'Paris',
|
|
72
|
-
to: 'Rome',
|
|
73
|
-
price: (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(Currency, null), " ", (0, _react2.jsx)("strong", null, "1280.30"))
|
|
74
|
-
}];
|
|
75
|
-
var _default = tableRows;
|
|
76
|
-
exports.default = _default;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { TableBodyProps } from './TableBody.types';
|
|
3
|
-
declare const TableBody: React.MemoExoticComponent<({ activeRowId, headerRow, onClickRow, onSelectFunction, rows, selectableRows, selectedRows }: TableBodyProps) => JSX.Element>;
|
|
4
|
-
export default TableBody;
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
2
|
-
|
|
3
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
-
|
|
5
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
-
|
|
7
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
8
|
-
|
|
9
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
10
|
-
|
|
11
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
12
|
-
|
|
13
|
-
import React, { useCallback } from 'react';
|
|
14
|
-
import TableRow from './TableRow';
|
|
15
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
16
|
-
var TableBody = /*#__PURE__*/React.memo(function (_ref) {
|
|
17
|
-
var activeRowId = _ref.activeRowId,
|
|
18
|
-
headerRow = _ref.headerRow,
|
|
19
|
-
onClickRow = _ref.onClickRow,
|
|
20
|
-
onSelectFunction = _ref.onSelectFunction,
|
|
21
|
-
rows = _ref.rows,
|
|
22
|
-
selectableRows = _ref.selectableRows,
|
|
23
|
-
selectedRows = _ref.selectedRows;
|
|
24
|
-
// update state and callback functions
|
|
25
|
-
var updateSelectedRows = useCallback(function (id) {
|
|
26
|
-
if (onSelectFunction && selectableRows) {
|
|
27
|
-
var selection = _toConsumableArray(selectedRows);
|
|
28
|
-
|
|
29
|
-
if (selectedRows.includes(id)) {
|
|
30
|
-
var index = selectedRows.indexOf(id);
|
|
31
|
-
if (index !== -1) selection.splice(index, 1);
|
|
32
|
-
onSelectFunction(selection);
|
|
33
|
-
} else {
|
|
34
|
-
selection.push(id);
|
|
35
|
-
onSelectFunction(selection);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
}, [selectableRows, selectedRows]);
|
|
39
|
-
return ___EmotionJSX("tbody", null, rows.map(function (row, index) {
|
|
40
|
-
return ___EmotionJSX(TableRow, {
|
|
41
|
-
headerRow: headerRow,
|
|
42
|
-
isActive: activeRowId ? row.id === activeRowId : undefined,
|
|
43
|
-
key: index,
|
|
44
|
-
onClickRow: onClickRow,
|
|
45
|
-
onSelectRow: updateSelectedRows,
|
|
46
|
-
row: row,
|
|
47
|
-
selectableRows: selectableRows,
|
|
48
|
-
selectedRows: selectedRows
|
|
49
|
-
});
|
|
50
|
-
}));
|
|
51
|
-
});
|
|
52
|
-
export default TableBody;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { Header, Row } from '../DynamicTable.types';
|
|
2
|
-
export declare type TableBodyProps = {
|
|
3
|
-
activeRowId?: string;
|
|
4
|
-
headerRow: Header[];
|
|
5
|
-
onClickRow?: (id: string) => void;
|
|
6
|
-
onSelectFunction?: (list: string[]) => void;
|
|
7
|
-
rows: Row[];
|
|
8
|
-
selectableRows: boolean;
|
|
9
|
-
selectedRows: string[];
|
|
10
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { TableCellStyled } from './TableCell.styles';
|
|
3
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
4
|
-
var TableCell = /*#__PURE__*/React.memo(function (_ref) {
|
|
5
|
-
var children = _ref.children,
|
|
6
|
-
columnCount = _ref.columnCount,
|
|
7
|
-
headerCell = _ref.headerCell,
|
|
8
|
-
onSelectFunction = _ref.onSelectFunction;
|
|
9
|
-
return ___EmotionJSX(TableCellStyled, {
|
|
10
|
-
align: headerCell === null || headerCell === void 0 ? void 0 : headerCell.textAlign,
|
|
11
|
-
columns: columnCount,
|
|
12
|
-
customColumnWidth: headerCell === null || headerCell === void 0 ? void 0 : headerCell.customColumnWidth,
|
|
13
|
-
"data-cy": "dynamic-table-cell-".concat(headerCell === null || headerCell === void 0 ? void 0 : headerCell.key),
|
|
14
|
-
hasOnSelectFunction: !!onSelectFunction
|
|
15
|
-
}, children);
|
|
16
|
-
});
|
|
17
|
-
export default TableCell;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
export declare const genericTableCellStyle: import("@emotion/react").SerializedStyles;
|
|
2
|
-
declare type TableCellProps = {
|
|
3
|
-
align?: 'center' | 'left' | 'right';
|
|
4
|
-
columns: number;
|
|
5
|
-
customColumnWidth?: string;
|
|
6
|
-
hasOnSelectFunction: boolean;
|
|
7
|
-
};
|
|
8
|
-
export declare const TableCellStyled: import("@emotion/styled").StyledComponent<{
|
|
9
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
10
|
-
as?: import("react").ElementType<any> | undefined;
|
|
11
|
-
} & TableCellProps, import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {}>;
|
|
12
|
-
export declare const TableCellCheckboxStyled: import("@emotion/styled").StyledComponent<{
|
|
13
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
14
|
-
as?: import("react").ElementType<any> | undefined;
|
|
15
|
-
}, import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {}>;
|
|
16
|
-
export {};
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import _styled from "@emotion/styled/base";
|
|
2
|
-
|
|
3
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
6
|
-
|
|
7
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
-
|
|
9
|
-
import { theme } from '@dfds-ui/theme';
|
|
10
|
-
import { css } from '@emotion/react';
|
|
11
|
-
export var genericTableCellStyle = /*#__PURE__*/css("padding:0 ", theme.spacing.xs, ";&:first-of-type{padding-left:", theme.spacing.s, ";padding-right:0;}&:last-of-type{padding-right:", theme.spacing.s, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:genericTableCellStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVDZWxsLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSXdDIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVDZWxsLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0BkZmRzLXVpL3RoZW1lJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcblxuZXhwb3J0IGNvbnN0IGdlbmVyaWNUYWJsZUNlbGxTdHlsZSA9IGNzc2BcbiAgcGFkZGluZzogMCAke3RoZW1lLnNwYWNpbmcueHN9O1xuXG4gICY6Zmlyc3Qtb2YtdHlwZSB7XG4gICAgcGFkZGluZy1sZWZ0OiAke3RoZW1lLnNwYWNpbmcuc307XG4gICAgcGFkZGluZy1yaWdodDogMDtcbiAgfVxuXG4gICY6bGFzdC1vZi10eXBlIHtcbiAgICBwYWRkaW5nLXJpZ2h0OiAke3RoZW1lLnNwYWNpbmcuc307XG4gIH1cbmBcblxudHlwZSBUYWJsZUNlbGxQcm9wcyA9IHtcbiAgYWxpZ24/OiAnY2VudGVyJyB8ICdsZWZ0JyB8ICdyaWdodCdcbiAgY29sdW1uczogbnVtYmVyXG4gIGN1c3RvbUNvbHVtbldpZHRoPzogc3RyaW5nXG4gIGhhc09uU2VsZWN0RnVuY3Rpb246IGJvb2xlYW5cbn1cblxuZXhwb3J0IGNvbnN0IFRhYmxlQ2VsbFN0eWxlZCA9IHN0eWxlZC50ZDxUYWJsZUNlbGxQcm9wcz5gXG4gICR7eyAuLi5nZW5lcmljVGFibGVDZWxsU3R5bGUgfX1cblxuICBtaW4td2lkdGg6ICR7KHsgY3VzdG9tQ29sdW1uV2lkdGggfSkgPT4gY3VzdG9tQ29sdW1uV2lkdGggfHwgJ2F1dG8nfTtcbiAgdGV4dC1hbGlnbjogJHsoeyBhbGlnbiB9KSA9PiBhbGlnbiB8fCAnbGVmdCd9O1xuICB3aWR0aDogJHsoeyBjb2x1bW5zLCBjdXN0b21Db2x1bW5XaWR0aCwgaGFzT25TZWxlY3RGdW5jdGlvbiB9KSA9PlxuICAgIGN1c3RvbUNvbHVtbldpZHRoIHx8IGBjYWxjKCgxMDAlICR7aGFzT25TZWxlY3RGdW5jdGlvbiAmJiAnLTM2cHgnfSkgLyAke2NvbHVtbnN9KWB9O1xuYFxuXG5leHBvcnQgY29uc3QgVGFibGVDZWxsQ2hlY2tib3hTdHlsZWQgPSBzdHlsZWQudGRgXG4gICR7eyAuLi5nZW5lcmljVGFibGVDZWxsU3R5bGUgfX1cblxuICBtaW4td2lkdGg6IHVuc2V0O1xuICB3aWR0aDogMzZweDtcblxuICAmOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB1bnNldDtcbiAgfVxuYFxuIl19 */");
|
|
12
|
-
export var TableCellStyled = _styled("td", process.env.NODE_ENV === "production" ? {
|
|
13
|
-
target: "e1uuobsr1"
|
|
14
|
-
} : {
|
|
15
|
-
target: "e1uuobsr1",
|
|
16
|
-
label: "TableCellStyled"
|
|
17
|
-
})(_objectSpread({}, genericTableCellStyle), " min-width:", function (_ref) {
|
|
18
|
-
var customColumnWidth = _ref.customColumnWidth;
|
|
19
|
-
return customColumnWidth || 'auto';
|
|
20
|
-
}, ";text-align:", function (_ref2) {
|
|
21
|
-
var align = _ref2.align;
|
|
22
|
-
return align || 'left';
|
|
23
|
-
}, ";width:", function (_ref3) {
|
|
24
|
-
var columns = _ref3.columns,
|
|
25
|
-
customColumnWidth = _ref3.customColumnWidth,
|
|
26
|
-
hasOnSelectFunction = _ref3.hasOnSelectFunction;
|
|
27
|
-
return customColumnWidth || "calc((100% ".concat(hasOnSelectFunction && '-36px', ") / ").concat(columns, ")");
|
|
28
|
-
}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVDZWxsLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0J3RCIsImZpbGUiOiIuLi8uLi8uLi9zcmMvZHluYW1pYy10YWJsZS9Cb2R5L1RhYmxlQ2VsbC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBnZW5lcmljVGFibGVDZWxsU3R5bGUgPSBjc3NgXG4gIHBhZGRpbmc6IDAgJHt0aGVtZS5zcGFjaW5nLnhzfTtcblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIHBhZGRpbmctbGVmdDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuICAgIHBhZGRpbmctcmlnaHQ6IDA7XG4gIH1cblxuICAmOmxhc3Qtb2YtdHlwZSB7XG4gICAgcGFkZGluZy1yaWdodDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuICB9XG5gXG5cbnR5cGUgVGFibGVDZWxsUHJvcHMgPSB7XG4gIGFsaWduPzogJ2NlbnRlcicgfCAnbGVmdCcgfCAncmlnaHQnXG4gIGNvbHVtbnM6IG51bWJlclxuICBjdXN0b21Db2x1bW5XaWR0aD86IHN0cmluZ1xuICBoYXNPblNlbGVjdEZ1bmN0aW9uOiBib29sZWFuXG59XG5cbmV4cG9ydCBjb25zdCBUYWJsZUNlbGxTdHlsZWQgPSBzdHlsZWQudGQ8VGFibGVDZWxsUHJvcHM+YFxuICAke3sgLi4uZ2VuZXJpY1RhYmxlQ2VsbFN0eWxlIH19XG5cbiAgbWluLXdpZHRoOiAkeyh7IGN1c3RvbUNvbHVtbldpZHRoIH0pID0+IGN1c3RvbUNvbHVtbldpZHRoIHx8ICdhdXRvJ307XG4gIHRleHQtYWxpZ246ICR7KHsgYWxpZ24gfSkgPT4gYWxpZ24gfHwgJ2xlZnQnfTtcbiAgd2lkdGg6ICR7KHsgY29sdW1ucywgY3VzdG9tQ29sdW1uV2lkdGgsIGhhc09uU2VsZWN0RnVuY3Rpb24gfSkgPT5cbiAgICBjdXN0b21Db2x1bW5XaWR0aCB8fCBgY2FsYygoMTAwJSAke2hhc09uU2VsZWN0RnVuY3Rpb24gJiYgJy0zNnB4J30pIC8gJHtjb2x1bW5zfSlgfTtcbmBcblxuZXhwb3J0IGNvbnN0IFRhYmxlQ2VsbENoZWNrYm94U3R5bGVkID0gc3R5bGVkLnRkYFxuICAke3sgLi4uZ2VuZXJpY1RhYmxlQ2VsbFN0eWxlIH19XG5cbiAgbWluLXdpZHRoOiB1bnNldDtcbiAgd2lkdGg6IDM2cHg7XG5cbiAgJjpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdW5zZXQ7XG4gIH1cbmBcbiJdfQ== */"));
|
|
29
|
-
export var TableCellCheckboxStyled = _styled("td", process.env.NODE_ENV === "production" ? {
|
|
30
|
-
target: "e1uuobsr0"
|
|
31
|
-
} : {
|
|
32
|
-
target: "e1uuobsr0",
|
|
33
|
-
label: "TableCellCheckboxStyled"
|
|
34
|
-
})(_objectSpread({}, genericTableCellStyle), " min-width:unset;width:36px;&:hover{background-color:unset;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVDZWxsLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUNnRCIsImZpbGUiOiIuLi8uLi8uLi9zcmMvZHluYW1pYy10YWJsZS9Cb2R5L1RhYmxlQ2VsbC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBnZW5lcmljVGFibGVDZWxsU3R5bGUgPSBjc3NgXG4gIHBhZGRpbmc6IDAgJHt0aGVtZS5zcGFjaW5nLnhzfTtcblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIHBhZGRpbmctbGVmdDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuICAgIHBhZGRpbmctcmlnaHQ6IDA7XG4gIH1cblxuICAmOmxhc3Qtb2YtdHlwZSB7XG4gICAgcGFkZGluZy1yaWdodDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuICB9XG5gXG5cbnR5cGUgVGFibGVDZWxsUHJvcHMgPSB7XG4gIGFsaWduPzogJ2NlbnRlcicgfCAnbGVmdCcgfCAncmlnaHQnXG4gIGNvbHVtbnM6IG51bWJlclxuICBjdXN0b21Db2x1bW5XaWR0aD86IHN0cmluZ1xuICBoYXNPblNlbGVjdEZ1bmN0aW9uOiBib29sZWFuXG59XG5cbmV4cG9ydCBjb25zdCBUYWJsZUNlbGxTdHlsZWQgPSBzdHlsZWQudGQ8VGFibGVDZWxsUHJvcHM+YFxuICAke3sgLi4uZ2VuZXJpY1RhYmxlQ2VsbFN0eWxlIH19XG5cbiAgbWluLXdpZHRoOiAkeyh7IGN1c3RvbUNvbHVtbldpZHRoIH0pID0+IGN1c3RvbUNvbHVtbldpZHRoIHx8ICdhdXRvJ307XG4gIHRleHQtYWxpZ246ICR7KHsgYWxpZ24gfSkgPT4gYWxpZ24gfHwgJ2xlZnQnfTtcbiAgd2lkdGg6ICR7KHsgY29sdW1ucywgY3VzdG9tQ29sdW1uV2lkdGgsIGhhc09uU2VsZWN0RnVuY3Rpb24gfSkgPT5cbiAgICBjdXN0b21Db2x1bW5XaWR0aCB8fCBgY2FsYygoMTAwJSAke2hhc09uU2VsZWN0RnVuY3Rpb24gJiYgJy0zNnB4J30pIC8gJHtjb2x1bW5zfSlgfTtcbmBcblxuZXhwb3J0IGNvbnN0IFRhYmxlQ2VsbENoZWNrYm94U3R5bGVkID0gc3R5bGVkLnRkYFxuICAke3sgLi4uZ2VuZXJpY1RhYmxlQ2VsbFN0eWxlIH19XG5cbiAgbWluLXdpZHRoOiB1bnNldDtcbiAgd2lkdGg6IDM2cHg7XG5cbiAgJjpob3ZlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdW5zZXQ7XG4gIH1cbmBcbiJdfQ== */"));
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { TableRowProps } from './TableRow.types';
|
|
3
|
-
declare const TableRow: React.MemoExoticComponent<({ headerRow, isActive, onClickRow, onSelectRow, row, selectableRows, selectedRows }: TableRowProps) => JSX.Element>;
|
|
4
|
-
export default TableRow;
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Checkbox } from '@dfds-ui/forms';
|
|
3
|
-
import TableCell from './TableCell';
|
|
4
|
-
import { TableCellCheckboxStyled } from './TableCell.styles';
|
|
5
|
-
import { TableRowStyled } from './TableRow.styles';
|
|
6
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
7
|
-
var TableRow = /*#__PURE__*/React.memo(function (_ref) {
|
|
8
|
-
var headerRow = _ref.headerRow,
|
|
9
|
-
isActive = _ref.isActive,
|
|
10
|
-
onClickRow = _ref.onClickRow,
|
|
11
|
-
onSelectRow = _ref.onSelectRow,
|
|
12
|
-
row = _ref.row,
|
|
13
|
-
selectableRows = _ref.selectableRows,
|
|
14
|
-
selectedRows = _ref.selectedRows;
|
|
15
|
-
return ___EmotionJSX(TableRowStyled, {
|
|
16
|
-
active: isActive,
|
|
17
|
-
hoverColor: !!onClickRow,
|
|
18
|
-
onClick: function onClick() {
|
|
19
|
-
return onClickRow && onClickRow(row.id ? String(row.id) : '');
|
|
20
|
-
}
|
|
21
|
-
}, selectableRows && row.id && ___EmotionJSX(TableCellCheckboxStyled, null, ___EmotionJSX(Checkbox, {
|
|
22
|
-
checked: selectedRows.includes(row.id),
|
|
23
|
-
name: row.id,
|
|
24
|
-
onChange: function onChange() {
|
|
25
|
-
onSelectRow(row.id);
|
|
26
|
-
},
|
|
27
|
-
onLabelClick: function onLabelClick(e) {
|
|
28
|
-
e.stopPropagation();
|
|
29
|
-
},
|
|
30
|
-
visualSize: "small"
|
|
31
|
-
})), headerRow.map(function (headerCell, index) {
|
|
32
|
-
return ___EmotionJSX(TableCell, {
|
|
33
|
-
columnCount: headerRow.length,
|
|
34
|
-
headerCell: headerRow === null || headerRow === void 0 ? void 0 : headerRow[index],
|
|
35
|
-
key: index
|
|
36
|
-
}, row[headerCell.key] || '-');
|
|
37
|
-
}));
|
|
38
|
-
});
|
|
39
|
-
export default TableRow;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export declare const genericTableRowStyle: import("@emotion/react").SerializedStyles;
|
|
2
|
-
declare type TableRowProps = {
|
|
3
|
-
active?: boolean;
|
|
4
|
-
hoverColor: boolean;
|
|
5
|
-
};
|
|
6
|
-
export declare const TableRowStyled: import("@emotion/styled").StyledComponent<{
|
|
7
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
8
|
-
as?: import("react").ElementType<any> | undefined;
|
|
9
|
-
} & TableRowProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, {}>;
|
|
10
|
-
export {};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import _styled from "@emotion/styled/base";
|
|
2
|
-
|
|
3
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
|
|
5
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
6
|
-
|
|
7
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
8
|
-
|
|
9
|
-
import { theme } from '@dfds-ui/theme';
|
|
10
|
-
import { css } from '@emotion/react';
|
|
11
|
-
export var genericTableRowStyle = /*#__PURE__*/css("border-bottom:1px solid ", theme.colors.surface.secondary, ";border-collapse:collapse;height:48px;" + (process.env.NODE_ENV === "production" ? "" : ";label:genericTableRowStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVSb3cuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJdUMiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2R5bmFtaWMtdGFibGUvQm9keS9UYWJsZVJvdy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBnZW5lcmljVGFibGVSb3dTdHlsZSA9IGNzc2BcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5fTtcbiAgYm9yZGVyLWNvbGxhcHNlOiBjb2xsYXBzZTtcbiAgaGVpZ2h0OiA0OHB4O1xuYFxuXG50eXBlIFRhYmxlUm93UHJvcHMgPSB7XG4gIGFjdGl2ZT86IGJvb2xlYW5cbiAgaG92ZXJDb2xvcjogYm9vbGVhblxufVxuXG5leHBvcnQgY29uc3QgVGFibGVSb3dTdHlsZWQgPSBzdHlsZWQudHI8VGFibGVSb3dQcm9wcz5gXG4gICR7eyAuLi5nZW5lcmljVGFibGVSb3dTdHlsZSB9fVxuXG4gICY6aG92ZXIge1xuICAgICR7KHsgaG92ZXJDb2xvciB9KSA9PiBgXG4gICAgICAke1xuICAgICAgICBob3ZlckNvbG9yICYmXG4gICAgICAgIGBcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5jb2xvcnMuc3VyZmFjZS5zZWNvbmRhcnl9O1xuICAgICAgICBjdXJzb3I6ICR7aG92ZXJDb2xvciAmJiAncG9pbnRlcid9O1xuICAgICAgICBgXG4gICAgICB9XG4gICAgYH1cbiAgfVxuXG4gICR7KHsgYWN0aXZlIH0pID0+IGBcbiAgICAke1xuICAgICAgYWN0aXZlICYmXG4gICAgICBgXG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDAsIDQzLCA2OSwgMC4xMik7XG4gICAgICBgXG4gICAgfVxuICBgfVxuXG4gICY6bGFzdC1vZi10eXBlIHtcbiAgICB0ZCB7XG4gICAgICBib3JkZXItYm90dG9tOiBub25lO1xuICAgIH1cbiAgfVxuYFxuIl19 */");
|
|
12
|
-
export var TableRowStyled = _styled("tr", process.env.NODE_ENV === "production" ? {
|
|
13
|
-
target: "e1ozhs4m0"
|
|
14
|
-
} : {
|
|
15
|
-
target: "e1ozhs4m0",
|
|
16
|
-
label: "TableRowStyled"
|
|
17
|
-
})(_objectSpread({}, genericTableRowStyle), " &:hover{", function (_ref) {
|
|
18
|
-
var hoverColor = _ref.hoverColor;
|
|
19
|
-
return "\n ".concat(hoverColor && "\n background-color: ".concat(theme.colors.surface.secondary, ";\n cursor: ").concat(hoverColor && 'pointer', ";\n "), "\n ");
|
|
20
|
-
}, ";}", function (_ref2) {
|
|
21
|
-
var active = _ref2.active;
|
|
22
|
-
return "\n ".concat(active && "\n background-color: rgba(0, 43, 69, 0.12);\n ", "\n ");
|
|
23
|
-
}, " &:last-of-type{td{border-bottom:none;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9keW5hbWljLXRhYmxlL0JvZHkvVGFibGVSb3cuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlc0QiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2R5bmFtaWMtdGFibGUvQm9keS9UYWJsZVJvdy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5cbmV4cG9ydCBjb25zdCBnZW5lcmljVGFibGVSb3dTdHlsZSA9IGNzc2BcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5fTtcbiAgYm9yZGVyLWNvbGxhcHNlOiBjb2xsYXBzZTtcbiAgaGVpZ2h0OiA0OHB4O1xuYFxuXG50eXBlIFRhYmxlUm93UHJvcHMgPSB7XG4gIGFjdGl2ZT86IGJvb2xlYW5cbiAgaG92ZXJDb2xvcjogYm9vbGVhblxufVxuXG5leHBvcnQgY29uc3QgVGFibGVSb3dTdHlsZWQgPSBzdHlsZWQudHI8VGFibGVSb3dQcm9wcz5gXG4gICR7eyAuLi5nZW5lcmljVGFibGVSb3dTdHlsZSB9fVxuXG4gICY6aG92ZXIge1xuICAgICR7KHsgaG92ZXJDb2xvciB9KSA9PiBgXG4gICAgICAke1xuICAgICAgICBob3ZlckNvbG9yICYmXG4gICAgICAgIGBcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5jb2xvcnMuc3VyZmFjZS5zZWNvbmRhcnl9O1xuICAgICAgICBjdXJzb3I6ICR7aG92ZXJDb2xvciAmJiAncG9pbnRlcid9O1xuICAgICAgICBgXG4gICAgICB9XG4gICAgYH1cbiAgfVxuXG4gICR7KHsgYWN0aXZlIH0pID0+IGBcbiAgICAke1xuICAgICAgYWN0aXZlICYmXG4gICAgICBgXG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDAsIDQzLCA2OSwgMC4xMik7XG4gICAgICBgXG4gICAgfVxuICBgfVxuXG4gICY6bGFzdC1vZi10eXBlIHtcbiAgICB0ZCB7XG4gICAgICBib3JkZXItYm90dG9tOiBub25lO1xuICAgIH1cbiAgfVxuYFxuIl19 */"));
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { Header, Row } from '../DynamicTable.types';
|
|
2
|
-
export declare type TableRowProps = {
|
|
3
|
-
headerRow: Header[];
|
|
4
|
-
isActive?: boolean;
|
|
5
|
-
onClickRow?: (id: string) => void;
|
|
6
|
-
onSelectRow: (id: string) => void;
|
|
7
|
-
row: Row;
|
|
8
|
-
selectableRows?: boolean;
|
|
9
|
-
selectedRows: string[];
|
|
10
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
export declare type Header = {
|
|
2
|
-
customColumnWidth?: string;
|
|
3
|
-
displayName: string;
|
|
4
|
-
key: string;
|
|
5
|
-
sortable?: boolean;
|
|
6
|
-
sortKey?: string;
|
|
7
|
-
textAlign?: 'center' | 'left' | 'right';
|
|
8
|
-
};
|
|
9
|
-
export declare type Row = {
|
|
10
|
-
[name: string]: any;
|
|
11
|
-
};
|
|
12
|
-
export declare type DynamicTableProps = {
|
|
13
|
-
activeRowId?: string;
|
|
14
|
-
clickRowHandler?: (id: string) => void;
|
|
15
|
-
descending?: boolean;
|
|
16
|
-
fixedHeight?: string;
|
|
17
|
-
headerRow: Header[];
|
|
18
|
-
isLoading?: boolean;
|
|
19
|
-
onSelectFunction?: (list: string[]) => void;
|
|
20
|
-
onSortByKey?: (value: string, sortDescending: boolean) => void;
|
|
21
|
-
rows: Row[];
|
|
22
|
-
selectedRows?: string[];
|
|
23
|
-
sortingBy?: string;
|
|
24
|
-
stickyHeader?: boolean;
|
|
25
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { TableHeadProps } from './TableHead.types';
|
|
3
|
-
declare const TableHead: React.MemoExoticComponent<({ headerRow, onSelectFunction, onSortByKey, rows, selectableRows, selectedRows, setSortDescending, setSortByKeyValue, sortDescending, sortByKeyValue, stickyHeader, }: TableHeadProps) => JSX.Element>;
|
|
4
|
-
export default TableHead;
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import { Checkbox } from '@dfds-ui/react-components';
|
|
3
|
-
import { ChevronStyled, TableHeadCellCheckboxStyled, TableHeadCellStyled, TableHeadRow } from './TableHead.styles';
|
|
4
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
5
|
-
var TableHead = /*#__PURE__*/React.memo(function (_ref) {
|
|
6
|
-
var headerRow = _ref.headerRow,
|
|
7
|
-
onSelectFunction = _ref.onSelectFunction,
|
|
8
|
-
onSortByKey = _ref.onSortByKey,
|
|
9
|
-
rows = _ref.rows,
|
|
10
|
-
selectableRows = _ref.selectableRows,
|
|
11
|
-
selectedRows = _ref.selectedRows,
|
|
12
|
-
setSortDescending = _ref.setSortDescending,
|
|
13
|
-
setSortByKeyValue = _ref.setSortByKeyValue,
|
|
14
|
-
sortDescending = _ref.sortDescending,
|
|
15
|
-
sortByKeyValue = _ref.sortByKeyValue,
|
|
16
|
-
stickyHeader = _ref.stickyHeader;
|
|
17
|
-
var toggleAll = useCallback(function () {
|
|
18
|
-
if (!onSelectFunction) return;
|
|
19
|
-
var newArray = [];
|
|
20
|
-
|
|
21
|
-
if (selectedRows.length === 0) {
|
|
22
|
-
for (var i = 0; i < rows.length; i++) {
|
|
23
|
-
newArray.push(rows[i].id || '');
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
onSelectFunction(newArray);
|
|
28
|
-
}, [onSelectFunction, rows, selectedRows]);
|
|
29
|
-
var sort = useCallback(function (oldKey, newKey) {
|
|
30
|
-
if (!onSortByKey) return;
|
|
31
|
-
|
|
32
|
-
if (oldKey !== newKey) {
|
|
33
|
-
setSortByKeyValue(newKey);
|
|
34
|
-
setSortDescending(false);
|
|
35
|
-
} else {
|
|
36
|
-
setSortDescending(!sortDescending);
|
|
37
|
-
}
|
|
38
|
-
}, [onSortByKey, setSortDescending, setSortByKeyValue, sortDescending]);
|
|
39
|
-
return ___EmotionJSX("thead", null, ___EmotionJSX(TableHeadRow, null, selectableRows && ___EmotionJSX(TableHeadCellCheckboxStyled, null, ___EmotionJSX(Checkbox, {
|
|
40
|
-
checked: selectedRows.length > 0,
|
|
41
|
-
indeterminate: true,
|
|
42
|
-
name: "all",
|
|
43
|
-
onChange: toggleAll,
|
|
44
|
-
size: "small"
|
|
45
|
-
})), headerRow.map(function (headerCell, i) {
|
|
46
|
-
var sortKey = headerCell.sortKey || headerCell.key;
|
|
47
|
-
|
|
48
|
-
var clickHandler = function clickHandler() {
|
|
49
|
-
return headerCell.sortable && sort(sortByKeyValue, sortKey);
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
var showChevron = String(sortByKeyValue === sortKey);
|
|
53
|
-
return ___EmotionJSX(TableHeadCellStyled, {
|
|
54
|
-
align: headerCell.textAlign,
|
|
55
|
-
columns: headerRow.length,
|
|
56
|
-
customColumnWidth: headerCell.customColumnWidth,
|
|
57
|
-
hasOnSelectFunction: !!onSelectFunction,
|
|
58
|
-
key: i,
|
|
59
|
-
onClick: clickHandler,
|
|
60
|
-
sortByKey: onSortByKey,
|
|
61
|
-
sortable: headerCell.sortable,
|
|
62
|
-
stickyHeader: stickyHeader
|
|
63
|
-
}, ___EmotionJSX("div", null, ___EmotionJSX("span", null, headerCell.displayName), headerCell.sortable && onSortByKey && ___EmotionJSX(ChevronStyled, {
|
|
64
|
-
descending: String(sortDescending),
|
|
65
|
-
show: showChevron
|
|
66
|
-
})));
|
|
67
|
-
})));
|
|
68
|
-
});
|
|
69
|
-
export default TableHead;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { ChevronProps, GenericTableHeadCellProps, TableHeadCellCheckboxProps, TableHeadCellProps } from './TableHead.types';
|
|
2
|
-
export declare const TableHeadRow: import("@emotion/styled").StyledComponent<{
|
|
3
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
-
as?: import("react").ElementType<any> | undefined;
|
|
5
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, {}>;
|
|
6
|
-
export declare const TableHeadCellStyled: import("@emotion/styled").StyledComponent<{
|
|
7
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
8
|
-
as?: import("react").ElementType<any> | undefined;
|
|
9
|
-
} & GenericTableHeadCellProps & import("react").ClassAttributes<HTMLTableHeaderCellElement> & import("react").ThHTMLAttributes<HTMLTableHeaderCellElement> & {
|
|
10
|
-
children?: import("react").ReactNode;
|
|
11
|
-
} & {
|
|
12
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
13
|
-
} & TableHeadCellProps, {}, {}>;
|
|
14
|
-
export declare const TableHeadCellCheckboxStyled: import("@emotion/styled").StyledComponent<{
|
|
15
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
16
|
-
as?: import("react").ElementType<any> | undefined;
|
|
17
|
-
} & GenericTableHeadCellProps & import("react").ClassAttributes<HTMLTableHeaderCellElement> & import("react").ThHTMLAttributes<HTMLTableHeaderCellElement> & {
|
|
18
|
-
children?: import("react").ReactNode;
|
|
19
|
-
} & {
|
|
20
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
21
|
-
} & TableHeadCellCheckboxProps, {}, {}>;
|
|
22
|
-
export declare const ChevronStyled: import("@emotion/styled").StyledComponent<Pick<import("react").SVGProps<SVGSVGElement>, "string" | "filter" | "values" | "fill" | "max" | "type" | "accumulate" | "offset" | "key" | "id" | "media" | "origin" | "height" | "width" | "end" | "name" | "alignmentBaseline" | "baselineShift" | "clip" | "clipPath" | "clipRule" | "color" | "colorInterpolation" | "colorInterpolationFilters" | "cursor" | "direction" | "display" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "imageRendering" | "letterSpacing" | "lightingColor" | "markerEnd" | "markerMid" | "markerStart" | "mask" | "opacity" | "order" | "overflow" | "paintOrder" | "pointerEvents" | "rotate" | "scale" | "shapeRendering" | "stopColor" | "stopOpacity" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "textDecoration" | "textRendering" | "transform" | "unicodeBidi" | "visibility" | "wordSpacing" | "writingMode" | "alphabetic" | "hanging" | "ideographic" | "style" | "path" | "method" | "target" | "lang" | "className" | "children" | "tabIndex" | "orientation" | "local" | "x" | "y" | "mathematical" | "azimuth" | "colorRendering" | "glyphOrientationVertical" | "vectorEffect" | "additive" | "unicodeRange" | "crossOrigin" | "href" | "min" | "role" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "accentHeight" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "baseFrequency" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clipPathUnits" | "colorProfile" | "contentScriptType" | "contentStyleType" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "divisor" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "exponent" | "externalResourcesRequired" | "filterRes" | "filterUnits" | "focusable" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "limitingConeAngle" | "markerHeight" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "operator" | "orient" | "overlinePosition" | "overlineThickness" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rx" | "ry" | "seed" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "strikethroughPosition" | "strikethroughThickness" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textLength" | "to" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unitsPerEm" | "vAlphabetic" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "vMathematical" | "widths" | "x1" | "x2" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "yChannelSelector" | "z" | "zoomAndPan" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css"> & import("react").RefAttributes<SVGSVGElement> & {
|
|
23
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
24
|
-
} & ChevronProps, {}, {}>;
|