@geotab/zenith 1.18.0 → 1.19.0-beta.1

package/dist/dropdown/stateReducer/stateReducer.js

@@ -5,11 +5,11 @@ const stateActionType_1 = require("./stateActionType");
 const stateReducerHelper_1 = require("./stateReducerHelper");
 const groupsFilterHelper_1 = require("../../groupsFilter/groupsFilterHelper");
 const groupsHelper_1 = require("../../groupsFilter/groupsHelper");
-const getInitialState = (comboItems, selection, defaultValue) => {
+const getInitialState = (isFullSelectionMode, comboItems, selection, defaultValue, isAllSelected, defaultValueIsAllSelected) => {
     const updatedGroupsMapSelected = new Map();
     const updatedGroupsMap = comboItems.length ? (0, groupsFilterHelper_1.createGroupsMap)(comboItems, groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID) : {};
     const namelessIds = new Set();
-    if (selection && selection.length) {
+    if (selection.length > 0) {
         selection.forEach(id => {
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
             const item = updatedGroupsMap[id];
@@ -22,10 +22,11 @@ const getInitialState = (comboItems, selection, defaultValue) => {
             }
         });
     }
+    const isCurrentListNested = Object.keys(updatedGroupsMap).length > 0 && (updatedGroupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID].children || []).some(el => el.children && el.children.length);
     return {
         groupsMap: updatedGroupsMap,
-        selectedIds: selection || [],
-        globalSelectedIds: selection || [],
+        selectedIds: selection,
+        globalSelectedIds: selection,
         defaultValue: defaultValue || [],
         listData: [],
         currentId: undefined,
@@ -35,10 +36,14 @@ const getInitialState = (comboItems, selection, defaultValue) => {
         inputValue: "",
         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,
         namelessIds: namelessIds,
-        pendingNamelessIds: false
+        pendingNamelessIds: false,
+        isNestedList: isCurrentListNested,
+        isFullSelectionMode: isFullSelectionMode,
+        isAllSelected: isAllSelected,
+        globalIsAllSelected: isFullSelectionMode ? isAllSelected || false : undefined,
+        defaultValueIsAllSelected: isFullSelectionMode ? defaultValueIsAllSelected || false : undefined
     };
 };
 exports.getInitialState = getInitialState;
@@ -64,7 +69,8 @@ function stateReducer(state, action) {
                     }
                 });
             }
-            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 });
+            const isCurrentListNested = 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, namelessIds: newNamelessIds, isNestedList: state.isNestedList ? state.isNestedList : isCurrentListNested });
         }
         case stateActionType_1.StateActionType.SetListData: {
             state.selectedIds.forEach(id => {
@@ -74,7 +80,8 @@ function stateReducer(state, action) {
                     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) });
+            const isCurrentDataNested = payload.some(el => el.children && el.children.length > 0);
+            return Object.assign(Object.assign({}, state), { listData: payload, hasDataProblem: Object.keys(state.groupsMap).length === 0 && isCurrentDataNested, isNestedList: isCurrentDataNested ? isCurrentDataNested : state.isNestedList });
         }
         case stateActionType_1.StateActionType.SetDataProblem:
             return Object.assign(Object.assign({}, state), { hasDataProblem: payload });
@@ -83,9 +90,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] });
+            return Object.assign(Object.assign({}, state), { selectedIds: [...state.defaultValue], isAllSelected: state.defaultValueIsAllSelected });
         case stateActionType_1.StateActionType.ResetStateToGlobal:
-            return Object.assign(Object.assign({}, state), { selectedIds: [...state.globalSelectedIds] });
+            return Object.assign(Object.assign({}, state), { selectedIds: [...state.globalSelectedIds], isAllSelected: state.globalIsAllSelected });
         case stateActionType_1.StateActionType.NothingToShow:
             return Object.assign(Object.assign({}, state), { showWaiting: false, showEmptyList: false, showList: false });
         case stateActionType_1.StateActionType.Show:
