@gooddata/sdk-ui-metric-component 0.0.0-stage → 11.65.0-alpha.4

package/esm/shared/Tabs/Tabs.js

@@ -0,0 +1,195 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// (C) 2022-2026 GoodData Corporation
+import { useState } from "react";
+import { Bubble, BubbleHoverTrigger, Button, IconClose, IconContract, IconExpand, IconMinimize, } from "@gooddata/sdk-ui-kit";
+import { makeStyles } from "../theme/index.js";
+import { useChangeScroll } from "./hooks/useChangeScroll.js";
+import { useScrollByButtons } from "./hooks/useScrollByButtons.js";
+import { useScrollToActive } from "./hooks/useScrollToActive.js";
+import { useTabCallbacks } from "./hooks/useTabCallbacks.js";
+import { useTabsCallbacks } from "./hooks/useTabsCallbacks.js";
+import { NameButton, Tab, TabActive, TitleText } from "./Tab.js";
+import { TabsClasses } from "./Tabs.classes.js";
+import { TabMaxWidth, TabsIconSize } from "./Tabs.data.js";
+export const ButtonDivider = "divider";
+const useStyles = makeStyles()((theme) => {
+    const buttonSize = TabsIconSize + theme.tabs.sizes.buttonMargin * 2;
+    const button = {
+        cursor: "pointer",
+        minWidth: theme.tabs.sizes.arrowButtonWidth,
+        width: theme.tabs.sizes.arrowButtonWidth,
+        background: "transparent",
+        border: "none",
+        borderBottom: `1px solid ${theme.tabs.colors.border}`,
+        display: "flex",
+        alignContent: "center",
+        alignItems: "center",
+        justifyContent: "center",
+        transition: "all 0.25s ease-in-out",
+        color: theme.tabs.colors.arrow,
+        "&:hover": {
+            color: theme.tabs.colors.hover,
+        },
+    };
+    return {
+        root: {
+            display: "block",
+        },
+        tabs: {
+            padding: `${theme.tabs.sizes.tabsPadding}px 0 0 0`,
+            display: "flex",
+            overflow: "hidden",
+            [`button.${NameButton}`]: {
+                display: "none",
+            },
+            [`.${TabActive}`]: {
+                [`button.${NameButton}`]: {
+                    display: "block",
+                },
+                [`div.${TitleText}`]: {
+                    width: `calc(100% - ${theme.tabs.sizes.buttonMargin + theme.tabs.sizes.controlsDividerMargin}px)`,
+                },
+            },
+            "&:hover": {
+                [`button.${NameButton}`]: {
+                    display: "block",
+                },
+                [`div.${TitleText}`]: {
+                    width: `calc(100% - ${theme.tabs.sizes.buttonMargin + theme.tabs.sizes.controlsDividerMargin}px)`,
+                },
+            },
+        },
+        //list
+        tabsList: {
+            display: "flex",
+            flexGrow: 0,
+            overflow: "hidden",
+            maxWidth: "100%",
+            position: "relative",
+            "&.minimizable": {
+                maxWidth: `calc(100% - ${buttonSize}px)`,
+            },
+            "&.closeable": {
+                maxWidth: `calc(100% - ${buttonSize}px)`,
+            },
+            "&.minimizable.closeable": {
+                maxWidth: `calc(100% - ${buttonSize * 2 + theme.tabs.sizes.controlsDividerWidth}px)`,
+            },
+            "&.scrollable > div:last-child": {
+                width: `${theme.tabs.sizes.tabLastDivider}px`,
+                "&:after": {
+                    display: "none",
+                },
+            },
+        },
+        //filler
+        filler: {
+            borderBottom: `1px solid ${theme.tabs.colors.border}`,
+            flexShrink: 1,
+            flexGrow: 1,
+        },
+        //arrows
+        leftButton: {
+            ...button,
+            borderRight: `1px solid ${theme.tabs.colors.border}`,
+        },
+        rightButton: {
+            ...button,
+            borderLeft: `1px solid ${theme.tabs.colors.border}`,
+        },
+        disabled: {
+            cursor: "default",
+            span: {
+                color: `${theme.tabs.colors.disabled} !important`,
+            },
+        },
+        //create button
+        create: {
+            // `&&` doubles specificity (.x.x → 0,2,0) so these beat kit's single-class (0,1,0)
+            // `.gd-button-action` background/border/box-shadow, which get re-injected into the shared
+            // <head> on host preload and would otherwise win the tie by order and restore the button look.
+            "&&": {
+                background: "transparent",
+                border: "none",
+                boxShadow: "none",
+                fontSize: `${TabsIconSize}px`,
+                ".gd-button-icon::before": {
+                    color: theme.tabs.colors.create,
+                },
+                "&:hover, &:focus, &:active": {
+                    background: "transparent",
+                    border: "none",
+                    boxShadow: "none",
+                    ".gd-button-icon": {
+                        marginTop: "0 !important",
+                    },
+                    ".gd-button-icon::before": {
+                        color: theme.tabs.colors.hover,
+                    },
+                },
+            },
+        },
+        //controls
+        controls: {
+            display: "flex",
+            borderBottom: `1px solid ${theme.tabs.colors.border}`,
+        },
+        trigger: {
+            display: "block",
+            position: "relative",
+            bottom: "-1px",
+        },
+        divider: {
+            margin: `${theme.tabs.sizes.controlsDividerMargin}px 0`,
+            width: theme.tabs.sizes.controlsDividerWidth,
+            background: theme.tabs.colors.divider,
+        },
+        button: {
+            padding: 0,
+            border: "none",
+            cursor: "pointer",
+            background: "none",
+            margin: `0 ${theme.tabs.sizes.buttonMargin}px`,
+            "svg path": {
+                transition: "all 0.25s ease-in-out",
+                fill: theme.tabs.colors.normal,
+            },
+            "&:hover svg path": {
+                fill: theme.tabs.colors.hover,
+            },
+        },
+    };
+});
+export function Tabs({ tabs, active, render, content, className, closeable = false, minimizable = false, maximizable = false, maximized = false, creatable = false, onTabCreate = () => { }, onTabActivate = () => { }, onTabClose = () => { }, onTabsMinimize = () => { }, onTabsMaximizable = () => { }, onTabsClose = () => { }, options = {}, locales = {}, }) {
+    if (content && render) {
+        throw new Error(`Only one property "render" or "content" can be set.`);
+    }
+    const { classes, cx } = useStyles();
+    const { scrollToTabSpace = 3, scrollByArrowsRepeat = 150, scrollByArrowsStep = 100 } = options;
+    const [tabsElement, setTabsElement] = useState(null);
+    const { enabled, canLeft, canRight, onLeft, onRight } = useScrollByButtons(tabsElement, scrollByArrowsRepeat, scrollByArrowsStep);
+    useChangeScroll(tabsElement);
+    useScrollToActive(tabsElement, active, enabled, scrollToTabSpace);
+    const { onTabsMinimizeHandler, onTabsCloseHandler, onTabCreateHandler, onTabsMaximizeHandler } = useTabsCallbacks(onTabCreate, onTabsMinimize, onTabsMaximizable, onTabsClose);
+    const { onTabActiveHandler, onTabCloseHandler } = useTabCallbacks(tabs, onTabActivate, onTabClose, onTabsClose);
+    const Content = content;
+    return (_jsxs("div", { className: cx(classes.root, className), children: [_jsxs("div", { className: cx(classes.tabs), children: [enabled && (_jsx("button", { className: cx(classes.leftButton, !canLeft && classes.disabled, TabsClasses.ButtonLeft), onMouseDown: onLeft, children: _jsx("span", { className: "gd-icon-navigateleft" }) })), _jsx("div", { className: cx(classes.tabsList, {
+                            minimizable: minimizable,
+                            closeable: closeable,
+                            scrollable: enabled,
+                        }), style: { width: TabMaxWidth * tabs.length }, ref: setTabsElement, children: tabs.map((tab, i) => (_jsx(Tab, { tab: tab, placeholder: locales.titlePlaceholder, active: active === i, last: i === tabs.length - 1, beforeActive: active - 1 === i, afterActive: active + 1 === i, onActive: onTabActiveHandler, onClose: onTabCloseHandler }, tab.id))) }), enabled && (_jsx("button", { className: cx(classes.rightButton, !canRight && classes.disabled, TabsClasses.ButtonRight), onMouseDown: onRight, children: _jsx("span", { className: "gd-icon-navigateright" }) })), creatable && (_jsxs(BubbleHoverTrigger, { showDelay: 0, hideDelay: 100, eventsOnBubble: true, className: classes.trigger, children: [_jsx("div", { className: cx(classes.controls), children: _jsx(Button, { iconLeft: "gd-icon-add", onClick: onTabCreateHandler, className: cx(classes.create, "gd-button-action", TabsClasses.ButtonNewTab) }) }), locales.createTooltip && (_jsx(Bubble, { className: cx("bubble-dark", "s-tabs-create-tooltip"), alignPoints: [{ align: "bc tr", offset: { x: 0, y: -5 } }], children: locales.createTooltip }))] })), _jsx("div", { className: cx(classes.filler) }), _jsx("div", { className: cx(classes.controls), children: _jsx(TabsControls, { maximized: maximized, minimizable: minimizable, maximizable: maximizable, closeable: closeable, onTabsClose: onTabsCloseHandler, onTabsMinimize: onTabsMinimizeHandler, onTabsMaximize: onTabsMaximizeHandler }) })] }), Content && tabs[active] && _jsx(Content, { tab: tabs[active] }), render && tabs[active] && render({ tab: tabs[active] })] }));
+}
+function TabsControls({ minimizable, maximizable, maximized, closeable, onTabsMinimize, onTabsMaximize, onTabsClose, }) {
+    const { classes, cx } = useStyles();
+    const controls = [
+        minimizable && (_jsx("button", { className: cx(classes.button, TabsClasses.ButtonMinimize), onClick: onTabsMinimize, children: _jsx(IconMinimize, { width: TabsIconSize, height: TabsIconSize }) }, "minimize")),
+        maximizable && (_jsx("button", { className: cx(classes.button, TabsClasses.ButtonMaximize), onClick: () => onTabsMaximize?.(!maximized), children: maximized ? (_jsx(IconContract, { width: TabsIconSize, height: TabsIconSize })) : (_jsx(IconExpand, { width: TabsIconSize, height: TabsIconSize })) }, "maximize")),
+        closeable && (_jsx("button", { className: cx(classes.button, TabsClasses.ButtonCloseTabs), onClick: onTabsClose, children: _jsx(IconClose, { width: TabsIconSize, height: TabsIconSize }) }, "close")),
+    ];
+    return (_jsx(_Fragment, { children: controls.filter(Boolean).reduce((prev, current, i) => {
+            if (i !== 0) {
+                return [...prev, _jsx("div", { className: cx(classes.divider, ButtonDivider) }, i), current];
+            }
+            return [...prev, current];
+        }, []) }));
+}

