@geotab/zenith 1.26.6-beta.0 → 1.26.6-beta.2

package/esm/menu/components/menuItem.js

@@ -1,80 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Children, Fragment, cloneElement, useMemo, useRef, useContext, useCallback } from "react";
-import { MenuButton } from "./menuButton";
-import { ControlledMenu } from "../controlledMenu";
-import { ControlledPopup } from "../../controlledPopup/controlledPopup";
-import { PathContext } from "../contexts/pathContext";
-import { classNames } from "../../commonHelpers/classNames/classNames";
-import { generateId } from "../../commonHelpers/utils";
-import { MenuAlignmentContext } from "../../header/headerContext";
-export const MenuItem = ({ id, children, name, icon, disabled, onClick, link, target, rel, isMobile = false, setIsOpen, trigger, className, active, alignment }) => {
-    const aligmentContext = useContext(MenuAlignmentContext);
-    const contentAlignment = alignment || aligmentContext.alignment || "right-top";
-    const { path, onOpenBranch, closeBranch } = useContext(PathContext);
-    const memoizedDesktopActionOnClick = useCallback((itemId, e) => {
-        setIsOpen === null || setIsOpen === void 0 ? void 0 : setIsOpen(false);
-        onClick === null || onClick === void 0 ? void 0 : onClick(itemId, e);
-    }, [setIsOpen, onClick]);
-    const memoizedMobileActionOnClick = useCallback((itemId, e) => {
-        onOpenBranch(id);
-        !link && (onClick === null || onClick === void 0 ? void 0 : onClick(itemId, e));
-    }, [id, onClick, link, onOpenBranch]);
-    const memoizedTriggerOnClick = useCallback((itemId, e) => {
-        onOpenBranch(id);
-        !link && (onClick === null || onClick === void 0 ? void 0 : onClick(itemId, e));
-    }, [onClick, onOpenBranch, id, link]);
-    const memoizedCustomTriggerOnClick = useCallback((e, ...rest) => {
-        var _a, _b;
-        onOpenBranch(id);
-        if ((_a = trigger === null || trigger === void 0 ? void 0 : trigger.props) === null || _a === void 0 ? void 0 : _a.onClick) {
-            (_b = trigger.props) === null || _b === void 0 ? void 0 : _b.onClick(...[e, ...rest]);
-            return;
-        }
-        onClick === null || onClick === void 0 ? void 0 : onClick(id, e);
-    }, [onClick, onOpenBranch, id, trigger]);
-    const memoizedOnOpenChange = useCallback(() => {
-        closeBranch();
-    }, [closeBranch]);
-    const ref = useRef(null);
-    const content = useMemo(() => {
-        const cont = [];
-        Children.map(children, (child) => {
-            if (!child) {
-                return;
-            }
-            if (typeof child === "string") {
-                cont.push(_jsx("li", { className: classNames(["zen-menu-item__content", className !== null && className !== void 0 ? className : ""]), role: "presentation", children: child }, generateId()));
-                return;
-            }
-            if (child.type === ControlledMenu.Item) {
-                const clone = cloneElement(child, {
-                    isMobile,
-                    key: child.props.id,
-                    setIsOpen
-                });
-                cont.push(clone);
-                return;
-            }
-            cont.push(_jsx("li", { className: classNames(["zen-menu-item__content", className !== null && className !== void 0 ? className : ""]), role: "presentation", children: child }, child.props.id || child.props["data-id"] || generateId()));
-        });
-        return cont;
-    }, [children, isMobile, setIsOpen, className]);
-    const isOpen = useMemo(() => path.includes(id), [path, id]);
-    if (content.length === 0) {
-        return _jsx(MenuButton, { id: id, name: name, icon: icon, disabled: disabled, link: link, target: target, rel: rel, onClick: memoizedDesktopActionOnClick, className: className, active: active, hasChildren: false }, id);
-    }
-    if (isMobile) {
-        return _jsx(MenuButton, { id: id, name: name, icon: icon, disabled: disabled, link: link, target: target, rel: rel, onClick: memoizedMobileActionOnClick, active: active, hasChildren: true }, id);
-    }
-    let popupTrigger;
-    if (trigger) {
-        popupTrigger = cloneElement(trigger, {
-            ref: ref,
-            onClick: memoizedCustomTriggerOnClick
-        });
-    }
-    else {
-        popupTrigger = _jsx(MenuButton, { id: id, ref: ref, name: name, icon: icon, disabled: disabled, hasChildren: true, onClick: memoizedTriggerOnClick, active: active }, id);
-    }
-    return _jsxs(Fragment, { children: [popupTrigger, _jsx(ControlledPopup, { className: classNames([`zen-controlled-menu-submenu--${path.length}`]), useTrapFocusWithTrigger: "on", alignment: contentAlignment, triggerRef: ref, isOpen: isOpen, onOpenChange: memoizedOnOpenChange, ariaLabel: popupTrigger.props.name, recalculateOnScroll: true, children: _jsx("ul", { role: "menu", className: "zen-menu-item", children: content }) })] }, id);
-};

