How to use the roosterjs-editor-types.QueryScope.OnSelection function in roosterjs-editor-types

editor.addUndoSnapshot(() => {
        execCommand(editor, DocumentCommand.RemoveFormat);

        editor.queryElements('[class]', QueryScope.OnSelection, node =>
            node.removeAttribute('class')
        );

        const defaultFormat = editor.getDefaultFormat();
        const isDefaultFormatEmpty = Object.keys(defaultFormat).length === 0;
        editor.queryElements('[style]', QueryScope.InSelection, node => {
            STYLES_TO_REMOVE.forEach(style => node.style.removeProperty(style));

            // when default format is empty, keep the HTML minimum by removing style attribute if there's no style
            // (note: because default format is empty, we're not adding style back in)
            if (isDefaultFormatEmpty && node.getAttribute('style') === '') {
                node.removeAttribute('style');
            }
        });

        if (!isDefaultFormatEmpty) {

editor.addUndoSnapshot(() => {
        editor.focus();
        let listNode = editor.getElementAtCursor('OL,UL');
        let newNode: Node;

        if (listNode) {
            // There is already list node, setIndentation() will increase/decrease the list level,
            // so we need to process the list when change indentation
            newNode = processList(editor, command);
        } else {
            // No existing list node, browser will create <blockquote> node for indentation.
            // We need to set top and bottom margin to 0 to avoid unnecessary spaces
            editor.getDocument().execCommand(command, false, null);
            editor.queryElements('BLOCKQUOTE', QueryScope.OnSelection, node =&gt; {
                newNode = newNode || node;
                node.style.marginTop = '0px';
                node.style.marginBottom = '0px';
            });
        }

        return newNode;
    }, ChangeSource.Format);
}
</blockquote>

onClick: (editor, strings) => {
        editor.saveSelectionRange();
        let link = '';
        try {
            link = (editor.queryElements('a[href]', QueryScope.OnSelection)[0] as HTMLAnchorElement).href;
        } catch (e) {}

        confirm(
            getString('dlgLinkTitle', strings),
            getString('dlgUrlLabel', strings),
            link,
            strings
        ).then(link => {
            if (link) {
                editor.focus();
                createLink(editor, link, link);
            }
        });
    },
};

export default function queryNodesWithSelection(
    editor: Editor,
    selector: string,
    nodeContainedByRangeOnly?: boolean,
    forEachCallback?: (node: T) => void
): T[] {
    return editor.queryElements(
        selector,
        nodeContainedByRangeOnly ? QueryScope.InSelection : QueryScope.OnSelection,
        forEachCallback
    );
}

function getAnchorNodeAtCursor(editor: Editor): HTMLAnchorElement {
    return editor.queryElements('a[href]', QueryScope.OnSelection)[0] as HTMLAnchorElement;
}

editor.addUndoSnapshot((start, end) => {
        editor.queryElements('a[href]', QueryScope.OnSelection, unwrap);
        editor.select(start, end);
    }, ChangeSource.Format);
}

editor.addUndoSnapshot(() => {
        editor.queryElements('img', QueryScope.OnSelection, node =>
            node.setAttribute('alt', altText)
        );
    }, ChangeSource.Format);
}

onClick: (editor, strings) => {
        editor.saveSelectionRange();
        let node = editor.queryElements('img', QueryScope.OnSelection)[0];
        let alt = (node as HTMLImageElement).alt;
        confirm(getString('dlgAltTextTitle', strings), null, alt, strings).then(alt => {
            editor.focus();
            setImageAltText(editor, alt);
        });
    },
};

export function getElementBasedFormatState(
    editor: Editor,
    event?: PluginEvent
): ElementBasedFormatState {
    let listTag = getTagOfNode(cacheGetElementAtCursor(editor, event, 'OL,UL'));
    let headerTag = getTagOfNode(cacheGetElementAtCursor(editor, event, 'H1,H2,H3,H4,H5,H6'));

    return {
        isBullet: listTag == 'UL',
        isNumbering: listTag == 'OL',
        headerLevel: (headerTag && parseInt(headerTag[1])) || 0,

        canUnlink: !!editor.queryElements('a[href]', QueryScope.OnSelection)[0],
        canAddImageAltText: !!editor.queryElements('img', QueryScope.OnSelection)[0],
        isBlockQuote: !!editor.queryElements('blockquote', QueryScope.OnSelection)[0],
    };
}

editor.addUndoSnapshot(() => {
        editor.focus();

        let wrapped = false;
        editor.queryElements('H1,H2,H3,H4,H5,H6', QueryScope.OnSelection, header => {
            if (!wrapped) {
                editor.getDocument().execCommand(DocumentCommand.FormatBlock, false, '<div>');
                wrapped = true;
            }

            let div = editor.getDocument().createElement('div');
            while (header.firstChild) {
                div.appendChild(header.firstChild);
            }
            editor.replaceNode(header, div);
        });

        if (level &gt; 0) {
            let traverser = editor.getSelectionTraverser();
            let inlineElement = traverser ? traverser.currentInlineElement : null;
            while (inlineElement) {
</div>