@neovici/cosmoz-omnitable 14.17.0 → 14.18.0

package/dist/cosmoz-omnitable-header-row.js

@@ -1,11 +1,13 @@
-import { html, component, useContext } from '@pionjs/pion';
-import { repeat } from 'lit-html/directives/repeat.js';
-import './lib/cosmoz-omnitable-resize-nub';
-import { render } from './lib/settings/cosmoz-omnitable-sort-group';
-import { when } from 'lit-html/directives/when.js';
-import { SortAndGroupContext } from './lib/use-sort-and-group-options';
-const renderHeaderRow = ({ data, columns, groupOnColumn, filters, setFilterState, sortAndGroup: { sortOn: on, setSortOn: setOn, descending, setDescending, } = {}, }) => repeat(columns, (column) => column.name, (column) => [
-    html `<div
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const pion_1 = require("@pionjs/pion");
+const repeat_js_1 = require("lit-html/directives/repeat.js");
+require("./lib/cosmoz-omnitable-resize-nub");
+const cosmoz_omnitable_sort_group_1 = require("./lib/settings/cosmoz-omnitable-sort-group");
+const when_js_1 = require("lit-html/directives/when.js");
+const use_sort_and_group_options_1 = require("./lib/use-sort-and-group-options");
+const renderHeaderRow = ({ data, columns, groupOnColumn, filters, setFilterState, sortAndGroup: { sortOn: on, setSortOn: setOn, descending, setDescending, } = {}, }) => (0, repeat_js_1.repeat)(columns, (column) => column.name, (column) => [
+    (0, pion_1.html) `<div
 				class="cell ${column.headerCellClass} header-cell"
 				part="cell header-cell cell-${column.name} header-cell-${column.name}"
 				?hidden="${column === groupOnColumn}"
@@ -13,22 +15,22 @@ const renderHeaderRow = ({ data, columns, groupOnColumn, filters, setFilterState
 				name="${column.name}"
 			>
 				${column.renderHeader(column, filters[column.name] ?? {}, (state) => setFilterState(column.name, state), column.source(column, data))}
-				${render({ on, setOn, descending, setDescending, column })}
+				${(0, cosmoz_omnitable_sort_group_1.render)({ on, setOn, descending, setDescending, column })}
 			</div>`,
-    html `<cosmoz-omnitable-resize-nub
+    (0, pion_1.html) `<cosmoz-omnitable-resize-nub
 				.column="${column}"
 				name="${column.name}"
 			></cosmoz-omnitable-resize-nub>`,
 ]);
 const HeaderRow = ({ columns, settingsConfig, hideSelectAll, ...thru }) => {
-    const sortAndGroup = useContext(SortAndGroupContext);
-    return html `
-		${when(columns, (columns) => renderHeaderRow({ columns, sortAndGroup, ...thru }))}
-		${when(!hideSelectAll, () => html ` <cosmoz-omnitable-settings
+    const sortAndGroup = (0, pion_1.useContext)(use_sort_and_group_options_1.SortAndGroupContext);
+    return (0, pion_1.html) `
+		${(0, when_js_1.when)(columns, (columns) => renderHeaderRow({ columns, sortAndGroup, ...thru }))}
+		${(0, when_js_1.when)(!hideSelectAll, () => (0, pion_1.html) ` <cosmoz-omnitable-settings
 					.config=${settingsConfig}
 					part="settings"
 				></cosmoz-omnitable-settings>`)}
 	`;
 };
-customElements.define('cosmoz-omnitable-header-row', component(HeaderRow, { useShadowDOM: false }));
+customElements.define('cosmoz-omnitable-header-row', (0, pion_1.component)(HeaderRow, { useShadowDOM: false }));
 //# sourceMappingURL=cosmoz-omnitable-header-row.js.map

package/dist/cosmoz-omnitable-item-expand-line.js

@@ -1,6 +1,8 @@
-import { component, html } from '@pionjs/pion';
-import { css, sheet } from '@neovici/cosmoz-utils';
-const style = css `
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const pion_1 = require("@pionjs/pion");
+const cosmoz_utils_1 = require("@neovici/cosmoz-utils");
+const style = (0, cosmoz_utils_1.css) `
 	:host {
 		display: flex;
 		align-items: center;
@@ -22,7 +24,7 @@ const style = css `
 		white-space: nowrap;
 	}
 `;
-const ItemExpandLine = ({ column }) => html `
+const ItemExpandLine = ({ column }) => (0, pion_1.html) `
 	<div class="label" title="${column.title}" part="item-expand-label">
 		${column.title}
 	</div>
@@ -30,5 +32,5 @@ const ItemExpandLine = ({ column }) => html `
 		<slot></slot>
 	</div>
 `;
-customElements.define('cosmoz-omnitable-item-expand-line', component(ItemExpandLine, { styleSheets: [sheet(style)] }));
+customElements.define('cosmoz-omnitable-item-expand-line', (0, pion_1.component)(ItemExpandLine, { styleSheets: [(0, cosmoz_utils_1.sheet)(style)] }));
 //# sourceMappingURL=cosmoz-omnitable-item-expand-line.js.map

package/dist/cosmoz-omnitable-item-expand.js

@@ -1,9 +1,11 @@
-import { component } from '@pionjs/pion';
-import { html } from 'lit-html';
-import { map } from 'lit-html/directives/map.js';
-import './cosmoz-omnitable-item-expand-line';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const pion_1 = require("@pionjs/pion");
+const lit_html_1 = require("lit-html");
+const map_js_1 = require("lit-html/directives/map.js");
+require("./cosmoz-omnitable-item-expand-line");
 const ItemExpand = ({ columns, item, selected, expanded, groupOnColumn }) => {
-    return map(columns, (column) => html `<cosmoz-omnitable-item-expand-line
+    return (0, map_js_1.map)(columns, (column) => (0, lit_html_1.html) `<cosmoz-omnitable-item-expand-line
 				.column=${column}
 				?hidden=${column === groupOnColumn}
 				exportparts="item-expand-label, item-expand-value"
@@ -14,7 +16,7 @@ const ItemExpand = ({ columns, item, selected, expanded, groupOnColumn }) => {
     })}</cosmoz-omnitable-item-expand-line
 			>`);
 };
-customElements.define('cosmoz-omnitable-item-expand', component(ItemExpand, {
+customElements.define('cosmoz-omnitable-item-expand', (0, pion_1.component)(ItemExpand, {
     useShadowDOM: false,
 }));
 //# sourceMappingURL=cosmoz-omnitable-item-expand.js.map

package/dist/cosmoz-omnitable-item-row.js

@@ -1,10 +1,12 @@
-import { component, html } from '@pionjs/pion';
-import { repeat } from 'lit-html/directives/repeat.js';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const pion_1 = require("@pionjs/pion");
+const repeat_js_1 = require("lit-html/directives/repeat.js");
 const renderCell = (column, data, onItemChange) => column.editable
     ? column.renderEditCell(column, data, onItemChange(column, data.item))
     : column.renderCell(column, data);
-const ItemRow = ({ columns, groupOnColumn, item, index, selected, expanded, onItemChange, }) => repeat(columns, (column) => column.name, (column) => {
-    return html `<div
+const ItemRow = ({ columns, groupOnColumn, item, index, selected, expanded, onItemChange, }) => (0, repeat_js_1.repeat)(columns, (column) => column.name, (column) => {
+    return (0, pion_1.html) `<div
 				class="cell itemRow-cell ${column.cellClass ?? ''}"
 				part="cell itemRow-cell cell-${column.name} itemRow-cell-${column.name}"
 				?hidden="${column === groupOnColumn}"
@@ -15,5 +17,5 @@ const ItemRow = ({ columns, groupOnColumn, item, index, selected, expanded, onIt
 				${renderCell(column, { item, index, selected, expanded }, onItemChange)}
 			</div>`;
 });
-customElements.define('cosmoz-omnitable-item-row', component(ItemRow, { useShadowDOM: false }));
+customElements.define('cosmoz-omnitable-item-row', (0, pion_1.component)(ItemRow, { useShadowDOM: false }));
 //# sourceMappingURL=cosmoz-omnitable-item-row.js.map

package/dist/cosmoz-omnitable-skeleton.js

@@ -1,5 +1,7 @@
-import { html, css, component } from '@pionjs/pion';
-const styles = css `
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const pion_1 = require("@pionjs/pion");
+const styles = (0, pion_1.css) `
 	:host {
 		max-width: 100%;
 		overflow-x: hidden;
@@ -44,10 +46,10 @@ const styles = css `
 `;
 const Skeleton = ({ settingsConfig }) => {
     const { columns, collapsed } = settingsConfig, showingColumns = columns.filter((column) => !collapsed.some((hidden) => hidden.name === column.name));
-    return html `<div class="skeleton">
-		${Array.from({ length: 5 }, () => html `<div>
+    return (0, pion_1.html) `<div class="skeleton">
+		${Array.from({ length: 5 }, () => (0, pion_1.html) `<div>
 					<div class="checkbox"></div>
-					${showingColumns.map((col) => html `<div
+					${showingColumns.map((col) => (0, pion_1.html) `<div
 								class="cell"
 								part=${`cell-${col.name}`}
 								name=${col.name}
@@ -55,5 +57,5 @@ const Skeleton = ({ settingsConfig }) => {
 				</div>`)}
 	</div>`;
 };
-customElements.define('cosmoz-omnitable-skeleton', component(Skeleton, { styleSheets: [styles] }));
+customElements.define('cosmoz-omnitable-skeleton', (0, pion_1.component)(Skeleton, { styleSheets: [styles] }));
 //# sourceMappingURL=cosmoz-omnitable-skeleton.js.map

package/dist/cosmoz-omnitable-styles.js

@@ -1,6 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkbox = void 0;
 /* eslint-disable max-lines */
-import { tagged as css } from '@neovici/cosmoz-utils';
-export const checkbox = css `
+const cosmoz_utils_1 = require("@neovici/cosmoz-utils");
+exports.checkbox = (0, cosmoz_utils_1.tagged) `
 	.checkbox {
 		box-sizing: border-box;
 		width: 18px;
@@ -79,7 +82,7 @@ export const checkbox = css `
 		);
 	}
 `;
-export default css `
+exports.default = (0, cosmoz_utils_1.tagged) `
 	:host {
 		display: flex;
 		flex-direction: column;
@@ -449,7 +452,7 @@ export default css `
 		color: rgba(0, 0, 0, 0.54);
 	}
 
-	${checkbox}
+	${exports.checkbox}
 
 	.all {
 		margin-bottom: 6px;

package/dist/cosmoz-omnitable.d.ts

@@ -1,3 +1,3 @@
-export const actionSlots: import("lit-html").TemplateResult<1>;
+export const actionSlots: import("lit-html", { with: { "resolution-mode": "import" } }).TemplateResult<1>;
 export const actionSlotsPolymer: HTMLTemplateElement;
 //# sourceMappingURL=cosmoz-omnitable.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"cosmoz-omnitable.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable.js"],"names":[],"mappings":"AAgFa,+DAA4D;AACxE,qDAA0E"}
+{"version":3,"file":"cosmoz-omnitable.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable.js"],"names":[],"mappings":"AAgFa,0GAA4D;AACxE,qDAA0E"}

package/dist/cosmoz-omnitable.js

@@ -1,37 +1,43 @@
-import '@neovici/cosmoz-bottom-bar';
-import '@polymer/iron-icon/iron-icon';
-import '@polymer/iron-icons/iron-icons';
-import './cosmoz-omnitable-column';
-import './cosmoz-omnitable-columns';
-import './cosmoz-omnitable-group-row';
-import './cosmoz-omnitable-header-row';
-import './cosmoz-omnitable-item-expand';
-import './cosmoz-omnitable-item-row';
-import { notifyProperty } from '@neovici/cosmoz-utils/hooks/use-notify-property';
-import { component } from '@pionjs/pion';
-import { html as polymerHtml } from '@polymer/polymer/lib/utils/html-tag';
-import { html } from 'lit-html';
-import { guard } from 'lit-html/directives/guard.js';
-import styles from './cosmoz-omnitable-styles';
-import { renderFooter } from './lib/render-footer';
-import { renderHeader } from './lib/render-header';
-import { renderList } from './lib/render-list';
-import { useOmnitable } from './lib/use-omnitable';
-import './grouped-list/index.js';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.actionSlotsPolymer = exports.actionSlots = void 0;
+require("@neovici/cosmoz-bottom-bar");
+require("@polymer/iron-icon/iron-icon");
+require("@polymer/iron-icons/iron-icons");
+require("./cosmoz-omnitable-column");
+require("./cosmoz-omnitable-columns");
+require("./cosmoz-omnitable-group-row");
+require("./cosmoz-omnitable-header-row");
+require("./cosmoz-omnitable-item-expand");
+require("./cosmoz-omnitable-item-row");
+const use_notify_property_1 = require("@neovici/cosmoz-utils/hooks/use-notify-property");
+const pion_1 = require("@pionjs/pion");
+const html_tag_1 = require("@polymer/polymer/lib/utils/html-tag");
+const lit_html_1 = require("lit-html");
+const guard_js_1 = require("lit-html/directives/guard.js");
+const cosmoz_omnitable_styles_1 = __importDefault(require("./cosmoz-omnitable-styles"));
+const render_footer_1 = require("./lib/render-footer");
+const render_header_1 = require("./lib/render-header");
+const render_list_1 = require("./lib/render-list");
+const use_omnitable_1 = require("./lib/use-omnitable");
+require("./grouped-list/index.js");
 const shimCSS = (s) => window.ShadyCSS?.ApplyShim?.transformCssText?.(s) || s;
 const Omnitable = (host) => {
-    const { header, list, footer } = useOmnitable(host);
-    return html `
+    const { header, list, footer } = (0, use_omnitable_1.useOmnitable)(host);
+    return (0, lit_html_1.html) `
 		<style>
-			${guard([], () => shimCSS(styles))}
+			${(0, guard_js_1.guard)([], () => shimCSS(cosmoz_omnitable_styles_1.default))}
 		</style>
 
 		<div class="mainContainer">
-			${renderHeader(header)}
+			${(0, render_header_1.renderHeader)(header)}
 			<div class="tableContent" id="tableContent">
-				${renderList(header, list)}
+				${(0, render_list_1.renderList)(header, list)}
 			</div>
-			${renderFooter(footer)}
+			${(0, render_footer_1.renderFooter)(footer)}
 		</div>
 
 		<div id="columns">
@@ -39,7 +45,7 @@ const Omnitable = (host) => {
 		</div>
 	`;
 };
-customElements.define('cosmoz-omnitable', class extends component(Omnitable, {
+customElements.define('cosmoz-omnitable', class extends (0, pion_1.component)(Omnitable, {
     observedAttributes: [
         'hash-param',
         'sort-on',
@@ -57,13 +63,13 @@ customElements.define('cosmoz-omnitable', class extends component(Omnitable, {
 }) {
     connectedCallback() {
         super.connectedCallback();
-        notifyProperty(this, 'selectedItems', []);
-        notifyProperty(this, 'visibleData', []);
-        notifyProperty(this, 'sortedFilteredGroupedItems', []);
+        (0, use_notify_property_1.notifyProperty)(this, 'selectedItems', []);
+        (0, use_notify_property_1.notifyProperty)(this, 'visibleData', []);
+        (0, use_notify_property_1.notifyProperty)(this, 'sortedFilteredGroupedItems', []);
     }
 });
 const tmplt = `
 	<slot name="actions" slot="actions"></slot>
 `;
-export const actionSlots = html(Object.assign([tmplt], { raw: [tmplt] })), actionSlotsPolymer = polymerHtml(Object.assign([tmplt], { raw: [tmplt] }));
+exports.actionSlots = (0, lit_html_1.html)(Object.assign([tmplt], { raw: [tmplt] })), exports.actionSlotsPolymer = (0, html_tag_1.html)(Object.assign([tmplt], { raw: [tmplt] }));
 //# sourceMappingURL=cosmoz-omnitable.js.map

package/dist/grouped-list/cosmoz-grouped-list-row.js

@@ -1,4 +1,6 @@
-import { render } from 'lit-html';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const lit_html_1 = require("lit-html");
 customElements.define('cosmoz-grouped-list-row', class Element extends HTMLElement {
     get item() {
         return this._item;
@@ -25,7 +27,7 @@ customElements.define('cosmoz-grouped-list-row', class Element extends HTMLEleme
         if (this._item == null || this._index == null || this._renderFn == null) {
             return;
         }
-        render(this._renderFn(this._item, this._index), this);
+        (0, lit_html_1.render)(this._renderFn(this._item, this._index), this);
     }
 });
 //# sourceMappingURL=cosmoz-grouped-list-row.js.map

package/dist/grouped-list/cosmoz-grouped-list.js

@@ -1,5 +1,7 @@
-import { renderCosmozGroupedList, useCosmozGroupedList, } from './use-cosmoz-grouped-list.js';
-import { component } from '@pionjs/pion';
-const CosmozGroupedList = (host) => renderCosmozGroupedList(useCosmozGroupedList(host));
-customElements.define('cosmoz-grouped-list', component(CosmozGroupedList, { useShadowDOM: false }));
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const use_cosmoz_grouped_list_js_1 = require("./use-cosmoz-grouped-list.js");
+const pion_1 = require("@pionjs/pion");
+const CosmozGroupedList = (host) => (0, use_cosmoz_grouped_list_js_1.renderCosmozGroupedList)((0, use_cosmoz_grouped_list_js_1.useCosmozGroupedList)(host));
+customElements.define('cosmoz-grouped-list', (0, pion_1.component)(CosmozGroupedList, { useShadowDOM: false }));
 //# sourceMappingURL=cosmoz-grouped-list.js.map

package/dist/grouped-list/index.js

@@ -1,2 +1,4 @@
-import './cosmoz-grouped-list.js';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+require("./cosmoz-grouped-list.js");
 //# sourceMappingURL=index.js.map

package/dist/grouped-list/use-collapsible-items.d.ts

@@ -1,7 +1,7 @@
 export function useCollapsibleItems(): {
-    state: WeakMap<object, any>;
-    signal: WeakMap<object, any>[];
-    toggleFold: (item: any, folded: any) => void;
-    toggleCollapse: (item: any, collapsed: any) => void;
+    state: any;
+    signal: any;
+    toggleFold: any;
+    toggleCollapse: any;
 };
 //# sourceMappingURL=use-collapsible-items.d.ts.map

package/dist/grouped-list/use-collapsible-items.js

@@ -1,16 +1,19 @@
-import { useCallback } from '@pionjs/pion';
-import { useWeakState } from './use-weak-state';
-import { isGroup } from './utils';
-export const useCollapsibleItems = () => {
-    const { setItemState, state, signal } = useWeakState(), toggleFold = useCallback((item, folded) => {
-        if (!isGroup(item)) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCollapsibleItems = void 0;
+const pion_1 = require("@pionjs/pion");
+const use_weak_state_1 = require("./use-weak-state");
+const utils_1 = require("./utils");
+const useCollapsibleItems = () => {
+    const { setItemState, state, signal } = (0, use_weak_state_1.useWeakState)(), toggleFold = (0, pion_1.useCallback)((item, folded) => {
+        if (!(0, utils_1.isGroup)(item)) {
             return;
         }
         setItemState(item, (state) => ({
             folded: folded !== undefined ? folded : !state.folded,
         }));
-    }, []), toggleCollapse = useCallback((item, collapsed) => {
-        if (isGroup(item)) {
+    }, []), toggleCollapse = (0, pion_1.useCallback)((item, collapsed) => {
+        if ((0, utils_1.isGroup)(item)) {
             return;
         }
         setItemState(item, (state) => ({
@@ -24,4 +27,5 @@ export const useCollapsibleItems = () => {
         toggleCollapse,
     };
 };
+exports.useCollapsibleItems = useCollapsibleItems;
 //# sourceMappingURL=use-collapsible-items.js.map

package/dist/grouped-list/use-cosmoz-grouped-list.d.ts

@@ -9,7 +9,7 @@ export function renderCosmozGroupedList({ renderRow, flatData }: {
     flatData: any[];
 }): any;
 export function useCosmozGroupedList(host: any): {
-    renderRow: (item: any, index: any) => any;
+    renderRow: any;
     flatData: any;
 };
 //# sourceMappingURL=use-cosmoz-grouped-list.d.ts.map

package/dist/grouped-list/use-cosmoz-grouped-list.js

@@ -1,34 +1,37 @@
-import { useImperativeApi } from '@neovici/cosmoz-utils/hooks/use-imperative-api';
-import { useNotifyProperty } from '@neovici/cosmoz-utils/hooks/use-notify-property';
-import { useCallback, useLayoutEffect, useMemo } from '@pionjs/pion';
-import { html } from 'lit-html';
-import './cosmoz-grouped-list-row';
-import { useCollapsibleItems } from './use-collapsible-items';
-import { useSelectedItems } from './use-selected-items';
-import { byReference, isExpanded, isFolded, prepareData } from './utils';
-import { virtualize } from '@lit-labs/virtualizer/virtualize.js';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCosmozGroupedList = exports.renderCosmozGroupedList = void 0;
+const use_imperative_api_1 = require("@neovici/cosmoz-utils/hooks/use-imperative-api");
+const use_notify_property_1 = require("@neovici/cosmoz-utils/hooks/use-notify-property");
+const pion_1 = require("@pionjs/pion");
+const lit_html_1 = require("lit-html");
+require("./cosmoz-grouped-list-row");
+const use_collapsible_items_1 = require("./use-collapsible-items");
+const use_selected_items_1 = require("./use-selected-items");
+const utils_1 = require("./utils");
+const virtualize_js_1 = require("@lit-labs/virtualizer/virtualize.js");
 const styles = {
     host: { position: 'relative', display: 'flex', flexDirection: 'column' },
 }, useCosmozGroupedList = (host) => {
-    const { data, renderItem, renderGroup, displayEmptyGroups, compareItemsFn = byReference, } = host, { toggleFold, toggleCollapse, state, signal } = useCollapsibleItems(), 
+    const { data, renderItem, renderGroup, displayEmptyGroups, compareItemsFn = utils_1.byReference, } = host, { toggleFold, toggleCollapse, state, signal } = (0, use_collapsible_items_1.useCollapsibleItems)(), 
     // TODO: state changes trigger recalculation, which is slow (200ms with 10k items)
     // it only makes sense to do it when a group is folded
     // suggested fix: separate signal for item collapse and group fold
-    flatData = useMemo(() => prepareData(data, displayEmptyGroups, state), [data, displayEmptyGroups, signal]), { selectedItems, isItemSelected, isGroupSelected, isSelected, select, deselect, selectOnly, selectAll, deselectAll, toggleSelect, toggleSelectTo, } = useSelectedItems({ initial: [], compareItemsFn, data, flatData }), renderRow = useCallback((item, index) => Array.isArray(item.items)
+    flatData = (0, pion_1.useMemo)(() => (0, utils_1.prepareData)(data, displayEmptyGroups, state), [data, displayEmptyGroups, signal]), { selectedItems, isItemSelected, isGroupSelected, isSelected, select, deselect, selectOnly, selectAll, deselectAll, toggleSelect, toggleSelectTo, } = (0, use_selected_items_1.useSelectedItems)({ initial: [], compareItemsFn, data, flatData }), renderRow = (0, pion_1.useCallback)((item, index) => Array.isArray(item.items)
         ? renderGroup(item, index, {
             selected: isGroupSelected(item, selectedItems),
-            folded: isFolded(item, state),
+            folded: (0, utils_1.isFolded)(item, state),
             toggleSelect: (selected) => toggleSelect(item, typeof selected === 'boolean' ? selected : undefined),
             toggleFold: () => toggleFold(item),
         })
         : renderItem(item, index, {
             selected: selectedItems.includes(item),
-            expanded: isExpanded(item, state),
+            expanded: (0, utils_1.isExpanded)(item, state),
             toggleSelect: (selected) => toggleSelect(item, typeof selected === 'boolean' ? selected : undefined),
             toggleCollapse: () => toggleCollapse(item),
         }), [renderItem, renderGroup, selectedItems, toggleSelect, signal]);
-    useLayoutEffect(() => Object.assign(host.style, styles.host), []);
-    useNotifyProperty('selectedItems', selectedItems);
+    (0, pion_1.useLayoutEffect)(() => Object.assign(host.style, styles.host), []);
+    (0, use_notify_property_1.useNotifyProperty)('selectedItems', selectedItems);
     const api = {
         toggleFold,
         toggleCollapse,
@@ -43,9 +46,10 @@ const styles = {
         toggleSelect,
         toggleSelectTo,
     };
-    useImperativeApi(api, Object.values(api));
+    (0, use_imperative_api_1.useImperativeApi)(api, Object.values(api));
     return { renderRow, flatData };
 };
+exports.useCosmozGroupedList = useCosmozGroupedList;
 /**
  * @param {Object} params
  * @param {Function} params.renderRow
@@ -53,14 +57,14 @@ const styles = {
  * @returns {*}
  */
 const renderCosmozGroupedList = ({ renderRow, flatData }) => {
-    return virtualize({
+    return (0, virtualize_js_1.virtualize)({
         items: flatData,
-        renderItem: (item, index) => html `<cosmoz-grouped-list-row
+        renderItem: (item, index) => (0, lit_html_1.html) `<cosmoz-grouped-list-row
 				.item=${item}
 				.index=${index}
 				.renderFn=${renderRow}
 			></cosmoz-grouped-list-row>`,
     });
 };
-export { renderCosmozGroupedList, useCosmozGroupedList };
+exports.renderCosmozGroupedList = renderCosmozGroupedList;
 //# sourceMappingURL=use-cosmoz-grouped-list.js.map

package/dist/grouped-list/use-selected-items.d.ts

@@ -5,15 +5,15 @@ export function useSelectedItems({ initial, compareItemsFn, data, flatData, }: {
     flatData: any;
 }): {
     selectedItems: any;
-    isItemSelected: (item: any) => any;
-    isGroupSelected: (group: any) => any;
-    isSelected: (item: any) => any;
-    select: (item: any) => void;
-    deselect: (item: any) => void;
-    selectOnly: (item: any) => void;
-    selectAll: () => void;
-    deselectAll: () => void;
-    toggleSelect: (item: any, selected?: boolean) => void;
-    toggleSelectTo: (item: any, selected: any) => void;
+    isItemSelected: any;
+    isGroupSelected: any;
+    isSelected: any;
+    select: any;
+    deselect: any;
+    selectOnly: any;
+    selectAll: any;
+    deselectAll: any;
+    toggleSelect: any;
+    toggleSelectTo: any;
 };
 //# sourceMappingURL=use-selected-items.d.ts.map

package/dist/grouped-list/use-selected-items.js

@@ -1,31 +1,34 @@
-import { useCallback, useEffect, useState } from '@pionjs/pion';
-import { isGroup } from './utils';
-export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) => {
-    const [selectedItems, setSelectedItems] = useState(initial), [lastSelection, setLastSelection] = useState(), 
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectedItems = void 0;
+const pion_1 = require("@pionjs/pion");
+const utils_1 = require("./utils");
+const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) => {
+    const [selectedItems, setSelectedItems] = (0, pion_1.useState)(initial), [lastSelection, setLastSelection] = (0, pion_1.useState)(), 
     /**
      * Check if item is selected.
      * @param {object} item Item.
      * @returns {boolean} Whether item is selected.
      */
-    isItemSelected = useCallback((item) => selectedItems.includes(item), [selectedItems]), 
+    isItemSelected = (0, pion_1.useCallback)((item) => selectedItems.includes(item), [selectedItems]), 
     /**
      * Check if group is selected.
      * @param {object} group Group.
      * @returns {boolean} Whether group is selected.
      */
-    isGroupSelected = useCallback((group) => group?.items?.every(isItemSelected), [isItemSelected]), 
+    isGroupSelected = (0, pion_1.useCallback)((group) => group?.items?.every(isItemSelected), [isItemSelected]), 
     /**
      * Check if item.group is selected.
      * @param {object} item Item.
      * @returns {boolean} Whether item is selected.
      */
-    isSelected = useCallback((item) => isItemSelected(item) || isGroupSelected(item), [isItemSelected, isGroupSelected]), 
+    isSelected = (0, pion_1.useCallback)((item) => isItemSelected(item) || isGroupSelected(item), [isItemSelected, isGroupSelected]), 
     /**
      * Add an item/group to the list of selected items.
      * @param {object} item Item to select.
      * @returns {void}
      */
-    select = useCallback((item) => {
+    select = (0, pion_1.useCallback)((item) => {
         const items = item.items ?? [item];
         setSelectedItems((selection) => [
             ...selection,
@@ -38,11 +41,11 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
      * @param {object} item Item to select.
      * @returns {void}
      */
-    deselect = useCallback((item) => {
+    deselect = (0, pion_1.useCallback)((item) => {
         const items = item.items ?? [item];
         setSelectedItems((selection) => selection.filter((i) => !items.includes(i)));
         setLastSelection(item);
-    }, []), selectOnly = useCallback((item) => {
+    }, []), selectOnly = (0, pion_1.useCallback)((item) => {
         setSelectedItems(item.items?.slice() || [item]);
         setLastSelection(item);
     }, []), 
@@ -50,7 +53,7 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
      * Select all items.
      * @returns {void}
      */
-    selectAll = useCallback(() => {
+    selectAll = (0, pion_1.useCallback)(() => {
         setSelectedItems(data.flatMap((item) => item.items || item));
         setLastSelection(undefined);
     }, [data]), 
@@ -58,7 +61,7 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
      * Deselect all selected items.
      * @returns {void}
      */
-    deselectAll = useCallback(() => {
+    deselectAll = (0, pion_1.useCallback)(() => {
         setSelectedItems([]);
         setLastSelection(undefined);
     }, []), 
@@ -68,7 +71,7 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
      * @param {boolean=} selected Select or deselect, fallback to toggling.
      * @returns {void}
      */
-    toggleSelect = useCallback((item, selected = !isSelected(item)) => selected ? select(item) : deselect(item), [isSelected]), toggleSelectTo = useCallback((item, selected) => {
+    toggleSelect = (0, pion_1.useCallback)((item, selected = !isSelected(item)) => selected ? select(item) : deselect(item), [isSelected]), toggleSelectTo = (0, pion_1.useCallback)((item, selected) => {
         const last = lastSelection
             ? flatData.findIndex((i) => compareItemsFn(i, lastSelection))
             : -1;
@@ -77,7 +80,7 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
         }
         const [from, to] = [last, flatData.indexOf(item)].sort((a, b) => a - b);
         flatData.slice(from, to + 1).forEach((item, i, items) => {
-            if (i > 0 && i < items.length - 1 && isGroup(item)) {
+            if (i > 0 && i < items.length - 1 && (0, utils_1.isGroup)(item)) {
                 return;
             }
             toggleSelect(item, selected);
@@ -85,7 +88,7 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
         setLastSelection(item);
     }, [flatData, compareItemsFn, toggleSelect]);
     // keep selected items across data updates
-    useEffect(() => setSelectedItems((selectedItems) => selectedItems.length > 0
+    (0, pion_1.useEffect)(() => setSelectedItems((selectedItems) => selectedItems.length > 0
         ? flatData.filter((i) => selectedItems.find((item) => compareItemsFn(i, item)))
         : selectedItems), [flatData]);
     return {
@@ -102,4 +105,5 @@ export const useSelectedItems = ({ initial, compareItemsFn, data, flatData, }) =
         toggleSelectTo,
     };
 };
+exports.useSelectedItems = useSelectedItems;
 //# sourceMappingURL=use-selected-items.js.map

package/dist/grouped-list/use-weak-state.d.ts

@@ -1,6 +1,6 @@
 export function useWeakState(): {
-    setItemState: (item: any, newItemState: any) => void;
-    state: WeakMap<object, any>;
-    signal: WeakMap<object, any>[];
+    setItemState: any;
+    state: any;
+    signal: any;
 };
 //# sourceMappingURL=use-weak-state.d.ts.map