@geotab/zenith 3.6.0 → 3.6.1

package/dist/header/components/mobileSearchControl/mobileSearchControl.js

@@ -1,141 +0,0 @@
-"use strict";
-
-const {
-  injectString
-} = require("../../../utils/localization/translationsDictionary");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TRANSLATIONS = exports.MobileSearchControl = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-injectString("cs", "Cancel search", "Zru\u0161it hled\xE1n\xED");
-injectString("da-DK", "Cancel search", "Annuller s\xF8gning");
-injectString("de", "Cancel search", "Suche abbrechen");
-injectString("en", "Cancel search", "Cancel search");
-injectString("es", "Cancel search", "Cancelar b\xFAsqueda");
-injectString("fi-FI", "Cancel search", "Peruuta haku");
-injectString("fr", "Cancel search", "Annuler la recherche");
-injectString("fr-FR", "Cancel search", "Annuler la recherche");
-injectString("hu-HU", "Cancel search", "T\xF6r\xF6ld a keres\xE9st.");
-injectString("id", "Cancel search", "Batalkan pencarian");
-injectString("it", "Cancel search", "Annulla ricerca");
-injectString("ja", "Cancel search", "\u691C\u7D22\u3092\u30AD\u30E3\u30F3\u30BB\u30EB");
-injectString("ko-KR", "Cancel search", "\uAC80\uC0C9 \uCDE8\uC18C");
-injectString("ms", "Cancel search", "Batalkan carian");
-injectString("nb-NO", "Cancel search", "Avbryt s\xF8k");
-injectString("nl", "Cancel search", "Zoeken annuleren");
-injectString("pl", "Cancel search", "Anuluj wyszukiwanie");
-injectString("pt-BR", "Cancel search", "Cancelar pesquisa");
-injectString("pt-PT", "Cancel search", "Cancelar pesquisa");
-injectString("sk-SK", "Cancel search", "Zru\u0161 vyh\u013Ead\xE1vanie.");
-injectString("sv", "Cancel search", "Avbryt s\xF6kning");
-injectString("th", "Cancel search", "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01\u0E01\u0E32\u0E23\u0E04\u0E49\u0E19\u0E2B\u0E32");
-injectString("tr", "Cancel search", "Aramay\u0131 iptal et");
-injectString("zh-Hans", "Cancel search", "\u53D6\u6D88\u641C\u7D22");
-injectString("zh-TW", "Cancel search", "\u53D6\u6D88\u641C\u5C0B");
-injectString("ro-RO", "Cancel search", "Anula\u021Bi c\u0103utarea");
-injectString("cs", "Cancel", "Zru\u0161it");
-injectString("da-DK", "Cancel", "Annuller");
-injectString("de", "Cancel", "Abbrechen");
-injectString("en", "Cancel", "Cancel");
-injectString("es", "Cancel", "Cancelar");
-injectString("fi-FI", "Cancel", "Peruuta");
-injectString("fr", "Cancel", "Annuler");
-injectString("fr-FR", "Cancel", "Annuler");
-injectString("hu-HU", "Cancel", "M\xE9gse");
-injectString("id", "Cancel", "Batalkan");
-injectString("it", "Cancel", "Annullare");
-injectString("ja", "Cancel", "\u30AD\u30E3\u30F3\u30BB\u30EB");
-injectString("ko-KR", "Cancel", "\uCDE8\uC18C");
-injectString("ms", "Cancel", "Batal");
-injectString("nb-NO", "Cancel", "Avbryt");
-injectString("nl", "Cancel", "Annuleren");
-injectString("pl", "Cancel", "Anuluj");
-injectString("pt-BR", "Cancel", "Cancelar");
-injectString("pt-PT", "Cancel", "Cancelar");
-injectString("sk-SK", "Cancel", "Zru\u0161.");
-injectString("sv", "Cancel", "Avbryt");
-injectString("th", "Cancel", "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01");
-injectString("tr", "Cancel", "\u0130ptal");
-injectString("zh-Hans", "Cancel", "\u53D6\u6D88");
-injectString("zh-TW", "Cancel", "\u53D6\u6D88");
-injectString("ro-RO", "Cancel", "Anula\u021Bi");
-injectString("cs", "Show page search", "Zobrazit vyhled\xE1v\xE1n\xED str\xE1nek");
-injectString("da-DK", "Show page search", "Vis sides\xF8gning");
-injectString("de", "Show page search", "Seite \u201ESuche\u201C anzeigen");
-injectString("en", "Show page search", "Show page search");
-injectString("es", "Show page search", "Mostrar b\xFAsqueda en la p\xE1gina");
-injectString("fi-FI", "Show page search", "N\xE4yt\xE4 sivun haku");
-injectString("fr", "Show page search", "Afficher la recherche de page");
-injectString("fr-FR", "Show page search", "Afficher le champ de recherche");
-injectString("hu-HU", "Show page search", "Mutasd az oldalon t\xF6rt\xE9n\u0151 keres\xE9st.");
-injectString("id", "Show page search", "Tampilkan pencarian halaman");
-injectString("it", "Show page search", "Mostrare ricerca pagina");
-injectString("ja", "Show page search", "\u30DA\u30FC\u30B8\u691C\u7D22\u3092\u8868\u793A");
-injectString("ko-KR", "Show page search", "\uD398\uC774\uC9C0 \uAC80\uC0C9 \uD45C\uC2DC");
-injectString("ms", "Show page search", "Paparkan carian halaman");
-injectString("nb-NO", "Show page search", "Vis sides\xF8k");
-injectString("nl", "Show page search", "Pagina zoeken weergeven");
-injectString("pl", "Show page search", "Poka\u017C wyszukiwanie stron");
-injectString("pt-BR", "Show page search", "Exibir pesquisa de p\xE1gina");
-injectString("pt-PT", "Show page search", "Mostrar pesquisa de p\xE1gina");
-injectString("sk-SK", "Show page search", "Zobrazi\u0165 vyh\u013Ead\xE1vanie na str\xE1nke");
-injectString("sv", "Show page search", "Visa sids\xF6kning");
-injectString("th", "Show page search", "\u0E41\u0E2A\u0E14\u0E07\u0E01\u0E32\u0E23\u0E04\u0E49\u0E19\u0E2B\u0E32\u0E2B\u0E19\u0E49\u0E32");
-injectString("tr", "Show page search", "Sayfa aramay\u0131 g\xF6ster");
-injectString("zh-Hans", "Show page search", "\u663E\u793A\u9875\u9762\u641C\u7D22");
-injectString("zh-TW", "Show page search", "\u986F\u793A\u9801\u9762\u641C\u5C0B");
-injectString("ro-RO", "Show page search", "Afi\u0219a\u021Bi c\u0103utarea paginilor");
-const button_1 = require("../../../button/button");
-const buttonType_1 = require("../../../button/buttonType");
-const svgIconSize_1 = require("../../../svgIcon/svgIconSize");
-const textIconButton_1 = require("../../../textIconButton/textIconButton");
-const classNames_1 = require("../../../commonHelpers/classNames/classNames");
-const useLanguage_1 = require("../../../utils/localization/useLanguage");
-const iconSearch_1 = require("../../../icons/iconSearch");
-const useDrive_1 = require("../../../utils/theme/useDrive");
-const useDriveClassName_1 = require("../../../utils/theme/useDriveClassName");
-const useMobile_1 = require("../../../commonHelpers/hooks/useMobile");
-const MobileSearchControl = ({
-  searchInput,
-  onClick,
-  state,
-  className
-}) => {
-  const {
-    translate
-  } = (0, useLanguage_1.useLanguage)();
-  const isDrive = (0, useDrive_1.useDrive)();
-  const isMobile = (0, useMobile_1.useMobile)();
-  const driveClassname = (0, useDriveClassName_1.useDriveClassName)("zen-mobile-search-control");
-  const cancelSearchButton = (0, jsx_runtime_1.jsx)(button_1.Button, {
-    className: "zen-mobile-search-control__actions zen-mobile-search-control__actions--button",
-    title: translate("Cancel search"),
-    type: buttonType_1.ButtonType.Tertiary,
-    onClick: () => onClick(false),
-    children: translate("Cancel")
-  });
-  const searchIconButton = (0, jsx_runtime_1.jsx)(textIconButton_1.TextIconButton, {
-    className: "zen-mobile-search-control__actions zen-mobile-search-control__actions--button",
-    title: translate("Show page search"),
-    type: buttonType_1.ButtonType.TertiaryBlack,
-    onClick: () => onClick(true),
-    iconPosition: textIconButton_1.ButtonIconPosition.End,
-    iconSize: isDrive || isMobile ? svgIconSize_1.SvgIconSize.Huge : svgIconSize_1.SvgIconSize.Large,
-    iconClasses: "zen-mobile-search-control__actions--icon",
-    icon: iconSearch_1.IconSearch
-  });
-  const mobileSearchPanel = (0, jsx_runtime_1.jsxs)("div", {
-    className: "zen-mobile-search-control--expanded",
-    children: [(0, jsx_runtime_1.jsx)("div", {
-      className: "zen-mobile-search-control__search",
-      children: searchInput
-    }), cancelSearchButton]
-  });
-  return (0, jsx_runtime_1.jsx)("div", {
-    className: (0, classNames_1.classNames)(["zen-mobile-search-control", driveClassname || "", className !== null && className !== void 0 ? className : ""]),
-    children: state ? mobileSearchPanel : searchIconButton
-  });
-};
-exports.MobileSearchControl = MobileSearchControl;
-exports.TRANSLATIONS = ["Cancel", "Cancel search", "Show page search"];

