@neovici/cosmoz-omnitable 8.2.3 → 8.2.4

package/cosmoz-omnitable-column-mixin.js

@@ -27,6 +27,7 @@ export const
 				title: { type: String },
 				valuePath: { type: String, notify: true },
 				values: { type: Array, notify: true },
+				filter: { type: Object },
 				/**
 			 * If the column should be disabled until enabled with enabledColumns
 			 */
@@ -61,6 +62,21 @@ export const
 			};
 		}
 
+		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
 	 */

package/cosmoz-omnitable-column.js

@@ -75,5 +75,9 @@ class OmnitableColumn extends columnMixin(PolymerElement) {
 			<cosmoz-clear-button suffix slot="suffix" ?visible=${ hasFilter(filter) } light @click=${ resetFilter(setState) }></cosmoz-clear-button>
 		</paper-input>`;
 	}
+
+	legacyFilterToState(filter) {
+		return { filter, inputValue: filter };
+	}
 }
 customElements.define('cosmoz-omnitable-column', OmnitableColumn);

package/lib/use-omnitable.js

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useState } from 'haunted';
+import { useCallback, useMemo, useState, useEffect } from 'haunted';
 import { normalizeSettings } from './normalize-settings';
 import { useProcessedItems } from './use-processed-items';
 import { useFastLayout } from './use-fast-layout';
@@ -74,6 +74,12 @@ export const useOmnitable = host => {
 			[filterFunctions, normalizedSettings, collapsedColumns]
 		);
 
+	useEffect(() => {
+		const handler = ev => setFilterState(ev.detail.name, state => ({ ...state, ...ev.detail.state }));
+		host.addEventListener('legacy-filter-changed', handler);
+		return () => host.removeEventListener('legacy-filter-changed', handler);
+	}, []);
+
 	return {
 		columns,
 

package/lib/use-processed-items.js

@@ -13,7 +13,9 @@ const
 		}
 
 		Object.entries(changes).forEach(([key, value]) => {
+			column[columnSymbol].__ownChange = true;
 			column[columnSymbol][key] = value;
+			column[columnSymbol].__ownChange = false;
 			column[columnSymbol].dispatchEvent(new CustomEvent(`${ kebab(key) }-changed`, { bubbles: true, detail: { value }}));
 		});
 	};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@neovici/cosmoz-omnitable",
-	"version": "8.2.3",
+	"version": "8.2.4",
 	"description": "[![Build Status](https://travis-ci.org/Neovici/cosmoz-omnitable.svg?branch=master)](https://travis-ci.org/Neovici/cosmoz-omnitable)",
 	"keywords": [
 		"web-components"