@geotab/zenith 1.15.0 → 1.15.1

package/dist/dateInput/cutSeconds.js

@@ -11,4 +11,3 @@ const cutSeconds = (date) => {
     return d.toISOString();
 };
 exports.cutSeconds = cutSeconds;
-//# sourceMappingURL=cutSeconds.js.map

package/dist/dateInput/dateInput.js

@@ -94,4 +94,3 @@ exports.TRANSLATIONS = [
     "Clear",
     "Apply"
 ];
-//# sourceMappingURL=dateInput.js.map

package/dist/dateInput/getLabel.js

@@ -10,4 +10,3 @@ const getLabel = (value, dateFormat, timeFormat, translate, toLocalDateTime, tim
     return (0, formatDate_1.formatDate)(toLocalDateTime(value), format, translate);
 };
 exports.getLabel = getLabel;
-//# sourceMappingURL=getLabel.js.map

package/dist/dateInputInner/dateInputInner.js

@@ -193,4 +193,3 @@ exports.TRANSLATIONS = [
     "Start date",
     "End date"
 ];
-//# sourceMappingURL=dateInputInner.js.map

package/dist/dateInputInner/dateInputInnerControlBlock.js

@@ -22,4 +22,3 @@ exports.TRANSLATIONS = [
     "The date must be set",
     "The time must be set"
 ];
-//# sourceMappingURL=dateInputInnerControlBlock.js.map

package/dist/dateRange/dateRange.js

@@ -193,4 +193,3 @@ exports.TRANSLATIONS = [
     "Apply",
     "Reset"
 ];
-//# sourceMappingURL=dateRange.js.map

package/dist/dateRange/dateRangeUtils.js

@@ -293,4 +293,3 @@ const GET_DEFAULT_DATE_OPTIONS = (toLocalDateTime, translate, firstDayOfWeek, to
     (0, exports.GET_LAST_THREE_MONTH_OPTION)(toLocalDateTime, translate, toReverseOffsetDateTime)
 ];
 exports.GET_DEFAULT_DATE_OPTIONS = GET_DEFAULT_DATE_OPTIONS;
-//# sourceMappingURL=dateRangeUtils.js.map

package/dist/dateRangeInner/dateRangeInner.js

@@ -74,4 +74,3 @@ exports.TRANSLATIONS = [
     "Custom Date",
     "Custom Date and Time range"
 ];
-//# sourceMappingURL=dateRangeInner.js.map

package/dist/dateSelectionWrapper/dateSelectionWrapper.js

@@ -21,4 +21,3 @@ exports.TRANSLATIONS = [
     "Reset",
     "Apply"
 ];
-//# sourceMappingURL=dateSelectionWrapper.js.map

package/dist/dialog/dialog.js

@@ -38,4 +38,3 @@ const Dialog = ({ isOpen, children, isElementVisible }) => {
     return (0, react_dom_1.createPortal)(isOpen && (0, react_1.isValidElement)(children) ? createDialog(labeledId) : null, modalRoot, "ModalPortal");
 };
 exports.Dialog = Dialog;
-//# sourceMappingURL=dialog.js.map

package/dist/dialog/dialogContent.js

@@ -58,4 +58,3 @@ exports.DialogContent = DialogContent;
 exports.TRANSLATIONS = [
     "Close"
 ];
-//# sourceMappingURL=dialogContent.js.map

package/dist/dialog/dialogHelpers.js

@@ -54,4 +54,3 @@ const getFocusableStartInd = (btnArr) => {
     return btnArr.findIndex((el) => el.type !== buttonType_1.ButtonType.Destructive && !el.disabled);
 };
 exports.getFocusableStartInd = getFocusableStartInd;
-//# sourceMappingURL=dialogHelpers.js.map

package/dist/dropdown/dropdown.d.ts

