@geotab/zenith 3.7.0 → 3.8.0-beta.1

package/esm/dataFeed/dataFeed.js

@@ -58,7 +58,8 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
         var _a;
         return (_a = zen.requestAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, () => {
             const visible = getVisibleItems();
-            const newVisibleRows = visible.filter(row => {
+            const newVisibleRows = visible
+                .filter(row => {
                 const id = row.dataset.rowId;
                 if (id === undefined) {
                     return false;
@@ -68,7 +69,8 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
                     return false;
                 }
                 return row;
-            }).map(row => row.dataset.rowId);
+            })
+                .map(row => row.dataset.rowId);
             const hasNewRows = newVisibleRows.some(id => !visibleRows.has(id));
             if (hasNewRows) {
                 const newRowsSet = new Set(visibleRows);
@@ -96,7 +98,7 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
     }, true);
     const feedItems = useMemo(() => data.map((entity, index) => {
         const entityClassName = getRowClassName(rowClassName, entity);
-        return _jsx(FeedItem, { collapsedColumnsQty: collapsedColumnsQty, columnsList: columnsList, feedWrappers: feedWrappers || [], visibleColumns: visibleColumns, entity: entity, visibleRows: visibleRows, index: index, expanded: expanded, className: entityClassName, actions: actions, actionsAsync: actionsAsync, primaryActions: primaryActions, isRowExpanded: expandedRows && expandedRows.indexOf(entity.id) > -1, onExpandedChange: (isExpanded) => onExpandedChange && onExpandedChange(entity.id, isExpanded), onClick: onClick }, entity.id);
+        return (_jsx(FeedItem, { collapsedColumnsQty: collapsedColumnsQty, columnsList: columnsList, feedWrappers: feedWrappers || [], visibleColumns: visibleColumns, entity: entity, visibleRows: visibleRows, index: index, expanded: expanded, className: entityClassName, actions: actions, actionsAsync: actionsAsync, primaryActions: primaryActions, isRowExpanded: expandedRows && expandedRows.indexOf(entity.id) > -1, onExpandedChange: isExpanded => onExpandedChange && onExpandedChange(entity.id, isExpanded), onClick: onClick }, entity.id));
     }), [
         data,
         rowClassName,
@@ -113,10 +115,7 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
         onExpandedChange,
         onClick
     ]);
-    return _jsx("div", { className: "zen-data-grid-wrapper", children: _jsxs("div", { className: classNames([
-                "zen-data-grid",
-                className || ""
-            ]), ref: feedRef, onScroll: handleScroll, children: [_jsx("div", { role: "feed", className: "zen-data-grid__feed zen-data-feed", "aria-label": description, "aria-busy": "false", children: feedItems }), emptyList && data.length === 0 ? emptyList : null, footer] }) });
+    return (_jsx("div", { className: "zen-data-grid-wrapper", children: _jsxs("div", { className: classNames(["zen-data-grid", className || ""]), ref: feedRef, onScroll: handleScroll, children: [_jsx("div", { role: "feed", className: "zen-data-grid__feed zen-data-feed", "aria-label": description, "aria-busy": "false", children: feedItems }), emptyList && data.length === 0 ? emptyList : null, footer] }) }));
 };
 const DataFeed = forwardRef(DataFeedInner);
 DataFeed.EmptyList = EmptyList;

package/esm/dataFeed/dataFeedCell/dataFeedCell.js

@@ -37,12 +37,14 @@ const FeedCell = ({ limited = false, visibleOnHover = false, isVisible, title, r
             setLabelContent(label);
             setContent(value);
         });
-        renderer().then(([label, value]) => {
+        renderer()
+            .then(([label, value]) => {
             var _a;
             (_a = zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, placeholderTimeout);
             setLabelContent(label);
             setContent(value);
-        }).catch((e) => {
+        })
+            .catch(e => {
             var _a;
             console.error(e);
             (_a = zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, placeholderTimeout);
@@ -51,12 +53,10 @@ const FeedCell = ({ limited = false, visibleOnHover = false, isVisible, title, r
         });
         return () => { var _a; return (_a = zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, placeholderTimeout); };
     }, [isVisible, renderer, placeholderRenderer]);
-    return _jsxs(_Fragment, { children: [labelContent ? _jsx("div", { className: "zen-feed-item__label", children: labelContent }) : null, content
-                ? _jsx("div", { className: classNames([
-                        "zen-feed-item__value",
-                        limited ? "zen-feed-item__value--limited" : "",
-                        visibleOnHover ? "zen-feed-item__value--visible-on-hover" : ""
-                    ]), style: { gridColumn: labelContent ? "2/2" : "1/span 2", width: labelContent ? undefined : "100%" }, children: content })
-                : null] });
+    return (_jsxs(_Fragment, { children: [labelContent ? _jsx("div", { className: "zen-feed-item__label", children: labelContent }) : null, content ? (_jsx("div", { className: classNames([
+                    "zen-feed-item__value",
+                    limited ? "zen-feed-item__value--limited" : "",
+                    visibleOnHover ? "zen-feed-item__value--visible-on-hover" : ""
+                ]), style: { gridColumn: labelContent ? "2/2" : "1/span 2", width: labelContent ? undefined : "100%" }, children: content })) : null] }));
 };
 export const DataFeedCell = memo(FeedCell);

package/esm/dataFeed/dataFeedColumnsItems.js

@@ -7,7 +7,7 @@ import { ActionsMenu } from "../table/actions/actionsMenu";
 import { useVisibleColumns } from "./hooks/useVisibleColumns";
 import { Menu } from "../menu/menu";
 const getIconFromColumnComponent = (column, entity, isNested) => {
-    const renderIcon = ("renderIcon" in column.columnComponent) ? column.columnComponent.renderIcon : undefined;
+    const renderIcon = "renderIcon" in column.columnComponent ? column.columnComponent.renderIcon : undefined;
     if (renderIcon) {
         return column.columnComponent.renderIcon(entity, isNested);
     }
@@ -30,9 +30,12 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
                     primaryActionsList = primaryActions.filter(action => action.condition === undefined || action.condition(entity));
                 }
                 if (primaryActionsList && primaryActionsList.length > 0) {
-                    primaryActionsContent = _jsx(_Fragment, { children: primaryActionsList.map((action) => _jsx(Menu.Item, { id: action.id, icon: action.icon, name: action.createTitle(rowEntity), onClick: typeof action.handler === "function" ?
-                                (_1, e) => { var _a; (_a = action.handler) === null || _a === void 0 ? void 0 : _a.call(action, entity, e.target); } :
-                                undefined, link: typeof action.createLink === "function" ? action.createLink(rowEntity) : undefined }, action.id)) });
+                    primaryActionsContent = (_jsx(_Fragment, { children: primaryActionsList.map(action => (_jsx(Menu.Item, { id: action.id, icon: action.icon, name: action.createTitle(rowEntity), onClick: typeof action.handler === "function"
+                                ? (_1, e) => {
+                                    var _a;
+                                    (_a = action.handler) === null || _a === void 0 ? void 0 : _a.call(action, entity, e.target);
+                                }
+                                : undefined, link: typeof action.createLink === "function" ? action.createLink(rowEntity) : undefined }, action.id))) }));
                 }
             }
             if (!actions && !actionsAsync && !primaryActionsList) {
@@ -45,7 +48,7 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
                 return _jsx(ActionsMenu, { entity: rowEntity, isNested: !nested, render: actions, primaryActions: primaryActionsContent });
             }
             if (typeof actionsAsync === "function") {
-                return _jsx(ActionsMenu, { entity: rowEntity, isNested: !nested, renderAsync: actionsAsync, primaryActions: primaryActionsContent });
+                return (_jsx(ActionsMenu, { entity: rowEntity, isNested: !nested, renderAsync: actionsAsync, primaryActions: primaryActionsContent }));
             }
             return _jsx(ActionsButton, { action: actions, entity: rowEntity });
         };
