@neovici/cosmoz-omnitable 14.14.2 → 14.15.0

package/cosmoz-omnitable-column-datetime.js

@@ -1,145 +0,0 @@
-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);

package/cosmoz-omnitable-column-list-data.js

@@ -1,141 +0,0 @@
-import { translatable } from '@neovici/cosmoz-i18next';
-import { mixin, Template } from '@neovici/cosmoz-utils';
-
-import { PolymerElement } from '@polymer/polymer/polymer-element';
-import { html } from '@polymer/polymer/lib/utils/html-tag';
-window.Cosmoz = window.Cosmoz || {};
-
-/**
- * @polymer
- * @customElement
- * @appliesMixin translatable
- */
-class OmnitableColumnListData extends translatable(
-	mixin(Template, PolymerElement),
-) {
-	static get template() {
-		return html`
-			<style>
-				:host {
-					display: block;
-				}
-
-				:host a {
-					color: var(--primary-link-color, inherit);
-				}
-
-				[hidden] {
-					display: none;
-				}
-
-				ul {
-					list-style-type: none;
-					margin: 0.3em 0;
-					padding-left: 0;
-				}
-
-				li {
-					text-overflow: ellipsis;
-					overflow: hidden;
-				}
-			</style>
-
-			<ul hidden$="[[ isEmpty(items) ]]">
-				<li>
-					<span>[[ _firstItem(items) ]]</span>
-				</li>
-				<li class="see-more" hidden$="[[_hideExpand(items, _expanded)]]">
-					<a href="#" on-tap="_toggleExpand"
-						>[[ _('and {0} more', _othersCount, t) ]]</a
-					>
-				</li>
-				<template
-					is="dom-repeat"
-					items="[[ _otherItems(items, _expanded) ]]"
-					as="item"
-				>
-					<li>
-						<span class="item">[[ item ]]</span>
-					</li>
-				</template>
-				<li class="see-less" hidden$="[[ _hideCollapse(items, _expanded) ]]">
-					<a href="#" on-tap="_toggleExpand">[[ _('See less', t) ]]</a>
-				</li>
-			</ul>
-		`;
-	}
-
-	static get is() {
-		return 'cosmoz-omnitable-column-list-data';
-	}
-
-	static get properties() {
-		return {
-			items: {
-				type: Array,
-			},
-
-			_expanded: {
-				type: Boolean,
-				value: false,
-			},
-
-			_othersCount: {
-				type: Number,
-				computed: '_computeOthersCount(items)',
-			},
-		};
-	}
-
-	static get observers() {
-		return ['_itemsLengthChanged(items.length)'];
-	}
-
-	_itemsLengthChanged() {
-		requestAnimationFrame(() =>
-			this.dispatchEvent(new CustomEvent('expand', { bubbles: true })),
-		);
-	}
-
-	_firstItem(items) {
-		if (items !== undefined && items !== null && items.length > 0) {
-			return items[0];
-		}
-	}
-
-	_hideExpand(items, expanded) {
-		if (items !== undefined && items.length !== null) {
-			return items.length <= 2 || expanded;
-		}
-		return true;
-	}
-
-	_hideCollapse(items, expanded) {
-		if (items !== undefined && items.length !== null) {
-			return items.length <= 2 || !expanded;
-		}
-		return true;
-	}
-
-	_otherItems(items, expanded) {
-		if (items !== undefined && items !== null) {
-			if (items.length <= 2 || expanded) {
-				return items.slice(1);
-			}
-		}
-	}
-
-	_computeOthersCount(items) {
-		if (items !== undefined && items !== null) {
-			return items.length - 1;
-		}
-	}
-
-	_toggleExpand(event) {
-		this._expanded = !this._expanded;
-		event.stopPropagation();
-		event.preventDefault();
-	}
-}
-
-customElements.define(OmnitableColumnListData.is, OmnitableColumnListData);

package/cosmoz-omnitable-column-list-mixin.js

