@jobber/components 6.111.0 → 6.111.2

package/dist/Autocomplete/index.cjs

@@ -197,6 +197,7 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
             return prev >= navigableCount ? navigableCount - 1 : prev;
         });
     }, [navigableCount, setActiveIndex, listRef]);
+    const setReferenceElement = React.useCallback((el) => refs.setReference(el), [refs]);
     return {
         refs,
         floatingStyles,
@@ -209,7 +210,7 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
         listRef,
         open,
         setOpen,
-        setReferenceElement: (el) => refs.setReference(el),
+        setReferenceElement,
     };
 }
 
@@ -968,7 +969,7 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
         disabled, readOnly: props.readOnly, error: error !== null && error !== void 0 ? error : undefined, name: props.name, invalid, autoComplete: "off", autoFocus: props.autoFocus, description, size: sizeProp ? sizeProp : undefined, prefix: props.prefix, suffix: props.suffix }), (props.readOnly ? {} : composedReferenceProps)), { role: "combobox", "aria-autocomplete": "list", "aria-expanded": open ? true : false, "aria-controls": listboxId, "aria-activedescendant": open && activeIndex != null
             ? `${listboxId}-item-${activeIndex}`
             : undefined }), dataAttrs);
-    const referenceInputRef = (node) => {
+    const referenceInputRef = React.useCallback((node) => {
         setReferenceElement(node);
         // Workaround to get the width of the visual InputText element, which is not the same as
         // the literal input reference element when props like suffix/prefix/clearable are present.
@@ -977,11 +978,11 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
             setMenuWidth(visualInputTextElement.clientWidth);
             setPositionRefEl(visualInputTextElement);
         }
-    };
-    const mergedInputRef = FormField.mergeRefs([
+    }, [setReferenceElement]);
+    const mergedInputRef = React.useMemo(() => FormField.mergeRefs([
         referenceInputRef,
         forwardedRef,
-    ]);
+    ]), [referenceInputRef, forwardedRef]);
     React.useEffect(() => {
         if (!positionRefEl)
             return;

package/dist/Autocomplete/index.mjs

@@ -195,6 +195,7 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
             return prev >= navigableCount ? navigableCount - 1 : prev;
         });
     }, [navigableCount, setActiveIndex, listRef]);
+    const setReferenceElement = useCallback((el) => refs.setReference(el), [refs]);
     return {
         refs,
         floatingStyles,
@@ -207,7 +208,7 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
         listRef,
         open,
         setOpen,
-        setReferenceElement: (el) => refs.setReference(el),
+        setReferenceElement,
     };
 }
 
@@ -966,7 +967,7 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
         disabled, readOnly: props.readOnly, error: error !== null && error !== void 0 ? error : undefined, name: props.name, invalid, autoComplete: "off", autoFocus: props.autoFocus, description, size: sizeProp ? sizeProp : undefined, prefix: props.prefix, suffix: props.suffix }), (props.readOnly ? {} : composedReferenceProps)), { role: "combobox", "aria-autocomplete": "list", "aria-expanded": open ? true : false, "aria-controls": listboxId, "aria-activedescendant": open && activeIndex != null
             ? `${listboxId}-item-${activeIndex}`
             : undefined }), dataAttrs);
-    const referenceInputRef = (node) => {
+    const referenceInputRef = useCallback((node) => {
         setReferenceElement(node);
         // Workaround to get the width of the visual InputText element, which is not the same as
         // the literal input reference element when props like suffix/prefix/clearable are present.
@@ -975,11 +976,11 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
             setMenuWidth(visualInputTextElement.clientWidth);
             setPositionRefEl(visualInputTextElement);
         }
-    };
-    const mergedInputRef = mergeRefs([
+    }, [setReferenceElement]);
+    const mergedInputRef = useMemo(() => mergeRefs([
         referenceInputRef,
         forwardedRef,
-    ]);
+    ]), [referenceInputRef, forwardedRef]);
     useEffect(() => {
         if (!positionRefEl)
             return;

package/dist/DataTableTable-cjs.js

@@ -39,7 +39,7 @@ function SortIcon({ direction }) {
             React.createElement("path", { className: finalStyle.downArrowStyle, d: "M8.29292 13.3339C8.68345 12.9434 9.31661 12.9434 9.70714 13.3339L12.2968 15.8573L14.8787 13.3339C15.2692 12.9434 15.9024 12.9434 16.2929 13.3339C16.6834 13.7244 16.6834 14.3576 16.2929 14.7481L13 18.041C12.6095 18.4315 11.9763 18.4315 11.5858 18.041L8.29292 14.7481C7.9024 14.3576 7.9024 13.7244 8.29292 13.3339Z" }))));
 }
 