@@ -56,17 +59,18 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
                 if (column.columnComponent.renderFeed) {
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-argument
                     const result = column.columnComponent.renderFeed(title, feedEntity, isNested);
-                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition, @typescript-eslint/no-unnecessary-type-assertion
-                    if (isNested && ("renderNested" in column.columnComponent) && column.columnComponent.renderNested) {
+                    /* eslint-disable @typescript-eslint/no-unnecessary-condition */
+                    if (isNested && "renderNested" in column.columnComponent && column.columnComponent.renderNested) {
+                        /* eslint-enable @typescript-eslint/no-unnecessary-condition */
                         return [result[0], column.columnComponent.renderNested.call(column.columnComponent, feedEntity)];
                     }
                     return result;
                 }
-                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+                /* eslint-disable @typescript-eslint/no-unnecessary-condition */
                 const renderResult = column.columnComponent
-                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition, @typescript-eslint/no-unnecessary-type-assertion
-                    ? isNested && ("renderNested" in column.columnComponent) && column.columnComponent.renderNested
-                        ? column.columnComponent.renderNested.call(column.columnComponent, feedEntity)
+                    ? isNested && "renderNested" in column.columnComponent && column.columnComponent.renderNested
+                        ? /* eslint-enable @typescript-eslint/no-unnecessary-condition */
+                            column.columnComponent.renderNested.call(column.columnComponent, feedEntity)
                         : column.columnComponent.render.call(column.columnComponent, feedEntity, !nested)
                     : (feedEntity[column.id] || undefined);
                 return [renderHeader(title), renderResult];
@@ -83,19 +87,19 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
         // eslint-disable-next-line react/display-name
         (primaryData, secondaryData) => {
             const feedResult = wrappers.reduce((result, wrapper) => wrapper(result[0], result[1], ent, isNested), [primaryData, secondaryData]);
-            return _jsxs(_Fragment, { children: [feedResult[0], feedResult[1]] });
+            return (_jsxs(_Fragment, { children: [feedResult[0], feedResult[1]] }));
         };
         const mainColumnsData = mainColumnsMemoized.map(column => {
             const renderFeed = getRenderFeed(column);
             const renderWrappers = getRenderWrappers(column);
             const feedPlaceholder = getFeedPlaceholder(column);
-            return _jsx(DataFeedCell, { limited: false, visibleOnHover: false, isVisible: isVisible, title: column.title, render: renderFeed, renderWrappers: renderWrappers, renderPlaceholder: feedPlaceholder, defaultValue: column.meta.defaultValue, entity: rowEntity, isNested: !nested }, `${entity.id}-${column.id}`);
+            return (_jsx(DataFeedCell, { limited: false, visibleOnHover: false, isVisible: isVisible, title: column.title, render: renderFeed, renderWrappers: renderWrappers, renderPlaceholder: feedPlaceholder, defaultValue: column.meta.defaultValue, entity: rowEntity, isNested: !nested }, `${entity.id}-${column.id}`));
         });
         const secondaryColumnsData = secondaryColumnsMemoized.map(column => {
             const renderFeed = getRenderFeed(column);
             const renderWrappers = getRenderWrappers(column);
             const feedPlaceholder = getFeedPlaceholder(column);
-            return _jsx(DataFeedCell, { limited: false, visibleOnHover: false, isVisible: isVisible, title: column.title, render: renderFeed, renderWrappers: renderWrappers, renderPlaceholder: feedPlaceholder, defaultValue: column.meta.defaultValue, entity: rowEntity, isNested: !nested }, `${entity.id}-${column.id}`);
+            return (_jsx(DataFeedCell, { limited: false, visibleOnHover: false, isVisible: isVisible, title: column.title, render: renderFeed, renderWrappers: renderWrappers, renderPlaceholder: feedPlaceholder, defaultValue: column.meta.defaultValue, entity: rowEntity, isNested: !nested }, `${entity.id}-${column.id}`));
         });
         const onItemClick = nested && nested.length > 0 && onExpandedChange
             ? () => onExpandedChange(!isRowExpanded)
@@ -106,8 +110,22 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
         const actionsNode = getActions();
         const renderFeedWrappers = getRenderFeedWrappers(feedWrappers, rowEntity, !nested);
         const key = !nested ? `nested_${rowEntity.id}` : rowEntity.id;
-        return _jsx(DataFeedItem, { id: entity.id, index: index, onClick: onItemClick, className: className, icon: icon, identifier: mainColumnsData[0], primaryData: mainColumnsData.slice(1), secondaryData: secondaryColumnsData, actions: actionsNode, nestedData: nested && nested.length ? nested : undefined, renderFeedWrappers: renderFeedWrappers }, key);
-    }, [className, feedWrappers, index, isRowExpanded, isVisible, mainColumnsMemoized, onExpandedChange, secondaryColumnsMemoized, actions, actionsAsync, primaryActions, entity, onClick]);
+        return (_jsx(DataFeedItem, { id: entity.id, index: index, onClick: onItemClick, className: className, icon: icon, identifier: mainColumnsData[0], primaryData: mainColumnsData.slice(1), secondaryData: secondaryColumnsData, actions: actionsNode, nestedData: nested && nested.length ? nested : undefined, renderFeedWrappers: renderFeedWrappers }, key));
+    }, [
+        className,
+        feedWrappers,
+        index,
+        isRowExpanded,
+        isVisible,
+        mainColumnsMemoized,
+        onExpandedChange,
+        secondaryColumnsMemoized,
+        actions,
+        actionsAsync,
+        primaryActions,
+        entity,
+        onClick
+    ]);
     const nestedCells = useMemo(() => (entity.children && isRowExpanded ? entity.children : []).map(nestedEntity => renderCells(nestedEntity)), [entity.children, isRowExpanded, renderCells]);
     const cells = useMemo(() => renderCells(entity, nestedCells), [entity, nestedCells, renderCells]);
     return cells;

