@gtkx/components 1.0.0-rc.1 → 1.0.0-rc.2

package/src/hooks/use-collection-model.ts

@@ -1,60 +0,0 @@
-import type * as Gtk from "@gtkx/gi/gtk";
-import { type ReactNode, useCallback } from "react";
-import type { ItemNode, SectionNode } from "../types.js";
-import { type ItemResolver, rowIdOf } from "../utils/item-resolver.js";
-import { useExpansionModel } from "./use-expansion-model.js";
-import { useListModel } from "./use-list-model.js";
-import { useSelectionModel } from "./use-selection-model.js";
-
-type CollectionModelInput<T, S> = {
-    items: ItemNode<T>[] | undefined;
-    sections: SectionNode<S, T>[] | undefined;
-    selectionMode: Gtk.SelectionMode | null | undefined;
-    selectedIds: string[] | null | undefined;
-    onSelectionChanged: ((ids: string[]) => void) | null | undefined;
-    expandedIds?: string[] | null | undefined;
-    onExpandedChange?: ((ids: string[]) => void) | null | undefined;
-    renderHeader: ((info: { section: S }) => ReactNode) | null | undefined;
-};
-
-export type CollectionModelResult<T, S> = {
-    resolver: ItemResolver<T, S>;
-    headerResolver: ItemResolver<T, S>;
-    installedModel: Gtk.SelectionModel;
-    useHeader: boolean;
-    rowId: (row: Gtk.TreeListRow) => string | undefined;
-};
-
-export const useCollectionModel = <T, S>(input: CollectionModelInput<T, S>): CollectionModelResult<T, S> => {
-    const listModel = useListModel<T, S>({
-        items: input.items,
-        sections: input.sections,
-    });
-
-    useExpansionModel<T>({
-        treeModel: listModel.treeModel,
-        rowValues: listModel.rowValues,
-        expandedIds: input.expandedIds,
-        onExpandedChange: input.onExpandedChange,
-    });
-
-    const installedModel = useSelectionModel<T, S>({
-        base: listModel.model,
-        resolver: listModel.resolver,
-        selectionMode: input.selectionMode,
-        selectedIds: input.selectedIds,
-        onSelectionChanged: input.onSelectionChanged,
-    });
-
-    const useHeader = typeof input.renderHeader === "function";
-    const { rowValues } = listModel;
-    const rowId = useCallback((row: Gtk.TreeListRow): string | undefined => rowIdOf(rowValues, row), [rowValues]);
-
-    return {
-        resolver: listModel.resolver,
-        headerResolver: listModel.headerResolver,
-        installedModel,
-        useHeader,
-        rowId,
-    };
-};

package/src/hooks/use-collection-widget.ts

@@ -1,47 +0,0 @@
-import type * as Gtk from "@gtkx/gi/gtk";
-import { useMergeRefs } from "@gtkx/react/internal";
-import { type ReactNode, type Ref, type RefCallback, type RefObject, useRef } from "react";
-import type { ItemNode, SectionNode } from "../types.js";
-import { type CollectionModelResult, useCollectionModel } from "./use-collection-model.js";
-import { useInstalledModel } from "./use-installed-model.js";
-
-type CollectionWidget = Gtk.Widget & {
-    setModel(model: Gtk.SelectionModel | null): void;
-};
-
-type CollectionWidgetInput<W extends CollectionWidget, T, S> = {
-    ref?: Ref<W | null> | undefined;
-    items?: ItemNode<T>[] | undefined;
-    sections?: SectionNode<S, T>[] | undefined;
-    selectionMode?: Gtk.SelectionMode | null | undefined;
-    selectedIds?: string[] | null | undefined;
-    onSelectionChanged?: ((ids: string[]) => void) | null | undefined;
-    expandedIds?: string[] | null | undefined;
-    onExpandedChange?: ((ids: string[]) => void) | null | undefined;
-    renderHeader?: ((info: { section: S }) => ReactNode) | null | undefined;
-};
-
-type CollectionWidgetResult<W extends CollectionWidget, T, S> = {
-    widgetRef: RefObject<W | null>;
-    setRef: RefCallback<W>;
-    collection: CollectionModelResult<T, S>;
-};
-
-export const useCollectionWidget = <W extends CollectionWidget, T, S>(
-    props: CollectionWidgetInput<W, T, S>,
-): CollectionWidgetResult<W, T, S> => {
-    const widgetRef = useRef<W | null>(null);
-    const setRef = useMergeRefs<W>(props.ref, widgetRef);
-    const collection = useCollectionModel<T, S>({
-        items: props.items,
-        sections: props.sections,
-        selectionMode: props.selectionMode,
-        selectedIds: props.selectedIds,
-        onSelectionChanged: props.onSelectionChanged,
-        expandedIds: props.expandedIds,
-        onExpandedChange: props.onExpandedChange,
-        renderHeader: props.renderHeader,
-    });
-    useInstalledModel(widgetRef, collection.installedModel, (widget, model) => widget.setModel(model));
-    return { widgetRef, setRef, collection };
-};

