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

package/dist/components/menu-group-heading/MenuGroupHeading.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuGroupHeading.cjs","sources":["../../../src/components/menu-group-heading/MenuGroupHeading.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './MenuGroupHeading.module.scss';\n\nexport interface MenuGroupHeadingProps extends HTMLAttributes<HTMLDivElement> {\n  /** The section label text. Rendered in all-caps. Accepts translated nodes (e.g. `<FormattedMessage/>`). */\n  label: ReactNode;\n}\n\n/**\n * Menu Group Heading is an optional all-caps label that titles a grouped\n * section of Menu Items inside a dropdown or context menu.\n */\nexport default function MenuGroupHeading({\n  label,\n  className = '',\n  ...rest\n}: MenuGroupHeadingProps) {\n  return (\n    <div\n      className={[styles['menu-group-heading'], className]\n        .filter(Boolean)\n        .join(' ')}\n      {...rest}\n    >\n      <span className={styles['menu-group-heading__label']}>{label}</span>\n    </div>\n  );\n}\n"],"names":["MenuGroupHeading","label","className","rest","jsx","styles"],"mappings":"iMAYA,SAAwBA,EAAiB,CACvC,MAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EAA0B,CACxB,OACEC,EAAAA,IAAC,MAAA,CACC,UAAW,CAACC,UAAO,oBAAoB,EAAGH,CAAS,EAChD,OAAO,OAAO,EACd,KAAK,GAAG,EACV,GAAGC,EAEJ,eAAC,OAAA,CAAK,UAAWE,EAAAA,QAAO,2BAA2B,EAAI,SAAAJ,CAAA,CAAM,CAAA,CAAA,CAGnE"}

package/dist/components/menu-group-heading/MenuGroupHeading.css

@@ -0,0 +1 @@
+._menu-group-heading_ca9me_2{display:flex;align-items:center;padding:var(--spacing-xxs) var(--spacing-xl);background-color:var(--center-channel-bg);width:100%}._menu-group-heading__label_ca9me_9{font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);letter-spacing:.05em;text-transform:uppercase;color:rgba(var(--center-channel-color-rgb),.72);width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

package/dist/components/menu-group-heading/MenuGroupHeading.d.ts

@@ -0,0 +1,11 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface MenuGroupHeadingProps extends HTMLAttributes<HTMLDivElement> {
+    /** The section label text. Rendered in all-caps. Accepts translated nodes (e.g. `<FormattedMessage/>`). */
+    label: ReactNode;
+}
+/**
+ * Menu Group Heading is an optional all-caps label that titles a grouped
+ * section of Menu Items inside a dropdown or context menu.
+ */
+export default function MenuGroupHeading({ label, className, ...rest }: MenuGroupHeadingProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MenuGroupHeading.d.ts.map

package/dist/components/menu-group-heading/MenuGroupHeading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuGroupHeading.d.ts","sourceRoot":"","sources":["../../../src/components/menu-group-heading/MenuGroupHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,2GAA2G;IAC3G,KAAK,EAAE,SAAS,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,SAAc,EACd,GAAG,IAAI,EACR,EAAE,qBAAqB,2CAWvB"}

package/dist/components/menu-group-heading/MenuGroupHeading.js

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+import n from "./MenuGroupHeading.module.scss.js";
+function s({
+  label: r,
+  className: a = "",
+  ...o
+}) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: [n["menu-group-heading"], a].filter(Boolean).join(" "),
+      ...o,
+      children: /* @__PURE__ */ e("span", { className: n["menu-group-heading__label"], children: r })
+    }
+  );
+}
+export {
+  s as default
+};
+//# sourceMappingURL=MenuGroupHeading.js.map

package/dist/components/menu-group-heading/MenuGroupHeading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuGroupHeading.js","sources":["../../../src/components/menu-group-heading/MenuGroupHeading.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './MenuGroupHeading.module.scss';\n\nexport interface MenuGroupHeadingProps extends HTMLAttributes<HTMLDivElement> {\n  /** The section label text. Rendered in all-caps. Accepts translated nodes (e.g. `<FormattedMessage/>`). */\n  label: ReactNode;\n}\n\n/**\n * Menu Group Heading is an optional all-caps label that titles a grouped\n * section of Menu Items inside a dropdown or context menu.\n */\nexport default function MenuGroupHeading({\n  label,\n  className = '',\n  ...rest\n}: MenuGroupHeadingProps) {\n  return (\n    <div\n      className={[styles['menu-group-heading'], className]\n        .filter(Boolean)\n        .join(' ')}\n      {...rest}\n    >\n      <span className={styles['menu-group-heading__label']}>{label}</span>\n    </div>\n  );\n}\n"],"names":["MenuGroupHeading","label","className","rest","jsx","styles"],"mappings":";;AAYA,SAAwBA,EAAiB;AAAA,EACvC,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAA0B;AACxB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAACC,EAAO,oBAAoB,GAAGH,CAAS,EAChD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGC;AAAA,MAEJ,4BAAC,QAAA,EAAK,WAAWE,EAAO,2BAA2B,GAAI,UAAAJ,EAAA,CAAM;AAAA,IAAA;AAAA,EAAA;AAGnE;"}

package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./MenuGroupHeading.css');const e={"menu-group-heading":"_menu-group-heading_ca9me_2","menu-group-heading__label":"_menu-group-heading__label_ca9me_9"};exports.default=e;
+//# sourceMappingURL=MenuGroupHeading.module.scss.cjs.map

package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.cjs.map

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

package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.js

