d2coreui 23.0.15 → 23.0.17

package/components/scrollTo/scrollTo.tsx

@@ -1,324 +0,0 @@
-import * as React from 'react'
-import {Component, ReactElement} 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("");
-
-interface ScrollToItemProps {
-    /* flag to notify currently selected item*/
-    selected?: boolean
-
-    selectionKey?: string
-
-    markedTextClassName?: string
-
-    dangerouslySetInnerHTML?: string
-
-    children?: React.ReactNode;
-}
-
-/*
-* Item component where user can be scrolled in
-*/
-export class ScrollToItem extends Component<ScrollToItemProps> {
-    static contextType = MarkTextContext;
-
-    constructor(props: Readonly<ScrollToItemProps>) {
-        super(props);
-        this.getChildrenTextContent = memoizeOne(this.getChildrenTextContent.bind(this));
-        this.getChildrenHtmlContent = memoizeOne(this.getChildrenHtmlContent.bind(this));
-    }
-
-    getChildrenTextContent(children: React.ReactNode | undefined) {
-        if (!!this.props.dangerouslySetInnerHTML) {
-            return this.props.dangerouslySetInnerHTML.replace(/(<([^>]+)>)/ig, '').toLowerCase();
-        } else if (children === undefined) {
-            return "";
-        } else {
-            return onlyText(children).toLowerCase();
-        }
-    }
-
-    getChildrenHtmlContent(children: React.ReactNode | undefined, markedString: string) {
-        let htmlCode: string;
-        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 as ReactElement);
-            }
-        }
-
-        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 as string);
-            return <span dangerouslySetInnerHTML={{__html: childrenHtmlContent}}/>
-        } else if (!!this.props.dangerouslySetInnerHTML) {
-            return <span dangerouslySetInnerHTML={{__html: this.props.dangerouslySetInnerHTML}}/>
-        } else {
-            return this.props.children;
-        }
-    }
-
-    render() {
-        const textContent = this.getChildrenTextContent(this.props.children);
-        return (
-            <span tabIndex={0}
-                  className={`selectable ${this.props.selected ? "selected" : ""}`}
-                  data-content={textContent}
-                  data-key={this.props.selectionKey}
-            >
-                {this.renderChildren()}
-            </span>
-        );
-    }
-}
-
-interface ScrollToProps {
-    /* scroll to position of first selected ScrollToItem element after initialization*/
-    scrollOnMount?: boolean
-
-    supressKeyboardEvent?(selectionKey: string | undefined, event: React.KeyboardEvent): boolean
-
-    children?: React.ReactNode;
-}
-
-interface ScrollToState {
-    /* current search string entered by user*/
-    searchString: string
-    /* checks if search string is found in at least one item */
-    searchStringFound: boolean
-}
-
-/**
- * Wrapper component for area with items where user can be scrolled in
- */
-export default class ScrollTo extends Component<ScrollToProps, ScrollToState> {
-    /* internal reference to wrapping element of container with items*/
-    scrollWrapper: HTMLElement | null = null;
-    /* internal reference to parent element with enabled scrolling */
-    scrollParent: HTMLElement | null = null;
-
-    constructor(props: Readonly<ScrollToProps>) {
-        super(props);
-        this.state = {
-            searchString: "",
-            searchStringFound: false,
-        };
-        this.scrollToElement = debounce(this.scrollToElement, 400, {maxWait: 400});
-    }
-
-    componentDidMount(): void {
-        // initial scrolling to position of selected node
-        if (this.props.scrollOnMount && this.scrollWrapper) {
-            const scrollToElement = this.scrollWrapper.querySelector(".selected");
-            if (scrollToElement) {
-                this.scrollToElement(scrollToElement as HTMLElement);
-            }
-        }
-    }
-
-    scrollToElement(scrollToElem: HTMLElement, scrollingUp = false): void {
-        scrollIntoView(scrollToElem, this.scrollParent, {
-            onlyScrollIfNeeded: true,
-            allowHorizontalScroll: false,
-            alignWithTop: scrollingUp,
-            offsetTop: 50,
-            offsetBottom: 50,
-        });
-    }
-
-    getScrollParent(element: HTMLElement, includeHidden = false): HTMLElement {
-        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: HTMLElement | null;
-        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: HTMLElement, selectables: HTMLElement[]): void {
-        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(): void {
-        if (!!this.scrollWrapper) {
-            let selectables: HTMLElement[] = Array.from(this.scrollWrapper.getElementsByClassName("selectable")) as HTMLElement[]; //get all selectable elements
-            if (selectables.length > 0) {
-                const focusedElement = selectables[selectables.length - 1];
-                this.scrollToElement(focusedElement, false);
-            }
-        }
-    }
-
-    focusToLast(): void {
-        if (!!this.scrollWrapper) {
-            let selectables: HTMLElement[] = Array.from(this.scrollWrapper.getElementsByClassName("selectable")) as HTMLElement[]; //get all selectable elements
-            if (selectables.length > 0) {
-                const focusedElement = selectables[selectables.length - 1];
-                focusedElement.focus();
-                this.scrollToElement(focusedElement, false);
-            }
-        }
-    }
-
-    focusPrev(currentElement: HTMLElement, selectables: HTMLElement[]): void {
-        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: string): HTMLElement {
-        const elementToFocus = this.scrollWrapper?.querySelector(`.selectable[data-content*="${searchString.toLowerCase()}"]`) as any;
-        if (elementToFocus) {
-            elementToFocus.focus();
-            this.scrollToElement(elementToFocus as HTMLElement);
-        }
-        return elementToFocus;
-    }
-
-    render() {
-        return (
-            <div ref={(scrollWrapper) => {
-                this.scrollWrapper = scrollWrapper;
-                if (this.scrollWrapper) {
-                    this.scrollParent = this.getScrollParent(this.scrollWrapper);
-                } else {
-                    this.scrollParent = null;
-                }
-            }}
-                 tabIndex={-1}
-                 onKeyDown={(e: React.KeyboardEvent<HTMLDivElement>) => {
-                     if (e.target instanceof HTMLInputElement) {
-                         return;
-                     }
-                     if (!this.scrollWrapper) {
-                         return;
-                     }
-                     if (KeyboardUtils.isKeyPressed(Key.Control) || KeyboardUtils.isKeyPressed(Key.Alt)) {
-                         return;
-                     }
-                     const supressKeyboardEvent = this.props.supressKeyboardEvent?.((document.activeElement as any)?.dataset?.key, e);
-                     if (supressKeyboardEvent) {
-                         e.preventDefault();
-                         return;
-                     }
-                     let focusedElement: HTMLElement | null = document.activeElement as HTMLElement;
-                     let selectables: HTMLElement[];
-                     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")) as HTMLElement[]; //get all selectable elements
-                     }
-                     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] as HTMLElement : 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={(_: React.FocusEvent<HTMLDivElement>) => {
-                     setTimeout(() => {
-                         if (!document.activeElement?.className?.includes("selectable") && (this.state.searchString !== "" || this.state.searchStringFound)) {
-                             this.setState({searchString: "", searchStringFound: false});
-                         }
-                     }, 0);
-
-                 }}
-            >
-                <div style={{position: "fixed", top: 16, left: 16}}>
-                    <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}>
-                        <span/>
-                    </Tooltip>
-                </div>
-                <MarkTextContext.Provider value={this.state.searchString}>
-                    {this.props.children}
-                </MarkTextContext.Provider>
-            </div>);
-    }
-}