package/esm/shared/Tabs/hooks/useChangeScroll.d.ts

@@ -0,0 +1,2 @@
+export declare function useChangeScroll(element: HTMLElement | null): void;
+//# sourceMappingURL=useChangeScroll.d.ts.map

package/esm/shared/Tabs/hooks/useChangeScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useChangeScroll.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useChangeScroll.ts"],"names":[],"mappings":"AAIA,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI,CAmBjE"}

package/esm/shared/Tabs/hooks/useChangeScroll.js

@@ -0,0 +1,19 @@
+// (C) 2022-2026 GoodData Corporation
+import { useEffect } from "react";
+export function useChangeScroll(element) {
+    useEffect(() => {
+        if (!element) {
+            return;
+        }
+        function transformScroll(event) {
+            if (!event.deltaY || !element) {
+                return;
+            }
+            element.scrollLeft += event.deltaY + event.deltaX;
+            event.preventDefault();
+            event.stopPropagation();
+        }
+        element.addEventListener("wheel", transformScroll);
+        return () => element.removeEventListener("wheel", transformScroll);
+    }, [element]);
+}

package/esm/shared/Tabs/hooks/useMouseDownRepeat.d.ts

@@ -0,0 +1,3 @@
+import { type MouseEvent } from "react";
+export declare function useMouseDownRepeat(timeout: number, onMouseDownHandler?: (e: MouseEvent) => void): (e: MouseEvent) => void;
+//# sourceMappingURL=useMouseDownRepeat.d.ts.map

