@mattermost/compass-ui 0.1.0-alpha.11 → 0.1.0-alpha.13

package/dist/components/user-avatar-group/UserAvatarGroup.css

@@ -1 +1 @@
-._user-avatar-group_sgxpf_2{display:inline-flex;align-items:center;padding-right:var(--spacing-xxxxs)}._user-avatar-group__item_sgxpf_7{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:20px;height:20px;margin-right:-2px;border-radius:var(--radius-full);outline:1px solid var(--center-channel-bg, var(--color-neutral-0));transform:scale(1);transition:transform var(--duration-quick) var(--ease-transition),box-shadow var(--duration-quick) var(--ease-transition)}._user-avatar-group__item_sgxpf_7:hover{z-index:10;transform:scale(1.04);box-shadow:var(--elevation-2)}._user-avatar-group__item_sgxpf_7:hover ._user-avatar-group__tooltip-layer_sgxpf_26{opacity:1;visibility:visible;transition:opacity var(--duration-quick) var(--ease-entrance),visibility 0s linear 0s}._user-avatar-group__trigger_sgxpf_31{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:inherit;overflow:hidden}._user-avatar-group__tooltip-layer_sgxpf_26{position:absolute;left:50%;bottom:100%;z-index:20;margin-bottom:var(--spacing-xxxxs);transform:translate(-50%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-exit),visibility 0s linear var(--duration-quick)}._user-avatar-group__tooltip_sgxpf_26{flex-shrink:0}._user-avatar-group__overflow_sgxpf_55{display:inline-flex;align-items:center;justify-content:center;background-color:var(--center-channel-bg);background-image:linear-gradient(rgba(var(--center-channel-color-rgb),.08),rgba(var(--center-channel-color-rgb),.08));color:rgba(var(--center-channel-color-rgb),.56);font-size:var(--font-size-25);font-weight:var(--font-weight-semibold);letter-spacing:.01em;border-radius:var(--radius-full)}._user-avatar-group--size-24_sgxpf_67{padding-right:3px}._user-avatar-group--size-24_sgxpf_67 ._user-avatar-group__item_sgxpf_7{width:24px;height:24px;margin-right:-3px;outline-width:1px}._user-avatar-group--size-24_sgxpf_67 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-50)}._user-avatar-group--size-28_sgxpf_79{padding-right:3px}._user-avatar-group--size-28_sgxpf_79 ._user-avatar-group__item_sgxpf_7{width:28px;height:28px;margin-right:-3px;outline-width:2px}._user-avatar-group--size-28_sgxpf_79 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-75)}._user-avatar-group--size-32_sgxpf_91{padding-right:3px}._user-avatar-group--size-32_sgxpf_91 ._user-avatar-group__item_sgxpf_7{width:32px;height:32px;margin-right:-3px;outline-width:2px}._user-avatar-group--size-32_sgxpf_91 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-75)}._user-avatar-group--size-40_sgxpf_103{padding-right:5px}._user-avatar-group--size-40_sgxpf_103 ._user-avatar-group__item_sgxpf_7{width:40px;height:40px;margin-right:-5px;outline-width:2px}._user-avatar-group--size-40_sgxpf_103 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-100)}._user-avatar-group--size-48_sgxpf_115{padding-right:7px}._user-avatar-group--size-48_sgxpf_115 ._user-avatar-group__item_sgxpf_7{width:48px;height:48px;margin-right:-7px;outline-width:2px}._user-avatar-group--size-48_sgxpf_115 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-200)}._user-avatar-group--size-56_sgxpf_127{padding-right:8px}._user-avatar-group--size-56_sgxpf_127 ._user-avatar-group__item_sgxpf_7{width:56px;height:56px;margin-right:-8px;outline-width:2px}._user-avatar-group--size-56_sgxpf_127 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-300)}._user-avatar-group--size-64_sgxpf_139{padding-right:9px}._user-avatar-group--size-64_sgxpf_139 ._user-avatar-group__item_sgxpf_7{width:64px;height:64px;margin-right:-9px;outline-width:2px}._user-avatar-group--size-64_sgxpf_139 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-400)}._user-avatar-group--size-72_sgxpf_151{padding-right:10px}._user-avatar-group--size-72_sgxpf_151 ._user-avatar-group__item_sgxpf_7{width:72px;height:72px;margin-right:-10px;outline-width:2px}._user-avatar-group--size-72_sgxpf_151 ._user-avatar-group__overflow_sgxpf_55{font-size:var(--font-size-500)}
+._user-avatar-group_17zfx_2{display:inline-flex;align-items:center;padding-right:var(--spacing-xxxxs)}._user-avatar-group__item_17zfx_7{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:20px;height:20px;margin-right:-2px;border-radius:var(--radius-pill);outline:1px solid var(--center-channel-bg, var(--color-neutral-0));transform:scale(1);transition:transform var(--duration-quick) var(--ease-transition),box-shadow var(--duration-quick) var(--ease-transition)}._user-avatar-group__item_17zfx_7:hover{z-index:10;transform:scale(1.04);box-shadow:var(--elevation-2)}._user-avatar-group__item_17zfx_7:hover ._user-avatar-group__tooltip-layer_17zfx_26{opacity:1;visibility:visible;transition:opacity var(--duration-quick) var(--ease-entrance),visibility 0s linear 0s}._user-avatar-group__trigger_17zfx_31{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:inherit;overflow:hidden}._user-avatar-group__tooltip-layer_17zfx_26{position:absolute;left:50%;bottom:100%;z-index:20;margin-bottom:var(--spacing-xxxxs);transform:translate(-50%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-exit),visibility 0s linear var(--duration-quick)}._user-avatar-group__tooltip_17zfx_26{flex-shrink:0}._user-avatar-group__overflow_17zfx_55{display:inline-flex;align-items:center;justify-content:center;background-color:var(--center-channel-bg);background-image:linear-gradient(rgba(var(--center-channel-color-rgb),.08),rgba(var(--center-channel-color-rgb),.08));color:rgba(var(--center-channel-color-rgb),.56);font-size:var(--font-size-25);font-weight:var(--font-weight-semibold);letter-spacing:.01em;border-radius:var(--radius-pill)}._user-avatar-group--size-24_17zfx_67{padding-right:3px}._user-avatar-group--size-24_17zfx_67 ._user-avatar-group__item_17zfx_7{width:24px;height:24px;margin-right:-3px;outline-width:1px}._user-avatar-group--size-24_17zfx_67 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-50)}._user-avatar-group--size-28_17zfx_79{padding-right:3px}._user-avatar-group--size-28_17zfx_79 ._user-avatar-group__item_17zfx_7{width:28px;height:28px;margin-right:-3px;outline-width:2px}._user-avatar-group--size-28_17zfx_79 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-75)}._user-avatar-group--size-32_17zfx_91{padding-right:3px}._user-avatar-group--size-32_17zfx_91 ._user-avatar-group__item_17zfx_7{width:32px;height:32px;margin-right:-3px;outline-width:2px}._user-avatar-group--size-32_17zfx_91 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-75)}._user-avatar-group--size-40_17zfx_103{padding-right:5px}._user-avatar-group--size-40_17zfx_103 ._user-avatar-group__item_17zfx_7{width:40px;height:40px;margin-right:-5px;outline-width:2px}._user-avatar-group--size-40_17zfx_103 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-100)}._user-avatar-group--size-48_17zfx_115{padding-right:7px}._user-avatar-group--size-48_17zfx_115 ._user-avatar-group__item_17zfx_7{width:48px;height:48px;margin-right:-7px;outline-width:2px}._user-avatar-group--size-48_17zfx_115 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-200)}._user-avatar-group--size-56_17zfx_127{padding-right:8px}._user-avatar-group--size-56_17zfx_127 ._user-avatar-group__item_17zfx_7{width:56px;height:56px;margin-right:-8px;outline-width:2px}._user-avatar-group--size-56_17zfx_127 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-300)}._user-avatar-group--size-64_17zfx_139{padding-right:9px}._user-avatar-group--size-64_17zfx_139 ._user-avatar-group__item_17zfx_7{width:64px;height:64px;margin-right:-9px;outline-width:2px}._user-avatar-group--size-64_17zfx_139 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-400)}._user-avatar-group--size-72_17zfx_151{padding-right:10px}._user-avatar-group--size-72_17zfx_151 ._user-avatar-group__item_17zfx_7{width:72px;height:72px;margin-right:-10px;outline-width:2px}._user-avatar-group--size-72_17zfx_151 ._user-avatar-group__overflow_17zfx_55{font-size:var(--font-size-500)}