package/esm/menu/components/menuSeparator.d.ts

@@ -1,5 +0,0 @@
-import { FC } from "react";
-import "./menuSeparator.less";
-export interface IMenuSeparator {
-}
-export declare const MenuSeparator: FC<IMenuSeparator>;

package/esm/menu/components/menuSeparator.js

@@ -1,2 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export const MenuSeparator = () => _jsx("li", { className: "zen-menu-separator", role: "separator" });

package/esm/menu/contexts/pathContext.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-export interface IPathContext {
-    path: string[];
-    onOpenBranch: (id: string) => void;
-    closeBranch: () => void;
-}
-export declare const PathContext: import("react").Context<IPathContext>;

package/esm/menu/contexts/pathContext.js

@@ -1,6 +0,0 @@
-import { createContext } from "react";
-export const PathContext = createContext({
-    path: [],
-    onOpenBranch: () => { },
-    closeBranch: () => { }
-});

package/esm/menu/contexts/pathProvider.d.ts

@@ -1,6 +0,0 @@
-import { FC, PropsWithChildren } from "react";
-import { IPathContext } from "./pathContext";
-interface IPathProvider extends IPathContext, PropsWithChildren {
-}
-export declare const PathProvider: FC<IPathProvider>;
-export {};

package/esm/menu/contexts/pathProvider.js

@@ -1,3 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { PathContext } from "./pathContext";
-export const PathProvider = ({ children, path, onOpenBranch, closeBranch }) => (_jsx(PathContext.Provider, { value: { path, onOpenBranch, closeBranch }, children: children }));

package/esm/menu/controlledMenu.d.ts

@@ -1,28 +0,0 @@
-import { FC, RefObject } from "react";
-import { IMenuControlledItem } from "./components/menuItem";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-import "./controlledMenu.less";
-import "./controlledMenuSubmenu.less";
-import { TAlignment } from "../absolute/absolute";
-import { IMenuSeparator } from "./components/menuSeparator";
-export interface IControlledMenu extends IZenComponentProps {
-    id?: string;
-    title: string;
-    paddingX?: number;
-    paddingY?: number;
-    isOpen: boolean;
-    setIsOpen: (v: boolean) => void;
-    triggerRef: RefObject<HTMLElement>;
-    alignment?: TAlignment;
-    ariaLabel?: string;
-    ariaLabelledby?: string;
-    listClassName?: string;
-}
-type TControlledMenu = FC<IControlledMenu> & {
-    Item: FC<IMenuControlledItem>;
-} & {
-    Separator: FC<IMenuSeparator>;
-};
-export declare const ControlledMenu: TControlledMenu;
-export declare const TRANSLATIONS: string[];
-export {};

package/esm/menu/controlledMenu.js

