@jobber/components 8.29.0 → 8.29.1-fixselect-35e5f17.8

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 * as React from 'react';
2
- import { u as useDialogRootContext, h as useDialogPortalContext, i as DialogStore } from './ScrollAreaViewport-es.js';
2
+ import { u as useDialogRootContext, l as useDialogPortalContext, m as DialogStore } from './ScrollAreaViewport-es.js';
3
3
  import { u as useRenderElement } from './useRenderElement-es.js';
4
4
  import { p as popupStateMapping, C as CommonPopupDataAttributes, c as createDefaultInitialFocus, F as FOCUSABLE_POPUP_PROPS, a as FloatingFocusManager } from './useScrollLock-es.js';
5
5
  import { t as transitionStatusMapping, u as useBaseUiId, f as useOpenChangeComplete, d as createChangeEventDetails, i as imperativeAction } from './useButton-es.js';
package/dist/Menu-cjs.js CHANGED
@@ -70,7 +70,7 @@ function MenuLegacy({ activator, items, UNSAFE_className, UNSAFE_style, }) {
70
70
  [styles$2.fullWidth]: fullWidth,
71
71
  });
72
72
  jobberHooks.useRefocusOnActivator(visible);
73
- const isLargeScreen = width >= SMALL_SCREEN_BREAKPOINT;
73
+ const isLargeScreen = width !== undefined && width >= SMALL_SCREEN_BREAKPOINT;
74
74
  const middleware = React.useMemo(() => {
75
75
  if (isLargeScreen) {
76
76
  return [
@@ -884,8 +884,7 @@ function useMenuShell() {
884
884
  return isMobile ? MenuBottomSheet : MenuDropdown;
885
885
  }
886
886
  function MenuComposableRoot(props) {
887
- const { width } = jobberHooks.useWindowDimensions();
888
- const isMobile = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
887
+ const isMobile = jobberHooks.useIsSmallScreen();
889
888
  const RootComponent = isMobile ? MenuBottomSheet : MenuDropdown;
890
889
  return (React.createElement(MenuContext.Provider, { value: { isMobile } },
891
890
  React.createElement(RootComponent, { onOpenChange: props.onOpenChange, open: props.open, defaultOpen: props.defaultOpen }, props.children)));
package/dist/Menu-es.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React__default, { useState, useRef, useId, useMemo } from 'react';
2
- import { useWindowDimensions, useRefocusOnActivator } from '@jobber/hooks';
2
+ import { useWindowDimensions, useRefocusOnActivator, useIsSmallScreen } from '@jobber/hooks';
3
3
  import classnames from 'classnames';
4
4
  import { AnimatePresence, motion } from 'framer-motion';
5
5
  import { u as useFloating, c as useDismiss, g as useListNavigation, d as useInteractions, F as FloatingPortal } from './floating-ui.react-es.js';
@@ -68,7 +68,7 @@ function MenuLegacy({ activator, items, UNSAFE_className, UNSAFE_style, }) {
68
68
  [styles$2.fullWidth]: fullWidth,
69
69
  });
70
70
  useRefocusOnActivator(visible);
71
- const isLargeScreen = width >= SMALL_SCREEN_BREAKPOINT;
71
+ const isLargeScreen = width !== undefined && width >= SMALL_SCREEN_BREAKPOINT;
72
72
  const middleware = useMemo(() => {
73
73
  if (isLargeScreen) {
74
74
  return [
@@ -882,8 +882,7 @@ function useMenuShell() {
882
882
  return isMobile ? MenuBottomSheet : MenuDropdown;
883
883
  }
884
884
  function MenuComposableRoot(props) {
885
- const { width } = useWindowDimensions();
886
- const isMobile = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
885
+ const isMobile = useIsSmallScreen();
887
886
  const RootComponent = isMobile ? MenuBottomSheet : MenuDropdown;
888
887
  return (React__default.createElement(MenuContext.Provider, { value: { isMobile } },
889
888
  React__default.createElement(RootComponent, { onOpenChange: props.onOpenChange, open: props.open, defaultOpen: props.defaultOpen }, props.children)));
@@ -4305,4 +4305,4 @@ function mergeHiddenState(prevState, nextState) {
4305
4305
  return nextState;
4306
4306
  }
4307
4307
 
4308
- export { getElementAtPoint as A, findScrollableTouchTarget as B, useScrollAreaRootContext as C, DrawerTrigger as D, getOffset as E, ScrollAreaRootCssVars as F, scrollAreaStateAttributesMapping as G, useScrollAreaViewportContext as H, ScrollAreaRoot as S, DrawerRoot as a, DrawerPortal as b, DrawerBackdrop as c, DrawerViewport as d, DrawerPopup as e, ScrollAreaViewport as f, DrawerContent as g, useDialogPortalContext as h, DialogStore as i, DialogRoot as j, DialogTrigger as k, DialogPortal as l, DialogViewport as m, createInitialPopupStoreState as n, useDrawerProviderContext as o, popupStoreSelectors as p, DrawerBackdropCssVars as q, DrawerPopupCssVars as r, DrawerProviderContext as s, useDrawerRootContext as t, useDialogRootContext as u, useSwipeDismiss as v, getDisplacement as w, DrawerPopupDataAttributes as x, getElementTransform as y, DrawerVirtualKeyboardContext as z };
4308
+ export { getElementAtPoint as A, findScrollableTouchTarget as B, useScrollAreaRootContext as C, DrawerTrigger as D, getOffset as E, ScrollAreaRootCssVars as F, scrollAreaStateAttributesMapping as G, useScrollAreaViewportContext as H, ScrollAreaRoot as S, DrawerRoot as a, DrawerPortal as b, DrawerBackdrop as c, DrawerViewport as d, DrawerPopup as e, ScrollAreaViewport as f, DrawerContent as g, DialogRoot as h, DialogTrigger as i, DialogPortal as j, DialogViewport as k, useDialogPortalContext as l, DialogStore as m, createInitialPopupStoreState as n, useDrawerProviderContext as o, popupStoreSelectors as p, DrawerBackdropCssVars as q, DrawerPopupCssVars as r, DrawerProviderContext as s, useDrawerRootContext as t, useDialogRootContext as u, useSwipeDismiss as v, getDisplacement as w, DrawerPopupDataAttributes as x, getElementTransform as y, DrawerVirtualKeyboardContext as z };
@@ -140,7 +140,6 @@ function SelectDropdownRoot({ value, onValueChange, onBlur, onFocus, disabled, r
140
140
  React.createElement(SelectPrimitive.SelectPrimitive.List, null, children))))));
141
141
  }
142
142
 
143
- const SMALL_SCREEN_BREAKPOINT = jobberHooks.BREAKPOINT_SIZES.sm;
144
143
  const SelectShellContext = React.createContext(null);
145
144
  function useSelectShell() {
146
145
  const shell = React.useContext(SelectShellContext);
@@ -180,8 +179,7 @@ function Select({ label, description, error, invalid, value, onValueChange, onBl
180
179
  const isInvalid = hasError || Boolean(invalid);
181
180
  const showDescription = !inline && Boolean(description) && !hasError;
182
181
  const showError = !inline && hasError;
183
- const { width } = jobberHooks.useWindowDimensions();
184
- const isBottomSheet = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
182
+ const isBottomSheet = jobberHooks.useIsSmallScreen();
185
183
  const shell = isBottomSheet ? selectBottomSheetShell : selectDropdownShell;
186
184
  const ShellRoot = isBottomSheet ? SelectBottomSheetRoot : SelectDropdownRoot;
187
185
  return (React.createElement(FieldDescription.FieldRoot, { className: classnames(styles.field, inline && styles.inline, size && styles[size], label && styles.hasLabel), disabled: disabled, invalid: isInvalid || undefined, name: name },
package/dist/Select-es.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React__default, { useState, useRef, useId, useImperativeHandle } from 'react';
2
- import { BREAKPOINT_SIZES, useWindowDimensions } from '@jobber/hooks';
2
+ import { useIsSmallScreen } from '@jobber/hooks';
3
3
  import classnames from 'classnames';
4
4
  import { S as SelectPrimitive } from './SelectPrimitive-es.js';
5
5
  import { a as BottomSheet } from './BottomSheet-es.js';
@@ -138,7 +138,6 @@ function SelectDropdownRoot({ value, onValueChange, onBlur, onFocus, disabled, r
138
138
  React__default.createElement(SelectPrimitive.List, null, children))))));
139
139
  }
140
140
 
141
- const SMALL_SCREEN_BREAKPOINT = BREAKPOINT_SIZES.sm;
142
141
  const SelectShellContext = React__default.createContext(null);
143
142
  function useSelectShell() {
144
143
  const shell = React__default.useContext(SelectShellContext);
@@ -178,8 +177,7 @@ function Select({ label, description, error, invalid, value, onValueChange, onBl
178
177
  const isInvalid = hasError || Boolean(invalid);
179
178
  const showDescription = !inline && Boolean(description) && !hasError;
180
179
  const showError = !inline && hasError;
181
- const { width } = useWindowDimensions();
182
- const isBottomSheet = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
180
+ const isBottomSheet = useIsSmallScreen();
183
181
  const shell = isBottomSheet ? selectBottomSheetShell : selectDropdownShell;
184
182
  const ShellRoot = isBottomSheet ? SelectBottomSheetRoot : SelectDropdownRoot;
185
183
  return (React__default.createElement(FieldRoot, { className: classnames(styles.field, inline && styles.inline, size && styles[size], label && styles.hasLabel), disabled: disabled, invalid: isInvalid || undefined, name: name },
@@ -14,11 +14,6 @@ var DrawerTitle = require('./DrawerTitle-cjs.js');
14
14
  var DrawerDescription = require('./DrawerDescription-cjs.js');
15
15
  var nestedEscape = require('./nestedEscape-cjs.js');
16
16
 
17
- // Copied from Menu's constant so the two surfaces agree on what "mobile" means.
18
- // (The proposal calls for copying shared Menu values into the component first
19
- // and deciding later whether to promote them to a shared location.)
20
- const SMALL_SCREEN_BREAKPOINT = 490;
21
-
22
17
  var styles = {"small":"uYYyCR3l6E8-","base":"X1jGz-sLWf4-","large":"_4zFf2PkFhaA-","fullScreen":"nJoCr8oWJ7w-","header":"XFKiCQ8QbQU-","close":"FDOhnO0TT08-","scrollRegion":"_8DjYA23vHXA-","scrollViewport":"Bwr9IUYpLfM-","body":"zp9kx9uue2I-","fullBleed":"EhtwBTy1ai4-","footer":"DRIJhI1knKw-","sheetSurface":"vmcZRwOcNMo-","popup":"mFX7qDCd17I-","backdrop":"NE-BIsVE-hE-","viewport":"hp70o-3Cf-w-","spinning":"Zf-Z8DJcC-Y-"};
23
18
 
24
19
  var actionsStyles = {"actions":"hKVNddbxkmo-","leftActions":"nslrozOH-v4-","buttonGroup":"BrXAnQBttWE-","align-left":"_9Vgd-3YJxlI-","align-right":"_8HC9NqvmJdo-","align-fullWidth":"ZZ3XuxGv6ow-","spinning":"PWf7wHPhd2A-"};
@@ -320,8 +315,7 @@ function Dialog(_a) {
320
315
  }
321
316
  onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(nextOpen, eventDetails);
322
317
  }
323
- const { width } = jobberHooks.useWindowDimensions();
324
- const isMobile = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
318
+ const isMobile = jobberHooks.useIsSmallScreen();
325
319
  // The shell is the root component; its parts are reached via `useDialogShell`
326
320
  // in each part below (the Menu pattern).
327
321
  const RootComponent = isMobile ? DialogBottomSheet : DialogModal;
@@ -1,10 +1,10 @@
1
1
  import { _ as __rest } from './tslib.es6-es.js';
2
2
  import React__default, { isValidElement } from 'react';
3
- import { useWindowDimensions } from '@jobber/hooks';
3
+ import { useIsSmallScreen } from '@jobber/hooks';
4
4
  import classnames from 'classnames';
5
5
  import { n as normalizeBaseUiButtonProps, i as isAtlantisButtonRenderTarget, s as stripNativeTypeFromButtonRenderTarget, r as renderAtlantisButtonTarget } from './buttonRenderAdapter-es.js';
6
6
  import { B as Button } from './Button-es.js';
7
- import { S as ScrollAreaRoot, f as ScrollAreaViewport, g as DrawerContent, j as DialogRoot, k as DialogTrigger$1, l as DialogPortal, m as DialogViewport } from './ScrollAreaViewport-es.js';
7
+ import { S as ScrollAreaRoot, f as ScrollAreaViewport, g as DrawerContent, h as DialogRoot, i as DialogTrigger$1, j as DialogPortal, k as DialogViewport } from './ScrollAreaViewport-es.js';
8
8
  import { m as mergeProps } from './useRenderElement-es.js';
9
9
  import { H as Heading } from './Heading-es.js';
10
10
  import { a as BottomSheet, B as BottomSheetScrollAreaContext } from './BottomSheet-es.js';
@@ -12,11 +12,6 @@ import { D as DrawerTitle, a as DrawerClose, b as DialogTitle$1, c as DialogClos
12
12
  import { D as DrawerDescription, a as DialogBackdrop, b as DialogPopup, c as DialogDescription, d as createDialogHandle } from './DrawerDescription-es.js';
13
13
  import { i as isEscapeHandledByModal } from './nestedEscape-es.js';
14
14
 
15
- // Copied from Menu's constant so the two surfaces agree on what "mobile" means.
16
- // (The proposal calls for copying shared Menu values into the component first
17
- // and deciding later whether to promote them to a shared location.)
18
- const SMALL_SCREEN_BREAKPOINT = 490;
19
-
20
15
  var styles = {"small":"uYYyCR3l6E8-","base":"X1jGz-sLWf4-","large":"_4zFf2PkFhaA-","fullScreen":"nJoCr8oWJ7w-","header":"XFKiCQ8QbQU-","close":"FDOhnO0TT08-","scrollRegion":"_8DjYA23vHXA-","scrollViewport":"Bwr9IUYpLfM-","body":"zp9kx9uue2I-","fullBleed":"EhtwBTy1ai4-","footer":"DRIJhI1knKw-","sheetSurface":"vmcZRwOcNMo-","popup":"mFX7qDCd17I-","backdrop":"NE-BIsVE-hE-","viewport":"hp70o-3Cf-w-","spinning":"Zf-Z8DJcC-Y-"};
21
16
 
22
17
  var actionsStyles = {"actions":"hKVNddbxkmo-","leftActions":"nslrozOH-v4-","buttonGroup":"BrXAnQBttWE-","align-left":"_9Vgd-3YJxlI-","align-right":"_8HC9NqvmJdo-","align-fullWidth":"ZZ3XuxGv6ow-","spinning":"PWf7wHPhd2A-"};
@@ -318,8 +313,7 @@ function Dialog(_a) {
318
313
  }
319
314
  onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(nextOpen, eventDetails);
320
315
  }
321
- const { width } = useWindowDimensions();
322
- const isMobile = width !== undefined && width <= SMALL_SCREEN_BREAKPOINT;
316
+ const isMobile = useIsSmallScreen();
323
317
  // The shell is the root component; its parts are reached via `useDialogShell`
324
318
  // in each part below (the Menu pattern).
325
319
  const RootComponent = isMobile ? DialogBottomSheet : DialogModal;
@@ -6,7 +6,7 @@ import { ag as pointer, a as useIsoLayoutEffect, b as useStableCallback, h as us
6
6
  import { S as Separator } from '../Separator-es.js';
7
7
  import { a as DialogBackdrop, c as DialogDescription, e as DialogHandle, b as DialogPopup, d as createDialogHandle, D as DrawerDescription } from '../DrawerDescription-es.js';
8
8
  import { c as DialogClose, b as DialogTitle, a as DrawerClose, D as DrawerTitle } from '../DrawerTitle-es.js';
9
- import { l as DialogPortal, j as DialogRoot, k as DialogTrigger, m as DialogViewport, o as useDrawerProviderContext, q as DrawerBackdropCssVars, r as DrawerPopupCssVars, s as DrawerProviderContext, u as useDialogRootContext, t as useDrawerRootContext, v as useSwipeDismiss, w as getDisplacement, x as DrawerPopupDataAttributes, y as getElementTransform, z as DrawerVirtualKeyboardContext, A as getElementAtPoint, B as findScrollableTouchTarget, c as DrawerBackdrop, g as DrawerContent, e as DrawerPopup, b as DrawerPortal, a as DrawerRoot, D as DrawerTrigger, d as DrawerViewport, C as useScrollAreaRootContext, E as getOffset, F as ScrollAreaRootCssVars, G as scrollAreaStateAttributesMapping, H as useScrollAreaViewportContext, S as ScrollAreaRoot, f as ScrollAreaViewport } from '../ScrollAreaViewport-es.js';
9
+ import { j as DialogPortal, h as DialogRoot, i as DialogTrigger, k as DialogViewport, o as useDrawerProviderContext, q as DrawerBackdropCssVars, r as DrawerPopupCssVars, s as DrawerProviderContext, u as useDialogRootContext, t as useDrawerRootContext, v as useSwipeDismiss, w as getDisplacement, x as DrawerPopupDataAttributes, y as getElementTransform, z as DrawerVirtualKeyboardContext, A as getElementAtPoint, B as findScrollableTouchTarget, c as DrawerBackdrop, g as DrawerContent, e as DrawerPopup, b as DrawerPortal, a as DrawerRoot, D as DrawerTrigger, d as DrawerViewport, C as useScrollAreaRootContext, E as getOffset, F as ScrollAreaRootCssVars, G as scrollAreaStateAttributesMapping, H as useScrollAreaViewportContext, S as ScrollAreaRoot, f as ScrollAreaViewport } from '../ScrollAreaViewport-es.js';
10
10
  import { u as useRenderElement, f as formatErrorMessage, N as NOOP, E as EMPTY_OBJECT } from '../useRenderElement-es.js';
11
11
  import { C as CommonPopupDataAttributes, ae as useTriggerRegistration, Q as isInteractiveElement, p as popupStateMapping, r as useDirection, G as inertValue, K as mergeCleanups, am as gecko, J as webkit, w as useStore, af as triggerOpenStateMapping } from '../useScrollLock-es.js';
12
12
  import { o as getWindow, f as getComputedStyle, i as isHTMLElement, e as getParentNode } from '../floating-ui.utils.dom-es.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components",
3
- "version": "8.29.0",
3
+ "version": "8.29.1-fixselect-35e5f17.8+35e5f17e",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -473,7 +473,7 @@
473
473
  "@types/lodash": "^4.14.136",
474
474
  "@types/react-router": "5.1.7",
475
475
  "@types/react-router-dom": "^5.3.3",
476
- "axios": "^1.11.0",
476
+ "axios": "^1.18.0",
477
477
  "classnames": "^2.3.2",
478
478
  "color": "^3.1.2",
479
479
  "filesize": "^6.1.0",
@@ -492,7 +492,7 @@
492
492
  "@apollo/client": "^3.7.10",
493
493
  "@csstools/postcss-global-data": "^1.0.3",
494
494
  "@jobber/design": "0.109.0",
495
- "@jobber/hooks": "2.21.0",
495
+ "@jobber/hooks": "2.21.1-fixselect-35e5f17.128+35e5f17e",
496
496
  "@rollup/plugin-alias": "^5.1.0",
497
497
  "@rollup/plugin-commonjs": "^25.0.7",
498
498
  "@rollup/plugin-node-resolve": "15.2.3",
@@ -530,7 +530,7 @@
530
530
  "@jobber/design": "*",
531
531
  "@jobber/hooks": ">=2",
532
532
  "@tanstack/react-table": "^8",
533
- "axios": "^1.11.0",
533
+ "axios": "^1.18.0",
534
534
  "classnames": "^2",
535
535
  "color": "^4",
536
536
  "filesize": "^6",
@@ -545,5 +545,5 @@
545
545
  "> 1%",
546
546
  "IE 10"
547
547
  ],
548
- "gitHead": "c81a2b04748119a1bd84cc39f4f5e7a97c410afb"
548
+ "gitHead": "35e5f17e1a76af9c70f7d38a65caf0be8b47cd6a"
549
549
  }
@@ -1 +0,0 @@
1
- export declare const SMALL_SCREEN_BREAKPOINT = 490;