@luscii-healthtech/web-ui 58.9.3 → 58.10.1

package/dist/esm/components/Avatar/Avatar.js

@@ -15,7 +15,20 @@ function checkImageValidity(src) {
     image.src = src;
   });
 }
-const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt, defaultImage, initials, children, className }) => {
+const legacySizeAliases = {
+  xsmall: "xs",
+  small: "s",
+  medium: "m"
+};
+const avatarSizeTokens = {
+  xs: "var(--ui-semantic-size-lg)",
+  s: "var(--ui-semantic-size-xl)",
+  m: "var(--ui-semantic-size-5xl)"
+};
+function resolveSize(size) {
+  return size in legacySizeAliases ? legacySizeAliases[size] : size;
+}
+const Avatar = ({ color, isSelf, size = "m", applyGroupOffset, src, alt, defaultImage, initials, children, className }) => {
   const [hasValidImage, setHasValidImage] = useState(false);
   useEffect(() => {
     let mounted = true;
@@ -30,29 +43,42 @@ const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt,
       mounted = false;
     };
   }, [defaultImage, src]);
+  const resolvedSize = resolveSize(size);
+  const sizeStyle = resolvedSize === "large" ? void 0 : {
+    width: avatarSizeTokens[resolvedSize],
+    height: avatarSizeTokens[resolvedSize]
+  };
   const sizeClassName = classNames("ui:rounded-full", {
-    "ui:h-32 ui:w-32": size === "large",
-    "ui:h-16 ui:w-16": size === "medium",
-    "ui:h-9 ui:w-9": size === "small",
-    "ui:h-6 ui:w-6": size === "xsmall"
+    "ui:h-32 ui:w-32": resolvedSize === "large"
   });
   const groupOffsetClassNames = classNames({
-    "ui:-ml-[calc(theme('spacing.32')/4)]": size === "large" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.16')/4)]": size === "medium" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.9')/4)]": size === "small" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.6')/4)]": size === "xsmall" && applyGroupOffset
+    "ui:-ml-[calc(theme('spacing.32')/4)]": resolvedSize === "large" && applyGroupOffset
   });
+  const groupOffsetStyle = applyGroupOffset && resolvedSize !== "large" ? { marginLeft: `calc(${avatarSizeTokens[resolvedSize]} / -4)` } : void 0;
+  const resolvedIsSelf = isSelf !== null && isSelf !== void 0 ? isSelf : color === "primary";
   const colorClassName = classNames({
-    "ui:bg-neutral-200 ui:text-on-surface": color === "slate",
-    "ui:bg-primary ui:text-white": color === "primary"
-  });
-  const containerClassName = classNames(className, sizeClassName, groupOffsetClassNames, colorClassName, "ui:flex ui:items-center ui:justify-center");
-  const textClassName = classNames({
-    "ui:text-5xl": size === "large",
-    "ui:text-2xl": size === "medium",
-    "ui:text-sm": size === "small" || size === "xsmall"
+    "ui:bg-background-brand-primary-default ui:text-text-inverse-primary-default": resolvedIsSelf,
+    "ui:bg-background-neutral-tertiary-default ui:text-text-neutral-primary-default": !resolvedIsSelf
   });