@@ -1,155 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/* eslint-disable @typescript-eslint/naming-convention */
-import { Children, cloneElement, isValidElement, useState, useMemo, useCallback, useEffect } from "react";
-import { MenuItem } from "./components/menuItem";
-import { classNames } from "../commonHelpers/classNames/classNames";
-import { findContent } from "./utils/findContent";
-import { findFirstFocusable } from "./utils/findFirstFocusable";
-import { findLastFocusable } from "./utils/findLastFocusable";
-import { findNextFocusable } from "./utils/findNextFocusable";
-import { isButton } from "./utils/isButton";
-import { isLink } from "./utils/isLink";
-import { findPrevFocusable } from "./utils/findPrevFocusable";
-import { MenuButton } from "./components/menuButton";
-import { IconArrowLeft } from "../icons/iconArrowLeft";
-import { ControlledPopup } from "../controlledPopup/controlledPopup";
-import { MobileSheet } from "../mobileSheet/mobileSheet";
-import { DeviceType } from "../commonHelpers/hooks/deviceType";
-import { useDeviceType } from "../commonHelpers/hooks/useDeviceType";
-import { generateId } from "../commonHelpers/utils";
-import { PathProvider } from "./contexts/pathProvider";
-import { MenuSeparator } from "./components/menuSeparator";
-// eslint-disable-next-line react/prop-types
-export const ControlledMenu = ({ children, isOpen, setIsOpen, triggerRef, ariaLabel, ariaLabelledby, id, title, className = "", listClassName = "", paddingX = 0, paddingY = 0, alignment }) => {
-    const [deviceType, setDeviceType] = useState(DeviceType.Desktop);
-    const isMobile = deviceType === DeviceType.Mobile;
-    const memoizedOnChange = useCallback(setIsOpen, [setIsOpen]);
-    useDeviceType(setDeviceType);
-    const [path, setPath] = useState([]);
-    useEffect(() => {
-        if (path.length && !isOpen) {
-            setPath([]);
-        }
-    }, [isOpen, path, setPath]);
-    const onOpenBranch = useCallback((branchId) => {
-        if (!branchId) {
-            return;
-        }
-        if (!path.includes(branchId)) {
-            setPath([...path, branchId]);
-            return;
-        }
-        if (path.includes(branchId)) {
-            setPath((v) => {
-                const newPath = [...v];
-                newPath.pop();
-                return newPath;
-            });
-        }
-    }, [setPath, path]);
-    const closeBranch = useCallback(() => {
-        setPath((v) => {
-            const newPath = [...v];
-            newPath.pop();
-            return newPath;
-        });
-    }, [setPath]);
-    const [content, parent] = useMemo(() => {
-        let par = null;
-        let currentChildren = children;
-        if (isMobile && path.length > 0) {
-            const el = findContent(children, ControlledMenu.Item, path[path.length - 1]);
-            if (el || isValidElement(el)) {
-                currentChildren = el.props.children;
-                par = el;
-            }
-        }
-        let cont = [];
-        Children.map(currentChildren, (child) => {
-            if (!child) {
-                return;
-            }
-            if (typeof child === "string") {
-                cont.push(_jsx("li", { role: "presentation", className: classNames(["zen-menu-item__content"]), children: child }, generateId()));
-                return;
-            }
-            if (child.type === MenuSeparator) {
-                const clone = cloneElement(child, {
-                    key: child.props.key || generateId()
-                });
-                cont.push(clone);
-                return;
-            }
-            if (child.type === ControlledMenu.Item) {
-                const clone = cloneElement(child, {
-                    isMobile,
-                    key: child.props.id,
-                    setIsOpen,
-                    onClick: child.props.onClick
-                });
-                cont.push(clone);
-                return;
-            }
-            cont.push(_jsx("li", { className: classNames(["zen-menu-item__content"]), role: "presentation", children: child }, child.props.id || child.props["data-id"] || generateId()));
-        });
-        while (cont[0] && cont[0].type === MenuSeparator) {
-            cont.shift();
-        }
-        while (cont[cont.length - 1] && cont[cont.length - 1].type === MenuSeparator) {
-            cont.pop();
-        }
-        cont = cont.filter((el, indx, arr) => {
-            var _a;
-            if (el.type === MenuSeparator && ((_a = arr[indx - 1]) === null || _a === void 0 ? void 0 : _a.type) === MenuSeparator) {
-                return false;
-            }
-            return true;
-        });
-        return [cont, par];
-    }, [children, isMobile, path, setIsOpen]);
-    const onKeyDown = (e) => {
-        var _a, _b, _c, _d;
-        const target = e.target;
-        if (isButton(target) || isLink(target)) {
-            if (e.key === "ArrowDown") {
-                e.preventDefault();
-                (_a = findNextFocusable(target)) === null || _a === void 0 ? void 0 : _a.focus();
-                return;
-            }
-            if (e.key === "ArrowUp") {
-                e.preventDefault();
-                (_b = findPrevFocusable(target)) === null || _b === void 0 ? void 0 : _b.focus();
-                return;
-            }
-            if (e.key === "Home") {
-                e.preventDefault();
-                (_c = findFirstFocusable(target)) === null || _c === void 0 ? void 0 : _c.focus();
-                return;
-            }
-            if (e.key === "End") {
-                e.preventDefault();
-                (_d = findLastFocusable(target)) === null || _d === void 0 ? void 0 : _d.focus();
-                return;
-            }
-        }
-        if (isButton(target)) {
-            if (e.key === "ArrowRight" && target.classList.contains("zen-menu-button__action--has-children")) {
-                e.preventDefault();
-                target.click();
-                return;
-            }
-        }
-    };
-    const renderMenuList = () => _jsx("div", { onKeyDown: onKeyDown, className: classNames(["zen-action-list", className]), children: _jsxs("ul", { role: "menu", className: classNames(["zen-menu-item", className, listClassName]), children: [parent ? _jsx(MenuButton, { id: "root", name: parent.props.name, icon: IconArrowLeft, onClick: closeBranch, hasChildren: false, disabled: false }, "root") : null, content] }) });
-    const hideMenu = useCallback(() => {
-        closeBranch();
-        setIsOpen(false);
-    }, [closeBranch, setIsOpen]);
-    if (isMobile) {
-        return _jsx(_Fragment, { children: _jsx(PathProvider, { path: path, onOpenBranch: onOpenBranch, closeBranch: closeBranch, children: _jsxs(MobileSheet, { label: title, isOpen: isOpen, triggerRef: triggerRef, onHidePanel: hideMenu, onCloseClick: hideMenu, children: [_jsx(MobileSheet.Title, { children: title }), _jsx(MobileSheet.Content, { children: renderMenuList() })] }) }) });
-    }
-    return _jsx(_Fragment, { children: _jsx(PathProvider, { path: path, onOpenBranch: onOpenBranch, closeBranch: closeBranch, children: _jsx(ControlledPopup, { id: id, useTrapFocusWithTrigger: "on", className: classNames(["zen-controlled-menu", className]), onOpenChange: memoizedOnChange, isOpen: isOpen, triggerRef: triggerRef, paddingX: paddingX, paddingY: paddingY, alignment: alignment, ariaLabelledby: ariaLabelledby, ariaLabel: ariaLabel, recalculateOnScroll: true, children: renderMenuList() }) }) });
-};
-ControlledMenu.Item = MenuItem;
-ControlledMenu.Separator = MenuSeparator;
-export const TRANSLATIONS = ["Back"];