package/esm/shared/Tabs/hooks/useMouseDownRepeat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMouseDownRepeat.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useMouseDownRepeat.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAA4C,MAAM,OAAO,CAAC;AAElF,wBAAgB,kBAAkB,CAC9B,OAAO,EAAE,MAAM,EACf,kBAAkB,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,GAC7C,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAkBzB"}

package/esm/shared/Tabs/hooks/useMouseDownRepeat.js

@@ -0,0 +1,43 @@
+// (C) 2021-2026 GoodData Corporation
+import { useCallback, useEffect, useRef, useState } from "react";
+export function useMouseDownRepeat(timeout, onMouseDownHandler) {
+    const callback = useCallback((e) => onMouseDownHandler?.(e), [onMouseDownHandler]);
+    const [start, stop] = useInterval(callback, timeout);
+    useEffect(() => {
+        document.addEventListener("mouseup", stop);
+        return () => document.removeEventListener("mouseup", stop);
+    }, [stop]);
+    return useCallback((e) => {
+        start(e);
+        if (onMouseDownHandler) {
+            onMouseDownHandler(e);
+        }
+    }, [onMouseDownHandler, start]);
+}
+function useInterval(handler, timeout) {
+    const timer = useRef(-1);
+    const [start, setStart] = useState(false);
+    const [fnArgs, setArguments] = useState([]);
+    const clear = useCallback(() => {
+        window.clearInterval(timer.current);
+    }, []);
+    useEffect(() => {
+        if (start) {
+            timer.current = window.setInterval(() => handler(...fnArgs), timeout);
+        }
+        else {
+            clear();
+        }
+        return clear;
+    }, [clear, fnArgs, handler, start, timeout]);
+    return [
+        (...args) => {
+            setArguments(args);
+            setStart(true);
+        },
+        () => {
+            setStart(false);
+            clear();
+        },
+    ];
+}

