@jobber/components 6.90.3 → 6.90.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import React__default, { useState, useRef, useEffect, useCallback, useMemo, forwardRef } from 'react';
2
- import { u as useFloating, b as autoUpdate, o as offset, f as flip, e as size, r as useListNavigation, c as useDismiss, d as useInteractions, t as useTransitionStyles, F as FloatingPortal, q as FloatingFocusManager } from '../floating-ui.react-es.js';
2
+ import { u as useFloating, b as autoUpdate, o as offset, f as flip, e as size, q as useListNavigation, c as useDismiss, d as useInteractions, r as useTransitionStyles, F as FloatingPortal, n as FloatingFocusManager } from '../floating-ui.react-es.js';
3
3
  import classnames from 'classnames';
4
4
  import { tokens } from '@jobber/design';
5
5
  import { a as useCallbackRef_2, u as useDebounce_2 } from '../useDebounce-es.js';
@@ -1,7 +1,7 @@
1
1
  import React__default, { cloneElement, Component, createRef, useRef, useCallback, useEffect, createElement, forwardRef, isValidElement, useState } from 'react';
2
2
  import classnames from 'classnames';
3
3
  import { c as clsx } from './clsx-es.js';
4
- import { u as useFloating, b as autoUpdate, f as flip, o as offset, a as arrow, v as FloatingArrow } from './floating-ui.react-es.js';
4
+ import { u as useFloating, b as autoUpdate, f as flip, o as offset, a as arrow, t as FloatingArrow } from './floating-ui.react-es.js';
5
5
  import ReactDOM__default from 'react-dom';
6
6
  import { u as useRefocusOnActivator_2 } from './useRefocusOnActivator-es.js';
7
7
  import { T as Typography } from './Typography-es.js';
@@ -7,5 +7,5 @@ export declare function ModalActivator({ children }: PropsWithChildren): React.J
7
7
  /**
8
8
  * Background overlay for the modal. Used in the ModalContent.
9
9
  */
10
- export declare function ModalOverlay(): React.JSX.Element;
10
+ export declare function ModalOverlay({ children }: PropsWithChildren): React.JSX.Element;
11
11
  export declare function ModalContent({ children }: ModalContainerProps): React.JSX.Element;
@@ -92,14 +92,13 @@ function useModal({ open, activatorRef: refProp, onRequestClose, }) {
92
92
  },
93
93
  open: open,
94
94
  });
95
- const click = floatingUi_react.useClick(floatingContext);
96
95
  const dismiss = floatingUi_react.useDismiss(floatingContext, {
97
- outsidePressEvent: "click",
96
+ outsidePressEvent: "pointerdown",
98
97
  escapeKey: true,
99
98
  bubbles: false,
100
99
  });
101
100
  const role = floatingUi_react.useRole(floatingContext);
102
- const { getFloatingProps } = floatingUi_react.useInteractions([click, dismiss, role]);
101
+ const { getFloatingProps } = floatingUi_react.useInteractions([dismiss, role]);
103
102
  const parentId = floatingUi_react.useFloatingParentNodeId();