package/esm/menu/menu.d.ts

@@ -1,19 +0,0 @@
-import { FC, ReactElement, RefObject } from "react";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-import { IMenuItem } from "./components/menuItem";
-import { TAlignment } from "../absolute/absolute";
-import { IMenuSeparator } from "./components/menuSeparator";
-export interface IMenu extends Pick<IZenComponentProps, "children"> {
-    trigger?: ReactElement;
-    triggerRef?: RefObject<HTMLElement>;
-    title: string;
-    alignment?: TAlignment;
-    ariaLabel?: string;
-    ariaLabelledBy?: string;
-    className?: string;
-}
-export declare const Menu: FC<IMenu> & {
-    Item: FC<IMenuItem>;
-} & {
-    Separator: FC<IMenuSeparator>;
-};

package/esm/menu/menu.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { cloneElement, useEffect, useRef, useState } from "react";
-import { ControlledMenu } from "./controlledMenu";
-import { MenuItem } from "./components/menuItem";
-import { MenuSeparator } from "./components/menuSeparator";
-import { classNames } from "../commonHelpers/classNames/classNames";
-// eslint-disable-next-line @typescript-eslint/naming-convention
-export const Menu = 
-// eslint-disable-next-line react/prop-types
-({ children, title, trigger, triggerRef, ariaLabel, ariaLabelledBy, alignment = "bottom-left", className }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const innerRef = useRef(null);
-    const shouldRenderTrigger = !!trigger;
-    const ref = (shouldRenderTrigger || !triggerRef) ? innerRef : triggerRef;
-    const abortEventsControllerRef = useRef(null);
-    const renderTrigger = () => cloneElement(trigger, {
-        ref,
-        onClick: () => {
-            setIsOpen(!isOpen);
-        }
-    });
-    useEffect(() => {
-        var _a;
-        if ((triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) && !shouldRenderTrigger) {
-            (_a = abortEventsControllerRef.current) === null || _a === void 0 ? void 0 : _a.abort();
-            abortEventsControllerRef.current = new AbortController();
-            triggerRef.current.addEventListener("click", () => setIsOpen(!isOpen), { signal: abortEventsControllerRef.current.signal });
-        }
-    }, [triggerRef, isOpen, shouldRenderTrigger]);
-    const triggerComp = shouldRenderTrigger ? renderTrigger() : null;
-    return _jsxs(_Fragment, { children: [triggerComp, _jsx(ControlledMenu, { alignment: alignment, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledBy || (triggerComp === null || triggerComp === void 0 ? void 0 : triggerComp.props.id), isOpen: isOpen, setIsOpen: setIsOpen, triggerRef: ref, title: title, className: classNames(["zen-menu", className || ""]), children: children })] });
-};
-Menu.Item = MenuItem;
-Menu.Separator = MenuSeparator;

