@geotab/zenith 3.6.0-beta.3 → 3.6.0-beta.4

package/dist/absolute/absolute.d.ts

@@ -0,0 +1,27 @@
+import { RefObject } from "react";
+import "./absolute.less";
+import { IZenComponentProps } from "../commonHelpers/zenComponent";
+import { IAlignment } from "../utils/positioningUtils/alignments";
+export type TAlignment = "top" | "top-left" | "top-right" | "left" | "left-top" | "left-bottom" | "right" | "right-top" | "right-bottom" | "bottom" | "bottom-left" | "bottom-right";
+export type TTrapFocus = "on" | "off" | "withTrigger" | "none";
+export interface IAbsolute extends IZenComponentProps {
+    triggerRef: RefObject<HTMLElement | null>;
+    alignment?: TAlignment;
+    stateFullChilds?: boolean;
+    id: string;
+    isOpen: boolean;
+    className?: string;
+    paddingX?: number;
+    paddingY?: number;
+    inline?: boolean;
+    onOpenChange: (isOpen: boolean) => void;
+    useTrapFocusWithTrigger?: TTrapFocus;
+    shouldHoldScroll?: boolean;
+    role?: string;
+    ariaLabel?: string;
+    ariaLabelledby?: string;
+    alignmentsFn?: IAlignment;
+    recalculateOnScroll?: boolean;
+    recalculateTrigger?: boolean;
+}
+export declare const Absolute: ({ isOpen, id, paddingX, paddingY, className, children, triggerRef, alignment, inline, onOpenChange, useTrapFocusWithTrigger, shouldHoldScroll, stateFullChilds, role, ariaLabel, ariaLabelledby, alignmentsFn, recalculateOnScroll, recalculateTrigger }: IAbsolute) => import("react/jsx-runtime").JSX.Element | "" | null;

package/dist/absolute/absolute.js

