superdesk-ui-framework 6.1.0-dev1 → 7.0.0-dev-hg0

package/dist/esm/components/ToastWrapper.js

@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { ToastMessage } from './ToastMessage';
+const firstState = {
+    top: [],
+    bottom: [],
+    'top-right': [],
+    'top-left': [],
+    'bottom-right': [],
+    'bottom-left': [],
+};
+class ToastWrapper extends React.PureComponent {
+    constructor(props) {
+        super(props);
+        this.state = firstState;
+        this.notify = (message, options) => {
+            const toast = this.createToastState(message, options);
+            const { position } = toast;
+            const isTop = position === 'top';
+            this.setState((prev) => {
+                return {
+                    ...prev,
+                    [position]: isTop ? [toast, ...prev[position]] : [...prev[position], toast],
+                };
+            });
+            return { id: toast.id, position: toast.position };
+        };
+        this.createToastState = (message, options) => {
+            const id = '' + ++ToastWrapper.idCounter;
+            const position = options.position ?? 'top';
+            return {
+                id,
+                message,
+                icon: options.icon,
+                position,
+                duration: options.duration,
+                type: options.type,
+                size: options.size,
+            };
+        };
+        this.requestClose = (id, position) => {
+            this.setState((prev) => {
+                return {
+                    ...prev,
+                    [position]: prev[position].filter((toast) => toast.id !== id),
+                };
+            });
+        };
+        this.notify = this.notify.bind(this);
+    }
+    render() {
+        return Object.keys(this.state).map((position) => {
+            const pos = position;
+            const toasts = this.state[pos];
+            return (React.createElement("div", { key: position, className: 'sd-toast__container sd-toast__container--' + pos }, (pos === 'top' ? toasts : [...toasts].reverse()).map((toast) => {
+                return (React.createElement(ToastMessage, { position: pos, type: toast.type, icon: toast.icon, closeElement: this.requestClose, duration: toast.duration, key: toast.id, id: toast.id, message: toast.message, size: toast.size }));
+            })));
+        });
+    }
+}
+ToastWrapper.idCounter = 0;
+export default ToastWrapper;
+//# sourceMappingURL=ToastWrapper.js.map