package/esm/dataFeed/dataFeedHeader/dataFeedHeader.js

@@ -4,5 +4,5 @@ import { ColumnSortDirection } from "../../dataGrid/withSortableColumns/columns/
 export const DataFeedHeader = ({ column, sortState, className, onSortChange }) => {
     var _a, _b;
     const isSortedBy = (sortState === null || sortState === void 0 ? void 0 : sortState.sortColumn) === column.id;
-    return _jsx("div", { className: className, children: _jsx(SortableHeaderCell, { columnName: ((_a = column.name) === null || _a === void 0 ? void 0 : _a.toString()) || column.id.toString(), isSortedBy: isSortedBy, sortDirection: isSortedBy ? sortState.sortDirection : ColumnSortDirection.None, title: column.title, tooltip: column.title, onSortChange: onSortChange, isMobile: true, initialSortDirection: (_b = column.meta) === null || _b === void 0 ? void 0 : _b.initialSortDirection }) });
+    return (_jsx("div", { className: className, children: _jsx(SortableHeaderCell, { columnName: ((_a = column.name) === null || _a === void 0 ? void 0 : _a.toString()) || column.id.toString(), isSortedBy: isSortedBy, sortDirection: isSortedBy ? sortState.sortDirection : ColumnSortDirection.None, title: column.title, tooltip: column.title, onSortChange: onSortChange, isMobile: true, initialSortDirection: (_b = column.meta) === null || _b === void 0 ? void 0 : _b.initialSortDirection }) }));
 };

package/esm/dataFeed/dataFeedSelectPanel/dataFeedSelectPanel.js

@@ -5,5 +5,5 @@ import { FeedSelectControl } from "../feedSelectControl/feedSelectControl";
 import { useRef } from "react";
 export const DataFeedSelectPanel = ({ buttonTitle, panelTitle, isOpen, onTriggerClick, onHidePanel, className, buttonClassName, children }) => {
     const triggerRef = useRef(null);
-    return _jsxs(_Fragment, { children: [_jsx(FeedSelectControl, { ref: triggerRef, onClick: onTriggerClick, title: buttonTitle, className: buttonClassName }), _jsx(SidePanel, { className: classNames(["zen-data-feed-select-panel", className || ""]), panelPosition: "bottom", triggerRef: triggerRef, label: panelTitle, isOpen: isOpen, onHidePanel: reason => reason !== SidePanelCloseReason.ClickOutside && onHidePanel(), children: children })] });
+    return (_jsxs(_Fragment, { children: [_jsx(FeedSelectControl, { ref: triggerRef, onClick: onTriggerClick, title: buttonTitle, className: buttonClassName }), _jsx(SidePanel, { className: classNames(["zen-data-feed-select-panel", className || ""]), panelPosition: "bottom", triggerRef: triggerRef, label: panelTitle, isOpen: isOpen, onHidePanel: reason => reason !== SidePanelCloseReason.ClickOutside && onHidePanel(), children: children })] }));
 };

package/esm/dataFeed/feedItem/feedItem.js

@@ -15,5 +15,5 @@ export const DataFeedItem = ({ id, index, checkbox, icon, identifier, className,
         }
         onClick && onClick();
     }, [onClick]);
-    return _jsxs("div", { className: classNames(["zen-data-feed__item", "zen-feed-item", className || ""]), role: "article", "aria-setsize": -1, "data-row-id": id, "aria-posinset": index + 1, children: [_jsx("div", { className: "zen-feed-item__main-row", onClick: onClickHandler, children: renderFeedWrappers(_jsxs("div", { className: "zen-feed-item__main", children: [checkbox ? _jsx("div", { className: "zen-feed-item__checkbox", children: checkbox }) : null, icon ? _jsx("div", { className: "zen-feed-item__icon", children: icon }) : null, _jsxs("div", { className: "zen-feed-item__main-data", children: [identifier ? _jsx("div", { className: "zen-feed-item__identifier", children: identifier }) : null, actions ? _jsx("div", { className: "zen-feed-item__actions", children: actions }) : null] })] }), _jsxs("div", { className: "zen-feed-item__secondary-data", children: [icon ? _jsx("div", { className: "zen-feed-item__icon-placeholder" }) : null, _jsxs("div", { className: "zen-feed-item__values", children: [primaryData, secondaryData] })] })) }), nestedData ? _jsx("div", { className: "zen-feed-item__nested", children: nestedData }) : null] }, id);
+    return (_jsxs("div", { className: classNames(["zen-data-feed__item", "zen-feed-item", className || ""]), role: "article", "aria-setsize": -1, "data-row-id": id, "aria-posinset": index + 1, children: [_jsx("div", { className: "zen-feed-item__main-row", onClick: onClickHandler, children: renderFeedWrappers(_jsxs("div", { className: "zen-feed-item__main", children: [checkbox ? _jsx("div", { className: "zen-feed-item__checkbox", children: checkbox }) : null, icon ? _jsx("div", { className: "zen-feed-item__icon", children: icon }) : null, _jsxs("div", { className: "zen-feed-item__main-data", children: [identifier ? _jsx("div", { className: "zen-feed-item__identifier", children: identifier }) : null, actions ? _jsx("div", { className: "zen-feed-item__actions", children: actions }) : null] })] }), _jsxs("div", { className: "zen-feed-item__secondary-data", children: [icon ? _jsx("div", { className: "zen-feed-item__icon-placeholder" }) : null, _jsxs("div", { className: "zen-feed-item__values", children: [primaryData, secondaryData] })] })) }), nestedData ? _jsx("div", { className: "zen-feed-item__nested", children: nestedData }) : null] }, id));
 };

