@geotab/zenith 3.17.0-beta.1 → 3.17.0

package/esm/table/table.js

@@ -17,6 +17,7 @@ import { useTableChildren } from "./children/useTableChildren";
 import { DeviceType } from "../commonHelpers/hooks/deviceType";
 import { useMobile } from "../commonHelpers/hooks/useMobile";
 import { getCurrentPageSelection } from "./selectable/utils/getCurrentPageSelection";
+import { resolveGroupExclusions } from "./selectable/utils/groupExclusions";
 import { TableFullscreen } from "./children/tableFullscreen";
 import { TableBulkActions } from "./children/tableBulkActions";
 import { TablePagination } from "./children/tablePagination";
@@ -185,7 +186,7 @@ const TableInner = ({
   active,
   onClick
 }) => {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d, _e, _f;
   const isMobile = useMobile();
   const {
     translate
@@ -279,15 +280,15 @@ const TableInner = ({
     var _a, _b;
     return isAllSelection((_a = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _a === void 0 ? void 0 : _a.all, (_b = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _b === void 0 ? void 0 : _b.selected.length, selectable === null || selectable === void 0 ? void 0 : selectable.allowExclusions);
   }, [(_c = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _c === void 0 ? void 0 : _c.all, selectable === null || selectable === void 0 ? void 0 : selectable.allowExclusions, (_d = selectable === null || selectable === void 0 ? void 0 : selectable.selection) === null || _d === void 0 ? void 0 : _d.selected.length]);
+  const resolvedSelection = useMemo(() => resolveGroupExclusions(entities, selectable), [entities, selectable]);
   const selectionQty = useMemo(() => {
-    var _a;
     if (!selectable) {
       return 0;
     }
-    const ids = new Set((_a = selectable.selection) === null || _a === void 0 ? void 0 : _a.selected);
+    const ids = new Set(resolvedSelection === null || resolvedSelection === void 0 ? void 0 : resolvedSelection.selected);
     const base = entities.length > 0 ? entities : loadingEntities;
     return allSelected ? [...getCurrentPageSelection(base, selectable)].filter(id => !selectable.allowExclusions || !ids.has(id)).length : ids.size;
-  }, [selectable, entities, loadingEntities, allSelected]);
+  }, [selectable, resolvedSelection, entities, loadingEntities, allSelected]);
   const clearSelection = useCallback(() => {
     setSelectMode(false);
     selectable === null || selectable === void 0 ? void 0 : selectable.onSelect({
@@ -313,7 +314,7 @@ const TableInner = ({
     detailPanel,
     footer,
     other
-  } = useTableChildren(children, isMobile, selectionQty, allSelected, clearSelection, activeId, gridRef, onCloseDetailPanel, isInfinite, entities.length, (selectable === null || selectable === void 0 ? void 0 : selectable.allowExclusions) && ((_e = selectable.selection) === null || _e === void 0 ? void 0 : _e.all) ? new Set(selectable.selection.selected).size : 0, (selectable === null || selectable === void 0 ? void 0 : selectable.strategy) !== "nested" && !(selectable === null || selectable === void 0 ? void 0 : selectable.checkboxDisabled) && !(selectable === null || selectable === void 0 ? void 0 : selectable.checkboxVisible), !!feedEndCallback || !!isLoading);
+  } = useTableChildren(children, isMobile, selectionQty, allSelected, clearSelection, activeId, gridRef, onCloseDetailPanel, isInfinite, entities.length, (selectable === null || selectable === void 0 ? void 0 : selectable.allowExclusions) && (resolvedSelection === null || resolvedSelection === void 0 ? void 0 : resolvedSelection.all) ? new Set(resolvedSelection.selected).size + ((_f = (_e = resolvedSelection.excludedGroupIds) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0) : 0, (selectable === null || selectable === void 0 ? void 0 : selectable.strategy) !== "nested" && !(selectable === null || selectable === void 0 ? void 0 : selectable.checkboxDisabled) && !(selectable === null || selectable === void 0 ? void 0 : selectable.checkboxVisible), !!feedEndCallback || !!isLoading);
   const hasDetailPanel = !!detailPanel;
   const shouldEnableRowClick = hasDetailPanel || !!onClick;
   const activeIdForRow = shouldEnableRowClick ? activeId : undefined;

package/esm/tooltip/tooltip.d.ts

@@ -5,11 +5,13 @@ import { TAlignment } from "../absolute/absolute";
 import { IInlineTrigger } from "./components/inlineTrigger";
 export type TooltipSize = "large" | "small" | "auto";
 export type TMobileView = "default" | "mobileSheet";
+interface ITriggerDisabledProps {
+    disabled?: boolean;
+    "aria-disabled"?: boolean | "true" | "false";
+}
 interface ITooltip extends IZenComponentProps {
-    trigger?: ReactElement<PropsWithChildren & {
+    trigger?: ReactElement<PropsWithChildren & ITriggerDisabledProps & {
         onClick?: (e: React.MouseEvent) => void;
-        disabled?: boolean;
-        focusableWhenDisabled?: boolean;
     }>;
     alignment?: TAlignment;
     triggerClassName?: string;

package/esm/tooltip/tooltip.js

@@ -110,12 +110,14 @@ const getInitialDeviceType = () => {
   }
   return DeviceType.Desktop;
 };
+// A disabled trigger (native `disabled`, or `aria-disabled` when it must stay focusable) never runs its own
+// `onClick`, so the tooltip has to react to the click capture phase instead.
+const isTriggerDisabled = props => Boolean(props === null || props === void 0 ? void 0 : props.disabled) || (props === null || props === void 0 ? void 0 : props["aria-disabled"]) === true || (props === null || props === void 0 ? void 0 : props["aria-disabled"]) === "true";
 const EventWrapper = ({
   children,
   deviceType,
   onKeyDownHandler,
   handleUniversalClick,
-  isTriggerDisabledFocusable,
   setTooltipVisible,
   timerRef,
   timerMouseLeaveRef,
@@ -124,8 +126,9 @@ const EventWrapper = ({
   const isCurrentDeviceDesktop = deviceType === DeviceType.Desktop;
   const triggerProps = children.props;
   const originalOnClick = triggerProps.onClick;
-  // A disabled-focusable trigger's own `onClick` is a no-op guard, so `composedOnClick` never runs on
-  // mobile — see the `onClickCapture` handling in `mobileEvents` below.
+  // A disabled trigger doesn't run its own `onClick`, so on mobile the tap is handled in the capture phase
+  // instead — see `mobileEvents` below.
+  const isDisabledTrigger = isTriggerDisabled(triggerProps);
   const composedOnClick = useCallback(e => {
     // Call original onClick first if it exists
     if (originalOnClick) {
@@ -164,7 +167,7 @@ const EventWrapper = ({
   }, [handleUniversalClick]);
   const mobileEvents = Object.assign({
     onKeyDown: mobileOnKeyDown
-  }, isTriggerDisabledFocusable ? {
+  }, isDisabledTrigger ? {
     onClickCapture: handleUniversalClick
   } : {
     onClick: composedOnClick
@@ -199,7 +202,7 @@ export const Tooltip = ({
   const [deviceType, setDeviceType] = useState(getInitialDeviceType);
   const isMobile = deviceType === DeviceType.Mobile;
   const triggerProps = trigger === null || trigger === void 0 ? void 0 : trigger.props;
-  const isTriggerDisabledFocusable = Boolean(triggerProps === null || triggerProps === void 0 ? void 0 : triggerProps.disabled) && (triggerProps === null || triggerProps === void 0 ? void 0 : triggerProps.focusableWhenDisabled) !== false;
+  const isDisabledTrigger = isTriggerDisabled(triggerProps);
   const tooltipId = useId();
   const {
     translate
@@ -230,7 +233,7 @@ export const Tooltip = ({
     }
   };
   const handleUniversalClick = useCallback(e => {
-    const hasExternalClickHandler = !!(triggerProps === null || triggerProps === void 0 ? void 0 : triggerProps.onClick) && !isTriggerDisabledFocusable;
+    const hasExternalClickHandler = !!(triggerProps === null || triggerProps === void 0 ? void 0 : triggerProps.onClick) && !isDisabledTrigger;
     if (deviceType === DeviceType.Desktop) {
       setTooltipVisible(currentVisible => {
         if (currentVisible) {
@@ -239,14 +242,14 @@ export const Tooltip = ({
         return currentVisible;
       });
     } else {
-      if (!isTriggerDisabledFocusable) {
+      if (!isDisabledTrigger) {
         e === null || e === void 0 ? void 0 : e.stopPropagation();
       }
       if (!hasExternalClickHandler) {
         setTooltipVisible(isVisible => !isVisible);
       }
     }
-  }, [deviceType, isTriggerDisabledFocusable, triggerProps]);
+  }, [deviceType, isDisabledTrigger, triggerProps]);
   // Apply `triggerAriaLabel` to a `Tooltip.InlineTrigger` trigger (it has no `ariaLabel` prop
   // of its own); the default info-icon trigger below handles `triggerAriaLabel` separately.
   // An `aria-label` set directly on the `Tooltip.InlineTrigger` element takes priority over
@@ -273,7 +276,6 @@ export const Tooltip = ({
     isTooltipVisible: isTooltipVisible,
     onKeyDownHandler: onKeyDownHandler,
     handleUniversalClick: handleUniversalClick,
-    isTriggerDisabledFocusable: isTriggerDisabledFocusable,
     setTooltipVisible: setTooltipVisible,
     timerRef: timerRef,
     timerMouseLeaveRef: timerMouseLeaveRef,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@geotab/zenith",
-    "version": "3.17.0-beta.1",
+    "version": "3.17.0",
     "description": "Zenith components library on React",
     "main": "dist/index.js",
     "types": "esm/index.d.ts",

package/README.md.baseline

@@ -1 +0,0 @@
-ac687d695edcc0c6ffdc6c27e69c5729e7b02d180623c4f81049d72111f97d0d