104
103
  return {
105
104
  floatingRefs,
@@ -192,25 +191,30 @@ function ModalActivator({ children }) {
192
191
  /**
193
192
  * Background overlay for the modal. Used in the ModalContent.
194
193
  */
195
- function ModalOverlay() {
196
- const { onRequestClose } = useModalContext();
197
- const { overlayBackground } = useModalStyles();
198
- return (React.createElement(framerMotion.motion.div, { onClick: onRequestClose, className: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 } }));
194
+ function ModalOverlay({ children }) {
195
+ const { overlay, overlayBackground } = useModalStyles();
196
+ const { floatingNodeId } = useModalContext();
197
+ return (React.createElement(floatingUi_react.FloatingOverlay, { lockScroll: true, className: overlay, "data-modal-node-id": floatingNodeId },
198
+ React.createElement(framerMotion.motion.div, { "aria-hidden": "true", className: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, "data-modal-node-id": floatingNodeId }),
199
+ children));
199
200
  }
200
201
  function ModalContent({ children }) {
201
202
  const { open, floatingContext, activatorRef, floatingRefs, size, floatingNodeId, modalLabelledBy, getFloatingProps, } = useModalContext();
202
- const { modal, overlay } = useModalStyles(size);
203
+ const { modal } = useModalStyles(size);
203
204
  return (React.createElement(framerMotion.AnimatePresence, null, open && (React.createElement(floatingUi_react.FloatingNode, { id: floatingNodeId },
204
205
  React.createElement(floatingUi_react.FloatingPortal, null,
205
206
  React.createElement(AtlantisPortalContent.AtlantisPortalContent, null,
206
- React.createElement(floatingUi_react.FloatingOverlay, { className: overlay },
207
- React.createElement(floatingUi_react.FloatingFocusManager, { context: floatingContext, returnFocus: (activatorRef === null || activatorRef === void 0 ? void 0 : activatorRef.current) ? activatorRef : true, initialFocus: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.floating },
208
- React.createElement("div", Object.assign({ ref: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.setFloating, role: "dialog", tabIndex: 0, "aria-labelledby": modalLabelledBy }, getFloatingProps()),
209
- React.createElement(ModalOverlay, null),
210
- React.createElement(framerMotion.motion.div, { "data-floating-ui-focusable": true, className: modal, initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
211
- duration: 0.2,
212
- ease: "easeInOut",
213
- } }, children))))))))));
207
+ React.createElement(ModalOverlay, null,
208
+ React.createElement(floatingUi_react.FloatingFocusManager, { context: floatingContext, returnFocus: (activatorRef === null || activatorRef === void 0 ? void 0 : activatorRef.current) ? activatorRef : true, order: ["floating", "content"] },
209
+ React.createElement(framerMotion.motion.div, { initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
210
+ duration: 0.2,
211
+ ease: "easeInOut",
212
+ } },
213
+ React.createElement("div", Object.assign({ ref: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.setFloating, "data-modal-node-id": floatingNodeId }, getFloatingProps({
214
+ role: "dialog",
215
+ className: modal,
216
+ "aria-labelledby": modalLabelledBy,
217
+ })), children))))))))));
214
218
  }
215
219
 
216
220
  function Modal(props) {
@@ -9,7 +9,7 @@ import { H as Heading } from '../Heading-es.js';
9
9
  import { B as Button } from '../Button-es.js';
10
10
  import { B as ButtonDismiss } from '../ButtonDismiss-es.js';
11
11
  import { n as noop } from '../noop-es.js';
12
- import { h as useFloatingNodeId, u as useFloating, m as useClick, c as useDismiss, n as useRole, d as useInteractions, g as useFloatingParentNodeId, i as FloatingTree, j as FloatingNode, F as FloatingPortal, p as FloatingOverlay, q as FloatingFocusManager } from '../floating-ui.react-es.js';
12
+ import { h as useFloatingNodeId, u as useFloating, c as useDismiss, m as useRole, d as useInteractions, g as useFloatingParentNodeId, i as FloatingTree, j as FloatingNode, F as FloatingPortal, n as FloatingFocusManager, p as FloatingOverlay } from '../floating-ui.react-es.js';
13
13
  import { b as identity } from '../identity-es.js';
14
14
  import { A as AtlantisPortalContent } from '../AtlantisPortalContent-es.js';
15
15
  import '../Typography-es.js';
@@ -90,14 +90,13 @@ function useModal({ open, activatorRef: refProp, onRequestClose, }) {
90
90
  },
91
91
  open: open,
92
92
  });
93
- const click = useClick(floatingContext);
94
93
  const dismiss = useDismiss(floatingContext, {
95
- outsidePressEvent: "click",
94
+ outsidePressEvent: "pointerdown",
96
95
  escapeKey: true,
97
96
  bubbles: false,
98
97
  });
99
98
  const role = useRole(floatingContext);
100
- const { getFloatingProps } = useInteractions([click, dismiss, role]);
99
+ const { getFloatingProps } = useInteractions([dismiss, role]);
101
100
  const parentId = useFloatingParentNodeId();
