@neovici/cosmoz-omnitable 14.14.3 → 14.15.1

package/lib/cosmoz-omnitable-date-input-mixin.js

@@ -1,182 +0,0 @@
-import { toLocalISOString } from '@neovici/cosmoz-utils/date';
-import { rangeInputMixin } from './cosmoz-omnitable-range-input-mixin';
-
-/**
-* @polymer
-* @mixinFunction
-
-* @param {class} base The base class
-* @returns {class} The base class with the mixin applied
-*/
-export const dateInputMixin = (base) =>
-	/**
-	 * @polymer
-	 * @mixinClass
-	 */
-	class extends rangeInputMixin(base) {
-		static get properties() {
-			return {
-				max: { type: Date, value: null },
-
-				min: { type: Date, value: null },
-
-				_filterText: {
-					type: String,
-					computed: '_computeFilterText(filter.*, formatter)',
-				},
-
-				formatter: { type: Object, computed: '_computeFormatter(locale)' },
-			};
-		}
-
-		/**
-		 * Converts an value to date optionaly limiting it.
-		 *
-		 * @param	 {Date|String} value	 Value to convert to date
-		 * @param	 {Date|String} limit	 Value used to limit the date
-		 * @param	 {Function} limitFunc	 Function used to limit the date (Math.min|Math.max)
-		 * @returns {Date|void} Value converted to date optionaly limitated
-		 */
-		// eslint-disable-next-line max-statements
-		toDate(value, limit, limitFunc) {
-			if (value == null || value === '') {
-				return;
-			}
-
-			// convert value to Date
-			let date = value;
-			if (!(date instanceof Date)) {
-				// if the value is an ISO string, make sure that it has an explicit timezone
-				if (typeof value === 'string') {
-					date = this.getAbsoluteISOString(date);
-				}
-
-				date = new Date(date);
-			}
-
-			if (Number.isNaN(date.getTime())) {
-				return null;
-			}
-
-			if (limitFunc == null || limit == null) {
-				return date;
-			}
-
-			const lDate = this.toDate(limit);
-			if (lDate == null) {
-				return date;
-			}
-
-			const comparableDate = this.getComparableValue(date),
-				comparableLDate = this.getComparableValue(lDate),
-				limitedValue = limitFunc(comparableDate, comparableLDate);
-			return limitedValue === comparableDate ? date : lDate;
-		}
-
-		toValue() {
-			return this.toDate.apply(this, arguments);
-		}
-
-		/**
-		 * Get comparable number from date
-		 *
-		 * @param	 {Object} item			 Item to be processed
-		 * @param	 {String} valuePath	 Property path
-		 * @returns {Number|void} Valid value or void
-		 */
-		getComparableValue(item, valuePath) {
-			const value = super.getComparableValue(item, valuePath);
-			if (value == null) {
-				return;
-			}
-			return this.toNumber(value.getTime());
-		}
-
-		/**
-		 * Get date of item as string
-		 *
-		 * @param	 {Object} item											 Item to be processed
-		 * @param	 {String} valuePath = this.valuePath Property path
-		 * @param	 {Object} formatter = this.formatter Property formatter
-		 * @returns {String}													 Date rendered as string or 'Invalid Date'
-		 */
-		getString(item, valuePath = this.valuePath, formatter = this.formatter) {
-			const value = this.toValue(this.get(valuePath, item));
-			if (value === undefined) {
-				return '';
-			}
-			if (value === null) {
-				return 'Invalid Date';
-			}
-			return this.renderValue(value, formatter);
-		}
-
-		/**
-		 * Computes the local timezone and adds it to a local ISO string
-		 * @param	{String} localISOString an ISO date string, without timezone info
-		 * @return {String}								an ISO date string, with timezone info
-		 */
-		getAbsoluteISOString(localISOString) {
-			// Most browsers use local timezone when no timezone is specified
-			// but Safari uses UTC, so we set it implicitly
-			// TODO: Consider removing this when/if Safari handles local timezone correctly
-			if (localISOString.length === 19) {
-				return localISOString + this._getTimezoneString(localISOString);
-			}
-			return localISOString;
-		}
-
-		/**
-		 * Calculates the local timezone offset and formats it to ISO Timezone string.
-		 * @param	 {String} localISOString an ISO date string
-		 * @return {String}								 the ISO timezone
-		 */
-		_getTimezoneString(localISOString) {
-			const off = -new Date(localISOString).getTimezoneOffset() / 60;
-			return (
-				(off < 0 ? '-' : '+') + ['0', Math.abs(off)].join('').substr(-2) + ':00'
-			);
-		}
-
-		renderValue(value, formatter = this.formatter) {
-			if (formatter == null) {
-				return;
-			}
-			const date = this.toValue(value);
-			if (date == null) {
-				return;
-			}
-			return formatter.format(date);
-		}
-
-		_computeFormatter(locale) {
-			return new Intl.DateTimeFormat(locale || undefined);
-		}
-
-		_toInputString(value) {
-			const date = this.toValue(value);
-			if (date == null) {
-				return null;
-			}
-			return this._toLocalISOString(date).slice(0, 10);
-		}
-
-		_dateValueChanged(event) {
-			const input = event.currentTarget,
-				value = input.value,
-				item = event.model.item,
-				oldValue = this.get(this.valuePath, item),
-				date = this._fromInputString(value);
-			this.set(this.valuePath, date, item);
-			this._fireItemChangeEvent(
-				item,
-				this.valuePath,
-				oldValue,
-				this.renderValue.bind(this),
-			);
-		}
-
-		_toLocalISOString(date) {
-			return toLocalISOString(date);
-		}
-	};