package/dist/header/header.d.ts

@@ -1,29 +0,0 @@
-import React, { ReactElement } from "react";
-import "./header.less";
-import { IHeaderBack } from "./headerBack";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-import { IHeaderButton } from "./headerButton";
-import { IHeaderMenu } from "./headerMenu";
-import { IHeaderTitle } from "../headerTitle/headerTitle";
-import { IBookmark } from "../bookmark/bookmark";
-export declare enum HeaderType {
-    Desktop = "desktop",
-    Mobile = "mobile"
-}
-export interface IHeader extends IZenComponentProps {
-    children: ReactElement | ReactElement[] | undefined;
-    onFiltersBarOpen?: () => void;
-}
-export declare const Header: React.FC<IHeader> & {
-    Button: React.FC<IHeaderButton>;
-} & {
-    Menu: React.FC<IHeaderMenu>;
-} & {
-    Title: React.FC<IHeaderTitle>;
-} & {
-    Bookmark: React.FC<IBookmark>;
-} & {
-    Back: React.FC<IHeaderBack>;
-};
-export declare const HeaderDisplayName = "Header";
-export declare const TRANSLATIONS: string[];

package/dist/header/header.js

@@ -1,295 +0,0 @@
-"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.TRANSLATIONS = exports.HeaderDisplayName = exports.Header = exports.HeaderType = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-argument */
-const react_1 = __importStar(require("react"));
-const headerHelpers_1 = require("./headerHelpers");
-const headerBack_1 = require("./headerBack");
-const mobileSearchControl_1 = require("./components/mobileSearchControl/mobileSearchControl");
-const mobileFilterControl_1 = require("./components/mobileFilterControl/mobileFilterControl");
-const collapsedItemsControl_1 = require("./components/collapsedItemsControl/collapsedItemsControl");
-const classNames_1 = require("../commonHelpers/classNames/classNames");
-const basicToolbar_1 = require("./components/basicToolbar/basicToolbar");
-const headerButton_1 = require("./headerButton");
-const headerMenu_1 = require("./headerMenu");
-const useNonFittingElements_1 = require("./hooks/useNonFittingElements");
-const useResize_1 = require("../commonHelpers/hooks/useResize");
-const useThrottle_1 = require("../commonHelpers/hooks/useThrottle");
-const headerTitle_1 = require("../headerTitle/headerTitle");
-const bookmark_1 = require("../bookmark/bookmark");
-const useMobile_1 = require("../commonHelpers/hooks/useMobile");
-const useResizeObserver_1 = require("../commonHelpers/hooks/useResizeObserver");
-const headerContext_1 = require("./headerContext");
-const filtersBarProvider_1 = require("../filtersBar/filtersBarProvider");
-const filtersBarProviderSearch_1 = require("../filtersBar/filtersBarProviderSearch");
-const useDriveClassName_1 = require("../utils/theme/useDriveClassName");
-const filtersBarProviderTrigger_1 = require("../filtersBar/filtersBarProviderTrigger");
-const headerButtonsProvider_1 = require("../utils/headerButtons/headerButtonsProvider");
-const useClientReady_1 = require("../commonHelpers/hooks/useClientReady");
-const zen_1 = require("../utils/zen");
-var HeaderType;
-(function (HeaderType) {
-    HeaderType["Desktop"] = "desktop";
-    HeaderType["Mobile"] = "mobile";
-})(HeaderType || (exports.HeaderType = HeaderType = {}));
-// eslint-disable-next-line @typescript-eslint/naming-convention
-const Header = ({ children, className, onFiltersBarOpen
-// eslint-disable-next-line complexity
- }) => {
-    var _a, _b;
-    const isClientReady = (0, useClientReady_1.useClientReady)();
-    const toolbarRef = (0, react_1.useRef)(null);
-    const leftElementsRef = (0, react_1.useRef)(null);
-    const rightElementsRef = (0, react_1.useRef)(null);
-    const mobileFilterControlRef = (0, react_1.useRef)(null);
-    const mobileFilterNewLineControlRef = (0, react_1.useRef)(null);
-    const headerRef = (0, react_1.useRef)(null);
-    const [isFilterHidden, setIsFilterHidden] = (0, react_1.useState)(false);
-    const [middleWidth, setMiddleWidth] = (0, react_1.useState)(0);
-    const [content, setContent] = (0, react_1.useState)(null);
-    const previousScrollPosition = (0, react_1.useRef)(0);
-    const [searchComponent, setSearchComponent] = (0, react_1.useState)(null);
-    const [mobileFilterTrigger, setMobileFilterTrigger] = (0, react_1.useState)();
-    const handleSearchChange = (comp) => {
-        setSearchComponent(comp);
-    };
-    const [filtersBarToggleAllFiltersFn, setFiltersBarToggleAllFiltersFn] = (0, react_1.useState)(null);
-    const { result } = (0, useResizeObserver_1.useResizeObserver)({ target: leftElementsRef.current });
-    const moreButtonRef = (0, react_1.useRef)(null);
-    const scrollableParentEl = (0, react_1.useMemo)(() => (headerRef.current ? (0, headerHelpers_1.findFirstScrollableParent)(headerRef.current) : undefined), [headerRef]);
-    const [searchExpandedState, setSearchExpandedState] = (0, react_1.useState)(false);
-    const isMobile = (0, useMobile_1.useMobile)();
-    const { buttons: additionalButtons, priority } = (0, headerButtonsProvider_1.useHeaderButtons)();
-    const driveClassname = (0, useDriveClassName_1.useDriveClassName)("zen-main-header");
-    const driveClassnameTab = (0, useDriveClassName_1.useDriveClassName)("zen-main-header__tabs");
-    const getPreviousScrollPosition = (0, react_1.useCallback)(() => previousScrollPosition.current, []);
-    const scrollCallback = (0, react_1.useCallback)(e => {
-        if (!e.target) {
-            return;
-        }
-        const scrollThreshold = 56;
-        const delta = 50;
-        const scrollTop = e.target instanceof Document ? e.target.documentElement.scrollTop : e.target.scrollTop || 0;
-        const previousScrollPositionValue = getPreviousScrollPosition();
-        const isDownDirection = scrollTop > previousScrollPositionValue;
-        if (headerRef.current && scrollTop < (headerRef.current.getBoundingClientRect().height || scrollThreshold) + delta) {
-            previousScrollPosition.current = scrollTop;
-            setIsFilterHidden(false);
-            return;
-        }
-        if (Math.abs(scrollTop - previousScrollPositionValue) < delta) {
-            previousScrollPosition.current = scrollTop;
-            return;
-        }
-        previousScrollPosition.current = scrollTop;
-        setIsFilterHidden(isDownDirection);
-    }, [getPreviousScrollPosition, previousScrollPosition, headerRef]);
-    const handleScroll = (0, useThrottle_1.useThrottle)(e => {
-        var _a, _b;
-        const isKeyboardLikelyOpen = ((_b = (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.activeElement) === null || _b === void 0 ? void 0 : _b.matches("input, textarea, [contenteditable]")) || false;
-        const isMobileFilterOpen = ((mobileFilterTrigger === null || mobileFilterTrigger === void 0 ? void 0 : mobileFilterTrigger.current) && mobileFilterTrigger.current.getAttribute("aria-expanded") === "true") || false;
-        if (isMobileFilterOpen || isKeyboardLikelyOpen) {
-            return;
-        }
-        scrollCallback(e);
-    }, 200);
-    (0, react_1.useEffect)(() => {
-        var _a;
-        if (scrollableParentEl && isMobile) {
-            scrollableParentEl.addEventListener("scroll", handleScroll);
-        }
-        (_a = zen_1.zen.addEventListener) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, "scroll", handleScroll);
-        return () => {
-            var _a;
-            if (scrollableParentEl) {
-                scrollableParentEl.removeEventListener("scroll", handleScroll);
-            }
-            (_a = zen_1.zen.removeEventListener) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, "scroll", handleScroll);
-        };
-    }, [isMobile, handleScroll, scrollableParentEl]);
-    (0, react_1.useEffect)(() => {
-        var _a;
-        !isMobile && ((_a = zen_1.zen.removeEventListener) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, "scroll", handleScroll));
-    }, [handleScroll, isMobile]);
-    const headerItems = (0, headerHelpers_1.getArrayOfChildren)(children);
-    const { leftElements, resizableElements, rightElements, tabs, filtersBar } = (0, react_1.useMemo)(() => (0, headerHelpers_1.filterItems)(priority ? [...headerItems, ...additionalButtons] : [...additionalButtons, ...headerItems], isMobile), [additionalButtons, headerItems, isMobile, priority]);
-    const [numberOfChangedFilters, setNumberOfChangedFilters] = (0, react_1.useState)(undefined);
-    const isOnlySearch = (0, react_1.useMemo)(() => {
-        if (!filtersBar || !searchComponent) {
-            return false;
-        }
-        const props = filtersBar.props;
-        return react_1.default.Children.count(props.children) === 1;
-    }, [filtersBar, searchComponent]);
-    const memoizedFiltersBar = (0, react_1.useMemo)(() => filtersBar, [filtersBar]);
-    const filtersBarToggler = (0, react_1.useCallback)(() => {
-        if (onFiltersBarOpen || filtersBarToggleAllFiltersFn) {
-            filtersBarToggleAllFiltersFn && filtersBarToggleAllFiltersFn.fn(true);
-            !filtersBarToggleAllFiltersFn && (onFiltersBarOpen === null || onFiltersBarOpen === void 0 ? void 0 : onFiltersBarOpen());
-        }
-    }, [filtersBarToggleAllFiltersFn, onFiltersBarOpen]);
-    const hiddenItemForRender = (0, react_1.useMemo)(() => (0, headerHelpers_1.getItemsForRender)(resizableElements, isMobile), [isMobile, resizableElements]);
-    const widthDelta = ((_a = moreButtonRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
-    const maxWidth = middleWidth || ((_b = toolbarRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width) || 0;
-    const actionCount = (0, react_1.useMemo)(() => {
-        if (!isMobile) {
-            return 4;
-        }
-        if (memoizedFiltersBar && !searchComponent) {
-            return 1;
-        }
-        return 2;
-    }, [memoizedFiltersBar, isMobile, searchComponent]);
-    const hiddenElementsCountToRender = rightElements.length <= actionCount ? actionCount - rightElements.length : 0;
-    const { visibleElements, nonFittingElements, hiddenContainerRef } = (0, useNonFittingElements_1.useNonFittingElements)({
-        maxWidth,
-        data: resizableElements,
-        hiddenElementsCountToRender,
-        widthDelta,
-        reverseOrderOfVisible: true
-    });
-    const calculateMiddleWidth = (0, react_1.useCallback)(() => {
-        var _a, _b, _c;
-        const headerRefWidth = ((_a = headerRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) || 0;
-        const leftElementsRefWidth = ((_b = leftElementsRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width) || 0;
-        const rightelementsRefWidth = ((_c = rightElementsRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width) || 0;
-        const paddings = 48;
-        const gaps = 8 + (rightelementsRefWidth ? 8 : 0);
-        const calculatedMiddleWidth = headerRefWidth - gaps - paddings - rightelementsRefWidth - leftElementsRefWidth;
-        setMiddleWidth(calculatedMiddleWidth);
-    }, []);
-    const resizeCallBack = (0, useThrottle_1.useThrottle)(() => {
-        calculateMiddleWidth();
-        if (!isMobile) {
-            setSearchExpandedState(false);
-        }
-    }, 500);
-    (0, useResize_1.useResize)(resizeCallBack, true);
-    (0, react_1.useEffect)(() => {
-        (result === null || result === void 0 ? void 0 : result.contentRect.width) && calculateMiddleWidth();
-    }, [result === null || result === void 0 ? void 0 : result.contentRect.width, calculateMiddleWidth]);
-    (0, react_1.useEffect)(() => {
-        calculateMiddleWidth();
-    }, [calculateMiddleWidth, isClientReady]);
-    const moreButton = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(collapsedItemsControl_1.PageToolbarCollapsedItemsControl, { children: nonFittingElements }, "pageCollapsedToolbar"), [nonFittingElements]);
-    const mobileSearch = (0, react_1.useMemo)(() => searchComponent && memoizedFiltersBar ? ((0, jsx_runtime_1.jsx)(mobileSearchControl_1.MobileSearchControl, { state: searchExpandedState, searchInput: searchComponent, onClick: (state) => setSearchExpandedState(state) })) : null, [memoizedFiltersBar, searchComponent, searchExpandedState]);
-    const mobileFilterButton = (0, react_1.useMemo)(() => (isMobile && memoizedFiltersBar ? (0, jsx_runtime_1.jsx)(mobileFilterControl_1.MobileFilterControl, { count: numberOfChangedFilters, onClick: filtersBarToggler, ref: mobileFilterControlRef }) : null), [filtersBarToggler, isMobile, memoizedFiltersBar, numberOfChangedFilters]);
-    const mobileFilterNewlineButton = (0, react_1.useMemo)(() => (isMobile && memoizedFiltersBar ? (0, jsx_runtime_1.jsx)(mobileFilterControl_1.MobileFilterControl, { count: numberOfChangedFilters, onClick: filtersBarToggler, ref: mobileFilterNewLineControlRef }) : null), [filtersBarToggler, isMobile, memoizedFiltersBar, numberOfChangedFilters]);
-    const mobileNewLineContainer = (0, react_1.useMemo)(() => {
-        if (!searchComponent || isFilterHidden || !memoizedFiltersBar) {
-            return null;
-        }
-        const searchProps = searchComponent.props;
-        return ((0, jsx_runtime_1.jsxs)("div", { className: "zen-main-header__mobile-container-new-line", children: [(0, react_1.cloneElement)(searchComponent, { key: "searchComponentKey", className: `${searchProps.className || ""} zen-main-header__mobile-search-input` }), !isOnlySearch ? mobileFilterNewlineButton : null] }));
-    }, [searchComponent, isFilterHidden, memoizedFiltersBar, isOnlySearch, mobileFilterNewlineButton]);
-    const isFilterInNewLine = (0, react_1.useMemo)(() => !!searchComponent && !isOnlySearch && resizableElements.length > 0 && !searchExpandedState, [searchComponent, isOnlySearch, resizableElements.length, searchExpandedState]);
-    const collapsedElements = (0, react_1.useMemo)(() => (nonFittingElements.length ? [moreButton] : []), [moreButton, nonFittingElements.length]);
-    const mobileSearchCondition = !resizableElements.length && mobileSearch !== null;
-    const mobileFilterCondition = (0, react_1.useMemo)(() => memoizedFiltersBar && !isOnlySearch && (!resizableElements.length || (resizableElements.length && !mobileSearch)), [memoizedFiltersBar, isOnlySearch, resizableElements.length, mobileSearch]);
-    const mobileContainer = (0, react_1.useMemo)(() => ((0, jsx_runtime_1.jsxs)("div", { ref: toolbarRef, className: "zen-main-header__mobile-container", children: [collapsedElements.length ? collapsedElements : null, visibleElements.length ? (0, headerHelpers_1.getItemsForRender)(visibleElements, isMobile) : null, mobileSearchCondition ? mobileSearch : null, mobileFilterCondition && isMobile ? mobileFilterButton : null] })), [collapsedElements, isMobile, mobileFilterButton, mobileFilterCondition, mobileSearch, mobileSearchCondition, visibleElements]);
-    const middleElements = (0, react_1.useMemo)(() => isMobile ? (mobileContainer) : ((0, jsx_runtime_1.jsxs)("div", { className: "zen-main-header__adaptive-section", ref: toolbarRef, children: [collapsedElements, visibleElements] })), [collapsedElements, isMobile, mobileContainer, visibleElements]);
-    const titleSize = (0, react_1.useMemo)(() => {
-        let count = 0;
-        if (collapsedElements.length) {
-            count++;
-        }
-        if (visibleElements.length) {
-            count = count + visibleElements.length;
-        }
-        if (rightElements.length) {
-            count = count + rightElements.length;
-        }
-        if (mobileSearchCondition) {
-            count++;
-        }
-        if (mobileFilterCondition) {
-            count++;
-        }
-        if (count === 0 || count > 3) {
-            return undefined;
-        }
-        const prefixesForTitleSize = ["large", "medium", "small"];
-        return prefixesForTitleSize[count - 1];
-    }, [collapsedElements.length, mobileFilterCondition, mobileSearchCondition, rightElements.length, visibleElements.length]);
-    const titleShrinkCondition = (visibleElements.length === 0 && rightElements.length) || (mobileSearchCondition && mobileFilterCondition);
-    const fullClassName = (0, classNames_1.classNames)([
-        "zen-main-header zen-main-header--background-color",
-        driveClassname ? driveClassname : "",
-        (memoizedFiltersBar && !isMobile) || tabs ? "" : "zen-main-header--border",
-        isMobile ? "zen-main-header--mobile" : "",
-        titleShrinkCondition ? "zen-main-header--shrink-title" : "",
-        isMobile && titleSize ? `zen-main-header--mobile-title-${titleSize}` : "",
-        className !== null && className !== void 0 ? className : ""
-    ]);
-    const mobileExpandedSearchWrapper = (0, react_1.useMemo)(() => ((0, jsx_runtime_1.jsx)("div", { className: "zen-main-header__mobile-search", ref: toolbarRef, children: mobileSearch })), [toolbarRef, mobileSearch]);
-    const mainLineContainer = (0, react_1.useMemo)(() => {
-        if (searchExpandedState && !resizableElements.length) {
-            return mobileExpandedSearchWrapper;
-        }
-        return ((0, jsx_runtime_1.jsx)(basicToolbar_1.BasicToolbar, { className: "zen-main-header__section zen-main-header__section--padding", leftElements: leftElements, middleElements: middleElements, rightElements: rightElements.length ? rightElements : undefined, isMobile: isMobile, leftElementsRef: leftElementsRef, rightElementsRef: rightElementsRef }));
-    }, [isMobile, leftElements, middleElements, mobileExpandedSearchWrapper, resizableElements.length, rightElements, searchExpandedState]);
-    const newLineContainer = (0, react_1.useMemo)(() => {
-        if (!isMobile || !resizableElements.length || !mobileNewLineContainer) {
-            return null;
-        }
-        if (searchExpandedState) {
-            return mobileExpandedSearchWrapper;
-        }
-        return ((0, jsx_runtime_1.jsx)(basicToolbar_1.BasicToolbar, { className: "zen-main-header__section zen-main-header__section--secondary-padding", leftElements: undefined, middleElements: mobileNewLineContainer, rightElements: undefined, isMobile: true }));
-    }, [isMobile, mobileExpandedSearchWrapper, mobileNewLineContainer, resizableElements.length, searchExpandedState]);
-    const isMobileFilterButtonExists = (0, react_1.useMemo)(() => isMobile && memoizedFiltersBar && mobileFilterButton && !searchExpandedState && !isFilterHidden, [isFilterHidden, isMobile, memoizedFiltersBar, mobileFilterButton, searchExpandedState]);
-    (0, react_1.useEffect)(() => {
-        if (!isMobileFilterButtonExists && !mobileFilterTrigger) {
-            return;
-        }
-        if (!isMobileFilterButtonExists) {
-            setMobileFilterTrigger(undefined);
-            return;
-        }
-        if (mobileFilterControlRef.current && !isFilterInNewLine) {
-            setMobileFilterTrigger(mobileFilterControlRef);
-            return;
-        }
-        if (mobileFilterNewLineControlRef.current) {
-            setMobileFilterTrigger(mobileFilterNewLineControlRef);
-            return;
-        }
-    }, [mobileFilterControlRef, mobileFilterNewLineControlRef, isMobileFilterButtonExists, mobileFilterTrigger, isFilterInNewLine]);
-    if (!isClientReady) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)(headerContext_1.HeaderMenuProvider, { alignment: "left-top", children: (0, jsx_runtime_1.jsx)(collapsedItemsControl_1.HeaderCustomContent.Provider, { value: { content, setContent }, children: (0, jsx_runtime_1.jsx)(filtersBarProvider_1.FiltersBarContextProvider, { value: { setFiltersBarToggleAllFiltersFn, onUpdateNumberOfChangedFiltersFn: setNumberOfChangedFilters }, children: (0, jsx_runtime_1.jsx)(filtersBarProviderSearch_1.SearchContextProvider, { value: { setSearchComponent: handleSearchChange }, children: (0, jsx_runtime_1.jsx)(filtersBarProviderTrigger_1.TriggerContextProvider, { value: { triggerComponent: mobileFilterTrigger }, children: (0, jsx_runtime_1.jsxs)("div", { className: fullClassName, ref: headerRef, children: [mainLineContainer, newLineContainer, tabs ? ((0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-main-header__tabs", "zen-main-header--border", isMobile ? "zen-main-header__tabs--mobile" : "", driveClassnameTab || ""]), children: [" ", tabs, " "] })) : null, memoizedFiltersBar ? (0, jsx_runtime_1.jsx)("div", { className: "zen-main-header__filtersBar", children: memoizedFiltersBar }) : null, (0, jsx_runtime_1.jsx)("div", { className: "zen-main-header__section zen-main-header__section--hidden", ref: hiddenContainerRef, children: hiddenItemForRender }), (0, jsx_runtime_1.jsx)("div", { className: "zen-main-header__section zen-main-header__section--hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "zen-main-header__section--inline", ref: moreButtonRef, children: moreButton }) })] }) }) }) }) }) }));
-};
-exports.Header = Header;
-exports.HeaderDisplayName = "Header";
-exports.Header.displayName = exports.HeaderDisplayName;
-exports.Header.Button = headerButton_1.HeaderButton;
-exports.Header.Menu = headerMenu_1.HeaderMenu;
-exports.Header.Title = headerTitle_1.HeaderTitle;
-exports.Header.Bookmark = bookmark_1.Bookmark;
-exports.Header.Back = headerBack_1.HeaderBack;
-exports.TRANSLATIONS = [...mobileSearchControl_1.TRANSLATIONS, ...mobileFilterControl_1.TRANSLATIONS, ...headerBack_1.TRANSLATIONS];