package/dist/esm/components/ToastWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastWrapper.js","sourceRoot":"","sources":["../../../app-typescript/components/ToastWrapper.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/ToggleBox/CustomHeaderToggleBox.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { IPropsCustomHeader } from '../ToggleBox/index';
+interface IState {
+    isOpen: boolean;
+    wasOpened: boolean;
+    isAnimating: boolean;
+}
+export declare class CustomHeaderToggleBox extends React.PureComponent<IPropsCustomHeader, IState> {
+    private htmlId;
+    private contentRef;
+    constructor(props: IPropsCustomHeader);
+    /**
+     * Called via ref
+     */
+    isOpen: () => boolean;
+    toggle: () => Promise<boolean>;
+    componentDidUpdate(_prevProps: IPropsCustomHeader, prevState: IState): void;
+    handleAnimationEnd: () => void;
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=CustomHeaderToggleBox.d.ts.map

package/dist/esm/components/ToggleBox/CustomHeaderToggleBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomHeaderToggleBox.d.ts","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/CustomHeaderToggleBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,kBAAkB,EAAC,MAAM,oBAAoB,CAAC;AAEtD,UAAU,MAAM;IACZ,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;CACxB;AAED,qBAAa,qBAAsB,SAAQ,KAAK,CAAC,aAAa,CAAC,kBAAkB,EAAE,MAAM,CAAC;IACtF,OAAO,CAAC,MAAM,CAAwB;IACtC,OAAO,CAAC,UAAU,CAAqC;gBAE3C,KAAK,EAAE,kBAAkB;IAYrC;;OAEG;IACI,MAAM,gBAEX;IAEK,MAAM,QAAO,OAAO,CAAC,OAAO,CAAC,CAgBlC;IAEF,kBAAkB,CAAC,UAAU,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM;IAcpE,kBAAkB,aAMhB;IAEF,MAAM;CAoCT"}

package/dist/esm/components/ToggleBox/CustomHeaderToggleBox.js

@@ -0,0 +1,74 @@
+import * as React from 'react';
+import classNames from 'classnames';
+import nextId from 'react-id-generator';
+export class CustomHeaderToggleBox extends React.PureComponent {
+    constructor(props) {
+        super(props);
+        this.htmlId = nextId('togglebox-');
+        this.contentRef = React.createRef();
+        /**
+         * Called via ref
+         */
+        this.isOpen = () => {
+            return this.state.isOpen;
+        };
+        this.toggle = () => {
+            return new Promise((resolve, reject) => {
+                this.setState({ isOpen: !this.state.isOpen, isAnimating: true }, () => {
+                    if (this.contentRef.current) {
+                        const handleAnimation = () => {
+                            this.props.onToggle?.(this.state.isOpen);
+                            this.handleAnimationEnd();
+                            resolve(this.state.isOpen);
+                        };
+                        this.contentRef.current.addEventListener('animationend', handleAnimation, { once: true });
+                    }
+                    else {
+                        reject();
+                    }
+                });
+            });
+        };
+        this.handleAnimationEnd = () => {
+            this.setState({ isAnimating: false });
+            if (this.contentRef.current) {
+                this.contentRef.current.removeEventListener('animationend', this.handleAnimationEnd);
+            }
+        };
+        const isOpen = this.props.initiallyOpen ?? false;
+        this.state = {
+            isOpen: isOpen,
+            isAnimating: false,
+            wasOpened: isOpen,
+        };
+    }
+    componentDidUpdate(_prevProps, prevState) {
+        if (prevState.isOpen !== this.state.isOpen) {
+            this.setState({ isAnimating: true });
+            if (this.contentRef.current) {
+                this.contentRef.current.addEventListener('animationend', this.handleAnimationEnd);
+            }
+        }
+        if (this.state.isOpen && !this.state.wasOpened) {
+            this.setState({ wasOpened: true });
+        }
+    }
+    render() {
+        const classes = classNames('sd-shadow--z1 new-collapse-box', {
+            'new-collapse-box--open': this.state.isOpen,
+        });
+        const { isOpen } = this.state;
+        return (React.createElement("div", { className: classes, "aria-expanded": isOpen, "data-test-id": "toggle-box" },
+            React.createElement("div", { className: "new-collapse-box__header" },
+                React.createElement("div", { className: "new-collapse-box__header-inner" }, this.props.header),
+                React.createElement("button", { className: "new-collapse-box__divider", onClick: this.toggle, "aria-controls": this.htmlId },
+                    React.createElement("span", { className: "label label--translucent new-collapse-box__divider-label" }, this.props.getToggleButtonLabel(isOpen)))),
+            React.createElement("div", { className: "new-collapse-box__content" },
+                React.createElement("div", { ref: this.contentRef, id: this.htmlId, "aria-hidden": !isOpen, className: classNames('new-collapse-box__content-inner p-2 pt-0-5', {
+                        'toggle-box__content--animation': this.state.isAnimating,
+                    }) }, this.state.isOpen || this.state.wasOpened || this.props.alwaysRenderChildren === true
+                    ? this.props.children
+                    : null))));
+    }
+}
+//# sourceMappingURL=CustomHeaderToggleBox.js.map

package/dist/esm/components/ToggleBox/CustomHeaderToggleBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomHeaderToggleBox.js","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/CustomHeaderToggleBox.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/ToggleBox/SimpleToggleBox.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { IPropsSimple } from '../ToggleBox/index';
+interface IState {
+    isOpen: boolean;
+    isAnimating: boolean;
+}
+/**
+ * @ngdoc react
+ * @name ToggleBox
+ * @description ToggleBox used to open/close a set of details
+ */
+export declare class SimpleToggleBox extends React.PureComponent<IPropsSimple, IState> {
+    htmlId: string;
+    contentRef: React.RefObject<HTMLDivElement>;
+    constructor(props: IPropsSimple);
+    handleKeyDown: (event: React.KeyboardEvent<HTMLAnchorElement>) => void;
+    /**
+     * Called via ref
+     */
+    isOpen: () => boolean;
+    toggle: () => void;
+    componentDidUpdate(_prevProps: IPropsSimple, prevState: IState): void;
+    handleAnimationEnd: () => void;
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=SimpleToggleBox.d.ts.map

package/dist/esm/components/ToggleBox/SimpleToggleBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleToggleBox.d.ts","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/SimpleToggleBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,YAAY,EAAC,MAAM,oBAAoB,CAAC;AAEhD,UAAU,MAAM;IACZ,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;CACxB;AAED;;;;GAIG;AAEH,qBAAa,eAAgB,SAAQ,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,MAAM,CAAC;IAC1E,MAAM,SAAwB;IAC9B,UAAU,kCAAqC;gBAEnC,KAAK,EAAE,YAAY;IAQ/B,aAAa,GAAI,OAAO,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAG,IAAI,CAQnE;IAEF;;OAEG;IACI,MAAM,gBAEX;IAEK,MAAM,QAAO,IAAI,CAQtB;IAEF,kBAAkB,CAAC,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM;IAU9D,kBAAkB,aAMhB;IAEF,MAAM;CAkDT"}

package/dist/esm/components/ToggleBox/SimpleToggleBox.js

@@ -0,0 +1,84 @@
+import * as React from 'react';
+import classNames from 'classnames';
+import nextId from 'react-id-generator';
+/**
+ * @ngdoc react
+ * @name ToggleBox
+ * @description ToggleBox used to open/close a set of details
+ */
+export class SimpleToggleBox extends React.PureComponent {
+    constructor(props) {
+        super(props);
+        this.htmlId = nextId('togglebox-');
+        this.contentRef = React.createRef();
+        this.handleKeyDown = (event) => {
+            if (event.key === 'ArrowRight' && !this.state.isOpen) {
+                this.setState({ isOpen: true });
+            }
+            else if (event.key === 'ArrowLeft' && this.state.isOpen) {
+                this.setState({ isOpen: false });
+            }
+            else if (event.key === 'Enter') {
+                this.toggle();
+            }
+        };
+        /**
+         * Called via ref
+         */
+        this.isOpen = () => {
+            return this.state.isOpen;
+        };
+        this.toggle = () => {
+            this.setState({ isOpen: !this.state.isOpen }, () => {
+                if (!this.state.isOpen && this.props.onClose) {
+                    this.props.onClose();
+                }
+                else if (this.props.onOpen) {
+                    this.props.onOpen();
+                }
+            });
+        };
+        this.handleAnimationEnd = () => {
+            this.setState({ isAnimating: false });
+            if (this.contentRef.current) {
+                this.contentRef.current.removeEventListener('animationend', this.handleAnimationEnd);
+            }
+        };
+        this.state = {
+            isOpen: this.props.initiallyOpen ?? false,
+            isAnimating: false,
+        };
+    }
+    componentDidUpdate(_prevProps, prevState) {
+        if (prevState.isOpen !== this.state.isOpen) {
+            this.setState({ isAnimating: true });
+            if (this.contentRef.current) {
+                this.contentRef.current.addEventListener('animationend', this.handleAnimationEnd);
+            }
+        }
+    }
+    render() {
+        const classes = classNames('toggle-box', {
+            'toggle-box--margin-normal': this.props.margin === undefined,
+            'toggle-box--large-title': this.props.largeTitle,
+            'toggle-box--circle': this.props.circledChevron,
+            [`toggle-box--margin-${this.props.margin}`]: this.props.margin,
+            hidden: !this.state.isOpen,
+            open: this.state.isOpen,
+        }, this.props.className);
+        const { title, children, badge } = this.props;
+        const { isOpen } = this.state;
+        return (React.createElement("div", { className: classes },
+            React.createElement("a", { className: "toggle-box__header", onClick: this.toggle, role: "button", tabIndex: 0, onKeyDown: this.handleKeyDown, "aria-expanded": isOpen, "aria-controls": this.htmlId },
+                React.createElement("div", { className: "toggle-box__chevron" },
+                    React.createElement("i", { className: "icon-chevron-right-thin" })),
+                React.createElement("div", { className: "toggle-box__label" }, title),
+                React.createElement("div", { className: "toggle-box__line" }),
+                badge ? badge : null),
+            React.createElement("div", { className: "toggle-box__content-wraper" },
+                React.createElement("div", { id: this.htmlId, className: classNames('toggle-box__content', {
+                        'toggle-box__content--animation': this.state.isAnimating,
+                    }), "aria-hidden": !isOpen, ref: this.contentRef }, children))));
+    }
+}
+//# sourceMappingURL=SimpleToggleBox.js.map

package/dist/esm/components/ToggleBox/SimpleToggleBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleToggleBox.js","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/SimpleToggleBox.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/ToggleBox/index.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { SimpleToggleBox } from './SimpleToggleBox';
+import { CustomHeaderToggleBox } from './CustomHeaderToggleBox';
+export interface IPropsSimple {
+    variant: 'simple';
+    title: string;
+    badge?: JSX.Element;
+    children: React.ReactNode;
+    circledChevron?: boolean;
+    initiallyOpen?: boolean;
+    largeTitle?: boolean;
+    className?: string;
+    margin?: 'none' | 'small' | 'normal' | 'large';
+    onOpen?(): void;
+    onClose?(): void;
+    toggleBoxRef?: React.RefObject<SimpleToggleBox>;
+}
+export interface IPropsCustomHeader {
+    variant: 'custom-header';
+    header: React.ReactNode;
+    children: React.ReactNode;
+    getToggleButtonLabel: (isOpen: boolean) => string;
+    initiallyOpen?: boolean;
+    onToggle?(isOpen: boolean): void;
+    toggleBoxRef?: React.RefObject<CustomHeaderToggleBox>;
+    /**
+     * by default - children would only get rendered when toggle box is expanded
+     */
+    alwaysRenderChildren?: boolean;
+}
+type IProps = IPropsSimple | IPropsCustomHeader;
+export declare class ToggleBox extends React.PureComponent<IProps> {
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ToggleBox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAE9D,MAAM,WAAW,YAAY;IACzB,OAAO,EAAE,QAAQ,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC/C,MAAM,CAAC,IAAI,IAAI,CAAC;IAChB,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;CACnD;AAED,MAAM,WAAW,kBAAkB;IAC/B,OAAO,EAAE,eAAe,CAAC;IACzB,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,oBAAoB,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,MAAM,CAAC;IAClD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,qBAAqB,CAAC,CAAC;IAEtD;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED,KAAK,MAAM,GAAG,YAAY,GAAG,kBAAkB,CAAC;AAEhD,qBAAa,SAAU,SAAQ,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC;IACtD,MAAM;CAOT"}

package/dist/esm/components/ToggleBox/index.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { SimpleToggleBox } from './SimpleToggleBox';
+import { CustomHeaderToggleBox } from './CustomHeaderToggleBox';
+export class ToggleBox extends React.PureComponent {
+    render() {
+        if (this.props.variant === 'simple') {
+            return React.createElement(SimpleToggleBox, { ref: this.props.toggleBoxRef, ...this.props });
+        }
+        else {
+            return React.createElement(CustomHeaderToggleBox, { ref: this.props.toggleBoxRef, ...this.props });
+        }
+    }
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/components/ToggleBox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../app-typescript/components/ToggleBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAmC9D,MAAM,OAAO,SAAU,SAAQ,KAAK,CAAC,aAAqB;IACtD,MAAM;QACF,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,KAAK,QAAQ,EAAE,CAAC;YAClC,OAAO,oBAAC,eAAe,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,KAAM,IAAI,CAAC,KAAK,GAAI,CAAC;QAC7E,CAAC;aAAM,CAAC;YACJ,OAAO,oBAAC,qBAAqB,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,KAAM,IAAI,CAAC,KAAK,GAAI,CAAC;QACnF,CAAC;IACL,CAAC;CACJ"}

package/dist/esm/components/Tooltip.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { IPropsTooltipV2 } from './TooltipV2';
+interface IPropsLegacy {
+    text: string | undefined | null;
+    flow?: 'top' | 'left' | 'right' | 'down';
+    content?: never;
+}
+type IProps = IPropsTooltipV2 | IPropsLegacy;
+export declare class Tooltip extends React.PureComponent<IProps> {
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=Tooltip.d.ts.map

package/dist/esm/components/Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../app-typescript/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,eAAe,EAAY,MAAM,aAAa,CAAC;AAoBvD,UAAU,YAAY;IAClB,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IAChC,IAAI,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACzC,OAAO,CAAC,EAAE,KAAK,CAAC;CACnB;AAED,KAAK,MAAM,GAAG,eAAe,GAAG,YAAY,CAAC;AAE7C,qBAAa,OAAQ,SAAQ,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC;IACpD,MAAM;CAgBT"}

package/dist/esm/components/Tooltip.js

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { assertNever } from '../helpers';
+import { TooltipV2 } from './TooltipV2';
+function flowToPlacement(flow) {
+    switch (flow) {
+        case undefined:
+            return undefined;
+        case 'top':
+            return 'top';
+        case 'right':
+            return 'right';
+        case 'down':
+            return 'bottom';
+        case 'left':
+            return 'left';
+        default:
+            return assertNever(flow);
+    }
+}
+export class Tooltip extends React.PureComponent {
+    render() {
+        if (this.props.content != null) {
+            return React.createElement(TooltipV2, { ...this.props });
+        }
+        else {
+            // backwards compatibility for legacy props
+            return (React.createElement(TooltipV2, { content: this.props.text ?? '', placement: flowToPlacement(this.props.flow) }, ({ attributes }) => (React.createElement("div", { ...attributes, style: { display: 'contents' } }, this.props.children))));
+        }
+    }
+}
+//# sourceMappingURL=Tooltip.js.map

package/dist/esm/components/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../app-typescript/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,WAAW,EAAC,MAAM,YAAY,CAAC;AACvC,OAAO,EAAkB,SAAS,EAAC,MAAM,aAAa,CAAC;AAGvD,SAAS,eAAe,CAAC,IAA0B;IAC/C,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,SAAS;YACV,OAAO,SAAS,CAAC;QACrB,KAAK,KAAK;YACN,OAAO,KAAK,CAAC;QACjB,KAAK,OAAO;YACR,OAAO,OAAO,CAAC;QACnB,KAAK,MAAM;YACP,OAAO,QAAQ,CAAC;QACpB,KAAK,MAAM;YACP,OAAO,MAAM,CAAC;QAClB;YACI,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;AACL,CAAC;AAUD,MAAM,OAAO,OAAQ,SAAQ,KAAK,CAAC,aAAqB;IACpD,MAAM;QACF,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,IAAI,EAAE,CAAC;YAC7B,OAAO,oBAAC,SAAS,OAAK,IAAI,CAAC,KAAK,GAAI,CAAC;QACzC,CAAC;aAAM,CAAC;YACJ,2CAA2C;YAC3C,OAAO,CACH,oBAAC,SAAS,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,EAAE,EAAE,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IACjF,CAAC,EAAC,UAAU,EAAC,EAAE,EAAE,CAAC,CACf,gCAAS,UAAU,EAAE,KAAK,EAAE,EAAC,OAAO,EAAE,UAAU,EAAC,IAC5C,IAAI,CAAC,KAAK,CAAC,QAAQ,CAClB,CACT,CACO,CACf,CAAC;QACN,CAAC;IACL,CAAC;CACJ"}

package/dist/esm/components/TooltipV2.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { Placement } from '@popperjs/core';
+export interface IPropsTooltipV2 {
+    content: string | React.ComponentType;
+    placement?: Placement;
+    /**
+     * If unsure - use ReactNode.
+     * Function is for advanced use cases where it's needed to avoid the wrapping span.
+     */
+    children: React.ReactNode | ((options: {
+        attributes: React.HTMLAttributes<HTMLElement>;
+    }) => React.ReactNode);
+}
+/**
+ * Component is intentionally not exported.
+ * It will be moved into the components/Tooltip.tsx when legacy support is dropped there.
+ */
+export declare class TooltipV2 extends React.PureComponent<IPropsTooltipV2> {
+    render(): JSX.Element;
+}
+//# sourceMappingURL=TooltipV2.d.ts.map

package/dist/esm/components/TooltipV2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipV2.d.ts","sourceRoot":"","sources":["../../../app-typescript/components/TooltipV2.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAGzC,MAAM,WAAW,eAAe;IAC5B,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,aAAa,CAAC;IACtC,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,OAAO,EAAE;QAAC,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;KAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC/G;AAED;;;GAGG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC;IAC/D,MAAM;CA2CT"}

package/dist/esm/components/TooltipV2.js

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { WithPopover } from './WithPopover';
+/**
+ * Component is intentionally not exported.
+ * It will be moved into the components/Tooltip.tsx when legacy support is dropped there.
+ */
+export class TooltipV2 extends React.PureComponent {
+    render() {
+        return (React.createElement(WithPopover, { placement: this.props.placement ?? 'top', component: () => {
+                return (React.createElement("div", { className: "tooltip" }, (() => {
+                    if (typeof this.props.content === 'string') {
+                        return React.createElement("span", null, this.props.content);
+                    }
+                    else {
+                        const Component = this.props.content;
+                        return React.createElement(Component, null);
+                    }
+                })()));
+            } }, (toggle) => {
+            const attributes = {
+                onMouseEnter: (event) => {
+                    toggle(event.target);
+                },
+                onMouseLeave: (event) => {
+                    toggle(event.target);
+                },
+            };
+            if (typeof this.props.children === 'function') {
+                return this.props.children({ attributes });
+            }
+            else {
+                return (React.createElement("span", { ...attributes, style: { display: 'contents' } }, this.props.children));
+            }
+        }));
+    }
+}
+//# sourceMappingURL=TooltipV2.js.map

package/dist/esm/components/TooltipV2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipV2.js","sourceRoot":"","sources":["../../../app-typescript/components/TooltipV2.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAa1C;;;GAGG;AACH,MAAM,OAAO,SAAU,SAAQ,KAAK,CAAC,aAA8B;IAC/D,MAAM;QACF,OAAO,CACH,oBAAC,WAAW,IACR,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,IAAI,KAAK,EACxC,SAAS,EAAE,GAAG,EAAE;gBACZ,OAAO,CACH,6BAAK,SAAS,EAAC,SAAS,IACnB,CAAC,GAAG,EAAE;oBACH,IAAI,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,KAAK,QAAQ,EAAE,CAAC;wBACzC,OAAO,kCAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAQ,CAAC;oBAC7C,CAAC;yBAAM,CAAC;wBACJ,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;wBAErC,OAAO,oBAAC,SAAS,OAAG,CAAC;oBACzB,CAAC;gBACL,CAAC,CAAC,EAAE,CACF,CACT,CAAC;YACN,CAAC,IAEA,CAAC,MAAM,EAAE,EAAE;YACR,MAAM,UAAU,GAAsC;gBAClD,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE;oBACpB,MAAM,CAAC,KAAK,CAAC,MAAqB,CAAC,CAAC;gBACxC,CAAC;gBACD,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE;oBACpB,MAAM,CAAC,KAAK,CAAC,MAAqB,CAAC,CAAC;gBACxC,CAAC;aACJ,CAAC;YAEF,IAAI,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,UAAU,EAAE,CAAC;gBAC5C,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAC,UAAU,EAAC,CAAC,CAAC;YAC7C,CAAC;iBAAM,CAAC;gBACJ,OAAO,CACH,iCAAU,UAAU,EAAE,KAAK,EAAE,EAAC,OAAO,EAAE,UAAU,EAAC,IAC7C,IAAI,CAAC,KAAK,CAAC,QAAQ,CACjB,CACV,CAAC;YACN,CAAC;QACL,CAAC,CACS,CACjB,CAAC;IACN,CAAC;CACJ"}

package/dist/esm/components/TreeMenu.d.ts

@@ -0,0 +1,63 @@
+import * as React from 'react';
+interface IState<T> {
+    options: Array<ITreeMenuNode<T>>;
+    openDropdown: boolean;
+    activeTree: Array<Array<ITreeMenuNode<T>>>;
+    buttonTree: Array<ITreeMenuNode<T>>;
+    buttonValue: ITreeMenuNode<T> | null;
+    filterArr: Array<ITreeMenuNode<T>>;
+    searchFieldValue: string;
+    firstBranchOptions: Array<ITreeMenuNode<T>>;
+    buttonTarget: Array<string>;
+}
+interface IProps<T> {
+    searchPlaceholder?: string;
+    singleLevelSearch?: boolean;
+    'data-test-id'?: string;
+    getOptions?(): Array<ITreeMenuNode<T>>;
+    getLabel(item: T): string;
+    getId(item: T): string;
+    getBackgroundColor?(item: T): string;
+    getBorderColor?(item: T): string;
+    optionTemplate?(item: T): React.ComponentType<T> | JSX.Element;
+    children: (toggle: (event: React.SyntheticEvent) => void) => JSX.Element;
+}
+interface IParent<T> {
+    value: T;
+    children: Array<ITreeMenuNode<T>>;
+}
+interface IChildren<T> {
+    value: T;
+    disabled?: boolean;
+    onSelect(): void;
+}
+export type ITreeMenuNode<T> = IParent<T> | IChildren<T>;
+export declare class TreeMenu<T> extends React.Component<IProps<T>, IState<T>> {
+    private dropdownRef;
+    private ref;
+    private openDropdownRef;
+    private treeMenuRef;
+    private inputRef;
+    private popperInstance;
+    private zIndex;
+    constructor(props: IProps<T>);
+    inputFocus: () => void;
+    listNavigation: () => void;
+    onMouseDown: (event: MouseEvent) => void;
+    onKeyDown: (e: KeyboardEvent) => void;
+    onPressEsc: (event: KeyboardEvent) => void;
+    componentDidMount: () => void;
+    componentWillUnmount(): void;
+    componentDidUpdate(prevProps: Readonly<IProps<T>>, prevState: Readonly<IState<T>>): void;
+    toggleMenu(): void;
+    toggle(event: React.SyntheticEvent): void;
+    handleMultiLevel(item: ITreeMenuNode<T>): void;
+    handleButton(item: ITreeMenuNode<T>): void;
+    handleTree(_event: React.MouseEvent<HTMLLIElement, MouseEvent>, option: ITreeMenuNode<T>): void;
+    backButton(): void;
+    recursion(arr: Array<ITreeMenuNode<T>>): void;
+    filteredItem(arr: Array<ITreeMenuNode<T>>): JSX.Element | JSX.Element[];
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=TreeMenu.d.ts.map

package/dist/esm/components/TreeMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeMenu.d.ts","sourceRoot":"","sources":["../../../app-typescript/components/TreeMenu.tsx"],"names":[],"mappings":"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"}