@@ -0,0 +1,135 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Absolute = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const classNames_1 = require("../commonHelpers/classNames/classNames");
+const react_dom_1 = require("react-dom");
+const focusableSelector_1 = require("../utils/focusableSelector");
+const isChildPopup_1 = require("../utils/positioningUtils/isChildPopup");
+const useEscape_1 = require("../commonHelpers/hooks/useEscape");
+const useResize_1 = require("../commonHelpers/hooks/useResize");
+const useTrapFocus_1 = require("../commonHelpers/hooks/useTrapFocus");
+const isChildOf_1 = require("../utils/isChildOf");
+const dialogHelpers_1 = require("../dialog/dialogHelpers");
+const calculatePosition_1 = require("../utils/positioningUtils/calculatePosition");
+const useArrowKey_1 = require("../commonHelpers/hooks/useArrowKey");
+const themeContext_1 = require("../utils/theme/themeContext");
+const useScroll_1 = require("../commonHelpers/hooks/useScroll");
+const getScrollableParent_1 = require("../utils/getScrollableParent");
+const useClientReady_1 = require("../commonHelpers/hooks/useClientReady");
+const zen_1 = require("../utils/zen");
+const Absolute = ({ isOpen, id, paddingX, paddingY, className, children, triggerRef, alignment, inline, onOpenChange, useTrapFocusWithTrigger = "off", shouldHoldScroll, stateFullChilds, role, ariaLabel, ariaLabelledby, alignmentsFn, recalculateOnScroll, recalculateTrigger = true }) => {
+    const popupRef = (0, react_1.useRef)(null);
+    const prevScroll = (0, react_1.useRef)(0);
+    const { dark } = (0, react_1.useContext)(themeContext_1.themeContext);
+    const isClientReady = (0, useClientReady_1.useClientReady)();
+    const onScrollHandler = e => {
+        var _a;
+        prevScroll.current = (_a = e.target) === null || _a === void 0 ? void 0 : _a.scrollTop;
+    };
+    const accessibleAttr = (0, react_1.useMemo)(() => {
+        if (!role) {
+            return {};
+        }
+        return Object.assign(Object.assign({ role }, (ariaLabelledby ? { "aria-labelledby": ariaLabelledby } : {})), (ariaLabel && !ariaLabelledby ? { "aria-label": ariaLabel } : {}));
+    }, [role, ariaLabelledby, ariaLabel]);
+    const darkClassName = dark ? "zen-dark" : "";
+    const renderPopup = () => {
+        var _a, _b;
+        if (isOpen) {
+            const result = ((0, jsx_runtime_1.jsx)("div", Object.assign({}, accessibleAttr, { ref: popupRef, id: id, onScroll: shouldHoldScroll ? onScrollHandler : undefined, className: (0, classNames_1.classNames)(["zen-absolute", darkClassName, className || ""]), children: children })));
+            if (inline) {
+                return result;
+            }
+            return (0, react_dom_1.createPortal)(result, ((_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.fullscreenElement) || ((_b = zen_1.zen.document) === null || _b === void 0 ? void 0 : _b.body));
+        }
+        return "";
+    };
+    const parent = (0, react_1.useMemo)(() => {
+        if (!isOpen || !recalculateOnScroll) {
+            return null;
+        }
+        return (0, getScrollableParent_1.getScrollableParent)(triggerRef.current);
+    }, [triggerRef, isOpen, recalculateOnScroll]);
+    const calculatePosition = (0, react_1.useCallback)(() => (0, calculatePosition_1.calculatePosition)(triggerRef, popupRef, paddingX, paddingY, inline, alignment, alignmentsFn, parent ? parent : undefined), [triggerRef, paddingX, paddingY, inline, alignment, alignmentsFn, popupRef, parent]);
+    (0, useResize_1.useResize)(calculatePosition, isOpen);
+    (0, useScroll_1.useScroll)(calculatePosition, isOpen, parent);
+    (0, react_1.useLayoutEffect)(calculatePosition, [isOpen, children, recalculateTrigger, calculatePosition]);
+    function handleEscape() {
+        onOpenChange(false);
+        if (!triggerRef.current) {
+            return;
+        }
+        if ((0, dialogHelpers_1.isFocusable)(triggerRef.current)) {
+            triggerRef.current.focus();
+            return;
+        }
+        const focusable = [...Array.from(triggerRef.current.querySelectorAll(focusableSelector_1.FOCUSABLE_SELECTOR))];
+        (focusable[0] || triggerRef.current).focus();
+    }
+    const condition = (0, react_1.useCallback)(() => (useTrapFocusWithTrigger === "off" ? false : true), [useTrapFocusWithTrigger]);
+    (0, useTrapFocus_1.useTrapFocus)(popupRef, useTrapFocusWithTrigger === "withTrigger" ? triggerRef : undefined, isOpen, condition);
+    (0, useEscape_1.useEscape)(popupRef, handleEscape, isOpen);
+    (0, useArrowKey_1.useArrowKey)(popupRef, handleEscape, isOpen);
+    (0, react_1.useEffect)(() => {
+        var _a, _b, _c;
+        const closeOnClickOutside = (e) => {
+            if (!popupRef.current) {
+                return;
+            }
+            if (!e.target) {
+                return;
+            }
+            const isClickInPopup = (0, isChildPopup_1.isChildPopup)(e.target, popupRef.current);
+            const isClickOnTrigger = triggerRef.current ? e.target === triggerRef.current || (0, isChildOf_1.isChildOf)(e.target, triggerRef.current) : false;
+            if (isClickInPopup || isClickOnTrigger || stateFullChilds) {
+                return;
+            }
+            onOpenChange(false);
+        };
+        if (isOpen) {
+            (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.addEventListener("click", closeOnClickOutside, true);
+            const firstFocusable = (_b = popupRef.current) === null || _b === void 0 ? void 0 : _b.querySelector(focusableSelector_1.FOCUSABLE_SELECTOR);
+            if (useTrapFocusWithTrigger === "none") {
+                return undefined;
+            }
+            if (useTrapFocusWithTrigger !== "withTrigger") {
+                if (firstFocusable) {
+                    firstFocusable.focus();
+                }
+                else {
+                    (_c = popupRef.current) === null || _c === void 0 ? void 0 : _c.focus();
+                }
+            }
+            return () => {
+                var _a;
+                (_a = zen_1.zen.document) === null || _a === void 0 ? void 0 : _a.body.removeEventListener("click", closeOnClickOutside, true);
+            };
+        }
+        return () => { };
+    }, [isOpen, onOpenChange, triggerRef, useTrapFocusWithTrigger, stateFullChilds]);
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (isOpen) {
+            (_a = popupRef.current) === null || _a === void 0 ? void 0 : _a.removeAttribute("style");
+            calculatePosition();
+        }
+        return () => { };
+    }, [calculatePosition, children, isOpen, isClientReady]);
+    (0, react_1.useEffect)(() => {
+        if (isOpen) {
+            if (popupRef.current && prevScroll.current && shouldHoldScroll) {
+                popupRef.current.scrollTop = prevScroll.current;
+            }
+        }
+        else {
+            prevScroll.current = 0;
+        }
+    }, [children, isOpen, shouldHoldScroll]);
+    if (!isClientReady) {
+        return null;
+    }
+    return renderPopup();
+};
+exports.Absolute = Absolute;

package/dist/accordion/accordion.d.ts

@@ -0,0 +1,11 @@
+import { IAccordionItem } from "./accordionItem/accordionItem";
+import "./accordion.less";
+import { IZenGridItem } from "../commonHelpers/zenComponent";
+interface IAccordion extends IZenGridItem {
+    data?: Omit<IAccordionItem, "isActive" | "onClick">[];
+    activeIds?: string[];
+    className?: string;
+    onItemClick?: (id: string) => void;
+}
+export declare const Accordion: ({ data, className, activeIds, onItemClick }: IAccordion) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/accordion/accordion.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Accordion = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const accordionItem_1 = require("./accordionItem/accordionItem");
+const classNames_1 = require("../commonHelpers/classNames/classNames");
+const Accordion = ({ data = [], className = "", activeIds = [], onItemClick }) => {
+    const fullClassName = (0, classNames_1.classNames)(["zen-accordion", className]);
+    return (0, jsx_runtime_1.jsx)("div", { className: fullClassName, children: data.map((item) => (0, react_1.createElement)(accordionItem_1.AccordionItem, Object.assign({}, item, { key: item.id, isActive: activeIds.indexOf(item.id) !== -1, onClick: () => onItemClick && onItemClick(item.id) }))) });
+};
+exports.Accordion = Accordion;