package/esm/shared/Tabs/hooks/useScrollByButtons.d.ts

@@ -0,0 +1,9 @@
+import { type MouseEvent } from "react";
+export declare function useScrollByButtons(element: HTMLElement | null, timeout?: number, step?: number): {
+    enabled: boolean;
+    canLeft: boolean;
+    canRight: boolean;
+    onLeft: (e: MouseEvent) => void;
+    onRight: (e: MouseEvent) => void;
+};
+//# sourceMappingURL=useScrollByButtons.d.ts.map

package/esm/shared/Tabs/hooks/useScrollByButtons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollByButtons.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useScrollByButtons.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAA6C,MAAM,OAAO,CAAC;AAInF,wBAAgB,kBAAkB,CAC9B,OAAO,EAAE,WAAW,GAAG,IAAI,EAC3B,OAAO,SAAM,EACb,IAAI,SAAM,GACX;IACC,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACpC,CAqBA"}

package/esm/shared/Tabs/hooks/useScrollByButtons.js

@@ -0,0 +1,76 @@
+// (C) 2022-2026 GoodData Corporation
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useMouseDownRepeat } from "./useMouseDownRepeat.js";
+export function useScrollByButtons(element, timeout = 150, step = 100) {
+    const { enabled, canLeft, canRight } = useChanged(element);
+    const changed = useScroll(element);
+    const onLeftHandler = useCallback(() => onMove(element, -step), [element, step]);
+    const onLeft = useMouseDownRepeat(timeout, onLeftHandler);
+    const onRightHandler = useCallback(() => onMove(element, step), [element, step]);
+    const onRight = useMouseDownRepeat(timeout, onRightHandler);
+    return useMemo(() => ({
+        enabled,
+        canLeft,
+        canRight,
+        onLeft,
+        onRight,
+    }), 
+    // oxlint-disable-next-line react-hooks/exhaustive-deps
+    [enabled, canLeft, canRight, onLeft, onRight, changed]);
+}
+function useScroll(element) {
+    const [changed, setChanged] = useState("");
+    useEffect(() => {
+        if (!element) {
+            return;
+        }
+        const handler = (e) => setChanged(e.timeStamp + Math.random().toString(36));
+        element.addEventListener("scroll", handler);
+        return () => {
+            element.removeEventListener("scroll", handler);
+        };
+    }, [element]);
+    return changed;
+}
+function useChanged(element) {
+    const { offsetWidth = 0, scrollWidth = 0, scrollLeft = 0 } = element || {};
+    const [width, setWidth] = useState(offsetWidth);
+    const [contentWidth, setContentWidth] = useState(scrollWidth);
+    const enabled = contentWidth > width;
+    const canLeft = scrollLeft > 0;
+    const canRight = scrollLeft < contentWidth - width;
+    useEffect(() => {
+        let pointer;
+        const checkChange = () => {
+            const { offsetWidth = 0, scrollWidth = 0 } = element || {};
+            if (width !== offsetWidth) {
+                setWidth(offsetWidth);
+            }
+            if (contentWidth !== scrollWidth) {
+                setContentWidth(scrollWidth);
+            }
+            pointer = window.requestAnimationFrame(checkChange);
+        };
+        pointer = window.requestAnimationFrame(checkChange);
+        return () => window.cancelAnimationFrame(pointer);
+    }, [contentWidth, element, width]);
+    return {
+        enabled,
+        canLeft,
+        canRight,
+    };
+}
+function onMove(element, step) {
+    if (!element) {
+        return;
+    }
+    if (element.scrollBy) {
+        element.scrollBy({
+            left: step,
+            behavior: "smooth",
+        });
+        return;
+    }
+    //fallback for IE
+    element.scrollLeft += step;
+}

