@geotab/zenith 2.0.0-beta.2 → 3.0.0-beta.0

package/dist/textareaRaw/textareaRaw.js

@@ -1,34 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextareaRaw = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const React = __importStar(require("react"));
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useDriveClassName_1 = require("../utils/theme/useDriveClassName");
-exports.TextareaRaw = React.forwardRef(({ id, rows = 6, maxLength, className = "", value, resize = true, readonly = false, placeholder, disabled, isError, ariaLabel, ariaLabelledby, onChange, onKeyDown, onFocus, onBlur }, ref) => {
+const TextareaRaw = ({ id, rows = 6, maxLength, className = "", value, resize = true, readonly = false, placeholder, disabled, isError, ariaLabel, ariaLabelledby, onChange, onKeyDown, onFocus, onBlur, ref }) => {
     const driveComponentClass = (0, useDriveClassName_1.useDriveClassName)("zen-text-input");
     return (0, jsx_runtime_1.jsx)("textarea", { ref: ref, id: id, rows: rows, maxLength: maxLength, className: (0, classNames_1.classNames)([
             "zen-textarea",
@@ -38,5 +14,6 @@ exports.TextareaRaw = React.forwardRef(({ id, rows = 6, maxLength, className = "
             isError ? "zen-text-input--error" : "",
             className
         ]), value: maxLength ? value.substring(0, maxLength) : value, placeholder: placeholder, disabled: disabled, onChange: onChange, onKeyDown: onKeyDown, onFocus: onFocus, readOnly: readonly, onBlur: onBlur, "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel });
-});
+};
+exports.TextareaRaw = TextareaRaw;
 exports.TextareaRaw.displayName = "TextAreaInput";

package/dist/timePicker/timePicker.d.ts

@@ -6,11 +6,6 @@ export interface ITimePicker extends IZenComponentProps {
     value?: Date;
     fullWidth?: boolean;
     onChange: (date: Date) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (key: string) => string;
     isMobileView?: boolean;
     dataTimeId?: string;
     error?: string;

package/dist/toast/hooks/useToast.js

@@ -27,16 +27,21 @@ const useToast = () => {
         return {
             id: generatedId,
             hideToast: () => {
-                targetEvent.current.dispatchEvent(new CustomEvent("hideToast", { detail: { id: generatedId } }));
+                targetEvent.current && targetEvent.current.dispatchEvent(new CustomEvent("hideToast", { detail: { id: generatedId } }));
             }
         };
     }, [setToasts, targetEvent]);
     (0, useWarning_1.useWarning)({ mode, name: "toasts" });
     (0, react_2.useEffect)(() => {
         const callback = (event) => (0, hideToastCallback_1.hideToastCallback)(event, hideToast);
-        targetEvent.current.addEventListener("hideToast", callback);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-        return () => targetEvent.current.removeEventListener("hideToast", callback);
+        if (!targetEvent.current) {
+            return undefined;
+        }
+        const currentTarget = targetEvent.current;
+        currentTarget.addEventListener("hideToast", callback);
+        return () => {
+            currentTarget.removeEventListener("hideToast", callback);
+        };
     }, [hideToast, isAPIMode, targetEvent]);
     const shownToasts = (0, react_2.useMemo)(() => toasts.map((item) => (0, react_1.createElement)(toast_1.Toast, Object.assign({}, item, { onClose: () => hideToast(item.id), key: item.id, isOpen: true }))), [toasts, hideToast]);
     return {

package/dist/toast/hooks/useToastState.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
+import { RefObject } from "react";
 import { IToastItem } from "../../feedbackContainer/types";
 export interface IUseToast {
     toasts: IToastItem[];
     setToasts: React.Dispatch<React.SetStateAction<IToastItem[]>>;
-    targetEvent: React.MutableRefObject<EventTarget>;
+    targetEvent: RefObject<EventTarget | null>;
 }
 export declare const useToastState: () => IUseToast;

package/dist/toastRaw/toastRaw.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 import "./toastRaw.less";
 import { IZenComponentProps } from "./../commonHelpers/zenComponent";
+import { ReactNode, RefObject } from "react";
 import { TAnimationType } from "../feedbackContainer/types";
 import { IIcon } from "../icons/icon";
 import { TButtonIconPosition } from "../textIconButton/textIconButton";
@@ -17,11 +17,12 @@ export interface IToastRaw extends IZenComponentProps {
     id: string;
     onClose: () => void;
     isOpen: boolean;
-    header: string | JSX.Element;
+    header: ReactNode;
     showSeconds?: number;
     hasIcon?: boolean;
     type?: TToastType;
     animation?: TAnimationType;
     action?: IAction;
+    ref?: RefObject<HTMLDivElement | null>;
 }
-export declare const ToastRaw: import("react").ForwardRefExoticComponent<IToastRaw & import("react").RefAttributes<HTMLDivElement>>;
+export declare const ToastRaw: ({ isOpen, onClose, animation, type, hasIcon, header, id, action, showSeconds, ref }: IToastRaw) => import("react/jsx-runtime").JSX.Element;

package/dist/toastRaw/toastRaw.js

@@ -20,9 +20,7 @@ const typedIcons = {
     info: iconInfoCircle_1.IconInfoCircle
 };
 const getIcon = (t) => typedIcons[t];
-exports.ToastRaw = (0, react_1.forwardRef)(
-// eslint-disable-next-line @typescript-eslint/naming-convention
-function ToastRawInner({ isOpen, onClose, animation, type, hasIcon = true, header, id, action, showSeconds = useProgress_1.MIN_SECONDS_TO_SHOW }, ref) {
+const ToastRaw = ({ isOpen, onClose, animation, type, hasIcon = true, header, id, action, showSeconds = useProgress_1.MIN_SECONDS_TO_SHOW, ref }) => {
     const isDrive = (0, useDrive_1.useDrive)();
     const isMobile = (0, useMobile_1.useMobile)();
     const { dark } = (0, react_1.useContext)(themeContext_1.themeContext);
@@ -49,4 +47,5 @@ function ToastRawInner({ isOpen, onClose, animation, type, hasIcon = true, heade
                                     size: isDrive ? "huge" : "large",
                                     className: `zen-toast__icon--${type || "info"}`
                                 }), (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-toast__header", `zen-toast__header--${type || "info"}`]), children: header })] }), (0, jsx_runtime_1.jsxs)("div", { className: contentEndClasses, children: [actionButton, (0, jsx_runtime_1.jsx)("button", { type: "button", className: (0, classNames_1.classNames)(["zen-toast__close-button", `zen-toast__close-button--${type || "info"}`]), onClick: onClose, title: translate("Close"), "aria-label": translate("Close"), children: (0, jsx_runtime_1.jsx)(iconClose_1.IconClose, { size: isDrive ? "huge" : "large" }) })] })] })] }) });
-});
+};
+exports.ToastRaw = ToastRaw;

package/dist/toggleButton/toggleButton.d.ts

@@ -7,6 +7,6 @@ export interface IToggleButton extends IZenComponentProps {
     disabled?: boolean;
     title?: string;
     isReverted?: boolean;
-    onChange?: (newState: React.ChangeEvent<HTMLInputElement>) => void;
+    onChange?: (checked: boolean) => void;
 }
 export declare const ToggleButton: React.FC<IToggleButton>;

package/dist/toggleButton/toggleButton.js

@@ -11,6 +11,7 @@ const ToggleButton = ({ id, checked, disabled, className, title, children, onCha
     const driveClassesComponent = (0, useDriveClassName_1.useDriveClassName)("zen-toggler-component");
     const generatedId = (0, react_1.useId)();
     const checkBoxId = id || generatedId;
-    return (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-toggler", driveClassesToggler || "", className || ""]), children: [(0, jsx_runtime_1.jsx)(triStateCheckbox_1.TriStateCheckbox, { className: "zen-toggler__input", id: checkBoxId, onChange: onChange, checked: checked, disabled: disabled }), (0, jsx_runtime_1.jsxs)("label", { className: (0, classNames_1.classNames)(["zen-toggler__label", isReverted ? "zen-toggler__label--reverted" : ""]), htmlFor: checkBoxId, title: title, "aria-label": title, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-toggler-component", driveClassesComponent || ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-toggler-component__focus" }), (0, jsx_runtime_1.jsx)("div", { className: "zen-toggler-component__runner" })] }), children ? (0, jsx_runtime_1.jsx)("div", { className: "zen-toggler__label-text", children: children }) : null] })] });
+    const onChangeHandler = (0, react_1.useCallback)((e) => onChange && onChange(e.target.checked), [onChange]);
+    return (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-toggler", driveClassesToggler || "", className || ""]), children: [(0, jsx_runtime_1.jsx)(triStateCheckbox_1.TriStateCheckbox, { className: "zen-toggler__input", id: checkBoxId, onChange: onChangeHandler, checked: checked, disabled: disabled }), (0, jsx_runtime_1.jsxs)("label", { className: (0, classNames_1.classNames)(["zen-toggler__label", isReverted ? "zen-toggler__label--reverted" : ""]), htmlFor: checkBoxId, title: title, "aria-label": title, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-toggler-component", driveClassesComponent || ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-toggler-component__focus" }), (0, jsx_runtime_1.jsx)("div", { className: "zen-toggler-component__runner" })] }), children ? (0, jsx_runtime_1.jsx)("div", { className: "zen-toggler__label-text", children: children }) : null] })] });
 };
 exports.ToggleButton = ToggleButton;

package/dist/toolbar/toolbarContent.d.ts

@@ -1,7 +1,8 @@
-/// <reference types="react" />
+import { RefObject } from "react";
 import "./toolbar.less";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 export interface IToolbarContent extends IZenComponentProps {
     blockName: string;
+    ref?: RefObject<HTMLDivElement | null>;
 }
-export declare const ToolbarContent: import("react").ForwardRefExoticComponent<IToolbarContent & import("react").RefAttributes<HTMLDivElement>>;
+export declare const ToolbarContent: ({ blockName, children, ref }: IToolbarContent) => import("react/jsx-runtime").JSX.Element;

package/dist/toolbar/toolbarContent.js

@@ -6,15 +6,17 @@ const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const toolbarMoreButton_1 = require("./toolbarMoreButton");
 const importantElement_1 = require("./importantElement");
-exports.ToolbarContent = (0, react_1.forwardRef)(function toolbarContent({ blockName, children }, ref) {
+const isImportantElement = (child) => child.type === importantElement_1.ImportantElement;
+const isToolbarMoreButton = (child) => child.type === toolbarMoreButton_1.ToolbarMoreButton;
+const ToolbarContent = ({ blockName, children, ref }) => {
     const getChildElements = () => {
         const elts = children ? react_1.Children.map(children, (child, ind) => {
             const extraClass = [];
-            if (child.type === importantElement_1.ImportantElement) {
+            if (isImportantElement(child)) {
                 extraClass.push("zen-toolbar__item-priority");
-                extraClass.push(`zen-toolbar__item-priority--${child.props.priority}`);
+                extraClass.push(`zen-toolbar__item-priority--${child.props.priority || ""}`);
             }
-            if (child.type === toolbarMoreButton_1.ToolbarMoreButton) {
+            if (isToolbarMoreButton(child)) {
                 return (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-toolbar__item", "zen-toolbar__item--more", child.props.children ? "" : "zen-toolbar__item--empty"]), ref: ref, children: (0, jsx_runtime_1.jsx)(toolbarMoreButton_1.ToolbarMoreButton, { children: child.props.children }) });
             }
             return (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-toolbar__item", ...extraClass]), children: child }, `${blockName}-${ind}`);
@@ -22,4 +24,5 @@ exports.ToolbarContent = (0, react_1.forwardRef)(function toolbarContent({ block
         return elts;
     };
     return (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-toolbar__content-block", `zen-toolbar__${blockName}-block`]), "data-name": blockName, children: getChildElements() });
-});
+};
+exports.ToolbarContent = ToolbarContent;

package/dist/tooltip/helpers/calculateArrowPosition.d.ts

@@ -1,2 +1,3 @@
+import { RefObject } from "react";
 import { TAlignment } from "../../absolute/absolute";
-export declare const calculateArrowPosition: (triggerRef: React.RefObject<HTMLElement>, tooltipRef: React.RefObject<HTMLElement>, arrowRef: React.RefObject<HTMLElement>, alignment: TAlignment) => void;
+export declare const calculateArrowPosition: (triggerRef: RefObject<HTMLElement | null>, tooltipRef: RefObject<HTMLElement | null>, arrowRef: RefObject<HTMLElement | null>, alignment: TAlignment) => void;

package/dist/tooltip/tooltip.d.ts

@@ -1,21 +1,16 @@
-import { FC, ReactElement } from "react";
+import { FC, PropsWithChildren, ReactElement } from "react";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import { TAlignment } from "../absolute/absolute";
 import "./tooltip.less";
 export type TooltipSize = "large" | "small" | "auto";
 export type TMobileView = "default" | "mobileSheet";
 interface ITooltip extends IZenComponentProps {
-    trigger: ReactElement;
+    trigger: ReactElement<PropsWithChildren>;
     size?: TooltipSize;
     alignment?: TAlignment;
     padding?: number;
     mobileView?: TMobileView;
     mobileSheetTitle?: ReactElement | string;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
 }
 export declare const Tooltip: FC<ITooltip>;
 export {};

package/dist/tooltip/tooltip.js

@@ -53,7 +53,7 @@ const arrowClasses = {
     "left-bottom": "zen-tooltip__arrow--left"
 };
 const Tooltip = ({ trigger, className = "", size = "small", alignment = "bottom", padding = 0, children, mobileView = "default", mobileSheetTitle }) => {
-    const triggerRefNative = trigger.ref;
+    const triggerRefNative = trigger.props.ref;
     const triggerLocalRef = (0, react_1.useRef)(null);
     const triggerRef = triggerRefNative || triggerLocalRef;
     const timerRef = (0, react_1.useRef)(null);
@@ -86,8 +86,10 @@ const Tooltip = ({ trigger, className = "", size = "small", alignment = "bottom"
                 onBlur: () => setTooltipVisible(false),
                 onKeyDown: onKeyDownHandler,
                 onClick: (...args) => {
-                    var _a, _b;
-                    (_b = (_a = trigger.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, ...args);
+                    const triggerProps = trigger.props;
+                    if (triggerProps.onClick) {
+                        triggerProps.onClick(...args);
+                    }
                     if (isTooltipVisible) {
                         setTooltipVisible(false);
                     }
@@ -101,10 +103,10 @@ const Tooltip = ({ trigger, className = "", size = "small", alignment = "bottom"
         }
         return {
             onClick: (e) => {
-                var _a, _b;
                 e.stopPropagation();
-                if (trigger.props.onClick) {
-                    (_b = (_a = trigger.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+                const triggerProps = trigger.props;
+                if (triggerProps.onClick) {
+                    triggerProps.onClick(e);
                 }
                 else {
                     setTooltipVisible(isVisible => !isVisible);
@@ -117,7 +119,10 @@ const Tooltip = ({ trigger, className = "", size = "small", alignment = "bottom"
     const triggerCloneProps = isTooltipVisible ? {
         "aria-describedby": tooltipId
     } : {};
-    const triggerClone = react_1.default.cloneElement(trigger, Object.assign(Object.assign({ ref: triggerRef }, triggerCloneProps), triggerEvents));
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+    const triggerClone = react_1.default.cloneElement(trigger, Object.assign(Object.assign({ ref: triggerRef }, triggerCloneProps), triggerEvents
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    ));
     const arrowClass = (0, react_1.useMemo)(() => arrowClasses[alignment] || arrowClasses.bottom, [alignment]);
     const renderTooltip = () => {
         if (mobileView === "mobileSheet" && deviceType === deviceType_1.DeviceType.Mobile) {

package/dist/utils/positioningUtils/calculatePosition.d.ts

@@ -1,4 +1,5 @@
 import { TAlignment } from "../../absolute/absolute";
 import { IAlignment } from "./alignments";
 import "./calculatePosition.less";
-export declare const calculatePosition: (triggerRef: React.RefObject<HTMLElement>, popupRef: React.RefObject<HTMLElement>, paddingX?: number, paddingY?: number, inline?: boolean, alignment?: TAlignment, alignmentsFn?: IAlignment, scrollParent?: HTMLElement) => void;
+import { RefObject } from "react";
+export declare const calculatePosition: (triggerRef: RefObject<HTMLElement | null>, popupRef: RefObject<HTMLElement | null>, paddingX?: number, paddingY?: number, inline?: boolean, alignment?: TAlignment, alignmentsFn?: IAlignment, scrollParent?: HTMLElement) => void;

package/dist/utils/positioningUtils/calculatePosition.js

@@ -14,6 +14,8 @@ const calculatePosition = (triggerRef, popupRef, paddingX, paddingY, inline, ali
     }
     const triggerElement = triggerRef.current;
     const popup = popupRef.current;
+    const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
+    const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
     const triggerRect = triggerElement.getBoundingClientRect();
     let popupRect = popup.getBoundingClientRect();
     const relativeParent = inline ? ((0, getRelativeParent_1.getRelativeParent)(triggerElement) || document.body) : document.body;
@@ -22,10 +24,16 @@ const calculatePosition = (triggerRef, popupRef, paddingX, paddingY, inline, ali
     popup.classList.remove("zen-calculate-position");
     const parentBorders = (0, getBorders_1.getBorders)(relativeParent);
     const parentMargins = (0, getMargins_1.getMargins)(relativeParent);
+    let parentTop = parentDomRect.top + parentBorders.top - parentMargins.top;
+    let parentLeft = parentDomRect.left + parentBorders.left - parentMargins.left;
+    if (!inline && relativeParent === document.body) {
+        parentTop = -scrollTop + parentBorders.top - parentMargins.top;
+        parentLeft = -scrollLeft + parentBorders.left - parentMargins.left;
+    }
     const parentRect = {
-        top: parentDomRect.top + parentBorders.top - parentMargins.top,
+        top: parentTop,
         bottom: parentDomRect.bottom - parentBorders.bottom - parentMargins.bottom,
-        left: parentDomRect.left + parentBorders.left - parentMargins.left,
+        left: parentLeft,
         right: parentDomRect.right - parentBorders.right + parentMargins.right,
         height: window.innerHeight - parentDomRect.y,
         width: window.innerWidth - parentDomRect.x
@@ -44,17 +52,21 @@ const calculatePosition = (triggerRef, popupRef, paddingX, paddingY, inline, ali
     position = alignmentFn(triggerRect, popupRect, parentRect, paddingX || 0, paddingY || 0);
     (0, normalizePosition_1.normalizePosition)(position, popupRect, parentRect);
     const scrollParentRect = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.getBoundingClientRect();
+    const isTopsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("top");
+    const isRightsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("right");
+    const isLeftsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("left");
     if (scrollParentRect && scrollParentRect.top > 0 && triggerRect.top < scrollParentRect.top) {
         position.top = scrollParentRect.top;
     }
     else if (triggerRect.top + triggerRect.height < 0 && triggerRect.top > ((scrollParentRect === null || scrollParentRect === void 0 ? void 0 : scrollParentRect.top) || 0)) {
-        position.top = window.scrollY;
+        position.top = scrollTop;
     }
-    const isTopsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("top");
-    const isRightsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("right");
-    const isLeftsideAlignment = alignment === null || alignment === void 0 ? void 0 : alignment.startsWith("left");
-    if (scrollParentRect && triggerRect.bottom > scrollParentRect.bottom) {
-        position.top = (scrollParentRect.bottom + popupRect.height) <= (window.innerHeight + window.scrollY) ? scrollParentRect.bottom : (window.innerHeight + window.scrollY) - popupRect.height;
+    else if (isTopsideAlignment && (triggerRect.top - popupRect.height) < 0) {
+        position.top = scrollTop;
+    }
+    const relativeParentHeight = relativeParent.getBoundingClientRect().height;
+    if ((position.top ? position.top > relativeParentHeight && scrollTop === 0 : true) && scrollParentRect && triggerRect.bottom > scrollParentRect.bottom) {
+        position.top = Math.min(scrollParentRect.bottom, window.innerHeight - popupRect.height);
     }
     else if ((isRightsideAlignment || isLeftsideAlignment) && position.top !== undefined) {
         const popupBottom = position.top + parentRect.top + popupRect.height;
@@ -67,7 +79,7 @@ const calculatePosition = (triggerRef, popupRef, paddingX, paddingY, inline, ali
         }
     }
     else if (!isTopsideAlignment && triggerRect.y + triggerRect.height + popupRect.height > window.innerHeight) {
-        const newTopPosition = window.innerHeight + window.scrollY - popupRect.height;
+        const newTopPosition = window.innerHeight + scrollTop - popupRect.height;
         position.top = newTopPosition < 0 ? 0 : newTopPosition;
     }
     Object.keys(position).forEach((prop) => {

package/dist/utils/useNodeText.d.ts

@@ -1 +1,2 @@
-export declare const useNodeText: (ref: React.RefObject<HTMLElement>) => string;
+import { RefObject } from "react";
+export declare const useNodeText: (ref: RefObject<HTMLElement | null>) => string;

package/esm/absolute/absolute.d.ts

@@ -1,11 +1,11 @@
-import React from "react";
+import React, { RefObject } from "react";
 import "./absolute.less";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import { IAlignment } from "../utils/positioningUtils/alignments";
 export type TAlignment = "top" | "top-left" | "top-right" | "left" | "left-top" | "left-bottom" | "right" | "right-top" | "right-bottom" | "bottom" | "bottom-left" | "bottom-right";
 export type TTrapFocus = "on" | "off" | "withTrigger";
 export interface IAbsolute extends IZenComponentProps {
-    triggerRef: React.RefObject<HTMLElement>;
+    triggerRef: RefObject<HTMLElement | null>;
     alignment?: TAlignment;
     stateFullChilds?: boolean;
     id: string;

package/esm/accordion/accordionItem/accordionItem.d.ts

@@ -1,8 +1,8 @@
-import React from "react";
+import React, { ReactNode } from "react";
 export interface IAccordionItem {
     id: string;
     title: string;
-    content: JSX.Element;
+    content: ReactNode;
     isActive: boolean;
     onClick: React.MouseEventHandler<HTMLButtonElement>;
     className?: string;

package/esm/accordion/accordionItem/accordionItem.js

@@ -4,5 +4,13 @@ import { classNames } from "../../commonHelpers/classNames/classNames";
 import { IconChevronBottom } from "../../icons/iconChevronBottom";
 export const AccordionItem = ({ title, content, isActive, onClick, id }) => {
     const ariaControlsId = useId();
-    return (_jsxs(_Fragment, { children: [_jsx("h3", { className: "zen-accordion__header", children: _jsxs("button", { type: "button", "aria-expanded": isActive, "aria-controls": ariaControlsId, className: "zen-accordion__header-button", id: id, onClick: onClick, children: [title, _jsx(IconChevronBottom, { size: "large", className: classNames(["zen-accordion__header-arrow", isActive ? "zen-accordion__header-arrow--rotated" : ""]) })] }) }), _jsx("div", { id: ariaControlsId, "aria-labelledby": id, role: "region", className: classNames(["zen-accordion__content", isActive ? "" : "zen-accordion__content--hidden"]), children: content })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("h3", { className: "zen-accordion__header", children: _jsxs("button", { type: "button", "aria-expanded": isActive, "aria-controls": ariaControlsId, className: "zen-accordion__header-button", id: id, onClick: onClick, children: [title, _jsx(IconChevronBottom, { size: "large", className: classNames([
+                                "zen-accordion__header-arrow",
+                                isActive
+                                    ? "zen-accordion__header-arrow--rotated"
+                                    : ""
+                            ]) })] }) }), _jsx("div", { id: ariaControlsId, "aria-labelledby": id, role: "region", className: classNames([
+                    "zen-accordion__content",
+                    isActive ? "" : "zen-accordion__content--hidden"
+                ]), children: content })] }));
 };

package/esm/advancedGroupsFilter/advancedGroupsFilter.d.ts

@@ -8,11 +8,6 @@ export interface IAdvancedGroupsFilter extends IZenComponentProps {
     onClose: () => void;
     onApply: (state: IFilterState) => void;
     state?: IFilterState;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     getData: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;
     errorHandler: (e: Error) => void;
     dataItems?: IDropdownItem[];

package/esm/advancedGroupsFilter/advancedGroupsFilterForm.d.ts

@@ -6,11 +6,6 @@ export interface IAdvancedGroupsFilterForm {
     state: ICurrentAdvancedState[];
     dataItems: IDropdownItem[];
     onStateChange: (value: ICurrentAdvancedState[]) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     getData: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;
     errorHandler: (e: Error) => void;
     tooltipText?: string;

package/esm/advancedGroupsFilter/advancedGroupsFilterFormSection.d.ts

@@ -11,11 +11,6 @@ export interface IAdvancedGroupsFilterFormSection extends IZenComponentProps {
     onRelationChange: (itemId: number) => void;
     onRemoveCondition: (e: any) => void;
     onStateChange: (ind: number, value: string[]) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     getData: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;
     errorHandler: (e: Error) => void;
     isHasRemoveConditionButton: boolean;

package/esm/advancedGroupsFilter/advancedGroupsFilterSectionTooltip.d.ts

@@ -6,11 +6,6 @@ interface IAdvancedGroupsFilterSectionTooltip {
     className?: string;
     size?: TooltipSize;
     alignment?: TAlignment;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (key: string) => string;
     text?: string;
     ariaLabel: string;
 }

package/esm/advancedGroupsFilter/advancedGroupsFilterSectionTooltip.js

@@ -8,8 +8,7 @@ export const AdvancedGroupsFilterSectionTooltip = ({ ariaLabel, className = "",
     const { translate } = useLanguage();
     const triggerRef = useRef(null);
     const defaultTooltipText = "Use multiple operators when searching for a specific group. For example, filtering for assets that belong to the Tractor group and the Toronto group displays a list of tractors that belong to the Toronto branch.";
-    const getTrigger = (currentRef, ariaLbl) => (_jsx("button", { type: "button", "aria-label": ariaLbl, className: "zen-advanced-groups-filter-section-tooltip__trigger", ref: currentRef, children: _jsx(IconInfoCircle, { className: "zen-advanced-groups-filter-section-tooltip__trigger-icon", size: "large" }) }));
-    return (_jsx(Tooltip, { className: classNames(["zen-advanced-groups-filter-section-tooltip__item", className || ""]), size: size, alignment: alignment, trigger: getTrigger(triggerRef, translate(ariaLabel)), children: text || translate(defaultTooltipText) }));
+    return (_jsx(Tooltip, { className: classNames(["zen-advanced-groups-filter-section-tooltip__item", className || ""]), size: size, alignment: alignment, trigger: _jsx("button", { type: "button", "aria-label": translate(ariaLabel), className: "zen-advanced-groups-filter-section-tooltip__trigger", ref: triggerRef, children: _jsx(IconInfoCircle, { className: "zen-advanced-groups-filter-section-tooltip__trigger-icon", size: "large" }) }), children: text || translate(defaultTooltipText) }));
 };
 export const TRANSLATIONS = [
     "Use multiple operators when searching for a specific group. For example, filtering for assets that belong to the Tractor group and the Toronto group displays a list of tractors that belong to the Toronto branch."

package/esm/alert/hooks/useAlertState.d.ts

@@ -3,6 +3,6 @@ import { IAlertItem } from "../../feedbackContainer/types";
 export interface IUseAlertState {
     alerts: IAlertItem[];
     setAlerts: React.Dispatch<React.SetStateAction<IAlertItem[]>>;
-    targetEvent: React.MutableRefObject<EventTarget>;
+    targetEvent: React.RefObject<EventTarget>;
 }
 export declare const useAlertState: () => IUseAlertState;

package/esm/alertRaw/alertRaw.d.ts

@@ -1,3 +1,4 @@
+import { ReactElement, RefObject } from "react";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import "./alertRaw.less";
 import { TAnimationType } from "../feedbackContainer/types";
@@ -19,14 +20,15 @@ interface IFooterButtons {
 }
 export interface IAlertRaw extends IZenComponentProps {
     id: string;
-    text: string | JSX.Element;
+    text: string | ReactElement;
     onClose: () => void;
     isOpen: boolean;
     header?: string;
     type?: TAlertType;
     animation?: TAnimationType;
     buttons: IFooterButtons;
+    ref?: RefObject<HTMLDivElement>;
 }
-export declare const AlertRaw: React.ForwardRefExoticComponent<IAlertRaw & React.RefAttributes<HTMLDivElement>>;
+export declare const AlertRaw: ({ id, type, header, text, buttons, className, onClose, animation, isOpen, ref }: IAlertRaw) => import("react/jsx-runtime").JSX.Element;
 export declare const TRANSLATIONS: string[];
 export {};

package/esm/alertRaw/alertRaw.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createElement, forwardRef, useCallback, useContext, useMemo } from "react";
+import { createElement, useCallback, useContext, useMemo } from "react";
 import AlertAnimation from "./components/alertAnimation";
 import { classNames } from "../commonHelpers/classNames/classNames";
 import { ButtonType } from "../button/buttonType";
@@ -21,9 +21,7 @@ const typedIcons = {
     info: IconInfoCircle
 };
 const getIcon = (t) => typedIcons[t];
-export const AlertRaw = 
-// eslint-disable-next-line @typescript-eslint/naming-convention, complexity
-forwardRef(function InnerAlertRaw({ id, type, header, text, buttons, className, onClose, animation, isOpen }, ref) {
+export const AlertRaw = ({ id, type, header, text, buttons, className, onClose, animation, isOpen, ref }) => {
     const { translate } = useLanguage();
     const isDrive = useDrive();
     const isMobile = useMobile();
@@ -66,7 +64,7 @@ forwardRef(function InnerAlertRaw({ id, type, header, text, buttons, className,
                                             size: isDrive ? "huge" : "large",
                                             className: `zen-alert__icon--${type || "info"}`
                                         }) }), _jsxs("div", { className: "zen-alert__body", children: [header && _jsx("div", { className: `zen-alert__title zen-alert__title--${type || "info"}`, children: header }), _jsx("div", { className: "zen-alert__text", children: text })] }), _jsx("div", { className: "zen-alert__actions", children: _jsx("button", { type: "button", className: classNames(["zen-alert__close-button", `zen-alert__close-button--${type || "info"}`]), onClick: onClose, title: translate("Close"), "aria-label": translate("Close"), children: _jsx(IconClose, { size: isDrive ? "huge" : "large" }) }) })] }) }) }), _jsxs("div", { className: "zen-alert__body-actions", children: [tertiaryButton, primaryButton] })] }) }) });
-});
+};
 export const TRANSLATIONS = [
     "Close"
 ];

package/esm/banner/banner.d.ts

@@ -18,21 +18,6 @@ export interface IBanner {
     action?: IBannerAction;
     onClose?: (e: any) => void;
     size?: TBannerSize;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
-    /**
-    * @deprecated
-    * @param center - will be removed in the next major release
-    */
-    center?: boolean;
-    /**
-    * @deprecated
-    * @param close - will be removed in the next major release
-    */
-    close?: boolean;
     role?: string;
     ariaAtomic?: "true" | "false";
     ariaLive?: "off" | "assertive" | "polite";

package/esm/banner/bannerUtils.d.ts

@@ -1,4 +1,3 @@
-import { TIconId } from "../static/icons/icons";
 export type TBannerSize = "XXL" | "XL" | "L" | "M" | "S" | "XS";
 export declare const DEFAULT_BANNER_SIZE: TBannerSize;
 export declare const DEFAULT_BANNER_UPSELL_SIZE: TBannerSize;
@@ -21,5 +20,4 @@ export declare const options: {
 };
 export declare const getBannerOptions: (type: string) => {
     blockClassName: string;
-    iconId: TIconId;
 };

package/esm/banner/bannerUtils.js

@@ -17,4 +17,5 @@ export const options = {
         blockClassName: "zen-banner--upsell"
     }
 };
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
 export const getBannerOptions = (type) => options[type] || options.warning;

package/esm/betaPill/betaPill.d.ts

@@ -9,11 +9,6 @@ export interface IBetaPillActions {
 }
 export interface IBetaPill {
     className?: string;
-    /**
-     * @deprecated
-     * @param translate - will be removed in the next major release
-     */
-    translate?: (s: string) => string;
     feedbackAction?: IBetaPillActions;
     betaOptionAction?: IBetaPillActions;
 }

package/esm/bulkEditControl/bulkEditControl.d.ts

@@ -11,11 +11,6 @@ export interface IBulkEditControl extends IZenComponentProps {
     value?: BulkEditItemType;
     disabled?: boolean;
     onChange: (optionId: string | undefined) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
 }
 /**
  * @deprecated - will be removed in future releases

package/esm/button/button.d.ts

@@ -2,6 +2,7 @@ import * as React from "react";
 import { TButton, THTMLButtonType } from "./buttonType";
 import "./button.less";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
+import { RefObject } from "react";
 export interface IButton extends IZenComponentProps {
     id?: string;
     title?: string;
@@ -18,5 +19,9 @@ export interface IButton extends IZenComponentProps {
     htmlType?: THTMLButtonType;
     target?: React.HTMLAttributeAnchorTarget;
     rel?: string;
+    ref?: RefObject<HTMLButtonElement | null>;
 }
-export declare const Button: React.ForwardRefExoticComponent<IButton & React.RefAttributes<HTMLButtonElement>>;
+export declare const Button: {
+    ({ className, type, disabled, id, title, onClick, onMouseOver, onMouseOut, onMouseDown, onMouseUp, onKeyDown, onKeyUp, children, link, target, htmlType, rel, ref, ...other }: IButton): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};