@geotab/zenith 3.9.0-beta.ssr.1 → 3.9.0

package/esm/commonHelpers/isDomEnv.js

@@ -1,2 +1 @@
-/* eslint-disable */
-export const isDomEnv = () => { var _a; return !!(typeof window !== "undefined" && typeof (window === null || window === void 0 ? void 0 : window.document) !== "undefined" && typeof ((_a = window === null || window === void 0 ? void 0 : window.document) === null || _a === void 0 ? void 0 : _a.createElement) !== "undefined"); };
+export const isDomEnv = () => !!(typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined");

package/esm/commonHelpers/useUniqueId.js

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { generateId } from "./utils";
+import { generateId } from "./generateId";
 /**
  * `useUniqueId` is a custom React hook that generates and returns a unique identifier.
  *

package/esm/commonHelpers/utils.d.ts

@@ -1,12 +1,3 @@
-/**
- * Generates a random unique ID string.
- *
- * @remarks
- * **Prefer `React.useId()`** inside React components. `useId` produces IDs that are
- * stable across server and client renders, preventing SSR hydration mismatches.
- * Use `generateId` only outside of a React component context where `useId` is not available.
- */
-export declare const generateId: () => string;
 export declare const echo: <T = unknown>(_: T) => T;
 export declare function flattenArrays<T>(arrayOfArrays: T[][]): T[];
 type TPlainObject = Record<string, unknown>;

package/esm/commonHelpers/utils.js

@@ -1,13 +1,4 @@
 import { zen } from "../utils/zen";
-/**
- * Generates a random unique ID string.
- *
- * @remarks
- * **Prefer `React.useId()`** inside React components. `useId` produces IDs that are
- * stable across server and client renders, preventing SSR hydration mismatches.
- * Use `generateId` only outside of a React component context where `useId` is not available.
- */
-export const generateId = () => "id" + Math.random().toString().substring(2);
 export const echo = (_) => _;
 export function flattenArrays(arrayOfArrays) {
     return arrayOfArrays.reduce((akk, arr) => akk.concat(arr), []);

package/esm/dataGrid/withSelectableRows/components/bulkActions/bulkActions.d.ts

@@ -7,21 +7,19 @@ import { DeviceType } from "../../../../commonHelpers/hooks/deviceType";
 type TBulkAction = IBulkActionLink | IBulkActionButton;
 export interface IBulkActionsProps extends IZenComponentProps {
     selected: number;
-    /**
-     * When `true`, displays "All selected" instead of a count, and enables action buttons
-     * even when `selected` is 0 (i.e., cross-page "select all" is active).
-     */
     allSelected?: boolean;
     onClearSelection: () => void;
+    onSelectAll?: () => void;
     gridType?: DeviceType;
     children?: ReactElement<TBulkAction> | null | (ReactElement<TBulkAction> | null)[];
+    turnOffSelectAll?: boolean;
 }
 export interface IBulkActions extends IBulkActionsProps {
     ActionLink: (props: IBulkActionLink) => ReactNode;
     ActionButton: (props: IBulkActionButton) => ReactNode;
 }
 export declare const BulkActions: {
-    ({ selected, allSelected, className, onClearSelection, gridType, children }: IBulkActionsProps): import("react/jsx-runtime").JSX.Element;
+    ({ selected, allSelected, className, onClearSelection, onSelectAll, gridType, children, turnOffSelectAll }: IBulkActionsProps): import("react/jsx-runtime").JSX.Element;
     ActionLink: ({ title, icon, link, disabled, type, ref }: IBulkActionLink) => import("react/jsx-runtime").JSX.Element;
     ActionButton: ({ title, icon, clickHandler, onClick, disabled, type, ref }: IBulkActionButton) => import("react/jsx-runtime").JSX.Element;
     translations: string[];

package/esm/dataGrid/withSelectableRows/components/bulkActions/bulkActions.js

@@ -12,6 +12,7 @@ import { useNonFittingElements } from "../../../../header/hooks/useNonFittingEle
 import { useResizeObserver } from "../../../../commonHelpers/hooks/useResizeObserver";
 import { Menu } from "../../../../menu/menu";
 import { IconDotVertical } from "../../../../icons/iconDotVertical";
+import { Button } from "../../../../button/button";
 injectString("cs", "{1} selected", "{1} vybran\xFD/vybran\xE9");
 injectString("da-DK", "{1} selected", "{1} valgt");
 injectString("de", "{1} selected", "{1} ausgew\xE4hlt");
@@ -93,6 +94,33 @@ injectString("zh-Hans", "Clear selection", "\u6E05\u9664\u9009\u62E9");
 injectString("zh-TW", "Clear selection", "\u6E05\u9664\u9078\u53D6\u9805\u76EE");
 injectString("ro-RO", "Clear selection", "\u0218terge\u021Bi selec\u021Bia");
 injectString("ar-SA", "Clear selection", "\u0645\u0633\u062D \u0627\u0644\u062A\u062D\u062F\u064A\u062F");
+injectString("cs", "Select all", "Vybrat v\u0161e");
+injectString("da-DK", "Select all", "V\xE6lg alle");
+injectString("de", "Select all", "Alle ausw\xE4hlen");
+injectString("en", "Select all", "Select all");
+injectString("es", "Select all", "Seleccionar todo");
+injectString("fi-FI", "Select all", "Valitse kaikki");
+injectString("fr", "Select all", "S\xE9lectionner tout");
+injectString("fr-FR", "Select all", "S\xE9lectionner tout");
+injectString("hu-HU", "Select all", "V\xE1laszd ki az \xF6sszeset.");
+injectString("id", "Select all", "Pilih semua");
+injectString("it", "Select all", "Selezionare tutto");
+injectString("ja", "Select all", "\u3059\u3079\u3066\u9078\u629E");
+injectString("ko-KR", "Select all", "\uBAA8\uB450 \uC120\uD0DD");
+injectString("ms", "Select all", "Pilih semua");
+injectString("nb-NO", "Select all", "Velg alle");
+injectString("nl", "Select all", "Alles selecteren");
+injectString("pl", "Select all", "Wybierz wszystko");
+injectString("pt-BR", "Select all", "Selecionar tudo");
+injectString("pt-PT", "Select all", "Selecionar tudo");
+injectString("sk-SK", "Select all", "Vyber v\u0161etko.");
+injectString("sv", "Select all", "V\xE4lj alla");
+injectString("th", "Select all", "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14");
+injectString("tr", "Select all", "T\xFCm\xFCn\xFC se\xE7");
+injectString("zh-Hans", "Select all", "\u5168\u9009");
+injectString("zh-TW", "Select all", "\u5168\u9078");
+injectString("ro-RO", "Select all", "Selecta\u021Bi tot");
+injectString("ar-SA", "Select all", "\u062A\u062D\u062F\u064A\u062F \u0627\u0644\u0643\u0644");
 injectString("cs", "More", "V\xEDce");
 injectString("da-DK", "More", "Mere");
 injectString("de", "More", "Mehr");
@@ -125,8 +153,10 @@ export const BulkActions = ({
   allSelected,
   className,
   onClearSelection,
+  onSelectAll,
   gridType = DeviceType.Desktop,
-  children
+  children,
+  turnOffSelectAll
 }) => {
   var _a;
   const {
@@ -170,7 +200,13 @@ export const BulkActions = ({
     }), _jsx("span", {
       className: "zen-bulk-actions__number-of-selected ellipsis",
       children: text
-    }), _jsxs("div", {
+    }), onSelectAll && !turnOffSelectAll ? _jsx(Button, {
+      type: "tertiary",
+      className: "zen-bulk-actions__select-all",
+      disabled: allSelected,
+      onClick: onSelectAll,
+      children: translate("Select all")
+    }) : null, _jsxs("div", {
       className: "zen-bulk-actions__action-button-holder",
       ref: buttonHolder,
       children: [Children.map(visibleElements, element => cloneElement(element, {

package/esm/dateInputInner/dateInputInnerControlBlock.js

@@ -108,12 +108,15 @@ export const DateInputInnerControlBlock = props => {
       value: timePickerValue,
       onChange: timeChangeHandler,
       isMobileView: isMobileView,
-      fullWidth: true
+      fullWidth: true,
+      // eslint-disable-next-line
+      // @ts-ignore
+      dataTimeId: id
     }), isHasTimeError ? _jsx(FormFieldError, {
       id: timeErrorId,
       error: translate("The time must be set")
     }) : null]
-  }) : null, [isActiveField, isHasTimeError, isMobileView, selectTime, timeChangeHandler, timePickerValue, translate, timeErrorId]);
+  }) : null, [selectTime, isActiveField, isHasTimeError, timePickerValue, timeChangeHandler, isMobileView, id, timeErrorId, translate]);
   return _jsxs("div", {
     className: classNames(["zen-date-input-inner__control-block", className || ""]),
     children: [title ? _jsx("label", {

package/esm/dateRangeRaw/dateRangeRaw.js

@@ -219,6 +219,7 @@ injectString("zh-Hans", "Previous", "\u524D\u4E00");
 injectString("zh-TW", "Previous", "\u4E0A\u4E00\u500B");
 injectString("ro-RO", "Previous", "\xCEnapoi");
 injectString("ar-SA", "Previous", "\u0627\u0644\u0633\u0627\u0628\u0642");
+injectString("en", "Previous date period", "Previous date period");
 injectString("cs", "Next", "Dal\u0161\xED");
 injectString("da-DK", "Next", "N\xE6ste");
 injectString("de", "Next", "N\xE4chstes");
@@ -246,6 +247,7 @@ injectString("zh-Hans", "Next", "\u4E0B\u4E00\u4E2A");
 injectString("zh-TW", "Next", "\u4E0B\u4E00\u6B65");
 injectString("ro-RO", "Next", "\xCEnainte");
 injectString("ar-SA", "Next", "\u0627\u0644\u062A\u0627\u0644\u064A");
+injectString("en", "Next date period", "Next date period");
 export const DateRangeRaw = props => {
   var _a;
   const {
@@ -693,6 +695,7 @@ export const DateRangeRaw = props => {
         onClick: decreaseRange,
         className: classNames(["zen-date-range__stepper", "zen-date-range__stepper--left"]),
         title: translate("Previous"),
+        "aria-label": translate("Previous date period"),
         children: _jsx(IconChevronLeftSmall, {
           size: isDrive || isMobile ? "huge" : "large"
         })
@@ -702,6 +705,7 @@ export const DateRangeRaw = props => {
         onClick: increaseRange,
         className: classNames(["zen-date-range__stepper", "zen-date-range__stepper--right"]),
         title: translate("Next"),
+        "aria-label": translate("Next date period"),
         children: _jsx(IconChevronRightSmall, {
           size: isDrive || isMobile ? "huge" : "large"
         })
@@ -709,4 +713,4 @@ export const DateRangeRaw = props => {
     }) : chip ? chipTriggerComponent : popupTriggerComponent, isMobile ? memoizedMobileView : memoizedDesktopView]
   });
 };
-export const TRANSLATIONS = ["Custom", "Date range", "Clear", "Cancel", "Apply", "Reset", "Today", "Next", "Previous", "Choose dates", "Date range not available", "Choose your date range", "Some of the dates you selected aren't available. Please try a different range.", "Please select the dates you want to view."];
+export const TRANSLATIONS = ["Custom", "Date range", "Clear", "Cancel", "Apply", "Reset", "Today", "Next", "Previous", "Choose dates", "Date range not available", "Choose your date range", "Some of the dates you selected aren’t available. Please try a different range.", "Please select the dates you want to view.", "Previous date period", "Next date period"];

package/esm/filtersBar/filtersBarActions/filtersBarActions.js

@@ -6,6 +6,7 @@ import { ButtonType } from "../../button/buttonType";
 import { ButtonIconPosition, TextIconButton } from "../../textIconButton/textIconButton";
 import { useLanguage } from "../../utils/localization/useLanguage";
 import { IconSettings6 } from "../../icons/iconSettings6";
+injectString("en", "Active filters: {}", "Active filters: {}");
 injectString("cs", "Filters", "Filtry");
 injectString("da-DK", "Filters", "Filtre");
 injectString("de", "Filters", "Filter");
@@ -110,6 +111,7 @@ export const FiltersBarActions = ({
       onClick: onShowAllFilters,
       icon: IconSettings6,
       iconPosition: ButtonIconPosition.Start,
+      "aria-label": selectedQuantityToDisplay && selectedQuantityToDisplay > 0 ? translate("Active filters: {}").replace("{}", selectedQuantityToDisplay.toString()) : translate("Filters"),
       children: _jsxs("span", {
         className: "zen-filters-toolbar__action-label",
         children: [translate("Filters"), selectedQuantityToDisplay && selectedQuantityToDisplay > 0 ? _jsx("span", {
@@ -134,4 +136,4 @@ export const FiltersBarActions = ({
     }) : null]
   });
 };
-export const TRANSLATIONS = ["Filters", "Clear", "Search"];
+export const TRANSLATIONS = ["Filters", "Clear", "Search", "Active filters: {}"];

package/esm/header/components/collapsedItemsControl/utils/handleCustomMenuWrapper.js

@@ -33,7 +33,7 @@ export const handleCustomMenuWrapper = (reactNode, content, menuItems) => {
         const el = createElement(Menu.Item, {
             id: reactNode.props.id || menu.props.id,
             key: reactNode.props.id || menu.props.id,
-            name: reactNode.props.name || "",
+            name: reactNode.props.name || menu.props.name || "",
             disabled: reactNode.props.disabled || menu.props.disabled,
             link: reactNode.props.link || menu.props.link,
             target: reactNode.props.target || menu.props.target,

package/esm/index.d.ts

@@ -20,6 +20,7 @@ export { type ICardButton, CardButton } from "./card/components/cardButton/cardB
 export { type ICardToggle, CardToggle } from "./card/components/cardToggle/cardToggle";
 export { type IContent, Content } from "./card/components/content";
 export { type TCardStatus, Status } from "./card/components/status";
+export { Title } from "./card/components/title";
 export { TitleLink } from "./card/components/titleLink";
 export { getDefaultFullWidthValue } from "./card/helpers/getDefaultFullWidthValue";
 export { getIconFromStatus } from "./card/helpers/getIconFromStatus";
@@ -48,7 +49,7 @@ export { hexToRGBA } from "./commonHelpers/colorUtils";
 export { type IEntityWithId } from "./commonHelpers/entity";
 export { generateId } from "./commonHelpers/generateId";
 export { DeviceType } from "./commonHelpers/hooks/deviceType";
-export { SSRContext, SSRProvider } from "./commonHelpers/hooks/ssrProvider";
+export { SSRProvider } from "./commonHelpers/hooks/ssrProvider";
 export { useDebounce } from "./commonHelpers/hooks/useDebounce";
 export { useDebouncedMemo } from "./commonHelpers/hooks/useDebouncedMemo";
 export { useDeviceType } from "./commonHelpers/hooks/useDeviceType";
@@ -73,6 +74,8 @@ export { useDropdownState } from "./dropdown/useDropdownState";
 export { type IEmptyState, EmptyState } from "./emptyState/emptyState";
 export { type IFavoriteButton, FavoriteButton } from "./favoriteButton/favoriteButton";
 export { FeedbackProvider } from "./feedbackProvider/feedbackProvider";
+export { TemplateDownloadSection } from "./fileUpload/components/templateDownloadSection";
+export { UploadedFilesSection } from "./fileUpload/components/uploadedFilesSection";
 export { FileUpload } from "./fileUpload/fileUpload";
 export { type IUploadedFile, type ITemplateDownload, type IFileUploadMeta, type IFileUpload } from "./fileUpload/fileUploadType";
 export { type TFilterButton, type IFilterButton, FilterButton } from "./filterButton/filterButton";
@@ -748,7 +751,7 @@ export { type ITab, type ITabBar, TabBar } from "./tabBar/tabBar";
 export { type ITabBarContent, TabBarContent } from "./tabBar/tabBarContent";
 export { type ITableDetailPanel } from "./table/children/tableDetailPanel";
 export { NestedData } from "./table/nested/nestedData";
-export { NestedWrapperName, useNestedRows } from "./table/nested/useNestedRows";
+export { useNestedRows } from "./table/nested/useNestedRows";
 export { type IListColumn, type TFeedResult, type IFeedExpandable, type ITable, type IListColumnWrapper, Table, getEmptySelection, ColumnSortDirection, getSortableValue, ActionsColumn, MainColumn, CheckboxColumn, ActionLinkColumn } from "./table/table";
 export { type ITabElement, type ITabs, TabsDisplayName, Tabs } from "./tabs/tabs";
 export { ButtonIconPosition, type TButtonIconPosition, type ITextIconButton, TextIconButton } from "./textIconButton/textIconButton";
@@ -757,7 +760,6 @@ export { type ITextInputRaw, TextInputRaw } from "./textInputRaw/textInputRaw";
 export { type ITextarea, Textarea } from "./textarea/textarea";
 export { type ITextareaRaw, TextareaRaw } from "./textareaRaw/textareaRaw";
 export { type ITimePicker, type TTimePicker, TimePicker } from "./timePicker/timePicker";
-export { Title } from "./title/title";
 export { type IShowToast, useToast } from "./toast/hooks/useToast";
 export { type IToast, Toast } from "./toast/toast";
 export { type IToggleButton, type TToggleButton, ToggleButton } from "./toggleButton/toggleButton";
@@ -769,8 +771,6 @@ export { type TooltipSize, type TMobileView, Tooltip } from "./tooltip/tooltip";
 export { type IAbortablePromiseOptions, type IAbortablePromiseConstructor, AbortablePromise } from "./utils/abortablePromise";
 export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvider";
 export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
-export { directionContext } from "./utils/localization/directionContext";
-export { type TTextDirection, getTextDirection } from "./utils/localization/getTextDirection";
 export { LanguageProvider } from "./utils/localization/languageProvider";
 export { dictionaries, injectString } from "./utils/localization/translationsDictionary";
 export { useDirection } from "./utils/localization/useDirection";

package/esm/index.js

@@ -21,6 +21,7 @@ export { CardButton } from "./card/components/cardButton/cardButton";
 export { CardToggle } from "./card/components/cardToggle/cardToggle";
 export { Content } from "./card/components/content";
 export { Status } from "./card/components/status";
+export { Title } from "./card/components/title";
 export { TitleLink } from "./card/components/titleLink";
 export { getDefaultFullWidthValue } from "./card/helpers/getDefaultFullWidthValue";
 export { getIconFromStatus } from "./card/helpers/getIconFromStatus";
@@ -48,7 +49,7 @@ export { classNames } from "./commonHelpers/classNames/classNames";
 export { hexToRGBA } from "./commonHelpers/colorUtils";
 export { generateId } from "./commonHelpers/generateId";
 export { DeviceType } from "./commonHelpers/hooks/deviceType";
-export { SSRContext, SSRProvider } from "./commonHelpers/hooks/ssrProvider";
+export { SSRProvider } from "./commonHelpers/hooks/ssrProvider";
 export { useDebounce } from "./commonHelpers/hooks/useDebounce";
 export { useDebouncedMemo } from "./commonHelpers/hooks/useDebouncedMemo";
 export { useDeviceType } from "./commonHelpers/hooks/useDeviceType";
@@ -72,6 +73,8 @@ export { useDropdownState } from "./dropdown/useDropdownState";
 export { EmptyState } from "./emptyState/emptyState";
 export { FavoriteButton } from "./favoriteButton/favoriteButton";
 export { FeedbackProvider } from "./feedbackProvider/feedbackProvider";
+export { TemplateDownloadSection } from "./fileUpload/components/templateDownloadSection";
+export { UploadedFilesSection } from "./fileUpload/components/uploadedFilesSection";
 export { FileUpload } from "./fileUpload/fileUpload";
 export { FilterButton } from "./filterButton/filterButton";
 export { FiltersChip } from "./filters/components/filtersChip";
@@ -733,7 +736,7 @@ export { SummaryTileBar, SummaryTileBarDisplayName } from "./summaryTileBar/summ
 export { TabBar } from "./tabBar/tabBar";
 export { TabBarContent } from "./tabBar/tabBarContent";
 export { NestedData } from "./table/nested/nestedData";
-export { NestedWrapperName, useNestedRows } from "./table/nested/useNestedRows";
+export { useNestedRows } from "./table/nested/useNestedRows";
 export { Table, getEmptySelection, ColumnSortDirection, getSortableValue, ActionsColumn, MainColumn, CheckboxColumn, ActionLinkColumn } from "./table/table";
 export { TabsDisplayName, Tabs } from "./tabs/tabs";
 export { ButtonIconPosition, TextIconButton } from "./textIconButton/textIconButton";
@@ -742,7 +745,6 @@ export { TextInputRaw } from "./textInputRaw/textInputRaw";
 export { Textarea } from "./textarea/textarea";
 export { TextareaRaw } from "./textareaRaw/textareaRaw";
 export { TimePicker } from "./timePicker/timePicker";
-export { Title } from "./title/title";
 export { useToast } from "./toast/hooks/useToast";
 export { Toast } from "./toast/toast";
 export { ToggleButton } from "./toggleButton/toggleButton";
@@ -753,8 +755,6 @@ export { Tooltip } from "./tooltip/tooltip";
 export { AbortablePromise } from "./utils/abortablePromise";
 export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvider";
 export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
-export { directionContext } from "./utils/localization/directionContext";
-export { getTextDirection } from "./utils/localization/getTextDirection";
 export { LanguageProvider } from "./utils/localization/languageProvider";
 export { dictionaries, injectString } from "./utils/localization/translationsDictionary";
 export { useDirection } from "./utils/localization/useDirection";

package/esm/menu/components/menuItem.js

@@ -6,7 +6,7 @@ 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 { generateId } from "../../commonHelpers/generateId";
 import { MenuAlignmentContext } from "../../header/headerContext";
 import { isSeparator } from "./menuSeparator";
 export const isMenuItem = (element) => {

package/esm/menu/controlledMenu.js

@@ -16,7 +16,7 @@ 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 { generateId } from "../commonHelpers/generateId";
 import { PathProvider } from "./contexts/pathProvider";
 import { isSeparator, MenuSeparator } from "./components/menuSeparator";
 import { FOCUSABLE_SELECTOR } from "../utils/focusableSelector";

package/esm/nav/nav.js

@@ -5,7 +5,7 @@ import { Children, cloneElement, Fragment, useCallback, useEffect, useLayoutEffe
 import { NavDivider } from "./navDivider/navDivider";
 import { detectOverlayScrollbar, filterPrimaryNavItems, collectNavItems } from "./utils/navUtils";
 import { useResize } from "../commonHelpers/hooks/useResize";
-import { createPortal } from "react-dom";
+import { usePortal } from "../commonHelpers/hooks/usePortal";
 import { NavMobileBar } from "./navMobileBar/navMobileBar";
 import { useMobile } from "../commonHelpers/hooks/useMobile";
 import { FOCUSABLE_SELECTOR } from "../utils/focusableSelector";
@@ -132,6 +132,7 @@ export const Nav = ({ children, className, collapsed = false, onCollapseToggle,
     useEffect(() => {
         onMenuVisibilityToggle === null || onMenuVisibilityToggle === void 0 ? void 0 : onMenuVisibilityToggle(!isMobile || isMobileMenuOpen);
     }, [isMobile, isMobileMenuOpen, onMenuVisibilityToggle]);
+    const navMobileBarPortal = usePortal(_jsx(NavMobileBar, { onMenuToggle: onMobileMenuToggle, isMenuOpen: isMobileMenuOpen, children: isEditState ? editListItems : primaryItems }), mobileBarContainer !== null && mobileBarContainer !== void 0 ? mobileBarContainer : undefined);
     return (_jsxs(NavContext, { value: {
             collapsed,
             onCollapseToggle,
@@ -142,13 +143,17 @@ export const Nav = ({ children, className, collapsed = false, onCollapseToggle,
             searchTerm,
             onSearch: setSearchTerm,
             onNavigate: () => onIsMobileMenuOpenToggle && onIsMobileMenuOpenToggle(false)
-        }, children: [!isMobile || isMobileMenuOpen ? (_jsxs("div", { ref: menuRef, className: classNames(["zen-nav", isMobile ? "zen-nav--mobile" : "", collapsed ? "zen-nav--collapsed" : "", className || ""]), children: [header
+        }, children: [!isMobile || isMobileMenuOpen ? (_jsxs("div", { ref: menuRef, className: classNames([
+                    "zen-nav",
+                    isMobile ? "zen-nav--mobile" : "",
+                    isMobile && isEditState ? "zen-nav--mobile-edit" : "",
+                    collapsed ? "zen-nav--collapsed" : "",
+                    className || ""
+                ]), children: [header
                         ? cloneElement(header, Object.assign(Object.assign({}, header.props), { className: classNames(["zen-nav__header", header.props.className || ""]) }))
                         : null, _jsx(NavContent, { children: isEditState
                             ? editListItems
                             : sectionsToRender.map((section, index) => (_jsxs(Fragment, { children: [cloneElement(section, {
                                         className: classNames(["zen-nav__section", section.props.className || ""])
-                                    }), isMobile || index < sectionsToRender.length - 1 ? _jsx(NavDivider, {}) : null] }, index))) }), footerToRender] })) : null, mobileBarContainer &&
-                isMobile &&
-                createPortal(_jsx(NavMobileBar, { onMenuToggle: onMobileMenuToggle, isMenuOpen: isMobileMenuOpen, children: isEditState ? editListItems : primaryItems }), mobileBarContainer)] }));
+                                    }), isMobile || index < sectionsToRender.length - 1 ? _jsx(NavDivider, {}) : null] }, index))) }), footerToRender] })) : null, mobileBarContainer && isMobile && navMobileBarPortal] }));
 };

package/esm/selectRaw/selectRaw.js

@@ -147,6 +147,6 @@ export const SelectRaw = (props) => {
                             "zen-ellipsis",
                             "zen-caption__content",
                             !selectValue ? "zen-select__text--placeholder" : ""
-                        ]), children: text }), _jsx(IconChevronDownSmall, { className: "zen-select__arrow zen-caption__post-content", size: "large" })] }), _jsx(Absolute, { recalculateOnScroll: true, className: classNames(["zen-select__popup", classNamePopup || ""]), triggerRef: innerTriggerRef, id: popupId, isOpen: isOpen, onOpenChange: onPopupVisibilityChange, children: _jsx(PassiveSelectListComp, { id: listId, title: title, disabled: disabled, multiselect: false, items: items.map(item => (Object.assign(Object.assign({}, item), { state: selectValue === item.id ? CheckboxState.On : CheckboxState.Off }))), value: new Map(items.map(item => [item.id, selectValue === item.id ? CheckboxState.On : CheckboxState.Off])), activeIndex: state.activeIndex, size: pageSize, onChangeItem: onChangeItem, style: { width, minWidth, maxWidth } }) })] }));
+                        ]), children: text }), _jsx(IconChevronDownSmall, { className: "zen-select__arrow zen-caption__post-content", size: "large" })] }), _jsx(Absolute, { recalculateOnScroll: true, className: classNames(["zen-select__popup", classNamePopup || ""]), triggerRef: innerTriggerRef, id: popupId, isOpen: isOpen, onOpenChange: onPopupVisibilityChange, focusOnOpen: false, children: _jsx(PassiveSelectListComp, { id: listId, title: title, disabled: disabled, multiselect: false, items: items.map(item => (Object.assign(Object.assign({}, item), { state: selectValue === item.id ? CheckboxState.On : CheckboxState.Off }))), value: new Map(items.map(item => [item.id, selectValue === item.id ? CheckboxState.On : CheckboxState.Off])), activeIndex: state.activeIndex, size: pageSize, onChangeItem: onChangeItem, style: { width, minWidth, maxWidth } }) })] }));
 };
 SelectRaw.displayName = "SelectRaw";

