@mattermost/compass-ui 0.1.0-alpha.1 → 0.1.0-alpha.3

package/dist/components/image-preview/ImagePreview.js

@@ -0,0 +1,100 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import r from "../icon/Icon.js";
+import p from "../icon-button/IconButton.js";
+import { usePopoverTransition as g } from "../../hooks/use-popover-transition.js";
+import __h from "@mattermost/compass-icons/components/link-variant.js";const h=__h&&__h.default?__h.default:__h;
+import __f from "@mattermost/compass-icons/components/download-outline.js";const f=__f&&__f.default?__f.default:__f;
+import __u from "@mattermost/compass-icons/components/menu-down.js";const u=__u&&__u.default?__u.default:__u;
+import __b from "@mattermost/compass-icons/components/menu-right.js";const b=__b&&__b.default?__b.default:__b;
+import i from "./ImagePreview.module.scss.js";
+function D({
+  src: v,
+  alt: d = "",
+  collapsed: l = !1,
+  onToggleCollapse: o,
+  onCopyLink: n,
+  onDownload: m,
+  aspectRatio: s = "16:9",
+  className: w = ""
+}) {
+  const t = g(!l), c = g(l), _ = [
+    i["image-preview"],
+    l ? i["image-preview--collapsed"] : "",
+    s === "4:3" ? i["image-preview--ratio-4-3"] : "",
+    s === "1:1" ? i["image-preview--ratio-1-1"] : "",
+    w
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { className: _, children: /* @__PURE__ */ a("div", { className: i["image-preview__stage"], children: [
+    c.mounted && /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: [
+          i["image-preview__collapsed-trigger"],
+          c.visible ? i["image-preview__collapsed-trigger--visible"] : ""
+        ].filter(Boolean).join(" "),
+        onClick: o,
+        "aria-label": "Show image preview",
+        children: /* @__PURE__ */ a("span", { className: i["image-preview__show-label"], children: [
+          /* @__PURE__ */ e(
+            "span",
+            {
+              className: i["image-preview__show-icon"],
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ e(r, { size: "12", glyph: /* @__PURE__ */ e(b, {}) })
+            }
+          ),
+          "Show Image preview"
+        ] })
+      }
+    ),
+    t.mounted && /* @__PURE__ */ a(
+      "div",
+      {
+        className: [
+          i["image-preview__frame"],
+          t.visible ? i["image-preview__frame--visible"] : ""
+        ].filter(Boolean).join(" "),
+        children: [
+          /* @__PURE__ */ e("div", { className: i["image-preview__media"], children: /* @__PURE__ */ e("img", { src: v, alt: d, className: i["image-preview__img"] }) }),
+          /* @__PURE__ */ a("div", { className: i["image-preview__actions"], children: [
+            n != null && /* @__PURE__ */ e(
+              p,
+              {
+                size: "small",
+                padding: "compact",
+                "aria-label": "Copy link",
+                icon: /* @__PURE__ */ e(r, { size: "16", glyph: /* @__PURE__ */ e(h, {}) }),
+                onClick: n
+              }
+            ),
+            m != null && /* @__PURE__ */ e(
+              p,
+              {
+                size: "small",
+                padding: "compact",
+                "aria-label": "Download",
+                icon: /* @__PURE__ */ e(r, { size: "16", glyph: /* @__PURE__ */ e(f, {}) }),
+                onClick: m
+              }
+            )
+          ] }),
+          o != null && /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              className: i["image-preview__collapse-btn"],
+              onClick: o,
+              "aria-label": "Collapse image preview",
+              children: /* @__PURE__ */ e(r, { size: "16", glyph: /* @__PURE__ */ e(u, {}) })
+            }
+          )
+        ]
+      }
+    )
+  ] }) });
+}
+export {
+  D as default
+};
+//# sourceMappingURL=ImagePreview.js.map

