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

package/esm/columnsSelector/columnsSelector.js

@@ -1,3 +1,4 @@
+import { injectString } from "../utils/localization/translationsDictionary";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Popup } from "../popup/popup";
 import { ColumnsTab } from "./columnsTab/columnsTab";
@@ -11,15 +12,94 @@ import { Button } from "../button/button";
 /**
  * @deprecated - will be removed in future releases
 */
-export const ColumnsSelector = ({ id, columns = [], onColumnToggle, additionalColumns = [], onAdditionalColumnToggle, onColumnsReset }) => {
-    const { translate } = useLanguage();
-    const triggerButton = _jsx(Button, { "aria-label": translate("Column Settings"), type: "tertiary-black", className: "zen-caption", children: _jsx(IconSettings3, { size: "large" }) });
-    const resetButton = onColumnsReset
-        ? _jsx(TextIconButton, { className: "zen-button--separate zen-columns-filter__item zen-columns-filter__item--button zen-columns-filter__reset", iconPosition: ButtonIconPosition.Start, icon: IconRefresh, iconSize: SvgIconSize.Huge, onClick: onColumnsReset, children: translate("Reset to default") })
-        : _jsx(_Fragment, {});
-    return _jsxs(Popup, { className: "zen-columns-filter", trigger: triggerButton, alignment: "bottom-right", ariaLabel: translate("Column Settings"), children: [resetButton, _jsx(ColumnsTab, { id: id, columns: columns, onColumnToggle: state => onColumnToggle && onColumnToggle(state) }), _jsx(ColumnsTabGroup, { columns: additionalColumns, onColumnToggle: state => onAdditionalColumnToggle && onAdditionalColumnToggle(state) })] });
+injectString("cs", "Column Settings", "Nastaven\xED sloupc\u016F");
+injectString("da-DK", "Column Settings", "Kolonneindstillinger");
+injectString("de", "Column Settings", "Spalteneinstellungen");
+injectString("en", "Column Settings", "Column Settings");
+injectString("es", "Column Settings", "Configuraci\xF3n de columnas");
+injectString("fi-FI", "Column Settings", "Sarakkeiden asetukset");
+injectString("fr", "Column Settings", "Param\xE8tres des colonnes");
+injectString("fr-FR", "Column Settings", "Param\xE8tres des colonnes");
+injectString("hu-HU", "Column Settings", "Oszlopbe\xE1ll\xEDt\xE1sok");
+injectString("id", "Column Settings", "Pengaturan Kolom");
+injectString("it", "Column Settings", "Impostazioni colonna");
+injectString("ja", "Column Settings", "\u5217\u306E\u8A2D\u5B9A");
+injectString("ko-KR", "Column Settings", "\uC5F4 \uC124\uC815");
+injectString("ms", "Column Settings", "Tetapan Lajur");
+injectString("nb-NO", "Column Settings", "Kolonneinnstillinger");
+injectString("nl", "Column Settings", "Kolominstellingen");
+injectString("pl", "Column Settings", "Ustawienia kolumn");
+injectString("pt-BR", "Column Settings", "Configura\xE7\xF5es da coluna");
+injectString("sk-SK", "Column Settings", "Nastavenia st\u013Apcov");
+injectString("sv", "Column Settings", "Kolumninst\xE4llningar");
+injectString("th", "Column Settings", "\u0E01\u0E32\u0E23\u0E15\u0E31\u0E49\u0E07\u0E04\u0E48\u0E32\u0E04\u0E2D\u0E25\u0E31\u0E21\u0E19\u0E4C");
+injectString("tr", "Column Settings", "S\xFCtun Ayarlar\u0131");
+injectString("zh-Hans", "Column Settings", "\u5217\u8BBE\u7F6E");
+injectString("zh-TW", "Column Settings", "\u6B04\u8A2D\u5B9A");
+injectString("cs", "Reset to default", "Obnovit v\xFDchoz\xED");
+injectString("da-DK", "Reset to default", "Nulstil til standard");
+injectString("de", "Reset to default", "Auf Standard zur\xFCcksetzen");
+injectString("en", "Reset to default", "Reset to default");
+injectString("es", "Reset to default", "Restaurar a los valores por defecto");
+injectString("fi-FI", "Reset to default", "Palauta oletus");
+injectString("fr", "Reset to default", "R\xE9tablir les valeurs par d\xE9faut");
+injectString("fr-FR", "Reset to default", "R\xE9tablir les valeurs par d\xE9faut");
+injectString("hu-HU", "Reset to default", "\xC1ll\xEDtsd vissza az alap\xE9rtelmezettre.");
+injectString("id", "Reset to default", "Atur ulang ke default");
+injectString("it", "Reset to default", "Ripristina impostazioni predefinite");
+injectString("ja", "Reset to default", "\u30C7\u30D5\u30A9\u30EB\u30C8\u306B\u30EA\u30BB\u30C3\u30C8");
+injectString("ko-KR", "Reset to default", "\uAE30\uBCF8\uAC12\uC73C\uB85C \uC7AC\uC124\uC815");
+injectString("ms", "Reset to default", "Tetapkan semula kepada lalai");
+injectString("nb-NO", "Reset to default", "Tilbakestill til standard");
+injectString("nl", "Reset to default", "Standaardinstellingen herstellen");
+injectString("pl", "Reset to default", "Przywr\xF3\u0107 ustawienia domy\u015Blne");
+injectString("pt-BR", "Reset to default", "Redefinir para o padr\xE3o");
+injectString("sk-SK", "Reset to default", "Obnov na predvolen\xE9.");
+injectString("sv", "Reset to default", "\xC5terst\xE4ll till standard");
+injectString("th", "Reset to default", "\u0E23\u0E35\u0E40\u0E0B\u0E47\u0E15\u0E40\u0E1B\u0E47\u0E19\u0E04\u0E48\u0E32\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19");
+injectString("tr", "Reset to default", "Varsay\u0131lana s\u0131f\u0131rla");
+injectString("zh-Hans", "Reset to default", "\u91CD\u7F6E\u4E3A\u9ED8\u8BA4\u503C");
+injectString("zh-TW", "Reset to default", "\u91CD\u8A2D\u70BA\u9810\u8A2D\u503C");
+export const ColumnsSelector = ({
+  id,
+  columns = [],
+  onColumnToggle,
+  additionalColumns = [],
+  onAdditionalColumnToggle,
+  onColumnsReset
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  const triggerButton = _jsx(Button, {
+    "aria-label": translate("Column Settings"),
+    type: "tertiary-black",
+    className: "zen-caption",
+    children: _jsx(IconSettings3, {
+      size: "large"
+    })
+  });
+  const resetButton = onColumnsReset ? _jsx(TextIconButton, {
+    className: "zen-button--separate zen-columns-filter__item zen-columns-filter__item--button zen-columns-filter__reset",
+    iconPosition: ButtonIconPosition.Start,
+    icon: IconRefresh,
+    iconSize: SvgIconSize.Huge,
+    onClick: onColumnsReset,
+    children: translate("Reset to default")
+  }) : _jsx(_Fragment, {});
+  return _jsxs(Popup, {
+    className: "zen-columns-filter",
+    trigger: triggerButton,
+    alignment: "bottom-right",
+    ariaLabel: translate("Column Settings"),
+    children: [resetButton, _jsx(ColumnsTab, {
+      id: id,
+      columns: columns,
+      onColumnToggle: state => onColumnToggle && onColumnToggle(state)
+    }), _jsx(ColumnsTabGroup, {
+      columns: additionalColumns,
+      onColumnToggle: state => onAdditionalColumnToggle && onAdditionalColumnToggle(state)
+    })]
+  });
 };
-export const TRANSLATIONS = [
-    "Columns",
-    "Reset to default"
-];
+export const TRANSLATIONS = ["Columns", "Reset to default"];

package/esm/columnsSelector/columnsTab/columnsTab.js

@@ -1,19 +1,58 @@
+import { injectString } from "../../utils/localization/translationsDictionary";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { SelectList } from "../../selectList/selectList";
 import { CheckboxState } from "../../checkbox/checkboxState";
 import { useLanguage } from "../../utils/localization/useLanguage";
-export const ColumnsTab = ({ columns, onColumnToggle, id }) => {
-    const { translate } = useLanguage();
-    const listItems = columns.map(function (col) {
-        return {
-            id: col.id,
-            state: col.isChecked ? CheckboxState.On : CheckboxState.Off,
-            disabled: col.isBlocked,
-            children: col.label
-        };
-    });
-    return _jsx(SelectList, { title: translate("Columns selector"), multiselect: true, showCheckbox: true, id: `columns-list-${id}`, value: new Map(columns.map(col => [col.id, col.isChecked ? CheckboxState.On : CheckboxState.Off])), onChange: state => onColumnToggle(columns.map(col => (Object.assign(Object.assign({}, col), { isChecked: state.get(col.id) === CheckboxState.On })))), items: listItems });
+injectString("cs", "Columns", "Sloupce");
+injectString("da-DK", "Columns", "Kolonner");
+injectString("de", "Columns", "Spalten");
+injectString("en", "Columns", "Columns");
+injectString("es", "Columns", "Columnas");
+injectString("fi-FI", "Columns", "Sarakkeet");
+injectString("fr", "Columns", "Colonnes");
+injectString("fr-FR", "Columns", "Colonnes");
+injectString("hu-HU", "Columns", "Oszlopok");
+injectString("id", "Columns", "Kolom");
+injectString("it", "Columns", "Colonne");
+injectString("ja", "Columns", "\u5217");
+injectString("ko-KR", "Columns", "\uC5F4");
+injectString("ms", "Columns", "Lajur");
+injectString("nb-NO", "Columns", "Kolonner");
+injectString("nl", "Columns", "Kolommen");
+injectString("pl", "Columns", "Kolumny");
+injectString("pt-BR", "Columns", "Colunas");
+injectString("sk-SK", "Columns", "St\u013Apce");
+injectString("sv", "Columns", "Kolumner");
+injectString("th", "Columns", "\u0E04\u0E2D\u0E25\u0E31\u0E21\u0E19\u0E4C");
+injectString("tr", "Columns", "S\xFCtunlar");
+injectString("zh-Hans", "Columns", "\u5217");
+injectString("zh-TW", "Columns", "\u6B04");
+export const ColumnsTab = ({
+  columns,
+  onColumnToggle,
+  id
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  const listItems = columns.map(function (col) {
+    return {
+      id: col.id,
+      state: col.isChecked ? CheckboxState.On : CheckboxState.Off,
+      disabled: col.isBlocked,
+      children: col.label
+    };
+  });
+  return _jsx(SelectList, {
+    title: translate("Columns"),
+    multiselect: true,
+    showCheckbox: true,
+    id: `columns-list-${id}`,
+    value: new Map(columns.map(col => [col.id, col.isChecked ? CheckboxState.On : CheckboxState.Off])),
+    onChange: state => onColumnToggle(columns.map(col => Object.assign(Object.assign({}, col), {
+      isChecked: state.get(col.id) === CheckboxState.On
+    }))),
+    items: listItems
+  });
 };
-export const TRANSLATIONS = [
-    "Columns selector"
-];
+export const TRANSLATIONS = ["Columns"];

package/esm/columnsSelector/columnsTabGroup/columnsTabGroup.js

@@ -1,39 +1,81 @@
+import { injectString } from "../../utils/localization/translationsDictionary";
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Accordion } from "../../accordion/accordion";
 import { ColumnsTab } from "../columnsTab/columnsTab";
 import { useLanguage } from "../../utils/localization/useLanguage";
-export const ColumnsTabGroup = ({ columns, onColumnToggle }) => {
-    const { translate } = useLanguage();
-    const [activeTabs, setActiveTabs] = useState([]);
-    if (columns.length === 0) {
-        return _jsx(_Fragment, {});
-    }
-    const accordionData = columns.map(function (column, i) {
-        const handleColumnToggle = (state) => {
-            const updatedColumnsGroup = columns.map(function (col, j) {
-                if (i === j) {
-                    return Object.assign(Object.assign({}, col), { children: state });
-                }
-                return col;
-            });
-            onColumnToggle(updatedColumnsGroup);
-        };
-        return {
-            id: column.id,
-            title: column.name,
-            content: _jsx(ColumnsTab, { id: column.id, columns: column.children, onColumnToggle: handleColumnToggle })
-        };
-    });
-    const clickHandler = (itemId) => setActiveTabs((oldActiveIds) => {
-        const isClosed = oldActiveIds.indexOf(itemId) === -1;
-        return isClosed
-            ? oldActiveIds.concat(itemId)
-            : oldActiveIds.filter(item => item !== itemId);
-    });
-    const accordion = _jsx(Accordion, { className: "zen-accordion--legacy", data: accordionData, activeIds: activeTabs, onItemClick: clickHandler });
-    return _jsxs(_Fragment, { children: [_jsx("header", { className: "zen-columns-filter__item zen-columns-filter__item--header", children: translate("Additional Properties") }), accordion] });
+injectString("cs", "Additional Properties", "Dal\u0161\xED vlastnosti");
+injectString("da-DK", "Additional Properties", "Yderligere egenskaber");
+injectString("de", "Additional Properties", "Zus\xE4tzliche Eigenschaften");
+injectString("en", "Additional Properties", "Additional Properties");
+injectString("es", "Additional Properties", "Propiedades adicionales");
+injectString("fi-FI", "Additional Properties", "Lis\xE4ominaisuudet");
+injectString("fr", "Additional Properties", "Propri\xE9t\xE9s suppl\xE9mentaires");
+injectString("fr-FR", "Additional Properties", "Propri\xE9t\xE9s suppl\xE9mentaires");
+injectString("hu-HU", "Additional Properties", "Tov\xE1bbi tulajdons\xE1gok");
+injectString("id", "Additional Properties", "Properti Tambahan");
+injectString("it", "Additional Properties", "Propriet\xE0 aggiuntive");
+injectString("ja", "Additional Properties", "\u8FFD\u52A0\u30D7\u30ED\u30D1\u30C6\u30A3");
+injectString("ko-KR", "Additional Properties", "\uCD94\uAC00 \uC18D\uC131");
+injectString("ms", "Additional Properties", "Sifat Tambahan");
+injectString("nb-NO", "Additional Properties", "Ytterligere eiendommer");
+injectString("nl", "Additional Properties", "Extra eigenschappen");
+injectString("pl", "Additional Properties", "Dodatkowe w\u0142a\u015Bciwo\u015Bci");
+injectString("pt-BR", "Additional Properties", "Propriedades adicionais");
+injectString("sk-SK", "Additional Properties", "\u010Eal\u0161ie vlastnosti");
+injectString("sv", "Additional Properties", "Ytterligare egenskaper");
+injectString("th", "Additional Properties", "\u0E04\u0E38\u0E13\u0E2A\u0E21\u0E1A\u0E31\u0E15\u0E34\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E40\u0E15\u0E34\u0E21");
+injectString("tr", "Additional Properties", "Ek \xD6zellikler");
+injectString("zh-Hans", "Additional Properties", "\u5176\u4ED6\u5C5E\u6027");
+injectString("zh-TW", "Additional Properties", "\u5176\u4ED6\u5C6C\u6027");
+export const ColumnsTabGroup = ({
+  columns,
+  onColumnToggle
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  const [activeTabs, setActiveTabs] = useState([]);
+  if (columns.length === 0) {
+    return _jsx(_Fragment, {});
+  }
+  const accordionData = columns.map(function (column, i) {
+    const handleColumnToggle = state => {
+      const updatedColumnsGroup = columns.map(function (col, j) {
+        if (i === j) {
+          return Object.assign(Object.assign({}, col), {
+            children: state
+          });
+        }
+        return col;
+      });
+      onColumnToggle(updatedColumnsGroup);
+    };
+    return {
+      id: column.id,
+      title: column.name,
+      content: _jsx(ColumnsTab, {
+        id: column.id,
+        columns: column.children,
+        onColumnToggle: handleColumnToggle
+      })
+    };
+  });
+  const clickHandler = itemId => setActiveTabs(oldActiveIds => {
+    const isClosed = oldActiveIds.indexOf(itemId) === -1;
+    return isClosed ? oldActiveIds.concat(itemId) : oldActiveIds.filter(item => item !== itemId);
+  });
+  const accordion = _jsx(Accordion, {
+    className: "zen-accordion--legacy",
+    data: accordionData,
+    activeIds: activeTabs,
+    onItemClick: clickHandler
+  });
+  return _jsxs(_Fragment, {
+    children: [_jsx("header", {
+      className: "zen-columns-filter__item zen-columns-filter__item--header",
+      children: translate("Additional Properties")
+    }), accordion]
+  });
 };
-export const TRANSLATIONS = [
-    "Additional Properties"
-];
+export const TRANSLATIONS = ["Additional Properties"];

package/esm/comboboxSelected/comboboxSelected.js

@@ -1,13 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ENTIRE_ORGANIZATION_GROUP_ID } from "../groupsFilterRaw/groupsHelper";
 import { classNames } from "../commonHelpers/classNames/classNames";
-import { useLanguage } from "../utils/localization/useLanguage";
 import { Pill } from "../pill/pill";
 import { PillBox } from "../pillBox/pillBox";
 export const ComboboxSelected = ({ selection, onRemove, className, pillEmptyText }) => {
-    const { translate } = useLanguage();
     const isCommonPill = selection.length === 0 || selection.length === 1 && selection[0].id === ENTIRE_ORGANIZATION_GROUP_ID;
-    return _jsx("div", { className: classNames(["zen-combobox-selected", className || ""]), children: isCommonPill && pillEmptyText ? _jsx(Pill, { children: translate(pillEmptyText) })
+    return _jsx("div", { className: classNames(["zen-combobox-selected", className || ""]), children: isCommonPill && pillEmptyText ? _jsx(Pill, { children: pillEmptyText })
             : _jsx(PillBox, { selectedPills: selection.map(el => (el.name ? el : Object.assign(Object.assign({}, el), { name: "..." }))), onRemove: onRemove }) });
 };
 export const TRANSLATIONS = [

package/esm/dataFeed/feedExpandControl/feedExpandControl.js

@@ -6,13 +6,25 @@ import { IconLayoutWindow4 } from "../../icons/iconLayoutWindow4";
 import { SvgIconSize } from "../../svgIcon/svgIconSize";
 import { ButtonIconPosition, TextIconButton } from "../../textIconButton/textIconButton";
 import { useLanguage } from "../../utils/localization/useLanguage";
-export const FeedExpandControl = ({ className = "", isExpanded, onClick }) => {
-    const { translate } = useLanguage();
-    const classes = classNames([className, "zen-data-feed-expand-control"]);
-    const title = isExpanded ? translate("Collapse feed") : translate("Expand feed");
-    return _jsx(TextIconButton, { className: classes, icon: isExpanded ? IconLayoutWindow4 : IconLayoutWindow3, iconSize: SvgIconSize.Large, iconPosition: ButtonIconPosition.Start, "aria-label": title, title: title, onClick: onClick, type: ButtonType.TertiaryBlack });
+export const FeedExpandControl = ({
+  className = "",
+  isExpanded,
+  onClick
+}) => {
+  const {
+    translate
+  } = useLanguage();
+  const classes = classNames([className, "zen-data-feed-expand-control"]);
+  const title = isExpanded ? translate("Collapse feed") : translate("Expand feed");
+  return _jsx(TextIconButton, {
+    className: classes,
+    icon: isExpanded ? IconLayoutWindow4 : IconLayoutWindow3,
+    iconSize: SvgIconSize.Large,
+    iconPosition: ButtonIconPosition.Start,
+    "aria-label": title,
+    title: title,
+    onClick: onClick,
+    type: ButtonType.TertiaryBlack
+  });
 };
-export const TRANSLATIONS = [
-    "Collapse feed",
-    "Expand feed"
-];
+export const TRANSLATIONS = ["Collapse feed", "Expand feed"];

package/esm/dataGrid/columns/checkboxColumn/checkboxHeaderCell.js

@@ -1,3 +1,4 @@
+import { injectString } from "../../../utils/localization/translationsDictionary";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Children } from "react";
 import { ButtonIconPosition, TextIconButton } from "../../../textIconButton/textIconButton";
@@ -5,17 +6,92 @@ import { ButtonType } from "../../../button/buttonType";
 import { Checkbox } from "../../../checkbox/checkbox";
 import { IconChevronDownSmall } from "../../../icons/iconChevronDownSmall";
 import { useLanguage } from "../../../utils/localization/useLanguage";
-const CheckboxHandler = ({ onClick, ref }) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    const { translate } = useLanguage();
-    return _jsx(TextIconButton, { ref: ref, className: "zen-checkbox-column__popup", iconClasses: "zen-icon--no-events", icon: IconChevronDownSmall, iconPosition: ButtonIconPosition.Start, iconSize: "large", title: translate("Multiple row selection menu"), "aria-label": translate("Multiple row selection menu"), type: ButtonType.Light, onClick: onClick });
+injectString("cs", "Multiple row selection menu", "Nab\xEDdka s\xA0v\xEDcen\xE1sobn\xFDm v\xFDb\u011Brem \u0159\xE1dk\u016F");
+injectString("da-DK", "Multiple row selection menu", "Menu til valg af flere r\xE6kker");
+injectString("de", "Multiple row selection menu", "Men\xFC Auswahl mehrerer Reihen");
+injectString("en", "Multiple row selection menu", "Multiple row selection menu");
+injectString("es", "Multiple row selection menu", "Men\xFA de selecci\xF3n de varias filas");
+injectString("fi-FI", "Multiple row selection menu", "Usean rivin valintavalikko");
+injectString("fr", "Multiple row selection menu", "Menu de s\xE9lection \xE0 plusieurs lignes");
+injectString("fr-FR", "Multiple row selection menu", "Menu de s\xE9lection \xE0 lignes multiples");
+injectString("hu-HU", "Multiple row selection menu", "T\xF6bb soros kijel\xF6l\xE9s men\xFC");
+injectString("id", "Multiple row selection menu", "Menu pilihan baris ganda");
+injectString("it", "Multiple row selection menu", "Menu di selezione a righe multiple");
+injectString("ja", "Multiple row selection menu", "\u8907\u6570\u884C\u9078\u629E\u30E1\u30CB\u30E5\u30FC");
+injectString("ko-KR", "Multiple row selection menu", "\uC5EC\uB7EC \uD589 \uC120\uD0DD \uBA54\uB274");
+injectString("ms", "Multiple row selection menu", "Menu pemilihan berbilang baris");
+injectString("nb-NO", "Multiple row selection menu", "Meny for valg av flere rader");
+injectString("nl", "Multiple row selection menu", "Selectiemenu meerdere rijen");
+injectString("pl", "Multiple row selection menu", "Menu wielokrotnego wyboru wiersza");
+injectString("pt-BR", "Multiple row selection menu", "Menu de sele\xE7\xE3o de v\xE1rias linhas");
+injectString("sk-SK", "Multiple row selection menu", "Ponuka v\xFDberu viacer\xFDch riadkov");
+injectString("sv", "Multiple row selection menu", "Meny f\xF6r val av flera rader");
+injectString("th", "Multiple row selection menu", "\u0E40\u0E21\u0E19\u0E39\u0E01\u0E32\u0E23\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E2B\u0E25\u0E32\u0E22\u0E41\u0E16\u0E27");
+injectString("tr", "Multiple row selection menu", "\xC7oklu s\u0131ra se\xE7imi men\xFCs\xFC");
+injectString("zh-Hans", "Multiple row selection menu", "\u591A\u884C\u9009\u62E9\u83DC\u5355");
+injectString("zh-TW", "Multiple row selection menu", "\u591A\u5217\u9078\u64C7\u9078\u55AE");
+const CheckboxHandler = ({
+  onClick,
+  ref
+}) => {
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  const {
+    translate
+  } = useLanguage();
+  return _jsx(TextIconButton, {
+    ref: ref,
+    className: "zen-checkbox-column__popup",
+    iconClasses: "zen-icon--no-events",
+    icon: IconChevronDownSmall,
+    iconPosition: ButtonIconPosition.Start,
+    iconSize: "large",
+    title: translate("Multiple row selection menu"),
+    "aria-label": translate("Multiple row selection menu"),
+    type: ButtonType.Light,
+    onClick: onClick
+  });
 };
-export const CheckboxHeaderCell = ({ label, actions, checked, indeterminate, disabled, children, onChange }) => {
-    const actionsComp = Children.toArray(children).find(child => { var _a; return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.displayName) === "Actions"; });
-    const contentComp = Children.toArray(children).find(child => { var _a; return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.displayName) === "Content"; });
-    return _jsxs("div", { className: "zen-checkbox-column zen-checkbox-column--with-actions", children: [_jsxs("div", { className: "zen-checkbox-column__controls", children: [_jsx(Checkbox, { className: "zen-checkbox-column__checkbox", checked: checked, indeterminate: indeterminate, disabled: disabled, title: label, "aria-label": label, onChange: e => onChange && onChange(e.target.checked) }), actions ? actionsComp : null] }), contentComp] });
+export const CheckboxHeaderCell = ({
+  label,
+  actions,
+  checked,
+  indeterminate,
+  disabled,
+  children,
+  onChange
+}) => {
+  const actionsComp = Children.toArray(children).find(child => {
+    var _a;
+    return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.displayName) === "Actions";
+  });
+  const contentComp = Children.toArray(children).find(child => {
+    var _a;
+    return ((_a = child === null || child === void 0 ? void 0 : child.type) === null || _a === void 0 ? void 0 : _a.displayName) === "Content";
+  });
+  return _jsxs("div", {
+    className: "zen-checkbox-column zen-checkbox-column--with-actions",
+    children: [_jsxs("div", {
+      className: "zen-checkbox-column__controls",
+      children: [_jsx(Checkbox, {
+        className: "zen-checkbox-column__checkbox",
+        checked: checked,
+        indeterminate: indeterminate,
+        disabled: disabled,
+        title: label,
+        "aria-label": label,
+        onChange: e => onChange && onChange(e.target.checked)
+      }), actions ? actionsComp : null]
+    }), contentComp]
+  });
 };
 CheckboxHeaderCell.Actions = CheckboxHandler;
 CheckboxHeaderCell.Actions.displayName = "Actions";
-CheckboxHeaderCell.Content = function content({ children }) { return _jsx("div", { className: "zen-checkbox-column__content", children: children }); };
-CheckboxHeaderCell.Content.displayName = "Content";
+CheckboxHeaderCell.Content = function content({
+  children
+}) {
+  return _jsx("div", {
+    className: "zen-checkbox-column__content",
+    children: children
+  });
+};
+CheckboxHeaderCell.Content.displayName = "Content";