@geotab/zenith 3.8.0 → 3.9.0-beta.ssr.0

package/esm/calendar/calendar.js

@@ -203,6 +203,195 @@ injectString("zh-Hans", "ShortSaturday", "\u516D");
 injectString("zh-TW", "ShortSaturday", "\u9031\u516D");
 injectString("ro-RO", "ShortSaturday", "ShortSaturday");
 injectString("ar-SA", "ShortSaturday", "\u0633");
+injectString("cs", "Sunday", "Ned\u011Ble");
+injectString("da-DK", "Sunday", "s\xF8ndag");
+injectString("de", "Sunday", "Sonntag");
+injectString("en", "Sunday", "Sunday");
+injectString("es", "Sunday", "Domingo");
+injectString("fi-FI", "Sunday", "Sunnuntai");
+injectString("fr", "Sunday", "Dimanche");
+injectString("fr-FR", "Sunday", "Dimanche");
+injectString("hu-HU", "Sunday", "vas\xE1rnap");
+injectString("id", "Sunday", "Minggu");
+injectString("it", "Sunday", "Domenica");
+injectString("ja", "Sunday", "\u65E5\u66DC\u65E5");
+injectString("ko-KR", "Sunday", "\uC77C\uC694\uC77C");
+injectString("ms", "Sunday", "Ahad");
+injectString("nb-NO", "Sunday", "S\xF8ndag");
+injectString("nl", "Sunday", "zondag");
+injectString("pl", "Sunday", "Niedziela");
+injectString("pt-BR", "Sunday", "Domingo");
+injectString("pt-PT", "Sunday", "Domingo");
+injectString("sk-SK", "Sunday", "Nede\u013Ea");
+injectString("sv", "Sunday", "S\xF6ndag");
+injectString("th", "Sunday", "\u0E27\u0E31\u0E19\u0E2D\u0E32\u0E17\u0E34\u0E15\u0E22\u0E4C");
+injectString("tr", "Sunday", "Pazar");
+injectString("zh-Hans", "Sunday", "\u661F\u671F\u5929");
+injectString("zh-TW", "Sunday", "\u661F\u671F\u65E5");
+injectString("ro-RO", "Sunday", "Duminic\u0103");
+injectString("ar-SA", "Sunday", "\u0627\u0644\u0623\u062D\u062F");
+injectString("cs", "Monday", "Pond\u011Bl\xED");
+injectString("da-DK", "Monday", "mandag");
+injectString("de", "Monday", "Montag");
+injectString("en", "Monday", "Monday");
+injectString("es", "Monday", "Lunes");
+injectString("fi-FI", "Monday", "Maanantai");
+injectString("fr", "Monday", "Lundi");
+injectString("fr-FR", "Monday", "Lundi");
+injectString("hu-HU", "Monday", "h\xE9tf\u0151");
+injectString("id", "Monday", "Senin");
+injectString("it", "Monday", "Luned\xEC");
+injectString("ja", "Monday", "\u6708\u66DC\u65E5");
+injectString("ko-KR", "Monday", "\uC6D4\uC694\uC77C");
+injectString("ms", "Monday", "Isnin");
+injectString("nb-NO", "Monday", "Mandag");
+injectString("nl", "Monday", "maandag");
+injectString("pl", "Monday", "Poniedzia\u0142ek");
+injectString("pt-BR", "Monday", "Segunda-feira");
+injectString("pt-PT", "Monday", "Segunda-feira");
+injectString("sk-SK", "Monday", "pondelok");
+injectString("sv", "Monday", "M\xE5ndag");
+injectString("th", "Monday", "\u0E27\u0E31\u0E19\u0E08\u0E31\u0E19\u0E17\u0E23\u0E4C");
+injectString("tr", "Monday", "Pazartesi");
+injectString("zh-Hans", "Monday", "\u661F\u671F\u4E00");
+injectString("zh-TW", "Monday", "\u661F\u671F\u4E00");
+injectString("ro-RO", "Monday", "Luni");
+injectString("ar-SA", "Monday", "\u0627\u0644\u0627\u062B\u0646\u064A\u0646");
+injectString("cs", "Tuesday", "\xDAter\xFD");
+injectString("da-DK", "Tuesday", "tirsdag");
+injectString("de", "Tuesday", "Dienstag");
+injectString("en", "Tuesday", "Tuesday");
+injectString("es", "Tuesday", "Martes");
+injectString("fi-FI", "Tuesday", "Tiistai");
+injectString("fr", "Tuesday", "Mardi");
+injectString("fr-FR", "Tuesday", "Mardi");
+injectString("hu-HU", "Tuesday", "kedd");
+injectString("id", "Tuesday", "Selasa");
+injectString("it", "Tuesday", "Marted\xEC");
+injectString("ja", "Tuesday", "\u706B\u66DC\u65E5");
+injectString("ko-KR", "Tuesday", "\uD654\uC694\uC77C");
+injectString("ms", "Tuesday", "Selasa");
+injectString("nb-NO", "Tuesday", "Tirsdag");
+injectString("nl", "Tuesday", "dinsdag");
+injectString("pl", "Tuesday", "Wtorek");
+injectString("pt-BR", "Tuesday", "Ter\xE7a-feira");
+injectString("pt-PT", "Tuesday", "Ter\xE7a-feira");
+injectString("sk-SK", "Tuesday", "Utorok");
+injectString("sv", "Tuesday", "Tisdag");
+injectString("th", "Tuesday", "\u0E27\u0E31\u0E19\u0E2D\u0E31\u0E07\u0E04\u0E32\u0E23");
+injectString("tr", "Tuesday", "Sal\u0131");
+injectString("zh-Hans", "Tuesday", "\u661F\u671F\u4E8C");
+injectString("zh-TW", "Tuesday", "\u661F\u671F\u4E8C");
+injectString("ro-RO", "Tuesday", "Mar\u021Bi");
+injectString("ar-SA", "Tuesday", "\u0627\u0644\u062B\u0644\u0627\u062B\u0627\u0621");
+injectString("cs", "Wednesday", "St\u0159eda");
+injectString("da-DK", "Wednesday", "onsdag");
+injectString("de", "Wednesday", "Mittwoch");
+injectString("en", "Wednesday", "Wednesday");
+injectString("es", "Wednesday", "Mi\xE9rcoles");
+injectString("fi-FI", "Wednesday", "Keskiviikko");
+injectString("fr", "Wednesday", "Mercredi");
+injectString("fr-FR", "Wednesday", "Mercredi");
+injectString("hu-HU", "Wednesday", "szerda");
+injectString("id", "Wednesday", "Rabu");
+injectString("it", "Wednesday", "Mercoled\xEC");
+injectString("ja", "Wednesday", "\u6C34\u66DC\u65E5");
+injectString("ko-KR", "Wednesday", "\uC218\uC694\uC77C");
+injectString("ms", "Wednesday", "Rabu");
+injectString("nb-NO", "Wednesday", "Onsdag");
+injectString("nl", "Wednesday", "woensdag");
+injectString("pl", "Wednesday", "\u015Aroda");
+injectString("pt-BR", "Wednesday", "Quarta-feira");
+injectString("pt-PT", "Wednesday", "Quarta-feira");
+injectString("sk-SK", "Wednesday", "Streda");
+injectString("sv", "Wednesday", "Onsdag");
+injectString("th", "Wednesday", "\u0E27\u0E31\u0E19\u0E1E\u0E38\u0E18");
+injectString("tr", "Wednesday", "\xC7ar\u015Famba");
+injectString("zh-Hans", "Wednesday", "\u661F\u671F\u4E09");
+injectString("zh-TW", "Wednesday", "\u661F\u671F\u4E09");
+injectString("ro-RO", "Wednesday", "Miercuri");
+injectString("ar-SA", "Wednesday", "\u0627\u0644\u0623\u0631\u0628\u0639\u0627\u0621");
+injectString("cs", "Thursday", "\u010Ctvrtek");
+injectString("da-DK", "Thursday", "torsdag");
+injectString("de", "Thursday", "Donnerstag");
+injectString("en", "Thursday", "Thursday");
+injectString("es", "Thursday", "Jueves");
+injectString("fi-FI", "Thursday", "Torstai");
+injectString("fr", "Thursday", "Jeudi");
+injectString("fr-FR", "Thursday", "Jeudi");
+injectString("hu-HU", "Thursday", "cs\xFCt\xF6rt\xF6k");
+injectString("id", "Thursday", "Kamis");
+injectString("it", "Thursday", "Gioved\xEC");
+injectString("ja", "Thursday", "\u6728\u66DC\u65E5");
+injectString("ko-KR", "Thursday", "\uBAA9\uC694\uC77C");
+injectString("ms", "Thursday", "Khamis");
+injectString("nb-NO", "Thursday", "Torsdag");
+injectString("nl", "Thursday", "donderdag");
+injectString("pl", "Thursday", "Czwartek");
+injectString("pt-BR", "Thursday", "Quinta-feira");
+injectString("pt-PT", "Thursday", "Quinta-feira");
+injectString("sk-SK", "Thursday", "\u0161tvrtok");
+injectString("sv", "Thursday", "Torsdag");
+injectString("th", "Thursday", "\u0E27\u0E31\u0E19\u0E1E\u0E24\u0E2B\u0E31\u0E2A\u0E1A\u0E14\u0E35");
+injectString("tr", "Thursday", "Per\u015Fembe");
+injectString("zh-Hans", "Thursday", "\u661F\u671F\u56DB");
+injectString("zh-TW", "Thursday", "\u661F\u671F\u56DB");
+injectString("ro-RO", "Thursday", "Joi");
+injectString("ar-SA", "Thursday", "\u0627\u0644\u062E\u0645\u064A\u0633");
+injectString("cs", "Friday", "P\xE1tek");
+injectString("da-DK", "Friday", "fredag");
+injectString("de", "Friday", "Freitag");
+injectString("en", "Friday", "Friday");
+injectString("es", "Friday", "Viernes");
+injectString("fi-FI", "Friday", "Perjantai");
+injectString("fr", "Friday", "Vendredi");
+injectString("fr-FR", "Friday", "Vendredi");
+injectString("hu-HU", "Friday", "p\xE9ntek");
+injectString("id", "Friday", "Jumat");
+injectString("it", "Friday", "Venerd\xEC");
+injectString("ja", "Friday", "\u91D1\u66DC\u65E5");
+injectString("ko-KR", "Friday", "\uAE08\uC694\uC77C");
+injectString("ms", "Friday", "Jumaat");
+injectString("nb-NO", "Friday", "Fredag");
+injectString("nl", "Friday", "vrijdag");
+injectString("pl", "Friday", "Pi\u0105tek");
+injectString("pt-BR", "Friday", "Sexta-feira");
+injectString("pt-PT", "Friday", "Sexta-feira");
+injectString("sk-SK", "Friday", "Piatok");
+injectString("sv", "Friday", "Fredag");
+injectString("th", "Friday", "\u0E27\u0E31\u0E19\u0E28\u0E38\u0E01\u0E23\u0E4C");
+injectString("tr", "Friday", "Cuma");
+injectString("zh-Hans", "Friday", "\u661F\u671F\u4E94");
+injectString("zh-TW", "Friday", "\u661F\u671F\u4E94");
+injectString("ro-RO", "Friday", "Vineri");
+injectString("ar-SA", "Friday", "\u0627\u0644\u062C\u0645\u0639\u0629");
+injectString("cs", "Saturday", "Sobota");
+injectString("da-DK", "Saturday", "l\xF8rdag");
+injectString("de", "Saturday", "Samstag");
+injectString("en", "Saturday", "Saturday");
+injectString("es", "Saturday", "S\xE1bado");
+injectString("fi-FI", "Saturday", "Lauantai");
+injectString("fr", "Saturday", "Samedi");
+injectString("fr-FR", "Saturday", "Samedi");
+injectString("hu-HU", "Saturday", "szombat");
+injectString("id", "Saturday", "Sabtu");
+injectString("it", "Saturday", "Sabato");
+injectString("ja", "Saturday", "\u571F\u66DC\u65E5");
+injectString("ko-KR", "Saturday", "\uD1A0\uC694\uC77C");
+injectString("ms", "Saturday", "Sabtu");
+injectString("nb-NO", "Saturday", "L\xF8rdag");
+injectString("nl", "Saturday", "zaterdag");
+injectString("pl", "Saturday", "Sobota");
+injectString("pt-BR", "Saturday", "S\xE1bado");
+injectString("pt-PT", "Saturday", "S\xE1bado");
+injectString("sk-SK", "Saturday", "Sobota");
+injectString("sv", "Saturday", "L\xF6rdag");
+injectString("th", "Saturday", "\u0E27\u0E31\u0E19\u0E40\u0E2A\u0E32\u0E23\u0E4C");
+injectString("tr", "Saturday", "Cumartesi");
+injectString("zh-Hans", "Saturday", "\u661F\u671F\u516D");
+injectString("zh-TW", "Saturday", "\u661F\u671F\u516D");
+injectString("ro-RO", "Saturday", "S\xE2mb\u0103t\u0103");
+injectString("ar-SA", "Saturday", "\u0627\u0644\u0633\u0628\u062A");
 injectString("cs", "Jan", "Led");
 injectString("da-DK", "Jan", "Jan");
 injectString("de", "Jan", "Jan");