package/src/hooks/use-drop-down-selection.ts

@@ -1,52 +0,0 @@
-import type * as GObject from "@gtkx/gi/gobject";
-import * as Gtk from "@gtkx/gi/gtk";
-import { useSignal } from "@gtkx/react";
-import { type ObjectProp, resolveObjectProp, useObjectValue } from "@gtkx/react/internal";
-import { useLayoutEffect, useRef } from "react";
-import type { ItemResolver } from "../utils/item-resolver.js";
-
-type DropDownSelectionObject = GObject.Object & {
-    getSelected(): number;
-    setSelected(position: number): void;
-};
-
-type DropDownSelectionOptions<T, S> = {
-    widget: ObjectProp<DropDownSelectionObject>;
-    resolver: ItemResolver<T, S>;
-    selectedId: string | null | undefined;
-    onSelectionChanged: ((id: string) => void) | null | undefined;
-};
-
-const normalizeSelected = (position: number): number =>
-    position === Gtk.INVALID_LIST_POSITION || position < 0 ? -1 : position;
-
-export const useDropDownSelection = <T, S>(options: DropDownSelectionOptions<T, S>): number => {
-    const { widget, resolver, selectedId, onSelectionChanged } = options;
-    const resolved = resolveObjectProp(widget);
-
-    const selectedPosition = useObjectValue(widget, "notify::selected", (object) =>
-        object === null ? -1 : normalizeSelected(object.getSelected()),
-    );
-
-    const resolverRef = useRef(resolver);
-    resolverRef.current = resolver;
-    const onSelectionChangedRef = useRef(onSelectionChanged);
-    onSelectionChangedRef.current = onSelectionChanged;
-
-    useLayoutEffect(() => {
-        if (resolved === null || selectedId === undefined || selectedId === null) return;
-        const position = resolverRef.current.positionOfId(selectedId);
-        if (position < 0) return;
-        if (normalizeSelected(resolved.getSelected()) !== position) resolved.setSelected(position);
-    }, [resolved, selectedId, resolver]);
-
-    useSignal(widget, "notify::selected", () => {
-        if (resolved === null) return;
-        const position = normalizeSelected(resolved.getSelected());
-        if (position < 0) return;
-        const id = resolverRef.current.idOf(position);
-        if (id !== undefined) onSelectionChangedRef.current?.(id);
-    });
-
-    return selectedPosition;
-};

package/src/hooks/use-expansion-model.ts