package/esm/dataFeed/feedSelectControl/feedSelectControl.js

@@ -6,6 +6,6 @@ import { ButtonType } from "../../button/buttonType";
 import { IconBulkSelect } from "../../icons/iconBulkSelect";
 export const FeedSelectControl = ({ className = "", title, onClick, ref }) => {
     const classes = classNames([className, "data-feed-select-control"]);
-    return _jsx(TextIconButton, { ref: ref, className: classes, icon: IconBulkSelect, iconSize: SvgIconSize.Large, iconPosition: ButtonIconPosition.Start, "aria-label": title, title: title, onClick: onClick, type: ButtonType.TertiaryBlack });
+    return (_jsx(TextIconButton, { ref: ref, className: classes, icon: IconBulkSelect, iconSize: SvgIconSize.Large, iconPosition: ButtonIconPosition.Start, "aria-label": title, title: title, onClick: onClick, type: ButtonType.TertiaryBlack }));
 };
 FeedSelectControl.displayName = "FeedSelectControl";

package/esm/dataGrid/cell/cell.js

@@ -40,11 +40,13 @@ const Cell = ({ index, limited, visibleOnHover, isVisible, width, render, render
         const placeholderTimeout = (_a = zen.requestAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, () => {
             setContent(placeholderRenderer());
         });
-        renderer().then(res => {
+        renderer()
+            .then(res => {
             var _a;
             (_a = zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, placeholderTimeout);
             setContent(res);
-        }).catch(() => {
+        })
+            .catch(() => {
             var _a;
             (_a = zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen, placeholderTimeout);
             setContent("");
@@ -59,7 +61,7 @@ const Cell = ({ index, limited, visibleOnHover, isVisible, width, render, render
             onClick();
         }
     }, [onClick]);
-    return _jsx("td", { colSpan: colspan, onClick: onCellClick, className: classNames([
+    return (_jsx("td", { colSpan: colspan, onClick: onCellClick, className: classNames([
             "zen-data-grid__row-cell",
             isActive ? "zen-data-grid__row-cell--active" : "",
             className || "",
@@ -67,6 +69,6 @@ const Cell = ({ index, limited, visibleOnHover, isVisible, width, render, render
             visibleOnHover ? "zen-data-grid__row-cell--visible-on-hover" : "",
             onClick ? "zen-data-grid__row-cell--clickable" : "",
             limited ? "zen-ellipsis" : ""
-        ]), style: { minWidth: width || "auto", maxWidth: width || "auto" }, role: "gridcell", children: content });
+        ]), style: { minWidth: width || "auto", maxWidth: width || "auto" }, role: "gridcell", children: content }));
 };
 export const DataGridCell = memo(Cell);

package/esm/dataGrid/columns/actionLinkColumn/actionButtonsMobileWrapper.js

@@ -19,13 +19,9 @@ export class ActionButtonsWrapper {
             return (Object.assign(Object.assign({ id: generateId() }, action), { actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign({ id: generateId() }, a))) }));
         };
         const entityId = entity["id"] || generateId();
-        return _jsxs("div", { className: "zen-action-link-column", children: [_jsx("div", { className: "zen-action-link-column__content", children: elt }), this.options.actions
-                    ? _jsx("div", { className: "zen-action-link-column__actions", children: this.options.actions
-                            .map(getActionWithId)
-                            .map(action => _jsx(ActionsButton, { action: action, entity: entity }, `${entityId}_${action.id}`)) })
-                    : null] });
+        return (_jsxs("div", { className: "zen-action-link-column", children: [_jsx("div", { className: "zen-action-link-column__content", children: elt }), this.options.actions ? (_jsx("div", { className: "zen-action-link-column__actions", children: this.options.actions.map(getActionWithId).map(action => (_jsx(ActionsButton, { action: action, entity: entity }, `${entityId}_${action.id}`))) })) : null] }));
     }
     renderHeader(title) {
-        return _jsx("div", { className: "zen-action-link-column", children: _jsx("div", { className: "zen-action-link-column__content", children: title }) });
+        return (_jsx("div", { className: "zen-action-link-column", children: _jsx("div", { className: "zen-action-link-column__content", children: title }) }));
     }
 }

package/esm/dataGrid/columns/actionLinkColumn/actionLinkColumnWrapper.js

@@ -26,13 +26,9 @@ export class ActionLinkColumnWrapper {
         };
         const entityId = entity["id"] || generateId();
         const lintUrl = typeof link === "string" ? link : link === null || link === void 0 ? void 0 : link.href;
-        return _jsxs("div", { className: "zen-action-link-column", children: [_jsx(TextIconButton, { disabled: isDisabled, link: lintUrl || "", title: title, "aria-label": title, className: "zen-action-link-column__link", icon: icon, iconSize: "large", type: "primary", iconPosition: ButtonIconPosition.Start }), _jsx("div", { className: "zen-action-link-column__content", children: elt }), this.options.actions
-                    ? _jsx("div", { className: "zen-action-link-column__actions", children: this.options.actions
-                            .map(getActionWithId)
-                            .map(action => _jsx(ActionsButton, { action: action, entity: entity }, `${entityId}_${action.id}`)) })
-                    : null] });
+        return (_jsxs("div", { className: "zen-action-link-column", children: [_jsx(TextIconButton, { disabled: isDisabled, link: lintUrl || "", title: title, "aria-label": title, className: "zen-action-link-column__link", icon: icon, iconSize: "large", type: "primary", iconPosition: ButtonIconPosition.Start }), _jsx("div", { className: "zen-action-link-column__content", children: elt }), this.options.actions ? (_jsx("div", { className: "zen-action-link-column__actions", children: this.options.actions.map(getActionWithId).map(action => (_jsx(ActionsButton, { action: action, entity: entity }, `${entityId}_${action.id}`))) })) : null] }));
     }
     renderHeader(title) {
-        return _jsx("div", { className: "zen-action-link-column", children: _jsx("div", { className: "zen-action-link-column__content", children: title }) });
+        return (_jsx("div", { className: "zen-action-link-column", children: _jsx("div", { className: "zen-action-link-column__content", children: title }) }));
     }
 }