package/esm/shared/Tabs/hooks/useScrollToActive.d.ts

@@ -0,0 +1,2 @@
+export declare function useScrollToActive(element: HTMLElement | null, active: number, enabled: boolean, space?: number): void;
+//# sourceMappingURL=useScrollToActive.d.ts.map

package/esm/shared/Tabs/hooks/useScrollToActive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollToActive.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useScrollToActive.ts"],"names":[],"mappings":"AAMA,wBAAgB,iBAAiB,CAC7B,OAAO,EAAE,WAAW,GAAG,IAAI,EAC3B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,KAAK,SAAI,GACV,IAAI,CA4BN"}

package/esm/shared/Tabs/hooks/useScrollToActive.js

@@ -0,0 +1,36 @@
+// (C) 2022-2026 GoodData Corporation
+import { useEffect } from "react";
+import { TabActive, TabRoot } from "../Tab.js";
+export function useScrollToActive(element, active, enabled, space = 3) {
+    useEffect(() => {
+        if (!element) {
+            return;
+        }
+        const { offsetWidth, scrollLeft } = element;
+        const [start, end] = [scrollLeft, scrollLeft + offsetWidth];
+        const activeTab = element.querySelector(`.${TabRoot}.${TabActive}`);
+        if (!activeTab) {
+            return;
+        }
+        const isBefore = activeTab.offsetLeft < start;
+        const isAfter = activeTab.offsetLeft + activeTab.offsetWidth > end;
+        if (isBefore) {
+            scrollToLeft(element, activeTab, activeTab.offsetLeft - space);
+        }
+        if (isAfter) {
+            scrollToLeft(element, activeTab, activeTab.offsetLeft + activeTab.offsetWidth - offsetWidth + space);
+        }
+    }, [element, active, enabled, space]);
+}
+function scrollToLeft(element, activeTab, left) {
+    if (element.scrollTo) {
+        element.scrollTo({
+            left,
+            top: 0,
+            behavior: "smooth",
+        });
+    }
+    else {
+        activeTab.scrollIntoView({ behavior: "smooth", inline: "nearest", block: "nearest" });
+    }
+}

package/esm/shared/Tabs/hooks/useTabCallbacks.d.ts

@@ -0,0 +1,7 @@
+import { type ITab } from "../Tab.js";
+import { type ITabsProps } from "../Tabs.data.js";
+export declare function useTabCallbacks<T>(tabs: Array<ITab<T>>, onTabActivate: NonNullable<ITabsProps<T>["onTabActivate"]>, onTabClose: NonNullable<ITabsProps<T>["onTabClose"]>, onTabsClose: NonNullable<ITabsProps<T>["onTabsClose"]>): {
+    onTabActiveHandler: (tab: ITab<T>) => void;
+    onTabCloseHandler: (tab: ITab<T>) => void;
+};
+//# sourceMappingURL=useTabCallbacks.d.ts.map