package/components/style/withCss.tsx

@@ -1,14 +0,0 @@
-import {BaseReturnType} from 'antd-style';
-import {ReturnStyles} from "antd-style/lib/factories/createStyles/types";
-
-type WithCssChildren<T extends BaseReturnType> = (css: ReturnStyles<T>) => any;
-
-interface WithCssProperties<T extends BaseReturnType> {
-    children: WithCssChildren<T>;
-    useStyles: (props?:any) => ReturnStyles<T>
-}
-
-export default function WithCss<T extends BaseReturnType> ({useStyles, children}:WithCssProperties<T>) {
-    const css = useStyles();
-    return children(css);
-};

package/components/style/withInputNumberCss.tsx

@@ -1,18 +0,0 @@
-import {ConfigContext} from "antd/es/config-provider";
-import React from "react";
-import useCSSVarCls from "antd/es/config-provider/hooks/useCSSVarCls";
-import useStyle from "antd/es/input-number/style/index";
-
-
-interface WithInputNumberCssProperties {
-    children: any;
-}
-
-export default function WithInputNumberCss({children}: WithInputNumberCssProperties) {
-    const {getPrefixCls} = React.useContext(ConfigContext);
-    const prefixCls = getPrefixCls('input-number');
-    const rootCls = useCSSVarCls(prefixCls);
-    // @ts-ignore
-    const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls, rootCls);
-    return wrapCSSVar(children);
-};