@@ -0,0 +1,8 @@
+import './MenuGroupHeading.css';const e = {
+  "menu-group-heading": "_menu-group-heading_ca9me_2",
+  "menu-group-heading__label": "_menu-group-heading__label_ca9me_9"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=MenuGroupHeading.module.scss.js.map

package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.js.map

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

package/dist/components/menu-group-heading/index.cjs

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

package/dist/components/menu-group-heading/index.cjs.map

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

package/dist/components/menu-group-heading/index.d.ts

@@ -0,0 +1,3 @@
+export { default as MenuGroupHeading } from './MenuGroupHeading';
+export type { MenuGroupHeadingProps } from './MenuGroupHeading';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/menu-group-heading/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/menu-group-heading/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/menu-group-heading/index.js

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

package/dist/components/menu-group-heading/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"),b=require("react"),__q=require("@mattermost/compass-icons/components/emoticon-happy-outline.js"),q=__q?.default??__q,__M=require("@mattermost/compass-icons/components/check.js"),M=__M?.default??__M,s=require("../icon/Icon.cjs"),w=require("../tag/Tag.cjs"),z=require("../mention-badge/MentionBadge.cjs"),l=require("./MenuItem.module.scss.cjs"),d=b.forwardRef(function({label:m,secondaryLabel:t,secondaryLabelPosition:i="below",leadingVisual:r,leadingElement:c=!0,trailingVisual:n,trailingElement:o=!1,customStatusEmoji:u,tag:f=!1,tagLabel:_="NEW",mentionCount:a,destructive:j=!1,active:x=!1,className:h="",disabled:v,type:N="button",...p},g){const I=[l.default["menu-item"],j?l.default["menu-item--destructive"]:"",x?l.default["menu-item--active"]:"",h].filter(Boolean).join(" ");return e.jsx("button",{ref:g,className:I,type:N,disabled:v,...p,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"],"aria-hidden":!0,children:e.jsx(s.IconSlotContext.Provider,{value:{size:"16"},children:r??e.jsx(s.default,{glyph:e.jsx(q,{}),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}),t&&i==="inline"&&e.jsx("span",{className:l.default["menu-item__secondary-label-inline"],children:t}),u&&e.jsx("span",{className:l.default["menu-item__custom-status"],"aria-hidden":!0,children:u}),f&&e.jsx(w.default,{label:_}),a!=null&&a>0&&e.jsx(z.default,{count:a,location:"menu-item",size:"small"})]}),t&&i==="below"&&e.jsx("div",{className:l.default["menu-item__bottom-row"],children:e.jsx("span",{className:l.default["menu-item__secondary-label-below"],children:t})})]}),o&&e.jsx("div",{className:l.default["menu-item__right"],children:e.jsx("span",{className:[l.default["menu-item__trailing-visual"],n?"":l.default["menu-item__trailing-visual--check"]].filter(Boolean).join(" "),children:e.jsx(s.IconSlotContext.Provider,{value:{size:"16"},children:n??e.jsx(s.default,{glyph:e.jsx(M,{}),size:"16"})})})})]})})});d.displayName="MenuItem";exports.default=d;
+//# 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 { forwardRef, type ButtonHTMLAttributes, type 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 { IconSlotContext } from '@/components/icon/Icon';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport type { DataAttributes } from '@/utils/props';\nimport styles from './MenuItem.module.scss';\n\nexport interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Primary label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */\n  label: ReactNode;\n  /** Optional secondary label. */\n  secondaryLabel?: ReactNode;\n  /** Where the secondary label appears. Default: 'below'. */\n  secondaryLabelPosition?: 'inline' | 'below';\n  /**\n   * Custom content for the leading slot. When omitted, shows placeholder icon.\n   * When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides\n   * the correct size via context. A 24px avatar (User Avatar or Team Avatar)\n   * fills the same slot as that icon, so the label stays on the same line.\n   */\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. When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides the correct size via context. */\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  /** Text of the `tag`. Default: \"NEW\". */\n  tagLabel?: ReactNode;\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 * Props a host menu (`Combobox`, `Select`) can set itself on a row: ARIA and\n * selection state, keyboard / pointer handling, and the values it reads from the\n * option object (`label`, `secondaryLabel`, `leadingVisual`, `disabled`). They\n * can't be overridden through `menuItemProps`. This is the full set; each host\n * sets only some of the handlers (`Combobox` uses `onClick`, `Select` uses\n * `onPointerUp`) and passes the other one through. `autoFocus` is excluded too:\n * the host keeps focus on its input / trigger, and a row that grabs focus on\n * mount would take it away.\n */\nexport type MenuItemOwnedProps =\n  | 'id'\n  | 'role'\n  | 'aria-selected'\n  | 'autoFocus'\n  | 'label'\n  | 'secondaryLabel'\n  | 'leadingVisual'\n  | 'leadingElement'\n  | 'trailingElement'\n  | 'disabled'\n  | 'active'\n  | 'children'\n  | 'onClick'\n  | 'onMouseDown'\n  | 'onMouseEnter'\n  | 'onPointerUp';\n\n/**\n * Every `MenuItem` prop a host menu doesn't own (`secondaryLabelPosition`,\n * `trailingVisual`, `tag`, `mentionCount`, `destructive`, `className`, …), so\n * props added to `MenuItem` reach `Combobox` / `Select` rows automatically.\n * `Owned` is the set the host sets itself (default: all of `MenuItemOwnedProps`);\n * a host narrows it so the handlers it doesn't supply can still be passed.\n */\nexport type MenuItemPassthroughProps<\n  Owned extends keyof MenuItemProps = MenuItemOwnedProps,\n> = Partial<Omit<MenuItemProps, Owned>> & DataAttributes;\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 */\nconst MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  {\n    label,\n    secondaryLabel,\n    secondaryLabelPosition = 'below',\n    leadingVisual,\n    leadingElement = true,\n    trailingVisual,\n    trailingElement = false,\n    customStatusEmoji,\n    tag = false,\n    tagLabel = 'NEW',\n    mentionCount,\n    destructive = false,\n    active = false,\n    className = '',\n    disabled,\n    type = 'button',\n    ...rest\n  },\n  ref,\n) {\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\n      ref={ref}\n      className={rootClass}\n      type={type}\n      disabled={disabled}\n      {...rest}\n    >\n      <div className={styles['menu-item__content']}>\n        {leadingElement && (\n          <div className={styles['menu-item__left']}>\n            <span className={styles['menu-item__leading-visual']} aria-hidden>\n              <IconSlotContext.Provider value={{ size: '16' }}>\n                {leadingVisual ?? (\n                  <Icon glyph={<EmoticonHappyOutlineIcon />} size=\"16\" />\n                )}\n              </IconSlotContext.Provider>\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={tagLabel} />}\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              <IconSlotContext.Provider value={{ size: '16' }}>\n                {trailingVisual ?? <Icon glyph={<CheckIcon />} size=\"16\" />}\n              </IconSlotContext.Provider>\n            </span>\n          </div>\n        )}\n      </div>\n    </button>\n  );\n});\n\nMenuItem.displayName = 'MenuItem';\n\nexport default MenuItem;\n"],"names":["MenuItem","forwardRef","label","secondaryLabel","secondaryLabelPosition","leadingVisual","leadingElement","trailingVisual","trailingElement","customStatusEmoji","tag","tagLabel","mentionCount","destructive","active","className","disabled","type","rest","ref","rootClass","styles","jsx","jsxs","IconSlotContext","Icon","EmoticonHappyOutlineIcon","Tag","MentionBadge","CheckIcon"],"mappings":"qbAuFMA,EAAWC,EAAAA,WAA6C,SAC5D,CACE,MAAAC,EACA,eAAAC,EACA,uBAAAC,EAAyB,QACzB,cAAAC,EACA,eAAAC,EAAiB,GACjB,eAAAC,EACA,gBAAAC,EAAkB,GAClB,kBAAAC,EACA,IAAAC,EAAM,GACN,SAAAC,EAAW,MACX,aAAAC,EACA,YAAAC,EAAc,GACd,OAAAC,EAAS,GACT,UAAAC,EAAY,GACZ,SAAAC,EACA,KAAAC,EAAO,SACP,GAAGC,CACL,EACAC,EACA,CACA,MAAMC,EAAY,CAChBC,EAAAA,QAAO,WAAW,EAClBR,EAAcQ,EAAAA,QAAO,wBAAwB,EAAI,GACjDP,EAASO,EAAAA,QAAO,mBAAmB,EAAI,GACvCN,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEO,EAAAA,IAAC,SAAA,CACC,IAAAH,EACA,UAAWC,EACX,KAAAH,EACA,SAAAD,EACC,GAAGE,EAEJ,SAAAK,EAAAA,KAAC,MAAA,CAAI,UAAWF,UAAO,oBAAoB,EACxC,SAAA,CAAAf,GACCgB,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,iBAAiB,EACtC,SAAAC,EAAAA,IAAC,OAAA,CAAK,UAAWD,EAAAA,QAAO,2BAA2B,EAAG,cAAW,GAC/D,eAACG,EAAAA,gBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,YACCF,EAAAA,IAACG,UAAA,CAAK,MAAOH,MAACI,IAAyB,EAAI,KAAK,KAAK,CAAA,CAEzD,EACF,EACF,EAEFH,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,SAAAnB,EAAM,EACnDC,GAAkBC,IAA2B,UAC5CkB,EAAAA,IAAC,QAAK,UAAWD,EAAAA,QAAO,mCAAmC,EACxD,SAAAlB,CAAA,CACH,EAEDM,SACE,OAAA,CAAK,UAAWY,EAAAA,QAAO,0BAA0B,EAAG,cAAW,GAC7D,SAAAZ,CAAA,CACH,EAEDC,GAAOY,EAAAA,IAACK,EAAAA,QAAA,CAAI,MAAOhB,CAAA,CAAU,EAC7BC,GAAgB,MAAQA,EAAe,GACtCU,EAAAA,IAACM,EAAAA,QAAA,CACC,MAAOhB,EACP,SAAS,YACT,KAAK,OAAA,CAAA,CACP,EAEJ,EACCT,GAAkBC,IAA2B,SAC5CkB,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,uBAAuB,EAC5C,SAAAC,MAAC,QAAK,UAAWD,EAAAA,QAAO,kCAAkC,EACvD,WACH,CAAA,CACF,CAAA,EAEJ,EACCb,GACCc,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,kBAAkB,EACvC,SAAAC,EAAAA,IAAC,OAAA,CACC,UAAW,CACTD,EAAAA,QAAO,4BAA4B,EAClCd,EAEG,GADAc,UAAO,mCAAmC,CAC1C,EAEH,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,eAACG,EAAAA,gBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,SAAAjB,GAAkBe,EAAAA,IAACG,EAAAA,SAAK,MAAOH,MAACO,IAAU,EAAI,KAAK,KAAK,CAAA,CAC3D,CAAA,CAAA,CACF,CACF,CAAA,CAAA,CAEJ,CAAA,CAAA,CAGN,CAAC,EAED7B,EAAS,YAAc"}

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