package/esm/shared/Tabs/hooks/useTabCallbacks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabCallbacks.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useTabCallbacks.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,wBAAgB,eAAe,CAAC,CAAC,EAC7B,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EACpB,aAAa,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,EAC1D,UAAU,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,EACpD,WAAW,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,GACvD;IACC,kBAAkB,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC3C,iBAAiB,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;CAC7C,CAgBA"}

package/esm/shared/Tabs/hooks/useTabCallbacks.js

@@ -0,0 +1,17 @@
+// (C) 2022-2026 GoodData Corporation
+import { useMemo } from "react";
+export function useTabCallbacks(tabs, onTabActivate, onTabClose, onTabsClose) {
+    return useMemo(() => {
+        function onTabActiveHandler(tab) {
+            onTabActivate(tab);
+        }
+        function onTabCloseHandler(tab) {
+            if (tabs.length === 1) {
+                onTabsClose();
+                return;
+            }
+            onTabClose(tab);
+        }
+        return { onTabActiveHandler, onTabCloseHandler };
+    }, [onTabActivate, onTabClose, onTabsClose, tabs]);
+}

package/esm/shared/Tabs/hooks/useTabs.d.ts

@@ -0,0 +1,24 @@
+import { type ITab } from "../Tab.js";
+import { type ITabsProps } from "../Tabs.data.js";
+export interface IUseTabsProps<T = undefined> {
+    tabs: Array<ITab<T>>;
+    active: number;
+    creatable?: ITabsProps<T>["creatable"];
+    onTabClose?: ITabsProps<T>["onTabClose"];
+    onBeforeTabClose?: (tab: ITab<T>, next: () => void) => void;
+    onTabActivate?: ITabsProps<T>["onTabActivate"];
+    onBeforeTabActivate?: (tab: ITab<T>, next: () => void) => void;
+    onTabAdd?: (tab: ITab<T>) => void;
+    onBeforeTabAdd?: (tab: ITab<T>, next: () => void) => void;
+    onTabUpdate?: (oldTab: ITab<T>, newTab: ITab<T>) => void;
+}
+export interface IUseTabsReturn<T> {
+    addTab: (tab: ITab<T>, index?: number) => void;
+    activateTab: (tab: ITab<T>) => void;
+    updateTab: (tab: ITab<T>, props: Partial<ITab<T>>) => void;
+    updateData: (tab: ITab<T>, data: T) => void;
+    closeTab: (tab: ITab<T>) => void;
+    tabsProps: IUseTabsProps<T>;
+}
+export declare function useTabs<T>(props: IUseTabsProps<T>): IUseTabsReturn<T>;
+//# sourceMappingURL=useTabs.d.ts.map

package/esm/shared/Tabs/hooks/useTabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabs.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useTabs.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAIlD,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,SAAS;IACxC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;IACvC,UAAU,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;IACzC,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC5D,aAAa,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC;IAC/C,mBAAmB,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC/D,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAClC,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IAC1D,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;CAC5D;AAED,MAAM,WAAW,cAAc,CAAC,CAAC;IAC7B,MAAM,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,WAAW,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACpC,SAAS,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC3D,UAAU,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;CAC/B;AAED,wBAAgB,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CA2CrE"}

package/esm/shared/Tabs/hooks/useTabs.js