package/components/svg.d.ts

@@ -1 +0,0 @@
-declare module "*.svg"

package/components/table/dragSortingTable.tsx

@@ -1,123 +0,0 @@
-import React from 'react';
-import {Table} from 'antd';
-import {DndProvider, DragSource, DropTarget} from 'react-dnd';
-import HTML5Backend from 'react-dnd-html5-backend';
-import {TableProps} from "antd/es/table";
-import {createStyles} from "antd-style";
-import WithCss from "d2coreui/components/style/withCss";
-
-const useStyles = createStyles(({css}) => {
-    return {
-        dragSortingTable: css`
-            tr.drop-over-downward td {
-                border-bottom: 2px dashed #1890ff !important;
-            }
-
-            tr.drop-over-upward td {
-                border-top: 2px dashed #1890ff !important;
-            }
-        `,
-    }
-});
-
-let dragingIndex = -1;
-
-class BodyRow extends React.Component<any> {
-    render() {
-        const {isOver, connectDragSource, connectDropTarget, moveRow, ...restProps} = this.props;
-        const style = {...restProps.style, cursor: 'move'};
-        let {className} = restProps;
-        if (isOver) {
-            if (restProps.index > dragingIndex) {
-                className += ' drop-over-downward';
-            }
-            if (restProps.index < dragingIndex) {
-                className += ' drop-over-upward';
-            }
-        }
-        return connectDragSource(
-            connectDropTarget(<tr {...restProps} className={className} style={style}/>),
-        );
-    }
-}
-
-const rowSource = {
-    beginDrag(props: any) {
-        dragingIndex = props.index;
-        return {
-            index: props.index,
-        };
-    },
-};
-
-const rowTarget = {
-    drop(props: any, monitor: any) {
-        const dragIndex = monitor.getItem().index;
-        const hoverIndex = props.index;
-        // Don't replace items with themselves
-        if (dragIndex === hoverIndex) {
-            return;
-        }
-        // Time to actually perform the action
-        props.moveRow(dragIndex, hoverIndex);
-        // Note: we're mutating the monitor item here!
-        // Generally it's better to avoid mutations,
-        // but it's good here for the sake of performance
-        // to avoid expensive index searches.
-        monitor.getItem().index = hoverIndex;
-    },
-};
-
-const DragableBodyRow = DropTarget('row', rowTarget, (connect, monitor) => ({
-    connectDropTarget: connect.dropTarget(),
-    isOver: monitor.isOver(),
-}))(
-    DragSource('row', rowSource, connect => ({
-        connectDragSource: connect.dragSource(),
-    }))(BodyRow),
-);
-
-interface DragSortingTableProps<T> extends TableProps<T> {
-    dataSource: T[]
-    onMoveRow: (dragRow: T, dragIndex: number, hoverIndex: number) => void
-}
-
-export default class DragSortingTable<T extends object> extends React.Component<DragSortingTableProps<T>> {
-    components: any;
-
-    constructor(props: Readonly<DragSortingTableProps<T>>) {
-        super(props);
-        this.components = {
-            body: {
-                row: DragableBodyRow,
-            },
-        };
-        this.moveRow = this.moveRow.bind(this);
-    }
-
-    moveRow(dragIndex: number, hoverIndex: number) {
-        const dragRow = this.props.dataSource[dragIndex];
-        this.props.onMoveRow(dragRow, dragIndex, hoverIndex);
-    };
-
-    render() {
-        const {onMoveRow, components, ...restProps} = this.props;
-        //@ts-ignore
-        return (<DndProvider backend={HTML5Backend}>
-                <WithCss useStyles={useStyles}>{
-                    (css)=>(<Table<T>
-                    className={css.styles.dragSortingTable}
-                    {...restProps}
-                    components={components ? Object.assign({}, this.components, components) : this.components}
-                    onRow={(_, index) => {
-                        return {
-                            index,
-                            moveRow: this.moveRow,
-                        } as React.HTMLAttributes<HTMLElement>
-                    }}
-                />)}
-                </WithCss>
-            </DndProvider>
-        );
-    }
-}