@@ -100,7 +107,7 @@ function stateReducer(state, action) {
             return Object.assign(Object.assign({}, state), { inputValue: payload });
         case stateActionType_1.StateActionType.SetState: {
             const newNamelessIds = new Set(state.namelessIds);
-            payload.forEach(id => {
+            payload.selected.forEach(id => {
                 if (!state.groupsMapSelected.has(id)) {
                     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     const item = state.groupsMap[id];
@@ -110,7 +117,7 @@ function stateReducer(state, action) {
                     !item && newNamelessIds.add(id);
                 }
             });
-            return Object.assign(Object.assign({}, state), { selectedIds: payload, namelessIds: newNamelessIds });
+            return Object.assign(Object.assign({}, state), { selectedIds: payload.selected, namelessIds: newNamelessIds, isAllSelected: payload.isAllSelected });
         }
         case stateActionType_1.StateActionType.UpdateNamelessItems: {
             if (state.pendingNamelessIds) {
@@ -148,7 +155,7 @@ function stateReducer(state, action) {
             return Object.assign(Object.assign({}, state), { pendingNamelessIds: payload });
         }
         case stateActionType_1.StateActionType.SetGlobalState:
-            return Object.assign(Object.assign({}, state), { globalSelectedIds: payload });
+            return Object.assign(Object.assign({}, state), { globalSelectedIds: payload.selected, globalIsAllSelected: payload.isAllSelected });
         case stateActionType_1.StateActionType.SetDefaultValue: {
             const newNamelessIds = new Set(state.namelessIds);
             payload.forEach(id => {
@@ -163,6 +170,9 @@ function stateReducer(state, action) {
             });
             return Object.assign(Object.assign({}, state), { defaultValue: payload, namelessIds: newNamelessIds });
         }
+        case stateActionType_1.StateActionType.SetDefaultAllSelected: {
+            return Object.assign(Object.assign({}, state), { defaultValueIsAllSelected: payload });
+        }
         case stateActionType_1.StateActionType.ChangeSingleSelection: {
             const newSelectedId = payload.value ? payload.value : state.defaultValue[0];
             if (newSelectedId && !state.groupsMapSelected.has(newSelectedId)) {
@@ -215,11 +225,12 @@ function stateReducer(state, action) {
         case stateActionType_1.StateActionType.SelectAllChildren: {
             const currentEl = state.groupsMap[payload];
             const newSelected = new Set(state.selectedIds);
+            const isDisableStateProhibited = state.isNestedList;
             (currentEl.children || []).forEach(el => {
                 var _a, _b;
                 if (!newSelected.has(el.id)) {
                     // select when isDisableStateProhibited, or when disabled elements are allowed to be displayed, and this element is not disabled
-                    (state.isDisableStateProhibited || !el.disabled) && newSelected.add(el.id);
+                    (isDisableStateProhibited || !el.disabled) && newSelected.add(el.id);
                     // deselect parent
                     const parentForDeselect = [];
                     let parent = (_a = state.groupsMap[el.id].parent) === null || _a === void 0 ? void 0 : _a.id;
@@ -249,12 +260,56 @@ function stateReducer(state, action) {
             });
             return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected) });
         }
+        case stateActionType_1.StateActionType.DeselectItemsFromAllSelected: {
+            const currentEl = state.groupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID];
+            // action not submitted for disabled item, other items, even if disabled, not change their state
+            const deselectedItems = payload ? new Set([payload]) : new Set(state.listData.filter(elem => !elem.disabled).map(el => el.id));
+            const newSelected = new Set();
+            (currentEl.children || []).forEach(el => {
+                if (!newSelected.has(el.id) && !deselectedItems.has(el.id)) {
+                    newSelected.add(el.id);
+                }
+            });
+            state.listData.forEach(el => {
+                if (!newSelected.has(el.id) && !deselectedItems.has(el.id)) {
+                    newSelected.add(el.id);
+                }
+            });
+            newSelected.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 } : {})));
+                }
+            });
+            return Object.assign(Object.assign({}, state), { selectedIds: Array.from(newSelected), isAllSelected: state.isFullSelectionMode ? false : undefined });
+        }
+        case stateActionType_1.StateActionType.ToggleValueForAllSelected: {
+            const currentEl = state.groupsMap[groupsHelper_1.ENTIRE_ORGANIZATION_GROUP_ID];
+            const newSelected = new Set();
+            state.isAllSelected && (currentEl.children || []).forEach(el => {
+                if (!newSelected.has(el.id) && el.disabled) {
+                    newSelected.add(el.id);
+                }
+            });
+            newSelected.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 } : {})));
+                }
+            });
+            return Object.assign(Object.assign({}, state), { selectedIds: state.isAllSelected ? Array.from(newSelected) : [], isAllSelected: state.isFullSelectionMode ? !state.isAllSelected : undefined });
+        }
         case stateActionType_1.StateActionType.DeselectAllChildren: {
             const childrenForDeselect = [];
             const currentChild = (0, stateReducerHelper_1.getChildList)(state.groupsMap[payload].children);
+            const isDisableStateProhibited = state.isNestedList;
             currentChild.forEach(el => {
                 // deselect when isDisableStateProhibited, or when disabled elements are allowed to be displayed, and this element is not disabled
-                (state.isDisableStateProhibited || !el.disabled) && childrenForDeselect.push(el.id);
+                (isDisableStateProhibited || !el.disabled) && childrenForDeselect.push(el.id);
             });
             const newSelected = new Set(state.selectedIds);
             childrenForDeselect.forEach(childId => newSelected.delete(childId));

package/dist/filterButton/filterButton.js

@@ -25,6 +25,7 @@ exports.FilterButton = (0, react_1.forwardRef)((function FilterButton(_a, ref) {
     const driveComponentClass = (0, useDriveClassName_1.useDriveClassName)("zen-filter-button");
     const isDrive = (0, useDrive_1.useDrive)();
     const hasQuantity = typeof quantity === "number";
+    const isLargeNumber = hasQuantity && quantity > 99;
     const onClickEvent = (0, react_1.useMemo)(() => onClick
         ? (e) => onClick(e.nativeEvent)
         : () => { }, [onClick]);
@@ -36,5 +37,5 @@ exports.FilterButton = (0, react_1.forwardRef)((function FilterButton(_a, ref) {
             className || "",
             isActive ? "zen-filter-button--active" : "",
             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" }) })] })] }));
+        ]), 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: isLargeNumber ? "99+" : 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" }) })] })] }));
 }));

package/dist/filtersBar/components/filtersBarDropdown/filtersBarDropdown.d.ts

@@ -1,17 +1,28 @@
 /// <reference types="react" />
 import "./filtersBarDropdown.less";
 import { IFiltersBarItem } from "../interfaces";
-import { IDropdown } from "../../../dropdown/dropdown";
+import { IDropdown, IDropdownFullSelection } from "../../../dropdown/dropdown";
 export interface IFiltersBarDropdownState {
     selectedOption: string[];
 }
+export interface IFiltersBarDropdownFullSelectionState {
+    selected: string[];
+    isAllSelected: boolean;
+}
 interface IFiltersBarDropdownProps extends Omit<IDropdown, "value" | "onChange" | "getNamedItems" | "buttonType" | "alignment" | "error" | "className" | "children"> {
 }
+interface IFiltersBarDropdownFullSelectionProps extends Omit<IDropdownFullSelection, "value" | "onChange" | "getNamedItems" | "buttonType" | "alignment" | "error" | "className" | "children"> {
+}
 export interface IFiltersBarDropdown extends IFiltersBarItem<IFiltersBarDropdownState, IFiltersBarDropdownProps> {
     className?: string;
     props: IFiltersBarDropdownProps;
     sidePanelMaxGroupedItemsLength?: number;
 }
-export declare const FiltersBarDropdown: React.FC<IFiltersBarDropdown>;
+export interface IFiltersBarDropdownFullSelectionMode extends IFiltersBarItem<IFiltersBarDropdownFullSelectionState, IFiltersBarDropdownFullSelectionProps> {
+    className?: string;
+    props: IFiltersBarDropdownFullSelectionProps;
+    sidePanelMaxGroupedItemsLength?: number;
+}
+export declare const FiltersBarDropdown: React.FC<IFiltersBarDropdown | IFiltersBarDropdownFullSelectionMode>;
 export declare const TRANSLATIONS: string[];
 export {};

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

@@ -13,9 +13,13 @@ const classNames_1 = require("../../../commonHelpers/classNames/classNames");
 const groupsHelper_1 = require("../../../groupsFilter/groupsHelper");
 const useLanguage_1 = require("../../../utils/localization/useLanguage");
 const dropdownHelper_1 = require("../../../dropdown/dropdownHelper");
+// eslint-disable-next-line complexity
 const FiltersBarDropdown = ({ sidePanelTitle, className, props, state, useSidePanelView, sidePanelMaxGroupedItemsLength = 5, onChange }) => {
     const { translate } = (0, useLanguage_1.useLanguage)();
-    const selection = (0, react_1.useMemo)(() => new Set(state.selectedOption), [state.selectedOption]);
+    const isFullSelectionMode = (0, react_1.useMemo)(() => "isAllSelected" in state && typeof (state).isAllSelected === "boolean", [state]);
+    const selection = (0, react_1.useMemo)(() => new Set(isFullSelectionMode ? state.selected
+        : state.selectedOption), [isFullSelectionMode, state]);
+    const isCurrentAllSelected = (0, react_1.useMemo)(() => isFullSelectionMode ? state.isAllSelected : undefined, [isFullSelectionMode, state]);
     const [_, setNamedFnReady] = (0, react_1.useState)(false);
     const namedItemsFnRef = (0, react_1.useRef)(items => items.map(el => ({ id: el, name: "..." })));
     const dropdownId = (0, useUniqueId_1.useUniqueId)();
@@ -24,18 +28,33 @@ const FiltersBarDropdown = ({ sidePanelTitle, className, props, state, useSidePa
     const dropdownLabelledId = (0, useUniqueId_1.useUniqueId)();
     const sortedItems = (0, react_1.useMemo)(() => (0, dropdownHelper_1.sortDropdownItemArray)(props.dataItems || [], props.sortFn), [props.sortFn, props.dataItems]);
     const handleRemove = (0, react_1.useCallback)((removedId) => {
-        onChange({ selectedOption: Array.from(selection).filter(el => el !== removedId) });
-    }, [onChange, selection]);
-    const component = (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, props, { width: useSidePanelView ? undefined : props.width, inputId: props.inputId && useSidePanelView ? `${props.inputId}-side-panel` : props.inputId, className: (0, classNames_1.classNames)([className || "", useSidePanelView ? "zen-filters-bar-dropdown--side-panel" : "", !useSidePanelView && !props.width ? "zen-filters-bar-dropdown--toolbar" : ""]), classNamePopup: (0, classNames_1.classNames)(["zen-filters-bar-dropdown-popup", props.classNamePopup || ""]), value: Array.from(selection), onChange: selectedOption => {
-            onChange({ selectedOption: selectedOption.map(el => el.id) });
+        if (isFullSelectionMode) {
+            const isAllSelected = state.isAllSelected;
+            if (isAllSelected) {
+                onChange({ selected: sortedItems.map(el => el.id).filter(el => el !== removedId), isAllSelected: false });
+                return;
+            }
+            onChange({ selected: Array.from(selection).filter(el => el !== removedId), isAllSelected: false });
+        }
+        else {
+            onChange({ selectedOption: Array.from(selection).filter(el => el !== removedId) });
+        }
+    }, [isFullSelectionMode, onChange, selection, sortedItems, state]);
+    const component = isFullSelectionMode ? (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, props, { width: useSidePanelView ? undefined : props.width, inputId: props.inputId && useSidePanelView ? `${props.inputId}-side-panel` : props.inputId, className: (0, classNames_1.classNames)([className || "", useSidePanelView ? "zen-filters-bar-dropdown--side-panel" : "", !useSidePanelView && !props.width ? "zen-filters-bar-dropdown--toolbar" : ""]), classNamePopup: (0, classNames_1.classNames)(["zen-filters-bar-dropdown-popup", props.classNamePopup || ""]), value: { selected: Array.from(selection), isAllSelected: isCurrentAllSelected || false }, onChange: (newValue) => {
+            onChange({ selected: newValue.selected.map(el => el.id), isAllSelected: newValue.isAllSelected || false });
         }, error: undefined, fullWidthTriggerButton: useSidePanelView ? true : props.fullWidthTriggerButton, hasApplyButton: useSidePanelView ? false : props.hasApplyButton, getNamedItems: useSidePanelView ? (fn) => {
             namedItemsFnRef.current = fn;
             setNamedFnReady(val => !val);
-        } : undefined }));
+        } : undefined, defaultValue: props.defaultValue, multiselect: true, selectAllButton: true })) : (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, props, { width: useSidePanelView ? undefined : props.width, inputId: props.inputId && useSidePanelView ? `${props.inputId}-side-panel` : props.inputId, className: (0, classNames_1.classNames)([className || "", useSidePanelView ? "zen-filters-bar-dropdown--side-panel" : "", !useSidePanelView && !props.width ? "zen-filters-bar-dropdown--toolbar" : ""]), classNamePopup: (0, classNames_1.classNames)(["zen-filters-bar-dropdown-popup", props.classNamePopup || ""]), value: Array.from(selection), onChange: (newValue) => {
+            onChange({ selectedOption: newValue.map(el => el.id) });
+        }, error: undefined, fullWidthTriggerButton: useSidePanelView ? true : props.fullWidthTriggerButton, hasApplyButton: useSidePanelView ? false : props.hasApplyButton, getNamedItems: useSidePanelView ? (fn) => {
+            namedItemsFnRef.current = fn;
+            setNamedFnReady(val => !val);
+        } : undefined, defaultValue: props.defaultValue }));
     if (!useSidePanelView) {
         return component;
     }