-  const imageClassName = classNames(sizeClassName);
+  const containerClassName = classNames(
+    className,
+    sizeClassName,
+    groupOffsetClassNames,
+    colorClassName,
+    /**
+     * The design system puts a 1px inverse border on every avatar. It
+     * sits inside the box (`border-box`), so the sizes above stay exact.
+     */
+    "ui:border ui:border-solid ui:border-border-inverse-primary-default",
+    /**
+     * `shrink-0` keeps the avatar circular when it is a flex child, for
+     * example inside an `AvatarGroup`, where the negative margins would
+     * otherwise let the flex algorithm squash it.
+     */
+    "ui:flex ui:shrink-0 ui:items-center ui:justify-center"
+  );
+  const textVariant = resolvedSize === "m" ? "body-base-regular" : "body-small-regular";
+  const imageClassName = classNames("ui:rounded-full ui:h-full ui:w-full ui:object-cover");
   const renderAvatar = () => {
     const elementToRender = initials !== null && initials !== void 0 ? initials : children;
     if (defaultImage) {
@@ -60,13 +86,13 @@ const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt,
     } else if (hasValidImage) {
       return jsx("img", { className: imageClassName, src, alt });
     } else {
-      if (size === "xsmall") {
-        return jsxs(Fragment, { children: [jsx(Text, { variant: "sm", color: "current", "aria-hidden": true, children: elementToRender }), jsx(ScreenReaderText, { children: alt })] });
+      if (resolvedSize === "large") {
+        return jsxs(Fragment, { children: [jsx("span", { className: "ui:text-5xl", "aria-hidden": true, children: elementToRender }), jsx(ScreenReaderText, { children: alt })] });
       }
-      return jsxs(Fragment, { children: [jsx("span", { className: textClassName, "aria-hidden": true, children: elementToRender }), jsx(ScreenReaderText, { children: alt })] });
+      return jsxs(Fragment, { children: [jsx(Text, { variant: textVariant, color: "current", "aria-hidden": true, children: elementToRender }), jsx(ScreenReaderText, { children: alt })] });
     }
   };
-  return jsx("div", { className: containerClassName, children: jsx("div", { children: renderAvatar() }) });
+  return jsx("div", { className: containerClassName, style: Object.assign(Object.assign({}, sizeStyle), groupOffsetStyle), children: renderAvatar() });
 };
 function ScreenReaderText({ children }) {
   return jsx("span", { className: "ui:sr-only", children });

package/dist/esm/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../../../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Avatar.js","sources":["../../../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/esm/components/Avatar/AvatarGroup.js

@@ -27,12 +27,20 @@ const AvatarGroup = (props) => {
       "ui:outline-slate-100": props.outlineColor === "slate-100",
       "ui:outline-white": props.outlineColor === "white"
     }, {
-      "ui:outline-2": child.props.size === "xsmall" || child.props.size === "small",
-      "ui:outline-4": child.props.size === "medium",
-      "ui:outline-8": child.props.size === "large"
+      "ui:outline-2": isOneOfSizes(child.props.size, [
+        "xs",
+        "xsmall",
+        "s",
+        "small"
+      ]),
+      "ui:outline-4": isOneOfSizes(child.props.size, ["m", "medium"]),
+      "ui:outline-8": isOneOfSizes(child.props.size, ["large"])
     }) }));
   }), jsx(MoreAvatarsLabel, Object.assign({}, props, { maxAvatars }))] }));
 };
+function isOneOfSizes(size, sizes) {
+  return typeof size === "string" && sizes.includes(size);
+}
 function MoreAvatarsLabel(props) {
   const { children, maxAvatars, moreAvatarsLabel } = props;
   if (!moreAvatarsLabel) {

package/dist/esm/components/Avatar/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","sources":["../../../../../../src/components/Avatar/AvatarGroup.tsx"],"sourcesContent":[null],"names":["_jsxs","React","_jsx"],"mappings":"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"}
+{"version":3,"file":"AvatarGroup.js","sources":["../../../../../../src/components/Avatar/AvatarGroup.tsx"],"sourcesContent":[null],"names":["_jsxs","React","_jsx"],"mappings":"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"}

package/dist/esm/components/Icons/NotificationDotIcon.js

@@ -0,0 +1,8 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import IconWrapper from './iconWrapper/iconWrapper.js';
+
+const SvgNotificationDotIcon = (props) => jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "-2 -2 24 24" }, props, { children: [jsx("path", { fill: "currentColor", d: "M10.72 17.083a.834.834 0 0 1 1.445.834 2.5 2.5 0 0 1-4.33 0 .834.834 0 0 1 1.443-.834.836.836 0 0 0 1.139.306.83.83 0 0 0 .304-.306M4.167 6.667A5.834 5.834 0 0 1 9.69.842a.834.834 0 0 1 .088 1.665 4.166 4.166 0 0 0-3.944 4.16c0 1.962-.308 3.332-.806 4.386-.492 1.042-1.145 1.714-1.693 2.28h13.333c-.693-.714-1.515-1.563-2.017-3.09a.833.833 0 0 1 1.583-.521c.332 1.01.827 1.61 1.4 2.21l.248.26.018.02a1.67 1.67 0 0 1-.323 2.518 1.7 1.7 0 0 1-.79.265l-.12.005H3.334a1.67 1.67 0 0 1-1.644-1.936c.052-.319.196-.616.413-.854l.017-.018c.554-.572 1.034-1.074 1.4-1.851.367-.775.647-1.887.647-3.674" }), jsx("path", { fill: "currentColor", d: "M16.666 4.167a1.667 1.667 0 1 0-3.333 0 1.667 1.667 0 0 0 3.333 0m1.667 0a3.333 3.333 0 1 1-6.667 0 3.333 3.333 0 0 1 6.667 0" })] }));
+var NotificationDotIcon = IconWrapper(SvgNotificationDotIcon);
+
+export { NotificationDotIcon as default };
+//# sourceMappingURL=NotificationDotIcon.js.map

