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

package/dist/components/error-message/ErrorMessage.css

@@ -0,0 +1 @@
+._error-message_1l0v1_2{display:flex;align-items:flex-start;gap:var(--spacing-xxs)}._error-message__icon_1l0v1_7{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--error-text, var(--color-danger));padding-top:1px}._error-message__text_1l0v1_15{font-size:var(--font-size-75);font-weight:var(--font-weight-regular);line-height:var(--line-height-75);color:var(--error-text, var(--color-danger));flex:1 0 0;min-width:0}

package/dist/components/error-message/ErrorMessage.d.ts

@@ -0,0 +1,13 @@
+export interface ErrorMessageProps {
+    /** Optional CSS class name. */
+    className?: string;
+    /** The error message text to display. */
+    message: string;
+}
+/**
+ * Error Message is the inline red error line that appears below a form input when validation
+ * fails. It pairs an alert glyph with a short, human-readable explanation so the user can
+ * fix the field and move on.
+ */
+export default function ErrorMessage({ className, message, }: ErrorMessageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ErrorMessage.d.ts.map

package/dist/components/error-message/ErrorMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.d.ts","sourceRoot":"","sources":["../../../src/components/error-message/ErrorMessage.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,iBAAiB;IAChC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,OAAO,EAAE,MAAM,CAAC;CACjB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,SAAc,EACd,OAAO,GACR,EAAE,iBAAiB,2CAanB"}

package/dist/components/error-message/ErrorMessage.js

@@ -0,0 +1,18 @@
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import i from "../icon/Icon.js";
+import __l from "@mattermost/compass-icons/components/alert-circle-outline.js";const l=__l&&__l.default?__l.default:__l;
+import e from "./ErrorMessage.module.scss.js";
+function d({
+  className: s = "",
+  message: o
+}) {
+  const a = [e["error-message"], s].filter(Boolean).join(" ");
+  return /* @__PURE__ */ t("div", { className: a, role: "alert", children: [
+    /* @__PURE__ */ r("span", { className: e["error-message__icon"], "aria-hidden": !0, children: /* @__PURE__ */ r(i, { size: "12", glyph: /* @__PURE__ */ r(l, {}) }) }),
+    /* @__PURE__ */ r("span", { className: e["error-message__text"], children: o })
+  ] });
+}
+export {
+  d as default
+};
+//# sourceMappingURL=ErrorMessage.js.map

package/dist/components/error-message/ErrorMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.js","sources":["../../../src/components/error-message/ErrorMessage.tsx"],"sourcesContent":["import Icon from '@/components/icon/Icon';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport styles from './ErrorMessage.module.scss';\n\nexport interface ErrorMessageProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** The error message text to display. */\n  message: string;\n}\n\n/**\n * Error Message is the inline red error line that appears below a form input when validation\n * fails. It pairs an alert glyph with a short, human-readable explanation so the user can\n * fix the field and move on.\n */\nexport default function ErrorMessage({\n  className = '',\n  message,\n}: ErrorMessageProps) {\n  const rootClass = [styles['error-message'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass} role=\"alert\">\n      <span className={styles['error-message__icon']} aria-hidden>\n        <Icon size=\"12\" glyph={<AlertCircleOutlineIcon />} />\n      </span>\n      <span className={styles['error-message__text']}>{message}</span>\n    </div>\n  );\n}\n"],"names":["ErrorMessage","className","message","rootClass","styles","jsxs","jsx","Icon","AlertCircleOutlineIcon"],"mappings":";;;;AAgBA,SAAwBA,EAAa;AAAA,EACnC,WAAAC,IAAY;AAAA,EACZ,SAAAC;AACF,GAAsB;AACpB,QAAMC,IAAY,CAACC,EAAO,eAAe,GAAGH,CAAS,EAClD,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAI,EAAC,OAAA,EAAI,WAAWF,GAAW,MAAK,SAC9B,UAAA;AAAA,IAAA,gBAAAG,EAAC,QAAA,EAAK,WAAWF,EAAO,qBAAqB,GAAG,eAAW,IACzD,UAAA,gBAAAE,EAACC,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAD,EAACE,GAAA,CAAA,CAAuB,GAAI,GACrD;AAAA,sBACC,QAAA,EAAK,WAAWJ,EAAO,qBAAqB,GAAI,UAAAF,EAAA,CAAQ;AAAA,EAAA,GAC3D;AAEJ;"}

package/dist/components/error-message/ErrorMessage.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./ErrorMessage.css');const e={"error-message":"_error-message_1l0v1_2","error-message__icon":"_error-message__icon_1l0v1_7","error-message__text":"_error-message__text_1l0v1_15"};exports.default=e;
+//# sourceMappingURL=ErrorMessage.module.scss.cjs.map

package/dist/components/error-message/ErrorMessage.module.scss.cjs.map

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

package/dist/components/error-message/ErrorMessage.module.scss.js