package/lib/cosmoz-omnitable-range-input-mixin.js

@@ -1,451 +0,0 @@
-import { Debouncer } from '@polymer/polymer/lib/utils/debounce.js';
-import { timeOut } from '@polymer/polymer/lib/utils/async.js';
-import { enqueueDebouncer } from '@polymer/polymer/lib/utils/flush.js';
-import { invoke } from '@neovici/cosmoz-utils/function';
-
-const getCloseableParent = (el) =>
-	typeof el.close === 'function' ? el : getCloseableParent(el.parentElement);
-
-/**
- * @polymer
- * @mixinFunction
- * @param {class} base The base class
- * @returns {class} The base class with the mixin applied
- */
-export const rangeInputMixin = (base) =>
-	/**
-	 * @polymer
-	 * @mixinClass
-	 */
-	class extends base {
-		static get properties() {
-			return {
-				filter: { type: Object, notify: true },
-
-				values: {
-					type: Array,
-					value() {
-						return [];
-					},
-				},
-
-				headerFocused: { type: Boolean, notify: true },
-
-				min: { type: Number, value: null },
-
-				max: { type: Number, value: null },
-
-				limits: { type: Function },
-
-				/**
-				 * If true, _limitInput and _updateFilter will be called after each value change
-				 */
-				autoupdate: { type: String, value: true },
-
-				locale: { type: String, value: null },
-
-				_filterInput: {
-					type: Object,
-					value() {
-						return { min: null, max: null };
-					},
-				},
-
-				_range: { type: Object, computed: '_computeRange(values.*)' },
-
-				_limit: {
-					type: Object,
-					computed: '_computeLimit(_range, _filterInput.*, min, max)',
-					value() {
-						return {};
-					},
-				},
-
-				_tooltip: {
-					type: String,
-					computed: '_computeTooltip(title, _filterText)',
-				},
-
-				_fromClasses: {
-					type: String,
-					computed: '_computeInputClasses(_filterInput.min)',
-				},
-
-				_toClasses: {
-					type: String,
-					computed: '_computeInputClasses(_filterInput.max)',
-				},
-			};
-		}
-
-		static get observers() {
-			return [
-				'_filterInputChanged(_filterInput.*, autoupdate)',
-				'_filterChanged(filter.*)',
-				'_updateLimits(limits, headerFocused)',
-			];
-		}
-
-		disconnectedCallback() {
-			if (this._limitInputDebouncer) {
-				this._limitInputDebouncer.cancel();
-			}
-			super.disconnectedCallback();
-		}
-
-		_computeInputClasses(value) {
-			return value != null && value !== '' ? 'has-value' : '';
-		}
-
-		/**
-		 * Converts a value to number optionaly limiting it.
-		 *
-		 * @param	 {Number|*} value	 The value to convert to number
-		 * @param	 {Number|*} limit	 The value used to limit the number
-		 * @param	 {Function} limitFunc	 The function used to limit the number (Math.min|Math.max)
-		 * @returns {Number|void}		 Value converted to Number or void
-		 */
-		toNumber(value, limit, limitFunc) {
-			if (value == null || value === '') {
-				return;
-			}
-			const number = typeof value === 'number' ? value : Number(value);
-			if (Number.isNaN(number)) {
-				return;
-			}
-			if (limitFunc == null || limit == null) {
-				return number;
-			}
-			const lNumber = this.toNumber(limit);
-			if (lNumber == null) {
-				return number;
-			}
-			return limitFunc(number, lNumber);
-		}
-
-		toValue() {
-			return this.toNumber.apply(this, arguments);
-		}
-
-		/**
-		 *	 Get the comparable value of an item.
-		 *
-		 * @param	 {Object} item			 Item to be processed
-		 * @param	 {String} valuePath	 Property path
-		 * @returns {Number|void}			 Valid value or void
-		 */
-		getComparableValue(item, valuePath) {
-			if (item == null) {
-				return;
-			}
-			let value = item;
-			if (valuePath != null) {
-				value = this.get(valuePath, item);
-			}
-			return this.toValue(value);
-		}
-		renderValue() {
-			//overrideable
-		}
-
-		getInputString(item, valuePath = this.valuePath) {
-			const value = this.toValue(this.get(valuePath, item));
-			return this._toInputString(value);
-		}
-
-		/**
-		 * Computes min/max range from values.
-		 *
-		 * @param	 {Object} change `values` property changes
-		 * @returns {Object} Computed min/max
-		 */
-		_computeRange(change) {
-			const allValues = change.base,
-				values =
-					Array.isArray(allValues) &&
-					allValues.length &&
-					allValues.map((v) => this.toValue(v)).filter((n) => n != null);
-
-			if (!values || values.length < 1) {
-				return { min: null, max: null };
-			}
-			return values.reduce((p, n) => {
-				return {
-					min: this.toValue(n, p.min, Math.min),
-					max: this.toValue(n, p.max, Math.max),
-				};
-			}, {});
-		}
-
-		_computeLimit(range, inputChange, min, max) {
-			if (!range) {
-				return;
-			}
-			const input = inputChange.base,
-				nMin = this.toValue(min),
-				nMax = this.toValue(max),
-				aMin = nMin != null ? nMin : this.toValue(range.min),
-				aMax = nMax != null ? nMax : this.toValue(range.max);
-
-			return {
-				fromMin: aMin,
-				fromMax: this.toValue(
-					aMax,
-					this._fromInputString(input.max, 'max'),
-					Math.min,
-				),
-				toMin: this.toValue(
-					aMin,
-					this._fromInputString(input.min, 'min'),
-					Math.max,
-				),
-				toMax: aMax,
-			};
-		}
-
-		_computeFilterText(change) {
-			if (change.base == null) {
-				return undefined;
-			}
-			const filter = change.base,
-				min = this.toValue(filter.min),
-				max = this.toValue(filter.max),
-				text = [];
-
-			if (min != null) {
-				text.push(this.renderValue(min));
-			}
-			text.push(' - ');
-			if (max != null) {
-				text.push(this.renderValue(max));
-			}
-			return text.length > 1 ? text.join('') : undefined;
-		}
-
-		_computeTooltip(title, text) {
-			if (text == null) {
-				return title;
-			}
-			return `${title}: ${text}`;
-		}
-
-		_fromInputString(value) {
-			return this.toValue(value);
-		}
-
-		_toInputString(value) {
-			const val = this.toValue(value);
-			if (val == null) {
-				return null;
-			}
-			return val;
-		}
-
-		_getDefaultFilter() {
-			return { min: null, max: null };
-		}
-
-		/**
-		 * Observes changes of _filterInput, saves the path, debounces _limitInput.
-		 *
-		 * @param	 {Object} change '_filterInput' property changes
-		 * @param	 {Boolean} autoupdate whether to auto-update on value changes
-		 * @returns {void}
-		 */
-		_filterInputChanged(change, autoupdate) {
-			const path = change.path.split('.')[1];
-			this.__inputChangePath = path || null;
-
-			if (!autoupdate) {
-				return;
-			}
-
-			this._limitInputDebouncer = Debouncer.debounce(
-				this._limitInputDebouncer,
-				timeOut.after(600),
-				() => {
-					this._limitInput();
-					this._updateFilter();
-				},
-			);
-			enqueueDebouncer(this._limitInputDebouncer);
-		}
-
-		_clearFrom() {
-			this.set('_filterInput.min', null);
-			this._updateFilter();
-		}
-
-		_clearTo() {
-			this.set('_filterInput.max', null);
-			this._updateFilter();
-		}
-
-		_onBlur() {
-			this._limitInput();
-			this._updateFilter();
-		}
-
-		_onKeyDown(event) {
-			const input = event.currentTarget,
-				inputs = Array.from(
-					input.parentElement.querySelectorAll('cosmoz-input'),
-				),
-				nextInput = inputs[inputs.findIndex((i) => i === input) + 1],
-				isLastInput = !nextInput,
-				isFirstInput = inputs[0] === input;
-
-			switch (event.keyCode) {
-				case 13: // Enter
-					event.preventDefault();
-
-					if (!isLastInput) {
-						nextInput.focus();
-					} else {
-						// if this is the last input, update the filter
-						const limited = this._limitInput();
-						this._updateFilter();
-						// and close the dropdown if the value was not out of bounds
-						if (!limited) {
-							this._closeParent(input);
-						}
-					}
-					break;
-
-				case 9: // Tab
-					if (
-						(isLastInput && !event.shiftKey) ||
-						(isFirstInput && event.shiftKey)
-					) {
-						this._closeParent(input);
-					}
-			}
-		}
-
-		_closeParent(input) {
-			getCloseableParent(input).close();
-		}
-
-		_onDropdownOpenedChanged({ currentTarget, detail: { value } }) {
-			if (!value) {
-				return;
-			}
-
-			// focus the first input after the dropdown is visible
-			setTimeout(
-				() => currentTarget.querySelector('cosmoz-input').focus(),
-				100,
-			);
-		}
-
-		/**
-		 * Debounced function called by `_filterInputChanged` when `_filterInput` changes.
-		 *
-		 * @returns {void}
-		 */
-		_limitInput() {
-			const input = this._filterInput,
-				path = this.__inputChangePath,
-				value = path
-					? this._fromInputString(this.get(path, input), path)
-					: null;
-
-			this.__inputChangePath = null;
-
-			if (value == null) {
-				//Don't limit a null value
-				return false;
-			}
-
-			const limit = this._limit,
-				limitPath = path === 'min' ? 'from' : 'to',
-				lowerLimit = this.get(limitPath + 'Min', limit),
-				upperLimit = this.get(limitPath + 'Max', limit),
-				minValue = this.toValue(value, lowerLimit, Math.max),
-				limitedValue = this.toValue(minValue, upperLimit, Math.min);
-
-			if (
-				this.getComparableValue(value) !== this.getComparableValue(limitedValue)
-			) {
-				//set value without debouncing _limitInput again.
-				this.set(
-					['_filterInput', path],
-					this._toInputString(limitedValue, path),
-				);
-				if (this._limitInputDebouncer) {
-					this._limitInputDebouncer.cancel();
-				}
-				return true;
-			}
-
-			return false;
-		}
-
-		_updateFilter() {
-			const input = this._filterInput,
-				filter = this.filter,
-				min = this._fromInputString(input.min, 'min'),
-				max = this._fromInputString(input.max, 'max');
-
-			if (
-				this.getComparableValue(min) ===
-					this.getComparableValue(filter, 'min') &&
-				this.getComparableValue(max) === this.getComparableValue(filter, 'max')
-			) {
-				return;
-			}
-
-			this.set('filter', { min, max });
-		}
-
-		_filterChanged(change) {
-			if (this._filterInput == null) {
-				return;
-			}
-			const input = this._filterInput,
-				filter = change.base,
-				min = this._fromInputString(input.min, 'min'),
-				max = this._fromInputString(input.max, 'max');
-
-			if (
-				this.getComparableValue(min) ===
-					this.getComparableValue(filter, 'min') &&
-				this.getComparableValue(max) === this.getComparableValue(filter, 'max')
-			) {
-				return;
-			}
-
-			this.set('_filterInput', {
-				min: this._toInputString(filter.min),
-				max: this._toInputString(filter.max),
-			});
-			if (this._limitInputDebouncer) {
-				this._limitInputDebouncer.cancel();
-			}
-		}
-
-		hasFilter() {
-			const filter = this.filter;
-			if (filter == null) {
-				return false;
-			}
-			return (
-				this.toValue(filter.min) != null || this.toValue(filter.max) != null
-			);
-		}
-
-		resetFilter() {
-			this.filter = this._getDefaultFilter();
-		}
-
-		_updateLimits(limits, headerFocused) {
-			if (!limits) return;
-			Promise.resolve(invoke(limits, { active: headerFocused })).then((res) => {
-				const { min, max } = res ?? {};
-				Object.assign(this, {
-					...(min != null ? { min } : {}),
-					...(max != null ? { max } : {}),
-				});
-			});
-		}
-	};

