@alfalab/core-components-table 2.0.2 → 2.1.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.
Files changed (132) hide show
  1. package/component.d.ts +3 -2
  2. package/component.js +1 -1
  3. package/components/index.js +1 -1
  4. package/components/pagination/Component.js +2 -2
  5. package/components/pagination/index.css +8 -8
  6. package/components/pagination/index.js +1 -1
  7. package/components/pagination/select-field/index.css +4 -4
  8. package/components/pagination/select-field/index.js +2 -2
  9. package/components/table/Component.d.ts +8 -0
  10. package/components/table/Component.js +9 -4
  11. package/components/table/index.css +6 -6
  12. package/components/table/index.js +1 -1
  13. package/components/table/utils.js +1 -1
  14. package/components/table-context/index.d.ts +1 -0
  15. package/components/table-context/index.js +1 -0
  16. package/components/tbody/Component.js +2 -2
  17. package/components/tbody/index.css +2 -2
  18. package/components/tbody/index.js +1 -1
  19. package/components/tcell/Component.d.ts +1 -1
  20. package/components/tcell/Component.js +6 -4
  21. package/components/tcell/index.css +15 -7
  22. package/components/tcell/index.js +1 -1
  23. package/components/texpandable-row/Component.js +2 -2
  24. package/components/texpandable-row/index.css +5 -5
  25. package/components/texpandable-row/index.js +1 -1
  26. package/components/thead/Component.js +2 -2
  27. package/components/thead/index.css +11 -8
  28. package/components/thead/index.js +1 -1
  29. package/components/thead-cell/Component.d.ts +1 -1
  30. package/components/thead-cell/Component.js +7 -3
  31. package/components/thead-cell/index.css +16 -8
  32. package/components/thead-cell/index.js +2 -1
  33. package/components/trow/Component.js +2 -2
  34. package/components/trow/index.css +8 -8
  35. package/components/trow/index.js +1 -1
  36. package/components/tsortable-head-cell/Component.js +3 -2
  37. package/components/tsortable-head-cell/index.css +9 -9
  38. package/components/tsortable-head-cell/index.js +2 -1
  39. package/components/tsortable-head-cell/sort-icon-asc.js +1 -1
  40. package/components/tsortable-head-cell/sort-icon-desc.js +1 -1
  41. package/components/tsortable-head-cell/sort-icon-unset.js +1 -1
  42. package/cssm/component.d.ts +3 -2
  43. package/cssm/components/table/Component.d.ts +8 -0
  44. package/cssm/components/table/Component.js +7 -2
  45. package/cssm/components/table-context/index.d.ts +1 -0
  46. package/cssm/components/table-context/index.js +1 -0
  47. package/cssm/components/tcell/Component.d.ts +1 -1
  48. package/cssm/components/tcell/Component.js +4 -2
  49. package/cssm/components/tcell/index.module.css +12 -4
  50. package/cssm/components/thead/index.module.css +5 -2
  51. package/cssm/components/thead-cell/Component.d.ts +1 -1
  52. package/cssm/components/thead-cell/Component.js +5 -1
  53. package/cssm/components/thead-cell/index.js +1 -0
  54. package/cssm/components/thead-cell/index.module.css +12 -4
  55. package/cssm/components/tsortable-head-cell/Component.js +1 -0
  56. package/cssm/components/tsortable-head-cell/index.js +1 -0
  57. package/esm/component.d.ts +3 -2
  58. package/esm/component.js +1 -1
  59. package/esm/components/index.js +1 -1
  60. package/esm/components/pagination/Component.js +2 -2
  61. package/esm/components/pagination/index.css +8 -8
  62. package/esm/components/pagination/index.js +1 -1
  63. package/esm/components/pagination/select-field/index.css +4 -4
  64. package/esm/components/pagination/select-field/index.js +2 -2
  65. package/esm/components/table/Component.d.ts +8 -0
  66. package/esm/components/table/Component.js +9 -4
  67. package/esm/components/table/index.css +6 -6
  68. package/esm/components/table/index.js +1 -1
  69. package/esm/components/table/utils.js +1 -1
  70. package/esm/components/table-context/index.d.ts +1 -0
  71. package/esm/components/table-context/index.js +1 -0
  72. package/esm/components/tbody/Component.js +2 -2
  73. package/esm/components/tbody/index.css +2 -2
  74. package/esm/components/tbody/index.js +1 -1
  75. package/esm/components/tcell/Component.d.ts +1 -1
  76. package/esm/components/tcell/Component.js +6 -4
  77. package/esm/components/tcell/index.css +15 -7
  78. package/esm/components/tcell/index.js +1 -1
  79. package/esm/components/texpandable-row/Component.js +2 -2
  80. package/esm/components/texpandable-row/index.css +5 -5
  81. package/esm/components/texpandable-row/index.js +1 -1
  82. package/esm/components/thead/Component.js +2 -2
  83. package/esm/components/thead/index.css +11 -8
  84. package/esm/components/thead/index.js +1 -1
  85. package/esm/components/thead-cell/Component.d.ts +1 -1
  86. package/esm/components/thead-cell/Component.js +8 -4
  87. package/esm/components/thead-cell/index.css +16 -8
  88. package/esm/components/thead-cell/index.js +2 -1
  89. package/esm/components/trow/Component.js +2 -2
  90. package/esm/components/trow/index.css +8 -8
  91. package/esm/components/trow/index.js +1 -1
  92. package/esm/components/tsortable-head-cell/Component.js +3 -2
  93. package/esm/components/tsortable-head-cell/index.css +9 -9
  94. package/esm/components/tsortable-head-cell/index.js +2 -1
  95. package/esm/components/tsortable-head-cell/sort-icon-asc.js +1 -1
  96. package/esm/components/tsortable-head-cell/sort-icon-desc.js +1 -1
  97. package/esm/components/tsortable-head-cell/sort-icon-unset.js +1 -1
  98. package/esm/index.js +1 -1
  99. package/esm/{tslib.es6-9eeb595d.d.ts → tslib.es6-9107aa60.d.ts} +0 -0
  100. package/esm/{tslib.es6-9eeb595d.js → tslib.es6-9107aa60.js} +0 -0
  101. package/index.js +1 -1
  102. package/modern/component.d.ts +3 -2
  103. package/modern/components/pagination/Component.js +1 -1
  104. package/modern/components/pagination/index.css +8 -8
  105. package/modern/components/pagination/select-field/index.css +4 -4
  106. package/modern/components/pagination/select-field/index.js +1 -1
  107. package/modern/components/table/Component.d.ts +8 -0
  108. package/modern/components/table/Component.js +8 -3
  109. package/modern/components/table/index.css +6 -6
  110. package/modern/components/table-context/index.d.ts +1 -0
  111. package/modern/components/table-context/index.js +1 -0
  112. package/modern/components/tbody/Component.js +1 -1
  113. package/modern/components/tbody/index.css +2 -2
  114. package/modern/components/tcell/Component.d.ts +1 -1
  115. package/modern/components/tcell/Component.js +5 -3
  116. package/modern/components/tcell/index.css +15 -7
  117. package/modern/components/texpandable-row/Component.js +1 -1
  118. package/modern/components/texpandable-row/index.css +5 -5
  119. package/modern/components/thead/Component.js +1 -1
  120. package/modern/components/thead/index.css +11 -8
  121. package/modern/components/thead-cell/Component.d.ts +1 -1
  122. package/modern/components/thead-cell/Component.js +9 -3
  123. package/modern/components/thead-cell/index.css +16 -8
  124. package/modern/components/thead-cell/index.js +1 -0
  125. package/modern/components/trow/Component.js +1 -1
  126. package/modern/components/trow/index.css +8 -8
  127. package/modern/components/tsortable-head-cell/Component.js +2 -1
  128. package/modern/components/tsortable-head-cell/index.css +9 -9
  129. package/modern/components/tsortable-head-cell/index.js +1 -0
  130. package/package.json +4 -4
  131. /package/{tslib.es6-f2bbdbee.d.ts → tslib.es6-1bdb4617.d.ts} +0 -0
  132. /package/{tslib.es6-f2bbdbee.js → tslib.es6-1bdb4617.js} +0 -0
