@jobber/components 8.23.1 → 8.24.1

package/dist/Avatar-cjs.js

@@ -41,6 +41,7 @@ function deconstructCssCustomProperty(color) {
         .trim();
 }
 
+const MAX_VISIBLE_INITIALS = 3;
 function Avatar({ imageUrl, name, initials, size = "base", color, UNSAFE_className = {}, UNSAFE_style = {}, }) {
     const style = Object.assign({ backgroundColor: color, borderColor: color }, UNSAFE_style.container);
     if (imageUrl) {
@@ -72,9 +73,9 @@ function Initials({ initials, iconColor = "textReverse", iconSize = "base", UNSA
         return (React.createElement(Icon.Icon, { name: "person", color: iconColor, size: iconSize, UNSAFE_className: UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.fallbackIcon, UNSAFE_style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.fallbackIcon }));
     }
     const className = classnames(styles.initials, UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.initials, {
-        [styles.smallInitials]: initials.length > 2,
+        [styles.smallInitials]: initials.length >= MAX_VISIBLE_INITIALS,
     });
-    return (React.createElement("span", { className: className, style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.initials }, initials.substr(0, 3)));
+    return (React.createElement("span", { className: className, style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.initials }, initials.slice(0, MAX_VISIBLE_INITIALS)));
 }
 
 exports.Avatar = Avatar;

package/dist/Avatar-es.js

@@ -39,6 +39,7 @@ function deconstructCssCustomProperty(color) {
         .trim();
 }
 
+const MAX_VISIBLE_INITIALS = 3;
 function Avatar({ imageUrl, name, initials, size = "base", color, UNSAFE_className = {}, UNSAFE_style = {}, }) {
     const style = Object.assign({ backgroundColor: color, borderColor: color }, UNSAFE_style.container);
     if (imageUrl) {
@@ -70,9 +71,9 @@ function Initials({ initials, iconColor = "textReverse", iconSize = "base", UNSA
         return (React__default.createElement(Icon, { name: "person", color: iconColor, size: iconSize, UNSAFE_className: UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.fallbackIcon, UNSAFE_style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.fallbackIcon }));
     }
     const className = classnames(styles.initials, UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.initials, {
-        [styles.smallInitials]: initials.length > 2,
+        [styles.smallInitials]: initials.length >= MAX_VISIBLE_INITIALS,
     });
-    return (React__default.createElement("span", { className: className, style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.initials }, initials.substr(0, 3)));
+    return (React__default.createElement("span", { className: className, style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.initials }, initials.slice(0, MAX_VISIBLE_INITIALS)));
 }
 
 export { Avatar as A };

package/dist/Menu/menuComposableTypes.d.ts

@@ -1,7 +1,10 @@
 import type React from "react";
 import type { CSSProperties, ComponentPropsWithRef, ReactNode } from "react";
-import type { Placement } from "@react-types/overlays";
+import type { MenuPositionerProps } from "@base-ui/react/menu";
 import type { IconProps } from "../Icon";
+export type MenuSide = NonNullable<MenuPositionerProps["side"]>;
+export type MenuAlign = NonNullable<MenuPositionerProps["align"]>;
+export type MenuPlacement = MenuSide | `${MenuSide} ${MenuAlign}`;
 export interface BaseProps {
     /**
      * @deprecated Use `style` instead.
@@ -49,7 +52,7 @@ export interface ComposableMenuItemIconProps extends IconProps {
 }
 export interface ComposableMenuContentProps extends BaseProps {
     readonly children: ReactNode;
-    readonly preferredPlacement?: Placement;
+    readonly preferredPlacement?: MenuPlacement;
 }
 export interface ComposableMenuSubmenuContentProps extends BaseProps {
     readonly children: ReactNode;

package/dist/Menu-cjs.js

@@ -740,7 +740,8 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
         UNSAFE_className,
         UNSAFE_style,
     });
-    const [side = "bottom", align = "start"] = (_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : [];
+    // Safe assertion: MenuPlacement is a bare side or a "side align" pair.
+    const [side = "bottom", align = "start"] = ((_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : []);
     const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React.createElement(MenuSubmenuTrigger$1.MenuPortal, null,

package/dist/Menu-es.js

@@ -738,7 +738,8 @@ function MenuDropdownContent({ children, style, className, preferredPlacement, U
         UNSAFE_className,
         UNSAFE_style,
     });
-    const [side = "bottom", align = "start"] = (_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : [];
+    // Safe assertion: MenuPlacement is a bare side or a "side align" pair.
+    const [side = "bottom", align = "start"] = ((_a = preferredPlacement === null || preferredPlacement === void 0 ? void 0 : preferredPlacement.split(" ")) !== null && _a !== void 0 ? _a : []);
     const floatingLayerStyle = getFloatingLayerStyle(resolvedBaseProps.style);
     const popupStyle = getMenuPopupStyle(resolvedBaseProps.style);
     return (React__default.createElement(MenuPortal$1, null,

package/dist/docs/Menu/Menu.md

@@ -266,6 +266,10 @@ A structural container for menu content. It typically contains one or more
 `Menu.GroupLabel`, and `Menu.Separator`.
 
 Use `preferredPlacement` to influence desktop dropdown placement when needed.
+Values follow Base UI's positioner vocabulary: a side (`top`, `bottom`, `left`,
+`right`, `inline-start`, `inline-end`), optionally followed by an alignment
+(`start`, `center`, `end`) — for example `"bottom"`, `"bottom end"`, or
+`"right start"`. When omitted, the menu opens at `"bottom start"`.
 
 ***Menu.Item (Strongly recommended)***
 
@@ -464,7 +468,7 @@ and should not be used for new implementations.
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
 | `className` | `string` | No | — |  |
-| `preferredPlacement` | `Placement` | No | — |  |
+| `preferredPlacement` | `MenuPlacement` | No | — |  |
 | `style` | `CSSProperties` | No | — |  |
 | `UNSAFE_className` | `string` | No | — | @deprecated Use `className` instead. This is kept for backward compatibility on the composable Menu pieces. |
 | `UNSAFE_style` | `CSSProperties` | No | — | @deprecated Use `style` instead. This is kept for backward compatibility on the composable Menu pieces. |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "8.23.1",
+  "version": "8.24.1",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -463,7 +463,6 @@
     "@floating-ui/react": "^0.27.5",
     "@floating-ui/utils": "0.2.11",
     "@jobber/formatters": "^0.5.0",
-    "@react-types/overlays": "^3.9.4",
     "@tanstack/react-table": "8.5.13",
     "@types/color": "^3.0.1",
     "@types/lodash": "^4.14.136",
@@ -541,5 +540,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "4ff53473f675f2194aaa2834e83a86b160c3ee16"
+  "gitHead": "b17211eb3d332daef1d38c66b5677c30598331f3"
 }