package/dist/components/image-preview/ImagePreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImagePreview.js","sources":["../../../src/components/image-preview/ImagePreview.tsx"],"sourcesContent":["import Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport { usePopoverTransition } from '@/hooks/use-popover-transition';\nimport LinkVariantIcon from '@mattermost/compass-icons/components/link-variant';\nimport DownloadOutlineIcon from '@mattermost/compass-icons/components/download-outline';\nimport MenuDownIcon from '@mattermost/compass-icons/components/menu-down';\nimport MenuRightIcon from '@mattermost/compass-icons/components/menu-right';\nimport styles from './ImagePreview.module.scss';\n\nexport type ImagePreviewAspectRatio = '16:9' | '4:3' | '1:1';\n\nexport interface ImagePreviewProps {\n  /** Image src URL. */\n  src: string;\n  /** Alt text. */\n  alt?: string;\n  /** Whether the preview is collapsed (shows toggle label only). */\n  collapsed?: boolean;\n  /** Callback when the collapse toggle is clicked. */\n  onToggleCollapse?: () => void;\n  /** Callback when the copy-link action is clicked. */\n  onCopyLink?: () => void;\n  /** Callback when the download action is clicked. */\n  onDownload?: () => void;\n  /** Aspect ratio of the image container. Default: 16:9 */\n  aspectRatio?: ImagePreviewAspectRatio;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Image Preview displays image attachments, markdown images, and inline image links inside\n * the message stream. It frames the image, shows hover actions for copy and download, and\n * lets the user collapse the preview when it's in the way.\n */\nexport default function ImagePreview({\n  src,\n  alt = '',\n  collapsed = false,\n  onToggleCollapse,\n  onCopyLink,\n  onDownload,\n  aspectRatio = '16:9',\n  className = '',\n}: ImagePreviewProps) {\n  const frameTransition = usePopoverTransition(!collapsed);\n  const labelTransition = usePopoverTransition(collapsed);\n\n  const rootClass = [\n    styles['image-preview'],\n    collapsed ? styles['image-preview--collapsed'] : '',\n    aspectRatio === '4:3' ? styles['image-preview--ratio-4-3'] : '',\n    aspectRatio === '1:1' ? styles['image-preview--ratio-1-1'] : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass}>\n      <div className={styles['image-preview__stage']}>\n        {labelTransition.mounted && (\n          <button\n            type=\"button\"\n            className={[\n              styles['image-preview__collapsed-trigger'],\n              labelTransition.visible\n                ? styles['image-preview__collapsed-trigger--visible']\n                : '',\n            ]\n              .filter(Boolean)\n              .join(' ')}\n            onClick={onToggleCollapse}\n            aria-label=\"Show image preview\"\n          >\n            <span className={styles['image-preview__show-label']}>\n              <span\n                className={styles['image-preview__show-icon']}\n                aria-hidden=\"true\"\n              >\n                <Icon size=\"12\" glyph={<MenuRightIcon />} />\n              </span>\n              Show Image preview\n            </span>\n          </button>\n        )}\n\n        {frameTransition.mounted && (\n          <div\n            className={[\n              styles['image-preview__frame'],\n              frameTransition.visible\n                ? styles['image-preview__frame--visible']\n                : '',\n            ]\n              .filter(Boolean)\n              .join(' ')}\n          >\n            <div className={styles['image-preview__media']}>\n              <img src={src} alt={alt} className={styles['image-preview__img']} />\n            </div>\n\n            <div className={styles['image-preview__actions']}>\n              {onCopyLink != null && (\n                <IconButton\n                  size=\"small\"\n                  padding=\"compact\"\n                  aria-label=\"Copy link\"\n                  icon={<Icon size=\"16\" glyph={<LinkVariantIcon />} />}\n                  onClick={onCopyLink}\n                />\n              )}\n              {onDownload != null && (\n                <IconButton\n                  size=\"small\"\n                  padding=\"compact\"\n                  aria-label=\"Download\"\n                  icon={<Icon size=\"16\" glyph={<DownloadOutlineIcon />} />}\n                  onClick={onDownload}\n                />\n              )}\n            </div>\n\n            {onToggleCollapse != null && (\n              <button\n                type=\"button\"\n                className={styles['image-preview__collapse-btn']}\n                onClick={onToggleCollapse}\n                aria-label=\"Collapse image preview\"\n              >\n                <Icon size=\"16\" glyph={<MenuDownIcon />} />\n              </button>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["ImagePreview","src","alt","collapsed","onToggleCollapse","onCopyLink","onDownload","aspectRatio","className","frameTransition","usePopoverTransition","labelTransition","rootClass","styles","jsx","jsxs","Icon","MenuRightIcon","IconButton","LinkVariantIcon","DownloadOutlineIcon","MenuDownIcon"],"mappings":";;;;;;;;;AAmCA,SAAwBA,EAAa;AAAA,EACnC,KAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,WAAAC,IAAY;AAAA,EACZ,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AACd,GAAsB;AACpB,QAAMC,IAAkBC,EAAqB,CAACP,CAAS,GACjDQ,IAAkBD,EAAqBP,CAAS,GAEhDS,IAAY;AAAA,IAChBC,EAAO,eAAe;AAAA,IACtBV,IAAYU,EAAO,0BAA0B,IAAI;AAAA,IACjDN,MAAgB,QAAQM,EAAO,0BAA0B,IAAI;AAAA,IAC7DN,MAAgB,QAAQM,EAAO,0BAA0B,IAAI;AAAA,IAC7DL;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAM,EAAC,SAAI,WAAWF,GACd,4BAAC,OAAA,EAAI,WAAWC,EAAO,sBAAsB,GAC1C,UAAA;AAAA,IAAAF,EAAgB,WACf,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,UACTD,EAAO,kCAAkC;AAAA,UACzCF,EAAgB,UACZE,EAAO,2CAA2C,IAClD;AAAA,QAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACX,SAAST;AAAA,QACT,cAAW;AAAA,QAEX,UAAA,gBAAAW,EAAC,QAAA,EAAK,WAAWF,EAAO,2BAA2B,GACjD,UAAA;AAAA,UAAA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWD,EAAO,0BAA0B;AAAA,cAC5C,eAAY;AAAA,cAEZ,4BAACG,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACG,KAAc,EAAA,CAAI;AAAA,YAAA;AAAA,UAAA;AAAA,UACrC;AAAA,QAAA,EAAA,CAET;AAAA,MAAA;AAAA,IAAA;AAAA,IAIHR,EAAgB,WACf,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACTF,EAAO,sBAAsB;AAAA,UAC7BJ,EAAgB,UACZI,EAAO,+BAA+B,IACtC;AAAA,QAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,sBAAsB,GAC3C,UAAA,gBAAAC,EAAC,OAAA,EAAI,KAAAb,GAAU,KAAAC,GAAU,WAAWW,EAAO,oBAAoB,GAAG,GACpE;AAAA,UAEA,gBAAAE,EAAC,OAAA,EAAI,WAAWF,EAAO,wBAAwB,GAC5C,UAAA;AAAA,YAAAR,KAAc,QACb,gBAAAS;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,cAAW;AAAA,gBACX,wBAAOF,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACK,KAAgB,GAAI;AAAA,gBAClD,SAASd;AAAA,cAAA;AAAA,YAAA;AAAA,YAGZC,KAAc,QACb,gBAAAQ;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,cAAW;AAAA,gBACX,wBAAOF,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACM,KAAoB,GAAI;AAAA,gBACtD,SAASd;AAAA,cAAA;AAAA,YAAA;AAAA,UACX,GAEJ;AAAA,UAECF,KAAoB,QACnB,gBAAAU;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAWD,EAAO,6BAA6B;AAAA,cAC/C,SAAST;AAAA,cACT,cAAW;AAAA,cAEX,4BAACY,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACO,KAAa,EAAA,CAAI;AAAA,YAAA;AAAA,UAAA;AAAA,QAC3C;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,EAAA,CAEJ,EAAA,CACF;AAEJ;"}

package/dist/components/image-preview/ImagePreview.module.css

@@ -0,0 +1 @@
+._image-preview_y3zdk_2{display:flex;flex-direction:column;align-items:flex-start;max-width:100%;min-width:0}._image-preview__stage_y3zdk_9{display:grid;align-items:start;container-type:inline-size;width:428px;max-width:100%}._image-preview__stage_y3zdk_9>*{grid-area:1/1}._image-preview__frame_y3zdk_19{position:relative;box-sizing:border-box;border:1px solid rgba(var(--center-channel-color-rgb),.08);border-radius:var(--radius-s);overflow:hidden;width:100%;height:0;opacity:0;transform:scale(.98);transform-origin:top left;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-exit),transform var(--duration-quick) var(--ease-exit),height var(--duration-quick) var(--ease-exit),border-color var(--duration-quick) var(--ease-exit),box-shadow var(--duration-quick) var(--ease-exit)}._image-preview__frame--visible_y3zdk_33{height:56.25cqw;opacity:1;transform:scale(1);pointer-events:auto;overflow:visible;transition:opacity var(--duration-quick) var(--ease-entrance),transform var(--duration-quick) var(--ease-entrance),height var(--duration-quick) var(--ease-entrance),box-shadow var(--duration-quick) var(--ease-transition),border-color var(--duration-quick) var(--ease-transition)}._image-preview__frame_y3zdk_19:not(._image-preview__frame--visible_y3zdk_33){border-color:transparent;box-shadow:none}._image-preview__frame_y3zdk_19:hover{box-shadow:var(--elevation-2);border-color:rgba(var(--center-channel-color-rgb),.24);cursor:pointer}._image-preview__media_y3zdk_50{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:calc(var(--radius-s) - 1px)}._image-preview--ratio-4-3_y3zdk_56 ._image-preview__stage_y3zdk_9{width:320px}._image-preview--ratio-4-3_y3zdk_56 ._image-preview__frame--visible_y3zdk_33{height:75cqw}._image-preview--ratio-1-1_y3zdk_62 ._image-preview__stage_y3zdk_9{width:240px}._image-preview--ratio-1-1_y3zdk_62 ._image-preview__frame--visible_y3zdk_33{height:100cqw}._image-preview__img_y3zdk_68{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}._image-preview__actions_y3zdk_77{position:absolute;top:var(--spacing-s);right:var(--spacing-s);display:flex;gap:0;background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.08);border-radius:var(--radius-s);box-shadow:var(--elevation-1);padding:var(--spacing-xxxxs);opacity:0;transition:opacity var(--duration-quick) var(--ease-transition)}._image-preview__frame_y3zdk_19:hover ._image-preview__actions_y3zdk_77{opacity:1}._image-preview__collapse-btn_y3zdk_94{position:absolute;top:-4px;left:-4px;display:flex;align-items:center;justify-content:center;background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.16);border-radius:var(--radius-full);box-shadow:var(--elevation-1);padding:var(--spacing-xxxs);cursor:pointer;color:var(--center-channel-color);opacity:0;transition:opacity var(--duration-quick) var(--ease-transition)}._image-preview__frame_y3zdk_19:hover ._image-preview__collapse-btn_y3zdk_94{opacity:1}._image-preview--collapsed_y3zdk_114{min-height:0}._image-preview__collapsed-trigger_y3zdk_117{background:transparent;border:none;cursor:pointer;padding:0;opacity:0;transform:translateY(-2px);transition:opacity var(--duration-quick) var(--ease-exit),transform var(--duration-quick) var(--ease-exit)}._image-preview__collapsed-trigger--visible_y3zdk_126{opacity:1;transform:translateY(0);transition:opacity var(--duration-quick) var(--ease-entrance),transform var(--duration-quick) var(--ease-entrance)}._image-preview__show-label_y3zdk_131{display:flex;align-items:center;gap:1px;padding-right:var(--spacing-s);border-radius:var(--radius-s);font-size:var(--font-size-75);font-weight:var(--font-weight-regular);line-height:15px;color:rgba(var(--center-channel-color-rgb),.75)}._image-preview__show-icon_y3zdk_142{display:inline-flex;align-items:center;width:var(--icon-size-12);font-size:var(--font-size-100);color:rgba(var(--center-channel-color-rgb),.75)}

package/dist/components/image-preview/ImagePreview.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ImagePreview.module.css');const e={"image-preview":"_image-preview_y3zdk_2","image-preview__stage":"_image-preview__stage_y3zdk_9","image-preview__frame":"_image-preview__frame_y3zdk_19","image-preview__frame--visible":"_image-preview__frame--visible_y3zdk_33","image-preview__media":"_image-preview__media_y3zdk_50","image-preview--ratio-4-3":"_image-preview--ratio-4-3_y3zdk_56","image-preview--ratio-1-1":"_image-preview--ratio-1-1_y3zdk_62","image-preview__img":"_image-preview__img_y3zdk_68","image-preview__actions":"_image-preview__actions_y3zdk_77","image-preview__collapse-btn":"_image-preview__collapse-btn_y3zdk_94","image-preview--collapsed":"_image-preview--collapsed_y3zdk_114","image-preview__collapsed-trigger":"_image-preview__collapsed-trigger_y3zdk_117","image-preview__collapsed-trigger--visible":"_image-preview__collapsed-trigger--visible_y3zdk_126","image-preview__show-label":"_image-preview__show-label_y3zdk_131","image-preview__show-icon":"_image-preview__show-icon_y3zdk_142"};exports.default=e;
+//# sourceMappingURL=ImagePreview.module.scss.cjs.map

package/dist/components/image-preview/ImagePreview.module.scss.cjs.map

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

package/dist/components/image-preview/ImagePreview.module.scss.js