@@ -1,9 +1,9 @@
1
- import { _ as __rest, a as __assign } from '../../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
  import cn from 'classnames';
4
4
  import { Button } from '@alfalab/core-components-button/esm';
5
5
 
6
- var styles = {"field":"table__field_jk58l","open":"table__open_jk58l"};
6
+ var styles = {"field":"table__field_1gyw8","open":"table__open_1gyw8"};
7
7
  require('./index.css')
8
8
 
9
9
  var CustomSelectField = function (_a) {
@@ -6,6 +6,10 @@ type TableProps = TableHTMLAttributes<HTMLTableElement> & {
6
6
  * Компактный вид
7
7
  */
8
8
  compactView?: boolean;
9
+ /**
10
+ * Уменьшение горизонтальных паддингов
11
+ */
12
+ compactHorizontal?: boolean;
9
13
  /**
10
14
  * Дополнительный класс
11
15
  */
@@ -32,6 +36,10 @@ declare const Table: React.ForwardRefExoticComponent<React.TableHTMLAttributes<H
32
36
  * Компактный вид
33
37
  */
34
38
  compactView?: boolean | undefined;
39
+ /**
40
+ * Уменьшение горизонтальных паддингов
41
+ */
42
+ compactHorizontal?: boolean | undefined;
35
43
  /**
36
44
  * Дополнительный класс
37
45
  */
@@ -1,4 +1,4 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React, { forwardRef, useRef, useMemo } from 'react';
3
3
  import cn from 'classnames';
4
4
  import '../thead/Component.js';
@@ -6,12 +6,12 @@ import '../../utils.js';
6
6
  import { findAllHeadCellsProps } from './utils.js';
7
7
  import { TableContext } from '../table-context/index.js';
8
8
 
9
- var styles = {"component":"table__component_1wq9v","wrapper":"table__wrapper_1wq9v","hasPagination":"table__hasPagination_1wq9v","table":"table__table_1wq9v"};
9
+ var styles = {"component":"table__component_1az8i","wrapper":"table__wrapper_1az8i","hasPagination":"table__hasPagination_1az8i","table":"table__table_1az8i"};
10
10
  require('./index.css')
11
11
 
12
12
  var Table = forwardRef(function (_a, ref) {
13
13
  var _b;
14
- var className = _a.className, children = _a.children, _c = _a.compactView, compactView = _c === void 0 ? false : _c, _d = _a.wrapper, wrapper = _d === void 0 ? true : _d, pagination = _a.pagination, dataTestId = _a.dataTestId, restProps = __rest(_a, ["className", "children", "compactView", "wrapper", "pagination", "dataTestId"]);
14
+ var className = _a.className, children = _a.children, _c = _a.compactView, compactView = _c === void 0 ? false : _c, _d = _a.compactHorizontal, compactHorizontal = _d === void 0 ? false : _d, _e = _a.wrapper, wrapper = _e === void 0 ? true : _e, pagination = _a.pagination, dataTestId = _a.dataTestId, restProps = __rest(_a, ["className", "children", "compactView", "compactHorizontal", "wrapper", "pagination", "dataTestId"]);
15
15
  var wrapperRef = useRef(null);
16
16
  var columnsConfiguration = useMemo(function () {
17
17
  return findAllHeadCellsProps(children).map(function (columnProps, index) { return ({
@@ -21,7 +21,12 @@ var Table = forwardRef(function (_a, ref) {
21
21
  index: index,
22
22
  }); });
23
23
  }, [children]);
24
- return (React.createElement(TableContext.Provider, { value: { columnsConfiguration: columnsConfiguration, compactView: compactView, wrapperRef: wrapperRef } },
24
+ return (React.createElement(TableContext.Provider, { value: {
25
+ columnsConfiguration: columnsConfiguration,
26
+ compactView: compactView,
27
+ compactHorizontal: compactHorizontal,
28
+ wrapperRef: wrapperRef,
29
+ } },
25
30
  React.createElement("div", { ref: wrapperRef, className: cn(styles.component, className, (_b = {},
26
31
  _b[styles.wrapper] = wrapper,
27
32
  _b[styles.hasPagination] = !!pagination,
@@ -1,4 +1,4 @@
1
- /* hash: 1dpac */
1
+ /* hash: 1v5xk */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  }
@@ -18,26 +18,26 @@
18
18
  :root {
19
19
  --border-radius-m: 8px;
20
20
  }
21
- .table__component_1wq9v {
21
+ .table__component_1az8i {
22
22
  box-sizing: border-box;
23
23
  }
24
- .table__wrapper_1wq9v {
24
+ .table__wrapper_1az8i {
25
25
  padding: 0 var(--gap-m) var(--gap-m);
26
26
  background: var(--color-light-bg-primary);
27
27
  box-shadow: var(--shadow-xs-hard);
28
28
  border-radius: var(--border-radius-m);
29
29
  overflow: auto;
30
30
  }
31
- .table__hasPagination_1wq9v {
31
+ .table__hasPagination_1az8i {
32
32
  padding-bottom: 0;
33
33
  }
34
- .table__table_1wq9v {
34
+ .table__table_1az8i {
35
35
  width: 100%;
36
36
  border-collapse: collapse;
37
37
  box-sizing: border-box
38
38
 
39
39
  /* TODO: Хак для выравнивания чекбокса */
40
40
  }
41
- .table__table_1wq9v td:first-child label > *[class^='box'], .table__table_1wq9v th:first-child label > *[class^='box'] {
41
+ .table__table_1az8i td:first-child label > *[class^='box'], .table__table_1az8i th:first-child label > *[class^='box'] {
42
42
  margin-top: 0;
43
43
  }
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import '../thead/Component.js';
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
  import 'classnames';
4
4
  import { THead } from '../thead/Component.js';
@@ -11,6 +11,7 @@ type ColumnConfiguration = {
11
11
  type TableContextType = {
12
12
  columnsConfiguration: ColumnConfiguration[];
13
13
  compactView: boolean;
14
+ compactHorizontal: boolean;
14
15
  wrapperRef: RefObject<HTMLDivElement>;
15
16
  };
16
17
  declare const DEFAULT_TABLE_CONTEXT: TableContextType;
@@ -3,6 +3,7 @@ import React from 'react';
3
3
  var DEFAULT_TABLE_CONTEXT = {
4
4
  columnsConfiguration: [],
5
5
  compactView: false,
6
+ compactHorizontal: false,
6
7
  wrapperRef: { current: null },
7
8
  };
8
9
  var TableContext = React.createContext(DEFAULT_TABLE_CONTEXT);
@@ -1,8 +1,8 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
  import cn from 'classnames';
4
4
 
5
- var styles = {"component":"table__component_hwki9"};
5
+ var styles = {"component":"table__component_199qe"};
6
6
  require('./index.css')
7
7
 
8
8
  var TBody = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1crja */
1
+ /* hash: 32nq6 */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -7,7 +7,7 @@
7
7
 
8
8
  /* Hard up */
9
9
  }
10
- .table__component_hwki9 {
10
+ .table__component_199qe {
11
11
  width: 100%;
12
12
  box-sizing: border-box;
13
13
  }
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  export { TBody } from './Component.js';
@@ -14,5 +14,5 @@ type TCellProps = TdHTMLAttributes<HTMLTableCellElement> & {
14
14
  */
15
15
  index?: number;
16
16
  };
17
- declare const TCell: ({ className, style, dataTestId, children, index, ...restProps }: TCellProps) => JSX.Element;
17
+ declare const TCell: ({ className, style, dataTestId, children, index, ...restProps }: TCellProps) => JSX.Element | null;
18
18
  export { TCellProps, TCell };
@@ -1,19 +1,21 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React, { useContext } from 'react';
3
3
  import cn from 'classnames';
4
4
  import { TableContext } from '../table-context/index.js';
5
5
 
6
- var styles = {"component":"table__component_pxo94","hidden":"table__hidden_pxo94","compact":"table__compact_pxo94"};
6
+ var styles = {"component":"table__component_153gb","compactHorizontal":"table__compactHorizontal_153gb","compact":"table__compact_153gb"};
7
7
  require('./index.css')
8
8
 
9
9
  var TCell = function (_a) {
10
10
  var className = _a.className, style = _a.style, dataTestId = _a.dataTestId, children = _a.children, index = _a.index, restProps = __rest(_a, ["className", "style", "dataTestId", "children", "index"]);
11
- var _b = useContext(TableContext), columnsConfiguration = _b.columnsConfiguration, compactView = _b.compactView;
11
+ var _b = useContext(TableContext), columnsConfiguration = _b.columnsConfiguration, compactView = _b.compactView, compactHorizontal = _b.compactHorizontal;
12
12
  var column = index === undefined ? null : columnsConfiguration[index];
13
13
  var width = column === null || column === void 0 ? void 0 : column.width;
14
14
  var textAlign = column === null || column === void 0 ? void 0 : column.textAlign;
15
15
  var hidden = (column === null || column === void 0 ? void 0 : column.hidden) || false;
16
- return (React.createElement("td", __assign({ className: cn(styles.component, className, hidden && styles.hidden, compactView && styles.compact), style: __assign(__assign({}, style), { width: width, textAlign: textAlign }), "data-test-id": dataTestId }, restProps), children));
16
+ if (hidden)
17
+ return null;
18
+ return (React.createElement("td", __assign({ className: cn(styles.component, className, compactView && styles.compact, compactHorizontal && styles.compactHorizontal), style: __assign(__assign({}, style), { width: width, textAlign: textAlign }), "data-test-id": dataTestId }, restProps), children));
17
19
  };
18
20
 
19
21
  export { TCell };
@@ -1,4 +1,4 @@
1
- /* hash: bwhg4 */
1
+ /* hash: td4o2 */
2
2
  :root {
3
3
  --color-light-border-primary: #dbdee1;
4
4
  --color-light-text-primary: #0b1f35;
@@ -13,25 +13,33 @@
13
13
  }
14
14
  :root {
15
15
  --gap-xs: 8px;
16
+ --gap-s: 12px;
16
17
  --gap-m: 16px;
17
18
  --gap-xl: 24px;
18
19
  }
19
- .table__component_pxo94 {
20
+ .table__component_153gb {
20
21
  font-size: 14px;
21
22
  line-height: 20px;
22
23
  font-weight: 400;
23
24
 
24
25
  color: var(--color-light-text-primary);
25
- padding: var(--gap-xl) var(--gap-m);
26
+ padding: var(--gap-xl) var(--gap-s);
26
27
  height: 72px;
27
28
  border-top: 1px solid var(--color-light-border-primary);
28
29
  vertical-align: top;
29
- box-sizing: border-box;
30
+ box-sizing: border-box
30
31
  }
31
- .table__hidden_pxo94 {
32
- display: none;
32
+ .table__component_153gb:first-child {
33
+ padding-left: var(--gap-m);
34
+ }
35
+ .table__component_153gb:last-child {
36
+ padding-right: var(--gap-m);
37
+ }
38
+ .table__compactHorizontal_153gb {
39
+ padding-left: 6px;
40
+ padding-right: 6px;
33
41
  }
34
- .table__compact_pxo94 {
42
+ .table__compact_153gb {
35
43
  padding-top: var(--gap-xs);
36
44
  padding-bottom: var(--gap-xs);
37
45
 
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import '../table-context/index.js';
@@ -1,9 +1,9 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React, { useState } from 'react';
3
3
  import cn from 'classnames';
4
4
  import { TRow } from '../trow/Component.js';
5
5
 
6
- var styles = {"row":"table__row_1uvni","selected":"table__selected_1uvni","expanded":"table__expanded_1uvni","expandable":"table__expandable_1uvni"};
6
+ var styles = {"row":"table__row_uyot8","selected":"table__selected_uyot8","expanded":"table__expanded_uyot8","expandable":"table__expandable_uyot8"};
7
7
  require('./index.css')
8
8
 
9
9
  var TExpandableRow = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 13jv5 */
1
+ /* hash: m37xx */
2
2
  :root {
3
3
 
4
4
  /* Hard */
@@ -7,16 +7,16 @@
7
7
 
8
8
  /* Hard up */
9
9
  }
10
- .table__row_1uvni {
10
+ .table__row_uyot8 {
11
11
  cursor: pointer;
12
12
  }
13
- .table__selected_1uvni.table__expanded_1uvni {
13
+ .table__selected_uyot8.table__expanded_uyot8 {
14
14
  background-color: inherit;
15
15
  }
16
- .table__expanded_1uvni:hover {
16
+ .table__expanded_uyot8:hover {
17
17
  background-color: inherit;
18
18
  }
19
- .table__expandable_1uvni td {
19
+ .table__expandable_uyot8 td {
20
20
  margin: 0;
21
21
  padding-top: 0;
22
22
  padding-bottom: 0;
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import '../trow/Component.js';
@@ -1,8 +1,8 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
  import cn from 'classnames';
4
4
 
5
- var styles = {"component":"table__component_x06h3","row":"table__row_x06h3"};
5
+ var styles = {"component":"table__component_1vknn","row":"table__row_1vknn"};
6
6
  require('./index.css')
7
7
 
8
8
  var THead = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1vz8y */
1
+ /* hash: ees44 */
2
2
  :root {
3
3
  --color-light-graphic-quaternary: #dbdee1;
4
4
  }
@@ -10,12 +10,15 @@
10
10
 
11
11
  /* Hard up */
12
12
  }
13
- .table__component_x06h3 {
13
+ :root {
14
+ --gap-xs: 8px;
15
+ }
16
+ .table__component_1vknn {
14
17
  position: relative;
15
18
  width: 100%;
16
19
  box-sizing: border-box
17
20
  }
18
- .table__component_x06h3 th:not(:last-child):not(:empty):after {
21
+ .table__component_1vknn th:not(:last-child):not(:empty):after {
19
22
  transition: opacity 0.2s;
20
23
  position: absolute;
21
24
  content: '';
@@ -23,16 +26,16 @@
23
26
 
24
27
  width: 1px;
25
28
  right: 0;
26
- top: 12px;
27
- bottom: 8px;
29
+ top: var(--gap-xs);
30
+ bottom: var(--gap-xs);
28
31
  background-color: var(--color-light-graphic-quaternary);
29
32
  }
30
- .table__component_x06h3 th:after {
33
+ .table__component_1vknn th:after {
31
34
  opacity: 0;
32
35
  }
33
- .table__component_x06h3:hover th:after {
36
+ .table__component_1vknn:hover th:after {
34
37
  opacity: 1;
35
38
  }
36
- .table__row_x06h3 {
39
+ .table__row_1vknn {
37
40
  height: 72px;
38
41
  }
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  export { THead } from './Component.js';
@@ -23,5 +23,5 @@ type THeadCellProps = ThHTMLAttributes<HTMLHeadingElement> & {
23
23
  */
24
24
  dataTestId?: string;
25
25
  };
26
- declare const THeadCell: ({ children, className, dataTestId, style, width, textAlign, hidden, ...restProps }: THeadCellProps) => JSX.Element;
26
+ declare const THeadCell: ({ children, className, dataTestId, style, width, textAlign, hidden, ...restProps }: THeadCellProps) => JSX.Element | null;
27
27
  export { THeadCellProps, THeadCell };
@@ -1,13 +1,17 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
2
- import React from 'react';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
+ import React, { useContext } from 'react';
3
3
  import cn from 'classnames';
4
+ import { TableContext } from '../table-context/index.js';
4
5
 
5
- var styles = {"component":"table__component_z51xx","sortable":"table__sortable_z51xx","sorted":"table__sorted_z51xx","hidden":"table__hidden_z51xx"};
6
+ var styles = {"component":"table__component_f3eyf","sortable":"table__sortable_f3eyf","sorted":"table__sorted_f3eyf","compactHorizontal":"table__compactHorizontal_f3eyf"};
6
7
  require('./index.css')
7
8
 
8
9
  var THeadCell = function (_a) {
9
10
  var children = _a.children, className = _a.className, dataTestId = _a.dataTestId, style = _a.style, width = _a.width, textAlign = _a.textAlign, hidden = _a.hidden, restProps = __rest(_a, ["children", "className", "dataTestId", "style", "width", "textAlign", "hidden"]);
10
- return (React.createElement("th", __assign({ className: cn(styles.component, className, hidden && styles.hidden), style: __assign(__assign({}, style), { width: width, textAlign: textAlign }), "data-test-id": dataTestId }, restProps), children));
11
+ var compactHorizontal = useContext(TableContext).compactHorizontal;
12
+ if (hidden)
13
+ return null;
14
+ return (React.createElement("th", __assign({ className: cn(styles.component, className, compactHorizontal && styles.compactHorizontal), style: __assign(__assign({}, style), { width: width, textAlign: textAlign }), "data-test-id": dataTestId }, restProps), children));
11
15
  };
12
16
 
13
17
  export { THeadCell };
@@ -1,4 +1,4 @@
1
- /* hash: pco7x */
1
+ /* hash: fq1w */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  --color-light-border-primary: #dbdee1;
@@ -14,10 +14,11 @@
14
14
  }
15
15
  :root {
16
16
  --gap-2xs: 4px;
17
+ --gap-s: 12px;
17
18
  --gap-m: 16px;
18
19
  --gap-2xl: 32px;
19
20
  }
20
- .table__component_z51xx {
21
+ .table__component_f3eyf {
21
22
  font-size: 12px;
22
23
  line-height: 16px;
23
24
  font-weight: 500;
@@ -28,18 +29,25 @@
28
29
  position: relative;
29
30
  text-align: left;
30
31
  color: var(--color-light-text-primary);
31
- padding: var(--gap-2xl) var(--gap-m) var(--gap-2xs);
32
+ padding: var(--gap-2xl) var(--gap-s) var(--gap-2xs);
32
33
  border-bottom: 1px solid var(--color-light-border-primary);
33
34
  background: var(--color-light-bg-primary);
34
35
  vertical-align: top;
35
- box-sizing: border-box;
36
+ box-sizing: border-box
36
37
  }
37
- .table__sortable_z51xx {
38
+ .table__component_f3eyf:first-child {
39
+ padding-left: var(--gap-m);
40
+ }
41
+ .table__component_f3eyf:last-child {
42
+ padding-right: var(--gap-m);
43
+ }
44
+ .table__sortable_f3eyf {
38
45
  cursor: pointer;
39
46
  }
40
- .table__sorted_z51xx {
47
+ .table__sorted_f3eyf {
41
48
  color: var(--color-light-text-primary);
42
49
  }
43
- .table__hidden_z51xx {
44
- display: none;
50
+ .table__compactHorizontal_f3eyf {
51
+ padding-left: 6px;
52
+ padding-right: 6px;
45
53
  }
@@ -1,4 +1,5 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
+ import '../table-context/index.js';
4
5
  export { THeadCell } from './Component.js';
@@ -1,8 +1,8 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
  import cn from 'classnames';
4
4
 
5
- var styles = {"component":"table__component_w3w3e","withoutBorder":"table__withoutBorder_w3w3e","clickable":"table__clickable_w3w3e","selected":"table__selected_w3w3e"};
5
+ var styles = {"component":"table__component_1oms6","withoutBorder":"table__withoutBorder_1oms6","clickable":"table__clickable_1oms6","selected":"table__selected_1oms6"};
6
6
  require('./index.css')
7
7
 
8
8
  var TRow = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: s93ii */
1
+ /* hash: 19pqq */
2
2
  :root {
3
3
  --color-static-graphic-solitude: #e8f2fe;
4
4
  }
@@ -14,30 +14,30 @@
14
14
 
15
15
  /* Hard up */
16
16
  }
17
- .table__component_w3w3e {
17
+ .table__component_1oms6 {
18
18
  padding-top: 1px;
19
19
  width: 100%;
20
20
  transition: background-color 0.2s;
21
21
  box-sizing: border-box;
22
22
  background: var(--color-light-bg-primary)
23
23
  }
24
- .table__component_w3w3e:first-child td {
24
+ .table__component_1oms6:first-child td {
25
25
  border-top: 0;
26
26
  }
27
- .table__withoutBorder_w3w3e {
27
+ .table__withoutBorder_1oms6 {
28
28
  td {
29
29
  border: none;
30
30
  }
31
31
  }
32
- .table__clickable_w3w3e {
32
+ .table__clickable_1oms6 {
33
33
  cursor: pointer
34
34
  }
35
- .table__clickable_w3w3e:hover {
35
+ .table__clickable_1oms6:hover {
36
36
  background-color: var(--color-light-bg-secondary);
37
37
  }
38
- .table__selected_w3w3e {
38
+ .table__selected_1oms6 {
39
39
  background-color: #f2f8ff /* нет цвета в палитре */
40
40
  }
41
- .table__selected_w3w3e:hover {
41
+ .table__selected_1oms6:hover {
42
42
  background-color: var(--color-static-graphic-solitude);
43
43
  }
@@ -1,4 +1,4 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  export { TRow } from './Component.js';
@@ -1,12 +1,13 @@
1
- import { _ as __rest, a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { _ as __rest, a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React, { useMemo } from 'react';
3
3
  import cn from 'classnames';
4
+ import '../table-context/index.js';
4
5
  import { THeadCell } from '../thead-cell/Component.js';
5
6
  import { SortIconAsc } from './sort-icon-asc.js';
6
7
  import { SortIconDesc } from './sort-icon-desc.js';
7
8
  import { SortIconUnset } from './sort-icon-unset.js';
8
9
 
9
- var styles = {"component":"table__component_ymiin","content":"table__content_ymiin","icon":"table__icon_ymiin","reverse":"table__reverse_ymiin","sorted":"table__sorted_ymiin"};
10
+ var styles = {"component":"table__component_1yjh7","content":"table__content_1yjh7","icon":"table__icon_1yjh7","reverse":"table__reverse_1yjh7","sorted":"table__sorted_1yjh7"};
10
11
  require('./index.css')
11
12
 
12
13
  var TSortableHeadCell = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: jgk0c */
1
+ /* hash: 10x78 */
2
2
  :root {
3
3
  --color-light-graphic-link: #007aff;
4
4
  --color-light-graphic-primary: #0b1f35;
@@ -15,14 +15,14 @@
15
15
  :root {
16
16
  --gap-xs: 8px;
17
17
  }
18
- .table__component_ymiin {
18
+ .table__component_1yjh7 {
19
19
  position: relative;
20
20
  }
21
- .table__content_ymiin {
21
+ .table__content_1yjh7 {
22
22
  display: flex;
23
23
  align-items: flex-start;
24
24
  }
25
- .table__icon_ymiin {
25
+ .table__icon_1yjh7 {
26
26
  cursor: pointer;
27
27
  margin-left: var(--gap-xs);
28
28
 
@@ -35,19 +35,19 @@
35
35
  transition: color 0.2s ease;
36
36
  flex-shrink: 0
37
37
  }
38
- .table__icon_ymiin:hover {
38
+ .table__icon_1yjh7:hover {
39
39
  color: var(--color-light-graphic-primary);
40
40
  }
41
- .table__reverse_ymiin {
41
+ .table__reverse_1yjh7 {
42
42
  flex-direction: row-reverse
43
43
  }
44
- .table__reverse_ymiin .table__icon_ymiin {
44
+ .table__reverse_1yjh7 .table__icon_1yjh7 {
45
45
  margin-left: 0;
46
46
  margin-right: var(--gap-xs);
47
47
  }
48
- .table__sorted_ymiin {
48
+ .table__sorted_1yjh7 {
49
49
  color: var(--color-light-graphic-link)
50
50
  }
51
- .table__sorted_ymiin:hover {
51
+ .table__sorted_1yjh7:hover {
52
52
  color: var(--color-light-graphic-link);
53
53
  }
@@ -1,6 +1,7 @@
1
- import '../../tslib.es6-9eeb595d.js';
1
+ import '../../tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
+ import '../table-context/index.js';
4
5
  import '../thead-cell/Component.js';
5
6
  export { TSortableHeadCell } from './Component.js';
6
7
  import './sort-icon-asc.js';
@@ -1,4 +1,4 @@
1
- import { a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
 
4
4
  var SortIconAsc = function (props) { return (React.createElement("svg", __assign({ width: '18', height: '18', viewBox: '0 0 18 18', fill: 'currentColor', xmlns: 'http://www.w3.org/2000/svg', focusable: 'false', role: 'img' }, props),
@@ -1,4 +1,4 @@
1
- import { a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
 
4
4
  var SortIconDesc = function (props) { return (React.createElement("svg", __assign({ width: '18', height: '18', viewBox: '0 0 18 18', fill: 'currentColor', xmlns: 'http://www.w3.org/2000/svg', focusable: 'false', role: 'img' }, props),
@@ -1,4 +1,4 @@
1
- import { a as __assign } from '../../tslib.es6-9eeb595d.js';
1
+ import { a as __assign } from '../../tslib.es6-9107aa60.js';
2
2
  import React from 'react';
3
3
 
4
4
  var SortIconUnset = function (props) { return (React.createElement("svg", __assign({ width: '18', height: '18', viewBox: '0 0 18 18', fill: 'currentColor', xmlns: 'http://www.w3.org/2000/svg', focusable: 'false', role: 'img' }, props),
package/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import './tslib.es6-9eeb595d.js';
1
+ import './tslib.es6-9107aa60.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import './components/thead/Component.js';