@neovici/cosmoz-omnitable 14.14.2 → 14.15.0

package/dist/cosmoz-omnitable-column-amount.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=cosmoz-omnitable-column-amount.d.ts.map

package/dist/cosmoz-omnitable-column-amount.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-amount.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-amount.js"],"names":[],"mappings":""}

package/dist/cosmoz-omnitable-column-amount.js

@@ -0,0 +1,113 @@
+import '@neovici/cosmoz-input';
+import '@polymer/paper-dropdown-menu/paper-dropdown-menu';
+import './ui-helpers/cosmoz-clear-button';
+import { PolymerElement } from '@polymer/polymer/polymer-element';
+import { html } from 'lit-html';
+import { columnMixin } from './cosmoz-omnitable-column-mixin';
+import { defaultComputeSource } from './lib/utils-data';
+import './lib/cosmoz-omnitable-amount-range-input';
+import { getComparableValue, getCurrency, applySingleFilter, getString, getInputString, toAmount, toHashString, fromHashString, } from './lib/utils-amount';
+import { get } from '@polymer/polymer/lib/utils/path';
+/**
+ * @polymer
+ * @customElement
+ * @appliesMixin columnMixin
+ */
+class OmnitableColumnAmount extends columnMixin(PolymerElement) {
+    static get properties() {
+        return {
+            min: { type: Number, value: null, notify: true },
+            max: { type: Number, value: null, notify: true },
+            limits: { type: Function },
+            locale: { type: String, value: null, notify: true },
+            autoupdate: { type: Boolean, value: false, notify: true },
+            currency: { type: String, notify: true },
+            autodetect: { type: Boolean, value: false, notify: true },
+            rates: { type: Object, notify: true },
+            width: { type: String, value: '70px' },
+            cellClass: { type: String, value: 'amount-cell align-right' },
+            headerCellClass: { type: String, value: 'amount-header-cell' },
+        };
+    }
+    getConfig(column) {
+        return { limits: column.limits };
+    }
+    getFilterFn(column, filter) {
+        const min = getComparableValue({ ...column, valuePath: 'min' }, filter), max = getComparableValue({ ...column, valuePath: 'max' }, filter);
+        if (min == null && max == null) {
+            return;
+        }
+        return applySingleFilter(column, filter);
+    }
+    getString(column, item) {
+        return getString(column, item);
+    }
+    toXlsxValue(column, item) {
+        return getString(column, item);
+    }
+    cellTitleFn(column, item) {
+        return getString(column, item);
+    }
+    getComparableValue(column, item) {
+        return getComparableValue(column, item);
+    }
+    serializeFilter({ rates }, filter) {
+        if (filter == null) {
+            return;
+        }
+        const min = toAmount(rates, filter.min), max = toAmount(rates, filter.max);
+        if (min == null && max == null) {
+            return;
+        }
+        return toHashString(min) + '~' + toHashString(max);
+    }
+    deserializeFilter(column, filter) {
+        if (filter == null || filter === '') {
+            return null;
+        }
+        const matches = filter.match(/^([^~]+)?~([^~]+)?/iu);
+        if (!Array.isArray(matches)) {
+            return null;
+        }
+        return { min: fromHashString(matches[1]), max: fromHashString(matches[2]) };
+    }
+    renderCell(column, { item }) {
+        return html `<span>${column.getString(column, item)}</span>`;
+    }
+    renderEditCell(column, { item }, onItemChange) {
+        const onChange = (event) => onItemChange({
+            amount: event.target.value,
+            currency: get(item, column.valuePath)?.currency,
+        });
+        return html `<cosmoz-input
+			no-label-float
+			type="number"
+			@change=${onChange}
+			.value=${getInputString(column, item)}
+		>
+			<div slot="suffix">${getCurrency(column, item)}</div>
+		</cosmoz-input>`;
+    }
+    renderHeader({ title, min, max, limits, locale, rates, currency, autoupdate, autodetect, }, { filter }, setState, source) {
+        return html `<cosmoz-omnitable-amount-range-input
+			.title=${title}
+			.filter=${filter}
+			.values=${source}
+			.rates=${rates}
+			.min=${min}
+			.max=${max}
+			.limits=${limits}
+			.locale=${locale}
+			.currency=${currency}
+			.autoupdate=${autoupdate}
+			.autodetect=${autodetect}
+			@filter-changed=${({ detail: { value } }) => setState((state) => ({ ...state, filter: value }))}
+			@header-focused-changed=${({ detail: { value } }) => setState((state) => ({ ...state, headerFocused: value }))}
+		></cosmoz-omnitable-amount-range-input>`;
+    }
+    computeSource(column, data) {
+        return defaultComputeSource(column, data);
+    }
+}
+customElements.define('cosmoz-omnitable-column-amount', OmnitableColumnAmount);
+//# sourceMappingURL=cosmoz-omnitable-column-amount.js.map

