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

package/dist/components/message-more-options-menu/MessageMoreOptionsMenu.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageMoreOptionsMenu.cjs","sources":["../../../src/components/message-more-options-menu/MessageMoreOptionsMenu.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport ArrowRightBoldOutlineIcon from '@mattermost/compass-icons/components/arrow-right-bold-outline';\nimport BookmarkOutlineIcon from '@mattermost/compass-icons/components/bookmark-outline';\nimport ChevronRightIcon from '@mattermost/compass-icons/components/chevron-right';\nimport ClockOutlineIcon from '@mattermost/compass-icons/components/clock-outline';\nimport ContentCopyIcon from '@mattermost/compass-icons/components/content-copy';\nimport FlagOutlineIcon from '@mattermost/compass-icons/components/flag-outline';\nimport LinkVariantIcon from '@mattermost/compass-icons/components/link-variant';\nimport MarkAsUnreadIcon from '@mattermost/compass-icons/components/mark-as-unread';\nimport MessageCheckOutlineIcon from '@mattermost/compass-icons/components/message-check-outline';\nimport PencilOutlineIcon from '@mattermost/compass-icons/components/pencil-outline';\nimport PinOutlineIcon from '@mattermost/compass-icons/components/pin-outline';\nimport ReplyOutlineIcon from '@mattermost/compass-icons/components/reply-outline';\nimport TranslateIcon from '@mattermost/compass-icons/components/translate';\nimport TrashCanOutlineIcon from '@mattermost/compass-icons/components/trash-can-outline';\nimport Icon from '@/components/icon/Icon';\nimport MenuItem from '@/components/menu-item/MenuItem';\nimport PopoverMenu, {\n  PopoverMenuDivider,\n  PopoverMenuGroup,\n} from '@/components/popover-menu/PopoverMenu';\nimport ShortcutTag from '@/components/shortcut-tag/ShortcutTag';\n\nexport interface MessageMoreOptionsMenuProps\n  extends HTMLAttributes<HTMLDivElement> {\n  /** Shows Edit and Delete rows. Default: true. */\n  permissionToEdit?: boolean;\n  /** Shows Flag message row. Default: true. */\n  showFlagOption?: boolean;\n}\n\nfunction shortcutLabel(text: string) {\n  return <ShortcutTag label={text} size=\"small\" />;\n}\n\n/**\n * Message “more options” menu — actions with keyboard hints, optional edit/flag.\n */\nexport default function MessageMoreOptionsMenu({\n  permissionToEdit = true,\n  showFlagOption = true,\n  className = '',\n  style,\n  ...rest\n}: MessageMoreOptionsMenuProps) {\n  return (\n    <PopoverMenu\n      className={className}\n      style={style}\n      {...rest}\n    >\n      <PopoverMenuGroup>\n        <MenuItem\n          label=\"Reply\"\n          leadingVisual={<Icon glyph={<ReplyOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('R')}\n        />\n        <MenuItem\n          label=\"Forward\"\n          leadingVisual={\n            <Icon glyph={<ArrowRightBoldOutlineIcon />} size=\"16\" />\n          }\n          trailingElement\n          trailingVisual={shortcutLabel('Shift + F')}\n        />\n        <MenuItem\n          label=\"Follow thread\"\n          leadingVisual={<Icon glyph={<MessageCheckOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('F')}\n        />\n        <MenuItem\n          label=\"Mark as unread\"\n          leadingVisual={<Icon glyph={<MarkAsUnreadIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('U')}\n        />\n        <MenuItem\n          label=\"Save\"\n          leadingVisual={<Icon glyph={<BookmarkOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('S')}\n        />\n        <MenuItem\n          label=\"Remind\"\n          leadingVisual={<Icon glyph={<ClockOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={<Icon glyph={<ChevronRightIcon />} size=\"16\" />}\n        />\n        <MenuItem\n          label=\"Pin to channel\"\n          leadingVisual={<Icon glyph={<PinOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('P')}\n        />\n      </PopoverMenuGroup>\n      <PopoverMenuDivider />\n      <PopoverMenuGroup>\n        <MenuItem\n          label=\"Copy text\"\n          leadingVisual={<Icon glyph={<ContentCopyIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('C')}\n        />\n        <MenuItem\n          label=\"Show translation\"\n          leadingVisual={<Icon glyph={<TranslateIcon />} size=\"16\" />}\n        />\n        <MenuItem\n          label=\"Copy link\"\n          leadingVisual={<Icon glyph={<LinkVariantIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('K')}\n        />\n      </PopoverMenuGroup>\n      {permissionToEdit && (\n        <>\n          <PopoverMenuDivider />\n          <PopoverMenuGroup>\n            <MenuItem\n              label=\"Edit\"\n              leadingVisual={<Icon glyph={<PencilOutlineIcon />} size=\"16\" />}\n              trailingElement\n              trailingVisual={shortcutLabel('E')}\n            />\n            <MenuItem\n              label=\"Delete\"\n              destructive\n              leadingVisual={<Icon glyph={<TrashCanOutlineIcon />} size=\"16\" />}\n              trailingElement\n              trailingVisual={shortcutLabel('delete')}\n            />\n          </PopoverMenuGroup>\n        </>\n      )}\n      {showFlagOption && (\n        <>\n          {!permissionToEdit && <PopoverMenuDivider />}\n          <PopoverMenuGroup>\n            <MenuItem\n              label=\"Flag message\"\n              destructive\n              leadingVisual={<Icon glyph={<FlagOutlineIcon />} size=\"16\" />}\n            />\n          </PopoverMenuGroup>\n        </>\n      )}\n    </PopoverMenu>\n  );\n}\n"],"names":["shortcutLabel","text","jsx","ShortcutTag","MessageMoreOptionsMenu","permissionToEdit","showFlagOption","className","style","rest","jsxs","PopoverMenu","PopoverMenuGroup","MenuItem","Icon","ReplyOutlineIcon","ArrowRightBoldOutlineIcon","MessageCheckOutlineIcon","MarkAsUnreadIcon","BookmarkOutlineIcon","ClockOutlineIcon","ChevronRightIcon","PinOutlineIcon","PopoverMenuDivider","ContentCopyIcon","TranslateIcon","LinkVariantIcon","Fragment","PencilOutlineIcon","TrashCanOutlineIcon","FlagOutlineIcon"],"mappings":"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"}

package/dist/components/message-more-options-menu/MessageMoreOptionsMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageMoreOptionsMenu.d.ts","sourceRoot":"","sources":["../../../src/components/message-more-options-menu/MessageMoreOptionsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAuB5C,MAAM,WAAW,2BACf,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtC,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6CAA6C;IAC7C,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAMD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAC7C,gBAAuB,EACvB,cAAqB,EACrB,SAAc,EACd,KAAK,EACL,GAAG,IAAI,EACR,EAAE,2BAA2B,2CA0G7B"}

package/dist/components/message-more-options-menu/MessageMoreOptionsMenu.js

