@geotab/zenith 3.10.0-beta.1 → 3.10.0-beta.2

package/dist/dropdownRaw/dropdownList.js

@@ -174,33 +174,6 @@ injectString("zh-Hans", "Apply", "\u5E94\u7528");
 injectString("zh-TW", "Apply", "\u5957\u7528");
 injectString("ro-RO", "Apply", "Aplica\u021Bi");
 injectString("ar-SA", "Apply", "\u062A\u0637\u0628\u064A\u0642");
-injectString("cs", "Deselect all", "Zru\u0161it v\xFDb\u011Br v\u0161ech");
-injectString("da-DK", "Deselect all", "Frav\xE6lg alle");
-injectString("de", "Deselect all", "Auswahl f\xFCr alle aufheben");
-injectString("en", "Deselect all", "Deselect all");
-injectString("es", "Deselect all", "Deseleccionar todo");
-injectString("fi-FI", "Deselect all", "Poista kaikki valinnat");
-injectString("fr", "Deselect all", "D\xE9s\xE9lectionner tout");
-injectString("fr-FR", "Deselect all", "D\xE9s\xE9lectionner tout");
-injectString("hu-HU", "Deselect all", "Ne v\xE1lassz ki semmit.");
-injectString("id", "Deselect all", "Batalkan pilih semua");
-injectString("it", "Deselect all", "Deselezionare tutto");
-injectString("ja", "Deselect all", "\u3059\u3079\u3066\u3092\u9078\u629E\u89E3\u9664");
-injectString("ko-KR", "Deselect all", "\uBAA8\uB450 \uC120\uD0DD \uCDE8\uC18C");
-injectString("ms", "Deselect all", "Nyahpilih semua");
-injectString("nb-NO", "Deselect all", "Fjern alle valg");
-injectString("nl", "Deselect all", "Alles deselecteren");
-injectString("pl", "Deselect all", "Usu\u0144 wyb\xF3r wszystkich");
-injectString("pt-BR", "Deselect all", "Desmarcar tudo");
-injectString("pt-PT", "Deselect all", "Desmarcar tudo");
-injectString("sk-SK", "Deselect all", "Zru\u0161 v\xFDber v\u0161etk\xFDch.");
-injectString("sv", "Deselect all", "Avmarkera alla");
-injectString("th", "Deselect all", "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01\u0E01\u0E32\u0E23\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14");
-injectString("tr", "Deselect all", "T\xFCm\xFCn\xFCn se\xE7imini iptal et");
-injectString("zh-Hans", "Deselect all", "\u53D6\u6D88\u5168\u9009");
-injectString("zh-TW", "Deselect all", "\u53D6\u6D88\u5168\u9078");
-injectString("ro-RO", "Deselect all", "Deselecta\u021Bi tot");
-injectString("ar-SA", "Deselect all", "\u0625\u0644\u063A\u0627\u0621 \u062A\u062D\u062F\u064A\u062F \u0627\u0644\u0643\u0644");
 injectString("cs", "Select all", "Vybrat v\u0161e");
 injectString("da-DK", "Select all", "V\xE6lg alle");
 injectString("de", "Select all", "Alle ausw\xE4hlen");