package/esm/menu/utils/findContent.d.ts

@@ -1,2 +0,0 @@
-import React, { ReactNode, ReactElement } from "react";
-export declare const findContent: (children: ReactNode, targetComponent: React.FC | React.ComponentClass, id?: string) => ReactElement | null;

package/esm/menu/utils/findContent.js

@@ -1,17 +0,0 @@
-import React from "react";
-export const findContent = (children, targetComponent, id) => {
-    let found = null;
-    React.Children.forEach(children, (child) => {
-        if (found || !React.isValidElement(child)) {
-            return;
-        }
-        if (id ? child.type === targetComponent && child.props.id === id : child.type === targetComponent) {
-            found = child;
-            return;
-        }
-        if (child.props.children) {
-            found = findContent(child.props.children, targetComponent, id);
-        }
-    });
-    return found;
-};

package/esm/menu/utils/findFirstFocusable.d.ts

@@ -1 +0,0 @@
-export declare const findFirstFocusable: (element?: HTMLElement) => HTMLElement | null | undefined;

package/esm/menu/utils/findFirstFocusable.js

@@ -1,8 +0,0 @@
-import { FOCUSABLE_SELECTOR } from "../../utils/focusableSelector";
-export const findFirstFocusable = (element) => {
-    if (!element) {
-        return undefined;
-    }
-    const ulElement = element.closest("ul");
-    return ulElement === null || ulElement === void 0 ? void 0 : ulElement.querySelector(FOCUSABLE_SELECTOR);
-};

package/esm/menu/utils/findLastFocusable.d.ts

@@ -1 +0,0 @@
-export declare const findLastFocusable: (element?: HTMLElement) => HTMLElement | undefined;

package/esm/menu/utils/findLastFocusable.js

@@ -1,9 +0,0 @@
-import { FOCUSABLE_SELECTOR } from "../../utils/focusableSelector";
-export const findLastFocusable = (element) => {
-    if (!element) {
-        return undefined;
-    }
-    const ulElement = element.closest("ul");
-    const focusable = ulElement === null || ulElement === void 0 ? void 0 : ulElement.querySelectorAll(FOCUSABLE_SELECTOR);
-    return focusable === null || focusable === void 0 ? void 0 : focusable[focusable.length - 1];
-};