package/esm/shield/shield.js

@@ -2,16 +2,18 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { classNames } from "../commonHelpers/classNames/classNames";
 import { useFadeComponent } from "../utils/useFadeComponent";
-import { createPortal } from "react-dom";
+import { usePortal } from "../commonHelpers/hooks/usePortal";
 import { zen } from "../utils/zen";
 export const Shield = ({ className, dataShieldId, isVisible }) => {
-    var _a, _b;
+    var _a, _b, _c, _d;
     const { renderComponent, showContent, setIsOpen, handleTransitionEnd } = useFadeComponent(isVisible || false);
+    const container = (_d = (_b = (_a = zen.document) === null || _a === void 0 ? void 0 : _a.fullscreenElement) !== null && _b !== void 0 ? _b : (_c = zen.document) === null || _c === void 0 ? void 0 : _c.body) !== null && _d !== void 0 ? _d : undefined;
+    const portal = usePortal(_jsx("div", { onTransitionEnd: handleTransitionEnd, className: classNames(["zen-shield", "zen-shield-faded", showContent ? "zen-shield-faded--visible" : "", className !== null && className !== void 0 ? className : ""]), "data-shield-id": dataShieldId || "" }), container);
     useEffect(() => {
         setIsOpen(isVisible || false);
     }, [isVisible, setIsOpen]);
     if (!renderComponent && !isVisible) {
         return isVisible === undefined ? (_jsx("div", { className: classNames(["zen-shield", className !== null && className !== void 0 ? className : ""]), "data-shield-id": dataShieldId || "" })) : null;
     }
-    return createPortal(_jsx("div", { onTransitionEnd: handleTransitionEnd, className: classNames(["zen-shield", "zen-shield-faded", showContent ? "zen-shield-faded--visible" : "", className !== null && className !== void 0 ? className : ""]), "data-shield-id": dataShieldId || "" }), ((_a = zen.document) === null || _a === void 0 ? void 0 : _a.fullscreenElement) || ((_b = zen.document) === null || _b === void 0 ? void 0 : _b.body));
+    return portal;
 };

