@neovici/cosmoz-omnitable 14.0.6 → 14.1.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.
@@ -1,8 +1,9 @@
1
- import { html, component } from '@pionjs/pion';
1
+ import { html, component, useContext } from '@pionjs/pion';
2
2
  import { repeat } from 'lit-html/directives/repeat.js';
3
3
  import './lib/cosmoz-omnitable-resize-nub';
4
4
  import { render } from './lib/settings/cosmoz-omnitable-sort-group';
5
5
  import { when } from 'lit-html/directives/when.js';
6
+ import { SortAndGroupContext } from './lib/use-sort-and-group-options';
6
7
 
7
8
  const /* eslint-disable-next-line max-lines-per-function */
8
9
  renderHeaderRow = ({
@@ -11,66 +12,64 @@ const /* eslint-disable-next-line max-lines-per-function */
11
12
  groupOnColumn,
12
13
  filters,
13
14
  setFilterState,
15
+ sortAndGroup: {
16
+ sortOn: on,
17
+ setSortOn: setOn,
18
+ descending,
19
+ setDescending,
20
+ } = {},
14
21
  }) =>
15
22
  repeat(
16
23
  columns,
17
24
  (column) => column.name,
18
- (column) => [
25
+ (column) =>
19
26
  html`<div
20
- class="cell ${column.headerCellClass} header-cell"
21
- part="cell header-cell cell-${column.name} header-cell-${column.name}"
22
- ?hidden=${column === groupOnColumn}
23
- title=${column.title}
24
- name=${column.name}
25
- >
26
- ${[
27
- column.renderHeader(
27
+ class="cell ${column.headerCellClass} header-cell"
28
+ part="cell header-cell cell-${column.name} header-cell-${column.name}"
29
+ ?hidden="${column === groupOnColumn}"
30
+ title="${column.title}"
31
+ name="${column.name}"
32
+ >
33
+ ${column.renderHeader(
28
34
  column,
29
35
  filters[column.name] ?? {},
30
36
  (state) => setFilterState(column.name, state),
31
37
  column.source(column, data),
32
- ),
33
- html` <sort-and-group-consumer
34
- style="display:contents"
35
- .render=${({
36
- sortOn: on,
37
- setSortOn: setOn,
38
- descending,
39
- setDescending,
40
- } = {}) =>
41
- render({
42
- on,
43
- setOn,
44
- descending,
45
- setDescending,
46
- column,
47
- })}
48
- >
49
- </sort-and-group-consumer>`,
50
- ]}
51
- </div>`,
52
- html`<cosmoz-omnitable-resize-nub
53
- .column=${column}
54
- name=${column.name}
55
- ></cosmoz-omnitable-resize-nub>`,
56
- ],
57
- ),
58
- HeaderRow = ({ columns, settingsConfig, hideSelectAll, ...thru }) => [
59
- columns &&
38
+ )}
39
+ ${render({
40
+ on,
41
+ setOn,
42
+ descending,
43
+ setDescending,
44
+ column,
45
+ })}
46
+ </div>
47
+ <cosmoz-omnitable-resize-nub
48
+ .column="${column}"
49
+ name="${column.name}"
50
+ ></cosmoz-omnitable-resize-nub>`,
51
+ );
52
+
53
+ const HeaderRow = ({ columns, settingsConfig, hideSelectAll, ...thru }) => {
54
+ const sortAndGroup = useContext(SortAndGroupContext);
55
+ return html`
56
+ ${when(columns, (columns) =>
60
57
  renderHeaderRow({
61
58
  columns,
59
+ sortAndGroup,
62
60
  ...thru,
63
61
  }),
64
- when(
62
+ )}
63
+ ${when(
65
64
  !hideSelectAll,
66
65
  () =>
67
66
  html` <cosmoz-omnitable-settings
68
67
  .config=${settingsConfig}
69
68
  part="settings"
70
- >
71
- </cosmoz-omnitable-settings>`,
72
- ),
73
- ];
69
+ ></cosmoz-omnitable-settings>`,
70
+ )}
71
+ `;
72
+ };
74
73
 
75
74
  customElements.define(
76
75
  'cosmoz-omnitable-header-row',
@@ -524,7 +524,7 @@ export default css`
524
524
  .sg:not([data-on='desc']) {
525
525
  transform: scaleY(-1);
526
526
  }
527
- :not(:hover) > * > .sg:not([data-on]) {
527
+ :not(:hover) > .sg:not([data-on]) {
528
528
  display: none;
529
529
  }
530
530
  .header-cell {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neovici/cosmoz-omnitable",
3
- "version": "14.0.6",
3
+ "version": "14.1.0",
4
4
  "description": "[![Build Status](https://travis-ci.org/Neovici/cosmoz-omnitable.svg?branch=master)](https://travis-ci.org/Neovici/cosmoz-omnitable)",
5
5
  "keywords": [
6
6
  "web-components"