package/dist/components/user-avatar-group/UserAvatarGroup.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 export type UserAvatarGroupSize = '20' | '24' | '28' | '32' | '40' | '48' | '56' | '64' | '72';
 export interface UserAvatarGroupItem {
     /** Unique key for the list item. */
@@ -16,11 +17,17 @@ export interface UserAvatarGroupProps {
     size?: UserAvatarGroupSize;
     /** Optional CSS class name. */
     className?: string;
+    /** Accessible name for the group. Default: `{count} participants`. */
+    formatGroupLabel?: (count: number) => string;
+    /** Accessible name for the +N overflow. Default: `{count} more participants`. */
+    formatOverflowLabel?: (count: number) => string;
+    /** Overflow tooltip text. Default: up to three names, then `A, B, +N more`. */
+    formatOverflowNames?: (hidden: UserAvatarGroupItem[]) => ReactNode;
 }
 /**
  * A User Avatar Group displays multiple participants as a stack of overlapping avatars. It's
  * a compact way to show "who's involved" — thread participants, channel members, call
  * attendees — without a list.
  */
-export default function UserAvatarGroup({ avatars, className, max, size, }: UserAvatarGroupProps): import("react/jsx-runtime").JSX.Element;
+export default function UserAvatarGroup({ avatars, className, max, size, formatGroupLabel, formatOverflowLabel, formatOverflowNames, }: UserAvatarGroupProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=UserAvatarGroup.d.ts.map

package/dist/components/user-avatar-group/UserAvatarGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserAvatarGroup.d.ts","sourceRoot":"","sources":["../../../src/components/user-avatar-group/UserAvatarGroup.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,mBAAmB,GAC3B,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,CAAC;AAET,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,gFAAgF;IAChF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mFAAmF;IACnF,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,wCAAwC;IACxC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,uFAAuF;IACvF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iFAAiF;IACjF,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAYD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,OAAO,EACP,SAAc,EACd,GAAO,EACP,IAAW,GACZ,EAAE,oBAAoB,2CAkEtB"}
+{"version":3,"file":"UserAvatarGroup.d.ts","sourceRoot":"","sources":["../../../src/components/user-avatar-group/UserAvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,MAAM,mBAAmB,GAC3B,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,CAAC;AAET,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,gFAAgF;IAChF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mFAAmF;IACnF,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,wCAAwC;IACxC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,uFAAuF;IACvF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iFAAiF;IACjF,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,iFAAiF;IACjF,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAChD,+EAA+E;IAC/E,mBAAmB,CAAC,EAAE,CAAC,MAAM,EAAE,mBAAmB,EAAE,KAAK,SAAS,CAAC;CACpE;AAgBD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,OAAO,EACP,SAAc,EACd,GAAO,EACP,IAAW,EACX,gBAA0C,EAC1C,mBAAgD,EAChD,mBAAwC,GACzC,EAAE,oBAAoB,2CAkEtB"}

package/dist/components/user-avatar-group/UserAvatarGroup.js

@@ -1,36 +1,40 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import m from "../tooltip/Tooltip.js";
-import g from "../user-avatar/UserAvatar.js";
+import v from "../user-avatar/UserAvatar.js";
 import a from "./UserAvatarGroup.module.scss.js";
-function _(r) {
+const b = (r) => `${r} participants`, N = (r) => `${r} more participants`;
+function h(r) {
   return r.length === 0 ? "" : r.length === 1 ? r[0].name : r.length <= 3 ? r.map((o) => o.name).join(", ") : `${r.slice(0, 2).map((o) => o.name).join(", ")}, +${r.length - 2} more`;
 }
-function h({
+function d({
   avatars: r,
   className: o = "",
   max: i = 3,
-  size: l = "20"
+  size: s = "20",
+  formatGroupLabel: u = b,
+  formatOverflowLabel: c = N,
+  formatOverflowNames: g = h
 }) {
-  const u = r.slice(0, i), p = r.slice(i), n = p.length, c = [
+  const _ = r.slice(0, i), p = r.slice(i), n = p.length, f = [
     a["user-avatar-group"],
-    l !== "20" ? a[`user-avatar-group--size-${l}`] : "",
+    s !== "20" ? a[`user-avatar-group--size-${s}`] : "",
     o
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ l(
     "div",
     {
-      className: c,
+      className: f,
       role: "group",
-      "aria-label": `${r.length} participants`,
+      "aria-label": u(r.length),
       children: [
-        u.map((t) => /* @__PURE__ */ s("span", { className: a["user-avatar-group__item"], children: [
+        _.map((t) => /* @__PURE__ */ l("span", { className: a["user-avatar-group__item"], children: [
           /* @__PURE__ */ e("span", { className: a["user-avatar-group__trigger"], children: /* @__PURE__ */ e(
-            g,
+            v,
             {
               src: t.src,
               alt: t.name,
               name: t.name,
-              size: l
+              size: s
             }
           ) }),
           /* @__PURE__ */ e(
@@ -49,16 +53,16 @@ function h({
             }
           )
         ] }, t.key)),
-        n > 0 && /* @__PURE__ */ s(
+        n > 0 && /* @__PURE__ */ l(
           "span",
           {
             className: [
               a["user-avatar-group__item"],
               a["user-avatar-group__overflow"]
             ].join(" "),
-            "aria-label": `${n} more participants`,
+            "aria-label": c(n),
             children: [
-              /* @__PURE__ */ s("span", { className: a["user-avatar-group__trigger"], children: [
+              /* @__PURE__ */ l("span", { className: a["user-avatar-group__trigger"], children: [
                 "+",
                 n
               ] }),
@@ -72,7 +76,7 @@ function h({
                     {
                       arrow: "bottom",
                       className: a["user-avatar-group__tooltip"],
-                      label: _(p)
+                      label: g(p)
                     }
                   )
                 }
@@ -85,6 +89,6 @@ function h({
   );
 }
 export {
-  h as default
+  d as default
 };
 //# sourceMappingURL=UserAvatarGroup.js.map

package/dist/components/user-avatar-group/UserAvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserAvatarGroup.js","sources":["../../../src/components/user-avatar-group/UserAvatarGroup.tsx"],"sourcesContent":["import Tooltip from '@/components/tooltip/Tooltip';\nimport UserAvatar from '@/components/user-avatar/UserAvatar';\nimport styles from './UserAvatarGroup.module.scss';\n\nexport type UserAvatarGroupSize =\n  | '20'\n  | '24'\n  | '28'\n  | '32'\n  | '40'\n  | '48'\n  | '56'\n  | '64'\n  | '72';\n\nexport interface UserAvatarGroupItem {\n  /** Unique key for the list item. */\n  key: string;\n  /** Image URL for the avatar. Omit to render the Fallback (initials) variant. */\n  src?: string;\n  /** Alt text / display name for the avatar. Drives initials and fallback colour. */\n  name: string;\n}\n\nexport interface UserAvatarGroupProps {\n  /** Array of avatar items to display. */\n  avatars: UserAvatarGroupItem[];\n  /** Maximum number of avatars to show before showing the overflow count. Default: 3. */\n  max?: number;\n  /** Avatar size in px. Matches Figma Avatar Group size options. Default: '20'. */\n  size?: UserAvatarGroupSize;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\nfunction overflowNamesLabel(hidden: UserAvatarGroupItem[]): string {\n  if (hidden.length === 0) return '';\n  if (hidden.length === 1) return hidden[0].name;\n  if (hidden.length <= 3) return hidden.map((a) => a.name).join(', ');\n  return `${hidden\n    .slice(0, 2)\n    .map((a) => a.name)\n    .join(', ')}, +${hidden.length - 2} more`;\n}\n\n/**\n * A User Avatar Group displays multiple participants as a stack of overlapping avatars. It's\n * a compact way to show \"who's involved\" — thread participants, channel members, call\n * attendees — without a list.\n */\nexport default function UserAvatarGroup({\n  avatars,\n  className = '',\n  max = 3,\n  size = '20',\n}: UserAvatarGroupProps) {\n  const visible = avatars.slice(0, max);\n  const hidden = avatars.slice(max);\n  const overflow = hidden.length;\n\n  const rootClass = [\n    styles['user-avatar-group'],\n    size !== '20' ? styles[`user-avatar-group--size-${size}`] : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div\n      className={rootClass}\n      role=\"group\"\n      aria-label={`${avatars.length} participants`}\n    >\n      {visible.map((avatar) => (\n        <span key={avatar.key} className={styles['user-avatar-group__item']}>\n          <span className={styles['user-avatar-group__trigger']}>\n            <UserAvatar\n              src={avatar.src}\n              alt={avatar.name}\n              name={avatar.name}\n              size={size}\n            />\n          </span>\n          <div\n            className={styles['user-avatar-group__tooltip-layer']}\n            role=\"presentation\"\n          >\n            <Tooltip\n              arrow=\"bottom\"\n              className={styles['user-avatar-group__tooltip']}\n              label={avatar.name}\n            />\n          </div>\n        </span>\n      ))}\n      {overflow > 0 && (\n        <span\n          className={[\n            styles['user-avatar-group__item'],\n            styles['user-avatar-group__overflow'],\n          ].join(' ')}\n          aria-label={`${overflow} more participants`}\n        >\n          <span className={styles['user-avatar-group__trigger']}>\n            +{overflow}\n          </span>\n          <div\n            className={styles['user-avatar-group__tooltip-layer']}\n            role=\"presentation\"\n          >\n            <Tooltip\n              arrow=\"bottom\"\n              className={styles['user-avatar-group__tooltip']}\n              label={overflowNamesLabel(hidden)}\n            />\n          </div>\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["overflowNamesLabel","hidden","a","UserAvatarGroup","avatars","className","max","size","visible","overflow","rootClass","styles","jsxs","avatar","jsx","UserAvatar","Tooltip"],"mappings":";;;;AAmCA,SAASA,EAAmBC,GAAuC;AACjE,SAAIA,EAAO,WAAW,IAAU,KAC5BA,EAAO,WAAW,IAAUA,EAAO,CAAC,EAAE,OACtCA,EAAO,UAAU,IAAUA,EAAO,IAAI,CAACC,MAAMA,EAAE,IAAI,EAAE,KAAK,IAAI,IAC3D,GAAGD,EACP,MAAM,GAAG,CAAC,EACV,IAAI,CAACC,MAAMA,EAAE,IAAI,EACjB,KAAK,IAAI,CAAC,MAAMD,EAAO,SAAS,CAAC;AACtC;AAOA,SAAwBE,EAAgB;AAAA,EACtC,SAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AACT,GAAyB;AACvB,QAAMC,IAAUJ,EAAQ,MAAM,GAAGE,CAAG,GAC9BL,IAASG,EAAQ,MAAME,CAAG,GAC1BG,IAAWR,EAAO,QAElBS,IAAY;AAAA,IAChBC,EAAO,mBAAmB;AAAA,IAC1BJ,MAAS,OAAOI,EAAO,2BAA2BJ,CAAI,EAAE,IAAI;AAAA,IAC5DF;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,MACX,MAAK;AAAA,MACL,cAAY,GAAGN,EAAQ,MAAM;AAAA,MAE5B,UAAA;AAAA,QAAAI,EAAQ,IAAI,CAACK,MACZ,gBAAAD,EAAC,UAAsB,WAAWD,EAAO,yBAAyB,GAChE,UAAA;AAAA,UAAA,gBAAAG,EAAC,QAAA,EAAK,WAAWH,EAAO,4BAA4B,GAClD,UAAA,gBAAAG;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,KAAKF,EAAO;AAAA,cACZ,KAAKA,EAAO;AAAA,cACZ,MAAMA,EAAO;AAAA,cACb,MAAAN;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,UACA,gBAAAO;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWH,EAAO,kCAAkC;AAAA,cACpD,MAAK;AAAA,cAEL,UAAA,gBAAAG;AAAA,gBAACE;AAAA,gBAAA;AAAA,kBACC,OAAM;AAAA,kBACN,WAAWL,EAAO,4BAA4B;AAAA,kBAC9C,OAAOE,EAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,YAChB;AAAA,UAAA;AAAA,QACF,KAlBSA,EAAO,GAmBlB,CACD;AAAA,QACAJ,IAAW,KACV,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACTD,EAAO,yBAAyB;AAAA,cAChCA,EAAO,6BAA6B;AAAA,YAAA,EACpC,KAAK,GAAG;AAAA,YACV,cAAY,GAAGF,CAAQ;AAAA,YAEvB,UAAA;AAAA,cAAA,gBAAAG,EAAC,QAAA,EAAK,WAAWD,EAAO,4BAA4B,GAAG,UAAA;AAAA,gBAAA;AAAA,gBACnDF;AAAA,cAAA,GACJ;AAAA,cACA,gBAAAK;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWH,EAAO,kCAAkC;AAAA,kBACpD,MAAK;AAAA,kBAEL,UAAA,gBAAAG;AAAA,oBAACE;AAAA,oBAAA;AAAA,sBACC,OAAM;AAAA,sBACN,WAAWL,EAAO,4BAA4B;AAAA,sBAC9C,OAAOX,EAAmBC,CAAM;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAClC;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"UserAvatarGroup.js","sources":["../../../src/components/user-avatar-group/UserAvatarGroup.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport Tooltip from '@/components/tooltip/Tooltip';\nimport UserAvatar from '@/components/user-avatar/UserAvatar';\nimport styles from './UserAvatarGroup.module.scss';\n\nexport type UserAvatarGroupSize =\n  | '20'\n  | '24'\n  | '28'\n  | '32'\n  | '40'\n  | '48'\n  | '56'\n  | '64'\n  | '72';\n\nexport interface UserAvatarGroupItem {\n  /** Unique key for the list item. */\n  key: string;\n  /** Image URL for the avatar. Omit to render the Fallback (initials) variant. */\n  src?: string;\n  /** Alt text / display name for the avatar. Drives initials and fallback colour. */\n  name: string;\n}\n\nexport interface UserAvatarGroupProps {\n  /** Array of avatar items to display. */\n  avatars: UserAvatarGroupItem[];\n  /** Maximum number of avatars to show before showing the overflow count. Default: 3. */\n  max?: number;\n  /** Avatar size in px. Matches Figma Avatar Group size options. Default: '20'. */\n  size?: UserAvatarGroupSize;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Accessible name for the group. Default: `{count} participants`. */\n  formatGroupLabel?: (count: number) => string;\n  /** Accessible name for the +N overflow. Default: `{count} more participants`. */\n  formatOverflowLabel?: (count: number) => string;\n  /** Overflow tooltip text. Default: up to three names, then `A, B, +N more`. */\n  formatOverflowNames?: (hidden: UserAvatarGroupItem[]) => ReactNode;\n}\n\nconst defaultFormatGroupLabel = (count: number) => `${count} participants`;\nconst defaultFormatOverflowLabel = (count: number) =>\n  `${count} more participants`;\n\nfunction overflowNamesLabel(hidden: UserAvatarGroupItem[]): string {\n  if (hidden.length === 0) return '';\n  if (hidden.length === 1) return hidden[0].name;\n  if (hidden.length <= 3) return hidden.map((a) => a.name).join(', ');\n  return `${hidden\n    .slice(0, 2)\n    .map((a) => a.name)\n    .join(', ')}, +${hidden.length - 2} more`;\n}\n\n/**\n * A User Avatar Group displays multiple participants as a stack of overlapping avatars. It's\n * a compact way to show \"who's involved\" — thread participants, channel members, call\n * attendees — without a list.\n */\nexport default function UserAvatarGroup({\n  avatars,\n  className = '',\n  max = 3,\n  size = '20',\n  formatGroupLabel = defaultFormatGroupLabel,\n  formatOverflowLabel = defaultFormatOverflowLabel,\n  formatOverflowNames = overflowNamesLabel,\n}: UserAvatarGroupProps) {\n  const visible = avatars.slice(0, max);\n  const hidden = avatars.slice(max);\n  const overflow = hidden.length;\n\n  const rootClass = [\n    styles['user-avatar-group'],\n    size !== '20' ? styles[`user-avatar-group--size-${size}`] : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div\n      className={rootClass}\n      role=\"group\"\n      aria-label={formatGroupLabel(avatars.length)}\n    >\n      {visible.map((avatar) => (\n        <span key={avatar.key} className={styles['user-avatar-group__item']}>\n          <span className={styles['user-avatar-group__trigger']}>\n            <UserAvatar\n              src={avatar.src}\n              alt={avatar.name}\n              name={avatar.name}\n              size={size}\n            />\n          </span>\n          <div\n            className={styles['user-avatar-group__tooltip-layer']}\n            role=\"presentation\"\n          >\n            <Tooltip\n              arrow=\"bottom\"\n              className={styles['user-avatar-group__tooltip']}\n              label={avatar.name}\n            />\n          </div>\n        </span>\n      ))}\n      {overflow > 0 && (\n        <span\n          className={[\n            styles['user-avatar-group__item'],\n            styles['user-avatar-group__overflow'],\n          ].join(' ')}\n          aria-label={formatOverflowLabel(overflow)}\n        >\n          <span className={styles['user-avatar-group__trigger']}>\n            +{overflow}\n          </span>\n          <div\n            className={styles['user-avatar-group__tooltip-layer']}\n            role=\"presentation\"\n          >\n            <Tooltip\n              arrow=\"bottom\"\n              className={styles['user-avatar-group__tooltip']}\n              label={formatOverflowNames(hidden)}\n            />\n          </div>\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["defaultFormatGroupLabel","count","defaultFormatOverflowLabel","overflowNamesLabel","hidden","a","UserAvatarGroup","avatars","className","max","size","formatGroupLabel","formatOverflowLabel","formatOverflowNames","visible","overflow","rootClass","styles","jsxs","avatar","jsx","UserAvatar","Tooltip"],"mappings":"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"}

package/dist/components/user-avatar-group/UserAvatarGroup.module.scss.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./UserAvatarGroup.css');const r={"user-avatar-group":"_user-avatar-group_sgxpf_2","user-avatar-group__item":"_user-avatar-group__item_sgxpf_7","user-avatar-group__tooltip-layer":"_user-avatar-group__tooltip-layer_sgxpf_26","user-avatar-group__trigger":"_user-avatar-group__trigger_sgxpf_31","user-avatar-group__tooltip":"_user-avatar-group__tooltip_sgxpf_26","user-avatar-group__overflow":"_user-avatar-group__overflow_sgxpf_55","user-avatar-group--size-24":"_user-avatar-group--size-24_sgxpf_67","user-avatar-group--size-28":"_user-avatar-group--size-28_sgxpf_79","user-avatar-group--size-32":"_user-avatar-group--size-32_sgxpf_91","user-avatar-group--size-40":"_user-avatar-group--size-40_sgxpf_103","user-avatar-group--size-48":"_user-avatar-group--size-48_sgxpf_115","user-avatar-group--size-56":"_user-avatar-group--size-56_sgxpf_127","user-avatar-group--size-64":"_user-avatar-group--size-64_sgxpf_139","user-avatar-group--size-72":"_user-avatar-group--size-72_sgxpf_151"};exports.default=r;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./UserAvatarGroup.css');const r={"user-avatar-group":"_user-avatar-group_17zfx_2","user-avatar-group__item":"_user-avatar-group__item_17zfx_7","user-avatar-group__tooltip-layer":"_user-avatar-group__tooltip-layer_17zfx_26","user-avatar-group__trigger":"_user-avatar-group__trigger_17zfx_31","user-avatar-group__tooltip":"_user-avatar-group__tooltip_17zfx_26","user-avatar-group__overflow":"_user-avatar-group__overflow_17zfx_55","user-avatar-group--size-24":"_user-avatar-group--size-24_17zfx_67","user-avatar-group--size-28":"_user-avatar-group--size-28_17zfx_79","user-avatar-group--size-32":"_user-avatar-group--size-32_17zfx_91","user-avatar-group--size-40":"_user-avatar-group--size-40_17zfx_103","user-avatar-group--size-48":"_user-avatar-group--size-48_17zfx_115","user-avatar-group--size-56":"_user-avatar-group--size-56_17zfx_127","user-avatar-group--size-64":"_user-avatar-group--size-64_17zfx_139","user-avatar-group--size-72":"_user-avatar-group--size-72_17zfx_151"};exports.default=r;
 //# sourceMappingURL=UserAvatarGroup.module.scss.cjs.map

package/dist/components/user-avatar-group/UserAvatarGroup.module.scss.js

@@ -1,18 +1,18 @@
 import './UserAvatarGroup.css';const r = {
-  "user-avatar-group": "_user-avatar-group_sgxpf_2",
-  "user-avatar-group__item": "_user-avatar-group__item_sgxpf_7",
-  "user-avatar-group__tooltip-layer": "_user-avatar-group__tooltip-layer_sgxpf_26",
-  "user-avatar-group__trigger": "_user-avatar-group__trigger_sgxpf_31",
-  "user-avatar-group__tooltip": "_user-avatar-group__tooltip_sgxpf_26",
-  "user-avatar-group__overflow": "_user-avatar-group__overflow_sgxpf_55",
-  "user-avatar-group--size-24": "_user-avatar-group--size-24_sgxpf_67",
-  "user-avatar-group--size-28": "_user-avatar-group--size-28_sgxpf_79",
-  "user-avatar-group--size-32": "_user-avatar-group--size-32_sgxpf_91",
-  "user-avatar-group--size-40": "_user-avatar-group--size-40_sgxpf_103",
-  "user-avatar-group--size-48": "_user-avatar-group--size-48_sgxpf_115",
-  "user-avatar-group--size-56": "_user-avatar-group--size-56_sgxpf_127",
-  "user-avatar-group--size-64": "_user-avatar-group--size-64_sgxpf_139",
-  "user-avatar-group--size-72": "_user-avatar-group--size-72_sgxpf_151"
+  "user-avatar-group": "_user-avatar-group_17zfx_2",
+  "user-avatar-group__item": "_user-avatar-group__item_17zfx_7",
+  "user-avatar-group__tooltip-layer": "_user-avatar-group__tooltip-layer_17zfx_26",
+  "user-avatar-group__trigger": "_user-avatar-group__trigger_17zfx_31",
+  "user-avatar-group__tooltip": "_user-avatar-group__tooltip_17zfx_26",
+  "user-avatar-group__overflow": "_user-avatar-group__overflow_17zfx_55",
+  "user-avatar-group--size-24": "_user-avatar-group--size-24_17zfx_67",
+  "user-avatar-group--size-28": "_user-avatar-group--size-28_17zfx_79",
+  "user-avatar-group--size-32": "_user-avatar-group--size-32_17zfx_91",
+  "user-avatar-group--size-40": "_user-avatar-group--size-40_17zfx_103",
+  "user-avatar-group--size-48": "_user-avatar-group--size-48_17zfx_115",
+  "user-avatar-group--size-56": "_user-avatar-group--size-56_17zfx_127",
+  "user-avatar-group--size-64": "_user-avatar-group--size-64_17zfx_139",
+  "user-avatar-group--size-72": "_user-avatar-group--size-72_17zfx_151"
 };
 export {
   r as default

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./components/action-button/ActionButton.cjs"),i=require("./components/admin-console-header/AdminConsoleHeader.cjs"),s=require("./components/admin-panel/AdminPanel.cjs"),d=require("./components/admin-panel-footer/AdminPanelFooter.cjs"),l=require("./components/admin-panel-header/AdminPanelHeader.cjs"),c=require("./components/attachment-card/AttachmentCard.cjs"),f=require("./components/button/Button.cjs"),q=require("./components/button/Button.module.scss.cjs"),S=require("./components/card-button/CardButton.cjs"),p=require("./components/card-button/CardButtonGroup.cjs"),P=require("./components/channel-info-msg-header/ChannelInfoMsgHeader.cjs"),T=require("./components/channel-sidebar-item/ChannelSidebarItem.cjs"),M=require("./components/checkbox/Checkbox.cjs"),I=require("./components/chip/Chip.cjs"),v=require("./components/chip/ChipGroup.cjs"),g=require("./components/combobox/Combobox.cjs"),m=require("./components/date-range-picker/DateRangePicker.cjs"),B=require("./components/divider/Divider.cjs"),C=require("./components/dropdown/Dropdown.cjs"),h=require("./components/emoji/Emoji.cjs"),t=require("./components/emoji-button/EmojiButton.cjs"),A=require("./components/emoji-popover/EmojiPopover.cjs"),b=require("./components/empty-state/EmptyState.cjs"),_=require("./components/error-message/ErrorMessage.cjs"),E=require("./components/feature-discovery-panel/FeatureDiscoveryPanel.cjs"),O=require("./components/global-banner/GlobalBanner.cjs"),r=require("./components/icon/Icon.cjs"),o=require("./components/icon-button/IconButton.cjs"),G=require("./components/illustration/Illustration.cjs"),N=require("./components/image-preview/ImagePreview.cjs"),R=require("./components/tag/Tag.cjs"),x=require("./components/link-preview/LinkPreview.cjs"),w=require("./components/mention-badge/MentionBadge.cjs"),H=require("./components/menu-group-heading/MenuGroupHeading.cjs"),k=require("./components/menu-item/MenuItem.cjs"),D=require("./components/message-actions/MessageActions.cjs"),U=require("./components/message-header/MessageHeader.cjs"),F=require("./components/reactions-row/ReactionsRow.cjs"),j=require("./components/reaction-button/ReactionButton.cjs"),y=require("./components/message-separator/MessageSeparator.cjs"),Z=require("./components/modal/Modal.cjs"),J=require("./components/modal-footer/ModalFooter.cjs"),L=require("./components/modal-header/ModalHeader.cjs"),V=require("./components/more-unreads-banner/MoreUnreadsBanner.cjs"),K=require("./components/new-message-banner/NewMessageBanner.cjs"),z=require("./components/pagination-dots/PaginationDots.cjs"),Q=require("./components/permalink-preview/PermalinkPreview.cjs"),W=require("./components/pinned-saved-indicators/PinnedSavedIndicators.cjs"),e=require("./components/popover-menu/PopoverMenu.cjs"),X=require("./components/popover-notice/PopoverNotice.cjs"),Y=require("./components/profile-popover/ProfilePopover.cjs"),$=require("./components/progress-bar/ProgressBar.cjs"),ee=require("./components/radio/Radio.cjs"),re=require("./components/right-sidebar-header/RightSidebarHeader.cjs"),te=require("./components/scrollbar/Scrollbar.cjs"),oe=require("./components/search-input/SearchInput.cjs"),ue=require("./components/search-tip-banner/SearchTipBanner.cjs"),u=require("./components/shortcut-tag/ShortcutTag.cjs"),ae=require("./components/section-notice/SectionNotice.cjs"),ne=require("./components/select/Select.cjs"),ie=require("./components/spinner/Spinner.cjs"),se=require("./components/status-badge/StatusBadge.cjs"),de=require("./components/switch/Switch.cjs"),le=require("./components/tabs/Tabs.cjs"),ce=require("./components/team-avatar/TeamAvatar.cjs"),fe=require("./components/team-sidebar/TeamSidebar.cjs"),qe=require("./components/text-area/TextArea.cjs"),Se=require("./components/text-input/TextInput.cjs"),pe=require("./components/thread-footer/ThreadFooter.cjs"),Pe=require("./components/thread-list-item/ThreadListItem.cjs"),Te=require("./components/toast/Toast.cjs"),Me=require("./components/tooltip/Tooltip.cjs"),Ie=require("./components/tour-point/TourPoint.cjs"),ve=require("./components/unread-badge/UnreadBadge.cjs"),ge=require("./components/user-avatar/UserAvatar.cjs"),me=require("./components/user-avatar-group/UserAvatarGroup.cjs"),Be=require("./hooks/use-controllable.cjs"),Ce=require("./hooks/use-exit-animation.cjs"),he=require("./hooks/use-outside-close.cjs"),a=require("./hooks/use-popover-transition.cjs"),Ae=require("./utils/string.cjs");exports.ActionButton=n.default;exports.AdminConsoleHeader=i.default;exports.AdminPanel=s.default;exports.AdminPanelFooter=d.default;exports.AdminPanelHeader=l.default;exports.AttachmentCard=c.default;exports.Button=f.default;exports.btnStyles=q.default;exports.CardButton=S.default;exports.CardButtonGroup=p.default;exports.ChannelInfoMsgHeader=P.default;exports.ChannelSidebarItem=T.default;exports.Checkbox=M.default;exports.Chip=I.default;exports.ChipGroup=v.default;exports.Combobox=g.default;exports.DateRangePicker=m.default;exports.Divider=B.default;exports.Dropdown=C.default;exports.Emoji=h.default;exports.EMOJI_BUTTON_EMOJI_SIZES=t.EMOJI_BUTTON_EMOJI_SIZES;exports.EmojiButton=t.default;exports.EmojiPopover=A.default;exports.EmptyState=b.default;exports.ErrorMessage=_.default;exports.FeatureDiscoveryPanel=E.default;exports.GlobalBanner=O.default;exports.Icon=r.default;exports.IconSlotContext=r.IconSlotContext;exports.SVG_SIZE_MAP=r.SVG_SIZE_MAP;exports.useIconSlotContext=r.useIconSlotContext;exports.ICON_BUTTON_ICON_SIZES=o.ICON_BUTTON_ICON_SIZES;exports.IconButton=o.default;exports.Illustration=G.default;exports.ImagePreview=N.default;exports.Tag=R.default;exports.LinkPreview=x.default;exports.MentionBadge=w.default;exports.MenuGroupHeading=H.default;exports.MenuItem=k.default;exports.MessageActions=D.default;exports.MessageHeader=U.default;exports.ReactionsRow=F.default;exports.ReactionButton=j.default;exports.MessageSeparator=y.default;exports.Modal=Z.default;exports.ModalFooter=J.default;exports.ModalHeader=L.default;exports.MoreUnreadsBanner=V.default;exports.NewMessageBanner=K.default;exports.PaginationDots=z.default;exports.PermalinkPreview=Q.default;exports.PinnedSavedIndicators=W.default;exports.PopoverMenu=e.default;exports.PopoverMenuDivider=e.PopoverMenuDivider;exports.PopoverMenuGroup=e.PopoverMenuGroup;exports.PopoverMenuGroupTitle=e.PopoverMenuGroupTitle;exports.PopoverMenuScroll=e.PopoverMenuScroll;exports.PopoverMenuTitle=e.PopoverMenuTitle;exports.PopoverNotice=X.default;exports.ProfilePopover=Y.default;exports.ProgressBar=$.default;exports.Radio=ee.default;exports.RightSidebarHeader=re.default;exports.Scrollbar=te.default;exports.SearchInput=oe.default;exports.SearchTipBanner=ue.default;exports.ShortcutTag=u.default;exports.ShortcutTagGroup=u.ShortcutTagGroup;exports.SectionNotice=ae.default;exports.Select=ne.default;exports.Spinner=ie.default;exports.StatusBadge=se.default;exports.Switch=de.default;exports.Tabs=le.default;exports.TeamAvatar=ce.default;exports.TeamSidebar=fe.default;exports.TextArea=qe.default;exports.TextInput=Se.default;exports.ThreadFooter=pe.default;exports.ThreadListItem=Pe.default;exports.Toast=Te.default;exports.Tooltip=Me.default;exports.TourPoint=Ie.default;exports.UnreadBadge=ve.default;exports.UserAvatar=ge.default;exports.UserAvatarGroup=me.default;exports.useControllable=Be.useControllable;exports.useExitAnimation=Ce.useExitAnimation;exports.useOutsideClose=he.useOutsideClose;exports.POPOVER_TRANSITION_MS=a.POPOVER_TRANSITION_MS;exports.usePopoverTransition=a.usePopoverTransition;exports.toKebab=Ae.toKebab;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./components/action-button/ActionButton.cjs"),i=require("./components/admin-console-header/AdminConsoleHeader.cjs"),s=require("./components/admin-panel/AdminPanel.cjs"),d=require("./components/admin-panel-footer/AdminPanelFooter.cjs"),l=require("./components/admin-panel-header/AdminPanelHeader.cjs"),c=require("./components/attachment-card/AttachmentCard.cjs"),f=require("./components/button/Button.cjs"),q=require("./components/button/Button.module.scss.cjs"),p=require("./components/card-button/CardButton.cjs"),P=require("./components/card-button/CardButtonGroup.cjs"),S=require("./components/channel-info-msg-header/ChannelInfoMsgHeader.cjs"),M=require("./components/channel-sidebar-item/ChannelSidebarItem.cjs"),T=require("./components/checkbox/Checkbox.cjs"),I=require("./components/chip/Chip.cjs"),v=require("./components/chip/ChipGroup.cjs"),g=require("./components/combobox/Combobox.cjs"),m=require("./components/date-range-picker/DateRangePicker.cjs"),B=require("./components/divider/Divider.cjs"),C=require("./components/dropdown/Dropdown.cjs"),h=require("./components/emoji/Emoji.cjs"),t=require("./components/emoji-button/EmojiButton.cjs"),A=require("./components/emoji-popover/EmojiPopover.cjs"),b=require("./components/empty-state/EmptyState.cjs"),_=require("./components/error-message/ErrorMessage.cjs"),E=require("./components/feature-discovery-panel/FeatureDiscoveryPanel.cjs"),O=require("./components/global-banner/GlobalBanner.cjs"),r=require("./components/icon/Icon.cjs"),o=require("./components/icon-button/IconButton.cjs"),G=require("./components/illustration/Illustration.cjs"),N=require("./components/image-preview/ImagePreview.cjs"),R=require("./components/tag/Tag.cjs"),x=require("./components/link-preview/LinkPreview.cjs"),w=require("./components/mention-badge/MentionBadge.cjs"),H=require("./components/menu-group-heading/MenuGroupHeading.cjs"),k=require("./components/menu-item/MenuItem.cjs"),D=require("./components/message-actions/MessageActions.cjs"),U=require("./components/message-header/MessageHeader.cjs"),F=require("./components/reactions-row/ReactionsRow.cjs"),j=require("./components/reaction-button/ReactionButton.cjs"),y=require("./components/message-separator/MessageSeparator.cjs"),Z=require("./components/modal/Modal.cjs"),J=require("./components/modal-footer/ModalFooter.cjs"),L=require("./components/modal-header/ModalHeader.cjs"),V=require("./components/more-unreads-banner/MoreUnreadsBanner.cjs"),K=require("./components/new-message-banner/NewMessageBanner.cjs"),z=require("./components/pagination-dots/PaginationDots.cjs"),Q=require("./components/permalink-preview/PermalinkPreview.cjs"),W=require("./components/pinned-saved-indicators/PinnedSavedIndicators.cjs"),e=require("./components/popover-menu/PopoverMenu.cjs"),X=require("./components/popover-notice/PopoverNotice.cjs"),Y=require("./components/profile-popover/ProfilePopover.cjs"),$=require("./components/progress-bar/ProgressBar.cjs"),ee=require("./components/radio/Radio.cjs"),re=require("./components/right-sidebar-header/RightSidebarHeader.cjs"),te=require("./components/scrollbar/Scrollbar.cjs"),oe=require("./components/search-input/SearchInput.cjs"),ne=require("./components/search-tip-banner/SearchTipBanner.cjs"),n=require("./components/shortcut-tag/ShortcutTag.cjs"),ue=require("./components/section-notice/SectionNotice.cjs"),ae=require("./components/select/Select.cjs"),ie=require("./components/spinner/Spinner.cjs"),se=require("./components/status-badge/StatusBadge.cjs"),de=require("./components/switch/Switch.cjs"),le=require("./components/tabs/Tabs.cjs"),ce=require("./components/team-avatar/TeamAvatar.cjs"),fe=require("./components/text-area/TextArea.cjs"),qe=require("./components/text-input/TextInput.cjs"),pe=require("./components/thread-footer/ThreadFooter.cjs"),Pe=require("./components/thread-list-item/ThreadListItem.cjs"),Se=require("./components/toast/Toast.cjs"),Me=require("./components/tooltip/Tooltip.cjs"),Te=require("./components/tour-point/TourPoint.cjs"),Ie=require("./components/unread-badge/UnreadBadge.cjs"),ve=require("./components/user-avatar/UserAvatar.cjs"),ge=require("./components/user-avatar-group/UserAvatarGroup.cjs"),me=require("./hooks/use-controllable.cjs"),Be=require("./hooks/use-exit-animation.cjs"),Ce=require("./hooks/use-outside-close.cjs"),u=require("./hooks/use-popover-transition.cjs"),he=require("./utils/string.cjs");exports.ActionButton=a.default;exports.AdminConsoleHeader=i.default;exports.AdminPanel=s.default;exports.AdminPanelFooter=d.default;exports.AdminPanelHeader=l.default;exports.AttachmentCard=c.default;exports.Button=f.default;exports.btnStyles=q.default;exports.CardButton=p.default;exports.CardButtonGroup=P.default;exports.ChannelInfoMsgHeader=S.default;exports.ChannelSidebarItem=M.default;exports.Checkbox=T.default;exports.Chip=I.default;exports.ChipGroup=v.default;exports.Combobox=g.default;exports.DateRangePicker=m.default;exports.Divider=B.default;exports.Dropdown=C.default;exports.Emoji=h.default;exports.EMOJI_BUTTON_EMOJI_SIZES=t.EMOJI_BUTTON_EMOJI_SIZES;exports.EmojiButton=t.default;exports.EmojiPopover=A.default;exports.EmptyState=b.default;exports.ErrorMessage=_.default;exports.FeatureDiscoveryPanel=E.default;exports.GlobalBanner=O.default;exports.Icon=r.default;exports.IconSlotContext=r.IconSlotContext;exports.SVG_SIZE_MAP=r.SVG_SIZE_MAP;exports.useIconSlotContext=r.useIconSlotContext;exports.ICON_BUTTON_ICON_SIZES=o.ICON_BUTTON_ICON_SIZES;exports.IconButton=o.default;exports.Illustration=G.default;exports.ImagePreview=N.default;exports.Tag=R.default;exports.LinkPreview=x.default;exports.MentionBadge=w.default;exports.MenuGroupHeading=H.default;exports.MenuItem=k.default;exports.MessageActions=D.default;exports.MessageHeader=U.default;exports.ReactionsRow=F.default;exports.ReactionButton=j.default;exports.MessageSeparator=y.default;exports.Modal=Z.default;exports.ModalFooter=J.default;exports.ModalHeader=L.default;exports.MoreUnreadsBanner=V.default;exports.NewMessageBanner=K.default;exports.PaginationDots=z.default;exports.PermalinkPreview=Q.default;exports.PinnedSavedIndicators=W.default;exports.PopoverMenu=e.default;exports.PopoverMenuDivider=e.PopoverMenuDivider;exports.PopoverMenuGroup=e.PopoverMenuGroup;exports.PopoverMenuGroupTitle=e.PopoverMenuGroupTitle;exports.PopoverMenuScroll=e.PopoverMenuScroll;exports.PopoverMenuTitle=e.PopoverMenuTitle;exports.PopoverNotice=X.default;exports.ProfilePopover=Y.default;exports.ProgressBar=$.default;exports.Radio=ee.default;exports.RightSidebarHeader=re.default;exports.Scrollbar=te.default;exports.SearchInput=oe.default;exports.SearchTipBanner=ne.default;exports.ShortcutTag=n.default;exports.ShortcutTagGroup=n.ShortcutTagGroup;exports.SectionNotice=ue.default;exports.Select=ae.default;exports.Spinner=ie.default;exports.StatusBadge=se.default;exports.Switch=de.default;exports.Tabs=le.default;exports.TeamAvatar=ce.default;exports.TextArea=fe.default;exports.TextInput=qe.default;exports.ThreadFooter=pe.default;exports.ThreadListItem=Pe.default;exports.Toast=Se.default;exports.Tooltip=Me.default;exports.TourPoint=Te.default;exports.UnreadBadge=Ie.default;exports.UserAvatar=ve.default;exports.UserAvatarGroup=ge.default;exports.useControllable=me.useControllable;exports.useExitAnimation=Be.useExitAnimation;exports.useOutsideClose=Ce.useOutsideClose;exports.POPOVER_TRANSITION_MS=u.POPOVER_TRANSITION_MS;exports.usePopoverTransition=u.usePopoverTransition;exports.toKebab=he.toKebab;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.ts

@@ -65,7 +65,6 @@ export * from './components/status-badge/index';
 export * from './components/switch/index';
 export * from './components/tabs/index';
 export * from './components/team-avatar/index';
-export * from './components/team-sidebar/index';
 export * from './components/text-area/index';
 export * from './components/text-input/index';
 export * from './components/thread-footer/index';
@@ -81,5 +80,6 @@ export * from './hooks/use-exit-animation';
 export * from './hooks/use-outside-close';
 export * from './hooks/use-popover-transition';
 export { toKebab } from './utils/string';
+export type { BuiltInButtonProps, DataAttributes } from './utils/props';
 export { default as btnStyles } from './components/button/Button.module.scss';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -5,9 +5,9 @@ import { default as d } from "./components/admin-panel-footer/AdminPanelFooter.j
 import { default as l } from "./components/admin-panel-header/AdminPanelHeader.js";
 import { default as x } from "./components/attachment-card/AttachmentCard.js";
 import { default as i } from "./components/button/Button.js";
-import { default as P } from "./components/button/Button.module.scss.js";
+import { default as S } from "./components/button/Button.module.scss.js";
 import { default as M } from "./components/card-button/CardButton.js";
-import { default as I } from "./components/card-button/CardButtonGroup.js";
+import { default as T } from "./components/card-button/CardButtonGroup.js";
 import { default as g } from "./components/channel-info-msg-header/ChannelInfoMsgHeader.js";
 import { default as C } from "./components/channel-sidebar-item/ChannelSidebarItem.js";
 import { default as A } from "./components/checkbox/Checkbox.js";
@@ -29,9 +29,9 @@ import { ICON_BUTTON_ICON_SIZES as se, default as ue } from "./components/icon-b
 import { default as pe } from "./components/illustration/Illustration.js";
 import { default as me } from "./components/image-preview/ImagePreview.js";
 import { default as ne } from "./components/tag/Tag.js";
-import { default as Se } from "./components/link-preview/LinkPreview.js";
+import { default as Pe } from "./components/link-preview/LinkPreview.js";
 import { default as ce } from "./components/mention-badge/MentionBadge.js";
-import { default as Te } from "./components/menu-group-heading/MenuGroupHeading.js";
+import { default as Ie } from "./components/menu-group-heading/MenuGroupHeading.js";
 import { default as ve } from "./components/menu-item/MenuItem.js";
 import { default as Be } from "./components/message-actions/MessageActions.js";
 import { default as he } from "./components/message-header/MessageHeader.js";
@@ -53,9 +53,9 @@ import { default as so } from "./components/progress-bar/ProgressBar.js";
 import { default as po } from "./components/radio/Radio.js";
 import { default as mo } from "./components/right-sidebar-header/RightSidebarHeader.js";
 import { default as no } from "./components/scrollbar/Scrollbar.js";
-import { default as So } from "./components/search-input/SearchInput.js";
+import { default as Po } from "./components/search-input/SearchInput.js";
 import { default as co } from "./components/search-tip-banner/SearchTipBanner.js";
-import { default as To, ShortcutTagGroup as Io } from "./components/shortcut-tag/ShortcutTag.js";
+import { default as Io, ShortcutTagGroup as To } from "./components/shortcut-tag/ShortcutTag.js";
 import { default as go } from "./components/section-notice/SectionNotice.js";
 import { default as Co } from "./components/select/Select.js";
 import { default as Ao } from "./components/spinner/Spinner.js";
@@ -63,22 +63,21 @@ import { default as Eo } from "./components/status-badge/StatusBadge.js";
 import { default as _o } from "./components/switch/Switch.js";
 import { default as No } from "./components/tabs/Tabs.js";
 import { default as wo } from "./components/team-avatar/TeamAvatar.js";
-import { default as Do } from "./components/team-sidebar/TeamSidebar.js";
-import { default as ko } from "./components/text-area/TextArea.js";
-import { default as jo } from "./components/text-input/TextInput.js";
-import { default as Zo } from "./components/thread-footer/ThreadFooter.js";
-import { default as Lo } from "./components/thread-list-item/ThreadListItem.js";
-import { default as Ko } from "./components/toast/Toast.js";
-import { default as zo } from "./components/tooltip/Tooltip.js";
-import { default as Wo } from "./components/tour-point/TourPoint.js";
-import { default as Yo } from "./components/unread-badge/UnreadBadge.js";
-import { default as er } from "./components/user-avatar/UserAvatar.js";
-import { default as rr } from "./components/user-avatar-group/UserAvatarGroup.js";
-import { useControllable as ar } from "./hooks/use-controllable.js";
-import { useExitAnimation as sr } from "./hooks/use-exit-animation.js";
-import { useOutsideClose as dr } from "./hooks/use-outside-close.js";
-import { POPOVER_TRANSITION_MS as lr, usePopoverTransition as mr } from "./hooks/use-popover-transition.js";
-import { toKebab as nr } from "./utils/string.js";
+import { default as Do } from "./components/text-area/TextArea.js";
+import { default as ko } from "./components/text-input/TextInput.js";
+import { default as jo } from "./components/thread-footer/ThreadFooter.js";
+import { default as Zo } from "./components/thread-list-item/ThreadListItem.js";
+import { default as Lo } from "./components/toast/Toast.js";
+import { default as Ko } from "./components/tooltip/Tooltip.js";
+import { default as zo } from "./components/tour-point/TourPoint.js";
+import { default as Wo } from "./components/unread-badge/UnreadBadge.js";
+import { default as Yo } from "./components/user-avatar/UserAvatar.js";
+import { default as er } from "./components/user-avatar-group/UserAvatarGroup.js";
+import { useControllable as rr } from "./hooks/use-controllable.js";
+import { useExitAnimation as ar } from "./hooks/use-exit-animation.js";
+import { useOutsideClose as sr } from "./hooks/use-outside-close.js";
+import { POPOVER_TRANSITION_MS as dr, usePopoverTransition as pr } from "./hooks/use-popover-transition.js";
+import { toKebab as mr } from "./utils/string.js";
 export {
   r as ActionButton,
   a as AdminConsoleHeader,
@@ -88,7 +87,7 @@ export {
   x as AttachmentCard,
   i as Button,
   M as CardButton,
-  I as CardButtonGroup,
+  T as CardButtonGroup,
   g as ChannelInfoMsgHeader,
   C as ChannelSidebarItem,
   A as Checkbox,
@@ -112,9 +111,9 @@ export {
   re as IconSlotContext,
   pe as Illustration,
   me as ImagePreview,
-  Se as LinkPreview,
+  Pe as LinkPreview,
   ce as MentionBadge,
-  Te as MenuGroupHeading,
+  Ie as MenuGroupHeading,
   ve as MenuItem,
   Be as MessageActions,
   he as MessageHeader,
@@ -124,7 +123,7 @@ export {
   Ue as ModalHeader,
   Fe as MoreUnreadsBanner,
   ye as NewMessageBanner,
-  lr as POPOVER_TRANSITION_MS,
+  dr as POPOVER_TRANSITION_MS,
   Je as PaginationDots,
   Ve as PermalinkPreview,
   qe as PinnedSavedIndicators,
@@ -143,35 +142,34 @@ export {
   mo as RightSidebarHeader,
   te as SVG_SIZE_MAP,
   no as Scrollbar,
-  So as SearchInput,
+  Po as SearchInput,
   co as SearchTipBanner,
   go as SectionNotice,
   Co as Select,
-  To as ShortcutTag,
-  Io as ShortcutTagGroup,
+  Io as ShortcutTag,
+  To as ShortcutTagGroup,
   Ao as Spinner,
   Eo as StatusBadge,
   _o as Switch,
   No as Tabs,
   ne as Tag,
   wo as TeamAvatar,
-  Do as TeamSidebar,
-  ko as TextArea,
-  jo as TextInput,
-  Zo as ThreadFooter,
-  Lo as ThreadListItem,
-  Ko as Toast,
-  zo as Tooltip,
-  Wo as TourPoint,
-  Yo as UnreadBadge,
-  er as UserAvatar,
-  rr as UserAvatarGroup,
-  P as btnStyles,
-  nr as toKebab,
-  ar as useControllable,
-  sr as useExitAnimation,
+  Do as TextArea,
+  ko as TextInput,
+  jo as ThreadFooter,
+  Zo as ThreadListItem,
+  Lo as Toast,
+  Ko as Tooltip,
+  zo as TourPoint,
+  Wo as UnreadBadge,
+  Yo as UserAvatar,
+  er as UserAvatarGroup,
+  S as btnStyles,
+  mr as toKebab,
+  rr as useControllable,
+  ar as useExitAnimation,
   ae as useIconSlotContext,
-  dr as useOutsideClose,
-  mr as usePopoverTransition
+  sr as useOutsideClose,
+  pr as usePopoverTransition
 };
 //# sourceMappingURL=index.js.map

package/dist/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/utils/props.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function r(...e){return e.filter(Boolean).join(" ")}exports.mergeClassNames=r;
+//# sourceMappingURL=props.cjs.map

package/dist/utils/props.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.cjs","sources":["../../src/utils/props.ts"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react';\n\n/** `data-*` attributes, so object literals like `{ 'data-testid': 'x' }` type-check. */\nexport type DataAttributes = {\n  [key: `data-${string}`]: string | number | boolean | undefined;\n};\n\n/**\n * Extra attributes for a component's built-in button (close, dismiss, back,\n * clear). The component's own `onClick`, `aria-label`, and variant props take\n * precedence; `className` is merged.\n */\nexport type BuiltInButtonProps = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  'children' | 'style'\n> &\n  DataAttributes;\n\nexport function mergeClassNames(\n  ...names: Array<string | false | null | undefined>\n): string {\n  return names.filter(Boolean).join(' ');\n}\n"],"names":["mergeClassNames","names"],"mappings":"gFAkBO,SAASA,KACXC,EACK,CACR,OAAOA,EAAM,OAAO,OAAO,EAAE,KAAK,GAAG,CACvC"}

package/dist/utils/props.d.ts

@@ -0,0 +1,13 @@
+import { ButtonHTMLAttributes } from 'react';
+/** `data-*` attributes, so object literals like `{ 'data-testid': 'x' }` type-check. */
+export type DataAttributes = {
+    [key: `data-${string}`]: string | number | boolean | undefined;
+};
+/**
+ * Extra attributes for a component's built-in button (close, dismiss, back,
+ * clear). The component's own `onClick`, `aria-label`, and variant props take
+ * precedence; `className` is merged.
+ */
+export type BuiltInButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'style'> & DataAttributes;
+export declare function mergeClassNames(...names: Array<string | false | null | undefined>): string;
+//# sourceMappingURL=props.d.ts.map

package/dist/utils/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/utils/props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,wFAAwF;AACxF,MAAM,MAAM,cAAc,GAAG;IAC3B,CAAC,GAAG,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CAChE,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACnC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,GAAG,OAAO,CACrB,GACC,cAAc,CAAC;AAEjB,wBAAgB,eAAe,CAC7B,GAAG,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,GACjD,MAAM,CAER"}

package/dist/utils/props.js

@@ -0,0 +1,7 @@
+function n(...e) {
+  return e.filter(Boolean).join(" ");
+}
+export {
+  n as mergeClassNames
+};
+//# sourceMappingURL=props.js.map

package/dist/utils/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","sources":["../../src/utils/props.ts"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react';\n\n/** `data-*` attributes, so object literals like `{ 'data-testid': 'x' }` type-check. */\nexport type DataAttributes = {\n  [key: `data-${string}`]: string | number | boolean | undefined;\n};\n\n/**\n * Extra attributes for a component's built-in button (close, dismiss, back,\n * clear). The component's own `onClick`, `aria-label`, and variant props take\n * precedence; `className` is merged.\n */\nexport type BuiltInButtonProps = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  'children' | 'style'\n> &\n  DataAttributes;\n\nexport function mergeClassNames(\n  ...names: Array<string | false | null | undefined>\n): string {\n  return names.filter(Boolean).join(' ');\n}\n"],"names":["mergeClassNames","names"],"mappings":"AAkBO,SAASA,KACXC,GACK;AACR,SAAOA,EAAM,OAAO,OAAO,EAAE,KAAK,GAAG;AACvC;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mattermost/compass-ui",
-  "version": "0.1.0-alpha.11",
+  "version": "0.1.0-alpha.13",
   "description": "Compass design system UI components for Mattermost products",
   "repository": {
     "type": "git",
@@ -67,11 +67,6 @@
     "react-dom": "^18.2.0 || ^19.0.0",
     "simplebar-react": "^3.3.2"
   },
-  "peerDependenciesMeta": {
-    "simplebar-react": {
-      "optional": true
-    }
-  },
   "devDependencies": {
     "@fontsource/metropolis": "^5.2.5",
     "@fontsource/open-sans": "^5.2.7",
@@ -297,9 +292,6 @@
       "components/team-avatar": [
         "./dist/components/team-avatar/index.d.ts"
       ],
-      "components/team-sidebar": [
-        "./dist/components/team-sidebar/index.d.ts"
-      ],
       "components/text-area": [
         "./dist/components/text-area/index.d.ts"
       ],

package/dist/components/team-sidebar/TeamSidebar.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),__x=require("@mattermost/compass-icons/components/plus.js"),x=__x?.default??__x,__h=require("@mattermost/compass-icons/components/dialpad.js"),h=__h?.default??__h,l=require("../icon/Icon.cjs"),d=require("../icon-button/IconButton.cjs"),p=require("../team-avatar/TeamAvatar.cjs"),q=require("../unread-badge/UnreadBadge.cjs"),s=require("./TeamSidebar.module.scss.cjs");function g({className:n="",teams:u,activeTeamId:o,showAddTeam:c=!0,showDialPad:f=!1,dialPadActive:m=!1,onSelectTeam:i,onAddTeam:b,onDialPadClick:j}){const _=[s.default["team-sidebar"],n].filter(Boolean).join(" ");return a.jsxs("div",{className:_,children:[a.jsxs("div",{className:s.default["team-sidebar__teams"],children:[u.map(e=>{const t=e.id===o,r=e.mentions!=null&&e.mentions>0,v=e.unread&&!t&&!r;return a.jsxs("button",{type:"button",className:s.default["team-sidebar__team"],"aria-label":e.name,"aria-current":t?"true":void 0,onClick:()=>i==null?void 0:i(e.id),children:[a.jsx(p.default,{src:e.src,alt:e.name,initials:e.initials,state:t?"active":"default",badge:r?e.mentions:void 0}),v&&a.jsx(q.default,{className:s.default["team-sidebar__unread"],"aria-label":`${e.name} has unread messages`})]},e.id)}),c&&a.jsx(d.default,{"aria-label":"Add team",size:"medium",style:"inverted",icon:a.jsx(l.default,{size:"20",glyph:a.jsx(x,{})}),onClick:b,className:s.default["team-sidebar__add"]})]}),f&&a.jsx("div",{className:s.default["team-sidebar__footer"],children:a.jsx(d.default,{"aria-label":"Dial pad",size:"small",style:"inverted",active:m,icon:a.jsx(l.default,{size:"16",glyph:a.jsx(h,{})}),onClick:j,className:s.default["team-sidebar__dial-pad"]})})]})}exports.default=g;
-//# sourceMappingURL=TeamSidebar.cjs.map

package/dist/components/team-sidebar/TeamSidebar.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"TeamSidebar.cjs","sources":["../../../src/components/team-sidebar/TeamSidebar.tsx"],"sourcesContent":["import PlusIcon from '@mattermost/compass-icons/components/plus';\nimport DialpadIcon from '@mattermost/compass-icons/components/dialpad';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport TeamAvatar from '@/components/team-avatar/TeamAvatar';\nimport UnreadBadge from '@/components/unread-badge/UnreadBadge';\nimport styles from './TeamSidebar.module.scss';\n\nexport interface TeamSidebarItem {\n  id: string;\n  name: string;\n  src?: string;\n  initials?: string;\n  unread?: boolean;\n  mentions?: number;\n}\n\nexport interface TeamSidebarProps {\n  className?: string;\n  teams: TeamSidebarItem[];\n  activeTeamId?: string;\n  showAddTeam?: boolean;\n  showDialPad?: boolean;\n  dialPadActive?: boolean;\n  onSelectTeam?: (id: string) => void;\n  onAddTeam?: () => void;\n  onDialPadClick?: () => void;\n}\n\nexport default function TeamSidebar({\n  className = '',\n  teams,\n  activeTeamId,\n  showAddTeam = true,\n  showDialPad = false,\n  dialPadActive = false,\n  onSelectTeam,\n  onAddTeam,\n  onDialPadClick,\n}: TeamSidebarProps) {\n  const rootClass = [styles['team-sidebar'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass}>\n      <div className={styles['team-sidebar__teams']}>\n        {teams.map((team) => {\n          const active = team.id === activeTeamId;\n          const hasMentions = team.mentions != null && team.mentions > 0;\n          const showUnreadDot = team.unread && !active && !hasMentions;\n          return (\n            <button\n              key={team.id}\n              type=\"button\"\n              className={styles['team-sidebar__team']}\n              aria-label={team.name}\n              aria-current={active ? 'true' : undefined}\n              onClick={() => onSelectTeam?.(team.id)}\n            >\n              <TeamAvatar\n                src={team.src}\n                alt={team.name}\n                initials={team.initials}\n                state={active ? 'active' : 'default'}\n                badge={hasMentions ? team.mentions : undefined}\n              />\n              {showUnreadDot && (\n                <UnreadBadge\n                  className={styles['team-sidebar__unread']}\n                  aria-label={`${team.name} has unread messages`}\n                />\n              )}\n            </button>\n          );\n        })}\n        {showAddTeam && (\n          <IconButton\n            aria-label=\"Add team\"\n            size=\"medium\"\n            style=\"inverted\"\n            icon={<Icon size=\"20\" glyph={<PlusIcon />} />}\n            onClick={onAddTeam}\n            className={styles['team-sidebar__add']}\n          />\n        )}\n      </div>\n      {showDialPad && (\n        <div className={styles['team-sidebar__footer']}>\n          <IconButton\n            aria-label=\"Dial pad\"\n            size=\"small\"\n            style=\"inverted\"\n            active={dialPadActive}\n            icon={<Icon size=\"16\" glyph={<DialpadIcon />} />}\n            onClick={onDialPadClick}\n            className={styles['team-sidebar__dial-pad']}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["TeamSidebar","className","teams","activeTeamId","showAddTeam","showDialPad","dialPadActive","onSelectTeam","onAddTeam","onDialPadClick","rootClass","styles","jsxs","team","active","hasMentions","showUnreadDot","jsx","TeamAvatar","UnreadBadge","IconButton","Icon","PlusIcon","DialpadIcon"],"mappings":"2cA6BA,SAAwBA,EAAY,CAClC,UAAAC,EAAY,GACZ,MAAAC,EACA,aAAAC,EACA,YAAAC,EAAc,GACd,YAAAC,EAAc,GACd,cAAAC,EAAgB,GAChB,aAAAC,EACA,UAAAC,EACA,eAAAC,CACF,EAAqB,CACnB,MAAMC,EAAY,CAACC,UAAO,cAAc,EAAGV,CAAS,EACjD,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEW,EAAAA,KAAC,MAAA,CAAI,UAAWF,EACd,SAAA,CAAAE,EAAAA,KAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,qBAAqB,EACzC,SAAA,CAAAT,EAAM,IAAKW,GAAS,CACnB,MAAMC,EAASD,EAAK,KAAOV,EACrBY,EAAcF,EAAK,UAAY,MAAQA,EAAK,SAAW,EACvDG,EAAgBH,EAAK,QAAU,CAACC,GAAU,CAACC,EACjD,OACEH,EAAAA,KAAC,SAAA,CAEC,KAAK,SACL,UAAWD,EAAAA,QAAO,oBAAoB,EACtC,aAAYE,EAAK,KACjB,eAAcC,EAAS,OAAS,OAChC,QAAS,IAAMP,GAAA,YAAAA,EAAeM,EAAK,IAEnC,SAAA,CAAAI,EAAAA,IAACC,EAAAA,QAAA,CACC,IAAKL,EAAK,IACV,IAAKA,EAAK,KACV,SAAUA,EAAK,SACf,MAAOC,EAAS,SAAW,UAC3B,MAAOC,EAAcF,EAAK,SAAW,MAAA,CAAA,EAEtCG,GACCC,EAAAA,IAACE,EAAAA,QAAA,CACC,UAAWR,EAAAA,QAAO,sBAAsB,EACxC,aAAY,GAAGE,EAAK,IAAI,sBAAA,CAAA,CAC1B,CAAA,EAlBGA,EAAK,EAAA,CAsBhB,CAAC,EACAT,GACCa,EAAAA,IAACG,EAAAA,QAAA,CACC,aAAW,WACX,KAAK,SACL,MAAM,WACN,WAAOC,UAAA,CAAK,KAAK,KAAK,MAAOJ,MAACK,IAAS,EAAI,EAC3C,QAASd,EACT,UAAWG,EAAAA,QAAO,mBAAmB,CAAA,CAAA,CACvC,EAEJ,EACCN,GACCY,EAAAA,IAAC,MAAA,CAAI,UAAWN,EAAAA,QAAO,sBAAsB,EAC3C,SAAAM,EAAAA,IAACG,EAAAA,QAAA,CACC,aAAW,WACX,KAAK,QACL,MAAM,WACN,OAAQd,EACR,WAAOe,UAAA,CAAK,KAAK,KAAK,MAAOJ,MAACM,IAAY,EAAI,EAC9C,QAASd,EACT,UAAWE,EAAAA,QAAO,wBAAwB,CAAA,CAAA,CAC5C,CACF,CAAA,EAEJ,CAEJ"}

package/dist/components/team-sidebar/TeamSidebar.css

@@ -1 +0,0 @@
-._team-sidebar_5rhbh_2{display:flex;flex-direction:column;align-items:stretch;padding:var(--spacing-m);background-color:var(--sidebar-header-bg);height:100%}._team-sidebar__teams_5rhbh_10{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-m)}._team-sidebar__footer_5rhbh_16{margin-top:auto;display:flex;justify-content:center;padding-top:var(--spacing-m)}._team-sidebar__dial-pad_5rhbh_22{border-radius:var(--radius-m)}._team-sidebar__team_5rhbh_10{position:relative;display:inline-flex;padding:0;border:0;background:transparent;cursor:pointer;border-radius:var(--radius-m)}._team-sidebar__team_5rhbh_10:focus-visible{outline:2px solid var(--sidebar-text-active-border);outline-offset:2px}._team-sidebar__unread_5rhbh_38{position:absolute;top:-2px;right:-2px;z-index:2;box-shadow:0 0 0 2px var(--sidebar-header-bg, #192a4d)}._team-sidebar__add_5rhbh_45{border-radius:var(--radius-m)}

package/dist/components/team-sidebar/TeamSidebar.d.ts

@@ -1,21 +0,0 @@
-export interface TeamSidebarItem {
-    id: string;
-    name: string;
-    src?: string;
-    initials?: string;
-    unread?: boolean;
-    mentions?: number;
-}
-export interface TeamSidebarProps {
-    className?: string;
-    teams: TeamSidebarItem[];
-    activeTeamId?: string;
-    showAddTeam?: boolean;
-    showDialPad?: boolean;
-    dialPadActive?: boolean;
-    onSelectTeam?: (id: string) => void;
-    onAddTeam?: () => void;
-    onDialPadClick?: () => void;
-}
-export default function TeamSidebar({ className, teams, activeTeamId, showAddTeam, showDialPad, dialPadActive, onSelectTeam, onAddTeam, onDialPadClick, }: TeamSidebarProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=TeamSidebar.d.ts.map

package/dist/components/team-sidebar/TeamSidebar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TeamSidebar.d.ts","sourceRoot":"","sources":["../../../src/components/team-sidebar/TeamSidebar.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAc,EACd,KAAK,EACL,YAAY,EACZ,WAAkB,EAClB,WAAmB,EACnB,aAAqB,EACrB,YAAY,EACZ,SAAS,EACT,cAAc,GACf,EAAE,gBAAgB,2CA+DlB"}