@@ -0,0 +1 @@
+._menu-item_1nie0_2{display:flex;flex-direction:column;align-items:flex-start;padding:var(--spacing-xxs) var(--spacing-l);background-color:var(--center-channel-bg);border:none;width:100%;text-align:left;cursor:pointer;font-family:var(--font-family-body);color:var(--center-channel-color);transition:background-color var(--duration-quick) var(--ease-transition),box-shadow var(--duration-quick) var(--ease-transition),color var(--duration-quick) var(--ease-transition)}._menu-item_1nie0_2:focus-visible{outline:none;background-color:var(--center-channel-bg);box-shadow:inset 0 0 0 2px var(--sidebar-text-active-border)}._menu-item_1nie0_2:hover:not(:disabled){background-color:rgba(var(--center-channel-color-rgb),.08)}._menu-item_1nie0_2:active:not(:disabled){background-color:rgba(var(--button-bg-rgb),.08)}._menu-item--active_1nie0_27:not(:disabled){background-color:rgba(var(--button-bg-rgb),.08)}._menu-item--active_1nie0_27:not(:disabled) ._menu-item__leading-visual_1nie0_30,._menu-item--active_1nie0_27:not(:disabled) ._menu-item__trailing-visual_1nie0_31{color:rgba(var(--center-channel-color-rgb),.72)}._menu-item--active_1nie0_27:hover:not(:disabled){background-color:rgba(var(--button-bg-rgb),.12)}._menu-item--active_1nie0_27:focus-visible:not(:disabled){background-color:rgba(var(--button-bg-rgb),.08);box-shadow:inset 0 0 0 2px var(--sidebar-text-active-border)}._menu-item_1nie0_2:disabled{cursor:not-allowed}._menu-item_1nie0_2:disabled ._menu-item__content_1nie0_44{opacity:.4}._menu-item__content_1nie0_44{display:flex;gap:var(--spacing-xxs);align-items:flex-start;width:100%}._menu-item__left_1nie0_53{display:flex;align-items:center;flex-shrink:0}._menu-item__leading-visual_1nie0_30,._menu-item__trailing-visual_1nie0_31{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:rgba(var(--center-channel-color-rgb),.64)}._menu-item__leading-visual_1nie0_30{box-sizing:border-box;min-width:calc(var(--icon-size-16) + var(--spacing-xxxs) * 2);min-height:calc(var(--icon-size-16) + var(--spacing-xxxs) * 2)}._menu-item__trailing-visual_1nie0_31{padding:var(--spacing-xxxs)}._menu-item__trailing-visual_1nie0_31 kbd{padding:0;background:transparent;font-weight:var(--font-weight-regular);color:rgba(var(--center-channel-color-rgb),.72)}._menu-item__trailing-visual_1nie0_31 kbd+kbd{margin-inline-start:var(--spacing-xxxs)}._menu-item__trailing-visual--check_1nie0_82{color:var(--button-bg)}._menu-item__middle_1nie0_85{align-self:stretch;flex:1 0 0;min-width:0;display:flex;flex-direction:column;gap:var(--menu-item-label-gap, var(--spacing-xxxs));align-items:flex-start;justify-content:center;padding-top:var(--spacing-xxxxs);padding-bottom:var(--spacing-xxxxs)}._menu-item__top-row_1nie0_97{display:flex;gap:var(--spacing-xs);align-items:center;padding-inline:var(--spacing-xxxs);width:100%;flex-shrink:0}._menu-item__label_1nie0_105{font-size:var(--font-size-100);line-height:var(--line-height-100);font-weight:var(--font-weight-regular);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}._menu-item__secondary-label-inline_1nie0_114{font-size:var(--font-size-75);line-height:var(--line-height-75);font-weight:var(--font-weight-regular);opacity:.75;white-space:nowrap;flex-shrink:0}._menu-item__bottom-row_1nie0_122{display:flex;align-items:center;padding:0 var(--spacing-xxxs) var(--spacing-xxxxs);width:100%;flex-shrink:0}._menu-item__secondary-label-below_1nie0_129{display:flex;align-items:center;font-size:var(--font-size-75);line-height:var(--line-height-75);font-weight:var(--font-weight-regular);opacity:.75;flex:1 0 0;min-width:0;text-align:left}._menu-item__custom-status_1nie0_140{display:flex;align-items:center;font-size:var(--font-size-200);line-height:1;flex-shrink:0;opacity:.8;-webkit-user-select:none;user-select:none}._menu-item__right_1nie0_149{align-self:center;display:flex;align-items:center;justify-content:flex-end;flex-shrink:0;height:var(--spacing-xxl)}._menu-item--destructive_1nie0_157,._menu-item--destructive_1nie0_157 ._menu-item__leading-visual_1nie0_30,._menu-item--destructive_1nie0_157 ._menu-item__trailing-visual_1nie0_31,._menu-item--destructive_1nie0_157 ._menu-item__trailing-visual_1nie0_31 kbd{color:var(--error-text, var(--color-danger))}._menu-item--destructive_1nie0_157:hover:not(:disabled){background-color:var(--error-text, var(--color-danger));color:var(--button-color)}._menu-item--destructive_1nie0_157:hover:not(:disabled) ._menu-item__leading-visual_1nie0_30,._menu-item--destructive_1nie0_157:hover:not(:disabled) ._menu-item__trailing-visual_1nie0_31,._menu-item--destructive_1nie0_157:hover:not(:disabled) ._menu-item__trailing-visual_1nie0_31 kbd{color:inherit}._menu-item--destructive_1nie0_157:active:not(:disabled){background:linear-gradient(0deg,rgba(var(--button-color-rgb),.1),rgba(var(--button-color-rgb),.1)),var(--error-text, var(--color-danger));color:var(--button-color)}._menu-item--destructive_1nie0_157:active:not(:disabled) ._menu-item__leading-visual_1nie0_30,._menu-item--destructive_1nie0_157:active:not(:disabled) ._menu-item__trailing-visual_1nie0_31,._menu-item--destructive_1nie0_157:active:not(:disabled) ._menu-item__trailing-visual_1nie0_31 kbd{color:inherit}._menu-item--destructive_1nie0_157:focus-visible{background-color:var(--error-text, var(--color-danger));box-shadow:inset 0 0 0 2px rgba(var(--button-color-rgb),.6);color:var(--button-color)}._menu-item--destructive_1nie0_157:focus-visible ._menu-item__leading-visual_1nie0_30,._menu-item--destructive_1nie0_157:focus-visible ._menu-item__trailing-visual_1nie0_31,._menu-item--destructive_1nie0_157:focus-visible ._menu-item__trailing-visual_1nie0_31 kbd{color:inherit}

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