package/dist/esm/components/Icons/NotificationDotIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationDotIcon.js","sources":["../../../../../../src/components/Icons/NotificationDotIcon.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx","iconWrapper"],"mappings":";;;AAKA,MAAM,yBAAwC,CAAC,KAAA,KAC7CA,KAAA,KAAA,EAAA,MAAA,CAAA,OAAA,EACE,KAAA,EAAM,8BACN,KAAA,EAAO,EAAA,EACP,QAAQ,EAAA,EACR,IAAA,EAAK,QACL,OAAA,EAAQ,aAAA,IACJ,KAAA,EAAK,EAAA,UAAA,CAETC,GAAA,CAAA,QAAA,EACE,IAAA,EAAK,gBACL,CAAA,EAAE,glBAAA,EAAglB,CAAA,EAEplBA,GAAA,CAAA,QAAA,EACE,IAAA,EAAK,gBACL,CAAA,EAAE,+HAAA,EAA+H,CACjI,CAAA,EAAA,CAAA,CAAA;AAGN,0BAAeC,YAAY,sBAAsB,CAAA;;;;"}

package/dist/esm/components/Icons/SoundOnIcon.js

@@ -0,0 +1,8 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import IconWrapper from './iconWrapper/iconWrapper.js';
+
+const SvgSoundOnIcon = (props) => jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "-2 -2 24 24" }, props, { children: [jsx("path", { fill: "currentColor", d: "M8.407 2.509a1.4 1.4 0 0 1 .618.06l.098.037.096.044c.187.094.35.228.48.393l.062.086.055.09c.12.212.184.452.185.698V16.08l-.004.105a1.42 1.42 0 0 1-2.423.9l-2.82-2.821a.33.33 0 0 0-.238-.099H2.501A1.666 1.666 0 0 1 .834 12.5v-5a1.667 1.667 0 0 1 1.667-1.667h2.015a.33.33 0 0 0 .238-.098l2.822-2.822c.199-.198.452-.333.727-.388zm-5.906 9.99h2.013a2 2 0 0 1 1.42.59l2.4 2.4V4.511l-2.4 2.4a2 2 0 0 1-1.42.587H2.501zM13.333 10c0-.721-.234-1.423-.666-2A.833.833 0 1 1 14 7a5 5 0 0 1 0 6 .833.833 0 1 1-1.333-1 3.34 3.34 0 0 0 .666-2" }), jsx("path", { fill: "currentColor", d: "M17.5 10a6.67 6.67 0 0 0-1.953-4.714.833.833 0 1 1 1.178-1.179 8.334 8.334 0 0 1 0 11.786.834.834 0 0 1-1.178-1.18A6.67 6.67 0 0 0 17.499 10" })] }));
+var SoundOnIcon = IconWrapper(SvgSoundOnIcon);
+
+export { SoundOnIcon as default };
+//# sourceMappingURL=SoundOnIcon.js.map

package/dist/esm/components/Icons/SoundOnIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SoundOnIcon.js","sources":["../../../../../../src/components/Icons/SoundOnIcon.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx","iconWrapper"],"mappings":";;;AAKA,MAAM,iBAAgC,CAAC,KAAA,KACrCA,KAAA,KAAA,EAAA,MAAA,CAAA,OAAA,EACE,KAAA,EAAM,8BACN,KAAA,EAAO,EAAA,EACP,QAAQ,EAAA,EACR,IAAA,EAAK,QACL,OAAA,EAAQ,aAAA,IACJ,KAAA,EAAK,EAAA,UAAA,CAETC,GAAA,CAAA,QAAA,EACE,IAAA,EAAK,gBACL,CAAA,EAAE,ghBAAA,EAAghB,CAAA,EAEphBA,GAAA,CAAA,QAAA,EACE,IAAA,EAAK,gBACL,CAAA,EAAE,8IAAA,EAA8I,CAChJ,CAAA,EAAA,CAAA,CAAA;AAGN,kBAAeC,YAAY,cAAc,CAAA;;;;"}

package/dist/esm/components/Icons/index.js

@@ -116,6 +116,7 @@ export { default as MessageWithArrowIcon } from './MessageWithArrowIcon.js';
 export { default as MoreIcon } from './MoreIcon.js';
 export { default as MouseIcon } from './MouseIcon.js';
 export { default as NoteIcon } from './NoteIcon.js';
+export { default as NotificationDotIcon } from './NotificationDotIcon.js';
 export { default as OpenAlertIcon } from './OpenAlertIcon.js';
 export { default as OpenFolderIcon } from './OpenFolderIcon.js';
 export { default as PageIcon } from './PageIcon.js';