@@ -359,7 +332,8 @@ const DropdownList = ({
   onSelect,
   onSingleSelect,
   listData,
-  isAllSelected,
+  isSelectAllActive,
+  shouldBlockItems,
   backButtonName,
   width,
   minWidth,
@@ -388,7 +362,7 @@ const DropdownList = ({
   const internalListId = (0, react_1.useId)();
   const selectListId = listId || internalListId;
   const handleSelectAllClick = () => {
-    onSelectAllClick(isAllSelected);
+    onSelectAllClick(isSelectAllActive === true);
   };
   const handleBackButtonKeyDown = (0, react_1.useCallback)(event => {
     if (event.key === "ArrowLeft") {
@@ -416,13 +390,14 @@ const DropdownList = ({
     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     forceSelection ? onSingleSelect(false, newActiveEl || activeValue) : onSingleSelect(false, newActiveEl);
   }, [activeValue, forceSelection, onSingleSelect]);
-  const selectButtonLabel = isAllSelected ? translate("Deselect all") : translate("Select all");
-  const getActionButton = (label, title, icon, isDisabled, clickHandler, size, onKeyDown) => (0, jsx_runtime_1.jsx)("button", {
+  const selectButtonLabel = translate("Select all");
+  const getActionButton = (label, title, icon, isDisabled, clickHandler, size, onKeyDown, isSelected) => (0, jsx_runtime_1.jsx)("button", {
     type: "button",
     disabled: isDisabled,
     onClick: clickHandler,
     onKeyDown: onKeyDown,
-    className: "zen-dropdown-list__item zen-dropdown-list__item--interactive zen-dropdown-list__action-button zen-dropdown-list__action-button-back",
+    "aria-pressed": isSelected,
+    className: (0, classNames_1.classNames)(["zen-dropdown-list__item zen-dropdown-list__item--interactive zen-dropdown-list__action-button zen-dropdown-list__action-button-back", isSelected ? "zen-dropdown-list__action-button--selected" : ""]),
     title: title,
     children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, {
       children: [react_1.default.createElement(icon, {
@@ -458,11 +433,15 @@ const DropdownList = ({
       });
       return values;
     };
+    const multiselectOptions = shouldBlockItems ? listData.map(item => Object.assign(Object.assign({}, item), {
+      blocked: true,
+      checked: false
+    })) : listData;
     return (0, jsx_runtime_1.jsx)("div", {
       className: "zen-dropdown-list__elements",
       ref: listElementRef,
       children: isMultiselect ? (0, jsx_runtime_1.jsx)(checkboxListWithAction_1.CheckboxListWithAction, {
-        options: listData,
+        options: multiselectOptions,
         label: "",
         onChange: handleChange,
         onClick: handleClick
@@ -478,7 +457,7 @@ const DropdownList = ({
         value: createValue(listData, activeValue)
       })
     });
-  }, [listElementRef, isMultiselect, listData, handleChange, handleClick, handleSingleChange, translate, selectListId, forceSelection, activeValue]);
+  }, [listElementRef, isMultiselect, shouldBlockItems, listData, handleChange, handleClick, handleSingleChange, translate, selectListId, forceSelection, activeValue]);
   return (0, jsx_runtime_1.jsxs)("div", Object.assign({
     className: (0, classNames_1.classNames)(["zen-dropdown-list", driveComponentClass || ""])
   }, styleWidth, {
@@ -496,7 +475,7 @@ const DropdownList = ({
     }) : null, backButtonName ? (0, jsx_runtime_1.jsx)("div", {
       className: "zen-dropdown-list__item-wrapper",
       children: getActionButton(backButtonName, translate("Back"), iconBackArrow_1.IconBackArrow, false, onBackButtonClick, "large", handleBackButtonKeyDown)
-    }) : null, hasSelectAllButton ? getActionButton(selectButtonLabel, selectButtonLabel, iconCheckRadio_1.IconCheckRadio, !!isSelectAllButtonDisable, handleSelectAllClick, isDrive ? "huger" : "huge") : null, listDataComponent, isWithFooter ? (0, jsx_runtime_1.jsxs)("div", {
+    }) : null, hasSelectAllButton ? getActionButton(selectButtonLabel, selectButtonLabel, iconCheckRadio_1.IconCheckRadio, !!isSelectAllButtonDisable, handleSelectAllClick, isDrive ? "huger" : "huge", undefined, isSelectAllActive) : null, listDataComponent, isWithFooter ? (0, jsx_runtime_1.jsxs)("div", {
       className: "zen-dropdown-list__footer",
       children: [(0, jsx_runtime_1.jsx)(button_1.Button, {
         onClick: isMultiselect ? onClearClick : handleClearClick,
@@ -525,4 +504,4 @@ const DropdownList = ({
   }));
 };
 exports.DropdownList = DropdownList;
-exports.TRANSLATIONS = ["Select all", "Deselect all", "Clear", "Back", "No data"];
+exports.TRANSLATIONS = ["Select all", "Clear", "Back", "No data"];

package/dist/dropdownRaw/dropdownRaw.js

@@ -399,23 +399,6 @@ const DropdownRaw = props => {
       payload: state.currentId || state.rootId
     });
   }, [isFullSelectionMode, state.currentId, state.rootId]);
-  const handleSelectAllInSearch = (0, react_1.useCallback)(isAllSelect => {
-    if (isFullSelectionMode && state.isAllSelected) {
-      dispatchState({
-        type: stateActionType_1.StateActionType.DeselectItemsFromAllSelected,
-        payload: undefined
-      });
-      return;
-    }
-    const dataForChange = (0, dropdownHelper_1.getDataForChange)((0, dropdownHelper_1.getListDataWithDisabled)(state.listData, state.isNestedList), state.selectedIds, isAllSelect);
-    dispatchState({
-      type: stateActionType_1.StateActionType.ChangeBulkSelection,
-      payload: {
-        itemsIds: dataForChange,
-        value: !isAllSelect
-      }
-    });
-  }, [isFullSelectionMode, state.isAllSelected, state.listData, state.isNestedList, state.selectedIds]);
   const handleClearClick = (0, react_1.useCallback)(() => {
     var _a, _b;
     dispatchState({
@@ -862,13 +845,14 @@ const DropdownRaw = props => {
       });
     }
     if (state.showList) {
-      const isSearchMode = state.inputValue && !state.currentId;
+      const isSearchMode = Boolean(state.inputValue) && !state.currentId;
       const currentListData = (0, dropdownHelper_1.createListDataOptions)(state, translate, isSearchMode ? (0, dropdownHelper_1.sortDropdownItemArray)(state.listData, sortFn).slice(0, listLimit).filter(el => el.id !== state.rootId) :
       // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
       (0, dropdownHelper_1.sortDropdownItemArray)(((_b = state.groupsMap[state.currentId || state.rootId]) === null || _b === void 0 ? void 0 : _b.children) || [], sortFn).slice(0, listLimit) || [], multiselect, currentAllSelected);
+      const selectAllActiveForCurrentLevel = state.selectAllActiveForId === (state.currentId || state.rootId);
       return (0, jsx_runtime_1.jsx)(dropdownList_1.DropdownList, {
         onBackButtonClick: handleBackButtonClick,
-        onSelectAllClick: isSearchMode ? handleSelectAllInSearch : handleSelectAllClick,
+        onSelectAllClick: handleSelectAllClick,
         onClearClick: handleClearClick,
         onCancelClick: handleCancelClick,
         onApplyClick: handleApplyClick,
@@ -879,15 +863,17 @@ const DropdownRaw = props => {
         backButtonName: state.currentId && state.groupsMap[state.currentId] ? (0, groupsHelper_1.getGroupDescription)(state.groupsMap[state.currentId], translate) : undefined,
         filterName: isMobile ? undefined : filterName,
         isAllSelected: currentAllSelected ? currentAllSelected : isSearchMode ? (0, dropdownHelper_1.isEveryItemSelected)((0, dropdownHelper_1.getListDataWithDisabled)(state.listData, state.isNestedList), state.selectedIds) : currentAllSelected === undefined ? (0, dropdownHelper_1.isAllChildrenSelected)(state, state.currentId || state.rootId) : false,
+        isSelectAllActive: isFullSelectionMode ? currentAllSelected : selectAllActiveForCurrentLevel,
+        shouldBlockItems: !state.inputValue && !isFullSelectionMode && selectAllActiveForCurrentLevel,
         isMultiselect: multiselect,
         forceSelection: forceSelection,
         listData: currentListData,
         width: width || currentWidth === 180 ? undefined : currentWidth,
         minWidth: currentWidth,
-        hasSelectAllButton: selectAllButton && multiselect,
+        hasSelectAllButton: selectAllButton && multiselect && !state.inputValue,
         hasApplyButton: hasApplyButton,
         isApplyDisabled: memoizedIsApplyButtonDisabled,
-        isSelectAllButtonDisable: currentListData.length === 0 || isSearchMode !== "" && state.isNestedList && (0, dropdownHelper_1.isAllItemsHasOneParent)(state.listData.filter(el => el.id !== state.rootId), (((_c = state.groupsMap[state.rootId]) === null || _c === void 0 ? void 0 : _c.children) || []).map(el => el.id)),
+        isSelectAllButtonDisable: currentListData.length === 0 || isSearchMode && state.isNestedList && (0, dropdownHelper_1.isAllItemsHasOneParent)(state.listData.filter(el => el.id !== state.rootId), (((_c = state.groupsMap[state.rootId]) === null || _c === void 0 ? void 0 : _c.children) || []).map(el => el.id)),
         isClearButtonDisabled: memoizedIsClearButtonDisabled,
         isWithFooter: memoizedWithFooter && !isMobile,
         isMobile: isMobile,
@@ -899,7 +885,7 @@ const DropdownRaw = props => {
       });
     }
     return null;
-  }, [state, isLoading, isQueryMode, fetchState === null || fetchState === void 0 ? void 0 : fetchState.isLoading, fetchState === null || fetchState === void 0 ? void 0 : fetchState.error, handleClearClick, handleCancelClick, handleApplyClick, hasApplyButton, memoizedWithFooter, translate, sortFn, listLimit, multiselect, currentAllSelected, handleBackButtonClick, handleSelectAllInSearch, handleSelectAllClick, handleSelect, handleChangeCurrentId, handleSingleSelection, isMobile, filterName, forceSelection, width, selectAllButton, memoizedIsApplyButtonDisabled, memoizedIsClearButtonDisabled, isCheckboxMode, handleCheckboxChange, checkboxLabel, selectListId]);
+  }, [state, isLoading, isQueryMode, fetchState === null || fetchState === void 0 ? void 0 : fetchState.isLoading, fetchState === null || fetchState === void 0 ? void 0 : fetchState.error, handleClearClick, handleCancelClick, handleApplyClick, hasApplyButton, memoizedWithFooter, translate, sortFn, listLimit, multiselect, currentAllSelected, handleBackButtonClick, handleSelectAllClick, handleSelect, handleChangeCurrentId, handleSingleSelection, isMobile, filterName, forceSelection, width, selectAllButton, memoizedIsApplyButtonDisabled, memoizedIsClearButtonDisabled, isCheckboxMode, handleCheckboxChange, checkboxLabel, selectListId, isFullSelectionMode]);
   const currentStringFromSelected = isFullSelectionMode && hasApplyButton && state.globalIsAllSelected || isFullSelectionMode && !hasApplyButton && state.isAllSelected ? (0, dropdownHelper_1.getStringFromAllSelected)(state.groupsMap, translate, state.rootId) : (0, dropdownHelper_1.getStringFromSelected)(hasApplyButton ? state.globalSelectedIds : state.selectedIds, state.groupsMapSelected, translate, state.rootId);
   const memoizedCurrentSelection = (0, react_1.useMemo)(() => showSelection && !state.inputValue ? currentStringFromSelected : "", [showSelection, state.inputValue, currentStringFromSelected]);
   const parentTriggerWidth = ((_b = comboboxRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width) || 420;
@@ -997,4 +983,4 @@ const DropdownRaw = props => {
 };
 exports.DropdownRaw = DropdownRaw;
 exports.DropdownRaw.displayName = "DropdownRaw";
-exports.TRANSLATIONS = ["Filter by group", "Open filter", "Clear search", "Select all", "Deselect all", "Clear", "Back", "No data"];
+exports.TRANSLATIONS = ["Filter by group", "Open filter", "Clear search", "Select all", "Clear", "Back", "No data"];

package/dist/dropdownRaw/stateReducer/stateReducer.d.ts

@@ -25,6 +25,7 @@ export interface IDropdownState {
     listLimit: number;
     resultsExceedListLimit?: boolean;
     isAllSelected?: boolean;
+    selectAllActiveForId?: string;
     globalIsAllSelected?: boolean;
     defaultValueIsAllSelected?: boolean;
     isChecked?: boolean;

package/dist/dropdownRaw/stateReducer/stateReducer.js

@@ -77,10 +77,12 @@ function stateReducer(state, action) {
             }
             const isCurrentListNested = Object.keys(updatedGroupsMap).length > 0 &&
                 (updatedGroupsMap[exports.ROOT_GROUP_ID].children || []).some(el => el.children && el.children.length);
-            state.groupsMap = updatedGroupsMap;
-            const additionalStateUpdates = (0, stateReducerHelper_1.updateAllSelectedStateValueBasedOnTotalSelected)(state, state.selectedIds.length - newNamelessIds.size);
+            const groupsMapLength = Object.keys(updatedGroupsMap).length - 1;
+            const newResultsExceedListLimit = groupsMapLength >= state.listLimit;
+            const selectedInNewMap = state.selectedIds.filter(id => id in updatedGroupsMap).length;
+            const newIsAllSelected = (0, stateReducerHelper_1.computeIsAllSelected)(state.isAllSelected, state.isFullSelectionMode, newResultsExceedListLimit, groupsMapLength, selectedInNewMap);
             const rootId = (0, stateReducerHelper_1.getRootId)(updatedGroupsMap, exports.ROOT_GROUP_ID, state.firstParentNodeIsVisible);
-            return Object.assign(Object.assign(Object.assign({}, state), { rootId: rootId || exports.ROOT_GROUP_ID, namelessIds: newNamelessIds, isNestedList: state.isNestedList ? state.isNestedList : isCurrentListNested, resultsExceedListLimit: Object.keys(updatedGroupsMap).length - 1 >= state.listLimit }), additionalStateUpdates);
+            return Object.assign(Object.assign({}, state), { groupsMap: updatedGroupsMap, rootId: rootId || exports.ROOT_GROUP_ID, namelessIds: newNamelessIds, isNestedList: state.isNestedList ? state.isNestedList : isCurrentListNested, resultsExceedListLimit: newResultsExceedListLimit, isAllSelected: newIsAllSelected });
         }
         case stateActionType_1.StateActionType.SetListData: {
             state.selectedIds.forEach(id => {
@@ -105,9 +107,9 @@ function stateReducer(state, action) {
         case stateActionType_1.StateActionType.SetIsOpenCombo:
             return Object.assign(Object.assign({}, state), { isOpenCombo: payload });
         case stateActionType_1.StateActionType.ResetSelection:
-            return Object.assign(Object.assign({}, state), { selectedIds: [...state.defaultValue], isAllSelected: state.defaultValueIsAllSelected, isChecked: typeof state.isChecked === "boolean" ? state.defaultValueIsChecked || false : undefined });
+            return Object.assign(Object.assign({}, state), { selectedIds: [...state.defaultValue], isAllSelected: state.defaultValueIsAllSelected, isChecked: typeof state.isChecked === "boolean" ? state.defaultValueIsChecked || false : undefined, selectAllActiveForId: undefined });
         case stateActionType_1.StateActionType.ResetStateToGlobal:
-            return Object.assign(Object.assign({}, state), { selectedIds: [...state.globalSelectedIds], isAllSelected: state.globalIsAllSelected, isChecked: state.globalIsChecked });
+            return Object.assign(Object.assign({}, state), { selectedIds: [...state.globalSelectedIds], isAllSelected: state.globalIsAllSelected, isChecked: state.globalIsChecked, selectAllActiveForId: undefined });
         case stateActionType_1.StateActionType.NothingToShow:
             return Object.assign(Object.assign({}, state), { showWaiting: false, showEmptyList: false, showList: false });
         case stateActionType_1.StateActionType.Show:
@@ -223,8 +225,7 @@ function stateReducer(state, action) {
                         state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
                 }
             });
-            const additionalStateUpdates = (0, stateReducerHelper_1.updateAllSelectedStateValueBasedOnTotalSelected)(state, currentSelectedIds.size);
-            return Object.assign(Object.assign(Object.assign({}, state), { selectedIds: Array.from(currentSelectedIds) }), additionalStateUpdates);
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(currentSelectedIds), selectAllActiveForId: undefined, isAllSelected: state.isAllSelected });
         }
         case stateActionType_1.StateActionType.ChangeBulkSelection: {
             const { itemsIds, value } = payload;
@@ -257,8 +258,7 @@ function stateReducer(state, action) {
                         state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
                 }
             });
-            const additionalStateUpdates = (0, stateReducerHelper_1.updateAllSelectedStateValueBasedOnTotalSelected)(state, currentSelectedIds.size);
-            return Object.assign(Object.assign(Object.assign({}, state), { selectedIds: Array.from(currentSelectedIds) }), additionalStateUpdates);
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(currentSelectedIds), selectAllActiveForId: undefined });
         }
         case stateActionType_1.StateActionType.SelectAllChildren: {
             const currentEl = state.groupsMap[payload];
@@ -295,7 +295,7 @@ function stateReducer(state, action) {
                         state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
                 }
             });
-            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected) });
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected), selectAllActiveForId: payload });
         }
         case stateActionType_1.StateActionType.DeselectItemsFromAllSelected: {
             const currentEl = state.groupsMap[state.rootId];
@@ -319,7 +319,7 @@ function stateReducer(state, action) {
                         state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
                 }
             });
-            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected), isAllSelected: state.isFullSelectionMode ? false : undefined });
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected), isAllSelected: state.isFullSelectionMode ? false : undefined, selectAllActiveForId: undefined });
         }
         case stateActionType_1.StateActionType.ToggleValueForAllSelected: {
             const currentEl = state.groupsMap[state.rootId];
@@ -338,8 +338,7 @@ function stateReducer(state, action) {
                 }
             });
             const updatedIsAllSelectedValue = state.isFullSelectionMode ? !state.isAllSelected : undefined;