@@ -0,0 +1,61 @@
+import { ButtonHTMLAttributes, ReactNode } from 'react';
+import { DataAttributes } from '../../utils/props';
+export interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Primary label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */
+    label: ReactNode;
+    /** Optional secondary label. */
+    secondaryLabel?: ReactNode;
+    /** Where the secondary label appears. Default: 'below'. */
+    secondaryLabelPosition?: 'inline' | 'below';
+    /**
+     * Custom content for the leading slot. When omitted, shows placeholder icon.
+     * When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides
+     * the correct size via context. A 24px avatar (User Avatar or Team Avatar)
+     * fills the same slot as that icon, so the label stays on the same line.
+     */
+    leadingVisual?: ReactNode;
+    /** Show the leading visual slot. Default: true. */
+    leadingElement?: boolean;
+    /** Custom content for the trailing slot. When omitted with trailingElement=true, shows check icon. When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides the correct size via context. */
+    trailingVisual?: ReactNode;
+    /** Show the trailing visual slot. Default: false. */
+    trailingElement?: boolean;
+    /** Emoji character for custom status, shown inline after the label. */
+    customStatusEmoji?: string;
+    /** Show "NEW" label tag. */
+    tag?: boolean;
+    /** Text of the `tag`. Default: "NEW". */
+    tagLabel?: ReactNode;
+    /** Inline mention count badge. */
+    mentionCount?: number;
+    /** Destructive (danger) styling. */
+    destructive?: boolean;
+    /** Highlight row (e.g. submenu parent while child menu is open). */
+    active?: boolean;
+}
+/**
+ * Props a host menu (`Combobox`, `Select`) can set itself on a row: ARIA and
+ * selection state, keyboard / pointer handling, and the values it reads from the
+ * option object (`label`, `secondaryLabel`, `leadingVisual`, `disabled`). They
+ * can't be overridden through `menuItemProps`. This is the full set; each host
+ * sets only some of the handlers (`Combobox` uses `onClick`, `Select` uses
+ * `onPointerUp`) and passes the other one through. `autoFocus` is excluded too:
+ * the host keeps focus on its input / trigger, and a row that grabs focus on
+ * mount would take it away.
+ */
+export type MenuItemOwnedProps = 'id' | 'role' | 'aria-selected' | 'autoFocus' | 'label' | 'secondaryLabel' | 'leadingVisual' | 'leadingElement' | 'trailingElement' | 'disabled' | 'active' | 'children' | 'onClick' | 'onMouseDown' | 'onMouseEnter' | 'onPointerUp';
+/**
+ * Every `MenuItem` prop a host menu doesn't own (`secondaryLabelPosition`,
+ * `trailingVisual`, `tag`, `mentionCount`, `destructive`, `className`, …), so
+ * props added to `MenuItem` reach `Combobox` / `Select` rows automatically.
+ * `Owned` is the set the host sets itself (default: all of `MenuItemOwnedProps`);
+ * a host narrows it so the handlers it doesn't supply can still be passed.
+ */
+export type MenuItemPassthroughProps<Owned extends keyof MenuItemProps = MenuItemOwnedProps> = Partial<Omit<MenuItemProps, Owned>> & DataAttributes;
+/**
+ * Menu Items are the rows inside a Menu — the smallest selectable unit in any dropdown,
+ * kebab, or context menu. One label, optional supporting visuals, and a clear hit target.
+ */
+declare const MenuItem: import('react').ForwardRefExoticComponent<MenuItemProps & import('react').RefAttributes<HTMLButtonElement>>;
+export default MenuItem;
+//# sourceMappingURL=MenuItem.d.ts.map

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,EAAc,KAAK,oBAAoB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAO9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAGpD,MAAM,WAAW,aAAc,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC5E,4EAA4E;IAC5E,KAAK,EAAE,SAAS,CAAC;IACjB,gCAAgC;IAChC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,2DAA2D;IAC3D,sBAAsB,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;OAKG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,mDAAmD;IACnD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kNAAkN;IAClN,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,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,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;;;;;;;;;GASG;AACH,MAAM,MAAM,kBAAkB,GAC1B,IAAI,GACJ,MAAM,GACN,eAAe,GACf,WAAW,GACX,OAAO,GACP,gBAAgB,GAChB,eAAe,GACf,gBAAgB,GAChB,iBAAiB,GACjB,UAAU,GACV,QAAQ,GACR,UAAU,GACV,SAAS,GACT,aAAa,GACb,cAAc,GACd,aAAa,CAAC;AAElB;;;;;;GAMG;AACH,MAAM,MAAM,wBAAwB,CAClC,KAAK,SAAS,MAAM,aAAa,GAAG,kBAAkB,IACpD,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,GAAG,cAAc,CAAC;AAEzD;;;GAGG;AACH,QAAA,MAAM,QAAQ,6GAsGZ,CAAC;AAIH,eAAe,QAAQ,CAAC"}

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