-var styles = {"container":"_1-DPmbxOkZ8-","tableElement":"kJeYcsgg700-","header":"_5d2OcsTVgzU-","headerCell":"LTx0tCU3F2I-","sortableButton":"WTQCrd2d8nw-","focusArea":"RipbH3rRU-E-","row":"sJQbtw-NEHU-","cell":"_1UpLYTK64uY-","footer":"qe-6UrAFLTo-","actions":"_2fZsLSaNPnI-","rowActions":"pElxuwpGmCI-","pagination":"thJ-CSoe0ps-","spinning":"EBpmC7cZzCs-"};
+var styles = {"container":"_1-DPmbxOkZ8-","tableElement":"kJeYcsgg700-","header":"_5d2OcsTVgzU-","headerCell":"LTx0tCU3F2I-","sortableButton":"WTQCrd2d8nw-","focusArea":"RipbH3rRU-E-","row":"sJQbtw-NEHU-","clickableRow":"J2p1EeT252A-","cell":"_1UpLYTK64uY-","footer":"qe-6UrAFLTo-","actions":"_2fZsLSaNPnI-","rowActions":"pElxuwpGmCI-","pagination":"thJ-CSoe0ps-","spinning":"EBpmC7cZzCs-"};
 
 function DataTableActions(props) {
     return (React.createElement("div", Object.assign({}, props, { className: classnames(styles.actions, props.className) }), props.children));
@@ -83,8 +83,9 @@ function DataTablePaginationButton({ direction, onClick, disabled = false, ariaL
     return (React.createElement(Button.Button, { label: "", onClick: onClick, icon: isNext ? "arrowRight" : "arrowLeft", type: "secondary", variation: "learning", disabled: disabled, ariaLabel: ariaLabel(direction) }));
 }
 
-const DataTableRow = React.forwardRef((props, ref) => {
-    return (React.createElement("tr", Object.assign({}, props, { className: classnames(styles.row, props.className), ref: ref }), props.children));
+const DataTableRow = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = tslib_es6.__rest(_a, ["className"]);
+    return (React.createElement("tr", Object.assign({}, props, { className: classnames(styles.row, props.onClick && styles.clickableRow, className), ref: ref }), props.children));
 });
 DataTableRow.displayName = "DataTableRow";
 

package/dist/DataTableTable-es.js

@@ -37,7 +37,7 @@ function SortIcon({ direction }) {
             React__default.createElement("path", { className: finalStyle.downArrowStyle, d: "M8.29292 13.3339C8.68345 12.9434 9.31661 12.9434 9.70714 13.3339L12.2968 15.8573L14.8787 13.3339C15.2692 12.9434 15.9024 12.9434 16.2929 13.3339C16.6834 13.7244 16.6834 14.3576 16.2929 14.7481L13 18.041C12.6095 18.4315 11.9763 18.4315 11.5858 18.041L8.29292 14.7481C7.9024 14.3576 7.9024 13.7244 8.29292 13.3339Z" }))));
 }
 
-var styles = {"container":"_1-DPmbxOkZ8-","tableElement":"kJeYcsgg700-","header":"_5d2OcsTVgzU-","headerCell":"LTx0tCU3F2I-","sortableButton":"WTQCrd2d8nw-","focusArea":"RipbH3rRU-E-","row":"sJQbtw-NEHU-","cell":"_1UpLYTK64uY-","footer":"qe-6UrAFLTo-","actions":"_2fZsLSaNPnI-","rowActions":"pElxuwpGmCI-","pagination":"thJ-CSoe0ps-","spinning":"EBpmC7cZzCs-"};
+var styles = {"container":"_1-DPmbxOkZ8-","tableElement":"kJeYcsgg700-","header":"_5d2OcsTVgzU-","headerCell":"LTx0tCU3F2I-","sortableButton":"WTQCrd2d8nw-","focusArea":"RipbH3rRU-E-","row":"sJQbtw-NEHU-","clickableRow":"J2p1EeT252A-","cell":"_1UpLYTK64uY-","footer":"qe-6UrAFLTo-","actions":"_2fZsLSaNPnI-","rowActions":"pElxuwpGmCI-","pagination":"thJ-CSoe0ps-","spinning":"EBpmC7cZzCs-"};
 
 function DataTableActions(props) {
     return (React__default.createElement("div", Object.assign({}, props, { className: classnames(styles.actions, props.className) }), props.children));
@@ -81,8 +81,9 @@ function DataTablePaginationButton({ direction, onClick, disabled = false, ariaL
     return (React__default.createElement(Button, { label: "", onClick: onClick, icon: isNext ? "arrowRight" : "arrowLeft", type: "secondary", variation: "learning", disabled: disabled, ariaLabel: ariaLabel(direction) }));
 }
 
-const DataTableRow = forwardRef((props, ref) => {
-    return (React__default.createElement("tr", Object.assign({}, props, { className: classnames(styles.row, props.className), ref: ref }), props.children));
+const DataTableRow = forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (React__default.createElement("tr", Object.assign({}, props, { className: classnames(styles.row, props.onClick && styles.clickableRow, className), ref: ref }), props.children));
 });
 DataTableRow.displayName = "DataTableRow";
 

package/dist/styles.css

@@ -6702,7 +6702,11 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
   position: relative;
 }
 
-.sJQbtw-NEHU-:hover {
+.sJQbtw-NEHU-.J2p1EeT252A- {
+  cursor: pointer;
+}
+
+.kJeYcsgg700- tbody tr.sJQbtw-NEHU-.J2p1EeT252A-:hover {
   background-color: hsl(53, 21%, 93%);
   background-color: var(--color-surface--hover);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "6.111.0",
+  "version": "6.111.2",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -538,5 +538,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "2ead4b3048867c3ba81d72a130480f5a79e1c521"
+  "gitHead": "1baaa9f24017f50d12130e779b621a7c971723ef"
 }