package/components/text/impl/innerSize.ts

@@ -1,15 +0,0 @@
-// Calculate height without padding.
-export function innerHeight(el:HTMLElement) {
-    const style = window.getComputedStyle(el, null);
-    return el.clientHeight -
-        parseInt(style.getPropertyValue('padding-top'), 10) -
-        parseInt(style.getPropertyValue('padding-bottom'), 10);
-}
-
-// Calculate width without padding.
-export function innerWidth(el:HTMLElement) {
-    const style = window.getComputedStyle(el, null);
-    return el.clientWidth -
-        parseInt(style.getPropertyValue('padding-left'), 10) -
-        parseInt(style.getPropertyValue('padding-right'), 10);
-}

package/components/text/impl/series.ts

@@ -1,37 +0,0 @@
-/**
- * Run the functions in the tasks array in series, each one running once the previous function has completed.
- * If any functions in the series pass an error to its callback, no more functions are run,
- * and callback is immediately called with the value of the error. Otherwise, callback receives an array of results
- * when tasks have completed.
- * Taken from https://github.com/feross/run-series
- *
- * @params {Array} tasks An array containing functions to run, each function is passed a callback(err, result) which it must call on completion with an error err (which can be null) and an optional result value.
- * @params {Function} callback(err, results) - An optional callback to run once all the functions have completed. This function gets a results array containing all the result arguments passed to the task callbacks.
- */
-
-import process from 'process';
-
-export default function series(tasks: Function[], cb:Function) {
-    const results:any[] = [];
-    let current = 0;
-    let isSync = true;
-
-    function done(err:any) {
-        function end() {
-            if (cb) cb(err, results);
-        }
-        if (isSync) process.nextTick(end);
-        else end();
-    }
-
-    function each(err:any, result:any) {
-        results.push(result);
-        if (++current >= tasks.length || err) done(err);
-        else tasks[current](each);
-    }
-
-    if (tasks.length > 0) tasks[0](each);
-    else done(null);
-
-    isSync = false;
-}

package/components/text/impl/shallowEqual.ts

@@ -1,19 +0,0 @@
-export default function shallowEqual(objA:any, objB:any) {
-    if (objA === objB) {
-        return true;
-    }
-    const keysA = Object.keys(objA);
-    const keysB = Object.keys(objB);
-    if (keysA.length !== keysB.length) {
-        return false;
-    }
-    // Test for A's keys different from B.
-    const hasOwn = Object.prototype.hasOwnProperty;
-    for (let i = 0; i < keysA.length; i++) {
-        if (!hasOwn.call(objB, keysA[i]) ||
-            objA[keysA[i]] !== objB[keysA[i]]) {
-            return false;
-        }
-    }
-    return true;
-}

package/components/text/impl/uniqueId.ts

@@ -1,5 +0,0 @@
-let uid = 0;
-
-export default function uniqueId() {
-    return uid++;
-}

package/components/text/impl/whilst.ts

@@ -1,25 +0,0 @@
-const noop = () => {};
-
-/**
- * Repeatedly call fn, while test returns true. Calls callback when stopped, or an error occurs.
- *
- * @param {Function} test Synchronous truth test to perform before each execution of fn.
- * @param {Function} fn A function which is called each time test passes. The function is passed a callback(err), which must be called once it has completed with an optional err argument.
- * @param {Function} callback A callback which is called after the test fails and repeated execution of fn has stopped.
- */
-
-export default function whilst(test: ()=>boolean, iterator:Function, callback:Function= noop) {
-    if (test()) {
-        iterator(function next(this: any, err:string, ...args:any) {
-            if (err) {
-                callback(err);
-            } else if (test.apply(this, args)) {
-                iterator(next);
-            } else {
-                callback(null);
-            }
-        });
-    } else {
-        callback(null);
-    }
-}