@@ -0,0 +1,172 @@
+import { jsxs as t, jsx as i, Fragment as u } from "react/jsx-runtime";
+import __c from "@mattermost/compass-icons/components/arrow-right-bold-outline.js";const c=__c&&__c.default?__c.default:__c;
+import __h from "@mattermost/compass-icons/components/bookmark-outline.js";const h=__h&&__h.default?__h.default:__h;
+import __d from "@mattermost/compass-icons/components/chevron-right.js";const d=__d&&__d.default?__d.default:__d;
+import __V from "@mattermost/compass-icons/components/clock-outline.js";const V=__V&&__V.default?__V.default:__V;
+import __f from "@mattermost/compass-icons/components/content-copy.js";const f=__f&&__f.default?__f.default:__f;
+import __y from "@mattermost/compass-icons/components/flag-outline.js";const y=__y&&__y.default?__y.default:__y;
+import __I from "@mattermost/compass-icons/components/link-variant.js";const I=__I&&__I.default?__I.default:__I;
+import __b from "@mattermost/compass-icons/components/mark-as-unread.js";const b=__b&&__b.default?__b.default:__b;
+import __z from "@mattermost/compass-icons/components/message-check-outline.js";const z=__z&&__z.default?__z.default:__z;
+import __E from "@mattermost/compass-icons/components/pencil-outline.js";const E=__E&&__E.default?__E.default:__E;
+import __M from "@mattermost/compass-icons/components/pin-outline.js";const M=__M&&__M.default?__M.default:__M;
+import __O from "@mattermost/compass-icons/components/reply-outline.js";const O=__O&&__O.default?__O.default:__O;
+import __C from "@mattermost/compass-icons/components/translate.js";const C=__C&&__C.default?__C.default:__C;
+import __k from "@mattermost/compass-icons/components/trash-can-outline.js";const k=__k&&__k.default?__k.default:__k;
+import l from "../icon/Icon.js";
+import e from "../menu-item/MenuItem.js";
+import v, { PopoverMenuGroup as a, PopoverMenuDivider as o } from "../popover-menu/PopoverMenu.js";
+import F from "../shortcut-tag/ShortcutTag.js";
+function r(n) {
+  return /* @__PURE__ */ i(F, { label: n, size: "small" });
+}
+function W({
+  permissionToEdit: n = !0,
+  showFlagOption: g = !0,
+  className: s = "",
+  style: m,
+  ...p
+}) {
+  return /* @__PURE__ */ t(
+    v,
+    {
+      className: s,
+      style: m,
+      ...p,
+      children: [
+        /* @__PURE__ */ t(a, { children: [
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Reply",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(O, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("R")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Forward",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(c, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("Shift + F")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Follow thread",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(z, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("F")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Mark as unread",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(b, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("U")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Save",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(h, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("S")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Remind",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(V, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(d, {}), size: "16" })
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Pin to channel",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(M, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("P")
+            }
+          )
+        ] }),
+        /* @__PURE__ */ i(o, {}),
+        /* @__PURE__ */ t(a, { children: [
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Copy text",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(f, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("C")
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Show translation",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(C, {}), size: "16" })
+            }
+          ),
+          /* @__PURE__ */ i(
+            e,
+            {
+              label: "Copy link",
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(I, {}), size: "16" }),
+              trailingElement: !0,
+              trailingVisual: r("K")
+            }
+          )
+        ] }),
+        n && /* @__PURE__ */ t(u, { children: [
+          /* @__PURE__ */ i(o, {}),
+          /* @__PURE__ */ t(a, { children: [
+            /* @__PURE__ */ i(
+              e,
+              {
+                label: "Edit",
+                leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(E, {}), size: "16" }),
+                trailingElement: !0,
+                trailingVisual: r("E")
+              }
+            ),
+            /* @__PURE__ */ i(
+              e,
+              {
+                label: "Delete",
+                destructive: !0,
+                leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(k, {}), size: "16" }),
+                trailingElement: !0,
+                trailingVisual: r("delete")
+              }
+            )
+          ] })
+        ] }),
+        g && /* @__PURE__ */ t(u, { children: [
+          !n && /* @__PURE__ */ i(o, {}),
+          /* @__PURE__ */ i(a, { children: /* @__PURE__ */ i(
+            e,
+            {
+              label: "Flag message",
+              destructive: !0,
+              leadingVisual: /* @__PURE__ */ i(l, { glyph: /* @__PURE__ */ i(y, {}), size: "16" })
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  W as default
+};
+//# sourceMappingURL=MessageMoreOptionsMenu.js.map

package/dist/components/message-more-options-menu/MessageMoreOptionsMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageMoreOptionsMenu.js","sources":["../../../src/components/message-more-options-menu/MessageMoreOptionsMenu.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport ArrowRightBoldOutlineIcon from '@mattermost/compass-icons/components/arrow-right-bold-outline';\nimport BookmarkOutlineIcon from '@mattermost/compass-icons/components/bookmark-outline';\nimport ChevronRightIcon from '@mattermost/compass-icons/components/chevron-right';\nimport ClockOutlineIcon from '@mattermost/compass-icons/components/clock-outline';\nimport ContentCopyIcon from '@mattermost/compass-icons/components/content-copy';\nimport FlagOutlineIcon from '@mattermost/compass-icons/components/flag-outline';\nimport LinkVariantIcon from '@mattermost/compass-icons/components/link-variant';\nimport MarkAsUnreadIcon from '@mattermost/compass-icons/components/mark-as-unread';\nimport MessageCheckOutlineIcon from '@mattermost/compass-icons/components/message-check-outline';\nimport PencilOutlineIcon from '@mattermost/compass-icons/components/pencil-outline';\nimport PinOutlineIcon from '@mattermost/compass-icons/components/pin-outline';\nimport ReplyOutlineIcon from '@mattermost/compass-icons/components/reply-outline';\nimport TranslateIcon from '@mattermost/compass-icons/components/translate';\nimport TrashCanOutlineIcon from '@mattermost/compass-icons/components/trash-can-outline';\nimport Icon from '@/components/icon/Icon';\nimport MenuItem from '@/components/menu-item/MenuItem';\nimport PopoverMenu, {\n  PopoverMenuDivider,\n  PopoverMenuGroup,\n} from '@/components/popover-menu/PopoverMenu';\nimport ShortcutTag from '@/components/shortcut-tag/ShortcutTag';\n\nexport interface MessageMoreOptionsMenuProps\n  extends HTMLAttributes<HTMLDivElement> {\n  /** Shows Edit and Delete rows. Default: true. */\n  permissionToEdit?: boolean;\n  /** Shows Flag message row. Default: true. */\n  showFlagOption?: boolean;\n}\n\nfunction shortcutLabel(text: string) {\n  return <ShortcutTag label={text} size=\"small\" />;\n}\n\n/**\n * Message “more options” menu — actions with keyboard hints, optional edit/flag.\n */\nexport default function MessageMoreOptionsMenu({\n  permissionToEdit = true,\n  showFlagOption = true,\n  className = '',\n  style,\n  ...rest\n}: MessageMoreOptionsMenuProps) {\n  return (\n    <PopoverMenu\n      className={className}\n      style={style}\n      {...rest}\n    >\n      <PopoverMenuGroup>\n        <MenuItem\n          label=\"Reply\"\n          leadingVisual={<Icon glyph={<ReplyOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('R')}\n        />\n        <MenuItem\n          label=\"Forward\"\n          leadingVisual={\n            <Icon glyph={<ArrowRightBoldOutlineIcon />} size=\"16\" />\n          }\n          trailingElement\n          trailingVisual={shortcutLabel('Shift + F')}\n        />\n        <MenuItem\n          label=\"Follow thread\"\n          leadingVisual={<Icon glyph={<MessageCheckOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('F')}\n        />\n        <MenuItem\n          label=\"Mark as unread\"\n          leadingVisual={<Icon glyph={<MarkAsUnreadIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('U')}\n        />\n        <MenuItem\n          label=\"Save\"\n          leadingVisual={<Icon glyph={<BookmarkOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('S')}\n        />\n        <MenuItem\n          label=\"Remind\"\n          leadingVisual={<Icon glyph={<ClockOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={<Icon glyph={<ChevronRightIcon />} size=\"16\" />}\n        />\n        <MenuItem\n          label=\"Pin to channel\"\n          leadingVisual={<Icon glyph={<PinOutlineIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('P')}\n        />\n      </PopoverMenuGroup>\n      <PopoverMenuDivider />\n      <PopoverMenuGroup>\n        <MenuItem\n          label=\"Copy text\"\n          leadingVisual={<Icon glyph={<ContentCopyIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('C')}\n        />\n        <MenuItem\n          label=\"Show translation\"\n          leadingVisual={<Icon glyph={<TranslateIcon />} size=\"16\" />}\n        />\n        <MenuItem\n          label=\"Copy link\"\n          leadingVisual={<Icon glyph={<LinkVariantIcon />} size=\"16\" />}\n          trailingElement\n          trailingVisual={shortcutLabel('K')}\n        />\n      </PopoverMenuGroup>\n      {permissionToEdit && (\n        <>\n          <PopoverMenuDivider />\n          <PopoverMenuGroup>\n            <MenuItem\n              label=\"Edit\"\n              leadingVisual={<Icon glyph={<PencilOutlineIcon />} size=\"16\" />}\n              trailingElement\n              trailingVisual={shortcutLabel('E')}\n            />\n            <MenuItem\n              label=\"Delete\"\n              destructive\n              leadingVisual={<Icon glyph={<TrashCanOutlineIcon />} size=\"16\" />}\n              trailingElement\n              trailingVisual={shortcutLabel('delete')}\n            />\n          </PopoverMenuGroup>\n        </>\n      )}\n      {showFlagOption && (\n        <>\n          {!permissionToEdit && <PopoverMenuDivider />}\n          <PopoverMenuGroup>\n            <MenuItem\n              label=\"Flag message\"\n              destructive\n              leadingVisual={<Icon glyph={<FlagOutlineIcon />} size=\"16\" />}\n            />\n          </PopoverMenuGroup>\n        </>\n      )}\n    </PopoverMenu>\n  );\n}\n"],"names":["shortcutLabel","text","jsx","ShortcutTag","MessageMoreOptionsMenu","permissionToEdit","showFlagOption","className","style","rest","jsxs","PopoverMenu","PopoverMenuGroup","MenuItem","Icon","ReplyOutlineIcon","ArrowRightBoldOutlineIcon","MessageCheckOutlineIcon","MarkAsUnreadIcon","BookmarkOutlineIcon","ClockOutlineIcon","ChevronRightIcon","PinOutlineIcon","PopoverMenuDivider","ContentCopyIcon","TranslateIcon","LinkVariantIcon","Fragment","PencilOutlineIcon","TrashCanOutlineIcon","FlagOutlineIcon"],"mappings":"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"}

package/dist/components/message-more-options-menu/index.cjs

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

package/dist/components/message-more-options-menu/index.cjs.map

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

package/dist/components/message-more-options-menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/message-more-options-menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,YAAY,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/components/message-more-options-menu/index.js

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

package/dist/components/message-more-options-menu/index.js.map

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

package/dist/components/message-separator/MessageSeparator.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),m=require("../icon/Icon.cjs"),__c=require("@mattermost/compass-icons/components/creation-outline.js"),c=__c?.default??__c,a=require("./MessageSeparator.module.scss.cjs"),g={date:"Today","new-messages":"New messages","reply-count":"4 replies"};function p({type:s="date",label:t,showAiSummary:l=!1,onSummarize:i,className:n="",...d}){const o=t??g[s],u=[a.default["message-separator"],a.default[`message-separator--${s==="new-messages"?"new":s==="reply-count"?"reply":"date"}`],n].filter(Boolean).join(" "),r=e.jsxs("div",{className:a.default["message-separator__label"],children:[e.jsx("span",{className:a.default["message-separator__text"],children:o}),s==="new-messages"&&l&&e.jsxs("button",{type:"button",className:a.default["message-separator__summarize"],onClick:i,"aria-label":"Summarize new messages with AI",children:[e.jsx("span",{className:a.default["message-separator__summarize-icon"],"aria-hidden":!0,children:e.jsx(m.default,{size:"12",glyph:e.jsx(c,{})})}),"Summarize"]})]});return e.jsx("div",{className:u,role:"separator",...d,children:s==="reply-count"?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:a.default["message-separator__reply-gutter"],"aria-hidden":!0,children:e.jsx("div",{className:a.default["message-separator__reply-line-start"]})}),r,e.jsx("div",{className:a.default["message-separator__line"],"aria-hidden":!0})]}):e.jsxs(e.Fragment,{children:[e.jsx("div",{className:a.default["message-separator__line"],"aria-hidden":!0}),r,e.jsx("div",{className:a.default["message-separator__line"],"aria-hidden":!0})]})})}exports.default=p;
+//# sourceMappingURL=MessageSeparator.cjs.map