@@ -1,82 +0,0 @@
-import type * as GObject from "@gtkx/gi/gobject";
-import type * as Gtk from "@gtkx/gi/gtk";
-import { useSignal } from "@gtkx/react";
-import { isSameArray } from "@gtkx/utils";
-import { useLayoutEffect, useRef } from "react";
-import { type RowValue, rowIdOf } from "../utils/item-resolver.js";
-
-type ExpansionModelOptions<T> = {
-    treeModel: Gtk.TreeListModel | null;
-    rowValues: WeakMap<GObject.Object, RowValue<T>>;
-    expandedIds: string[] | null | undefined;
-    onExpandedChange: ((ids: string[]) => void) | null | undefined;
-};
-
-const readExpandedIds = <T>(model: Gtk.TreeListModel, rowValues: WeakMap<GObject.Object, RowValue<T>>): string[] => {
-    const ids: string[] = [];
-    const count = model.getNItems();
-    for (let position = 0; position < count; position++) {
-        const row = model.getRow(position);
-        if (row?.getExpanded()) {
-            const id = rowIdOf(rowValues, row);
-            if (id !== undefined) ids.push(id);
-        }
-    }
-    return ids;
-};
-
-const applyExpanded = <T>(
-    model: Gtk.TreeListModel,
-    rowValues: WeakMap<GObject.Object, RowValue<T>>,
-    ids: string[],
-): void => {
-    const target = new Set(ids);
-    let changed = true;
-    while (changed) {
-        changed = false;
-        const count = model.getNItems();
-        for (let position = 0; position < count; position++) {
-            const row = model.getRow(position);
-            if (row === null || !row.isExpandable()) continue;
-            const id = rowIdOf(rowValues, row);
-            if (id === undefined) continue;
-            const desired = target.has(id);
-            if (row.getExpanded() !== desired) {
-                row.setExpanded(desired);
-                changed = true;
-            }
-        }
-    }
-};
-
-export const useExpansionModel = <T>(options: ExpansionModelOptions<T>): void => {
-    const { treeModel, rowValues, expandedIds, onExpandedChange } = options;
-    const onChangeRef = useRef(onExpandedChange);
-    onChangeRef.current = onExpandedChange;
-    const rowValuesRef = useRef(rowValues);
-    rowValuesRef.current = rowValues;
-    const lastReportedRef = useRef<string[] | null>(null);
-    const applyingRef = useRef(false);
-
-    const report = (): void => {
-        if (treeModel === null || applyingRef.current) return;
-        const callback = onChangeRef.current;
-        if (!callback) return;
-        const ids = readExpandedIds(treeModel, rowValuesRef.current);
-        if (lastReportedRef.current !== null && isSameArray(lastReportedRef.current, ids)) return;
-        lastReportedRef.current = ids;
-        callback(ids);
-    };
-
-    useSignal(treeModel, "items-changed", report);
-
-    useLayoutEffect(() => {
-        if (treeModel === null) return;
-        if (expandedIds !== undefined && expandedIds !== null) {
-            applyingRef.current = true;
-            applyExpanded(treeModel, rowValuesRef.current, expandedIds);
-            applyingRef.current = false;
-        }
-        report();
-    }, [treeModel, expandedIds]);
-};

package/src/hooks/use-header-menu.ts

@@ -1,34 +0,0 @@
-import type * as Gio from "@gtkx/gi/gio";
-import type * as Gtk from "@gtkx/gi/gtk";
-import { createPortal, rootElement } from "@gtkx/react";
-import { useMergeRefs } from "@gtkx/react/internal";
-import {
-    cloneElement,
-    isValidElement,
-    type ReactElement,
-    type ReactNode,
-    type Ref,
-    type RefCallback,
-    useCallback,
-    useLayoutEffect,
-    useRef,
-} from "react";
-
-type MenuElement = ReactElement<{ ref?: Ref<Gio.MenuModel | null> }>;
-
-export const useHeaderMenu = (column: Gtk.ColumnViewColumn | null, headerMenu: ReactNode): ReactNode => {
-    const modelRef = useRef<Gio.MenuModel | null>(null);
-    const setModel = useCallback<RefCallback<Gio.MenuModel>>((model) => {
-        modelRef.current = model;
-    }, []);
-    const element = isValidElement(headerMenu) ? (headerMenu as MenuElement) : null;
-    const mergedRef = useMergeRefs<Gio.MenuModel>(setModel, element?.props.ref);
-
-    useLayoutEffect(() => {
-        if (column === null) return;
-        column.setHeaderMenu(headerMenu == null ? null : modelRef.current);
-    });
-
-    if (element === null) return null;
-    return createPortal(cloneElement(element, { ref: mergedRef }), rootElement);
-};

package/src/hooks/use-installed-model.ts

@@ -1,20 +0,0 @@
-import type * as Gtk from "@gtkx/gi/gtk";
-import { useObjectAttachment } from "@gtkx/react/internal";
-import { type RefObject, useRef } from "react";
-
-export const useInstalledModel = <W extends Gtk.Widget, M>(
-    object: RefObject<W | null>,
-    model: M,
-    install: (widget: W, model: M) => void,
-): void => {
-    const installRef = useRef(install);
-    installRef.current = install;
-    useObjectAttachment<W, { widget: W; model: M }>(object, {
-        attach: (widget) => {
-            installRef.current(widget, model);
-            return { widget, model };
-        },
-        detach: () => {},
-        isSame: (attachment, widget) => attachment.widget === widget && attachment.model === model,
-    });
-};

package/src/hooks/use-list-model.ts