@@ -144,6 +145,7 @@ export { default as SmallCircleIcon } from './SmallCircleIcon.js';
 export { default as SmallDiamondIcon } from './SmallDiamondIcon.js';
 export { default as SmallSquareIcon } from './SmallSquareIcon.js';
 export { default as SmallUpsideDownTriangleIcon } from './SmallUpsideDownTriangleIcon.js';
+export { default as SoundOnIcon } from './SoundOnIcon.js';
 export { default as SquareFilledIcon } from './SquareFilledIcon.js';
 export { default as StarFilledIcon } from './StarFilledIcon.js';
 export { default as StarIcon } from './StarIcon.js';

package/dist/esm/components/Icons/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/Select/SelectOptionAvatar.js

@@ -4,13 +4,12 @@ import { Avatar } from '../Avatar/Avatar.js';
 const SelectOptionAvatar = ({ avatar }) => {
   var _a, _b;
   return jsx(Avatar, {
-    size: "xsmall",
-    color: avatar.isSelf ? "primary" : "slate",
+    size: "xs",
+    isSelf: avatar.isSelf,
     // First code point + combining marks, so a decomposed "Ángela" keeps its accent.
     initials: (_b = (_a = avatar.initials.trim().match(/^.\p{M}*/u)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : "",
     src: avatar.src,
-    alt: avatar.alt,
-    className: "ui:shrink-0 ui:border ui:border-solid ui:border-border-neutral-secondary-default"
+    alt: avatar.alt
   });
 };
 

package/dist/esm/components/Select/SelectOptionAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectOptionAvatar.js","sources":["../../../../../../src/components/Select/SelectOptionAvatar.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;AAoBO,MAAM,kBAAA,GAAmD,CAAC,EAC/D,MAAA,EAAM,KACH;;AAAC,EAAA,OACJA,IAAC,MAAA,EAAM;AAAA,IACL,IAAA,EAAK,QAAA;AAAA,IACL,KAAA,EAAO,MAAA,CAAO,MAAA,GAAS,SAAA,GAAY,OAAA;AAAA;AAAA,IAEnC,QAAA,EAAA,CAAU,MAAA,EAAA,GAAA,MAAA,CAAO,SAAS,IAAA,EAAI,CAAG,MAAM,WAAW,CAAA,MAAC,QAAA,EAAA,KAAA,MAAA,GAAA,SAAA,EAAA,CAAG,CAAC,OAAC,IAAA,IAAA,EAAA,KAAA,SAAA,EAAA,GAAI,EAAA;AAAA,IAC5D,KAAK,MAAA,CAAO,GAAA;AAAA,IACZ,KAAK,MAAA,CAAO,GAAA;AAAA,IACZ,SAAA,EAAU;AAAA,GAAkF,CAAA;;;;;"}
+{"version":3,"file":"SelectOptionAvatar.js","sources":["../../../../../../src/components/Select/SelectOptionAvatar.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;AAaO,MAAM,kBAAA,GAAmD,CAAC,EAC/D,MAAA,EAAM,KACH;;AAAC,EAAA,OACJA,IAAC,MAAA,EAAM;AAAA,IACL,IAAA,EAAK,IAAA;AAAA,IACL,QAAQ,MAAA,CAAO,MAAA;AAAA;AAAA,IAEf,QAAA,EAAA,CAAU,MAAA,EAAA,GAAA,MAAA,CAAO,SAAS,IAAA,EAAI,CAAG,MAAM,WAAW,CAAA,MAAC,QAAA,EAAA,KAAA,MAAA,GAAA,SAAA,EAAA,CAAG,CAAC,OAAC,IAAA,IAAA,EAAA,KAAA,SAAA,EAAA,GAAI,EAAA;AAAA,IAC5D,KAAK,MAAA,CAAO,GAAA;AAAA,IACZ,KAAK,MAAA,CAAO;AAAA,GAAG,CAAA;;;;;"}

package/dist/esm/index.js

@@ -225,6 +225,7 @@ export { default as MessageWithArrowIcon } from './components/Icons/MessageWithA
 export { default as MoreIcon } from './components/Icons/MoreIcon.js';
 export { default as MouseIcon } from './components/Icons/MouseIcon.js';
 export { default as NoteIcon } from './components/Icons/NoteIcon.js';
+export { default as NotificationDotIcon } from './components/Icons/NotificationDotIcon.js';
 export { default as OpenAlertIcon } from './components/Icons/OpenAlertIcon.js';
 export { default as OpenFolderIcon } from './components/Icons/OpenFolderIcon.js';
 export { default as PageIcon } from './components/Icons/PageIcon.js';
@@ -253,6 +254,7 @@ export { default as SmallCircleIcon } from './components/Icons/SmallCircleIcon.j
 export { default as SmallDiamondIcon } from './components/Icons/SmallDiamondIcon.js';
 export { default as SmallSquareIcon } from './components/Icons/SmallSquareIcon.js';
 export { default as SmallUpsideDownTriangleIcon } from './components/Icons/SmallUpsideDownTriangleIcon.js';
+export { default as SoundOnIcon } from './components/Icons/SoundOnIcon.js';
 export { default as SquareFilledIcon } from './components/Icons/SquareFilledIcon.js';
 export { default as StarFilledIcon } from './components/Icons/StarFilledIcon.js';
 export { default as StarIcon } from './components/Icons/StarIcon.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.development.js

@@ -744,6 +744,9 @@ var MouseIcon = IconWrapper(SvgMouseIcon);
 const SvgNoteIcon = (props) => jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "0 0 24 24" }, props, { children: jsxRuntime.jsx("path", { fill: "currentColor", d: "M5.308 19H14v-4.096q0-.384.26-.644a.88.88 0 0 1 .644-.26H19V5.308a.3.3 0 0 0-.087-.221.3.3 0 0 0-.22-.087H5.307a.3.3 0 0 0-.221.087.3.3 0 0 0-.087.22v13.385a.3.3 0 0 0 .087.221.3.3 0 0 0 .22.087m0 1.5a1.74 1.74 0 0 1-1.277-.531 1.74 1.74 0 0 1-.531-1.277V5.308q0-.746.531-1.277A1.74 1.74 0 0 1 5.308 3.5h13.384q.746 0 1.277.531t.531 1.277v8.588q0 .366-.14.697a1.8 1.8 0 0 1-.387.578l-4.802 4.802a1.8 1.8 0 0 1-1.275.527zm5.942-6.77H8.192a.73.73 0 0 1-.534-.215.73.73 0 0 1-.216-.535q0-.318.216-.534a.73.73 0 0 1 .534-.215h3.058q.319 0 .534.216a.73.73 0 0 1 .216.534q0 .319-.216.534a.73.73 0 0 1-.534.216m4.558-3.98H8.192a.73.73 0 0 1-.534-.216A.73.73 0 0 1 7.442 9q0-.32.216-.535a.73.73 0 0 1 .534-.215h7.616q.318 0 .534.216a.73.73 0 0 1 .216.534q0 .32-.216.535a.73.73 0 0 1-.534.215" }) }));
 var NoteIcon = IconWrapper(SvgNoteIcon);
 
