@jobber/components 6.103.2-JOB-141426-1b49367.0 → 6.103.2

package/dist/Autocomplete/index.cjs

@@ -225,7 +225,6 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
 // eslint-disable-next-line max-statements
 function useAutocomplete(props) {
     const { menu, emptyActions, getOptionLabel: getOptionLabelProp, isOptionEqualToValue, inputValue, onInputChange, value, onChange, multiple, openOnFocus = true, readOnly = false, debounce: debounceMs = 300, } = props;
-    const isClickingWithinRef = React.useRef(false);
     // TODO: Clean up the types in these refs by enhancing the type system in useCallbackRef
     const getOptionLabelPropRef = jobberHooks.useCallbackRef((opt) => getOptionLabelProp === null || getOptionLabelProp === void 0 ? void 0 : getOptionLabelProp(opt));
     const getOptionLabel = React.useCallback((opt) => {
@@ -521,9 +520,6 @@ function useAutocomplete(props) {
     const onInputBlur = React.useCallback(() => {
         var _a, _b;
         setInputFocused(false);
-        if (isClickingWithinRef.current) {
-            return;
-        }
         if (readOnly) {
             (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props);
             return;
@@ -670,7 +666,6 @@ function useAutocomplete(props) {
         activeIndex,
         setActiveIndex,
         listRef,
-        isClickingWithinRef,
         // actions
         onSelection,
         onAction,
@@ -909,7 +904,7 @@ const AutocompleteRebuilt = React.forwardRef(AutocompleteRebuiltInternal);
 function AutocompleteRebuiltInternal(props, forwardedRef) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     const { inputValue, placeholder, disabled, error, invalid, description, size: sizeProp, loading = false, } = props;
-    const { renderable, optionCount, persistentsHeaders, persistentsFooters, headerInteractiveCount, middleNavigableCount, getOptionLabel, isOptionSelected, refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps, activeIndex, open, listRef, isClickingWithinRef, onSelection, onAction, onInputChangeFromUser, onInputBlur, onInputFocus, onInputKeyDown, setReferenceElement, } = useAutocomplete(props);
+    const { renderable, optionCount, persistentsHeaders, persistentsFooters, headerInteractiveCount, middleNavigableCount, getOptionLabel, isOptionSelected, refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps, activeIndex, open, listRef, onSelection, onAction, onInputChangeFromUser, onInputBlur, onInputFocus, onInputKeyDown, setReferenceElement, } = useAutocomplete(props);
     const listboxId = React.useId();
     // Provides mount/unmount-aware transition styles for the floating element
     const { isMounted, styles: transitionStyles } = floatingUi_react.useTransitionStyles(context, {
@@ -967,11 +962,7 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
                     style: Object.assign(Object.assign(Object.assign(Object.assign({}, floatingStyles), transitionStyles), (_b = props.UNSAFE_styles) === null || _b === void 0 ? void 0 : _b.menu), (menuWidth
                         ? { width: menuWidth, maxWidth: menuWidth }
                         : {})),
-                }), { onPointerDown: () => {
-                        isClickingWithinRef.current = true;
-                    }, onPointerUp: () => {
-                        isClickingWithinRef.current = false;
-                    } }),
+                })),
                     React.createElement(PersistentRegion, { items: persistentsHeaders, position: "header", activeIndex: activeIndex, indexOffset: 0, listboxId: listboxId, getItemProps: getItemProps, listRef: listRef, customRenderHeader: props.customRenderHeader, customRenderFooter: props.customRenderFooter, onAction: onAction, className: classnames(styles$1.persistentHeader, (_c = props.UNSAFE_className) === null || _c === void 0 ? void 0 : _c.header), style: (_d = props.UNSAFE_styles) === null || _d === void 0 ? void 0 : _d.header }),
                     React.createElement("div", { className: styles$1.scrollRegion }, loading ? ((_e = props.customRenderLoading) !== null && _e !== void 0 ? _e : React.createElement(LoadingContent, null)) : (React.createElement(React.Fragment, null,
                         showEmptyStateMessage && (React.createElement(EmptyStateMessage, { emptyState: props.emptyStateMessage })),

package/dist/Autocomplete/index.mjs

@@ -223,7 +223,6 @@ function useAutocompleteListNav({ navigableCount, shouldResetActiveIndexOnClose,
 // eslint-disable-next-line max-statements
 function useAutocomplete(props) {
     const { menu, emptyActions, getOptionLabel: getOptionLabelProp, isOptionEqualToValue, inputValue, onInputChange, value, onChange, multiple, openOnFocus = true, readOnly = false, debounce: debounceMs = 300, } = props;
-    const isClickingWithinRef = useRef(false);
     // TODO: Clean up the types in these refs by enhancing the type system in useCallbackRef
     const getOptionLabelPropRef = useCallbackRef((opt) => getOptionLabelProp === null || getOptionLabelProp === void 0 ? void 0 : getOptionLabelProp(opt));
     const getOptionLabel = useCallback((opt) => {
@@ -519,9 +518,6 @@ function useAutocomplete(props) {
     const onInputBlur = useCallback(() => {
         var _a, _b;
         setInputFocused(false);
-        if (isClickingWithinRef.current) {
-            return;
-        }
         if (readOnly) {
             (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props);
             return;
@@ -668,7 +664,6 @@ function useAutocomplete(props) {
         activeIndex,
         setActiveIndex,
         listRef,
-        isClickingWithinRef,
         // actions
         onSelection,
         onAction,
@@ -907,7 +902,7 @@ const AutocompleteRebuilt = forwardRef(AutocompleteRebuiltInternal);
 function AutocompleteRebuiltInternal(props, forwardedRef) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     const { inputValue, placeholder, disabled, error, invalid, description, size: sizeProp, loading = false, } = props;
-    const { renderable, optionCount, persistentsHeaders, persistentsFooters, headerInteractiveCount, middleNavigableCount, getOptionLabel, isOptionSelected, refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps, activeIndex, open, listRef, isClickingWithinRef, onSelection, onAction, onInputChangeFromUser, onInputBlur, onInputFocus, onInputKeyDown, setReferenceElement, } = useAutocomplete(props);
+    const { renderable, optionCount, persistentsHeaders, persistentsFooters, headerInteractiveCount, middleNavigableCount, getOptionLabel, isOptionSelected, refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps, activeIndex, open, listRef, onSelection, onAction, onInputChangeFromUser, onInputBlur, onInputFocus, onInputKeyDown, setReferenceElement, } = useAutocomplete(props);
     const listboxId = React__default.useId();
     // Provides mount/unmount-aware transition styles for the floating element
     const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {
@@ -965,11 +960,7 @@ function AutocompleteRebuiltInternal(props, forwardedRef) {
                     style: Object.assign(Object.assign(Object.assign(Object.assign({}, floatingStyles), transitionStyles), (_b = props.UNSAFE_styles) === null || _b === void 0 ? void 0 : _b.menu), (menuWidth
                         ? { width: menuWidth, maxWidth: menuWidth }
                         : {})),
-                }), { onPointerDown: () => {
-                        isClickingWithinRef.current = true;
-                    }, onPointerUp: () => {
-                        isClickingWithinRef.current = false;
-                    } }),
+                })),
                     React__default.createElement(PersistentRegion, { items: persistentsHeaders, position: "header", activeIndex: activeIndex, indexOffset: 0, listboxId: listboxId, getItemProps: getItemProps, listRef: listRef, customRenderHeader: props.customRenderHeader, customRenderFooter: props.customRenderFooter, onAction: onAction, className: classnames(styles$1.persistentHeader, (_c = props.UNSAFE_className) === null || _c === void 0 ? void 0 : _c.header), style: (_d = props.UNSAFE_styles) === null || _d === void 0 ? void 0 : _d.header }),
                     React__default.createElement("div", { className: styles$1.scrollRegion }, loading ? ((_e = props.customRenderLoading) !== null && _e !== void 0 ? _e : React__default.createElement(LoadingContent, null)) : (React__default.createElement(React__default.Fragment, null,
                         showEmptyStateMessage && (React__default.createElement(EmptyStateMessage, { emptyState: props.emptyStateMessage })),

package/dist/Autocomplete/useAutocomplete.d.ts

@@ -56,7 +56,6 @@ export declare function useAutocomplete<Value extends OptionLike, Multiple exten
     activeIndex: number | null;
     setActiveIndex: (index: number | null) => void;
     listRef: React.MutableRefObject<(HTMLElement | null)[]>;
-    isClickingWithinRef: React.MutableRefObject<boolean>;
     onSelection: (option: Value) => void;
     onAction: (action: ActionConfig) => void;
     onInputChangeFromUser: (val: string) => void;

package/dist/FormField-cjs.js

@@ -383,6 +383,7 @@ function FormField(props) {
     return React.createElement(FormFieldInternal, Object.assign({}, props, { id: id }));
 }
 function FormFieldInternal(props) {
+    var _a;
     const { actionsRef, autocomplete = true, children, defaultValue, description, disabled, id, inputRef, inline, keyboard, max, maxLength, min, name: nameProp, pattern, readonly, rows, loading, type = "text", validations, value, onChange, onEnter, onFocus, onBlur, onValidation, onKeyUp, clearable = "never", autofocus, } = props;
     const { name } = useAtlantisFormFieldName({ id, nameProp });
     const { errorMessage, inputRefs, useControllerField, setValue, onControllerBlur, onControllerChange, } = useAtlantisReactHookForm({
@@ -429,7 +430,10 @@ function FormFieldInternal(props) {
         handleValidation,
         handleKeyDown,
     });
-    return (React.createElement(FormFieldWrapper, Object.assign({}, props, { value: useControllerField.value, error: errorMessage, identifier: id, descriptionIdentifier: descriptionIdentifier, clearable: clearable, onClear: handleClear }), renderField()));
+    // Ensure focus tracking works by providing a wrapperRef when none is passed
+    const internalWrapperRef = React.useRef(null);
+    const wrapperRef = (_a = props.wrapperRef) !== null && _a !== void 0 ? _a : internalWrapperRef;
+    return (React.createElement(FormFieldWrapper, Object.assign({}, props, { value: useControllerField.value, error: errorMessage, identifier: id, descriptionIdentifier: descriptionIdentifier, clearable: clearable, onClear: handleClear, wrapperRef: wrapperRef }), renderField()));
     function renderField() {
         switch (type) {
             case "select":

package/dist/FormField-es.js

@@ -381,6 +381,7 @@ function FormField(props) {
     return React__default.createElement(FormFieldInternal, Object.assign({}, props, { id: id }));
 }
 function FormFieldInternal(props) {
+    var _a;
     const { actionsRef, autocomplete = true, children, defaultValue, description, disabled, id, inputRef, inline, keyboard, max, maxLength, min, name: nameProp, pattern, readonly, rows, loading, type = "text", validations, value, onChange, onEnter, onFocus, onBlur, onValidation, onKeyUp, clearable = "never", autofocus, } = props;
     const { name } = useAtlantisFormFieldName({ id, nameProp });
     const { errorMessage, inputRefs, useControllerField, setValue, onControllerBlur, onControllerChange, } = useAtlantisReactHookForm({
@@ -427,7 +428,10 @@ function FormFieldInternal(props) {
         handleValidation,
         handleKeyDown,
     });
-    return (React__default.createElement(FormFieldWrapper, Object.assign({}, props, { value: useControllerField.value, error: errorMessage, identifier: id, descriptionIdentifier: descriptionIdentifier, clearable: clearable, onClear: handleClear }), renderField()));
+    // Ensure focus tracking works by providing a wrapperRef when none is passed
+    const internalWrapperRef = useRef(null);
+    const wrapperRef = (_a = props.wrapperRef) !== null && _a !== void 0 ? _a : internalWrapperRef;
+    return (React__default.createElement(FormFieldWrapper, Object.assign({}, props, { value: useControllerField.value, error: errorMessage, identifier: id, descriptionIdentifier: descriptionIdentifier, clearable: clearable, onClear: handleClear, wrapperRef: wrapperRef }), renderField()));
     function renderField() {
         switch (type) {
             case "select":

package/dist/InputNumber/index.cjs

@@ -2773,7 +2773,7 @@ function InputNumberInternal(props, ref) {
             }
         },
     }));
-    return (React.createElement(FormField.FormField, Object.assign({}, props, { type: "number", inputRef: inputRef, onChange: handleChange, validations: Object.assign(Object.assign({}, props.validations), { validate: customValidators((_a = props.validations) === null || _a === void 0 ? void 0 : _a.validate) }) })));
+    return (React.createElement(FormField.FormField, Object.assign({}, props, { clearable: "never", type: "number", inputRef: inputRef, onChange: handleChange, validations: Object.assign(Object.assign({}, props.validations), { validate: customValidators((_a = props.validations) === null || _a === void 0 ? void 0 : _a.validate) }) })));
     function customValidators(validators) {
         if (validators == null) {
             return getOverLimitMessage;

package/dist/InputNumber/index.mjs

@@ -2771,7 +2771,7 @@ function InputNumberInternal(props, ref) {
             }
         },
     }));
-    return (React__default.createElement(FormField, Object.assign({}, props, { type: "number", inputRef: inputRef, onChange: handleChange, validations: Object.assign(Object.assign({}, props.validations), { validate: customValidators((_a = props.validations) === null || _a === void 0 ? void 0 : _a.validate) }) })));
+    return (React__default.createElement(FormField, Object.assign({}, props, { clearable: "never", type: "number", inputRef: inputRef, onChange: handleChange, validations: Object.assign(Object.assign({}, props.validations), { validate: customValidators((_a = props.validations) === null || _a === void 0 ? void 0 : _a.validate) }) })));
     function customValidators(validators) {
         if (validators == null) {
             return getOverLimitMessage;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "6.103.2-JOB-141426-1b49367.0+1b4936717",
+  "version": "6.103.2",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -538,5 +538,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "1b4936717ac7e8c7caefc4145e02c79f7dbb7f56"
+  "gitHead": "901fec98e7fac64fac23c225d7ac6da63d0739f5"
 }