@@ -694,6 +883,7 @@ export const Calendar = ({
     5: translate("ShortFriday"),
     6: translate("ShortSaturday")
   }), [translate]);
+  const fullDayLabels = useMemo(() => [translate("Sunday"), translate("Monday"), translate("Tuesday"), translate("Wednesday"), translate("Thursday"), translate("Friday"), translate("Saturday")], [translate]);
   const getDayOfWeek = useCallback(date => {
     const dayOfWeek = new Date(date).getDay();
     return dayLabels[dayOfWeek];
@@ -967,9 +1157,16 @@ export const Calendar = ({
       children: [_jsx("thead", {
         children: _jsx("tr", {
           className: "zen-calendar__columns",
-          children: dates[0].map(date => _jsx("th", {
+          children: dates[0].map(date => _jsxs("th", {
+            scope: "col",
             className: "zen-calendar__column",
-            children: getDayOfWeek(date)
+            children: [_jsx("span", {
+              "aria-hidden": "true",
+              children: getDayOfWeek(date)
+            }), _jsx("span", {
+              className: "zen-visually-hidden",
+              children: fullDayLabels[new Date(date).getDay()]
+            })]
           }, `cal-h-${date}`))
         })
       }), _jsx("tbody", {
@@ -1023,4 +1220,4 @@ export const Calendar = ({
     })]
   });
 };
-export const TRANSLATIONS = ["Select year", "Previous month", "Next month", "Change start date, {date}", "Change end date, {date}", "Choose end date", "Choose start date", "Change date, {date}", "Choose date", "{short-day-of-week-sunday}S", "{short-day-of-week-monday}M", "{short-day-of-week-tuesday}T", "{short-day-of-week-wednesday}W", "{short-day-of-week-thursday}T", "{short-day-of-week-friday}F", "{short-day-of-week-saturday}S", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+export const TRANSLATIONS = ["Select year", "Previous month", "Next month", "Change start date, {date}", "Change end date, {date}", "Choose end date", "Choose start date", "Change date, {date}", "Choose date", "{short-day-of-week-sunday}S", "{short-day-of-week-monday}M", "{short-day-of-week-tuesday}T", "{short-day-of-week-wednesday}W", "{short-day-of-week-thursday}T", "{short-day-of-week-friday}F", "{short-day-of-week-saturday}S", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December", "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

package/esm/card/components/cardButton/cardButton.d.ts

@@ -10,5 +10,6 @@ export interface ICardButton extends IZenIdComponentProps {
     onClick?: React.MouseEventHandler<HTMLButtonElement>;
     link?: string;
     target?: HTMLAttributeAnchorTarget;
+    dataAnalyticsId?: string;
 }
-export declare const CardButton: ({ children, disabled, icon, name, onClick, link, className, target: linkTarget }: ICardButton) => import("react/jsx-runtime").JSX.Element;
+export declare const CardButton: ({ children, disabled, icon, name, onClick, link, className, target: linkTarget, dataAnalyticsId }: ICardButton) => import("react/jsx-runtime").JSX.Element;

package/esm/card/components/cardButton/cardButton.js

@@ -8,12 +8,14 @@ import { IconChevronTopSmall } from "../../../icons/iconChevronTopSmall";
 import { Menu } from "../../../menu/menu";
 import { useDriveClassName } from "../../../utils/theme/useDriveClassName";
 import { useDrive } from "../../../utils/theme/useDrive";
-export const CardButton = ({ children, disabled = false, icon, name, onClick, link, className, target: linkTarget }) => {
+import { toKebabCase } from "../../../utils/toKebabCase";
+export const CardButton = ({ children, disabled = false, icon, name, onClick, link, className, target: linkTarget, dataAnalyticsId }) => {
     const [isOpen, setIsOpen] = useState(false);
     const triggerRef = useRef(null);
     const content = [];
     const cardButtonDriveClasses = useDriveClassName("zen-card-button");
     const isDrive = useDrive();
+    const analyticsId = dataAnalyticsId || toKebabCase(name);
     Children.forEach(children, (el) => {
         if (el.type === Menu.Item) {
             content.push(el);
@@ -27,9 +29,9 @@ export const CardButton = ({ children, disabled = false, icon, name, onClick, li
         }
         onClick === null || onClick === void 0 ? void 0 : onClick(...args);
     };
-    const renderLink = () => (_jsxs(Button, { disabled: disabled, type: "tertiary", link: link, target: linkTarget, title: name, className: classNames([className || "", "zen-card-button", "zen-caption", cardButtonDriveClasses || ""]), children: [icon && createElement(icon, { size: isDrive ? "huge" : "large", className: "zen-caption__pre-content" }), _jsx("span", { className: "zen-caption__content", children: name })] }));
+    const renderLink = () => (_jsxs(Button, { disabled: disabled, type: "tertiary", link: link, target: linkTarget, title: name, dataAnalyticsId: analyticsId, className: classNames([className || "", "zen-card-button", "zen-caption", cardButtonDriveClasses || ""]), children: [icon && createElement(icon, { size: isDrive ? "huge" : "large", className: "zen-caption__pre-content" }), _jsx("span", { className: "zen-caption__content", children: name })] }));
     const renderButton = () => {
-        const trigger = (_jsxs(Button, { htmlType: "button", ref: triggerRef, disabled: disabled, type: "tertiary", onClick: onButtonClickHandler, title: name, className: classNames([className || "", "zen-card-button", "zen-caption", cardButtonDriveClasses || ""]), children: [icon && createElement(icon, { size: isDrive ? "huge" : "large", className: "zen-caption__pre-content" }), _jsx("span", { className: "zen-caption__content", children: name }), !!content.length &&
+        const trigger = (_jsxs(Button, { htmlType: "button", ref: triggerRef, disabled: disabled, type: "tertiary", onClick: onButtonClickHandler, title: name, dataAnalyticsId: analyticsId, className: classNames([className || "", "zen-card-button", "zen-caption", cardButtonDriveClasses || ""]), children: [icon && createElement(icon, { size: isDrive ? "huge" : "large", className: "zen-caption__pre-content" }), _jsx("span", { className: "zen-caption__content", children: name }), !!content.length &&
                     (isOpen ? (_jsx(IconChevronTopSmall, { size: isDrive ? "huge" : "large", className: "zen-caption__post-content" })) : (_jsx(IconChevronDownSmall, { size: isDrive ? "huge" : "large", className: "zen-caption__post-content" })))] }));
         return content.length ? (_jsxs(_Fragment, { children: [trigger, _jsx(ControlledMenu, { title: name, isOpen: isOpen, setIsOpen: setIsOpen, triggerRef: triggerRef, children: content })] })) : (trigger);
     };

package/esm/card/components/title.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement, useMemo } from "react";
 import { classNames } from "../../commonHelpers/classNames/classNames";
 import { useDriveClassName } from "../../utils/theme/useDriveClassName";
@@ -11,8 +11,12 @@ export const Title = ({ isMobile, link, target, title, id, icon, iconType, class
     const iconSize = useMemo(() => (isDrive ? "huge" : "large"), [isDrive]);
     const iconElement = useMemo(() => (icon ? _jsx("div", { className: classNames(["zen-card-title__icon", iconClassName]), children: createElement(icon, { size: iconSize }) }) : null), [icon, iconSize, iconClassName]);
     const chevron = useMemo(() => (_jsx("span", { className: "zen-card-title__link-chevron", children: _jsx(IconChevronRightSmall, { size: iconSize, className: "zen-card-title__chevron-icon" }) })), [iconSize]);
-    const roleProp = onClick ? "button" : undefined;
-    const tabIndexProp = onClick ? 0 : undefined;
     const titleClasses = classNames(["zen-card-title", driveClassNames || "", onClick ? "zen-card-title__clickable" : ""]);
-    return (_jsxs("div", { className: titleClasses, role: roleProp, onClick: onClick, tabIndex: tabIndexProp, children: [iconElement, link && !onClick ? (_jsx("a", { id: id, className: classNames(["zen-card-title__link"]), href: link, target: target, children: _jsxs("span", { title: title, className: classNames(["zen-card-title__link-text"]), children: [title, chevron] }) })) : (_jsx(_Fragment, { children: _jsxs("span", { title: title, id: id, className: classNames(["zen-card-title__text", isMobile && !isDrive ? "zen-card-title__text--mobile" : "", className]), children: [title, onClick ? chevron : null] }) }))] }));
+    if (onClick) {
+        return (_jsxs("button", { type: "button", className: titleClasses, onClick: onClick, children: [iconElement, _jsxs("span", { title: title, id: id, className: classNames(["zen-card-title__text", isMobile && !isDrive ? "zen-card-title__text--mobile" : "", className]), children: [title, chevron] })] }));
+    }
+    if (link) {
+        return (_jsxs("a", { id: id, className: titleClasses, href: link, target: target, children: [iconElement, _jsxs("span", { title: title, className: classNames(["zen-card-title__link-text"]), children: [title, chevron] })] }));
+    }
+    return (_jsxs("div", { className: titleClasses, children: [iconElement, _jsx("span", { title: title, id: id, className: classNames(["zen-card-title__text", isMobile && !isDrive ? "zen-card-title__text--mobile" : "", className]), children: title })] }));
 };

package/esm/chart/barChart/getBarLegendItems.js

@@ -16,16 +16,14 @@ export const getBarLegendItems = (data, options) => {
     const legendItems = data.datasets.map((dataset, index) => {
         let value;
         if (options === null || options === void 0 ? void 0 : options.getValue) {
-            const dataValues = getDatasetValues(dataset);
-            const customValue = options.getValue(index, dataValues);
-            if (customValue !== undefined) {
+            const customValue = options.getValue(index, getDatasetValues(dataset));
+            if (customValue !== null && customValue !== undefined) {
                 const strValue = typeof customValue === "number" ? customValue.toFixed(2) : customValue;
                 value = formatValue(strValue, index, options.unit);
             }
         }
         else if (options === null || options === void 0 ? void 0 : options.unit) {
-            const sum = getDatasetSum(dataset);
-            value = formatValue(sum.toFixed(2), index, options.unit);
+            value = formatValue(getDatasetSum(dataset).toFixed(2), index, options.unit);
         }
         const originalLabel = dataset.label || "";
         const text = (options === null || options === void 0 ? void 0 : options.getLabel) ? options.getLabel(index, originalLabel) : originalLabel;

package/esm/chart/lineChart/getLineLegendItems.js

@@ -35,15 +35,15 @@ export const getLineLegendItems = (data, options) => {
         }
         let value;
         if (options === null || options === void 0 ? void 0 : options.getValue) {
-            const dataValues = getDatasetValues(dataset);
-            const customValue = options.getValue(index, dataValues);
-            if (customValue !== undefined) {
-                const strValue = typeof customValue === "number" ? customValue.toFixed(2) : customValue;
+            const customValue = options.getValue(index, getDatasetValues(dataset));
+            if (customValue !== null) {
+                const strValue = customValue !== undefined
+                    ? typeof customValue === "number"
+                        ? customValue.toFixed(2)
+                        : customValue
+                    : getLatestValue(dataset).toFixed(2);
                 value = formatValue(strValue, index, options.unit);
             }
-            else {
-                value = formatValue(getLatestValue(dataset).toFixed(2), index, options.unit);
-            }
         }
         else {
             value = formatValue(getLatestValue(dataset).toFixed(2), index, options === null || options === void 0 ? void 0 : options.unit);

package/esm/chart/pieChart/getPieLegendItems.js

@@ -8,22 +8,18 @@ export const getPieLegendItems = (data, options, isHidden) => {
     const colors = dataset.backgroundColor || [];
     const legendItems = dataset.data.map((item, index) => {
         let value;
-        if (isHidden(index)) {
-            value = undefined;
-        }
-        else if (options === null || options === void 0 ? void 0 : options.getValue) {
-            const customValue = options.getValue(index, dataset.data);
-            if (customValue !== undefined) {
-                const strValue = typeof customValue === "number" ? customValue.toFixed(2) : customValue;
-                value = formatValue(strValue, index, options.unit);
+        if (!isHidden(index)) {
+            if (options === null || options === void 0 ? void 0 : options.getValue) {
+                const customValue = options.getValue(index, dataset.data);
+                if (customValue !== null) {
+                    const strValue = customValue !== undefined ? (typeof customValue === "number" ? customValue.toFixed(2) : customValue) : item.toFixed(2);
+                    value = formatValue(strValue, index, options.unit);
+                }
             }
             else {
-                value = formatValue(item.toFixed(2), index, options.unit);
+                value = formatValue(item.toFixed(2), index, options === null || options === void 0 ? void 0 : options.unit);
             }
         }
-        else {
-            value = formatValue(item.toFixed(2), index, options === null || options === void 0 ? void 0 : options.unit);
-        }
         const originalLabel = labels[index] && typeof labels[index] === "string" ? labels[index] : "";
         const text = (options === null || options === void 0 ? void 0 : options.getLabel) ? options.getLabel(index, originalLabel) : originalLabel;
         return {

package/esm/chart/plugins/legend/interfaces.d.ts

@@ -1,6 +1,6 @@
 import { TUnit } from "../../interfaces";
 export interface ILegendOptions {
     unit?: TUnit;
-    getValue?: (datasetIndex: number, data: number[]) => string | number | undefined;
+    getValue?: (datasetIndex: number, data: number[]) => string | number | null | undefined;
     getLabel?: (datasetIndex: number, originalLabel: string) => string;
 }

package/esm/dateInputInner/dateInputInnerControlBlock.js

@@ -1,6 +1,6 @@
 import { injectString } from "../utils/localization/translationsDictionary";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { useId, useMemo } from "react";
 import { TextInputRaw } from "../textInputRaw/textInputRaw";
 import { TimePicker } from "../timePicker/timePicker";
 import { useLanguage } from "../utils/localization/useLanguage";
@@ -79,23 +79,28 @@ export const DateInputInnerControlBlock = props => {
     assistiveText,
     ref
   } = props;
+  const generatedId = useId();
+  const fieldId = id || generatedId;
   const {
     translate
   } = useLanguage();
   const driveAssistiveClass = useDriveClassName("zen-form-field__text");
   const isHasDateError = requireSelection && !dateText;
   const isHasTimeError = requireSelection && !timePickerValue;
+  const dateErrorId = `${fieldId}-date-error`;
+  const timeErrorId = `${fieldId}-time-error`;
   const memoizedDateInput = useMemo(() => _jsx(TextInputRaw, {
     className: classNames(["zen-date-input-inner__text-input", isActiveField ? "zen-date-input-inner__text-input--active" : ""]),
-    id: id,
+    id: fieldId,
     value: dateText,
     onChange: handleSetDateText,
     onBlur: onBlurDateChangeHandler,
     placeholder: placeholder,
     autocomplete: "off",
     isError: isHasDateError,
+    ariaDescribedby: isHasDateError ? dateErrorId : undefined,
     ref: ref
-  }), [dateText, handleSetDateText, id, isActiveField, isHasDateError, onBlurDateChangeHandler, placeholder, ref]);
+  }), [dateText, handleSetDateText, fieldId, isActiveField, isHasDateError, onBlurDateChangeHandler, placeholder, ref, dateErrorId]);
   const memoizedTimeSelect = useMemo(() => selectTime ? _jsxs("div", {
     className: "zen-date-input-inner__inputs-block-item",
     children: [_jsx(TimePicker, {
@@ -103,18 +108,16 @@ export const DateInputInnerControlBlock = props => {
       value: timePickerValue,
       onChange: timeChangeHandler,
       isMobileView: isMobileView,
-      fullWidth: true,
-      // eslint-disable-next-line
-      // @ts-ignore
-      dataTimeId: id
+      fullWidth: true
     }), isHasTimeError ? _jsx(FormFieldError, {
+      id: timeErrorId,
       error: translate("The time must be set")
     }) : null]
-  }) : null, [isActiveField, isHasTimeError, isMobileView, selectTime, timeChangeHandler, timePickerValue, translate, id]);
+  }) : null, [isActiveField, isHasTimeError, isMobileView, selectTime, timeChangeHandler, timePickerValue, translate, timeErrorId]);
   return _jsxs("div", {
     className: classNames(["zen-date-input-inner__control-block", className || ""]),
     children: [title ? _jsx("label", {
-      htmlFor: id,
+      htmlFor: fieldId,
       className: "zen-date-input-inner__label",
       children: title
     }) : null, _jsxs("div", {
@@ -122,6 +125,7 @@ export const DateInputInnerControlBlock = props => {
       children: [_jsxs("div", {
         className: "zen-date-input-inner__inputs-block-item",
         children: [memoizedDateInput, isHasDateError ? _jsx(FormFieldError, {
+          id: dateErrorId,
           error: translate("The date must be set")
         }) : null]
       }), memoizedTimeSelect]

package/esm/dialog/dialog.js

@@ -7,7 +7,7 @@ import { classNames } from "../commonHelpers/classNames/classNames";
 import { useBodyScroll } from "../utils/useBodyScroll";
 import { useClientReady } from "../commonHelpers/hooks/useClientReady";
 import { zen } from "../utils/zen";
-import { createPortal } from "react-dom";
+import { usePortal } from "../commonHelpers/hooks/usePortal";
 /**
  * @deprecated - use Modal instead
  */
@@ -42,9 +42,10 @@ export const Dialog = ({ isOpen, children, isElementVisible }) => {
     const labeledId = useId();
     const darkClass = dark ? "zen-dark" : "";
     const createDialog = id => (_jsxs("div", { className: classNames(["zen-dialog", darkClass]), "aria-modal": "true", role: "dialog", "aria-labelledby": labeledId, style: { top: `${zen.pageYOffset || 0}px` }, children: [_jsx(DialogContent, Object.assign({}, children.props, { labeledId: id, isElementVisible: isElementVisible })), _jsx("div", { className: "zen-dialog__shield" })] }));
+    const modalRoot = ((_b = zen.document) === null || _b === void 0 ? void 0 : _b.fullscreenElement) || ((_c = zen.document) === null || _c === void 0 ? void 0 : _c.body);
+    const portal = usePortal(isOpen && isValidElement(children) ? createDialog(labeledId) : null, modalRoot, "ModalPortal");
     if (!isClientReady) {
         return null;
     }
-    const modalRoot = ((_b = zen.document) === null || _b === void 0 ? void 0 : _b.fullscreenElement) || ((_c = zen.document) === null || _c === void 0 ? void 0 : _c.body);
-    return createPortal(isOpen && isValidElement(children) ? createDialog(labeledId) : null, modalRoot);
+    return portal;
 };

package/esm/fileUpload/fileUpload.js

@@ -204,28 +204,37 @@ export const FileUpload = ({
   const pendingFocusIndexRef = useRef(null);
   const driveClasses = useDriveClassName("zen-file-upload");
   const classes = useMemo(() => classNames(["zen-file-upload", `zen-file-upload--${size}`, isMobile ? "zen-file-upload--mobile" : "", driveClasses || "", disabled ? "zen-file-upload--disabled" : "", className !== null && className !== void 0 ? className : ""]), [size, isMobile, driveClasses, disabled, className]);
-  const hasReachedLimit = !allowMultiple && value.length > 0;
-  const isUploadDisabled = disabled || hasReachedLimit;
+  const isUploadDisabled = disabled;
   const isInteractionDisabled = isUploadDisabled || isUploading;
   const dropZoneClasses = useMemo(() => classNames(["zen-file-upload__drop-zone", `zen-file-upload__drop-zone--${size}`, isMobile ? "zen-file-upload__drop-zone--mobile" : "", isDragOver ? "zen-file-upload__drop-zone--drag-over" : "", isInteractionDisabled ? "zen-file-upload__drop-zone--disabled" : ""]), [size, isMobile, isDragOver, isInteractionDisabled]);
   const handleFilesAdded = useCallback(fileList => {
     if (!onChange) {
       return;
     }
-    const newFiles = createUploadedFiles(fileList);
-    const merged = [...value, ...newFiles];
+    let newFiles = createUploadedFiles(fileList);
+    let addedFiles = fileList;
+    // when allowMultiple is false, only take first file
+    if (!allowMultiple && newFiles.length > 1) {
+      newFiles = [newFiles[0]];
+      const firstFile = fileList[0];
+      const singleFileArray = [firstFile];
+      addedFiles = Object.assign(singleFileArray, {
+        item: index => singleFileArray[index] || null
+      });
+    }
+    const merged = allowMultiple ? [...value, ...newFiles] : newFiles;
     onChange(merged, {
       action: "add",
-      addedFiles: fileList
+      addedFiles
     });
-  }, [onChange, value]);
+  }, [onChange, value, allowMultiple]);
   const handleDragOver = useCallback(e => {
     e.preventDefault();
     e.stopPropagation();
-    if (!disabled && !isUploading && !hasReachedLimit) {
+    if (!disabled && !isUploading) {
       setIsDragOver(true);
     }
-  }, [disabled, isUploading, hasReachedLimit]);
+  }, [disabled, isUploading]);
   const handleDragLeave = useCallback(e => {
     e.preventDefault();
     e.stopPropagation();
@@ -235,7 +244,7 @@ export const FileUpload = ({
     e.preventDefault();
     e.stopPropagation();
     setIsDragOver(false);
-    if (!disabled && !isUploading && !hasReachedLimit && onChange && e.dataTransfer.files.length > 0) {
+    if (!disabled && !isUploading && onChange && e.dataTransfer.files.length > 0) {
       // DataTransfer.files becomes inaccessible after event, so preserve it
       const filesArray = Array.from(e.dataTransfer.files);
       // Create a simple FileList-like object
@@ -244,12 +253,12 @@ export const FileUpload = ({
       });
       handleFilesAdded(fileList);
     }
-  }, [disabled, isUploading, hasReachedLimit, onChange, handleFilesAdded]);
+  }, [disabled, isUploading, onChange, handleFilesAdded]);
   const handleBrowseClick = useCallback(() => {
-    if (!disabled && !isUploading && !hasReachedLimit && fileInputRef.current) {
+    if (!disabled && !isUploading && fileInputRef.current) {
       fileInputRef.current.click();
     }
-  }, [disabled, isUploading, hasReachedLimit]);
+  }, [disabled, isUploading]);
   const handleFileInputChange = useCallback(e => {
     if (e.target.files && e.target.files.length > 0 && onChange) {
       handleFilesAdded(e.target.files);

package/esm/filtersBar/filtersBarSidePanel/components/filtersBarSidePanelRange/filtersBarSidePanelRange.js

@@ -78,6 +78,7 @@ export const FiltersBarSidePanelRange = ({
 }) => {
   const generatedId = useId();
   const intId = id || generatedId;
+  const rangeErrorId = `${intId}-error`;
   const [currentValue, setCurrentValue] = useState(value);
   const [errorType, setErrorType] = useState(undefined);
   const prevValueRef = useRef(value);
@@ -152,11 +153,13 @@ export const FiltersBarSidePanelRange = ({
   return _jsxs("div", {
     ref: setFieldsContainerRef,
     id: intId,
+    "aria-describedby": errorType !== undefined && directionState === "row" ? rangeErrorId : undefined,
     className: classNames(["zen-filters-bar-side-panel-range", className || ""]),
     children: [_jsxs("div", {
       className: rangeFieldContainerClasses,
       children: [memoizedMinRangeField, memoizedMaxRangeField]
     }), errorType !== undefined && directionState === "row" ? _jsx(FormFieldError, {
+      id: rangeErrorId,
       className: "zen-filters-bar-side-panel-range__error",
       error: [getErrorString("min", currentValue.min, translate, errorType, min, max) || "", getErrorString("max", currentValue.max, translate, errorType, min, max) || ""]
     }) : null]

package/esm/formFieldError/formFieldError.d.ts

@@ -1,7 +1,8 @@
 import "./formFieldError.less";
 interface IFormFieldError {
+    id?: string;
     className?: string;
     error?: string | string[];
 }
-export declare const FormFieldError: ({ className, error }: IFormFieldError) => import("react/jsx-runtime").JSX.Element | null;
+export declare const FormFieldError: ({ id, className, error }: IFormFieldError) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/esm/formFieldError/formFieldError.js

@@ -3,11 +3,11 @@ import { classNames } from "../commonHelpers/classNames/classNames";
 import { IconException } from "../icons/iconException";
 import { useDrive } from "../utils/theme/useDrive";
 import { useDriveClassName } from "../utils/theme/useDriveClassName";
-export const FormFieldError = ({ className, error }) => {
+export const FormFieldError = ({ id, className, error }) => {
     const driveComponentClass = useDriveClassName("zen-form-field-error");
     const isDrive = useDrive();
     const errorStrings = Array.isArray(error)
         ? error.filter(el => el).map((erStr, ind) => _jsx("div", { children: erStr }, `error_str_${ind}`))
         : error && _jsx("div", { children: error });
-    return error ? (_jsxs("div", { className: classNames(["zen-form-field-error", driveComponentClass || "", className || ""]), children: [_jsx("div", { className: "zen-form-field-error__icon-container", children: _jsx(IconException, { className: "zen-form-field-error__error-icon", size: isDrive ? "large" : "bigger" }) }), _jsx("div", { className: "zen-form-field-error__error-text", children: errorStrings })] })) : null;
+    return error ? (_jsxs("span", { id: id, className: classNames(["zen-form-field-error", driveComponentClass || "", className || ""]), children: [_jsx(IconException, { className: "zen-form-field-error__error-icon", size: isDrive ? "large" : "bigger" }), _jsx("span", { className: "zen-form-field-error__error-text", children: errorStrings })] })) : null;
 };

package/esm/index.d.ts

@@ -74,8 +74,6 @@ export { useDropdownState } from "./dropdown/useDropdownState";
 export { type IEmptyState, EmptyState } from "./emptyState/emptyState";
 export { type IFavoriteButton, FavoriteButton } from "./favoriteButton/favoriteButton";
 export { FeedbackProvider } from "./feedbackProvider/feedbackProvider";
-export { TemplateDownloadSection } from "./fileUpload/components/templateDownloadSection";
-export { UploadedFilesSection } from "./fileUpload/components/uploadedFilesSection";
 export { FileUpload } from "./fileUpload/fileUpload";
 export { type IUploadedFile, type ITemplateDownload, type IFileUploadMeta, type IFileUpload } from "./fileUpload/fileUploadType";
 export { type TFilterButton, type IFilterButton, FilterButton } from "./filterButton/filterButton";

package/esm/index.js

@@ -73,8 +73,6 @@ export { useDropdownState } from "./dropdown/useDropdownState";
 export { EmptyState } from "./emptyState/emptyState";
 export { FavoriteButton } from "./favoriteButton/favoriteButton";
 export { FeedbackProvider } from "./feedbackProvider/feedbackProvider";
-export { TemplateDownloadSection } from "./fileUpload/components/templateDownloadSection";
-export { UploadedFilesSection } from "./fileUpload/components/uploadedFilesSection";
 export { FileUpload } from "./fileUpload/fileUpload";
 export { FilterButton } from "./filterButton/filterButton";
 export { FiltersChip } from "./filters/components/filtersChip";

package/esm/nav/navEditList/navEditListUtils.d.ts

@@ -1,3 +1,3 @@
 import { PointerEvent, ReactElement } from "react";
 import { INavActionItem } from "../navItem/navActionItem";
-export declare const attachDndHandler: (item: ReactElement<INavActionItem>, onPointerDown: (e: PointerEvent<HTMLElement>) => void) => ReactElement<INavActionItem, string | import("react").JSXElementConstructor<any>>;
+export declare const attachDndHandler: (item: ReactElement<INavActionItem>, onPointerDown: (e: PointerEvent<HTMLDivElement>) => void) => ReactElement<INavActionItem>;