import { SelectionMode, Selector } from "@vitoni/selector";

    // identifies all elements which can be selected
    const selectableElementsSelector = "div.selectable";

    function handleSelected(selectedElements: HTMLElement[], selectionMode: SelectionMode) {
        // Other uses cases might change the data model which the elements visualize instead of the elements themselves.
        // The changed data model would trigger an update of the respective elements indirectly.
        selectedElements.forEach((selectedElement) => {
            if (selectionMode == SelectionMode.ADD) {
                selectedElement.classList.add(selectectedClass);
            } else {
                selectedElement.classList.remove(selectectedClass);
            }
        });
    }

    const selector = new Selector(
        selectableElementsSelector,
        handleSelected
    );

    ...

    selector.mount();
    ...
    // change mode of selection to deselect elements
    selector.setSelectionMode(SelectionMode.REMOVE);
    ...
    // change mode of selection to select elements
    selector.setSelectionMode(SelectionMode.ADD);
    ...
    // cleanup only needed for SPA
    selector.unmount();

    ...

    const areaSelector = "#" + areaId;

    // Identifies an area, the selection is restricted to.
    // Useful:
    //  - when multiple selection areas are used
    //  - to show visual constrains of the selection area
    const selectablesRootSelector = areaSelector + " div.selectables-root";

    // identifies all elements which can be selected
    const selectableElementsSelector = "div.selectable";

    ...

    const selector = new Selector(
        selectableElementsSelector,
        handleSelected,
        {
            selectablesRootSelector
        }
    );

    ...

    ...

    // allows changes on single elements without selection / changing the selection mode
    function onClick(element: HTMLElement) {
        if (element.classList.contains(selectectedClass)) {
            element.classList.remove(selectectedClass);
        } else {
            element.classList.add(selectectedClass);
        }
    }

    const selector = new Selector(
        selectableElementsSelector,
        handleSelected,
        {
            onClick
        }
    );

    ...