@uniformdev/design-system 19.211.0 → 19.211.1-alpha.11

package/dist/esm/index.js

@@ -11836,7 +11836,7 @@ var avatarSize2xlStyles = css18`
 `;
 
 // src/components/Avatar/Avatar.tsx
-import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs7 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs7 } from "@emotion/react/jsx-runtime";
 var avatarSizeStylesMap = {
   "2xs": avatarSize2xsStyles,
   xs: avatarSizeXsStyles,
@@ -11846,13 +11846,21 @@ var avatarSizeStylesMap = {
   xl: avatarSizeXlStyles,
   "2xl": avatarSize2xlStyles
 };
-var Avatar = ({ src, label = "", children, size = "md", as = "div", ...props }) => {
+var Avatar = ({
+  src,
+  label = "",
+  children,
+  size = "md",
+  as = "div",
+  labelWithoutPortal,
+  ...props
+}) => {
   const Element = as;
-  const body = /* @__PURE__ */ jsx20(Fragment4, { children: /* @__PURE__ */ jsxs7(Element, { css: [avatarStyles, avatarSizeStylesMap[size]], ...props, children: [
-    src ? /* @__PURE__ */ jsx20("img", { role: "presentation", src, css: avatarImageStyles }) : children ? null : /* @__PURE__ */ jsx20(CgProfile, { css: avatarImageStyles }),
+  const body = /* @__PURE__ */ jsxs7(Element, { css: [avatarStyles, avatarSizeStylesMap[size]], ...props, children: [
+    src ? /* @__PURE__ */ jsx20("img", { role: "presentation", src, css: avatarImageStyles, referrerPolicy: "no-referrer" }) : children ? null : /* @__PURE__ */ jsx20(CgProfile, { css: avatarImageStyles }),
     children
-  ] }) });
-  return src || children ? /* @__PURE__ */ jsx20(Tooltip, { title: label, children: body }) : body;
+  ] });
+  return src || children ? /* @__PURE__ */ jsx20(Tooltip, { title: label, withoutPortal: labelWithoutPortal, children: body }) : body;
 };
 
 // src/components/Avatar/AvatarGroup.styles.ts
@@ -11884,6 +11892,7 @@ var AvatarGroup = ({
   max = 5,
   children,
   getTruncatedLabel = defaultGetTruncatedLabel,
+  truncatedProps,
   ...props
 }) => {
   if (max < 2) {
@@ -11903,10 +11912,18 @@ var AvatarGroup = ({
       ...props,
       children: [
         childrenToRender,
-        !numberOfTruncatedItems ? null : /* @__PURE__ */ jsxs8(Avatar, { label: getTruncatedLabel(numberOfTruncatedItems), style: { display: "flex" }, children: [
-          "+",
-          numberOfTruncatedItems
-        ] })
+        !numberOfTruncatedItems ? null : /* @__PURE__ */ jsxs8(
+          Avatar,
+          {
+            ...truncatedProps,
+            label: getTruncatedLabel(numberOfTruncatedItems),
+            style: { display: "flex" },
+            children: [
+              "+",
+              numberOfTruncatedItems
+            ]
+          }
+        )
       ]
     }
   );
@@ -13519,7 +13536,7 @@ var DebouncedInputKeywordSearch = forwardRef8(
 
 // src/components/Input/InputSelect.tsx
 import { forwardRef as forwardRef9 } from "react";
-import { Fragment as Fragment5, jsx as jsx44, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx44, jsxs as jsxs23 } from "@emotion/react/jsx-runtime";
 var InputSelect = forwardRef9(
   ({
     label,
@@ -13542,7 +13559,7 @@ var InputSelect = forwardRef9(
         css: [inputContainer, typeof classNameContainer === "object" ? classNameContainer : void 0],
         className: typeof classNameContainer === "string" ? classNameContainer : "",
         children: [
-          showLabel ? /* @__PURE__ */ jsx44(Fragment5, { children: /* @__PURE__ */ jsxs23(
+          showLabel ? /* @__PURE__ */ jsx44(Fragment4, { children: /* @__PURE__ */ jsxs23(
             Label,
             {
               htmlFor: props.id,
@@ -13821,10 +13838,10 @@ var SuccessMessage = ({ message, testId, ...props }) => {
 
 // src/components/Input/Textarea.tsx
 import { forwardRef as forwardRef12 } from "react";
-import { Fragment as Fragment6, jsx as jsx49, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx49, jsxs as jsxs27 } from "@emotion/react/jsx-runtime";
 var Textarea = forwardRef12(
   ({ label, icon, id, caption, showLabel = true, errorMessage, warningMessage, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs27(Fragment6, { children: [
+    return /* @__PURE__ */ jsxs27(Fragment5, { children: [
       showLabel ? /* @__PURE__ */ jsx49("label", { htmlFor: id, css: [labelText], children: label }) : null,
       /* @__PURE__ */ jsxs27("div", { css: [inputContainer], children: [
         /* @__PURE__ */ jsx49(
@@ -14077,7 +14094,7 @@ var wholeButtonWithMenuIconOffset = css38`
 `;
 
 // src/components/ButtonWithMenu/ButtonWithMenu.tsx
-import { Fragment as Fragment7, jsx as jsx52, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx52, jsxs as jsxs30 } from "@emotion/react/jsx-runtime";
 var buttonTheme = {
   primary: buttonPrimary2,
   secondary: buttonSecondary2,
@@ -14162,7 +14179,7 @@ var ButtonWithMenu = ({
         ],
         "data-testid": "multioptions-button",
         children: [
-          /* @__PURE__ */ jsx52(Tooltip, { visible: tip ? void 0 : false, title: /* @__PURE__ */ jsx52(Fragment7, { children: tip }), children: /* @__PURE__ */ jsx52("span", { children: primaryButton }) }),
+          /* @__PURE__ */ jsx52(Tooltip, { visible: tip ? void 0 : false, title: /* @__PURE__ */ jsx52(Fragment6, { children: tip }), children: /* @__PURE__ */ jsx52("span", { children: primaryButton }) }),
           disabledValue ? menuButton2 : /* @__PURE__ */ jsx52(
             Menu,
             {
@@ -14506,7 +14523,7 @@ var paragraph = css42`
 `;
 
 // src/components/Typography/Paragraph.tsx
-import { Fragment as Fragment8, jsx as jsx56 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx56 } from "@emotion/react/jsx-runtime";
 import { createElement } from "@emotion/react";
 var Paragraph = ({ className, htmlContent, children, ...pAttributes }) => {
   if (htmlContent && Array.isArray(htmlContent)) {
@@ -14520,7 +14537,7 @@ var Paragraph = ({ className, htmlContent, children, ...pAttributes }) => {
         dangerouslySetInnerHTML: { __html: html }
       }
     ));
-    return /* @__PURE__ */ jsx56(Fragment8, { children: paragraphContent });
+    return /* @__PURE__ */ jsx56(Fragment7, { children: paragraphContent });
   }
   return htmlContent ? /* @__PURE__ */ jsx56(
     "p",
@@ -14589,7 +14606,7 @@ var IntegrationHeaderSectionDocsLink = css43`
 `;
 
 // src/components/Typography/IntegrationHeaderSection.tsx
-import { Fragment as Fragment9, jsx as jsx57, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx57, jsxs as jsxs33 } from "@emotion/react/jsx-runtime";
 var IntegrationHeaderSectionHexImage = ({ ...props }) => {
   return /* @__PURE__ */ jsxs33("svg", { viewBox: "0 0 100 116", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
     /* @__PURE__ */ jsx57(
@@ -14629,7 +14646,7 @@ var IntegrationHeaderSection = ({
   ...props
 }) => {
   const CompIcon = icon && typeof icon !== "string" ? icon : null;
-  return /* @__PURE__ */ jsxs33(Fragment9, { children: [
+  return /* @__PURE__ */ jsxs33(Fragment8, { children: [
     /* @__PURE__ */ jsxs33("div", { css: IntegrationHeaderSectionContainer, ...props, children: [
       /* @__PURE__ */ jsxs33("div", { css: IntegrationHeaderSectionTitleContainer, children: [
         icon ? /* @__PURE__ */ jsxs33("div", { css: IntegrationHeaderSectionIconContainer, children: [
@@ -15151,7 +15168,7 @@ var ChipDisabled = css48`
 `;
 
 // src/components/Chip/Chip.tsx
-import { Fragment as Fragment10, jsx as jsx62, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx62, jsxs as jsxs37 } from "@emotion/react/jsx-runtime";
 var chipTheme = {
   "accent-light": ChipThemeAccentLight,
   "accent-dark": ChipThemeAccentDark,
@@ -15190,7 +15207,7 @@ var Chip = ({
       ],
       ...props,
       children: [
-        icon ? /* @__PURE__ */ jsxs37(Fragment10, { children: [
+        icon ? /* @__PURE__ */ jsxs37(Fragment9, { children: [
           /* @__PURE__ */ jsx62("span", { role: "presentation", css: [ChipIcon], children: /* @__PURE__ */ jsx62(Icon, { icon, iconColor, size: "1rem" }) }),
           /* @__PURE__ */ jsx62("span", { role: "separator", css: ChipSeparator })
         ] }) : null,
@@ -16440,7 +16457,7 @@ var DrawerContent2 = ({ children, buttonGroup, noPadding = false, ...props }) =>
 
 // src/components/Drawer/DrawerRenderer.tsx
 import { useEffect as useEffect7, useMemo as useMemo3 } from "react";
-import { Fragment as Fragment11, jsx as jsx74, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx74, jsxs as jsxs45 } from "@emotion/react/jsx-runtime";
 var drawerWidth = {
   narrow: "29rem",
   medium: "43rem",
@@ -16529,7 +16546,7 @@ var DrawerWrapper = ({
     offsetInPx = Math.round(maxLayeringInPx * relativeLevel);
   }
   const calculatedWidth = `calc(${width} - ${offsetInPx}px)`;
-  return /* @__PURE__ */ jsxs45(Fragment11, { children: [
+  return /* @__PURE__ */ jsxs45(Fragment10, { children: [
     /* @__PURE__ */ jsx74("div", { css: drawerWrapperOverlayStyles, onClick: onOverlayClick }),
     /* @__PURE__ */ jsx74(
       "div",
@@ -17171,10 +17188,10 @@ var IntegrationLoadingFrame = css64`
 `;
 
 // src/components/Tiles/IntegrationLoadingTile.tsx
-import { Fragment as Fragment12, jsx as jsx84, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx84, jsxs as jsxs52 } from "@emotion/react/jsx-runtime";
 var IntegrationLoadingTile = ({ count = 1 }) => {
   const componentCount = Array.from(Array(count).keys());
-  return /* @__PURE__ */ jsx84(Fragment12, { children: componentCount.map((i) => /* @__PURE__ */ jsxs52("div", { css: IntegrationLoadingTileContainer, children: [
+  return /* @__PURE__ */ jsx84(Fragment11, { children: componentCount.map((i) => /* @__PURE__ */ jsxs52("div", { css: IntegrationLoadingTileContainer, children: [
     /* @__PURE__ */ jsx84("div", { css: [IntegrationLoadingTileImg, IntegrationLoadingFrame], role: "presentation" }),
     /* @__PURE__ */ jsx84("div", { css: [IntegrationLoadingTileText, IntegrationLoadingFrame] })
   ] }, i)) });
@@ -17416,7 +17433,7 @@ var IntegrationModalHeaderContentWrapper = css69`
 `;
 
 // src/components/IntegrationModalHeader/IntegrationModalHeader.tsx
-import { Fragment as Fragment13, jsx as jsx90, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx90, jsxs as jsxs55 } from "@emotion/react/jsx-runtime";
 var HexModalBackground = ({ ...props }) => {
   return /* @__PURE__ */ jsxs55(
     "svg",
@@ -17457,7 +17474,7 @@ var HexModalBackground = ({ ...props }) => {
   );
 };
 var IntegrationModalHeader = ({ icon, name, menu, children }) => {
-  return /* @__PURE__ */ jsxs55(Fragment13, { children: [
+  return /* @__PURE__ */ jsxs55(Fragment12, { children: [
     /* @__PURE__ */ jsx90(HexModalBackground, { css: IntegrationModalHeaderSVGBackground, role: "presentation" }),
     /* @__PURE__ */ jsx90("div", { css: IntegrationModalHeaderGroup, children: /* @__PURE__ */ jsxs55("div", { css: IntegrationModalHeaderTitleGroup, children: [
       icon ? /* @__PURE__ */ jsx90(IntegrationModalIcon, { icon, name: name || "" }) : null,
@@ -18365,7 +18382,7 @@ import {
   usePopoverStore
 } from "@ariakit/react";
 import { useEffect as useEffect14 } from "react";
-import { Fragment as Fragment14, jsx as jsx100, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx100, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
 var Popover3 = ({
   iconColor = "action",
   icon = "info",
@@ -18392,7 +18409,7 @@ var Popover3 = ({
         css: [PopoverBtn, trigger2 ? void 0 : PopoverDefaulterTriggerBtn],
         title: buttonText,
         "data-testid": testId,
-        children: trigger2 ? trigger2 : /* @__PURE__ */ jsxs64(Fragment14, { children: [
+        children: trigger2 ? trigger2 : /* @__PURE__ */ jsxs64(Fragment13, { children: [
           /* @__PURE__ */ jsx100(Icon, { icon, iconColor, size: iconSize }),
           /* @__PURE__ */ jsx100("span", { hidden: true, children: buttonText })
         ] })
@@ -19040,7 +19057,7 @@ var CoverSelectedChip = css82`
 `;
 
 // src/components/Objects/ObjectGridItemCardCover.tsx
-import { Fragment as Fragment15, jsx as jsx106, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx106, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
 var ObjectGridItemCardCover = (props) => {
   if ("imageUrl" in props && props.imageUrl) {
     const { imageUrl, srcSet } = props;
@@ -19073,7 +19090,7 @@ var ObjectGridItemCover = ({
   coverSlotBottomRight,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs69(Fragment15, { children: [
+  return /* @__PURE__ */ jsxs69(Fragment14, { children: [
     coverSlotLeft ? /* @__PURE__ */ jsx106("div", { css: [CoverSlot, CoverSlotLeft], children: coverSlotLeft }) : null,
     /* @__PURE__ */ jsx106(ObjectGridItemCardCover, { ...props }),
     coverSlotRight ? /* @__PURE__ */ jsx106("div", { css: [CoverSlot, CoverSlotRight], children: coverSlotRight }) : null,
@@ -20045,7 +20062,7 @@ var previewModalImage = css92`
 `;
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
-import { Fragment as Fragment16, jsx as jsx120, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx120, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
 function ParameterImagePreview({ imageSrc }) {
   const [showModal, setShowModal] = useState14(false);
   return imageSrc ? /* @__PURE__ */ jsxs79("div", { css: previewWrapper, children: [
@@ -20063,7 +20080,7 @@ function ParameterImagePreview({ imageSrc }) {
   ] }) : null;
 }
 var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
-  return open ? /* @__PURE__ */ jsx120(Fragment16, { children: createPortal2(
+  return open ? /* @__PURE__ */ jsx120(Fragment15, { children: createPortal2(
     /* @__PURE__ */ jsx120(
       Modal,
       {
@@ -20265,7 +20282,7 @@ var ParameterShellPlaceholder = ({ children }) => {
 var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx123(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx123("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx123("span", { hidden: true, children: "reset overridden value to default" }) }) });
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { Fragment as Fragment17, jsx as jsx124, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx124, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
 var ParameterImage = forwardRef20(
   ({ children, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
@@ -20279,7 +20296,7 @@ var ParameterImageInner = forwardRef20((props, ref) => {
   const { value } = props;
   const { id, label, hiddenLabel, errorMessage } = useParameterShell();
   const deferredValue = useDeferredValue(value);
-  return /* @__PURE__ */ jsxs81(Fragment17, { children: [
+  return /* @__PURE__ */ jsxs81(Fragment16, { children: [
     /* @__PURE__ */ jsx124(
       "input",
       {
@@ -20453,7 +20470,7 @@ var ParameterMultiSelectInner = (props) => {
 };
 
 // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
-import { Fragment as Fragment18, jsx as jsx128, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx128, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
 var ParameterNameAndPublicIdInput = ({
   id,
   onBlur,
@@ -20479,7 +20496,7 @@ var ParameterNameAndPublicIdInput = ({
     navigator.clipboard.writeText(values[publicIdFieldName]);
   };
   autoFocus == null ? void 0 : autoFocus();
-  return /* @__PURE__ */ jsxs83(Fragment18, { children: [
+  return /* @__PURE__ */ jsxs83(Fragment17, { children: [
     /* @__PURE__ */ jsx128(
       ParameterInput,
       {
@@ -21054,7 +21071,7 @@ var getSelectedNode = (selection) => {
 };
 
 // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
-import { Fragment as Fragment19, jsx as jsx129, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx129, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
 var isProjectMapLinkValue = (value) => {
   return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
     value.nodeId && value.path && value.projectMapId
@@ -21540,7 +21557,7 @@ function LinkNodePlugin({
       });
     });
   };
-  return /* @__PURE__ */ jsxs84(Fragment19, { children: [
+  return /* @__PURE__ */ jsxs84(Fragment18, { children: [
     /* @__PURE__ */ jsx129(
       NodeEventPlugin,
       {
@@ -22086,7 +22103,7 @@ import { calculateZoomLevel } from "@lexical/utils";
 import { $getNearestNodeFromDOMNode } from "lexical";
 import { useCallback as useCallback12, useEffect as useEffect22, useMemo as useMemo6, useRef as useRef13, useState as useState18 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { Fragment as Fragment20, jsx as jsx131, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx131, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
 var MIN_ROW_HEIGHT = 33;
 var MIN_COLUMN_WIDTH = 50;
 var tableResizer = css98`
@@ -22387,7 +22404,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
     };
   }, [activeCell, draggingDirection, mouseCurrentPos, positioningAnchorEl]);
   const resizerStyles = getResizers();
-  return /* @__PURE__ */ jsx131("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs86(Fragment20, { children: [
+  return /* @__PURE__ */ jsx131("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs86(Fragment19, { children: [
     /* @__PURE__ */ jsx131(
       "div",
       {
@@ -22647,7 +22664,7 @@ var useRichTextToolbarState = ({ config }) => {
 };
 
 // src/components/ParameterInputs/rich-text/toolbar/RichTextToolbar.tsx
-import { Fragment as Fragment21, jsx as jsx132, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx132, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
 var toolbar = css99`
   ${scrollbarStyles}
   background: var(--gray-50);
@@ -22900,7 +22917,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
           children: /* @__PURE__ */ jsx132(RichTextToolbarIcon, { icon: "link" })
         }
       ) }) : null,
-      visibleLists.size > 0 ? /* @__PURE__ */ jsxs87(Fragment21, { children: [
+      visibleLists.size > 0 ? /* @__PURE__ */ jsxs87(Fragment20, { children: [
         visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx132(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx132(
           "button",
           {
@@ -22995,7 +23012,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable, onInsertAsset })
 var RichTextToolbar_default = RichTextToolbar;
 
 // src/components/ParameterInputs/ParameterRichText.tsx
-import { Fragment as Fragment22, jsx as jsx133, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx133, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
 var ParameterRichText = ({
   label,
   labelLeadingIcon,
@@ -23060,7 +23077,7 @@ var ParameterRichText = ({
             children
           }
         ),
-        menuItems ? /* @__PURE__ */ jsx133(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx133(Fragment22, { children: menuItems }) }) : null
+        menuItems ? /* @__PURE__ */ jsx133(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx133(Fragment21, { children: menuItems }) }) : null
       ]
     }
   );
@@ -23221,7 +23238,7 @@ var ParameterRichTextInner = ({
     },
     editable: !readOnly
   };
-  return /* @__PURE__ */ jsxs88(Fragment22, { children: [
+  return /* @__PURE__ */ jsxs88(Fragment21, { children: [
     /* @__PURE__ */ jsx133("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx133(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx133(
       RichText,
       {
@@ -23300,7 +23317,7 @@ var RichText = ({
       setPortalContainerRef(_portalContainerRef);
     }
   };
-  return /* @__PURE__ */ jsxs88(Fragment22, { children: [
+  return /* @__PURE__ */ jsxs88(Fragment21, { children: [
     readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx133(
       RichTextToolbar_default,
       {
@@ -23344,7 +23361,7 @@ var RichText = ({
           ]
         }
       ),
-      /* @__PURE__ */ jsx133(Fragment22, { children }),
+      /* @__PURE__ */ jsx133(Fragment21, { children }),
       editorContainerRef ? /* @__PURE__ */ jsx133(
         LinkNodePlugin,
         {
@@ -24068,14 +24085,14 @@ var SwitchText = (size) => css107`
 `;
 
 // src/components/Switch/Switch.tsx
-import { Fragment as Fragment23, jsx as jsx141, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx141, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
 var Switch = forwardRef27(
   ({ label, infoText, toggleText, children, switchSize = "base", ...inputProps }, ref) => {
     let additionalText = infoText;
     if (infoText && toggleText) {
       additionalText = inputProps.checked ? toggleText : infoText;
     }
-    return /* @__PURE__ */ jsxs93(Fragment23, { children: [
+    return /* @__PURE__ */ jsxs93(Fragment22, { children: [
       /* @__PURE__ */ jsxs93(
         "label",
         {

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import { Decorator } from '@storybook/react';
 import * as React$1 from 'react';
-import React__default, { RefObject, HTMLAttributes, MutableRefObject, ReactNode, ImgHTMLAttributes, SVGProps, InputHTMLAttributes, CSSProperties, Ref, PropsWithChildren, ButtonHTMLAttributes, FocusEventHandler, ChangeEvent, HtmlHTMLAttributes } from 'react';
+import React__default, { RefObject, ReactElement, HTMLAttributes, MutableRefObject, ReactNode, ImgHTMLAttributes, SVGProps, InputHTMLAttributes, CSSProperties, Ref, PropsWithChildren, ButtonHTMLAttributes, FocusEventHandler, ChangeEvent, HtmlHTMLAttributes } from 'react';
 import { GroupBase, Props, MultiValue, SingleValue } from 'react-select';
 export { ActionMeta, FormatOptionLabelContext, FormatOptionLabelMeta, GetOptionLabel, GetOptionValue, GroupBase, GroupHeadingProps, GroupProps, MenuListProps, MenuPlacement, MultiValue, MultiValueGenericProps, MultiValueProps, MultiValueRemoveProps, OnChangeValue, OptionContext, OptionProps, Options, OptionsOrGroups } from 'react-select';
 import * as _emotion_react from '@emotion/react';
@@ -20220,7 +20220,9 @@ type AvatarProps = {
      */
     src?: string;
     /** Renders a tooltip over the avatar. Not used if there is no `src` */
-    label?: string;
+    label?: string | ReactElement;
+    /** Renders the label without a portal. May be needed inside modal dialogs. */
+    labelWithoutPortal?: boolean;
     size?: AvatarSizeProp;
     /**
      * The HTML element to render the component as.
@@ -20232,7 +20234,7 @@ type AvatarProps = {
  * @description A component to render rounded avatars of a user or an app.
  * @example <Avatar>AB</Avatar>
  */
-declare const Avatar: ({ src, label, children, size, as, ...props }: AvatarProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Avatar: ({ src, label, children, size, as, labelWithoutPortal, ...props }: AvatarProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
@@ -20248,6 +20250,11 @@ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
      * @default (n) => `and ${n} others`
      * */
     getTruncatedLabel?: (numberOfTruncatedItems: number) => string;
+    /**
+     * Props to apply to the truncation avatar if it is shown.
+     * Needed if the group's avatars are not the default size.
+     */
+    truncatedProps?: Pick<AvatarProps, 'size' | 'as'>;
     /**
      * The children to render. This component works best when the <Avatar> component are direct children.
      * **/
@@ -20257,7 +20264,7 @@ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
  * @description Renders avatars in a group with the ability to truncate the list. This component works best when the <Avatar> component are direct children.
  * @example <AvatarGroup max={2}><Avatar>AB</Avatar><Avatar>CD</Avatar><Avatar>EF</Avatar><AvatarGroup>
  */
-declare const AvatarGroup: ({ max, children, getTruncatedLabel, ...props }: AvatarGroupProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const AvatarGroup: ({ max, children, getTruncatedLabel, truncatedProps, ...props }: AvatarGroupProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type BadgeThemeProps = 'caution' | 'info' | 'note' | 'success' | 'error' | 'unimportant';
 type SizeProps = 'xs' | 'sm' | 'base';

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import { Decorator } from '@storybook/react';
 import * as React$1 from 'react';
-import React__default, { RefObject, HTMLAttributes, MutableRefObject, ReactNode, ImgHTMLAttributes, SVGProps, InputHTMLAttributes, CSSProperties, Ref, PropsWithChildren, ButtonHTMLAttributes, FocusEventHandler, ChangeEvent, HtmlHTMLAttributes } from 'react';
+import React__default, { RefObject, ReactElement, HTMLAttributes, MutableRefObject, ReactNode, ImgHTMLAttributes, SVGProps, InputHTMLAttributes, CSSProperties, Ref, PropsWithChildren, ButtonHTMLAttributes, FocusEventHandler, ChangeEvent, HtmlHTMLAttributes } from 'react';
 import { GroupBase, Props, MultiValue, SingleValue } from 'react-select';
 export { ActionMeta, FormatOptionLabelContext, FormatOptionLabelMeta, GetOptionLabel, GetOptionValue, GroupBase, GroupHeadingProps, GroupProps, MenuListProps, MenuPlacement, MultiValue, MultiValueGenericProps, MultiValueProps, MultiValueRemoveProps, OnChangeValue, OptionContext, OptionProps, Options, OptionsOrGroups } from 'react-select';
 import * as _emotion_react from '@emotion/react';
@@ -20220,7 +20220,9 @@ type AvatarProps = {
      */
     src?: string;
     /** Renders a tooltip over the avatar. Not used if there is no `src` */
-    label?: string;
+    label?: string | ReactElement;
+    /** Renders the label without a portal. May be needed inside modal dialogs. */
+    labelWithoutPortal?: boolean;
     size?: AvatarSizeProp;
     /**
      * The HTML element to render the component as.
@@ -20232,7 +20234,7 @@ type AvatarProps = {
  * @description A component to render rounded avatars of a user or an app.
  * @example <Avatar>AB</Avatar>
  */
-declare const Avatar: ({ src, label, children, size, as, ...props }: AvatarProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Avatar: ({ src, label, children, size, as, labelWithoutPortal, ...props }: AvatarProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
@@ -20248,6 +20250,11 @@ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
      * @default (n) => `and ${n} others`
      * */
     getTruncatedLabel?: (numberOfTruncatedItems: number) => string;
+    /**
+     * Props to apply to the truncation avatar if it is shown.
+     * Needed if the group's avatars are not the default size.
+     */
+    truncatedProps?: Pick<AvatarProps, 'size' | 'as'>;
     /**
      * The children to render. This component works best when the <Avatar> component are direct children.
      * **/
@@ -20257,7 +20264,7 @@ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
  * @description Renders avatars in a group with the ability to truncate the list. This component works best when the <Avatar> component are direct children.
  * @example <AvatarGroup max={2}><Avatar>AB</Avatar><Avatar>CD</Avatar><Avatar>EF</Avatar><AvatarGroup>
  */
-declare const AvatarGroup: ({ max, children, getTruncatedLabel, ...props }: AvatarGroupProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const AvatarGroup: ({ max, children, getTruncatedLabel, truncatedProps, ...props }: AvatarGroupProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type BadgeThemeProps = 'caution' | 'info' | 'note' | 'success' | 'error' | 'unimportant';
 type SizeProps = 'xs' | 'sm' | 'base';

package/dist/index.js

@@ -13542,13 +13542,21 @@ var avatarSizeStylesMap = {
   xl: avatarSizeXlStyles,
   "2xl": avatarSize2xlStyles
 };
-var Avatar = ({ src, label = "", children, size = "md", as = "div", ...props }) => {
+var Avatar = ({
+  src,
+  label = "",
+  children,
+  size = "md",
+  as = "div",
+  labelWithoutPortal,
+  ...props
+}) => {
   const Element = as;
-  const body = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(Element, { css: [avatarStyles, avatarSizeStylesMap[size]], ...props, children: [
-    src ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("img", { role: "presentation", src, css: avatarImageStyles }) : children ? null : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_CgProfile2.CgProfile, { css: avatarImageStyles }),
+  const body = /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(Element, { css: [avatarStyles, avatarSizeStylesMap[size]], ...props, children: [
+    src ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("img", { role: "presentation", src, css: avatarImageStyles, referrerPolicy: "no-referrer" }) : children ? null : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_CgProfile2.CgProfile, { css: avatarImageStyles }),
     children
-  ] }) });
-  return src || children ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Tooltip, { title: label, children: body }) : body;
+  ] });
+  return src || children ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Tooltip, { title: label, withoutPortal: labelWithoutPortal, children: body }) : body;
 };
 
 // src/components/Avatar/AvatarGroup.tsx
@@ -13584,6 +13592,7 @@ var AvatarGroup = ({
   max = 5,
   children,
   getTruncatedLabel = defaultGetTruncatedLabel,
+  truncatedProps,
   ...props
 }) => {
   if (max < 2) {
@@ -13603,10 +13612,18 @@ var AvatarGroup = ({
       ...props,
       children: [
         childrenToRender,
-        !numberOfTruncatedItems ? null : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Avatar, { label: getTruncatedLabel(numberOfTruncatedItems), style: { display: "flex" }, children: [
-          "+",
-          numberOfTruncatedItems
-        ] })
+        !numberOfTruncatedItems ? null : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+          Avatar,
+          {
+            ...truncatedProps,
+            label: getTruncatedLabel(numberOfTruncatedItems),
+            style: { display: "flex" },
+            children: [
+              "+",
+              numberOfTruncatedItems
+            ]
+          }
+        )
       ]
     }
   );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "19.211.0",
+  "version": "19.211.1-alpha.11+2c4b5ab595",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -26,8 +26,8 @@
     "@storybook/theming": "^8.3.3",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
-    "@uniformdev/canvas": "^19.211.0",
-    "@uniformdev/richtext": "^19.211.0",
+    "@uniformdev/canvas": "^19.211.1-alpha.11+2c4b5ab595",
+    "@uniformdev/richtext": "^19.211.1-alpha.11+2c4b5ab595",
     "autoprefixer": "10.4.16",
     "hygen": "6.2.11",
     "postcss": "8.4.47",
@@ -79,5 +79,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "c101d24290ae409fec3148e0cf055618f3f836cd"
+  "gitHead": "2c4b5ab595e333d324808dc75d5291cc62ee8039"
 }