@jobber/components 6.103.4-uncontroll-3a6b89f.8 → 6.103.5

package/dist/MultiSelect-es.js

@@ -10,7 +10,7 @@ var styles = {"dropDownMenuContainer":"zossMHCpMPU-","option":"poS49c-LqiU-","ac
 
 function DropDownMenu({ options, setOptions }) {
     const [highlightedIndex, setHighlightedIndex] = useState(0);
-    const menuDiv = useRef();
+    const menuDiv = useRef(null);
     const handleOptionClick = useCallback((clickedOption) => {
         setOptions(current => current.map(option => {
             if (option.label == clickedOption.label) {
@@ -85,13 +85,17 @@ function DropDownMenu({ options, setOptions }) {
         event.preventDefault();
         const newIndex = Math.max(0, highlightedIndex - 1);
         handleOptionFocus(newIndex);
-        scrollMenuIfItemNotInView(menuDiv.current, "up");
+        if (menuDiv.current) {
+            scrollMenuIfItemNotInView(menuDiv.current, "up");
+        }
     }
     function handlePressDown(event) {
         event.preventDefault();
         const newIndex = Math.min(options.length - 1, highlightedIndex + 1);
         handleOptionFocus(newIndex);
-        scrollMenuIfItemNotInView(menuDiv.current, "down");
+        if (menuDiv.current) {
+            scrollMenuIfItemNotInView(menuDiv.current, "down");
+        }
     }
 }
 
@@ -99,15 +103,16 @@ function MultiSelect({ defaultLabel, allSelectedLabel, options, onOptionsChange,
     const [label, setLabel] = useState(defaultLabel);
     const [menuVisible, setMenuVisible] = useState(false);
     const [focused, setFocused] = useState(false);
-    const multiSelectContainer = useRef();
-    const multiSelectRef = useRef();
+    const multiSelectContainer = useRef(null);
+    const multiSelectRef = useRef(null);
     const multiSelectClass = classnames(styles$1.multiSelect, {
         [styles$1.active]: menuVisible,
         [styles$1.large]: size === "large",
         [styles$1.small]: size === "small",
     });
     function handleMenuVisibility() {
-        multiSelectRef.current.focus();
+        var _a;
+        (_a = multiSelectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         setMenuVisible(!menuVisible);
     }
     const handleClickOutside = (e) => {
@@ -117,6 +122,7 @@ function MultiSelect({ defaultLabel, allSelectedLabel, options, onOptionsChange,
         }
     };
     function handleKeydown(event) {
+        var _a;
         const { key, metaKey, ctrlKey } = event;
         if (metaKey || ctrlKey)
             return;
@@ -129,7 +135,7 @@ function MultiSelect({ defaultLabel, allSelectedLabel, options, onOptionsChange,
                 break;
             }
             case "Escape": {
-                multiSelectRef.current.focus();
+                (_a = multiSelectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
                 setMenuVisible(false);
                 break;
             }

package/dist/RadioGroup-cjs.js

@@ -31,7 +31,13 @@ function RadioGroup({ children, value, ariaLabel, onChange, name = React.useId()
     const className = classnames(styles.radioGroup, {
         [styles.directionHorizontal]: direction === "horizontal",
     });
-    return (React.createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: className }, React.Children.map(children, option => (React.createElement(InternalRadioOption, Object.assign({ checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
+    return (React.createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: className }, React.Children.map(children, option => (
+    // @ts-expect-error - TODO: it thinks value is missing, but it's probably coming from option.props
+    React.createElement(InternalRadioOption
+    // @ts-expect-error - TODO: fix option.props type is unknown
+    , Object.assign({ 
+        // @ts-expect-error - TODO: fix option.props type is unknown
+        checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
     function handleChange(newValue) {
         if (newValue !== value) {
             onChange(newValue);

package/dist/RadioGroup-es.js

@@ -29,7 +29,13 @@ function RadioGroup({ children, value, ariaLabel, onChange, name = useId(), dire
     const className = classnames(styles.radioGroup, {
         [styles.directionHorizontal]: direction === "horizontal",
     });
-    return (React__default.createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: className }, React__default.Children.map(children, option => (React__default.createElement(InternalRadioOption, Object.assign({ checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
+    return (React__default.createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: className }, React__default.Children.map(children, option => (
+    // @ts-expect-error - TODO: it thinks value is missing, but it's probably coming from option.props
+    React__default.createElement(InternalRadioOption
+    // @ts-expect-error - TODO: fix option.props type is unknown
+    , Object.assign({ 
+        // @ts-expect-error - TODO: fix option.props type is unknown
+        checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
     function handleChange(newValue) {
         if (newValue !== value) {
             onChange(newValue);

package/dist/StatusLabel/StatusLabel.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 import type { StatusIndicatorType } from "../StatusIndicator/StatusIndicator.type";
 export interface StatusLabelType {
     readonly statusLabel: string;
@@ -21,5 +22,5 @@ interface StatusLabelProps {
      */
     readonly status: StatusIndicatorType;
 }
-export declare function StatusLabel({ label, alignment, status, }: StatusLabelProps): JSX.Element;
+export declare function StatusLabel({ label, alignment, status, }: StatusLabelProps): React.JSX.Element;
 export {};

package/dist/Tabs/hooks/useTabsOverflow.d.ts

@@ -1,8 +1,8 @@
-import type { MutableRefObject } from "react";
+import type { RefObject } from "react";
 interface UseTabsOverflow {
     overflowRight: boolean;
     overflowLeft: boolean;
-    tabRow: MutableRefObject<HTMLUListElement>;
+    tabRow: RefObject<HTMLUListElement | null>;
 }
 export declare function useTabsOverflow(): UseTabsOverflow;
 export {};

package/dist/Tabs-cjs.js

@@ -84,7 +84,7 @@ var throttle$1 = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(throttle_
 function useTabsOverflow() {
     const [overflowRight, setOverflowRight] = React.useState(false);
     const [overflowLeft, setOverflowLeft] = React.useState(false);
-    const tabRow = React.useRef();
+    const tabRow = React.useRef(null);
     const handleOverflowing = () => {
         if (tabRow.current) {
             const scrollWidth = tabRow.current.scrollWidth;
@@ -187,7 +187,9 @@ function Tabs({ children, defaultTab = 0, activeTab: controlledActiveTab, onTabC
                 if (!isChildTab(child)) {
                     return child;
                 }
-                const index = tabChildren.findIndex(tab => tab.props.label === child.props.label);
+                const index = tabChildren.findIndex(
+                // @ts-expect-error - TODO: fix tab.props type is unknown
+                tab => tab.props.label === child.props.label);
                 return (React.createElement(InternalTab, { label: child.props.label, selected: activeTab === index, activateTab: activateTab(index), onClick: child.props.onClick, ref: el => {
                         if (el) {
                             tabRefs.current.set(index, el);

package/dist/Tabs-es.js

@@ -82,7 +82,7 @@ var throttle$1 = /*@__PURE__*/getDefaultExportFromCjs(throttle_1);
 function useTabsOverflow() {
     const [overflowRight, setOverflowRight] = useState(false);
     const [overflowLeft, setOverflowLeft] = useState(false);
-    const tabRow = useRef();
+    const tabRow = useRef(null);
     const handleOverflowing = () => {
         if (tabRow.current) {
             const scrollWidth = tabRow.current.scrollWidth;
@@ -185,7 +185,9 @@ function Tabs({ children, defaultTab = 0, activeTab: controlledActiveTab, onTabC
                 if (!isChildTab(child)) {
                     return child;
                 }
-                const index = tabChildren.findIndex(tab => tab.props.label === child.props.label);
+                const index = tabChildren.findIndex(
+                // @ts-expect-error - TODO: fix tab.props type is unknown
+                tab => tab.props.label === child.props.label);
                 return (React__default.createElement(InternalTab, { label: child.props.label, selected: activeTab === index, activateTab: activateTab(index), onClick: child.props.onClick, ref: el => {
                         if (el) {
                             tabRefs.current.set(index, el);

package/dist/Tooltip/useTooltipPositioning.d.ts

@@ -11,7 +11,7 @@ export declare function useTooltipPositioning({ preferredPlacement, }: ToolTipPo
         }) | undefined;
     };
     placement: import("@floating-ui/utils").Placement;
-    shadowRef: import("react").RefObject<HTMLSpanElement>;
+    shadowRef: import("react").RefObject<HTMLSpanElement | null>;
     setArrowRef: import("react").Dispatch<import("react").SetStateAction<HTMLDivElement | null | undefined>>;
     setTooltipRef: ((node: HTMLElement | null) => void) & ((node: HTMLElement | null) => void);
 };

package/dist/helpers-cjs.js

@@ -23,6 +23,7 @@ var jobberHooks__namespace = /*#__PURE__*/_interopNamespaceDefault(jobberHooks);
 
 const mockContainerWidth = (exactWidth) => {
     jest.spyOn(jobberHooks__namespace, "useResizeObserver").mockReturnValue([
+        // @ts-expect-error - TODO: fix this mock ref value
         { current: null },
         {
             width: 1200,

package/dist/helpers-es.js

@@ -2,6 +2,7 @@ import * as jobberHooks from '@jobber/hooks';
 
 const mockContainerWidth = (exactWidth) => {
     jest.spyOn(jobberHooks, "useResizeObserver").mockReturnValue([
+        // @ts-expect-error - TODO: fix this mock ref value
         { current: null },
         {
             width: 1200,

package/dist/index.cjs

@@ -219,7 +219,7 @@ exports.Cluster = Cluster.Cluster;
 exports.Container = Container.Container;
 exports.Cover = Cover.Cover;
 exports.Checkbox = Checkbox_index.Checkbox;
-exports.Chip = Chip.ChipNamespace;
+exports.Chip = Chip.Chip;
 exports.ChipDismissible = ChipDismissible.ChipDismissible;
 exports.ChipSelectable = ChipDismissible.ChipSelectable;
 exports.Icon = Icon.Icon;

package/dist/showToast-cjs.js

@@ -84,8 +84,8 @@ function showToast(props) {
 }
 const ToastContainer = React.forwardRef(ToastInternal);
 function ToasterOven(props) {
-    const toastRef = React.useRef();
-    React.useEffect(() => toastRef.current.add(props));
+    const toastRef = React.useRef(null);
+    React.useEffect(() => { var _a; return (_a = toastRef.current) === null || _a === void 0 ? void 0 : _a.add(props); });
     return React.createElement(ToastContainer, { ref: toastRef });
 }
 function ToastInternal(_, ref) {

package/dist/showToast-es.js

@@ -82,8 +82,8 @@ function showToast(props) {
 }
 const ToastContainer = forwardRef(ToastInternal);
 function ToasterOven(props) {
-    const toastRef = useRef();
-    useEffect(() => toastRef.current.add(props));
+    const toastRef = useRef(null);
+    useEffect(() => { var _a; return (_a = toastRef.current) === null || _a === void 0 ? void 0 : _a.add(props); });
     return React__default.createElement(ToastContainer, { ref: toastRef });
 }
 function ToastInternal(_, ref) {

package/dist/useChildComponent-cjs.js

@@ -5,7 +5,7 @@ var React = require('react');
 /**
  * Returns the first React Child that receives `true` from isCorrectComponent
  * @param children React Children
- * @param isCorrectComponent a function that accepts a JSX Element and returns a boolean.
+ * @param isCorrectComponent a function that accepts a ReactElement and returns a boolean.
  * @returns The first child component that returns true on isCorrectComponent
  */
 function useChildComponent(children, isCorrectComponent) {

package/dist/useChildComponent-es.js

@@ -3,7 +3,7 @@ import React__default, { useMemo, isValidElement } from 'react';
 /**
  * Returns the first React Child that receives `true` from isCorrectComponent
  * @param children React Children
- * @param isCorrectComponent a function that accepts a JSX Element and returns a boolean.
+ * @param isCorrectComponent a function that accepts a ReactElement and returns a boolean.
  * @returns The first child component that returns true on isCorrectComponent
  */
 function useChildComponent(children, isCorrectComponent) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "6.103.4-uncontroll-3a6b89f.8+3a6b89f05",
+  "version": "6.103.5",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -538,5 +538,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "3a6b89f051c7bf248c95263b514cd02722010dd7"
+  "gitHead": "4b120bbb1789aa1b6b9a8eaf157be90d4ea15efc"
 }