package/esm/dataGrid/columns/actionsColumn/actionsButton.js

@@ -26,15 +26,13 @@ export function ActionsButton({ action, entity }) {
     if (!entity) {
         return null;
     }
-    const items = (action.actions || []).filter(a => a.condition ? a.condition(entity) : true).map(a => createSubAction(a, entity));
+    const items = (action.actions || []).filter(a => (a.condition ? a.condition(entity) : true)).map(a => createSubAction(a, entity));
     const isTriggerVisible = action.condition ? action.condition(entity) : true;
     if (!isTriggerVisible) {
         return null;
     }
-    return _jsxs(_Fragment, { children: [_jsx(ActionColumnCell, { ref: buttonRef, tag: action.createLink !== undefined ? "a" : "button", hash: action.id, title: action.createTitle(entity), href: action.createLink !== undefined ? action.createLink(entity) : undefined, icon: action.icon, onClick: (e) => {
+    return (_jsxs(_Fragment, { children: [_jsx(ActionColumnCell, { ref: buttonRef, tag: action.createLink !== undefined ? "a" : "button", hash: action.id, title: action.createTitle(entity), href: action.createLink !== undefined ? action.createLink(entity) : undefined, icon: action.icon, onClick: e => {
                     setIsMenuOpen(!isMenuOpen);
                     action.handler && action.handler(entity, e.target);
-                } }, action.id), items.length
-                ? _jsx(ControlledMenu, { triggerRef: buttonRef, alignment: "bottom-right", isOpen: isMenuOpen, setIsOpen: setIsMenuOpen, title: action.createTitle(entity), children: items }, entityId + "-" + action.id + "-menu")
-                : null] });
+                } }, action.id), items.length ? (_jsx(ControlledMenu, { triggerRef: buttonRef, alignment: "bottom-right", isOpen: isMenuOpen, setIsOpen: setIsMenuOpen, title: action.createTitle(entity), children: items }, entityId + "-" + action.id + "-menu")) : null] }));
 }

package/esm/dataGrid/columns/actionsColumn/actionsColumn.js

@@ -6,28 +6,43 @@ import { ActionsMenu } from "../../../table/actions/actionsMenu";
 export class ActionsColumn extends BasicColumn {
     renderIconActions(entity, actions, isNested) {
         const entityActions = typeof actions === "function"
-            ? entity ? actions(entity, isNested || false).filter(action => action.condition === undefined || action.condition(entity)) : []
+            ? entity
+                ? actions(entity, isNested || false).filter(action => action.condition === undefined || action.condition(entity))
+                : []
             : actions.filter(action => action.condition === undefined || action.condition(entity));
         const entityId = (entity === null || entity === void 0 ? void 0 : entity.id) || "";
-        return entityActions.length > 0 ? _jsx("div", { className: "zen-actions-column", children: entityActions.map(action => _jsx(ActionsButton, { action: action, entity: entity }, action.id)) }, [entityId, ...entityActions.map(a => a.id)].join("-")) : null;
+        return entityActions.length > 0 ? (_jsx("div", { className: "zen-actions-column", children: entityActions.map(action => (_jsx(ActionsButton, { action: action, entity: entity }, action.id))) }, [entityId, ...entityActions.map(a => a.id)].join("-"))) : null;
     }
     updateActions(options) {
-        this.actions = options.actions ? options.actions.map(action => { var _a; return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) })); }) : undefined;
+        this.actions = options.actions
+            ? options.actions.map(action => {
+                var _a;
+                return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) }));
+            })
+            : undefined;
         this.renderFn = options.render;
         this.renderAsyncFn = options.renderAsync;