package/dist/cosmoz-omnitable-column-autocomplete.d.ts

@@ -0,0 +1,6 @@
+export function getComparableValue({ valuePath, textProperty, valueProperty }: {
+    valuePath: any;
+    textProperty: any;
+    valueProperty: any;
+}, item: any): any;
+//# sourceMappingURL=cosmoz-omnitable-column-autocomplete.d.ts.map

package/dist/cosmoz-omnitable-column-autocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-autocomplete.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-autocomplete.js"],"names":[],"mappings":"AAoBO;;;;mBAON"}

package/dist/cosmoz-omnitable-column-autocomplete.js

@@ -0,0 +1,87 @@
+import '@neovici/cosmoz-autocomplete';
+import { PolymerElement } from '@polymer/polymer/polymer-element.js';
+import { html } from 'lit-html';
+import { when } from 'lit-html/directives/when.js';
+import '@neovici/cosmoz-spinner';
+import { columnMixin, getString } from './cosmoz-omnitable-column-mixin.js';
+import { listColumnMixin, onChange, onFocus, onText, } from './cosmoz-omnitable-column-list-mixin';
+import { prop, strProp } from '@neovici/cosmoz-utils/object';
+import { array } from '@neovici/cosmoz-utils/array';
+import { columnSymbol } from './lib/use-dom-columns';
+import { get } from '@polymer/polymer/lib/utils/path';
+export const getComparableValue = ({ valuePath, textProperty, valueProperty }, item) => {
+    const property = textProperty ? strProp(textProperty) : prop(valueProperty), values = array(valuePath && get(item, valuePath)).map(property);
+    return values.length > 1 ? values.filter(Boolean).join(',') : values[0];
+};
+/**
+ * @polymer
+ * @customElement
+ * @appliesMixin columnMixin
+ */
+class OmnitableColumnAutocomplete extends listColumnMixin(columnMixin(PolymerElement)) {
+    static get properties() {
+        return {
+            headerCellClass: { type: String, value: 'autocomplete-header-cell' },
+            minWidth: { type: String, value: '55px' },
+            editMinWidth: { type: String, value: '55px' },
+            keepOpened: { type: Boolean, value: true },
+            keepQuery: { type: Boolean },
+            showSingle: { type: Boolean },
+            preserveOrder: { type: Boolean },
+            limit: { type: Number },
+            textual: { type: Function },
+        };
+    }
+    getConfig(column) {
+        return {
+            ...super.getConfig?.(column),
+            keepOpened: column.keepOpened,
+            keepQuery: column.keepQuery,
+            showSingle: column.showSingle,
+            preserveOrder: column.preserveOrder,
+            limit: column.limit,
+            textual: column.textual,
+        };
+    }
+    renderCell(column, { item }) {
+        return html `<span class="default-column"
+			>${column.getString(column, item)}</span
+		>`;
+    }
+    renderEditCell(column, { item }, onItemChange) {
+        const onChange = (event) => onItemChange(event.target.value);
+        return html `<cosmoz-input
+			no-label-float
+			type="text"
+			@change=${onChange}
+			.value=${getString(column, item)}
+		></cosmoz-input>`;
+    }
+    renderHeader(column, { filter, query }, setState, source) {
+        return html `<cosmoz-autocomplete-ui
+			class="external-values-${column.externalValues}"
+			?keep-opened=${column.keepOpened}
+			?keep-query=${column.keepQuery}
+			?show-single=${column.showSingle}
+			?preserve-order=${column.preserveOrder}
+			.textual=${column.textual}
+			.label=${column.title}
+			.source=${source}
+			.textProperty=${column.textProperty}
+			.valueProperty=${column.valueProperty}
+			.itemRenderer=${column[columnSymbol]?.itemRenderer}
+			.value=${filter}
+			.text=${query}
+			.limit=${column.limit}
+			.onChange=${onChange(setState)}
+			.onFocus=${onFocus(setState)}
+			.onText=${onText(setState)}
+			>${when(column.loading, () => html `<cosmoz-spinner slot="suffix"></cosmoz-spinner>`)}</cosmoz-autocomplete-ui
+		>`;
+    }
+    getComparableValue(column, item) {
+        return getComparableValue(column, item);
+    }
+}
+customElements.define('cosmoz-omnitable-column-autocomplete', OmnitableColumnAutocomplete);
+//# sourceMappingURL=cosmoz-omnitable-column-autocomplete.js.map