package/dist/header/headerBack.d.ts

@@ -1,13 +0,0 @@
-import { IButton } from "../button/button";
-export interface IHeaderBack extends Omit<IButton, "onClick" | "link"> {
-    id?: string;
-    onClick?: (id?: string) => void;
-    link?: string;
-    className?: string;
-}
-export declare const HeaderBackDisplayName = "HeaderBack";
-export declare const HeaderBack: {
-    ({ id, className, link, onClick, title, ...restProps }: IHeaderBack): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export declare const TRANSLATIONS: string[];

package/dist/header/headerBack.js

@@ -1,78 +0,0 @@
-"use strict";
-
-const {
-  injectString
-} = require("../utils/localization/translationsDictionary");
-var __rest = this && this.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TRANSLATIONS = exports.HeaderBack = exports.HeaderBackDisplayName = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const textIconButton_1 = require("../textIconButton/textIconButton");
-const classNames_1 = require("../commonHelpers/classNames/classNames");
-const iconChevronLeft_1 = require("../icons/iconChevronLeft");
-const useLanguage_1 = require("../utils/localization/useLanguage");
-injectString("cs", "Back", "Zp\u011Bt");
-injectString("da-DK", "Back", "Tilbage");
-injectString("de", "Back", "Zur\xFCck");
-injectString("en", "Back", "Back");
-injectString("es", "Back", "Regresar");
-injectString("fi-FI", "Back", "Takaisin");
-injectString("fr", "Back", "Retour");
-injectString("fr-FR", "Back", "Retour");
-injectString("hu-HU", "Back", "Vissza");
-injectString("id", "Back", "Kembali");
-injectString("it", "Back", "Indietro");
-injectString("ja", "Back", "\u623B\u308B");
-injectString("ko-KR", "Back", "\uB4A4\uB85C");
-injectString("ms", "Back", "Kembali");
-injectString("nb-NO", "Back", "Tilbake");
-injectString("nl", "Back", "Terug");
-injectString("pl", "Back", "Wstecz");
-injectString("pt-BR", "Back", "Voltar");
-injectString("pt-PT", "Back", "Voltar");
-injectString("sk-SK", "Back", "Sp\xE4\u0165");
-injectString("sv", "Back", "Tillbaka");
-injectString("th", "Back", "\u0E01\u0E25\u0E31\u0E1A");
-injectString("tr", "Back", "Geri");
-injectString("zh-Hans", "Back", "\u8FD4\u56DE");
-injectString("zh-TW", "Back", "\u8FD4\u56DE");
-injectString("ro-RO", "Back", "\xCEnapoi");
-exports.HeaderBackDisplayName = "HeaderBack";
-const HeaderBack = _a => {
-  var {
-      id,
-      className,
-      link,
-      onClick,
-      title
-    } = _a,
-    restProps = __rest(_a, ["id", "className", "link", "onClick", "title"]);
-  const {
-    translate
-  } = (0, useLanguage_1.useLanguage)();
-  const fullClassName = (0, classNames_1.classNames)(["zen-header-back", className || ""]);
-  const props = Object.assign({}, restProps);
-  return (0, jsx_runtime_1.jsx)(textIconButton_1.TextIconButton, Object.assign({
-    id: id,
-    icon: iconChevronLeft_1.IconChevronLeft,
-    iconPosition: textIconButton_1.ButtonIconPosition.Start,
-    type: "tertiary",
-    className: fullClassName,
-    onClick: onClick ? () => onClick(id) : undefined,
-    link: link ? link : undefined,
-    htmlType: "button",
-    title: title ? title : translate("Back")
-  }, props));
-};
-exports.HeaderBack = HeaderBack;
-exports.HeaderBack.displayName = exports.HeaderBackDisplayName;
-exports.TRANSLATIONS = ["Back"];

package/dist/header/headerButton.d.ts

@@ -1,20 +0,0 @@
-/// <reference types="react" />
-import { IButton } from "../button/button";
-import { TButtonIconPosition } from "../textIconButton/textIconButton";
-import { TSvgIconSize } from "../svgIcon/svgIconSize";
-import { IIcon } from "../icons/icon";
-export interface IHeaderButton extends Omit<IButton, "onClick"> {
-    id: string;
-    important?: boolean;
-    inContextMenu?: boolean;
-    icon?: React.FC<IIcon>;
-    iconPosition?: TButtonIconPosition;
-    iconClasses?: string;
-    iconSize?: TSvgIconSize;
-    onClick?: (id: string, event: React.MouseEvent) => void;
-}
-export declare const HeaderButtonDisplayName = "HeaderButton";
-export declare const HeaderButton: {
-    ({ id, children, icon, iconPosition, className, important, onClick, inContextMenu, ...restProps }: IHeaderButton): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};

package/dist/header/headerButton.js

@@ -1,29 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeaderButton = exports.HeaderButtonDisplayName = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const button_1 = require("../button/button");
-const textIconButton_1 = require("../textIconButton/textIconButton");
-const classNames_1 = require("../commonHelpers/classNames/classNames");
-exports.HeaderButtonDisplayName = "HeaderButton";
-const HeaderButton = (_a) => {
-    var { id, children, icon, iconPosition = textIconButton_1.ButtonIconPosition.Start, className = "", important, onClick, inContextMenu } = _a, restProps = __rest(_a, ["id", "children", "icon", "iconPosition", "className", "important", "onClick", "inContextMenu"]);
-    const fullClassName = (0, classNames_1.classNames)(["zen-header-button", className]);
-    const props = Object.assign(Object.assign({}, restProps), { "data-important": important ? "1" : "0" });
-    return icon
-        ? (0, jsx_runtime_1.jsx)(textIconButton_1.TextIconButton, Object.assign({ id: id, icon: icon, iconPosition: iconPosition, className: fullClassName, onClick: onClick ? (e) => onClick(id, e) : undefined }, props, { children: children }))
-        : (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ id: id, className: fullClassName, onClick: onClick ? (e) => onClick(id, e) : undefined }, props, { children: children }));
-};
-exports.HeaderButton = HeaderButton;
-exports.HeaderButton.displayName = exports.HeaderButtonDisplayName;

package/dist/header/headerContext.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { TAlignment } from "../absolute/absolute";
-export declare const MenuAlignmentContext: import("react").Context<{
-    alignment?: TAlignment | undefined;
-}>;
-export declare const HeaderMenuProvider: ({ alignment, children }: {
-    alignment: TAlignment;
-    children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;

package/dist/header/headerContext.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeaderMenuProvider = exports.MenuAlignmentContext = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-exports.MenuAlignmentContext = (0, react_1.createContext)({ alignment: undefined });
-const HeaderMenuProvider = ({ alignment, children }) => ((0, jsx_runtime_1.jsx)(exports.MenuAlignmentContext.Provider, { value: { alignment }, children: children }));
-exports.HeaderMenuProvider = HeaderMenuProvider;