feat: upgrade cosmoz-grouped-list

Re https://neovici.slack.com/archives/C6LJQMJFM/p1709065934200789

Author: cristinecula

cosmoz-omnitable-column-list-data.js

@@ -127,7 +127,6 @@ class OmnitableColumnListData extends translatable(mixin(Template, PolymerElemen
 		this._expanded = !this._expanded;
 		event.stopPropagation();
 		event.preventDefault();
-		this.dispatchEvent(new CustomEvent('expand', { bubbles: true }));
 	}
 }
 

cosmoz-omnitable-column-list.js

@@ -14,7 +14,6 @@ import {
 	onText,
 } from './cosmoz-omnitable-column-list-mixin';
 import '@neovici/cosmoz-autocomplete';
-import { notifyResize } from './lib/utils';
 import { columnSymbol } from './lib/use-dom-columns';
 
 /**
@@ -41,10 +40,9 @@ class OmnitableColumnList extends listColumnMixin(columnMixin(PolymerElement)) {
 		};
 	}
 
-	renderCell({ valuePath, textProperty }, { item, index }) {
+	renderCell({ valuePath, textProperty }, { item }) {
 		return html`<cosmoz-omnitable-column-list-data
 			.items=${getTexts(item, valuePath, textProperty)}
-			@expand=${(event) => notifyResize(event.target, index)}
 		></cosmoz-omnitable-column-list-data>`;
 	}
 

cosmoz-omnitable-item-expand.js

@@ -2,7 +2,6 @@
 import { component, useEffect } from '@pionjs/pion';
 import { html, nothing } from 'lit-html';
 import './cosmoz-omnitable-item-expand-line';
-import { notifyResize } from './lib/utils';
 
 const renderExpandList = ({
 		columns,
@@ -24,7 +23,7 @@ const renderExpandList = ({
 			>`
 		),
 	ExpandList = (host) => {
-		const { expanded, index, columns } = host;
+		const { columns } = host;
 
 		useEffect(() => {
 			if (columns?.length > 0) {
@@ -35,11 +34,6 @@ const renderExpandList = ({
 			return () => host.removeAttribute('hidden');
 		}, [columns?.length]);
 
-		useEffect(
-			() => expanded && requestAnimationFrame(() => notifyResize(host, index)),
-			[expanded]
-		);
-
 		return Array.isArray(columns) && columns.length > 0 && host.expanded
 			? renderExpandList(host)
 			: nothing;

lib/use-list.js

@@ -165,11 +165,6 @@ export const useList = ({
 		);
 	}, []);
 
-	useEffect(() => {
-		host.shadowRoot.querySelector('#groupedList').scrollTarget =
-			host.shadowRoot.querySelector('#scroller');
-	}, []);
-
 	const { groupOnColumn } = sortAndGroupOptions,
 		onItemChange = useCallback(
 			(column, item) => (value) => _onItemChange(host, column, item, value),

lib/utils.js

@@ -1,10 +1,3 @@
-const notifyResize = (target, index) =>
-	target.dispatchEvent(
-		new CustomEvent('update-item-size', {
-			bubbles: true,
-			detail: { index },
-		})
-	),
-	indexSymbol = Symbol('index');
+const indexSymbol = Symbol('index');
 
-export { notifyResize, indexSymbol };
+export { indexSymbol };

package-lock.json

@@ -64,7 +64,7 @@
 		"@neovici/cosmoz-collapse": "^1.1.0",
 		"@neovici/cosmoz-datetime-input": "^4.0.0",
 		"@neovici/cosmoz-dropdown": "^4.0.0",
-		"@neovici/cosmoz-grouped-list": "^7.0.0",
+		"@neovici/cosmoz-grouped-list": "^8.0.0",
 		"@neovici/cosmoz-i18next": "^3.1.1",
 		"@neovici/cosmoz-input": "^4.0.0",
 		"@neovici/cosmoz-router": "^11.0.0",