102
101
  return {
103
102
  floatingRefs,
@@ -190,25 +189,30 @@ function ModalActivator({ children }) {
190
189
  /**
191
190
  * Background overlay for the modal. Used in the ModalContent.
192
191
  */
193
- function ModalOverlay() {
194
- const { onRequestClose } = useModalContext();
195
- const { overlayBackground } = useModalStyles();
196
- return (React__default.createElement(motion.div, { onClick: onRequestClose, className: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 } }));
192
+ function ModalOverlay({ children }) {
193
+ const { overlay, overlayBackground } = useModalStyles();
194
+ const { floatingNodeId } = useModalContext();
195
+ return (React__default.createElement(FloatingOverlay, { lockScroll: true, className: overlay, "data-modal-node-id": floatingNodeId },
196
+ React__default.createElement(motion.div, { "aria-hidden": "true", className: overlayBackground, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, "data-modal-node-id": floatingNodeId }),
197
+ children));
197
198
  }
198
199
  function ModalContent({ children }) {
199
200
  const { open, floatingContext, activatorRef, floatingRefs, size, floatingNodeId, modalLabelledBy, getFloatingProps, } = useModalContext();
200
- const { modal, overlay } = useModalStyles(size);
201
+ const { modal } = useModalStyles(size);
201
202
  return (React__default.createElement(AnimatePresence, null, open && (React__default.createElement(FloatingNode, { id: floatingNodeId },
202
203
  React__default.createElement(FloatingPortal, null,
203
204
  React__default.createElement(AtlantisPortalContent, null,
204
- React__default.createElement(FloatingOverlay, { className: overlay },
205
- React__default.createElement(FloatingFocusManager, { context: floatingContext, returnFocus: (activatorRef === null || activatorRef === void 0 ? void 0 : activatorRef.current) ? activatorRef : true, initialFocus: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.floating },
206
- React__default.createElement("div", Object.assign({ ref: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.setFloating, role: "dialog", tabIndex: 0, "aria-labelledby": modalLabelledBy }, getFloatingProps()),
207
- React__default.createElement(ModalOverlay, null),
208
- React__default.createElement(motion.div, { "data-floating-ui-focusable": true, className: modal, initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
209
- duration: 0.2,
210
- ease: "easeInOut",
211
- } }, children))))))))));
205
+ React__default.createElement(ModalOverlay, null,
206
+ React__default.createElement(FloatingFocusManager, { context: floatingContext, returnFocus: (activatorRef === null || activatorRef === void 0 ? void 0 : activatorRef.current) ? activatorRef : true, order: ["floating", "content"] },
207
+ React__default.createElement(motion.div, { initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
208
+ duration: 0.2,
209
+ ease: "easeInOut",
210
+ } },
211
+ React__default.createElement("div", Object.assign({ ref: floatingRefs === null || floatingRefs === void 0 ? void 0 : floatingRefs.setFloating, "data-modal-node-id": floatingNodeId }, getFloatingProps({
212
+ role: "dialog",
213
+ className: modal,
214
+ "aria-labelledby": modalLabelledBy,
215
+ })), children))))))))));
212
216
  }
213
217
 
214
218
  function Modal(props) {
@@ -1064,15 +1064,6 @@ function isVirtualPointerEvent(event) {
1064
1064
  // iOS VoiceOver returns 0.333• for width/height.
1065
1065
  event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'touch';
1066
1066
  }
1067
- function isMouseLikePointerType(pointerType, strict) {
1068
- // On some Linux machines with Chromium, mouse inputs return a `pointerType`
1069
- // of "pen": https://github.com/floating-ui/floating-ui/issues/2015
1070
- const values = ['mouse', 'pen'];
1071
- if (!strict) {
1072
- values.push('', undefined);
1073
- }
1074
- return values.includes(pointerType);
1075
- }
1076
1067
 
1077
1068
  var isClient$1 = typeof document !== 'undefined';
1078
1069
 
@@ -5924,114 +5915,6 @@ const FloatingOverlay = /*#__PURE__*/React__namespace.forwardRef(function Floati
5924
5915
  });
5925
5916
  });
5926
5917
 