@@ -1,161 +0,0 @@
-import type * as Gio from "@gtkx/gi/gio";
-import type * as GObject from "@gtkx/gi/gobject";
-import type * as Gtk from "@gtkx/gi/gtk";
-import { useLayoutEffect, useMemo, useRef } from "react";
-import type { ItemNode, SectionNode } from "../types.js";
-import {
-    createFlatModel,
-    createSectionModel,
-    createTreeModel,
-    resizeFlatModel,
-    retagRows,
-} from "../utils/item-models.js";
-import {
-    createItemResolver,
-    createSectionHeaderResolver,
-    createTreeResolver,
-    type ItemResolver,
-    type RowValue,
-} from "../utils/item-resolver.js";
-import { detectStructure, type ListStructure, structuralSignature } from "../utils/list-item-flatten.js";
-
-type ListModelInput<T, S> = {
-    items: ItemNode<T>[] | undefined;
-    sections?: SectionNode<S, T>[] | undefined;
-};
-
-type ListModelResult<T, S> = {
-    model: Gio.ListModel;
-    treeModel: Gtk.TreeListModel | null;
-    resolver: ItemResolver<T, S>;
-    headerResolver: ItemResolver<T, S>;
-    rowValues: WeakMap<GObject.Object, RowValue<T>>;
-};
-
-type ListModelStructure = "sections" | ListStructure;
-
-type ListModelState<T, S> = {
-    model: Gio.ListModel;
-    treeModel: Gtk.TreeListModel | null;
-    flatModel: Gtk.StringList | undefined;
-    items: ItemNode<T>[] | undefined;
-    sections: SectionNode<S, T>[] | undefined;
-    structure: ListModelStructure;
-    signature: string;
-    rowValues: WeakMap<GObject.Object, RowValue<T>>;
-    placeholdersById: Map<string, GObject.Object>;
-};
-
-const sectionRows = <T, S>(sections: SectionNode<S, T>[] | undefined): ItemNode<T>[] => {
-    if (sections === undefined) return [];
-    const rows: ItemNode<T>[] = [];
-    for (const section of sections) rows.push(...section.data);
-    return rows;
-};
-
-const sectionSignature = <T, S>(sections: SectionNode<S, T>[] | undefined): string => {
-    if (sections === undefined) return "";
-    const parts: string[] = [];
-    for (const section of sections) {
-        parts.push(`${section.id}{${structuralSignature(section.data)}}`);
-    }
-    return parts.join(",");
-};
-
-const signatureOf = <T, S>(
-    structure: ListModelStructure,
-    items: ItemNode<T>[] | undefined,
-    sections: SectionNode<S, T>[] | undefined,
-): string => {
-    if (structure === "sections") return `sections|${sectionSignature(sections)}`;
-    return structure === "flat" ? "" : `${structure}|${structuralSignature(items)}`;
-};
-
-type ListModelInternalInput<T, S> = {
-    items: ItemNode<T>[] | undefined;
-    sections: SectionNode<S, T>[] | undefined;
-    structure: ListModelStructure;
-    signature: string;
-};
-
-const buildState = <T, S>(input: ListModelInternalInput<T, S>): ListModelState<T, S> => {
-    const { items, sections, structure, signature } = input;
-    const rowValues = new WeakMap<GObject.Object, RowValue<T>>();
-    const placeholdersById = new Map<string, GObject.Object>();
-    let model: Gio.ListModel;
-    let treeModel: Gtk.TreeListModel | null = null;
-    let flatModel: Gtk.StringList | undefined;
-    if (structure === "sections") {
-        model = createSectionModel(sections ?? []);
-    } else if (structure === "tree") {
-        treeModel = createTreeModel(items ?? [], rowValues, placeholdersById);
-        model = treeModel;
-    } else {
-        flatModel = createFlatModel(items?.length ?? 0);
-        model = flatModel;
-    }
-    return { model, treeModel, flatModel, items, sections, structure, signature, rowValues, placeholdersById };
-};
-
-const resolveState = <T, S>(
-    prev: ListModelState<T, S> | null,
-    items: ItemNode<T>[] | undefined,
-    sections: SectionNode<S, T>[] | undefined,
-): ListModelState<T, S> => {
-    if (prev !== null && prev.items === items && prev.sections === sections) {
-        return prev;
-    }
-    const structure: ListModelStructure = sections !== undefined ? "sections" : detectStructure(items);
-    const signature = signatureOf(structure, items, sections);
-    const input: ListModelInternalInput<T, S> = { items, sections, structure, signature };
-    if (prev === null || prev.structure !== structure) {
-        return buildState(input);
-    }
-    if (structure !== "flat" && prev.signature !== signature) {
-        return buildState(input);
-    }
-    if (structure === "tree") {
-        retagRows(items ?? [], prev.rowValues, prev.placeholdersById);
-    }
-    prev.items = items;
-    prev.sections = sections;
-    prev.signature = signature;
-    return prev;
-};
-
-export const useListModel = <T, S>(input: ListModelInput<T, S>): ListModelResult<T, S> => {
-    const { items, sections } = input;
-    const stateRef = useRef<ListModelState<T, S> | null>(null);
-    const state = resolveState(stateRef.current, items, sections);
-    stateRef.current = state;
-    const { structure, flatModel } = state;
-
-    useLayoutEffect(() => {
-        if (flatModel !== undefined) {
-            resizeFlatModel(flatModel, items?.length ?? 0);
-        }
-    }, [flatModel, items]);
-
-    const resolver = useMemo(() => {
-        if (structure === "sections") {
-            return createItemResolver<T, S>(sectionRows(sections), true, state.rowValues);
-        }
-        if (structure === "tree" && state.treeModel !== null) {
-            return createTreeResolver<T, S>(items, state.rowValues, state.treeModel);
-        }
-        return createItemResolver<T, S>(items, false, state.rowValues);
-    }, [items, sections, structure, state.rowValues, state.treeModel]);
-
-    const headerResolver = useMemo(
-        () => createSectionHeaderResolver<T, S>(structure === "sections" ? sections : undefined),
-        [sections, structure],
-    );
-
-    return {
-        model: state.model,
-        treeModel: state.treeModel,
-        resolver,
-        headerResolver,
-        rowValues: state.rowValues,
-    };
-};

