@mattermost/compass-ui 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/components/channel-sidebar-item/ChannelSidebarItem.js

@@ -0,0 +1,139 @@
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import __B from "@mattermost/compass-icons/components/globe.js";const B=__B&&__B.default?__B.default:__B;
+import __O from "@mattermost/compass-icons/components/lock-outline.js";const O=__O&&__O.default?__O.default:__O;
+import __j from "@mattermost/compass-icons/components/message-text-outline.js";const j=__j&&__j.default?__j.default:__j;
+import __w from "@mattermost/compass-icons/components/send-outline.js";const w=__w&&__w.default?__w.default:__w;
+import __P from "@mattermost/compass-icons/components/chart-line.js";const P=__P&&__P.default?__P.default:__P;
+import __S from "@mattermost/compass-icons/components/circle-multiple-outline.js";const S=__S&&__S.default?__S.default:__S;
+import __T from "@mattermost/compass-icons/components/phone-in-talk.js";const T=__T&&__T.default?__T.default:__T;
+import __A from "@mattermost/compass-icons/components/dots-vertical.js";const A=__A&&__A.default?__A.default:__A;
+import __G from "@mattermost/compass-icons/components/dialpad.js";const G=__G&&__G.default?__G.default:__G;
+import K from "../user-avatar/UserAvatar.js";
+import U from "../mention-badge/MentionBadge.js";
+import $ from "../icon-button/IconButton.js";
+import n from "./ChannelSidebarItem.module.scss.js";
+function k({
+  leadingVisual: o,
+  memberCount: l,
+  avatarSrc: a,
+  avatarAlt: s,
+  showAvatarStatus: r
+}) {
+  switch (o) {
+    case "private":
+      return /* @__PURE__ */ e(O, { size: 16 });
+    case "group-message":
+      return /* @__PURE__ */ e("div", { className: n["channel-sidebar-item__group-icon"], children: l ?? 2 });
+    case "direct-message":
+      return /* @__PURE__ */ e(
+        K,
+        {
+          src: a ?? "",
+          alt: s ?? "",
+          size: "20",
+          status: !!r
+        }
+      );
+    case "drafts":
+      return /* @__PURE__ */ e(w, { size: 16 });
+    case "insights":
+      return /* @__PURE__ */ e(P, { size: 16 });
+    case "threads":
+      return /* @__PURE__ */ e(j, { size: 16 });
+    case "dial-pad":
+      return /* @__PURE__ */ e(G, { size: 16 });
+    case "public":
+    default:
+      return /* @__PURE__ */ e(B, { size: 16 });
+  }
+}
+function ne({
+  className: o,
+  name: l,
+  hideLeadingVisual: a = !1,
+  leadingVisual: s = "public",
+  status: r = "read",
+  active: m = !1,
+  muted: b = !1,
+  callActive: u = !1,
+  sharedChannel: _ = !1,
+  mentionCount: v,
+  memberCount: I,
+  avatarSrc: N,
+  avatarAlt: z,
+  showAvatarStatus: g = !1,
+  customStatusEmoji: d,
+  onClick: i
+}) {
+  const h = !a && s === "direct-message", f = !a && s === "drafts", p = f && r === "unread" ? "read" : r, x = p === "mention", C = !a && ["public", "private", "group-message", "direct-message"].includes(
+    s
+  ), D = [
+    n["channel-sidebar-item"],
+    a ? n["channel-sidebar-item--text-only"] : "",
+    m ? n["channel-sidebar-item--active"] : "",
+    b ? n["channel-sidebar-item--muted"] : "",
+    n[`channel-sidebar-item--status-${p.toLowerCase()}`],
+    f ? n["channel-sidebar-item--drafts"] : "",
+    o
+  ].filter(Boolean).join(" "), y = [
+    n["channel-sidebar-item__icon-container"],
+    h ? n["channel-sidebar-item__icon-container--dm"] : ""
+  ].filter(Boolean).join(" "), M = n["channel-sidebar-item__right"];
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      role: "button",
+      tabIndex: 0,
+      className: D,
+      onClick: i,
+      onKeyDown: (t) => {
+        (t.key === "Enter" || t.key === " ") && (t.preventDefault(), i == null || i());
+      },
+      children: [
+        m && /* @__PURE__ */ e("div", { className: n["channel-sidebar-item__active-border"] }),
+        /* @__PURE__ */ c("div", { className: n["channel-sidebar-item__left"], children: [
+          !a && /* @__PURE__ */ e("div", { className: y, children: /* @__PURE__ */ e(
+            k,
+            {
+              leadingVisual: s,
+              memberCount: I,
+              avatarSrc: N,
+              avatarAlt: z,
+              showAvatarStatus: g
+            }
+          ) }),
+          /* @__PURE__ */ c("div", { className: n["channel-sidebar-item__content"], children: [
+            /* @__PURE__ */ e("span", { className: n["channel-sidebar-item__name"], children: l }),
+            _ && /* @__PURE__ */ e("span", { className: n["channel-sidebar-item__shared-icon"], children: /* @__PURE__ */ e(S, { size: 12 }) }),
+            h && d && /* @__PURE__ */ e("span", { className: n["channel-sidebar-item__custom-status"], children: d })
+          ] })
+        ] }),
+        /* @__PURE__ */ c("div", { className: M, children: [
+          u && /* @__PURE__ */ e("div", { className: n["channel-sidebar-item__call"], children: /* @__PURE__ */ e(T, { size: 12 }) }),
+          x && /* @__PURE__ */ e("span", { className: n["channel-sidebar-item__mention-badge"], children: /* @__PURE__ */ e(
+            U,
+            {
+              count: v ?? 1,
+              location: "sidebar",
+              size: "medium"
+            }
+          ) }),
+          C && /* @__PURE__ */ e("span", { className: n["channel-sidebar-item__menu-button"], children: /* @__PURE__ */ e(
+            $,
+            {
+              size: "x-small",
+              style: "inverted",
+              icon: /* @__PURE__ */ e(A, { size: 12 }),
+              "aria-label": "Channel options",
+              onClick: (t) => t.stopPropagation()
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  ne as default
+};
+//# sourceMappingURL=ChannelSidebarItem.js.map

package/dist/components/channel-sidebar-item/ChannelSidebarItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelSidebarItem.js","sources":["../../../src/components/channel-sidebar-item/ChannelSidebarItem.tsx"],"sourcesContent":["import GlobeIcon from '@mattermost/compass-icons/components/globe';\nimport LockOutlineIcon from '@mattermost/compass-icons/components/lock-outline';\nimport MessageTextOutlineIcon from '@mattermost/compass-icons/components/message-text-outline';\nimport SendOutlineIcon from '@mattermost/compass-icons/components/send-outline';\nimport ChartLineIcon from '@mattermost/compass-icons/components/chart-line';\nimport CircleMultipleOutlineIcon from '@mattermost/compass-icons/components/circle-multiple-outline';\nimport PhoneInTalkIcon from '@mattermost/compass-icons/components/phone-in-talk';\nimport DotsVerticalIcon from '@mattermost/compass-icons/components/dots-vertical';\nimport DialpadIcon from '@mattermost/compass-icons/components/dialpad';\nimport UserAvatar from '@/components/user-avatar/UserAvatar';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport IconButton from '@/components/icon-button/IconButton';\nimport styles from './ChannelSidebarItem.module.scss';\n\nexport type ChannelSidebarItemLeadingVisual =\n  | 'public'\n  | 'private'\n  | 'group-message'\n  | 'direct-message'\n  | 'drafts'\n  | 'insights'\n  | 'threads'\n  | 'dial-pad';\n\nexport type ChannelSidebarItemStatus = 'read' | 'unread' | 'mention';\n\nexport interface ChannelSidebarItemProps {\n  className?: string;\n  /** Channel or user display name. */\n  name: string;\n  /**\n   * Text-only row (e.g. System Console navigation): no channel glyph or\n   * overflow menu; name aligns with channel sidebar label padding.\n   */\n  hideLeadingVisual?: boolean;\n  /** Leading visual type. Default: Public. Ignored when `hideLeadingVisual`. */\n  leadingVisual?: ChannelSidebarItemLeadingVisual;\n  /** Read/unread/mention state. Default: Read. */\n  status?: ChannelSidebarItemStatus;\n  /** Highlighted as the currently active item. */\n  active?: boolean;\n  /** Muted channel — reduces visual prominence. */\n  muted?: boolean;\n  /** Shows a call-in-progress indicator on the right. */\n  callActive?: boolean;\n  /** Shows the shared-channel icon after the name. */\n  sharedChannel?: boolean;\n  /** Mention count shown in the badge when status='mention'. */\n  mentionCount?: number;\n  /** Member count shown in the group icon when leadingVisual='group-message'. */\n  memberCount?: number;\n  /** Avatar image URL for leadingVisual='direct-message'. */\n  avatarSrc?: string;\n  /** Avatar alt text for leadingVisual='direct-message'. */\n  avatarAlt?: string;\n  /** Shows status badge on the avatar when leadingVisual='direct-message'. */\n  showAvatarStatus?: boolean;\n  /** Custom status emoji shown after the name for leadingVisual='direct-message'. */\n  customStatusEmoji?: string;\n  onClick?: () => void;\n}\n\nfunction LeadingVisualContent({\n  leadingVisual,\n  memberCount,\n  avatarSrc,\n  avatarAlt,\n  showAvatarStatus,\n}: {\n  leadingVisual: ChannelSidebarItemLeadingVisual;\n  memberCount: number | undefined;\n  avatarSrc: string | undefined;\n  avatarAlt: string | undefined;\n  showAvatarStatus: boolean | undefined;\n}) {\n  switch (leadingVisual) {\n    case 'private':\n      return <LockOutlineIcon size={16} />;\n    case 'group-message':\n      return (\n        <div className={styles['channel-sidebar-item__group-icon']}>\n          {memberCount ?? 2}\n        </div>\n      );\n    case 'direct-message':\n      return (\n        <UserAvatar\n          src={avatarSrc ?? ''}\n          alt={avatarAlt ?? ''}\n          size=\"20\"\n          status={!!showAvatarStatus}\n        />\n      );\n    case 'drafts':\n      return <SendOutlineIcon size={16} />;\n    case 'insights':\n      return <ChartLineIcon size={16} />;\n    case 'threads':\n      return <MessageTextOutlineIcon size={16} />;\n    case 'dial-pad':\n      return <DialpadIcon size={16} />;\n    case 'public':\n    default:\n      return <GlobeIcon size={16} />;\n  }\n}\n\n/**\n * The Channel Sidebar Item is the row people use to move between channels, DMs, and group\n * messages. It compresses a lot of state — channel type, unread, mention count, mute,\n * in-call — into a single, scannable line.\n */\nexport default function ChannelSidebarItem({\n  className,\n  name,\n  hideLeadingVisual = false,\n  leadingVisual = 'public',\n  status = 'read',\n  active = false,\n  muted = false,\n  callActive = false,\n  sharedChannel = false,\n  mentionCount,\n  memberCount,\n  avatarSrc,\n  avatarAlt,\n  showAvatarStatus = false,\n  customStatusEmoji,\n  onClick,\n}: ChannelSidebarItemProps) {\n  const isDM = !hideLeadingVisual && leadingVisual === 'direct-message';\n  const isDrafts = !hideLeadingVisual && leadingVisual === 'drafts';\n  const effectiveStatus = isDrafts && status === 'unread' ? 'read' : status;\n  const hasMentionBadge = effectiveStatus === 'mention';\n  const isChannelOrDM =\n    !hideLeadingVisual &&\n    ['public', 'private', 'group-message', 'direct-message'].includes(\n      leadingVisual,\n    );\n\n  const rootClass = [\n    styles['channel-sidebar-item'],\n    hideLeadingVisual ? styles['channel-sidebar-item--text-only'] : '',\n    active ? styles['channel-sidebar-item--active'] : '',\n    muted ? styles['channel-sidebar-item--muted'] : '',\n    styles[`channel-sidebar-item--status-${effectiveStatus.toLowerCase()}`],\n    isDrafts ? styles['channel-sidebar-item--drafts'] : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const iconContainerClass = [\n    styles['channel-sidebar-item__icon-container'],\n    isDM ? styles['channel-sidebar-item__icon-container--dm'] : '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const rightClass = styles['channel-sidebar-item__right'];\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={0}\n      className={rootClass}\n      onClick={onClick}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          onClick?.();\n        }\n      }}\n    >\n      {active && (\n        <div className={styles['channel-sidebar-item__active-border']} />\n      )}\n      <div className={styles['channel-sidebar-item__left']}>\n        {!hideLeadingVisual && (\n          <div className={iconContainerClass}>\n            <LeadingVisualContent\n              leadingVisual={leadingVisual}\n              memberCount={memberCount}\n              avatarSrc={avatarSrc}\n              avatarAlt={avatarAlt}\n              showAvatarStatus={showAvatarStatus}\n            />\n          </div>\n        )}\n        <div className={styles['channel-sidebar-item__content']}>\n          <span className={styles['channel-sidebar-item__name']}>{name}</span>\n          {sharedChannel && (\n            <span className={styles['channel-sidebar-item__shared-icon']}>\n              <CircleMultipleOutlineIcon size={12} />\n            </span>\n          )}\n          {isDM && customStatusEmoji && (\n            <span className={styles['channel-sidebar-item__custom-status']}>\n              {customStatusEmoji}\n            </span>\n          )}\n        </div>\n      </div>\n      <div className={rightClass}>\n        {callActive && (\n          <div className={styles['channel-sidebar-item__call']}>\n            <PhoneInTalkIcon size={12} />\n          </div>\n        )}\n        {hasMentionBadge && (\n          <span className={styles['channel-sidebar-item__mention-badge']}>\n            <MentionBadge\n              count={mentionCount ?? 1}\n              location=\"sidebar\"\n              size=\"medium\"\n            />\n          </span>\n        )}\n        {isChannelOrDM && (\n          <span className={styles['channel-sidebar-item__menu-button']}>\n            <IconButton\n              size=\"x-small\"\n              style=\"inverted\"\n              icon={<DotsVerticalIcon size={12} />}\n              aria-label=\"Channel options\"\n              onClick={(e) => e.stopPropagation()}\n            />\n          </span>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["LeadingVisualContent","leadingVisual","memberCount","avatarSrc","avatarAlt","showAvatarStatus","jsx","LockOutlineIcon","styles","UserAvatar","SendOutlineIcon","ChartLineIcon","MessageTextOutlineIcon","DialpadIcon","GlobeIcon","ChannelSidebarItem","className","name","hideLeadingVisual","status","active","muted","callActive","sharedChannel","mentionCount","customStatusEmoji","onClick","isDM","isDrafts","effectiveStatus","hasMentionBadge","isChannelOrDM","rootClass","iconContainerClass","rightClass","jsxs","e","CircleMultipleOutlineIcon","PhoneInTalkIcon","MentionBadge","IconButton","DotsVerticalIcon"],"mappings":"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"}

package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.css

@@ -0,0 +1 @@
+._channel-sidebar-item_1e5ys_2{position:relative;display:flex;align-items:center;height:32px;overflow:hidden;cursor:pointer;-webkit-user-select:none;user-select:none}._channel-sidebar-item__menu-button_1e5ys_11{display:none}._channel-sidebar-item_1e5ys_2:hover{background:rgba(var(--sidebar-text-rgb),.08)}._channel-sidebar-item_1e5ys_2:hover ._channel-sidebar-item__menu-button_1e5ys_11{display:contents}._channel-sidebar-item_1e5ys_2:hover ._channel-sidebar-item__mention-badge_1e5ys_20{display:none}._channel-sidebar-item_1e5ys_2:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--sidebar-text-active-border)}._channel-sidebar-item__active-border_1e5ys_27{flex-shrink:0;width:2px;align-self:stretch;border-radius:0 2px 2px 0;background:var(--sidebar-text-active-border)}._channel-sidebar-item__left_1e5ys_34{display:flex;align-items:center;flex:1;min-width:0;gap:var(--spacing-xxxxs);padding:var(--spacing-xxxxs) var(--spacing-xs) var(--spacing-xxxxs) 18px}._channel-sidebar-item__icon-container_1e5ys_42{display:flex;align-items:center;flex-shrink:0;padding:var(--spacing-xxxs);color:var(--sidebar-text);opacity:.64}._channel-sidebar-item__icon-container--dm_1e5ys_50{padding:var(--spacing-xxxxs);opacity:1;--status-badge-bg: var(--sidebar-bg)}._channel-sidebar-item__group-icon_1e5ys_55{width:var(--icon-size-16);height:var(--icon-size-16);display:flex;align-items:center;justify-content:center;background:rgba(var(--sidebar-text-rgb),.16);border-radius:var(--radius-s);font-family:var(--font-family-body);font-size:var(--font-size-50);font-weight:var(--font-weight-semibold);line-height:var(--line-height-25);letter-spacing:.01em;color:var(--sidebar-text);opacity:.72}._channel-sidebar-item__content_1e5ys_71{display:flex;align-items:center;flex:1;min-width:0;gap:var(--spacing-xs);padding:2px var(--spacing-xxxxs)}._channel-sidebar-item__name_1e5ys_79{font-family:var(--font-family-body);font-size:var(--font-size-100);font-weight:var(--font-weight-regular);line-height:var(--line-height-100);letter-spacing:.02em;color:var(--sidebar-text);opacity:.72;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:144px}._channel-sidebar-item__shared-icon_1e5ys_92{display:flex;align-items:center;flex-shrink:0;padding:var(--spacing-xxxs) 0;color:var(--sidebar-text);opacity:.72}._channel-sidebar-item__custom-status_1e5ys_100{display:flex;align-items:center;flex-shrink:0;font-size:var(--font-size-200);line-height:var(--line-height-25);opacity:.8}._channel-sidebar-item__right_1e5ys_108{display:flex;align-items:center;justify-content:flex-end;flex-shrink:0;gap:var(--spacing-xxxxs);padding-right:var(--spacing-l);color:var(--sidebar-text)}._channel-sidebar-item__call_1e5ys_117{display:flex;align-items:center;justify-content:center;padding:var(--spacing-xxxs);border-radius:var(--radius-s)}._channel-sidebar-item--text-only_1e5ys_127 ._channel-sidebar-item__left_1e5ys_34{gap:0}._channel-sidebar-item--active_1e5ys_130{background:rgba(var(--sidebar-text-rgb),.12)}._channel-sidebar-item--active_1e5ys_130 ._channel-sidebar-item__left_1e5ys_34{padding-left:var(--spacing-l)}._channel-sidebar-item--active_1e5ys_130 ._channel-sidebar-item__name_1e5ys_79,._channel-sidebar-item--status-unread_1e5ys_139 ._channel-sidebar-item__icon-container_1e5ys_42,._channel-sidebar-item--status-mention_1e5ys_139 ._channel-sidebar-item__icon-container_1e5ys_42{opacity:1}._channel-sidebar-item--status-unread_1e5ys_139 ._channel-sidebar-item__name_1e5ys_79,._channel-sidebar-item--status-mention_1e5ys_139 ._channel-sidebar-item__name_1e5ys_79{font-weight:var(--font-weight-semibold);opacity:1}._channel-sidebar-item--drafts_1e5ys_146 ._channel-sidebar-item__icon-container_1e5ys_42{opacity:.64}._channel-sidebar-item--drafts_1e5ys_146 ._channel-sidebar-item__name_1e5ys_79{font-weight:var(--font-weight-regular);opacity:.72}._channel-sidebar-item--drafts_1e5ys_146 ._channel-sidebar-item__mention-badge_1e5ys_20>*{background-color:transparent;color:var(--sidebar-text);padding-left:0;padding-right:var(--spacing-xxs)}._channel-sidebar-item--drafts_1e5ys_146._channel-sidebar-item--active_1e5ys_130 ._channel-sidebar-item__name_1e5ys_79{opacity:1}._channel-sidebar-item--muted_1e5ys_162 ._channel-sidebar-item__icon-container_1e5ys_42,._channel-sidebar-item--muted_1e5ys_162 ._channel-sidebar-item__name_1e5ys_79,._channel-sidebar-item--muted_1e5ys_162 ._channel-sidebar-item__shared-icon_1e5ys_92{opacity:.4}

package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ChannelSidebarItem.module.css');const e={"channel-sidebar-item":"_channel-sidebar-item_1e5ys_2","channel-sidebar-item__menu-button":"_channel-sidebar-item__menu-button_1e5ys_11","channel-sidebar-item__mention-badge":"_channel-sidebar-item__mention-badge_1e5ys_20","channel-sidebar-item__active-border":"_channel-sidebar-item__active-border_1e5ys_27","channel-sidebar-item__left":"_channel-sidebar-item__left_1e5ys_34","channel-sidebar-item__icon-container":"_channel-sidebar-item__icon-container_1e5ys_42","channel-sidebar-item__icon-container--dm":"_channel-sidebar-item__icon-container--dm_1e5ys_50","channel-sidebar-item__group-icon":"_channel-sidebar-item__group-icon_1e5ys_55","channel-sidebar-item__content":"_channel-sidebar-item__content_1e5ys_71","channel-sidebar-item__name":"_channel-sidebar-item__name_1e5ys_79","channel-sidebar-item__shared-icon":"_channel-sidebar-item__shared-icon_1e5ys_92","channel-sidebar-item__custom-status":"_channel-sidebar-item__custom-status_1e5ys_100","channel-sidebar-item__right":"_channel-sidebar-item__right_1e5ys_108","channel-sidebar-item__call":"_channel-sidebar-item__call_1e5ys_117","channel-sidebar-item--text-only":"_channel-sidebar-item--text-only_1e5ys_127","channel-sidebar-item--active":"_channel-sidebar-item--active_1e5ys_130","channel-sidebar-item--status-unread":"_channel-sidebar-item--status-unread_1e5ys_139","channel-sidebar-item--status-mention":"_channel-sidebar-item--status-mention_1e5ys_139","channel-sidebar-item--drafts":"_channel-sidebar-item--drafts_1e5ys_146","channel-sidebar-item--muted":"_channel-sidebar-item--muted_1e5ys_162"};exports.default=e;
+//# sourceMappingURL=ChannelSidebarItem.module.scss.cjs.map

package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelSidebarItem.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.js

@@ -0,0 +1,26 @@
+import './ChannelSidebarItem.module.css';const e = {
+  "channel-sidebar-item": "_channel-sidebar-item_1e5ys_2",
+  "channel-sidebar-item__menu-button": "_channel-sidebar-item__menu-button_1e5ys_11",
+  "channel-sidebar-item__mention-badge": "_channel-sidebar-item__mention-badge_1e5ys_20",
+  "channel-sidebar-item__active-border": "_channel-sidebar-item__active-border_1e5ys_27",
+  "channel-sidebar-item__left": "_channel-sidebar-item__left_1e5ys_34",
+  "channel-sidebar-item__icon-container": "_channel-sidebar-item__icon-container_1e5ys_42",
+  "channel-sidebar-item__icon-container--dm": "_channel-sidebar-item__icon-container--dm_1e5ys_50",
+  "channel-sidebar-item__group-icon": "_channel-sidebar-item__group-icon_1e5ys_55",
+  "channel-sidebar-item__content": "_channel-sidebar-item__content_1e5ys_71",
+  "channel-sidebar-item__name": "_channel-sidebar-item__name_1e5ys_79",
+  "channel-sidebar-item__shared-icon": "_channel-sidebar-item__shared-icon_1e5ys_92",
+  "channel-sidebar-item__custom-status": "_channel-sidebar-item__custom-status_1e5ys_100",
+  "channel-sidebar-item__right": "_channel-sidebar-item__right_1e5ys_108",
+  "channel-sidebar-item__call": "_channel-sidebar-item__call_1e5ys_117",
+  "channel-sidebar-item--text-only": "_channel-sidebar-item--text-only_1e5ys_127",
+  "channel-sidebar-item--active": "_channel-sidebar-item--active_1e5ys_130",
+  "channel-sidebar-item--status-unread": "_channel-sidebar-item--status-unread_1e5ys_139",
+  "channel-sidebar-item--status-mention": "_channel-sidebar-item--status-mention_1e5ys_139",
+  "channel-sidebar-item--drafts": "_channel-sidebar-item--drafts_1e5ys_146",
+  "channel-sidebar-item--muted": "_channel-sidebar-item--muted_1e5ys_162"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=ChannelSidebarItem.module.scss.js.map

package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.js.map

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

package/dist/components/channel-sidebar-item/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./ChannelSidebarItem.cjs");exports.ChannelSidebarItem=e.default;
+//# sourceMappingURL=index.cjs.map

package/dist/components/channel-sidebar-item/index.cjs.map

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

package/dist/components/channel-sidebar-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/channel-sidebar-item/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,YAAY,EACV,uBAAuB,EACvB,+BAA+B,EAC/B,wBAAwB,GACzB,MAAM,sBAAsB,CAAC"}

package/dist/components/channel-sidebar-item/index.js

@@ -0,0 +1,5 @@
+import { default as r } from "./ChannelSidebarItem.js";
+export {
+  r as ChannelSidebarItem
+};
+//# sourceMappingURL=index.js.map

package/dist/components/channel-sidebar-item/index.js.map

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

package/dist/components/channels-sidebar/ChannelsSidebar.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),N=require("react"),__j=require("@mattermost/compass-icons/components/chevron-down.js"),j=__j?.default??__j,__x=require("@mattermost/compass-icons/components/plus.js"),x=__x?.default??__x,__C=require("@mattermost/compass-icons/components/magnify.js"),C=__C?.default??__C,__q=require("@mattermost/compass-icons/components/filter-variant.js"),q=__q?.default??__q,_=require("../channel-sidebar-item/ChannelSidebarItem.cjs"),m=require("../more-unreads-banner/MoreUnreadsBanner.cjs"),f=require("../icon-button/IconButton.cjs"),b=require("../icon/Icon.cjs"),S=require("../scrollbar/Scrollbar.cjs"),I=require("./channelsSidebarModel.cjs"),a=require("./ChannelsSidebar.module.scss.cjs");function $(n,t,r){const i=s=>({...s,active:t===void 0?s.active:s.name===t,onClick:r?()=>r(s.name):s.onClick});return{topGroupItems:n.topGroupItems.map(i),groups:n.groups.map(s=>({...s,items:s.items.map(i)}))}}function p({teamName:n}){return e.jsxs("div",{className:a.default["channels-sidebar__header"],children:[e.jsxs("div",{className:a.default["channels-sidebar__team-dropdown"],children:[e.jsx("span",{className:a.default["channels-sidebar__team-name"],children:n}),e.jsx("span",{className:a.default["channels-sidebar__team-chevron"],children:e.jsx(j,{size:16})})]}),e.jsx(f.default,{"aria-label":"Add channels",size:"small",style:"inverted",padding:"compact",rounded:!0,icon:e.jsx(b.default,{size:"16",glyph:e.jsx(x,{})}),className:a.default["channels-sidebar__sidebar-icon-button"]})]})}function g({showFilter:n=!1}){return e.jsxs("div",{className:a.default["channels-sidebar__navigator"],children:[n&&e.jsx(f.default,{"aria-label":"Filter channels",size:"small",style:"inverted",padding:"compact",icon:e.jsx(b.default,{size:"16",glyph:e.jsx(q,{})}),className:a.default["channels-sidebar__sidebar-icon-button"]}),e.jsxs("div",{className:a.default["channels-sidebar__find-channels"],children:[e.jsx("span",{className:a.default["channels-sidebar__find-channels-icon"],children:e.jsx(C,{size:16})}),e.jsx("span",{className:a.default["channels-sidebar__find-channels-label"],children:"Find channels"})]})]})}function v({label:n,showChevron:t=!0,showPlusButton:r=!1,leadingIcon:i,sticky:s=!1,opaqueCategory:u=!1}){const d=!!i,o=t&&!d,h=[a.default["channels-sidebar__category"],d?a.default["channels-sidebar__category--with-leading-icon"]:"",u?a.default["channels-sidebar__category--opaque"]:"",!o&&!d?a.default["channels-sidebar__category--no-chevron"]:"",r?a.default["channels-sidebar__category--has-action"]:"",s?a.default["channels-sidebar__category--sticky"]:""].filter(Boolean).join(" ");return e.jsxs("div",{className:h,children:[e.jsxs("div",{className:a.default["channels-sidebar__category-left"],children:[d&&e.jsx("span",{className:a.default["channels-sidebar__category-leading-icon"],children:i}),o&&e.jsx("span",{className:a.default["channels-sidebar__category-chevron"],children:e.jsx(j,{size:12})}),e.jsx("span",{className:a.default["channels-sidebar__category-label"],children:n})]}),r&&e.jsx(f.default,{"aria-label":`New ${n.toLowerCase()}`,size:"x-small",style:"inverted",icon:e.jsx(b.default,{size:"12",glyph:e.jsx(x,{})})})]})}function w({teamName:n="Contributors",showFilter:t=!1,moreUnreadsAbove:r=!1,moreUnreadsBelow:i=!1,channelNameOverrides:s,activeChannelName:u,onItemClick:d,model:o}){const h=N.useMemo(()=>{const l=o??{topGroupItems:[],groups:[]},c=I.applyChannelNameOverrides(l,s);return $(c,u,d)},[o,s,u,d]);return e.jsxs("div",{className:a.default["channels-sidebar"],children:[e.jsx(p,{teamName:n}),e.jsx(g,{showFilter:t}),e.jsx("div",{className:a.default["channels-sidebar__top-group"],children:h.topGroupItems.map((l,c)=>e.jsx(_.default,{...l},`top-${c}-${l.name}`))}),e.jsxs("div",{className:a.default["channels-sidebar__scroll-view"],children:[e.jsx(S.default,{color:"--sidebar-text-rgb",children:e.jsx("div",{className:a.default["channels-sidebar__channel-groups"],children:h.groups.map(l=>e.jsxs("div",{className:a.default["channels-sidebar__channel-group"],children:[e.jsx(v,{label:l.category.label,showChevron:l.category.showChevron,showPlusButton:l.category.showPlusButton}),l.items.map((c,y)=>e.jsx(_.default,{...c},`${l.key}-${y}-${c.name}`))]},l.key))})}),r&&e.jsx(m.default,{direction:"up",className:`${a.default["channels-sidebar__more-unreads"]} ${a.default["channels-sidebar__more-unreads--above"]}`}),i&&e.jsx(m.default,{direction:"down",className:`${a.default["channels-sidebar__more-unreads"]} ${a.default["channels-sidebar__more-unreads--below"]}`})]})]})}exports.ChannelsSidebarCategory=v;exports.ChannelsSidebarHeader=p;exports.ChannelsSidebarNavigator=g;exports.default=w;
+//# sourceMappingURL=ChannelsSidebar.cjs.map

package/dist/components/channels-sidebar/ChannelsSidebar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelsSidebar.cjs","sources":["../../../src/components/channels-sidebar/ChannelsSidebar.tsx"],"sourcesContent":["import { useMemo, type ReactNode } from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport PlusIcon from '@mattermost/compass-icons/components/plus';\nimport MagnifyIcon from '@mattermost/compass-icons/components/magnify';\nimport FilterVariantIcon from '@mattermost/compass-icons/components/filter-variant';\nimport ChannelSidebarItem from '@/components/channel-sidebar-item/ChannelSidebarItem';\nimport MoreUnreadsBanner from '@/components/more-unreads-banner/MoreUnreadsBanner';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport Scrollbar from '@/components/scrollbar/Scrollbar';\nimport {\n  applyChannelNameOverrides,\n  type ChannelsSidebarItemModel,\n  type ChannelsSidebarModel,\n} from './channelsSidebarModel';\nimport styles from './ChannelsSidebar.module.scss';\n\nfunction applyChannelSidebarInteractivity(\n  model: ChannelsSidebarModel,\n  activeChannelName: string | undefined,\n  onItemClick?: (name: string) => void,\n): ChannelsSidebarModel {\n  const mapRow = (row: ChannelsSidebarItemModel) => ({\n    ...row,\n    active:\n      activeChannelName === undefined\n        ? row.active\n        : row.name === activeChannelName,\n    onClick: onItemClick ? () => onItemClick(row.name) : row.onClick,\n  });\n  return {\n    topGroupItems: model.topGroupItems.map(mapRow),\n    groups: model.groups.map((g) => ({\n      ...g,\n      items: g.items.map(mapRow),\n    })),\n  };\n}\n\nexport interface ChannelsSidebarHeaderProps {\n  teamName: string;\n}\n\n/** Team row + Add control; same markup as the top of `ChannelsSidebar`. */\nexport function ChannelsSidebarHeader({ teamName }: ChannelsSidebarHeaderProps) {\n  return (\n    <div className={styles['channels-sidebar__header']}>\n      <div className={styles['channels-sidebar__team-dropdown']}>\n        <span className={styles['channels-sidebar__team-name']}>\n          {teamName}\n        </span>\n        <span className={styles['channels-sidebar__team-chevron']}>\n          <ChevronDownIcon size={16} />\n        </span>\n      </div>\n      <IconButton\n        aria-label=\"Add channels\"\n        size=\"small\"\n        style=\"inverted\"\n        padding=\"compact\"\n        rounded\n        icon={<Icon size=\"16\" glyph={<PlusIcon />} />}\n        className={styles['channels-sidebar__sidebar-icon-button']}\n      />\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarNavigatorProps {\n  showFilter?: boolean;\n}\n\n/** Find channels row + optional unread filter control; same markup as `ChannelsSidebar`. */\nexport function ChannelsSidebarNavigator({\n  showFilter = false,\n}: ChannelsSidebarNavigatorProps) {\n  return (\n    <div className={styles['channels-sidebar__navigator']}>\n      {showFilter && (\n        <IconButton\n          aria-label=\"Filter channels\"\n          size=\"small\"\n          style=\"inverted\"\n          padding=\"compact\"\n          icon={<Icon size=\"16\" glyph={<FilterVariantIcon />} />}\n          className={styles['channels-sidebar__sidebar-icon-button']}\n        />\n      )}\n      <div className={styles['channels-sidebar__find-channels']}>\n        <span className={styles['channels-sidebar__find-channels-icon']}>\n          <MagnifyIcon size={16} />\n        </span>\n        <span className={styles['channels-sidebar__find-channels-label']}>\n          Find channels\n        </span>\n      </div>\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarCategoryProps {\n  label: string;\n  showChevron?: boolean;\n  showPlusButton?: boolean;\n  /** When set, shown instead of the expand chevron (e.g. System Console categories). */\n  leadingIcon?: ReactNode;\n  /** Pin category row to the top of the scroll container while scrolling (e.g. first console section). */\n  sticky?: boolean;\n  /** Full-opacity label + leading icon (System Console categories). Default: toned like channel sidebar. */\n  opaqueCategory?: boolean;\n}\n\nexport function ChannelsSidebarCategory({\n  label,\n  showChevron = true,\n  showPlusButton = false,\n  leadingIcon,\n  sticky = false,\n  opaqueCategory = false,\n}: ChannelsSidebarCategoryProps) {\n  const hasLeadingIcon = Boolean(leadingIcon);\n  const showChevronRow = showChevron && !hasLeadingIcon;\n\n  const categoryClass = [\n    styles['channels-sidebar__category'],\n    hasLeadingIcon ? styles['channels-sidebar__category--with-leading-icon'] : '',\n    opaqueCategory ? styles['channels-sidebar__category--opaque'] : '',\n    !showChevronRow && !hasLeadingIcon\n      ? styles['channels-sidebar__category--no-chevron']\n      : '',\n    showPlusButton ? styles['channels-sidebar__category--has-action'] : '',\n    sticky ? styles['channels-sidebar__category--sticky'] : '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={categoryClass}>\n      <div className={styles['channels-sidebar__category-left']}>\n        {hasLeadingIcon && (\n          <span className={styles['channels-sidebar__category-leading-icon']}>\n            {leadingIcon}\n          </span>\n        )}\n        {showChevronRow && (\n          <span className={styles['channels-sidebar__category-chevron']}>\n            <ChevronDownIcon size={12} />\n          </span>\n        )}\n        <span className={styles['channels-sidebar__category-label']}>\n          {label}\n        </span>\n      </div>\n      {showPlusButton && (\n        <IconButton\n          aria-label={`New ${label.toLowerCase()}`}\n          size=\"x-small\"\n          style=\"inverted\"\n          icon={<Icon size=\"12\" glyph={<PlusIcon />} />}\n        />\n      )}\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarProps {\n  teamName?: string;\n  showUnreadsCategory?: boolean;\n  showFilter?: boolean;\n  showDialPad?: boolean;\n  moreUnreadsAbove?: boolean;\n  moreUnreadsBelow?: boolean;\n  /**\n   * Rename built-in channel/DM items without editing the model.\n   * Keys are the default names; values are the display names to use instead.\n   * Applies to `name` and `avatarAlt` on each item (same as the legacy hardcoded list).\n   */\n  channelNameOverrides?: Record<string, string>;\n  /**\n   * Match against **resolved** item names (after `channelNameOverrides`).\n   * Omit to keep each row’s fixture `active` value; pass `''` to clear selection.\n   */\n  activeChannelName?: string;\n  /** Receives the row's visible `name` (after overrides). */\n  onItemClick?: (name: string) => void;\n  avatarAikoTan?: string;\n  avatarArjunPatel?: string;\n  avatarDanielleOkoro?: string;\n  avatarDariusCole?: string;\n  avatarDavidLiang?: string;\n  avatarEmmaNovak?: string;\n  avatarEthanBrooks?: string;\n  /** When set, overrides the default channel tree (for per-prototype sidebars). */\n  model?: ChannelsSidebarModel;\n}\n\nexport default function ChannelsSidebar({\n  teamName = 'Contributors',\n  showFilter = false,\n  moreUnreadsAbove = false,\n  moreUnreadsBelow = false,\n  channelNameOverrides,\n  activeChannelName,\n  onItemClick,\n  model: modelProp,\n}: ChannelsSidebarProps) {\n  const model = useMemo(() => {\n    const baseModel = modelProp ?? { topGroupItems: [], groups: [] };\n    const withOverrides = applyChannelNameOverrides(baseModel, channelNameOverrides);\n    return applyChannelSidebarInteractivity(\n      withOverrides,\n      activeChannelName,\n      onItemClick,\n    );\n  }, [\n    modelProp,\n    channelNameOverrides,\n    activeChannelName,\n    onItemClick,\n  ]);\n\n  return (\n    <div className={styles['channels-sidebar']}>\n      <ChannelsSidebarHeader teamName={teamName} />\n      <ChannelsSidebarNavigator showFilter={showFilter} />\n\n      <div className={styles['channels-sidebar__top-group']}>\n        {model.topGroupItems.map((row, i) => (\n          <ChannelSidebarItem key={`top-${i}-${row.name}`} {...row} />\n        ))}\n      </div>\n\n      <div className={styles['channels-sidebar__scroll-view']}>\n        <Scrollbar color=\"--sidebar-text-rgb\">\n          <div className={styles['channels-sidebar__channel-groups']}>\n            {model.groups.map((group) => (\n              <div\n                key={group.key}\n                className={styles['channels-sidebar__channel-group']}\n              >\n                <ChannelsSidebarCategory\n                  label={group.category.label}\n                  showChevron={group.category.showChevron}\n                  showPlusButton={group.category.showPlusButton}\n                />\n                {group.items.map((row, index) => (\n                  <ChannelSidebarItem\n                    key={`${group.key}-${index}-${row.name}`}\n                    {...row}\n                  />\n                ))}\n              </div>\n            ))}\n          </div>\n        </Scrollbar>\n\n        {moreUnreadsAbove && (\n          <MoreUnreadsBanner\n            direction=\"up\"\n            className={`${styles['channels-sidebar__more-unreads']} ${styles['channels-sidebar__more-unreads--above']}`}\n          />\n        )}\n        {moreUnreadsBelow && (\n          <MoreUnreadsBanner\n            direction=\"down\"\n            className={`${styles['channels-sidebar__more-unreads']} ${styles['channels-sidebar__more-unreads--below']}`}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport type { ChannelsSidebarModel } from './channelsSidebarModel';\n"],"names":["applyChannelSidebarInteractivity","model","activeChannelName","onItemClick","mapRow","row","g","ChannelsSidebarHeader","teamName","jsxs","styles","jsx","ChevronDownIcon","IconButton","Icon","PlusIcon","ChannelsSidebarNavigator","showFilter","FilterVariantIcon","MagnifyIcon","ChannelsSidebarCategory","label","showChevron","showPlusButton","leadingIcon","sticky","opaqueCategory","hasLeadingIcon","showChevronRow","categoryClass","ChannelsSidebar","moreUnreadsAbove","moreUnreadsBelow","channelNameOverrides","modelProp","useMemo","baseModel","withOverrides","applyChannelNameOverrides","i","ChannelSidebarItem","Scrollbar","group","index","MoreUnreadsBanner"],"mappings":"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"}

package/dist/components/channels-sidebar/ChannelsSidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelsSidebar.d.ts","sourceRoot":"","sources":["../../../src/components/channels-sidebar/ChannelsSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAUhD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,wBAAwB,CAAC;AAyBhC,MAAM,WAAW,0BAA0B;IACzC,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,2EAA2E;AAC3E,wBAAgB,qBAAqB,CAAC,EAAE,QAAQ,EAAE,EAAE,0BAA0B,2CAsB7E;AAED,MAAM,WAAW,6BAA6B;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,4FAA4F;AAC5F,wBAAgB,wBAAwB,CAAC,EACvC,UAAkB,GACnB,EAAE,6BAA6B,2CAuB/B;AAED,MAAM,WAAW,4BAA4B;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sFAAsF;IACtF,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,wGAAwG;IACxG,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,0GAA0G;IAC1G,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EACL,WAAkB,EAClB,cAAsB,EACtB,WAAW,EACX,MAAc,EACd,cAAsB,GACvB,EAAE,4BAA4B,2CA4C9B;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC9C;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,2DAA2D;IAC3D,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iFAAiF;IACjF,KAAK,CAAC,EAAE,oBAAoB,CAAC;CAC9B;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,QAAyB,EACzB,UAAkB,EAClB,gBAAwB,EACxB,gBAAwB,EACxB,oBAAoB,EACpB,iBAAiB,EACjB,WAAW,EACX,KAAK,EAAE,SAAS,GACjB,EAAE,oBAAoB,2CAkEtB;AAED,YAAY,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/channels-sidebar/ChannelsSidebar.js

@@ -0,0 +1,177 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { useMemo as N } from "react";
+import __y from "@mattermost/compass-icons/components/chevron-down.js";const y=__y&&__y.default?__y.default:__y;
+import __v from "@mattermost/compass-icons/components/plus.js";const v=__v&&__v.default?__v.default:__v;
+import __C from "@mattermost/compass-icons/components/magnify.js";const C=__C&&__C.default?__C.default:__C;
+import __I from "@mattermost/compass-icons/components/filter-variant.js";const I=__I&&__I.default?__I.default:__I;
+import u from "../channel-sidebar-item/ChannelSidebarItem.js";
+import f from "../more-unreads-banner/MoreUnreadsBanner.js";
+import b from "../icon-button/IconButton.js";
+import p from "../icon/Icon.js";
+import $ from "../scrollbar/Scrollbar.js";
+import { applyChannelNameOverrides as w } from "./channelsSidebarModel.js";
+import a from "./ChannelsSidebar.module.scss.js";
+function z(s, t, l) {
+  const c = (n) => ({
+    ...n,
+    active: t === void 0 ? n.active : n.name === t,
+    onClick: l ? () => l(n.name) : n.onClick
+  });
+  return {
+    topGroupItems: s.topGroupItems.map(c),
+    groups: s.groups.map((n) => ({
+      ...n,
+      items: n.items.map(c)
+    }))
+  };
+}
+function S({ teamName: s }) {
+  return /* @__PURE__ */ i("div", { className: a["channels-sidebar__header"], children: [
+    /* @__PURE__ */ i("div", { className: a["channels-sidebar__team-dropdown"], children: [
+      /* @__PURE__ */ e("span", { className: a["channels-sidebar__team-name"], children: s }),
+      /* @__PURE__ */ e("span", { className: a["channels-sidebar__team-chevron"], children: /* @__PURE__ */ e(y, { size: 16 }) })
+    ] }),
+    /* @__PURE__ */ e(
+      b,
+      {
+        "aria-label": "Add channels",
+        size: "small",
+        style: "inverted",
+        padding: "compact",
+        rounded: !0,
+        icon: /* @__PURE__ */ e(p, { size: "16", glyph: /* @__PURE__ */ e(v, {}) }),
+        className: a["channels-sidebar__sidebar-icon-button"]
+      }
+    )
+  ] });
+}
+function x({
+  showFilter: s = !1
+}) {
+  return /* @__PURE__ */ i("div", { className: a["channels-sidebar__navigator"], children: [
+    s && /* @__PURE__ */ e(
+      b,
+      {
+        "aria-label": "Filter channels",
+        size: "small",
+        style: "inverted",
+        padding: "compact",
+        icon: /* @__PURE__ */ e(p, { size: "16", glyph: /* @__PURE__ */ e(I, {}) }),
+        className: a["channels-sidebar__sidebar-icon-button"]
+      }
+    ),
+    /* @__PURE__ */ i("div", { className: a["channels-sidebar__find-channels"], children: [
+      /* @__PURE__ */ e("span", { className: a["channels-sidebar__find-channels-icon"], children: /* @__PURE__ */ e(C, { size: 16 }) }),
+      /* @__PURE__ */ e("span", { className: a["channels-sidebar__find-channels-label"], children: "Find channels" })
+    ] })
+  ] });
+}
+function B({
+  label: s,
+  showChevron: t = !0,
+  showPlusButton: l = !1,
+  leadingIcon: c,
+  sticky: n = !1,
+  opaqueCategory: m = !1
+}) {
+  const o = !!c, h = t && !o, _ = [
+    a["channels-sidebar__category"],
+    o ? a["channels-sidebar__category--with-leading-icon"] : "",
+    m ? a["channels-sidebar__category--opaque"] : "",
+    !h && !o ? a["channels-sidebar__category--no-chevron"] : "",
+    l ? a["channels-sidebar__category--has-action"] : "",
+    n ? a["channels-sidebar__category--sticky"] : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ i("div", { className: _, children: [
+    /* @__PURE__ */ i("div", { className: a["channels-sidebar__category-left"], children: [
+      o && /* @__PURE__ */ e("span", { className: a["channels-sidebar__category-leading-icon"], children: c }),
+      h && /* @__PURE__ */ e("span", { className: a["channels-sidebar__category-chevron"], children: /* @__PURE__ */ e(y, { size: 12 }) }),
+      /* @__PURE__ */ e("span", { className: a["channels-sidebar__category-label"], children: s })
+    ] }),
+    l && /* @__PURE__ */ e(
+      b,
+      {
+        "aria-label": `New ${s.toLowerCase()}`,
+        size: "x-small",
+        style: "inverted",
+        icon: /* @__PURE__ */ e(p, { size: "12", glyph: /* @__PURE__ */ e(v, {}) })
+      }
+    )
+  ] });
+}
+function U({
+  teamName: s = "Contributors",
+  showFilter: t = !1,
+  moreUnreadsAbove: l = !1,
+  moreUnreadsBelow: c = !1,
+  channelNameOverrides: n,
+  activeChannelName: m,
+  onItemClick: o,
+  model: h
+}) {
+  const _ = N(() => {
+    const d = w(h ?? { topGroupItems: [], groups: [] }, n);
+    return z(
+      d,
+      m,
+      o
+    );
+  }, [
+    h,
+    n,
+    m,
+    o
+  ]);
+  return /* @__PURE__ */ i("div", { className: a["channels-sidebar"], children: [
+    /* @__PURE__ */ e(S, { teamName: s }),
+    /* @__PURE__ */ e(x, { showFilter: t }),
+    /* @__PURE__ */ e("div", { className: a["channels-sidebar__top-group"], children: _.topGroupItems.map((r, d) => /* @__PURE__ */ e(u, { ...r }, `top-${d}-${r.name}`)) }),
+    /* @__PURE__ */ i("div", { className: a["channels-sidebar__scroll-view"], children: [
+      /* @__PURE__ */ e($, { color: "--sidebar-text-rgb", children: /* @__PURE__ */ e("div", { className: a["channels-sidebar__channel-groups"], children: _.groups.map((r) => /* @__PURE__ */ i(
+        "div",
+        {
+          className: a["channels-sidebar__channel-group"],
+          children: [
+            /* @__PURE__ */ e(
+              B,
+              {
+                label: r.category.label,
+                showChevron: r.category.showChevron,
+                showPlusButton: r.category.showPlusButton
+              }
+            ),
+            r.items.map((d, g) => /* @__PURE__ */ e(
+              u,
+              {
+                ...d
+              },
+              `${r.key}-${g}-${d.name}`
+            ))
+          ]
+        },
+        r.key
+      )) }) }),
+      l && /* @__PURE__ */ e(
+        f,
+        {
+          direction: "up",
+          className: `${a["channels-sidebar__more-unreads"]} ${a["channels-sidebar__more-unreads--above"]}`
+        }
+      ),
+      c && /* @__PURE__ */ e(
+        f,
+        {
+          direction: "down",
+          className: `${a["channels-sidebar__more-unreads"]} ${a["channels-sidebar__more-unreads--below"]}`
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  B as ChannelsSidebarCategory,
+  S as ChannelsSidebarHeader,
+  x as ChannelsSidebarNavigator,
+  U as default
+};
+//# sourceMappingURL=ChannelsSidebar.js.map

package/dist/components/channels-sidebar/ChannelsSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelsSidebar.js","sources":["../../../src/components/channels-sidebar/ChannelsSidebar.tsx"],"sourcesContent":["import { useMemo, type ReactNode } from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport PlusIcon from '@mattermost/compass-icons/components/plus';\nimport MagnifyIcon from '@mattermost/compass-icons/components/magnify';\nimport FilterVariantIcon from '@mattermost/compass-icons/components/filter-variant';\nimport ChannelSidebarItem from '@/components/channel-sidebar-item/ChannelSidebarItem';\nimport MoreUnreadsBanner from '@/components/more-unreads-banner/MoreUnreadsBanner';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport Scrollbar from '@/components/scrollbar/Scrollbar';\nimport {\n  applyChannelNameOverrides,\n  type ChannelsSidebarItemModel,\n  type ChannelsSidebarModel,\n} from './channelsSidebarModel';\nimport styles from './ChannelsSidebar.module.scss';\n\nfunction applyChannelSidebarInteractivity(\n  model: ChannelsSidebarModel,\n  activeChannelName: string | undefined,\n  onItemClick?: (name: string) => void,\n): ChannelsSidebarModel {\n  const mapRow = (row: ChannelsSidebarItemModel) => ({\n    ...row,\n    active:\n      activeChannelName === undefined\n        ? row.active\n        : row.name === activeChannelName,\n    onClick: onItemClick ? () => onItemClick(row.name) : row.onClick,\n  });\n  return {\n    topGroupItems: model.topGroupItems.map(mapRow),\n    groups: model.groups.map((g) => ({\n      ...g,\n      items: g.items.map(mapRow),\n    })),\n  };\n}\n\nexport interface ChannelsSidebarHeaderProps {\n  teamName: string;\n}\n\n/** Team row + Add control; same markup as the top of `ChannelsSidebar`. */\nexport function ChannelsSidebarHeader({ teamName }: ChannelsSidebarHeaderProps) {\n  return (\n    <div className={styles['channels-sidebar__header']}>\n      <div className={styles['channels-sidebar__team-dropdown']}>\n        <span className={styles['channels-sidebar__team-name']}>\n          {teamName}\n        </span>\n        <span className={styles['channels-sidebar__team-chevron']}>\n          <ChevronDownIcon size={16} />\n        </span>\n      </div>\n      <IconButton\n        aria-label=\"Add channels\"\n        size=\"small\"\n        style=\"inverted\"\n        padding=\"compact\"\n        rounded\n        icon={<Icon size=\"16\" glyph={<PlusIcon />} />}\n        className={styles['channels-sidebar__sidebar-icon-button']}\n      />\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarNavigatorProps {\n  showFilter?: boolean;\n}\n\n/** Find channels row + optional unread filter control; same markup as `ChannelsSidebar`. */\nexport function ChannelsSidebarNavigator({\n  showFilter = false,\n}: ChannelsSidebarNavigatorProps) {\n  return (\n    <div className={styles['channels-sidebar__navigator']}>\n      {showFilter && (\n        <IconButton\n          aria-label=\"Filter channels\"\n          size=\"small\"\n          style=\"inverted\"\n          padding=\"compact\"\n          icon={<Icon size=\"16\" glyph={<FilterVariantIcon />} />}\n          className={styles['channels-sidebar__sidebar-icon-button']}\n        />\n      )}\n      <div className={styles['channels-sidebar__find-channels']}>\n        <span className={styles['channels-sidebar__find-channels-icon']}>\n          <MagnifyIcon size={16} />\n        </span>\n        <span className={styles['channels-sidebar__find-channels-label']}>\n          Find channels\n        </span>\n      </div>\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarCategoryProps {\n  label: string;\n  showChevron?: boolean;\n  showPlusButton?: boolean;\n  /** When set, shown instead of the expand chevron (e.g. System Console categories). */\n  leadingIcon?: ReactNode;\n  /** Pin category row to the top of the scroll container while scrolling (e.g. first console section). */\n  sticky?: boolean;\n  /** Full-opacity label + leading icon (System Console categories). Default: toned like channel sidebar. */\n  opaqueCategory?: boolean;\n}\n\nexport function ChannelsSidebarCategory({\n  label,\n  showChevron = true,\n  showPlusButton = false,\n  leadingIcon,\n  sticky = false,\n  opaqueCategory = false,\n}: ChannelsSidebarCategoryProps) {\n  const hasLeadingIcon = Boolean(leadingIcon);\n  const showChevronRow = showChevron && !hasLeadingIcon;\n\n  const categoryClass = [\n    styles['channels-sidebar__category'],\n    hasLeadingIcon ? styles['channels-sidebar__category--with-leading-icon'] : '',\n    opaqueCategory ? styles['channels-sidebar__category--opaque'] : '',\n    !showChevronRow && !hasLeadingIcon\n      ? styles['channels-sidebar__category--no-chevron']\n      : '',\n    showPlusButton ? styles['channels-sidebar__category--has-action'] : '',\n    sticky ? styles['channels-sidebar__category--sticky'] : '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={categoryClass}>\n      <div className={styles['channels-sidebar__category-left']}>\n        {hasLeadingIcon && (\n          <span className={styles['channels-sidebar__category-leading-icon']}>\n            {leadingIcon}\n          </span>\n        )}\n        {showChevronRow && (\n          <span className={styles['channels-sidebar__category-chevron']}>\n            <ChevronDownIcon size={12} />\n          </span>\n        )}\n        <span className={styles['channels-sidebar__category-label']}>\n          {label}\n        </span>\n      </div>\n      {showPlusButton && (\n        <IconButton\n          aria-label={`New ${label.toLowerCase()}`}\n          size=\"x-small\"\n          style=\"inverted\"\n          icon={<Icon size=\"12\" glyph={<PlusIcon />} />}\n        />\n      )}\n    </div>\n  );\n}\n\nexport interface ChannelsSidebarProps {\n  teamName?: string;\n  showUnreadsCategory?: boolean;\n  showFilter?: boolean;\n  showDialPad?: boolean;\n  moreUnreadsAbove?: boolean;\n  moreUnreadsBelow?: boolean;\n  /**\n   * Rename built-in channel/DM items without editing the model.\n   * Keys are the default names; values are the display names to use instead.\n   * Applies to `name` and `avatarAlt` on each item (same as the legacy hardcoded list).\n   */\n  channelNameOverrides?: Record<string, string>;\n  /**\n   * Match against **resolved** item names (after `channelNameOverrides`).\n   * Omit to keep each row’s fixture `active` value; pass `''` to clear selection.\n   */\n  activeChannelName?: string;\n  /** Receives the row's visible `name` (after overrides). */\n  onItemClick?: (name: string) => void;\n  avatarAikoTan?: string;\n  avatarArjunPatel?: string;\n  avatarDanielleOkoro?: string;\n  avatarDariusCole?: string;\n  avatarDavidLiang?: string;\n  avatarEmmaNovak?: string;\n  avatarEthanBrooks?: string;\n  /** When set, overrides the default channel tree (for per-prototype sidebars). */\n  model?: ChannelsSidebarModel;\n}\n\nexport default function ChannelsSidebar({\n  teamName = 'Contributors',\n  showFilter = false,\n  moreUnreadsAbove = false,\n  moreUnreadsBelow = false,\n  channelNameOverrides,\n  activeChannelName,\n  onItemClick,\n  model: modelProp,\n}: ChannelsSidebarProps) {\n  const model = useMemo(() => {\n    const baseModel = modelProp ?? { topGroupItems: [], groups: [] };\n    const withOverrides = applyChannelNameOverrides(baseModel, channelNameOverrides);\n    return applyChannelSidebarInteractivity(\n      withOverrides,\n      activeChannelName,\n      onItemClick,\n    );\n  }, [\n    modelProp,\n    channelNameOverrides,\n    activeChannelName,\n    onItemClick,\n  ]);\n\n  return (\n    <div className={styles['channels-sidebar']}>\n      <ChannelsSidebarHeader teamName={teamName} />\n      <ChannelsSidebarNavigator showFilter={showFilter} />\n\n      <div className={styles['channels-sidebar__top-group']}>\n        {model.topGroupItems.map((row, i) => (\n          <ChannelSidebarItem key={`top-${i}-${row.name}`} {...row} />\n        ))}\n      </div>\n\n      <div className={styles['channels-sidebar__scroll-view']}>\n        <Scrollbar color=\"--sidebar-text-rgb\">\n          <div className={styles['channels-sidebar__channel-groups']}>\n            {model.groups.map((group) => (\n              <div\n                key={group.key}\n                className={styles['channels-sidebar__channel-group']}\n              >\n                <ChannelsSidebarCategory\n                  label={group.category.label}\n                  showChevron={group.category.showChevron}\n                  showPlusButton={group.category.showPlusButton}\n                />\n                {group.items.map((row, index) => (\n                  <ChannelSidebarItem\n                    key={`${group.key}-${index}-${row.name}`}\n                    {...row}\n                  />\n                ))}\n              </div>\n            ))}\n          </div>\n        </Scrollbar>\n\n        {moreUnreadsAbove && (\n          <MoreUnreadsBanner\n            direction=\"up\"\n            className={`${styles['channels-sidebar__more-unreads']} ${styles['channels-sidebar__more-unreads--above']}`}\n          />\n        )}\n        {moreUnreadsBelow && (\n          <MoreUnreadsBanner\n            direction=\"down\"\n            className={`${styles['channels-sidebar__more-unreads']} ${styles['channels-sidebar__more-unreads--below']}`}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport type { ChannelsSidebarModel } from './channelsSidebarModel';\n"],"names":["applyChannelSidebarInteractivity","model","activeChannelName","onItemClick","mapRow","row","g","ChannelsSidebarHeader","teamName","jsxs","styles","jsx","ChevronDownIcon","IconButton","Icon","PlusIcon","ChannelsSidebarNavigator","showFilter","FilterVariantIcon","MagnifyIcon","ChannelsSidebarCategory","label","showChevron","showPlusButton","leadingIcon","sticky","opaqueCategory","hasLeadingIcon","showChevronRow","categoryClass","ChannelsSidebar","moreUnreadsAbove","moreUnreadsBelow","channelNameOverrides","modelProp","useMemo","withOverrides","applyChannelNameOverrides","i","ChannelSidebarItem","Scrollbar","group","index","MoreUnreadsBanner"],"mappings":"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"}

package/dist/components/channels-sidebar/ChannelsSidebar.module.css

@@ -0,0 +1 @@
+._channels-sidebar_5crxb_2{position:relative;display:flex;flex-direction:column;width:264px;height:768px;background:var(--sidebar-bg);overflow:hidden}._channels-sidebar--header-preview_5crxb_12,._channels-sidebar--navigator-preview_5crxb_19{height:auto;min-height:0}._channels-sidebar__sidebar-icon-button_5crxb_23{background:rgba(var(--sidebar-text-rgb),.08)!important}._channels-sidebar__sidebar-icon-button_5crxb_23:hover{background:rgba(var(--sidebar-text-rgb),.12)!important}._channels-sidebar__header_5crxb_29{display:flex;align-items:center;justify-content:space-between;padding:14px var(--spacing-l);flex-shrink:0}._channels-sidebar__team-dropdown_5crxb_36{display:flex;align-items:center;gap:0;padding:2px var(--spacing-xxxxs) 2px var(--spacing-xs);border-radius:var(--radius-s);cursor:pointer;max-width:174px}._channels-sidebar__team-dropdown_5crxb_36:hover{background:var(--sidebar-text-hover-bg)}._channels-sidebar__team-name_5crxb_48{font-family:var(--font-family-heading);font-size:var(--font-size-200);font-weight:var(--font-weight-semibold);line-height:var(--line-height-200);color:var(--sidebar-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._channels-sidebar__team-chevron_5crxb_58{display:flex;align-items:center;flex-shrink:0;color:var(--sidebar-text)}._channels-sidebar__navigator_5crxb_64{display:flex;align-items:center;gap:var(--spacing-xxxs);padding:0 var(--spacing-l) var(--spacing-l);flex-shrink:0}._channels-sidebar__find-channels_5crxb_71{display:flex;align-items:center;flex:1;gap:var(--spacing-xs);min-width:0;padding:var(--spacing-xxs) var(--spacing-xs);border-radius:var(--radius-s);background:rgba(var(--sidebar-text-rgb),.08);cursor:text}._channels-sidebar__find-channels-icon_5crxb_82{display:flex;align-items:center;flex-shrink:0;color:var(--sidebar-text);opacity:.64}._channels-sidebar__find-channels-label_5crxb_89{font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-regular);line-height:var(--line-height-75);letter-spacing:.02em;color:var(--sidebar-text);opacity:.72;white-space:nowrap}._channels-sidebar__top-group_5crxb_99{display:flex;flex-direction:column;flex-shrink:0;padding-bottom:var(--spacing-xs)}._channels-sidebar__scroll-view_5crxb_105{position:relative;display:flex;flex-direction:column;flex:1;min-height:0}._channels-sidebar__channel-groups_5crxb_112{display:flex;flex-direction:column;gap:var(--spacing-xs);flex-shrink:0}._channels-sidebar__channel-group_5crxb_112{display:flex;flex-direction:column}._channels-sidebar__category_5crxb_122{display:flex;align-items:center;height:32px;padding:var(--spacing-xxxs) var(--spacing-l) var(--spacing-xxxs) var(--spacing-xs);flex-shrink:0;gap:var(--spacing-xxxxs);cursor:pointer}._channels-sidebar__category--with-leading-icon_5crxb_132{padding:var(--spacing-xxxs) var(--spacing-xl)}._channels-sidebar__category--sticky_5crxb_135{position:sticky;top:0;z-index:1;background:var(--sidebar-bg)}._channels-sidebar__category--no-chevron_5crxb_141{padding-left:22px}._channels-sidebar__category--has-action_5crxb_144{padding-right:var(--spacing-l)}._channels-sidebar__category-left_5crxb_147{display:flex;align-items:center;flex:1;min-width:0;gap:var(--spacing-xxxxs)}._channels-sidebar__category-leading-icon_5crxb_154{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:12px;height:12px;color:var(--sidebar-text)}._channels-sidebar__category--with-leading-icon_5crxb_132 ._channels-sidebar__category-left_5crxb_147{gap:var(--spacing-xxxs)}._channels-sidebar__category--with-leading-icon_5crxb_132 ._channels-sidebar__category-leading-icon_5crxb_154{opacity:.64}._channels-sidebar__category--opaque_5crxb_175 ._channels-sidebar__category-label_5crxb_175,._channels-sidebar__category--opaque_5crxb_175 ._channels-sidebar__category-leading-icon_5crxb_154{opacity:1}._channels-sidebar__category-chevron_5crxb_181{display:flex;align-items:center;flex-shrink:0;color:var(--sidebar-text);opacity:.75}._channels-sidebar__category-label_5crxb_175{font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);letter-spacing:.02em;text-transform:uppercase;color:var(--sidebar-text);opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._channels-sidebar__more-unreads_5crxb_201{position:absolute;left:var(--spacing-s);right:var(--spacing-s);z-index:1}._channels-sidebar__more-unreads--above_5crxb_207{top:var(--spacing-s)}._channels-sidebar__more-unreads--below_5crxb_210{bottom:var(--spacing-s)}

package/dist/components/channels-sidebar/ChannelsSidebar.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ChannelsSidebar.module.css');const e={"channels-sidebar":"_channels-sidebar_5crxb_2","channels-sidebar--header-preview":"_channels-sidebar--header-preview_5crxb_12","channels-sidebar--navigator-preview":"_channels-sidebar--navigator-preview_5crxb_19","channels-sidebar__sidebar-icon-button":"_channels-sidebar__sidebar-icon-button_5crxb_23","channels-sidebar__header":"_channels-sidebar__header_5crxb_29","channels-sidebar__team-dropdown":"_channels-sidebar__team-dropdown_5crxb_36","channels-sidebar__team-name":"_channels-sidebar__team-name_5crxb_48","channels-sidebar__team-chevron":"_channels-sidebar__team-chevron_5crxb_58","channels-sidebar__navigator":"_channels-sidebar__navigator_5crxb_64","channels-sidebar__find-channels":"_channels-sidebar__find-channels_5crxb_71","channels-sidebar__find-channels-icon":"_channels-sidebar__find-channels-icon_5crxb_82","channels-sidebar__find-channels-label":"_channels-sidebar__find-channels-label_5crxb_89","channels-sidebar__top-group":"_channels-sidebar__top-group_5crxb_99","channels-sidebar__scroll-view":"_channels-sidebar__scroll-view_5crxb_105","channels-sidebar__channel-groups":"_channels-sidebar__channel-groups_5crxb_112","channels-sidebar__channel-group":"_channels-sidebar__channel-group_5crxb_112","channels-sidebar__category":"_channels-sidebar__category_5crxb_122","channels-sidebar__category--with-leading-icon":"_channels-sidebar__category--with-leading-icon_5crxb_132","channels-sidebar__category--sticky":"_channels-sidebar__category--sticky_5crxb_135","channels-sidebar__category--no-chevron":"_channels-sidebar__category--no-chevron_5crxb_141","channels-sidebar__category--has-action":"_channels-sidebar__category--has-action_5crxb_144","channels-sidebar__category-left":"_channels-sidebar__category-left_5crxb_147","channels-sidebar__category-leading-icon":"_channels-sidebar__category-leading-icon_5crxb_154","channels-sidebar__category--opaque":"_channels-sidebar__category--opaque_5crxb_175","channels-sidebar__category-label":"_channels-sidebar__category-label_5crxb_175","channels-sidebar__category-chevron":"_channels-sidebar__category-chevron_5crxb_181","channels-sidebar__more-unreads":"_channels-sidebar__more-unreads_5crxb_201","channels-sidebar__more-unreads--above":"_channels-sidebar__more-unreads--above_5crxb_207","channels-sidebar__more-unreads--below":"_channels-sidebar__more-unreads--below_5crxb_210"};exports.default=e;
+//# sourceMappingURL=ChannelsSidebar.module.scss.cjs.map

package/dist/components/channels-sidebar/ChannelsSidebar.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelsSidebar.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/channels-sidebar/ChannelsSidebar.module.scss.js

@@ -0,0 +1,35 @@
+import './ChannelsSidebar.module.css';const e = {
+  "channels-sidebar": "_channels-sidebar_5crxb_2",
+  "channels-sidebar--header-preview": "_channels-sidebar--header-preview_5crxb_12",
+  "channels-sidebar--navigator-preview": "_channels-sidebar--navigator-preview_5crxb_19",
+  "channels-sidebar__sidebar-icon-button": "_channels-sidebar__sidebar-icon-button_5crxb_23",
+  "channels-sidebar__header": "_channels-sidebar__header_5crxb_29",
+  "channels-sidebar__team-dropdown": "_channels-sidebar__team-dropdown_5crxb_36",
+  "channels-sidebar__team-name": "_channels-sidebar__team-name_5crxb_48",
+  "channels-sidebar__team-chevron": "_channels-sidebar__team-chevron_5crxb_58",
+  "channels-sidebar__navigator": "_channels-sidebar__navigator_5crxb_64",
+  "channels-sidebar__find-channels": "_channels-sidebar__find-channels_5crxb_71",
+  "channels-sidebar__find-channels-icon": "_channels-sidebar__find-channels-icon_5crxb_82",
+  "channels-sidebar__find-channels-label": "_channels-sidebar__find-channels-label_5crxb_89",
+  "channels-sidebar__top-group": "_channels-sidebar__top-group_5crxb_99",
+  "channels-sidebar__scroll-view": "_channels-sidebar__scroll-view_5crxb_105",
+  "channels-sidebar__channel-groups": "_channels-sidebar__channel-groups_5crxb_112",
+  "channels-sidebar__channel-group": "_channels-sidebar__channel-group_5crxb_112",
+  "channels-sidebar__category": "_channels-sidebar__category_5crxb_122",
+  "channels-sidebar__category--with-leading-icon": "_channels-sidebar__category--with-leading-icon_5crxb_132",
+  "channels-sidebar__category--sticky": "_channels-sidebar__category--sticky_5crxb_135",
+  "channels-sidebar__category--no-chevron": "_channels-sidebar__category--no-chevron_5crxb_141",
+  "channels-sidebar__category--has-action": "_channels-sidebar__category--has-action_5crxb_144",
+  "channels-sidebar__category-left": "_channels-sidebar__category-left_5crxb_147",
+  "channels-sidebar__category-leading-icon": "_channels-sidebar__category-leading-icon_5crxb_154",
+  "channels-sidebar__category--opaque": "_channels-sidebar__category--opaque_5crxb_175",
+  "channels-sidebar__category-label": "_channels-sidebar__category-label_5crxb_175",
+  "channels-sidebar__category-chevron": "_channels-sidebar__category-chevron_5crxb_181",
+  "channels-sidebar__more-unreads": "_channels-sidebar__more-unreads_5crxb_201",
+  "channels-sidebar__more-unreads--above": "_channels-sidebar__more-unreads--above_5crxb_207",
+  "channels-sidebar__more-unreads--below": "_channels-sidebar__more-unreads--below_5crxb_210"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=ChannelsSidebar.module.scss.js.map

package/dist/components/channels-sidebar/ChannelsSidebar.module.scss.js.map

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

package/dist/components/channels-sidebar/channelsSidebarModel.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function n(a,e){if(!e||Object.keys(e).length===0)return a;const p=t=>e[t]??t,r=t=>({...t,name:p(t.name),avatarAlt:t.avatarAlt!=null?p(t.avatarAlt):t.avatarAlt});return{topGroupItems:a.topGroupItems.map(r),groups:a.groups.map(t=>({...t,items:t.items.map(r)}))}}exports.applyChannelNameOverrides=n;
+//# sourceMappingURL=channelsSidebarModel.cjs.map

package/dist/components/channels-sidebar/channelsSidebarModel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"channelsSidebarModel.cjs","sources":["../../../src/components/channels-sidebar/channelsSidebarModel.ts"],"sourcesContent":["import type { ChannelSidebarItemProps } from '@/components/channel-sidebar-item/ChannelSidebarItem';\n\nexport type ChannelsSidebarItemModel = Pick<\n  ChannelSidebarItemProps,\n  | 'name'\n  | 'leadingVisual'\n  | 'active'\n  | 'status'\n  | 'mentionCount'\n  | 'memberCount'\n  | 'avatarSrc'\n  | 'avatarAlt'\n  | 'showAvatarStatus'\n  | 'onClick'\n>;\n\nexport interface ChannelsSidebarCategoryModel {\n  label: string;\n  showChevron?: boolean;\n  showPlusButton?: boolean;\n}\n\nexport interface ChannelsSidebarGroupModel {\n  key: string;\n  category: ChannelsSidebarCategoryModel;\n  items: ChannelsSidebarItemModel[];\n}\n\nexport interface ChannelsSidebarModel {\n  topGroupItems: ChannelsSidebarItemModel[];\n  groups: ChannelsSidebarGroupModel[];\n}\n\n/**\n * Applies per-page display renames (keys = default names from the model) to\n * `name` and `avatarAlt` on each row, matching pre-model `channelNameOverrides` behavior.\n */\nexport function applyChannelNameOverrides(\n  model: ChannelsSidebarModel,\n  channelNameOverrides?: Record<string, string>,\n): ChannelsSidebarModel {\n  if (!channelNameOverrides || Object.keys(channelNameOverrides).length === 0) {\n    return model;\n  }\n\n  const resolve = (s: string) => channelNameOverrides[s] ?? s;\n\n  const mapRow = (row: ChannelsSidebarItemModel): ChannelsSidebarItemModel => ({\n    ...row,\n    name: resolve(row.name),\n    avatarAlt: row.avatarAlt != null ? resolve(row.avatarAlt) : row.avatarAlt,\n  });\n\n  return {\n    topGroupItems: model.topGroupItems.map(mapRow),\n    groups: model.groups.map((g) => ({\n      ...g,\n      items: g.items.map(mapRow),\n    })),\n  };\n}\n"],"names":["applyChannelNameOverrides","model","channelNameOverrides","resolve","s","mapRow","row","g"],"mappings":"gFAqCO,SAASA,EACdC,EACAC,EACsB,CACtB,GAAI,CAACA,GAAwB,OAAO,KAAKA,CAAoB,EAAE,SAAW,EACxE,OAAOD,EAGT,MAAME,EAAWC,GAAcF,EAAqBE,CAAC,GAAKA,EAEpDC,EAAUC,IAA6D,CAC3E,GAAGA,EACH,KAAMH,EAAQG,EAAI,IAAI,EACtB,UAAWA,EAAI,WAAa,KAAOH,EAAQG,EAAI,SAAS,EAAIA,EAAI,SAAA,GAGlE,MAAO,CACL,cAAeL,EAAM,cAAc,IAAII,CAAM,EAC7C,OAAQJ,EAAM,OAAO,IAAKM,IAAO,CAC/B,GAAGA,EACH,MAAOA,EAAE,MAAM,IAAIF,CAAM,CAAA,EACzB,CAAA,CAEN"}