d2coreui 21.0.33 → 23.0.0

package/components/scrollTo/scrollTo.js

@@ -1,265 +1,265 @@
-import * as React from 'react';
-import { Component } from 'react';
-import scrollIntoView from "dom-scroll-into-view";
-import debounce from "lodash/debounce";
-import { Tooltip } from "antd";
-import onlyText from './onlyText';
-import memoizeOne from "memoize-one";
-import ReactDOMServer from "react-dom/server";
-import { Key } from "ts-key-enum";
-import KeyboardUtils from "../keyboard/keyboardUtils";
-const MarkTextContext = React.createContext("");
-export class ScrollToItem extends Component {
-    constructor(props) {
-        super(props);
-        this.getChildrenTextContent = memoizeOne(this.getChildrenTextContent.bind(this));
-        this.getChildrenHtmlContent = memoizeOne(this.getChildrenHtmlContent.bind(this));
-    }
-    getChildrenTextContent(children) {
-        if (!!this.props.dangerouslySetInnerHTML) {
-            return this.props.dangerouslySetInnerHTML.replace(/(<([^>]+)>)/ig, '').toLowerCase();
-        }
-        else if (children === undefined) {
-            return "";
-        }
-        else {
-            return onlyText(children).toLowerCase();
-        }
-    }
-    getChildrenHtmlContent(children, markedString) {
-        let htmlCode;
-        if (!!this.props.dangerouslySetInnerHTML) {
-            htmlCode = this.props.dangerouslySetInnerHTML;
-        }
-        else {
-            switch (typeof children) {
-                case "string":
-                    htmlCode = children;
-                    break;
-                case "undefined":
-                    htmlCode = "";
-                    break;
-                default:
-                    htmlCode = ReactDOMServer.renderToString(children);
-            }
-        }
-        const markedStringIndex = htmlCode.toLowerCase().indexOf(markedString);
-        if (markedStringIndex >= 0) {
-            const markedTextClassName = this.props.markedTextClassName ? this.props.markedTextClassName : "marked-text";
-            return htmlCode.substring(0, markedStringIndex) + "<span class=\"" + markedTextClassName + "\">" + htmlCode.substring(markedStringIndex, markedStringIndex + markedString.length) + "</span>" + htmlCode.substring(markedStringIndex + markedString.length);
-        }
-        else {
-            return htmlCode;
-        }
-    }
-    renderChildren() {
-        if (this.context) {
-            const childrenHtmlContent = this.getChildrenHtmlContent(this.props.children, this.context);
-            return React.createElement("span", { dangerouslySetInnerHTML: { __html: childrenHtmlContent } });
-        }
-        else if (!!this.props.dangerouslySetInnerHTML) {
-            return React.createElement("span", { dangerouslySetInnerHTML: { __html: this.props.dangerouslySetInnerHTML } });
-        }
-        else {
-            return this.props.children;
-        }
-    }
-    render() {
-        const textContent = this.getChildrenTextContent(this.props.children);
-        return (React.createElement("span", { tabIndex: 0, className: `selectable ${this.props.selected ? "selected" : ""}`, "data-content": textContent, "data-key": this.props.selectionKey }, this.renderChildren()));
-    }
-}
-ScrollToItem.contextType = MarkTextContext;
-export default class ScrollTo extends Component {
-    constructor(props) {
-        super(props);
-        this.scrollWrapper = null;
-        this.scrollParent = null;
-        this.state = {
-            searchString: "",
-            searchStringFound: false,
-        };
-        this.scrollToElement = debounce(this.scrollToElement, 400, { maxWait: 400 });
-    }
-    componentDidMount() {
-        if (this.props.scrollOnMount && this.scrollWrapper) {
-            const scrollToElement = this.scrollWrapper.querySelector(".selected");
-            if (scrollToElement) {
-                this.scrollToElement(scrollToElement);
-            }
-        }
-    }
-    scrollToElement(scrollToElem, scrollingUp = false) {
-        scrollIntoView(scrollToElem, this.scrollParent, {
-            onlyScrollIfNeeded: true,
-            allowHorizontalScroll: false,
-            alignWithTop: scrollingUp,
-            offsetTop: 50,
-            offsetBottom: 50,
-        });
-    }
-    getScrollParent(element, includeHidden = false) {
-        var style = getComputedStyle(element);
-        var excludeStaticParent = style.position === "absolute";
-        var overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;
-        if (style.position === "fixed")
-            return document.body;
-        let parent;
-        for (parent = element; (parent = parent.parentElement);) {
-            style = getComputedStyle(parent);
-            if (excludeStaticParent && style.position === "static") {
-                continue;
-            }
-            if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX))
-                return parent;
-        }
-        return document.body;
-    }
-    focusNext(currentElement, selectables) {
-        if (currentElement) {
-            const currentElementIndex = selectables.indexOf(currentElement);
-            if (currentElementIndex >= 0 && currentElementIndex < selectables.length - 1) {
-                const scrollToElem = selectables[currentElementIndex + 1];
-                scrollToElem.focus();
-                this.scrollToElement(scrollToElem);
-                return;
-            }
-            else if (currentElementIndex === selectables.length - 1) {
-                return;
-            }
-        }
-        if (selectables.length > 0) {
-            selectables[0].focus();
-            this.scrollToElement(selectables[0]);
-        }
-    }
-    scrollToLast() {
-        if (!!this.scrollWrapper) {
-            let selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
-            if (selectables.length > 0) {
-                const focusedElement = selectables[selectables.length - 1];
-                this.scrollToElement(focusedElement, false);
-            }
-        }
-    }
-    focusToLast() {
-        if (!!this.scrollWrapper) {
-            let selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
-            if (selectables.length > 0) {
-                const focusedElement = selectables[selectables.length - 1];
-                focusedElement.focus();
-                this.scrollToElement(focusedElement, false);
-            }
-        }
-    }
-    focusPrev(currentElement, selectables) {
-        if (currentElement) {
-            const currentElementIndex = selectables.indexOf(currentElement);
-            if (currentElementIndex > 0) {
-                const scrollToElem = selectables[currentElementIndex - 1];
-                scrollToElem.focus();
-                this.scrollToElement(scrollToElem);
-                return;
-            }
-            else if (currentElementIndex === 0) {
-                return;
-            }
-        }
-        if (selectables.length > 0) {
-            const scrollToElem = selectables[selectables.length - 1];
-            scrollToElem.focus();
-            this.scrollToElement(scrollToElem);
-        }
-    }
-    focusBySearchString(searchString) {
-        var _a;
-        const elementToFocus = (_a = this.scrollWrapper) === null || _a === void 0 ? void 0 : _a.querySelector(`.selectable[data-content*="${searchString.toLowerCase()}"]`);
-        if (elementToFocus) {
-            elementToFocus.focus();
-            this.scrollToElement(elementToFocus);
-        }
-        return elementToFocus;
-    }
-    render() {
-        return (React.createElement("div", { ref: (scrollWrapper) => {
-                this.scrollWrapper = scrollWrapper;
-                if (this.scrollWrapper) {
-                    this.scrollParent = this.getScrollParent(this.scrollWrapper);
-                }
-                else {
-                    this.scrollParent = null;
-                }
-            }, tabIndex: -1, onKeyDown: (e) => {
-                var _a, _b, _c, _d;
-                if (e.target instanceof HTMLInputElement) {
-                    return;
-                }
-                if (!this.scrollWrapper) {
-                    return;
-                }
-                if (KeyboardUtils.isKeyPressed(Key.Control) || KeyboardUtils.isKeyPressed(Key.Alt)) {
-                    return;
-                }
-                const supressKeyboardEvent = (_b = (_a = this.props).supressKeyboardEvent) === null || _b === void 0 ? void 0 : _b.call(_a, (_d = (_c = document.activeElement) === null || _c === void 0 ? void 0 : _c.dataset) === null || _d === void 0 ? void 0 : _d.key, e);
-                if (supressKeyboardEvent) {
-                    e.preventDefault();
-                    return;
-                }
-                let focusedElement = document.activeElement;
-                let selectables;
-                if (this.state.searchString && this.state.searchStringFound) {
-                    selectables = Array.from(this.scrollWrapper.querySelectorAll(`.selectable[data-content*="${this.state.searchString.toLowerCase()}"]`));
-                }
-                else {
-                    selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
-                }
-                const focusedElementIndex = selectables.indexOf(focusedElement);
-                if (e.key === Key.ArrowDown || e.key === Key.ArrowUp) {
-                    e.preventDefault();
-                    if (!focusedElement || focusedElementIndex < 0) {
-                        const selectedElements = Array.from(this.scrollWrapper.getElementsByClassName("selected"));
-                        focusedElement = selectedElements.length > 0 ? selectedElements[0] : null;
-                    }
-                    if (e.key === Key.ArrowDown && focusedElement) {
-                        this.focusNext(focusedElement, selectables);
-                    }
-                    else if (e.key === Key.ArrowUp && focusedElement) {
-                        this.focusPrev(focusedElement, selectables);
-                    }
-                }
-                else if (e.key === Key.Enter && focusedElementIndex >= 0) {
-                    if (typeof focusedElement.click == "function") {
-                        focusedElement.click.apply(focusedElement);
-                    }
-                    this.setState({ searchString: "", searchStringFound: false });
-                }
-                else if (e.key.length === 1) {
-                    const searchString = this.state.searchString + e.key;
-                    const focusedElement = this.focusBySearchString(searchString);
-                    this.setState({ searchString: searchString, searchStringFound: !!focusedElement });
-                }
-                else if (e.key === Key.Backspace) {
-                    const searchString = this.state.searchString.slice(0, -1);
-                    const focusedElement = this.focusBySearchString(searchString);
-                    this.setState({ searchString: searchString, searchStringFound: !!focusedElement });
-                }
-                else if (e.key === Key.Escape) {
-                    this.setState({ searchString: "", searchStringFound: false });
-                }
-            }, onClick: () => {
-                this.setState({ searchString: "", searchStringFound: false });
-            }, onBlur: (_) => {
-                setTimeout(() => {
-                    var _a, _b;
-                    if (!((_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.includes("selectable")) && (this.state.searchString !== "" || this.state.searchStringFound)) {
-                        this.setState({ searchString: "", searchStringFound: false });
-                    }
-                }, 0);
-            } },
-            React.createElement("div", { style: { position: "fixed", top: 16, left: 16 } },
-                React.createElement(Tooltip, { overlayClassName: !this.state.searchStringFound ? "search-string-not-found" : undefined, align: { points: ["tl", "tl"], overflow: { adjustX: true, adjustY: true } }, open: !!this.state.searchString, title: this.state.searchString },
-                    React.createElement("span", null))),
-            React.createElement(MarkTextContext.Provider, { value: this.state.searchString }, this.props.children)));
-    }
-}
+import * as React from 'react';
+import { Component } from 'react';
+import scrollIntoView from "dom-scroll-into-view";
+import debounce from "lodash/debounce";
+import { Tooltip } from "antd";
+import onlyText from './onlyText';
+import memoizeOne from "memoize-one";
+import ReactDOMServer from "react-dom/server";
+import { Key } from "ts-key-enum";
+import KeyboardUtils from "../keyboard/keyboardUtils";
+const MarkTextContext = React.createContext("");
+export class ScrollToItem extends Component {
+    constructor(props) {
+        super(props);
+        this.getChildrenTextContent = memoizeOne(this.getChildrenTextContent.bind(this));
+        this.getChildrenHtmlContent = memoizeOne(this.getChildrenHtmlContent.bind(this));
+    }
+    getChildrenTextContent(children) {
+        if (!!this.props.dangerouslySetInnerHTML) {
+            return this.props.dangerouslySetInnerHTML.replace(/(<([^>]+)>)/ig, '').toLowerCase();
+        }
+        else if (children === undefined) {
+            return "";
+        }
+        else {
+            return onlyText(children).toLowerCase();
+        }
+    }
+    getChildrenHtmlContent(children, markedString) {
+        let htmlCode;
+        if (!!this.props.dangerouslySetInnerHTML) {
+            htmlCode = this.props.dangerouslySetInnerHTML;
+        }
+        else {
+            switch (typeof children) {
+                case "string":
+                    htmlCode = children;
+                    break;
+                case "undefined":
+                    htmlCode = "";
+                    break;
+                default:
+                    htmlCode = ReactDOMServer.renderToString(children);
+            }
+        }
+        const markedStringIndex = htmlCode.toLowerCase().indexOf(markedString);
+        if (markedStringIndex >= 0) {
+            const markedTextClassName = this.props.markedTextClassName ? this.props.markedTextClassName : "marked-text";
+            return htmlCode.substring(0, markedStringIndex) + "<span class=\"" + markedTextClassName + "\">" + htmlCode.substring(markedStringIndex, markedStringIndex + markedString.length) + "</span>" + htmlCode.substring(markedStringIndex + markedString.length);
+        }
+        else {
+            return htmlCode;
+        }
+    }
+    renderChildren() {
+        if (this.context) {
+            const childrenHtmlContent = this.getChildrenHtmlContent(this.props.children, this.context);
+            return React.createElement("span", { dangerouslySetInnerHTML: { __html: childrenHtmlContent } });
+        }
+        else if (!!this.props.dangerouslySetInnerHTML) {
+            return React.createElement("span", { dangerouslySetInnerHTML: { __html: this.props.dangerouslySetInnerHTML } });
+        }
+        else {
+            return this.props.children;
+        }
+    }
+    render() {
+        const textContent = this.getChildrenTextContent(this.props.children);
+        return (React.createElement("span", { tabIndex: 0, className: `selectable ${this.props.selected ? "selected" : ""}`, "data-content": textContent, "data-key": this.props.selectionKey }, this.renderChildren()));
+    }
+}
+ScrollToItem.contextType = MarkTextContext;
+export default class ScrollTo extends Component {
+    constructor(props) {
+        super(props);
+        this.scrollWrapper = null;
+        this.scrollParent = null;
+        this.state = {
+            searchString: "",
+            searchStringFound: false,
+        };
+        this.scrollToElement = debounce(this.scrollToElement, 400, { maxWait: 400 });
+    }
+    componentDidMount() {
+        if (this.props.scrollOnMount && this.scrollWrapper) {
+            const scrollToElement = this.scrollWrapper.querySelector(".selected");
+            if (scrollToElement) {
+                this.scrollToElement(scrollToElement);
+            }
+        }
+    }
+    scrollToElement(scrollToElem, scrollingUp = false) {
+        scrollIntoView(scrollToElem, this.scrollParent, {
+            onlyScrollIfNeeded: true,
+            allowHorizontalScroll: false,
+            alignWithTop: scrollingUp,
+            offsetTop: 50,
+            offsetBottom: 50,
+        });
+    }
+    getScrollParent(element, includeHidden = false) {
+        var style = getComputedStyle(element);
+        var excludeStaticParent = style.position === "absolute";
+        var overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;
+        if (style.position === "fixed")
+            return document.body;
+        let parent;
+        for (parent = element; (parent = parent.parentElement);) {
+            style = getComputedStyle(parent);
+            if (excludeStaticParent && style.position === "static") {
+                continue;
+            }
+            if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX))
+                return parent;
+        }
+        return document.body;
+    }
+    focusNext(currentElement, selectables) {
+        if (currentElement) {
+            const currentElementIndex = selectables.indexOf(currentElement);
+            if (currentElementIndex >= 0 && currentElementIndex < selectables.length - 1) {
+                const scrollToElem = selectables[currentElementIndex + 1];
+                scrollToElem.focus();
+                this.scrollToElement(scrollToElem);
+                return;
+            }
+            else if (currentElementIndex === selectables.length - 1) {
+                return;
+            }
+        }
+        if (selectables.length > 0) {
+            selectables[0].focus();
+            this.scrollToElement(selectables[0]);
+        }
+    }
+    scrollToLast() {
+        if (!!this.scrollWrapper) {
+            let selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
+            if (selectables.length > 0) {
+                const focusedElement = selectables[selectables.length - 1];
+                this.scrollToElement(focusedElement, false);
+            }
+        }
+    }
+    focusToLast() {
+        if (!!this.scrollWrapper) {
+            let selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
+            if (selectables.length > 0) {
+                const focusedElement = selectables[selectables.length - 1];
+                focusedElement.focus();
+                this.scrollToElement(focusedElement, false);
+            }
+        }
+    }
+    focusPrev(currentElement, selectables) {
+        if (currentElement) {
+            const currentElementIndex = selectables.indexOf(currentElement);
+            if (currentElementIndex > 0) {
+                const scrollToElem = selectables[currentElementIndex - 1];
+                scrollToElem.focus();
+                this.scrollToElement(scrollToElem);
+                return;
+            }
+            else if (currentElementIndex === 0) {
+                return;
+            }
+        }
+        if (selectables.length > 0) {
+            const scrollToElem = selectables[selectables.length - 1];
+            scrollToElem.focus();
+            this.scrollToElement(scrollToElem);
+        }
+    }
+    focusBySearchString(searchString) {
+        var _a;
+        const elementToFocus = (_a = this.scrollWrapper) === null || _a === void 0 ? void 0 : _a.querySelector(`.selectable[data-content*="${searchString.toLowerCase()}"]`);
+        if (elementToFocus) {
+            elementToFocus.focus();
+            this.scrollToElement(elementToFocus);
+        }
+        return elementToFocus;
+    }
+    render() {
+        return (React.createElement("div", { ref: (scrollWrapper) => {
+                this.scrollWrapper = scrollWrapper;
+                if (this.scrollWrapper) {
+                    this.scrollParent = this.getScrollParent(this.scrollWrapper);
+                }
+                else {
+                    this.scrollParent = null;
+                }
+            }, tabIndex: -1, onKeyDown: (e) => {
+                var _a, _b, _c, _d;
+                if (e.target instanceof HTMLInputElement) {
+                    return;
+                }
+                if (!this.scrollWrapper) {
+                    return;
+                }
+                if (KeyboardUtils.isKeyPressed(Key.Control) || KeyboardUtils.isKeyPressed(Key.Alt)) {
+                    return;
+                }
+                const supressKeyboardEvent = (_b = (_a = this.props).supressKeyboardEvent) === null || _b === void 0 ? void 0 : _b.call(_a, (_d = (_c = document.activeElement) === null || _c === void 0 ? void 0 : _c.dataset) === null || _d === void 0 ? void 0 : _d.key, e);
+                if (supressKeyboardEvent) {
+                    e.preventDefault();
+                    return;
+                }
+                let focusedElement = document.activeElement;
+                let selectables;
+                if (this.state.searchString && this.state.searchStringFound) {
+                    selectables = Array.from(this.scrollWrapper.querySelectorAll(`.selectable[data-content*="${this.state.searchString.toLowerCase()}"]`));
+                }
+                else {
+                    selectables = Array.from(this.scrollWrapper.getElementsByClassName("selectable"));
+                }
+                const focusedElementIndex = selectables.indexOf(focusedElement);
+                if (e.key === Key.ArrowDown || e.key === Key.ArrowUp) {
+                    e.preventDefault();
+                    if (!focusedElement || focusedElementIndex < 0) {
+                        const selectedElements = Array.from(this.scrollWrapper.getElementsByClassName("selected"));
+                        focusedElement = selectedElements.length > 0 ? selectedElements[0] : null;
+                    }
+                    if (e.key === Key.ArrowDown && focusedElement) {
+                        this.focusNext(focusedElement, selectables);
+                    }
+                    else if (e.key === Key.ArrowUp && focusedElement) {
+                        this.focusPrev(focusedElement, selectables);
+                    }
+                }
+                else if (e.key === Key.Enter && focusedElementIndex >= 0) {
+                    if (typeof focusedElement.click == "function") {
+                        focusedElement.click.apply(focusedElement);
+                    }
+                    this.setState({ searchString: "", searchStringFound: false });
+                }
+                else if (e.key.length === 1) {
+                    const searchString = this.state.searchString + e.key;
+                    const focusedElement = this.focusBySearchString(searchString);
+                    this.setState({ searchString: searchString, searchStringFound: !!focusedElement });
+                }
+                else if (e.key === Key.Backspace) {
+                    const searchString = this.state.searchString.slice(0, -1);
+                    const focusedElement = this.focusBySearchString(searchString);
+                    this.setState({ searchString: searchString, searchStringFound: !!focusedElement });
+                }
+                else if (e.key === Key.Escape) {
+                    this.setState({ searchString: "", searchStringFound: false });
+                }
+            }, onClick: () => {
+                this.setState({ searchString: "", searchStringFound: false });
+            }, onBlur: (_) => {
+                setTimeout(() => {
+                    var _a, _b;
+                    if (!((_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.className) === null || _b === void 0 ? void 0 : _b.includes("selectable")) && (this.state.searchString !== "" || this.state.searchStringFound)) {
+                        this.setState({ searchString: "", searchStringFound: false });
+                    }
+                }, 0);
+            } },
+            React.createElement("div", { style: { position: "fixed", top: 16, left: 16 } },
+                React.createElement(Tooltip, { overlayClassName: !this.state.searchStringFound ? "search-string-not-found" : undefined, align: { points: ["tl", "tl"], overflow: { adjustX: true, adjustY: true } }, open: !!this.state.searchString, title: this.state.searchString },
+                    React.createElement("span", null))),
+            React.createElement(MarkTextContext.Provider, { value: this.state.searchString }, this.props.children)));
+    }
+}
 //# sourceMappingURL=scrollTo.js.map