package/src/hooks/use-placed-child.ts

@@ -1,79 +0,0 @@
-import type * as GObject from "@gtkx/gi/gobject";
-import { createPortal, rootElement } from "@gtkx/react";
-import { useMergeRefs } from "@gtkx/react/internal";
-import {
-    type Context,
-    createContext,
-    type ReactNode,
-    type Ref,
-    type RefCallback,
-    type RefObject,
-    useCallback,
-    useContext,
-    useLayoutEffect,
-    useRef,
-} from "react";
-
-export type ParentContext<T> = {
-    Context: Context<RefObject<T | null> | null>;
-    useParentRef: () => RefObject<T | null>;
-};
-
-export const createParentContext = <T>(orphanMessage: string): ParentContext<T> => {
-    const context = createContext<RefObject<T | null> | null>(null);
-    return {
-        Context: context,
-        useParentRef: (): RefObject<T | null> => {
-            const ref = useContext(context);
-            if (!ref) throw new Error(orphanMessage);
-            return ref;
-        },
-    };
-};
-
-export type PlacedChildRender<T> = (ref: RefCallback<T>) => ReactNode;
-
-export type PlacedChildOptions<T extends GObject.Object, P> = {
-    render: PlacedChildRender<T>;
-    ref?: Ref<T | null> | undefined;
-    placement: P;
-    samePlacement: (a: P, b: P) => boolean;
-    place: (object: T, placement: P, previous: P | undefined) => void;
-    release: (object: T) => void;
-};
-
-export const usePlacedChild = <T extends GObject.Object, P>(options: PlacedChildOptions<T, P>): ReactNode => {
-    const { render, ref, placement, samePlacement, place, release } = options;
-    const objectRef = useRef<T | null>(null);
-    const appliedRef = useRef<{ object: T; placement: P } | null>(null);
-    const captureObject = useCallback<RefCallback<T>>((object) => {
-        objectRef.current = object;
-    }, []);
-    const setObjectRef = useMergeRefs<T>(ref, captureObject);
-
-    useLayoutEffect(() => {
-        const object = objectRef.current;
-        const applied = appliedRef.current;
-        if (applied !== null && applied.object !== object) {
-            release(applied.object);
-            appliedRef.current = null;
-        }
-        if (object === null) return;
-        const current = appliedRef.current;
-        if (current === null || !samePlacement(current.placement, placement)) {
-            place(object, placement, current?.placement);
-            appliedRef.current = { object, placement };
-        }
-    });
-
-    useLayoutEffect(
-        () => () => {
-            const applied = appliedRef.current;
-            if (applied !== null) release(applied.object);
-            appliedRef.current = null;
-        },
-        [],
-    );
-
-    return createPortal(render(setObjectRef), rootElement);
-};

package/src/hooks/use-selection-model.ts