@@ -0,0 +1,79 @@
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { forwardRef as x } from "react";
+import __M from "@mattermost/compass-icons/components/emoticon-happy-outline.js";const M=__M&&__M.default?__M.default:__M;
+import __j from "@mattermost/compass-icons/components/check.js";const j=__j&&__j.default?__j.default:__j;
+import r, { IconSlotContext as o } from "../icon/Icon.js";
+import y from "../tag/Tag.js";
+import B from "../mention-badge/MentionBadge.js";
+import i from "./MenuItem.module.scss.js";
+const k = x(function({
+  label: c,
+  secondaryLabel: m,
+  secondaryLabelPosition: t = "below",
+  leadingVisual: u,
+  leadingElement: d = !0,
+  trailingVisual: a,
+  trailingElement: _ = !1,
+  customStatusEmoji: s,
+  tag: h = !1,
+  tagLabel: p = "NEW",
+  mentionCount: l,
+  destructive: f = !1,
+  active: v = !1,
+  className: N = "",
+  disabled: g,
+  type: I = "button",
+  ...b
+}, w) {
+  const z = [
+    i["menu-item"],
+    f ? i["menu-item--destructive"] : "",
+    v ? i["menu-item--active"] : "",
+    N
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      ref: w,
+      className: z,
+      type: I,
+      disabled: g,
+      ...b,
+      children: /* @__PURE__ */ n("div", { className: i["menu-item__content"], children: [
+        d && /* @__PURE__ */ e("div", { className: i["menu-item__left"], children: /* @__PURE__ */ e("span", { className: i["menu-item__leading-visual"], "aria-hidden": !0, children: /* @__PURE__ */ e(o.Provider, { value: { size: "16" }, children: u ?? /* @__PURE__ */ e(r, { glyph: /* @__PURE__ */ e(M, {}), size: "16" }) }) }) }),
+        /* @__PURE__ */ n("div", { className: i["menu-item__middle"], children: [
+          /* @__PURE__ */ n("div", { className: i["menu-item__top-row"], children: [
+            /* @__PURE__ */ e("span", { className: i["menu-item__label"], children: c }),
+            m && t === "inline" && /* @__PURE__ */ e("span", { className: i["menu-item__secondary-label-inline"], children: m }),
+            s && /* @__PURE__ */ e("span", { className: i["menu-item__custom-status"], "aria-hidden": !0, children: s }),
+            h && /* @__PURE__ */ e(y, { label: p }),
+            l != null && l > 0 && /* @__PURE__ */ e(
+              B,
+              {
+                count: l,
+                location: "menu-item",
+                size: "small"
+              }
+            )
+          ] }),
+          m && t === "below" && /* @__PURE__ */ e("div", { className: i["menu-item__bottom-row"], children: /* @__PURE__ */ e("span", { className: i["menu-item__secondary-label-below"], children: m }) })
+        ] }),
+        _ && /* @__PURE__ */ e("div", { className: i["menu-item__right"], children: /* @__PURE__ */ e(
+          "span",
+          {
+            className: [
+              i["menu-item__trailing-visual"],
+              a ? "" : i["menu-item__trailing-visual--check"]
+            ].filter(Boolean).join(" "),
+            children: /* @__PURE__ */ e(o.Provider, { value: { size: "16" }, children: a ?? /* @__PURE__ */ e(r, { glyph: /* @__PURE__ */ e(j, {}), size: "16" }) })
+          }
+        ) })
+      ] })
+    }
+  );
+});
+k.displayName = "MenuItem";
+export {
+  k as default
+};
+//# sourceMappingURL=MenuItem.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.js","sources":["../../../src/components/menu-item/MenuItem.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes, type 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 { IconSlotContext } from '@/components/icon/Icon';\nimport Tag from '@/components/tag/Tag';\nimport MentionBadge from '@/components/mention-badge/MentionBadge';\nimport type { DataAttributes } from '@/utils/props';\nimport styles from './MenuItem.module.scss';\n\nexport interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Primary label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */\n  label: ReactNode;\n  /** Optional secondary label. */\n  secondaryLabel?: ReactNode;\n  /** Where the secondary label appears. Default: 'below'. */\n  secondaryLabelPosition?: 'inline' | 'below';\n  /**\n   * Custom content for the leading slot. When omitted, shows placeholder icon.\n   * When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides\n   * the correct size via context. A 24px avatar (User Avatar or Team Avatar)\n   * fills the same slot as that icon, so the label stays on the same line.\n   */\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. When passing an icon, use `<Icon glyph={<SomeIcon />} />` — MenuItem provides the correct size via context. */\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  /** Text of the `tag`. Default: \"NEW\". */\n  tagLabel?: ReactNode;\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 * Props a host menu (`Combobox`, `Select`) can set itself on a row: ARIA and\n * selection state, keyboard / pointer handling, and the values it reads from the\n * option object (`label`, `secondaryLabel`, `leadingVisual`, `disabled`). They\n * can't be overridden through `menuItemProps`. This is the full set; each host\n * sets only some of the handlers (`Combobox` uses `onClick`, `Select` uses\n * `onPointerUp`) and passes the other one through. `autoFocus` is excluded too:\n * the host keeps focus on its input / trigger, and a row that grabs focus on\n * mount would take it away.\n */\nexport type MenuItemOwnedProps =\n  | 'id'\n  | 'role'\n  | 'aria-selected'\n  | 'autoFocus'\n  | 'label'\n  | 'secondaryLabel'\n  | 'leadingVisual'\n  | 'leadingElement'\n  | 'trailingElement'\n  | 'disabled'\n  | 'active'\n  | 'children'\n  | 'onClick'\n  | 'onMouseDown'\n  | 'onMouseEnter'\n  | 'onPointerUp';\n\n/**\n * Every `MenuItem` prop a host menu doesn't own (`secondaryLabelPosition`,\n * `trailingVisual`, `tag`, `mentionCount`, `destructive`, `className`, …), so\n * props added to `MenuItem` reach `Combobox` / `Select` rows automatically.\n * `Owned` is the set the host sets itself (default: all of `MenuItemOwnedProps`);\n * a host narrows it so the handlers it doesn't supply can still be passed.\n */\nexport type MenuItemPassthroughProps<\n  Owned extends keyof MenuItemProps = MenuItemOwnedProps,\n> = Partial<Omit<MenuItemProps, Owned>> & DataAttributes;\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 */\nconst MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  {\n    label,\n    secondaryLabel,\n    secondaryLabelPosition = 'below',\n    leadingVisual,\n    leadingElement = true,\n    trailingVisual,\n    trailingElement = false,\n    customStatusEmoji,\n    tag = false,\n    tagLabel = 'NEW',\n    mentionCount,\n    destructive = false,\n    active = false,\n    className = '',\n    disabled,\n    type = 'button',\n    ...rest\n  },\n  ref,\n) {\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\n      ref={ref}\n      className={rootClass}\n      type={type}\n      disabled={disabled}\n      {...rest}\n    >\n      <div className={styles['menu-item__content']}>\n        {leadingElement && (\n          <div className={styles['menu-item__left']}>\n            <span className={styles['menu-item__leading-visual']} aria-hidden>\n              <IconSlotContext.Provider value={{ size: '16' }}>\n                {leadingVisual ?? (\n                  <Icon glyph={<EmoticonHappyOutlineIcon />} size=\"16\" />\n                )}\n              </IconSlotContext.Provider>\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={tagLabel} />}\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              <IconSlotContext.Provider value={{ size: '16' }}>\n                {trailingVisual ?? <Icon glyph={<CheckIcon />} size=\"16\" />}\n              </IconSlotContext.Provider>\n            </span>\n          </div>\n        )}\n      </div>\n    </button>\n  );\n});\n\nMenuItem.displayName = 'MenuItem';\n\nexport default MenuItem;\n"],"names":["MenuItem","forwardRef","label","secondaryLabel","secondaryLabelPosition","leadingVisual","leadingElement","trailingVisual","trailingElement","customStatusEmoji","tag","tagLabel","mentionCount","destructive","active","className","disabled","type","rest","ref","rootClass","styles","jsx","jsxs","IconSlotContext","Icon","EmoticonHappyOutlineIcon","Tag","MentionBadge","CheckIcon"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./MenuItem.css');const e={"menu-item":"_menu-item_1nie0_2","menu-item--active":"_menu-item--active_1nie0_27","menu-item__leading-visual":"_menu-item__leading-visual_1nie0_30","menu-item__trailing-visual":"_menu-item__trailing-visual_1nie0_31","menu-item__content":"_menu-item__content_1nie0_44","menu-item__left":"_menu-item__left_1nie0_53","menu-item__trailing-visual--check":"_menu-item__trailing-visual--check_1nie0_82","menu-item__middle":"_menu-item__middle_1nie0_85","menu-item__top-row":"_menu-item__top-row_1nie0_97","menu-item__label":"_menu-item__label_1nie0_105","menu-item__secondary-label-inline":"_menu-item__secondary-label-inline_1nie0_114","menu-item__bottom-row":"_menu-item__bottom-row_1nie0_122","menu-item__secondary-label-below":"_menu-item__secondary-label-below_1nie0_129","menu-item__custom-status":"_menu-item__custom-status_1nie0_140","menu-item__right":"_menu-item__right_1nie0_149","menu-item--destructive":"_menu-item--destructive_1nie0_157"};exports.default=e;
+//# sourceMappingURL=MenuItem.module.scss.cjs.map

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

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