@@ -1,198 +0,0 @@
-import { prop } from '@neovici/cosmoz-utils/object';
-import { array } from '@neovici/cosmoz-utils/array';
-import { invoke } from '@neovici/cosmoz-utils/function';
-import { get } from '@polymer/polymer/lib/utils/path';
-import { valuesFrom } from './lib/utils-data';
-
-const unique = (values, valueProperty) => {
-		if (!Array.isArray(values)) {
-			return;
-		}
-		const used = [];
-		return values
-			.reduce((acc, cur) => {
-				if (Array.isArray(cur)) {
-					cur.forEach((subcur) => {
-						acc.push(subcur);
-					});
-					return acc;
-				}
-				acc.push(cur);
-				return acc;
-			}, [])
-			.filter((item, index, array) => {
-				if (array.indexOf(item) !== index) {
-					return false;
-				}
-				if (valueProperty) {
-					const value = get(item, valueProperty);
-					if (used.indexOf(value) !== -1) {
-						return false;
-					}
-					used.push(value);
-				}
-				return true;
-			});
-	},
-	toAutocompleteSource = (values, valueProperty, textProperty) => {
-		if (values == null) {
-			return [];
-		}
-
-		if (Array.isArray(values)) {
-			return unique(values, valueProperty);
-		}
-
-		if (typeof values === 'object') {
-			const valProp = valueProperty ?? 'id',
-				textProp = textProperty ?? 'label';
-			return Object.entries(values)
-				.map(([id, label]) => ({
-					[valProp]: id,
-					[textProp]: label,
-				}))
-				.sort((a, b) => {
-					if (a[textProp] < b[textProp]) {
-						return -1;
-					}
-					if (a[textProp] > b[textProp]) {
-						return 1;
-					}
-					return 0;
-				});
-		}
-
-		return [];
-	},
-	getTexts = (item, valuePath, textProperty) =>
-		array(valuePath && get(item, valuePath)).map(prop(textProperty)),
-	getString = ({ valuePath, textProperty }, item) => {
-		return getTexts(item, valuePath, textProperty)
-			.filter((i) => i != null)
-			.join(', ');
-	},
-	toXlsxValue = getString,
-	applyMultiFilter =
-		({ valueProperty, valuePath, emptyValue, emptyProperty }, filters) =>
-		(item) => {
-			const val = prop(valueProperty),
-				values = array(get(item, valuePath));
-			return filters.some(
-				(filter) =>
-					(values.length === 0 &&
-						prop(emptyProperty || valueProperty)(filter) === emptyValue) ||
-					values.some((value) => val(value) === val(filter)),
-			);
-		},
-	onChange = (setState) => (value) =>
-		setState((state) => ({ ...state, filter: value })),
-	onFocus = (setState) => (focused) =>
-		setState((state) => ({ ...state, headerFocused: focused })),
-	onText = (setState) => (text) =>
-		setState((state) => ({ ...state, query: text })),
-	computeValues = (
-		{ emptyValue, emptyLabel, emptyProperty, textProperty, valueProperty },
-		rawSource,
-	) => {
-		const source = toAutocompleteSource(rawSource, valueProperty, textProperty);
-		if (
-			!emptyLabel ||
-			emptyValue === undefined ||
-			!textProperty ||
-			!(emptyProperty || valueProperty) ||
-			!source
-		) {
-			return source;
-		}
-		return [
-			{
-				[textProperty]: emptyLabel,
-				[emptyProperty || valueProperty]: emptyValue,
-			},
-			...source,
-		];
-	},
-	computeSource = (column, data) =>
-		computeValues(column, valuesFrom(data, column.valuePath)),
-	listColumnMixin = (base) =>
-		class extends base {
-			static get properties() {
-				return {
-					textProperty: { type: String },
-					valueProperty: { type: String },
-					emptyLabel: { type: String },
-					emptyValue: { type: Object },
-					emptyProperty: { type: String },
-				};
-			}
-
-			getConfig(column) {
-				return {
-					emptyProperty: column.emptyProperty,
-				};
-			}
-
-			getString(column, item) {
-				return getString(column, item);
-			}
-
-			toXlsxValue(column, item) {
-				return toXlsxValue(column, item);
-			}
-
-			cellTitleFn(column, item) {
-				return getString(column, item);
-			}
-
-			getComparableValue({ valuePath, valueProperty }, item) {
-				const value = get(item, valuePath);
-				if (valueProperty == null) {
-					return value;
-				}
-				const subValues = array(value).reduce((acc, subItem) => {
-					acc.push(get(subItem, valueProperty));
-					return acc;
-				}, []);
-				return subValues.sort().join(' ');
-			}
-
-			getFilterFn(column, filters) {
-				if (!filters || !Array.isArray(filters) || filters.length === 0) {
-					return;
-				}
-
-				return applyMultiFilter(column, filters);
-			}
-
-			serializeFilter(column, filter) {
-				return filter.length === 0 ? null : JSON.stringify(filter);
-			}
-
-			deserializeFilter(column, filter) {
-				return JSON.parse(decodeURIComponent(filter));
-			}
-
-			computeSource(column, data) {
-				return column.externalValues || typeof column.values === 'function'
-					? async (...args) =>
-							computeValues(
-								column,
-								await Promise.resolve(invoke(column.values, ...args)),
-							)
-					: computeSource(column, data);
-			}
-		};
-
-export {
-	unique,
-	getTexts,
-	getString,
-	toXlsxValue,
-	applyMultiFilter,
-	onChange,
-	onFocus,
-	onText,
-	computeSource,
-	toAutocompleteSource,
-	listColumnMixin,
-};