@@ -0,0 +1,9 @@
+import './ErrorMessage.css';const e = {
+  "error-message": "_error-message_1l0v1_2",
+  "error-message__icon": "_error-message__icon_1l0v1_7",
+  "error-message__text": "_error-message__text_1l0v1_15"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=ErrorMessage.module.scss.js.map

package/dist/components/error-message/ErrorMessage.module.scss.js.map

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

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

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

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

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

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

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

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

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

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

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

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("../button/Button.cjs"),c=require("../icon/Icon.cjs"),o=require("../illustration/Illustration.cjs"),f=require("../tag/Tag.cjs"),__v=require("@mattermost/compass-icons/components/mattermost.js"),v=__v?.default??__v,l=require("./FeatureDiscoveryPanel.module.scss.cjs");function _({skuLabel:t="PROFESSIONAL",title:r,description:d,primaryAction:s,secondaryAction:a,illustration:u,className:n=""}){return e.jsxs("div",{className:[l.default["feature-discovery-panel"],n].filter(Boolean).join(" "),children:[e.jsxs("div",{className:l.default["feature-discovery-panel__content"],children:[e.jsxs("div",{className:l.default["feature-discovery-panel__text"],children:[e.jsxs("div",{className:l.default["feature-discovery-panel__title-group"],children:[t!=null&&e.jsx(f.default,{label:t,casing:"all-caps",leadingIcon:e.jsx(c.default,{size:"10",glyph:e.jsx(v,{})})}),e.jsx("h2",{className:l.default["feature-discovery-panel__title"],children:r})]}),e.jsx("p",{className:l.default["feature-discovery-panel__description"],children:d})]}),(s!=null||a!=null)&&e.jsxs("div",{className:l.default["feature-discovery-panel__actions"],children:[s!=null&&e.jsx("div",{className:l.default["feature-discovery-panel__action"],children:e.jsx(i.default,{size:"medium",...s})}),a!=null&&e.jsx("div",{className:l.default["feature-discovery-panel__action"],children:e.jsx(i.default,{size:"medium",...a})})]})]}),u!=null&&e.jsx("div",{className:l.default["feature-discovery-panel__illustration"],children:e.jsx(o.default,{...u})})]})}exports.default=_;
+//# sourceMappingURL=FeatureDiscoveryPanel.cjs.map

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureDiscoveryPanel.cjs","sources":["../../../src/components/feature-discovery-panel/FeatureDiscoveryPanel.tsx"],"sourcesContent":["import Button from '@/components/button/Button';\nimport type { ButtonProps } from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport Illustration from '@/components/illustration/Illustration';\nimport type { IllustrationProps } from '@/components/illustration/Illustration';\nimport Tag from '@/components/tag/Tag';\nimport MattermostIcon from '@mattermost/compass-icons/components/mattermost';\nimport styles from './FeatureDiscoveryPanel.module.scss';\n\nexport interface FeatureDiscoveryPanelProps {\n  /** SKU tag label (e.g. \"PROFESSIONAL\"). Set to null to hide. */\n  skuLabel?: string | null;\n  /** Panel heading title. */\n  title: string;\n  /** Body description text. */\n  description: string;\n  /** Primary CTA button props (children = label). */\n  primaryAction?: ButtonProps;\n  /** Secondary CTA button props (children = label). */\n  secondaryAction?: ButtonProps;\n  /** Illustration props (children = the SVG component). Rendered in the right column. */\n  illustration?: IllustrationProps;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Feature Discovery Panels surface capabilities only available on a higher-tier SKU. They\n * live in the System Console and are visible to admins — never to end users. The goal is to\n * communicate the value of the feature, not gate the UI behind a paywall.\n */\nexport default function FeatureDiscoveryPanel({\n  skuLabel = 'PROFESSIONAL',\n  title,\n  description,\n  primaryAction,\n  secondaryAction,\n  illustration,\n  className = '',\n}: FeatureDiscoveryPanelProps) {\n  return (\n    <div\n      className={[styles['feature-discovery-panel'], className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={styles['feature-discovery-panel__content']}>\n        <div className={styles['feature-discovery-panel__text']}>\n          <div className={styles['feature-discovery-panel__title-group']}>\n            {skuLabel != null && (\n              <Tag\n                label={skuLabel}\n                casing=\"all-caps\"\n                leadingIcon={<Icon size=\"10\" glyph={<MattermostIcon />} />}\n              />\n            )}\n            <h2 className={styles['feature-discovery-panel__title']}>\n              {title}\n            </h2>\n          </div>\n          <p className={styles['feature-discovery-panel__description']}>\n            {description}\n          </p>\n        </div>\n\n        {(primaryAction != null || secondaryAction != null) && (\n          <div className={styles['feature-discovery-panel__actions']}>\n            {primaryAction != null && (\n              <div className={styles['feature-discovery-panel__action']}>\n                <Button size=\"medium\" {...primaryAction} />\n              </div>\n            )}\n            {secondaryAction != null && (\n              <div className={styles['feature-discovery-panel__action']}>\n                <Button size=\"medium\" {...secondaryAction} />\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n\n      {illustration != null && (\n        <div className={styles['feature-discovery-panel__illustration']}>\n          <Illustration {...illustration} />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["FeatureDiscoveryPanel","skuLabel","title","description","primaryAction","secondaryAction","illustration","className","jsxs","styles","jsx","Tag","Icon","MattermostIcon","Button","Illustration"],"mappings":"6YA+BA,SAAwBA,EAAsB,CAC5C,SAAAC,EAAW,eACX,MAAAC,EACA,YAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,UAAAC,EAAY,EACd,EAA+B,CAC7B,OACEC,EAAAA,KAAC,MAAA,CACC,UAAW,CAACC,UAAO,yBAAyB,EAAGF,CAAS,EACrD,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,kCAAkC,EACvD,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,+BAA+B,EACpD,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,sCAAsC,EAC1D,SAAA,CAAAR,GAAY,MACXS,EAAAA,IAACC,EAAAA,QAAA,CACC,MAAOV,EACP,OAAO,WACP,kBAAcW,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOF,EAAAA,IAACG,IAAe,CAAA,CAAI,CAAA,CAAA,QAG3D,KAAA,CAAG,UAAWJ,EAAAA,QAAO,gCAAgC,EACnD,SAAAP,CAAA,CACH,CAAA,EACF,QACC,IAAA,CAAE,UAAWO,EAAAA,QAAO,sCAAsC,EACxD,SAAAN,CAAA,CACH,CAAA,EACF,GAEEC,GAAiB,MAAQC,GAAmB,cAC3C,MAAA,CAAI,UAAWI,EAAAA,QAAO,kCAAkC,EACtD,SAAA,CAAAL,GAAiB,MAChBM,MAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,iCAAiC,EACtD,SAAAC,EAAAA,IAACI,EAAAA,QAAA,CAAO,KAAK,SAAU,GAAGV,EAAe,EAC3C,EAEDC,GAAmB,MAClBK,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,iCAAiC,EACtD,SAAAC,EAAAA,IAACI,EAAAA,QAAA,CAAO,KAAK,SAAU,GAAGT,EAAiB,CAAA,CAC7C,CAAA,CAAA,CAEJ,CAAA,EAEJ,EAECC,GAAgB,MACfI,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,uCAAuC,EAC5D,SAAAC,EAAAA,IAACK,EAAAA,QAAA,CAAc,GAAGT,CAAA,CAAc,CAAA,CAClC,CAAA,CAAA,CAAA,CAIR"}

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.css

@@ -0,0 +1 @@
+._feature-discovery-panel_1b4te_2{display:flex;gap:var(--spacing-xxl);align-items:center;padding:var(--spacing-xxxl);background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.16);border-radius:var(--radius-m);box-shadow:var(--elevation-1)}._feature-discovery-panel__content_1b4te_12{display:flex;flex:1 0 0;flex-direction:column;gap:var(--spacing-xl);min-width:0}._feature-discovery-panel__text_1b4te_19{display:flex;flex-direction:column;gap:var(--spacing-l)}._feature-discovery-panel__title-group_1b4te_24{display:flex;flex-direction:column;gap:var(--spacing-s)}._feature-discovery-panel__title_1b4te_24{margin:0;font-family:var(--font-family-heading);font-weight:var(--font-weight-regular);font-size:var(--font-size-500);line-height:var(--line-height-500);color:var(--center-channel-color)}._feature-discovery-panel__description_1b4te_37{margin:0;font-size:var(--font-size-100);font-weight:var(--font-weight-regular);line-height:var(--line-height-100);color:var(--center-channel-color)}._feature-discovery-panel__actions_1b4te_44{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--spacing-m)}._feature-discovery-panel__action_1b4te_44{display:contents}._feature-discovery-panel__illustration_1b4te_53{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:340px}

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.d.ts

@@ -0,0 +1,25 @@
+import { ButtonProps } from '../button/Button';
+import { IllustrationProps } from '../illustration/Illustration';
+export interface FeatureDiscoveryPanelProps {
+    /** SKU tag label (e.g. "PROFESSIONAL"). Set to null to hide. */
+    skuLabel?: string | null;
+    /** Panel heading title. */
+    title: string;
+    /** Body description text. */
+    description: string;
+    /** Primary CTA button props (children = label). */
+    primaryAction?: ButtonProps;
+    /** Secondary CTA button props (children = label). */
+    secondaryAction?: ButtonProps;
+    /** Illustration props (children = the SVG component). Rendered in the right column. */
+    illustration?: IllustrationProps;
+    /** Optional CSS class name. */
+    className?: string;
+}
+/**
+ * Feature Discovery Panels surface capabilities only available on a higher-tier SKU. They
+ * live in the System Console and are visible to admins — never to end users. The goal is to
+ * communicate the value of the feature, not gate the UI behind a paywall.
+ */
+export default function FeatureDiscoveryPanel({ skuLabel, title, description, primaryAction, secondaryAction, illustration, className, }: FeatureDiscoveryPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FeatureDiscoveryPanel.d.ts.map

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureDiscoveryPanel.d.ts","sourceRoot":"","sources":["../../../src/components/feature-discovery-panel/FeatureDiscoveryPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAG9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAKhF,MAAM,WAAW,0BAA0B;IACzC,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,mDAAmD;IACnD,aAAa,CAAC,EAAE,WAAW,CAAC;IAC5B,qDAAqD;IACrD,eAAe,CAAC,EAAE,WAAW,CAAC;IAC9B,uFAAuF;IACvF,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,QAAyB,EACzB,KAAK,EACL,WAAW,EACX,aAAa,EACb,eAAe,EACf,YAAY,EACZ,SAAc,GACf,EAAE,0BAA0B,2CAiD5B"}

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.js

@@ -0,0 +1,50 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import t from "../button/Button.js";
+import m from "../icon/Icon.js";
+import u from "../illustration/Illustration.js";
+import p from "../tag/Tag.js";
+import __f from "@mattermost/compass-icons/components/mattermost.js";const f=__f&&__f.default?__f.default:__f;
+import l from "./FeatureDiscoveryPanel.module.scss.js";
+function x({
+  skuLabel: s = "PROFESSIONAL",
+  title: c,
+  description: o,
+  primaryAction: i,
+  secondaryAction: r,
+  illustration: n,
+  className: d = ""
+}) {
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      className: [l["feature-discovery-panel"], d].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ a("div", { className: l["feature-discovery-panel__content"], children: [
+          /* @__PURE__ */ a("div", { className: l["feature-discovery-panel__text"], children: [
+            /* @__PURE__ */ a("div", { className: l["feature-discovery-panel__title-group"], children: [
+              s != null && /* @__PURE__ */ e(
+                p,
+                {
+                  label: s,
+                  casing: "all-caps",
+                  leadingIcon: /* @__PURE__ */ e(m, { size: "10", glyph: /* @__PURE__ */ e(f, {}) })
+                }
+              ),
+              /* @__PURE__ */ e("h2", { className: l["feature-discovery-panel__title"], children: c })
+            ] }),
+            /* @__PURE__ */ e("p", { className: l["feature-discovery-panel__description"], children: o })
+          ] }),
+          (i != null || r != null) && /* @__PURE__ */ a("div", { className: l["feature-discovery-panel__actions"], children: [
+            i != null && /* @__PURE__ */ e("div", { className: l["feature-discovery-panel__action"], children: /* @__PURE__ */ e(t, { size: "medium", ...i }) }),
+            r != null && /* @__PURE__ */ e("div", { className: l["feature-discovery-panel__action"], children: /* @__PURE__ */ e(t, { size: "medium", ...r }) })
+          ] })
+        ] }),
+        n != null && /* @__PURE__ */ e("div", { className: l["feature-discovery-panel__illustration"], children: /* @__PURE__ */ e(u, { ...n }) })
+      ]
+    }
+  );
+}
+export {
+  x as default
+};
+//# sourceMappingURL=FeatureDiscoveryPanel.js.map

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureDiscoveryPanel.js","sources":["../../../src/components/feature-discovery-panel/FeatureDiscoveryPanel.tsx"],"sourcesContent":["import Button from '@/components/button/Button';\nimport type { ButtonProps } from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport Illustration from '@/components/illustration/Illustration';\nimport type { IllustrationProps } from '@/components/illustration/Illustration';\nimport Tag from '@/components/tag/Tag';\nimport MattermostIcon from '@mattermost/compass-icons/components/mattermost';\nimport styles from './FeatureDiscoveryPanel.module.scss';\n\nexport interface FeatureDiscoveryPanelProps {\n  /** SKU tag label (e.g. \"PROFESSIONAL\"). Set to null to hide. */\n  skuLabel?: string | null;\n  /** Panel heading title. */\n  title: string;\n  /** Body description text. */\n  description: string;\n  /** Primary CTA button props (children = label). */\n  primaryAction?: ButtonProps;\n  /** Secondary CTA button props (children = label). */\n  secondaryAction?: ButtonProps;\n  /** Illustration props (children = the SVG component). Rendered in the right column. */\n  illustration?: IllustrationProps;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Feature Discovery Panels surface capabilities only available on a higher-tier SKU. They\n * live in the System Console and are visible to admins — never to end users. The goal is to\n * communicate the value of the feature, not gate the UI behind a paywall.\n */\nexport default function FeatureDiscoveryPanel({\n  skuLabel = 'PROFESSIONAL',\n  title,\n  description,\n  primaryAction,\n  secondaryAction,\n  illustration,\n  className = '',\n}: FeatureDiscoveryPanelProps) {\n  return (\n    <div\n      className={[styles['feature-discovery-panel'], className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={styles['feature-discovery-panel__content']}>\n        <div className={styles['feature-discovery-panel__text']}>\n          <div className={styles['feature-discovery-panel__title-group']}>\n            {skuLabel != null && (\n              <Tag\n                label={skuLabel}\n                casing=\"all-caps\"\n                leadingIcon={<Icon size=\"10\" glyph={<MattermostIcon />} />}\n              />\n            )}\n            <h2 className={styles['feature-discovery-panel__title']}>\n              {title}\n            </h2>\n          </div>\n          <p className={styles['feature-discovery-panel__description']}>\n            {description}\n          </p>\n        </div>\n\n        {(primaryAction != null || secondaryAction != null) && (\n          <div className={styles['feature-discovery-panel__actions']}>\n            {primaryAction != null && (\n              <div className={styles['feature-discovery-panel__action']}>\n                <Button size=\"medium\" {...primaryAction} />\n              </div>\n            )}\n            {secondaryAction != null && (\n              <div className={styles['feature-discovery-panel__action']}>\n                <Button size=\"medium\" {...secondaryAction} />\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n\n      {illustration != null && (\n        <div className={styles['feature-discovery-panel__illustration']}>\n          <Illustration {...illustration} />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["FeatureDiscoveryPanel","skuLabel","title","description","primaryAction","secondaryAction","illustration","className","jsxs","styles","jsx","Tag","Icon","MattermostIcon","Button","Illustration"],"mappings":";;;;;;;AA+BA,SAAwBA,EAAsB;AAAA,EAC5C,UAAAC,IAAW;AAAA,EACX,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAA+B;AAC7B,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAACC,EAAO,yBAAyB,GAAGF,CAAS,EACrD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MAEX,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,kCAAkC,GACvD,UAAA;AAAA,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,+BAA+B,GACpD,UAAA;AAAA,YAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,sCAAsC,GAC1D,UAAA;AAAA,cAAAR,KAAY,QACX,gBAAAS;AAAA,gBAACC;AAAA,gBAAA;AAAA,kBACC,OAAOV;AAAA,kBACP,QAAO;AAAA,kBACP,+BAAcW,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACG,KAAe,EAAA,CAAI;AAAA,gBAAA;AAAA,cAAA;AAAA,gCAG3D,MAAA,EAAG,WAAWJ,EAAO,gCAAgC,GACnD,UAAAP,EAAA,CACH;AAAA,YAAA,GACF;AAAA,8BACC,KAAA,EAAE,WAAWO,EAAO,sCAAsC,GACxD,UAAAN,EAAA,CACH;AAAA,UAAA,GACF;AAAA,WAEEC,KAAiB,QAAQC,KAAmB,2BAC3C,OAAA,EAAI,WAAWI,EAAO,kCAAkC,GACtD,UAAA;AAAA,YAAAL,KAAiB,QAChB,gBAAAM,EAAC,OAAA,EAAI,WAAWD,EAAO,iCAAiC,GACtD,UAAA,gBAAAC,EAACI,GAAA,EAAO,MAAK,UAAU,GAAGV,GAAe,GAC3C;AAAA,YAEDC,KAAmB,QAClB,gBAAAK,EAAC,OAAA,EAAI,WAAWD,EAAO,iCAAiC,GACtD,UAAA,gBAAAC,EAACI,GAAA,EAAO,MAAK,UAAU,GAAGT,GAAiB,EAAA,CAC7C;AAAA,UAAA,EAAA,CAEJ;AAAA,QAAA,GAEJ;AAAA,QAECC,KAAgB,QACf,gBAAAI,EAAC,OAAA,EAAI,WAAWD,EAAO,uCAAuC,GAC5D,UAAA,gBAAAC,EAACK,GAAA,EAAc,GAAGT,EAAA,CAAc,EAAA,CAClC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./FeatureDiscoveryPanel.css');const e={"feature-discovery-panel":"_feature-discovery-panel_1b4te_2","feature-discovery-panel__content":"_feature-discovery-panel__content_1b4te_12","feature-discovery-panel__text":"_feature-discovery-panel__text_1b4te_19","feature-discovery-panel__title-group":"_feature-discovery-panel__title-group_1b4te_24","feature-discovery-panel__title":"_feature-discovery-panel__title_1b4te_24","feature-discovery-panel__description":"_feature-discovery-panel__description_1b4te_37","feature-discovery-panel__actions":"_feature-discovery-panel__actions_1b4te_44","feature-discovery-panel__action":"_feature-discovery-panel__action_1b4te_44","feature-discovery-panel__illustration":"_feature-discovery-panel__illustration_1b4te_53"};exports.default=e;
+//# sourceMappingURL=FeatureDiscoveryPanel.module.scss.cjs.map

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.module.scss.cjs.map

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

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.module.scss.js

@@ -0,0 +1,15 @@
+import './FeatureDiscoveryPanel.css';const e = {
+  "feature-discovery-panel": "_feature-discovery-panel_1b4te_2",
+  "feature-discovery-panel__content": "_feature-discovery-panel__content_1b4te_12",
+  "feature-discovery-panel__text": "_feature-discovery-panel__text_1b4te_19",
+  "feature-discovery-panel__title-group": "_feature-discovery-panel__title-group_1b4te_24",
+  "feature-discovery-panel__title": "_feature-discovery-panel__title_1b4te_24",
+  "feature-discovery-panel__description": "_feature-discovery-panel__description_1b4te_37",
+  "feature-discovery-panel__actions": "_feature-discovery-panel__actions_1b4te_44",
+  "feature-discovery-panel__action": "_feature-discovery-panel__action_1b4te_44",
+  "feature-discovery-panel__illustration": "_feature-discovery-panel__illustration_1b4te_53"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=FeatureDiscoveryPanel.module.scss.js.map

package/dist/components/feature-discovery-panel/FeatureDiscoveryPanel.module.scss.js.map

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

package/dist/components/feature-discovery-panel/index.cjs

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

package/dist/components/feature-discovery-panel/index.cjs.map

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

package/dist/components/feature-discovery-panel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/feature-discovery-panel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/components/feature-discovery-panel/index.js

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

package/dist/components/feature-discovery-panel/index.js.map

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

package/dist/components/global-banner/GlobalBanner.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("../button/Button.cjs"),f=require("../icon-button/IconButton.cjs"),t=require("../icon/Icon.cjs"),__m=require("@mattermost/compass-icons/components/close.js"),m=__m?.default??__m,l=require("./GlobalBanner.module.scss.cjs");function _({className:o="",message:i,type:a="general",leadingIcon:n,actionLabel:s,onAction:u,onDismiss:r}){const c=a!=="general"?l.default[`global-banner--type-${a.toLowerCase()}`]:"",d=[l.default["global-banner"],c,o].filter(Boolean).join(" ");return e.jsxs("div",{className:d,role:"banner",children:[e.jsxs("div",{className:l.default["global-banner__content"],children:[n!=null&&e.jsx("span",{className:l.default["global-banner__icon"],"aria-hidden":!0,children:e.jsx(t.IconSlotContext.Provider,{value:{size:"16"},children:n})}),e.jsx("span",{className:l.default["global-banner__message"],children:i}),s!=null&&e.jsx(b.default,{className:l.default["global-banner__action"],appearance:"default",emphasis:"tertiary",size:"x-small",onClick:u,children:s})]}),r!=null&&e.jsx(f.default,{className:l.default["global-banner__dismiss"],"aria-label":"Dismiss",size:"small",icon:e.jsx(t.default,{glyph:e.jsx(m,{}),size:"16"}),onClick:r})]})}exports.default=_;
+//# sourceMappingURL=GlobalBanner.cjs.map

package/dist/components/global-banner/GlobalBanner.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalBanner.cjs","sources":["../../../src/components/global-banner/GlobalBanner.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport Button from '@/components/button/Button';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './GlobalBanner.module.scss';\n\nexport type GlobalBannerType =\n  | 'general'\n  | 'warning'\n  | 'danger'\n  | 'info'\n  | 'success';\n\nexport interface GlobalBannerProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** The message text. */\n  message: string;\n  /** Optional type for color-coding. Default: General. */\n  type?: GlobalBannerType;\n  /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; GlobalBanner provides the correct size via context. */\n  leadingIcon?: ReactNode;\n  /** Label for the optional action button. */\n  actionLabel?: string;\n  /** Callback when the action button is clicked. */\n  onAction?: () => void;\n  /** Called when dismiss button is clicked. When omitted, dismiss button is hidden. */\n  onDismiss?: () => void;\n}\n\n/**\n * Global Banners sit at the very top of the application and broadcast something every user\n * in the workspace needs to know — a maintenance window, an expiring licence, a connectivity\n * problem, an available update. They span the full width of the app and stay visible until\n * they're dismissed or the condition resolves.\n */\nexport default function GlobalBanner({\n  className = '',\n  message,\n  type = 'general',\n  leadingIcon,\n  actionLabel,\n  onAction,\n  onDismiss,\n}: GlobalBannerProps) {\n  const typeClass =\n    type !== 'general'\n      ? styles[`global-banner--type-${type.toLowerCase()}`]\n      : '';\n\n  const rootClass = [styles['global-banner'], typeClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass} role=\"banner\">\n      <div className={styles['global-banner__content']}>\n        {leadingIcon != null && (\n          <span className={styles['global-banner__icon']} aria-hidden>\n            <IconSlotContext.Provider value={{ size: '16' }}>\n              {leadingIcon}\n            </IconSlotContext.Provider>\n          </span>\n        )}\n        <span className={styles['global-banner__message']}>{message}</span>\n        {actionLabel != null && (\n          <Button\n            className={styles['global-banner__action']}\n            appearance=\"default\"\n            emphasis=\"tertiary\"\n            size=\"x-small\"\n            onClick={onAction}\n          >\n            {actionLabel}\n          </Button>\n        )}\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          className={styles['global-banner__dismiss']}\n          aria-label=\"Dismiss\"\n          size=\"small\"\n          icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["GlobalBanner","className","message","type","leadingIcon","actionLabel","onAction","onDismiss","typeClass","styles","rootClass","jsxs","jsx","IconSlotContext","Button","IconButton","Icon","CloseIcon"],"mappings":"+VAsCA,SAAwBA,EAAa,CACnC,UAAAC,EAAY,GACZ,QAAAC,EACA,KAAAC,EAAO,UACP,YAAAC,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,CACF,EAAsB,CACpB,MAAMC,EACJL,IAAS,UACLM,UAAO,uBAAuBN,EAAK,YAAA,CAAa,EAAE,EAClD,GAEAO,EAAY,CAACD,UAAO,eAAe,EAAGD,EAAWP,CAAS,EAC7D,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEU,EAAAA,KAAC,MAAA,CAAI,UAAWD,EAAW,KAAK,SAC9B,SAAA,CAAAC,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAAA,QAAO,wBAAwB,EAC5C,SAAA,CAAAL,GAAe,MACdQ,EAAAA,IAAC,OAAA,CAAK,UAAWH,EAAAA,QAAO,qBAAqB,EAAG,cAAW,GACzD,eAACI,kBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,WACH,EACF,QAED,OAAA,CAAK,UAAWJ,EAAAA,QAAO,wBAAwB,EAAI,SAAAP,EAAQ,EAC3DG,GAAe,MACdO,EAAAA,IAACE,EAAAA,QAAA,CACC,UAAWL,EAAAA,QAAO,uBAAuB,EACzC,WAAW,UACX,SAAS,WACT,KAAK,UACL,QAASH,EAER,SAAAD,CAAA,CAAA,CACH,EAEJ,EACCE,GAAa,MACZK,EAAAA,IAACG,EAAAA,QAAA,CACC,UAAWN,EAAAA,QAAO,wBAAwB,EAC1C,aAAW,UACX,KAAK,QACL,WAAOO,UAAA,CAAK,YAAQC,EAAA,EAAU,EAAI,KAAK,KAAK,EAC5C,QAASV,CAAA,CAAA,CACX,EAEJ,CAEJ"}

package/dist/components/global-banner/GlobalBanner.css

@@ -0,0 +1 @@
+._global-banner_weys9_2{display:flex;align-items:center;justify-content:center;height:40px;width:100%;position:relative;background-color:var(--neutral-900);padding:0 var(--spacing-xxl)}._global-banner__content_weys9_12{display:flex;align-items:center;justify-content:center;gap:var(--spacing-s)}._global-banner__icon_weys9_18{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--neutral-0)}._global-banner__message_weys9_25{font-size:var(--font-size-100);font-weight:var(--font-weight-semibold);line-height:var(--line-height-100);color:var(--neutral-0);white-space:nowrap;text-align:center}._global-banner__dismiss_weys9_33{position:absolute;right:var(--spacing-xxs);top:50%;transform:translateY(-50%);color:color-mix(in srgb,var(--neutral-0) 92%,transparent)!important}._global-banner__dismiss_weys9_33:hover:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 12%,transparent)!important;color:var(--neutral-0)!important}._global-banner__dismiss_weys9_33:active:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 20%,transparent)!important;color:var(--neutral-0)!important}._global-banner__dismiss_weys9_33:focus-visible{outline:2px solid color-mix(in srgb,var(--neutral-0) 56%,transparent)!important;outline-offset:2px!important;box-shadow:none!important}._global-banner__action_weys9_53{flex-shrink:0;background-color:color-mix(in srgb,var(--neutral-0) 8%,transparent)!important;color:var(--neutral-0)!important;border-color:transparent!important}._global-banner__action_weys9_53:hover:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 12%,transparent)!important;color:var(--neutral-0)!important}._global-banner__action_weys9_53:active:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 16%,transparent)!important;color:var(--neutral-0)!important}._global-banner__action_weys9_53:focus-visible{outline:2px solid color-mix(in srgb,var(--neutral-0) 56%,transparent)!important;outline-offset:2px!important;box-shadow:none!important}._global-banner__action_weys9_53:disabled{color:color-mix(in srgb,var(--neutral-0) 40%,transparent)!important;background-color:color-mix(in srgb,var(--neutral-0) 6%,transparent)!important}._global-banner--type-warning_weys9_76{background-color:rgb(var(--semantic-color-warning))}._global-banner--type-danger_weys9_79{background-color:rgb(var(--semantic-color-danger))}._global-banner--type-info_weys9_82{background-color:rgb(var(--semantic-color-info))}._global-banner--type-success_weys9_85{background-color:rgb(var(--semantic-color-success))}

package/dist/components/global-banner/GlobalBanner.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+export type GlobalBannerType = 'general' | 'warning' | 'danger' | 'info' | 'success';
+export interface GlobalBannerProps {
+    /** Optional CSS class name. */
+    className?: string;
+    /** The message text. */
+    message: string;
+    /** Optional type for color-coding. Default: General. */
+    type?: GlobalBannerType;
+    /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; GlobalBanner provides the correct size via context. */
+    leadingIcon?: ReactNode;
+    /** Label for the optional action button. */
+    actionLabel?: string;
+    /** Callback when the action button is clicked. */
+    onAction?: () => void;
+    /** Called when dismiss button is clicked. When omitted, dismiss button is hidden. */
+    onDismiss?: () => void;
+}
+/**
+ * Global Banners sit at the very top of the application and broadcast something every user
+ * in the workspace needs to know — a maintenance window, an expiring licence, a connectivity
+ * problem, an available update. They span the full width of the app and stay visible until
+ * they're dismissed or the condition resolves.
+ */
+export default function GlobalBanner({ className, message, type, leadingIcon, actionLabel, onAction, onDismiss, }: GlobalBannerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GlobalBanner.d.ts.map

package/dist/components/global-banner/GlobalBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalBanner.d.ts","sourceRoot":"","sources":["../../../src/components/global-banner/GlobalBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,MAAM,MAAM,gBAAgB,GACxB,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,GACN,SAAS,CAAC;AAEd,MAAM,WAAW,iBAAiB;IAChC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,wHAAwH;IACxH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,SAAc,EACd,OAAO,EACP,IAAgB,EAChB,WAAW,EACX,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,iBAAiB,2CA4CnB"}

package/dist/components/global-banner/GlobalBanner.js

@@ -0,0 +1,48 @@
+import { jsxs as s, jsx as l } from "react/jsx-runtime";
+import p from "../button/Button.js";
+import d from "../icon-button/IconButton.js";
+import u, { IconSlotContext as f } from "../icon/Icon.js";
+import __g from "@mattermost/compass-icons/components/close.js";const g=__g&&__g.default?__g.default:__g;
+import a from "./GlobalBanner.module.scss.js";
+function y({
+  className: i = "",
+  message: t,
+  type: e = "general",
+  leadingIcon: n,
+  actionLabel: o,
+  onAction: c,
+  onDismiss: r
+}) {
+  const m = e !== "general" ? a[`global-banner--type-${e.toLowerCase()}`] : "", b = [a["global-banner"], m, i].filter(Boolean).join(" ");
+  return /* @__PURE__ */ s("div", { className: b, role: "banner", children: [
+    /* @__PURE__ */ s("div", { className: a["global-banner__content"], children: [
+      n != null && /* @__PURE__ */ l("span", { className: a["global-banner__icon"], "aria-hidden": !0, children: /* @__PURE__ */ l(f.Provider, { value: { size: "16" }, children: n }) }),
+      /* @__PURE__ */ l("span", { className: a["global-banner__message"], children: t }),
+      o != null && /* @__PURE__ */ l(
+        p,
+        {
+          className: a["global-banner__action"],
+          appearance: "default",
+          emphasis: "tertiary",
+          size: "x-small",
+          onClick: c,
+          children: o
+        }
+      )
+    ] }),
+    r != null && /* @__PURE__ */ l(
+      d,
+      {
+        className: a["global-banner__dismiss"],
+        "aria-label": "Dismiss",
+        size: "small",
+        icon: /* @__PURE__ */ l(u, { glyph: /* @__PURE__ */ l(g, {}), size: "16" }),
+        onClick: r
+      }
+    )
+  ] });
+}
+export {
+  y as default
+};
+//# sourceMappingURL=GlobalBanner.js.map

package/dist/components/global-banner/GlobalBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalBanner.js","sources":["../../../src/components/global-banner/GlobalBanner.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport Button from '@/components/button/Button';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './GlobalBanner.module.scss';\n\nexport type GlobalBannerType =\n  | 'general'\n  | 'warning'\n  | 'danger'\n  | 'info'\n  | 'success';\n\nexport interface GlobalBannerProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** The message text. */\n  message: string;\n  /** Optional type for color-coding. Default: General. */\n  type?: GlobalBannerType;\n  /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; GlobalBanner provides the correct size via context. */\n  leadingIcon?: ReactNode;\n  /** Label for the optional action button. */\n  actionLabel?: string;\n  /** Callback when the action button is clicked. */\n  onAction?: () => void;\n  /** Called when dismiss button is clicked. When omitted, dismiss button is hidden. */\n  onDismiss?: () => void;\n}\n\n/**\n * Global Banners sit at the very top of the application and broadcast something every user\n * in the workspace needs to know — a maintenance window, an expiring licence, a connectivity\n * problem, an available update. They span the full width of the app and stay visible until\n * they're dismissed or the condition resolves.\n */\nexport default function GlobalBanner({\n  className = '',\n  message,\n  type = 'general',\n  leadingIcon,\n  actionLabel,\n  onAction,\n  onDismiss,\n}: GlobalBannerProps) {\n  const typeClass =\n    type !== 'general'\n      ? styles[`global-banner--type-${type.toLowerCase()}`]\n      : '';\n\n  const rootClass = [styles['global-banner'], typeClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass} role=\"banner\">\n      <div className={styles['global-banner__content']}>\n        {leadingIcon != null && (\n          <span className={styles['global-banner__icon']} aria-hidden>\n            <IconSlotContext.Provider value={{ size: '16' }}>\n              {leadingIcon}\n            </IconSlotContext.Provider>\n          </span>\n        )}\n        <span className={styles['global-banner__message']}>{message}</span>\n        {actionLabel != null && (\n          <Button\n            className={styles['global-banner__action']}\n            appearance=\"default\"\n            emphasis=\"tertiary\"\n            size=\"x-small\"\n            onClick={onAction}\n          >\n            {actionLabel}\n          </Button>\n        )}\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          className={styles['global-banner__dismiss']}\n          aria-label=\"Dismiss\"\n          size=\"small\"\n          icon={<Icon glyph={<CloseIcon />} size=\"16\" />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["GlobalBanner","className","message","type","leadingIcon","actionLabel","onAction","onDismiss","typeClass","styles","rootClass","jsxs","jsx","IconSlotContext","Button","IconButton","Icon","CloseIcon"],"mappings":";;;;;;AAsCA,SAAwBA,EAAa;AAAA,EACnC,WAAAC,IAAY;AAAA,EACZ,SAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAAsB;AACpB,QAAMC,IACJL,MAAS,YACLM,EAAO,uBAAuBN,EAAK,YAAA,CAAa,EAAE,IAClD,IAEAO,IAAY,CAACD,EAAO,eAAe,GAAGD,GAAWP,CAAS,EAC7D,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAU,EAAC,OAAA,EAAI,WAAWD,GAAW,MAAK,UAC9B,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWF,EAAO,wBAAwB,GAC5C,UAAA;AAAA,MAAAL,KAAe,QACd,gBAAAQ,EAAC,QAAA,EAAK,WAAWH,EAAO,qBAAqB,GAAG,eAAW,IACzD,4BAACI,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAM,KAAA,GACtC,aACH,GACF;AAAA,wBAED,QAAA,EAAK,WAAWJ,EAAO,wBAAwB,GAAI,UAAAP,GAAQ;AAAA,MAC3DG,KAAe,QACd,gBAAAO;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,WAAWL,EAAO,uBAAuB;AAAA,UACzC,YAAW;AAAA,UACX,UAAS;AAAA,UACT,MAAK;AAAA,UACL,SAASH;AAAA,UAER,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,IACCE,KAAa,QACZ,gBAAAK;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWN,EAAO,wBAAwB;AAAA,QAC1C,cAAW;AAAA,QACX,MAAK;AAAA,QACL,wBAAOO,GAAA,EAAK,yBAAQC,GAAA,EAAU,GAAI,MAAK,MAAK;AAAA,QAC5C,SAASV;AAAA,MAAA;AAAA,IAAA;AAAA,EACX,GAEJ;AAEJ;"}

package/dist/components/global-banner/GlobalBanner.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./GlobalBanner.css');const e={"global-banner":"_global-banner_weys9_2","global-banner__content":"_global-banner__content_weys9_12","global-banner__icon":"_global-banner__icon_weys9_18","global-banner__message":"_global-banner__message_weys9_25","global-banner__dismiss":"_global-banner__dismiss_weys9_33","global-banner__action":"_global-banner__action_weys9_53","global-banner--type-warning":"_global-banner--type-warning_weys9_76","global-banner--type-danger":"_global-banner--type-danger_weys9_79","global-banner--type-info":"_global-banner--type-info_weys9_82","global-banner--type-success":"_global-banner--type-success_weys9_85"};exports.default=e;
+//# sourceMappingURL=GlobalBanner.module.scss.cjs.map

package/dist/components/global-banner/GlobalBanner.module.scss.cjs.map

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

package/dist/components/global-banner/GlobalBanner.module.scss.js

@@ -0,0 +1,16 @@
+import './GlobalBanner.css';const n = {
+  "global-banner": "_global-banner_weys9_2",
+  "global-banner__content": "_global-banner__content_weys9_12",
+  "global-banner__icon": "_global-banner__icon_weys9_18",
+  "global-banner__message": "_global-banner__message_weys9_25",
+  "global-banner__dismiss": "_global-banner__dismiss_weys9_33",
+  "global-banner__action": "_global-banner__action_weys9_53",
+  "global-banner--type-warning": "_global-banner--type-warning_weys9_76",
+  "global-banner--type-danger": "_global-banner--type-danger_weys9_79",
+  "global-banner--type-info": "_global-banner--type-info_weys9_82",
+  "global-banner--type-success": "_global-banner--type-success_weys9_85"
+};
+export {
+  n as default
+};
+//# sourceMappingURL=GlobalBanner.module.scss.js.map

package/dist/components/global-banner/GlobalBanner.module.scss.js.map

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

package/dist/components/global-banner/index.cjs

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

package/dist/components/global-banner/index.cjs.map

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

package/dist/components/global-banner/index.d.ts.map

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

package/dist/components/global-banner/index.js

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

package/dist/components/global-banner/index.js.map

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

package/dist/components/global-header/GlobalHeader.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),__x=require("@mattermost/compass-icons/components/products.js"),x=__x?.default??__x,__b=require("@mattermost/compass-icons/components/product-channels.js"),b=__b?.default??__b,__g=require("@mattermost/compass-icons/components/product-playbooks.js"),g=__g?.default??__g,__p=require("@mattermost/compass-icons/components/product-boards.js"),p=__p?.default??__p,__f=require("@mattermost/compass-icons/components/arrow-left.js"),f=__f?.default??__f,___=require("@mattermost/compass-icons/components/arrow-right.js"),_=___?.default??___,__m=require("@mattermost/compass-icons/components/magnify.js"),m=__m?.default??__m,__t=require("@mattermost/compass-icons/components/help-circle-outline.js"),t=__t?.default??__t,__y=require("@mattermost/compass-icons/components/cog-outline.js"),y=__y?.default??__y,__q=require("@mattermost/compass-icons/components/at.js"),q=__q?.default??__q,__I=require("@mattermost/compass-icons/components/bookmark-outline.js"),I=__I?.default??__I,__v=require("@mattermost/compass-icons/components/checkbox-multiple-marked-outline.js"),v=__v?.default??__v,N=require("../button/Button.cjs"),o=require("../icon/Icon.cjs"),L=require("../icon-button/IconButton.cjs"),P=require("../user-avatar/UserAvatar.cjs"),a=require("./GlobalHeader.module.scss.cjs"),k={channels:b,playbooks:g,boards:p},B={channels:"Channels",playbooks:"Playbooks",boards:"Boards"};function s({ariaLabel:r,glyph:l}){return e.jsx(L.default,{"aria-label":r,size:"small",padding:"compact",style:"inverted",icon:e.jsx(o.default,{size:"16",glyph:l})})}function C({product:r}){const l=k[r];return e.jsxs("div",{className:a.default["global-header__product"],children:[e.jsx("span",{className:a.default["global-header__product-icon"],"aria-hidden":!0,children:e.jsx(o.default,{size:"20",glyph:e.jsx(l,{})})}),e.jsx("span",{className:a.default["global-header__product-name"],children:B[r]})]})}function O(){return e.jsxs("div",{className:a.default["global-header__navigator"],children:[e.jsx(s,{ariaLabel:"Back",glyph:e.jsx(f,{})}),e.jsx(s,{ariaLabel:"Forward",glyph:e.jsx(_,{})})]})}function z({className:r="",product:l="channels",showChannelsBranding:c=!0,showUpgradeButton:i=!1,userAvatarSrc:d,userAvatarAlt:u="User"}){const n=l==="channels",h=n?c:!0,j=[a.default["global-header"],n?a.default["global-header--channels"]:a.default["global-header--product-only"],r].filter(Boolean).join(" ");return e.jsxs("header",{className:j,children:[e.jsxs("div",{className:a.default["global-header__left"],children:[e.jsx(s,{ariaLabel:"Product switcher",glyph:e.jsx(x,{})}),h&&e.jsx(C,{product:l}),e.jsx(O,{})]}),n&&e.jsxs("div",{className:a.default["global-header__center"],children:[e.jsxs("div",{className:a.default["global-header__search"],children:[e.jsx("span",{className:a.default["global-header__search-icon"],"aria-hidden":!0,children:e.jsx(o.default,{size:"12",glyph:e.jsx(m,{})})}),e.jsx("input",{type:"search",className:a.default["global-header__search-input"],placeholder:"Search","aria-label":"Search"})]}),e.jsx(s,{ariaLabel:"Help",glyph:e.jsx(t,{})})]}),e.jsxs("div",{className:a.default["global-header__right"],children:[i&&e.jsx(N.default,{emphasis:"primary",size:"x-small",children:"Upgrade"}),l==="playbooks"&&e.jsx(s,{ariaLabel:"Tasks",glyph:e.jsx(v,{})}),n&&e.jsxs(e.Fragment,{children:[e.jsx(s,{ariaLabel:"Recent mentions",glyph:e.jsx(q,{})}),e.jsx(s,{ariaLabel:"Saved messages",glyph:e.jsx(I,{})})]}),!n&&e.jsx(s,{ariaLabel:"Help",glyph:e.jsx(t,{})}),e.jsx(s,{ariaLabel:"Settings",glyph:e.jsx(y,{})}),e.jsx("button",{className:a.default["global-header__account"],"aria-label":"Account menu",children:e.jsx(P.default,{src:d,alt:u,size:"24",status:!0})})]})]})}exports.default=z;
+//# sourceMappingURL=GlobalHeader.cjs.map

package/dist/components/global-header/GlobalHeader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalHeader.cjs","sources":["../../../src/components/global-header/GlobalHeader.tsx"],"sourcesContent":["import ProductsIcon from '@mattermost/compass-icons/components/products';\nimport ProductChannelsIcon from '@mattermost/compass-icons/components/product-channels';\nimport ProductPlaybooksIcon from '@mattermost/compass-icons/components/product-playbooks';\nimport ProductBoardsIcon from '@mattermost/compass-icons/components/product-boards';\nimport ArrowLeftIcon from '@mattermost/compass-icons/components/arrow-left';\nimport ArrowRightIcon from '@mattermost/compass-icons/components/arrow-right';\nimport MagnifyIcon from '@mattermost/compass-icons/components/magnify';\nimport HelpCircleOutlineIcon from '@mattermost/compass-icons/components/help-circle-outline';\nimport CogOutlineIcon from '@mattermost/compass-icons/components/cog-outline';\nimport AtIcon from '@mattermost/compass-icons/components/at';\nimport BookmarkOutlineIcon from '@mattermost/compass-icons/components/bookmark-outline';\nimport CheckboxMultipleMarkedOutlineIcon from '@mattermost/compass-icons/components/checkbox-multiple-marked-outline';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport UserAvatar from '@/components/user-avatar/UserAvatar';\nimport type { ComponentType } from 'react';\nimport styles from './GlobalHeader.module.scss';\n\nexport type GlobalHeaderProduct = 'channels' | 'playbooks' | 'boards';\n\nexport interface GlobalHeaderProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** Product context. Controls branding + right-side controls. Default: Channels. */\n  product?: GlobalHeaderProduct;\n  /** When true and product is Channels, shows the Channels product icon + label. */\n  showChannelsBranding?: boolean;\n  /** When true, shows the Upgrade button in the right controls. */\n  showUpgradeButton?: boolean;\n  /** URL for the signed-in user avatar. Omit for initials fallback. */\n  userAvatarSrc?: string;\n  /** Alt text for the signed-in user avatar. */\n  userAvatarAlt?: string;\n}\n\nconst PRODUCT_ICON: Record<\n  GlobalHeaderProduct,\n  ComponentType<{ size?: number }>\n> = {\n  channels: ProductChannelsIcon,\n  playbooks: ProductPlaybooksIcon,\n  boards: ProductBoardsIcon,\n};\n\nconst PRODUCT_LABEL: Record<GlobalHeaderProduct, string> = {\n  channels: 'Channels',\n  playbooks: 'Playbooks',\n  boards: 'Boards',\n};\n\nfunction InvertedIconButton({\n  ariaLabel,\n  glyph,\n}: {\n  ariaLabel: string;\n  glyph: React.ReactNode;\n}) {\n  return (\n    <IconButton\n      aria-label={ariaLabel}\n      size=\"small\"\n      padding=\"compact\"\n      style=\"inverted\"\n      icon={<Icon size=\"16\" glyph={glyph} />}\n    />\n  );\n}\n\nfunction ProductBrand({ product }: { product: GlobalHeaderProduct }) {\n  const ProductIcon = PRODUCT_ICON[product];\n  return (\n    <div className={styles['global-header__product']}>\n      <span className={styles['global-header__product-icon']} aria-hidden>\n        <Icon size=\"20\" glyph={<ProductIcon />} />\n      </span>\n      <span className={styles['global-header__product-name']}>\n        {PRODUCT_LABEL[product]}\n      </span>\n    </div>\n  );\n}\n\nfunction Navigator() {\n  return (\n    <div className={styles['global-header__navigator']}>\n      <InvertedIconButton ariaLabel=\"Back\" glyph={<ArrowLeftIcon />} />\n      <InvertedIconButton ariaLabel=\"Forward\" glyph={<ArrowRightIcon />} />\n    </div>\n  );\n}\n\n/**\n * Global Header pattern — top bar spanning the full viewport that contains\n * the product switcher, product branding, navigator, and session-level\n * controls (search, mentions, saved, settings, account).\n *\n * Layout uses a three-column CSS grid for Channels (left | centered search + help | session)\n * so session controls stay anchored to the trailing edge. Playbooks/Boards omit the center\n * column and use two tracks (left product block | session).\n *\n * Matches Figma Global Header v1.2.1 (node 613:4135).\n */\nexport default function GlobalHeader({\n  className = '',\n  product = 'channels',\n  showChannelsBranding = true,\n  showUpgradeButton = false,\n  userAvatarSrc,\n  userAvatarAlt = 'User',\n}: GlobalHeaderProps) {\n  const isChannels = product === 'channels';\n  const showBrand = isChannels ? showChannelsBranding : true;\n\n  const rootClass = [\n    styles['global-header'],\n    isChannels\n      ? styles['global-header--channels']\n      : styles['global-header--product-only'],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <header className={rootClass}>\n      <div className={styles['global-header__left']}>\n        <InvertedIconButton\n          ariaLabel=\"Product switcher\"\n          glyph={<ProductsIcon />}\n        />\n        {showBrand && <ProductBrand product={product} />}\n        <Navigator />\n      </div>\n\n      {isChannels && (\n        <div className={styles['global-header__center']}>\n          <div className={styles['global-header__search']}>\n            <span className={styles['global-header__search-icon']} aria-hidden>\n              <Icon size=\"12\" glyph={<MagnifyIcon />} />\n            </span>\n            <input\n              type=\"search\"\n              className={styles['global-header__search-input']}\n              placeholder=\"Search\"\n              aria-label=\"Search\"\n            />\n          </div>\n          <InvertedIconButton\n            ariaLabel=\"Help\"\n            glyph={<HelpCircleOutlineIcon />}\n          />\n        </div>\n      )}\n\n      <div className={styles['global-header__right']}>\n        {showUpgradeButton && (\n          <Button emphasis=\"primary\" size=\"x-small\">\n            Upgrade\n          </Button>\n        )}\n        {product === 'playbooks' && (\n          <InvertedIconButton\n            ariaLabel=\"Tasks\"\n            glyph={<CheckboxMultipleMarkedOutlineIcon />}\n          />\n        )}\n        {isChannels && (\n          <>\n            <InvertedIconButton\n              ariaLabel=\"Recent mentions\"\n              glyph={<AtIcon />}\n            />\n            <InvertedIconButton\n              ariaLabel=\"Saved messages\"\n              glyph={<BookmarkOutlineIcon />}\n            />\n          </>\n        )}\n        {!isChannels && (\n          <InvertedIconButton\n            ariaLabel=\"Help\"\n            glyph={<HelpCircleOutlineIcon />}\n          />\n        )}\n        <InvertedIconButton ariaLabel=\"Settings\" glyph={<CogOutlineIcon />} />\n        <button\n          className={styles['global-header__account']}\n          aria-label=\"Account menu\"\n        >\n          <UserAvatar\n            src={userAvatarSrc}\n            alt={userAvatarAlt}\n            size=\"24\"\n            status\n          />\n        </button>\n      </div>\n    </header>\n  );\n}\n"],"names":["PRODUCT_ICON","ProductChannelsIcon","ProductPlaybooksIcon","ProductBoardsIcon","PRODUCT_LABEL","InvertedIconButton","ariaLabel","glyph","jsx","IconButton","Icon","ProductBrand","product","ProductIcon","jsxs","styles","Navigator","ArrowLeftIcon","ArrowRightIcon","GlobalHeader","className","showChannelsBranding","showUpgradeButton","userAvatarSrc","userAvatarAlt","isChannels","showBrand","rootClass","ProductsIcon","MagnifyIcon","HelpCircleOutlineIcon","Button","CheckboxMultipleMarkedOutlineIcon","Fragment","AtIcon","BookmarkOutlineIcon","CogOutlineIcon","UserAvatar"],"mappings":"wlCAoCMA,EAGF,CACF,SAAUC,EACV,UAAWC,EACX,OAAQC,CACV,EAEMC,EAAqD,CACzD,SAAU,WACV,UAAW,YACX,OAAQ,QACV,EAEA,SAASC,EAAmB,CAC1B,UAAAC,EACA,MAAAC,CACF,EAGG,CACD,OACEC,EAAAA,IAACC,EAAAA,QAAA,CACC,aAAYH,EACZ,KAAK,QACL,QAAQ,UACR,MAAM,WACN,KAAME,EAAAA,IAACE,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAAH,CAAA,CAAc,CAAA,CAAA,CAG1C,CAEA,SAASI,EAAa,CAAE,QAAAC,GAA6C,CACnE,MAAMC,EAAcb,EAAaY,CAAO,EACxC,OACEE,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,wBAAwB,EAC7C,SAAA,CAAAP,MAAC,OAAA,CAAK,UAAWO,EAAAA,QAAO,6BAA6B,EAAG,cAAW,GACjE,SAAAP,EAAAA,IAACE,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOF,EAAAA,IAACK,EAAA,CAAA,CAAY,EAAI,EAC1C,EACAL,MAAC,QAAK,UAAWO,EAAAA,QAAO,6BAA6B,EAClD,SAAAX,EAAcQ,CAAO,CAAA,CACxB,CAAA,EACF,CAEJ,CAEA,SAASI,GAAY,CACnB,OACEF,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,0BAA0B,EAC/C,SAAA,CAAAP,MAACH,GAAmB,UAAU,OAAO,MAAOG,MAACS,IAAc,EAAI,QAC9DZ,EAAA,CAAmB,UAAU,UAAU,MAAOG,EAAAA,IAACU,IAAe,CAAA,CAAI,CAAA,EACrE,CAEJ,CAaA,SAAwBC,EAAa,CACnC,UAAAC,EAAY,GACZ,QAAAR,EAAU,WACV,qBAAAS,EAAuB,GACvB,kBAAAC,EAAoB,GACpB,cAAAC,EACA,cAAAC,EAAgB,MAClB,EAAsB,CACpB,MAAMC,EAAab,IAAY,WACzBc,EAAYD,EAAaJ,EAAuB,GAEhDM,EAAY,CAChBZ,EAAAA,QAAO,eAAe,EACtBU,EACIV,EAAAA,QAAO,yBAAyB,EAChCA,EAAAA,QAAO,6BAA6B,EACxCK,CAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEN,EAAAA,KAAC,SAAA,CAAO,UAAWa,EACjB,SAAA,CAAAb,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,qBAAqB,EAC1C,SAAA,CAAAP,EAAAA,IAACH,EAAA,CACC,UAAU,mBACV,YAAQuB,EAAA,CAAA,CAAa,CAAA,CAAA,EAEtBF,GAAalB,EAAAA,IAACG,EAAA,CAAa,QAAAC,CAAA,CAAkB,QAC7CI,EAAA,CAAA,CAAU,CAAA,EACb,EAECS,GACCX,EAAAA,KAAC,MAAA,CAAI,UAAWC,UAAO,uBAAuB,EAC5C,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,uBAAuB,EAC5C,SAAA,CAAAP,MAAC,OAAA,CAAK,UAAWO,EAAAA,QAAO,4BAA4B,EAAG,cAAW,GAChE,SAAAP,EAAAA,IAACE,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOF,EAAAA,IAACqB,EAAA,CAAA,CAAY,EAAI,EAC1C,EACArB,EAAAA,IAAC,QAAA,CACC,KAAK,SACL,UAAWO,EAAAA,QAAO,6BAA6B,EAC/C,YAAY,SACZ,aAAW,QAAA,CAAA,CACb,EACF,EACAP,EAAAA,IAACH,EAAA,CACC,UAAU,OACV,YAAQyB,EAAA,CAAA,CAAsB,CAAA,CAAA,CAChC,EACF,EAGFhB,EAAAA,KAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,sBAAsB,EAC1C,SAAA,CAAAO,SACES,EAAAA,QAAA,CAAO,SAAS,UAAU,KAAK,UAAU,SAAA,UAE1C,EAEDnB,IAAY,aACXJ,EAAAA,IAACH,EAAA,CACC,UAAU,QACV,YAAQ2B,EAAA,CAAA,CAAkC,CAAA,CAAA,EAG7CP,GACCX,EAAAA,KAAAmB,WAAA,CACE,SAAA,CAAAzB,EAAAA,IAACH,EAAA,CACC,UAAU,kBACV,YAAQ6B,EAAA,CAAA,CAAO,CAAA,CAAA,EAEjB1B,EAAAA,IAACH,EAAA,CACC,UAAU,iBACV,YAAQ8B,EAAA,CAAA,CAAoB,CAAA,CAAA,CAC9B,EACF,EAED,CAACV,GACAjB,EAAAA,IAACH,EAAA,CACC,UAAU,OACV,YAAQyB,EAAA,CAAA,CAAsB,CAAA,CAAA,QAGjCzB,EAAA,CAAmB,UAAU,WAAW,MAAOG,MAAC4B,IAAe,EAAI,EACpE5B,EAAAA,IAAC,SAAA,CACC,UAAWO,EAAAA,QAAO,wBAAwB,EAC1C,aAAW,eAEX,SAAAP,EAAAA,IAAC6B,EAAAA,QAAA,CACC,IAAKd,EACL,IAAKC,EACL,KAAK,KACL,OAAM,EAAA,CAAA,CACR,CAAA,CACF,CAAA,CACF,CAAA,EACF,CAEJ"}

package/dist/components/global-header/GlobalHeader.css

@@ -0,0 +1 @@
+._global-header_11raj_2{position:relative;display:grid;align-items:center;width:100%;height:40px;flex-shrink:0;padding:0 var(--spacing-xxxxs);background:var(--sidebar-header-bg)}._global-header--channels_11raj_13{grid-template-columns:max-content minmax(0,1fr) max-content}._global-header--product-only_11raj_16{grid-template-columns:auto minmax(0,1fr)}._global-header__left_11raj_19{grid-column:1;grid-row:1;display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xxxs) var(--spacing-xs);flex-shrink:0}._global-header__product_11raj_28{display:flex;align-items:center;gap:var(--spacing-xxxs);padding:2px 0}._global-header__product-icon_11raj_34{display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--sidebar-text);opacity:.64}._global-header__product-name_11raj_42{margin:0;font-family:var(--font-family-heading);font-size:var(--font-size-200);font-weight:var(--font-weight-semibold);line-height:var(--line-height-200);color:rgba(var(--sidebar-text-rgb),.64);white-space:nowrap}._global-header__navigator_11raj_51{display:flex;align-items:center;gap:var(--spacing-xxxs)}._global-header__center_11raj_56{grid-column:2;grid-row:1;justify-self:center;display:flex;align-items:center;gap:var(--spacing-xxxs);padding:var(--spacing-xxxxs) 0 var(--spacing-xxxxs) var(--spacing-xxxs);min-width:0;width:max-content;max-width:100%}._global-header__search_11raj_68{display:flex;align-items:center;gap:var(--spacing-xs);width:432px;height:28px;padding:var(--spacing-xs) var(--spacing-m) var(--spacing-xs) var(--spacing-xs);background:rgba(var(--sidebar-text-rgb),.08);border-radius:var(--radius-s);cursor:text;transition:background-color var(--duration-quick) var(--ease-transition)}._global-header__search_11raj_68:hover{background:rgba(var(--sidebar-text-rgb),.12)}._global-header__search-icon_11raj_83{display:inline-flex;align-items:center;flex-shrink:0;color:rgba(var(--sidebar-text-rgb),.64)}._global-header__search-input_11raj_89{flex:1 1 0;min-width:0;margin:0;padding:0;border:0;background:transparent;font-family:var(--font-family-body);font-size:var(--font-size-75);line-height:var(--line-height-75);font-weight:var(--font-weight-regular);letter-spacing:.02em;color:var(--sidebar-text)}._global-header__search-input_11raj_89:focus{outline:none}._global-header__search-input_11raj_89::placeholder{color:rgba(var(--sidebar-text-rgb),.64)}._global-header__right_11raj_109{grid-row:1;display:flex;align-items:center;justify-content:flex-end;gap:var(--spacing-xxxs);padding:0 var(--spacing-xs);flex-shrink:0}._global-header--channels_11raj_13 ._global-header__right_11raj_109{grid-column:3}._global-header--product-only_11raj_16 ._global-header__right_11raj_109{grid-column:2}._global-header__account_11raj_124{--status-badge-bg: var(--sidebar-header-bg);display:inline-flex;align-items:center;padding:var(--spacing-xxxxs) var(--spacing-xs);background:transparent;border:0;border-radius:var(--radius-s);cursor:pointer;transition:background-color var(--duration-quick) var(--ease-transition)}._global-header__account_11raj_124:hover{background:rgba(var(--sidebar-text-rgb),.08)}