package/dist/components/menu-item/MenuItem.module.scss.js

@@ -0,0 +1,22 @@
+import './MenuItem.css';const e = {
+  "menu-item": "_menu-item_1nie0_2",
+  "menu-item--active": "_menu-item--active_1nie0_27",
+  "menu-item__leading-visual": "_menu-item__leading-visual_1nie0_30",
+  "menu-item__trailing-visual": "_menu-item__trailing-visual_1nie0_31",
+  "menu-item__content": "_menu-item__content_1nie0_44",
+  "menu-item__left": "_menu-item__left_1nie0_53",
+  "menu-item__trailing-visual--check": "_menu-item__trailing-visual--check_1nie0_82",
+  "menu-item__middle": "_menu-item__middle_1nie0_85",
+  "menu-item__top-row": "_menu-item__top-row_1nie0_97",
+  "menu-item__label": "_menu-item__label_1nie0_105",
+  "menu-item__secondary-label-inline": "_menu-item__secondary-label-inline_1nie0_114",
+  "menu-item__bottom-row": "_menu-item__bottom-row_1nie0_122",
+  "menu-item__secondary-label-below": "_menu-item__secondary-label-below_1nie0_129",
+  "menu-item__custom-status": "_menu-item__custom-status_1nie0_140",
+  "menu-item__right": "_menu-item__right_1nie0_149",
+  "menu-item--destructive": "_menu-item--destructive_1nie0_157"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=MenuItem.module.scss.js.map

package/dist/components/menu-item/MenuItem.module.scss.js.map

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

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

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

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

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

package/dist/components/menu-item/index.d.ts

@@ -0,0 +1,3 @@
+export { default as MenuItem } from './MenuItem';
+export type { MenuItemProps, MenuItemOwnedProps, MenuItemPassthroughProps, } from './MenuItem';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/menu-item/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EACV,aAAa,EACb,kBAAkB,EAClB,wBAAwB,GACzB,MAAM,YAAY,CAAC"}

package/dist/components/menu-item/index.js

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

package/dist/components/menu-item/index.js.map

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

package/dist/components/message-actions/MessageActions.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),n=require("../emoji/Emoji.cjs"),a=require("../icon-button/IconButton.cjs"),s=require("../icon/Icon.cjs"),__F=require("@mattermost/compass-icons/components/emoticon-plus-outline.js"),F=__F?.default??__F,__c=require("@mattermost/compass-icons/components/dots-horizontal.js"),c=__c?.default??__c,__u=require("@mattermost/compass-icons/components/bookmark-outline.js"),u=__u?.default??__u,__k=require("@mattermost/compass-icons/components/creation-outline.js"),k=__k?.default??__k,__v=require("@mattermost/compass-icons/components/apps.js"),v=__v?.default??__v,__j=require("@mattermost/compass-icons/components/reply-outline.js"),j=__j?.default??__j,m=require("./MessageActions.module.scss.cjs");function A({type:l="center-channel",visible:p=!0,collapsedReplyThreads:x=!0,quickReactions:g=!0,className:f="",toolbarLabel:h="Message actions",reactThumbsUpLabel:z="React with thumbs up",reactRaisedHandsLabel:b="React with raised hands",reactOkHandLabel:q="React with OK hand",addReactionLabel:y="Add reaction",moreActionsLabel:i="More actions",saveLabel:o="Save message",aiActionsLabel:I="AI actions",pluginActionsLabel:R="Plugin actions",replyLabel:r="Reply in thread",jumpLabel:M="Jump",jumpAriaLabel:O="Jump to message",...S}){if(!p)return null;const d=l==="center-channel",_=l==="rhs",t=l==="search-results",w=g&&x,C=[m.default["message-actions"],f].filter(Boolean).join(" ");return e.jsxs("div",{className:C,role:"toolbar","aria-label":h,...S,children:[w&&!t&&e.jsxs(e.Fragment,{children:[e.jsx(a.default,{"aria-label":z,size:"small",padding:"compact",icon:e.jsx(n.default,{emoji:"👍",size:"16"})}),d&&e.jsxs(e.Fragment,{children:[e.jsx(a.default,{"aria-label":b,size:"small",padding:"compact",icon:e.jsx(n.default,{emoji:"🙌",size:"16"})}),e.jsx(a.default,{"aria-label":q,size:"small",padding:"compact",icon:e.jsx(n.default,{emoji:"👌",size:"16"})})]}),e.jsx(a.default,{"aria-label":y,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(F,{})})})]}),t&&e.jsx(a.default,{"aria-label":i,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(c,{})})}),d&&e.jsxs(e.Fragment,{children:[e.jsx(a.default,{"aria-label":o,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(u,{})})}),e.jsx(a.default,{"aria-label":I,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(k,{})})}),e.jsx(a.default,{"aria-label":R,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(v,{})})}),e.jsx(a.default,{"aria-label":r,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(j,{})})}),e.jsx(a.default,{"aria-label":i,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(c,{})})})]}),_&&e.jsx(a.default,{"aria-label":i,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(c,{})})}),t&&e.jsxs(e.Fragment,{children:[e.jsx(a.default,{"aria-label":o,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(u,{})})}),e.jsx(a.default,{"aria-label":r,size:"small",padding:"compact",icon:e.jsx(s.default,{size:"16",glyph:e.jsx(j,{})})}),e.jsx("button",{type:"button",className:m.default["message-actions__jump"],"aria-label":O,children:M})]})]})}exports.default=A;
+//# sourceMappingURL=MessageActions.cjs.map