-    if (props.multiselect === false && props.dataItems && props.dataItems.length < sidePanelMaxGroupedItemsLength) {
+    if (!isFullSelectionMode && props.multiselect === false && props.dataItems && props.dataItems.length < sidePanelMaxGroupedItemsLength) {
         return (0, jsx_runtime_1.jsx)(sidePanelCell_1.SidePanelCell, { title: sidePanelTitle, role: "group", labelledBy: radioGroupLabelledId, titleId: radioGroupLabelledId, children: (0, jsx_runtime_1.jsx)(filtersBarSidePanelRadioGroup_1.FiltersBarSidePanelRadioGroup, Object.assign({}, props, { direction: "vertical", items: sortedItems.map((item) => ({
                     id: `${dropdownId}_${item.id}`,
                     value: item.id,
@@ -51,8 +70,14 @@ const FiltersBarDropdown = ({ sidePanelTitle, className, props, state, useSidePa
                     disabled: item.disabled,
                     children: (0, jsx_runtime_1.jsx)("span", { className: "strecthed", children: (0, groupsHelper_1.getGroupDescription)(item, translate) })
                 })), onChange: selectedItems => {
-                    onChange({ selectedOption: selectedItems });
-                }, selectedItems: state.selectedOption })) });
+                    if (isFullSelectionMode) {
+                        onChange({ selected: selectedItems, isAllSelected: selectedItems.length === sortedItems.length });
+                    }
+                    else {
+                        onChange({ selectedOption: selectedItems });
+                    }
+                }, selectedItems: isFullSelectionMode ? (state.isAllSelected ? sortedItems.map(el => el.id)
+                    : state.selected) : state.selectedOption })) });
     }
     const namedPills = namedItemsFnRef.current(Array.from(selection)).map(el => (el.name ? el : Object.assign(Object.assign({}, el), { name: "..." })));
     return (0, jsx_runtime_1.jsx)(sidePanelCell_1.SidePanelCell, { title: sidePanelTitle, role: "group", labelledBy: dropdownLabelledId, titleId: dropdownLabelledId, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [component, props.multiselect && (0, jsx_runtime_1.jsx)(pillBox_1.PillBox, { className: "zen-filters-bar-dropdown__pill-box", selectedPills: namedPills, onRemove: handleRemove })] }) });

