@neovici/cosmoz-omnitable 14.21.3 → 14.22.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/dist/cosmoz-omnitable-column-amount.js +27 -29
- package/dist/cosmoz-omnitable-column-autocomplete.js +24 -28
- package/dist/cosmoz-omnitable-column-boolean.js +17 -25
- package/dist/cosmoz-omnitable-column-date.js +26 -28
- package/dist/cosmoz-omnitable-column-datetime.js +26 -28
- package/dist/cosmoz-omnitable-column-list-data.js +6 -8
- package/dist/cosmoz-omnitable-column-list-horizontal.js +15 -17
- package/dist/cosmoz-omnitable-column-list-mixin.js +15 -28
- package/dist/cosmoz-omnitable-column-list.js +19 -21
- package/dist/cosmoz-omnitable-column-mixin.js +8 -12
- package/dist/cosmoz-omnitable-column-number.js +27 -29
- package/dist/cosmoz-omnitable-column-time.js +24 -26
- package/dist/cosmoz-omnitable-column.js +11 -13
- package/dist/cosmoz-omnitable-columns.js +9 -11
- package/dist/cosmoz-omnitable-group-row.js +4 -6
- package/dist/cosmoz-omnitable-header-row.js +15 -17
- package/dist/cosmoz-omnitable-item-expand-line.js +5 -7
- package/dist/cosmoz-omnitable-item-expand.js +6 -8
- package/dist/cosmoz-omnitable-item-row.js +5 -7
- package/dist/cosmoz-omnitable-skeleton.js +6 -8
- package/dist/cosmoz-omnitable-styles.js +4 -7
- package/dist/cosmoz-omnitable.d.ts +1 -1
- package/dist/cosmoz-omnitable.d.ts.map +1 -1
- package/dist/cosmoz-omnitable.js +31 -37
- package/dist/grouped-list/cosmoz-grouped-list-row.js +2 -4
- package/dist/grouped-list/cosmoz-grouped-list.js +4 -6
- package/dist/grouped-list/index.js +1 -3
- package/dist/grouped-list/use-collapsible-items.d.ts +4 -4
- package/dist/grouped-list/use-collapsible-items.js +8 -12
- package/dist/grouped-list/use-cosmoz-grouped-list.d.ts +1 -1
- package/dist/grouped-list/use-cosmoz-grouped-list.js +19 -23
- package/dist/grouped-list/use-selected-items.d.ts +10 -10
- package/dist/grouped-list/use-selected-items.js +15 -19
- package/dist/grouped-list/use-weak-state.d.ts +3 -3
- package/dist/grouped-list/use-weak-state.js +6 -10
- package/dist/grouped-list/utils.js +1 -11
- package/dist/lib/compute-layout.js +7 -12
- package/dist/lib/cosmoz-omnitable-amount-range-input.js +14 -16
- package/dist/lib/cosmoz-omnitable-date-input-mixin.js +5 -9
- package/dist/lib/cosmoz-omnitable-date-range-input.js +12 -14
- package/dist/lib/cosmoz-omnitable-datetime-range-input.js +13 -15
- package/dist/lib/cosmoz-omnitable-number-range-input.js +12 -14
- package/dist/lib/cosmoz-omnitable-range-input-mixin.js +8 -12
- package/dist/lib/cosmoz-omnitable-resize-nub.js +5 -7
- package/dist/lib/cosmoz-omnitable-time-range-input.js +12 -14
- package/dist/lib/generic-sorter.js +1 -5
- package/dist/lib/icons.d.ts +4 -4
- package/dist/lib/icons.d.ts.map +1 -1
- package/dist/lib/icons.js +5 -8
- package/dist/lib/layout.js +2 -5
- package/dist/lib/polymer-haunted-render-mixin.js +6 -10
- package/dist/lib/render-footer.d.ts +1 -1
- package/dist/lib/render-footer.d.ts.map +1 -1
- package/dist/lib/render-footer.js +12 -16
- package/dist/lib/render-header.d.ts +1 -1
- package/dist/lib/render-header.d.ts.map +1 -1
- package/dist/lib/render-header.js +5 -9
- package/dist/lib/render-list.d.ts +1 -1
- package/dist/lib/render-list.d.ts.map +1 -1
- package/dist/lib/render-list.js +15 -19
- package/dist/lib/save-as-csv-action.js +3 -7
- package/dist/lib/save-as-xlsx-action.js +5 -9
- package/dist/lib/settings/cosmoz-omnitable-settings.js +33 -71
- package/dist/lib/settings/cosmoz-omnitable-sort-group.d.ts +3 -3
- package/dist/lib/settings/cosmoz-omnitable-sort-group.d.ts.map +1 -1
- package/dist/lib/settings/cosmoz-omnitable-sort-group.js +12 -19
- package/dist/lib/settings/drivers/context.d.ts +10 -2
- package/dist/lib/settings/drivers/context.d.ts.map +1 -1
- package/dist/lib/settings/drivers/context.js +6 -13
- package/dist/lib/settings/drivers/index.js +3 -25
- package/dist/lib/settings/drivers/local.js +1 -3
- package/dist/lib/settings/drivers/remote.js +1 -3
- package/dist/lib/settings/index.js +2 -9
- package/dist/lib/settings/normalize.js +10 -15
- package/dist/lib/settings/style.css.js +5 -8
- package/dist/lib/settings/use-saved-settings.d.ts +2 -2
- package/dist/lib/settings/use-saved-settings.js +9 -11
- package/dist/lib/settings/use-settings-ui.js +12 -14
- package/dist/lib/settings/use-settings.d.ts +12 -6
- package/dist/lib/settings/use-settings.d.ts.map +1 -1
- package/dist/lib/settings/use-settings.js +8 -46
- package/dist/lib/types.js +1 -2
- package/dist/lib/use-canvas-width.js +5 -9
- package/dist/lib/use-dom-columns.d.ts +1 -1
- package/dist/lib/use-dom-columns.d.ts.map +1 -1
- package/dist/lib/use-dom-columns.js +7 -11
- package/dist/lib/use-fast-layout.d.ts +1 -1
- package/dist/lib/use-fast-layout.js +18 -22
- package/dist/lib/use-footer.js +1 -5
- package/dist/lib/use-hash-state.js +11 -15
- package/dist/lib/use-header.js +5 -9
- package/dist/lib/use-layout.d.ts +1 -1
- package/dist/lib/use-layout.d.ts.map +1 -1
- package/dist/lib/use-layout.js +4 -8
- package/dist/lib/use-list.d.ts +10 -2
- package/dist/lib/use-list.d.ts.map +1 -1
- package/dist/lib/use-list.js +21 -25
- package/dist/lib/use-mini.d.ts +1 -1
- package/dist/lib/use-mini.js +5 -9
- package/dist/lib/use-omnitable.d.ts +10 -2
- package/dist/lib/use-omnitable.d.ts.map +1 -1
- package/dist/lib/use-omnitable.js +18 -22
- package/dist/lib/use-processed-items.d.ts +5 -3
- package/dist/lib/use-processed-items.d.ts.map +1 -1
- package/dist/lib/use-processed-items.js +23 -27
- package/dist/lib/use-public-interface.js +16 -20
- package/dist/lib/use-resizable-columns.js +4 -8
- package/dist/lib/use-sort-and-group-options.d.ts +25 -2
- package/dist/lib/use-sort-and-group-options.d.ts.map +1 -1
- package/dist/lib/use-sort-and-group-options.js +12 -16
- package/dist/lib/use-track-size.d.ts +1 -1
- package/dist/lib/use-track-size.d.ts.map +1 -1
- package/dist/lib/use-track-size.js +2 -6
- package/dist/lib/use-tween-array.js +10 -14
- package/dist/lib/utils-amount.js +29 -25
- package/dist/lib/utils-data.js +8 -12
- package/dist/lib/utils-date.js +38 -55
- package/dist/lib/utils-datetime.js +22 -32
- package/dist/lib/utils-number.js +24 -34
- package/dist/lib/utils-time.js +34 -46
- package/dist/lib/utils.js +2 -6
- package/dist/ui-helpers/cosmoz-clear-button.js +5 -7
- package/package.json +1 -1
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const lit_html_1 = require("lit-html");
|
|
5
|
-
const when_js_1 = require("lit-html/directives/when.js");
|
|
6
|
-
const renderHeader = ({ allSelected, onAllCheckboxChange, sortAndGroup, dataIsValid, data, columns, filters, groupOnColumn, setFilterState, settingsConfig, hideSelectAll, }) => (0, lit_html_1.html) `<sort-and-group-provider .value=${sortAndGroup}>
|
|
1
|
+
import { html } from 'lit-html';
|
|
2
|
+
import { when } from 'lit-html/directives/when.js';
|
|
3
|
+
export const renderHeader = ({ allSelected, onAllCheckboxChange, sortAndGroup, dataIsValid, data, columns, filters, groupOnColumn, setFilterState, settingsConfig, hideSelectAll, }) => html `<sort-and-group-provider .value=${sortAndGroup}>
|
|
7
4
|
<div class="header" id="header" part="header">
|
|
8
|
-
${
|
|
5
|
+
${when(!hideSelectAll, () => html `<input
|
|
9
6
|
class="checkbox all"
|
|
10
7
|
type="checkbox"
|
|
11
8
|
.checked=${allSelected}
|
|
@@ -13,7 +10,7 @@ const renderHeader = ({ allSelected, onAllCheckboxChange, sortAndGroup, dataIsVa
|
|
|
13
10
|
?disabled=${!dataIsValid}
|
|
14
11
|
part="all"
|
|
15
12
|
/>`)}
|
|
16
|
-
${
|
|
13
|
+
${when(hideSelectAll, () => html ` <cosmoz-omnitable-settings
|
|
17
14
|
.newLayout="${true}"
|
|
18
15
|
.config=${settingsConfig}
|
|
19
16
|
></cosmoz-omnitable-settings>`)}
|
|
@@ -30,5 +27,4 @@ const renderHeader = ({ allSelected, onAllCheckboxChange, sortAndGroup, dataIsVa
|
|
|
30
27
|
></cosmoz-omnitable-header-row>
|
|
31
28
|
</div>
|
|
32
29
|
</sort-and-group-provider>`;
|
|
33
|
-
exports.renderHeader = renderHeader;
|
|
34
30
|
//# sourceMappingURL=render-header.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export function renderList(header: any, list: any): import("lit-html"
|
|
1
|
+
export function renderList(header: any, list: any): import("lit-html").TemplateResult<1>;
|
|
2
2
|
//# sourceMappingURL=render-list.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-list.d.ts","sourceRoot":"","sources":["../../src/lib/render-list.js"],"names":[],"mappings":"AAMO,
|
|
1
|
+
{"version":3,"file":"render-list.d.ts","sourceRoot":"","sources":["../../src/lib/render-list.js"],"names":[],"mappings":"AAMO,yFAiFN"}
|
package/dist/lib/render-list.js
CHANGED
|
@@ -1,40 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const
|
|
6
|
-
const lit_html_1 = require("lit-html");
|
|
7
|
-
const when_js_1 = require("lit-html/directives/when.js");
|
|
8
|
-
const renderList = (header, list) => {
|
|
1
|
+
import '../cosmoz-omnitable-skeleton.js';
|
|
2
|
+
import { _ } from '@neovici/cosmoz-i18next';
|
|
3
|
+
import { html } from 'lit-html';
|
|
4
|
+
import { when } from 'lit-html/directives/when.js';
|
|
5
|
+
export const renderList = (header, list) => {
|
|
9
6
|
const { settingsConfig } = header, { processedItems, dataIsValid, filterIsTooStrict, loading, displayEmptyGroups, compareItemsFn, setSelectedItems, renderItem, renderGroup, error, } = list;
|
|
10
|
-
return
|
|
7
|
+
return html `${when(!loading && !dataIsValid && !error, () => html `<div class="tableContent-empty">
|
|
11
8
|
<slot name="empty-set-message">
|
|
12
9
|
<iron-icon icon="icons:announcement"></iron-icon>
|
|
13
10
|
<div class="tableContent-empty-message">
|
|
14
|
-
<h3>${
|
|
15
|
-
<p>${
|
|
11
|
+
<h3>${_('Working set empty')}</h3>
|
|
12
|
+
<p>${_('No data to display')}</p>
|
|
16
13
|
</div>
|
|
17
14
|
</slot>
|
|
18
15
|
</div>`)}
|
|
19
|
-
${
|
|
16
|
+
${when(filterIsTooStrict, () => html `<div class="tableContent-empty">
|
|
20
17
|
<iron-icon icon="icons:announcement"></iron-icon>
|
|
21
18
|
<div>
|
|
22
|
-
<h3>${
|
|
23
|
-
<p>${
|
|
19
|
+
<h3>${_('Filter too strict')}</h3>
|
|
20
|
+
<p>${_('No matches for selection')}</p>
|
|
24
21
|
</div>
|
|
25
22
|
</div>`)}
|
|
26
|
-
${
|
|
23
|
+
${when(loading && !processedItems.length, () => html `<div class="tableContent-empty overlay">
|
|
27
24
|
<cosmoz-omnitable-skeleton
|
|
28
25
|
.settingsConfig=${settingsConfig}
|
|
29
26
|
></cosmoz-omnitable-skeleton>
|
|
30
27
|
</div>`)}
|
|
31
|
-
${
|
|
28
|
+
${when(loading && processedItems.length, () => html `<div class="tableContent-empty overlay spinner">
|
|
32
29
|
<cz-spinner></cz-spinner>
|
|
33
30
|
</div>`)}
|
|
34
|
-
${
|
|
31
|
+
${when(error, () => html `<div class="tableContent-empty overlay">
|
|
35
32
|
<iron-icon icon="icons:error"></iron-icon>
|
|
36
33
|
<div class="tableContent-empty-message">
|
|
37
|
-
<h3>${
|
|
34
|
+
<h3>${_('Error loading data')}</h3>
|
|
38
35
|
<p>${error.message}</p>
|
|
39
36
|
</div>
|
|
40
37
|
</div>`)}
|
|
@@ -51,5 +48,4 @@ const renderList = (header, list) => {
|
|
|
51
48
|
<slot name="extraContent"></slot>
|
|
52
49
|
</div>`;
|
|
53
50
|
};
|
|
54
|
-
exports.renderList = renderList;
|
|
55
51
|
//# sourceMappingURL=render-list.js.map
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.saveAsCsvAction = void 0;
|
|
4
|
-
const file_saver_es_1 = require("file-saver-es");
|
|
1
|
+
import { saveAs } from 'file-saver-es';
|
|
5
2
|
const makeCsvField = (str) => {
|
|
6
3
|
const result = str.replace(/"/gu, '""');
|
|
7
4
|
if (result.search(/("|,|\n)/gu) >= 0) {
|
|
@@ -9,7 +6,7 @@ const makeCsvField = (str) => {
|
|
|
9
6
|
}
|
|
10
7
|
return str;
|
|
11
8
|
};
|
|
12
|
-
const saveAsCsvAction = (columns, selectedItems, csvFilename) => {
|
|
9
|
+
export const saveAsCsvAction = (columns, selectedItems, csvFilename) => {
|
|
13
10
|
const separator = ';', lf = '\n', header = columns.map((col) => makeCsvField(col.title)).join(separator) + lf, rows = selectedItems.map((item) => {
|
|
14
11
|
return (columns
|
|
15
12
|
.map((column) => {
|
|
@@ -22,9 +19,8 @@ const saveAsCsvAction = (columns, selectedItems, csvFilename) => {
|
|
|
22
19
|
.join(separator) + lf);
|
|
23
20
|
});
|
|
24
21
|
rows.unshift(header);
|
|
25
|
-
|
|
22
|
+
saveAs(new File(rows, csvFilename, {
|
|
26
23
|
type: 'text/csv;charset=utf-8',
|
|
27
24
|
}));
|
|
28
25
|
};
|
|
29
|
-
exports.saveAsCsvAction = saveAsCsvAction;
|
|
30
26
|
//# sourceMappingURL=save-as-csv-action.js.map
|
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const file_saver_es_1 = require("file-saver-es");
|
|
5
|
-
const nullxlsx_1 = require("@neovici/nullxlsx");
|
|
6
|
-
const prepareXlsxData = (columns, selectedItems) => {
|
|
1
|
+
import { saveAs } from 'file-saver-es';
|
|
2
|
+
import { NullXlsx } from '@neovici/nullxlsx';
|
|
3
|
+
export const prepareXlsxData = (columns, selectedItems) => {
|
|
7
4
|
const headers = columns.map((col) => col.title), data = selectedItems.map((item) => columns.map((column) => {
|
|
8
5
|
const value = column.toXlsxValue(column, item);
|
|
9
6
|
return value == null ? '' : value;
|
|
@@ -11,12 +8,11 @@ const prepareXlsxData = (columns, selectedItems) => {
|
|
|
11
8
|
data.unshift(headers);
|
|
12
9
|
return data;
|
|
13
10
|
}, saveAsXlsxAction = (columns, selectedItems, xlsxFilename, xlsxSheetname) => {
|
|
14
|
-
const data =
|
|
11
|
+
const data = prepareXlsxData(columns, selectedItems), xlsx = new NullXlsx(xlsxFilename)
|
|
15
12
|
.addSheetFromData(data, xlsxSheetname)
|
|
16
13
|
.generate();
|
|
17
|
-
|
|
14
|
+
saveAs(new File([xlsx], xlsxFilename, {
|
|
18
15
|
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
|
19
16
|
}));
|
|
20
17
|
};
|
|
21
|
-
exports.prepareXlsxData = prepareXlsxData, exports.saveAsXlsxAction = saveAsXlsxAction;
|
|
22
18
|
//# sourceMappingURL=save-as-xlsx-action.js.map
|
|
@@ -1,65 +1,27 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
-
var ownKeys = function(o) {
|
|
20
|
-
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
-
var ar = [];
|
|
22
|
-
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
-
return ar;
|
|
24
|
-
};
|
|
25
|
-
return ownKeys(o);
|
|
26
|
-
};
|
|
27
|
-
return function (mod) {
|
|
28
|
-
if (mod && mod.__esModule) return mod;
|
|
29
|
-
var result = {};
|
|
30
|
-
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
-
__setModuleDefault(result, mod);
|
|
32
|
-
return result;
|
|
33
|
-
};
|
|
34
|
-
})();
|
|
35
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
-
};
|
|
38
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
|
-
const pion_1 = require("@pionjs/pion");
|
|
40
|
-
const cosmoz_i18next_1 = require("@neovici/cosmoz-i18next");
|
|
41
|
-
const template_1 = require("@neovici/cosmoz-utils/template");
|
|
42
|
-
const use_floating_1 = require("@neovici/cosmoz-dropdown/use-floating");
|
|
43
|
-
require("@neovici/cosmoz-collapse");
|
|
44
|
-
const cosmoz_omnitable_sort_group_1 = require("./cosmoz-omnitable-sort-group");
|
|
45
|
-
const style_css_1 = __importStar(require("./style.css"));
|
|
46
|
-
const use_settings_ui_1 = __importDefault(require("./use-settings-ui"));
|
|
47
|
-
const icons_1 = require("../icons");
|
|
48
|
-
const when_js_1 = require("lit-html/directives/when.js");
|
|
49
|
-
const cosmoz_utils_1 = require("@neovici/cosmoz-utils");
|
|
1
|
+
import { html, component } from '@pionjs/pion';
|
|
2
|
+
import { _ } from '@neovici/cosmoz-i18next';
|
|
3
|
+
import { isEmpty } from '@neovici/cosmoz-utils/template';
|
|
4
|
+
import { defaultMiddleware, size } from '@neovici/cosmoz-dropdown/use-floating';
|
|
5
|
+
import '@neovici/cosmoz-collapse';
|
|
6
|
+
import { sort, group } from './cosmoz-omnitable-sort-group';
|
|
7
|
+
import style, { dropdown as dropdownStyle } from './style.css';
|
|
8
|
+
import useSettingsUi from './use-settings-ui';
|
|
9
|
+
import { close, pull, arrow } from '../icons';
|
|
10
|
+
import { when } from 'lit-html/directives/when.js';
|
|
11
|
+
import { sheet } from '@neovici/cosmoz-utils';
|
|
50
12
|
const middleware = [
|
|
51
|
-
|
|
13
|
+
size({
|
|
52
14
|
apply({ availableHeight, elements }) {
|
|
53
15
|
Object.assign(elements.floating.style, {
|
|
54
16
|
maxHeight: `${Math.max(0, availableHeight)}px`,
|
|
55
17
|
});
|
|
56
18
|
},
|
|
57
19
|
}),
|
|
58
|
-
...
|
|
20
|
+
...defaultMiddleware,
|
|
59
21
|
];
|
|
60
22
|
const renderItem = ({ onDragStart, onDragEnter, onDragOver, onDragLeave, onDrop, onDown, onToggle, collapsed, filters, }) => (column, i) => {
|
|
61
23
|
const indeterminate = !!collapsed?.find((c) => c.name === column.name), checked = !column.disabled && !indeterminate;
|
|
62
|
-
return
|
|
24
|
+
return html ` <div
|
|
63
25
|
class="item"
|
|
64
26
|
data-index=${i}
|
|
65
27
|
@mousedown=${onDown}
|
|
@@ -70,8 +32,8 @@ const renderItem = ({ onDragStart, onDragEnter, onDragOver, onDragLeave, onDrop,
|
|
|
70
32
|
@dragleave=${onDragLeave}
|
|
71
33
|
@drop=${onDrop}
|
|
72
34
|
>
|
|
73
|
-
<button class="pull">${
|
|
74
|
-
<label class="title" ?has-filter=${!
|
|
35
|
+
<button class="pull">${pull}</button>
|
|
36
|
+
<label class="title" ?has-filter=${!isEmpty(filters[column.name]?.filter)}
|
|
75
37
|
>${column.title}</label
|
|
76
38
|
>
|
|
77
39
|
<input
|
|
@@ -84,9 +46,9 @@ const renderItem = ({ onDragStart, onDragEnter, onDragOver, onDragLeave, onDrop,
|
|
|
84
46
|
</div>`;
|
|
85
47
|
};
|
|
86
48
|
const SettingsUI = (host) => {
|
|
87
|
-
const { settings, settingsId, onSave, onReset, hasChanges, opened, setOpened, ...thru } = (
|
|
88
|
-
return
|
|
89
|
-
${
|
|
49
|
+
const { settings, settingsId, onSave, onReset, hasChanges, opened, setOpened, ...thru } = useSettingsUi(host);
|
|
50
|
+
return html ` <div class="headline">
|
|
51
|
+
${_('Sort and filter')}
|
|
90
52
|
<button
|
|
91
53
|
class="close"
|
|
92
54
|
@click=${(e) => {
|
|
@@ -95,7 +57,7 @@ const SettingsUI = (host) => {
|
|
|
95
57
|
tg?.blur();
|
|
96
58
|
}}
|
|
97
59
|
>
|
|
98
|
-
${
|
|
60
|
+
${close}
|
|
99
61
|
</button>
|
|
100
62
|
</div>
|
|
101
63
|
|
|
@@ -106,7 +68,7 @@ const SettingsUI = (host) => {
|
|
|
106
68
|
@click=${() => setOpened((c) => ({ ...c, columns: !c.columns }))}
|
|
107
69
|
part="columns columns-heading"
|
|
108
70
|
>
|
|
109
|
-
${
|
|
71
|
+
${_('Columns')} ${arrow}
|
|
110
72
|
</div>
|
|
111
73
|
<cosmoz-collapse
|
|
112
74
|
?opened="${opened.columns}"
|
|
@@ -120,9 +82,9 @@ const SettingsUI = (host) => {
|
|
|
120
82
|
?data-opened=${opened.sort}
|
|
121
83
|
@click=${() => setOpened((c) => ({ ...c, sort: !c.sort }))}
|
|
122
84
|
>
|
|
123
|
-
${
|
|
85
|
+
${_('Sort on')} ${arrow}
|
|
124
86
|
</div>
|
|
125
|
-
<cosmoz-collapse ?opened=${opened.sort}> ${
|
|
87
|
+
<cosmoz-collapse ?opened=${opened.sort}> ${sort()} </cosmoz-collapse>
|
|
126
88
|
|
|
127
89
|
<div
|
|
128
90
|
class="heading"
|
|
@@ -130,33 +92,33 @@ const SettingsUI = (host) => {
|
|
|
130
92
|
@click=${() => setOpened((c) => ({ ...c, group: !c.group }))}
|
|
131
93
|
part="groups groups-heading"
|
|
132
94
|
>
|
|
133
|
-
${
|
|
95
|
+
${_('Group on')} ${arrow}
|
|
134
96
|
</div>
|
|
135
97
|
<cosmoz-collapse ?opened=${opened.group} part="groups groups-heading"
|
|
136
|
-
>${
|
|
98
|
+
>${group()}</cosmoz-collapse
|
|
137
99
|
>
|
|
138
100
|
</div>
|
|
139
101
|
|
|
140
|
-
${
|
|
102
|
+
${when(settingsId, () => html `<div class="buttons">
|
|
141
103
|
<button
|
|
142
104
|
class="button reset"
|
|
143
105
|
@click=${onReset}
|
|
144
106
|
?disabled=${!hasChanges}
|
|
145
107
|
>
|
|
146
|
-
${
|
|
108
|
+
${_('Reset')}
|
|
147
109
|
</button>
|
|
148
110
|
<button class="button" @click=${onSave} ?disabled=${!hasChanges}>
|
|
149
|
-
${
|
|
111
|
+
${_('Save')}
|
|
150
112
|
</button>
|
|
151
113
|
</div>`)}`;
|
|
152
114
|
};
|
|
153
|
-
customElements.define('cosmoz-omnitable-settings-ui',
|
|
154
|
-
const Settings = ({ config, newLayout }) =>
|
|
115
|
+
customElements.define('cosmoz-omnitable-settings-ui', component(SettingsUI, { styleSheets: [sheet(style)] }));
|
|
116
|
+
const Settings = ({ config, newLayout }) => html `
|
|
155
117
|
<cosmoz-dropdown
|
|
156
118
|
.placement="${newLayout ? 'bottom-start' : 'bottom-end'}"
|
|
157
119
|
.middleware="${middleware}"
|
|
158
120
|
>
|
|
159
|
-
${
|
|
121
|
+
${when(newLayout, () => html `<div class="headerDots" slot="button">...</div>`, () => html ` <svg
|
|
160
122
|
viewBox="0 0 24 24"
|
|
161
123
|
width="24"
|
|
162
124
|
slot="button"
|
|
@@ -166,12 +128,12 @@ const Settings = ({ config, newLayout }) => (0, pion_1.html) `
|
|
|
166
128
|
<circle cx="10" cy="12" r="2"></circle>
|
|
167
129
|
<circle cx="10" cy="6" r="2"></circle>
|
|
168
130
|
</svg>`)}
|
|
169
|
-
${
|
|
131
|
+
${when(config?.badge, () => html `<div class="badge" slot="button"></div>`)}
|
|
170
132
|
<cosmoz-omnitable-settings-ui
|
|
171
133
|
exportparts="columns, groups"
|
|
172
134
|
.config=${config}
|
|
173
135
|
></cosmoz-omnitable-settings-ui>
|
|
174
136
|
</cosmoz-dropdown>
|
|
175
137
|
`;
|
|
176
|
-
customElements.define('cosmoz-omnitable-settings',
|
|
138
|
+
customElements.define('cosmoz-omnitable-settings', component(Settings, { styleSheets: [sheet(dropdownStyle)] }));
|
|
177
139
|
//# sourceMappingURL=cosmoz-omnitable-settings.js.map
|
|
@@ -4,11 +4,11 @@ export function render({ column, on, descending, setOn, setDescending }: {
|
|
|
4
4
|
descending: any;
|
|
5
5
|
setOn: any;
|
|
6
6
|
setDescending: any;
|
|
7
|
-
}):
|
|
7
|
+
}): import("lit-html").TemplateResult<1>;
|
|
8
8
|
export function renderAll({ columns, ...thru }: {
|
|
9
9
|
[x: string]: any;
|
|
10
10
|
columns: any;
|
|
11
11
|
}): any;
|
|
12
|
-
export function group():
|
|
13
|
-
export function sort():
|
|
12
|
+
export function group(): import("lit-html").TemplateResult<1>;
|
|
13
|
+
export function sort(): import("lit-html").TemplateResult<1>;
|
|
14
14
|
//# sourceMappingURL=cosmoz-omnitable-sort-group.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cosmoz-omnitable-sort-group.d.ts","sourceRoot":"","sources":["../../../src/lib/settings/cosmoz-omnitable-sort-group.js"],"names":[],"mappings":"AAIO;;;;;;
|
|
1
|
+
{"version":3,"file":"cosmoz-omnitable-sort-group.d.ts","sourceRoot":"","sources":["../../../src/lib/settings/cosmoz-omnitable-sort-group.js"],"names":[],"mappings":"AAIO;;;;;;yCAwBN;AAEM;;;QAC+C;AAE/C,8DAmBN;AAEM,6DAmBN"}
|
|
@@ -1,15 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const
|
|
5
|
-
const if_defined_js_1 = require("lit-html/directives/if-defined.js");
|
|
6
|
-
const icons_1 = require("../icons");
|
|
7
|
-
const render = ({ column, on, descending, setOn, setDescending }) => {
|
|
1
|
+
import { html } from '@pionjs/pion';
|
|
2
|
+
import { ifDefined } from 'lit-html/directives/if-defined.js';
|
|
3
|
+
import { triangle } from '../icons';
|
|
4
|
+
export const render = ({ column, on, descending, setOn, setDescending }) => {
|
|
8
5
|
const { name, title } = column ?? {};
|
|
9
|
-
return
|
|
6
|
+
return html `<button
|
|
10
7
|
class="sg"
|
|
11
8
|
title=${title}
|
|
12
|
-
data-on=${
|
|
9
|
+
data-on=${ifDefined((name === on && (descending ? 'desc' : 'asc')) || undefined)}
|
|
13
10
|
@click=${(e) => {
|
|
14
11
|
const on = e.currentTarget?.dataset.on;
|
|
15
12
|
if (!on) {
|
|
@@ -25,16 +22,14 @@ const render = ({ column, on, descending, setOn, setDescending }) => {
|
|
|
25
22
|
}
|
|
26
23
|
}}
|
|
27
24
|
>
|
|
28
|
-
<span>${title}</span> ${
|
|
25
|
+
<span>${title}</span> ${triangle}
|
|
29
26
|
</button>`;
|
|
30
27
|
};
|
|
31
|
-
|
|
32
|
-
const
|
|
33
|
-
exports.renderAll = renderAll;
|
|
34
|
-
const group = () => (0, pion_1.html) `
|
|
28
|
+
export const renderAll = ({ columns, ...thru }) => columns?.map((column) => render({ column, ...thru }));
|
|
29
|
+
export const group = () => html `
|
|
35
30
|
<sort-and-group-consumer
|
|
36
31
|
class="sgs"
|
|
37
|
-
.render=${({ columns, groupOn: on, setGroupOn: setOn, groupOnDescending: descending, setGroupOnDescending: setDescending, } = {}) =>
|
|
32
|
+
.render=${({ columns, groupOn: on, setGroupOn: setOn, groupOnDescending: descending, setGroupOnDescending: setDescending, } = {}) => renderAll({
|
|
38
33
|
columns: columns?.filter?.((c) => c['groupOn']),
|
|
39
34
|
on,
|
|
40
35
|
setOn,
|
|
@@ -44,11 +39,10 @@ const group = () => (0, pion_1.html) `
|
|
|
44
39
|
>
|
|
45
40
|
</sort-and-group-consumer>
|
|
46
41
|
`;
|
|
47
|
-
|
|
48
|
-
const sort = () => (0, pion_1.html) `
|
|
42
|
+
export const sort = () => html `
|
|
49
43
|
<sort-and-group-consumer
|
|
50
44
|
class="sgs"
|
|
51
|
-
.render=${({ columns, sortOn: on, setSortOn: setOn, descending, setDescending, } = {}) =>
|
|
45
|
+
.render=${({ columns, sortOn: on, setSortOn: setOn, descending, setDescending, } = {}) => renderAll({
|
|
52
46
|
columns: columns?.filter?.((c) => c['sortOn']),
|
|
53
47
|
on,
|
|
54
48
|
setOn,
|
|
@@ -58,5 +52,4 @@ const sort = () => (0, pion_1.html) `
|
|
|
58
52
|
>
|
|
59
53
|
</sort-and-group-consumer>
|
|
60
54
|
`;
|
|
61
|
-
exports.sort = sort;
|
|
62
55
|
//# sourceMappingURL=cosmoz-omnitable-sort-group.js.map
|
|
@@ -1,4 +1,12 @@
|
|
|
1
|
-
export const DriverContext:
|
|
2
|
-
|
|
1
|
+
export const DriverContext: import("@pionjs/pion/lib/create-context").Context<({ prefix }?: {
|
|
2
|
+
prefix?: string | undefined;
|
|
3
|
+
}) => {
|
|
4
|
+
write: (settingsId: any, settings: any) => Promise<void>;
|
|
5
|
+
read: (settingsId: any) => Promise<any>;
|
|
6
|
+
}>;
|
|
7
|
+
export function useDriver(): {
|
|
8
|
+
write: (settingsId: any, settings: any) => Promise<void>;
|
|
9
|
+
read: (settingsId: any) => Promise<any>;
|
|
10
|
+
};
|
|
3
11
|
export function registerProvider(): void;
|
|
4
12
|
//# sourceMappingURL=context.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/lib/settings/drivers/context.js"],"names":[],"mappings":"AAGa
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/lib/settings/drivers/context.js"],"names":[],"mappings":"AAGa;;;;;GAAoC;AAA1C;;;EAYL;AAZK,yCAYL"}
|
|
@@ -1,18 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
exports.registerProvider = exports.useDriver = exports.DriverContext = void 0;
|
|
7
|
-
const pion_1 = require("@pionjs/pion");
|
|
8
|
-
const local_1 = __importDefault(require("./local"));
|
|
9
|
-
const useDriver = () => {
|
|
10
|
-
const driver = (0, pion_1.useContext)(exports.DriverContext);
|
|
11
|
-
return (0, pion_1.useMemo)(() => driver(), [driver]);
|
|
1
|
+
import { createContext, useContext, useMemo } from '@pionjs/pion';
|
|
2
|
+
import local from './local';
|
|
3
|
+
export const DriverContext = createContext(local), useDriver = () => {
|
|
4
|
+
const driver = useContext(DriverContext);
|
|
5
|
+
return useMemo(() => driver(), [driver]);
|
|
12
6
|
}, registerProvider = () => {
|
|
13
7
|
if (customElements.get('omnitable-settings-driver-provider'))
|
|
14
8
|
return;
|
|
15
|
-
customElements.define('omnitable-settings-driver-provider',
|
|
9
|
+
customElements.define('omnitable-settings-driver-provider', DriverContext.Provider);
|
|
16
10
|
};
|
|
17
|
-
exports.DriverContext = (0, pion_1.createContext)(local_1.default), exports.useDriver = useDriver, exports.registerProvider = registerProvider;
|
|
18
11
|
//# sourceMappingURL=context.js.map
|
|
@@ -1,26 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
17
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
18
|
-
};
|
|
19
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
-
exports.remote = exports.local = void 0;
|
|
21
|
-
__exportStar(require("./context"), exports);
|
|
22
|
-
var local_1 = require("./local");
|
|
23
|
-
Object.defineProperty(exports, "local", { enumerable: true, get: function () { return __importDefault(local_1).default; } });
|
|
24
|
-
var remote_1 = require("./remote");
|
|
25
|
-
Object.defineProperty(exports, "remote", { enumerable: true, get: function () { return __importDefault(remote_1).default; } });
|
|
1
|
+
export * from './context';
|
|
2
|
+
export { default as local } from './local';
|
|
3
|
+
export { default as remote } from './remote';
|
|
26
4
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.default = ({ prefix = '', get$, post$ } = {}) => {
|
|
1
|
+
export default ({ prefix = '', get$, post$ } = {}) => {
|
|
4
2
|
const read = async (settingsId) => {
|
|
5
3
|
try {
|
|
6
4
|
return await get$(prefix + settingsId);
|
|
@@ -1,10 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.useSettings = void 0;
|
|
7
|
-
require("./cosmoz-omnitable-settings");
|
|
8
|
-
var use_settings_1 = require("./use-settings");
|
|
9
|
-
Object.defineProperty(exports, "useSettings", { enumerable: true, get: function () { return __importDefault(use_settings_1).default; } });
|
|
1
|
+
import './cosmoz-omnitable-settings';
|
|
2
|
+
export { default as useSettings } from './use-settings';
|
|
10
3
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.normalizeStore = exports.normalizeColumns = exports.sgProps = void 0;
|
|
4
|
-
const object_1 = require("@neovici/cosmoz-utils/object");
|
|
5
|
-
exports.sgProps = ['sortOn', 'descending', 'groupOn', 'groupOnDescending'];
|
|
1
|
+
import { props } from '@neovici/cosmoz-utils/object';
|
|
2
|
+
export const sgProps = ['sortOn', 'descending', 'groupOn', 'groupOnDescending'];
|
|
6
3
|
const byName = (name) => (item) => item.name === name;
|
|
7
|
-
const normalizeColumns = (columns = [], settings = [], savedSettings = []) => {
|
|
4
|
+
export const normalizeColumns = (columns = [], settings = [], savedSettings = []) => {
|
|
8
5
|
const _settings = settings.filter((setting) => columns.some(byName(setting.name))), cols = columns.filter((column) => !settings.some(byName(column.name)) &&
|
|
9
6
|
!savedSettings.some(byName(column.name))), _savedSettings = savedSettings.filter((column) => !settings.some(byName(column.name)));
|
|
10
7
|
return [
|
|
@@ -33,20 +30,18 @@ const normalizeColumns = (columns = [], settings = [], savedSettings = []) => {
|
|
|
33
30
|
}),
|
|
34
31
|
];
|
|
35
32
|
};
|
|
36
|
-
|
|
37
|
-
const normalizeStore = (settings, current) => ({
|
|
33
|
+
export const normalizeStore = (settings, current) => ({
|
|
38
34
|
...current,
|
|
39
|
-
...
|
|
40
|
-
columns: settings.columns?.map(
|
|
35
|
+
...props(sgProps)(settings),
|
|
36
|
+
columns: settings.columns?.map(props(['name', 'priority', 'width', 'flex', 'disabled'])),
|
|
41
37
|
});
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
const init = Object.fromEntries(exports.sgProps.flatMap((k) => (initial[k] != null ? [[k, initial[k]]] : [])));
|
|
38
|
+
export default ({ columns, settings, savedSettings, initial }) => {
|
|
39
|
+
const init = Object.fromEntries(sgProps.flatMap((k) => (initial[k] != null ? [[k, initial[k]]] : [])));
|
|
45
40
|
return {
|
|
46
41
|
...init,
|
|
47
|
-
...
|
|
42
|
+
...props(sgProps)(savedSettings),
|
|
48
43
|
...settings,
|
|
49
|
-
columns:
|
|
44
|
+
columns: normalizeColumns(columns, settings?.columns, savedSettings?.columns),
|
|
50
45
|
};
|
|
51
46
|
};
|
|
52
47
|
//# sourceMappingURL=normalize.js.map
|
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
const cosmoz_utils_1 = require("@neovici/cosmoz-utils");
|
|
5
|
-
const cosmoz_omnitable_styles_1 = require("../../cosmoz-omnitable-styles");
|
|
6
|
-
exports.default = (0, cosmoz_utils_1.tagged) `
|
|
1
|
+
import { tagged as css } from '@neovici/cosmoz-utils';
|
|
2
|
+
import { checkbox } from '../../cosmoz-omnitable-styles';
|
|
3
|
+
export default css `
|
|
7
4
|
:host {
|
|
8
5
|
box-sizing: border-box;
|
|
9
6
|
display: flex;
|
|
@@ -130,7 +127,7 @@ exports.default = (0, cosmoz_utils_1.tagged) `
|
|
|
130
127
|
.title[has-filter] {
|
|
131
128
|
font-weight: bold;
|
|
132
129
|
}
|
|
133
|
-
${
|
|
130
|
+
${checkbox}
|
|
134
131
|
.checkbox {
|
|
135
132
|
margin: 4px 0;
|
|
136
133
|
}
|
|
@@ -211,7 +208,7 @@ exports.default = (0, cosmoz_utils_1.tagged) `
|
|
|
211
208
|
transform: scaleY(-1);
|
|
212
209
|
}
|
|
213
210
|
`;
|
|
214
|
-
|
|
211
|
+
export const dropdown = css `
|
|
215
212
|
:host {
|
|
216
213
|
display: contents;
|
|
217
214
|
color: var(
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
declare function _default(settingsId: any, settings: any, setSettings: any, onReset: any): {
|
|
2
2
|
settingsId: any;
|
|
3
3
|
savedSettings: any;
|
|
4
|
-
onSave:
|
|
5
|
-
onReset: any
|
|
4
|
+
onSave: () => Promise<void>;
|
|
5
|
+
onReset: (e: any) => Promise<void>;
|
|
6
6
|
hasChanges: boolean;
|
|
7
7
|
};
|
|
8
8
|
export default _default;
|