package/esm/table/children/useTableChildren.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement, ReactNode, RefObject } from "react";
-export declare const useTableChildren: (children: ReactNode, isMobile: boolean, selected: number, allSelected: boolean, clearSelection: () => void, activeId?: string, gridRef?: RefObject<HTMLElement | null>, onCloseDetailPanel?: () => void) => {
+export declare const useTableChildren: (children: ReactNode, isMobile: boolean, selected: number, allSelected: boolean, clearSelection: () => void, selectAll: () => void, turnOffSelectAll?: boolean, activeId?: string, gridRef?: RefObject<HTMLElement | null>, onCloseDetailPanel?: () => void) => {
     bulkActions: ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | undefined;
     pagination: ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | undefined;
     activePage: number | undefined;

package/esm/table/children/useTableChildren.js

@@ -24,7 +24,7 @@ const isChildElement = function (child, expectedType) {
     }
     return false;
 };
-export const useTableChildren = (children, isMobile, selected, allSelected, clearSelection, activeId, gridRef, onCloseDetailPanel) => useMemo(() => {
+export const useTableChildren = (children, isMobile, selected, allSelected, clearSelection, selectAll, turnOffSelectAll, activeId, gridRef, onCloseDetailPanel) => useMemo(() => {
     let bulkActions = undefined;
     let tablePagination = undefined;
     let activePage = undefined;
@@ -39,7 +39,7 @@ export const useTableChildren = (children, isMobile, selected, allSelected, clea
         }
         if (isChildElement(child, TableBulkActions.displayName)) {
             const bulkActionButtons = child.props.children || [];
-            bulkActions = (_jsx(BulkActions, { gridType: isMobile ? DeviceType.Mobile : DeviceType.Desktop, selected: selected, allSelected: allSelected, onClearSelection: clearSelection, children: bulkActionButtons }));
+            bulkActions = (_jsx(BulkActions, { gridType: isMobile ? DeviceType.Mobile : DeviceType.Desktop, selected: selected, allSelected: allSelected, onClearSelection: clearSelection, onSelectAll: selectAll, turnOffSelectAll: turnOffSelectAll, children: bulkActionButtons }));
             return;
         }
         if (isChildElement(child, TablePagination.displayName)) {
@@ -100,4 +100,4 @@ export const useTableChildren = (children, isMobile, selected, allSelected, clea
         detailPanel: detailPanel,
         other: other
     };
-}, [children, clearSelection, isMobile, selected, gridRef, allSelected, activeId, onCloseDetailPanel]);
+}, [children, clearSelection, isMobile, selected, gridRef, allSelected, selectAll, turnOffSelectAll, activeId, onCloseDetailPanel]);

package/esm/table/selectable/useSelectableRows.d.ts

@@ -16,14 +16,6 @@ export interface ISelectableRowsOptions<T extends IRowEntity<N>, N extends IEnti
     checkboxTitle?: (entity: T | N) => string;
     headerTitle?: (state: SelectionState) => string;
     turnOffSelectAll?: boolean;
-    /**
-     * When `true`, the header checkbox emits the current page's IDs instead of `{ all: true }`.
-     * When `undefined`, falls back to `turnOffSelectAll` for backward compatibility.
-     *
-     * Note: avoid setting this to `false` alongside `turnOffSelectAll: true` — the checkbox
-     * will emit `{ all: true }` while the dropdown hides the "Select all" option, which is inconsistent.
-     */
-    checkboxSelectsCurrentPage?: boolean;
     checkboxPlaceholder?: boolean;
     strategy?: TSelectionStrategy;
     selectAll?: boolean;

package/esm/table/selectable/useSelectableRows.js

@@ -157,6 +157,7 @@ export const useSelectableRows = (columns, entities, isMobile, selectMode, setSe
       return;
     }
     const newSelections = getCurrentPageSelection(entities, selectable);
+    setState(newState);
     const newValue = {
       selected: [...newSelections],
       all: false
@@ -175,16 +176,8 @@ export const useSelectableRows = (columns, entities, isMobile, selectMode, setSe
     return translate("Deselect all");
   }, [selectable, selectableState, state, translate]);
   const isEntityChecked = useCallback((entity, isNested) => isRowChecked(selections, state, selectable === null || selectable === void 0 ? void 0 : selectable.strategy, entity, isNested), [selections, state, selectable === null || selectable === void 0 ? void 0 : selectable.strategy]);
-  const hasSelectable = !!selectable;
-  const selectableCheckboxSelectsCurrentPage = selectable === null || selectable === void 0 ? void 0 : selectable.checkboxSelectsCurrentPage;
-  const selectableTurnOffSelectAll = selectable === null || selectable === void 0 ? void 0 : selectable.turnOffSelectAll;
-  const selectableCheckboxInHeader = selectable === null || selectable === void 0 ? void 0 : selectable.checkboxInHeader;
-  const selectableSelectionLimit = selectable === null || selectable === void 0 ? void 0 : selectable.selectionLimit;
-  const selectableHeader = selectable === null || selectable === void 0 ? void 0 : selectable.header;
-  const checkboxEmitsCurrentPage = selectableCheckboxSelectsCurrentPage !== null && selectableCheckboxSelectsCurrentPage !== void 0 ? selectableCheckboxSelectsCurrentPage : selectableTurnOffSelectAll;
-  const checkboxInHeaderValue = selectableCheckboxInHeader !== undefined ? selectableCheckboxInHeader : selectableSelectionLimit !== undefined ? false : undefined;
   const wrapper = useMemo(() => {
-    if (!hasSelectable) {
+    if (!selectable) {
       return null;
     }
     return {
@@ -226,23 +219,23 @@ export const useSelectableRows = (columns, entities, isMobile, selectMode, setSe
           checked: state === SelectionState.CurrentPage || state === SelectionState.All,
           indeterminate: state === SelectionState.Partial,
           onChange: newValue => {
-            const newState = newValue ? checkboxEmitsCurrentPage ? SelectionState.CurrentPage : SelectionState.All : SelectionState.None;
+            const newState = newValue ? selectable.turnOffSelectAll ? SelectionState.CurrentPage : SelectionState.All : SelectionState.None;
             setState(newState);
             onChangeSelectionState(newState);
           },
           calculateSelectionState: () => selectableState,
-          checkboxInHeader: checkboxInHeaderValue,
-          header: selectableHeader,
+          checkboxInHeader: selectable.checkboxInHeader !== undefined ? selectable.checkboxInHeader : selectable.selectionLimit !== undefined ? false : undefined,
+          header: selectable.header,
           onSelect: newState => {
             setState(newState);
             onChangeSelectionState(newState);
           },
-          turnOffSelectAll: selectableTurnOffSelectAll
+          turnOffSelectAll: selectable.turnOffSelectAll
         });
         return cell;
       }
     };
-  }, [checkboxDisabled, checkboxTitle, checkboxVisible, headerTitle, onChangeSelectionState, onSelectListener, hasSelectable, checkboxEmitsCurrentPage, checkboxInHeaderValue, selectableHeader, selectableTurnOffSelectAll, selectableState, state, isMobile, checkboxPlaceholder, isEntityChecked]);
+  }, [checkboxDisabled, checkboxTitle, checkboxVisible, headerTitle, onChangeSelectionState, onSelectListener, selectable, selectableState, state, isMobile, checkboxPlaceholder, isEntityChecked]);
   const selectableFeedWrapper = useCallback((primaryData, secondaryData, entity, isNested) => {
     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     if (!entity) {

package/esm/table/table.js

@@ -175,6 +175,12 @@ const TableInner = ({
       selected: []
     });
   }, [selectable]);
+  const selectAll = useCallback(() => {
+    selectable === null || selectable === void 0 ? void 0 : selectable.onSelect({
+      all: true,
+      selected: []
+    });
+  }, [selectable]);
   const [activeIdInternal, setActiveInternal] = useState(undefined);
   const activeId = active !== undefined ? active : activeIdInternal;
   const onClickInternal = useCallback(id => setActiveInternal(id === activeIdInternal ? undefined : id), [activeIdInternal, setActiveInternal]);
@@ -191,7 +197,7 @@ const TableInner = ({
     detailPanel,
     footer,
     other
-  } = useTableChildren(children, isMobile, selectionQty, ((_c = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _c === void 0 ? void 0 : _c.all) || false, clearSelection, activeId, gridRef, onCloseDetailPanel);
+  } = useTableChildren(children, isMobile, selectionQty, ((_c = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _c === void 0 ? void 0 : _c.all) || false, clearSelection, selectAll, selectable === null || selectable === void 0 ? void 0 : selectable.turnOffSelectAll, activeId, gridRef, onCloseDetailPanel);
   const hasDetailPanel = !!detailPanel;
   const shouldEnableRowClick = hasDetailPanel || !!onClick;
   const activeIdForRow = shouldEnableRowClick ? activeId : undefined;

package/esm/tooltip/tooltip.d.ts

@@ -10,6 +10,7 @@ interface ITooltip extends IZenComponentProps {
     }>;
     alignment?: TAlignment;
     triggerClassName?: string;
+    triggerAriaLabel?: string;
     mobileTitle?: string;
     /**
      * @deprecated
@@ -32,5 +33,5 @@ interface ITooltip extends IZenComponentProps {
      */
     mobileSheetTitle?: ReactElement | string;
 }
-export declare const Tooltip: ({ trigger, triggerClassName, className, alignment, children, mobileSheetTitle, mobileTitle }: ITooltip) => import("react/jsx-runtime").JSX.Element;
+export declare const Tooltip: ({ trigger, triggerClassName, triggerAriaLabel, className, alignment, children, mobileSheetTitle, mobileTitle }: ITooltip) => import("react/jsx-runtime").JSX.Element;
 export {};