package/dist/accordion/accordionItem/accordionItem.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from "react";
+export interface IAccordionItem {
+    id: string;
+    title: string;
+    content: ReactNode;
+    isActive: boolean;
+    onClick: React.MouseEventHandler<HTMLButtonElement>;
+    className?: string;
+}
+export declare const AccordionItem: ({ title, content, isActive, onClick, id }: IAccordionItem) => import("react/jsx-runtime").JSX.Element;

package/dist/accordion/accordionItem/accordionItem.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccordionItem = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const classNames_1 = require("../../commonHelpers/classNames/classNames");
+const iconChevronBottom_1 = require("../../icons/iconChevronBottom");
+const AccordionItem = ({ title, content, isActive, onClick, id }) => {
+    const ariaControlsId = (0, react_1.useId)();
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h3", { className: "zen-accordion__header", children: (0, jsx_runtime_1.jsxs)("button", { type: "button", "aria-expanded": isActive, "aria-controls": ariaControlsId, className: "zen-accordion__header-button", id: id, onClick: onClick, children: [title, (0, jsx_runtime_1.jsx)(iconChevronBottom_1.IconChevronBottom, { size: "large", className: (0, classNames_1.classNames)([
+                                "zen-accordion__header-arrow",
+                                isActive
+                                    ? "zen-accordion__header-arrow--rotated"
+                                    : ""
+                            ]) })] }) }), (0, jsx_runtime_1.jsx)("div", { id: ariaControlsId, "aria-labelledby": id, role: "region", className: (0, classNames_1.classNames)([
+                    "zen-accordion__content",
+                    isActive ? "" : "zen-accordion__content--hidden"
+                ]), children: content })] }));
+};
+exports.AccordionItem = AccordionItem;

package/dist/advancedGroupsFilter/advancedGroupsFilter.d.ts

@@ -0,0 +1,17 @@
+import "./advancedGroupsFilter.less";
+import { IFilterState } from "../groupsFilterRaw/groupsFilterInterfaces";
+import { IZenComponentProps } from "../commonHelpers/zenComponent";
+import { IDropdownItem } from "../dropdown/dropdown";
+export interface IAdvancedGroupsFilter extends IZenComponentProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onApply: (state: IFilterState) => void;
+    state?: IFilterState;
+    getData: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;
+    errorHandler: (e: Error) => void;
+    dataItems?: IDropdownItem[];
+    tooltipText?: string;
+    isMobile?: boolean;
+}
+export declare const AdvancedGroupsFilter: ({ isOpen, onClose, onApply, state, className, getData, errorHandler, dataItems, tooltipText, isMobile }: IAdvancedGroupsFilter) => import("react/jsx-runtime").JSX.Element;
+export declare const TRANSLATIONS: string[];

package/dist/advancedGroupsFilter/advancedGroupsFilter.js