-            const additionalStateUpdates = (0, stateReducerHelper_1.updateAllSelectedStateValueBasedOnTotalSelected)(state, newSelected.size);
-            return Object.assign(Object.assign(Object.assign({}, state), { selectedIds: state.isAllSelected ? Array.from(newSelected) : [], isAllSelected: updatedIsAllSelectedValue }), additionalStateUpdates);
+            return Object.assign(Object.assign({}, state), { selectedIds: state.isAllSelected ? Array.from(newSelected) : [], isAllSelected: updatedIsAllSelectedValue });
         }
         case stateActionType_1.StateActionType.DeselectAllChildren: {
             const childrenForDeselect = [];
@@ -351,7 +350,7 @@ function stateReducer(state, action) {
             });
             const newSelected = new Set(state.selectedIds);
             childrenForDeselect.forEach(childId => newSelected.delete(childId));
-            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected) });
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected), selectAllActiveForId: undefined });
         }
         case stateActionType_1.StateActionType.SetFirstParentNodeIsVisible: {
             if (state.firstParentNodeIsVisible === payload) {

package/dist/dropdownRaw/stateReducer/stateReducerHelper.d.ts

@@ -1,6 +1,5 @@
-import { IDropdownState } from "./stateReducer";
 import { IDropdownRawItem } from "../types";
 import { IGroupTree, ITypedHash } from "../../groupsFilterRaw/groupsFilterInterfaces";
 export declare function getChildList(childArr: IDropdownRawItem[] | undefined): IDropdownRawItem[];
-export declare const updateAllSelectedStateValueBasedOnTotalSelected: (state: IDropdownState, totalSelected: number) => Partial<Pick<IDropdownState, "isAllSelected">>;
+export declare const computeIsAllSelected: (currentIsAllSelected: boolean | undefined, isFullSelectionMode: boolean, resultsExceedListLimit: boolean | undefined, groupsMapLength: number, selectedCount: number) => boolean | undefined;
 export declare const getRootId: (groupsMap: ITypedHash<IGroupTree>, rootIdKey: string, firstParentNodeIsVisible?: boolean) => string | undefined;

package/dist/dropdownRaw/stateReducer/stateReducerHelper.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getRootId = exports.updateAllSelectedStateValueBasedOnTotalSelected = exports.getChildList = void 0;
+exports.getRootId = exports.computeIsAllSelected = exports.getChildList = void 0;
 const groupsHelper_1 = require("../../groupsFilterRaw/groupsHelper");
 function getChildList(childArr) {
     const list = [];
@@ -17,17 +17,10 @@ function getChildList(childArr) {
     return list;
 }
 exports.getChildList = getChildList;
-const updateAllSelectedStateValueBasedOnTotalSelected = (state, totalSelected) => {
-    const additionalStateUpdates = {};
-    const groupsMapLength = Object.keys(state.groupsMap).length - 1;
-    if (!state.resultsExceedListLimit && !state.isAllSelected && state.isFullSelectionMode && groupsMapLength > 0) {
-        if (totalSelected >= groupsMapLength) {
-            additionalStateUpdates.isAllSelected = true;
-        }
-    }
-    return additionalStateUpdates;
-};
-exports.updateAllSelectedStateValueBasedOnTotalSelected = updateAllSelectedStateValueBasedOnTotalSelected;
+const computeIsAllSelected = (currentIsAllSelected, isFullSelectionMode, resultsExceedListLimit, groupsMapLength, selectedCount) => !resultsExceedListLimit && currentIsAllSelected === false && isFullSelectionMode && groupsMapLength > 0 && selectedCount >= groupsMapLength
+    ? true
+    : currentIsAllSelected;
+exports.computeIsAllSelected = computeIsAllSelected;
 const getRootId = (groupsMap, rootIdKey, firstParentNodeIsVisible) => {
     var _a;
     if (Object.keys(groupsMap).length === 0) {

package/dist/headerTitle/headerTitle.d.ts

@@ -3,6 +3,14 @@ import "./headerTitle.less";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import { IBetaPillActions } from "../betaPill/betaPill";
 export declare const HeaderTitleDisplayName = "PageHeader";
+/**
+ * @internal - temporary escape hatch
+ * @deprecated DO NOT USE in external consumers
+ */
+export interface IHeaderTitleInternal {
+    betaPillName?: string;
+    betaPillDescription?: string;
+}
 export interface IHeaderTitle extends IZenComponentProps {
     id?: string;
     pageName: string;
@@ -16,11 +24,9 @@ export interface IHeaderTitle extends IZenComponentProps {
     allowBookmarkWithBack?: boolean;
     feedBackAction?: IBetaPillActions;
     betaOptionAction?: IBetaPillActions;
-    betaPillName?: string;
-    betaPillDescription?: string;
 }
 export declare const HeaderTitle: {
-    ({ id, children, className, pageName, subline, isBeta, isMobile: isMobileProp, allowBookmarkWithBack, feedBackAction, betaOptionAction, betaPillName, betaPillDescription }: IHeaderTitle): import("react/jsx-runtime").JSX.Element;
+    (props: IHeaderTitle): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export declare const TRANSLATIONS: string[];

package/dist/headerTitle/headerTitle.js

@@ -10,7 +10,8 @@ const useDriveClassName_1 = require("../utils/theme/useDriveClassName");
 const headerBack_1 = require("../header/headerBack");
 const bookmark_1 = require("../bookmark/bookmark");
 exports.HeaderTitleDisplayName = "PageHeader";
-const HeaderTitle = ({ id, children, className, pageName, subline, isBeta, isMobile: isMobileProp, allowBookmarkWithBack, feedBackAction, betaOptionAction, betaPillName, betaPillDescription }) => {
+const HeaderTitle = (props) => {
+    const { id, children, className, pageName, subline, isBeta, isMobile: isMobileProp, allowBookmarkWithBack, feedBackAction, betaOptionAction, betaPillName, betaPillDescription } = props;
     const isMobile = (0, useMobile_1.useMobile)();
     const driveMainLineClassName = (0, useDriveClassName_1.useDriveClassName)("zen-page-header__main-line");
     const drivePageNameClassName = (0, useDriveClassName_1.useDriveClassName)("zen-page-header__page-name");
@@ -33,7 +34,7 @@ const HeaderTitle = ({ id, children, className, pageName, subline, isBeta, isMob
         });
         return [b, b.length && !allowBookmarkWithBack ? o.filter(el => el.type !== bookmark_1.Bookmark) : o];
     }, [children, allowBookmarkWithBack]);
-    return ((0, jsx_runtime_1.jsxs)("header", { id: id, className: clsNames, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-page-header__main-line", driveMainLineClassName || ""]), children: [back.length ? back : null, pageName ? (0, jsx_runtime_1.jsx)("h1", { className: (0, classNames_1.classNames)(["zen-page-header__page-name", drivePageNameClassName || ""]), children: pageName }) : null, isBeta ? ((0, jsx_runtime_1.jsx)(betaPill_1.BetaPill, { feedbackAction: feedBackAction, betaOptionAction: betaOptionAction, name: betaPillName, description: betaPillDescription, className: "zen-page-header__beta" })) : null, other.length ? other : null] }), subline || ""] }));
+    return ((0, jsx_runtime_1.jsxs)("header", { id: id, className: clsNames, children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-page-header__main-line", driveMainLineClassName || ""]), children: [back.length ? back : null, pageName ? (0, jsx_runtime_1.jsx)("h1", { className: (0, classNames_1.classNames)(["zen-page-header__page-name", drivePageNameClassName || ""]), children: pageName }) : null, isBeta ? ((0, jsx_runtime_1.jsx)(betaPill_1.BetaPill, Object.assign({ feedbackAction: feedBackAction, betaOptionAction: betaOptionAction, className: "zen-page-header__beta" }, { name: betaPillName, description: betaPillDescription }))) : null, other.length ? other : null] }), subline || ""] }));
 };
 exports.HeaderTitle = HeaderTitle;
 exports.HeaderTitle.displayName = exports.HeaderTitleDisplayName;

package/dist/index.css

@@ -3031,6 +3031,10 @@ html:lang(ar) .zen-title-text--drive {
   font-family: var(--arabic-font-family);
 }
 .zen-card-title {
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  font-weight: inherit;
   display: flex;
   gap: 8px;
   align-items: center;
@@ -4884,10 +4888,12 @@ html:lang(ar) .zen-checkbox__label-text {
 .zen-checkbox:has(.zen-checkbox__input:disabled) .zen-checkbox__label {
   fill: var(--text-reverse-primary);
   color: var(--text-button-disabled);
+  cursor: default;
 }
 .zen-checkbox:has(.zen-checkbox__input:disabled) .zen-checkbox__box {
   border-color: var(--borders-general);
   background-color: var(--backgrounds-field-disabled);
+  cursor: default;
 }
 .zen-checkbox:has(.zen-checkbox__input:disabled:checked) .zen-checkbox__box,
 .zen-checkbox:has(.zen-checkbox__input:disabled:indeterminate) .zen-checkbox__box {
@@ -7609,6 +7615,11 @@ html:lang(ar) .zen-checkbox-list-with-action__label {
   color: var(--text-hyperlink);
   fill: var(--text-hyperlink);
 }
+.zen-checkbox-list-with-action__label--action:disabled {
+  cursor: default;
+  color: var(--text-disabled);
+  fill: var(--text-disabled);
+}
 .zen-checkbox-list-with-action__label-text {
   display: flex;
   flex-grow: 1;
@@ -7824,8 +7835,8 @@ html:lang(ar) .zen-dropdown-list__label {
 .zen-dropdown-list__item--interactive:not(:disabled) {
   cursor: pointer;
 }
-.zen-dropdown-list__item--interactive:not(:disabled):hover,
-.zen-dropdown-list__item--interactive:not(:disabled):focus {
+.zen-dropdown-list__item--interactive:not(:disabled):hover:not(.zen-dropdown-list__action-button--selected),
+.zen-dropdown-list__item--interactive:not(:disabled):focus:not(.zen-dropdown-list__action-button--selected) {
   color: var(--text-primary);
   fill: var(--action-secondary--default);
   outline: none;
@@ -7895,6 +7906,27 @@ html:lang(ar) .zen-dropdown-list__action-label {
 .zen-dropdown-list__action-button:disabled svg {
   fill: var(--text-button-disabled);
 }
+.zen-dropdown-list__action-button--selected {
+  background-color: var(--action-primary--default);
+}
+.zen-dropdown-list__action-button--selected.zen-dropdown-list__item--interactive:not(:disabled):hover,
+.zen-dropdown-list__action-button--selected.zen-dropdown-list__item--interactive:not(:disabled):focus {
+  background-color: var(--action-primary--default);
+  fill: var(--text-reverse-primary);
+  color: var(--text-reverse-primary);
+}
+.zen-dropdown-list__action-button--selected.zen-dropdown-list__item--interactive:not(:disabled):focus-visible {
+  border-color: var(--backgrounds-content-1);
+  outline: 1px solid var(--borders-form-field--active);
+  outline-offset: 2px;
+}
+.zen-dropdown-list__action-button--selected .zen-dropdown-list__icon {
+  color: var(--text-reverse-primary);
+  fill: var(--text-reverse-primary);
+}
+.zen-dropdown-list__action-button--selected .zen-dropdown-list__action-label {
+  color: var(--text-reverse-primary);
+}
 .zen-dropdown-list__footer {
   display: flex;
   justify-content: flex-start;

package/dist/index.d.ts

@@ -20,7 +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 { type THeadingTag, Title } from "./card/components/title";
 export { TitleLink } from "./card/components/titleLink";
 export { getDefaultFullWidthValue } from "./card/helpers/getDefaultFullWidthValue";
 export { getIconFromStatus } from "./card/helpers/getIconFromStatus";
@@ -774,6 +774,8 @@ export { HeaderButtonsProvider } from "./utils/headerButtons/headerButtonsProvid
 export { getNewFocusableItem, getFirstFocusableItem } from "./utils/keyboardHelpers";
 export { LanguageProvider } from "./utils/localization/languageProvider";
 export { dictionaries, injectString } from "./utils/localization/translationsDictionary";
+export { directionContext } from "./utils/localization/directionContext";
+export type { TTextDirection } from "./utils/localization/getTextDirection";
 export { useDirection } from "./utils/localization/useDirection";
 export { useLanguage } from "./utils/localization/useLanguage";
 export { ThemeDark } from "./utils/theme/themeDark";

package/dist/index.js

@@ -17,7 +17,7 @@ exports.IconShield3 = exports.IconShield2 = exports.IconShield = exports.IconSha
 exports.IconVolumeHalf = exports.IconVolumeFull = exports.IconVolumeDown = exports.IconVoice = exports.IconVisitPage = exports.IconVideoReplay = exports.IconVideo2 = exports.IconVideo = exports.IconUsbHub = exports.IconUsb = exports.IconUpload = exports.IconUnlocked = exports.IconUndock = exports.IconUndo2 = exports.IconUndo = exports.IconUnderline = exports.IconUmbrella = exports.IconTrailer = exports.IconThumbsUp = exports.IconThumbsDown = exports.IconThermometer = exports.IconThermograph = exports.IconTextSize = exports.IconTelevision2 = exports.IconTelevision = exports.IconTarget3 = exports.IconTarget2 = exports.IconTarget = exports.IconTachographTimeCard = exports.IconTachograph = exports.IconTable = exports.IconSupport = exports.IconSun = exports.IconStrikeThrough = exports.IconStore = exports.IconStorage = exports.IconStopwatch = exports.IconStarFilled = exports.IconStarAi = exports.IconStar = exports.IconSquare = exports.IconSpeaker = exports.IconSortVertical = exports.IconSortHorizontal = exports.IconSort2Vertical = exports.IconSort2Horizontal = exports.IconSmiley = exports.IconSign = exports.IconSidebar = exports.IconShield4 = void 0;
 exports.isButton = exports.findPrevFocusable = exports.findNextFocusable = exports.findLastFocusable = exports.findFirstFocusable = exports.Menu = exports.ControlledMenu = exports.isDragNotClick = exports.changeOrder = exports.ListItem = exports.List = exports.ItemData = exports.ItemCompact = exports.LineChartMini = exports.getDefaultDatasetStyle = exports.htmlLegendPlugin = exports.LEGEND_PLUGIN_ID = exports.LineChart = exports.useLayoutSize = exports.LayoutFullScreenProvider = exports.useLayoutFullScreen = exports.LayoutFullScreenElementProvider = exports.useLayoutFullScreenElement = exports.Layout = exports.ImageTapToUpload = exports.ImageNothingFound = exports.ImageNoMatchingAssets = exports.ImageLooking = exports.ImageCloudUpload = exports.ImageAdjustFilter = exports.IconZoom2 = exports.IconZoom = exports.IconZone = exports.IconYen = exports.IconWrite = exports.IconWrench = exports.IconWorld = exports.IconWorkday = exports.IconWifi2 = exports.IconWifi = exports.IconWhisper = exports.IconWebcam = exports.IconWatch2 = exports.IconWatch = exports.IconWarning = exports.IconWallet1 = exports.IconWallet = exports.IconVolumeOn = exports.IconVolumeOff = exports.IconVolumeMinimum = void 0;
 exports.SummaryTileBarDisplayName = exports.SummaryTileBar = exports.getTypeClassName = exports.SummaryTileTrigger = exports.SummaryTile = exports.SummaryTileDisplayName = exports.SummaryTileSize = exports.SummaryTileType = exports.Summary = exports.Summaries = exports.Stepper = exports.SortControl = exports.SortDirections = exports.Skeleton = exports.LazyContent = exports.SidePanel = exports.CUSTOM_POPUP_COMPONENT_CLASSNAME = exports.SidePanelCloseReason = exports.isChildPopup = exports.SelectField = exports.Select = exports.SearchInput = exports.Range = exports.RadioGroup = exports.Radio = exports.ProgressBar = exports.ProgreesBarSize = exports.ProgressBarType = exports.PrimaryIcon = exports.Popup = exports.PillExpandable = exports.Pill = exports.PaginationType = exports.Pagination = exports.PageLayout = exports.PageContentLayout = exports.PageHeaderMenu = exports.PageHeaderMenuDisplayName = exports.PageHeaderButton = exports.PageHeaderButtonDisplayName = exports.PageHeader = exports.PageHeaderDisplayName = exports.Notification = exports.getPredefinedFocusableItem = exports.DialogContentNew = exports.Modal = exports.MobileSheet = exports.MiniTabs = exports.MiniTabsSize = exports.isLink = void 0;
-exports.Waiting = exports.UserFormatProvider = exports.useDrive = exports.ThemeProvider = exports.ThemeDrive = exports.ThemeDark = exports.useLanguage = exports.useDirection = exports.injectString = exports.dictionaries = exports.LanguageProvider = exports.getFirstFocusableItem = exports.getNewFocusableItem = exports.HeaderButtonsProvider = exports.AbortablePromise = exports.Tooltip = exports.removeArrowClasses = exports.calculateArrowPosition = exports.ToggleButtonRaw = exports.ToggleButton = exports.Toast = exports.useToast = exports.TimePicker = exports.TextareaRaw = exports.Textarea = exports.TextInputRaw = exports.TextInput = exports.TextIconButton = exports.ButtonIconPosition = exports.Tabs = exports.TabsDisplayName = exports.ActionLinkColumn = exports.CheckboxColumn = exports.MainColumn = exports.ActionsColumn = exports.getSortableValue = exports.ColumnSortDirection = exports.getEmptySelection = exports.Table = exports.useNestedRows = exports.NestedData = exports.TabBarContent = exports.TabBar = void 0;
+exports.Waiting = exports.UserFormatProvider = exports.useDrive = exports.ThemeProvider = exports.ThemeDrive = exports.ThemeDark = exports.useLanguage = exports.useDirection = exports.directionContext = exports.injectString = exports.dictionaries = exports.LanguageProvider = exports.getFirstFocusableItem = exports.getNewFocusableItem = exports.HeaderButtonsProvider = exports.AbortablePromise = exports.Tooltip = exports.removeArrowClasses = exports.calculateArrowPosition = exports.ToggleButtonRaw = exports.ToggleButton = exports.Toast = exports.useToast = exports.TimePicker = exports.TextareaRaw = exports.Textarea = exports.TextInputRaw = exports.TextInput = exports.TextIconButton = exports.ButtonIconPosition = exports.Tabs = exports.TabsDisplayName = exports.ActionLinkColumn = exports.CheckboxColumn = exports.MainColumn = exports.ActionsColumn = exports.getSortableValue = exports.ColumnSortDirection = exports.getEmptySelection = exports.Table = exports.useNestedRows = exports.NestedData = exports.TabBarContent = exports.TabBar = void 0;
 /* eslint-disable max-len */
 var absolute_1 = require("./absolute/absolute");
 Object.defineProperty(exports, "Absolute", { enumerable: true, get: function () { return absolute_1.Absolute; } });
@@ -1663,6 +1663,8 @@ Object.defineProperty(exports, "LanguageProvider", { enumerable: true, get: func
 var translationsDictionary_1 = require("./utils/localization/translationsDictionary");
 Object.defineProperty(exports, "dictionaries", { enumerable: true, get: function () { return translationsDictionary_1.dictionaries; } });
 Object.defineProperty(exports, "injectString", { enumerable: true, get: function () { return translationsDictionary_1.injectString; } });
+var directionContext_1 = require("./utils/localization/directionContext");
+Object.defineProperty(exports, "directionContext", { enumerable: true, get: function () { return directionContext_1.directionContext; } });
 var useDirection_1 = require("./utils/localization/useDirection");
 Object.defineProperty(exports, "useDirection", { enumerable: true, get: function () { return useDirection_1.useDirection; } });
 var useLanguage_1 = require("./utils/localization/useLanguage");

package/dist/testHelpers/fakeFetch.d.ts

@@ -0,0 +1 @@
+export declare const fetchData: () => Promise<string>;

package/dist/testHelpers/fakeFetch.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fetchData = void 0;
+const zen_1 = require("../utils/zen");
+let loadTimeout = null;
+const fetchData = () => {
+    var _a;
+    loadTimeout && ((_a = zen_1.zen.clearTimeout) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, loadTimeout));
+    return new Promise((res, rej) => {
+        var _a;
+        loadTimeout = (_a = zen_1.zen.setTimeout) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, () => Math.random() > 0.5 ? res("Fetched Data") : rej(new Error("Error while fetching data")), 5000);
+    });
+};
+exports.fetchData = fetchData;

package/dist/testHelpers/geotab-axe/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference path="../../../testHelpers/geotab-axe/index.d.ts" />
+export {};

package/dist/testHelpers/geotab-axe/index.js

@@ -0,0 +1,81 @@
+"use strict";
+/// <reference path="./index.d.ts" />
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const axe_core_1 = __importDefault(require("axe-core"));
+const styled_output_1 = require("../styled-output");
+const domParser = new DOMParser();
+const lineBreak = "\n\n";
+const horizontalLine = "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500";
+const runAxe = (el) => new Promise(resolve => {
+    const parent = el.parentNode;
+    const sibling = el.nextSibling;
+    document === null || document === void 0 ? void 0 : document.body.appendChild(el);
+    axe_core_1.default.configure({
+        rules: [{
+                id: "target-size",
+                enabled: true
+            }],
+        checks: [
+            {
+                // color contrast checking doesnt work in a jsdom environment.
+                id: "color-contrast",
+                enabled: false
+            }
+        ]
+    });
+    axe_core_1.default.run(el, {}, (err, results) => {
+        if (err) {
+            throw err;
+        }
+        resolve(results);
+        parent ? parent.insertBefore(el, sibling) : document === null || document === void 0 ? void 0 : document.body.removeChild(el);
+    });
+});
+const toHtml = (str) => {
+    if (str.indexOf("<html") > -1) {
+        return domParser.parseFromString(str, "text/html").body;
+    }
+    const html = document === null || document === void 0 ? void 0 : document.createElement("template");
+    html.insertAdjacentHTML("afterbegin", str);
+    return html;
+};
+const formatViolations = (violations) => {
+    if (violations.length === 0) {
+        return [];
+    }
+    return violations.map(violation => {
+        const errorText = violation.nodes.map(node => {
+            const selector = node.target.join(", ");
+            const expectedText = `Availability violation for selector $('${selector}'):` + lineBreak;
+            return (expectedText +
+                (0, styled_output_1.stylize)(node.html, styled_output_1.Color.Gray) +
+                lineBreak +
+                (0, styled_output_1.stylize)(`---Explanation---`, styled_output_1.Color.Black, styled_output_1.BackgroundColor.White, styled_output_1.Style.Bold, styled_output_1.Style.Underline) +
+                lineBreak +
+                `${violation.help} (${violation.id})` +
+                lineBreak +
+                (0, styled_output_1.stylize)(node.failureSummary || "", styled_output_1.Color.Yellow) +
+                lineBreak + (violation.helpUrl
+                ? `You can find more about it here: \n${(0, styled_output_1.stylize)(violation.helpUrl, styled_output_1.Color.Blue)}`
+                : ""));
+        }).join(lineBreak);
+        return (errorText);
+    }).join(lineBreak + horizontalLine + lineBreak);
+};
+const toBeAccessible = async (element, errorMsg) => {
+    if (!element) {
+        return { pass: true, message: () => "ok" };
+    }
+    const html = element instanceof Node ? element : toHtml(element);
+    const results = await runAxe(html);
+    if (results.violations.length) {
+        const formatedViolations = formatViolations(results.violations);
+        const message = () => (errorMsg ? errorMsg + lineBreak : "") + formatedViolations;
+        return { pass: false, message };
+    }
+    return { pass: true, message: () => "ok" };
+};
+expect.extend({ toBeAccessible });

package/dist/testHelpers/jestRetry.js

@@ -0,0 +1,2 @@
+"use strict";
+jest.retryTimes(3, { logErrorsBeforeRetry: true });

package/dist/testHelpers/renderAsync.d.ts

@@ -0,0 +1,2 @@
+import { ReactNode } from "react";
+export declare const renderAsync: (component: ReactNode) => Promise<import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>>;

package/dist/testHelpers/renderAsync.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderAsync = void 0;
+const react_1 = require("react");
+const react_2 = require("@testing-library/react");
+const renderAsync = async (component) => (0, react_1.act)(async () => {
+    const result = (0, react_2.render)(component);
+    await Promise.resolve();
+    await Promise.resolve();
+    return result;
+});
+exports.renderAsync = renderAsync;

package/dist/testHelpers/setReadonlyHtmlProperty.d.ts

@@ -0,0 +1 @@
+export declare const setReadonlyHtmlProperty: (propName: keyof HTMLElement, values: Map<string, Required<HTMLElement>[keyof HTMLElement]>) => void;