@@ -1,114 +0,0 @@
-import type * as Gio from "@gtkx/gi/gio";
-import * as Gtk from "@gtkx/gi/gtk";
-import { useSignal } from "@gtkx/react";
-import { isSameArray } from "@gtkx/utils";
-import { useLayoutEffect, useRef } from "react";
-import type { ItemResolver } from "../utils/item-resolver.js";
-
-type SelectionModelOptions<T, S> = {
-    base: Gio.ListModel;
-    selectionMode: Gtk.SelectionMode | null | undefined;
-    selectedIds: string[] | null | undefined;
-    onSelectionChanged: ((ids: string[]) => void) | null | undefined;
-    resolver: ItemResolver<T, S>;
-};
-
-type WrappingSelectionModel = (Gtk.SingleSelection | Gtk.MultiSelection | Gtk.NoSelection) & Gtk.SelectionModel;
-
-const createSelectionModel = (mode: Gtk.SelectionMode, base: Gio.ListModel): WrappingSelectionModel => {
-    if (mode === Gtk.SelectionMode.MULTIPLE) return Gtk.MultiSelection.new(base);
-    if (mode === Gtk.SelectionMode.NONE) return Gtk.NoSelection.new(base);
-    return new Gtk.SingleSelection({ model: base, autoselect: false, canUnselect: true });
-};
-
-const bitsetOf = (positions: number[]): Gtk.Bitset => {
-    const bitset = Gtk.Bitset.newEmpty();
-    for (const position of positions) {
-        if (position >= 0) bitset.add(position);
-    }
-    return bitset;
-};
-
-const applySelectedPositions = (model: Gtk.SelectionModel, positions: number[]): void => {
-    if (model instanceof Gtk.MultiSelection) {
-        if (positions.length === 0) {
-            const current = model.getSelection();
-            if (!current.isEmpty()) model.unselectAll();
-            return;
-        }
-        const requested = bitsetOf(positions);
-        const changed = model.getSelection().copy();
-        changed.difference(requested);
-        if (changed.isEmpty()) return;
-        model.setSelection(requested, changed);
-        return;
-    }
-    if (positions.length === 0) {
-        model.unselectAll();
-        return;
-    }
-    const first = positions[0];
-    if (first !== undefined && first >= 0) model.selectItem(first, true);
-};
-
-const readSelectedIds = <T, S>(model: Gtk.SelectionModel, resolver: ItemResolver<T, S>): string[] => {
-    const selection = model.getSelection();
-    const ids: string[] = [];
-    const count = Number(selection.getSize());
-    for (let index = 0; index < count; index++) {
-        const position = selection.getNth(index);
-        const id = resolver.idOf(position);
-        if (id !== undefined) ids.push(id);
-    }
-    return ids;
-};
-
-const idsToPositions = <T, S>(ids: string[] | null | undefined, resolver: ItemResolver<T, S>): number[] => {
-    if (ids === undefined || ids === null) return [];
-    const positions: number[] = [];
-    for (const id of ids) {
-        const position = resolver.positionOfId(id);
-        if (position >= 0) positions.push(position);
-    }
-    return positions;
-};
-
-export const useSelectionModel = <T, S>(options: SelectionModelOptions<T, S>): Gtk.SelectionModel => {
-    const { base, selectionMode, selectedIds, onSelectionChanged, resolver } = options;
-    const mode = selectionMode ?? Gtk.SelectionMode.SINGLE;
-
-    const modelRef = useRef<WrappingSelectionModel | null>(null);
-    const modeRef = useRef<Gtk.SelectionMode | null>(null);
-    if (modelRef.current === null || modeRef.current !== mode) {
-        modelRef.current = createSelectionModel(mode, base);
-        modeRef.current = mode;
-    }
-    const model = modelRef.current;
-
-    const onChangedRef = useRef(onSelectionChanged);
-    onChangedRef.current = onSelectionChanged;
-    const resolverRef = useRef(resolver);
-    resolverRef.current = resolver;
-    const lastReportedRef = useRef<string[] | null>(null);
-
-    const report = (): void => {
-        const callback = onChangedRef.current;
-        if (!callback) return;
-        const ids = readSelectedIds(model, resolverRef.current);
-        if (lastReportedRef.current !== null && isSameArray(lastReportedRef.current, ids)) return;
-        lastReportedRef.current = ids;
-        callback(ids);
-    };
-
-    useSignal(model, "selection-changed", report);
-
-    useLayoutEffect(() => {
-        if (model.getModel() !== base) model.setModel(base);
-        if (selectedIds !== undefined && selectedIds !== null) {
-            applySelectedPositions(model, idsToPositions(selectedIds, resolver));
-        }
-        report();
-    }, [model, base, selectedIds, resolver]);
-
-    return model;
-};