package/dist/components/message-separator/MessageSeparator.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageSeparator.cjs","sources":["../../../src/components/message-separator/MessageSeparator.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport CreationOutlineIcon from '@mattermost/compass-icons/components/creation-outline';\nimport styles from './MessageSeparator.module.scss';\n\nexport type MessageSeparatorType = 'date' | 'new-messages' | 'reply-count';\n\nexport interface MessageSeparatorProps extends HTMLAttributes<HTMLDivElement> {\n  /** Separator variant. Default: Date. */\n  type?: MessageSeparatorType;\n  /** Label text. Defaults: 'Today' / 'New messages' / '4 replies'. */\n  label?: string;\n  /** Show AI summarize button (New Messages type only). Default: false. */\n  showAiSummary?: boolean;\n  /** Called when Summarize button is clicked. */\n  onSummarize?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\nconst DEFAULT_LABELS: Record<MessageSeparatorType, string> = {\n  date: 'Today',\n  'new-messages': 'New messages',\n  'reply-count': '4 replies',\n};\n\n/**\n * Message Separators sit between messages in the stream to group them — by day, by reply\n * count, or to mark the boundary between read and unread. They help readers orient\n * themselves when scrolling back through history or returning to a busy channel.\n */\nexport default function MessageSeparator({\n  type = 'date',\n  label,\n  showAiSummary = false,\n  onSummarize,\n  className = '',\n  ...rest\n}: MessageSeparatorProps) {\n  const displayLabel = label ?? DEFAULT_LABELS[type];\n\n  const rootClass = [\n    styles['message-separator'],\n    styles[\n      `message-separator--${type === 'new-messages' ? 'new' : type === 'reply-count' ? 'reply' : 'date'}`\n    ],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const labelBlock = (\n    <div className={styles['message-separator__label']}>\n      <span className={styles['message-separator__text']}>\n        {displayLabel}\n      </span>\n\n      {type === 'new-messages' && showAiSummary && (\n        <button\n          type=\"button\"\n          className={styles['message-separator__summarize']}\n          onClick={onSummarize}\n          aria-label=\"Summarize new messages with AI\"\n        >\n          <span\n            className={styles['message-separator__summarize-icon']}\n            aria-hidden\n          >\n            <Icon size=\"12\" glyph={<CreationOutlineIcon />} />\n          </span>\n          Summarize\n        </button>\n      )}\n    </div>\n  );\n\n  return (\n    <div className={rootClass} role=\"separator\" {...rest}>\n      {type === 'reply-count' ? (\n        <>\n          <div className={styles['message-separator__reply-gutter']} aria-hidden>\n            <div className={styles['message-separator__reply-line-start']} />\n          </div>\n          {labelBlock}\n          <div className={styles['message-separator__line']} aria-hidden />\n        </>\n      ) : (\n        <>\n          <div className={styles['message-separator__line']} aria-hidden />\n          {labelBlock}\n          <div className={styles['message-separator__line']} aria-hidden />\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":["DEFAULT_LABELS","MessageSeparator","type","label","showAiSummary","onSummarize","className","rest","displayLabel","rootClass","styles","labelBlock","jsxs","jsx","Icon","CreationOutlineIcon","Fragment"],"mappings":"kSAoBMA,EAAuD,CAC3D,KAAM,QACN,eAAgB,eAChB,cAAe,WACjB,EAOA,SAAwBC,EAAiB,CACvC,KAAAC,EAAO,OACP,MAAAC,EACA,cAAAC,EAAgB,GAChB,YAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EAA0B,CACxB,MAAMC,EAAeL,GAASH,EAAeE,CAAI,EAE3CO,EAAY,CAChBC,EAAAA,QAAO,mBAAmB,EAC1BA,EAAAA,QACE,sBAAsBR,IAAS,eAAiB,MAAQA,IAAS,cAAgB,QAAU,MAAM,EACnG,EACAI,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAELK,EACJC,EAAAA,KAAC,MAAA,CAAI,UAAWF,UAAO,0BAA0B,EAC/C,SAAA,CAAAG,MAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,yBAAyB,EAC9C,SAAAF,EACH,EAECN,IAAS,gBAAkBE,GAC1BQ,EAAAA,KAAC,SAAA,CACC,KAAK,SACL,UAAWF,EAAAA,QAAO,8BAA8B,EAChD,QAASL,EACT,aAAW,iCAEX,SAAA,CAAAQ,EAAAA,IAAC,OAAA,CACC,UAAWH,EAAAA,QAAO,mCAAmC,EACrD,cAAW,GAEX,eAACI,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOD,EAAAA,IAACE,IAAoB,CAAA,CAAI,CAAA,CAAA,EAC3C,WAAA,CAAA,CAAA,CAET,EAEJ,EAGF,OACEF,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAW,KAAK,YAAa,GAAGF,EAC7C,SAAAL,IAAS,cACRU,EAAAA,KAAAI,EAAAA,SAAA,CACE,SAAA,CAAAH,EAAAA,IAAC,MAAA,CAAI,UAAWH,EAAAA,QAAO,iCAAiC,EAAG,cAAW,GACpE,SAAAG,EAAAA,IAAC,MAAA,CAAI,UAAWH,EAAAA,QAAO,qCAAqC,EAAG,EACjE,EACCC,QACA,MAAA,CAAI,UAAWD,EAAAA,QAAO,yBAAyB,EAAG,cAAW,EAAA,CAAC,CAAA,CAAA,CACjE,EAEAE,EAAAA,KAAAI,EAAAA,SAAA,CACE,SAAA,CAAAH,MAAC,OAAI,UAAWH,EAAAA,QAAO,yBAAyB,EAAG,cAAW,GAAC,EAC9DC,QACA,MAAA,CAAI,UAAWD,EAAAA,QAAO,yBAAyB,EAAG,cAAW,EAAA,CAAC,CAAA,CAAA,CACjE,CAAA,CAEJ,CAEJ"}

package/dist/components/message-separator/MessageSeparator.css

@@ -0,0 +1 @@
+@charset "UTF-8";._message-separator_1c3en_3{display:flex;align-items:center;gap:var(--spacing-m);padding:var(--spacing-s) 0;width:100%}._message-separator__line_1c3en_10{flex:1 0 0;min-width:4px;height:1px;background-color:rgba(var(--center-channel-color-rgb),.12)}._message-separator__label_1c3en_16{display:flex;align-items:center;gap:var(--spacing-xs);flex-shrink:0}._message-separator__text_1c3en_22{font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);color:var(--center-channel-color);white-space:nowrap}._message-separator__summarize_1c3en_30{display:inline-flex;align-items:center;gap:var(--spacing-xxxs);padding:var(--spacing-xxxxs) var(--spacing-s);border:none;border-radius:var(--radius-s);background-color:rgba(var(--color-warning-rgb),.08);color:var(--new-message-separator, var(--color-warning));font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);cursor:pointer;white-space:nowrap;transition:background-color var(--duration-quick) var(--ease-transition)}._message-separator__summarize_1c3en_30:hover{background-color:rgba(var(--color-warning-rgb),.14)}._message-separator__summarize_1c3en_30:focus-visible{outline:2px solid var(--new-message-separator, var(--color-warning));outline-offset:1px}._message-separator__summarize-icon_1c3en_54{display:inline-flex;align-items:center;flex-shrink:0}._message-separator__reply-gutter_1c3en_62{display:flex;flex-shrink:0;align-items:center;width:var(--icon-size-32)}._message-separator__reply-line-start_1c3en_68{width:100%;height:1px;background-color:rgba(var(--center-channel-color-rgb),.12)}._message-separator--date_1c3en_73 ._message-separator__text_1c3en_22{color:var(--center-channel-color)}._message-separator--new_1c3en_76 ._message-separator__line_1c3en_10{background-color:var(--new-message-separator, var(--color-warning))}._message-separator--new_1c3en_76 ._message-separator__text_1c3en_22{color:var(--new-message-separator, var(--color-warning))}._message-separator--reply_1c3en_82{gap:var(--spacing-m);padding:var(--spacing-xs) var(--spacing-xxl)}._message-separator--reply_1c3en_82 ._message-separator__line_1c3en_10{background-color:rgba(var(--center-channel-color-rgb),.12)}._message-separator--reply_1c3en_82 ._message-separator__text_1c3en_22{color:rgba(var(--center-channel-color-rgb),.75)}

package/dist/components/message-separator/MessageSeparator.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'react';
+export type MessageSeparatorType = 'date' | 'new-messages' | 'reply-count';
+export interface MessageSeparatorProps extends HTMLAttributes<HTMLDivElement> {
+    /** Separator variant. Default: Date. */
+    type?: MessageSeparatorType;
+    /** Label text. Defaults: 'Today' / 'New messages' / '4 replies'. */
+    label?: string;
+    /** Show AI summarize button (New Messages type only). Default: false. */
+    showAiSummary?: boolean;
+    /** Called when Summarize button is clicked. */
+    onSummarize?: () => void;
+    /** Optional CSS class name. */
+    className?: string;
+}
+/**
+ * Message Separators sit between messages in the stream to group them — by day, by reply
+ * count, or to mark the boundary between read and unread. They help readers orient
+ * themselves when scrolling back through history or returning to a busy channel.
+ */
+export default function MessageSeparator({ type, label, showAiSummary, onSummarize, className, ...rest }: MessageSeparatorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MessageSeparator.d.ts.map

package/dist/components/message-separator/MessageSeparator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageSeparator.d.ts","sourceRoot":"","sources":["../../../src/components/message-separator/MessageSeparator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,cAAc,GAAG,aAAa,CAAC;AAE3E,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,wCAAwC;IACxC,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yEAAyE;IACzE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,IAAa,EACb,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,SAAc,EACd,GAAG,IAAI,EACR,EAAE,qBAAqB,2CAyDvB"}

package/dist/components/message-separator/MessageSeparator.js

@@ -0,0 +1,58 @@
+import { jsx as a, jsxs as r, Fragment as i } from "react/jsx-runtime";
+import g from "../icon/Icon.js";
+import __u from "@mattermost/compass-icons/components/creation-outline.js";const u=__u&&__u.default?__u.default:__u;
+import e from "./MessageSeparator.module.scss.js";
+const _ = {
+  date: "Today",
+  "new-messages": "New messages",
+  "reply-count": "4 replies"
+};
+function w({
+  type: s = "date",
+  label: l,
+  showAiSummary: n = !1,
+  onSummarize: o,
+  className: m = "",
+  ...c
+}) {
+  const d = l ?? _[s], p = [
+    e["message-separator"],
+    e[`message-separator--${s === "new-messages" ? "new" : s === "reply-count" ? "reply" : "date"}`],
+    m
+  ].filter(Boolean).join(" "), t = /* @__PURE__ */ r("div", { className: e["message-separator__label"], children: [
+    /* @__PURE__ */ a("span", { className: e["message-separator__text"], children: d }),
+    s === "new-messages" && n && /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        className: e["message-separator__summarize"],
+        onClick: o,
+        "aria-label": "Summarize new messages with AI",
+        children: [
+          /* @__PURE__ */ a(
+            "span",
+            {
+              className: e["message-separator__summarize-icon"],
+              "aria-hidden": !0,
+              children: /* @__PURE__ */ a(g, { size: "12", glyph: /* @__PURE__ */ a(u, {}) })
+            }
+          ),
+          "Summarize"
+        ]
+      }
+    )
+  ] });
+  return /* @__PURE__ */ a("div", { className: p, role: "separator", ...c, children: s === "reply-count" ? /* @__PURE__ */ r(i, { children: [
+    /* @__PURE__ */ a("div", { className: e["message-separator__reply-gutter"], "aria-hidden": !0, children: /* @__PURE__ */ a("div", { className: e["message-separator__reply-line-start"] }) }),
+    t,
+    /* @__PURE__ */ a("div", { className: e["message-separator__line"], "aria-hidden": !0 })
+  ] }) : /* @__PURE__ */ r(i, { children: [
+    /* @__PURE__ */ a("div", { className: e["message-separator__line"], "aria-hidden": !0 }),
+    t,
+    /* @__PURE__ */ a("div", { className: e["message-separator__line"], "aria-hidden": !0 })
+  ] }) });
+}
+export {
+  w as default
+};
+//# sourceMappingURL=MessageSeparator.js.map

package/dist/components/message-separator/MessageSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageSeparator.js","sources":["../../../src/components/message-separator/MessageSeparator.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport Icon from '@/components/icon/Icon';\nimport CreationOutlineIcon from '@mattermost/compass-icons/components/creation-outline';\nimport styles from './MessageSeparator.module.scss';\n\nexport type MessageSeparatorType = 'date' | 'new-messages' | 'reply-count';\n\nexport interface MessageSeparatorProps extends HTMLAttributes<HTMLDivElement> {\n  /** Separator variant. Default: Date. */\n  type?: MessageSeparatorType;\n  /** Label text. Defaults: 'Today' / 'New messages' / '4 replies'. */\n  label?: string;\n  /** Show AI summarize button (New Messages type only). Default: false. */\n  showAiSummary?: boolean;\n  /** Called when Summarize button is clicked. */\n  onSummarize?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\nconst DEFAULT_LABELS: Record<MessageSeparatorType, string> = {\n  date: 'Today',\n  'new-messages': 'New messages',\n  'reply-count': '4 replies',\n};\n\n/**\n * Message Separators sit between messages in the stream to group them — by day, by reply\n * count, or to mark the boundary between read and unread. They help readers orient\n * themselves when scrolling back through history or returning to a busy channel.\n */\nexport default function MessageSeparator({\n  type = 'date',\n  label,\n  showAiSummary = false,\n  onSummarize,\n  className = '',\n  ...rest\n}: MessageSeparatorProps) {\n  const displayLabel = label ?? DEFAULT_LABELS[type];\n\n  const rootClass = [\n    styles['message-separator'],\n    styles[\n      `message-separator--${type === 'new-messages' ? 'new' : type === 'reply-count' ? 'reply' : 'date'}`\n    ],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const labelBlock = (\n    <div className={styles['message-separator__label']}>\n      <span className={styles['message-separator__text']}>\n        {displayLabel}\n      </span>\n\n      {type === 'new-messages' && showAiSummary && (\n        <button\n          type=\"button\"\n          className={styles['message-separator__summarize']}\n          onClick={onSummarize}\n          aria-label=\"Summarize new messages with AI\"\n        >\n          <span\n            className={styles['message-separator__summarize-icon']}\n            aria-hidden\n          >\n            <Icon size=\"12\" glyph={<CreationOutlineIcon />} />\n          </span>\n          Summarize\n        </button>\n      )}\n    </div>\n  );\n\n  return (\n    <div className={rootClass} role=\"separator\" {...rest}>\n      {type === 'reply-count' ? (\n        <>\n          <div className={styles['message-separator__reply-gutter']} aria-hidden>\n            <div className={styles['message-separator__reply-line-start']} />\n          </div>\n          {labelBlock}\n          <div className={styles['message-separator__line']} aria-hidden />\n        </>\n      ) : (\n        <>\n          <div className={styles['message-separator__line']} aria-hidden />\n          {labelBlock}\n          <div className={styles['message-separator__line']} aria-hidden />\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":["DEFAULT_LABELS","MessageSeparator","type","label","showAiSummary","onSummarize","className","rest","displayLabel","rootClass","styles","labelBlock","jsxs","jsx","Icon","CreationOutlineIcon","Fragment"],"mappings":";;;;AAoBA,MAAMA,IAAuD;AAAA,EAC3D,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,eAAe;AACjB;AAOA,SAAwBC,EAAiB;AAAA,EACvC,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,aAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAA0B;AACxB,QAAMC,IAAeL,KAASH,EAAeE,CAAI,GAE3CO,IAAY;AAAA,IAChBC,EAAO,mBAAmB;AAAA,IAC1BA,EACE,sBAAsBR,MAAS,iBAAiB,QAAQA,MAAS,gBAAgB,UAAU,MAAM,EACnG;AAAA,IACAI;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAELK,IACJ,gBAAAC,EAAC,OAAA,EAAI,WAAWF,EAAO,0BAA0B,GAC/C,UAAA;AAAA,IAAA,gBAAAG,EAAC,QAAA,EAAK,WAAWH,EAAO,yBAAyB,GAC9C,UAAAF,GACH;AAAA,IAECN,MAAS,kBAAkBE,KAC1B,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAWF,EAAO,8BAA8B;AAAA,QAChD,SAASL;AAAA,QACT,cAAW;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWH,EAAO,mCAAmC;AAAA,cACrD,eAAW;AAAA,cAEX,4BAACI,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAD,EAACE,KAAoB,EAAA,CAAI;AAAA,YAAA;AAAA,UAAA;AAAA,UAC3C;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAET,GAEJ;AAGF,SACE,gBAAAF,EAAC,OAAA,EAAI,WAAWJ,GAAW,MAAK,aAAa,GAAGF,GAC7C,UAAAL,MAAS,gBACR,gBAAAU,EAAAI,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAH,EAAC,OAAA,EAAI,WAAWH,EAAO,iCAAiC,GAAG,eAAW,IACpE,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWH,EAAO,qCAAqC,GAAG,GACjE;AAAA,IACCC;AAAA,sBACA,OAAA,EAAI,WAAWD,EAAO,yBAAyB,GAAG,eAAW,GAAA,CAAC;AAAA,EAAA,EAAA,CACjE,IAEA,gBAAAE,EAAAI,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAH,EAAC,SAAI,WAAWH,EAAO,yBAAyB,GAAG,eAAW,IAAC;AAAA,IAC9DC;AAAA,sBACA,OAAA,EAAI,WAAWD,EAAO,yBAAyB,GAAG,eAAW,GAAA,CAAC;AAAA,EAAA,EAAA,CACjE,EAAA,CAEJ;AAEJ;"}

package/dist/components/message-separator/MessageSeparator.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./MessageSeparator.css');const e={"message-separator":"_message-separator_1c3en_3","message-separator__line":"_message-separator__line_1c3en_10","message-separator__label":"_message-separator__label_1c3en_16","message-separator__text":"_message-separator__text_1c3en_22","message-separator__summarize":"_message-separator__summarize_1c3en_30","message-separator__summarize-icon":"_message-separator__summarize-icon_1c3en_54","message-separator__reply-gutter":"_message-separator__reply-gutter_1c3en_62","message-separator__reply-line-start":"_message-separator__reply-line-start_1c3en_68","message-separator--date":"_message-separator--date_1c3en_73","message-separator--new":"_message-separator--new_1c3en_76","message-separator--reply":"_message-separator--reply_1c3en_82"};exports.default=e;
+//# sourceMappingURL=MessageSeparator.module.scss.cjs.map

package/dist/components/message-separator/MessageSeparator.module.scss.cjs.map

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

package/dist/components/message-separator/MessageSeparator.module.scss.js

@@ -0,0 +1,17 @@
+import './MessageSeparator.css';const e = {
+  "message-separator": "_message-separator_1c3en_3",
+  "message-separator__line": "_message-separator__line_1c3en_10",
+  "message-separator__label": "_message-separator__label_1c3en_16",
+  "message-separator__text": "_message-separator__text_1c3en_22",
+  "message-separator__summarize": "_message-separator__summarize_1c3en_30",
+  "message-separator__summarize-icon": "_message-separator__summarize-icon_1c3en_54",
+  "message-separator__reply-gutter": "_message-separator__reply-gutter_1c3en_62",
+  "message-separator__reply-line-start": "_message-separator__reply-line-start_1c3en_68",
+  "message-separator--date": "_message-separator--date_1c3en_73",
+  "message-separator--new": "_message-separator--new_1c3en_76",
+  "message-separator--reply": "_message-separator--reply_1c3en_82"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=MessageSeparator.module.scss.js.map

package/dist/components/message-separator/MessageSeparator.module.scss.js.map

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

package/dist/components/message-separator/index.cjs

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

package/dist/components/message-separator/index.cjs.map

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

package/dist/components/message-separator/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/message-separator/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/message-separator/index.js

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

package/dist/components/message-separator/index.js.map

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

package/dist/components/modal/Modal.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),S=require("react"),p=require("../scrollbar/Scrollbar.cjs"),w=require("../modal-footer/ModalFooter.cjs"),z=require("../modal-header/ModalHeader.cjs"),B=require("../../utils/string.cjs"),l=require("./Modal.module.scss.cjs");function C({className:t="",style:i,size:u="small",title:c,subtitle:m,subtitlePlacement:b="below",hideTitle:f=!1,showBackButton:_=!1,onBack:j,onClose:q,headerDivider:v=!0,headerAction:x,bodyPadding:s="default",scrollable:y=!0,children:M,footer:o,footerLeading:r,footerType:a="2-actions",footerDivider:h=!0}){const d=S.useId(),g=l.default[`modal--size-${B.toKebab(u)}`],I=[l.default["modal__body-inner"],s==="menu"&&l.default["modal__body-inner--menu"],s==="none"&&l.default["modal__body-inner--none"]].filter(Boolean).join(" "),n=e.jsx("div",{className:I,children:M}),N=o!=null||r!=null||a==="spacer-small"||a==="spacer-large";return e.jsxs("div",{className:[l.default.modal,g,t].filter(Boolean).join(" "),style:i,role:"dialog","aria-modal":"true","aria-labelledby":d,children:[e.jsx(z.default,{title:c,titleId:d,subtitle:m,subtitlePlacement:b,hideTitle:f,showBackButton:_,onBack:j,onClose:q,divider:v,headerAction:x}),e.jsx("div",{className:l.default.modal__body,children:y?e.jsx(p.default,{children:n}):n}),N&&e.jsx(w.default,{type:a,divider:h,leading:r,children:o})]})}exports.default=C;
+//# sourceMappingURL=Modal.cjs.map

package/dist/components/modal/Modal.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.cjs","sources":["../../../src/components/modal/Modal.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { useId } from 'react';\nimport Scrollbar from '@/components/scrollbar/Scrollbar';\nimport ModalFooter from '@/components/modal-footer/ModalFooter';\nimport type { ModalFooterType } from '@/components/modal-footer/ModalFooter';\nimport ModalHeader from '@/components/modal-header/ModalHeader';\nimport type { ModalSubtitlePlacement } from '@/components/modal-header/ModalHeader';\nimport { toKebab } from '@/utils/string';\nimport styles from './Modal.module.scss';\n\nexport type ModalSize = 'small' | 'medium' | 'large';\n\n/**\n * Body inset. `menu` is for MenuItem lists — 8px vertical / 16px horizontal so\n * row labels align with the 32px header/footer margins. `none` removes inset\n * for host-owned full-bleed layouts (e.g. settings sidebars).\n */\nexport type ModalBodyPadding = 'default' | 'menu' | 'none';\n\nexport type { ModalFooterType, ModalSubtitlePlacement };\n\nexport interface ModalProps {\n  /** Extra class on the dialog root (size + chrome classes still apply). */\n  className?: string;\n  /** Inline style on the dialog root — prefer `className` for layout overrides. */\n  style?: CSSProperties;\n  /** Width variant. Figma: Size — Small 600px, Medium 704px, Large 832px. */\n  size?: ModalSize;\n  /** Modal heading text. Required for a11y; use `hideTitle` for close-only chrome. */\n  title: ReactNode;\n  /** Optional secondary line — placement via `subtitlePlacement`. */\n  subtitle?: ReactNode;\n  /**\n   * Where the subtitle sits. Figma Modal Header: Below | Beside.\n   * Default: `below`.\n   */\n  subtitlePlacement?: ModalSubtitlePlacement;\n  /** Visually hide the title (close-only header); title remains for `aria-labelledby`. */\n  hideTitle?: boolean;\n  /** When true, shows a back-arrow button before the title. */\n  showBackButton?: boolean;\n  /** Called when the back button is clicked. */\n  onBack?: () => void;\n  /** Called when the × close button is clicked. */\n  onClose?: () => void;\n  /** Show divider between header and body. Default: true. */\n  headerDivider?: boolean;\n  /** Optional control before close (Button, search field, …). */\n  headerAction?: ReactNode;\n  /**\n   * Body inset. Default is 32px horizontal / 28px vertical. Use `menu` for\n   * MenuItem lists. Use `none` when the host owns padding.\n   */\n  bodyPadding?: ModalBodyPadding;\n  /**\n   * When true (default), wraps body content in Scrollbar. Set false when the\n   * host manages scroll inside panes.\n   */\n  scrollable?: boolean;\n  /** Body content. */\n  children: ReactNode;\n  /** Footer slot — typically Buttons. Wrapped in `ModalFooter`. */\n  footer?: ReactNode;\n  /** Left footer slot (pagination status, PaginationDots, …). */\n  footerLeading?: ReactNode;\n  /** Footer layout. Figma Modal Footer Type. Default: `2-actions`. */\n  footerType?: ModalFooterType;\n  /** Show divider between body and footer. Default: true. */\n  footerDivider?: boolean;\n}\n\n/**\n * Modal dialog shell — composes ModalHeader, scrollable body, and ModalFooter.\n * Host owns portal, overlay, focus trap, and open/close.\n */\nexport default function Modal({\n  className = '',\n  style,\n  size = 'small',\n  title,\n  subtitle,\n  subtitlePlacement = 'below',\n  hideTitle = false,\n  showBackButton = false,\n  onBack,\n  onClose,\n  headerDivider = true,\n  headerAction,\n  bodyPadding = 'default',\n  scrollable = true,\n  children,\n  footer,\n  footerLeading,\n  footerType = '2-actions',\n  footerDivider = true,\n}: ModalProps) {\n  const titleId = useId();\n  const sizeClass = styles[`modal--size-${toKebab(size)}`];\n  const bodyInnerClass = [\n    styles['modal__body-inner'],\n    bodyPadding === 'menu' && styles['modal__body-inner--menu'],\n    bodyPadding === 'none' && styles['modal__body-inner--none'],\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const bodyInner = <div className={bodyInnerClass}>{children}</div>;\n  const showFooter =\n    footer != null ||\n    footerLeading != null ||\n    footerType === 'spacer-small' ||\n    footerType === 'spacer-large';\n\n  return (\n    <div\n      className={[styles.modal, sizeClass, className].filter(Boolean).join(' ')}\n      style={style}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={titleId}\n    >\n      <ModalHeader\n        title={title}\n        titleId={titleId}\n        subtitle={subtitle}\n        subtitlePlacement={subtitlePlacement}\n        hideTitle={hideTitle}\n        showBackButton={showBackButton}\n        onBack={onBack}\n        onClose={onClose}\n        divider={headerDivider}\n        headerAction={headerAction}\n      />\n\n      <div className={styles['modal__body']}>\n        {scrollable ? <Scrollbar>{bodyInner}</Scrollbar> : bodyInner}\n      </div>\n\n      {showFooter && (\n        <ModalFooter\n          type={footerType}\n          divider={footerDivider}\n          leading={footerLeading}\n        >\n          {footer}\n        </ModalFooter>\n      )}\n    </div>\n  );\n}\n"],"names":["Modal","className","style","size","title","subtitle","subtitlePlacement","hideTitle","showBackButton","onBack","onClose","headerDivider","headerAction","bodyPadding","scrollable","children","footer","footerLeading","footerType","footerDivider","titleId","useId","sizeClass","styles","toKebab","bodyInnerClass","bodyInner","jsx","showFooter","jsxs","ModalHeader","Scrollbar","ModalFooter"],"mappings":"6WA2EA,SAAwBA,EAAM,CAC5B,UAAAC,EAAY,GACZ,MAAAC,EACA,KAAAC,EAAO,QACP,MAAAC,EACA,SAAAC,EACA,kBAAAC,EAAoB,QACpB,UAAAC,EAAY,GACZ,eAAAC,EAAiB,GACjB,OAAAC,EACA,QAAAC,EACA,cAAAC,EAAgB,GAChB,aAAAC,EACA,YAAAC,EAAc,UACd,WAAAC,EAAa,GACb,SAAAC,EACA,OAAAC,EACA,cAAAC,EACA,WAAAC,EAAa,YACb,cAAAC,EAAgB,EAClB,EAAe,CACb,MAAMC,EAAUC,EAAAA,MAAA,EACVC,EAAYC,EAAAA,QAAO,eAAeC,EAAAA,QAAQrB,CAAI,CAAC,EAAE,EACjDsB,EAAiB,CACrBF,EAAAA,QAAO,mBAAmB,EAC1BV,IAAgB,QAAUU,EAAAA,QAAO,yBAAyB,EAC1DV,IAAgB,QAAUU,EAAAA,QAAO,yBAAyB,CAAA,EAEzD,OAAO,OAAO,EACd,KAAK,GAAG,EAELG,EAAYC,EAAAA,IAAC,MAAA,CAAI,UAAWF,EAAiB,SAAAV,EAAS,EACtDa,EACJZ,GAAU,MACVC,GAAiB,MACjBC,IAAe,gBACfA,IAAe,eAEjB,OACEW,EAAAA,KAAC,MAAA,CACC,UAAW,CAACN,EAAAA,QAAO,MAAOD,EAAWrB,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EACxE,MAAAC,EACA,KAAK,SACL,aAAW,OACX,kBAAiBkB,EAEjB,SAAA,CAAAO,EAAAA,IAACG,EAAAA,QAAA,CACC,MAAA1B,EACA,QAAAgB,EACA,SAAAf,EACA,kBAAAC,EACA,UAAAC,EACA,eAAAC,EACA,OAAAC,EACA,QAAAC,EACA,QAASC,EACT,aAAAC,CAAA,CAAA,EAGFe,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,YACpB,SAAAT,EAAaa,EAAAA,IAACI,EAAAA,QAAA,CAAW,SAAAL,CAAA,CAAU,EAAeA,EACrD,EAECE,GACCD,EAAAA,IAACK,EAAAA,QAAA,CACC,KAAMd,EACN,QAASC,EACT,QAASF,EAER,SAAAD,CAAA,CAAA,CACH,CAAA,CAAA,CAIR"}

package/dist/components/modal/Modal.css

@@ -0,0 +1 @@
+._modal_18mtm_2{background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.16);border-radius:var(--radius-l);box-shadow:var(--elevation-6);display:flex;flex-direction:column;overflow:hidden}._modal--size-small_18mtm_11{width:600px}._modal--size-medium_18mtm_14{width:704px}._modal--size-large_18mtm_17{width:832px}._modal__body_18mtm_20{flex:1;min-height:0}._modal__body-inner_18mtm_24{padding:28px var(--spacing-xxxl)}._modal__body-inner--menu_18mtm_27{padding:var(--spacing-xs) var(--spacing-l)}._modal__body-inner--none_18mtm_30{padding:0}._modal__body_18mtm_20>._modal__body-inner_18mtm_24{height:100%}

package/dist/components/modal/Modal.d.ts

@@ -0,0 +1,66 @@
+import { CSSProperties, ReactNode } from 'react';
+import { ModalFooterType } from '../modal-footer/ModalFooter';
+import { ModalSubtitlePlacement } from '../modal-header/ModalHeader';
+export type ModalSize = 'small' | 'medium' | 'large';
+/**
+ * Body inset. `menu` is for MenuItem lists — 8px vertical / 16px horizontal so
+ * row labels align with the 32px header/footer margins. `none` removes inset
+ * for host-owned full-bleed layouts (e.g. settings sidebars).
+ */
+export type ModalBodyPadding = 'default' | 'menu' | 'none';
+export type { ModalFooterType, ModalSubtitlePlacement };
+export interface ModalProps {
+    /** Extra class on the dialog root (size + chrome classes still apply). */
+    className?: string;
+    /** Inline style on the dialog root — prefer `className` for layout overrides. */
+    style?: CSSProperties;
+    /** Width variant. Figma: Size — Small 600px, Medium 704px, Large 832px. */
+    size?: ModalSize;
+    /** Modal heading text. Required for a11y; use `hideTitle` for close-only chrome. */
+    title: ReactNode;
+    /** Optional secondary line — placement via `subtitlePlacement`. */
+    subtitle?: ReactNode;
+    /**
+     * Where the subtitle sits. Figma Modal Header: Below | Beside.
+     * Default: `below`.
+     */
+    subtitlePlacement?: ModalSubtitlePlacement;
+    /** Visually hide the title (close-only header); title remains for `aria-labelledby`. */
+    hideTitle?: boolean;
+    /** When true, shows a back-arrow button before the title. */
+    showBackButton?: boolean;
+    /** Called when the back button is clicked. */
+    onBack?: () => void;
+    /** Called when the × close button is clicked. */
+    onClose?: () => void;
+    /** Show divider between header and body. Default: true. */
+    headerDivider?: boolean;
+    /** Optional control before close (Button, search field, …). */
+    headerAction?: ReactNode;
+    /**
+     * Body inset. Default is 32px horizontal / 28px vertical. Use `menu` for
+     * MenuItem lists. Use `none` when the host owns padding.
+     */
+    bodyPadding?: ModalBodyPadding;
+    /**
+     * When true (default), wraps body content in Scrollbar. Set false when the
+     * host manages scroll inside panes.
+     */
+    scrollable?: boolean;
+    /** Body content. */
+    children: ReactNode;
+    /** Footer slot — typically Buttons. Wrapped in `ModalFooter`. */
+    footer?: ReactNode;
+    /** Left footer slot (pagination status, PaginationDots, …). */
+    footerLeading?: ReactNode;
+    /** Footer layout. Figma Modal Footer Type. Default: `2-actions`. */
+    footerType?: ModalFooterType;
+    /** Show divider between body and footer. Default: true. */
+    footerDivider?: boolean;
+}
+/**
+ * Modal dialog shell — composes ModalHeader, scrollable body, and ModalFooter.
+ * Host owns portal, overlay, focus trap, and open/close.
+ */
+export default function Modal({ className, style, size, title, subtitle, subtitlePlacement, hideTitle, showBackButton, onBack, onClose, headerDivider, headerAction, bodyPadding, scrollable, children, footer, footerLeading, footerType, footerDivider, }: ModalProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/modal/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAItD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAE5E,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sCAAsC,CAAC;AAInF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3D,YAAY,EAAE,eAAe,EAAE,sBAAsB,EAAE,CAAC;AAExD,MAAM,WAAW,UAAU;IACzB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iFAAiF;IACjF,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,oFAAoF;IACpF,KAAK,EAAE,SAAS,CAAC;IACjB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,sBAAsB,CAAC;IAC3C,wFAAwF;IACxF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6DAA6D;IAC7D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,iDAAiD;IACjD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,2DAA2D;IAC3D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oBAAoB;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,oEAAoE;IACpE,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,2DAA2D;IAC3D,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,SAAc,EACd,KAAK,EACL,IAAc,EACd,KAAK,EACL,QAAQ,EACR,iBAA2B,EAC3B,SAAiB,EACjB,cAAsB,EACtB,MAAM,EACN,OAAO,EACP,aAAoB,EACpB,YAAY,EACZ,WAAuB,EACvB,UAAiB,EACjB,QAAQ,EACR,MAAM,EACN,aAAa,EACb,UAAwB,EACxB,aAAoB,GACrB,EAAE,UAAU,2CAsDZ"}

package/dist/components/modal/Modal.js

@@ -0,0 +1,75 @@
+import { jsxs as z, jsx as o } from "react/jsx-runtime";
+import { useId as B } from "react";
+import C from "../scrollbar/Scrollbar.js";
+import F from "../modal-footer/ModalFooter.js";
+import g from "../modal-header/ModalHeader.js";
+import { toKebab as H } from "../../utils/string.js";
+import l from "./Modal.module.scss.js";
+function E({
+  className: d = "",
+  style: m,
+  size: t = "small",
+  title: c,
+  subtitle: u,
+  subtitlePlacement: b = "below",
+  hideTitle: f = !1,
+  showBackButton: p = !1,
+  onBack: _,
+  onClose: y,
+  headerDivider: h = !0,
+  headerAction: v,
+  bodyPadding: r = "default",
+  scrollable: j = !0,
+  children: I,
+  footer: a,
+  footerLeading: n,
+  footerType: e = "2-actions",
+  footerDivider: x = !0
+}) {
+  const i = B(), M = l[`modal--size-${H(t)}`], N = [
+    l["modal__body-inner"],
+    r === "menu" && l["modal__body-inner--menu"],
+    r === "none" && l["modal__body-inner--none"]
+  ].filter(Boolean).join(" "), s = /* @__PURE__ */ o("div", { className: N, children: I }), w = a != null || n != null || e === "spacer-small" || e === "spacer-large";
+  return /* @__PURE__ */ z(
+    "div",
+    {
+      className: [l.modal, M, d].filter(Boolean).join(" "),
+      style: m,
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-labelledby": i,
+      children: [
+        /* @__PURE__ */ o(
+          g,
+          {
+            title: c,
+            titleId: i,
+            subtitle: u,
+            subtitlePlacement: b,
+            hideTitle: f,
+            showBackButton: p,
+            onBack: _,
+            onClose: y,
+            divider: h,
+            headerAction: v
+          }
+        ),
+        /* @__PURE__ */ o("div", { className: l.modal__body, children: j ? /* @__PURE__ */ o(C, { children: s }) : s }),
+        w && /* @__PURE__ */ o(
+          F,
+          {
+            type: e,
+            divider: x,
+            leading: n,
+            children: a
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  E as default
+};
+//# sourceMappingURL=Modal.js.map