5927
- function isButtonTarget(event) {
5928
- return isHTMLElement(event.target) && event.target.tagName === 'BUTTON';
5929
- }
5930
- function isAnchorTarget(event) {
5931
- return isHTMLElement(event.target) && event.target.tagName === 'A';
5932
- }
5933
- function isSpaceIgnored(element) {
5934
- return isTypeableElement(element);
5935
- }
5936
- /**
5937
- * Opens or closes the floating element when clicking the reference element.
5938
- * @see https://floating-ui.com/docs/useClick
5939
- */
5940
- function useClick(context, props) {
5941
- if (props === void 0) {
5942
- props = {};
5943
- }
5944
- const {
5945
- open,
5946
- onOpenChange,
5947
- dataRef,
5948
- elements: {
5949
- domReference
5950
- }
5951
- } = context;
5952
- const {
5953
- enabled = true,
5954
- event: eventOption = 'click',
5955
- toggle = true,
5956
- ignoreMouse = false,
5957
- keyboardHandlers = true,
5958
- stickIfOpen = true
5959
- } = props;
5960
- const pointerTypeRef = React__namespace.useRef();
5961
- const didKeyDownRef = React__namespace.useRef(false);
5962
- const reference = React__namespace.useMemo(() => ({
5963
- onPointerDown(event) {
5964
- pointerTypeRef.current = event.pointerType;
5965
- },
5966
- onMouseDown(event) {
5967
- const pointerType = pointerTypeRef.current;
5968
-
5969
- // Ignore all buttons except for the "main" button.
5970
- // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
5971
- if (event.button !== 0) return;
5972
- if (eventOption === 'click') return;
5973
- if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
5974
- if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'mousedown' : true)) {
5975
- onOpenChange(false, event.nativeEvent, 'click');
5976
- } else {
5977
- // Prevent stealing focus from the floating element
5978
- event.preventDefault();
5979
- onOpenChange(true, event.nativeEvent, 'click');
5980
- }
5981
- },
5982
- onClick(event) {
5983
- const pointerType = pointerTypeRef.current;
5984
- if (eventOption === 'mousedown' && pointerTypeRef.current) {
5985
- pointerTypeRef.current = undefined;
5986
- return;
5987
- }
5988
- if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
5989
- if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'click' : true)) {
5990
- onOpenChange(false, event.nativeEvent, 'click');
5991
- } else {
5992
- onOpenChange(true, event.nativeEvent, 'click');
5993
- }
5994
- },
5995
- onKeyDown(event) {
5996
- pointerTypeRef.current = undefined;
5997
- if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event)) {
5998
- return;
5999
- }
6000
- if (event.key === ' ' && !isSpaceIgnored(domReference)) {
6001
- // Prevent scrolling
6002
- event.preventDefault();
6003
- didKeyDownRef.current = true;
6004
- }
6005
- if (isAnchorTarget(event)) {
6006
- return;
6007
- }
6008
- if (event.key === 'Enter') {
6009
- if (open && toggle) {
6010
- onOpenChange(false, event.nativeEvent, 'click');
6011
- } else {
6012
- onOpenChange(true, event.nativeEvent, 'click');
6013
- }
6014
- }
6015
- },
6016
- onKeyUp(event) {
6017
- if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event) || isSpaceIgnored(domReference)) {
6018
- return;
6019
- }
6020
- if (event.key === ' ' && didKeyDownRef.current) {
6021
- didKeyDownRef.current = false;
6022
- if (open && toggle) {
6023
- onOpenChange(false, event.nativeEvent, 'click');
6024
- } else {
6025
- onOpenChange(true, event.nativeEvent, 'click');
6026
- }
6027
- }
6028
- }
6029
- }), [dataRef, domReference, eventOption, ignoreMouse, keyboardHandlers, onOpenChange, open, stickIfOpen, toggle]);
6030
- return React__namespace.useMemo(() => enabled ? {
6031
- reference
6032
- } : {}, [enabled, reference]);
6033
- }
6034
-
6035
5918
  const bubbleHandlerKeys = {
6036
5919
  pointerdown: 'onPointerDown',
6037
5920
  mousedown: 'onMouseDown',
@@ -7413,7 +7296,6 @@ exports.limitShift = limitShift;
7413
7296
  exports.offset = offset;
7414
7297
  exports.shift = shift;
7415
7298
  exports.size = size;
7416
- exports.useClick = useClick;
7417
7299
  exports.useDismiss = useDismiss;
7418
7300
  exports.useFloating = useFloating;
7419
7301
  exports.useFloatingNodeId = useFloatingNodeId;
@@ -1043,15 +1043,6 @@ function isVirtualPointerEvent(event) {
1043
1043
  // iOS VoiceOver returns 0.333• for width/height.
1044
1044
  event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'touch';
1045
1045
  }
1046
- function isMouseLikePointerType(pointerType, strict) {
1047
- // On some Linux machines with Chromium, mouse inputs return a `pointerType`
1048
- // of "pen": https://github.com/floating-ui/floating-ui/issues/2015
1049
- const values = ['mouse', 'pen'];
1050
- if (!strict) {
1051
- values.push('', undefined);
1052
- }
1053
- return values.includes(pointerType);
1054
- }
1055
1046
 
1056
1047
  var isClient$1 = typeof document !== 'undefined';
1057
1048
 
@@ -5903,114 +5894,6 @@ const FloatingOverlay = /*#__PURE__*/React.forwardRef(function FloatingOverlay(p
5903
5894
  });
5904
5895
  });