package/dist/filtersBar/filtersBar.d.ts

@@ -6,7 +6,7 @@ import { IFiltersBarSearch } from "./components/filtersBarSearch/filtersBarSearc
 import { IFiltersBarGroupButton } from "./components/filtersBarGroupButton/filtersBarGroupButton";
 import { IFiltersBarGroupsFilter } from "./components/filtersBarGroupsFilter/filtersBarGroupsFilter";
 import { IFiltersBarPeriodPicker, IFiltersBarPeriodPickerUnsetValue } from "./components/filtersBarPeriodPicker/filtersBarPeriodPicker";
-import { IFiltersBarDropdown } from "./components/filtersBarDropdown/filtersBarDropdown";
+import { IFiltersBarDropdown, IFiltersBarDropdownFullSelectionMode } from "./components/filtersBarDropdown/filtersBarDropdown";
 import { IFiltersBarRange } from "./components/filtersBarRange/filtersBarRange";
 import { IFiltersBarChildrenState } from "./filtersBarInterfaces";
 export interface IFiltersBar extends IZenComponentProps {
@@ -46,7 +46,7 @@ export interface IFiltersBar extends IZenComponentProps {
 }
 interface IFiltersBarComponents {
     Search: React.FC<IFiltersBarSearch>;
-    Dropdown: React.FC<IFiltersBarDropdown>;
+    Dropdown: React.FC<IFiltersBarDropdown | IFiltersBarDropdownFullSelectionMode>;
     GroupButton: React.FC<IFiltersBarGroupButton>;
     GroupsFilter: React.FC<IFiltersBarGroupsFilter>;
     PeriodPicker: React.FC<IFiltersBarPeriodPicker | IFiltersBarPeriodPickerUnsetValue>;

package/dist/filtersBar/filtersBarInterfaces.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FiltersBarDropdown, IFiltersBarDropdown } from "./components/filtersBarDropdown/filtersBarDropdown";
+import { FiltersBarDropdown, IFiltersBarDropdown, IFiltersBarDropdownFullSelectionMode } from "./components/filtersBarDropdown/filtersBarDropdown";
 import { FiltersBarGroupButton, IFiltersBarGroupButton } from "./components/filtersBarGroupButton/filtersBarGroupButton";
 import { FiltersBarGroupsFilter, IFiltersBarGroupsFilter } from "./components/filtersBarGroupsFilter/filtersBarGroupsFilter";
 import { FiltersBarPeriodPicker, IFiltersBarPeriodPicker, IFiltersBarPeriodPickerUnsetValue } from "./components/filtersBarPeriodPicker/filtersBarPeriodPicker";
@@ -7,6 +7,7 @@ import { FiltersBarSearch, IFiltersBarSearch } from "./components/filtersBarSear
 import { FiltersBarRange, IFiltersBarRange } from "./components/filtersBarRange/filtersBarRange";
 export type TFiltersBarComponents = typeof FiltersBarDropdown | typeof FiltersBarSearch | typeof FiltersBarGroupButton | typeof FiltersBarGroupsFilter | typeof FiltersBarPeriodPicker | typeof FiltersBarRange;
 export type IFiltersBarDropdownState = Pick<IFiltersBarDropdown, "state">["state"];
+export type IFiltersBarDropdownFullSelectionModeState = Pick<IFiltersBarDropdownFullSelectionMode, "state">["state"];
 export type IFiltersBarSearchState = Pick<IFiltersBarSearch, "state">["state"];
 export type IFiltersBarGroupButtonState = Pick<IFiltersBarGroupButton, "state">["state"];
 export type IFiltersBarRangeState = Pick<IFiltersBarRange, "state">["state"];
@@ -14,7 +15,7 @@ export type IFiltersBarGroupsFilterState = Pick<IFiltersBarGroupsFilter, "state"
 export type IFiltersBarPeriodPickerState = Pick<IFiltersBarPeriodPicker, "state">["state"];
 export type IFiltersBarPeriodPickerUnsetValueState = Pick<IFiltersBarPeriodPickerUnsetValue, "state">["state"];
 export type TFiltersBarCommonComponent = React.ReactComponentElement<TFiltersBarComponents>[];
-export type TFiltersBarComponentsState = IFiltersBarDropdownState | IFiltersBarSearchState | IFiltersBarGroupButtonState | IFiltersBarRangeState | IFiltersBarGroupsFilterState | IFiltersBarPeriodPickerState | IFiltersBarPeriodPickerUnsetValueState | {
+export type TFiltersBarComponentsState = IFiltersBarDropdownState | IFiltersBarDropdownFullSelectionModeState | IFiltersBarSearchState | IFiltersBarGroupButtonState | IFiltersBarRangeState | IFiltersBarGroupsFilterState | IFiltersBarPeriodPickerState | IFiltersBarPeriodPickerUnsetValueState | {
     value: unknown;
 };
 export interface IFiltersBarComponentWithError<T = TFiltersBarComponentsState> {

package/dist/groupsFilter/groupsFilter.js

@@ -27,6 +27,7 @@ const advancedGroupsFilter_1 = require("../advancedGroupsFilter/advancedGroupsFi
 const useLanguage_1 = require("../utils/localization/useLanguage");
 const GroupsFilter = ({ fullSize, className, dataLoader, errorHandler, isWithColor, onChange, initialFilterState, options = {}, listLimit = 500 }) => {
     const { translate } = (0, useLanguage_1.useLanguage)();
+    const [groupPlaceHolder, setGroupPlaceHolder] = (0, react_1.useState)(options.placeholder || translate("Groups"));
     const [state, dispatchState] = (0, react_1.useReducer)(stateReducer_1.stateReducer, (0, stateReducer_1.getInitialState)(translate, initialFilterState));
     const [uiState, dispatchUiState] = (0, react_1.useReducer)(uiStateReducer_1.uiStateReducer, uiStateReducer_1.uiInitialGroupsFilterState);
     const [dataItems, setDataItems] = (0, react_1.useState)([]);
@@ -144,6 +145,10 @@ const GroupsFilter = ({ fullSize, className, dataLoader, errorHandler, isWithCol
             errorHandler(e);
         });
     }, [dataLoader, errorHandler]);
+    (0, react_1.useEffect)(() => {
+        const selectedValues = dataItems.filter((item) => { var _a; return (_a = state.frozenState.simpleFilterState) === null || _a === void 0 ? void 0 : _a.find((id) => id === item.id); }).map((item) => item.name);
+        setGroupPlaceHolder(selectedValues.length > 0 ? selectedValues.join(", ") : options.placeholder || translate("Groups"));
+    }, [dataItems, state.frozenState.simpleFilterState, translate, options.placeholder]);
     const getGroupsBox = () => (0, jsx_runtime_1.jsx)(groupsFilterBox_1.GroupsFilterBox, { step: uiState.step, currentId: uiState.currentAdjustmentId, isWithColor: isWithColor || false, state: state, search: uiState.searchValue, blocks: uiState.searchValue && uiState.step === groupsFilterInterfaces_1.FilterMenuStep.Initial ? [] : blocksMap[uiState.step], onChange: uiState.step === groupsFilterInterfaces_1.FilterMenuStep.CurrentlySelected ? handleCheckboxItemAdjustmentClick : handleCheckboxChange, onClick: handleCheckboxItemClick, uncheckedItems: uiState.step === groupsFilterInterfaces_1.FilterMenuStep.CurrentlySelected ? uiState.uncheckedAdjustmentIds : [], uncheckedAdvancedState: uiState.step === groupsFilterInterfaces_1.FilterMenuStep.CurrentlySelected ? uiState.uncheckedAdvancedState : undefined, listLimit: listLimit });
     const onSideWideChange = (newState) => { dispatchState({ type: stateActionType_1.StateActionType.SideWide, payload: newState }); };
     const onRelationChange = (newRelation) => { dispatchState({ type: stateActionType_1.StateActionType.Relation, payload: newRelation }); };
@@ -163,9 +168,11 @@ const GroupsFilter = ({ fullSize, className, dataLoader, errorHandler, isWithCol
         if ((initialFilterState === null || initialFilterState === void 0 ? void 0 : initialFilterState.sideWide) === state.frozenSideWideState && (0, groupsFilterHelper_1.comparePreparedFilters)((0, groupsFilterHelper_1.prepareFilters)(initialFilterState.groups), state.frozenState)) {
             return;
         }
+        const selectedValues = dataItems.filter(item => { var _a; return (_a = state.frozenState.simpleFilterState) === null || _a === void 0 ? void 0 : _a.find(id => id === item.id); }).map(item => item.name);
+        setGroupPlaceHolder(selectedValues.length > 0 ? selectedValues.join(", ") : options.placeholder || translate("Groups"));
         onChange(Object.assign({}, newState));
         dispatchState({ type: stateActionType_1.StateActionType.TurnOfGlobalChanges, payload: undefined });
-    }, [state.globalChanges, state.frozenState, state.frozenSideWideState, onChange, initialFilterState === null || initialFilterState === void 0 ? void 0 : initialFilterState.sideWide, initialFilterState]);
+    }, [state.globalChanges, dataItems, translate, state.frozenState, state.frozenSideWideState, options.placeholder, onChange, initialFilterState === null || initialFilterState === void 0 ? void 0 : initialFilterState.sideWide, initialFilterState]);
     (0, react_1.useEffect)(() => {
         var _a;
         if (((_a = prevInitialState.current) === null || _a === void 0 ? void 0 : _a.sideWide) === (initialFilterState === null || initialFilterState === void 0 ? void 0 : initialFilterState.sideWide)
@@ -216,7 +223,7 @@ const GroupsFilter = ({ fullSize, className, dataLoader, errorHandler, isWithCol
     (0, useEscape_1.useEscape)(triggerRef, handleEscape, uiState.isOpen);
     const selectedCount = (0, stateReducerHelper_1.getFrozenCount)(state);
     const isStateHasData = Object.keys(state.groupsMap).length > 0;
-    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(groupsFilterTrigger_1.GroupsFilterTrigger, { value: uiState.searchValue, onChange: onSearchChange, isOpenPopup: uiState.isOpen, count: selectedCount, withGlobeIcon: state.frozenSideWideState && selectedCount > 0, inputRef: inputRef, handleClick: handleTriggerClick, ref: triggerRef, fullSize: fullSize, placeholder: options.placeholder || translate("Groups") }), (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { isOpen: uiState.isOpen, className: (0, classNames_1.classNames)(["zen-groups-filter__popup", uiState.isOpenAdvancedFilter ? "zen-groups-filter__popup--inactive" : "", className ? className : ""]), onOpenChange: onOptionsToggle, useTrapFocusWithTrigger: uiState.isOpenAdvancedFilter ? "off" : "withTrigger", shouldHoldScroll: true, triggerRef: triggerRef, ariaLabel: translate("Organization groups filter"), recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: "zen-groups-filter-menu", ref: menuRef, children: [isStateHasData && !uiState.isLoadWithError && (0, jsx_runtime_1.jsxs)(groupsFilterMenu_1.GroupsFilterMenu, { onCancelClick: handleCancel, onApplyClick: handleApply, onResetClick: handleReset, isApplyDisabled: !(0, stateReducerHelper_1.isStateChanged)(state), children: [uiState.step === groupsFilterInterfaces_1.FilterMenuStep.Initial && (0, jsx_runtime_1.jsx)(groupsFilterInitialState_1.GroupsFilterInitialState, { siteWideState: state.sideWideState, onDialogButtonClick: handleAdvancedDialogOpen, count: (0, stateReducerHelper_1.getCurrentlySelectedCount)(state), onSiteWideChange: onSideWideChange, onCurrentlySelectedClick: handleCurrentlySelectedClick, searchResult: uiState.searchValue ? getSearchResult() : "", children: getGroupsBox() }), uiState.step === groupsFilterInterfaces_1.FilterMenuStep.Adjustment && (0, jsx_runtime_1.jsx)(groupsFilterAdjustmentState_1.GroupsFilterAdjustmentState, { onBackButtonClick: handleBackButtonClick, onHomeButtonClick: handleHomeButtonClick, onSelectAllClick: selectAllHandler, backButtonName: (0, groupsFilterStatesHelper_1.getBackButtonName)(state, uiState.currentAdjustmentId), isAllSelected: (0, groupsFilterStatesHelper_1.isAllChildrenSelected)(state, uiState.currentAdjustmentId), children: getGroupsBox() }), uiState.step === groupsFilterInterfaces_1.FilterMenuStep.CurrentlySelected && (0, jsx_runtime_1.jsx)(groupsFilterCurrentlySelectedState_1.GroupsFilterCurrentlySelectedState, { siteWideState: state.sideWideState, relation: state.relation, count: (0, stateReducerHelper_1.getCurrentlySelectedCount)(state), onBackButtonClick: basicHandleBackButtonClick, onSiteWideChange: onSideWideChange, onRelationChange: onRelationChange, children: getGroupsBox() })] }), !uiState.isLoadWithError && !isStateHasData && (0, jsx_runtime_1.jsx)(waiting_1.Waiting, { className: "zen-groups-filter__waiting", isLoading: !Object.keys(state.groupsMap).length, delay: 100 })] }) }), uiState.isOpenAdvancedFilter && getAdvancedDialog] });
+    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(groupsFilterTrigger_1.GroupsFilterTrigger, { value: uiState.searchValue, onChange: onSearchChange, isOpenPopup: uiState.isOpen, count: selectedCount, withGlobeIcon: state.frozenSideWideState && selectedCount > 0, inputRef: inputRef, handleClick: handleTriggerClick, ref: triggerRef, fullSize: fullSize, placeholder: groupPlaceHolder }), (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { isOpen: uiState.isOpen, className: (0, classNames_1.classNames)(["zen-groups-filter__popup", uiState.isOpenAdvancedFilter ? "zen-groups-filter__popup--inactive" : "", className ? className : ""]), onOpenChange: onOptionsToggle, useTrapFocusWithTrigger: uiState.isOpenAdvancedFilter ? "off" : "withTrigger", shouldHoldScroll: true, triggerRef: triggerRef, ariaLabel: translate("Organization groups filter"), recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: "zen-groups-filter-menu", ref: menuRef, children: [isStateHasData && !uiState.isLoadWithError && (0, jsx_runtime_1.jsxs)(groupsFilterMenu_1.GroupsFilterMenu, { onCancelClick: handleCancel, onApplyClick: handleApply, onResetClick: handleReset, isApplyDisabled: !(0, stateReducerHelper_1.isStateChanged)(state), children: [uiState.step === groupsFilterInterfaces_1.FilterMenuStep.Initial && (0, jsx_runtime_1.jsx)(groupsFilterInitialState_1.GroupsFilterInitialState, { siteWideState: state.sideWideState, onDialogButtonClick: handleAdvancedDialogOpen, count: (0, stateReducerHelper_1.getCurrentlySelectedCount)(state), onSiteWideChange: onSideWideChange, onCurrentlySelectedClick: handleCurrentlySelectedClick, searchResult: uiState.searchValue ? getSearchResult() : "", children: getGroupsBox() }), uiState.step === groupsFilterInterfaces_1.FilterMenuStep.Adjustment && (0, jsx_runtime_1.jsx)(groupsFilterAdjustmentState_1.GroupsFilterAdjustmentState, { onBackButtonClick: handleBackButtonClick, onHomeButtonClick: handleHomeButtonClick, onSelectAllClick: selectAllHandler, backButtonName: (0, groupsFilterStatesHelper_1.getBackButtonName)(state, uiState.currentAdjustmentId), isAllSelected: (0, groupsFilterStatesHelper_1.isAllChildrenSelected)(state, uiState.currentAdjustmentId), children: getGroupsBox() }), uiState.step === groupsFilterInterfaces_1.FilterMenuStep.CurrentlySelected && (0, jsx_runtime_1.jsx)(groupsFilterCurrentlySelectedState_1.GroupsFilterCurrentlySelectedState, { siteWideState: state.sideWideState, relation: state.relation, count: (0, stateReducerHelper_1.getCurrentlySelectedCount)(state), onBackButtonClick: basicHandleBackButtonClick, onSiteWideChange: onSideWideChange, onRelationChange: onRelationChange, children: getGroupsBox() })] }), !uiState.isLoadWithError && !isStateHasData && (0, jsx_runtime_1.jsx)(waiting_1.Waiting, { className: "zen-groups-filter__waiting", isLoading: !Object.keys(state.groupsMap).length, delay: 100 })] }) }), uiState.isOpenAdvancedFilter && getAdvancedDialog] });
 };
 exports.GroupsFilter = GroupsFilter;
 exports.TRANSLATIONS = [

package/dist/groupsFilter/groupsFilterTrigger.js

@@ -57,7 +57,7 @@ exports.GroupsFilterTrigger = react_1.default.forwardRef((_a, ref) => {
         }
         handleClick();
     };
-    return (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classNames_1.classNames)(["zen-groups-filter"]), ref: ref }, otherProps, { onClick: clickHandler, role: "combobox", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-groups-filter__search-container", fullSize ? "zen-groups-filter__search-container--full-size" : "", className]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-groups-filter__input-container", onKeyDown: handleKeydown, children: (0, jsx_runtime_1.jsx)(textInputRaw_1.TextInputRaw, { value: value, placeholder: placeholder || translate("Filter by group"), className: "zen-groups-filter__input", onChange: onChange, disabled: false, type: "text", ref: inputRef, id: groupsFilterId }) }), (0, jsx_runtime_1.jsx)("div", { className: "zen-groups-filter__search-input zen-groups-filter__search-input--post", children: (0, jsx_runtime_1.jsx)(groupsFilterLabelBox_1.GroupsFilterLabelBox, { count: count, withGlobeIcon: withGlobeIcon }) })] }), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "zen-groups-filter__popup-trigger", title: translate("Open filter"), children: (0, jsx_runtime_1.jsx)(iconChevronDownSmall_1.IconChevronDownSmall, { className: isOpenPopup ? "zen-groups-filter__arrow-icon--up" : "zen-groups-filter__arrow-icon--down", size: "large" }) })] }));
+    return (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classNames_1.classNames)(["zen-groups-filter"]), ref: ref }, otherProps, { onClick: clickHandler, role: "combobox", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-groups-filter__search-container", fullSize ? "zen-groups-filter__search-container--full-size" : "", className]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-groups-filter__input-container", onKeyDown: handleKeydown, children: (0, jsx_runtime_1.jsx)(textInputRaw_1.TextInputRaw, { value: value, placeholder: placeholder || translate("Filter by group"), className: (0, classNames_1.classNames)(["zen-groups-filter__input", count > 0 ? "zen-groups-filter__input--selected" : ""]), onChange: onChange, disabled: false, type: "text", ref: inputRef, id: groupsFilterId }) }), (0, jsx_runtime_1.jsx)("div", { className: "zen-groups-filter__search-input zen-groups-filter__search-input--post", children: (0, jsx_runtime_1.jsx)(groupsFilterLabelBox_1.GroupsFilterLabelBox, { count: count, withGlobeIcon: withGlobeIcon }) })] }), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "zen-groups-filter__popup-trigger", title: translate("Open filter"), children: (0, jsx_runtime_1.jsx)(iconChevronDownSmall_1.IconChevronDownSmall, { className: isOpenPopup ? "zen-groups-filter__arrow-icon--up" : "zen-groups-filter__arrow-icon--down", size: "large" }) })] }));
 });
 exports.GroupsFilterTrigger.displayName = "GroupsFilterTrigger";
 exports.TRANSLATIONS = [

package/dist/icons/iconCalendar2.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases.
+    duplicate of **IconCalendar**, please use that instead
+*/
 export declare const IconCalendar2: React.FC<IIcon>;

package/dist/icons/iconCalendar2.js

@@ -5,6 +5,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+/**
+    @deprecated - will be removed in future releases.
+    duplicate of **IconCalendar**, please use that instead
+*/
 const IconCalendar2 = ({ className, size, title, description, focusable = false }) => {
     const uniqueId = (0, useUniqueId_1.useUniqueId)();
     const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([

package/dist/icons/iconClock2.js

@@ -12,6 +12,6 @@ const IconClock2 = ({ className, size, title, description, focusable = false })
         (size ? `zen-icon--${size}` : ""),
         className !== null && className !== void 0 ? className : ""
     ]), [size, className]);
-    return (0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 25", focusable: focusable ? "true" : undefined, tabIndex: focusable ? 0 : undefined, role: focusable || title || description ? undefined : "presentation", className: classes, "aria-labelledby": title && focusable ? uniqueId : undefined, "data-name": "IconClock2", children: [title ? (0, jsx_runtime_1.jsx)("title", { id: uniqueId, children: title }) : null, description ? (0, jsx_runtime_1.jsx)("desc", { children: description }) : null, (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3 4.87a1 1 0 011-1h16a1 1 0 011 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1v-16zm2 1v14h14v-14H5zm10.694 5.47a3.998 3.998 0 10-7.389 3.06m1.4-7.072a5.998 5.998 0 11-3.247 7.837 5.999 5.999 0 013.247-7.837zM12 9.87a1 1 0 011 1v1.585l1.207 1.208a1 1 0 11-1.414 1.414l-1.5-1.5a1 1 0 01-.293-.708v-2a1 1 0 011-1zm3.694 1.47a3.998 3.998 0 01-2.164 5.224l2.164-5.224zm-2.164 5.224a3.998 3.998 0 01-5.225-2.165l5.225 2.165z" })] });
+    return (0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", focusable: focusable ? "true" : undefined, tabIndex: focusable ? 0 : undefined, role: focusable || title || description ? undefined : "presentation", className: classes, "aria-labelledby": title && focusable ? uniqueId : undefined, "data-name": "IconClock2", children: [title ? (0, jsx_runtime_1.jsx)("title", { id: uniqueId, children: title }) : null, description ? (0, jsx_runtime_1.jsx)("desc", { children: description }) : null, (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8m0 2a6 6 0 1 0 0-12 6 6 0 0 0 0 12", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M12 9a1 1 0 0 1 1 1v1.586l1.207 1.207a1 1 0 0 1-1.414 1.414l-1.5-1.5A1 1 0 0 1 11 12v-2a1 1 0 0 1 1-1", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M3 4a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm2 1v14h14V5z", clipRule: "evenodd" })] });
 };
 exports.IconClock2 = IconClock2;