package/dist/cosmoz-omnitable-column-boolean.d.ts

@@ -0,0 +1,17 @@
+export function getString({ valuePath, trueLabel, falseLabel }: {
+    valuePath: any;
+    trueLabel: any;
+    falseLabel: any;
+}, item: any): any;
+export function computeItemValue({ valuePath }: {
+    valuePath: any;
+}, item: any, source: any): any;
+export const computeSource: any;
+export function toXlsxValue({ valuePath, trueLabel, falseLabel }: {
+    valuePath: any;
+    trueLabel: any;
+    falseLabel: any;
+}, item: any): any;
+export function onChange(setState: any): (selection: any) => void;
+export function deserializeFilter(column: any, filter: any): any;
+//# sourceMappingURL=cosmoz-omnitable-column-boolean.d.ts.map

package/dist/cosmoz-omnitable-column-boolean.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-boolean.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-boolean.js"],"names":[],"mappings":"AAUA;;;;mBA6CE;AA7CF;;gCA6CE;AAhBD,gCAGE;AAhCH;;;;mBA6CE;AA7CF,0CAU2B,cAAS,UAmClC;AA7CF,iEA6CE"}

package/dist/cosmoz-omnitable-column-boolean.js

@@ -0,0 +1,105 @@
+import { PolymerElement } from '@polymer/polymer/polymer-element';
+import { columnMixin } from './cosmoz-omnitable-column-mixin';
+import '@neovici/cosmoz-autocomplete';
+import { html } from 'lit-html';
+import { when } from 'lit-html/directives/when.js';
+import { get } from '@polymer/polymer/lib/utils/path';
+import { memooize } from '@neovici/cosmoz-utils/memoize';
+const computeValue = (value, source) => source.find(({ value: valueProp }) => value === valueProp), computeTooltip = (title, value, source) => {
+    const val = computeValue(value, source);
+    return val ? val.text : title;
+}, computeItemTooltip = (title, item, valuePath, source) => computeTooltip(title, get(item, valuePath), source), computeItemValue = ({ valuePath }, item, source) => computeValue(get(item, valuePath), source), onChange = (setState) => (selection) => {
+    setState((state) => ({ ...state, filter: selection?.[0]?.value ?? null }));
+}, onFocus = (setState) => (focused) => {
+    setState((state) => ({ ...state, headerFocused: focused }));
+}, onText = (setState) => (text) => {
+    setState((state) => ({ ...state, query: text }));
+}, onEditableChange = (onItemChange) => (selection) => onItemChange(selection?.[0]?.value), getString = ({ valuePath, trueLabel, falseLabel }, item) => {
+    const value = get(item, valuePath);
+    return value ? trueLabel : falseLabel;
+}, applySingleFilter = ({ valuePath }, filter) => (item) => get(item, valuePath) === filter, computeSource = memooize((trueLabel, falseLabel) => [
+    { text: trueLabel, value: true },
+    { text: falseLabel, value: false },
+]), toXlsxValue = ({ valuePath, trueLabel, falseLabel }, item) => {
+    if (!valuePath) {
+        return '';
+    }
+    return get(item, valuePath) ? trueLabel : falseLabel;
+}, deserializeFilter = (column, filter) => {
+    try {
+        return JSON.parse(filter);
+    }
+    catch {
+        return null;
+    }
+};
+/**
+ * @polymer
+ * @customElement
+ * @appliesMixin columnMixin
+ */
+class OmnitableColumnBoolean extends columnMixin(PolymerElement) {
+    static get properties() {
+        return {
+            trueLabel: { type: String, value: 'True' },
+            falseLabel: { type: String, value: 'False' },
+            flex: { type: String, value: '0' },
+            cellClass: { type: String, value: 'boolean-cell' },
+        };
+    }
+    getString(column, item) {
+        return getString(column, item);
+    }
+    renderCell(column, { item }) {
+        return getString(column, item);
+    }
+    cellTitleFn(column, item) {
+        return getString(column, item);
+    }
+    renderEditCell(column, { item }, onItemChange) {
+        const { trueLabel, falseLabel } = column;
+        return html `<cosmoz-autocomplete
+			no-label-float
+			.title=${computeItemTooltip(column.title, item, column.valuePath, computeSource(trueLabel, falseLabel))}
+			.source=${computeSource(trueLabel, falseLabel)}
+			.textProperty=${'text'}
+			.value=${computeItemValue(column, item, computeSource(trueLabel, falseLabel))}
+			.onChange=${onEditableChange(onItemChange)}
+			.limit=${1}
+			>${when(column.loading, () => html `<cosmoz-spinner slot="suffix"></cosmoz-spinner>`)}</cosmoz-autocomplete
+		>`;
+    }
+    renderHeader(column, { filter, query }, setState, source) {
+        return html `<cosmoz-autocomplete-ui
+			.label=${column.title}
+			.title=${computeItemTooltip(column.title, filter, column.valuePath, source)}
+			.source=${source}
+			.textProperty=${'text'}
+			.value=${computeValue(filter, source)}
+			.text=${query}
+			.onChange=${onChange(setState)}
+			.onFocus=${onFocus(setState)}
+			.onText=${onText(setState)}
+			.limit=${1}
+			>${when(column.loading, () => html `<cosmoz-spinner slot="suffix"></cosmoz-spinner>`)}</cosmoz-autocomplete-ui
+		>`;
+    }
+    computeSource({ trueLabel, falseLabel }) {
+        return computeSource(trueLabel, falseLabel);
+    }
+    getFilterFn(column, filter) {
+        if (filter == null) {
+            return;
+        }
+        return applySingleFilter(column, filter);
+    }
+    toXlsxValue(column, item) {
+        return toXlsxValue(column, item);
+    }
+    deserializeFilter(column, filter) {
+        return deserializeFilter(column, filter);
+    }
+}
+customElements.define('cosmoz-omnitable-column-boolean', OmnitableColumnBoolean);
+export { getString, computeItemValue, computeSource, toXlsxValue, onChange, deserializeFilter, };
+//# sourceMappingURL=cosmoz-omnitable-column-boolean.js.map