5905
5896
 
5906
- function isButtonTarget(event) {
5907
- return isHTMLElement(event.target) && event.target.tagName === 'BUTTON';
5908
- }
5909
- function isAnchorTarget(event) {
5910
- return isHTMLElement(event.target) && event.target.tagName === 'A';
5911
- }
5912
- function isSpaceIgnored(element) {
5913
- return isTypeableElement(element);
5914
- }
5915
- /**
5916
- * Opens or closes the floating element when clicking the reference element.
5917
- * @see https://floating-ui.com/docs/useClick
5918
- */
5919
- function useClick(context, props) {
5920
- if (props === void 0) {
5921
- props = {};
5922
- }
5923
- const {
5924
- open,
5925
- onOpenChange,
5926
- dataRef,
5927
- elements: {
5928
- domReference
5929
- }
5930
- } = context;
5931
- const {
5932
- enabled = true,
5933
- event: eventOption = 'click',
5934
- toggle = true,
5935
- ignoreMouse = false,
5936
- keyboardHandlers = true,
5937
- stickIfOpen = true
5938
- } = props;
5939
- const pointerTypeRef = React.useRef();
5940
- const didKeyDownRef = React.useRef(false);
5941
- const reference = React.useMemo(() => ({
5942
- onPointerDown(event) {
5943
- pointerTypeRef.current = event.pointerType;
5944
- },
5945
- onMouseDown(event) {
5946
- const pointerType = pointerTypeRef.current;
5947
-
5948
- // Ignore all buttons except for the "main" button.
5949
- // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
5950
- if (event.button !== 0) return;
5951
- if (eventOption === 'click') return;
5952
- if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
5953
- if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'mousedown' : true)) {
5954
- onOpenChange(false, event.nativeEvent, 'click');
5955
- } else {
5956
- // Prevent stealing focus from the floating element
5957
- event.preventDefault();
5958
- onOpenChange(true, event.nativeEvent, 'click');
5959
- }
5960
- },
5961
- onClick(event) {
5962
- const pointerType = pointerTypeRef.current;
5963
- if (eventOption === 'mousedown' && pointerTypeRef.current) {
5964
- pointerTypeRef.current = undefined;
5965
- return;
5966
- }
5967
- if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
5968
- if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'click' : true)) {
5969
- onOpenChange(false, event.nativeEvent, 'click');
5970
- } else {
5971
- onOpenChange(true, event.nativeEvent, 'click');
5972
- }
5973
- },
5974
- onKeyDown(event) {
5975
- pointerTypeRef.current = undefined;
5976
- if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event)) {
5977
- return;
5978
- }
5979
- if (event.key === ' ' && !isSpaceIgnored(domReference)) {
5980
- // Prevent scrolling
5981
- event.preventDefault();
5982
- didKeyDownRef.current = true;
5983
- }
5984
- if (isAnchorTarget(event)) {
5985
- return;
5986
- }
5987
- if (event.key === 'Enter') {
5988
- if (open && toggle) {
5989
- onOpenChange(false, event.nativeEvent, 'click');
5990
- } else {
5991
- onOpenChange(true, event.nativeEvent, 'click');
5992
- }
5993
- }
5994
- },
5995
- onKeyUp(event) {
5996
- if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event) || isSpaceIgnored(domReference)) {
5997
- return;
5998
- }
5999
- if (event.key === ' ' && didKeyDownRef.current) {
6000
- didKeyDownRef.current = false;
6001
- if (open && toggle) {
6002
- onOpenChange(false, event.nativeEvent, 'click');
6003
- } else {
6004
- onOpenChange(true, event.nativeEvent, 'click');
6005
- }
6006
- }
6007
- }
6008
- }), [dataRef, domReference, eventOption, ignoreMouse, keyboardHandlers, onOpenChange, open, stickIfOpen, toggle]);
6009
- return React.useMemo(() => enabled ? {
6010
- reference
6011
- } : {}, [enabled, reference]);
6012
- }
6013
-
6014
5897
  const bubbleHandlerKeys = {
6015
5898
  pointerdown: 'onPointerDown',
6016
5899
  mousedown: 'onMouseDown',
@@ -7378,4 +7261,4 @@ function useTransitionStyles(context, props) {
7378
7261
  };
7379
7262
  }