package/dist/icons/iconCornerUpLeft.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import "./icon.less";
+import { IIcon } from "./icon";
+export declare const IconCornerUpLeft: React.FC<IIcon>;

package/dist/icons/iconCornerUpLeft.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconCornerUpLeft = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const classNames_1 = require("../commonHelpers/classNames/classNames");
+const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+const IconCornerUpLeft = ({ className, size, title, description, focusable = false }) => {
+    const uniqueId = (0, useUniqueId_1.useUniqueId)();
+    const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([
+        "zen-icon",
+        (size ? `zen-icon--${size}` : ""),
+        className !== null && className !== void 0 ? className : ""
+    ]), [size, className]);
+    return (0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", focusable: focusable ? "true" : undefined, tabIndex: focusable ? 0 : undefined, role: focusable || title || description ? undefined : "presentation", className: classes, "aria-labelledby": title && focusable ? uniqueId : undefined, "data-name": "IconCornerUpLeft", children: [title ? (0, jsx_runtime_1.jsx)("title", { id: uniqueId, children: title }) : null, description ? (0, jsx_runtime_1.jsx)("desc", { children: description }) : null, (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M20 20a1 1 0 0 1-1-1v-9H6.414l2.293 2.293a1 1 0 1 1-1.414 1.414l-4-4a1 1 0 0 1 0-1.414l4-4a1 1 0 0 1 1.414 1.414L6.414 8H20a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1", clipRule: "evenodd" })] });
+};
+exports.IconCornerUpLeft = IconCornerUpLeft;