-        this.headerActions = (options.headerActions || []).map(action => { var _a; return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) })); });
+        this.headerActions = (options.headerActions || []).map(action => {
+            var _a;
+            return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) }));
+        });
         if (typeof options.primaryActions === "function") {
             this.primaryActions = options.primaryActions;
         }
         else {
-            this.primaryActions = (options.primaryActions || []).map(action => { var _a; return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) })); });
+            this.primaryActions = (options.primaryActions || []).map(action => {
+                var _a;
+                return (Object.assign(Object.assign({}, action), { id: action.id || generateId(), actions: (_a = action.actions) === null || _a === void 0 ? void 0 : _a.map(a => (Object.assign(Object.assign({}, a), { id: generateId() }))) }));
+            });
         }
     }
     renderCell(_, entity, isNested) {
         if (this.options.render || this.options.renderAsync) {
-            return _jsxs("div", { className: "zen-actions-column", children: [this.primaryActions && (typeof this.primaryActions === "function" || this.primaryActions.length > 0) && this.renderIconActions(entity, this.primaryActions, isNested || false), this.options.render && _jsx(ActionsMenu, { entity: entity, isNested: isNested || false, render: this.options.render }), this.options.renderAsync && _jsx(ActionsMenu, { entity: entity, isNested: isNested || false, renderAsync: this.options.renderAsync })] });
+            return (_jsxs("div", { className: "zen-actions-column", children: [this.primaryActions &&
+                        (typeof this.primaryActions === "function" || this.primaryActions.length > 0) &&
+                        this.renderIconActions(entity, this.primaryActions, isNested || false), this.options.render && _jsx(ActionsMenu, { entity: entity, isNested: isNested || false, render: this.options.render }), this.options.renderAsync && _jsx(ActionsMenu, { entity: entity, isNested: isNested || false, renderAsync: this.options.renderAsync })] }));
         }
-        return this.renderIconActions(entity, (this.actions || []));
+        return this.renderIconActions(entity, this.actions || []);
     }
     renderHeaderCell(_) {
         return this.renderIconActions(undefined, this.headerActions);

package/esm/dataGrid/columns/actionsColumn/actionsColumnCell.js

@@ -16,7 +16,5 @@ import { ButtonType } from "../../../button/buttonType";
 import { SvgIconSize } from "../../../svgIcon/svgIconSize";
 export const ActionColumnCell = (_a) => {
     var { tag, hash, title, href, icon, ref } = _a, rest = __rest(_a, ["tag", "hash", "title", "href", "icon", "ref"]);
-    return tag === "button"
-        ? _jsx(TextIconButton, Object.assign({ className: "zen-actions-column__action", "data-hash": hash, title: title, "aria-label": title, type: ButtonType.Light, icon: icon, iconSize: SvgIconSize.Bigger, iconPosition: ButtonIconPosition.Start, iconClasses: "zen-icon--no-events", ref: ref }, rest))
-        : _jsx("a", Object.assign({ className: "zen-actions-column__action zen-button zen-button--light zen-caption", "data-hash": hash, title: title, "aria-label": title, href: href, ref: ref }, rest, { children: createElement(icon, { size: SvgIconSize.Bigger, className: "zen-icon--no-events" }) }));
+    return tag === "button" ? (_jsx(TextIconButton, Object.assign({ className: "zen-actions-column__action", "data-hash": hash, title: title, "aria-label": title, type: ButtonType.Light, icon: icon, iconSize: SvgIconSize.Bigger, iconPosition: ButtonIconPosition.Start, iconClasses: "zen-icon--no-events", ref: ref }, rest))) : (_jsx("a", Object.assign({ className: "zen-actions-column__action zen-button zen-button--light zen-caption", "data-hash": hash, title: title, "aria-label": title, href: href, ref: ref }, rest, { children: createElement(icon, { size: SvgIconSize.Bigger, className: "zen-icon--no-events" }) })));
 };

package/esm/dataGrid/columns/basicColumn.js

@@ -11,14 +11,12 @@ export class BasicColumn {
         return this.column.defaultValue;
     }
     getHeaderTitle(title) {
-        return this.column.renderHeader !== undefined
-            ? this.column.renderHeader(title)
-            : title;
+        return this.column.renderHeader !== undefined ? this.column.renderHeader(title) : title;
     }
     renderCellAsync(entity, isNested, render) {
         const result = this.getValue(entity, isNested);
         if (isPromiseLike(result)) {
-            return result.then(r => r === undefined ? r : render(r, entity, isNested));
+            return result.then(r => (r === undefined ? r : render(r, entity, isNested)));
         }
         return render(result, entity, isNested);
     }

package/esm/dataGrid/columns/checkboxColumn/checkboxCell.d.ts

@@ -1,5 +1,6 @@
 import { FC, PropsWithChildren, ReactElement } from "react";
 import { IZenIdComponentProps } from "../../../commonHelpers/zenComponent";
+import "./checkboxColumn.less";
 interface ICheckboxCellProps extends IZenIdComponentProps {
     checked: boolean;
     indeterminate: boolean;

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

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Checkbox } from "../../../checkbox/checkbox";
 import { classNames } from "../../../commonHelpers/classNames/classNames";
-export const CheckboxCell = ({ id, checked, indeterminate, label, disabled, className, onChange, children }) => _jsxs("div", { className: classNames(["zen-checkbox-column", className || ""]), children: [_jsx(Checkbox, { className: "zen-checkbox-column__checkbox", checked: checked, indeterminate: indeterminate, disabled: disabled, title: label, onChange: e => onChange && onChange(id, e.target.checked), wrapped: true }), children] });
-CheckboxCell.Content = function content({ children }) { return _jsx("div", { className: "zen-checkbox-column__content", children: children }); };
+export const CheckboxCell = ({ id, checked, indeterminate, label, disabled, className, onChange, children }) => (_jsxs("div", { className: classNames(["zen-checkbox-column", className || ""]), children: [_jsx(Checkbox, { className: "zen-checkbox-column__checkbox", checked: checked, indeterminate: indeterminate, disabled: disabled, title: label, onChange: e => onChange && onChange(id, e.target.checked), wrapped: true }), children] }));
+CheckboxCell.Content = function content({ children }) {
+    return _jsx("div", { className: "zen-checkbox-column__content", children: children });
+};
 CheckboxCell.Content.displayName = "Content";

package/esm/dataGrid/columns/checkboxColumn/checkboxColumn.d.ts

@@ -5,7 +5,7 @@ import { ISimpleEventHandler, SimpleEventHandler } from "../../../commonHelpers/
 import { IRowEntity } from "../../row/row";
 import { IEntityWithId } from "../../../commonHelpers/entity";
 interface ISelectEvents {
-    "change": [id: string, selected: boolean];
+    change: [id: string, selected: boolean];
 }
 export interface ICheckboxColumn<T extends IRowEntity<N>, N extends IEntityWithId = T> extends ISimpleEventHandler<ISelectEvents>, IListColumnBasic<T, N> {
     selectionState: SelectionState;

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

@@ -89,14 +89,14 @@ export class CheckboxColumnWrapper extends SimpleEventHandler {
         }
         const allowed = this.condition(entity);
         const isDisable = this.disabled ? this.disabled(entity) : this.state === SelectionState.All;
-        const cell = _jsx(CheckboxCell, { id: entity.id, className: allowed ? "" : "zen-checkbox-column--no-checkbox", checked: this.state === SelectionState.All || this.selections.has(entity.id), indeterminate: false, disabled: isDisable, label: this.options.createTitle(entity), onChange: this.changeHandler, children: _jsx(CheckboxCell.Content, { children: value }) });
+        const cell = (_jsx(CheckboxCell, { id: entity.id, className: allowed ? "" : "zen-checkbox-column--no-checkbox", checked: this.state === SelectionState.All || this.selections.has(entity.id), indeterminate: false, disabled: isDisable, label: this.options.createTitle(entity), onChange: this.changeHandler, children: _jsx(CheckboxCell.Content, { children: value }) }));
         return cell;
     }
     renderHeader(title) {
         if (this.options.header === false) {
             return title;
         }
-        const cell = _jsxs(CheckboxHeaderCell, { label: this.options.headerTitle || "", actions: true, checked: this.state === SelectionState.CurrentPage || this.state === SelectionState.All, indeterminate: this.state === SelectionState.Partial, onChange: this.changeHandlerAll, children: [_jsx(CheckboxHeaderCell.Actions, { ref: this.menuTriggerRef, onClick: this.actionsClickHandler }), _jsx(CheckboxHeaderCell.Content, { children: title })] });
+        const cell = (_jsxs(CheckboxHeaderCell, { label: this.options.headerTitle || "", actions: true, checked: this.state === SelectionState.CurrentPage || this.state === SelectionState.All, indeterminate: this.state === SelectionState.Partial, onChange: this.changeHandlerAll, children: [_jsx(CheckboxHeaderCell.Actions, { ref: this.menuTriggerRef, onClick: this.actionsClickHandler }), _jsx(CheckboxHeaderCell.Content, { children: title })] }));
         return cell;
     }
 }