@@ -0,0 +1,21 @@
+import './ImagePreview.module.css';const e = {
+  "image-preview": "_image-preview_y3zdk_2",
+  "image-preview__stage": "_image-preview__stage_y3zdk_9",
+  "image-preview__frame": "_image-preview__frame_y3zdk_19",
+  "image-preview__frame--visible": "_image-preview__frame--visible_y3zdk_33",
+  "image-preview__media": "_image-preview__media_y3zdk_50",
+  "image-preview--ratio-4-3": "_image-preview--ratio-4-3_y3zdk_56",
+  "image-preview--ratio-1-1": "_image-preview--ratio-1-1_y3zdk_62",
+  "image-preview__img": "_image-preview__img_y3zdk_68",
+  "image-preview__actions": "_image-preview__actions_y3zdk_77",
+  "image-preview__collapse-btn": "_image-preview__collapse-btn_y3zdk_94",
+  "image-preview--collapsed": "_image-preview--collapsed_y3zdk_114",
+  "image-preview__collapsed-trigger": "_image-preview__collapsed-trigger_y3zdk_117",
+  "image-preview__collapsed-trigger--visible": "_image-preview__collapsed-trigger--visible_y3zdk_126",
+  "image-preview__show-label": "_image-preview__show-label_y3zdk_131",
+  "image-preview__show-icon": "_image-preview__show-icon_y3zdk_142"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=ImagePreview.module.scss.js.map

package/dist/components/image-preview/ImagePreview.module.scss.js.map

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

package/dist/components/image-preview/index.cjs

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

package/dist/components/image-preview/index.cjs.map

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

package/dist/components/image-preview/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/image-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,YAAY,EACV,iBAAiB,EACjB,uBAAuB,GACxB,MAAM,gBAAgB,CAAC"}

package/dist/components/image-preview/index.js

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

package/dist/components/image-preview/index.js.map

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

package/dist/components/link-preview/LinkPreview.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),j=require("../icon/Icon.cjs"),h=require("../icon-button/IconButton.cjs"),x=require("../image-preview/ImagePreview.cjs"),__g=require("@mattermost/compass-icons/components/close.js"),g=__g?.default??__g,l=require("./LinkPreview.module.scss.cjs");function N({siteName:d="Mattermost.com",title:u="Mattermost: Open-source, high-trust, developer-centric collaboration platform",description:m="Mattermost is a secure, open source platform for communication, collaboration, and workflow orchestration across tools and teams.",imageSrc:a,imageAlt:n="",imageSize:r="none",imageCollapsed:s=!1,onToggleImageCollapse:p,onCopyImageLink:v,onDownloadImage:_,onDismiss:t,className:f=""}){const o=a!=null&&r==="none"?"large":r,c=o==="small"&&a!=null,i=o==="large"&&a!=null,w=[l.default["link-preview"],f].filter(Boolean).join(" "),k=[l.default["link-preview__card"],c?l.default["link-preview__card--small-image"]:"",i&&!s?l.default["link-preview__card--large-image"]:"",i&&s?l.default["link-preview__card--collapsed-image"]:""].filter(Boolean).join(" ");return e.jsxs("div",{className:w,children:[t!=null&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:l.default["link-preview__dismiss-bridge"],"aria-hidden":!0}),e.jsx(h.default,{className:l.default["link-preview__dismiss"],size:"x-small",padding:"compact","aria-label":"Remove link preview",icon:e.jsx(j.default,{size:"12",glyph:e.jsx(g,{})}),onClick:t})]}),e.jsxs("div",{className:k,children:[e.jsxs("div",{className:l.default["link-preview__text"],children:[e.jsx("p",{className:l.default["link-preview__site-name"],children:d}),e.jsx("p",{className:l.default["link-preview__title"],children:u}),e.jsx("p",{className:l.default["link-preview__description"],children:m})]}),c&&e.jsx("div",{className:l.default["link-preview__thumbnail"],children:e.jsx("img",{src:a,alt:n,className:l.default["link-preview__thumbnail-img"]})}),i&&e.jsx(x.default,{className:l.default["link-preview__image-preview"],src:a,alt:n,collapsed:s,onToggleCollapse:p,onCopyLink:v,onDownload:_})]})]})}exports.default=N;
+//# sourceMappingURL=LinkPreview.cjs.map