+const SvgNotificationDotIcon = (props) => jsxRuntime.jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "-2 -2 24 24" }, props, { children: [jsxRuntime.jsx("path", { fill: "currentColor", d: "M10.72 17.083a.834.834 0 0 1 1.445.834 2.5 2.5 0 0 1-4.33 0 .834.834 0 0 1 1.443-.834.836.836 0 0 0 1.139.306.83.83 0 0 0 .304-.306M4.167 6.667A5.834 5.834 0 0 1 9.69.842a.834.834 0 0 1 .088 1.665 4.166 4.166 0 0 0-3.944 4.16c0 1.962-.308 3.332-.806 4.386-.492 1.042-1.145 1.714-1.693 2.28h13.333c-.693-.714-1.515-1.563-2.017-3.09a.833.833 0 0 1 1.583-.521c.332 1.01.827 1.61 1.4 2.21l.248.26.018.02a1.67 1.67 0 0 1-.323 2.518 1.7 1.7 0 0 1-.79.265l-.12.005H3.334a1.67 1.67 0 0 1-1.644-1.936c.052-.319.196-.616.413-.854l.017-.018c.554-.572 1.034-1.074 1.4-1.851.367-.775.647-1.887.647-3.674" }), jsxRuntime.jsx("path", { fill: "currentColor", d: "M16.666 4.167a1.667 1.667 0 1 0-3.333 0 1.667 1.667 0 0 0 3.333 0m1.667 0a3.333 3.333 0 1 1-6.667 0 3.333 3.333 0 0 1 6.667 0" })] }));
+var NotificationDotIcon = IconWrapper(SvgNotificationDotIcon);
+
 const SvgOpenAlertIcon = (props) => jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "0 0 24 24" }, props, { children: jsxRuntime.jsx("path", { fill: "currentColor", d: "M4.808 19.5h15.384a.3.3 0 0 0 .221-.087.3.3 0 0 0 .087-.22v-1.76a.3.3 0 0 0-.087-.221.3.3 0 0 0-.22-.087H4.807a.3.3 0 0 0-.221.087.3.3 0 0 0-.087.22v1.76a.3.3 0 0 0 .087.221.3.3 0 0 0 .22.087m5.528-8.933q0-.889.636-1.52a2.1 2.1 0 0 1 1.528-.633q.319 0 .534-.216a.73.73 0 0 0 .216-.535.73.73 0 0 0-.216-.534.73.73 0 0 0-.534-.215q-1.512 0-2.587 1.069a3.5 3.5 0 0 0-1.077 2.584v2.154q0 .319.216.534a.73.73 0 0 0 .535.216q.319 0 .534-.216a.73.73 0 0 0 .215-.534zm-2.923 5.058h10.174v-5.058q0-2.113-1.489-3.59Q14.61 5.5 12.498 5.5T8.9 6.977q-1.487 1.476-1.487 3.59zM4.809 21a1.74 1.74 0 0 1-1.277-.531A1.74 1.74 0 0 1 3 19.192v-1.76q0-.745.531-1.276a1.74 1.74 0 0 1 1.277-.531h1.106v-5.058q0-2.744 1.917-4.655T12.5 4t4.67 1.912q1.916 1.911 1.916 4.655v5.058h1.106q.746 0 1.277.531T22 17.433v1.76q0 .744-.531 1.276a1.74 1.74 0 0 1-1.277.531z" }) }));
 var OpenAlertIcon = IconWrapper(SvgOpenAlertIcon);
 