@@ -0,0 +1,130 @@
+// (C) 2022-2026 GoodData Corporation
+import { useCallback } from "react";
+import { useProp } from "../../hooks/useProp.js";
+const nextFn = nextInvoke();
+export function useTabs(props) {
+    const [tabs, setTabs] = useProp(props.tabs);
+    const [active, setActive] = useProp(Math.min(props.active, props.tabs.length - 1));
+    const { onTabActivate, onTabClose, onTabAdd, onTabUpdate } = props;
+    const { creatable = true } = props;
+    const { onBeforeTabClose = nextFn, onBeforeTabActivate = nextFn, onBeforeTabAdd = nextFn } = props;
+    const activateTab = useCallback((tab) => activateTabHandler(tab, setActive, setTabs, onBeforeTabActivate, onTabActivate), [onBeforeTabActivate, onTabActivate, setActive, setTabs]);
+    const addTab = useCallback((tab, index = Number.MAX_SAFE_INTEGER) => addTabHandler(tab, index, creatable, setActive, setTabs, onBeforeTabAdd, onTabAdd), [creatable, onBeforeTabAdd, onTabAdd, setActive, setTabs]);
+    const closeTab = useCallback((tab) => removeTabHandler(tab, setActive, setTabs, onBeforeTabClose, onTabClose), [onBeforeTabClose, onTabClose, setActive, setTabs]);
+    const updateTab = useCallback((tab, newProps) => updateTabHandler(tab, newProps, setTabs, onTabUpdate), [onTabUpdate, setTabs]);
+    const updateData = useCallback((tab, data) => updateDataHandler(data, tab, setTabs, onTabUpdate), [onTabUpdate, setTabs]);
+    return {
+        activateTab,
+        addTab,
+        closeTab,
+        updateTab,
+        updateData,
+        tabsProps: {
+            tabs,
+            active,
+            creatable,
+            onTabClose: closeTab,
+            onTabActivate: activateTab,
+        },
+    };
+}
+function addTabHandler(tab, index, creatable, setActive, setTabs, onBeforeTabAdd, onTabAdd) {
+    if (!creatable) {
+        return;
+    }
+    onBeforeTabAdd(tab, () => setTabs((oldTabs) => {
+        const newTabs = oldTabs.slice();
+        newTabs.splice(index, 0, tab);
+        setActive(newTabs.indexOf(tab));
+        if (onTabAdd) {
+            onTabAdd(tab);
+        }
+        return newTabs;
+    }));
+}
+function removeTabHandler(tab, setActive, setTabs, onBeforeTabClose, onTabClose) {
+    if (!tab.options?.closeable) {
+        return;
+    }
+    setTabs((oldTabs) => {
+        const index = findIndex(tab, oldTabs);
+        const found = oldTabs[index];
+        if (!found) {
+            return oldTabs;
+        }
+        let shouldProceed = false;
+        onBeforeTabClose(found, () => {
+            shouldProceed = true;
+        });
+        if (!shouldProceed) {
+            return oldTabs;
+        }
+        setActive((oldActive) => index <= oldActive ? Math.max(oldActive - 1, 0) : Math.min(oldActive, oldTabs.length - 2));
+        if (onTabClose) {
+            onTabClose(found);
+        }
+        return oldTabs.filter((t) => t !== tab);
+    });
+}
+function updateTabHandler(tab, newProps, setTabs, onTabUpdate) {
+    setTabs((oldTabs) => {
+        const index = findIndex(tab, oldTabs);
+        if (index >= 0) {
+            const currentTab = oldTabs[index];
+            const newTab = { ...currentTab, ...newProps };
+            const newTabs = oldTabs.slice();
+            newTabs.splice(index, 1, newTab);
+            if (onTabUpdate) {
+                onTabUpdate(currentTab, newProps);
+            }
+            return newTabs;
+        }
+        return oldTabs;
+    });
+}
+function updateDataHandler(data, tab, setTabs, onTabUpdate) {
+    setTabs((oldTabs) => {
+        const index = findIndex(tab, oldTabs);
+        if (index >= 0) {
+            const oldTab = oldTabs[index];
+            const newTab = { ...oldTab, data };
+            const newTabs = oldTabs.slice();
+            newTabs[index] = newTab;
+            if (onTabUpdate) {
+                onTabUpdate(oldTab, { data });
+            }
+            return newTabs;
+        }
+        return oldTabs;
+    });
+}
+function activateTabHandler(tab, setActive, setTabs, onBeforeTabActivate, onTabActivate) {
+    setTabs((oldTabs) => {
+        const index = findIndex(tab, oldTabs);
+        const found = oldTabs[index];
+        if (!found) {
+            return oldTabs;
+        }
+        let shouldProceed = false;
+        onBeforeTabActivate(found, () => {
+            shouldProceed = true;
+        });
+        if (!shouldProceed) {
+            return oldTabs;
+        }
+        setActive(index);
+        if (onTabActivate) {
+            onTabActivate(found);
+        }
+        return oldTabs;
+    });
+}
+function findIndex(tab, tabs) {
+    const found = tabs
+        .map((current, i) => (current.id === tab.id ? i : null))
+        .filter((item) => item !== null);
+    return found.length ? found[0] : -1;
+}
+function nextInvoke() {
+    return (_, next) => next();
+}