package/dist/cosmoz-omnitable-column-date.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=cosmoz-omnitable-column-date.d.ts.map

package/dist/cosmoz-omnitable-column-date.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-date.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-date.js"],"names":[],"mappings":""}

package/dist/cosmoz-omnitable-column-date.js

@@ -0,0 +1,97 @@
+import { html } from 'lit-html';
+import { PolymerElement } from '@polymer/polymer/polymer-element';
+import '@polymer/paper-dropdown-menu/paper-dropdown-menu';
+import '@neovici/cosmoz-input';
+import './ui-helpers/cosmoz-clear-button';
+import { columnMixin } from './cosmoz-omnitable-column-mixin';
+import './lib/cosmoz-omnitable-date-range-input';
+import { defaultComputeSource } from './lib/utils-data';
+import { getString, getComparableValue, toDate, toHashString, toXlsxValue, applySingleFilter, getInputString, fromInputString, } from './lib/utils-date';
+class OmnitableColumnDate extends columnMixin(PolymerElement) {
+    static get properties() {
+        return {
+            min: { type: Number, value: null, notify: true },
+            max: { type: Number, value: null, notify: true },
+            limits: { type: Function },
+            locale: { type: String, value: null, notify: true },
+            headerCellClass: { type: String, value: 'date-header-cell' },
+            width: { type: String, value: '100px' },
+            minWidth: { type: String, value: '82px' },
+            flex: { type: String, value: '0' },
+        };
+    }
+    getConfig(column) {
+        return { limits: column.limits };
+    }
+    getFilterFn(column, filter) {
+        const min = getComparableValue({ ...column, valuePath: 'min' }, filter), max = getComparableValue({ ...column, valuePath: 'max' }, filter);
+        if (min == null && max == null) {
+            return;
+        }
+        return applySingleFilter(column, filter);
+    }
+    getString(column, item) {
+        return getString(column, item);
+    }
+    toXlsxValue(column, item) {
+        return toXlsxValue(column, item);
+    }
+    cellTitleFn(column, item) {
+        return getString(column, item);
+    }
+    getComparableValue(column, item) {
+        return getComparableValue(column, item);
+    }
+    serializeFilter(column, filter) {
+        if (filter == null) {
+            return;
+        }
+        const min = toDate(filter.min), max = toDate(filter.max);
+        if (min == null && max == null) {
+            return;
+        }
+        return toHashString(min) + '~' + toHashString(max);
+    }
+    deserializeFilter(column, filter) {
+        if (filter == null || filter === '') {
+            return null;
+        }
+        const matches = filter.match(/^([^~]+)?~([^~]+)?/iu);
+        if (!Array.isArray(matches)) {
+            return null;
+        }
+        return { min: toDate(matches[1]), max: toDate(matches[2]) };
+    }
+    renderCell(column, { item }) {
+        return html `<div class="omnitable-cell-date">
+			${getString(column, item)}
+		</div>`;
+    }
+    renderEditCell(column, { item }, onItemChange) {
+        const onChange = (event) => onItemChange(fromInputString(event.target.value));
+        return html `<cosmoz-input
+			no-label-float
+			type="date"
+			@change=${onChange}
+			.value=${getInputString(column, item)}
+		></cosmoz-input>`;
+    }
+    renderHeader({ title, min, max, limits, locale }, { filter }, setState, source) {
+        return html `<cosmoz-omnitable-date-range-input
+			.title=${title}
+			.filter=${filter}
+			.values=${source}
+			.min=${min}
+			.max=${max}
+			.limits=${limits}
+			.locale=${locale}
+			@filter-changed=${({ detail: { value } }) => setState((state) => ({ ...state, filter: value }))}
+			@header-focused-changed=${({ detail: { value } }) => setState((state) => ({ ...state, headerFocused: value }))}
+		></cosmoz-omnitable-date-range-input>`;
+    }
+    computeSource(column, data) {
+        return defaultComputeSource(column, data);
+    }
+}
+customElements.define('cosmoz-omnitable-column-date', OmnitableColumnDate);
+//# sourceMappingURL=cosmoz-omnitable-column-date.js.map