@@ -28,6 +28,7 @@ export interface IDropdown extends IZenComponentProps {
     errorHandler: (e: Error) => void;
     dataItems?: IDropdownItem[];
     getNamedItems?: (fn: (items: string[]) => ISelectionItem[]) => void;
+    getSelectedItem?: (id: string) => IDropdownItem | undefined | Promise<IDropdownItem | undefined>;
     placeholder?: string;
     dialogAriaLabel?: string;
     width?: number;

package/dist/dropdown/dropdown.js

@@ -17,7 +17,7 @@ const dialogHelpers_1 = require("../dialog/dialogHelpers");
 const useLanguage_1 = require("../utils/localization/useLanguage");
 const dropdownPopup_1 = require("./dropdownPopup");
 const useMobile_1 = require("../commonHelpers/hooks/useMobile");
-const Dropdown = ({ className, classNamePopup, getData, errorHandler, dataItems, onChange, value, defaultValue, placeholder, dialogAriaLabel, width, isLoading, title, triggerAriaLabel, disabled, inputId, filterName, showCounterPill = true, showSelection, fullWidthTriggerButton, hasApplyButton, searchField = true, multiselect = true, forceSelection = false, selectAllButton = true, getNamedItems, buttonType = "secondary", listLimit = 500, alignment = "bottom-left", error, sortFn }) => {
+const Dropdown = ({ className, classNamePopup, getData, errorHandler, dataItems, onChange, value, defaultValue, placeholder, dialogAriaLabel, width, isLoading, title, triggerAriaLabel, disabled, inputId, filterName, showCounterPill = true, showSelection, fullWidthTriggerButton, hasApplyButton, searchField = true, multiselect = true, forceSelection = false, selectAllButton = true, getNamedItems, getSelectedItem, buttonType = "secondary", listLimit = 500, alignment = "bottom-left", error, sortFn }) => {
     var _a;
     const [state, dispatchState] = (0, react_1.useReducer)(stateReducer_1.stateReducer, (0, stateReducer_1.getInitialState)(dataItems || [], value, defaultValue));
     const isMobile = (0, useMobile_1.useMobile)();
@@ -30,6 +30,7 @@ const Dropdown = ({ className, classNamePopup, getData, errorHandler, dataItems,
     const prevSelection = (0, react_1.useRef)([]);
     const { translate } = (0, useLanguage_1.useLanguage)();
     const getNamedItemsHasBeenCalled = (0, react_1.useRef)(false);
+    const selectedItemsLoader = (0, react_1.useRef)(undefined);
     const previousMapDataItems = (0, react_1.useRef)(!getData && (dataItems === null || dataItems === void 0 ? void 0 : dataItems.length) ? dataItems : []);
     (0, react_1.useEffect)(() => {
         const timeoutId = setTimeout(() => {
@@ -58,6 +59,36 @@ const Dropdown = ({ className, classNamePopup, getData, errorHandler, dataItems,
         }
         dispatchState({ type: stateActionType_1.StateActionType.SetDefaultValue, payload: defaultValue || [] });
     }, [defaultValue, state.defaultValue]);
+    const loadSelectedItems = (0, react_1.useCallback)((ids) => {
+        if (!getSelectedItem || !ids.size) {
+            return;
+        }
+        const promises = [];
+        ids.forEach(id => {
+            const itemOrPromise = getSelectedItem(id);
+            promises.push(Promise.resolve(itemOrPromise));
+        });
+        // eslint-disable-next-line consistent-return
+        return Promise.all(promises).then((items) => {
+            const result = items.filter(el => el !== undefined);
+            dispatchState({ type: stateActionType_1.StateActionType.UpdateSelectedItems, payload: result });
+        }).catch(() => {
+            dispatchState({ type: stateActionType_1.StateActionType.UpdateSelectedItems, payload: [] });
+        });
+    }, [getSelectedItem]);
+    (0, react_1.useEffect)(() => {
+        if (!getSelectedItem) {
+            return;
+        }
+        dispatchState({ type: stateActionType_1.StateActionType.UpdateNamelessItems, payload: undefined });
+    }, [getSelectedItem]);
+    (0, react_1.useEffect)(() => {
+        if (state.namelessIds.size === 0 || !getSelectedItem || state.pendingNamelessIds) {
+            return;
+        }
+        selectedItemsLoader.current = loadSelectedItems(state.namelessIds);
+        dispatchState({ type: stateActionType_1.StateActionType.SetPendingState, payload: true });
+    }, [getSelectedItem, loadSelectedItems, state.namelessIds, state.pendingNamelessIds]);
     const handleChangeCurrentId = (0, react_1.useCallback)((id) => {
         dispatchState({ type: stateActionType_1.StateActionType.SetCurrentId, payload: id });
         dispatchState({ type: stateActionType_1.StateActionType.SetInputValue, payload: "" });
@@ -278,12 +309,13 @@ const Dropdown = ({ className, classNamePopup, getData, errorHandler, dataItems,
         listLimit, multiselect, handleBackButtonClick, handleSelectAllInSearch, handleSelectAllClick, handleSelect,
         handleChangeCurrentId, handleSingleSelection, isMobile, filterName, forceSelection, width, selectAllButton,
         memoizedIsApplyButtonDisabled, memoizedIsClearButtonDisabled, memoizedWithFooter]);
+    const currentStringFromSelected = (0, dropdownHelper_1.getStringFromSelected)(hasApplyButton ? state.globalSelectedIds : state.selectedIds, state.groupsMapSelected, translate);
+    const memoizedCurrentSelection = (0, react_1.useMemo)(() => showSelection && !state.inputValue ? currentStringFromSelected : "", [showSelection, state.inputValue, currentStringFromSelected]);
     const parentTriggerWidth = ((_a = comboboxRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) || 420;
-    return (0, jsx_runtime_1.jsxs)("div", { className: containerClassName, ref: comboboxRef, children: [(0, jsx_runtime_1.jsx)(dropdownTrigger_1.DropdownTrigger, { className: (0, classNames_1.classNames)([!width && !fullWidthTriggerButton && parentTriggerWidth < 420 && !searchField ? "zen-dropdown__trigger-button--width-parent" : ""]), currentSelection: showSelection && !state.inputValue ? (0, dropdownHelper_1.getStringFromSelected)(hasApplyButton ? state.globalSelectedIds : state.selectedIds, state.groupsMapSelected, translate) : "", isActive: state.isOpenCombo, id: inputId, disabled: disabled, count: showCounterPill ? (0, dropdownHelper_1.getSelectedCount)(hasApplyButton ? state.globalSelectedIds : state.selectedIds) : 0, fullWidth: fullWidthTriggerButton, inputValue: state.inputValue, placeholder: placeholder || translate("Filter by group"), searchField: searchField && !isMobile ? searchField : false, onSearchChange: onSearchChange, handleClick: handleTriggerClick, width: width && width > 420 ? 420 : width, title: title, triggerAriaLabel: triggerAriaLabel, triggerRef: triggerRef, inputRef: inputRef, buttonType: buttonType, error: error }), (0, jsx_runtime_1.jsx)(dropdownPopup_1.DropdownPopup, { alignment: alignment, triggerRef: triggerRef, classNamePopup: classNamePopup, isMobile: isMobile, dialogAriaLabel: dialogAriaLabel, disabled: disabled, filterName: filterName, hasApplyButton: hasApplyButton, inputId: inputId, isClearButtonDisabled: memoizedIsClearButtonDisabled, isApplyButtonDisabled: memoizedIsApplyButtonDisabled, isWithFooter: memoizedWithFooter, isOpenCombo: state.isOpenCombo, searchField: searchField, placeholder: placeholder, inputValue: state.inputValue, handleApplyClick: handleApplyClick, handleClearClick: multiselect ? handleClearClick : handleSingleSelection.bind(this, true), handleTriggerClick: handleTriggerClick, onInputChange: onInputChange, inputRef: inputRef, contentRef: contentRef, children: getPopupContent })] });
+    return (0, jsx_runtime_1.jsxs)("div", { className: containerClassName, ref: comboboxRef, children: [(0, jsx_runtime_1.jsx)(dropdownTrigger_1.DropdownTrigger, { className: (0, classNames_1.classNames)([!width && !fullWidthTriggerButton && parentTriggerWidth < 420 && !searchField ? "zen-dropdown__trigger-button--width-parent" : ""]), currentSelection: memoizedCurrentSelection, isActive: state.isOpenCombo, id: inputId, disabled: disabled, count: showCounterPill ? (0, dropdownHelper_1.getSelectedCount)(hasApplyButton ? state.globalSelectedIds : state.selectedIds) : 0, fullWidth: fullWidthTriggerButton, inputValue: state.inputValue, placeholder: placeholder || translate("Filter by group"), searchField: searchField && !isMobile ? searchField : false, onSearchChange: onSearchChange, handleClick: handleTriggerClick, width: width && width > 420 ? 420 : width, title: title, triggerAriaLabel: triggerAriaLabel, triggerRef: triggerRef, inputRef: inputRef, buttonType: buttonType, error: error }), (0, jsx_runtime_1.jsx)(dropdownPopup_1.DropdownPopup, { alignment: alignment, triggerRef: triggerRef, classNamePopup: classNamePopup, isMobile: isMobile, dialogAriaLabel: dialogAriaLabel, disabled: disabled, filterName: filterName, hasApplyButton: hasApplyButton, inputId: inputId, isClearButtonDisabled: memoizedIsClearButtonDisabled, isApplyButtonDisabled: memoizedIsApplyButtonDisabled, isWithFooter: memoizedWithFooter, isOpenCombo: state.isOpenCombo, searchField: searchField, placeholder: placeholder, inputValue: state.inputValue, handleApplyClick: handleApplyClick, handleClearClick: multiselect ? handleClearClick : handleSingleSelection.bind(this, true), handleTriggerClick: handleTriggerClick, onInputChange: onInputChange, inputRef: inputRef, contentRef: contentRef, children: getPopupContent })] });
 };
 exports.Dropdown = Dropdown;
 exports.TRANSLATIONS = [
     ...dropdownTrigger_1.TRANSLATIONS,
     ...dropdownList_1.TRANSLATIONS
 ];
-//# sourceMappingURL=dropdown.js.map

package/dist/dropdown/dropdownHelper.js

@@ -135,4 +135,3 @@ const getStringFromSelected = (selectedIds, groupsMapSelected, translate) => {
 exports.getStringFromSelected = getStringFromSelected;
 const getSelectedCount = (selectedIds) => selectedIds.length === 1 && selectedIds[0] === groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID ? 0 : selectedIds.length;
 exports.getSelectedCount = getSelectedCount;
-//# sourceMappingURL=dropdownHelper.js.map

package/dist/dropdown/dropdownList.js

@@ -104,4 +104,3 @@ exports.TRANSLATIONS = [
     "Back",
     "No data"
 ];
-//# sourceMappingURL=dropdownList.js.map

package/dist/dropdown/dropdownPopup.js

@@ -33,4 +33,3 @@ const DropdownPopup = ({ alignment, triggerRef, classNamePopup, isMobile, inputV
     return isMobile ? memoizedMobileView : memoizedDesktopView;
 };
 exports.DropdownPopup = DropdownPopup;
-//# sourceMappingURL=dropdownPopup.js.map

package/dist/dropdown/dropdownSearchableTrigger.js

@@ -75,4 +75,3 @@ exports.TRANSLATIONS = [
     "Open filter",
     "Clear search"
 ];
-//# sourceMappingURL=dropdownSearchableTrigger.js.map

package/dist/dropdown/dropdownTrigger.js

@@ -30,4 +30,3 @@ exports.DropdownTrigger = DropdownTrigger;
 exports.TRANSLATIONS = [
     ...dropdownSearchableTrigger_1.TRANSLATIONS
 ];
-//# sourceMappingURL=dropdownTrigger.js.map

package/dist/dropdown/stateReducer/stateAction.d.ts

@@ -92,5 +92,17 @@ interface ISetDefaultValueAction {
     type: StateActionType.SetDefaultValue;
     payload: string[];
 }
-export type TStateAction = ICreateMapAction | ISetStateAction | ISetGlobalStateAction | ISetListDataAction | ISetIsOpenComboAction | IShowAction | IShowWaitingAction | IShowEmptyListAction | IShowListAction | ISetInputValueAction | INothingToShowAction | ISetCurrentIdAction | IChangeSelectionAction | IChangeSingleSelectionAction | ISelectAllChildrenAction | IDeselectAllChildrenAction | IResetSelection | IResetStateToGlobal | ISetDataProblemAction | ISetDefaultValueAction;
+interface IUpdateSelectedItemsAction {
+    type: StateActionType.UpdateSelectedItems;
+    payload: IDropdownItem[];
+}
+interface ISetPendingStateAction {
+    type: StateActionType.SetPendingState;
+    payload: boolean;
+}
+interface IUpdateNamelessItemsAction {
+    type: StateActionType.UpdateNamelessItems;
+    payload: undefined;
+}
+export type TStateAction = ICreateMapAction | ISetStateAction | ISetGlobalStateAction | ISetListDataAction | ISetIsOpenComboAction | IShowAction | IShowWaitingAction | IShowEmptyListAction | IShowListAction | ISetInputValueAction | INothingToShowAction | ISetCurrentIdAction | IChangeSelectionAction | IChangeSingleSelectionAction | ISelectAllChildrenAction | IDeselectAllChildrenAction | IResetSelection | IResetStateToGlobal | ISetDataProblemAction | ISetDefaultValueAction | IUpdateSelectedItemsAction | ISetPendingStateAction | IUpdateNamelessItemsAction;
 export {};

package/dist/dropdown/stateReducer/stateAction.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=stateAction.js.map

package/dist/dropdown/stateReducer/stateActionType.d.ts

@@ -18,5 +18,8 @@ export declare enum StateActionType {
     ShowList = "SHOW_LIST",
     SetInputValue = "SET_INPUT_VALUE",
     SetIsOpenCombo = "SET_IS_OPEN_COMBO",
-    SetDataProblem = "SET_DATA_PROBLEM"
+    SetDataProblem = "SET_DATA_PROBLEM",
+    UpdateSelectedItems = "UPDATE_SELECTED_ITEMS",
+    SetPendingState = "SET_PENDING_STATE",
+    UpdateNamelessItems = "UPDATE_NAMELESS_ITEMS"
 }

package/dist/dropdown/stateReducer/stateActionType.js

@@ -23,5 +23,7 @@ var StateActionType;
     StateActionType["SetInputValue"] = "SET_INPUT_VALUE";
     StateActionType["SetIsOpenCombo"] = "SET_IS_OPEN_COMBO";
     StateActionType["SetDataProblem"] = "SET_DATA_PROBLEM";
+    StateActionType["UpdateSelectedItems"] = "UPDATE_SELECTED_ITEMS";
+    StateActionType["SetPendingState"] = "SET_PENDING_STATE";
+    StateActionType["UpdateNamelessItems"] = "UPDATE_NAMELESS_ITEMS";
 })(StateActionType || (exports.StateActionType = StateActionType = {}));
-//# sourceMappingURL=stateActionType.js.map

package/dist/dropdown/stateReducer/stateReducer.d.ts

@@ -17,6 +17,8 @@ export interface IDropdownState {
     hasDataProblem: boolean;
     isDisableStateProhibited: boolean;
     groupsMapSelected: Map<string, IDropdownItem>;
+    namelessIds: Set<string>;
+    pendingNamelessIds: boolean;
 }
 export interface IStateReducer extends Reducer<IDropdownState, TStateAction> {
 }
@@ -35,20 +37,7 @@ export declare const getInitialState: (comboItems: IDropdownItem[], selection?:
     hasDataProblem: boolean;
     isDisableStateProhibited: boolean;
     groupsMapSelected: Map<any, any>;
+    namelessIds: Set<string>;
+    pendingNamelessIds: boolean;
 };
-export declare function stateReducer(state: IDropdownState, action: TStateAction): {
-    groupsMap: ITypedHash<IGroupTree>;
-    isDisableStateProhibited: boolean;
-    selectedIds: string[];
-    globalSelectedIds: string[];
-    defaultValue: string[];
-    listData: IDropdownItem[];
-    currentId: string | undefined;
-    showWaiting: boolean;
-    showEmptyList: boolean;
-    showList: boolean;
-    inputValue: string;
-    isOpenCombo: boolean;
-    hasDataProblem: boolean;
-    groupsMapSelected: Map<string, IDropdownItem>;
-};
+export declare function stateReducer(state: IDropdownState, action: TStateAction): IDropdownState;

package/dist/dropdown/stateReducer/stateReducer.js

@@ -8,13 +8,18 @@ const groupsHelper_1 = require("../../groupsFilter/groupsHelper");
 const getInitialState = (comboItems, selection, defaultValue) => {
     const updatedGroupsMapSelected = new Map();
     const updatedGroupsMap = comboItems.length ? (0, groupsFilterHelper_1.createGroupsMap)(comboItems, groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID) : {};
-    if (Object.keys(updatedGroupsMap).length && selection && selection.length) {
+    const namelessIds = new Set();
+    if (selection && selection.length) {
         selection.forEach(id => {
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             const item = updatedGroupsMap[id];
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             if (item) {
                 updatedGroupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
             }
+            else {
+                namelessIds.add(id);
+            }
         });
     }
     return {
@@ -31,7 +36,9 @@ const getInitialState = (comboItems, selection, defaultValue) => {
         isOpenCombo: false,
         hasDataProblem: false,
         isDisableStateProhibited: Object.keys(updatedGroupsMap).length > 0 && (updatedGroupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID].children || []).some(el => el.children && el.children.length),
-        groupsMapSelected: updatedGroupsMapSelected
+        groupsMapSelected: updatedGroupsMapSelected,
+        namelessIds: namelessIds,
+        pendingNamelessIds: false
     };
 };
 exports.getInitialState = getInitialState;
@@ -42,22 +49,29 @@ function stateReducer(state, action) {
     switch (type) {
         case stateActionType_1.StateActionType.CreateMap: {
             const updatedGroupsMap = payload.length ? (0, groupsFilterHelper_1.createGroupsMap)(payload, groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID) : {};
+            const newNamelessIds = new Set(state.namelessIds);
             if (Object.keys(updatedGroupsMap).length && state.selectedIds.length) {
                 state.selectedIds.forEach(id => {
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     const item = updatedGroupsMap[id];
                     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     if (item) {
                         state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
+                        newNamelessIds.delete(id);
+                    }
+                    else {
+                        newNamelessIds.add(id);
                     }
                 });
             }
-            return Object.assign(Object.assign({}, state), { groupsMap: updatedGroupsMap, isDisableStateProhibited: Object.keys(updatedGroupsMap).length > 0 && (updatedGroupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID].children || []).some(el => el.children && el.children.length) });
+            return Object.assign(Object.assign({}, state), { groupsMap: updatedGroupsMap, isDisableStateProhibited: Object.keys(updatedGroupsMap).length > 0 && (updatedGroupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID].children || []).some(el => el.children && el.children.length), namelessIds: newNamelessIds });
         }
         case stateActionType_1.StateActionType.SetListData: {
             state.selectedIds.forEach(id => {
                 if (!state.groupsMapSelected.has(id)) {
                     const item = payload.find(el => el.id === id);
                     item && state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
+                    item && state.namelessIds.delete(id);
                 }
             });
             return Object.assign(Object.assign({}, state), { listData: payload, hasDataProblem: Object.keys(state.groupsMap).length === 0 && payload.some(el => el.children && el.children.length > 0) });
@@ -84,27 +98,71 @@ function stateReducer(state, action) {
             return Object.assign(Object.assign({}, state), { showWaiting: false, showEmptyList: false, showList: true });
         case stateActionType_1.StateActionType.SetInputValue:
             return Object.assign(Object.assign({}, state), { inputValue: payload });
-        case stateActionType_1.StateActionType.SetState:
+        case stateActionType_1.StateActionType.SetState: {
+            const newNamelessIds = new Set(state.namelessIds);
             payload.forEach(id => {
                 if (!state.groupsMapSelected.has(id)) {
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    const item = state.groupsMap[id];
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    item && state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    !item && newNamelessIds.add(id);
+                }
+            });
+            return Object.assign(Object.assign({}, state), { selectedIds: payload, namelessIds: newNamelessIds });
+        }
+        case stateActionType_1.StateActionType.UpdateNamelessItems: {
+            if (state.pendingNamelessIds) {
+                return state;
+            }
+            const newNamelessIds = new Set(state.namelessIds);
+            state.selectedIds.forEach(id => {
+                if (!state.groupsMapSelected.has(id)) {
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     const item = state.groupsMap[id];
                     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     item && state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    !item && newNamelessIds.add(id);
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    item && newNamelessIds.delete(id);
+                }
+                else {
+                    newNamelessIds.delete(id);
+                }
+            });
+            return Object.assign(Object.assign({}, state), { namelessIds: newNamelessIds });
+        }
+        case stateActionType_1.StateActionType.UpdateSelectedItems: {
+            payload.forEach(item => {
+                if (!state.groupsMapSelected.has(item.id)) {
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    state.groupsMapSelected.set(item.id, Object.assign(Object.assign({ id: item.id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
                 }
             });
-            return Object.assign(Object.assign({}, state), { selectedIds: payload });
+            const newNamelessIds = new Set();
+            return Object.assign(Object.assign({}, state), { namelessIds: newNamelessIds, pendingNamelessIds: false });
+        }
+        case stateActionType_1.StateActionType.SetPendingState: {
+            return Object.assign(Object.assign({}, state), { pendingNamelessIds: payload });
+        }
         case stateActionType_1.StateActionType.SetGlobalState:
             return Object.assign(Object.assign({}, state), { globalSelectedIds: payload });
-        case stateActionType_1.StateActionType.SetDefaultValue:
+        case stateActionType_1.StateActionType.SetDefaultValue: {
+            const newNamelessIds = new Set(state.namelessIds);
             payload.forEach(id => {
                 if (!state.groupsMapSelected.has(id)) {
                     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     const item = state.groupsMap[id] || state.listData.find(el => el.id === id);
                     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     item && state.groupsMapSelected.set(id, Object.assign(Object.assign({ id }, (item.name ? { name: item.name } : {})), (item.color ? { color: item.color } : {})));
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                    !item && newNamelessIds.add(id);
                 }
             });
-            return Object.assign(Object.assign({}, state), { defaultValue: payload });
+            return Object.assign(Object.assign({}, state), { defaultValue: payload, namelessIds: newNamelessIds });
+        }
         case stateActionType_1.StateActionType.ChangeSingleSelection: {
             const newSelectedId = payload.value ? payload.value : state.defaultValue[0];
             if (newSelectedId && !state.groupsMapSelected.has(newSelectedId)) {
@@ -208,4 +266,3 @@ function stateReducer(state, action) {
     }
 }
 exports.stateReducer = stateReducer;
-//# sourceMappingURL=stateReducer.js.map

package/dist/dropdown/stateReducer/stateReducerHelper.js

@@ -16,4 +16,3 @@ function getChildList(childArr) {
     return list;
 }
 exports.getChildList = getChildList;
-//# sourceMappingURL=stateReducerHelper.js.map

package/dist/dropdownOld/dropdownOld.js

@@ -52,4 +52,3 @@ const DropdownOld = (props) => {
                             : null] }) })] });
 };
 exports.DropdownOld = DropdownOld;
-//# sourceMappingURL=dropdownOld.js.map

package/dist/dropdownOld/dropdownOldHelpers/isDropdownStateTheSame.js

@@ -8,4 +8,3 @@ const isDropdownStateTheSame = (newState, oldState) => {
     return newState.sort().join(",") === oldState.sort().join(",");
 };
 exports.isDropdownStateTheSame = isDropdownStateTheSame;
-//# sourceMappingURL=isDropdownStateTheSame.js.map

package/dist/feedbackContainer/feedbackContainer.js

@@ -69,4 +69,3 @@ const FeedbackContainer = () => {
     return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!isAPIMode && alertsPortal, !isAPIMode && toastsPortal] });
 };
 exports.FeedbackContainer = FeedbackContainer;
-//# sourceMappingURL=feedbackContainer.js.map

package/dist/feedbackContainer/feedbackContext.js

@@ -26,4 +26,3 @@ exports.FeedbackContext = (0, react_1.createContext)({
     activeFeedback: null,
     mode: null
 });
-//# sourceMappingURL=feedbackContext.js.map

package/dist/feedbackContainer/hooks/useFeedbackAlert.js

@@ -197,4 +197,3 @@ const useFeedbackAlert = ({ setActiveFeedback, mode }) => {
     return { alerts, alertsAnimation, removedAlertId, alertsQueue, addAlert, removeAlert, startAlertAnimation, finishAlertAnimation, apiAlertActions, setApiAlertActions };
 };
 exports.useFeedbackAlert = useFeedbackAlert;
-//# sourceMappingURL=useFeedbackAlert.js.map

package/dist/feedbackContainer/hooks/useFeedbackAlertState.js

@@ -24,4 +24,3 @@ const useFeedbackAlertState = () => {
     };
 };
 exports.useFeedbackAlertState = useFeedbackAlertState;
-//# sourceMappingURL=useFeedbackAlertState.js.map

package/dist/feedbackContainer/hooks/useFeedbackToast.js

@@ -214,4 +214,3 @@ const useFeedbackToast = ({ setActiveFeedback, mode = "default" }) => {
     };
 };
 exports.useFeedbackToast = useFeedbackToast;
-//# sourceMappingURL=useFeedbackToast.js.map

package/dist/feedbackContainer/hooks/useFeedbackToastState.js

@@ -24,4 +24,3 @@ const useFeedbackToastState = () => {
     };
 };
 exports.useFeedbackToastState = useFeedbackToastState;
-//# sourceMappingURL=useFeedbackToastState.js.map

package/dist/feedbackContainer/types.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=types.js.map

package/dist/feedbackContainer/utils/addZenithAlert.js

@@ -10,4 +10,3 @@ const addZenithAlert = (event, addAlert) => {
     addAlert(alert);
 };
 exports.addZenithAlert = addZenithAlert;
-//# sourceMappingURL=addZenithAlert.js.map

package/dist/feedbackContainer/utils/getAlertAnimation.js

@@ -26,4 +26,3 @@ const getAlertAnimation = (isAdded, indx, removedId, isMobile, activeFeedback) =
     return "bottom-top";
 };
 exports.getAlertAnimation = getAlertAnimation;
-//# sourceMappingURL=getAlertAnimation.js.map

package/dist/feedbackContainer/utils/getToastAnimation.js

@@ -27,4 +27,3 @@ const getToastAnimation = (isAdded, indx, removedId, toastLength, isMobile, acti
     return "top-bottom";
 };
 exports.getToastAnimation = getToastAnimation;
-//# sourceMappingURL=getToastAnimation.js.map

package/dist/feedbackContainer/utils/isAlertValid.js

@@ -9,4 +9,3 @@ const isAlertValid = (alert) => {
     return true;
 };
 exports.isAlertValid = isAlertValid;
-//# sourceMappingURL=isAlertValid.js.map

package/dist/feedbackContainer/utils/isToastValid.js

@@ -9,4 +9,3 @@ const isToastValid = (toast) => {
     return true;
 };
 exports.isToastValid = isToastValid;
-//# sourceMappingURL=isToastValid.js.map

package/dist/feedbackContainer/utils/removeZenithAlert.js

@@ -9,4 +9,3 @@ const removeZenithAlert = (event, removeAlert) => {
     removeAlert(id);
 };
 exports.removeZenithAlert = removeZenithAlert;
-//# sourceMappingURL=removeZenithAlert.js.map

package/dist/feedbackProvider/feedbackProvider.js

@@ -10,12 +10,14 @@ const feedbackContext_1 = require("../feedbackContainer/feedbackContext");
 const feedbackContainer_1 = require("../feedbackContainer/feedbackContainer");
 const useFeedbackAlert_1 = require("../feedbackContainer/hooks/useFeedbackAlert");
 const useFeedbackToast_1 = require("../feedbackContainer/hooks/useFeedbackToast");
-const FeedbackProvider = ({ children, mode = "default" }) => {
+const getDefaultProviderMode_1 = require("./utils/getDefaultProviderMode");
+const FeedbackProvider = ({ children, mode }) => {
     const [activeFeedback, setActiveFeedback] = react_1.default.useState(null);
+    const providerMode = (0, getDefaultProviderMode_1.getDefaultProviderMode)(mode);
     const { removedAlertId, alerts, removeAlert, addAlert, alertsQueue, alertsAnimation, startAlertAnimation, finishAlertAnimation, apiAlertActions, setApiAlertActions } = (0, useFeedbackAlert_1.useFeedbackAlert)({ setActiveFeedback, mode });
     const { removedToastId, toasts, removeToast, addToast, toastsQueue, toastsAnimation, startToastAnimation, finishToastAnimation, apiToastActions, setApiToastActions } = (0, useFeedbackToast_1.useFeedbackToast)({ setActiveFeedback, mode });
     return ((0, jsx_runtime_1.jsxs)(feedbackContext_1.FeedbackContext.Provider, { value: {
-            mode,
+            mode: providerMode,
             toastsAnimation,
             toastsQueue,
             removedToastId,
@@ -40,4 +42,3 @@ const FeedbackProvider = ({ children, mode = "default" }) => {
         }, children: [children, (0, jsx_runtime_1.jsx)(feedbackContainer_1.FeedbackContainer, {})] }));
 };
 exports.FeedbackProvider = FeedbackProvider;
-//# sourceMappingURL=feedbackProvider.js.map

package/dist/feedbackProvider/hooks/useWarning.js

@@ -11,4 +11,3 @@ const useWarning = ({ mode, name }) => {
     }, [name, mode]);
 };
 exports.useWarning = useWarning;
-//# sourceMappingURL=useWarning.js.map

package/dist/feedbackProvider/utils/getDefaultProviderMode.d.ts

@@ -0,0 +1,2 @@
+import { TFeedbackProviderType } from "../../feedbackContainer/feedbackContext";
+export declare const getDefaultProviderMode: (mode?: TFeedbackProviderType) => TFeedbackProviderType;

package/dist/feedbackProvider/utils/getDefaultProviderMode.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDefaultProviderMode = void 0;
+const getParentWindow_1 = require("../../utils/getParentWindow");
+const getDefaultProviderMode = (mode) => {
+    if (mode) {
+        return mode;
+    }
+    const parent = (0, getParentWindow_1.getParentWindow)(window);
+    const isTopWindow = window === parent;
+    // if initialized in iframe
+    if (!isTopWindow) {
+        return "api";
+    }
+    // if "default" Provided already initialized on the same page
+    if (parent.document.querySelector(".zen-alerts") || parent.document.querySelector(".zen-toasts")) {
+        return "api";
+    }
+    return "default";
+};
+exports.getDefaultProviderMode = getDefaultProviderMode;

package/dist/feedbackProvider/utils/getNotInitializedMessage.js

@@ -3,4 +3,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getNotInitializedMessage = void 0;
 const getNotInitializedMessage = (component = "") => `'FeedbackProvider' is not initialized. To make sure that ${component} work correctly please wrap your app with 'FeedbackProvider'.`;
 exports.getNotInitializedMessage = getNotInitializedMessage;
-//# sourceMappingURL=getNotInitializedMessage.js.map

package/dist/filterButton/filterButton.js

@@ -38,4 +38,3 @@ exports.FilterButton = (0, react_1.forwardRef)((function FilterButton(_a, ref) {
             fullWidth ? "zen-filter-button--full-width" : ""
         ]), onClick: onClickEvent, onMouseOver: onMouseOver, onMouseOut: onMouseOut, ref: ref, htmlType: "button", "aria-label": ariaLabel }, inlineStyle, other, { children: [children ? (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-filter-button__label", "zen-ellipsis", fullWidth ? "zen-filter-button__label--full-width" : ""]), children: children }) : null, (0, jsx_runtime_1.jsxs)("div", { className: "zen-filter-button__tags", children: [hasQuantity ? (0, jsx_runtime_1.jsx)("div", { className: "zen-filter-button__quantity", children: quantity }) : null, (0, jsx_runtime_1.jsx)("div", { className: "zen-filter-button__icon", children: (0, jsx_runtime_1.jsx)(iconChevronDownSmall_1.IconChevronDownSmall, { size: isDrive ? "huge" : "large" }) })] })] }));
 }));
-//# sourceMappingURL=filterButton.js.map

package/dist/filtersBar/components/filtersBarDropdown/filtersBarDropdown.js

@@ -59,4 +59,3 @@ const FiltersBarDropdown = ({ sidePanelTitle, className, props, state, useSidePa
 };
 exports.FiltersBarDropdown = FiltersBarDropdown;
 exports.TRANSLATIONS = [...new Set([...dropdown_1.TRANSLATIONS])];
-//# sourceMappingURL=filtersBarDropdown.js.map

package/dist/filtersBar/components/filtersBarGroupButton/filtersBarGroupButton.js

@@ -21,4 +21,3 @@ const FiltersBarGroupButton = ({ className, state, props, onChange: onChangeStat
     return (0, jsx_runtime_1.jsx)(sidePanelCell_1.SidePanelCell, { role: "group", title: sidePanelTitle, titleId: groupButtonLabelledId, labelledBy: groupButtonLabelledId, children: component });
 };
 exports.FiltersBarGroupButton = FiltersBarGroupButton;
-//# sourceMappingURL=filtersBarGroupButton.js.map

package/dist/filtersBar/components/filtersBarGroupsFilter/filtersBarGroupsFilter.js

@@ -14,4 +14,3 @@ const FiltersBarGroupsFilter = ({ props, state, sidePanelTitle, useSidePanelView
     return (0, jsx_runtime_1.jsx)(sidePanelCell_1.SidePanelCell, { title: sidePanelTitle, role: "group", labelledBy: groupFilterLabelledId, titleId: groupFilterLabelledId, children: component });
 };
 exports.FiltersBarGroupsFilter = FiltersBarGroupsFilter;
-//# sourceMappingURL=filtersBarGroupsFilter.js.map

package/dist/filtersBar/components/filtersBarPeriodPicker/filtersBarPeriodPicker.js

@@ -104,4 +104,3 @@ exports.TRANSLATIONS = [
     "The start date cannot be empty.",
     "The end date cannot be empty."
 ];
-//# sourceMappingURL=filtersBarPeriodPicker.js.map

package/dist/filtersBar/components/filtersBarPeriodPicker/getRangeOption.js

@@ -41,4 +41,3 @@ function getRangeInnerOption(option, translate, toLocalDateTime, firstDayOfWeek,
     return Object.assign({}, option);
 }
 exports.getRangeInnerOption = getRangeInnerOption;
-//# sourceMappingURL=getRangeOption.js.map