@@ -0,0 +1,159 @@
+"use strict";
+
+const {
+  injectString
+} = require("../utils/localization/translationsDictionary");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TRANSLATIONS = exports.AdvancedGroupsFilter = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+injectString("cs", "Advanced groups filter", "Roz\u0161\xED\u0159en\xFD filtr skupin");
+injectString("da-DK", "Advanced groups filter", "Avanceret grupperfilter");
+injectString("de", "Advanced groups filter", "Erweiterte Gruppenfilter");
+injectString("en", "Advanced groups filter", "Advanced groups filter");
+injectString("es", "Advanced groups filter", "Filtro de grupos avanzado");
+injectString("fi-FI", "Advanced groups filter", "Kehittynyt ryhm\xE4suodatin");
+injectString("fr", "Advanced groups filter", "Filtre de groupes avanc\xE9");
+injectString("fr-FR", "Advanced groups filter", "Filtre avanc\xE9 des groupes");
+injectString("hu-HU", "Advanced groups filter", "Halad\xF3 csoportsz\u0171r\xE9s");
+injectString("id", "Advanced groups filter", "Filter grup lanjutan");
+injectString("it", "Advanced groups filter", "Filtro gruppi avanzato");
+injectString("ja", "Advanced groups filter", "\u9AD8\u5EA6\u306A\u30B0\u30EB\u30FC\u30D7\u30D5\u30A3\u30EB\u30BF\u30FC");
+injectString("ko-KR", "Advanced groups filter", "\uACE0\uAE09 \uADF8\uB8F9 \uD544\uD130");
+injectString("ms", "Advanced groups filter", "Penyaring kumpulan lanjutan");
+injectString("nb-NO", "Advanced groups filter", "Avanserte grupperfilter.");
+injectString("nl", "Advanced groups filter", "Geavanceerde groepenfilter");
+injectString("pl", "Advanced groups filter", "Zaawansowane filtry dla grup");
+injectString("pt-BR", "Advanced groups filter", "Filtro avan\xE7ado de grupos");
+injectString("pt-PT", "Advanced groups filter", "Filtro avan\xE7ado de grupos");
+injectString("sk-SK", "Advanced groups filter", "Pokro\u010Dil\xFD filter skup\xEDn.");
+injectString("sv", "Advanced groups filter", "Avancerade gruppfilter");
+injectString("th", "Advanced groups filter", "\u0E15\u0E31\u0E27\u0E01\u0E23\u0E2D\u0E07\u0E01\u0E25\u0E38\u0E48\u0E21\u0E02\u0E31\u0E49\u0E19\u0E2A\u0E39\u0E07");
+injectString("tr", "Advanced groups filter", "Geli\u015Fmi\u015F grup filtresi");
+injectString("zh-Hans", "Advanced groups filter", "\u9AD8\u7EA7\u7EC4\u7B5B\u9009\u5668");
+injectString("zh-TW", "Advanced groups filter", "\u9032\u968E\u7FA4\u7D44\u7BE9\u9078");
+injectString("ro-RO", "Advanced groups filter", "Filtru de grupuri avansat");
+injectString("cs", "Cancel", "Zru\u0161it");
+injectString("da-DK", "Cancel", "Annuller");
+injectString("de", "Cancel", "Abbrechen");
+injectString("en", "Cancel", "Cancel");
+injectString("es", "Cancel", "Cancelar");
+injectString("fi-FI", "Cancel", "Peruuta");
+injectString("fr", "Cancel", "Annuler");
+injectString("fr-FR", "Cancel", "Annuler");
+injectString("hu-HU", "Cancel", "M\xE9gse");
+injectString("id", "Cancel", "Batalkan");
+injectString("it", "Cancel", "Annullare");
+injectString("ja", "Cancel", "\u30AD\u30E3\u30F3\u30BB\u30EB");
+injectString("ko-KR", "Cancel", "\uCDE8\uC18C");
+injectString("ms", "Cancel", "Batal");
+injectString("nb-NO", "Cancel", "Avbryt");
+injectString("nl", "Cancel", "Annuleren");
+injectString("pl", "Cancel", "Anuluj");
+injectString("pt-BR", "Cancel", "Cancelar");
+injectString("pt-PT", "Cancel", "Cancelar");
+injectString("sk-SK", "Cancel", "Zru\u0161.");
+injectString("sv", "Cancel", "Avbryt");
+injectString("th", "Cancel", "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01");
+injectString("tr", "Cancel", "\u0130ptal");
+injectString("zh-Hans", "Cancel", "\u53D6\u6D88");
+injectString("zh-TW", "Cancel", "\u53D6\u6D88");
+injectString("ro-RO", "Cancel", "Anula\u021Bi");
+injectString("cs", "Apply", "Pou\u017E\xEDt");
+injectString("da-DK", "Apply", "Anvend");
+injectString("de", "Apply", "Anwenden");
+injectString("en", "Apply", "Apply");
+injectString("es", "Apply", "Aplicar");
+injectString("fi-FI", "Apply", "K\xE4yt\xE4");
+injectString("fr", "Apply", "Appliquer");
+injectString("fr-FR", "Apply", "Appliquer");
+injectString("hu-HU", "Apply", "Alkalmazd.");
+injectString("id", "Apply", "Terapkan");
+injectString("it", "Apply", "Applicare");
+injectString("ja", "Apply", "\u9069\u7528");
+injectString("ko-KR", "Apply", "\uC801\uC6A9");
+injectString("ms", "Apply", "Gunakan");
+injectString("nb-NO", "Apply", "Bruk");
+injectString("nl", "Apply", "Toepassen");
+injectString("pl", "Apply", "Zastosuj");
+injectString("pt-BR", "Apply", "Aplicar");
+injectString("pt-PT", "Apply", "Aplicar");
+injectString("sk-SK", "Apply", "Pou\u017Ei");
+injectString("sv", "Apply", "Ans\xF6k");
+injectString("th", "Apply", "\u0E43\u0E0A\u0E49");
+injectString("tr", "Apply", "Uygula");
+injectString("zh-Hans", "Apply", "\u5E94\u7528");
+injectString("zh-TW", "Apply", "\u5957\u7528");
+injectString("ro-RO", "Apply", "Aplica\u021Bi");
+const advancedGroupsFilterFormHelper_1 = require("./advancedGroupsFilterFormHelper");
+const advancedGroupsFilterForm_1 = require("./advancedGroupsFilterForm");
+const classNames_1 = require("../commonHelpers/classNames/classNames");
+const useLanguage_1 = require("../utils/localization/useLanguage");
+const modal_1 = require("../modal/modal");
+const zen_1 = require("../utils/zen");
+const AdvancedGroupsFilter = ({
+  isOpen,
+  onClose,
+  onApply,
+  state,
+  className,
+  getData,
+  errorHandler,
+  dataItems,
+  tooltipText,
+  isMobile
+}) => {
+  //const dropdownFocusedListClasses = ["zen-dropdown-searchable-trigger__input", "zen-dropdown-searchable-trigger__popup-trigger"];
+  const [currentState, setCurrentState] = (0, react_1.useState)((0, advancedGroupsFilterFormHelper_1.prepareCurrentFilterState)(state));
+  const [dataItemsValue, setDataItemsValue] = (0, react_1.useState)(dataItems || []);
+  const {
+    translate
+  } = (0, useLanguage_1.useLanguage)();
+  const handleClose = () => {
+    onClose();
+  };
+  (0, react_1.useEffect)(() => {
+    var _a;
+    const timeoutId = (_a = zen_1.zen.setTimeout) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, () => {
+      if (!dataItemsValue.length) {
+        getData().then(data => {
+          setDataItemsValue(data);
+        }).catch(e => {
+          errorHandler(e);
+        });
+      }
+    });
+    return () => {
+      var _a;
+      return (_a = zen_1.zen.clearTimeout) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, timeoutId);
+    };
+  }, [getData, errorHandler, dataItemsValue.length]);
+  const handleApply = () => {
+    onApply((0, advancedGroupsFilterFormHelper_1.prepareToFilterState)(currentState));
+  };
+  return (0, jsx_runtime_1.jsxs)(modal_1.Modal, {
+    title: translate("Advanced groups filter"),
+    className: (0, classNames_1.classNames)(["zen-advanced-groups-filter", className || ""]),
+    isOpen: isOpen,
+    modalContainerClassName: isMobile ? "zen-advanced-groups-filter-prioritized-modal" : undefined,
+    onClose: handleClose,
+    children: [(0, jsx_runtime_1.jsx)(advancedGroupsFilterForm_1.AdvancedGroupsFilterForm, {
+      dataItems: dataItemsValue,
+      getData: getData,
+      errorHandler: errorHandler,
+      state: currentState,
+      onStateChange: setCurrentState,
+      tooltipText: tooltipText
+    }), (0, jsx_runtime_1.jsx)(modal_1.Modal.SecondaryButton, {
+      onClick: onClose,
+      children: translate("Cancel")
+    }), (0, jsx_runtime_1.jsx)(modal_1.Modal.PrimaryButton, {
+      onClick: handleApply,
+      children: translate("Apply")
+    })]
+  });
+};
+exports.AdvancedGroupsFilter = AdvancedGroupsFilter;
+exports.TRANSLATIONS = [...advancedGroupsFilterForm_1.TRANSLATIONS, "Cancel", "Apply", "Advanced groups filter"];