@@ -828,6 +831,9 @@ var SmallSquareIcon = IconWrapper(SvgSmallSquareIcon);
 const SvgSmallUpsideDownTriangleIcon = (props) => jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "0 0 24 24" }, props, { children: jsxRuntime.jsx("path", { fill: "currentColor", d: "M3.913 8.06C3.08 6.728 4.037 5 5.609 5h12.783c1.57 0 2.528 1.728 1.695 3.06l-6.391 10.226a2 2 0 0 1-3.392 0z" }) }));
 var SmallUpsideDownTriangleIcon = IconWrapper(SvgSmallUpsideDownTriangleIcon);
 
+const SvgSoundOnIcon = (props) => jsxRuntime.jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "-2 -2 24 24" }, props, { children: [jsxRuntime.jsx("path", { fill: "currentColor", d: "M8.407 2.509a1.4 1.4 0 0 1 .618.06l.098.037.096.044c.187.094.35.228.48.393l.062.086.055.09c.12.212.184.452.185.698V16.08l-.004.105a1.42 1.42 0 0 1-2.423.9l-2.82-2.821a.33.33 0 0 0-.238-.099H2.501A1.666 1.666 0 0 1 .834 12.5v-5a1.667 1.667 0 0 1 1.667-1.667h2.015a.33.33 0 0 0 .238-.098l2.822-2.822c.199-.198.452-.333.727-.388zm-5.906 9.99h2.013a2 2 0 0 1 1.42.59l2.4 2.4V4.511l-2.4 2.4a2 2 0 0 1-1.42.587H2.501zM13.333 10c0-.721-.234-1.423-.666-2A.833.833 0 1 1 14 7a5 5 0 0 1 0 6 .833.833 0 1 1-1.333-1 3.34 3.34 0 0 0 .666-2" }), jsxRuntime.jsx("path", { fill: "currentColor", d: "M17.5 10a6.67 6.67 0 0 0-1.953-4.714.833.833 0 1 1 1.178-1.179 8.334 8.334 0 0 1 0 11.786.834.834 0 0 1-1.178-1.18A6.67 6.67 0 0 0 17.499 10" })] }));
+var SoundOnIcon = IconWrapper(SvgSoundOnIcon);
+
 const SvgSquareFilledIcon = (props) => jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "0 0 24 24" }, props, { children: jsxRuntime.jsx("rect", { width: 18, height: 18, x: 3, y: 3, fill: "currentColor", rx: 2 }) }));
 var SquareFilledIcon = IconWrapper(SvgSquareFilledIcon);
 