package/esm/shared/Tabs/hooks/useTabsCallbacks.d.ts

@@ -0,0 +1,8 @@
+import { type ITabsProps } from "../Tabs.data.js";
+export declare function useTabsCallbacks<T>(onTabCreate: NonNullable<ITabsProps<T>["onTabCreate"]>, onTabsMinimize: NonNullable<ITabsProps<T>["onTabsMinimize"]>, onTabsMaximizable: NonNullable<ITabsProps<T>["onTabsMaximizable"]>, onTabsClose: NonNullable<ITabsProps<T>["onTabsClose"]>): {
+    onTabCreateHandler: () => void;
+    onTabsMinimizeHandler: () => void;
+    onTabsMaximizeHandler: (state: boolean) => void;
+    onTabsCloseHandler: () => void;
+};
+//# sourceMappingURL=useTabsCallbacks.d.ts.map

package/esm/shared/Tabs/hooks/useTabsCallbacks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabsCallbacks.d.ts","sourceRoot":"","sources":["../../../../src/shared/Tabs/hooks/useTabsCallbacks.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAElD,wBAAgB,gBAAgB,CAAC,CAAC,EAC9B,WAAW,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,EACtD,cAAc,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,EAC5D,iBAAiB,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,EAClE,WAAW,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,GACvD;IACC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAClC,qBAAqB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,kBAAkB,EAAE,MAAM,IAAI,CAAC;CAClC,CAoBA"}

package/esm/shared/Tabs/hooks/useTabsCallbacks.js

@@ -0,0 +1,19 @@
+// (C) 2022-2026 GoodData Corporation
+import { useMemo } from "react";
+export function useTabsCallbacks(onTabCreate, onTabsMinimize, onTabsMaximizable, onTabsClose) {
+    return useMemo(() => {
+        function onTabsMinimizeHandler() {
+            onTabsMinimize();
+        }
+        function onTabsMaximizeHandler(state) {
+            onTabsMaximizable(state);
+        }
+        function onTabsCloseHandler() {
+            onTabsClose();
+        }
+        function onTabCreateHandler() {
+            onTabCreate();
+        }
+        return { onTabCreateHandler, onTabsMinimizeHandler, onTabsMaximizeHandler, onTabsCloseHandler };
+    }, [onTabCreate, onTabsClose, onTabsMinimize, onTabsMaximizable]);
+}

package/esm/shared/authentication/Authentication.d.ts

@@ -0,0 +1,8 @@
+import { type ReactElement, type ReactNode } from "react";
+export declare function Authentication({ children, Error, initOpenNotAuthenticatedOverlay, initOpenContractExpiredDialog, }: {
+    Error: (err: Error) => ReactElement;
+    initOpenNotAuthenticatedOverlay?: ((callback: (err: Error) => void) => void) | false;
+    initOpenContractExpiredDialog?: ((callback: (tier: string) => void) => void) | false;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Authentication.d.ts.map

package/esm/shared/authentication/Authentication.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Authentication.d.ts","sourceRoot":"","sources":["../../../src/shared/authentication/Authentication.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAO/E,wBAAgB,cAAc,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,+BAA+B,EAC/B,6BAA6B,GAChC,EAAE;IACC,KAAK,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,YAAY,CAAC;IACpC,+BAA+B,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,KAAK,IAAI,CAAC,GAAG,KAAK,CAAC;IACrF,6BAA6B,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,KAAK,IAAI,CAAC,GAAG,KAAK,CAAC;IACrF,QAAQ,EAAE,SAAS,CAAC;CACvB,2CAwCA"}