package/lib/cosmoz-omnitable-resize-nub.js

@@ -1,41 +0,0 @@
-import { useEffect, component } from '@pionjs/pion';
-import { nothing } from 'lit-html';
-
-const ResizeNub = (host) => {
-	const { column } = host;
-
-	useEffect(() => {
-		let initial = 0;
-		let initialWidth = 0;
-		const move = (ev) => {
-				host.dispatchEvent(
-					new CustomEvent('column-resize', {
-						bubbles: true,
-						composed: true,
-						detail: {
-							newWidth: Math.ceil(initialWidth + ev.pageX - initial),
-							column,
-						},
-					}),
-				);
-			},
-			stop = () => {
-				document.removeEventListener('pointermove', move);
-				document.removeEventListener('pointerup', stop);
-			},
-			start = (ev) => {
-				initial = ev.pageX;
-				initialWidth =
-					host.previousElementSibling.getBoundingClientRect().width;
-				document.addEventListener('pointermove', move);
-				document.addEventListener('pointerup', stop);
-			};
-		host.addEventListener('pointerdown', start);
-
-		return () => host.removeEventListener('pointerdown', start);
-	}, [column]);
-
-	return nothing;
-};
-
-customElements.define('cosmoz-omnitable-resize-nub', component(ResizeNub));