@jobber/components 7.13.0 → 7.13.1

package/dist/Menu-cjs.js

@@ -200,7 +200,7 @@ function MenuPortal({ children }) {
 
 var styles$1 = {"submenuHeader":"Vw9MFreevMU-","submenuTitle":"wpNMcBuNwwY-","spinning":"nOEBQCC4Cos-"};
 
-var styles = {"wrapper":"fpi0W91w2ag-","floatingContainer":"ba-Kj6mvQUw-","menu":"-DayvgvIcVo-","legacySection":"VsRRunpS6Yo-","separator":"jnggqK3YTIU-","triggerWrapper":"oRQQVVq-yxA-","composableMenu":"atokGnmWVls-","bottomSheetMenuContent":"J3CW8IU48RM-","composableItem":"zSMkwrZodBk-","composableItemNoLeadingSlot":"qbDWOwkPouM-","composableSection":"_353OIWGazfE-","composableGroup":"Q0ssxff-Qo4-","composableRadioGroup":"_2VyPM45lQBE-","composableSectionHeader":"efA-ozx9w0w-","composableGroupHeader":"BklkzNPbJ5Q-","composableGroupLabel":"_5-p9DbyRav4-","sectionHeader":"Bq7pLWj3jm4-","legacyAction":"P4Sdaq0-lZs-","action":"M1BgN-oCmKw-","destructive":"U9ihZZavz9w-","overlay":"_7we5hh6kYs8-","bottomSheetSubmenuPopup":"nf47GCAYI-c-","menuHidden":"cuw8ct7rX6s-","bottomSheetSubmenuBody":"a6uZEXgX8sg-","fullWidth":"_5OJ7B6mFcwk-","screenReaderOnly":"Bzvkz60bwWE-","spinning":"_0-VzuzHdi8o-"};
+var styles = {"wrapper":"fpi0W91w2ag-","floatingContainer":"ba-Kj6mvQUw-","menu":"-DayvgvIcVo-","legacySection":"VsRRunpS6Yo-","separator":"jnggqK3YTIU-","triggerWrapper":"oRQQVVq-yxA-","composableMenu":"atokGnmWVls-","composableDropdownPopup":"Uk14qmg-Fqc-","composableDropdownScroller":"CJKnGqldjF0-","bottomSheetMenuContent":"J3CW8IU48RM-","composableItem":"zSMkwrZodBk-","composableItemNoLeadingSlot":"qbDWOwkPouM-","composableSection":"_353OIWGazfE-","composableGroup":"Q0ssxff-Qo4-","composableRadioGroup":"_2VyPM45lQBE-","composableSectionHeader":"efA-ozx9w0w-","composableGroupHeader":"BklkzNPbJ5Q-","composableGroupLabel":"_5-p9DbyRav4-","sectionHeader":"Bq7pLWj3jm4-","legacyAction":"P4Sdaq0-lZs-","action":"M1BgN-oCmKw-","destructive":"U9ihZZavz9w-","overlay":"_7we5hh6kYs8-","bottomSheetSubmenuPopup":"nf47GCAYI-c-","menuHidden":"cuw8ct7rX6s-","bottomSheetSubmenuBody":"a6uZEXgX8sg-","fullWidth":"_5OJ7B6mFcwk-","screenReaderOnly":"Bzvkz60bwWE-","spinning":"_0-VzuzHdi8o-"};
 
 function mergeUnsafeProps(props) {
     return useRenderElement.mergeProps({
@@ -788,7 +788,8 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React.createElement(MenuSubmenuTrigger$1.MenuPortal, null,
         React.createElement(MenuSubmenuTrigger$1.MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: align, side: side, sideOffset: MENU_OFFSET },
-            React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.composableMenu, resolvedBaseProps.className), style: popupStyle }, children))));
+            React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.composableDropdownPopup, resolvedBaseProps.className), style: popupStyle },
+                React.createElement("div", { className: classnames(styles.composableMenu, styles.composableDropdownScroller) }, children)))));
 }
 function MenuDropdownRadioGroup({ children, value, defaultValue, onValueChange, className, style, UNSAFE_style, UNSAFE_className, }) {
     const resolvedBaseProps = resolveComposableBaseProps({
@@ -882,7 +883,8 @@ function MenuDropdownSubmenuContent({ children, className, style, UNSAFE_style,
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React.createElement(MenuSubmenuTrigger$1.MenuPortal, null,
         React.createElement(MenuSubmenuTrigger$1.MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: "start", side: "right", sideOffset: MENU_OFFSET },
-            React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.composableMenu, resolvedBaseProps.className), style: popupStyle }, children))));
+            React.createElement(MenuSubmenuTrigger$1.MenuPopup, { className: classnames(styles.menu, styles.composableDropdownPopup, resolvedBaseProps.className), style: popupStyle },
+                React.createElement("div", { className: classnames(styles.composableMenu, styles.composableDropdownScroller) }, children)))));
 }
 function MenuDropdownGroupLabel(props) {
     const { className, style } = resolveComposableBaseProps(props);

package/dist/Menu-es.js

@@ -198,7 +198,7 @@ function MenuPortal({ children }) {
 
 var styles$1 = {"submenuHeader":"Vw9MFreevMU-","submenuTitle":"wpNMcBuNwwY-","spinning":"nOEBQCC4Cos-"};
 
-var styles = {"wrapper":"fpi0W91w2ag-","floatingContainer":"ba-Kj6mvQUw-","menu":"-DayvgvIcVo-","legacySection":"VsRRunpS6Yo-","separator":"jnggqK3YTIU-","triggerWrapper":"oRQQVVq-yxA-","composableMenu":"atokGnmWVls-","bottomSheetMenuContent":"J3CW8IU48RM-","composableItem":"zSMkwrZodBk-","composableItemNoLeadingSlot":"qbDWOwkPouM-","composableSection":"_353OIWGazfE-","composableGroup":"Q0ssxff-Qo4-","composableRadioGroup":"_2VyPM45lQBE-","composableSectionHeader":"efA-ozx9w0w-","composableGroupHeader":"BklkzNPbJ5Q-","composableGroupLabel":"_5-p9DbyRav4-","sectionHeader":"Bq7pLWj3jm4-","legacyAction":"P4Sdaq0-lZs-","action":"M1BgN-oCmKw-","destructive":"U9ihZZavz9w-","overlay":"_7we5hh6kYs8-","bottomSheetSubmenuPopup":"nf47GCAYI-c-","menuHidden":"cuw8ct7rX6s-","bottomSheetSubmenuBody":"a6uZEXgX8sg-","fullWidth":"_5OJ7B6mFcwk-","screenReaderOnly":"Bzvkz60bwWE-","spinning":"_0-VzuzHdi8o-"};
+var styles = {"wrapper":"fpi0W91w2ag-","floatingContainer":"ba-Kj6mvQUw-","menu":"-DayvgvIcVo-","legacySection":"VsRRunpS6Yo-","separator":"jnggqK3YTIU-","triggerWrapper":"oRQQVVq-yxA-","composableMenu":"atokGnmWVls-","composableDropdownPopup":"Uk14qmg-Fqc-","composableDropdownScroller":"CJKnGqldjF0-","bottomSheetMenuContent":"J3CW8IU48RM-","composableItem":"zSMkwrZodBk-","composableItemNoLeadingSlot":"qbDWOwkPouM-","composableSection":"_353OIWGazfE-","composableGroup":"Q0ssxff-Qo4-","composableRadioGroup":"_2VyPM45lQBE-","composableSectionHeader":"efA-ozx9w0w-","composableGroupHeader":"BklkzNPbJ5Q-","composableGroupLabel":"_5-p9DbyRav4-","sectionHeader":"Bq7pLWj3jm4-","legacyAction":"P4Sdaq0-lZs-","action":"M1BgN-oCmKw-","destructive":"U9ihZZavz9w-","overlay":"_7we5hh6kYs8-","bottomSheetSubmenuPopup":"nf47GCAYI-c-","menuHidden":"cuw8ct7rX6s-","bottomSheetSubmenuBody":"a6uZEXgX8sg-","fullWidth":"_5OJ7B6mFcwk-","screenReaderOnly":"Bzvkz60bwWE-","spinning":"_0-VzuzHdi8o-"};
 
 function mergeUnsafeProps(props) {
     return mergeProps({
@@ -786,7 +786,8 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React__default.createElement(MenuPortal$1, null,
         React__default.createElement(MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: align, side: side, sideOffset: MENU_OFFSET },
-            React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.composableMenu, resolvedBaseProps.className), style: popupStyle }, children))));
+            React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.composableDropdownPopup, resolvedBaseProps.className), style: popupStyle },
+                React__default.createElement("div", { className: classnames(styles.composableMenu, styles.composableDropdownScroller) }, children)))));
 }
 function MenuDropdownRadioGroup({ children, value, defaultValue, onValueChange, className, style, UNSAFE_style, UNSAFE_className, }) {
     const resolvedBaseProps = resolveComposableBaseProps({
@@ -880,7 +881,8 @@ function MenuDropdownSubmenuContent({ children, className, style, UNSAFE_style,
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React__default.createElement(MenuPortal$1, null,
         React__default.createElement(MenuPositioner, { className: styles.floatingContainer, style: floatingLayerStyle, align: "start", side: "right", sideOffset: MENU_OFFSET },
-            React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.composableMenu, resolvedBaseProps.className), style: popupStyle }, children))));
+            React__default.createElement(MenuPopup, { className: classnames(styles.menu, styles.composableDropdownPopup, resolvedBaseProps.className), style: popupStyle },
+                React__default.createElement("div", { className: classnames(styles.composableMenu, styles.composableDropdownScroller) }, children)))));
 }
 function MenuDropdownGroupLabel(props) {
     const { className, style } = resolveComposableBaseProps(props);

package/dist/docs/Menu/Menu.md

@@ -57,6 +57,13 @@ opens up a second sheet that displays the nested menu items.
 When a user is on a small screen such as a mobile device, the menu opens up as a
 sheet anchored to the bottom of the screen.
 
+#### Native mobile
+
+Atlantis does not provide a native `Menu` equivalent in
+`@jobber/components-native`. For a comparable mobile-native experience, use
+[`BottomSheet`](/components/BottomSheet) from `@jobber/components-native` to
+present a list of actions or choices.
+
 ## Variants
 
 #### Menu Items
@@ -206,6 +213,8 @@ Minimum menu item height:
 
 * To trigger a single action rather than presenting a list of options, use a
   [Button](../Button/Button.md) or [IconButton](/components/IconButton)
+* For a comparable action-list experience in native mobile, use
+  [BottomSheet](/components/BottomSheet) from `@jobber/components-native`
 * To allow the user to choose a value from a predefined list within a form, use
   a [Select](../Select/Select.md)
 * To allow the user to search and filter through a list of options, use a

package/dist/styles.css

@@ -3507,6 +3507,44 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
   grid-template-columns: auto 1fr auto;
 }
 
+@media (min-width: 490px) {
+
+.Uk14qmg-Fqc- {
+    padding: 0;
+    overflow: hidden;
+}
+  }
+
+@media (--small-screens-and-up) {
+
+.Uk14qmg-Fqc- {
+    padding: 0;
+    overflow: hidden;
+}
+  }
+
+@media (min-width: 490px) {
+
+.CJKnGqldjF0- {
+    max-height: inherit;
+    box-sizing: border-box;
+    padding: var(--menu-space);
+    border-radius: inherit;
+    overflow: auto;
+}
+  }
+
+@media (--small-screens-and-up) {
+
+.CJKnGqldjF0- {
+    max-height: inherit;
+    box-sizing: border-box;
+    padding: var(--menu-space);
+    border-radius: inherit;
+    overflow: auto;
+}
+  }
+
 .J3CW8IU48RM- {
   --menu-space: var(--space-base);
   --menu-item-gap: var(--space-small);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "7.13.0",
+  "version": "7.13.1",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -583,5 +583,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "54cf83958f2d29a8c4ccc7f96f4a406717cc4c51"
+  "gitHead": "ec28f7b4e74ddcbd657fba00ffff257bb2c0ccaf"
 }