@gtkx/components 2.0.0-beta.12 → 2.0.0-beta.13

package/README.md

@@ -2,7 +2,7 @@
 
 Collection views, selection controls, tabs, and toasts for GTKX.
 
-Use `ListView`, `GridView`, and `ColumnView` with React data and render functions, or `DropDown` and `ComboRow` for selection controls. `createTabCollection` preserves tab state across windows. `ToastProvider` and `useToast` manage notifications.
+Use `ListView`, `GridView`, and `ColumnView` with React data and render functions, or `DropDown` and `ComboRow` for selection controls. `ToastProvider` and `useToast` manage notifications.
 
 In an existing GTKX app:
 

package/dist/column-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"column-view.d.ts","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAQlD,OAAO,KAAK,EAAoB,eAAe,EAAmC,MAAM,YAAY,CAAC;AA4LrG;;;;GAIG;AACH,iBAAS,UAAU,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,SAAS,CAiCrF;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
+{"version":3,"file":"column-view.d.ts","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAQlD,OAAO,KAAK,EAAoB,eAAe,EAAmC,MAAM,YAAY,CAAC;AAgMrG;;;;GAIG;AACH,iBAAS,UAAU,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,SAAS,CAiCrF;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/column-view.js

@@ -7,6 +7,7 @@ import { useMemo, useRef } from "react";
 import { ItemPortals, useItemCells, useRowProps, useSectionHeader } from "./internal/cells.js";
 import { useControlledSync } from "./internal/controlled-sync.js";
 import { useCollection } from "./internal/use-collection.js";
+import { showFirstHeader } from "./internal/first-header.js";
 import { useWidgetRef } from "./internal/use-widget-ref.js";
 const COLUMN_VIEW_PROPS = [
     "items",
@@ -27,7 +28,10 @@ const COLUMN_VIEW_PROPS = [
     "estimatedItemHeight",
     "ref",
 ];
-const expanderIndexFor = (columns) => columns.findIndex((column) => column.visible !== false);
+const expanderIndexFor = (columns) => {
+    const marked = columns.findIndex((column) => column.hasExpander === true && column.visible !== false);
+    return marked === -1 ? columns.findIndex((column) => column.visible !== false) : marked;
+};
 const columnById = (view, id) => {
     const columns = view.getColumns();
     for (let index = 0; index < columns.getNItems(); index++) {
@@ -94,7 +98,7 @@ const useColumnSorting = (view, sort, columns) => {
 };
 const ColumnCells = ({ column, hasExpander, collection, expandedIds, expanderDescriptions, size, }) => {
     const cells = useItemCells(size);
-    const rest = omit(column, ["id", "renderCell", "isSortable"]);
+    const rest = omit(column, ["id", "renderCell", "isSortable", "hasExpander"]);
     return (_jsxs(_Fragment, { children: [_jsx(GtkColumnViewColumn, { id: column.id, factory: _jsx(GtkSignalListItemFactory, { ...cells.handlers }), sorter: column.isSortable === true ? _jsx(GtkCustomSorter, {}) : null, ...rest }), _jsx(ItemPortals, { registry: cells, render: column.renderCell, collection: collection, hasExpander: hasExpander, expandedIds: expandedIds, expanderDescriptions: expanderDescriptions })] }));
 };
 const ColumnList = ({ columns, collection, expandedIds, expanderDescriptions, size }) => {
@@ -112,7 +116,7 @@ function ColumnView(props) {
     const rest = omit(props, COLUMN_VIEW_PROPS);
     const size = { width: -1, height: props.estimatedItemHeight ?? -1 };
     const [view, refCallback] = useWidgetRef(ref);
-    const { collection, selection } = useCollection(props);
+    const { collection, selection } = useCollection({ ...props, onSectionsFilled: () => showFirstHeader(view) });
     const header = useSectionHeader(renderHeader, collection, size);
     const rows = useRowProps(rowProps, collection, expandedIds);
     const columnList = columns;

package/dist/column-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"column-view.js","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAC9G,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAIxC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAkB5D,MAAM,iBAAiB,GAAG;IACtB,OAAO;IACP,UAAU;IACV,QAAQ;IACR,cAAc;IACd,UAAU;IACV,SAAS;IACT,aAAa;IACb,oBAAoB;IACpB,eAAe;IACf,aAAa;IACb,kBAAkB;IAClB,sBAAsB;IACtB,YAAY;IACZ,WAAW;IACX,eAAe;IACf,qBAAqB;IACrB,KAAK;CACqC,CAAC;AAE/C,MAAM,gBAAgB,GAAG,CAAC,OAAkC,EAAU,EAAE,CACpE,OAAO,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,KAAK,KAAK,CAAC,CAAC;AAE5D,MAAM,UAAU,GAAG,CAAC,IAAoB,EAAE,EAAU,EAA+B,EAAE;IACjF,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;IAElC,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC;QACvD,MAAM,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAEtC,IAAI,MAAM,YAAY,GAAG,CAAC,gBAAgB,IAAI,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC;YAClE,OAAO,MAAM,CAAC;QAClB,CAAC;IACL,CAAC;IAED,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,IAA2B,EAAE,UAAqC,EAAqB,EAAE;IAC5G,IAAI,IAAI,KAAK,IAAI,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;QAC5C,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,IAAI,UAAU,KAAK,IAAI,EAAE,CAAC;QACtB,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC;IAClC,CAAC;IAED,MAAM,MAAM,GAAG,UAAU,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IAE5C,OAAO,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACrD,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,CACd,OAA2B,EAC3B,IAAoB,EACpB,MAAmC,EACnC,KAAsC,EAClC,EAAE;IACN,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;IAEvB,IAAI,CAAC;QACD,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,IAAI,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAC/D,CAAC;YAAS,CAAC;QACP,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;IAC5B,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,kBAAkB,GAAG,CACvB,MAAmC,EACnC,OAA2B,EAC3B,IAAe,EACR,EAAE;IACT,IAAI,MAAM,KAAK,IAAI,IAAI,OAAO,CAAC,OAAO,EAAE,CAAC;QACrC,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,oBAAoB,EAAE,EAAE,KAAK,EAAE,IAAI,IAAI,EAAE,MAAM,CAAC,mBAAmB,EAAE,CAAC,CAAC;IAEnG,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAG,CACb,OAA2B,EAC3B,IAA2B,EAC3B,UAAqC,EACrC,SAA0C,EACtC,EAAE;IACN,MAAM,MAAM,GAAG,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IAE/C,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;QAClB,OAAO;IACX,CAAC;IAED,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAC9D,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,IAA2B,EAAE,IAAe,EAAE,OAAkC,EAAQ,EAAE;IAChH,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC9B,MAAM,MAAM,GAAG,IAAI,EAAE,SAAS,EAAE,IAAI,IAAI,CAAC;IACzC,MAAM,YAAY,GAAG,MAAM,YAAY,GAAG,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC;IAC5E,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IACvC,MAAM,OAAO,GAAG,OAAO,CAAc,GAAG,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC;IACjG,MAAM,SAAS,GAAG,iBAAiB,CAAC;QAChC,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,OAAO;QACf,MAAM,EAAE,IAAI;QACZ,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;YACb,QAAQ,CAAC,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;QAC/D,CAAC;KACJ,CAAC,CAAC;IAEH,SAAS,CAAC,YAAY,EAAE,SAAS,EAAE,GAAS,EAAE;QAC1C,MAAM,OAAO,GAAG,kBAAkB,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC;QAEhE,IAAI,UAAU,KAAK,SAAS,IAAI,OAAO,EAAE,CAAC;YACtC,SAAS,EAAE,CAAC;QAChB,CAAC;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EACjB,MAAM,EACN,WAAW,EACX,UAAU,EACV,WAAW,EACX,oBAAoB,EACpB,IAAI,GACW,EAAa,EAAE;IAC9B,MAAM,KAAK,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACjC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9D,OAAO,CACH,8BACI,KAAC,mBAAmB,IAChB,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,OAAO,EAAE,KAAC,wBAAwB,OAAK,KAAK,CAAC,QAAQ,GAAI,EACzD,MAAM,EAAE,MAAM,CAAC,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,KAAC,eAAe,KAAG,CAAC,CAAC,CAAC,IAAI,KAC3D,IAAI,GACV,EACF,KAAC,WAAW,IACR,QAAQ,EAAE,KAAK,EACf,MAAM,EAAE,MAAM,CAAC,UAAU,EACzB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,GAC5C,IACH,CACN,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,oBAAoB,EAAE,IAAI,EAAmB,EAAa,EAAE;IAChH,MAAM,aAAa,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAEhD,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,KAAC,WAAW,IAER,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,KAAK,KAAK,aAAa,EACpC,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,EAC1C,IAAI,EAAE,IAAI,IANL,MAAM,CAAC,EAAE,CAOhB,CACL,CAAC,CAAC;AACP,CAAC,CAAC;AAEF;;;;GAIG;AACH,SAAS,UAAU,CAA2B,KAA4B;IACtE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,oBAAoB,EAAE,GAAG,KAAK,CAAC;IACrF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;IAC5D,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC;IAC5C,MAAM,IAAI,GAAG,EAAE,KAAK,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,mBAAmB,IAAI,CAAC,CAAC,EAAE,CAAC;IACpE,MAAM,CAAC,IAAI,EAAE,WAAW,CAAC,GAAG,YAAY,CAAiB,GAAG,CAAC,CAAC;IAC9D,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;IACvD,MAAM,MAAM,GAAG,gBAAgB,CAAC,YAAY,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;IAChE,MAAM,IAAI,GAAG,WAAW,CAAC,QAAQ,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC;IAC5D,MAAM,UAAU,GAAG,OAAoC,CAAC;IACxD,gBAAgB,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,EAAE,UAAU,CAAC,CAAC;IAE7E,OAAO,CACH,8BACI,KAAC,aAAa,IACV,GAAG,EAAE,WAAW,EAChB,KAAK,EAAE,SAAS,KACZ,MAAM,CAAC,YAAY,KACnB,IAAI,CAAC,YAAY,KACjB,IAAI,YAER,KAAC,UAAU,IACP,OAAO,EAAE,UAAU,EACnB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,EAC1C,IAAI,EAAE,IAAI,GACZ,GACU,EACf,MAAM,CAAC,OAAO,EACd,IAAI,CAAC,OAAO,IACd,CACN,CAAC;AACN,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC","sourcesContent":["import type { ReactNode, RefObject } from \"react\";\nimport * as Gtk from \"@gtkx/gi/gtk\";\nimport { GtkColumnView, GtkColumnViewColumn, GtkCustomSorter, GtkSignalListItemFactory } from \"@gtkx/jsx/gtk\";\nimport { useSignal } from \"@gtkx/react\";\nimport { omit } from \"@gtkx/utils\";\nimport { useMemo, useRef } from \"react\";\nimport type { CellSize } from \"./internal/cells.js\";\nimport type { Collection } from \"./internal/collection.js\";\nimport type { ColumnViewColumn, ColumnViewProps, ExpanderDescriptions, SortProps } from \"./types.js\";\nimport { ItemPortals, useItemCells, useRowProps, useSectionHeader } from \"./internal/cells.js\";\nimport { useControlledSync } from \"./internal/controlled-sync.js\";\nimport { useCollection } from \"./internal/use-collection.js\";\nimport { useWidgetRef } from \"./internal/use-widget-ref.js\";\n\ntype SortTarget = { view: Gtk.ColumnView; column: Gtk.ColumnViewColumn | null };\ntype SortRequest = Pick<SortProps, \"sortColumn\" | \"sortOrder\">;\n\ntype ColumnCellsProps = {\n    column: ColumnViewColumn<never>;\n    hasExpander: boolean;\n    collection: Collection;\n    expandedIds: string[] | null | undefined;\n    expanderDescriptions: ExpanderDescriptions | null | undefined;\n    size: CellSize;\n};\n\ntype ColumnListProps = Omit<ColumnCellsProps, \"column\" | \"hasExpander\"> & {\n    columns: ColumnViewColumn<never>[];\n};\n\nconst COLUMN_VIEW_PROPS = [\n    \"items\",\n    \"sections\",\n    \"isFlat\",\n    \"renderHeader\",\n    \"rowProps\",\n    \"columns\",\n    \"selectedIds\",\n    \"onSelectionChanged\",\n    \"selectionMode\",\n    \"expandedIds\",\n    \"onExpandedChange\",\n    \"expanderDescriptions\",\n    \"sortColumn\",\n    \"sortOrder\",\n    \"onSortChanged\",\n    \"estimatedItemHeight\",\n    \"ref\",\n] as const satisfies (keyof ColumnViewProps)[];\n\nconst expanderIndexFor = (columns: ColumnViewColumn<never>[]): number =>\n    columns.findIndex((column) => column.visible !== false);\n\nconst columnById = (view: Gtk.ColumnView, id: string): Gtk.ColumnViewColumn | null => {\n    const columns = view.getColumns();\n\n    for (let index = 0; index < columns.getNItems(); index++) {\n        const column = columns.getItem(index);\n\n        if (column instanceof Gtk.ColumnViewColumn && column.getId() === id) {\n            return column;\n        }\n    }\n\n    return null;\n};\n\nconst getSortTarget = (view: Gtk.ColumnView | null, sortColumn: string | null | undefined): SortTarget | null => {\n    if (view === null || sortColumn === undefined) {\n        return null;\n    }\n\n    if (sortColumn === null) {\n        return { view, column: null };\n    }\n\n    const column = columnById(view, sortColumn);\n\n    return column === null ? null : { view, column };\n};\n\nconst applySort = (\n    sorting: RefObject<boolean>,\n    view: Gtk.ColumnView,\n    column: Gtk.ColumnViewColumn | null,\n    order: Gtk.SortType | null | undefined,\n): void => {\n    sorting.current = true;\n\n    try {\n        view.sortByColumn(column, order ?? Gtk.SortType.ASCENDING);\n    } finally {\n        sorting.current = false;\n    }\n};\n\nconst didEmitSortChanged = (\n    sorter: Gtk.ColumnViewSorter | null,\n    sorting: RefObject<boolean>,\n    sort: SortProps,\n): boolean => {\n    if (sorter === null || sorting.current) {\n        return false;\n    }\n\n    sort.onSortChanged?.(sorter.getPrimarySortColumn()?.getId() ?? null, sorter.getPrimarySortOrder());\n\n    return true;\n};\n\nconst syncSort = (\n    sorting: RefObject<boolean>,\n    view: Gtk.ColumnView | null,\n    sortColumn: string | null | undefined,\n    sortOrder: Gtk.SortType | null | undefined,\n): void => {\n    const target = getSortTarget(view, sortColumn);\n\n    if (target === null) {\n        return;\n    }\n\n    applySort(sorting, target.view, target.column, sortOrder);\n};\n\nconst useColumnSorting = (view: Gtk.ColumnView | null, sort: SortProps, columns: ColumnViewColumn<never>[]): void => {\n    const sorting = useRef(false);\n    const sorter = view?.getSorter() ?? null;\n    const columnSorter = sorter instanceof Gtk.ColumnViewSorter ? sorter : null;\n    const { sortColumn, sortOrder } = sort;\n    const request = useMemo<SortRequest>(() => ({ sortColumn, sortOrder }), [sortColumn, sortOrder]);\n    const markDrift = useControlledSync({\n        value: request,\n        source: columns,\n        target: view,\n        apply: (value) => {\n            syncSort(sorting, view, value.sortColumn, value.sortOrder);\n        },\n    });\n\n    useSignal(columnSorter, \"changed\", (): void => {\n        const didEmit = didEmitSortChanged(columnSorter, sorting, sort);\n\n        if (sortColumn !== undefined && didEmit) {\n            markDrift();\n        }\n    });\n};\n\nconst ColumnCells = ({\n    column,\n    hasExpander,\n    collection,\n    expandedIds,\n    expanderDescriptions,\n    size,\n}: ColumnCellsProps): ReactNode => {\n    const cells = useItemCells(size);\n    const rest = omit(column, [\"id\", \"renderCell\", \"isSortable\"]);\n\n    return (\n        <>\n            <GtkColumnViewColumn\n                id={column.id}\n                factory={<GtkSignalListItemFactory {...cells.handlers} />}\n                sorter={column.isSortable === true ? <GtkCustomSorter /> : null}\n                {...rest}\n            />\n            <ItemPortals\n                registry={cells}\n                render={column.renderCell}\n                collection={collection}\n                hasExpander={hasExpander}\n                expandedIds={expandedIds}\n                expanderDescriptions={expanderDescriptions}\n            />\n        </>\n    );\n};\n\nconst ColumnList = ({ columns, collection, expandedIds, expanderDescriptions, size }: ColumnListProps): ReactNode => {\n    const expanderIndex = expanderIndexFor(columns);\n\n    return columns.map((column, index) => (\n        <ColumnCells\n            key={column.id}\n            column={column}\n            hasExpander={index === expanderIndex}\n            collection={collection}\n            expandedIds={expandedIds}\n            expanderDescriptions={expanderDescriptions}\n            size={size}\n        />\n    ));\n};\n\n/**\n * Renders a Gtk.ColumnView from declarative items or sections and a columns array,\n * with controlled selection, expansion, and sorting, per-column header menus,\n * section header rendering, and per-row props such as a screen-reader label.\n */\nfunction ColumnView<T = unknown, S = unknown>(props: ColumnViewProps<T, S>): ReactNode {\n    const { renderHeader, rowProps, columns, expandedIds, expanderDescriptions } = props;\n    const { sortColumn, sortOrder, onSortChanged, ref } = props;\n    const rest = omit(props, COLUMN_VIEW_PROPS);\n    const size = { width: -1, height: props.estimatedItemHeight ?? -1 };\n    const [view, refCallback] = useWidgetRef<Gtk.ColumnView>(ref);\n    const { collection, selection } = useCollection(props);\n    const header = useSectionHeader(renderHeader, collection, size);\n    const rows = useRowProps(rowProps, collection, expandedIds);\n    const columnList = columns as ColumnViewColumn<never>[];\n    useColumnSorting(view, { sortColumn, sortOrder, onSortChanged }, columnList);\n\n    return (\n        <>\n            <GtkColumnView\n                ref={refCallback}\n                model={selection}\n                {...header.factoryProps}\n                {...rows.factoryProps}\n                {...rest}\n            >\n                <ColumnList\n                    columns={columnList}\n                    collection={collection}\n                    expandedIds={expandedIds}\n                    expanderDescriptions={expanderDescriptions}\n                    size={size}\n                />\n            </GtkColumnView>\n            {header.portals}\n            {rows.portals}\n        </>\n    );\n}\n\nexport { ColumnView };\n"]}
+{"version":3,"file":"column-view.js","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { ReactNode, RefObject } from \"react\";\nimport * as Gtk from \"@gtkx/gi/gtk\";\nimport { GtkColumnView, GtkColumnViewColumn, GtkCustomSorter, GtkSignalListItemFactory } from \"@gtkx/jsx/gtk\";\nimport { useSignal } from \"@gtkx/react\";\nimport { omit } from \"@gtkx/utils\";\nimport { useMemo, useRef } from \"react\";\nimport type { CellSize } from \"./internal/cells.js\";\nimport type { Collection } from \"./internal/collection.js\";\nimport type { ColumnViewColumn, ColumnViewProps, ExpanderDescriptions, SortProps } from \"./types.js\";\nimport { ItemPortals, useItemCells, useRowProps, useSectionHeader } from \"./internal/cells.js\";\nimport { useControlledSync } from \"./internal/controlled-sync.js\";\nimport { useCollection } from \"./internal/use-collection.js\";\nimport { showFirstHeader } from \"./internal/first-header.js\";\nimport { useWidgetRef } from \"./internal/use-widget-ref.js\";\n\ntype SortTarget = { view: Gtk.ColumnView; column: Gtk.ColumnViewColumn | null };\ntype SortRequest = Pick<SortProps, \"sortColumn\" | \"sortOrder\">;\n\ntype ColumnCellsProps = {\n    column: ColumnViewColumn<never>;\n    hasExpander: boolean;\n    collection: Collection;\n    expandedIds: string[] | null | undefined;\n    expanderDescriptions: ExpanderDescriptions | null | undefined;\n    size: CellSize;\n};\n\ntype ColumnListProps = Omit<ColumnCellsProps, \"column\" | \"hasExpander\"> & {\n    columns: ColumnViewColumn<never>[];\n};\n\nconst COLUMN_VIEW_PROPS = [\n    \"items\",\n    \"sections\",\n    \"isFlat\",\n    \"renderHeader\",\n    \"rowProps\",\n    \"columns\",\n    \"selectedIds\",\n    \"onSelectionChanged\",\n    \"selectionMode\",\n    \"expandedIds\",\n    \"onExpandedChange\",\n    \"expanderDescriptions\",\n    \"sortColumn\",\n    \"sortOrder\",\n    \"onSortChanged\",\n    \"estimatedItemHeight\",\n    \"ref\",\n] as const satisfies (keyof ColumnViewProps)[];\n\nconst expanderIndexFor = (columns: ColumnViewColumn<never>[]): number => {\n    const marked = columns.findIndex((column) => column.hasExpander === true && column.visible !== false);\n\n    return marked === -1 ? columns.findIndex((column) => column.visible !== false) : marked;\n};\n\nconst columnById = (view: Gtk.ColumnView, id: string): Gtk.ColumnViewColumn | null => {\n    const columns = view.getColumns();\n\n    for (let index = 0; index < columns.getNItems(); index++) {\n        const column = columns.getItem(index);\n\n        if (column instanceof Gtk.ColumnViewColumn && column.getId() === id) {\n            return column;\n        }\n    }\n\n    return null;\n};\n\nconst getSortTarget = (view: Gtk.ColumnView | null, sortColumn: string | null | undefined): SortTarget | null => {\n    if (view === null || sortColumn === undefined) {\n        return null;\n    }\n\n    if (sortColumn === null) {\n        return { view, column: null };\n    }\n\n    const column = columnById(view, sortColumn);\n\n    return column === null ? null : { view, column };\n};\n\nconst applySort = (\n    sorting: RefObject<boolean>,\n    view: Gtk.ColumnView,\n    column: Gtk.ColumnViewColumn | null,\n    order: Gtk.SortType | null | undefined,\n): void => {\n    sorting.current = true;\n\n    try {\n        view.sortByColumn(column, order ?? Gtk.SortType.ASCENDING);\n    } finally {\n        sorting.current = false;\n    }\n};\n\nconst didEmitSortChanged = (\n    sorter: Gtk.ColumnViewSorter | null,\n    sorting: RefObject<boolean>,\n    sort: SortProps,\n): boolean => {\n    if (sorter === null || sorting.current) {\n        return false;\n    }\n\n    sort.onSortChanged?.(sorter.getPrimarySortColumn()?.getId() ?? null, sorter.getPrimarySortOrder());\n\n    return true;\n};\n\nconst syncSort = (\n    sorting: RefObject<boolean>,\n    view: Gtk.ColumnView | null,\n    sortColumn: string | null | undefined,\n    sortOrder: Gtk.SortType | null | undefined,\n): void => {\n    const target = getSortTarget(view, sortColumn);\n\n    if (target === null) {\n        return;\n    }\n\n    applySort(sorting, target.view, target.column, sortOrder);\n};\n\nconst useColumnSorting = (view: Gtk.ColumnView | null, sort: SortProps, columns: ColumnViewColumn<never>[]): void => {\n    const sorting = useRef(false);\n    const sorter = view?.getSorter() ?? null;\n    const columnSorter = sorter instanceof Gtk.ColumnViewSorter ? sorter : null;\n    const { sortColumn, sortOrder } = sort;\n    const request = useMemo<SortRequest>(() => ({ sortColumn, sortOrder }), [sortColumn, sortOrder]);\n    const markDrift = useControlledSync({\n        value: request,\n        source: columns,\n        target: view,\n        apply: (value) => {\n            syncSort(sorting, view, value.sortColumn, value.sortOrder);\n        },\n    });\n\n    useSignal(columnSorter, \"changed\", (): void => {\n        const didEmit = didEmitSortChanged(columnSorter, sorting, sort);\n\n        if (sortColumn !== undefined && didEmit) {\n            markDrift();\n        }\n    });\n};\n\nconst ColumnCells = ({\n    column,\n    hasExpander,\n    collection,\n    expandedIds,\n    expanderDescriptions,\n    size,\n}: ColumnCellsProps): ReactNode => {\n    const cells = useItemCells(size);\n    const rest = omit(column, [\"id\", \"renderCell\", \"isSortable\", \"hasExpander\"]);\n\n    return (\n        <>\n            <GtkColumnViewColumn\n                id={column.id}\n                factory={<GtkSignalListItemFactory {...cells.handlers} />}\n                sorter={column.isSortable === true ? <GtkCustomSorter /> : null}\n                {...rest}\n            />\n            <ItemPortals\n                registry={cells}\n                render={column.renderCell}\n                collection={collection}\n                hasExpander={hasExpander}\n                expandedIds={expandedIds}\n                expanderDescriptions={expanderDescriptions}\n            />\n        </>\n    );\n};\n\nconst ColumnList = ({ columns, collection, expandedIds, expanderDescriptions, size }: ColumnListProps): ReactNode => {\n    const expanderIndex = expanderIndexFor(columns);\n\n    return columns.map((column, index) => (\n        <ColumnCells\n            key={column.id}\n            column={column}\n            hasExpander={index === expanderIndex}\n            collection={collection}\n            expandedIds={expandedIds}\n            expanderDescriptions={expanderDescriptions}\n            size={size}\n        />\n    ));\n};\n\n/**\n * Renders a Gtk.ColumnView from declarative items or sections and a columns array,\n * with controlled selection, expansion, and sorting, per-column header menus,\n * section header rendering, and per-row props such as a screen-reader label.\n */\nfunction ColumnView<T = unknown, S = unknown>(props: ColumnViewProps<T, S>): ReactNode {\n    const { renderHeader, rowProps, columns, expandedIds, expanderDescriptions } = props;\n    const { sortColumn, sortOrder, onSortChanged, ref } = props;\n    const rest = omit(props, COLUMN_VIEW_PROPS);\n    const size = { width: -1, height: props.estimatedItemHeight ?? -1 };\n    const [view, refCallback] = useWidgetRef<Gtk.ColumnView>(ref);\n    const { collection, selection } = useCollection({ ...props, onSectionsFilled: () => showFirstHeader(view) });\n    const header = useSectionHeader(renderHeader, collection, size);\n    const rows = useRowProps(rowProps, collection, expandedIds);\n    const columnList = columns as ColumnViewColumn<never>[];\n    useColumnSorting(view, { sortColumn, sortOrder, onSortChanged }, columnList);\n\n    return (\n        <>\n            <GtkColumnView\n                ref={refCallback}\n                model={selection}\n                {...header.factoryProps}\n                {...rows.factoryProps}\n                {...rest}\n            >\n                <ColumnList\n                    columns={columnList}\n                    collection={collection}\n                    expandedIds={expandedIds}\n                    expanderDescriptions={expanderDescriptions}\n                    size={size}\n                />\n            </GtkColumnView>\n            {header.portals}\n            {rows.portals}\n        </>\n    );\n}\n\nexport { ColumnView };\n"]}

package/dist/combo-row.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-row.d.ts","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,uFAAuF;AACvF,KAAK,iBAAiB,GAAG,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,SAAS,CAAC;AAE7F;;;;GAIG;AACH,QAAA,MAAM,QAAQ,EAAE,iBAAqD,CAAC;AAMtE,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"combo-row.d.ts","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,uFAAuF;AACvF,KAAK,iBAAiB,GAAG,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,SAAS,CAAC;AAE7F;;;;GAIG;AACH,QAAA,MAAM,QAAQ,EAAE,iBAAqD,CAAC;AAQtE,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/combo-row.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import * as Pango from "@gtkx/gi/pango";
 import { AdwComboRow } from "@gtkx/jsx/adw";
 import { DropDownBase } from "./internal/drop-down.js";
 /**
@@ -7,8 +8,9 @@ import { DropDownBase } from "./internal/drop-down.js";
  * display, popup rows, and popup section headers, and controlled selection.
  */
 const ComboRow = ComboRowImpl;
+const ITEM_LABEL = { ellipsize: Pango.EllipsizeMode.END, maxWidthChars: 20, widthChars: 1 };
 function ComboRowImpl(props) {
-    return _jsx(DropDownBase, { ...props, component: AdwComboRow });
+    return _jsx(DropDownBase, { ...props, component: AdwComboRow, itemLabel: ITEM_LABEL });
 }
 export { ComboRow };
 //# sourceMappingURL=combo-row.js.map

package/dist/combo-row.js.map

@@ -1 +1 @@
-{"version":3,"file":"combo-row.js","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAKvD;;;;GAIG;AACH,MAAM,QAAQ,GAAsB,YAAiC,CAAC;AAEtE,SAAS,YAAY,CAAC,KAAwB;IAC1C,OAAO,KAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,WAAW,GAAI,CAAC;AAC/D,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type { ReactNode } from \"react\";\nimport { AdwComboRow } from \"@gtkx/jsx/adw\";\nimport type { DropDownBaseProps } from \"./internal/drop-down.js\";\nimport type { ComboRowProps } from \"./types.js\";\nimport { DropDownBase } from \"./internal/drop-down.js\";\n\n/** Call signature of {@link ComboRow}, generic in the item and section value types. */\ntype ComboRowComponent = <T = unknown, S = unknown>(props: ComboRowProps<T, S>) => ReactNode;\n\n/**\n * Renders an `Adw.ComboRow` backed by a collection model, presenting the same choice as a\n * `DropDown` in the shape of a preferences row, with customizable renderers for the row\n * display, popup rows, and popup section headers, and controlled selection.\n */\nconst ComboRow: ComboRowComponent = ComboRowImpl as ComboRowComponent;\n\nfunction ComboRowImpl(props: DropDownBaseProps): ReactNode {\n    return <DropDownBase {...props} component={AdwComboRow} />;\n}\n\nexport { ComboRow };\n"]}
+{"version":3,"file":"combo-row.js","sourceRoot":"","sources":["../src/combo-row.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,KAAK,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAKvD;;;;GAIG;AACH,MAAM,QAAQ,GAAsB,YAAiC,CAAC;AAEtE,MAAM,UAAU,GAAG,EAAE,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE,aAAa,EAAE,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC;AAE5F,SAAS,YAAY,CAAC,KAAwB;IAC1C,OAAO,KAAC,YAAY,OAAK,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,GAAI,CAAC;AACtF,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type { ReactNode } from \"react\";\nimport * as Pango from \"@gtkx/gi/pango\";\nimport { AdwComboRow } from \"@gtkx/jsx/adw\";\nimport type { DropDownBaseProps } from \"./internal/drop-down.js\";\nimport type { ComboRowProps } from \"./types.js\";\nimport { DropDownBase } from \"./internal/drop-down.js\";\n\n/** Call signature of {@link ComboRow}, generic in the item and section value types. */\ntype ComboRowComponent = <T = unknown, S = unknown>(props: ComboRowProps<T, S>) => ReactNode;\n\n/**\n * Renders an `Adw.ComboRow` backed by a collection model, presenting the same choice as a\n * `DropDown` in the shape of a preferences row, with customizable renderers for the row\n * display, popup rows, and popup section headers, and controlled selection.\n */\nconst ComboRow: ComboRowComponent = ComboRowImpl as ComboRowComponent;\n\nconst ITEM_LABEL = { ellipsize: Pango.EllipsizeMode.END, maxWidthChars: 20, widthChars: 1 };\n\nfunction ComboRowImpl(props: DropDownBaseProps): ReactNode {\n    return <DropDownBase {...props} component={AdwComboRow} itemLabel={ITEM_LABEL} />;\n}\n\nexport { ComboRow };\n"]}

package/dist/grid-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-view.d.ts","sourceRoot":"","sources":["../src/grid-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAchD;;;GAGG;AACH,iBAAS,QAAQ,CAAC,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,SAAS,CAajE;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"grid-view.d.ts","sourceRoot":"","sources":["../src/grid-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAehD;;;GAGG;AACH,iBAAS,QAAQ,CAAC,CAAC,GAAG,OAAO,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,SAAS,CAajE;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/grid-view.js

@@ -6,6 +6,7 @@ import { useCollection } from "./internal/use-collection.js";
 const GRID_VIEW_PROPS = [
     "items",
     "renderItem",
+    "rowProps",
     "selectedIds",
     "onSelectionChanged",
     "selectionMode",
@@ -17,12 +18,12 @@ const GRID_VIEW_PROPS = [
  * rendering, controlled selection, and estimated item sizing.
  */
 function GridView(props) {
-    const { renderItem, estimatedItemHeight, estimatedItemWidth } = props;
+    const { renderItem, rowProps, estimatedItemHeight, estimatedItemWidth } = props;
     const rest = omit(props, GRID_VIEW_PROPS);
     const size = { width: estimatedItemWidth ?? -1, height: estimatedItemHeight ?? -1 };
     const { collection, selection } = useCollection({ ...props, isFlat: true });
     const itemCells = useItemCells(size);
-    return (_jsxs(_Fragment, { children: [_jsx(GtkGridView, { model: selection, factory: _jsx(GtkSignalListItemFactory, { ...itemCells.handlers }), ...rest }), _jsx(ItemPortals, { registry: itemCells, render: renderItem, collection: collection })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(GtkGridView, { model: selection, factory: _jsx(GtkSignalListItemFactory, { ...itemCells.handlers }), ...rest }), _jsx(ItemPortals, { registry: itemCells, render: renderItem, rowProps: rowProps, collection: collection })] }));
 }
 export { GridView };
 //# sourceMappingURL=grid-view.js.map

package/dist/grid-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-view.js","sourceRoot":"","sources":["../src/grid-view.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AACtE,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAE7D,MAAM,eAAe,GAAG;IACpB,OAAO;IACP,YAAY;IACZ,aAAa;IACb,oBAAoB;IACpB,eAAe;IACf,qBAAqB;IACrB,oBAAoB;CACoB,CAAC;AAE7C;;;GAGG;AACH,SAAS,QAAQ,CAAc,KAAuB;IAClD,MAAM,EAAE,UAAU,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAC;IACtE,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IAC1C,MAAM,IAAI,GAAG,EAAE,KAAK,EAAE,kBAAkB,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,mBAAmB,IAAI,CAAC,CAAC,EAAE,CAAC;IACpF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5E,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,OAAO,CACH,8BACI,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,KAAC,wBAAwB,OAAK,SAAS,CAAC,QAAQ,GAAI,KAAM,IAAI,GAAI,EAC1G,KAAC,WAAW,IAAC,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,GAAI,IACjF,CACN,CAAC;AACN,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type { ReactNode } from \"react\";\nimport { GtkGridView, GtkSignalListItemFactory } from \"@gtkx/jsx/gtk\";\nimport { omit } from \"@gtkx/utils\";\nimport type { GridViewProps } from \"./types.js\";\nimport { ItemPortals, useItemCells } from \"./internal/cells.js\";\nimport { useCollection } from \"./internal/use-collection.js\";\n\nconst GRID_VIEW_PROPS = [\n    \"items\",\n    \"renderItem\",\n    \"selectedIds\",\n    \"onSelectionChanged\",\n    \"selectionMode\",\n    \"estimatedItemHeight\",\n    \"estimatedItemWidth\",\n] as const satisfies (keyof GridViewProps)[];\n\n/**\n * Renders a Gtk.GridView of uniform cells from declarative items, with per-cell\n * rendering, controlled selection, and estimated item sizing.\n */\nfunction GridView<T = unknown>(props: GridViewProps<T>): ReactNode {\n    const { renderItem, estimatedItemHeight, estimatedItemWidth } = props;\n    const rest = omit(props, GRID_VIEW_PROPS);\n    const size = { width: estimatedItemWidth ?? -1, height: estimatedItemHeight ?? -1 };\n    const { collection, selection } = useCollection({ ...props, isFlat: true });\n    const itemCells = useItemCells(size);\n\n    return (\n        <>\n            <GtkGridView model={selection} factory={<GtkSignalListItemFactory {...itemCells.handlers} />} {...rest} />\n            <ItemPortals registry={itemCells} render={renderItem} collection={collection} />\n        </>\n    );\n}\n\nexport { GridView };\n"]}
+{"version":3,"file":"grid-view.js","sourceRoot":"","sources":["../src/grid-view.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AACtE,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAE7D,MAAM,eAAe,GAAG;IACpB,OAAO;IACP,YAAY;IACZ,UAAU;IACV,aAAa;IACb,oBAAoB;IACpB,eAAe;IACf,qBAAqB;IACrB,oBAAoB;CACoB,CAAC;AAE7C;;;GAGG;AACH,SAAS,QAAQ,CAAc,KAAuB;IAClD,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAC;IAChF,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IAC1C,MAAM,IAAI,GAAG,EAAE,KAAK,EAAE,kBAAkB,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,mBAAmB,IAAI,CAAC,CAAC,EAAE,CAAC;IACpF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5E,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,OAAO,CACH,8BACI,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,KAAC,wBAAwB,OAAK,SAAS,CAAC,QAAQ,GAAI,KAAM,IAAI,GAAI,EAC1G,KAAC,WAAW,IAAC,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,GAAI,IACrG,CACN,CAAC;AACN,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import type { ReactNode } from \"react\";\nimport { GtkGridView, GtkSignalListItemFactory } from \"@gtkx/jsx/gtk\";\nimport { omit } from \"@gtkx/utils\";\nimport type { GridViewProps } from \"./types.js\";\nimport { ItemPortals, useItemCells } from \"./internal/cells.js\";\nimport { useCollection } from \"./internal/use-collection.js\";\n\nconst GRID_VIEW_PROPS = [\n    \"items\",\n    \"renderItem\",\n    \"rowProps\",\n    \"selectedIds\",\n    \"onSelectionChanged\",\n    \"selectionMode\",\n    \"estimatedItemHeight\",\n    \"estimatedItemWidth\",\n] as const satisfies (keyof GridViewProps)[];\n\n/**\n * Renders a Gtk.GridView of uniform cells from declarative items, with per-cell\n * rendering, controlled selection, and estimated item sizing.\n */\nfunction GridView<T = unknown>(props: GridViewProps<T>): ReactNode {\n    const { renderItem, rowProps, estimatedItemHeight, estimatedItemWidth } = props;\n    const rest = omit(props, GRID_VIEW_PROPS);\n    const size = { width: estimatedItemWidth ?? -1, height: estimatedItemHeight ?? -1 };\n    const { collection, selection } = useCollection({ ...props, isFlat: true });\n    const itemCells = useItemCells(size);\n\n    return (\n        <>\n            <GtkGridView model={selection} factory={<GtkSignalListItemFactory {...itemCells.handlers} />} {...rest} />\n            <ItemPortals registry={itemCells} render={renderItem} rowProps={rowProps} collection={collection} />\n        </>\n    );\n}\n\nexport { GridView };\n"]}

package/dist/index.d.ts

@@ -5,6 +5,5 @@ export { GridView } from "./grid-view.js";
 export { ListItemFactory } from "./list-item-factory.js";
 export { ListView } from "./list-view.js";
 export { ToastProvider, useToast } from "./toast.js";
-export { createTabCollection } from "./tab-collection.js";
-export type { ColumnViewColumn, ColumnViewProps, ComboRowProps, DropDownProps, ExpanderDescriptions, GridViewProps, ListItem, ListItemFactoryProps, ListItemRenderArgs, ListItemRenderer, ListRowProps, ListRowPropsResolver, ListSection, ListSectionRenderArgs, ListSectionRenderer, ListViewProps, ToastController, ToastOptions, ToastProviderProps, TabAppendOptions, TabCollection, TabCollectionOptions, } from "./types.js";
+export type { ColumnViewColumn, ColumnViewProps, ComboRowProps, DropDownProps, ExpanderDescriptions, GridViewProps, ListItem, ListItemFactoryProps, ListItemRenderArgs, ListItemRenderer, ListRowProps, ListRowPropsResolver, ListSection, ListSectionRenderArgs, ListSectionRenderer, ListViewProps, ToastController, ToastOptions, ToastProviderProps, } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC1D,YAAY,EACR,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,aAAa,EACb,oBAAoB,EACpB,aAAa,EACb,QAAQ,EACR,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,EACZ,oBAAoB,EACpB,WAAW,EACX,qBAAqB,EACrB,mBAAmB,EACnB,aAAa,EACb,eAAe,EACf,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAChB,aAAa,EACb,oBAAoB,GACvB,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACrD,YAAY,EACR,gBAAgB,EAChB,eAAe,EACf,aAAa,EACb,aAAa,EACb,oBAAoB,EACpB,aAAa,EACb,QAAQ,EACR,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,EACZ,oBAAoB,EACpB,WAAW,EACX,qBAAqB,EACrB,mBAAmB,EACnB,aAAa,EACb,eAAe,EACf,YAAY,EACZ,kBAAkB,GACrB,MAAM,YAAY,CAAC"}

package/dist/index.js

@@ -5,5 +5,4 @@ export { GridView } from "./grid-view.js";
 export { ListItemFactory } from "./list-item-factory.js";
 export { ListView } from "./list-view.js";
 export { ToastProvider, useToast } from "./toast.js";
-export { createTabCollection } from "./tab-collection.js";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC","sourcesContent":["export { ColumnView } from \"./column-view.js\";\nexport { ComboRow } from \"./combo-row.js\";\nexport { DropDown } from \"./drop-down.js\";\nexport { GridView } from \"./grid-view.js\";\nexport { ListItemFactory } from \"./list-item-factory.js\";\nexport { ListView } from \"./list-view.js\";\nexport { ToastProvider, useToast } from \"./toast.js\";\nexport { createTabCollection } from \"./tab-collection.js\";\nexport type {\n    ColumnViewColumn,\n    ColumnViewProps,\n    ComboRowProps,\n    DropDownProps,\n    ExpanderDescriptions,\n    GridViewProps,\n    ListItem,\n    ListItemFactoryProps,\n    ListItemRenderArgs,\n    ListItemRenderer,\n    ListRowProps,\n    ListRowPropsResolver,\n    ListSection,\n    ListSectionRenderArgs,\n    ListSectionRenderer,\n    ListViewProps,\n    ToastController,\n    ToastOptions,\n    ToastProviderProps,\n    TabAppendOptions,\n    TabCollection,\n    TabCollectionOptions,\n} from \"./types.js\";\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { ColumnView } from \"./column-view.js\";\nexport { ComboRow } from \"./combo-row.js\";\nexport { DropDown } from \"./drop-down.js\";\nexport { GridView } from \"./grid-view.js\";\nexport { ListItemFactory } from \"./list-item-factory.js\";\nexport { ListView } from \"./list-view.js\";\nexport { ToastProvider, useToast } from \"./toast.js\";\nexport type {\n    ColumnViewColumn,\n    ColumnViewProps,\n    ComboRowProps,\n    DropDownProps,\n    ExpanderDescriptions,\n    GridViewProps,\n    ListItem,\n    ListItemFactoryProps,\n    ListItemRenderArgs,\n    ListItemRenderer,\n    ListRowProps,\n    ListRowPropsResolver,\n    ListSection,\n    ListSectionRenderArgs,\n    ListSectionRenderer,\n    ListViewProps,\n    ToastController,\n    ToastOptions,\n    ToastProviderProps,\n} from \"./types.js\";\n"]}

package/dist/internal/cells.d.ts

@@ -30,11 +30,13 @@ type ItemIdentity = {
     itemKey: string;
     item: ListItem | undefined;
     position: number;
+    index: number;
     isExpanded: boolean;
 };
 type ItemPortalsProps = {
     registry: CellRegistry<Gtk.ListItem>;
     render: ListItemRenderer<never>;
+    rowProps?: ListRowPropsResolver<never> | null | undefined;
     collection: Collection;
     hasExpander?: boolean | undefined;
     expandedIds?: string[] | null | undefined;
@@ -43,6 +45,7 @@ type ItemPortalsProps = {
 type NativeItemPortalsProps<T extends GObject.Object> = {
     registry: CellRegistry<Gtk.ListItem>;
     render: ListItemRenderer<T>;
+    rowProps: ListRowPropsResolver<T> | null | undefined;
     size: CellSize;
 };
 type SectionHeaderSlot = {
@@ -58,8 +61,8 @@ type RowSlot = {
     portals: ReactNode;
 };
 declare function useItemCells(size: CellSize): CellRegistry<Gtk.ListItem>;
-declare const ItemPortals: ({ registry, render, collection, hasExpander, expandedIds, expanderDescriptions, }: ItemPortalsProps) => ReactNode;
-declare function NativeItemPortals<T extends GObject.Object>({ registry, render, size }: NativeItemPortalsProps<T>): ReactNode;
+declare const ItemPortals: ({ registry, ...props }: ItemPortalsProps) => ReactNode;
+declare function NativeItemPortals<T extends GObject.Object>({ registry, render, rowProps, size, }: NativeItemPortalsProps<T>): ReactNode;
 declare const useSectionHeader: (render: ListSectionRenderer<never> | null | undefined, collection: Collection, size: CellSize) => SectionHeaderSlot;
 declare const useRowProps: (rowProps: ListRowPropsResolver<never> | null | undefined, collection: Collection, expandedIds: string[] | null | undefined) => RowSlot;
 export { useItemCells, useRowProps, useSectionHeader, ItemPortals, NativeItemPortals, type CellSize };

package/dist/internal/cells.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cells.d.ts","sourceRoot":"","sources":["../../src/internal/cells.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"cells.d.ts","sourceRoot":"","sources":["../../src/internal/cells.tsx"],"names":[],"mappings":"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"}

package/dist/internal/cells.js

@@ -4,16 +4,19 @@ import { GtkBox, GtkSignalListItemFactory, GtkTreeExpander } from "@gtkx/jsx/gtk
 import { createPortal, useProperty } from "@gtkx/react";
 import { useLatestRef } from "@gtkx/react/internal";
 import { createRef, Fragment, memo, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
-import { slotPathAt, slotRefFor } from "./collection-model.js";
+import { levelStoreFor, slotRefFor } from "./collection-model.js";
 import { joinParts } from "./keys.js";
 const ItemCell = memo(ItemCellImpl, isSameItemCell);
 const ItemRow = memo(ItemRowImpl, isSameItemRow);
 const HeaderCell = memo(HeaderCellImpl);
+const ItemCellList = memo(ItemCellListImpl, isWaitingForSync);
+const ItemRowList = memo(ItemRowListImpl, isWaitingForSync);
 const CELL_OPTIONS = { isHost: isListItem, prepare: prepareCell };
 const HEADER_OPTIONS = { isHost: isListHeader, prepare: prepareCell };
 const ROW_OPTIONS = { isHost: isColumnViewRow };
 const NO_SIZE = { width: -1, height: -1 };
 const NO_ROW_PROPS = {};
+const DEFAULT_ROW_PROPS = resolveRowProps(NO_ROW_PROPS);
 const placeholders = new WeakSet();
 const placeholder = (size) => {
     const widget = new Gtk.Box({ widthRequest: size.width, heightRequest: size.height });
@@ -132,8 +135,18 @@ function useHeaderCells(size) {
 function isRowWanted(options, item) {
     return options.expandedIds?.includes(item.id) ?? false;
 }
-function itemArgs(item, position, row, isExpanded) {
-    const args = { item: item.value, index: position ?? 0 };
+function collectionIndex(collection, item, position) {
+    if (position === undefined) {
+        return 0;
+    }
+    if (collection.idAt(position) === item.id) {
+        return position;
+    }
+    const index = collection.positionFor(item.id);
+    return index === -1 ? position : index;
+}
+function itemArgs(item, index, row, isExpanded) {
+    const args = { item: item.value, index };
     if (row === null) {
         return args;
     }
@@ -143,9 +156,6 @@ function itemArgs(item, position, row, isExpanded) {
     }
     return args;
 }
-function keyForItem(ref, item) {
-    return joinParts([slotPathAt(ref.store, ref.slot), item.id]);
-}
 function slotFor(options) {
     const ref = slotRefFor(options.item);
     if (ref === null) {
@@ -156,36 +166,40 @@ function slotFor(options) {
         return null;
     }
     return {
-        itemKey: keyForItem(ref, item),
+        itemKey: ref.key,
         item,
+        position: options.position,
         row: options.row,
-        args: itemArgs(item, options.position, options.row, isRowWanted(options, item)),
+        args: itemArgs(item, collectionIndex(options.collection, item, options.position), options.row, isRowWanted(options, item)),
     };
 }
 function useItemSlot(entry, state, identity) {
     const position = useProperty(entry.host, "position");
     const item = useProperty(entry.host, "item") ?? null;
     const row = item instanceof Gtk.TreeListRow ? item : null;
+    const { collection, expandedIds } = state.current;
     if (position === identity.position) {
         return identity.item === undefined
             ? null
             : {
                 itemKey: identity.itemKey,
                 item: identity.item,
+                position,
                 row,
-                args: itemArgs(identity.item, position, row, identity.isExpanded),
+                args: itemArgs(identity.item, identity.index, row, identity.isExpanded),
             };
     }
-    const { collection, expandedIds } = state.current;
     return slotFor({ item, position, row, collection, expandedIds });
 }
 function itemIdentity(entry, collection, expandedIds) {
     const ref = slotRefFor(entry.host.getItem());
     const item = ref === null ? undefined : collection.itemAt(ref);
+    const position = entry.host.getPosition();
     return {
-        itemKey: ref === null || item === undefined ? "" : keyForItem(ref, item),
+        itemKey: ref === null || item === undefined ? "" : ref.key,
         item,
-        position: entry.host.getPosition(),
+        position,
+        index: item === undefined ? 0 : collectionIndex(collection, item, position),
         isExpanded: item !== undefined && (expandedIds?.includes(item.id) ?? false),
     };
 }
@@ -193,16 +207,21 @@ function isSameItemIdentity(previous, next) {
     return (previous.item === next.item &&
         previous.itemKey === next.itemKey &&
         previous.position === next.position &&
+        previous.index === next.index &&
         previous.isExpanded === next.isExpanded);
 }
 function isSameItemCell(previous, next) {
     const identity = previous.entry.identity.current ?? previous;
     return (previous.entry === next.entry &&
         previous.render === next.render &&
+        previous.rowProps === next.rowProps &&
         previous.hasExpander === next.hasExpander &&
         previous.expanderDescriptions === next.expanderDescriptions &&
         isSameItemIdentity(identity, next));
 }
+function isWaitingForSync(_previous, next) {
+    return next.isPending;
+}
 function isSameItemRow(previous, next) {
     const identity = previous.entry.identity.current ?? previous;
     return previous.entry === next.entry && previous.rowProps === next.rowProps && isSameItemIdentity(identity, next);
@@ -227,7 +246,8 @@ function renderedIdentity(entry, slot) {
     return {
         itemKey: slot?.itemKey ?? "",
         item: slot?.item,
-        position: slot?.args.index ?? entry.host.getPosition(),
+        position: slot?.position ?? entry.host.getPosition(),
+        index: slot?.args.index ?? 0,
         isExpanded: slot?.args.isExpanded ?? false,
     };
 }
@@ -263,9 +283,7 @@ function rowText(value) {
 function rowFlag(value) {
     return value ?? true;
 }
-function rowPropsFor(slot, rowProps) {
-    const resolve = rowProps;
-    const props = slot === null ? NO_ROW_PROPS : resolve(slot.args);
+function resolveRowProps(props) {
     return {
         accessibleLabel: rowText(props.accessibleLabel),
         accessibleDescription: rowText(props.accessibleDescription),
@@ -274,6 +292,10 @@ function rowPropsFor(slot, rowProps) {
         isSelectable: rowFlag(props.isSelectable),
     };
 }
+function rowPropsFor(slot, rowProps) {
+    const resolve = rowProps;
+    return resolveRowProps(slot === null ? NO_ROW_PROPS : resolve(slot.args));
+}
 function applyRowProps(host, props, previous) {
     if (previous?.accessibleLabel !== props.accessibleLabel) {
         host.accessibleLabel = props.accessibleLabel;
@@ -291,68 +313,89 @@ function applyRowProps(host, props, previous) {
         host.setSelectable(props.isSelectable);
     }
 }
-function ItemCellImpl({ entry, render, state, hasExpander, expanderDescriptions, ...identity }) {
+function useAppliedRowProps(host, props) {
+    const previous = useRef(null);
+    useLayoutEffect(() => {
+        if (props === null && previous.current === null) {
+            return;
+        }
+        const next = props ?? DEFAULT_ROW_PROPS;
+        applyRowProps(host, next, previous.current);
+        previous.current = props === null ? null : next;
+    }, [host, props]);
+}
+function ItemCellImpl({ entry, render, rowProps, state, hasExpander, expanderDescriptions, ...identity }) {
     const slot = useItemSlot(entry, state, identity);
     useRememberIdentity(entry, slot);
+    useAppliedRowProps(entry.host, rowProps == null ? null : rowPropsFor(slot, rowProps));
     const body = itemBody(slot, render, hasExpander, expanderDescriptions);
     return createPortal(body, entry.host, entry.key);
 }
 function ItemRowImpl({ entry, rowProps, state, ...identity }) {
     const slot = useItemSlot(entry, state, identity);
     useRememberIdentity(entry, slot);
-    const props = rowPropsFor(slot, rowProps);
-    const previous = useRef(null);
-    useLayoutEffect(() => {
-        applyRowProps(entry.host, props, previous.current);
-        previous.current = props;
-    }, [entry.host, props]);
+    useAppliedRowProps(entry.host, rowPropsFor(slot, rowProps));
     return null;
 }
-function HeaderCellImpl({ entry, render, collection }) {
+function HeaderCellImpl({ entry, render }) {
     const item = useProperty(entry.host, "item") ?? null;
-    return createPortal(headerBody(slotRefFor(item), render, collection), entry.host, entry.key);
+    return createPortal(headerBody(levelStoreFor(item), render), entry.host, entry.key);
 }
-function NativeItemCell({ entry, render, keys, size }) {
+function NativeItemCell({ entry, render, rowProps, keys, size, }) {
     const position = useProperty(entry.host, "position");
     const item = useProperty(entry.host, "item") ?? null;
+    const args = item !== null && position !== undefined ? { item: item, index: position } : null;
+    useAppliedRowProps(entry.host, rowProps == null ? null : resolveRowProps(args === null ? NO_ROW_PROPS : rowProps(args)));
     let body = null;
-    if (item !== null && position !== undefined) {
-        const content = render({ item: item, index: position });
+    if (item !== null && args !== null) {
+        const content = render(args);
         const child = content == null || typeof content === "boolean" ? (_jsx(GtkBox, { widthRequest: size.width, heightRequest: size.height })) : (content);
         body = _jsx(Fragment, { children: child }, keys.keyFor(item));
     }
     return createPortal(body, entry.host, entry.key);
 }
-function headerBody(ref, render, collection) {
-    if (ref === null) {
-        return null;
-    }
-    const section = collection.sectionFor(ref.store.level.path);
-    if (section === undefined) {
+function headerBody(store, render) {
+    const section = store?.level.section;
+    if (store === null || section === undefined) {
         return null;
     }
     const renderHeader = render;
-    const key = joinParts([ref.store.level.path, section.id]);
+    const key = joinParts([store.key, section.id]);
     return _jsx(Fragment, { children: renderHeader({ section: section.value }) }, key);
 }
 function usePortalEntries(registry) {
     return useSyncExternalStore(registry.subscribe, registry.getEntries);
 }
-const ItemPortals = ({ registry, render, collection, hasExpander, expandedIds, expanderDescriptions, }) => {
-    const entries = usePortalEntries(registry);
+function useCollectionVersion(collection) {
+    return useSyncExternalStore(collection.subscribe, collection.getVersion);
+}
+function ItemCellListImpl({ entries, render, rowProps, collection, hasExpander, expandedIds, expanderDescriptions, }) {
     const state = useLatestRef({ collection, expandedIds });
-    return entries.map((entry) => (_jsx(ItemCell, { entry: entry, render: render, state: state, hasExpander: hasExpander ?? true, expanderDescriptions: expanderDescriptions, ...itemIdentity(entry, collection, expandedIds) }, entry.key)));
-};
-const RowPortals = ({ registry, rowProps, collection, expandedIds }) => {
+    return entries.map((entry) => (_jsx(ItemCell, { entry: entry, render: render, rowProps: rowProps, state: state, hasExpander: hasExpander ?? true, expanderDescriptions: expanderDescriptions, ...itemIdentity(entry, collection, expandedIds) }, entry.key)));
+}
+const ItemPortals = ({ registry, ...props }) => {
     const entries = usePortalEntries(registry);
+    useCollectionVersion(props.collection);
+    return _jsx(ItemCellList, { ...props, entries: entries, isPending: props.collection.isPending() });
+};
+function ItemRowListImpl({ entries, rowProps, collection, expandedIds }) {
     const state = useLatestRef({ collection, expandedIds });
     return entries.map((entry) => (_jsx(ItemRow, { entry: entry, rowProps: rowProps, state: state, ...itemIdentity(entry, collection, expandedIds) }, entry.key)));
+}
+const RowPortals = ({ registry, ...props }) => {
+    const entries = usePortalEntries(registry);
+    useCollectionVersion(props.collection);
+    return _jsx(ItemRowList, { ...props, entries: entries, isPending: props.collection.isPending() });
+};
+const HeaderPortals = ({ registry, render, collection }) => {
+    const entries = usePortalEntries(registry);
+    const version = useCollectionVersion(collection);
+    return entries.map((entry) => _jsx(HeaderCell, { entry: entry, render: render, version: version }, entry.key));
 };
-const HeaderPortals = ({ registry, render, collection }) => usePortalEntries(registry).map((entry) => (_jsx(HeaderCell, { entry: entry, render: render, collection: collection }, entry.key)));
-function NativeItemPortals({ registry, render, size }) {
+function NativeItemPortals({ registry, render, rowProps, size, }) {
     const entries = usePortalEntries(registry);
     const [keys] = useState(createNativeItemKeyStore);
-    return entries.map((entry) => (_jsx(NativeItemCell, { entry: entry, render: render, keys: keys, size: size }, entry.key)));
+    return entries.map((entry) => (_jsx(NativeItemCell, { entry: entry, render: render, rowProps: rowProps, keys: keys, size: size }, entry.key)));
 }
 const useSectionHeader = (render, collection, size) => {
     const registry = useHeaderCells(size);