7380
7263
 
7381
- export { FloatingPortal as F, arrow as a, autoUpdate as b, useDismiss as c, useInteractions as d, size as e, flip as f, useFloatingParentNodeId as g, useFloatingNodeId as h, FloatingTree as i, FloatingNode as j, autoPlacement as k, limitShift as l, useClick as m, useRole as n, offset as o, FloatingOverlay as p, FloatingFocusManager as q, useListNavigation as r, shift as s, useTransitionStyles as t, useFloating as u, FloatingArrow as v };
7264
+ export { FloatingPortal as F, arrow as a, autoUpdate as b, useDismiss as c, useInteractions as d, size as e, flip as f, useFloatingParentNodeId as g, useFloatingNodeId as h, FloatingTree as i, FloatingNode as j, autoPlacement as k, limitShift as l, useRole as m, FloatingFocusManager as n, offset as o, FloatingOverlay as p, useListNavigation as q, useTransitionStyles as r, shift as s, FloatingArrow as t, useFloating as u };
package/dist/styles.css CHANGED
@@ -4630,8 +4630,6 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
4630
4630
 
4631
4631
  .cRhQeXmZobs- {
4632
4632
  display: grid;
4633
- z-index: 1001;
4634
- z-index: var(--elevation-modal);
4635
4633
  -ms-flex-align: center;
4636
4634
  align-items: center;
4637
4635
  justify-items: center;
@@ -4644,11 +4642,10 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
4644
4642
  right: 0;
4645
4643
  bottom: 0;
4646
4644
  left: 0;
4647
- z-index: 1001;
4648
- z-index: var(--elevation-modal);
4645
+ outline: none;
4649
4646
  background-color: rgba(0, 0, 0, 0.32);
4650
4647
  background-color: var(--color-overlay);
4651
- opacity: 0.8;
4648
+ will-change: opacity;
4652
4649
  }
4653
4650
 
4654
4651
  .OiqCKNmbHZ0- {
@@ -4667,12 +4664,16 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
4667
4664
  border: var(--border-base) solid var(--color-border);
4668
4665
  border-radius: 8px;
4669
4666
  border-radius: var(--radius-base);
4667
+ outline: none;
4670
4668
  background-color: rgba(255, 255, 255, 1);
4671
4669
  background-color: var(--color-surface);
4672
4670
  -ms-flex: 0 0 auto;
4673
4671
  flex: 0 0 auto;
4674
- outline-color: hsl(198, 12%, 57%);
4675
- outline-color: var(--color-focus);
4672
+ }
4673
+
4674
+ .OiqCKNmbHZ0-:focus-visible {
4675
+ box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 1), 0px 0px 0px 4px hsl(198, 12%, 57%);
4676
+ box-shadow: var(--shadow-focus);
4676
4677
  }
4677
4678
 
4678
4679
  /* Adjust `Content` and `Tab` components public padding to match the modal */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components",
3
- "version": "6.90.3",
3
+ "version": "6.90.4",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -541,5 +541,5 @@
541
541
  "> 1%",
542
542
  "IE 10"
543
543
  ],
544
- "gitHead": "e93994a2cb7cb82cc0e2b1e67ef2e09c98bebb1f"
544
+ "gitHead": "613eb4a310fefc9f1d1ec4f8ae2bb398dcaaffff"
545
545
  }