package/dist/icons/iconCornerUpRight2.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconCornerUpLeft**, please use that instead
+*/
 export declare const IconCornerUpRight2: React.FC<IIcon>;

package/dist/icons/iconCornerUpRight2.js

@@ -5,6 +5,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconCornerUpLeft**, please use that instead
+*/
 const IconCornerUpRight2 = ({ className, size, title, description, focusable = false }) => {
     const uniqueId = (0, useUniqueId_1.useUniqueId)();
     const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([

package/dist/icons/iconCup.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases
+*/
 export declare const IconCup: React.FC<IIcon>;

package/dist/icons/iconCup.js

@@ -5,6 +5,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+/**
+    @deprecated - will be removed in future releases
+*/
 const IconCup = ({ className, size, title, description, focusable = false }) => {
     const uniqueId = (0, useUniqueId_1.useUniqueId)();
     const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([

package/dist/icons/iconDriver.js

@@ -12,6 +12,6 @@ const IconDriver = ({ className, size, title, description, focusable = false })
         (size ? `zen-icon--${size}` : ""),
         className !== null && className !== void 0 ? className : ""
     ]), [size, className]);
-    return (0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", focusable: focusable ? "true" : undefined, tabIndex: focusable ? 0 : undefined, role: focusable || title || description ? undefined : "presentation", className: classes, "aria-labelledby": title && focusable ? uniqueId : undefined, "data-name": "IconDriver", children: [title ? (0, jsx_runtime_1.jsx)("title", { id: uniqueId, children: title }) : null, description ? (0, jsx_runtime_1.jsx)("desc", { children: description }) : null, (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 4a2.5 2.5 0 100 5 2.5 2.5 0 000-5zM7.5 6.5a4.5 4.5 0 119 0 4.5 4.5 0 01-9 0zM5.678 19c.71-2.909 3.092-5 6.322-5 .621 0 1.206.077 1.748.218a1 1 0 10.504-1.936A8.931 8.931 0 0012 12c-4.758 0-8.083 3.521-8.496 7.906A1 1 0 004.5 21H11a1 1 0 100-2H5.678z" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M18 22a3 3 0 100-6 3 3 0 000 6zm0 2a5 5 0 100-10 5 5 0 000 10z" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21 20h-6v-2h6v2z" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17 23v-5h2v5h-2z" }), (0, jsx_runtime_1.jsx)("path", { d: "M20 19a2 2 0 11-4 0 2 2 0 014 0z" })] });
+    return (0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", focusable: focusable ? "true" : undefined, tabIndex: focusable ? 0 : undefined, role: focusable || title || description ? undefined : "presentation", className: classes, "aria-labelledby": title && focusable ? uniqueId : undefined, "data-name": "IconDriver", children: [title ? (0, jsx_runtime_1.jsx)("title", { id: uniqueId, children: title }) : null, description ? (0, jsx_runtime_1.jsx)("desc", { children: description }) : null, (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M7.5 6.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0M12 4a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M22 17a6 6 0 1 0-12 0 6 6 0 0 0 12 0m-9.874-1a4.002 4.002 0 0 1 7.748 0h-2.142a2 2 0 0 0-3.464 0zm0 2h2.142c.175.304.428.557.732.732v2.142A4.01 4.01 0 0 1 12.126 18M17 20.874v-2.142a2 2 0 0 0 .732-.732h2.142A4.01 4.01 0 0 1 17 20.874", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { d: "M8.913 14.663a1 1 0 0 0-.826-1.821q-.286.13-.561.278a9 9 0 0 0-1.879 1.346 8.5 8.5 0 0 0-1.969 2.759 8.1 8.1 0 0 0-.675 2.704A1 1 0 0 0 4 21h4.466a1 1 0 1 0 0-2H5.172q.126-.493.335-.965c.347-.784.858-1.501 1.507-2.108a7 7 0 0 1 1.9-1.264" })] });
 };
 exports.IconDriver = IconDriver;

package/dist/icons/iconImac2.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconImac**, please use that instead
+*/
 export declare const IconImac2: React.FC<IIcon>;

package/dist/icons/iconImac2.js

@@ -5,6 +5,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconImac**, please use that instead
+*/
 const IconImac2 = ({ className, size, title, description, focusable = false }) => {
     const uniqueId = (0, useUniqueId_1.useUniqueId)();
     const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([

package/dist/icons/iconInbox2.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconInbox**, please use that instead
+*/
 export declare const IconInbox2: React.FC<IIcon>;

package/dist/icons/iconInbox2.js

@@ -5,6 +5,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useUniqueId_1 = require("../commonHelpers/useUniqueId");
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconInbox**, please use that instead
+*/
 const IconInbox2 = ({ className, size, title, description, focusable = false }) => {
     const uniqueId = (0, useUniqueId_1.useUniqueId)();
     const classes = (0, react_1.useMemo)(() => (0, classNames_1.classNames)([

package/dist/icons/iconLab.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
 import "./icon.less";
 import { IIcon } from "./icon";
+/**
+    @deprecated - will be removed in future releases
+    duplicate of **IconBeta**, please use that instead
+*/
 export declare const IconLab: React.FC<IIcon>;