@atlaskit/table 0.11.7 → 0.12.1
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/CHANGELOG.md +18 -0
- package/dist/cjs/body.js +8 -10
- package/dist/cjs/expandable-cell.js +6 -12
- package/dist/cjs/head-cell.js +4 -10
- package/dist/cjs/hooks/selection-provider.js +1 -2
- package/dist/cjs/hooks/use-expand-content.js +1 -2
- package/dist/cjs/hooks/use-expand.js +1 -2
- package/dist/cjs/hooks/use-table.js +1 -2
- package/dist/cjs/row.js +6 -12
- package/dist/cjs/selectable-cell.js +6 -12
- package/dist/cjs/sortable-column.compiled.css +6 -0
- package/dist/cjs/sortable-column.js +15 -21
- package/dist/cjs/table.js +6 -12
- package/dist/cjs/thead.js +7 -14
- package/dist/cjs/ui/base-cell.js +1 -2
- package/dist/cjs/ui/expand-icon.js +5 -11
- package/dist/cjs/ui/sort-icon.js +5 -11
- package/dist/cjs/ui/table.js +4 -10
- package/dist/cjs/ui/tbody.compiled.css +7 -0
- package/dist/cjs/ui/tbody.js +12 -22
- package/dist/cjs/ui/td.js +3 -7
- package/dist/cjs/ui/thead.compiled.css +7 -0
- package/dist/cjs/ui/thead.js +12 -19
- package/dist/cjs/ui/tr.compiled.css +11 -0
- package/dist/cjs/ui/tr.js +16 -36
- package/dist/es2019/body.js +5 -12
- package/dist/es2019/expandable-cell.js +4 -11
- package/dist/es2019/head-cell.js +3 -9
- package/dist/es2019/row.js +4 -11
- package/dist/es2019/selectable-cell.js +4 -11
- package/dist/es2019/sortable-column.compiled.css +6 -0
- package/dist/es2019/sortable-column.js +12 -21
- package/dist/es2019/table.js +4 -11
- package/dist/es2019/thead.js +7 -13
- package/dist/es2019/ui/expand-icon.js +3 -10
- package/dist/es2019/ui/sort-icon.js +3 -10
- package/dist/es2019/ui/table.js +3 -9
- package/dist/es2019/ui/tbody.compiled.css +7 -0
- package/dist/es2019/ui/tbody.js +7 -21
- package/dist/es2019/ui/td.js +3 -8
- package/dist/es2019/ui/thead.compiled.css +7 -0
- package/dist/es2019/ui/thead.js +7 -18
- package/dist/es2019/ui/tr.compiled.css +11 -0
- package/dist/es2019/ui/tr.js +11 -35
- package/dist/esm/body.js +5 -12
- package/dist/esm/expandable-cell.js +4 -11
- package/dist/esm/head-cell.js +3 -9
- package/dist/esm/row.js +4 -11
- package/dist/esm/selectable-cell.js +4 -11
- package/dist/esm/sortable-column.compiled.css +6 -0
- package/dist/esm/sortable-column.js +12 -21
- package/dist/esm/table.js +4 -11
- package/dist/esm/thead.js +7 -13
- package/dist/esm/ui/expand-icon.js +3 -10
- package/dist/esm/ui/sort-icon.js +3 -10
- package/dist/esm/ui/table.js +3 -9
- package/dist/esm/ui/tbody.compiled.css +7 -0
- package/dist/esm/ui/tbody.js +10 -21
- package/dist/esm/ui/td.js +3 -8
- package/dist/esm/ui/thead.compiled.css +7 -0
- package/dist/esm/ui/thead.js +10 -18
- package/dist/esm/ui/tr.compiled.css +11 -0
- package/dist/esm/ui/tr.js +14 -35
- package/dist/types/body.d.ts +2 -7
- package/dist/types/expandable-cell.d.ts +2 -3
- package/dist/types/head-cell.d.ts +1 -5
- package/dist/types/row.d.ts +0 -4
- package/dist/types/selectable-cell.d.ts +2 -2
- package/dist/types/table.d.ts +2 -7
- package/dist/types/thead.d.ts +0 -4
- package/dist/types/ui/expand-icon.d.ts +3 -4
- package/dist/types/ui/sort-icon.d.ts +0 -4
- package/dist/types/ui/table.d.ts +0 -4
- package/dist/types/ui/td.d.ts +1 -5
- package/dist/types-ts4.5/body.d.ts +2 -7
- package/dist/types-ts4.5/expandable-cell.d.ts +2 -3
- package/dist/types-ts4.5/head-cell.d.ts +1 -5
- package/dist/types-ts4.5/row.d.ts +0 -4
- package/dist/types-ts4.5/selectable-cell.d.ts +2 -2
- package/dist/types-ts4.5/table.d.ts +2 -7
- package/dist/types-ts4.5/thead.d.ts +0 -4
- package/dist/types-ts4.5/ui/expand-icon.d.ts +3 -4
- package/dist/types-ts4.5/ui/sort-icon.d.ts +0 -4
- package/dist/types-ts4.5/ui/table.d.ts +0 -4
- package/dist/types-ts4.5/ui/td.d.ts +1 -5
- package/package.json +10 -10
package/dist/es2019/ui/tbody.js
CHANGED
|
@@ -1,22 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { css, jsx } from '@emotion/react';
|
|
8
|
-
const bodyStyles = css({
|
|
9
|
-
position: 'relative',
|
|
10
|
-
border: 'none',
|
|
11
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
12
|
-
'&:after': {
|
|
13
|
-
position: 'absolute',
|
|
14
|
-
inset: 0,
|
|
15
|
-
boxShadow: `inset 0 -2px 0 0 ${"var(--ds-border, #eee)"}`,
|
|
16
|
-
content: "''",
|
|
17
|
-
pointerEvents: 'none'
|
|
18
|
-
}
|
|
19
|
-
});
|
|
1
|
+
/* tbody.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
|
+
import "./tbody.compiled.css";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
+
const bodyStyles = null;
|
|
20
6
|
|
|
21
7
|
/**
|
|
22
8
|
* __TBody__
|
|
@@ -24,6 +10,6 @@ const bodyStyles = css({
|
|
|
24
10
|
*/
|
|
25
11
|
export const TBody = ({
|
|
26
12
|
children
|
|
27
|
-
}) =>
|
|
28
|
-
|
|
13
|
+
}) => /*#__PURE__*/React.createElement("tbody", {
|
|
14
|
+
className: ax(["_19itglyw _kqswh2mm _9v7aidpf _18postnw _8x3u8fd9 _aetrb3bt _11fnglyw"])
|
|
29
15
|
}, children);
|
package/dist/es2019/ui/td.js
CHANGED
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
|
-
import { jsx } from '@emotion/react';
|
|
2
|
+
import React from 'react';
|
|
9
3
|
import { BaseCell } from './base-cell';
|
|
10
4
|
|
|
11
5
|
/**
|
|
@@ -19,8 +13,9 @@ export const TD = ({
|
|
|
19
13
|
testId,
|
|
20
14
|
...props
|
|
21
15
|
}) =>
|
|
16
|
+
/*#__PURE__*/
|
|
22
17
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
23
|
-
|
|
18
|
+
React.createElement(BaseCell, _extends({
|
|
24
19
|
as: "td",
|
|
25
20
|
testId: testId
|
|
26
21
|
}, props));
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
|
|
2
|
+
._19itglyw{border:none}
|
|
3
|
+
._1r04idpf{inset:0}._179r3ggr{border-block-end:2px solid var(--ds-border,#eee)}
|
|
4
|
+
._mqm21vrj{border-block-start:2px solid transparent}
|
|
5
|
+
._1pbykb7n{z-index:1}
|
|
6
|
+
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
7
|
+
._kqsw1if8{position:sticky}
|
package/dist/es2019/ui/thead.js
CHANGED
|
@@ -1,19 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { css, jsx } from '@emotion/react';
|
|
8
|
-
const baseStyles = css({
|
|
9
|
-
position: 'sticky',
|
|
10
|
-
zIndex: 1,
|
|
11
|
-
inset: 0,
|
|
12
|
-
backgroundColor: "var(--ds-surface, white)",
|
|
13
|
-
border: 'none',
|
|
14
|
-
borderBlockEnd: `2px solid ${"var(--ds-border, #eee)"}`,
|
|
15
|
-
borderBlockStart: '2px solid transparent'
|
|
16
|
-
});
|
|
1
|
+
/* thead.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
|
+
import "./thead.compiled.css";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
+
const baseStyles = null;
|
|
17
6
|
|
|
18
7
|
/**
|
|
19
8
|
* __THead__
|
|
@@ -25,7 +14,7 @@ const baseStyles = css({
|
|
|
25
14
|
export const THead = ({
|
|
26
15
|
children
|
|
27
16
|
}) => {
|
|
28
|
-
return
|
|
29
|
-
|
|
17
|
+
return /*#__PURE__*/React.createElement("thead", {
|
|
18
|
+
className: ax(["_1r04idpf _19itglyw _179r3ggr _mqm21vrj _kqsw1if8 _1pbykb7n _bfhkvuon"])
|
|
30
19
|
}, children);
|
|
31
20
|
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
|
|
2
|
+
._19itglyw{border:none}._179rn7ae{border-block-end:1px solid var(--ds-border,#eee)}
|
|
3
|
+
._4t3i1wto{height:3rem}
|
|
4
|
+
._bfhkcslv{background-color:var(--ds-background-selected,#deebff88)}
|
|
5
|
+
._bfhkm7j4{background-color:var(--ds-background-neutral,#091e420f)}
|
|
6
|
+
._btyzidpf{border-spacing:0}
|
|
7
|
+
._hpylidpf{border-image-width:0}
|
|
8
|
+
._kqswh2mm{position:relative}
|
|
9
|
+
._x6vyglyw:focus-visible:after{box-shadow:none}
|
|
10
|
+
._irr3134o:hover{background-color:var(--ds-background-neutral-subtle-hovered,#f8f8f8)}
|
|
11
|
+
._irr3quvt:hover{background-color:var(--ds-background-selected-hovered,#deebff)}
|
package/dist/es2019/ui/tr.js
CHANGED
|
@@ -1,36 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { css, jsx } from '@emotion/react';
|
|
1
|
+
/* tr.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
|
+
import "./tr.compiled.css";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
8
5
|
import FocusRing from '@atlaskit/focus-ring';
|
|
9
|
-
const baseStyles =
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
borderImageWidth: 0,
|
|
14
|
-
borderSpacing: 0
|
|
15
|
-
});
|
|
16
|
-
const selectedStyles = css({
|
|
17
|
-
backgroundColor: "var(--ds-background-selected, #DEEBFF88)",
|
|
18
|
-
'&:hover': {
|
|
19
|
-
backgroundColor: "var(--ds-background-selected-hovered, #DEEBFF)" // B50
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
const subitemStyles = css({
|
|
23
|
-
backgroundColor: "var(--ds-background-neutral, #091E420F)"
|
|
24
|
-
});
|
|
25
|
-
const bodyRowStyles = css({
|
|
26
|
-
borderBlockEnd: `1px solid ${"var(--ds-border, #eee)"}`,
|
|
27
|
-
'&:hover': {
|
|
28
|
-
backgroundColor: "var(--ds-background-neutral-subtle-hovered, #f8f8f8)"
|
|
29
|
-
},
|
|
30
|
-
'&:focus-visible::after': {
|
|
31
|
-
boxShadow: 'none'
|
|
32
|
-
}
|
|
33
|
-
});
|
|
6
|
+
const baseStyles = null;
|
|
7
|
+
const selectedStyles = null;
|
|
8
|
+
const subitemStyles = null;
|
|
9
|
+
const bodyRowStyles = null;
|
|
34
10
|
/**
|
|
35
11
|
* __Row__
|
|
36
12
|
*
|
|
@@ -45,12 +21,12 @@ export const TR = ({
|
|
|
45
21
|
isBodyRow = true,
|
|
46
22
|
isSubitem
|
|
47
23
|
}) => {
|
|
48
|
-
return
|
|
24
|
+
return /*#__PURE__*/React.createElement(FocusRing, {
|
|
49
25
|
isInset: true
|
|
50
|
-
},
|
|
26
|
+
}, /*#__PURE__*/React.createElement("tr", {
|
|
51
27
|
tabIndex: -1,
|
|
52
28
|
"aria-selected": isSelected,
|
|
53
29
|
"data-testid": testId,
|
|
54
|
-
|
|
30
|
+
className: ax(["_19itglyw _4t3i1wto _kqswh2mm _hpylidpf _btyzidpf", isBodyRow && "_179rn7ae _x6vyglyw _irr3134o", isSelected && "_bfhkcslv _irr3quvt", isSubitem && "_bfhkm7j4"])
|
|
55
31
|
}, children));
|
|
56
32
|
};
|
package/dist/esm/body.js
CHANGED
|
@@ -4,14 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
4
4
|
var _excluded = ["idx"];
|
|
5
5
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
6
6
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
7
|
-
|
|
8
|
-
* @jsxRuntime classic
|
|
9
|
-
* @jsx jsx
|
|
10
|
-
*/
|
|
11
|
-
import { Children, useEffect, useMemo } from 'react';
|
|
12
|
-
|
|
13
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
14
|
-
import { jsx } from '@emotion/react';
|
|
7
|
+
import React, { Children, useEffect, useMemo } from 'react';
|
|
15
8
|
import { useSelection } from './hooks/selection-provider';
|
|
16
9
|
import { RowProvider } from './hooks/use-row-id';
|
|
17
10
|
import { useTable } from './hooks/use-table';
|
|
@@ -56,7 +49,7 @@ function TBody(_ref) {
|
|
|
56
49
|
return sortedRows === null || sortedRows === void 0 ? void 0 : sortedRows.map(function (_ref2) {
|
|
57
50
|
var idx = _ref2.idx,
|
|
58
51
|
row = _objectWithoutProperties(_ref2, _excluded);
|
|
59
|
-
return
|
|
52
|
+
return /*#__PURE__*/React.createElement(RowProvider, {
|
|
60
53
|
key: idx,
|
|
61
54
|
value: idx
|
|
62
55
|
},
|
|
@@ -66,14 +59,14 @@ function TBody(_ref) {
|
|
|
66
59
|
}
|
|
67
60
|
var childrenArray = Array.isArray(children) ? children : [children];
|
|
68
61
|
return childrenArray.map(function (row, idx) {
|
|
69
|
-
return
|
|
62
|
+
return /*#__PURE__*/React.createElement(RowProvider, {
|
|
70
63
|
key: idx,
|
|
71
64
|
value: idx
|
|
72
65
|
}, row);
|
|
73
66
|
});
|
|
74
67
|
}();
|
|
75
|
-
return
|
|
68
|
+
return /*#__PURE__*/React.createElement(TableBodyProvider, {
|
|
76
69
|
value: true
|
|
77
|
-
},
|
|
70
|
+
}, /*#__PURE__*/React.createElement(TBodyPrimitive, null, renderedChildren));
|
|
78
71
|
}
|
|
79
72
|
export default TBody;
|
|
@@ -1,12 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
|
-
import { memo, useCallback } from 'react';
|
|
7
|
-
|
|
8
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
9
|
-
import { jsx } from '@emotion/react';
|
|
2
|
+
import React, { memo, useCallback } from 'react';
|
|
10
3
|
import { IconButton } from '@atlaskit/button/new';
|
|
11
4
|
import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down--hipchat-chevron-down';
|
|
12
5
|
import ChevronUpIcon from '@atlaskit/icon/utility/migration/chevron-up--hipchat-chevron-up';
|
|
@@ -27,13 +20,13 @@ var ExpandableCell = /*#__PURE__*/memo(function () {
|
|
|
27
20
|
toggleExpanded();
|
|
28
21
|
}, [toggleExpanded]);
|
|
29
22
|
var Icon = isExpanded ? ChevronUpIcon : ChevronDownIcon;
|
|
30
|
-
return
|
|
23
|
+
return /*#__PURE__*/React.createElement(ExpandableCellPrimitive, {
|
|
31
24
|
as: "td"
|
|
32
|
-
},
|
|
25
|
+
}, /*#__PURE__*/React.createElement(IconButton, {
|
|
33
26
|
spacing: "compact",
|
|
34
27
|
appearance: "subtle",
|
|
35
28
|
icon: function icon(iconProps) {
|
|
36
|
-
return
|
|
29
|
+
return /*#__PURE__*/React.createElement(Icon, _extends({}, iconProps, {
|
|
37
30
|
LEGACY_size: "small"
|
|
38
31
|
}));
|
|
39
32
|
},
|
package/dist/esm/head-cell.js
CHANGED
|
@@ -1,10 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React from 'react';
|
|
8
2
|
import { Text } from '@atlaskit/primitives';
|
|
9
3
|
import { TH } from './ui/th';
|
|
10
4
|
|
|
@@ -20,12 +14,12 @@ var HeadCell = function HeadCell(_ref) {
|
|
|
20
14
|
backgroundColor = _ref.backgroundColor,
|
|
21
15
|
_ref$scope = _ref.scope,
|
|
22
16
|
scope = _ref$scope === void 0 ? 'col' : _ref$scope;
|
|
23
|
-
return
|
|
17
|
+
return /*#__PURE__*/React.createElement(TH, {
|
|
24
18
|
scope: scope,
|
|
25
19
|
align: align,
|
|
26
20
|
testId: testId,
|
|
27
21
|
backgroundColor: backgroundColor
|
|
28
|
-
}, children &&
|
|
22
|
+
}, children && /*#__PURE__*/React.createElement(Text, {
|
|
29
23
|
weight: "medium"
|
|
30
24
|
}, children));
|
|
31
25
|
};
|
package/dist/esm/row.js
CHANGED
|
@@ -1,12 +1,5 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
|
-
import { memo, useMemo } from 'react';
|
|
7
|
-
|
|
8
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
9
|
-
import { jsx } from '@emotion/react';
|
|
2
|
+
import React, { memo, useMemo } from 'react';
|
|
10
3
|
import { useSelection } from './hooks/selection-provider';
|
|
11
4
|
import useExpand from './hooks/use-expand';
|
|
12
5
|
import useExpandContent from './hooks/use-expand-content';
|
|
@@ -50,13 +43,13 @@ var Row = /*#__PURE__*/memo(function (_ref) {
|
|
|
50
43
|
if (isExpanded === false && isExpandableContent) {
|
|
51
44
|
return null;
|
|
52
45
|
}
|
|
53
|
-
var selectableCell = isSelectable &&
|
|
46
|
+
var selectableCell = isSelectable && /*#__PURE__*/React.createElement(SelectableCell, null);
|
|
54
47
|
if (isSelectable && isExpandableContent) {
|
|
55
|
-
selectableCell =
|
|
48
|
+
selectableCell = /*#__PURE__*/React.createElement(SelectableCellPrimitive, {
|
|
56
49
|
as: "td"
|
|
57
50
|
});
|
|
58
51
|
}
|
|
59
|
-
return
|
|
52
|
+
return /*#__PURE__*/React.createElement(TRPrimitive, {
|
|
60
53
|
isSelected: isSelected,
|
|
61
54
|
testId: testId,
|
|
62
55
|
isSubitem: isExpandableContent
|
|
@@ -1,12 +1,5 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
|
-
import { memo, useCallback, useMemo } from 'react';
|
|
7
|
-
|
|
8
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
9
|
-
import { jsx } from '@emotion/react';
|
|
2
|
+
import React, { memo, useCallback, useMemo } from 'react';
|
|
10
3
|
import Checkbox from '@atlaskit/checkbox';
|
|
11
4
|
import VisuallyHidden from '@atlaskit/visually-hidden';
|
|
12
5
|
import { useSelection } from './hooks/selection-provider';
|
|
@@ -26,12 +19,12 @@ var SelectableCellComponent = function SelectableCellComponent() {
|
|
|
26
19
|
var onChange = useCallback(function (e) {
|
|
27
20
|
return toggleSelection === null || toggleSelection === void 0 ? void 0 : toggleSelection(idx, e.nativeEvent.shiftKey);
|
|
28
21
|
}, [idx, toggleSelection]);
|
|
29
|
-
return
|
|
22
|
+
return /*#__PURE__*/React.createElement(SelectableCellPrimitive, {
|
|
30
23
|
as: "td"
|
|
31
|
-
},
|
|
24
|
+
}, /*#__PURE__*/React.createElement(Checkbox, {
|
|
32
25
|
isChecked: isChecked,
|
|
33
26
|
onChange: onChange,
|
|
34
|
-
label:
|
|
27
|
+
label: /*#__PURE__*/React.createElement(VisuallyHidden, null, "Select row ", idx + 1)
|
|
35
28
|
}));
|
|
36
29
|
};
|
|
37
30
|
var SelectableCell = /*#__PURE__*/memo(SelectableCellComponent);
|
|
@@ -1,14 +1,11 @@
|
|
|
1
|
+
/* sortable-column.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
1
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
4
|
var _excluded = ["name", "testId", "onClick", "children"];
|
|
4
|
-
|
|
5
|
-
*
|
|
6
|
-
|
|
7
|
-
*/
|
|
5
|
+
import "./sortable-column.compiled.css";
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
8
8
|
import { useCallback } from 'react';
|
|
9
|
-
|
|
10
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
11
|
-
import { css, jsx } from '@emotion/react';
|
|
12
9
|
import Button from '@atlaskit/button';
|
|
13
10
|
import Tooltip from '@atlaskit/tooltip';
|
|
14
11
|
import { useTable } from './hooks/use-table';
|
|
@@ -31,13 +28,7 @@ var sortingMessages = {
|
|
|
31
28
|
number: 'Sort from 9 to 0'
|
|
32
29
|
}
|
|
33
30
|
};
|
|
34
|
-
var overrideStyles =
|
|
35
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
36
|
-
margin: '0 -2px !important',
|
|
37
|
-
gap: "var(--ds-space-050, 4px)",
|
|
38
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
39
|
-
paddingInline: "2px !important"
|
|
40
|
-
});
|
|
31
|
+
var overrideStyles = null;
|
|
41
32
|
|
|
42
33
|
/**
|
|
43
34
|
* __SortableColumn__
|
|
@@ -66,29 +57,29 @@ var SortableColumn = function SortableColumn(_ref) {
|
|
|
66
57
|
function () {
|
|
67
58
|
return setSortState(name);
|
|
68
59
|
}, [setSortState, name]);
|
|
69
|
-
return
|
|
60
|
+
return /*#__PURE__*/React.createElement(THPrimitive, _extends({
|
|
70
61
|
testId: testId,
|
|
71
62
|
sortDirection: sortKey === name ? sortDirection : 'none'
|
|
72
63
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
73
|
-
}, other),
|
|
64
|
+
}, other), /*#__PURE__*/React.createElement(Tooltip, {
|
|
74
65
|
content: getSortMessage(),
|
|
75
66
|
position: "top"
|
|
76
67
|
}, function (tooltipProps) {
|
|
77
|
-
return
|
|
68
|
+
return /*#__PURE__*/React.createElement(Button, _extends({
|
|
78
69
|
testId: "".concat(testId, "--button"),
|
|
79
70
|
spacing: "compact",
|
|
80
71
|
appearance: "subtle",
|
|
81
|
-
iconAfter:
|
|
72
|
+
iconAfter: /*#__PURE__*/React.createElement(SortIconPrimitive, {
|
|
82
73
|
name: name
|
|
83
74
|
})
|
|
84
75
|
}, tooltipProps, {
|
|
85
76
|
onClick: updateSortState
|
|
86
77
|
// TODO: (from codemod) Buttons with "css" or "style" prop can't be migrated for now. Please wait for the support of xcss prop.
|
|
87
78
|
,
|
|
88
|
-
|
|
79
|
+
|
|
89
80
|
// TODO: i18n support for this attr
|
|
90
|
-
,
|
|
91
|
-
|
|
81
|
+
"aria-roledescription": "Column sort button",
|
|
82
|
+
className: ax(["_19pkgrf3 _2hwxqyou _otyrgrf3 _18u0qyou _zulp1b66 _18zrud7t"])
|
|
92
83
|
}), children);
|
|
93
84
|
}));
|
|
94
85
|
};
|
package/dist/esm/table.js
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
import { useMemo } from 'react';
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
9
2
|
import SelectionProvider from './hooks/selection-provider';
|
|
10
3
|
import { useSorting } from './hooks/use-sorting';
|
|
11
4
|
import { TableProvider } from './hooks/use-table';
|
|
@@ -37,10 +30,10 @@ function Table(_ref) {
|
|
|
37
30
|
sortFn: sortFn
|
|
38
31
|
};
|
|
39
32
|
}, [isSelectable, localSortKey, setSortState, sortDirection, sortFn]);
|
|
40
|
-
return
|
|
33
|
+
return /*#__PURE__*/React.createElement(TableProvider, {
|
|
41
34
|
state: tableProviderState
|
|
42
|
-
},
|
|
35
|
+
}, /*#__PURE__*/React.createElement(TablePrimitive, {
|
|
43
36
|
testId: testId
|
|
44
|
-
}, isSelectable ?
|
|
37
|
+
}, isSelectable ? /*#__PURE__*/React.createElement(SelectionProvider, null, children) : children));
|
|
45
38
|
}
|
|
46
39
|
export default Table;
|
package/dist/esm/thead.js
CHANGED
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
|
|
3
|
-
* @jsxRuntime classic
|
|
4
|
-
* @jsx jsx
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
|
-
import { jsx } from '@emotion/react';
|
|
2
|
+
import React from 'react';
|
|
9
3
|
import Checkbox from '@atlaskit/checkbox';
|
|
10
4
|
import Inline from '@atlaskit/primitives/inline';
|
|
11
5
|
import VisuallyHidden from '@atlaskit/visually-hidden';
|
|
@@ -27,18 +21,18 @@ var THead = function THead(_ref) {
|
|
|
27
21
|
setAll = _useSelection2$.setAll,
|
|
28
22
|
removeAll = _useSelection2$.removeAll;
|
|
29
23
|
var isChecked = state.allChecked || state.anyChecked;
|
|
30
|
-
return
|
|
24
|
+
return /*#__PURE__*/React.createElement(THeadPrimitive, null, /*#__PURE__*/React.createElement(TRPrimitive, {
|
|
31
25
|
isBodyRow: false
|
|
32
|
-
}, isSelectable &&
|
|
26
|
+
}, isSelectable && /*#__PURE__*/React.createElement(SelectableCellPrimitive, {
|
|
33
27
|
as: "th"
|
|
34
|
-
},
|
|
35
|
-
label:
|
|
28
|
+
}, /*#__PURE__*/React.createElement(Checkbox, {
|
|
29
|
+
label: /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
36
30
|
id: "select-all"
|
|
37
31
|
}, "Select all rows"),
|
|
38
32
|
onChange: isChecked ? removeAll : setAll,
|
|
39
33
|
isChecked: isChecked,
|
|
40
34
|
isIndeterminate: state.anyChecked && !state.allChecked
|
|
41
|
-
})), children, isSelectable && isChecked &&
|
|
35
|
+
})), children, isSelectable && isChecked && /*#__PURE__*/React.createElement(BulkActionOverlayPrimitive, null, /*#__PURE__*/React.createElement("span", {
|
|
42
36
|
style: {
|
|
43
37
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
44
38
|
color: "var(--ds-text, #172B4D)",
|
|
@@ -46,7 +40,7 @@ var THead = function THead(_ref) {
|
|
|
46
40
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
47
41
|
fontWeight: "var(--ds-font-weight-medium, 500)"
|
|
48
42
|
}
|
|
49
|
-
}, state.checked.length, " selected"), actions &&
|
|
43
|
+
}, state.checked.length, " selected"), actions && /*#__PURE__*/React.createElement(Inline, {
|
|
50
44
|
alignBlock: "stretch",
|
|
51
45
|
space: "space.100"
|
|
52
46
|
}, actions(state.checked)))));
|
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
import { memo } from 'react';
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React, { memo } from 'react';
|
|
9
2
|
|
|
10
3
|
// TODO: Using HipChat icons as the standard icon set is missing large
|
|
11
4
|
// versions of `chevron-up` and `chevron-down`, despite already including
|
|
@@ -22,14 +15,14 @@ export var ExpandIcon = /*#__PURE__*/memo(function (_ref) {
|
|
|
22
15
|
var isExpanded = _ref.isExpanded;
|
|
23
16
|
switch (isExpanded) {
|
|
24
17
|
case true:
|
|
25
|
-
return
|
|
18
|
+
return /*#__PURE__*/React.createElement(ChevronUpIcon, {
|
|
26
19
|
color: "currentColor",
|
|
27
20
|
LEGACY_size: "small",
|
|
28
21
|
label: "",
|
|
29
22
|
LEGACY_primaryColor: "inherit"
|
|
30
23
|
});
|
|
31
24
|
case false:
|
|
32
|
-
return
|
|
25
|
+
return /*#__PURE__*/React.createElement(ChevronDownIcon, {
|
|
33
26
|
color: "currentColor",
|
|
34
27
|
LEGACY_size: "small",
|
|
35
28
|
label: "",
|
package/dist/esm/ui/sort-icon.js
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
import { memo } from 'react';
|
|
6
|
-
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
8
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React, { memo } from 'react';
|
|
9
2
|
import ArrowDownIcon from '@atlaskit/icon/utility/migration/arrow-down';
|
|
10
3
|
import ArrowUpIcon from '@atlaskit/icon/utility/migration/arrow-up';
|
|
11
4
|
import { useTable } from '../hooks/use-table';
|
|
@@ -23,14 +16,14 @@ export var SortIcon = /*#__PURE__*/memo(function (_ref) {
|
|
|
23
16
|
if (sortKey === name) {
|
|
24
17
|
switch (sortDirection) {
|
|
25
18
|
case 'ascending':
|
|
26
|
-
return
|
|
19
|
+
return /*#__PURE__*/React.createElement(ArrowUpIcon, {
|
|
27
20
|
color: "currentColor",
|
|
28
21
|
LEGACY_size: "small",
|
|
29
22
|
label: "",
|
|
30
23
|
LEGACY_primaryColor: "inherit"
|
|
31
24
|
});
|
|
32
25
|
case 'descending':
|
|
33
|
-
return
|
|
26
|
+
return /*#__PURE__*/React.createElement(ArrowDownIcon, {
|
|
34
27
|
color: "currentColor",
|
|
35
28
|
LEGACY_size: "small",
|
|
36
29
|
label: "",
|
package/dist/esm/ui/table.js
CHANGED
|
@@ -1,10 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React from 'react';
|
|
8
2
|
/**
|
|
9
3
|
* __Table__
|
|
10
4
|
*
|
|
@@ -19,7 +13,7 @@ export var Table = function Table(_ref) {
|
|
|
19
13
|
var children = _ref.children,
|
|
20
14
|
testId = _ref.testId,
|
|
21
15
|
summary = _ref.summary;
|
|
22
|
-
return
|
|
16
|
+
return /*#__PURE__*/React.createElement("table", {
|
|
23
17
|
"data-testid": testId
|
|
24
|
-
}, summary &&
|
|
18
|
+
}, summary && /*#__PURE__*/React.createElement("caption", null, summary), children);
|
|
25
19
|
};
|
package/dist/esm/ui/tbody.js
CHANGED
|
@@ -1,22 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
7
|
-
import { css, jsx } from '@emotion/react';
|
|
8
|
-
var bodyStyles = css({
|
|
9
|
-
position: 'relative',
|
|
10
|
-
border: 'none',
|
|
11
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
|
|
12
|
-
'&:after': {
|
|
13
|
-
position: 'absolute',
|
|
14
|
-
inset: 0,
|
|
15
|
-
boxShadow: "inset 0 -2px 0 0 ".concat("var(--ds-border, #eee)"),
|
|
16
|
-
content: "''",
|
|
17
|
-
pointerEvents: 'none'
|
|
18
|
-
}
|
|
19
|
-
});
|
|
1
|
+
/* tbody.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
|
+
import "./tbody.compiled.css";
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
+
var bodyStyles = null;
|
|
20
6
|
|
|
21
7
|
/**
|
|
22
8
|
* __TBody__
|
|
@@ -24,7 +10,10 @@ var bodyStyles = css({
|
|
|
24
10
|
*/
|
|
25
11
|
export var TBody = function TBody(_ref) {
|
|
26
12
|
var children = _ref.children;
|
|
27
|
-
return
|
|
28
|
-
|
|
13
|
+
return /*#__PURE__*/React.createElement("tbody", {
|
|
14
|
+
className: ax(["_19itglyw _kqswh2mm _9v7aidpf _18postnw _8x3ud1es _aetrb3bt _11fnglyw"]),
|
|
15
|
+
style: {
|
|
16
|
+
"--_1tz90uq": ix("inset 0 -2px 0 0 ".concat("var(--ds-border, #eee)"))
|
|
17
|
+
}
|
|
29
18
|
}, children);
|
|
30
19
|
};
|
package/dist/esm/ui/td.js
CHANGED
|
@@ -1,13 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
3
|
var _excluded = ["testId"];
|
|
4
|
-
|
|
5
|
-
* @jsxRuntime classic
|
|
6
|
-
* @jsx jsx
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
10
|
-
import { jsx } from '@emotion/react';
|
|
4
|
+
import React from 'react';
|
|
11
5
|
import { BaseCell } from './base-cell';
|
|
12
6
|
|
|
13
7
|
/**
|
|
@@ -21,8 +15,9 @@ export var TD = function TD(_ref) {
|
|
|
21
15
|
var testId = _ref.testId,
|
|
22
16
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
23
17
|
return (
|
|
18
|
+
/*#__PURE__*/
|
|
24
19
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
25
|
-
|
|
20
|
+
React.createElement(BaseCell, _extends({
|
|
26
21
|
as: "td",
|
|
27
22
|
testId: testId
|
|
28
23
|
}, props))
|