@@ -994,6 +1000,7 @@ var Icons = /*#__PURE__*/Object.freeze({
     MoreIcon: MoreIcon,
     MouseIcon: MouseIcon,
     NoteIcon: NoteIcon,
+    NotificationDotIcon: NotificationDotIcon,
     OpenAlertIcon: OpenAlertIcon,
     OpenFolderIcon: OpenFolderIcon,
     PageIcon: PageIcon,
@@ -1023,6 +1030,7 @@ var Icons = /*#__PURE__*/Object.freeze({
     SmallDiamondIcon: SmallDiamondIcon,
     SmallSquareIcon: SmallSquareIcon,
     SmallUpsideDownTriangleIcon: SmallUpsideDownTriangleIcon,
+    SoundOnIcon: SoundOnIcon,
     SquareFilledIcon: SquareFilledIcon,
     StarFilledIcon: StarFilledIcon,
     StarIcon: StarIcon,
@@ -2262,7 +2270,20 @@ function checkImageValidity(src) {
     image.src = src;
   });
 }
-const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt, defaultImage, initials, children, className }) => {
+const legacySizeAliases = {
+  xsmall: "xs",
+  small: "s",
+  medium: "m"
+};
+const avatarSizeTokens = {
+  xs: "var(--ui-semantic-size-lg)",
+  s: "var(--ui-semantic-size-xl)",
+  m: "var(--ui-semantic-size-5xl)"
+};
+function resolveSize(size) {
+  return size in legacySizeAliases ? legacySizeAliases[size] : size;
+}
+const Avatar = ({ color, isSelf, size = "m", applyGroupOffset, src, alt, defaultImage, initials, children, className }) => {
   const [hasValidImage, setHasValidImage] = React.useState(false);
   React.useEffect(() => {
     let mounted = true;
@@ -2277,29 +2298,42 @@ const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt,
       mounted = false;
     };
   }, [defaultImage, src]);
+  const resolvedSize = resolveSize(size);
+  const sizeStyle = resolvedSize === "large" ? void 0 : {
+    width: avatarSizeTokens[resolvedSize],
+    height: avatarSizeTokens[resolvedSize]
+  };
   const sizeClassName = classNames__default.default("ui:rounded-full", {
-    "ui:h-32 ui:w-32": size === "large",
-    "ui:h-16 ui:w-16": size === "medium",
-    "ui:h-9 ui:w-9": size === "small",
-    "ui:h-6 ui:w-6": size === "xsmall"
+    "ui:h-32 ui:w-32": resolvedSize === "large"
   });
   const groupOffsetClassNames = classNames__default.default({
-    "ui:-ml-[calc(theme('spacing.32')/4)]": size === "large" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.16')/4)]": size === "medium" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.9')/4)]": size === "small" && applyGroupOffset,
-    "ui:-ml-[calc(theme('spacing.6')/4)]": size === "xsmall" && applyGroupOffset
+    "ui:-ml-[calc(theme('spacing.32')/4)]": resolvedSize === "large" && applyGroupOffset
   });
+  const groupOffsetStyle = applyGroupOffset && resolvedSize !== "large" ? { marginLeft: `calc(${avatarSizeTokens[resolvedSize]} / -4)` } : void 0;
+  const resolvedIsSelf = isSelf !== null && isSelf !== void 0 ? isSelf : color === "primary";
   const colorClassName = classNames__default.default({
-    "ui:bg-neutral-200 ui:text-on-surface": color === "slate",
-    "ui:bg-primary ui:text-white": color === "primary"
-  });
-  const containerClassName = classNames__default.default(className, sizeClassName, groupOffsetClassNames, colorClassName, "ui:flex ui:items-center ui:justify-center");
-  const textClassName = classNames__default.default({
-    "ui:text-5xl": size === "large",
-    "ui:text-2xl": size === "medium",
-    "ui:text-sm": size === "small" || size === "xsmall"
+    "ui:bg-background-brand-primary-default ui:text-text-inverse-primary-default": resolvedIsSelf,
+    "ui:bg-background-neutral-tertiary-default ui:text-text-neutral-primary-default": !resolvedIsSelf
   });
-  const imageClassName = classNames__default.default(sizeClassName);
+  const containerClassName = classNames__default.default(
+    className,
+    sizeClassName,
+    groupOffsetClassNames,
+    colorClassName,
+    /**
+     * The design system puts a 1px inverse border on every avatar. It
+     * sits inside the box (`border-box`), so the sizes above stay exact.
+     */
+    "ui:border ui:border-solid ui:border-border-inverse-primary-default",
+    /**
+     * `shrink-0` keeps the avatar circular when it is a flex child, for
+     * example inside an `AvatarGroup`, where the negative margins would
+     * otherwise let the flex algorithm squash it.
+     */
+    "ui:flex ui:shrink-0 ui:items-center ui:justify-center"
+  );
+  const textVariant = resolvedSize === "m" ? "body-base-regular" : "body-small-regular";
+  const imageClassName = classNames__default.default("ui:rounded-full ui:h-full ui:w-full ui:object-cover");
   const renderAvatar = () => {
     const elementToRender = initials !== null && initials !== void 0 ? initials : children;
     if (defaultImage) {
@@ -2307,13 +2341,13 @@ const Avatar = ({ color = "slate", size = "medium", applyGroupOffset, src, alt,
     } else if (hasValidImage) {
       return jsxRuntime.jsx("img", { className: imageClassName, src, alt });
     } else {
-      if (size === "xsmall") {
-        return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text, { variant: "sm", color: "current", "aria-hidden": true, children: elementToRender }), jsxRuntime.jsx(ScreenReaderText, { children: alt })] });
+      if (resolvedSize === "large") {
+        return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "ui:text-5xl", "aria-hidden": true, children: elementToRender }), jsxRuntime.jsx(ScreenReaderText, { children: alt })] });
       }