package/dist/components/global-header/GlobalHeader.d.ts

@@ -0,0 +1,28 @@
+export type GlobalHeaderProduct = 'channels' | 'playbooks' | 'boards';
+export interface GlobalHeaderProps {
+    /** Optional CSS class name. */
+    className?: string;
+    /** Product context. Controls branding + right-side controls. Default: Channels. */
+    product?: GlobalHeaderProduct;
+    /** When true and product is Channels, shows the Channels product icon + label. */
+    showChannelsBranding?: boolean;
+    /** When true, shows the Upgrade button in the right controls. */
+    showUpgradeButton?: boolean;
+    /** URL for the signed-in user avatar. Omit for initials fallback. */
+    userAvatarSrc?: string;
+    /** Alt text for the signed-in user avatar. */
+    userAvatarAlt?: string;
+}
+/**
+ * Global Header pattern — top bar spanning the full viewport that contains
+ * the product switcher, product branding, navigator, and session-level
+ * controls (search, mentions, saved, settings, account).
+ *
+ * Layout uses a three-column CSS grid for Channels (left | centered search + help | session)
+ * so session controls stay anchored to the trailing edge. Playbooks/Boards omit the center
+ * column and use two tracks (left product block | session).
+ *
+ * Matches Figma Global Header v1.2.1 (node 613:4135).
+ */
+export default function GlobalHeader({ className, product, showChannelsBranding, showUpgradeButton, userAvatarSrc, userAvatarAlt, }: GlobalHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GlobalHeader.d.ts.map

package/dist/components/global-header/GlobalHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalHeader.d.ts","sourceRoot":"","sources":["../../../src/components/global-header/GlobalHeader.tsx"],"names":[],"mappings":"AAmBA,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,WAAW,GAAG,QAAQ,CAAC;AAEtE,MAAM,WAAW,iBAAiB;IAChC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mFAAmF;IACnF,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,kFAAkF;IAClF,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,qEAAqE;IACrE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA0DD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,SAAc,EACd,OAAoB,EACpB,oBAA2B,EAC3B,iBAAyB,EACzB,aAAa,EACb,aAAsB,GACvB,EAAE,iBAAiB,2CA0FnB"}