package/dist/advancedGroupsFilter/advancedGroupsFilterForm.d.ts

@@ -0,0 +1,13 @@
+import "./advancedGroupsFilterForm.less";
+import { ICurrentAdvancedState } from "./advancedGroupsFilterFormHelper";
+import { IDropdownItem } from "../dropdown/dropdown";
+export interface IAdvancedGroupsFilterForm {
+    state: ICurrentAdvancedState[];
+    dataItems: IDropdownItem[];
+    onStateChange: (value: ICurrentAdvancedState[]) => void;
+    getData: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;
+    errorHandler: (e: Error) => void;
+    tooltipText?: string;
+}
+export declare const AdvancedGroupsFilterForm: ({ state, onStateChange, getData, errorHandler, dataItems, tooltipText }: IAdvancedGroupsFilterForm) => import("react/jsx-runtime").JSX.Element;
+export declare const TRANSLATIONS: string[];

package/dist/advancedGroupsFilter/advancedGroupsFilterForm.js

@@ -0,0 +1,154 @@
+"use strict";
+
+const {
+  injectString
+} = require("../utils/localization/translationsDictionary");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TRANSLATIONS = exports.AdvancedGroupsFilterForm = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+injectString("cs", "Create conditions below to filter the entire system.", "N\xED\u017Ee vytvo\u0159te podm\xEDnky pro filtrov\xE1n\xED cel\xE9ho syst\xE9mu.");
+injectString("da-DK", "Create conditions below to filter the entire system.", "Lav de nedenst\xE5ende betingelser for at filtrere hele systemet.");
+injectString("de", "Create conditions below to filter the entire system.", "Erstellen Sie unten Bedingungen, um das gesamte System zu filtern.");
+injectString("en", "Create conditions below to filter the entire system.", "Create conditions below to filter the entire system.");
+injectString("es", "Create conditions below to filter the entire system.", "Cree condiciones a continuaci\xF3n para filtrar todo el sistema.");
+injectString("fi-FI", "Create conditions below to filter the entire system.", "Luo alla olevat ehdot suodattaaksesi koko j\xE4rjestelm\xE4n.");
+injectString("fr", "Create conditions below to filter the entire system.", "Cr\xE9er les conditions ci-dessous pour filtrer l\u2019ensemble du syst\xE8me.");
+injectString("fr-FR", "Create conditions below to filter the entire system.", "Cr\xE9er des conditions ci-dessous pour filtrer tout le syst\xE8me.");
+injectString("hu-HU", "Create conditions below to filter the entire system.", "Add meg az al\xE1bbi felt\xE9teleket, hogy az eg\xE9sz rendszert sz\u0171rd.");
+injectString("id", "Create conditions below to filter the entire system.", "Buat kondisi di bawah ini untuk memfilter seluruh sistem.");
+injectString("it", "Create conditions below to filter the entire system.", "Creare le seguenti condizioni per filtrare l'intero sistema.");
+injectString("ja", "Create conditions below to filter the entire system.", "\u30B7\u30B9\u30C6\u30E0\u5168\u4F53\u3092\u30D5\u30A3\u30EB\u30BF\u30EA\u30F3\u30B0\u3059\u308B\u306B\u306F\u3001\u4EE5\u4E0B\u306E\u6761\u4EF6\u3092\u4F5C\u6210\u3057\u307E\u3059\u3002");
+injectString("ko-KR", "Create conditions below to filter the entire system.", "\uC804\uCCB4 \uC2DC\uC2A4\uD15C\uC744 \uD544\uD130\uB9C1\uD558\uB824\uBA74 \uC544\uB798\uC5D0 \uC870\uAC74\uC744 \uB9CC\uB4ED\uB2C8\uB2E4.");
+injectString("ms", "Create conditions below to filter the entire system.", "Cipta syarat di bawah untuk menyaring keseluruhan sistem.");
+injectString("nb-NO", "Create conditions below to filter the entire system.", "Opprett betingelser nedenfor for \xE5 filtrere hele systemet.");
+injectString("nl", "Create conditions below to filter the entire system.", "Maak hieronder voorwaarden om het hele systeem te filteren.");
+injectString("pl", "Create conditions below to filter the entire system.", "Utw\xF3rz warunki poni\u017Cej, aby zastosowa\u0107 filtry do ca\u0142ego systemu.");
+injectString("pt-BR", "Create conditions below to filter the entire system.", "Defina as condi\xE7\xF5es abaixo para filtrar todo o sistema.");
+injectString("pt-PT", "Create conditions below to filter the entire system.", "Crie as condi\xE7\xF5es abaixo para filtrar todo o sistema.");
+injectString("sk-SK", "Create conditions below to filter the entire system.", "Vytvor ni\u017E\u0161ie podmienky na filtrovanie cel\xE9ho syst\xE9mu.");
+injectString("sv", "Create conditions below to filter the entire system.", "Skapa villkor nedan f\xF6r att filtrera hela systemet.");
+injectString("th", "Create conditions below to filter the entire system.", "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E40\u0E07\u0E37\u0E48\u0E2D\u0E19\u0E44\u0E02\u0E14\u0E49\u0E32\u0E19\u0E25\u0E48\u0E32\u0E07\u0E40\u0E1E\u0E37\u0E48\u0E2D\u0E01\u0E23\u0E2D\u0E07\u0E17\u0E31\u0E49\u0E07\u0E23\u0E30\u0E1A\u0E1A");
+injectString("tr", "Create conditions below to filter the entire system.", "T\xFCm sistemi filtrelemek i\xE7in a\u015Fa\u011F\u0131daki ko\u015Fullar\u0131 olu\u015Fturun.");
+injectString("zh-Hans", "Create conditions below to filter the entire system.", "\u5728\u4E0B\u9762\u521B\u5EFA\u6761\u4EF6\u4EE5\u7B5B\u9009\u6574\u4E2A\u7CFB\u7EDF\u3002");
+injectString("zh-TW", "Create conditions below to filter the entire system.", "\u5728\u4E0B\u65B9\u5EFA\u7ACB\u689D\u4EF6\u4EE5\u7BE9\u9078\u6574\u500B\u7CFB\u7D71\u3002");
+injectString("ro-RO", "Create conditions below to filter the entire system.", "Crea\u021Bi condi\u021Biile de mai jos pentru a filtra \xEEntregul sistem.");
+injectString("cs", "Add new condition", "P\u0159idat novou podm\xEDnku");
+injectString("da-DK", "Add new condition", "Tilf\xF8j ny betingelse");
+injectString("de", "Add new condition", "Neue Bedingung hinzuf\xFCgen");
+injectString("en", "Add new condition", "Add new condition");
+injectString("es", "Add new condition", "A\xF1adir condici\xF3n nueva");
+injectString("fi-FI", "Add new condition", "Lis\xE4\xE4 uusi ehto");
+injectString("fr", "Add new condition", "Ajouter une nouvelle condition");
+injectString("fr-FR", "Add new condition", "Ajouter nouvelle condition");
+injectString("hu-HU", "Add new condition", "Adj hozz\xE1 egy \xFAj felt\xE9telt.");
+injectString("id", "Add new condition", "Tambah kondisi baru");
+injectString("it", "Add new condition", "Aggiungere nuova condizione");
+injectString("ja", "Add new condition", "\u65B0\u3057\u3044\u6761\u4EF6\u3092\u8FFD\u52A0");
+injectString("ko-KR", "Add new condition", "\uC0C8 \uC870\uAC74 \uCD94\uAC00");
+injectString("ms", "Add new condition", "Tambah syarat baharu");
+injectString("nb-NO", "Add new condition", "Legg til ny betingelse");
+injectString("nl", "Add new condition", "Nieuwe voorwaarde toevoegen");
+injectString("pl", "Add new condition", "Dodaj nowy warunek");
+injectString("pt-BR", "Add new condition", "Adicionar nova condi\xE7\xE3o");
+injectString("pt-PT", "Add new condition", "Adicionar nova condi\xE7\xE3o");
+injectString("sk-SK", "Add new condition", "Pridaj nov\xFA podmienku.");
+injectString("sv", "Add new condition", "L\xE4gg till nytt villkor");
+injectString("th", "Add new condition", "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E40\u0E07\u0E37\u0E48\u0E2D\u0E19\u0E44\u0E02\u0E43\u0E2B\u0E21\u0E48");
+injectString("tr", "Add new condition", "Yeni ko\u015Ful ekle");
+injectString("zh-Hans", "Add new condition", "\u6DFB\u52A0\u65B0\u6761\u4EF6");
+injectString("zh-TW", "Add new condition", "\u65B0\u589E\u689D\u4EF6");
+injectString("ro-RO", "Add new condition", "Ad\u0103uga\u021Bi o condi\u021Bie nou\u0103");
+const textIconButton_1 = require("../textIconButton/textIconButton");
+const advancedGroupsFilterFormSection_1 = require("./advancedGroupsFilterFormSection");
+const groupsHelper_1 = require("../groupsFilterRaw/groupsHelper");
+const groupsFilterInterfaces_1 = require("../groupsFilterRaw/groupsFilterInterfaces");
+const iconPlus_1 = require("../icons/iconPlus");
+const useLanguage_1 = require("../utils/localization/useLanguage");
+const AdvancedGroupsFilterForm = ({
+  state,
+  onStateChange,
+  getData,
+  errorHandler,
+  dataItems,
+  tooltipText
+}) => {
+  const {
+    translate
+  } = (0, useLanguage_1.useLanguage)();
+  const handleAddNewCondition = () => {
+    onStateChange([...state, {
+      sectionState: (0, groupsHelper_1.getDefaultFilterState)(),
+      interSectionRelation: groupsFilterInterfaces_1.RelationOperator.OR
+    }]);
+  };
+  const handleInterSectionRelationChange = idx => {
+    const newState = [...state.slice(0, idx), Object.assign(Object.assign({}, state[idx]), {
+      interSectionRelation: state[idx].interSectionRelation === groupsFilterInterfaces_1.RelationOperator.OR ? groupsFilterInterfaces_1.RelationOperator.AND : groupsFilterInterfaces_1.RelationOperator.OR
+    }), ...state.slice(idx + 1, state.length)];
+    onStateChange(newState);
+  };
+  const handleRelationChange = ind => {
+    const newState = [...state.slice(0, ind), Object.assign(Object.assign({}, state[ind]), {
+      sectionState: Object.assign(Object.assign({}, state[ind].sectionState), {
+        relation: state[ind].sectionState.relation === groupsFilterInterfaces_1.RelationOperator.OR ? groupsFilterInterfaces_1.RelationOperator.AND : groupsFilterInterfaces_1.RelationOperator.OR
+      })
+    }), ...state.slice(ind + 1, state.length)];
+    onStateChange(newState);
+  };
+  const handleStateChange = (ind, value) => {
+    const newState = [...state.slice(0, ind), Object.assign(Object.assign({}, state[ind]), {
+      sectionState: Object.assign(Object.assign({}, state[ind].sectionState), {
+        items: value.map(el => ({
+          id: el
+        }))
+      })
+    }), ...state.slice(ind + 1, state.length)];
+    onStateChange(newState);
+  };
+  const handleRemoveCondition = e => {
+    if (state.length === 1) {
+      return;
+    }
+    const ind = e.target.dataset.item ? Number(e.target.dataset.item) : undefined;
+    const newState = ind !== undefined ? [...state.slice(0, ind), ...state.slice(ind + 1, state.length)] : state;
+    onStateChange(newState);
+  };
+  return (0, jsx_runtime_1.jsxs)("div", {
+    className: "zen-advanced-groups-filter-form",
+    children: [(0, jsx_runtime_1.jsx)("div", {
+      className: "zen-advanced-groups-filter-form__description",
+      children: translate("Create conditions below to filter the entire system.")
+    }), (0, jsx_runtime_1.jsx)("ul", {
+      className: "zen-advanced-groups-filter-form__sections",
+      children: state.map((el, ind) => (0, jsx_runtime_1.jsx)(advancedGroupsFilterFormSection_1.AdvancedGroupsFilterFormSection, {
+        state: el.sectionState,
+        itemId: ind,
+        interSectionRelation: ind === 0 || state.length === 1 ? undefined : state[ind].interSectionRelation,
+        onInterSectionChange: handleInterSectionRelationChange,
+        onRelationChange: handleRelationChange,
+        onRemoveCondition: handleRemoveCondition,
+        onStateChange: handleStateChange,
+        isHasRemoveConditionButton: state.length > 1,
+        isHasTooltip: ind === 0,
+        tooltipText: tooltipText,
+        getData: getData,
+        errorHandler: errorHandler,
+        dataItems: dataItems
+      }, `form-section_ind-${ind}_${state.length}`))
+    }), (0, jsx_runtime_1.jsx)("div", {
+      className: "zen-form__add-section",
+      children: (0, jsx_runtime_1.jsx)(textIconButton_1.TextIconButton, {
+        className: "zen-advanced-groups-filter-form__add-button",
+        onClick: handleAddNewCondition,
+        iconPosition: textIconButton_1.ButtonIconPosition.Start,
+        iconSize: "large",
+        icon: iconPlus_1.IconPlus,
+        children: translate("Add new condition")
+      })
+    })]
+  });
+};
+exports.AdvancedGroupsFilterForm = AdvancedGroupsFilterForm;
+exports.TRANSLATIONS = [...advancedGroupsFilterFormSection_1.TRANSLATIONS, "Create conditions below to filter the entire system.", "Add new condition"];