package/esm/menu/utils/findNextFocusable.d.ts

@@ -1 +0,0 @@
-export declare const findNextFocusable: (element?: HTMLElement) => HTMLElement | null | undefined;

package/esm/menu/utils/findNextFocusable.js

@@ -1,15 +0,0 @@
-import { FOCUSABLE_SELECTOR } from "../../utils/focusableSelector";
-export const findNextFocusable = (element) => {
-    if (!element) {
-        return undefined;
-    }
-    const listItemEl = element.closest("li");
-    let nextElement = listItemEl.nextElementSibling;
-    while (nextElement) {
-        if (nextElement.querySelector(FOCUSABLE_SELECTOR)) {
-            return nextElement.querySelector(FOCUSABLE_SELECTOR);
-        }
-        nextElement = nextElement.nextElementSibling;
-    }
-    return listItemEl.parentNode.querySelector(FOCUSABLE_SELECTOR);
-};

package/esm/menu/utils/findPrevFocusable.d.ts

@@ -1 +0,0 @@
-export declare function findPrevFocusable(element?: HTMLElement): HTMLElement | undefined;

package/esm/menu/utils/findPrevFocusable.js

@@ -1,16 +0,0 @@
-import { FOCUSABLE_SELECTOR } from "../../utils/focusableSelector";
-export function findPrevFocusable(element) {
-    if (!element) {
-        return undefined;
-    }
-    const listItemEl = element.closest("li");
-    let prevElement = listItemEl.previousElementSibling;
-    while (prevElement) {
-        if (prevElement.querySelector(FOCUSABLE_SELECTOR)) {
-            return prevElement.querySelector(FOCUSABLE_SELECTOR);
-        }
-        prevElement = prevElement.previousElementSibling;
-    }
-    const focusable = listItemEl.parentNode.querySelectorAll(FOCUSABLE_SELECTOR);
-    return focusable[focusable.length - 1];
-}

package/esm/menu/utils/getMenuButtonState.d.ts

@@ -1,7 +0,0 @@
-export declare const getMenuButtonState: (active: null | boolean, disabled?: boolean) => {
-    hasState: boolean;
-    isActive: null;
-} | {
-    hasState: boolean;
-    isActive: boolean;
-};

package/esm/menu/utils/getMenuButtonState.js

@@ -1,6 +0,0 @@
-export const getMenuButtonState = (active, disabled = false) => {
-    if (active === null || disabled) {
-        return { hasState: false, isActive: null };
-    }
-    return { hasState: true, isActive: active };
-};

package/esm/menu/utils/isButton.d.ts

@@ -1 +0,0 @@
-export declare const isButton: (el?: Element) => el is HTMLButtonElement;

package/esm/menu/utils/isButton.js

@@ -1 +0,0 @@
-export const isButton = (el) => !!el && el.tagName === "BUTTON";

package/esm/menu/utils/isLink.d.ts

@@ -1 +0,0 @@
-export declare const isLink: (el?: Element) => el is HTMLLinkElement;

package/esm/menu/utils/isLink.js

@@ -1 +0,0 @@
-export const isLink = (el) => !!el && el.tagName === "A";

package/esm/miniTabs/miniTabs.d.ts

@@ -1,22 +0,0 @@
-import React, { ReactNode } from "react";
-import "./miniTabs.less";
-import { MiniTabsItem } from "./miniTabsItem";
-export interface IMiniTabElement {
-    name: string;
-    content: ReactNode;
-    id: string;
-}
-export declare enum MiniTabsSize {
-    Small = "small",
-    Medium = "medium",
-    Large = "large",
-    XLarge = "xlarge"
-}
-export interface IMiniTabs {
-    activeTabId: string;
-    onTabChange: (newTabId: string) => void;
-    className?: string;
-    size?: MiniTabsSize;
-    children: React.ReactElement<typeof MiniTabsItem> | React.ReactElement<typeof MiniTabsItem>[];
-}
-export declare const MiniTabs: React.FC<IMiniTabs>;