@@ -104,7 +104,5 @@ Object.defineProperty(CheckboxColumnWrapper, "translations", {
     enumerable: true,
     configurable: true,
     writable: true,
-    value: [
-        "Multiple row selection menu"
-    ]
+    value: ["Multiple row selection menu"]
 });

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

@@ -32,6 +32,7 @@ injectString("tr", "Multiple row selection menu", "\xC7oklu s\u0131ra se\xE7imi
 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");
 injectString("ro-RO", "Multiple row selection menu", "Meniu de selectare cu mai multe r\xE2nduri");
+injectString("ar-SA", "Multiple row selection menu", "\u0642\u0627\u0626\u0645\u0629 \u062A\u062D\u062F\u064A\u062F \u0635\u0641\u0648\u0641 \u0645\u062A\u0639\u062F\u062F\u0629");
 const CheckboxHandler = ({
   onClick,
   ref

package/esm/dataGrid/columns/mainColumn/mainColumnWrapper.js

@@ -7,14 +7,16 @@ export class MainColumnWrapper {
         const SideItems = this.options.render ? this.options.render(entity) : null;
         const description = this.options.descriptionText ? this.options.descriptionText.createDescription(entity, isNested) : null;
         const mainTextLink = (_b = (_a = this.options.mainText) === null || _a === void 0 ? void 0 : _a.createLink) === null || _b === void 0 ? void 0 : _b.call(_a, entity, isNested);
-        const mainTextClassName = classNames(["zen-main-column__name", ((_c = this.options.mainText) === null || _c === void 0 ? void 0 : _c.className) || "", mainTextLink ? "zen-main-column__name--link" : ""]);
+        const mainTextClassName = classNames([
+            "zen-main-column__name",
+            ((_c = this.options.mainText) === null || _c === void 0 ? void 0 : _c.className) || "",
+            mainTextLink ? "zen-main-column__name--link" : ""
+        ]);
         const descriptionTextClassName = classNames(["zen-main-column__groups", ((_d = this.options.descriptionText) === null || _d === void 0 ? void 0 : _d.className) || ""]);
         const mainText = ((_f = (_e = this.options.mainText) === null || _e === void 0 ? void 0 : _e.createText) === null || _f === void 0 ? void 0 : _f.call(_e, entity, isNested)) || elt;
         const icon = !isFeed ? this.renderIcon(entity, isNested || false) : null;
         const iconParentClassName = (_g = this.options.icon) === null || _g === void 0 ? void 0 : _g.parentClassName;
-        return _jsxs("div", { className: "zen-main-column", children: [icon ? _jsx("div", { className: classNames(["zen-main-column__icon", iconParentClassName || ""]), children: icon }) : null, _jsxs("div", { className: "zen-main-column__content", children: [mainTextLink ?
-                            _jsx("a", { href: mainTextLink, className: mainTextClassName, children: mainText }) :
-                            _jsx("div", { className: mainTextClassName, children: mainText }), description && _jsx("div", { className: descriptionTextClassName, children: description })] }), SideItems] });
+        return (_jsxs("div", { className: "zen-main-column", children: [icon ? _jsx("div", { className: classNames(["zen-main-column__icon", iconParentClassName || ""]), children: icon }) : null, _jsxs("div", { className: "zen-main-column__content", children: [mainTextLink ? (_jsx("a", { href: mainTextLink, className: mainTextClassName, children: mainText })) : (_jsx("div", { className: mainTextClassName, children: mainText })), description && _jsx("div", { className: descriptionTextClassName, children: description })] }), SideItems] }));
     }
     constructor(options) {
         Object.defineProperty(this, "options", {
@@ -48,12 +50,14 @@ export class MainColumnWrapper {
         const entityActions = ((_a = this.options.icon) === null || _a === void 0 ? void 0 : _a.condition) === undefined || this.options.icon.condition(entity, isNested);
         const isDisabled = !entityActions;
         const onClick = (_b = this.options.icon) === null || _b === void 0 ? void 0 : _b.onClick;
-        const handleOnClick = onClick ? (e) => {
-            onClick(entity, e);
-        } : undefined;
+        const handleOnClick = onClick
+            ? (e) => {
+                onClick(entity, e);
+            }
+            : undefined;
         const link = (_d = (_c = this.options.icon) === null || _c === void 0 ? void 0 : _c.createLink) === null || _d === void 0 ? void 0 : _d.call(_c, entity, isNested);
         const title = (_f = (_e = this.options.icon) === null || _e === void 0 ? void 0 : _e.createTitle) === null || _f === void 0 ? void 0 : _f.call(_e, entity, isNested);
         const iconClassName = (_g = this.options.icon) === null || _g === void 0 ? void 0 : _g.className;
-        return _jsx(PrimaryIcon, { icon: Icon, className: iconClassName, style: isNested ? "secondary" : undefined, onClick: handleOnClick, link: link, title: title, disabled: isDisabled });
+        return (_jsx(PrimaryIcon, { icon: Icon, className: iconClassName, style: isNested ? "secondary" : undefined, onClick: handleOnClick, link: link, title: title, disabled: isDisabled }));
     }
 }

package/esm/dataGrid/dataGrid.js

@@ -37,6 +37,7 @@ injectString("tr", "Action", "Eylem");
 injectString("zh-Hans", "Action", "\u64CD\u4F5C");
 injectString("zh-TW", "Action", "\u52D5\u4F5C");
 injectString("ro-RO", "Action", "M\u0103sur\u0103");
+injectString("ar-SA", "Action", "\u0625\u062C\u0631\u0627\u0621");
 export const NOT_INTERACTIVE_MODIFIER = "zen-data-grid--not-interactive";
 export const DRAGGING_MODIFIER = "zen-data-grid--dragging";
 export const HORIZONTAL_SCROLL_MODIFIER = "zen-data-grid--horizontal-scroll";
@@ -203,7 +204,7 @@ const DataGridInner = ({
       children: _jsx("div", {
         className: "zen-data-grid__header-cell-content",
         children: renderHeaderWrappers(column.wrappers, _jsx("div", {
-          className: classNames(["zen-data-grid-header", column.title ? "" : "zen-visually-hidden"]),
+          className: classNames(["zen-data-grid-header", column.meta.multilineHeader ? "zen-data-grid-header--multiline" : "", column.title ? "" : "zen-visually-hidden"]),
           children: column.title ? text : emptyCellTitleValue
         }))
       })

package/esm/dataGrid/emptySearchList/emptySearchList.js

@@ -36,6 +36,7 @@ injectString("tr", "Try adjusting your search or filter.", "Araman\u0131z\u0131
 injectString("zh-Hans", "Try adjusting your search or filter.", "\u5C1D\u8BD5\u8C03\u6574\u60A8\u7684\u641C\u7D22\u6216\u7B5B\u9009\u6761\u4EF6\u3002");
 injectString("zh-TW", "Try adjusting your search or filter.", "\u8ACB\u5617\u8A66\u8ABF\u6574\u60A8\u7684\u641C\u5C0B\u6216\u7BE9\u9078\u689D\u4EF6\u3002");
 injectString("ro-RO", "Try adjusting your search or filter.", "\xCEncerca\u021Bi s\u0103 ajusta\u021Bi c\u0103utarea sau filtrul.");
+injectString("ar-SA", "Try adjusting your search or filter.", "\u062D\u0627\u0648\u0644 \u062A\u0639\u062F\u064A\u0644 \u0627\u0644\u0628\u062D\u062B \u0623\u0648 \u0627\u0644\u062A\u0635\u0641\u064A\u0629.");
 export const EmptySearchList = _a => {
   var props = __rest(_a, []);
   const {

package/esm/dataGrid/entitiesListActions/actions/columnsListButton.js

@@ -31,6 +31,7 @@ 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("ro-RO", "Column Settings", "Set\u0103ri coloane");
+injectString("ar-SA", "Column Settings", "\u0625\u0639\u062F\u0627\u062F\u0627\u062A \u0627\u0644\u0623\u0639\u0645\u062F\u0629");
 const ColumnsListButtonInner = ({
   onClick,
   ref

package/esm/dataGrid/entitiesListActions/actions/fullscreenButton.js

@@ -9,7 +9,33 @@ import { IconMinimize } from "../../../icons/iconMinimize";
 import { useLayoutFullScreenElement } from "../../../layout/layoutFullScreenElementProvider";
 import { useLayoutFullScreen } from "../../../layout/layoutFullScreenProvider";
 import { useCallback } from "react";
+injectString("cs", "Exit full screen table view", "Exit full screen table view");
+injectString("da-DK", "Exit full screen table view", "Exit full screen table view");
+injectString("de", "Exit full screen table view", "Exit full screen table view");
 injectString("en", "Exit full screen table view", "Exit full screen table view");
+injectString("es", "Exit full screen table view", "Exit full screen table view");
+injectString("fi-FI", "Exit full screen table view", "Exit full screen table view");
+injectString("fr", "Exit full screen table view", "Exit full screen table view");
+injectString("fr-FR", "Exit full screen table view", "Exit full screen table view");
+injectString("hu-HU", "Exit full screen table view", "Exit full screen table view");
+injectString("id", "Exit full screen table view", "Exit full screen table view");
+injectString("it", "Exit full screen table view", "Exit full screen table view");
+injectString("ja", "Exit full screen table view", "Exit full screen table view");
+injectString("ko-KR", "Exit full screen table view", "Exit full screen table view");
+injectString("ms", "Exit full screen table view", "Exit full screen table view");
+injectString("nb-NO", "Exit full screen table view", "Exit full screen table view");
+injectString("nl", "Exit full screen table view", "Exit full screen table view");
+injectString("pl", "Exit full screen table view", "Exit full screen table view");
+injectString("pt-BR", "Exit full screen table view", "Exit full screen table view");
+injectString("pt-PT", "Exit full screen table view", "Exit full screen table view");
+injectString("sk-SK", "Exit full screen table view", "Exit full screen table view");
+injectString("sv", "Exit full screen table view", "Exit full screen table view");
+injectString("th", "Exit full screen table view", "Exit full screen table view");
+injectString("tr", "Exit full screen table view", "Exit full screen table view");
+injectString("zh-Hans", "Exit full screen table view", "Exit full screen table view");
+injectString("zh-TW", "Exit full screen table view", "Exit full screen table view");
+injectString("ro-RO", "Exit full screen table view", "Exit full screen table view");
+injectString("ar-SA", "Exit full screen table view", "\u0627\u0644\u062E\u0631\u0648\u062C \u0645\u0646 \u0639\u0631\u0636 \u0627\u0644\u062C\u062F\u0648\u0644 \u0628\u0645\u0644\u0621 \u0627\u0644\u0634\u0627\u0634\u0629");
 injectString("cs", "Convert table to full screen", "Konvertovat tabulku do re\u017Eimu pln\xE9ho zobrazen\xED");
 injectString("da-DK", "Convert table to full screen", "Konverter tabel til fuld sk\xE6rm");
 injectString("de", "Convert table to full screen", "Tabelle in Vollbild umwandeln");
@@ -36,6 +62,7 @@ injectString("tr", "Convert table to full screen", "Tabloyu tam ekrana d\xF6n\xF
 injectString("zh-Hans", "Convert table to full screen", "\u5C06\u8868\u683C\u8F6C\u6362\u4E3A\u5168\u5C4F");
 injectString("zh-TW", "Convert table to full screen", "\u5C07\u8868\u683C\u8F49\u63DB\u70BA\u5168\u87A2\u5E55\u986F\u793A");
 injectString("ro-RO", "Convert table to full screen", "Schimba\u021Bi tabelul pe ecran complet");
+injectString("ar-SA", "Convert table to full screen", "\u062A\u062D\u0648\u064A\u0644 \u0627\u0644\u062C\u062F\u0648\u0644 \u0625\u0644\u0649 \u0645\u0644\u0621 \u0627\u0644\u0634\u0627\u0634\u0629");
 export const FullScreenButton = ({
   fullScreen,
   title,