@jobber/components 7.11.0 → 7.11.1

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.
Files changed (3) hide show
  1. package/dist/Menu-cjs.js +22 -4
  2. package/dist/Menu-es.js +22 -4
  3. package/package.json +2 -2
package/dist/Menu-cjs.js CHANGED
@@ -367,6 +367,17 @@ function getTextContent(node) {
367
367
  }
368
368
  return getTextContent(node.props.children);
369
369
  }
370
+ function getBottomSheetContentStyle(style) {
371
+ if (!style) {
372
+ return undefined;
373
+ }
374
+ const safeStyle = Object.assign({}, style);
375
+ delete safeStyle.height;
376
+ delete safeStyle.maxHeight;
377
+ delete safeStyle.minHeight;
378
+ delete safeStyle.width;
379
+ return safeStyle;
380
+ }
370
381
  // Bottom sheet menu interaction helpers. These adapt Drawer semantics into the
371
382
  // menu-style keyboard and focus behavior we want for the mobile shell.
372
383
  function getNavigableMenuItems(target) {
@@ -514,11 +525,12 @@ function BottomSheetContent({ children, style, className, UNSAFE_style, UNSAFE_c
514
525
  UNSAFE_className,
515
526
  UNSAFE_style,
516
527
  });
528
+ const bottomSheetStyle = getBottomSheetContentStyle(resolvedBaseProps.style);
517
529
  return (React.createElement(BottomSheet.BottomSheet.Popup, { initialFocus: getInitialBottomSheetFocus(menuRef, focusModalityRef), className: classnames({
518
530
  [styles.menuHidden]: submenuOpen,
519
531
  }) },
520
532
  React.createElement(BottomSheet.BottomSheet.Content, null,
521
- React.createElement(BottomSheetMenuSurface, { menuRef: menuRef, className: classnames(styles.bottomSheetMenuContent, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
533
+ React.createElement(BottomSheetMenuSurface, { menuRef: menuRef, className: classnames(styles.bottomSheetMenuContent, resolvedBaseProps.className), style: bottomSheetStyle }, children))));
522
534
  }
523
535
  function BottomSheetSeparator({ style, className, UNSAFE_style, UNSAFE_className, }) {
524
536
  const resolvedBaseProps = resolveComposableBaseProps({
@@ -666,8 +678,9 @@ function BottomSheetSubmenuContent({ children, className, style, UNSAFE_style, U
666
678
  UNSAFE_className,
667
679
  UNSAFE_style,
668
680
  });
681
+ const bottomSheetStyle = getBottomSheetContentStyle(resolvedBaseProps.style);
669
682
  return (React.createElement(BottomSheet.BottomSheet.Popup, { initialFocus: getInitialBottomSheetFocus(menuRef, focusModalityRef), className: classnames(styles.menu, styles.bottomSheetSubmenuPopup) },
670
- React.createElement(BottomSheet.BottomSheet.Content, { style: resolvedBaseProps.style },
683
+ React.createElement(BottomSheet.BottomSheet.Content, { style: bottomSheetStyle },
671
684
  title ? (React.createElement(MenuSubmenuTrigger$1.DrawerTitle, { className: styles.screenReaderOnly }, title)) : null,
672
685
  React.createElement("div", { className: styles$1.submenuHeader },
673
686
  React.createElement(MenuSubmenuTrigger$1.DrawerClose, { "aria-label": title ? `Back to ${title}` : "Back", render: React.createElement(Button.Button, { ariaLabel: title ? `Back to ${title}` : "Back", icon: "arrowLeft", type: "tertiary", variation: "subtle" }) }),
@@ -721,6 +734,9 @@ function getFloatingLayerStyle(style) {
721
734
  return undefined;
722
735
  return { zIndex: style.zIndex };
723
736
  }
737
+ function getMenuPopupStyle(style) {
738
+ return Object.assign({ maxHeight: `min(${MENU_MAX_HEIGHT_PERCENTAGE}vh, max(0px, calc(var(--available-height) - var(--space-base))))` }, style);
739
+ }
724
740
  function MenuDropdownRoot({ children, onOpenChange, open, defaultOpen, }) {
725
741
  const actionsRef = React.useRef(null);
726
742
  return (React.createElement(MenuDropdownContext.Provider, { value: {
@@ -754,9 +770,10 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
754
770
  });
755
771
  const [side = "bottom", align = "start"] = (_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : [];
756
772
  const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
773
+ const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
757
774
  return (React.createElement(MenuSubmenuTrigger$1.MenuPortal, null,
758
775
  React.createElement(MenuSubmenuTrigger$1.MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: align, side: side, sideOffset: MENU_OFFSET },
759
- React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
776
+ React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: popupStyle }, children))));
760
777
  }
761
778
  function MenuDropdownRadioGroup({ children, value, defaultValue, onValueChange, className, style, UNSAFE_style, UNSAFE_className, }) {
762
779
  const resolvedBaseProps = resolveComposableBaseProps({
@@ -847,9 +864,10 @@ function MenuDropdownSubmenuContent({ children, className, style, UNSAFE_style,
847
864
  UNSAFE_style,
848
865
  });
849
866
  const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
867
+ const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
850
868
  return (React.createElement(MenuSubmenuTrigger$1.MenuPortal, null,
851
869
  React.createElement(MenuSubmenuTrigger$1.MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: "start", side: "right", sideOffset: MENU_OFFSET },
852
- React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
870
+ React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: popupStyle }, children))));
853
871
  }
854
872
  function MenuDropdownGroupLabel(props) {
855
873
  const { className, style } = resolveComposableBaseProps(props);
package/dist/Menu-es.js CHANGED
@@ -365,6 +365,17 @@ function getTextContent(node) {
365
365
  }
366
366
  return getTextContent(node.props.children);
367
367
  }
368
+ function getBottomSheetContentStyle(style) {
369
+ if (!style) {
370
+ return undefined;
371
+ }
372
+ const safeStyle = Object.assign({}, style);
373
+ delete safeStyle.height;
374
+ delete safeStyle.maxHeight;
375
+ delete safeStyle.minHeight;
376
+ delete safeStyle.width;
377
+ return safeStyle;
378
+ }
368
379
  // Bottom sheet menu interaction helpers. These adapt Drawer semantics into the
369
380
  // menu-style keyboard and focus behavior we want for the mobile shell.
370
381
  function getNavigableMenuItems(target) {
@@ -512,11 +523,12 @@ function BottomSheetContent({ children, style, className, UNSAFE_style, UNSAFE_c
512
523
  UNSAFE_className,
513
524
  UNSAFE_style,
514
525
  });
526
+ const bottomSheetStyle = getBottomSheetContentStyle(resolvedBaseProps.style);
515
527
  return (React__default.createElement(BottomSheet.Popup, { initialFocus: getInitialBottomSheetFocus(menuRef, focusModalityRef), className: classnames({
516
528
  [styles.menuHidden]: submenuOpen,
517
529
  }) },
518
530
  React__default.createElement(BottomSheet.Content, null,
519
- React__default.createElement(BottomSheetMenuSurface, { menuRef: menuRef, className: classnames(styles.bottomSheetMenuContent, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
531
+ React__default.createElement(BottomSheetMenuSurface, { menuRef: menuRef, className: classnames(styles.bottomSheetMenuContent, resolvedBaseProps.className), style: bottomSheetStyle }, children))));
520
532
  }
521
533
  function BottomSheetSeparator({ style, className, UNSAFE_style, UNSAFE_className, }) {
522
534
  const resolvedBaseProps = resolveComposableBaseProps({
@@ -664,8 +676,9 @@ function BottomSheetSubmenuContent({ children, className, style, UNSAFE_style, U
664
676
  UNSAFE_className,
665
677
  UNSAFE_style,
666
678
  });
679
+ const bottomSheetStyle = getBottomSheetContentStyle(resolvedBaseProps.style);
667
680
  return (React__default.createElement(BottomSheet.Popup, { initialFocus: getInitialBottomSheetFocus(menuRef, focusModalityRef), className: classnames(styles.menu, styles.bottomSheetSubmenuPopup) },
668
- React__default.createElement(BottomSheet.Content, { style: resolvedBaseProps.style },
681
+ React__default.createElement(BottomSheet.Content, { style: bottomSheetStyle },
669
682
  title ? (React__default.createElement(DrawerTitle, { className: styles.screenReaderOnly }, title)) : null,
670
683
  React__default.createElement("div", { className: styles$1.submenuHeader },
671
684
  React__default.createElement(DrawerClose, { "aria-label": title ? `Back to ${title}` : "Back", render: React__default.createElement(Button, { ariaLabel: title ? `Back to ${title}` : "Back", icon: "arrowLeft", type: "tertiary", variation: "subtle" }) }),
@@ -719,6 +732,9 @@ function getFloatingLayerStyle(style) {
719
732
  return undefined;
720
733
  return { zIndex: style.zIndex };
721
734
  }
735
+ function getMenuPopupStyle(style) {
736
+ return Object.assign({ maxHeight: `min(${MENU_MAX_HEIGHT_PERCENTAGE}vh, max(0px, calc(var(--available-height) - var(--space-base))))` }, style);
737
+ }
722
738
  function MenuDropdownRoot({ children, onOpenChange, open, defaultOpen, }) {
723
739
  const actionsRef = React__default.useRef(null);
724
740
  return (React__default.createElement(MenuDropdownContext.Provider, { value: {
@@ -752,9 +768,10 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
752
768
  });
753
769
  const [side = "bottom", align = "start"] = (_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : [];
754
770
  const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
771
+ const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
755
772
  return (React__default.createElement(MenuPortal$1, null,
756
773
  React__default.createElement(MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: align, side: side, sideOffset: MENU_OFFSET },
757
- React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
774
+ React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: popupStyle }, children))));
758
775
  }
759
776
  function MenuDropdownRadioGroup({ children, value, defaultValue, onValueChange, className, style, UNSAFE_style, UNSAFE_className, }) {
760
777
  const resolvedBaseProps = resolveComposableBaseProps({
@@ -845,9 +862,10 @@ function MenuDropdownSubmenuContent({ children, className, style, UNSAFE_style,
845
862
  UNSAFE_style,
846
863
  });
847
864
  const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
865
+ const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
848
866
  return (React__default.createElement(MenuPortal$1, null,
849
867
  React__default.createElement(MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: "start", side: "right", sideOffset: MENU_OFFSET },
850
- React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: resolvedBaseProps.style }, children))));
868
+ React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.ariaMenu, resolvedBaseProps.className), style: popupStyle }, children))));
851
869
  }
852
870
  function MenuDropdownGroupLabel(props) {
853
871
  const { className, style } = resolveComposableBaseProps(props);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components",
3
- "version": "7.11.0",
3
+ "version": "7.11.1",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -583,5 +583,5 @@
583
583
  "> 1%",
584
584
  "IE 10"
585
585
  ],
586
- "gitHead": "14ecce46591dca3705c736c86431ac5f9561e19f"
586
+ "gitHead": "fc0926142d58292477038a22f8ca9608997461e5"
587
587
  }