package/esm/miniTabs/miniTabs.js

@@ -1,37 +0,0 @@
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { classNames } from "../commonHelpers/classNames/classNames";
-import { MiniTabsHeaderItem } from "./miniTabsHeaderItem";
-import { MiniTabsItem } from "./miniTabsItem";
-import { tabsKeyboardHandler } from "../commonHelpers/tabsKeyboard";
-import { getChildrenForRender } from "./miniTabsHelper";
-export var MiniTabsSize;
-(function (MiniTabsSize) {
-    MiniTabsSize["Small"] = "small";
-    MiniTabsSize["Medium"] = "medium";
-    MiniTabsSize["Large"] = "large";
-    MiniTabsSize["XLarge"] = "xlarge";
-})(MiniTabsSize || (MiniTabsSize = {}));
-export const MiniTabs = ({ activeTabId, onTabChange, children, size = MiniTabsSize.Medium, className }) => {
-    const maxTabsValue = 3;
-    const [tabs, setTabs] = useState([]);
-    const activeButtonRef = useRef(null);
-    const tabsRef = useRef(null);
-    const handleTabItemClick = (e) => {
-        const newState = e.target.id || e.currentTarget.id || undefined;
-        newState && newState !== activeTabId && onTabChange(newState);
-    };
-    const keyDownHandler = useCallback((e) => {
-        const newActiveTabId = tabsKeyboardHandler(e, tabs, activeTabId);
-        if (newActiveTabId && newActiveTabId !== activeTabId) {
-            onTabChange(newActiveTabId);
-        }
-    }, [tabs, activeTabId, onTabChange]);
-    useEffect(() => setTabs(getChildrenForRender(children).slice(0, maxTabsValue)), [children]);
-    useEffect(() => {
-        var _a;
-        (_a = activeButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    }, [activeTabId]);
-    return _jsx("div", { className: classNames(["zen-mini-tabs", `zen-mini-tabs--${size}`, className ? className : ""]), children: tabs.length ? _jsxs(_Fragment, { children: [_jsx("div", { className: "zen-mini-tabs__header", role: "tablist", onKeyDown: keyDownHandler, ref: tabsRef, children: tabs.map(tab => (_jsx(MiniTabsHeaderItem, { id: tab.id, isActive: activeTabId === tab.id, handleClick: handleTabItemClick, buttonRef: tab.id === activeTabId ? activeButtonRef : undefined, children: tab.name }, tab.id))) }), _jsx("div", { className: "zen-mini-tabs__content", children: tabs.map((props) => (_createElement(MiniTabsItem, Object.assign({}, props, { key: props.id, activeId: activeTabId })))) })] }) : null });
-};

package/esm/miniTabs/miniTabsHeaderItem.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-export interface IMiniTabsHeaderItem extends IZenComponentProps {
-    id: string;
-    isActive: boolean;
-    handleClick: (e: React.MouseEvent<HTMLElement>) => void;
-    children: string;
-    buttonRef?: React.RefObject<HTMLButtonElement>;
-}
-export declare const MiniTabsHeaderItem: React.FC<IMiniTabsHeaderItem>;

package/esm/miniTabs/miniTabsHeaderItem.js

@@ -1,3 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "../commonHelpers/classNames/classNames";
-export const MiniTabsHeaderItem = ({ id, isActive, handleClick, children, buttonRef }) => (_jsx("button", { id: id, className: classNames(["zen-mini-tabs__header-item", isActive ? "zen-mini-tabs__header-item--active" : "", "zen-ellipsis", "label-01"]), role: "tab", type: "button", "aria-controls": `panel-${id}`, "aria-selected": isActive ? "true" : "false", title: children, tabIndex: isActive ? 0 : -1, ref: buttonRef, onClick: handleClick, children: children }));

package/esm/miniTabs/miniTabsHelper.d.ts

@@ -1,5 +0,0 @@
-import React, { ReactElement } from "react";
-import { IMiniTabsItem, MiniTabsItem } from "./miniTabsItem";
-export declare const getChildren: (elem: ReactElement<typeof MiniTabsItem> | ReactElement<typeof MiniTabsItem>[] | undefined) => React.ReactElement<React.FC<IMiniTabsItem>, string | React.JSXElementConstructor<any>>[] | undefined;
-export declare const convertChild: (child: React.ReactElement) => any;
-export declare const getChildrenForRender: (children: React.ReactElement<typeof MiniTabsItem> | React.ReactElement<typeof MiniTabsItem>[]) => IMiniTabsItem[];

package/esm/miniTabs/miniTabsHelper.js

@@ -1,28 +0,0 @@
-import React from "react";
-import { MiniTabsItem } from "./miniTabsItem";
-export const getChildren = (elem) => {
-    if (!elem) {
-        return undefined;
-    }
-    if (Array.isArray(elem)) {
-        return elem;
-    }
-    return [elem];
-};
-export const convertChild = (child) => {
-    if (child.type === MiniTabsItem) {
-        return Object.assign({}, child.props);
-    }
-    if (child.type === React.Fragment && child.props.children) {
-        if (Array.isArray(child.props.children)) {
-            return [...child.props.children].filter(el => (el.type === MiniTabsItem)).map(el => el.props);
-        }
-        return child.props.children.type === MiniTabsItem ? Object.assign({}, child.props.children.props) : undefined;
-    }
-    return undefined;
-};
-export const getChildrenForRender = (children) => {
-    var _a;
-    const childElements = (_a = getChildren(children)) === null || _a === void 0 ? void 0 : _a.map(convertChild).filter(el => el).reduce((acc, curr) => acc.concat(curr), []);
-    return childElements || [];
-};

package/esm/miniTabs/miniTabsItem.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-export interface IMiniTabsItem extends IZenComponentProps {
-    id: string;
-    name: string;
-    activeId?: string;
-}
-export declare const MiniTabsItem: React.FC<IMiniTabsItem>;

package/esm/miniTabs/miniTabsItem.js

@@ -1,3 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "../commonHelpers/classNames/classNames";
-export const MiniTabsItem = ({ id, children, activeId }) => _jsx("div", { className: "zen-mini-tabs__content", children: _jsx("div", { className: classNames(["zen-mini-tabs__content-wrapper", activeId !== id ? "zen-mini-tabs__content-wrapper--hidden" : ""]), role: "tabpanel", "aria-labelledby": id, tabIndex: 0, id: `panel-${id}`, hidden: activeId && activeId !== id ? true : false, children: children }) });

package/esm/mobileSheet/components/mobileSheetContent.d.ts

@@ -1,5 +0,0 @@
-import { FC } from "react";
-import { IZenComponentProps } from "../../commonHelpers/zenComponent";
-export interface IMobileSheetContent extends IZenComponentProps {
-}
-export declare const MobileSheetContent: FC<IMobileSheetContent>;

package/esm/mobileSheet/components/mobileSheetContent.js

@@ -1,3 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "../../commonHelpers/classNames/classNames";
-export const MobileSheetContent = ({ className = "", children }) => _jsx("div", { className: classNames(["zen-mobile-sheet-content", className]), children: children });

package/esm/mobileSheet/components/mobileSheetFooter.d.ts

@@ -1,6 +0,0 @@
-import { FC } from "react";
-import { IZenComponentProps } from "../../commonHelpers/zenComponent";
-import "./mobileSheetFooter.less";
-export interface IMobileSheetFooter extends IZenComponentProps {
-}
-export declare const MobileSheetFooter: FC<IMobileSheetFooter>;

package/esm/mobileSheet/components/mobileSheetFooter.js

@@ -1,3 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "../../commonHelpers/classNames/classNames";
-export const MobileSheetFooter = ({ className = "", children }) => _jsx("div", { className: classNames(["zen-mobile-sheet-footer", className]), children: children });