package/dist/advancedGroupsFilter/advancedGroupsFilterFormHelper.d.ts

@@ -0,0 +1,7 @@
+import { IFilterState, RelationOperator } from "../groupsFilterRaw/groupsFilterInterfaces";
+export interface ICurrentAdvancedState {
+    sectionState: IFilterState;
+    interSectionRelation: RelationOperator;
+}
+export declare const prepareCurrentFilterState: (state?: IFilterState) => ICurrentAdvancedState[];
+export declare const prepareToFilterState: (state: ICurrentAdvancedState[]) => IFilterState<import("..").IEntityWithId>;

package/dist/advancedGroupsFilter/advancedGroupsFilterFormHelper.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prepareToFilterState = exports.prepareCurrentFilterState = void 0;
+const groupsHelper_1 = require("../groupsFilterRaw/groupsHelper");
+const groupsFilterInterfaces_1 = require("../groupsFilterRaw/groupsFilterInterfaces");
+const advancedGroupsFilterHelper_1 = require("./advancedGroupsFilterHelper");
+const prepareCurrentFilterState = (state) => {
+    if (!state) {
+        return [{ sectionState: (0, groupsHelper_1.getDefaultFilterState)(), interSectionRelation: groupsHelper_1.DEFAULT_RELATION_OPERATOR }];
+    }
+    const sectionItems = [];
+    const addToSelections = (item) => sectionItems.push(item);
+    const setItemState = (parentItem, prevRelation = groupsHelper_1.DEFAULT_RELATION_OPERATOR) => {
+        if (!(0, advancedGroupsFilterHelper_1.isFilterStateLeafItem)(parentItem)) {
+            return parentItem.items.map(item => setItemState(item, parentItem.relation));
+        }
+        return addToSelections({
+            interSectionRelation: prevRelation,
+            sectionState: Object.assign({}, parentItem)
+        });
+    };
+    setItemState(state);
+    return sectionItems;
+};
+exports.prepareCurrentFilterState = prepareCurrentFilterState;
+const prepareToFilterState = (state) => {
+    if (state.length === 1) {
+        return state[0].sectionState;
+    }
+    const getState = (sect) => {
+        const getId = entity => entity.id;
+        return Object.assign(Object.assign({}, sect), { sectionState: Object.assign(Object.assign({}, sect.sectionState), { items: sect.sectionState.items.map(getId).sort() }) });
+    };
+    const preparedState = state.reduce((prevState, section) => {
+        const itemState = getState(section);
+        if (state.length > 1 && (0, groupsHelper_1.isEntireOrganization)(itemState.sectionState) && itemState.sectionState.relation === groupsFilterInterfaces_1.RelationOperator.OR) {
+            return prevState;
+        }
+        if (!Object.keys(prevState).length) {
+            return itemState.sectionState;
+        }
+        return {
+            relation: itemState.interSectionRelation,
+            items: [
+                prevState,
+                itemState.sectionState
+            ]
+        };
+    }, {});
+    return Object.keys(preparedState).length ? (0, groupsHelper_1.toFilterState)((0, groupsHelper_1.simplifyFilterState)(preparedState)) : (0, groupsHelper_1.getDefaultFilterState)();
+};
+exports.prepareToFilterState = prepareToFilterState;