@geotab/zenith 3.1.1-beta.5 → 3.2.0-beta.0

package/esm/dataGrid/withFlexibleColumns/components/columnSettings.js

@@ -1,15 +1,84 @@
+import { injectString } from "../../../utils/localization/translationsDictionary";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from "../../../button/button";
 import { ButtonType } from "../../../button/buttonType";
 import { useLanguage } from "../../../utils/localization/useLanguage";
-const ColumnSettingsInner = ({ onReset, showFooter = true, children, ref }) => {
-    const { translate } = useLanguage();
-    return _jsxs("div", { className: "zen-columns-list", ref: ref, children: [_jsx("div", { className: "zen-columns-list__content", children: children }), showFooter
-                ? _jsx("div", { className: "zen-columns-list__footer", children: _jsx(Button, { "aria-label": translate("Reset column settings"), className: "zen-columns-list__reset", type: ButtonType.Tertiary, onClick: onReset, children: translate("Reset") }) })
-                : null] });
+injectString("cs", "Reset column settings", "Obnovit nastaven\xED sloupce");
+injectString("da-DK", "Reset column settings", "Nulstil kolonneindstillinger");
+injectString("de", "Reset column settings", "Spalteneinstellungen zur\xFCcksetzen");
+injectString("en", "Reset column settings", "Reset column settings");
+injectString("es", "Reset column settings", "Restablecer configuraci\xF3n de columna");
+injectString("fi-FI", "Reset column settings", "Palauta sarakeasetukset");
+injectString("fr", "Reset column settings", "R\xE9initialiser les param\xE8tres de la colonne");
+injectString("fr-FR", "Reset column settings", "R\xE9initialiser les param\xE8tres des colonnes");
+injectString("hu-HU", "Reset column settings", "Oszlopbe\xE1ll\xEDt\xE1sok alaphelyzetbe \xE1ll\xEDt\xE1sa");
+injectString("id", "Reset column settings", "Reset pengaturan kolom");
+injectString("it", "Reset column settings", "Ripristinare impostazioni colonna");
+injectString("ja", "Reset column settings", "\u5217\u8A2D\u5B9A\u3092\u30EA\u30BB\u30C3\u30C8");
+injectString("ko-KR", "Reset column settings", "\uC5F4 \uC124\uC815 \uC7AC\uC124\uC815");
+injectString("ms", "Reset column settings", "Tetapkan semula tetapan lajur");
+injectString("nb-NO", "Reset column settings", "Tilbakestill kolonneinnstillinger");
+injectString("nl", "Reset column settings", "Reset kolominstellingen");
+injectString("pl", "Reset column settings", "Zresetuj ustawienia kolumny");
+injectString("pt-BR", "Reset column settings", "Redefinir configura\xE7\xF5es de coluna");
+injectString("sk-SK", "Reset column settings", "Obnov nastavenia st\u013Apca.");
+injectString("sv", "Reset column settings", "\xC5terst\xE4ll kolumninst\xE4llningar");
+injectString("th", "Reset column settings", "\u0E23\u0E35\u0E40\u0E0B\u0E47\u0E15\u0E01\u0E32\u0E23\u0E15\u0E31\u0E49\u0E07\u0E04\u0E48\u0E32\u0E04\u0E2D\u0E25\u0E31\u0E21\u0E19\u0E4C");
+injectString("tr", "Reset column settings", "S\xFCtun ayarlar\u0131n\u0131 s\u0131f\u0131rla");
+injectString("zh-Hans", "Reset column settings", "\u91CD\u7F6E\u5217\u8BBE\u7F6E");
+injectString("zh-TW", "Reset column settings", "\u91CD\u8A2D\u6B04\u8A2D\u5B9A");
+injectString("cs", "Reset", "Obnovit");
+injectString("da-DK", "Reset", "Nulstil");
+injectString("de", "Reset", "Zur\xFCcksetzen");
+injectString("en", "Reset", "Reset");
+injectString("es", "Reset", "Restaurar");
+injectString("fi-FI", "Reset", "Palauta");
+injectString("fr", "Reset", "R\xE9initialiser");
+injectString("fr-FR", "Reset", "R\xE9initialiser");
+injectString("hu-HU", "Reset", "\xC1ll\xEDtsd vissza.");
+injectString("id", "Reset", "Atur Ulang");
+injectString("it", "Reset", "Ripristinare");
+injectString("ja", "Reset", "\u30EA\u30BB\u30C3\u30C8");
+injectString("ko-KR", "Reset", "\uC7AC\uC124\uC815");
+injectString("ms", "Reset", "Tetap Semula");
+injectString("nb-NO", "Reset", "Tilbakestill");
+injectString("nl", "Reset", "Herstellen");
+injectString("pl", "Reset", "Resetuj");
+injectString("pt-BR", "Reset", "Redefinir");
+injectString("sk-SK", "Reset", "Obnov");
+injectString("sv", "Reset", "\xC5terst\xE4ll");
+injectString("th", "Reset", "\u0E23\u0E35\u0E40\u0E0B\u0E47\u0E15");
+injectString("tr", "Reset", "S\u0131f\u0131rla");
+injectString("zh-Hans", "Reset", "\u91CD\u7F6E");
+injectString("zh-TW", "Reset", "\u91CD\u8A2D");
+const ColumnSettingsInner = ({
+  onReset,
+  showFooter = true,
+  children,
+  ref
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  return _jsxs("div", {
+    className: "zen-columns-list",
+    ref: ref,
+    children: [_jsx("div", {
+      className: "zen-columns-list__content",
+      children: children
+    }), showFooter ? _jsx("div", {
+      className: "zen-columns-list__footer",
+      children: _jsx(Button, {
+        "aria-label": translate("Reset column settings"),
+        className: "zen-columns-list__reset",
+        type: ButtonType.Tertiary,
+        onClick: onReset,
+        children: translate("Reset")
+      })
+    }) : null]
+  });
 };
 const ColumnSettingsComp = ColumnSettingsInner;
-export const ColumnSettings = Object.assign(ColumnSettingsComp, { translations: [
-        "Reset column settings",
-        "Reset"
-    ] });
+export const ColumnSettings = Object.assign(ColumnSettingsComp, {
+  translations: ["Reset column settings", "Reset"]
+});

package/esm/dataGrid/withFlexibleColumns/components/columnSettingsSidePanel.js

@@ -3,19 +3,48 @@ import { useEffect, useRef } from "react";
 import { MobileSheet } from "../../../mobileSheet/mobileSheet";
 import { Button } from "../../../button/button";
 import { useLanguage } from "../../../utils/localization/useLanguage";
-const ColumnSettingsSidePanelComp = ({ triggerRef, isOpen, onOpen, onClose, onReset, children }) => {
-    const { translate } = useLanguage();
-    const abortEventsControllerRef = useRef(null);
-    useEffect(() => {
-        var _a;
-        if (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) {
-            (_a = abortEventsControllerRef.current) === null || _a === void 0 ? void 0 : _a.abort();
-            abortEventsControllerRef.current = new AbortController();
-            triggerRef.current.addEventListener("click", () => onOpen(!isOpen), { signal: abortEventsControllerRef.current.signal });
-        }
-    }, [triggerRef, isOpen, onOpen]);
-    return _jsxs(MobileSheet, { panelPosition: "right", triggerRef: triggerRef, label: translate("Customize view"), isOpen: isOpen, onCloseClick: onClose, onHidePanel: onClose, children: [_jsx(MobileSheet.Title, { children: translate("Customize view") }), _jsx(MobileSheet.Content, { children: children }), _jsx(MobileSheet.Footer, { children: _jsx(Button, { onClick: onReset, type: "tertiary", children: "Reset" }) })] });
+const ColumnSettingsSidePanelComp = ({
+  triggerRef,
+  isOpen,
+  onOpen,
+  onClose,
+  onReset,
+  children
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  const abortEventsControllerRef = useRef(null);
+  useEffect(() => {
+    var _a;
+    if (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) {
+      (_a = abortEventsControllerRef.current) === null || _a === void 0 ? void 0 : _a.abort();
+      abortEventsControllerRef.current = new AbortController();
+      triggerRef.current.addEventListener("click", () => onOpen(!isOpen), {
+        signal: abortEventsControllerRef.current.signal
+      });
+    }
+  }, [triggerRef, isOpen, onOpen]);
+  return _jsxs(MobileSheet, {
+    panelPosition: "right",
+    triggerRef: triggerRef,
+    label: translate("Customize view"),
+    isOpen: isOpen,
+    onCloseClick: onClose,
+    onHidePanel: onClose,
+    children: [_jsx(MobileSheet.Title, {
+      children: translate("Customize view")
+    }), _jsx(MobileSheet.Content, {
+      children: children
+    }), _jsx(MobileSheet.Footer, {
+      children: _jsx(Button, {
+        onClick: onReset,
+        type: "tertiary",
+        children: "Reset"
+      })
+    })]
+  });
 };
-export const ColumnSettingsSidePanel = Object.assign(ColumnSettingsSidePanelComp, { translations: [
-        "Customize view"
-    ] });
+export const ColumnSettingsSidePanel = Object.assign(ColumnSettingsSidePanelComp, {
+  translations: ["Customize view"]
+});

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

@@ -1,3 +1,4 @@
+import { injectString } from "../../../../utils/localization/translationsDictionary";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ButtonIconPosition, TextIconButton } from "../../../../textIconButton/textIconButton";
 import { classNames } from "../../../../commonHelpers/classNames/classNames";
@@ -12,37 +13,222 @@ import { useResizeObserver } from "../../../../commonHelpers/hooks/useResizeObse
 import { Menu } from "../../../../menu/menu";
 import { IconDotVertical } from "../../../../icons/iconDotVertical";
 import { Button } from "../../../../button/button";
-export const BulkActions = ({ selected, allSelected, className, onClearSelection, onSelectAll, gridType = DeviceType.Desktop, children, turnOffSelectAll }) => {
-    var _a;
-    const { translate } = useLanguage();
-    const childrenArray = useMemo(() => Children.toArray(children), [children]);
-    const buttonHolder = useRef(null);
-    const bulkActionsElement = useRef(null);
-    const moreButtonRef = useRef(null);
-    const { result } = useResizeObserver({ target: buttonHolder.current });
-    const widthDelta = ((_a = moreButtonRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 32;
-    const maxWidth = (result === null || result === void 0 ? void 0 : result.contentRect.width) || 1000;
-    const { visibleElements, nonFittingElements, hiddenContainerRef } = useNonFittingElements({ maxWidth, data: childrenArray, hiddenElementsCountToRender: 10, widthDelta });
-    const isMobile = gridType === DeviceType.Mobile;
-    const text = translate("{1} selected").replace("{1}", allSelected ? translate("All") : selected.toFixed());
-    return _jsxs("div", { className: classNames(["zen-bulk-actions", className || "", isMobile ? "zen-bulk-actions--condensed" : ""]), ref: bulkActionsElement, children: [_jsx(TextIconButton, { className: "zen-bulk-actions__button-clear", icon: IconClose, iconPosition: ButtonIconPosition.Start, iconSize: "large", type: "tertiary-black", title: translate("Clear selection"), "aria-label": translate("Clear selection"), onClick: onClearSelection }), _jsx("span", { className: "zen-bulk-actions__number-of-selected ellipsis", children: text }), onSelectAll && !turnOffSelectAll
-                ? _jsx(Button, { type: "tertiary", className: "zen-bulk-actions__select-all", disabled: allSelected, onClick: onSelectAll, children: translate("Select all") })
-                : null, _jsxs("div", { className: "zen-bulk-actions__action-button-holder", ref: buttonHolder, children: [Children.map(visibleElements, element => cloneElement(element, {
-                        disabled: selected > 0 || allSelected ? element.props.disabled : true
-                    })), nonFittingElements.length > 0
-                        ? _jsx(Menu, { title: translate("More"), trigger: _jsx(TextIconButton, { ref: moreButtonRef, className: "zen-bulk-actions__action-button zen-bulk-actions__action-button-more", icon: IconDotVertical, iconPosition: ButtonIconPosition.Start, iconSize: "large", type: isMobile ? "tertiary-black" : "secondary", title: translate("More"), "aria-label": translate("More") }), children: nonFittingElements.map(child => {
-                                const props = child.props;
-                                const clickHandler = "clickHandler" in props ? props.clickHandler : undefined;
-                                const link = "link" in props ? props.link : undefined;
-                                return _jsx(Menu.Item, { id: props.id || "", name: props.title, icon: props.icon, disabled: props.disabled, onClick: clickHandler, link: link }, props.id);
-                            }) })
-                        : null, _jsx("div", { className: "zen-bulk-actions__hidden-elements", ref: hiddenContainerRef, children: childrenArray })] })] });
+injectString("cs", "{1} selected", "{1} vybran\xFD/vybran\xE9");
+injectString("da-DK", "{1} selected", "{1} valgt");
+injectString("de", "{1} selected", "{1} ausgew\xE4hlt");
+injectString("en", "{1} selected", "{1} selected");
+injectString("es", "{1} selected", "Seleccionados: {1}");
+injectString("fi-FI", "{1} selected", "{1} valittu");
+injectString("fr", "{1} selected", "{1} s\xE9lectionn\xE9(s)");
+injectString("fr-FR", "{1} selected", "{1} s\xE9lectionn\xE9(s)");
+injectString("hu-HU", "{1} selected", "Kiv\xE1lasztva: .");
+injectString("id", "{1} selected", "{1} dipilih");
+injectString("it", "{1} selected", "Elementi selezionati: {1}");
+injectString("ja", "{1} selected", "{1} \u3064\u9078\u629E");
+injectString("ko-KR", "{1} selected", "{1} \uC120\uD0DD\uB428");
+injectString("ms", "{1} selected", "{1} dipilih");
+injectString("nb-NO", "{1} selected", "{1} valgt");
+injectString("nl", "{1} selected", "{1} geselecteerd");
+injectString("pl", "{1} selected", "Wybrano {1}");
+injectString("pt-BR", "{1} selected", "{1} selecionado(s)");
+injectString("sk-SK", "{1} selected", "{1} vybran\xE9");
+injectString("sv", "{1} selected", "{1} vald");
+injectString("th", "{1} selected", "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E41\u0E25\u0E49\u0E27 {1}");
+injectString("tr", "{1} selected", "{1} se\xE7ildi");
+injectString("zh-Hans", "{1} selected", "\u5DF2\u9009\u4E2D {1} \u9879");
+injectString("zh-TW", "{1} selected", "\u5DF2\u9078\u53D6 {1} \u500B");
+injectString("cs", "All", "V\u0161e");
+injectString("da-DK", "All", "Alle");
+injectString("de", "All", "Alle");
+injectString("en", "All", "All");
+injectString("es", "All", "Todo");
+injectString("fi-FI", "All", "Kaikki");
+injectString("fr", "All", "Tout");
+injectString("fr-FR", "All", "Tous");
+injectString("hu-HU", "All", "Minden");
+injectString("id", "All", "Semua");
+injectString("it", "All", "Tutti");
+injectString("ja", "All", "\u3059\u3079\u3066");
+injectString("ko-KR", "All", "\uC804\uCCB4");
+injectString("ms", "All", "Semua");
+injectString("nb-NO", "All", "Alle");
+injectString("nl", "All", "Alle");
+injectString("pl", "All", "Wszystkie");
+injectString("pt-BR", "All", "Tudo");
+injectString("sk-SK", "All", "V\u0161etko");
+injectString("sv", "All", "Alla");
+injectString("th", "All", "\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14");
+injectString("tr", "All", "T\xFCm\xFC");
+injectString("zh-Hans", "All", "\u5168\u90E8");
+injectString("zh-TW", "All", "\u5168\u90E8");
+injectString("cs", "Clear selection", "Vymazat v\xFDb\u011Br");
+injectString("da-DK", "Clear selection", "Ryd markering");
+injectString("de", "Clear selection", "Auswahl l\xF6schen");
+injectString("en", "Clear selection", "Clear selection");
+injectString("es", "Clear selection", "Borrar selecci\xF3n");
+injectString("fi-FI", "Clear selection", "Tyhjenn\xE4 valinta");
+injectString("fr", "Clear selection", "Effacer la s\xE9lection");
+injectString("fr-FR", "Clear selection", "Effacer la s\xE9lection");
+injectString("hu-HU", "Clear selection", "T\xF6r\xF6ld a kijel\xF6l\xE9st.");
+injectString("id", "Clear selection", "Hapus pilihan");
+injectString("it", "Clear selection", "Cancellare selezione");
+injectString("ja", "Clear selection", "\u9078\u629E\u3092\u30AF\u30EA\u30A2\u3057\u307E\u3059");
+injectString("ko-KR", "Clear selection", "\uC120\uD0DD \uC9C0\uC6B0\uAE30");
+injectString("ms", "Clear selection", "Kosongkan pilihan");
+injectString("nb-NO", "Clear selection", "Fjern utvalg");
+injectString("nl", "Clear selection", "Selectie wissen");
+injectString("pl", "Clear selection", "Wyczy\u015B\u0107 wyb\xF3r");
+injectString("pt-BR", "Clear selection", "Limpar sele\xE7\xE3o");
+injectString("sk-SK", "Clear selection", "Vyma\u017E v\xFDber.");
+injectString("sv", "Clear selection", "Rensa val");
+injectString("th", "Clear selection", "\u0E25\u0E49\u0E32\u0E07\u0E01\u0E32\u0E23\u0E40\u0E25\u0E37\u0E2D\u0E01");
+injectString("tr", "Clear selection", "Se\xE7imi temizle");
+injectString("zh-Hans", "Clear selection", "\u6E05\u9664\u9009\u62E9");
+injectString("zh-TW", "Clear selection", "\u6E05\u9664\u9078\u53D6\u9805\u76EE");
+injectString("cs", "Select all", "Vybrat v\u0161e");
+injectString("da-DK", "Select all", "V\xE6lg alle");
+injectString("de", "Select all", "Alle ausw\xE4hlen");
+injectString("en", "Select all", "Select all");
+injectString("es", "Select all", "Seleccionar todo");
+injectString("fi-FI", "Select all", "Valitse kaikki");
+injectString("fr", "Select all", "S\xE9lectionner tout");
+injectString("fr-FR", "Select all", "S\xE9lectionner tout");
+injectString("hu-HU", "Select all", "V\xE1laszd ki az \xF6sszeset.");
+injectString("id", "Select all", "Pilih semua");
+injectString("it", "Select all", "Selezionare tutto");
+injectString("ja", "Select all", "\u3059\u3079\u3066\u9078\u629E");
+injectString("ko-KR", "Select all", "\uBAA8\uB450 \uC120\uD0DD");
+injectString("ms", "Select all", "Pilih semua");
+injectString("nb-NO", "Select all", "Velg alle");
+injectString("nl", "Select all", "Alles selecteren");
+injectString("pl", "Select all", "Wybierz wszystko");
+injectString("pt-BR", "Select all", "Selecionar tudo");
+injectString("sk-SK", "Select all", "Vyber v\u0161etko.");
+injectString("sv", "Select all", "V\xE4lj alla");
+injectString("th", "Select all", "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E17\u0E31\u0E49\u0E07\u0E2B\u0E21\u0E14");
+injectString("tr", "Select all", "T\xFCm\xFCn\xFC se\xE7");
+injectString("zh-Hans", "Select all", "\u5168\u9009");
+injectString("zh-TW", "Select all", "\u5168\u9078");
+injectString("cs", "More", "V\xEDce");
+injectString("da-DK", "More", "Mere");
+injectString("de", "More", "Mehr");
+injectString("en", "More", "More");
+injectString("es", "More", "M\xE1s");
+injectString("fi-FI", "More", "Lis\xE4\xE4");
+injectString("fr", "More", "Plus");
+injectString("fr-FR", "More", "En savoir plus");
+injectString("hu-HU", "More", "M\xE9g t\xF6bb.");
+injectString("id", "More", "Lainnya");
+injectString("it", "More", "Altro");
+injectString("ja", "More", "\u305D\u306E\u4ED6");
+injectString("ko-KR", "More", "\uC790\uC138\uD788");
+injectString("ms", "More", "Lagi");
+injectString("nb-NO", "More", "Mer");
+injectString("nl", "More", "Meer");
+injectString("pl", "More", "Wi\u0119cej");
+injectString("pt-BR", "More", "Mais");
+injectString("sk-SK", "More", "Viac");
+injectString("sv", "More", "Mer");
+injectString("th", "More", "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E40\u0E15\u0E34\u0E21");
+injectString("tr", "More", "Di\u011Fer");
+injectString("zh-Hans", "More", "\u66F4\u591A");
+injectString("zh-TW", "More", "\u66F4\u591A");
+export const BulkActions = ({
+  selected,
+  allSelected,
+  className,
+  onClearSelection,
+  onSelectAll,
+  gridType = DeviceType.Desktop,
+  children,
+  turnOffSelectAll
+}) => {
+  var _a;
+  const {
+    translate
+  } = useLanguage();
+  const childrenArray = useMemo(() => Children.toArray(children), [children]);
+  const buttonHolder = useRef(null);
+  const bulkActionsElement = useRef(null);
+  const moreButtonRef = useRef(null);
+  const {
+    result
+  } = useResizeObserver({
+    target: buttonHolder.current
+  });
+  const widthDelta = ((_a = moreButtonRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 32;
+  const maxWidth = (result === null || result === void 0 ? void 0 : result.contentRect.width) || 1000;
+  const {
+    visibleElements,
+    nonFittingElements,
+    hiddenContainerRef
+  } = useNonFittingElements({
+    maxWidth,
+    data: childrenArray,
+    hiddenElementsCountToRender: 10,
+    widthDelta
+  });
+  const isMobile = gridType === DeviceType.Mobile;
+  const text = translate("{1} selected").replace("{1}", allSelected ? translate("All") : selected.toFixed());
+  return _jsxs("div", {
+    className: classNames(["zen-bulk-actions", className || "", isMobile ? "zen-bulk-actions--condensed" : ""]),
+    ref: bulkActionsElement,
+    children: [_jsx(TextIconButton, {
+      className: "zen-bulk-actions__button-clear",
+      icon: IconClose,
+      iconPosition: ButtonIconPosition.Start,
+      iconSize: "large",
+      type: "tertiary-black",
+      title: translate("Clear selection"),
+      "aria-label": translate("Clear selection"),
+      onClick: onClearSelection
+    }), _jsx("span", {
+      className: "zen-bulk-actions__number-of-selected ellipsis",
+      children: text
+    }), onSelectAll && !turnOffSelectAll ? _jsx(Button, {
+      type: "tertiary",
+      className: "zen-bulk-actions__select-all",
+      disabled: allSelected,
+      onClick: onSelectAll,
+      children: translate("Select all")
+    }) : null, _jsxs("div", {
+      className: "zen-bulk-actions__action-button-holder",
+      ref: buttonHolder,
+      children: [Children.map(visibleElements, element => cloneElement(element, {
+        disabled: selected > 0 || allSelected ? element.props.disabled : true
+      })), nonFittingElements.length > 0 ? _jsx(Menu, {
+        title: translate("More"),
+        trigger: _jsx(TextIconButton, {
+          ref: moreButtonRef,
+          className: "zen-bulk-actions__action-button zen-bulk-actions__action-button-more",
+          icon: IconDotVertical,
+          iconPosition: ButtonIconPosition.Start,
+          iconSize: "large",
+          type: isMobile ? "tertiary-black" : "secondary",
+          title: translate("More"),
+          "aria-label": translate("More")
+        }),
+        children: nonFittingElements.map(child => {
+          const props = child.props;
+          const clickHandler = "clickHandler" in props ? props.clickHandler : undefined;
+          const link = "link" in props ? props.link : undefined;
+          return _jsx(Menu.Item, {
+            id: props.id || "",
+            name: props.title,
+            icon: props.icon,
+            disabled: props.disabled,
+            onClick: clickHandler,
+            link: link
+          }, props.id);
+        })
+      }) : null, _jsx("div", {
+        className: "zen-bulk-actions__hidden-elements",
+        ref: hiddenContainerRef,
+        children: childrenArray
+      })]
+    })]
+  });
 };
 BulkActions.ActionLink = BulkActionLink;
 BulkActions.ActionButton = BulkActionButton;
-BulkActions.translations = [
-    "Clear selection",
-    "More options",
-    "{1} selected",
-    "Selecting..."
-];
+BulkActions.translations = ["Clear selection", "More options", "{1} selected", "Selecting..."];