npm - @mattermost/compass-ui - Versions diffs - 0.1.0-alpha.10 → 0.1.0-alpha.11 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (441) hide show

package/dist/components/thread-footer/ThreadFooter.js CHANGED Viewed

@@ -1,57 +1,53 @@
-import { jsx as r, jsxs as o } from "react/jsx-runtime";
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
 import c from "../button/Button.js";
 import N from "../icon/Icon.js";
 import __v from "@mattermost/compass-icons/components/reply-outline.js";const v=__v&&__v.default?__v.default:__v;
 import b from "../mention-badge/MentionBadge.js";
 import y from "../user-avatar-group/UserAvatarGroup.js";
 import e from "./ThreadFooter.module.scss.js";
-function w({
-  replyCount: t = 3,
+function I({
+  replyCount: s = 3,
   avatars: l = [],
-  badge: s = "none",
+  badge: a = "none",
   mentionCount: i = 1,
-  following: a = !1,
-  lastReplyTime: d,
+  following: o = !1,
+  lastReplyTime: n,
   onReply: m,
   onFollowToggle: f,
-  hovered: n = !1,
+  hovered: d = !1,
   className: _ = "",
   ...p
 }) {
   const u = [
     e["thread-footer"],
-    a ? e["thread-footer--following"] : "",
-    n ? e["thread-footer--hovered"] : "",
+    o ? e["thread-footer--following"] : "",
+    d ? e["thread-footer--hovered"] : "",
     _
-  ].filter(Boolean).join(" "), h = s === "mention" ? `${i} mention${i === 1 ? "" : "s"}` : s === "unread" ? "Unread replies" : void 0;
-  return /* @__PURE__ */ r("div", { className: u, ...p, children: /* @__PURE__ */ o("div", { className: e["thread-footer__inner"], children: [
-    /* @__PURE__ */ o("div", { className: e["thread-footer__avatars-group"], children: [
+  ].filter(Boolean).join(" "), h = a === "mention" ? `${i} mention${i === 1 ? "" : "s"}` : a === "unread" ? "Unread replies" : void 0;
+  return /* @__PURE__ */ r("div", { className: u, ...p, children: /* @__PURE__ */ t("div", { className: e["thread-footer__inner"], children: [
+    /* @__PURE__ */ t("div", { className: e["thread-footer__avatars-group"], children: [
       h && /* @__PURE__ */ r("span", { className: e["thread-footer__status-hint"], children: h }),
-      s === "unread" && /* @__PURE__ */ r(
-        "span",
+      (a === "unread" || a === "mention") && /* @__PURE__ */ t(
+        "div",
         {
-          className: e["thread-footer__unread-dot"],
-          "aria-hidden": !0
-        }
-      ),
-      s === "mention" && /* @__PURE__ */ r(
-        "span",
-        {
-          className: e["thread-footer__mention-badge"],
+          className: e["thread-footer__badge-container"],
           "aria-hidden": !0,
-          children: /* @__PURE__ */ r(
-            b,
-            {
-              count: i,
-              location: "channel",
-              size: "medium"
-            }
-          )
+          children: [
+            a === "unread" && /* @__PURE__ */ r("span", { className: e["thread-footer__unread-dot"] }),
+            a === "mention" && /* @__PURE__ */ r("span", { className: e["thread-footer__mention-badge"], children: /* @__PURE__ */ r(
+              b,
+              {
+                count: i,
+                location: "channel",
+                size: "medium"
+              }
+            ) })
+          ]
         }
       ),
       l.length > 0 && /* @__PURE__ */ r(y, { avatars: l, max: 3, size: "20" })
     ] }),
-    /* @__PURE__ */ o("div", { className: e["thread-footer__buttons"], children: [
+    /* @__PURE__ */ t("div", { className: e["thread-footer__buttons"], children: [
       /* @__PURE__ */ r(
         c,
         {
@@ -59,15 +55,15 @@ function w({
           size: "x-small",
           className: [
             e["thread-footer__reply-btn"],
-            n ? e["thread-footer__reply-btn--hovered"] : ""
+            d ? e["thread-footer__reply-btn--hovered"] : ""
           ].filter(Boolean).join(" "),
           onClick: m,
-          "aria-label": `${t} repl${t === 1 ? "y" : "ies"}`,
+          "aria-label": `${s} repl${s === 1 ? "y" : "ies"}`,
           leadingIcon: /* @__PURE__ */ r(N, { size: "12", glyph: /* @__PURE__ */ r(v, {}) }),
-          children: /* @__PURE__ */ o("span", { className: e["thread-footer__btn-label"], children: [
-            t,
+          children: /* @__PURE__ */ t("span", { className: e["thread-footer__btn-label"], children: [
+            s,
             " ",
-            t === 1 ? "reply" : "replies"
+            s === 1 ? "reply" : "replies"
           ] })
         }
       ),
@@ -79,22 +75,22 @@ function w({
           size: "x-small",
           className: [
             e["thread-footer__follow-btn"],
-            a ? e["thread-footer__follow-btn--following"] : ""
+            o ? e["thread-footer__follow-btn--following"] : ""
           ].filter(Boolean).join(" "),
           onClick: f,
-          "aria-pressed": a,
-          "aria-label": a ? "Unfollow thread" : "Follow thread",
-          children: a ? "Following" : "Follow"
+          "aria-pressed": o,
+          "aria-label": o ? "Unfollow thread" : "Follow thread",
+          children: o ? "Following" : "Follow"
         }
       ),
-      a && d && /* @__PURE__ */ o("div", { className: e["thread-footer__last-reply-group"], children: [
+      o && n && /* @__PURE__ */ t("div", { className: e["thread-footer__last-reply-group"], children: [
         /* @__PURE__ */ r("div", { className: e["thread-footer__divider"], "aria-hidden": !0 }),
-        /* @__PURE__ */ r("span", { className: e["thread-footer__last-reply"], children: d })
+        /* @__PURE__ */ r("span", { className: e["thread-footer__last-reply"], children: n })
       ] })
     ] })
   ] }) });
 }
 export {
-  w as default
+  I as default
 };
 //# sourceMappingURL=ThreadFooter.js.map

package/dist/components/thread-footer/ThreadFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThreadFooter.js","sources":["../../../src/components/thread-footer/ThreadFooter.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport ReplyOutlineIcon from '@mattermost/compass-icons/components/reply-outline';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '@/components/user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadFooter.module.scss';\n\nexport type ThreadFooterBadge = 'none' \| 'unread' \| 'mention';\n\nexport interface ThreadFooterProps extends HTMLAttributes<HTMLDivElement> {\n /** Reply count. Default: 3. /\n replyCount?: number;\n /* Participant avatars. Rendered with User Avatar Group (first 3 shown, overflow as +N). /\n avatars?: UserAvatarGroupItem[];\n /* Badge variant. Default: None. /\n badge?: ThreadFooterBadge;\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Whether the current user is following the thread. Default: false. /\n following?: boolean;\n /* Last reply timestamp label. Shown on row hover when following. /\n lastReplyTime?: string;\n /* Called when Reply is clicked. /\n onReply?: () => void;\n /* Called when Follow/Following is clicked. /\n onFollowToggle?: () => void;\n /* Hover / active state for button highlight. Default: false. /\n hovered?: boolean;\n /* Optional CSS class name. /\n className?: string;\n}\n\n/\n The Thread Footer is the reply summary bar at the bottom of a message. It shows\n * participants, reply count, follow state, and last-reply time — the information someone\n * needs to decide whether to dive in.\n /\nexport default function ThreadFooter({\n replyCount = 3,\n avatars = [],\n badge = 'none',\n mentionCount = 1,\n following = false,\n lastReplyTime,\n onReply,\n onFollowToggle,\n hovered = false,\n className = '',\n ...rest\n}: ThreadFooterProps) {\n const rootClass = [\n styles['thread-footer'],\n following ? styles['thread-footer--following'] : '',\n hovered ? styles['thread-footer--hovered'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const badgeStatusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'Unread replies'\n : undefined;\n\n return (\n <div className={rootClass} {...rest}>\n <div className={styles['thread-footer__inner']}>\n <div className={styles['thread-footer__avatars-group']}>\n {badgeStatusHint && (\n <span className={styles['thread-footer__status-hint']}>\n {badgeStatusHint}\n </span>\n )}\n {badge === 'unread' && (\n <~~span~~\n className={styles['thread-~~footer__unread~~-~~dot~~']}\n aria-hidden\n />\n )}\n {badge === 'mention' && (\n <span\n className={styles['thread-footer__mention-badge']}~~\n aria-hidden\n~~ >\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n\n {avatars.length > 0 && (\n <UserAvatarGroup avatars={avatars} max={3} size=\"20\" />\n )}\n </div>\n\n {/ Buttons /}\n <div className={styles['thread-footer__buttons']}>\n {/ Reply button /}\n <Button\n emphasis=\"quaternary\"\n size=\"x-small\"\n className={[\n styles['thread-footer__reply-btn'],\n hovered ? styles['thread-footer__reply-btn--hovered'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onReply}\n aria-label={`${replyCount} repl${replyCount === 1 ? 'y' : 'ies'}`}\n leadingIcon={<Icon size=\"12\" glyph={<ReplyOutlineIcon />} />}\n >\n <span className={styles['thread-footer__btn-label']}>\n {replyCount} {replyCount === 1 ? 'reply' : 'replies'}\n </span>\n </Button>\n\n <div className={styles['thread-footer__divider']} aria-hidden />\n\n {/ Follow / Following button /}\n <Button\n emphasis=\"quaternary\"\n size=\"x-small\"\n className={[\n styles['thread-footer__follow-btn'],\n following ? styles['thread-footer__follow-btn--following'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onFollowToggle}\n aria-pressed={following}\n aria-label={following ? 'Unfollow thread' : 'Follow thread'}\n >\n {following ? 'Following' : 'Follow'}\n </Button>\n\n {/ Last reply time — revealed on row hover when following */}\n {following && lastReplyTime && (\n <div className={styles['thread-footer__last-reply-group']}>\n <div className={styles['thread-footer__divider']} aria-hidden />\n <span className={styles['thread-footer__last-reply']}>\n {lastReplyTime}\n </span>\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n"],"names":["ThreadFooter","replyCount","avatars","badge","mentionCount","following","lastReplyTime","onReply","onFollowToggle","hovered","className","rest","rootClass","styles","badgeStatusHint","jsx","jsxs","MentionBadge","UserAvatarGroup","Button","Icon","ReplyOutlineIcon"],"mappings":";;;;;;;AAwCA,SAAwBA,EAAa;AAAA,EACnC,YAAAC,IAAa;AAAA,EACb,SAAAC,IAAU,CAAA;AAAA,EACV,OAAAC,IAAQ;AAAA,EACR,cAAAC,IAAe;AAAA,EACf,WAAAC,IAAY;AAAA,EACZ,eAAAC;AAAA,EACA,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAsB;AACpB,QAAMC,IAAY;AAAA,IAChBC,EAAO,eAAe;AAAA,IACtBR,IAAYQ,EAAO,0BAA0B,IAAI;AAAA,IACjDJ,IAAUI,EAAO,wBAAwB,IAAI;AAAA,IAC7CH;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAELI,IACJX,MAAU,YACN,GAAGC,CAAY,WAAWA,MAAiB,IAAI,KAAK,GAAG,KACvDD,MAAU,WACR,mBACA;AAER,SACE,gBAAAY,EAAC,OAAA,EAAI,WAAWH,GAAY,GAAGD,GAC7B,UAAA,gBAAAK,EAAC,OAAA,EAAI,WAAWH,EAAO,sBAAsB,GAC3C,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWH,EAAO,8BAA8B,GAClD,UAAA;AAAA,MAAAC,uBACE,QAAA,EAAK,WAAWD,EAAO,4BAA4B,GACjD,UAAAC,GACH;AAAA,~~MAEDX~~,MAAU,~~YACT~~,~~gBAAAY~~;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,~~WAAWF~~,EAAO,~~2BAA2B~~;AAAA,~~UAC7C~~,eAAW;AAAA,~~QAAA;AAAA~~,~~MAAA~~;AAAA,~~MAGdV~~,MAAU,~~aACT~~,gBAAAY~~;AAAA~~,~~QAAC;AAAA~~,QAAA~~;AAAA~~,~~UACC~~,WAAWF,EAAO,~~8BAA8B~~;AAAA,~~UAChD~~,~~eAAW;AAAA~~,~~UAEX~~,UAAA,gBAAAE;AAAA,~~YAACE~~;AAAA,~~YAAA~~;AAAA,~~cACC~~,OAAOb;AAAA,~~cACP~~,UAAS;AAAA,~~cACT~~,MAAK;AAAA,YAAA;AAAA,UAAA;AAAA,~~QACP~~;AAAA,MAAA;AAAA,~~MAIHF~~,EAAQ,SAAS,KAChB,gBAAAa,EAACG,KAAgB,SAAAhB,GAAkB,KAAK,GAAG,MAAK,KAAA,CAAK;AAAA,IAAA,GAEzD;AAAA,IAGA,gBAAAc,EAAC,OAAA,EAAI,WAAWH,EAAO,wBAAwB,GAE7C,UAAA;AAAA,MAAA,gBAAAE;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,UAAS;AAAA,UACT,MAAK;AAAA,UACL,WAAW;AAAA,YACTN,EAAO,0BAA0B;AAAA,YACjCJ,IAAUI,EAAO,mCAAmC,IAAI;AAAA,UAAA,EAEvD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,UACX,SAASN;AAAA,UACT,cAAY,GAAGN,CAAU,QAAQA,MAAe,IAAI,MAAM,KAAK;AAAA,UAC/D,+BAAcmB,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAL,EAACM,KAAiB,GAAI;AAAA,UAE1D,UAAA,gBAAAL,EAAC,QAAA,EAAK,WAAWH,EAAO,0BAA0B,GAC/C,UAAA;AAAA,YAAAZ;AAAA,YAAW;AAAA,YAAEA,MAAe,IAAI,UAAU;AAAA,UAAA,EAAA,CAC7C;AAAA,QAAA;AAAA,MAAA;AAAA,wBAGD,OAAA,EAAI,WAAWY,EAAO,wBAAwB,GAAG,eAAW,IAAC;AAAA,MAG9D,gBAAAE;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,UAAS;AAAA,UACT,MAAK;AAAA,UACL,WAAW;AAAA,YACTN,EAAO,2BAA2B;AAAA,YAClCR,IAAYQ,EAAO,sCAAsC,IAAI;AAAA,UAAA,EAE5D,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,UACX,SAASL;AAAA,UACT,gBAAcH;AAAA,UACd,cAAYA,IAAY,oBAAoB;AAAA,UAE3C,cAAY,cAAc;AAAA,QAAA;AAAA,MAAA;AAAA,MAI5BA,KAAaC,KACZ,gBAAAU,EAAC,SAAI,WAAWH,EAAO,iCAAiC,GACtD,UAAA;AAAA,QAAA,gBAAAE,EAAC,SAAI,WAAWF,EAAO,wBAAwB,GAAG,eAAW,IAAC;AAAA,0BAC7D,QAAA,EAAK,WAAWA,EAAO,2BAA2B,GAChD,UAAAP,EAAA,CACH;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}
1	+ {"version":3,"file":"ThreadFooter.js","sources":["../../../src/components/thread-footer/ThreadFooter.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport ReplyOutlineIcon from '@mattermost/compass-icons/components/reply-outline';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '@/components/user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadFooter.module.scss';\n\nexport type ThreadFooterBadge = 'none' \| 'unread' \| 'mention';\n\nexport interface ThreadFooterProps extends HTMLAttributes<HTMLDivElement> {\n /** Reply count. Default: 3. /\n replyCount?: number;\n /* Participant avatars. Rendered with User Avatar Group (first 3 shown, overflow as +N). /\n avatars?: UserAvatarGroupItem[];\n /* Badge variant. Default: None. /\n badge?: ThreadFooterBadge;\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Whether the current user is following the thread. Default: false. /\n following?: boolean;\n /* Last reply timestamp label. Shown on row hover when following. /\n lastReplyTime?: string;\n /* Called when Reply is clicked. /\n onReply?: () => void;\n /* Called when Follow/Following is clicked. /\n onFollowToggle?: () => void;\n /* Hover / active state for button highlight. Default: false. /\n hovered?: boolean;\n /* Optional CSS class name. /\n className?: string;\n}\n\n/\n The Thread Footer is the reply summary bar at the bottom of a message. It shows\n * participants, reply count, follow state, and last-reply time — the information someone\n * needs to decide whether to dive in.\n /\nexport default function ThreadFooter({\n replyCount = 3,\n avatars = [],\n badge = 'none',\n mentionCount = 1,\n following = false,\n lastReplyTime,\n onReply,\n onFollowToggle,\n hovered = false,\n className = '',\n ...rest\n}: ThreadFooterProps) {\n const rootClass = [\n styles['thread-footer'],\n following ? styles['thread-footer--following'] : '',\n hovered ? styles['thread-footer--hovered'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const badgeStatusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'Unread replies'\n : undefined;\n\n return (\n <div className={rootClass} {...rest}>\n <div className={styles['thread-footer__inner']}>\n <div className={styles['thread-footer__avatars-group']}>\n {badgeStatusHint && (\n <span className={styles['thread-footer__status-hint']}>\n {badgeStatusHint}\n </span>\n )}\n {(badge === 'unread' \|\| badge === 'mention') && (\n <div\n className={styles['thread-footer__badge-container']}\n aria-hidden\n >\n {badge === 'unread' && (\n <span className={styles['thread-footer__unread-dot']} />\n )}\n {badge === 'mention' && (\n <span className={styles['thread-footer__mention-badge']}>\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n </div>\n )}\n\n {avatars.length > 0 && (\n <UserAvatarGroup avatars={avatars} max={3} size=\"20\" />\n )}\n </div>\n\n {/ Buttons /}\n <div className={styles['thread-footer__buttons']}>\n {/ Reply button /}\n <Button\n emphasis=\"quaternary\"\n size=\"x-small\"\n className={[\n styles['thread-footer__reply-btn'],\n hovered ? styles['thread-footer__reply-btn--hovered'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onReply}\n aria-label={`${replyCount} repl${replyCount === 1 ? 'y' : 'ies'}`}\n leadingIcon={<Icon size=\"12\" glyph={<ReplyOutlineIcon />} />}\n >\n <span className={styles['thread-footer__btn-label']}>\n {replyCount} {replyCount === 1 ? 'reply' : 'replies'}\n </span>\n </Button>\n\n <div className={styles['thread-footer__divider']} aria-hidden />\n\n {/ Follow / Following button /}\n <Button\n emphasis=\"quaternary\"\n size=\"x-small\"\n className={[\n styles['thread-footer__follow-btn'],\n following ? styles['thread-footer__follow-btn--following'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onFollowToggle}\n aria-pressed={following}\n aria-label={following ? 'Unfollow thread' : 'Follow thread'}\n >\n {following ? 'Following' : 'Follow'}\n </Button>\n\n {/ Last reply time — revealed on row hover when following */}\n {following && lastReplyTime && (\n <div className={styles['thread-footer__last-reply-group']}>\n <div className={styles['thread-footer__divider']} aria-hidden />\n <span className={styles['thread-footer__last-reply']}>\n {lastReplyTime}\n </span>\n </div>\n )}\n </div>\n </div>\n </div>\n );\n}\n"],"names":["ThreadFooter","replyCount","avatars","badge","mentionCount","following","lastReplyTime","onReply","onFollowToggle","hovered","className","rest","rootClass","styles","badgeStatusHint","jsx","jsxs","MentionBadge","UserAvatarGroup","Button","Icon","ReplyOutlineIcon"],"mappings":"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"}

package/dist/components/thread-footer/ThreadFooter.module.scss.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ThreadFooter.css');const e={"thread-footer":"_thread-footer_k8u9j_2","thread-footer__inner":"_thread-footer__inner_k8u9j_9","thread-footer__avatars-group":"_thread-footer__avatars-group_k8u9j_15","thread-footer__status-hint":"_thread-footer__status-hint_k8u9j_21","thread-footer__unread-dot":"_thread-footer__unread-dot_k8u9j_32","thread-footer__mention-badge":"_thread-footer__mention-badge_k8u9j_40","thread-footer__buttons":"_thread-footer__buttons_k8u9j_44","thread-footer__reply-btn":"_thread-footer__reply-btn_k8u9j_49","thread-footer__follow-btn":"_thread-footer__follow-btn_k8u9j_49","thread-footer__follow-btn--following":"_thread-footer__follow-btn--following_k8u9j_52","thread-footer__reply-btn--hovered":"_thread-footer__reply-btn--hovered_k8u9j_58","thread-footer__btn-label":"_thread-footer__btn-label_k8u9j_68","thread-footer__divider":"_thread-footer__divider_k8u9j_75","thread-footer__last-reply-group":"_thread-footer__last-reply-group_k8u9j_88","thread-footer--following":"_thread-footer--following_k8u9j_107","thread-footer--hovered":"_thread-footer--hovered_k8u9j_107","thread-footer__last-reply":"_thread-footer__last-reply_k8u9j_88"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ThreadFooter.css');const e={"thread-footer":"_thread-footer_b5kji_2","thread-footer__inner":"_thread-footer__inner_b5kji_8","thread-footer__avatars-group":"_thread-footer__avatars-group_b5kji_14","thread-footer__status-hint":"_thread-footer__status-hint_b5kji_19","thread-footer__badge-container":"_thread-footer__badge-container_b5kji_30","thread-footer__unread-dot":"_thread-footer__unread-dot_b5kji_39","thread-footer__mention-badge":"_thread-footer__mention-badge_b5kji_46","thread-footer__buttons":"_thread-footer__buttons_b5kji_49","thread-footer__reply-btn":"_thread-footer__reply-btn_b5kji_54","thread-footer__follow-btn":"_thread-footer__follow-btn_b5kji_54","thread-footer__follow-btn--following":"_thread-footer__follow-btn--following_b5kji_57","thread-footer__reply-btn--hovered":"_thread-footer__reply-btn--hovered_b5kji_63","thread-footer__btn-label":"_thread-footer__btn-label_b5kji_73","thread-footer__divider":"_thread-footer__divider_b5kji_80","thread-footer__last-reply-group":"_thread-footer__last-reply-group_b5kji_93","thread-footer--following":"_thread-footer--following_b5kji_112","thread-footer--hovered":"_thread-footer--hovered_b5kji_112","thread-footer__last-reply":"_thread-footer__last-reply_b5kji_93"};exports.default=e;
 //# sourceMappingURL=ThreadFooter.module.scss.cjs.map

package/dist/components/thread-footer/ThreadFooter.module.scss.js CHANGED Viewed

@@ -1,21 +1,22 @@
 import './ThreadFooter.css';const _ = {
-  "thread-footer": "_thread-footer_k8u9j_2",
-  "thread-footer__inner": "_thread-footer__inner_k8u9j_9",
-  "thread-footer__avatars-group": "_thread-footer__avatars-group_k8u9j_15",
-  "thread-footer__status-hint": "_thread-footer__status-hint_k8u9j_21",
-  "thread-footer__unread-dot": "_thread-footer__unread-dot_k8u9j_32",
-  "thread-footer__mention-badge": "_thread-footer__mention-badge_k8u9j_40",
-  "thread-footer__buttons": "_thread-footer__buttons_k8u9j_44",
-  "thread-footer__reply-btn": "_thread-footer__reply-btn_k8u9j_49",
-  "thread-footer__follow-btn": "_thread-footer__follow-btn_k8u9j_49",
-  "thread-footer__follow-btn--following": "_thread-footer__follow-btn--following_k8u9j_52",
-  "thread-footer__reply-btn--hovered": "_thread-footer__reply-btn--hovered_k8u9j_58",
-  "thread-footer__btn-label": "_thread-footer__btn-label_k8u9j_68",
-  "thread-footer__divider": "_thread-footer__divider_k8u9j_75",
-  "thread-footer__last-reply-group": "_thread-footer__last-reply-group_k8u9j_88",
-  "thread-footer--following": "_thread-footer--following_k8u9j_107",
-  "thread-footer--hovered": "_thread-footer--hovered_k8u9j_107",
-  "thread-footer__last-reply": "_thread-footer__last-reply_k8u9j_88"
+  "thread-footer": "_thread-footer_b5kji_2",
+  "thread-footer__inner": "_thread-footer__inner_b5kji_8",
+  "thread-footer__avatars-group": "_thread-footer__avatars-group_b5kji_14",
+  "thread-footer__status-hint": "_thread-footer__status-hint_b5kji_19",
+  "thread-footer__badge-container": "_thread-footer__badge-container_b5kji_30",
+  "thread-footer__unread-dot": "_thread-footer__unread-dot_b5kji_39",
+  "thread-footer__mention-badge": "_thread-footer__mention-badge_b5kji_46",
+  "thread-footer__buttons": "_thread-footer__buttons_b5kji_49",
+  "thread-footer__reply-btn": "_thread-footer__reply-btn_b5kji_54",
+  "thread-footer__follow-btn": "_thread-footer__follow-btn_b5kji_54",
+  "thread-footer__follow-btn--following": "_thread-footer__follow-btn--following_b5kji_57",
+  "thread-footer__reply-btn--hovered": "_thread-footer__reply-btn--hovered_b5kji_63",
+  "thread-footer__btn-label": "_thread-footer__btn-label_b5kji_73",
+  "thread-footer__divider": "_thread-footer__divider_b5kji_80",
+  "thread-footer__last-reply-group": "_thread-footer__last-reply-group_b5kji_93",
+  "thread-footer--following": "_thread-footer--following_b5kji_112",
+  "thread-footer--hovered": "_thread-footer--hovered_b5kji_112",
+  "thread-footer__last-reply": "_thread-footer__last-reply_b5kji_93"
 };
 export {
   _ as default

package/dist/components/thread-footer/ThreadFooter.module.scss.js.map CHANGED Viewed

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

package/dist/components/thread-list-item/ThreadListItem.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThreadListItem.cjs","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"sourcesContent":["import DotsHorizontalIcon from '@mattermost/compass-icons/components/dots-horizontal';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '../mention-badge/MentionBadge';\nimport UnreadBadge from '../unread-badge/UnreadBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '../user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadListItem.module.scss';\n\nconst DEFAULT_PARTICIPANTS: UserAvatarGroupItem[] = [\n { key: 'leonard', name: 'Leonard Riley' },\n { key: 'aiko', name: 'Aiko Tan' },\n { key: 'arjun', name: 'Arjun Patel' },\n { key: 'marco', name: 'Marco Rinaldi' },\n { key: 'sofia', name: 'Sofia Bauer' },\n];\n\nexport interface ThreadListItemProps {\n /** Whether this item is the active/selected thread. /\n active?: boolean;\n /* Badge in the left gutter. Default: None. Hidden when `active` is true. /\n badge?: 'none' \| 'unread' \| 'mention';\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Author name. /\n authorName?: string;\n /* Channel/team label. /\n channelLabel?: string;\n /* Message preview text. /\n previewText?: string;\n /* Timestamp label. /\n timestamp?: string;\n /* Number of replies. /\n replyCount?: number;\n /* Stacked avatars for recent participants. Pass `[]` to hide. When omitted, uses demo participants. /\n participants?: UserAvatarGroupItem[];\n /* Optional thread title. /\n threadTitle?: string;\n /* Optional CSS class name. /\n className?: string;\n /* Opens the thread. Sibling of the overflow menu for keyboard reachability. /\n onClick?: () => void;\n /* Thread overflow menu handler. /\n onMenuClick?: (event: MouseEvent<HTMLButtonElement>) => void;\n}\n\n/\n The Thread List Item is a single entry in the Threads view. Each row gives the user enough\n * context — who, where, what, when — to decide whether to open the thread without opening\n * it.\n */\nexport default function ThreadListItem({\n active = false,\n badge = 'none',\n mentionCount = 1,\n authorName = 'Martin Kraft',\n channelLabel = 'ENTERPRISE TEAM',\n previewText = 'Do we have a guideline for what minimum width we should support in the system console? I know that…',\n timestamp = '5 mins ago',\n replyCount = 3,\n participants: participantsProp,\n threadTitle,\n className = '',\n onClick,\n onMenuClick,\n}: ThreadListItemProps) {\n const participants =\n participantsProp === undefined ? DEFAULT_PARTICIPANTS : participantsProp;\n const showParticipants = participants.length > 0;\n const showGutterBadge =\n !active && (badge === 'unread' \|\| badge === 'mention');\n const replyLabel = replyCount === 1 ? '1 reply' : `${replyCount} replies`;\n\n const rootClass = [\n styles['thread-list-item'],\n active ? styles['thread-list-item--active'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const statusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'unread'\n : undefined;\n\n const handleMainClick = (event: MouseEvent<HTMLDivElement>) => {\n const selection = window.getSelection();\n if (\n selection?.type === 'Range' &&\n selection.toString().length > 0 &&\n event.currentTarget.contains(selection.getRangeAt(0).commonAncestorContainer)\n ) {\n return;\n }\n onClick?.();\n };\n\n const handleMainKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n event.preventDefault();\n onClick?.();\n };\n\n return (\n <div className={rootClass}>\n <div\n className={styles['thread-list-item__main']}\n role={onClick ? 'button' : undefined}\n tabIndex={onClick ? 0 : undefined}\n onClick={onClick ? handleMainClick : undefined}\n onKeyDown={onClick ? handleMainKeyDown : undefined}\n aria-current={active ? true : undefined}\n >\n <div className={styles['thread-list-item__thread']}>\n <div className={styles['thread-list-item__container']}>\n <div className={styles['thread-list-item__post-content']}>\n <div className={styles['thread-list-item__gutter']}>\n {showGutterBadge && badge === 'unread' && (\n <span\n className={styles['thread-list-item__unread-gutter']}\n aria-hidden\n >\n <UnreadBadge\n className={styles['thread-list-item__unread-badge']}\n context=\"icon-button\"\n />\n </span>\n )}\n {showGutterBadge && badge === 'mention' && (\n <span\n className={styles['thread-list-item__mention-gutter']}\n aria-hidden\n >\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n </div>\n <div className={styles['thread-list-item__post-body']}>\n <div className={styles['thread-list-item__post-body-content']}>\n <div className={styles['thread-list-item__name-row']}>\n <div className={styles['thread-list-item__name-group']}>\n <span className={styles['thread-list-item__author']}>\n {authorName}\n </span>\n <Tag casing=\"all-caps\" label={channelLabel} />\n {statusHint && (\n <span\n className={styles['thread-list-item__status-hint']}\n >\n {statusHint}\n </span>\n )}\n </div>\n <span className={styles['thread-list-item__timestamp']}>\n {timestamp}\n </span>\n </div>\n {threadTitle != null && (\n <div className={styles['thread-list-item__title-row']}>\n <p className={styles['thread-list-item__title']}>\n {threadTitle}\n </p>\n </div>\n )}\n <p className={styles['thread-list-item__preview']}>\n {previewText}\n </p>\n </div>\n </div>\n </div>\n <div className={styles['thread-list-item__replies']}>\n <div className={styles['thread-list-item__replies-inner']}>\n {showParticipants && (\n <UserAvatarGroup\n avatars={participants}\n className={styles['thread-list-item__avatar-group']}\n max={3}\n size=\"20\"\n />\n )}\n <span className={styles['thread-list-item__reply-count']}>\n {replyLabel}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n {onMenuClick && (\n <div className={styles['thread-list-item__actions']}>\n <span className={styles['thread-list-item__menu-button']}>\n <IconButton\n aria-label=\"Thread actions\"\n icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n padding=\"compact\"\n size=\"small\"\n style=\"default\"\n type=\"button\"\n onClick={(event) => {\n event.stopPropagation();\n onMenuClick(event);\n }}\n />\n </span>\n </div>\n )}\n </div>\n );\n}\n"],"names":["DEFAULT_PARTICIPANTS","ThreadListItem","active","badge","mentionCount","authorName","channelLabel","previewText","timestamp","replyCount","participantsProp","threadTitle","className","onClick","onMenuClick","participants","showParticipants","showGutterBadge","replyLabel","rootClass","styles","statusHint","handleMainClick","event","selection","handleMainKeyDown","jsxs","jsx","UnreadBadge","MentionBadge","Tag","UserAvatarGroup","IconButton","Icon","DotsHorizontalIcon"],"mappings":"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"}
1	+ {"version":3,"file":"ThreadListItem.cjs","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"sourcesContent":["import DotsHorizontalIcon from '@mattermost/compass-icons/components/dots-horizontal';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '../mention-badge/MentionBadge';\nimport UnreadBadge from '../unread-badge/UnreadBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '../user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadListItem.module.scss';\n\nconst DEFAULT_PARTICIPANTS: UserAvatarGroupItem[] = [\n { key: 'leonard', name: 'Leonard Riley' },\n { key: 'aiko', name: 'Aiko Tan' },\n { key: 'arjun', name: 'Arjun Patel' },\n { key: 'marco', name: 'Marco Rinaldi' },\n { key: 'sofia', name: 'Sofia Bauer' },\n];\n\nexport interface ThreadListItemProps {\n /** Whether this item is the active/selected thread. /\n active?: boolean;\n /* Badge in the left gutter. Default: None. Hidden when `active` is true. /\n badge?: 'none' \| 'unread' \| 'mention';\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Author name. /\n authorName?: string;\n /* Channel/team label. /\n channelLabel?: string;\n /* Message preview text. /\n previewText?: string;\n /* Timestamp label. /\n timestamp?: string;\n /* Number of replies. /\n replyCount?: number;\n /* Stacked avatars for recent participants. Pass `[]` to hide. When omitted, uses demo participants. /\n participants?: UserAvatarGroupItem[];\n /* Optional thread title. /\n threadTitle?: string;\n /* Optional CSS class name. /\n className?: string;\n /* Opens the thread. Sibling of the overflow menu for keyboard reachability. /\n onClick?: () => void;\n /* Thread overflow menu handler. /\n onMenuClick?: (event: MouseEvent<HTMLButtonElement>) => void;\n}\n\n/\n The Thread List Item is a single entry in the Threads view. Each row gives the user enough\n * context — who, where, what, when — to decide whether to open the thread without opening\n * it.\n */\nexport default function ThreadListItem({\n active = false,\n badge = 'none',\n mentionCount = 1,\n authorName = 'Martin Kraft',\n channelLabel = 'ENTERPRISE TEAM',\n previewText = 'Do we have a guideline for what minimum width we should support in the system console? I know that…',\n timestamp = '5 mins ago',\n replyCount = 3,\n participants: participantsProp,\n threadTitle,\n className = '',\n onClick,\n onMenuClick,\n}: ThreadListItemProps) {\n const participants =\n participantsProp === undefined ? DEFAULT_PARTICIPANTS : participantsProp;\n const showParticipants = participants.length > 0;\n const showGutterBadge =\n !active && (badge === 'unread' \|\| badge === 'mention');\n const replyLabel = replyCount === 1 ? '1 reply' : `${replyCount} replies`;\n\n const rootClass = [\n styles['thread-list-item'],\n active ? styles['thread-list-item--active'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const statusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'unread'\n : undefined;\n\n const handleMainClick = (event: MouseEvent<HTMLDivElement>) => {\n const selection = window.getSelection();\n if (\n selection?.type === 'Range' &&\n selection.toString().length > 0 &&\n event.currentTarget.contains(\n selection.getRangeAt(0).commonAncestorContainer,\n )\n ) {\n return;\n }\n onClick?.();\n };\n\n const handleMainKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n event.preventDefault();\n onClick?.();\n };\n\n return (\n <div className={rootClass}>\n <div\n className={styles['thread-list-item__main']}\n role={onClick ? 'button' : undefined}\n tabIndex={onClick ? 0 : undefined}\n onClick={onClick ? handleMainClick : undefined}\n onKeyDown={onClick ? handleMainKeyDown : undefined}\n aria-current={active ? true : undefined}\n >\n <div className={styles['thread-list-item__thread']}>\n <div className={styles['thread-list-item__container']}>\n <div className={styles['thread-list-item__post-content']}>\n <div className={styles['thread-list-item__gutter']}>\n {showGutterBadge && badge === 'unread' && (\n <span\n className={styles['thread-list-item__unread-gutter']}\n aria-hidden\n >\n <UnreadBadge\n className={styles['thread-list-item__unread-badge']}\n context=\"icon-button\"\n />\n </span>\n )}\n {showGutterBadge && badge === 'mention' && (\n <span\n className={styles['thread-list-item__mention-gutter']}\n aria-hidden\n >\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n </div>\n <div className={styles['thread-list-item__post-body']}>\n <div className={styles['thread-list-item__post-body-content']}>\n <div className={styles['thread-list-item__name-row']}>\n <div className={styles['thread-list-item__name-group']}>\n <span className={styles['thread-list-item__author']}>\n {authorName}\n </span>\n <Tag casing=\"all-caps\" label={channelLabel} />\n {statusHint && (\n <span\n className={styles['thread-list-item__status-hint']}\n >\n {statusHint}\n </span>\n )}\n </div>\n <span className={styles['thread-list-item__timestamp']}>\n {timestamp}\n </span>\n </div>\n {threadTitle != null && (\n <div className={styles['thread-list-item__title-row']}>\n <p className={styles['thread-list-item__title']}>\n {threadTitle}\n </p>\n </div>\n )}\n <p className={styles['thread-list-item__preview']}>\n {previewText}\n </p>\n </div>\n </div>\n </div>\n <div className={styles['thread-list-item__replies']}>\n <div className={styles['thread-list-item__replies-inner']}>\n {showParticipants && (\n <UserAvatarGroup\n avatars={participants}\n className={styles['thread-list-item__avatar-group']}\n max={3}\n size=\"20\"\n />\n )}\n <span className={styles['thread-list-item__reply-count']}>\n {replyLabel}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n {onMenuClick && (\n <div className={styles['thread-list-item__actions']}>\n <span className={styles['thread-list-item__menu-button']}>\n <IconButton\n aria-label=\"Thread actions\"\n icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n padding=\"compact\"\n size=\"small\"\n style=\"default\"\n type=\"button\"\n onClick={(event) => {\n event.stopPropagation();\n onMenuClick(event);\n }}\n />\n </span>\n </div>\n )}\n </div>\n );\n}\n"],"names":["DEFAULT_PARTICIPANTS","ThreadListItem","active","badge","mentionCount","authorName","channelLabel","previewText","timestamp","replyCount","participantsProp","threadTitle","className","onClick","onMenuClick","participants","showParticipants","showGutterBadge","replyLabel","rootClass","styles","statusHint","handleMainClick","event","selection","handleMainKeyDown","jsxs","jsx","UnreadBadge","MentionBadge","Tag","UserAvatarGroup","IconButton","Icon","DotsHorizontalIcon"],"mappings":"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"}

package/dist/components/thread-list-item/ThreadListItem.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThreadListItem.d.ts","sourceRoot":"","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,UAAU,EAAE,MAAM,OAAO,CAAC;AAMvD,OAAwB,EACtB,KAAK,mBAAmB,EACzB,MAAM,oCAAoC,CAAC;AAW5C,MAAM,WAAW,mBAAmB;IAClC,uDAAuD;IACvD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;IACtC,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0BAA0B;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4BAA4B;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wGAAwG;IACxG,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gFAAgF;IAChF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oCAAoC;IACpC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAC9D;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,MAAc,EACd,KAAc,EACd,YAAgB,EAChB,UAA2B,EAC3B,YAAgC,EAChC,WAAmH,EACnH,SAAwB,EACxB,UAAc,EACd,YAAY,EAAE,gBAAgB,EAC9B,WAAW,EACX,SAAc,EACd,OAAO,EACP,WAAW,GACZ,EAAE,mBAAmB,~~2CAwJrB~~"}
1	+ {"version":3,"file":"ThreadListItem.d.ts","sourceRoot":"","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,UAAU,EAAE,MAAM,OAAO,CAAC;AAMvD,OAAwB,EACtB,KAAK,mBAAmB,EACzB,MAAM,oCAAoC,CAAC;AAW5C,MAAM,WAAW,mBAAmB;IAClC,uDAAuD;IACvD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;IACtC,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0BAA0B;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4BAA4B;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wGAAwG;IACxG,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gFAAgF;IAChF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oCAAoC;IACpC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAC9D;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,MAAc,EACd,KAAc,EACd,YAAgB,EAChB,UAA2B,EAC3B,YAAgC,EAChC,WAAmH,EACnH,SAAwB,EACxB,UAAc,EACd,YAAY,EAAE,gBAAgB,EAC9B,WAAW,EACX,SAAc,EACd,OAAO,EACP,WAAW,GACZ,EAAE,mBAAmB,2CA0JrB"}

package/dist/components/thread-list-item/ThreadListItem.js CHANGED Viewed

@@ -35,7 +35,9 @@ function q({
     g
   ].filter(Boolean).join(" "), u = r === "mention" ? `${d} mention${d === 1 ? "" : "s"}` : r === "unread" ? "unread" : void 0, T = (i) => {
     const n = window.getSelection();
-    (n == null ? void 0 : n.type) === "Range" && n.toString().length > 0 && i.currentTarget.contains(n.getRangeAt(0).commonAncestorContainer) || a == null || a();
+    (n == null ? void 0 : n.type) === "Range" && n.toString().length > 0 && i.currentTarget.contains(
+      n.getRangeAt(0).commonAncestorContainer
+    ) || a == null || a();
   }, R = (i) => {
     i.key !== "Enter" && i.key !== " " || (i.preventDefault(), a == null || a());
   };

package/dist/components/thread-list-item/ThreadListItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThreadListItem.js","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"sourcesContent":["import DotsHorizontalIcon from '@mattermost/compass-icons/components/dots-horizontal';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '../mention-badge/MentionBadge';\nimport UnreadBadge from '../unread-badge/UnreadBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '../user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadListItem.module.scss';\n\nconst DEFAULT_PARTICIPANTS: UserAvatarGroupItem[] = [\n { key: 'leonard', name: 'Leonard Riley' },\n { key: 'aiko', name: 'Aiko Tan' },\n { key: 'arjun', name: 'Arjun Patel' },\n { key: 'marco', name: 'Marco Rinaldi' },\n { key: 'sofia', name: 'Sofia Bauer' },\n];\n\nexport interface ThreadListItemProps {\n /** Whether this item is the active/selected thread. /\n active?: boolean;\n /* Badge in the left gutter. Default: None. Hidden when `active` is true. /\n badge?: 'none' \| 'unread' \| 'mention';\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Author name. /\n authorName?: string;\n /* Channel/team label. /\n channelLabel?: string;\n /* Message preview text. /\n previewText?: string;\n /* Timestamp label. /\n timestamp?: string;\n /* Number of replies. /\n replyCount?: number;\n /* Stacked avatars for recent participants. Pass `[]` to hide. When omitted, uses demo participants. /\n participants?: UserAvatarGroupItem[];\n /* Optional thread title. /\n threadTitle?: string;\n /* Optional CSS class name. /\n className?: string;\n /* Opens the thread. Sibling of the overflow menu for keyboard reachability. /\n onClick?: () => void;\n /* Thread overflow menu handler. /\n onMenuClick?: (event: MouseEvent<HTMLButtonElement>) => void;\n}\n\n/\n The Thread List Item is a single entry in the Threads view. Each row gives the user enough\n * context — who, where, what, when — to decide whether to open the thread without opening\n * it.\n */\nexport default function ThreadListItem({\n active = false,\n badge = 'none',\n mentionCount = 1,\n authorName = 'Martin Kraft',\n channelLabel = 'ENTERPRISE TEAM',\n previewText = 'Do we have a guideline for what minimum width we should support in the system console? I know that…',\n timestamp = '5 mins ago',\n replyCount = 3,\n participants: participantsProp,\n threadTitle,\n className = '',\n onClick,\n onMenuClick,\n}: ThreadListItemProps) {\n const participants =\n participantsProp === undefined ? DEFAULT_PARTICIPANTS : participantsProp;\n const showParticipants = participants.length > 0;\n const showGutterBadge =\n !active && (badge === 'unread' \|\| badge === 'mention');\n const replyLabel = replyCount === 1 ? '1 reply' : `${replyCount} replies`;\n\n const rootClass = [\n styles['thread-list-item'],\n active ? styles['thread-list-item--active'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const statusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'unread'\n : undefined;\n\n const handleMainClick = (event: MouseEvent<HTMLDivElement>) => {\n const selection = window.getSelection();\n if (\n selection?.type === 'Range' &&\n selection.toString().length > 0 &&\n event.currentTarget.contains(selection.getRangeAt(0).commonAncestorContainer)\n ) {\n return;\n }\n onClick?.();\n };\n\n const handleMainKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n event.preventDefault();\n onClick?.();\n };\n\n return (\n <div className={rootClass}>\n <div\n className={styles['thread-list-item__main']}\n role={onClick ? 'button' : undefined}\n tabIndex={onClick ? 0 : undefined}\n onClick={onClick ? handleMainClick : undefined}\n onKeyDown={onClick ? handleMainKeyDown : undefined}\n aria-current={active ? true : undefined}\n >\n <div className={styles['thread-list-item__thread']}>\n <div className={styles['thread-list-item__container']}>\n <div className={styles['thread-list-item__post-content']}>\n <div className={styles['thread-list-item__gutter']}>\n {showGutterBadge && badge === 'unread' && (\n <span\n className={styles['thread-list-item__unread-gutter']}\n aria-hidden\n >\n <UnreadBadge\n className={styles['thread-list-item__unread-badge']}\n context=\"icon-button\"\n />\n </span>\n )}\n {showGutterBadge && badge === 'mention' && (\n <span\n className={styles['thread-list-item__mention-gutter']}\n aria-hidden\n >\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n </div>\n <div className={styles['thread-list-item__post-body']}>\n <div className={styles['thread-list-item__post-body-content']}>\n <div className={styles['thread-list-item__name-row']}>\n <div className={styles['thread-list-item__name-group']}>\n <span className={styles['thread-list-item__author']}>\n {authorName}\n </span>\n <Tag casing=\"all-caps\" label={channelLabel} />\n {statusHint && (\n <span\n className={styles['thread-list-item__status-hint']}\n >\n {statusHint}\n </span>\n )}\n </div>\n <span className={styles['thread-list-item__timestamp']}>\n {timestamp}\n </span>\n </div>\n {threadTitle != null && (\n <div className={styles['thread-list-item__title-row']}>\n <p className={styles['thread-list-item__title']}>\n {threadTitle}\n </p>\n </div>\n )}\n <p className={styles['thread-list-item__preview']}>\n {previewText}\n </p>\n </div>\n </div>\n </div>\n <div className={styles['thread-list-item__replies']}>\n <div className={styles['thread-list-item__replies-inner']}>\n {showParticipants && (\n <UserAvatarGroup\n avatars={participants}\n className={styles['thread-list-item__avatar-group']}\n max={3}\n size=\"20\"\n />\n )}\n <span className={styles['thread-list-item__reply-count']}>\n {replyLabel}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n {onMenuClick && (\n <div className={styles['thread-list-item__actions']}>\n <span className={styles['thread-list-item__menu-button']}>\n <IconButton\n aria-label=\"Thread actions\"\n icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n padding=\"compact\"\n size=\"small\"\n style=\"default\"\n type=\"button\"\n onClick={(event) => {\n event.stopPropagation();\n onMenuClick(event);\n }}\n />\n </span>\n </div>\n )}\n </div>\n );\n}\n"],"names":["DEFAULT_PARTICIPANTS","ThreadListItem","active","badge","mentionCount","authorName","channelLabel","previewText","timestamp","replyCount","participantsProp","threadTitle","className","onClick","onMenuClick","participants","showParticipants","showGutterBadge","replyLabel","rootClass","styles","statusHint","handleMainClick","event","selection","handleMainKeyDown","jsxs","jsx","UnreadBadge","MentionBadge","Tag","UserAvatarGroup","IconButton","Icon","DotsHorizontalIcon"],"mappings":"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"}
1	+ {"version":3,"file":"ThreadListItem.js","sources":["../../../src/components/thread-list-item/ThreadListItem.tsx"],"sourcesContent":["import DotsHorizontalIcon from '@mattermost/compass-icons/components/dots-horizontal';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '../mention-badge/MentionBadge';\nimport UnreadBadge from '../unread-badge/UnreadBadge';\nimport UserAvatarGroup, {\n type UserAvatarGroupItem,\n} from '../user-avatar-group/UserAvatarGroup';\nimport styles from './ThreadListItem.module.scss';\n\nconst DEFAULT_PARTICIPANTS: UserAvatarGroupItem[] = [\n { key: 'leonard', name: 'Leonard Riley' },\n { key: 'aiko', name: 'Aiko Tan' },\n { key: 'arjun', name: 'Arjun Patel' },\n { key: 'marco', name: 'Marco Rinaldi' },\n { key: 'sofia', name: 'Sofia Bauer' },\n];\n\nexport interface ThreadListItemProps {\n /** Whether this item is the active/selected thread. /\n active?: boolean;\n /* Badge in the left gutter. Default: None. Hidden when `active` is true. /\n badge?: 'none' \| 'unread' \| 'mention';\n /* Shown when `badge` is Mention. Default: 1. /\n mentionCount?: number;\n /* Author name. /\n authorName?: string;\n /* Channel/team label. /\n channelLabel?: string;\n /* Message preview text. /\n previewText?: string;\n /* Timestamp label. /\n timestamp?: string;\n /* Number of replies. /\n replyCount?: number;\n /* Stacked avatars for recent participants. Pass `[]` to hide. When omitted, uses demo participants. /\n participants?: UserAvatarGroupItem[];\n /* Optional thread title. /\n threadTitle?: string;\n /* Optional CSS class name. /\n className?: string;\n /* Opens the thread. Sibling of the overflow menu for keyboard reachability. /\n onClick?: () => void;\n /* Thread overflow menu handler. /\n onMenuClick?: (event: MouseEvent<HTMLButtonElement>) => void;\n}\n\n/\n The Thread List Item is a single entry in the Threads view. Each row gives the user enough\n * context — who, where, what, when — to decide whether to open the thread without opening\n * it.\n */\nexport default function ThreadListItem({\n active = false,\n badge = 'none',\n mentionCount = 1,\n authorName = 'Martin Kraft',\n channelLabel = 'ENTERPRISE TEAM',\n previewText = 'Do we have a guideline for what minimum width we should support in the system console? I know that…',\n timestamp = '5 mins ago',\n replyCount = 3,\n participants: participantsProp,\n threadTitle,\n className = '',\n onClick,\n onMenuClick,\n}: ThreadListItemProps) {\n const participants =\n participantsProp === undefined ? DEFAULT_PARTICIPANTS : participantsProp;\n const showParticipants = participants.length > 0;\n const showGutterBadge =\n !active && (badge === 'unread' \|\| badge === 'mention');\n const replyLabel = replyCount === 1 ? '1 reply' : `${replyCount} replies`;\n\n const rootClass = [\n styles['thread-list-item'],\n active ? styles['thread-list-item--active'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const statusHint =\n badge === 'mention'\n ? `${mentionCount} mention${mentionCount === 1 ? '' : 's'}`\n : badge === 'unread'\n ? 'unread'\n : undefined;\n\n const handleMainClick = (event: MouseEvent<HTMLDivElement>) => {\n const selection = window.getSelection();\n if (\n selection?.type === 'Range' &&\n selection.toString().length > 0 &&\n event.currentTarget.contains(\n selection.getRangeAt(0).commonAncestorContainer,\n )\n ) {\n return;\n }\n onClick?.();\n };\n\n const handleMainKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n event.preventDefault();\n onClick?.();\n };\n\n return (\n <div className={rootClass}>\n <div\n className={styles['thread-list-item__main']}\n role={onClick ? 'button' : undefined}\n tabIndex={onClick ? 0 : undefined}\n onClick={onClick ? handleMainClick : undefined}\n onKeyDown={onClick ? handleMainKeyDown : undefined}\n aria-current={active ? true : undefined}\n >\n <div className={styles['thread-list-item__thread']}>\n <div className={styles['thread-list-item__container']}>\n <div className={styles['thread-list-item__post-content']}>\n <div className={styles['thread-list-item__gutter']}>\n {showGutterBadge && badge === 'unread' && (\n <span\n className={styles['thread-list-item__unread-gutter']}\n aria-hidden\n >\n <UnreadBadge\n className={styles['thread-list-item__unread-badge']}\n context=\"icon-button\"\n />\n </span>\n )}\n {showGutterBadge && badge === 'mention' && (\n <span\n className={styles['thread-list-item__mention-gutter']}\n aria-hidden\n >\n <MentionBadge\n count={mentionCount}\n location=\"channel\"\n size=\"medium\"\n />\n </span>\n )}\n </div>\n <div className={styles['thread-list-item__post-body']}>\n <div className={styles['thread-list-item__post-body-content']}>\n <div className={styles['thread-list-item__name-row']}>\n <div className={styles['thread-list-item__name-group']}>\n <span className={styles['thread-list-item__author']}>\n {authorName}\n </span>\n <Tag casing=\"all-caps\" label={channelLabel} />\n {statusHint && (\n <span\n className={styles['thread-list-item__status-hint']}\n >\n {statusHint}\n </span>\n )}\n </div>\n <span className={styles['thread-list-item__timestamp']}>\n {timestamp}\n </span>\n </div>\n {threadTitle != null && (\n <div className={styles['thread-list-item__title-row']}>\n <p className={styles['thread-list-item__title']}>\n {threadTitle}\n </p>\n </div>\n )}\n <p className={styles['thread-list-item__preview']}>\n {previewText}\n </p>\n </div>\n </div>\n </div>\n <div className={styles['thread-list-item__replies']}>\n <div className={styles['thread-list-item__replies-inner']}>\n {showParticipants && (\n <UserAvatarGroup\n avatars={participants}\n className={styles['thread-list-item__avatar-group']}\n max={3}\n size=\"20\"\n />\n )}\n <span className={styles['thread-list-item__reply-count']}>\n {replyLabel}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n {onMenuClick && (\n <div className={styles['thread-list-item__actions']}>\n <span className={styles['thread-list-item__menu-button']}>\n <IconButton\n aria-label=\"Thread actions\"\n icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n padding=\"compact\"\n size=\"small\"\n style=\"default\"\n type=\"button\"\n onClick={(event) => {\n event.stopPropagation();\n onMenuClick(event);\n }}\n />\n </span>\n </div>\n )}\n </div>\n );\n}\n"],"names":["DEFAULT_PARTICIPANTS","ThreadListItem","active","badge","mentionCount","authorName","channelLabel","previewText","timestamp","replyCount","participantsProp","threadTitle","className","onClick","onMenuClick","participants","showParticipants","showGutterBadge","replyLabel","rootClass","styles","statusHint","handleMainClick","event","selection","handleMainKeyDown","jsxs","jsx","UnreadBadge","MentionBadge","Tag","UserAvatarGroup","IconButton","Icon","DotsHorizontalIcon"],"mappings":"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"}

package/dist/components/toast/Toast.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.cjs","sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport styles from './Toast.module.scss';\n\nexport type ToastType ~~=\n \|~~ 'general'\n \| 'info'\n \| 'success'\n \| 'warning'\n \| 'danger';\n\nexport interface ToastProps {\n className?: string;\n message: ~~string~~;\n type?: ToastType;\n /** Optional icon override — pass `<Icon glyph={<SomeIcon />} />`; replaces the default type icon. Toast provides the correct size via context. /\n icon?: ReactNode;\n actionLabel?: ~~string~~;\n onAction?: () => void;\n onDismiss?: () => void;\n}\n\nconst TYPE_ICONS: Record<ToastType, ReactNode> = {\n general: <AlertCircleOutlineIcon />,\n info: <InformationOutlineIcon />,\n success: <CheckIcon />,\n danger: <AlertOutlineIcon />,\n warning: <AlertCircleOutlineIcon />,\n};\n\n/\n Toasts notify the user that an action has completed or surface a brief message about a\n * system process. They sit on top of the workflow without interrupting it, don't require\n * user input to disappear, and auto-dismiss after a short duration.\n */\nexport default function Toast({\n className = '',\n message,\n type = 'general',\n icon,\n actionLabel,\n onAction,\n onDismiss,\n}: ToastProps) {\n const typeClass = styles[`toast--type-${type.toLowerCase()}`];\n const noDismissClass = onDismiss == null ? styles['toast--no-dismiss'] : '';\n const rootClass = [styles.toast, typeClass, noDismissClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} role=\"status\" aria-live=\"polite\">\n <div className={styles['toast__content']}>\n <span className={styles['toast__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon ?? <Icon glyph={TYPE_ICONS[type]} />}\n </IconSlotContext.Provider>\n </span>\n <span className={styles['toast__message']}>{message}</span>\n {actionLabel != null && (\n <Button\n appearance=\"default\"\n emphasis=\"tertiary\"\n size=\"x-small\"\n className={styles['toast__action-btn--on-dark']}\n onClick={onAction}\n >\n {actionLabel}\n </Button>\n )}\n </div>\n {onDismiss != null && (\n <IconButton\n aria-label=\"Dismiss\"\n size=\"small\"\n className={styles['toast__dismiss']}\n icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n onClick={onDismiss}\n />\n )}\n </div>\n );\n}\n"],"names":["TYPE_ICONS","AlertCircleOutlineIcon","InformationOutlineIcon","CheckIcon","AlertOutlineIcon","Toast","className","message","type","icon","actionLabel","onAction","onDismiss","typeClass","styles","noDismissClass","rootClass","jsxs","jsx","IconSlotContext","Icon","Button","IconButton","CloseIcon"],"mappings":"~~6lBA8BMA~~,EAA2C,CAC/C,cAAUC,EAAA,EAAuB,EACjC,WAAOC,EAAA,EAAuB,EAC9B,cAAUC,EAAA,EAAU,EACpB,aAASC,EAAA,EAAiB,EAC1B,cAAUH,EAAA,CAAA,CAAuB,CACnC,EAOA,SAAwBI,EAAM,CAC5B,UAAAC,EAAY,GACZ,QAAAC,EACA,KAAAC,EAAO,UACP,KAAAC,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAAe,CACb,MAAMC,EAAYC,EAAAA,QAAO,eAAeN,EAAK,YAAA,CAAa,EAAE,EACtDO,EAAiBH,GAAa,KAAOE,EAAAA,QAAO,mBAAmB,EAAI,GACnEE,EAAY,CAACF,UAAO,MAAOD,EAAWE,EAAgBT,CAAS,EAClE,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,cACG,MAAA,CAAI,UAAWU,EAAW,KAAK,SAAS,YAAU,SACjD,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWH,EAAAA,QAAO,eACrB,SAAA,CAAAI,EAAAA,IAAC,OAAA,CAAK,UAAWJ,EAAAA,QAAO,YAAgB,cAAW,GACjD,SAAAI,EAAAA,IAACC,EAAAA,gBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,SAAAV,GAAQS,EAAAA,IAACE,EAAAA,QAAA,CAAK,MAAOpB,EAAWQ,CAAI,CAAA,CAAG,CAAA,CAC1C,CAAA,CACF,QACC,OAAA,CAAK,UAAWM,EAAAA,QAAO,eAAoB,SAAAP,EAAQ,EACnDG,GAAe,MACdQ,EAAAA,IAACG,EAAAA,QAAA,CACC,WAAW,UACX,SAAS,WACT,KAAK,UACL,UAAWP,EAAAA,QAAO,4BAA4B,EAC9C,QAASH,EAER,SAAAD,CAAA,CAAA,CACH,EAEJ,EACCE,GAAa,MACZM,EAAAA,IAACI,EAAAA,QAAA,CACC,aAAW,UACX,KAAK,QACL,UAAWR,EAAAA,QAAO,eAClB,WAAOM,UAAA,CAAK,YAAQG,EAAA,EAAU,EAAI,KAAK,KAAK,EAC5C,QAASX,CAAA,CAAA,CACX,EAEJ,CAEJ"}
1	+ {"version":3,"file":"Toast.cjs","sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport styles from './Toast.module.scss';\n\nexport type ToastType = 'general' \| 'info' \| 'success' \| 'warning' \| 'danger';\n\nexport interface ToastProps {\n className?: string;\n /** Toast message. Accepts translated nodes (e.g. `<FormattedMessage/>`). /\n message: ReactNode;\n type?: ToastType;\n /* Optional icon override — pass `<Icon glyph={<SomeIcon />} />`; replaces the default type icon. Toast provides the correct size via context. /\n icon?: ReactNode;\n actionLabel?: ReactNode;\n onAction?: () => void;\n onDismiss?: () => void;\n}\n\nconst TYPE_ICONS: Record<ToastType, ReactNode> = {\n general: <AlertCircleOutlineIcon />,\n info: <InformationOutlineIcon />,\n success: <CheckIcon />,\n danger: <AlertOutlineIcon />,\n warning: <AlertCircleOutlineIcon />,\n};\n\n/\n Toasts notify the user that an action has completed or surface a brief message about a\n * system process. They sit on top of the workflow without interrupting it, don't require\n * user input to disappear, and auto-dismiss after a short duration.\n */\nexport default function Toast({\n className = '',\n message,\n type = 'general',\n icon,\n actionLabel,\n onAction,\n onDismiss,\n}: ToastProps) {\n const typeClass = styles[`toast--type-${type.toLowerCase()}`];\n const noDismissClass = onDismiss == null ? styles['toast--no-dismiss'] : '';\n const rootClass = [styles.toast, typeClass, noDismissClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} role=\"status\" aria-live=\"polite\">\n <div className={styles['toast__content']}>\n <span className={styles['toast__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon ?? <Icon glyph={TYPE_ICONS[type]} />}\n </IconSlotContext.Provider>\n </span>\n <span className={styles['toast__message']}>{message}</span>\n {actionLabel != null && (\n <Button\n appearance=\"default\"\n emphasis=\"tertiary\"\n size=\"x-small\"\n className={styles['toast__action-btn--on-dark']}\n onClick={onAction}\n >\n {actionLabel}\n </Button>\n )}\n </div>\n {onDismiss != null && (\n <IconButton\n aria-label=\"Dismiss\"\n size=\"small\"\n className={styles['toast__dismiss']}\n icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n onClick={onDismiss}\n />\n )}\n </div>\n );\n}\n"],"names":["TYPE_ICONS","AlertCircleOutlineIcon","InformationOutlineIcon","CheckIcon","AlertOutlineIcon","Toast","className","message","type","icon","actionLabel","onAction","onDismiss","typeClass","styles","noDismissClass","rootClass","jsxs","jsx","IconSlotContext","Icon","Button","IconButton","CloseIcon"],"mappings":"6lBA0BMA,EAA2C,CAC/C,cAAUC,EAAA,EAAuB,EACjC,WAAOC,EAAA,EAAuB,EAC9B,cAAUC,EAAA,EAAU,EACpB,aAASC,EAAA,EAAiB,EAC1B,cAAUH,EAAA,CAAA,CAAuB,CACnC,EAOA,SAAwBI,EAAM,CAC5B,UAAAC,EAAY,GACZ,QAAAC,EACA,KAAAC,EAAO,UACP,KAAAC,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAAe,CACb,MAAMC,EAAYC,EAAAA,QAAO,eAAeN,EAAK,YAAA,CAAa,EAAE,EACtDO,EAAiBH,GAAa,KAAOE,EAAAA,QAAO,mBAAmB,EAAI,GACnEE,EAAY,CAACF,UAAO,MAAOD,EAAWE,EAAgBT,CAAS,EAClE,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,cACG,MAAA,CAAI,UAAWU,EAAW,KAAK,SAAS,YAAU,SACjD,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWH,EAAAA,QAAO,eACrB,SAAA,CAAAI,EAAAA,IAAC,OAAA,CAAK,UAAWJ,EAAAA,QAAO,YAAgB,cAAW,GACjD,SAAAI,EAAAA,IAACC,EAAAA,gBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,SAAAV,GAAQS,EAAAA,IAACE,EAAAA,QAAA,CAAK,MAAOpB,EAAWQ,CAAI,CAAA,CAAG,CAAA,CAC1C,CAAA,CACF,QACC,OAAA,CAAK,UAAWM,EAAAA,QAAO,eAAoB,SAAAP,EAAQ,EACnDG,GAAe,MACdQ,EAAAA,IAACG,EAAAA,QAAA,CACC,WAAW,UACX,SAAS,WACT,KAAK,UACL,UAAWP,EAAAA,QAAO,4BAA4B,EAC9C,QAASH,EAER,SAAAD,CAAA,CAAA,CACH,EAEJ,EACCE,GAAa,MACZM,EAAAA,IAACI,EAAAA,QAAA,CACC,aAAW,UACX,KAAK,QACL,UAAWR,EAAAA,QAAO,eAClB,WAAOM,UAAA,CAAK,YAAQG,EAAA,EAAU,EAAI,KAAK,KAAK,EAC5C,QAASX,CAAA,CAAA,CACX,EAEJ,CAEJ"}

package/dist/components/toast/Toast.d.ts CHANGED Viewed

@@ -2,11 +2,12 @@ import { ReactNode } from 'react';
 export type ToastType = 'general' | 'info' | 'success' | 'warning' | 'danger';
 export interface ToastProps {
     className?: string;
-    message: string;
+    /** Toast message. Accepts translated nodes (e.g. `<FormattedMessage/>`). */
+    message: ReactNode;
     type?: ToastType;
     /** Optional icon override — pass `<Icon glyph={<SomeIcon />} />`; replaces the default type icon. Toast provides the correct size via context. */
     icon?: ReactNode;
-    actionLabel?: string;
+    actionLabel?: ReactNode;
     onAction?: () => void;
     onDismiss?: () => void;
 }

package/dist/components/toast/Toast.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/components/toast/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,MAAM,MAAM,SAAS,~~GACjB~~,SAAS,~~GACT~~,MAAM,~~GACN~~,SAAS,~~GACT~~,SAAS,~~GACT~~,QAAQ,CAAC;~~AAEb~~,MAAM,WAAW,UAAU;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,~~MAAM~~,CAAC;~~IAChB~~,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kJAAkJ;IAClJ,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,~~MAAM~~,CAAC;~~IACrB~~,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAUD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,SAAc,EACd,OAAO,EACP,IAAgB,EAChB,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,UAAU,2CAuCZ"}
1	+ {"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/components/toast/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE9E,MAAM,WAAW,UAAU;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4EAA4E;IAC5E,OAAO,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kJAAkJ;IAClJ,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAUD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,SAAc,EACd,OAAO,EACP,IAAgB,EAChB,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,UAAU,2CAuCZ"}

package/dist/components/toast/Toast.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.js","sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport styles from './Toast.module.scss';\n\nexport type ToastType ~~=\n \|~~ 'general'\n \| 'info'\n \| 'success'\n \| 'warning'\n \| 'danger';\n\nexport interface ToastProps {\n className?: string;\n message: ~~string~~;\n type?: ToastType;\n /** Optional icon override — pass `<Icon glyph={<SomeIcon />} />`; replaces the default type icon. Toast provides the correct size via context. /\n icon?: ReactNode;\n actionLabel?: ~~string~~;\n onAction?: () => void;\n onDismiss?: () => void;\n}\n\nconst TYPE_ICONS: Record<ToastType, ReactNode> = {\n general: <AlertCircleOutlineIcon />,\n info: <InformationOutlineIcon />,\n success: <CheckIcon />,\n danger: <AlertOutlineIcon />,\n warning: <AlertCircleOutlineIcon />,\n};\n\n/\n Toasts notify the user that an action has completed or surface a brief message about a\n * system process. They sit on top of the workflow without interrupting it, don't require\n * user input to disappear, and auto-dismiss after a short duration.\n */\nexport default function Toast({\n className = '',\n message,\n type = 'general',\n icon,\n actionLabel,\n onAction,\n onDismiss,\n}: ToastProps) {\n const typeClass = styles[`toast--type-${type.toLowerCase()}`];\n const noDismissClass = onDismiss == null ? styles['toast--no-dismiss'] : '';\n const rootClass = [styles.toast, typeClass, noDismissClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} role=\"status\" aria-live=\"polite\">\n <div className={styles['toast__content']}>\n <span className={styles['toast__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon ?? <Icon glyph={TYPE_ICONS[type]} />}\n </IconSlotContext.Provider>\n </span>\n <span className={styles['toast__message']}>{message}</span>\n {actionLabel != null && (\n <Button\n appearance=\"default\"\n emphasis=\"tertiary\"\n size=\"x-small\"\n className={styles['toast__action-btn--on-dark']}\n onClick={onAction}\n >\n {actionLabel}\n </Button>\n )}\n </div>\n {onDismiss != null && (\n <IconButton\n aria-label=\"Dismiss\"\n size=\"small\"\n className={styles['toast__dismiss']}\n icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n onClick={onDismiss}\n />\n )}\n </div>\n );\n}\n"],"names":["TYPE_ICONS","AlertCircleOutlineIcon","InformationOutlineIcon","CheckIcon","AlertOutlineIcon","Toast","className","message","type","icon","actionLabel","onAction","onDismiss","typeClass","styles","noDismissClass","rootClass","jsxs","jsx","IconSlotContext","Icon","Button","IconButton","CloseIcon"],"mappings":";;;;;;;;;;~~AA8BA~~,MAAMA,IAA2C;AAAA,EAC/C,2BAAUC,GAAA,EAAuB;AAAA,EACjC,wBAAOC,GAAA,EAAuB;AAAA,EAC9B,2BAAUC,GAAA,EAAU;AAAA,EACpB,0BAASC,GAAA,EAAiB;AAAA,EAC1B,2BAAUH,GAAA,CAAA,CAAuB;AACnC;AAOA,SAAwBI,EAAM;AAAA,EAC5B,WAAAC,IAAY;AAAA,EACZ,SAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AACb,QAAMC,IAAYC,EAAO,eAAeN,EAAK,YAAA,CAAa,EAAE,GACtDO,IAAiBH,KAAa,OAAOE,EAAO,mBAAmB,IAAI,IACnEE,IAAY,CAACF,EAAO,OAAOD,GAAWE,GAAgBT,CAAS,EAClE,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,2BACG,OAAA,EAAI,WAAWU,GAAW,MAAK,UAAS,aAAU,UACjD,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWH,EAAO,gBACrB,UAAA;AAAA,MAAA,gBAAAI,EAAC,QAAA,EAAK,WAAWJ,EAAO,aAAgB,eAAW,IACjD,UAAA,gBAAAI,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAM,KAAA,GACtC,UAAAV,KAAQ,gBAAAS,EAACE,GAAA,EAAK,OAAOpB,EAAWQ,CAAI,EAAA,CAAG,EAAA,CAC1C,EAAA,CACF;AAAA,wBACC,QAAA,EAAK,WAAWM,EAAO,gBAAoB,UAAAP,GAAQ;AAAA,MACnDG,KAAe,QACd,gBAAAQ;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,YAAW;AAAA,UACX,UAAS;AAAA,UACT,MAAK;AAAA,UACL,WAAWP,EAAO,4BAA4B;AAAA,UAC9C,SAASH;AAAA,UAER,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,IACCE,KAAa,QACZ,gBAAAM;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,WAAWR,EAAO;AAAA,QAClB,wBAAOM,GAAA,EAAK,yBAAQG,GAAA,EAAU,GAAI,MAAK,MAAK;AAAA,QAC5C,SAASX;AAAA,MAAA;AAAA,IAAA;AAAA,EACX,GAEJ;AAEJ;"}
1	+ {"version":3,"file":"Toast.js","sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport styles from './Toast.module.scss';\n\nexport type ToastType = 'general' \| 'info' \| 'success' \| 'warning' \| 'danger';\n\nexport interface ToastProps {\n className?: string;\n /** Toast message. Accepts translated nodes (e.g. `<FormattedMessage/>`). /\n message: ReactNode;\n type?: ToastType;\n /* Optional icon override — pass `<Icon glyph={<SomeIcon />} />`; replaces the default type icon. Toast provides the correct size via context. /\n icon?: ReactNode;\n actionLabel?: ReactNode;\n onAction?: () => void;\n onDismiss?: () => void;\n}\n\nconst TYPE_ICONS: Record<ToastType, ReactNode> = {\n general: <AlertCircleOutlineIcon />,\n info: <InformationOutlineIcon />,\n success: <CheckIcon />,\n danger: <AlertOutlineIcon />,\n warning: <AlertCircleOutlineIcon />,\n};\n\n/\n Toasts notify the user that an action has completed or surface a brief message about a\n * system process. They sit on top of the workflow without interrupting it, don't require\n * user input to disappear, and auto-dismiss after a short duration.\n */\nexport default function Toast({\n className = '',\n message,\n type = 'general',\n icon,\n actionLabel,\n onAction,\n onDismiss,\n}: ToastProps) {\n const typeClass = styles[`toast--type-${type.toLowerCase()}`];\n const noDismissClass = onDismiss == null ? styles['toast--no-dismiss'] : '';\n const rootClass = [styles.toast, typeClass, noDismissClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} role=\"status\" aria-live=\"polite\">\n <div className={styles['toast__content']}>\n <span className={styles['toast__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon ?? <Icon glyph={TYPE_ICONS[type]} />}\n </IconSlotContext.Provider>\n </span>\n <span className={styles['toast__message']}>{message}</span>\n {actionLabel != null && (\n <Button\n appearance=\"default\"\n emphasis=\"tertiary\"\n size=\"x-small\"\n className={styles['toast__action-btn--on-dark']}\n onClick={onAction}\n >\n {actionLabel}\n </Button>\n )}\n </div>\n {onDismiss != null && (\n <IconButton\n aria-label=\"Dismiss\"\n size=\"small\"\n className={styles['toast__dismiss']}\n icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n onClick={onDismiss}\n />\n )}\n </div>\n );\n}\n"],"names":["TYPE_ICONS","AlertCircleOutlineIcon","InformationOutlineIcon","CheckIcon","AlertOutlineIcon","Toast","className","message","type","icon","actionLabel","onAction","onDismiss","typeClass","styles","noDismissClass","rootClass","jsxs","jsx","IconSlotContext","Icon","Button","IconButton","CloseIcon"],"mappings":";;;;;;;;;;AA0BA,MAAMA,IAA2C;AAAA,EAC/C,2BAAUC,GAAA,EAAuB;AAAA,EACjC,wBAAOC,GAAA,EAAuB;AAAA,EAC9B,2BAAUC,GAAA,EAAU;AAAA,EACpB,0BAASC,GAAA,EAAiB;AAAA,EAC1B,2BAAUH,GAAA,CAAA,CAAuB;AACnC;AAOA,SAAwBI,EAAM;AAAA,EAC5B,WAAAC,IAAY;AAAA,EACZ,SAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AACb,QAAMC,IAAYC,EAAO,eAAeN,EAAK,YAAA,CAAa,EAAE,GACtDO,IAAiBH,KAAa,OAAOE,EAAO,mBAAmB,IAAI,IACnEE,IAAY,CAACF,EAAO,OAAOD,GAAWE,GAAgBT,CAAS,EAClE,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,2BACG,OAAA,EAAI,WAAWU,GAAW,MAAK,UAAS,aAAU,UACjD,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWH,EAAO,gBACrB,UAAA;AAAA,MAAA,gBAAAI,EAAC,QAAA,EAAK,WAAWJ,EAAO,aAAgB,eAAW,IACjD,UAAA,gBAAAI,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAM,KAAA,GACtC,UAAAV,KAAQ,gBAAAS,EAACE,GAAA,EAAK,OAAOpB,EAAWQ,CAAI,EAAA,CAAG,EAAA,CAC1C,EAAA,CACF;AAAA,wBACC,QAAA,EAAK,WAAWM,EAAO,gBAAoB,UAAAP,GAAQ;AAAA,MACnDG,KAAe,QACd,gBAAAQ;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,YAAW;AAAA,UACX,UAAS;AAAA,UACT,MAAK;AAAA,UACL,WAAWP,EAAO,4BAA4B;AAAA,UAC9C,SAASH;AAAA,UAER,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,IACCE,KAAa,QACZ,gBAAAM;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,WAAWR,EAAO;AAAA,QAClB,wBAAOM,GAAA,EAAK,yBAAQG,GAAA,EAAU,GAAI,MAAK,MAAK;AAAA,QAC5C,SAASX;AAAA,MAAA;AAAA,IAAA;AAAA,EACX,GAEJ;AAEJ;"}

package/dist/components/tooltip/Tooltip.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("../icon/Icon.cjs"),p=require("../shortcut-tag/ShortcutTag.cjs"),t=require("./Tooltip.module.scss.cjs");function _({label:s,arrow:i="right",hint:o,shortcutKeys:l,icon:a,className:r=""}){const n=t.default[`tooltip--arrow-${i.toLowerCase()}`]??"",d=[t.default.tooltip,n,r].filter(Boolean).join(" ");return e.jsxs("div",{className:d,children:[e.jsxs("div",{className:t.default.tooltip__container,children:[e.jsxs("div",{className:t.default.tooltip__content,children:[a!=null&&e.jsx("span",{className:t.default.tooltip__icon,"aria-hidden":!0,children:e.jsx(u.IconSlotContext.Provider,{value:{size:"16"},children:a})}),e.jsx("span",{className:t.default.tooltip__label,children:s})]}),l&&l.length>0&&e.jsx("div",{className:t.default.tooltip__shortcuts,children:e.jsx(p.ShortcutTagGroup,{labels:l.map(c=>c.label),location:"tooltips",size:"small"})}),o&&e.jsx("span",{className:t.default.tooltip__hint,children:o})]}),e.jsx("div",{className:t.default.tooltip__arrow,"aria-hidden":!0})]})}exports.default=_;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),c=require("../icon/Icon.cjs"),p=require("../shortcut-tag/ShortcutTag.cjs"),l=require("./Tooltip.module.scss.cjs");function _({label:s,arrow:i="right",hint:t,shortcutKeys:o,icon:a,className:r=""}){const n=l.default[`tooltip--arrow-${i.toLowerCase()}`]??"",d=[l.default.tooltip,n,r].filter(Boolean).join(" ");return e.jsxs("div",{className:d,children:[e.jsxs("div",{className:l.default.tooltip__container,children:[e.jsxs("div",{className:l.default.tooltip__content,children:[a!=null&&e.jsx("span",{className:l.default.tooltip__icon,"aria-hidden":!0,children:e.jsx(c.IconSlotContext.Provider,{value:{size:"16"},children:a})}),e.jsx("span",{className:l.default.tooltip__label,children:s})]}),o&&o.length>0&&e.jsx("div",{className:l.default.tooltip__shortcuts,children:e.jsx(p.ShortcutTagGroup,{labels:o.map(u=>u.label),location:"tooltips",size:"small"})}),t!=null&&t!==""?e.jsx("span",{className:l.default.tooltip__hint,children:t}):null]}),e.jsx("div",{className:l.default.tooltip__arrow,"aria-hidden":!0})]})}exports.default=_;
 //# sourceMappingURL=Tooltip.cjs.map

package/dist/components/tooltip/Tooltip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport { ShortcutTagGroup } from '@/components/shortcut-tag/ShortcutTag';\nimport styles from './Tooltip.module.scss';\n\nexport type TooltipArrow = 'top' \| 'right' \| 'bottom' \| 'left';\n\nexport interface TooltipShortcutKey {\n label: string;\n}\n\nexport interface TooltipProps {\n /** Tooltip label ~~text~~. /\n label: ~~string~~;\n /* Arrow direction. Default: Right. /\n arrow?: TooltipArrow;\n /* Optional hint text shown below label. /\n hint?: ~~string~~;\n /* Optional keyboard shortcut keys shown below label. /\n shortcutKeys?: TooltipShortcutKey[];\n /* Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; Tooltip provides the correct size via context. /\n icon?: ReactNode;\n /* Optional CSS class name. /\n className?: string;\n}\n\n/\n Tooltips surface short, supporting text on hover. Reach for a tooltip when the affordance\n * behind it isn't fully self-explanatory — an Icon Button, a truncated label, a keyboard\n * shortcut. Don't reach for one when the label is already on screen.\n */\nexport default function Tooltip({\n label,\n arrow = 'right',\n hint,\n shortcutKeys,\n icon,\n className = '',\n}: TooltipProps) {\n const arrowClass = styles[`tooltip--arrow-${arrow.toLowerCase()}`] ?? '';\n\n const rootClass = [styles.tooltip, arrowClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass}>\n <div className={styles['tooltip__container']}>\n <div className={styles['tooltip__content']}>\n {icon != null && (\n <span className={styles['tooltip__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon}\n </IconSlotContext.Provider>\n </span>\n )}\n <span className={styles['tooltip__label']}>{label}</span>\n </div>\n\n {shortcutKeys && shortcutKeys.length > 0 && (\n <div className={styles['tooltip__shortcuts']}>\n <ShortcutTagGroup\n labels={shortcutKeys.map((key) => key.label)}\n location=\"tooltips\"\n size=\"small\"\n />\n </div>\n )}\n\n {hint && <span className={styles['tooltip__hint']}>{hint}</span>}\n </div>\n\n <div className={styles['tooltip__arrow']} aria-hidden />\n </div>\n );\n}\n"],"names":["Tooltip","label","arrow","hint","shortcutKeys","icon","className","arrowClass","styles","rootClass","jsxs","jsx","IconSlotContext","ShortcutTagGroup","key"],"mappings":"kQA+BA,SAAwBA,EAAQ,CAC9B,MAAAC,EACA,MAAAC,EAAQ,QACR,KAAAC,EACA,aAAAC,EACA,KAAAC,EACA,UAAAC,EAAY,EACd,EAAiB,CACf,MAAMC,EAAaC,EAAAA,QAAO,kBAAkBN,EAAM,YAAA,CAAa,EAAE,GAAK,GAEhEO,EAAY,CAACD,UAAO,QAASD,EAAYD,CAAS,EACrD,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEI,EAAAA,KAAC,MAAA,CAAI,UAAWD,EACd,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,mBACrB,SAAA,CAAAE,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,iBACpB,SAAA,CAAAH,GAAQ,MACPM,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,cAAkB,cAAW,GACnD,eAACI,kBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,WACH,EACF,QAED,OAAA,CAAK,UAAWJ,EAAAA,QAAO,eAAoB,SAAAP,CAAA,CAAM,CAAA,EACpD,EAECG,GAAgBA,EAAa,OAAS,SACpC,MAAA,CAAI,UAAWI,EAAAA,QAAO,mBACrB,SAAAG,EAAAA,IAACE,EAAAA,iBAAA,CACC,OAAQT,EAAa,IAAKU,GAAQA,EAAI,KAAK,EAC3C,SAAS,WACT,KAAK,OAAA,CAAA,EAET,EAGDX,~~GAAQQ~~,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,cAAmB,SAAAL,CAAA,CAAK,~~CAAA~~,~~EAC3D~~,QAEC,MAAA,CAAI,UAAWK,EAAAA,QAAO,eAAmB,cAAW,EAAA,CAAC,CAAA,EACxD,CAEJ"}
1	+ {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport { ShortcutTagGroup } from '@/components/shortcut-tag/ShortcutTag';\nimport styles from './Tooltip.module.scss';\n\nexport type TooltipArrow = 'top' \| 'right' \| 'bottom' \| 'left';\n\nexport interface TooltipShortcutKey {\n label: string;\n}\n\nexport interface TooltipProps {\n /** Tooltip label. Accepts translated nodes (e.g. `<FormattedMessage/>`). /\n label: ReactNode;\n /* Arrow direction. Default: Right. /\n arrow?: TooltipArrow;\n /* Optional hint text shown below label. /\n hint?: ReactNode;\n /* Optional keyboard shortcut keys shown below label. /\n shortcutKeys?: TooltipShortcutKey[];\n /* Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; Tooltip provides the correct size via context. /\n icon?: ReactNode;\n /* Optional CSS class name. /\n className?: string;\n}\n\n/\n Tooltips surface short, supporting text on hover. Reach for a tooltip when the affordance\n * behind it isn't fully self-explanatory — an Icon Button, a truncated label, a keyboard\n * shortcut. Don't reach for one when the label is already on screen.\n */\nexport default function Tooltip({\n label,\n arrow = 'right',\n hint,\n shortcutKeys,\n icon,\n className = '',\n}: TooltipProps) {\n const arrowClass = styles[`tooltip--arrow-${arrow.toLowerCase()}`] ?? '';\n\n const rootClass = [styles.tooltip, arrowClass, className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass}>\n <div className={styles['tooltip__container']}>\n <div className={styles['tooltip__content']}>\n {icon != null && (\n <span className={styles['tooltip__icon']} aria-hidden>\n <IconSlotContext.Provider value={{ size: '16' }}>\n {icon}\n </IconSlotContext.Provider>\n </span>\n )}\n <span className={styles['tooltip__label']}>{label}</span>\n </div>\n\n {shortcutKeys && shortcutKeys.length > 0 && (\n <div className={styles['tooltip__shortcuts']}>\n <ShortcutTagGroup\n labels={shortcutKeys.map((key) => key.label)}\n location=\"tooltips\"\n size=\"small\"\n />\n </div>\n )}\n\n {hint != null && hint !== '' ? (\n <span className={styles['tooltip__hint']}>{hint}</span>\n ) : null}\n </div>\n\n <div className={styles['tooltip__arrow']} aria-hidden />\n </div>\n );\n}\n"],"names":["Tooltip","label","arrow","hint","shortcutKeys","icon","className","arrowClass","styles","rootClass","jsxs","jsx","IconSlotContext","ShortcutTagGroup","key"],"mappings":"kQA+BA,SAAwBA,EAAQ,CAC9B,MAAAC,EACA,MAAAC,EAAQ,QACR,KAAAC,EACA,aAAAC,EACA,KAAAC,EACA,UAAAC,EAAY,EACd,EAAiB,CACf,MAAMC,EAAaC,EAAAA,QAAO,kBAAkBN,EAAM,YAAA,CAAa,EAAE,GAAK,GAEhEO,EAAY,CAACD,UAAO,QAASD,EAAYD,CAAS,EACrD,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEI,EAAAA,KAAC,MAAA,CAAI,UAAWD,EACd,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,mBACrB,SAAA,CAAAE,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,iBACpB,SAAA,CAAAH,GAAQ,MACPM,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,cAAkB,cAAW,GACnD,eAACI,kBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,WACH,EACF,QAED,OAAA,CAAK,UAAWJ,EAAAA,QAAO,eAAoB,SAAAP,CAAA,CAAM,CAAA,EACpD,EAECG,GAAgBA,EAAa,OAAS,SACpC,MAAA,CAAI,UAAWI,EAAAA,QAAO,mBACrB,SAAAG,EAAAA,IAACE,EAAAA,iBAAA,CACC,OAAQT,EAAa,IAAKU,GAAQA,EAAI,KAAK,EAC3C,SAAS,WACT,KAAK,OAAA,CAAA,EAET,EAGDX,GAAQ,MAAQA,IAAS,GACxBQ,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,cAAmB,SAAAL,CAAA,CAAK,EAC9C,IAAA,EACN,QAEC,MAAA,CAAI,UAAWK,EAAAA,QAAO,eAAmB,cAAW,EAAA,CAAC,CAAA,EACxD,CAEJ"}

package/dist/components/tooltip/Tooltip.d.ts CHANGED Viewed

@@ -4,12 +4,12 @@ export interface TooltipShortcutKey {
     label: string;
 }
 export interface TooltipProps {
-    /** Tooltip label text. */
-    label: string;
+    /** Tooltip label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */
+    label: ReactNode;
     /** Arrow direction. Default: Right. */
     arrow?: TooltipArrow;
     /** Optional hint text shown below label. */
-    hint?: string;
+    hint?: ReactNode;
     /** Optional keyboard shortcut keys shown below label. */
     shortcutKeys?: TooltipShortcutKey[];
     /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; Tooltip provides the correct size via context. */

package/dist/components/tooltip/Tooltip.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE/D,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,~~0BAA0B~~;~~IAC1B~~,KAAK,EAAE,~~MAAM~~,CAAC;~~IACd~~,uCAAuC;IACvC,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,~~MAAM~~,CAAC;~~IACd~~,yDAAyD;IACzD,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACpC,mHAAmH;IACnH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,KAAK,EACL,KAAe,EACf,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,SAAc,GACf,EAAE,YAAY,~~2CAqCd~~"}
1	+ {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE/D,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,4EAA4E;IAC5E,KAAK,EAAE,SAAS,CAAC;IACjB,uCAAuC;IACvC,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yDAAyD;IACzD,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACpC,mHAAmH;IACnH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,KAAK,EACL,KAAe,EACf,IAAI,EACJ,YAAY,EACZ,IAAI,EACJ,SAAc,GACf,EAAE,YAAY,2CAuCd"}

package/dist/components/tooltip/Tooltip.js CHANGED Viewed

@@ -1,31 +1,31 @@
-import { jsxs as a, jsx as l } from "react/jsx-runtime";
+import { jsxs as i, jsx as l } from "react/jsx-runtime";
 import { IconSlotContext as m } from "../icon/Icon.js";
 import { ShortcutTagGroup as _ } from "../shortcut-tag/ShortcutTag.js";
 import o from "./Tooltip.module.scss.js";
 function v({
   label: r,
   arrow: s = "right",
-  hint: i,
-  shortcutKeys: t,
+  hint: t,
+  shortcutKeys: a,
   icon: e,
   className: n = ""
 }) {
   const c = o[`tooltip--arrow-${s.toLowerCase()}`] ?? "", p = [o.tooltip, c, n].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: p, children: [
-    /* @__PURE__ */ a("div", { className: o.tooltip__container, children: [
-      /* @__PURE__ */ a("div", { className: o.tooltip__content, children: [
+  return /* @__PURE__ */ i("div", { className: p, children: [
+    /* @__PURE__ */ i("div", { className: o.tooltip__container, children: [
+      /* @__PURE__ */ i("div", { className: o.tooltip__content, children: [
         e != null && /* @__PURE__ */ l("span", { className: o.tooltip__icon, "aria-hidden": !0, children: /* @__PURE__ */ l(m.Provider, { value: { size: "16" }, children: e }) }),
         /* @__PURE__ */ l("span", { className: o.tooltip__label, children: r })
       ] }),
-      t && t.length > 0 && /* @__PURE__ */ l("div", { className: o.tooltip__shortcuts, children: /* @__PURE__ */ l(
+      a && a.length > 0 && /* @__PURE__ */ l("div", { className: o.tooltip__shortcuts, children: /* @__PURE__ */ l(
         _,
         {
-          labels: t.map((d) => d.label),
+          labels: a.map((d) => d.label),
           location: "tooltips",
           size: "small"
         }
       ) }),
-      i && /* @__PURE__ */ l("span", { className: o.tooltip__hint, children: i })
+      t != null && t !== "" ? /* @__PURE__ */ l("span", { className: o.tooltip__hint, children: t }) : null
     ] }),
     /* @__PURE__ */ l("div", { className: o.tooltip__arrow, "aria-hidden": !0 })
   ] });