package/dist/cosmoz-omnitable-column-datetime.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=cosmoz-omnitable-column-datetime.d.ts.map

package/dist/cosmoz-omnitable-column-datetime.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-datetime.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-datetime.js"],"names":[],"mappings":""}

package/dist/cosmoz-omnitable-column-datetime.js

@@ -0,0 +1,106 @@
+import '@polymer/paper-dropdown-menu/paper-dropdown-menu';
+import '@neovici/cosmoz-datetime-input';
+import './ui-helpers/cosmoz-clear-button';
+import { columnMixin } from './cosmoz-omnitable-column-mixin';
+import { PolymerElement } from '@polymer/polymer/polymer-element';
+import { html } from 'lit-html';
+import { fromHashString, getString, toHashString, toXlsxValue, } from './lib/utils-datetime';
+import { applySingleFilter, fromInputString, getComparableValue, toDate, } from './lib/utils-date';
+import { defaultComputeSource } from './lib/utils-data';
+import './lib/cosmoz-omnitable-datetime-range-input';
+/**
+ * @polymer
+ * @customElement
+ * @appliesMixin columnMixin
+ */
+class OmnitableColumnDatetime extends columnMixin(PolymerElement) {
+    static get is() {
+        return 'cosmoz-omnitable-column-datetime';
+    }
+    static get properties() {
+        return {
+            min: { type: Number, value: null, notify: true },
+            max: { type: Number, value: null, notify: true },
+            limits: { type: Function },
+            locale: { type: String, value: null, notify: true },
+            headerCellClass: { type: String, value: 'datetime-header-cell' },
+            width: { type: String, value: '210px' },
+            minWidth: { type: String, value: '128px' },
+            flex: { type: String, value: '0' },
+            filterStep: { type: Number, value: 1 },
+        };
+    }
+    getConfig(column) {
+        return { limits: column.limits };
+    }
+    getFilterFn(column, filter) {
+        const min = getComparableValue({ ...column, valuePath: 'min' }, filter), max = getComparableValue({ ...column, valuePath: 'max' }, filter);
+        if (min == null && max == null) {
+            return;
+        }
+        return applySingleFilter(column, filter);
+    }
+    getString(column, item) {
+        return getString(column, item);
+    }
+    toXlsxValue(column, item) {
+        return toXlsxValue(column, item);
+    }
+    cellTitleFn(column, item) {
+        return getString(column, item);
+    }
+    getComparableValue(column, item) {
+        return getComparableValue(column, item);
+    }
+    serializeFilter(column, filter) {
+        if (filter == null) {
+            return;
+        }
+        const min = toDate(filter.min), max = toDate(filter.max);
+        if (min == null && max == null) {
+            return;
+        }
+        return toHashString(min) + '~' + toHashString(max);
+    }
+    deserializeFilter(column, filter) {
+        if (filter == null || filter === '') {
+            return null;
+        }
+        const matches = filter.match(/^([^~]+)?~([^~]+)?/iu);
+        if (!Array.isArray(matches)) {
+            return null;
+        }
+        return { min: fromHashString(matches[1]), max: fromHashString(matches[2]) };
+    }
+    renderCell(column, { item }) {
+        return getString(column, item);
+    }
+    renderEditCell(column, { item }, onItemChange) {
+        const onChange = (event) => onItemChange(fromInputString(event.target.value));
+        return html `<cosmoz-input
+			no-label-float
+			type="text"
+			@change=${onChange}
+			.value=${getString(column, item)}
+		></cosmoz-input>`;
+    }
+    renderHeader({ title, min, max, limits, locale, filterStep }, { filter }, setState, source) {
+        return html `<cosmoz-omnitable-datetime-range-input
+			.title=${title}
+			.filter=${filter}
+			.values=${source}
+			.min=${min}
+			.max=${max}
+			.limits=${limits}
+			.locale=${locale}
+			.filterStep=${filterStep}
+			@filter-changed=${({ detail: { value } }) => setState((state) => ({ ...state, filter: value }))}
+			@header-focused-changed=${({ detail: { value } }) => setState((state) => ({ ...state, headerFocused: value }))}
+		></cosmoz-omnitable-datetime-range-input>`;
+    }
+    computeSource(column, data) {
+        return defaultComputeSource(column, data);
+    }
+}
+customElements.define(OmnitableColumnDatetime.is, OmnitableColumnDatetime);
+//# sourceMappingURL=cosmoz-omnitable-column-datetime.js.map

package/dist/cosmoz-omnitable-column-list-data.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=cosmoz-omnitable-column-list-data.d.ts.map

package/dist/cosmoz-omnitable-column-list-data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cosmoz-omnitable-column-list-data.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable-column-list-data.js"],"names":[],"mappings":""}