package/dist/components/message-actions/MessageActions.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageActions.cjs","sources":["../../../src/components/message-actions/MessageActions.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\nimport Emoji from '@/components/emoji/Emoji';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport EmoticonPlusOutlineIcon from '@mattermost/compass-icons/components/emoticon-plus-outline';\nimport DotsHorizontalIcon from '@mattermost/compass-icons/components/dots-horizontal';\nimport BookmarkOutlineIcon from '@mattermost/compass-icons/components/bookmark-outline';\nimport CreationOutlineIcon from '@mattermost/compass-icons/components/creation-outline';\nimport AppsIcon from '@mattermost/compass-icons/components/apps';\nimport ReplyOutlineIcon from '@mattermost/compass-icons/components/reply-outline';\nimport styles from './MessageActions.module.scss';\n\nexport type MessageActionsType = 'center-channel' | 'rhs' | 'search-results';\n\nexport interface MessageActionsProps extends HTMLAttributes<HTMLDivElement> {\n  /** Context variant. Default: Center Channel. */\n  type?: MessageActionsType;\n  /** Whether the hover toolbar is visible. Default: true. */\n  visible?: boolean;\n  /** Whether collapsed reply threads feature is on. Default: true. */\n  collapsedReplyThreads?: boolean;\n  /** Whether quick reactions are shown. Default: true. */\n  quickReactions?: boolean;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Accessible name for the toolbar. Default: \"Message actions\". An explicit `aria-label` still wins. */\n  toolbarLabel?: string;\n  /** Default: \"React with thumbs up\". */\n  reactThumbsUpLabel?: string;\n  /** Default: \"React with raised hands\". */\n  reactRaisedHandsLabel?: string;\n  /** Default: \"React with OK hand\". */\n  reactOkHandLabel?: string;\n  /** Default: \"Add reaction\". */\n  addReactionLabel?: string;\n  /** Default: \"More actions\". */\n  moreActionsLabel?: string;\n  /** Default: \"Save message\". */\n  saveLabel?: string;\n  /** Default: \"AI actions\". */\n  aiActionsLabel?: string;\n  /** Default: \"Plugin actions\". */\n  pluginActionsLabel?: string;\n  /** Default: \"Reply in thread\". */\n  replyLabel?: string;\n  /** Visible Jump button text (search results). Default: \"Jump\". */\n  jumpLabel?: ReactNode;\n  /** Accessible name for the Jump button. Default: \"Jump to message\". */\n  jumpAriaLabel?: string;\n}\n\n/**\n * Message Actions is the floating toolbar that appears on a message when you hover, tab, or\n * long-press it. It bundles the most common per-message actions — react, save, reply, more —\n * into a small, context-aware row that hovers above the post.\n */\nexport default function MessageActions({\n  type = 'center-channel',\n  visible = true,\n  collapsedReplyThreads = true,\n  quickReactions = true,\n  className = '',\n  toolbarLabel = 'Message actions',\n  reactThumbsUpLabel = 'React with thumbs up',\n  reactRaisedHandsLabel = 'React with raised hands',\n  reactOkHandLabel = 'React with OK hand',\n  addReactionLabel = 'Add reaction',\n  moreActionsLabel = 'More actions',\n  saveLabel = 'Save message',\n  aiActionsLabel = 'AI actions',\n  pluginActionsLabel = 'Plugin actions',\n  replyLabel = 'Reply in thread',\n  jumpLabel = 'Jump',\n  jumpAriaLabel = 'Jump to message',\n  ...rest\n}: MessageActionsProps) {\n  if (!visible) return null;\n\n  const isCenterChannel = type === 'center-channel';\n  const isRHS = type === 'rhs';\n  const isSearchResults = type === 'search-results';\n  const showQuickReactions = quickReactions && collapsedReplyThreads;\n\n  const rootClass = [styles['message-actions'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div\n      className={rootClass}\n      role=\"toolbar\"\n      aria-label={toolbarLabel}\n      {...rest}\n    >\n      {/* Quick reaction emojis — center channel + RHS */}\n      {showQuickReactions && !isSearchResults && (\n        <>\n          <IconButton\n            aria-label={reactThumbsUpLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Emoji emoji=\"👍\" size=\"16\" />}\n          />\n          {isCenterChannel && (\n            <>\n              <IconButton\n                aria-label={reactRaisedHandsLabel}\n                size=\"small\"\n                padding=\"compact\"\n                icon={<Emoji emoji=\"🙌\" size=\"16\" />}\n              />\n              <IconButton\n                aria-label={reactOkHandLabel}\n                size=\"small\"\n                padding=\"compact\"\n                icon={<Emoji emoji=\"👌\" size=\"16\" />}\n              />\n            </>\n          )}\n          <IconButton\n            aria-label={addReactionLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<EmoticonPlusOutlineIcon />} />}\n          />\n        </>\n      )}\n\n      {/* Search results only: more button first */}\n      {isSearchResults && (\n        <IconButton\n          aria-label={moreActionsLabel}\n          size=\"small\"\n          padding=\"compact\"\n          icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n        />\n      )}\n\n      {/* Center channel actions */}\n      {isCenterChannel && (\n        <>\n          <IconButton\n            aria-label={saveLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<BookmarkOutlineIcon />} />}\n          />\n          <IconButton\n            aria-label={aiActionsLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<CreationOutlineIcon />} />}\n          />\n          <IconButton\n            aria-label={pluginActionsLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<AppsIcon />} />}\n          />\n          <IconButton\n            aria-label={replyLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<ReplyOutlineIcon />} />}\n          />\n          <IconButton\n            aria-label={moreActionsLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n          />\n        </>\n      )}\n\n      {/* RHS actions */}\n      {isRHS && (\n        <IconButton\n          aria-label={moreActionsLabel}\n          size=\"small\"\n          padding=\"compact\"\n          icon={<Icon size=\"16\" glyph={<DotsHorizontalIcon />} />}\n        />\n      )}\n\n      {/* Search results additional buttons */}\n      {isSearchResults && (\n        <>\n          <IconButton\n            aria-label={saveLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<BookmarkOutlineIcon />} />}\n          />\n          <IconButton\n            aria-label={replyLabel}\n            size=\"small\"\n            padding=\"compact\"\n            icon={<Icon size=\"16\" glyph={<ReplyOutlineIcon />} />}\n          />\n          <button\n            type=\"button\"\n            className={styles['message-actions__jump']}\n            aria-label={jumpAriaLabel}\n          >\n            {jumpLabel}\n          </button>\n        </>\n      )}\n    </div>\n  );\n}\n"],"names":["MessageActions","type","visible","collapsedReplyThreads","quickReactions","className","toolbarLabel","reactThumbsUpLabel","reactRaisedHandsLabel","reactOkHandLabel","addReactionLabel","moreActionsLabel","saveLabel","aiActionsLabel","pluginActionsLabel","replyLabel","jumpLabel","jumpAriaLabel","rest","isCenterChannel","isRHS","isSearchResults","showQuickReactions","rootClass","styles","jsxs","Fragment","jsx","IconButton","Emoji","Icon","EmoticonPlusOutlineIcon","DotsHorizontalIcon","BookmarkOutlineIcon","CreationOutlineIcon","AppsIcon","ReplyOutlineIcon"],"mappings":"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"}

