@geotab/zenith 3.7.0 → 3.8.0-beta.1

package/dist/commonStyles/typography/typography.less

@@ -23,16 +23,19 @@
 }
 
 // Labels
-.label-01, .body-label-400 {
+.label-01,
+.body-label-400 {
     .font(var(--main-font), 12px, @line-height: 16px, @letter-spacing: 0.32px, @weight: 400);
 }
 
 // Labels Drive
-.label-01-tablet-drive, .tablet-label-400-drive {
+.label-01-tablet-drive,
+.tablet-label-400-drive {
     .font(var(--main-font), 16px, @line-height: 18px, @letter-spacing: 0.32px, @weight: 400);
 }
 
-.label-01-mobile-drive, .mobile-label-400-drive {
+.label-01-mobile-drive,
+.mobile-label-400-drive {
     .font(var(--main-font), 14px, @line-height: 18px, @letter-spacing: 0.32px, @weight: 400);
 }
 
@@ -43,36 +46,44 @@
 }
 
 // Body
-.body-01, .body-l-400 {
+.body-01,
+.body-l-400 {
     .font(var(--main-font), 16px, @line-height: 24px, @letter-spacing: 0, @weight: 400);
 }
 
-.body-02-short, .body-m-400-short {
+.body-02-short,
+.body-m-400-short {
     .font(var(--main-font), 14px, @line-height: 16px, @letter-spacing: 0, @weight: 400);
 }
 
-.body-02-tall, .body-m-400-tall {
+.body-02-tall,
+.body-m-400-tall {
     .font(var(--main-font), 14px, @line-height: 28px, @weight: 400, @letter-spacing: 0);
 }
 
-.body-03, .body-s-700 {
+.body-03,
+.body-s-700 {
     .font(var(--main-font), 12px, @line-height: 16px, @letter-spacing: 0.32px, @weight: 700);
 }
 
-.body-04, .body-s-400 {
+.body-04,
+.body-s-400 {
     .font(var(--main-font), 12px, @line-height: 16px, @letter-spacing: 0.32px, @weight: 400);
 }
 
-.body-05, .body-s-400-italic {
+.body-05,
+.body-s-400-italic {
     .font(var(--main-font), 12px, @line-height: 16px, @letter-spacing: 0.32px, @weight: 400, @style: italic);
 }
 
 // Body Drive
-.body-01-tablet-drive, .tablet-body-l-400-drive {
+.body-01-tablet-drive,
+.tablet-body-l-400-drive {
     .font(var(--main-font), 20px, @line-height: 30px, @letter-spacing: 0, @weight: 400);
 }
 
-.body-01-mobile-drive, .mobile-body-l-400-drive {
+.body-01-mobile-drive,
+.mobile-body-l-400-drive {
     .font(var(--main-font), 18px, @line-height: 28px, @letter-spacing: 0, @weight: 400);
 }
 
@@ -82,11 +93,13 @@
     }
 }
 
-.body-02-short-tablet-drive, .tablet-body-m-400-short-drive {
+.body-02-short-tablet-drive,
+.tablet-body-m-400-short-drive {
     .font(var(--main-font), 18px, @line-height: 22px, @weight: 400);
 }
 
-.body-02-short-mobile-drive, .mobile-body-m-400-short-drive {
+.body-02-short-mobile-drive,
+.mobile-body-m-400-short-drive {
     .font(var(--main-font), 16px, @line-height: 20px, @weight: 400);
 }
 
@@ -96,11 +109,13 @@
     }
 }
 
-.body-02-tall-tablet-drive, .tablet-body-m-400-tall-drive {
+.body-02-tall-tablet-drive,
+.tablet-body-m-400-tall-drive {
     .font(var(--main-font), 18px, @line-height: 28px, @weight: 400);
 }
 
-.body-02-tall-mobile-drive, .mobile-body-m-400-tall-drive {
+.body-02-tall-mobile-drive,
+.mobile-body-m-400-tall-drive {
     .font(var(--main-font), 16px, @line-height: 26px, @weight: 400);
 }
 
@@ -110,11 +125,13 @@
     }
 }
 
-.body-03-tablet-drive, .tablet-body-s-700-drive {
+.body-03-tablet-drive,
+.tablet-body-s-700-drive {
     .font(var(--main-font), 16px, @line-height: 22px, @letter-spacing: 0.32px, @weight: 700);
 }
 
-.body-03-mobile-drive, .mobile-body-s-700-drive {
+.body-03-mobile-drive,
+.mobile-body-s-700-drive {
     .font(var(--main-font), 14px, @line-height: 18px, @letter-spacing: 0.32px, @weight: 700);
 }
 
@@ -124,11 +141,13 @@
     }
 }
 
-.body-04-tablet-drive, .tablet-body-s-400-drive {
+.body-04-tablet-drive,
+.tablet-body-s-400-drive {
     .font(var(--main-font), 16px, @line-height: 22px, @letter-spacing: 0.32px, @weight: 400);
 }
 
-.body-04-mobile-drive, .mobile-body-s-400-drive {
+.body-04-mobile-drive,
+.mobile-body-s-400-drive {
     .font(var(--main-font), 14px, @line-height: 20px, @letter-spacing: 0.32px, @weight: 400);
 }
 
@@ -138,11 +157,13 @@
     }
 }
 
-.body-05-tablet-drive, .tablet-body-s-400-italic-drive {
+.body-05-tablet-drive,
+.tablet-body-s-400-italic-drive {
     .font(var(--main-font), 16px, @line-height: 20px, @letter-spacing: 0.32px, @weight: 400, @style: italic);
 }
 
-.body-05-mobile-drive, .mobile-body-s-400-italic-drive {
+.body-05-mobile-drive,
+.mobile-body-s-400-italic-drive {
     .font(var(--main-font), 14px, @line-height: 18px, @letter-spacing: 0.32px, @weight: 400, @style: italic);
 }
 
@@ -153,11 +174,13 @@
 }
 
 // Headings
-.heading-01-desktop, .heading-xl-300 {
+.heading-01-desktop,
+.heading-xl-300 {
     .font(var(--main-font), 28px, @line-height: 36px, @weight: 300);
 }
 
-.heading-01-mobile, .heading-xl-300-mobile {
+.heading-01-mobile,
+.heading-xl-300-mobile {
     .font(var(--main-font), 20px, @line-height: 36px, @weight: 300);
 }
 
@@ -167,15 +190,18 @@
     }
 }
 
-.heading-02, .heading-l-400 {
+.heading-02,
+.heading-l-400 {
     .font(var(--main-font), 20px, @line-height: 24px, @weight: 400);
 }
 
-.heading-03-desktop, .heading-m-300 {
+.heading-03-desktop,
+.heading-m-300 {
     .font(var(--main-font), 20px, @line-height: 28px, @weight: 300);
 }
 
-.heading-03-mobile, .heading-m-300-mobile {
+.heading-03-mobile,
+.heading-m-300-mobile {
     .font(var(--main-font), 18px, @line-height: 28px, @weight: 300);
 }
 
@@ -185,11 +211,13 @@
     }
 }
 
-.heading-04, .heading-s-500 {
+.heading-04,
+.heading-s-500 {
     .font(var(--main-font), 16px, @line-height: 24px, @weight: 500);
 }
 
-.heading-05, .heading-xs-500 {
+.heading-05,
+.heading-xs-500 {
     .font(var(--main-font), 14px, @line-height: 16px, 0.16px, 500);
 }
 
@@ -197,16 +225,19 @@
     .font(var(--main-font), 14px, @line-height: 24px, 0, 500, normal, uppercase);
 }
 
-.heading-07, .heading-xs-300 {
+.heading-07,
+.heading-xs-300 {
     .font(var(--main-font), 14px, @line-height: 16px, 0.16px, 300);
 }
 
 // Headings Drive
-.heading-01-tablet-drive, .tablet-heading-xl-300-drive {
+.heading-01-tablet-drive,
+.tablet-heading-xl-300-drive {
     .font(var(--main-font), 26px, 34px, @weight: 300);
 }
 
-.heading-01-mobile-drive, .mobile-heading-xl-300-drive {
+.heading-01-mobile-drive,
+.mobile-heading-xl-300-drive {
     .font(var(--main-font), 24px, 32px, @weight: 300);
 }
 
@@ -216,11 +247,13 @@
     }
 }
 
-.heading-02-tablet-drive, .tablet-heading-l-400-drive {
+.heading-02-tablet-drive,
+.tablet-heading-l-400-drive {
     .font(var(--main-font), 24px, 30px, @weight: 400);
 }
 
-.heading-02-mobile-drive, .mobile-heading-l-400-drive {
+.heading-02-mobile-drive,
+.mobile-heading-l-400-drive {
     .font(var(--main-font), 22px, 28px, @weight: 400);
 }
 
@@ -230,11 +263,13 @@
     }
 }
 
-.heading-03-tablet-drive, .tablet-heading-m-300-drive {
+.heading-03-tablet-drive,
+.tablet-heading-m-300-drive {
     .font(var(--main-font), 20px, 26px, @weight: 300);
 }
 
-.heading-03-mobile-drive, .mobile-heading-m-300-drive {
+.heading-03-mobile-drive,
+.mobile-heading-m-300-drive {
     .font(var(--main-font), 18px, 24px, @weight: 300);
 }
 
@@ -244,11 +279,13 @@
     }
 }
 
-.heading-04-tablet-drive, .tablet-heading-m-500-drive {
+.heading-04-tablet-drive,
+.tablet-heading-m-500-drive {
     .font(var(--main-font), 20px, 28px, @weight: 500);
 }
 
-.heading-04-mobile-drive, .mobile-heading-m-500-drive {
+.heading-04-mobile-drive,
+.mobile-heading-m-500-drive {
     .font(var(--main-font), 18px, 26px, @weight: 500);
 }
 
@@ -258,11 +295,13 @@
     }
 }
 
-.heading-05-tablet-drive, .tablet-heading-s-500-drive {
+.heading-05-tablet-drive,
+.tablet-heading-s-500-drive {
     .font(var(--main-font), 18px, 22px, 0.16px, 500);
 }
 
-.heading-05-mobile-drive, .mobile-heading-s-500-drive {
+.heading-05-mobile-drive,
+.mobile-heading-s-500-drive {
     .font(var(--main-font), 16px, 20px, 0.16px, 500);
 }
 
@@ -280,11 +319,13 @@
     .font(var(--main-font), 12px, 20px, 0, 500, normal, uppercase);
 }
 
-.heading-07-tablet-drive, .tablet-heading-s-300-drive {
+.heading-07-tablet-drive,
+.tablet-heading-s-300-drive {
     .font(var(--main-font), 18px, 20px, 0.16px, 300);
 }
 
-.heading-07-mobile-drive, .mobile-heading-s-300-drive {
+.heading-07-mobile-drive,
+.mobile-heading-s-300-drive {
     .font(var(--main-font), 16px, 18px, 0.16px, 300);
 }
 
@@ -295,36 +336,44 @@
 }
 
 // Data
-.data-01, .data-xxl {
+.data-01,
+.data-xxl {
     .font(var(--main-font-data), 32px, @line-height: 40px);
 }
 
-.data-02, .data-xl {
+.data-02,
+.data-xl {
     .font(var(--main-font-data), 24px, 32px);
 }
 
-.data-03, .data-l {
+.data-03,
+.data-l {
     .font(var(--main-font-data), 20px, 24px);
 }
 
-.data-04, .data-m {
+.data-04,
+.data-m {
     .font(var(--main-font-data), 18px, 21px);
 }
 
-.data-05, .data-s {
+.data-05,
+.data-s {
     .font(var(--main-font-data), 16px, 18px);
 }
 
-.data-06, .data-xs {
+.data-06,
+.data-xs {
     .font(var(--main-font-data), 14px, 16px);
 }
 
 // Data Drive
-.data-01-tablet-drive, .tablet-data-xl-drive {
+.data-01-tablet-drive,
+.tablet-data-xl-drive {
     .font(var(--data-font-drive), 34px, 42px);
 }
 
-.data-01-mobile-drive, .mobile-data-xl-drive {
+.data-01-mobile-drive,
+.mobile-data-xl-drive {
     .font(var(--data-font-drive), 32px, 40px);
 }
 
@@ -334,11 +383,13 @@
     }
 }
 
-.data-02-tablet-drive, .tablet-data-l-drive {
+.data-02-tablet-drive,
+.tablet-data-l-drive {
     .font(var(--data-font-drive), 22px, 26px);
 }
 
-.data-02-mobile-drive, .mobile-data-l-drive {
+.data-02-mobile-drive,
+.mobile-data-l-drive {
     .font(var(--data-font-drive), 20px, 24px);
 }
 
@@ -348,11 +399,13 @@
     }
 }
 
-.data-03-tablet-drive, .tablet-data-m-drive {
+.data-03-tablet-drive,
+.tablet-data-m-drive {
     .font(var(--data-font-drive), 20px, 22px);
 }
 
-.data-03-mobile-drive, .mobile-data-m-drive {
+.data-03-mobile-drive,
+.mobile-data-m-drive {
     .font(var(--data-font-drive), 16px, 21px);
 }
 
@@ -362,11 +415,13 @@
     }
 }
 
-.data-04-tablet-drive, .tablet-data-s-drive {
+.data-04-tablet-drive,
+.tablet-data-s-drive {
     .font(var(--data-font-drive), 18px, 26px);
 }
 
-.data-04-mobile-drive, .mobile-data-s-drive {
+.data-04-mobile-drive,
+.mobile-data-s-drive {
     .font(var(--data-font-drive), 16px, 24px);
 }
 
@@ -374,4 +429,4 @@
     .tablet-data-s-drive {
         .font(var(--data-font-drive), 16px, 24px);
     }
-}
+}

package/dist/commonStyles/zIndex.less

@@ -77,7 +77,6 @@
 @z-index-10005: 10005;
 // Waiting
 
-
 // ---- Non modal/internal items (hidden in storybook) ----
 
 @z-index-5001: 5001;
@@ -113,9 +112,6 @@
 // SearchableField inner items (deprecated)
 // DateRange inner items
 
-
 @z-index--1: -1;
 // BulkActions inner items (internal component)
 // Header inner items
-
-

package/dist/controlledPopup/controlledPopup.d.ts

@@ -19,10 +19,7 @@ export interface IControlledPopup extends IZenComponentProps {
     useTrapFocusWithTrigger?: TTrapFocus;
     shouldHoldScroll?: boolean;
     onOpenChange: (isOpen: boolean) => void;
-    /**
-        @deprecated - this prop is deprecated and will be removed in the next major version.
-    */
-    role?: string;
+    role?: string | false;
     ariaLabel?: string;
     ariaLabelledby?: string;
     recalculateOnScroll?: boolean;
@@ -30,4 +27,4 @@ export interface IControlledPopup extends IZenComponentProps {
     /** Whether to focus the first focusable element when popup opens. Default: true */
     focusOnOpen?: boolean;
 }
-export declare const ControlledPopup: ({ isOpen, id, paddingX, paddingY, triggerRef, className, children, alignment, inline, onOpenChange, useTrapFocusWithTrigger, shouldHoldScroll, ariaLabel, ariaLabelledby, recalculateOnScroll, preventAttributesAutoSet, focusOnOpen }: IControlledPopup) => import("react/jsx-runtime").JSX.Element;
+export declare const ControlledPopup: ({ isOpen, id, paddingX, paddingY, triggerRef, className, children, alignment, inline, onOpenChange, useTrapFocusWithTrigger, shouldHoldScroll, ariaLabel, ariaLabelledby, recalculateOnScroll, preventAttributesAutoSet, focusOnOpen, role }: IControlledPopup) => import("react/jsx-runtime").JSX.Element;

package/dist/controlledPopup/controlledPopup.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const absolute_1 = require("../absolute/absolute");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const useClientReady_1 = require("../commonHelpers/hooks/useClientReady");
-const ControlledPopup = ({ isOpen, id, paddingX, paddingY, triggerRef, className, children, alignment, inline, onOpenChange, useTrapFocusWithTrigger, shouldHoldScroll, ariaLabel, ariaLabelledby, recalculateOnScroll, preventAttributesAutoSet, focusOnOpen }) => {
+const ControlledPopup = ({ isOpen, id, paddingX, paddingY, triggerRef, className, children, alignment, inline, onOpenChange, useTrapFocusWithTrigger, shouldHoldScroll, ariaLabel, ariaLabelledby, recalculateOnScroll, preventAttributesAutoSet, focusOnOpen, role = "dialog" }) => {
     const autoId = (0, react_1.useId)();
     const popupId = id || autoId;
     const isClientReady = (0, useClientReady_1.useClientReady)();
@@ -24,6 +24,6 @@ const ControlledPopup = ({ isOpen, id, paddingX, paddingY, triggerRef, className
         triggerRef.current.setAttribute("aria-expanded", isOpen ? "true" : "false");
         triggerRef.current.setAttribute("aria-controls", popupId);
     }, [triggerRef, isOpen, popupId, preventAttributesAutoSet, isClientReady]);
-    return ((0, jsx_runtime_1.jsx)(absolute_1.Absolute, { triggerRef: triggerRef, alignment: alignment, id: popupId, isOpen: isOpen, className: (0, classNames_1.classNames)(["zen-popup", className ? className : ""]), paddingX: paddingX, paddingY: paddingY, inline: inline, onOpenChange: onOpenChange, useTrapFocusWithTrigger: useTrapFocusWithTrigger, shouldHoldScroll: shouldHoldScroll, role: "dialog", ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, recalculateOnScroll: recalculateOnScroll, focusOnOpen: focusOnOpen, children: children }));
+    return ((0, jsx_runtime_1.jsx)(absolute_1.Absolute, Object.assign({ triggerRef: triggerRef, alignment: alignment, id: popupId, isOpen: isOpen, className: (0, classNames_1.classNames)(["zen-popup", className ? className : ""]), paddingX: paddingX, paddingY: paddingY, inline: inline, onOpenChange: onOpenChange, useTrapFocusWithTrigger: useTrapFocusWithTrigger, shouldHoldScroll: shouldHoldScroll }, (role !== false && typeof role === "string" ? { role } : {}), (role !== false && ariaLabel ? { ariaLabel } : {}), (role !== false && ariaLabelledby ? { ariaLabelledby } : {}), { recalculateOnScroll: recalculateOnScroll, focusOnOpen: focusOnOpen, children: children })));
 };
 exports.ControlledPopup = ControlledPopup;

package/dist/dataFeed/dataFeed.js

@@ -63,7 +63,8 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
         var _a;
         return (_a = zen_1.zen.requestAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, () => {
             const visible = getVisibleItems();
-            const newVisibleRows = visible.filter(row => {
+            const newVisibleRows = visible
+                .filter(row => {
                 const id = row.dataset.rowId;
                 if (id === undefined) {
                     return false;
@@ -73,7 +74,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);
@@ -101,7 +103,7 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
     }, true);
     const feedItems = (0, react_1.useMemo)(() => data.map((entity, index) => {
         const entityClassName = (0, getRowClassName_1.getRowClassName)(rowClassName, entity);
-        return (0, jsx_runtime_1.jsx)(dataFeedColumnsItems_1.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 ((0, jsx_runtime_1.jsx)(dataFeedColumnsItems_1.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,
@@ -118,10 +120,7 @@ const DataFeedInner = ({ entities, columns, feedWrappers, className, expanded, o
         onExpandedChange,
         onClick
     ]);
-    return (0, jsx_runtime_1.jsx)("div", { className: "zen-data-grid-wrapper", children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)([
-                "zen-data-grid",
-                className || ""
-            ]), ref: feedRef, onScroll: handleScroll, children: [(0, jsx_runtime_1.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 ((0, jsx_runtime_1.jsx)("div", { className: "zen-data-grid-wrapper", children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-data-grid", className || ""]), ref: feedRef, onScroll: handleScroll, children: [(0, jsx_runtime_1.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 = (0, react_1.forwardRef)(DataFeedInner);
 exports.DataFeed = DataFeed;

package/dist/dataFeed/dataFeedCell/dataFeedCell.js

@@ -40,12 +40,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_1.zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, placeholderTimeout);
             setLabelContent(label);
             setContent(value);
-        }).catch((e) => {
+        })
+            .catch(e => {
             var _a;
             console.error(e);
             (_a = zen_1.zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, placeholderTimeout);
@@ -54,12 +56,10 @@ const FeedCell = ({ limited = false, visibleOnHover = false, isVisible, title, r
         });
         return () => { var _a; return (_a = zen_1.zen.cancelAnimationFrame) === null || _a === void 0 ? void 0 : _a.call(zen_1.zen, placeholderTimeout); };
     }, [isVisible, renderer, placeholderRenderer]);
-    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [labelContent ? (0, jsx_runtime_1.jsx)("div", { className: "zen-feed-item__label", children: labelContent }) : null, content
-                ? (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.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 ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [labelContent ? (0, jsx_runtime_1.jsx)("div", { className: "zen-feed-item__label", children: labelContent }) : null, content ? ((0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.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] }));
 };
 exports.DataFeedCell = (0, react_1.memo)(FeedCell);

package/dist/dataFeed/dataFeedColumnsItems.js

@@ -10,7 +10,7 @@ const actionsMenu_1 = require("../table/actions/actionsMenu");
 const useVisibleColumns_1 = require("./hooks/useVisibleColumns");
 const menu_1 = require("../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);
     }
@@ -33,9 +33,12 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
                     primaryActionsList = primaryActions.filter(action => action.condition === undefined || action.condition(entity));
                 }
                 if (primaryActionsList && primaryActionsList.length > 0) {
-                    primaryActionsContent = (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: primaryActionsList.map((action) => (0, jsx_runtime_1.jsx)(menu_1.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 = ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: primaryActionsList.map(action => ((0, jsx_runtime_1.jsx)(menu_1.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) {
@@ -48,7 +51,7 @@ const FeedItemInner = ({ columnsList, feedWrappers, expanded, collapsedColumnsQt
                 return (0, jsx_runtime_1.jsx)(actionsMenu_1.ActionsMenu, { entity: rowEntity, isNested: !nested, render: actions, primaryActions: primaryActionsContent });
             }
             if (typeof actionsAsync === "function") {
-                return (0, jsx_runtime_1.jsx)(actionsMenu_1.ActionsMenu, { entity: rowEntity, isNested: !nested, renderAsync: actionsAsync, primaryActions: primaryActionsContent });
+                return ((0, jsx_runtime_1.jsx)(actionsMenu_1.ActionsMenu, { entity: rowEntity, isNested: !nested, renderAsync: actionsAsync, primaryActions: primaryActionsContent }));
             }
             return (0, jsx_runtime_1.jsx)(actionsButton_1.ActionsButton, { action: actions, entity: rowEntity });
         };
@@ -59,17 +62,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];
@@ -86,19 +90,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 (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [feedResult[0], feedResult[1]] });
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [feedResult[0], feedResult[1]] }));
         };
         const mainColumnsData = mainColumnsMemoized.map(column => {
             const renderFeed = getRenderFeed(column);
             const renderWrappers = getRenderWrappers(column);
             const feedPlaceholder = getFeedPlaceholder(column);
-            return (0, jsx_runtime_1.jsx)(dataFeedCell_1.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 ((0, jsx_runtime_1.jsx)(dataFeedCell_1.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 (0, jsx_runtime_1.jsx)(dataFeedCell_1.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 ((0, jsx_runtime_1.jsx)(dataFeedCell_1.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)
@@ -109,8 +113,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 (0, jsx_runtime_1.jsx)(feedItem_1.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 ((0, jsx_runtime_1.jsx)(feedItem_1.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 = (0, react_1.useMemo)(() => (entity.children && isRowExpanded ? entity.children : []).map(nestedEntity => renderCells(nestedEntity)), [entity.children, isRowExpanded, renderCells]);
     const cells = (0, react_1.useMemo)(() => renderCells(entity, nestedCells), [entity, nestedCells, renderCells]);
     return cells;

package/dist/dataFeed/dataFeedHeader/dataFeedHeader.js

@@ -7,6 +7,6 @@ const columnSortDirection_1 = require("../../dataGrid/withSortableColumns/column
 const DataFeedHeader = ({ column, sortState, className, onSortChange }) => {
     var _a, _b;
     const isSortedBy = (sortState === null || sortState === void 0 ? void 0 : sortState.sortColumn) === column.id;
-    return (0, jsx_runtime_1.jsx)("div", { className: className, children: (0, jsx_runtime_1.jsx)(sortableColumnWrapper_1.SortableHeaderCell, { columnName: ((_a = column.name) === null || _a === void 0 ? void 0 : _a.toString()) || column.id.toString(), isSortedBy: isSortedBy, sortDirection: isSortedBy ? sortState.sortDirection : columnSortDirection_1.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 ((0, jsx_runtime_1.jsx)("div", { className: className, children: (0, jsx_runtime_1.jsx)(sortableColumnWrapper_1.SortableHeaderCell, { columnName: ((_a = column.name) === null || _a === void 0 ? void 0 : _a.toString()) || column.id.toString(), isSortedBy: isSortedBy, sortDirection: isSortedBy ? sortState.sortDirection : columnSortDirection_1.ColumnSortDirection.None, title: column.title, tooltip: column.title, onSortChange: onSortChange, isMobile: true, initialSortDirection: (_b = column.meta) === null || _b === void 0 ? void 0 : _b.initialSortDirection }) }));
 };
 exports.DataFeedHeader = DataFeedHeader;