package/cosmoz-omnitable-column-mixin.js

@@ -1,149 +0,0 @@
-import { get } from '@polymer/polymer/lib/utils/path';
-
-export const getString = ({ valuePath }, item) => get(item, valuePath),
-	toXlsxValue = getString,
-	getComparableValue = getString,
-	applySingleFilter =
-		({ valuePath }, filter) =>
-		(item) => {
-			const value = get(item, valuePath);
-			if (value == null) {
-				return false;
-			}
-			return value
-				.toString()
-				.toLowerCase()
-				.trim()
-				.includes(filter.toLowerCase().trim());
-		},
-	serializeFilter = (column, filter) =>
-		filter === '' || filter == null ? null : filter,
-	columnMixin = (base) =>
-		class extends base {
-			static get properties() {
-				return {
-					/**
-					 * Used to indicate that an element using this behavior is a column definition that can be used
-					 * in cosmoz-omnitable
-					 */
-					isOmnitableColumn: { type: Boolean, value: true },
-					title: { type: String },
-					valuePath: { type: String, notify: true },
-					values: { type: Array, notify: true },
-					filter: { type: Object },
-					noLocalFilter: { type: Boolean },
-					/**
-					 * If the column should be disabled until enabled with enabledColumns
-					 */
-					disabled: { type: Boolean, value: false, notify: true },
-					/**
-					 * If true, the column will be editable by using an input element for rendering.
-					 */
-					editable: { type: Boolean, notify: true },
-					/**
-					 * Indicate that the column is loading/performing work
-					 */
-					loading: { type: Boolean, value: false, notify: true },
-					externalValues: { type: Boolean, value: false, notify: true },
-					/**
-					 * Column name for use with enabledColumns
-					 */
-					name: { type: String },
-					sortOn: { type: String },
-					groupOn: { type: String },
-					width: { type: String, value: '75px' },
-					minWidth: { type: String, value: '40px' },
-					flex: { type: String, value: '1' },
-					cellClass: { type: String, value: 'default-cell' },
-					headerCellClass: { type: String, value: 'default-header-cell' },
-					priority: { type: Number, value: 0 },
-					hidden: { type: Boolean, notify: true },
-					preferredDropdownHorizontalAlign: { type: String, value: 'right' },
-					renderHeader: { type: Function },
-					renderCell: { type: Function },
-					renderEditCell: { type: Function },
-					renderGroup: { type: Function },
-
-					/**
-					 * The priority of the column in the mini mode. If missing the column is disabled in the mini mode.
-					 */
-					mini: { type: Number, value: null },
-					/**
-					 * An alternative render to use in mini mode. Takes the same params as `renderCell`.
-					 */
-					renderMini: { type: Function },
-				};
-			}
-
-			static get observers() {
-				return ['notifyFilterChange(filter)'];
-			}
-
-			notifyFilterChange(filter) {
-				if (this.__ownChange) {
-					return;
-				}
-				this.dispatchEvent(
-					new CustomEvent('legacy-filter-changed', {
-						detail: {
-							name: this.name,
-							state: this.legacyFilterToState(filter),
-						},
-						bubbles: true,
-					}),
-				);
-			}
-
-			legacyFilterToState(filter) {
-				return { filter };
-			}
-
-			/**
-			 * Override this in column elements if you need a different default width
-			 */
-
-			// eslint-disable-next-line no-empty-function
-			getFilterFn() {}
-
-			getString(column, item) {
-				return getString(column, item);
-			}
-
-			toXlsxValue(column, item) {
-				return toXlsxValue(column, item);
-			}
-
-			cellTitleFn(column, item) {
-				return getString(column, item);
-			}
-
-			serializeFilter(column, filter) {
-				return serializeFilter(column, filter);
-			}
-
-			deserializeFilter(column, filter) {
-				if (filter == null) {
-					return null;
-				}
-
-				if (typeof filter === 'string') {
-					return window.decodeURIComponent(filter);
-				}
-				return filter;
-			}
-
-			getComparableValue(column, item) {
-				return getComparableValue(column, item);
-			}
-
-			computeSource(column, data) {
-				return data;
-			}
-
-			_propertiesChanged(currentProps, changedProps, oldProps) {
-				super._propertiesChanged(currentProps, changedProps, oldProps);
-				this.dispatchEvent(
-					new CustomEvent('cosmoz-column-prop-changed', { bubbles: true }),
-				);
-			}
-		};