package/dist/components/link-preview/LinkPreview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkPreview.cjs","sources":["../../../src/components/link-preview/LinkPreview.tsx"],"sourcesContent":["import Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport ImagePreview from '@/components/image-preview/ImagePreview';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './LinkPreview.module.scss';\n\nexport type LinkPreviewImageSize = 'none' | 'small' | 'large';\n\nexport interface LinkPreviewProps {\n  /** The site/domain label shown above the title. */\n  siteName?: string;\n  /** The main link title. */\n  title?: string;\n  /** Description text. */\n  description?: string;\n  /** Preview image URL. Pair with `imageSize` to choose layout. */\n  imageSrc?: string;\n  /** Alt text for the preview image. */\n  imageAlt?: string;\n  /** Small: square thumbnail on the right. Large: ImagePreview below text. */\n  imageSize?: LinkPreviewImageSize;\n  /** Whether the large image preview is collapsed. Only applies when `imageSize` is `large`. */\n  imageCollapsed?: boolean;\n  /** Callback when the large image collapse toggle is clicked. */\n  onToggleImageCollapse?: () => void;\n  /** Callback when copy-link is clicked on the large image preview. */\n  onCopyImageLink?: () => void;\n  /** Callback when download is clicked on the large image preview. */\n  onDownloadImage?: () => void;\n  /** Called when the dismiss control is clicked. Shown on hover when provided. */\n  onDismiss?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Link Previews appear under a message whenever it contains a URL with rich metadata — a\n * documentation page, a blog post, a product link. They give the recipient enough context to\n * decide whether to click without forcing them to open the link cold.\n */\nexport default function LinkPreview({\n  siteName = 'Mattermost.com',\n  title = 'Mattermost: Open-source, high-trust, developer-centric collaboration platform',\n  description = 'Mattermost is a secure, open source platform for communication, collaboration, and workflow orchestration across tools and teams.',\n  imageSrc,\n  imageAlt = '',\n  imageSize = 'none',\n  imageCollapsed = false,\n  onToggleImageCollapse,\n  onCopyImageLink,\n  onDownloadImage,\n  onDismiss,\n  className = '',\n}: LinkPreviewProps) {\n  const resolvedImageSize =\n    imageSrc != null && imageSize === 'none' ? 'large' : imageSize;\n  const hasSmallImage = resolvedImageSize === 'small' && imageSrc != null;\n  const hasLargeImage = resolvedImageSize === 'large' && imageSrc != null;\n\n  const rootClass = [styles['link-preview'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  const cardClass = [\n    styles['link-preview__card'],\n    hasSmallImage ? styles['link-preview__card--small-image'] : '',\n    hasLargeImage && !imageCollapsed\n      ? styles['link-preview__card--large-image']\n      : '',\n    hasLargeImage && imageCollapsed\n      ? styles['link-preview__card--collapsed-image']\n      : '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass}>\n      {onDismiss != null && (\n        <>\n          <div\n            className={styles['link-preview__dismiss-bridge']}\n            aria-hidden\n          />\n          <IconButton\n            className={styles['link-preview__dismiss']}\n            size=\"x-small\"\n            padding=\"compact\"\n            aria-label=\"Remove link preview\"\n            icon={<Icon size=\"12\" glyph={<CloseIcon />} />}\n            onClick={onDismiss}\n          />\n        </>\n      )}\n\n      <div className={cardClass}>\n        <div className={styles['link-preview__text']}>\n          <p className={styles['link-preview__site-name']}>{siteName}</p>\n          <p className={styles['link-preview__title']}>{title}</p>\n          <p className={styles['link-preview__description']}>{description}</p>\n        </div>\n\n        {hasSmallImage && (\n          <div className={styles['link-preview__thumbnail']}>\n            <img\n              src={imageSrc}\n              alt={imageAlt}\n              className={styles['link-preview__thumbnail-img']}\n            />\n          </div>\n        )}\n\n        {hasLargeImage && (\n          <ImagePreview\n            className={styles['link-preview__image-preview']}\n            src={imageSrc}\n            alt={imageAlt}\n            collapsed={imageCollapsed}\n            onToggleCollapse={onToggleImageCollapse}\n            onCopyLink={onCopyImageLink}\n            onDownload={onDownloadImage}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["LinkPreview","siteName","title","description","imageSrc","imageAlt","imageSize","imageCollapsed","onToggleImageCollapse","onCopyImageLink","onDownloadImage","onDismiss","className","resolvedImageSize","hasSmallImage","hasLargeImage","rootClass","styles","cardClass","jsxs","Fragment","jsx","IconButton","Icon","CloseIcon","ImagePreview"],"mappings":"0WAwCA,SAAwBA,EAAY,CAClC,SAAAC,EAAW,iBACX,MAAAC,EAAQ,gFACR,YAAAC,EAAc,oIACd,SAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,OACZ,eAAAC,EAAiB,GACjB,sBAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,EACd,EAAqB,CACnB,MAAMC,EACJT,GAAY,MAAQE,IAAc,OAAS,QAAUA,EACjDQ,EAAgBD,IAAsB,SAAWT,GAAY,KAC7DW,EAAgBF,IAAsB,SAAWT,GAAY,KAE7DY,EAAY,CAACC,UAAO,cAAc,EAAGL,CAAS,EACjD,OAAO,OAAO,EACd,KAAK,GAAG,EAELM,EAAY,CAChBD,EAAAA,QAAO,oBAAoB,EAC3BH,EAAgBG,EAAAA,QAAO,iCAAiC,EAAI,GAC5DF,GAAiB,CAACR,EACdU,UAAO,iCAAiC,EACxC,GACJF,GAAiBR,EACbU,UAAO,qCAAqC,EAC5C,EAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEE,EAAAA,KAAC,MAAA,CAAI,UAAWH,EACb,SAAA,CAAAL,GAAa,MACZQ,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,EAAAA,IAAC,MAAA,CACC,UAAWJ,EAAAA,QAAO,8BAA8B,EAChD,cAAW,EAAA,CAAA,EAEbI,EAAAA,IAACC,EAAAA,QAAA,CACC,UAAWL,EAAAA,QAAO,uBAAuB,EACzC,KAAK,UACL,QAAQ,UACR,aAAW,sBACX,WAAOM,UAAA,CAAK,KAAK,KAAK,MAAOF,MAACG,IAAU,EAAI,EAC5C,QAASb,CAAA,CAAA,CACX,EACF,EAGFQ,EAAAA,KAAC,MAAA,CAAI,UAAWD,EACd,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,oBAAoB,EACzC,SAAA,CAAAI,MAAC,IAAA,CAAE,UAAWJ,EAAAA,QAAO,yBAAyB,EAAI,SAAAhB,EAAS,QAC1D,IAAA,CAAE,UAAWgB,EAAAA,QAAO,qBAAqB,EAAI,SAAAf,EAAM,QACnD,IAAA,CAAE,UAAWe,EAAAA,QAAO,2BAA2B,EAAI,SAAAd,CAAA,CAAY,CAAA,EAClE,EAECW,GACCO,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,yBAAyB,EAC9C,SAAAI,EAAAA,IAAC,MAAA,CACC,IAAKjB,EACL,IAAKC,EACL,UAAWY,EAAAA,QAAO,6BAA6B,CAAA,CAAA,EAEnD,EAGDF,GACCM,EAAAA,IAACI,EAAAA,QAAA,CACC,UAAWR,EAAAA,QAAO,6BAA6B,EAC/C,IAAKb,EACL,IAAKC,EACL,UAAWE,EACX,iBAAkBC,EAClB,WAAYC,EACZ,WAAYC,CAAA,CAAA,CACd,CAAA,CAEJ,CAAA,EACF,CAEJ"}

package/dist/components/link-preview/LinkPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkPreview.d.ts","sourceRoot":"","sources":["../../../src/components/link-preview/LinkPreview.tsx"],"names":[],"mappings":"AAMA,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AAE9D,MAAM,WAAW,gBAAgB;IAC/B,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,oBAAoB,CAAC;IACjC,8FAA8F;IAC9F,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,gEAAgE;IAChE,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,qEAAqE;IACrE,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,oEAAoE;IACpE,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,gFAAgF;IAChF,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,QAA2B,EAC3B,KAAuF,EACvF,WAAiJ,EACjJ,QAAQ,EACR,QAAa,EACb,SAAkB,EAClB,cAAsB,EACtB,qBAAqB,EACrB,eAAe,EACf,eAAe,EACf,SAAS,EACT,SAAc,GACf,EAAE,gBAAgB,2CAyElB"}

package/dist/components/link-preview/LinkPreview.js

@@ -0,0 +1,80 @@
+import { jsxs as r, Fragment as g, jsx as l } from "react/jsx-runtime";
+import N from "../icon/Icon.js";
+import I from "../icon-button/IconButton.js";
+import b from "../image-preview/ImagePreview.js";
+import __x from "@mattermost/compass-icons/components/close.js";const x=__x&&__x.default?__x.default:__x;
+import e from "./LinkPreview.module.scss.js";
+function z({
+  siteName: p = "Mattermost.com",
+  title: d = "Mattermost: Open-source, high-trust, developer-centric collaboration platform",
+  description: v = "Mattermost is a secure, open source platform for communication, collaboration, and workflow orchestration across tools and teams.",
+  imageSrc: i,
+  imageAlt: n = "",
+  imageSize: s = "none",
+  imageCollapsed: a = !1,
+  onToggleImageCollapse: _,
+  onCopyImageLink: w,
+  onDownloadImage: k,
+  onDismiss: t,
+  className: h = ""
+}) {
+  const c = i != null && s === "none" ? "large" : s, m = c === "small" && i != null, o = c === "large" && i != null, u = [e["link-preview"], h].filter(Boolean).join(" "), f = [
+    e["link-preview__card"],
+    m ? e["link-preview__card--small-image"] : "",
+    o && !a ? e["link-preview__card--large-image"] : "",
+    o && a ? e["link-preview__card--collapsed-image"] : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ r("div", { className: u, children: [
+    t != null && /* @__PURE__ */ r(g, { children: [
+      /* @__PURE__ */ l(
+        "div",
+        {
+          className: e["link-preview__dismiss-bridge"],
+          "aria-hidden": !0
+        }
+      ),
+      /* @__PURE__ */ l(
+        I,
+        {
+          className: e["link-preview__dismiss"],
+          size: "x-small",
+          padding: "compact",
+          "aria-label": "Remove link preview",
+          icon: /* @__PURE__ */ l(N, { size: "12", glyph: /* @__PURE__ */ l(x, {}) }),
+          onClick: t
+        }
+      )
+    ] }),
+    /* @__PURE__ */ r("div", { className: f, children: [
+      /* @__PURE__ */ r("div", { className: e["link-preview__text"], children: [
+        /* @__PURE__ */ l("p", { className: e["link-preview__site-name"], children: p }),
+        /* @__PURE__ */ l("p", { className: e["link-preview__title"], children: d }),
+        /* @__PURE__ */ l("p", { className: e["link-preview__description"], children: v })
+      ] }),
+      m && /* @__PURE__ */ l("div", { className: e["link-preview__thumbnail"], children: /* @__PURE__ */ l(
+        "img",
+        {
+          src: i,
+          alt: n,
+          className: e["link-preview__thumbnail-img"]
+        }
+      ) }),
+      o && /* @__PURE__ */ l(
+        b,
+        {
+          className: e["link-preview__image-preview"],
+          src: i,
+          alt: n,
+          collapsed: a,
+          onToggleCollapse: _,
+          onCopyLink: w,
+          onDownload: k
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  z as default
+};
+//# sourceMappingURL=LinkPreview.js.map

package/dist/components/link-preview/LinkPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkPreview.js","sources":["../../../src/components/link-preview/LinkPreview.tsx"],"sourcesContent":["import Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport ImagePreview from '@/components/image-preview/ImagePreview';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './LinkPreview.module.scss';\n\nexport type LinkPreviewImageSize = 'none' | 'small' | 'large';\n\nexport interface LinkPreviewProps {\n  /** The site/domain label shown above the title. */\n  siteName?: string;\n  /** The main link title. */\n  title?: string;\n  /** Description text. */\n  description?: string;\n  /** Preview image URL. Pair with `imageSize` to choose layout. */\n  imageSrc?: string;\n  /** Alt text for the preview image. */\n  imageAlt?: string;\n  /** Small: square thumbnail on the right. Large: ImagePreview below text. */\n  imageSize?: LinkPreviewImageSize;\n  /** Whether the large image preview is collapsed. Only applies when `imageSize` is `large`. */\n  imageCollapsed?: boolean;\n  /** Callback when the large image collapse toggle is clicked. */\n  onToggleImageCollapse?: () => void;\n  /** Callback when copy-link is clicked on the large image preview. */\n  onCopyImageLink?: () => void;\n  /** Callback when download is clicked on the large image preview. */\n  onDownloadImage?: () => void;\n  /** Called when the dismiss control is clicked. Shown on hover when provided. */\n  onDismiss?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Link Previews appear under a message whenever it contains a URL with rich metadata — a\n * documentation page, a blog post, a product link. They give the recipient enough context to\n * decide whether to click without forcing them to open the link cold.\n */\nexport default function LinkPreview({\n  siteName = 'Mattermost.com',\n  title = 'Mattermost: Open-source, high-trust, developer-centric collaboration platform',\n  description = 'Mattermost is a secure, open source platform for communication, collaboration, and workflow orchestration across tools and teams.',\n  imageSrc,\n  imageAlt = '',\n  imageSize = 'none',\n  imageCollapsed = false,\n  onToggleImageCollapse,\n  onCopyImageLink,\n  onDownloadImage,\n  onDismiss,\n  className = '',\n}: LinkPreviewProps) {\n  const resolvedImageSize =\n    imageSrc != null && imageSize === 'none' ? 'large' : imageSize;\n  const hasSmallImage = resolvedImageSize === 'small' && imageSrc != null;\n  const hasLargeImage = resolvedImageSize === 'large' && imageSrc != null;\n\n  const rootClass = [styles['link-preview'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  const cardClass = [\n    styles['link-preview__card'],\n    hasSmallImage ? styles['link-preview__card--small-image'] : '',\n    hasLargeImage && !imageCollapsed\n      ? styles['link-preview__card--large-image']\n      : '',\n    hasLargeImage && imageCollapsed\n      ? styles['link-preview__card--collapsed-image']\n      : '',\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass}>\n      {onDismiss != null && (\n        <>\n          <div\n            className={styles['link-preview__dismiss-bridge']}\n            aria-hidden\n          />\n          <IconButton\n            className={styles['link-preview__dismiss']}\n            size=\"x-small\"\n            padding=\"compact\"\n            aria-label=\"Remove link preview\"\n            icon={<Icon size=\"12\" glyph={<CloseIcon />} />}\n            onClick={onDismiss}\n          />\n        </>\n      )}\n\n      <div className={cardClass}>\n        <div className={styles['link-preview__text']}>\n          <p className={styles['link-preview__site-name']}>{siteName}</p>\n          <p className={styles['link-preview__title']}>{title}</p>\n          <p className={styles['link-preview__description']}>{description}</p>\n        </div>\n\n        {hasSmallImage && (\n          <div className={styles['link-preview__thumbnail']}>\n            <img\n              src={imageSrc}\n              alt={imageAlt}\n              className={styles['link-preview__thumbnail-img']}\n            />\n          </div>\n        )}\n\n        {hasLargeImage && (\n          <ImagePreview\n            className={styles['link-preview__image-preview']}\n            src={imageSrc}\n            alt={imageAlt}\n            collapsed={imageCollapsed}\n            onToggleCollapse={onToggleImageCollapse}\n            onCopyLink={onCopyImageLink}\n            onDownload={onDownloadImage}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["LinkPreview","siteName","title","description","imageSrc","imageAlt","imageSize","imageCollapsed","onToggleImageCollapse","onCopyImageLink","onDownloadImage","onDismiss","className","resolvedImageSize","hasSmallImage","hasLargeImage","rootClass","styles","cardClass","jsxs","Fragment","jsx","IconButton","Icon","CloseIcon","ImagePreview"],"mappings":";;;;;;AAwCA,SAAwBA,EAAY;AAAA,EAClC,UAAAC,IAAW;AAAA,EACX,OAAAC,IAAQ;AAAA,EACR,aAAAC,IAAc;AAAA,EACd,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,gBAAAC,IAAiB;AAAA,EACjB,uBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAqB;AACnB,QAAMC,IACJT,KAAY,QAAQE,MAAc,SAAS,UAAUA,GACjDQ,IAAgBD,MAAsB,WAAWT,KAAY,MAC7DW,IAAgBF,MAAsB,WAAWT,KAAY,MAE7DY,IAAY,CAACC,EAAO,cAAc,GAAGL,CAAS,EACjD,OAAO,OAAO,EACd,KAAK,GAAG,GAELM,IAAY;AAAA,IAChBD,EAAO,oBAAoB;AAAA,IAC3BH,IAAgBG,EAAO,iCAAiC,IAAI;AAAA,IAC5DF,KAAiB,CAACR,IACdU,EAAO,iCAAiC,IACxC;AAAA,IACJF,KAAiBR,IACbU,EAAO,qCAAqC,IAC5C;AAAA,EAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAE,EAAC,OAAA,EAAI,WAAWH,GACb,UAAA;AAAA,IAAAL,KAAa,QACZ,gBAAAQ,EAAAC,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWJ,EAAO,8BAA8B;AAAA,UAChD,eAAW;AAAA,QAAA;AAAA,MAAA;AAAA,MAEb,gBAAAI;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAWL,EAAO,uBAAuB;AAAA,UACzC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,cAAW;AAAA,UACX,wBAAOM,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACG,KAAU,GAAI;AAAA,UAC5C,SAASb;AAAA,QAAA;AAAA,MAAA;AAAA,IACX,GACF;AAAA,IAGF,gBAAAQ,EAAC,OAAA,EAAI,WAAWD,GACd,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWF,EAAO,oBAAoB,GACzC,UAAA;AAAA,QAAA,gBAAAI,EAAC,KAAA,EAAE,WAAWJ,EAAO,yBAAyB,GAAI,UAAAhB,GAAS;AAAA,0BAC1D,KAAA,EAAE,WAAWgB,EAAO,qBAAqB,GAAI,UAAAf,GAAM;AAAA,0BACnD,KAAA,EAAE,WAAWe,EAAO,2BAA2B,GAAI,UAAAd,EAAA,CAAY;AAAA,MAAA,GAClE;AAAA,MAECW,KACC,gBAAAO,EAAC,OAAA,EAAI,WAAWJ,EAAO,yBAAyB,GAC9C,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKjB;AAAA,UACL,KAAKC;AAAA,UACL,WAAWY,EAAO,6BAA6B;AAAA,QAAA;AAAA,MAAA,GAEnD;AAAA,MAGDF,KACC,gBAAAM;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,WAAWR,EAAO,6BAA6B;AAAA,UAC/C,KAAKb;AAAA,UACL,KAAKC;AAAA,UACL,WAAWE;AAAA,UACX,kBAAkBC;AAAA,UAClB,YAAYC;AAAA,UACZ,YAAYC;AAAA,QAAA;AAAA,MAAA;AAAA,IACd,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/link-preview/LinkPreview.module.css

@@ -0,0 +1 @@
+._link-preview_1dlj9_2{--link-preview-dismiss-size: 20px;--link-preview-dismiss-outset: calc( var(--link-preview-dismiss-size) + var(--spacing-xxxs) );display:flex;align-items:flex-start;max-width:700px;position:relative}._link-preview__dismiss-bridge_1dlj9_12{position:absolute;top:calc(-1 * var(--link-preview-dismiss-outset));bottom:0;left:calc(-1 * var(--link-preview-dismiss-outset));width:var(--link-preview-dismiss-outset);z-index:1;pointer-events:none}._link-preview__dismiss_1dlj9_12{position:absolute;top:0;left:calc(-1 * var(--spacing-xxl));z-index:2;opacity:0;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-transition)}._link-preview_1dlj9_2:hover ._link-preview__dismiss-bridge_1dlj9_12,._link-preview_1dlj9_2:focus-within ._link-preview__dismiss-bridge_1dlj9_12{pointer-events:auto}._link-preview_1dlj9_2:hover ._link-preview__dismiss_1dlj9_12,._link-preview_1dlj9_2:focus-within ._link-preview__dismiss_1dlj9_12{opacity:1;pointer-events:auto}._link-preview__card_1dlj9_37{background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.16);border-radius:var(--radius-s);box-shadow:var(--elevation-1);display:flex;flex:1 0 0;align-items:flex-start;min-width:0;padding:var(--spacing-l);transition:box-shadow var(--duration-quick) var(--ease-transition),border-color var(--duration-quick) var(--ease-transition)}._link-preview__card_1dlj9_37:hover{box-shadow:var(--elevation-2);border-color:rgba(var(--center-channel-color-rgb),.24);cursor:pointer}._link-preview__card--small-image_1dlj9_54{gap:var(--spacing-m)}._link-preview__card--large-image_1dlj9_57{flex-direction:column;gap:var(--spacing-m)}._link-preview__card--collapsed-image_1dlj9_61{flex-direction:column;gap:var(--spacing-l)}._link-preview__text_1dlj9_65{display:flex;flex-direction:column;gap:var(--spacing-xxxs);align-items:flex-start;min-width:0;overflow:hidden}._link-preview__card--small-image_1dlj9_54 ._link-preview__text_1dlj9_65{flex:1 0 0}._link-preview__card--large-image_1dlj9_57 ._link-preview__text_1dlj9_65,._link-preview__card--collapsed-image_1dlj9_61 ._link-preview__text_1dlj9_65{flex:0 0 auto;width:100%}._link-preview__site-name_1dlj9_80{font-size:var(--font-size-50);font-weight:var(--font-weight-regular);line-height:var(--line-height-50);letter-spacing:.11px;color:rgba(var(--center-channel-color-rgb),.64);width:100%}._link-preview__title_1dlj9_88{font-size:var(--font-size-100);font-weight:var(--font-weight-semibold);line-height:var(--line-height-100);color:var(--link-color);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;width:100%}._link-preview__description_1dlj9_99{font-size:var(--font-size-100);font-weight:var(--font-weight-regular);line-height:var(--line-height-100);color:var(--center-channel-color);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;width:100%}._link-preview__thumbnail_1dlj9_110{flex-shrink:0;width:80px;height:80px;border-radius:var(--radius-s);overflow:hidden}._link-preview__thumbnail-img_1dlj9_117{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}._link-preview__image-preview_1dlj9_124{max-width:100%}

package/dist/components/link-preview/LinkPreview.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./LinkPreview.module.css');const e={"link-preview":"_link-preview_1dlj9_2","link-preview__dismiss-bridge":"_link-preview__dismiss-bridge_1dlj9_12","link-preview__dismiss":"_link-preview__dismiss_1dlj9_12","link-preview__card":"_link-preview__card_1dlj9_37","link-preview__card--small-image":"_link-preview__card--small-image_1dlj9_54","link-preview__card--large-image":"_link-preview__card--large-image_1dlj9_57","link-preview__card--collapsed-image":"_link-preview__card--collapsed-image_1dlj9_61","link-preview__text":"_link-preview__text_1dlj9_65","link-preview__site-name":"_link-preview__site-name_1dlj9_80","link-preview__title":"_link-preview__title_1dlj9_88","link-preview__description":"_link-preview__description_1dlj9_99","link-preview__thumbnail":"_link-preview__thumbnail_1dlj9_110","link-preview__thumbnail-img":"_link-preview__thumbnail-img_1dlj9_117","link-preview__image-preview":"_link-preview__image-preview_1dlj9_124"};exports.default=e;
+//# sourceMappingURL=LinkPreview.module.scss.cjs.map

package/dist/components/link-preview/LinkPreview.module.scss.cjs.map

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

package/dist/components/link-preview/LinkPreview.module.scss.js

@@ -0,0 +1,20 @@
+import './LinkPreview.module.css';const _ = {
+  "link-preview": "_link-preview_1dlj9_2",
+  "link-preview__dismiss-bridge": "_link-preview__dismiss-bridge_1dlj9_12",
+  "link-preview__dismiss": "_link-preview__dismiss_1dlj9_12",
+  "link-preview__card": "_link-preview__card_1dlj9_37",
+  "link-preview__card--small-image": "_link-preview__card--small-image_1dlj9_54",
+  "link-preview__card--large-image": "_link-preview__card--large-image_1dlj9_57",
+  "link-preview__card--collapsed-image": "_link-preview__card--collapsed-image_1dlj9_61",
+  "link-preview__text": "_link-preview__text_1dlj9_65",
+  "link-preview__site-name": "_link-preview__site-name_1dlj9_80",
+  "link-preview__title": "_link-preview__title_1dlj9_88",
+  "link-preview__description": "_link-preview__description_1dlj9_99",
+  "link-preview__thumbnail": "_link-preview__thumbnail_1dlj9_110",
+  "link-preview__thumbnail-img": "_link-preview__thumbnail-img_1dlj9_117",
+  "link-preview__image-preview": "_link-preview__image-preview_1dlj9_124"
+};
+export {
+  _ as default
+};
+//# sourceMappingURL=LinkPreview.module.scss.js.map

package/dist/components/link-preview/LinkPreview.module.scss.js.map

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

package/dist/components/link-preview/index.cjs

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

package/dist/components/link-preview/index.cjs.map

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

package/dist/components/link-preview/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/link-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,YAAY,EACV,gBAAgB,EAChB,oBAAoB,GACrB,MAAM,eAAe,CAAC"}

package/dist/components/link-preview/index.js

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

package/dist/components/link-preview/index.js.map

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

package/dist/components/mention-badge/MentionBadge.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),a=require("../../utils/string.cjs"),t=require("./MentionBadge.module.scss.cjs");function u({className:s="",count:e,location:i="sidebar",size:o="small"}){const n=e>99?"99+":String(e),l=n.length,d=[t.default["mention-badge"],t.default[`mention-badge--size-${a.toKebab(o)}`],t.default[`mention-badge--digits-${l}`],i!=="sidebar"?t.default[`mention-badge--location-${a.toKebab(i)}`]:"",s].filter(Boolean).join(" ");return r.jsx("span",{className:d,"aria-label":`${e} mention${e===1?"":"s"}`,children:n})}exports.default=u;
+//# sourceMappingURL=MentionBadge.cjs.map

package/dist/components/mention-badge/MentionBadge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MentionBadge.cjs","sources":["../../../src/components/mention-badge/MentionBadge.tsx"],"sourcesContent":["import { toKebab } from '@/utils/string';\nimport styles from './MentionBadge.module.scss';\n\n/** Figma Mention Badge location context — controls color scheme. */\nexport type MentionBadgeLocation =\n  | 'sidebar'\n  | 'menu-item'\n  | 'icon-button'\n  | 'channel';\n\n/** Figma Mention Badge size. */\nexport type MentionBadgeSize = 'small' | 'medium' | 'large';\n\nexport interface MentionBadgeProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** Mention count. Displays as-is up to 99; shows \"99+\" above that. */\n  count: number;\n  /** Color context. Figma: Location. Default: Sidebar. */\n  location?: MentionBadgeLocation;\n  /** Size variant. Figma: Size. Default: Small. */\n  size?: MentionBadgeSize;\n}\n\n/**\n * Mention Badges show a numerical count of pending mentions. They appear next to channel\n * names in the sidebar, on app-bar icons, inline in menu items, and on center-channel lists\n * such as thread rows — small, high-contrast pills that pull the eye without dominating the\n * row.\n */\nexport default function MentionBadge({\n  className = '',\n  count,\n  location = 'sidebar',\n  size = 'small',\n}: MentionBadgeProps) {\n  const displayText = count > 99 ? '99+' : String(count);\n  const digitCount = displayText.length; // 1, 2, or 3 (for \"99+\")\n\n  const rootClass = [\n    styles['mention-badge'],\n    styles[`mention-badge--size-${toKebab(size)}`],\n    styles[`mention-badge--digits-${digitCount}`],\n    location !== 'sidebar'\n      ? styles[`mention-badge--location-${toKebab(location)}`]\n      : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <span\n      className={rootClass}\n      aria-label={`${count} mention${count === 1 ? '' : 's'}`}\n    >\n      {displayText}\n    </span>\n  );\n}\n"],"names":["MentionBadge","className","count","location","size","displayText","digitCount","rootClass","styles","toKebab","jsx"],"mappings":"iOA8BA,SAAwBA,EAAa,CACnC,UAAAC,EAAY,GACZ,MAAAC,EACA,SAAAC,EAAW,UACX,KAAAC,EAAO,OACT,EAAsB,CACpB,MAAMC,EAAcH,EAAQ,GAAK,MAAQ,OAAOA,CAAK,EAC/CI,EAAaD,EAAY,OAEzBE,EAAY,CAChBC,EAAAA,QAAO,eAAe,EACtBA,EAAAA,QAAO,uBAAuBC,EAAAA,QAAQL,CAAI,CAAC,EAAE,EAC7CI,EAAAA,QAAO,yBAAyBF,CAAU,EAAE,EAC5CH,IAAa,UACTK,EAAAA,QAAO,2BAA2BC,EAAAA,QAAQN,CAAQ,CAAC,EAAE,EACrD,GACJF,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACES,EAAAA,IAAC,OAAA,CACC,UAAWH,EACX,aAAY,GAAGL,CAAK,WAAWA,IAAU,EAAI,GAAK,GAAG,GAEpD,SAAAG,CAAA,CAAA,CAGP"}

package/dist/components/mention-badge/MentionBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MentionBadge.d.ts","sourceRoot":"","sources":["../../../src/components/mention-badge/MentionBadge.tsx"],"names":[],"mappings":"AAGA,oEAAoE;AACpE,MAAM,MAAM,oBAAoB,GAC5B,SAAS,GACT,WAAW,GACX,aAAa,GACb,SAAS,CAAC;AAEd,gCAAgC;AAChC,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE5D,MAAM,WAAW,iBAAiB;IAChC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,iDAAiD;IACjD,IAAI,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAED;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,SAAc,EACd,KAAK,EACL,QAAoB,EACpB,IAAc,GACf,EAAE,iBAAiB,2CAwBnB"}

package/dist/components/mention-badge/MentionBadge.js

@@ -0,0 +1,29 @@
+import { jsx as m } from "react/jsx-runtime";
+import { toKebab as o } from "../../utils/string.js";
+import i from "./MentionBadge.module.scss.js";
+function f({
+  className: a = "",
+  count: e,
+  location: t = "sidebar",
+  size: s = "small"
+}) {
+  const n = e > 99 ? "99+" : String(e), r = n.length, l = [
+    i["mention-badge"],
+    i[`mention-badge--size-${o(s)}`],
+    i[`mention-badge--digits-${r}`],
+    t !== "sidebar" ? i[`mention-badge--location-${o(t)}`] : "",
+    a
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ m(
+    "span",
+    {
+      className: l,
+      "aria-label": `${e} mention${e === 1 ? "" : "s"}`,
+      children: n
+    }
+  );
+}
+export {
+  f as default
+};
+//# sourceMappingURL=MentionBadge.js.map

package/dist/components/mention-badge/MentionBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MentionBadge.js","sources":["../../../src/components/mention-badge/MentionBadge.tsx"],"sourcesContent":["import { toKebab } from '@/utils/string';\nimport styles from './MentionBadge.module.scss';\n\n/** Figma Mention Badge location context — controls color scheme. */\nexport type MentionBadgeLocation =\n  | 'sidebar'\n  | 'menu-item'\n  | 'icon-button'\n  | 'channel';\n\n/** Figma Mention Badge size. */\nexport type MentionBadgeSize = 'small' | 'medium' | 'large';\n\nexport interface MentionBadgeProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** Mention count. Displays as-is up to 99; shows \"99+\" above that. */\n  count: number;\n  /** Color context. Figma: Location. Default: Sidebar. */\n  location?: MentionBadgeLocation;\n  /** Size variant. Figma: Size. Default: Small. */\n  size?: MentionBadgeSize;\n}\n\n/**\n * Mention Badges show a numerical count of pending mentions. They appear next to channel\n * names in the sidebar, on app-bar icons, inline in menu items, and on center-channel lists\n * such as thread rows — small, high-contrast pills that pull the eye without dominating the\n * row.\n */\nexport default function MentionBadge({\n  className = '',\n  count,\n  location = 'sidebar',\n  size = 'small',\n}: MentionBadgeProps) {\n  const displayText = count > 99 ? '99+' : String(count);\n  const digitCount = displayText.length; // 1, 2, or 3 (for \"99+\")\n\n  const rootClass = [\n    styles['mention-badge'],\n    styles[`mention-badge--size-${toKebab(size)}`],\n    styles[`mention-badge--digits-${digitCount}`],\n    location !== 'sidebar'\n      ? styles[`mention-badge--location-${toKebab(location)}`]\n      : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <span\n      className={rootClass}\n      aria-label={`${count} mention${count === 1 ? '' : 's'}`}\n    >\n      {displayText}\n    </span>\n  );\n}\n"],"names":["MentionBadge","className","count","location","size","displayText","digitCount","rootClass","styles","toKebab","jsx"],"mappings":";;;AA8BA,SAAwBA,EAAa;AAAA,EACnC,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,MAAAC,IAAO;AACT,GAAsB;AACpB,QAAMC,IAAcH,IAAQ,KAAK,QAAQ,OAAOA,CAAK,GAC/CI,IAAaD,EAAY,QAEzBE,IAAY;AAAA,IAChBC,EAAO,eAAe;AAAA,IACtBA,EAAO,uBAAuBC,EAAQL,CAAI,CAAC,EAAE;AAAA,IAC7CI,EAAO,yBAAyBF,CAAU,EAAE;AAAA,IAC5CH,MAAa,YACTK,EAAO,2BAA2BC,EAAQN,CAAQ,CAAC,EAAE,IACrD;AAAA,IACJF;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWH;AAAA,MACX,cAAY,GAAGL,CAAK,WAAWA,MAAU,IAAI,KAAK,GAAG;AAAA,MAEpD,UAAAG;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/mention-badge/MentionBadge.module.css

@@ -0,0 +1 @@
+._mention-badge_1uenr_2{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-m);font-family:var(--font-family-body);font-weight:var(--font-weight-semibold);white-space:nowrap;background-color:var(--mention-bg);color:var(--mention-color)}._mention-badge--size-small_1uenr_13{font-size:var(--font-size-25);line-height:11px;padding:.5px 4.5px}._mention-badge--size-medium_1uenr_18{font-size:var(--font-size-50);line-height:var(--line-height-50);letter-spacing:.22px;padding:0 var(--_mb-px-m, 5.5px)}._mention-badge--size-large_1uenr_24{font-size:var(--font-size-75);line-height:15px;padding:1.5px var(--_mb-px-l, 5.5px);border-radius:10px}._mention-badge--digits-1_1uenr_30{--_mb-px-m: 6.5px;--_mb-px-l: 7.5px}._mention-badge--digits-3_1uenr_34{--_mb-px-m: 4.5px;--_mb-px-l: 4px}._mention-badge--location-menu-item_1uenr_38{background-color:rgba(var(--center-channel-color-rgb),.48);color:var(--center-channel-bg)}._mention-badge--location-icon-button_1uenr_42{background-color:var(--sidebar-text-active-border);color:var(--button-color)}._mention-badge--location-channel_1uenr_46{background-color:var(--button-bg);color:var(--button-color)}

package/dist/components/mention-badge/MentionBadge.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./MentionBadge.module.css');const e={"mention-badge":"_mention-badge_1uenr_2","mention-badge--size-small":"_mention-badge--size-small_1uenr_13","mention-badge--size-medium":"_mention-badge--size-medium_1uenr_18","mention-badge--size-large":"_mention-badge--size-large_1uenr_24","mention-badge--digits-1":"_mention-badge--digits-1_1uenr_30","mention-badge--digits-3":"_mention-badge--digits-3_1uenr_34","mention-badge--location-menu-item":"_mention-badge--location-menu-item_1uenr_38","mention-badge--location-icon-button":"_mention-badge--location-icon-button_1uenr_42","mention-badge--location-channel":"_mention-badge--location-channel_1uenr_46"};exports.default=e;
+//# sourceMappingURL=MentionBadge.module.scss.cjs.map

package/dist/components/mention-badge/MentionBadge.module.scss.cjs.map

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

package/dist/components/mention-badge/MentionBadge.module.scss.js

@@ -0,0 +1,15 @@
+import './MentionBadge.module.css';const e = {
+  "mention-badge": "_mention-badge_1uenr_2",
+  "mention-badge--size-small": "_mention-badge--size-small_1uenr_13",
+  "mention-badge--size-medium": "_mention-badge--size-medium_1uenr_18",
+  "mention-badge--size-large": "_mention-badge--size-large_1uenr_24",
+  "mention-badge--digits-1": "_mention-badge--digits-1_1uenr_30",
+  "mention-badge--digits-3": "_mention-badge--digits-3_1uenr_34",
+  "mention-badge--location-menu-item": "_mention-badge--location-menu-item_1uenr_38",
+  "mention-badge--location-icon-button": "_mention-badge--location-icon-button_1uenr_42",
+  "mention-badge--location-channel": "_mention-badge--location-channel_1uenr_46"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=MentionBadge.module.scss.js.map

package/dist/components/mention-badge/MentionBadge.module.scss.js.map

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

package/dist/components/mention-badge/index.cjs

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

package/dist/components/mention-badge/index.cjs.map

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

package/dist/components/mention-badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/mention-badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,YAAY,EACV,iBAAiB,EACjB,oBAAoB,EACpB,gBAAgB,GACjB,MAAM,gBAAgB,CAAC"}

package/dist/components/mention-badge/index.js

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

package/dist/components/mention-badge/index.js.map

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

package/dist/components/menu-item/MenuItem.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),__p=require("@mattermost/compass-icons/components/emoticon-happy-outline.js"),p=__p?.default??__p,__g=require("@mattermost/compass-icons/components/check.js"),g=__g?.default??__g,u=require("../icon/Icon.cjs"),b=require("../tag/Tag.cjs"),q=require("../mention-badge/MentionBadge.cjs"),l=require("./MenuItem.module.scss.cjs");function w({label:m,secondaryLabel:s,secondaryLabelPosition:a="below",leadingVisual:d,leadingElement:c=!0,trailingVisual:i,trailingElement:r=!1,customStatusEmoji:n,tag:o=!1,mentionCount:t,destructive:f=!1,active:_=!1,className:j="",disabled:x,type:h="button",...N}){const v=[l.default["menu-item"],f?l.default["menu-item--destructive"]:"",_?l.default["menu-item--active"]:"",j].filter(Boolean).join(" ");return e.jsx("button",{className:v,type:h,disabled:x,...N,children:e.jsxs("div",{className:l.default["menu-item__content"],children:[c&&e.jsx("div",{className:l.default["menu-item__left"],children:e.jsx("span",{className:l.default["menu-item__leading-visual"],children:d??e.jsx(u.default,{glyph:e.jsx(p,{}),size:"16"})})}),e.jsxs("div",{className:l.default["menu-item__middle"],children:[e.jsxs("div",{className:l.default["menu-item__top-row"],children:[e.jsx("span",{className:l.default["menu-item__label"],children:m}),s&&a==="inline"&&e.jsx("span",{className:l.default["menu-item__secondary-label-inline"],children:s}),n&&e.jsx("span",{className:l.default["menu-item__custom-status"],"aria-hidden":!0,children:n}),o&&e.jsx(b.default,{label:"NEW"}),t!=null&&t>0&&e.jsx(q.default,{count:t,location:"menu-item",size:"small"})]}),s&&a==="below"&&e.jsx("div",{className:l.default["menu-item__bottom-row"],children:e.jsx("span",{className:l.default["menu-item__secondary-label-below"],children:s})})]}),r&&e.jsx("div",{className:l.default["menu-item__right"],children:e.jsx("span",{className:[l.default["menu-item__trailing-visual"],i?"":l.default["menu-item__trailing-visual--check"]].filter(Boolean).join(" "),children:i??e.jsx(u.default,{glyph:e.jsx(g,{}),size:"16"})})})]})})}exports.default=w;
+//# sourceMappingURL=MenuItem.cjs.map

package/dist/components/menu-item/MenuItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.cjs","sources":["../../../src/components/menu-item/MenuItem.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, ReactNode } from 'react';\nimport EmoticonHappyOutlineIcon from '@mattermost/compass-icons/components/emoticon-happy-outline';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport Icon from '@/components/icon/Icon';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport styles from './MenuItem.module.scss';\n\nexport interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Primary label text. */\n  label: string;\n  /** Optional secondary label. */\n  secondaryLabel?: ReactNode;\n  /** Where the secondary label appears. Default: 'below'. */\n  secondaryLabelPosition?: 'inline' | 'below';\n  /** Custom content for the leading slot. When omitted, shows placeholder icon. */\n  leadingVisual?: ReactNode;\n  /** Show the leading visual slot. Default: true. */\n  leadingElement?: boolean;\n  /** Custom content for the trailing slot. When omitted with trailingElement=true, shows check icon. */\n  trailingVisual?: ReactNode;\n  /** Show the trailing visual slot. Default: false. */\n  trailingElement?: boolean;\n  /** Emoji character for custom status, shown inline after the label. */\n  customStatusEmoji?: string;\n  /** Show \"NEW\" label tag. */\n  tag?: boolean;\n  /** Inline mention count badge. */\n  mentionCount?: number;\n  /** Destructive (danger) styling. */\n  destructive?: boolean;\n  /** Highlight row (e.g. submenu parent while child menu is open). */\n  active?: boolean;\n}\n\n/**\n * Menu Items are the rows inside a Menu — the smallest selectable unit in any dropdown,\n * kebab, or context menu. One label, optional supporting visuals, and a clear hit target.\n */\nexport default function MenuItem({\n  label,\n  secondaryLabel,\n  secondaryLabelPosition = 'below',\n  leadingVisual,\n  leadingElement = true,\n  trailingVisual,\n  trailingElement = false,\n  customStatusEmoji,\n  tag = false,\n  mentionCount,\n  destructive = false,\n  active = false,\n  className = '',\n  disabled,\n  type = 'button',\n  ...rest\n}: MenuItemProps) {\n  const rootClass = [\n    styles['menu-item'],\n    destructive ? styles['menu-item--destructive'] : '',\n    active ? styles['menu-item--active'] : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <button className={rootClass} type={type} disabled={disabled} {...rest}>\n      <div className={styles['menu-item__content']}>\n        {leadingElement && (\n          <div className={styles['menu-item__left']}>\n            <span className={styles['menu-item__leading-visual']}>\n              {leadingVisual ?? (\n                <Icon glyph={<EmoticonHappyOutlineIcon />} size=\"16\" />\n              )}\n            </span>\n          </div>\n        )}\n        <div className={styles['menu-item__middle']}>\n          <div className={styles['menu-item__top-row']}>\n            <span className={styles['menu-item__label']}>{label}</span>\n            {secondaryLabel && secondaryLabelPosition === 'inline' && (\n              <span className={styles['menu-item__secondary-label-inline']}>\n                {secondaryLabel}\n              </span>\n            )}\n            {customStatusEmoji && (\n              <span className={styles['menu-item__custom-status']} aria-hidden>\n                {customStatusEmoji}\n              </span>\n            )}\n            {tag && <Tag label=\"NEW\" />}\n            {mentionCount != null && mentionCount > 0 && (\n              <MentionBadge\n                count={mentionCount}\n                location=\"menu-item\"\n                size=\"small\"\n              />\n            )}\n          </div>\n          {secondaryLabel && secondaryLabelPosition === 'below' && (\n            <div className={styles['menu-item__bottom-row']}>\n              <span className={styles['menu-item__secondary-label-below']}>\n                {secondaryLabel}\n              </span>\n            </div>\n          )}\n        </div>\n        {trailingElement && (\n          <div className={styles['menu-item__right']}>\n            <span\n              className={[\n                styles['menu-item__trailing-visual'],\n                !trailingVisual\n                  ? styles['menu-item__trailing-visual--check']\n                  : '',\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              {trailingVisual ?? <Icon glyph={<CheckIcon />} size=\"16\" />}\n            </span>\n          </div>\n        )}\n      </div>\n    </button>\n  );\n}\n"],"names":["MenuItem","label","secondaryLabel","secondaryLabelPosition","leadingVisual","leadingElement","trailingVisual","trailingElement","customStatusEmoji","tag","mentionCount","destructive","active","className","disabled","type","rest","rootClass","styles","jsx","jsxs","Icon","EmoticonHappyOutlineIcon","Tag","MentionBadge","CheckIcon"],"mappings":"kaAuCA,SAAwBA,EAAS,CAC/B,MAAAC,EACA,eAAAC,EACA,uBAAAC,EAAyB,QACzB,cAAAC,EACA,eAAAC,EAAiB,GACjB,eAAAC,EACA,gBAAAC,EAAkB,GAClB,kBAAAC,EACA,IAAAC,EAAM,GACN,aAAAC,EACA,YAAAC,EAAc,GACd,OAAAC,EAAS,GACT,UAAAC,EAAY,GACZ,SAAAC,EACA,KAAAC,EAAO,SACP,GAAGC,CACL,EAAkB,CAChB,MAAMC,EAAY,CAChBC,EAAAA,QAAO,WAAW,EAClBP,EAAcO,EAAAA,QAAO,wBAAwB,EAAI,GACjDN,EAASM,EAAAA,QAAO,mBAAmB,EAAI,GACvCL,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEM,EAAAA,IAAC,SAAA,CAAO,UAAWF,EAAW,KAAAF,EAAY,SAAAD,EAAqB,GAAGE,EAChE,SAAAI,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,oBAAoB,EACxC,SAAA,CAAAb,GACCc,EAAAA,IAAC,OAAI,UAAWD,EAAAA,QAAO,iBAAiB,EACtC,SAAAC,EAAAA,IAAC,OAAA,CAAK,UAAWD,EAAAA,QAAO,2BAA2B,EAChD,SAAAd,GACCe,EAAAA,IAACE,WAAK,MAAOF,EAAAA,IAACG,IAAyB,EAAI,KAAK,IAAA,CAAK,CAAA,CAEzD,CAAA,CACF,EAEFF,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,mBAAmB,EACxC,SAAA,CAAAE,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,oBAAoB,EACzC,SAAA,CAAAC,MAAC,OAAA,CAAK,UAAWD,EAAAA,QAAO,kBAAkB,EAAI,SAAAjB,EAAM,EACnDC,GAAkBC,IAA2B,UAC5CgB,EAAAA,IAAC,QAAK,UAAWD,EAAAA,QAAO,mCAAmC,EACxD,SAAAhB,CAAA,CACH,EAEDM,SACE,OAAA,CAAK,UAAWU,EAAAA,QAAO,0BAA0B,EAAG,cAAW,GAC7D,SAAAV,CAAA,CACH,EAEDC,GAAOU,EAAAA,IAACI,EAAAA,QAAA,CAAI,MAAM,KAAA,CAAM,EACxBb,GAAgB,MAAQA,EAAe,GACtCS,EAAAA,IAACK,EAAAA,QAAA,CACC,MAAOd,EACP,SAAS,YACT,KAAK,OAAA,CAAA,CACP,EAEJ,EACCR,GAAkBC,IAA2B,SAC5CgB,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,uBAAuB,EAC5C,SAAAC,MAAC,QAAK,UAAWD,EAAAA,QAAO,kCAAkC,EACvD,WACH,CAAA,CACF,CAAA,EAEJ,EACCX,GACCY,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,kBAAkB,EACvC,SAAAC,EAAAA,IAAC,OAAA,CACC,UAAW,CACTD,EAAAA,QAAO,4BAA4B,EAClCZ,EAEG,GADAY,UAAO,mCAAmC,CAC1C,EAEH,OAAO,OAAO,EACd,KAAK,GAAG,EAEV,SAAAZ,SAAmBe,EAAAA,QAAA,CAAK,YAAQI,EAAA,CAAA,CAAU,EAAI,KAAK,IAAA,CAAK,CAAA,CAAA,CAC3D,CACF,CAAA,CAAA,CAEJ,CAAA,CACF,CAEJ"}

package/dist/components/menu-item/MenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../src/components/menu-item/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQ7D,MAAM,WAAW,aAAc,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC5E,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,2DAA2D;IAC3D,sBAAsB,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC5C,iFAAiF;IACjF,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,mDAAmD;IACnD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sGAAsG;IACtG,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,qDAAqD;IACrD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4BAA4B;IAC5B,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,kCAAkC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oCAAoC;IACpC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oEAAoE;IACpE,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,EACL,cAAc,EACd,sBAAgC,EAChC,aAAa,EACb,cAAqB,EACrB,cAAc,EACd,eAAuB,EACvB,iBAAiB,EACjB,GAAW,EACX,YAAY,EACZ,WAAmB,EACnB,MAAc,EACd,SAAc,EACd,QAAQ,EACR,IAAe,EACf,GAAG,IAAI,EACR,EAAE,aAAa,2CAuEf"}