-      return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: textClassName, "aria-hidden": true, children: elementToRender }), jsxRuntime.jsx(ScreenReaderText, { children: alt })] });
+      return jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text, { variant: textVariant, color: "current", "aria-hidden": true, children: elementToRender }), jsxRuntime.jsx(ScreenReaderText, { children: alt })] });
     }
   };
-  return jsxRuntime.jsx("div", { className: containerClassName, children: jsxRuntime.jsx("div", { children: renderAvatar() }) });
+  return jsxRuntime.jsx("div", { className: containerClassName, style: Object.assign(Object.assign({}, sizeStyle), groupOffsetStyle), children: renderAvatar() });
 };
 function ScreenReaderText({ children }) {
   return jsxRuntime.jsx("span", { className: "ui:sr-only", children });
@@ -2339,12 +2373,20 @@ const AvatarGroup = (props) => {
       "ui:outline-slate-100": props.outlineColor === "slate-100",
       "ui:outline-white": props.outlineColor === "white"
     }, {
-      "ui:outline-2": child.props.size === "xsmall" || child.props.size === "small",
-      "ui:outline-4": child.props.size === "medium",
-      "ui:outline-8": child.props.size === "large"
+      "ui:outline-2": isOneOfSizes(child.props.size, [
+        "xs",
+        "xsmall",
+        "s",
+        "small"
+      ]),
+      "ui:outline-4": isOneOfSizes(child.props.size, ["m", "medium"]),
+      "ui:outline-8": isOneOfSizes(child.props.size, ["large"])
     }) }));
   }), jsxRuntime.jsx(MoreAvatarsLabel, Object.assign({}, props, { maxAvatars }))] }));
 };
+function isOneOfSizes(size, sizes) {
+  return typeof size === "string" && sizes.includes(size);
+}
 function MoreAvatarsLabel(props) {
   const { children, maxAvatars, moreAvatarsLabel } = props;
   if (!moreAvatarsLabel) {
@@ -4458,13 +4500,12 @@ const SelectLoadingIndicator = (props) => jsxRuntime.jsx(LoadingIndicator, Objec
 const SelectOptionAvatar = ({ avatar }) => {
   var _a, _b;
   return jsxRuntime.jsx(Avatar, {
-    size: "xsmall",
-    color: avatar.isSelf ? "primary" : "slate",
+    size: "xs",
+    isSelf: avatar.isSelf,
     // First code point + combining marks, so a decomposed "Ángela" keeps its accent.
     initials: (_b = (_a = avatar.initials.trim().match(/^.\p{M}*/u)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : "",
     src: avatar.src,
-    alt: avatar.alt,
-    className: "ui:shrink-0 ui:border ui:border-solid ui:border-border-neutral-secondary-default"
+    alt: avatar.alt
   });
 };
 
@@ -7551,6 +7592,7 @@ exports.NaturalLanguageForm = NaturalLanguageFormWithSubComponents;
 exports.NavLayout = NavLayout;
 exports.NoteIcon = NoteIcon;
 exports.NotificationBanner = NotificationBanner;
+exports.NotificationDotIcon = NotificationDotIcon;
 exports.OpenAlertIcon = OpenAlertIcon;
 exports.OpenFolderIcon = OpenFolderIcon;
 exports.Page = Page;
@@ -7602,6 +7644,7 @@ exports.SmallCircleIcon = SmallCircleIcon;
 exports.SmallDiamondIcon = SmallDiamondIcon;
 exports.SmallSquareIcon = SmallSquareIcon;
 exports.SmallUpsideDownTriangleIcon = SmallUpsideDownTriangleIcon;
+exports.SoundOnIcon = SoundOnIcon;
 exports.Spinner = Spinner;
 exports.SplitViewLayout = SplitViewLayout;
 exports.SquareFilledIcon = SquareFilledIcon;