package/dist/components/message-actions/MessageActions.css

@@ -0,0 +1 @@
+._message-actions_1ie92_2{display:inline-flex;align-items:center;gap:0;padding:var(--spacing-xxxxs);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)}._message-actions__jump_1ie92_12{display:inline-flex;align-items:center;justify-content:center;height:28px;padding:0 var(--spacing-xs);border:none;border-radius:var(--radius-s);background-color:transparent;color:rgba(var(--center-channel-color-rgb),.64);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),color var(--duration-quick) var(--ease-transition)}._message-actions__jump_1ie92_12:hover{background-color:rgba(var(--center-channel-color-rgb),.08);color:var(--center-channel-color)}._message-actions__jump_1ie92_12:focus-visible{outline:2px solid var(--link-color);outline-offset:-1px}

package/dist/components/message-actions/MessageActions.d.ts

@@ -0,0 +1,45 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export type MessageActionsType = 'center-channel' | 'rhs' | 'search-results';
+export interface MessageActionsProps extends HTMLAttributes<HTMLDivElement> {
+    /** Context variant. Default: Center Channel. */
+    type?: MessageActionsType;
+    /** Whether the hover toolbar is visible. Default: true. */
+    visible?: boolean;
+    /** Whether collapsed reply threads feature is on. Default: true. */
+    collapsedReplyThreads?: boolean;
+    /** Whether quick reactions are shown. Default: true. */
+    quickReactions?: boolean;
+    /** Optional CSS class name. */
+    className?: string;
+    /** Accessible name for the toolbar. Default: "Message actions". An explicit `aria-label` still wins. */
+    toolbarLabel?: string;
+    /** Default: "React with thumbs up". */
+    reactThumbsUpLabel?: string;
+    /** Default: "React with raised hands". */
+    reactRaisedHandsLabel?: string;
+    /** Default: "React with OK hand". */
+    reactOkHandLabel?: string;
+    /** Default: "Add reaction". */
+    addReactionLabel?: string;
+    /** Default: "More actions". */
+    moreActionsLabel?: string;
+    /** Default: "Save message". */
+    saveLabel?: string;
+    /** Default: "AI actions". */
+    aiActionsLabel?: string;
+    /** Default: "Plugin actions". */
+    pluginActionsLabel?: string;
+    /** Default: "Reply in thread". */
+    replyLabel?: string;
+    /** Visible Jump button text (search results). Default: "Jump". */
+    jumpLabel?: ReactNode;
+    /** Accessible name for the Jump button. Default: "Jump to message". */
+    jumpAriaLabel?: string;
+}
+/**
+ * Message Actions is the floating toolbar that appears on a message when you hover, tab, or
+ * long-press it. It bundles the most common per-message actions — react, save, reply, more —
+ * into a small, context-aware row that hovers above the post.
+ */
+export default function MessageActions({ type, visible, collapsedReplyThreads, quickReactions, className, toolbarLabel, reactThumbsUpLabel, reactRaisedHandsLabel, reactOkHandLabel, addReactionLabel, moreActionsLabel, saveLabel, aiActionsLabel, pluginActionsLabel, replyLabel, jumpLabel, jumpAriaLabel, ...rest }: MessageActionsProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=MessageActions.d.ts.map

package/dist/components/message-actions/MessageActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageActions.d.ts","sourceRoot":"","sources":["../../../src/components/message-actions/MessageActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvD,MAAM,MAAM,kBAAkB,GAAG,gBAAgB,GAAG,KAAK,GAAG,gBAAgB,CAAC;AAE7E,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,gDAAgD;IAChD,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,2DAA2D;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,wDAAwD;IACxD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wGAAwG;IACxG,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uCAAuC;IACvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0CAA0C;IAC1C,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qCAAqC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+BAA+B;IAC/B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+BAA+B;IAC/B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iCAAiC;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kCAAkC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kEAAkE;IAClE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,IAAuB,EACvB,OAAc,EACd,qBAA4B,EAC5B,cAAqB,EACrB,SAAc,EACd,YAAgC,EAChC,kBAA2C,EAC3C,qBAAiD,EACjD,gBAAuC,EACvC,gBAAiC,EACjC,gBAAiC,EACjC,SAA0B,EAC1B,cAA6B,EAC7B,kBAAqC,EACrC,UAA8B,EAC9B,SAAkB,EAClB,aAAiC,EACjC,GAAG,IAAI,EACR,EAAE,mBAAmB,kDAuIrB"}