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

package/dist/components/toast/Toast.js

@@ -0,0 +1,59 @@
+import { jsxs as n, jsx as o } from "react/jsx-runtime";
+import __r from "@mattermost/compass-icons/components/alert-circle-outline.js";const r=__r&&__r.default?__r.default:__r;
+import __h from "@mattermost/compass-icons/components/alert-outline.js";const h=__h&&__h.default?__h.default:__h;
+import __C from "@mattermost/compass-icons/components/check.js";const C=__C&&__C.default?__C.default:__C;
+import ___ from "@mattermost/compass-icons/components/close.js";const _=___&&___.default?___.default:___;
+import __I from "@mattermost/compass-icons/components/information-outline.js";const I=__I&&__I.default?__I.default:__I;
+import g from "../button/Button.js";
+import i, { IconSlotContext as N } from "../icon/Icon.js";
+import v from "../icon-button/IconButton.js";
+import t from "./Toast.module.scss.js";
+const x = {
+  general: /* @__PURE__ */ o(r, {}),
+  info: /* @__PURE__ */ o(I, {}),
+  success: /* @__PURE__ */ o(C, {}),
+  danger: /* @__PURE__ */ o(h, {}),
+  warning: /* @__PURE__ */ o(r, {})
+};
+function T({
+  className: l = "",
+  message: c,
+  type: e = "general",
+  icon: m,
+  actionLabel: a,
+  onAction: p,
+  onDismiss: s
+}) {
+  const d = t[`toast--type-${e.toLowerCase()}`], f = s == null ? t["toast--no-dismiss"] : "", u = [t.toast, d, f, l].filter(Boolean).join(" ");
+  return /* @__PURE__ */ n("div", { className: u, role: "status", "aria-live": "polite", children: [
+    /* @__PURE__ */ n("div", { className: t.toast__content, children: [
+      /* @__PURE__ */ o("span", { className: t.toast__icon, "aria-hidden": !0, children: /* @__PURE__ */ o(N.Provider, { value: { size: "16" }, children: m ?? /* @__PURE__ */ o(i, { glyph: x[e] }) }) }),
+      /* @__PURE__ */ o("span", { className: t.toast__message, children: c }),
+      a != null && /* @__PURE__ */ o(
+        g,
+        {
+          appearance: "default",
+          emphasis: "tertiary",
+          size: "x-small",
+          className: t["toast__action-btn--on-dark"],
+          onClick: p,
+          children: a
+        }
+      )
+    ] }),
+    s != null && /* @__PURE__ */ o(
+      v,
+      {
+        "aria-label": "Dismiss",
+        size: "small",
+        className: t.toast__dismiss,
+        icon: /* @__PURE__ */ o(i, { glyph: /* @__PURE__ */ o(_, {}), size: "16" }),
+        onClick: s
+      }
+    )
+  ] });
+}
+export {
+  T as default
+};
+//# sourceMappingURL=Toast.js.map

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

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

package/dist/components/toast/Toast.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./Toast.css');const t="_toast_1x4xn_2",s="_toast__content_1x4xn_13",_="_toast__icon_1x4xn_21",o="_toast__message_1x4xn_27",a="_toast__dismiss_1x4xn_59",n={toast:t,toast__content:s,toast__icon:_,toast__message:o,"toast__action-btn--on-dark":"_toast__action-btn--on-dark_1x4xn_38",toast__dismiss:a,"toast--type-info":"_toast--type-info_1x4xn_76","toast--type-success":"_toast--type-success_1x4xn_79","toast--type-danger":"_toast--type-danger_1x4xn_82","toast--type-warning":"_toast--type-warning_1x4xn_85","toast--no-dismiss":"_toast--no-dismiss_1x4xn_88"};exports.default=n;exports.toast=t;exports.toast__content=s;exports.toast__dismiss=a;exports.toast__icon=_;exports.toast__message=o;
+//# sourceMappingURL=Toast.module.scss.cjs.map

package/dist/components/toast/Toast.module.scss.cjs.map

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

package/dist/components/toast/Toast.module.scss.js

@@ -0,0 +1,22 @@
+import './Toast.css';const t = "_toast_1x4xn_2", s = "_toast__content_1x4xn_13", _ = "_toast__icon_1x4xn_21", o = "_toast__message_1x4xn_27", n = "_toast__dismiss_1x4xn_59", a = {
+  toast: t,
+  toast__content: s,
+  toast__icon: _,
+  toast__message: o,
+  "toast__action-btn--on-dark": "_toast__action-btn--on-dark_1x4xn_38",
+  toast__dismiss: n,
+  "toast--type-info": "_toast--type-info_1x4xn_76",
+  "toast--type-success": "_toast--type-success_1x4xn_79",
+  "toast--type-danger": "_toast--type-danger_1x4xn_82",
+  "toast--type-warning": "_toast--type-warning_1x4xn_85",
+  "toast--no-dismiss": "_toast--no-dismiss_1x4xn_88"
+};
+export {
+  a as default,
+  t as toast,
+  s as toast__content,
+  n as toast__dismiss,
+  _ as toast__icon,
+  o as toast__message
+};
+//# sourceMappingURL=Toast.module.scss.js.map

package/dist/components/toast/Toast.module.scss.js.map

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

package/dist/components/toast/index.cjs

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

package/dist/components/toast/index.cjs.map

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

package/dist/components/toast/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/toast/index.js

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

package/dist/components/toast/index.js.map

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

package/dist/components/tooltip/Tooltip.cjs

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

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

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

package/dist/components/tooltip/Tooltip.css

@@ -0,0 +1 @@
+._tooltip_31gdg_2{display:inline-flex;align-items:flex-start;align-self:flex-start;position:relative}._tooltip__container_31gdg_8{display:flex;flex-direction:column;align-items:center;max-width:200px;box-sizing:border-box;background-color:var(--neutral-1200);border-radius:var(--radius-s);padding:var(--spacing-xxs) var(--spacing-s);box-shadow:var(--elevation-3);gap:var(--spacing-xxs)}._tooltip__content_31gdg_20{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--spacing-xs);min-width:0;width:100%;padding:.5px 0}._tooltip__icon_31gdg_30{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--neutral-0)}._tooltip__label_31gdg_37{font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);color:var(--neutral-0);min-width:0;text-align:center;white-space:normal;overflow-wrap:break-word}._tooltip__shortcuts_31gdg_47{display:flex;align-items:center;gap:var(--spacing-xxxxs)}._tooltip__hint_31gdg_52{align-self:stretch;font-size:var(--font-size-50);font-weight:var(--font-weight-semibold);line-height:var(--line-height-25);letter-spacing:.11px;color:color-mix(in srgb,var(--neutral-0) 75%,transparent);min-width:0;text-align:center;white-space:normal;overflow-wrap:break-word}._tooltip__arrow_31gdg_64{flex-shrink:0;width:4px;height:8px;position:relative;align-self:center}._tooltip__arrow_31gdg_64:before{content:"";position:absolute;top:50%;left:0;width:0;height:0;transform:translateY(-50%);border-style:solid;border-color:transparent transparent transparent var(--neutral-1200);border-width:4px 0 4px 4px}._tooltip--arrow-right_31gdg_83{flex-direction:row}._tooltip--arrow-left_31gdg_86{flex-direction:row-reverse}._tooltip--arrow-left_31gdg_86 ._tooltip__arrow_31gdg_64:before{border-color:transparent var(--neutral-1200) transparent transparent;border-width:4px 4px 4px 0;top:50%;right:0;left:auto;transform:translateY(-50%)}._tooltip--arrow-bottom_31gdg_97{flex-direction:column}._tooltip--arrow-bottom_31gdg_97 ._tooltip__arrow_31gdg_64{width:8px;height:4px}._tooltip--arrow-bottom_31gdg_97 ._tooltip__arrow_31gdg_64:before{border-width:4px 4px 0;border-color:var(--neutral-1200) transparent transparent;top:0;left:50%;transform:translate(-50%)}._tooltip--arrow-top_31gdg_111{flex-direction:column-reverse}._tooltip--arrow-top_31gdg_111 ._tooltip__arrow_31gdg_64{width:8px;height:4px}._tooltip--arrow-top_31gdg_111 ._tooltip__arrow_31gdg_64:before{border-color:transparent transparent var(--neutral-1200) transparent;border-width:0 4px 4px 4px;bottom:0;left:50%;top:auto;transform:translate(-50%)}

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

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+export type TooltipArrow = 'top' | 'right' | 'bottom' | 'left';
+export interface TooltipShortcutKey {
+    label: string;
+}
+export interface TooltipProps {
+    /** Tooltip label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */
+    label: ReactNode;
+    /** Arrow direction. Default: Right. */
+    arrow?: TooltipArrow;
+    /** Optional hint text shown below label. */
+    hint?: ReactNode;
+    /** Optional keyboard shortcut keys shown below label. */
+    shortcutKeys?: TooltipShortcutKey[];
+    /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; Tooltip provides the correct size via context. */
+    icon?: ReactNode;
+    /** Optional CSS class name. */
+    className?: string;
+}
+/**
+ * Tooltips surface short, supporting text on hover. Reach for a tooltip when the affordance
+ * behind it isn't fully self-explanatory — an Icon Button, a truncated label, a keyboard
+ * shortcut. Don't reach for one when the label is already on screen.
+ */
+export default function Tooltip({ label, arrow, hint, shortcutKeys, icon, className, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Tooltip.d.ts.map

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

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

package/dist/components/tooltip/Tooltip.js

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

package/dist/components/tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { IconSlotContext } from '@/components/icon/Icon';\nimport { ShortcutTagGroup } from '@/components/shortcut-tag/ShortcutTag';\nimport styles from './Tooltip.module.scss';\n\nexport type TooltipArrow = 'top' | 'right' | 'bottom' | 'left';\n\nexport interface TooltipShortcutKey {\n  label: string;\n}\n\nexport interface TooltipProps {\n  /** Tooltip label. Accepts translated nodes (e.g. `<FormattedMessage/>`). */\n  label: ReactNode;\n  /** Arrow direction. Default: Right. */\n  arrow?: TooltipArrow;\n  /** Optional hint text shown below label. */\n  hint?: ReactNode;\n  /** Optional keyboard shortcut keys shown below label. */\n  shortcutKeys?: TooltipShortcutKey[];\n  /** Optional leading icon — pass `<Icon glyph={<SomeIcon />} />`; Tooltip provides the correct size via context. */\n  icon?: ReactNode;\n  /** Optional CSS class name. */\n  className?: string;\n}\n\n/**\n * Tooltips surface short, supporting text on hover. Reach for a tooltip when the affordance\n * behind it isn't fully self-explanatory — an Icon Button, a truncated label, a keyboard\n * shortcut. Don't reach for one when the label is already on screen.\n */\nexport default function Tooltip({\n  label,\n  arrow = 'right',\n  hint,\n  shortcutKeys,\n  icon,\n  className = '',\n}: TooltipProps) {\n  const arrowClass = styles[`tooltip--arrow-${arrow.toLowerCase()}`] ?? '';\n\n  const rootClass = [styles.tooltip, arrowClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClass}>\n      <div className={styles['tooltip__container']}>\n        <div className={styles['tooltip__content']}>\n          {icon != null && (\n            <span className={styles['tooltip__icon']} aria-hidden>\n              <IconSlotContext.Provider value={{ size: '16' }}>\n                {icon}\n              </IconSlotContext.Provider>\n            </span>\n          )}\n          <span className={styles['tooltip__label']}>{label}</span>\n        </div>\n\n        {shortcutKeys && shortcutKeys.length > 0 && (\n          <div className={styles['tooltip__shortcuts']}>\n            <ShortcutTagGroup\n              labels={shortcutKeys.map((key) => key.label)}\n              location=\"tooltips\"\n              size=\"small\"\n            />\n          </div>\n        )}\n\n        {hint != null && hint !== '' ? (\n          <span className={styles['tooltip__hint']}>{hint}</span>\n        ) : null}\n      </div>\n\n      <div className={styles['tooltip__arrow']} aria-hidden />\n    </div>\n  );\n}\n"],"names":["Tooltip","label","arrow","hint","shortcutKeys","icon","className","arrowClass","styles","rootClass","jsxs","jsx","IconSlotContext","ShortcutTagGroup","key"],"mappings":";;;;AA+BA,SAAwBA,EAAQ;AAAA,EAC9B,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAiB;AACf,QAAMC,IAAaC,EAAO,kBAAkBN,EAAM,YAAA,CAAa,EAAE,KAAK,IAEhEO,IAAY,CAACD,EAAO,SAASD,GAAYD,CAAS,EACrD,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAI,EAAC,OAAA,EAAI,WAAWD,GACd,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWF,EAAO,oBACrB,UAAA;AAAA,MAAA,gBAAAE,EAAC,OAAA,EAAI,WAAWF,EAAO,kBACpB,UAAA;AAAA,QAAAH,KAAQ,QACP,gBAAAM,EAAC,QAAA,EAAK,WAAWH,EAAO,eAAkB,eAAW,IACnD,4BAACI,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAM,KAAA,GACtC,aACH,GACF;AAAA,0BAED,QAAA,EAAK,WAAWJ,EAAO,gBAAoB,UAAAP,EAAA,CAAM;AAAA,MAAA,GACpD;AAAA,MAECG,KAAgBA,EAAa,SAAS,uBACpC,OAAA,EAAI,WAAWI,EAAO,oBACrB,UAAA,gBAAAG;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,QAAQT,EAAa,IAAI,CAACU,MAAQA,EAAI,KAAK;AAAA,UAC3C,UAAS;AAAA,UACT,MAAK;AAAA,QAAA;AAAA,MAAA,GAET;AAAA,MAGDX,KAAQ,QAAQA,MAAS,KACxB,gBAAAQ,EAAC,QAAA,EAAK,WAAWH,EAAO,eAAmB,UAAAL,EAAA,CAAK,IAC9C;AAAA,IAAA,GACN;AAAA,sBAEC,OAAA,EAAI,WAAWK,EAAO,gBAAmB,eAAW,GAAA,CAAC;AAAA,EAAA,GACxD;AAEJ;"}

package/dist/components/tooltip/Tooltip.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./Tooltip.css');const t="_tooltip_31gdg_2",o="_tooltip__container_31gdg_8",_="_tooltip__content_31gdg_20",i="_tooltip__icon_31gdg_30",l="_tooltip__label_31gdg_37",p="_tooltip__shortcuts_31gdg_47",r="_tooltip__hint_31gdg_52",n="_tooltip__arrow_31gdg_64",e={tooltip:t,tooltip__container:o,tooltip__content:_,tooltip__icon:i,tooltip__label:l,tooltip__shortcuts:p,tooltip__hint:r,tooltip__arrow:n,"tooltip--arrow-right":"_tooltip--arrow-right_31gdg_83","tooltip--arrow-left":"_tooltip--arrow-left_31gdg_86","tooltip--arrow-bottom":"_tooltip--arrow-bottom_31gdg_97","tooltip--arrow-top":"_tooltip--arrow-top_31gdg_111"};exports.default=e;exports.tooltip=t;exports.tooltip__arrow=n;exports.tooltip__container=o;exports.tooltip__content=_;exports.tooltip__hint=r;exports.tooltip__icon=i;exports.tooltip__label=l;exports.tooltip__shortcuts=p;
+//# sourceMappingURL=Tooltip.module.scss.cjs.map

package/dist/components/tooltip/Tooltip.module.scss.cjs.map

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

package/dist/components/tooltip/Tooltip.module.scss.js

@@ -0,0 +1,26 @@
+import './Tooltip.css';const t = "_tooltip_31gdg_2", o = "_tooltip__container_31gdg_8", _ = "_tooltip__content_31gdg_20", i = "_tooltip__icon_31gdg_30", l = "_tooltip__label_31gdg_37", p = "_tooltip__shortcuts_31gdg_47", r = "_tooltip__hint_31gdg_52", n = "_tooltip__arrow_31gdg_64", g = {
+  tooltip: t,
+  tooltip__container: o,
+  tooltip__content: _,
+  tooltip__icon: i,
+  tooltip__label: l,
+  tooltip__shortcuts: p,
+  tooltip__hint: r,
+  tooltip__arrow: n,
+  "tooltip--arrow-right": "_tooltip--arrow-right_31gdg_83",
+  "tooltip--arrow-left": "_tooltip--arrow-left_31gdg_86",
+  "tooltip--arrow-bottom": "_tooltip--arrow-bottom_31gdg_97",
+  "tooltip--arrow-top": "_tooltip--arrow-top_31gdg_111"
+};
+export {
+  g as default,
+  t as tooltip,
+  n as tooltip__arrow,
+  o as tooltip__container,
+  _ as tooltip__content,
+  r as tooltip__hint,
+  i as tooltip__icon,
+  l as tooltip__label,
+  p as tooltip__shortcuts
+};
+//# sourceMappingURL=Tooltip.module.scss.js.map

package/dist/components/tooltip/Tooltip.module.scss.js.map

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

package/dist/components/tooltip/index.cjs

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

package/dist/components/tooltip/index.cjs.map

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

package/dist/components/tooltip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC"}

package/dist/components/tooltip/index.js

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

package/dist/components/tooltip/index.js.map

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

package/dist/components/tour-point/TourPoint.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/close.js"),x=__x?.default??__x,__h=require("@mattermost/compass-icons/components/chevron-right.js"),h=__h?.default??__h,m=require("../button/Button.cjs"),u=require("../icon/Icon.cjs"),g=require("../icon-button/IconButton.cjs"),N=require("../pagination-dots/PaginationDots.cjs"),v=require("../../utils/string.cjs"),t=require("./TourPoint.module.scss.cjs");function q({title:r,children:d,media:n,pointerPosition:o="top-center",showPulsingDot:c=!0,onClose:l,progress:s,primaryAction:a,className:p=""}){const i=o!=="none",_=i&&t.default[`tour-point--pointer-${v.toKebab(o)}`],f=[t.default["tour-point"],_,p].filter(Boolean).join(" "),j=s!=null||a!=null;return e.jsxs("div",{className:f,children:[i&&e.jsxs("span",{className:t.default["tour-point__pointer"],"aria-hidden":!0,children:[e.jsx("span",{className:t.default["tour-point__pointer-triangle"]}),c&&e.jsxs("span",{className:t.default["tour-point__pointer-pulse"],children:[e.jsx("span",{className:t.default["tour-point__pointer-pulse-ring"]}),e.jsx("span",{className:[t.default["tour-point__pointer-pulse-ring"],t.default["tour-point__pointer-pulse-ring--delay"]].join(" ")}),e.jsx("span",{className:t.default["tour-point__pointer-pulse-core"]})]})]}),e.jsxs("div",{className:t.default["tour-point__panel"],children:[e.jsxs("div",{className:t.default["tour-point__header"],children:[e.jsx("h2",{className:t.default["tour-point__title"],children:r}),l&&e.jsx(g.default,{className:t.default["tour-point__close"],"aria-label":"Close",size:"small",padding:"compact",style:"default",icon:e.jsx(u.default,{size:"16",glyph:e.jsx(x,{})}),onClick:l})]}),e.jsxs("div",{className:t.default["tour-point__body"],children:[e.jsx("div",{className:t.default["tour-point__description"],children:d}),n!=null&&e.jsx("div",{className:t.default["tour-point__media"],children:n})]}),j&&e.jsxs("div",{className:t.default["tour-point__footer"],children:[s!=null?e.jsx(N.default,{className:t.default["tour-point__progress"],pages:s.pages,activePage:s.activePage,dotStyle:"on-primary",onPageChange:s.onPageChange}):e.jsx("span",{className:t.default["tour-point__footer-spacer"],"aria-hidden":!0}),a!=null?e.jsx("div",{className:t.default["tour-point__next-wrap"],children:e.jsx(m.default,{emphasis:"primary",size:"small",trailingIcon:e.jsx(u.default,{size:"16",glyph:e.jsx(h,{})}),onClick:a.onClick,children:a.label})}):null]})]})]})}exports.default=q;
+//# sourceMappingURL=TourPoint.cjs.map

package/dist/components/tour-point/TourPoint.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TourPoint.cjs","sources":["../../../src/components/tour-point/TourPoint.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport ChevronRightIcon from '@mattermost/compass-icons/components/chevron-right';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport PaginationDots from '@/components/pagination-dots/PaginationDots';\nimport { toKebab } from '@/utils/string';\nimport styles from './TourPoint.module.scss';\n\nexport type TourPointPointerPosition =\n  | 'top-center'\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-center'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'left-center'\n  | 'right-center';\n\nexport interface TourPointProgress {\n  pages: number;\n  activePage: number;\n  onPageChange?: (page: number) => void;\n}\n\nexport interface TourPointPrimaryAction {\n  label: string;\n  onClick?: () => void;\n}\n\nexport interface TourPointProps {\n  title: string;\n  children: ReactNode;\n  /** Optional image between body copy and footer (e.g. screenshot as an img). */\n  media?: ReactNode;\n  /** Where the pointer sits on the card edge; omit or `none` to hide the pointer. */\n  pointerPosition?: TourPointPointerPosition | 'none';\n  /**\n   * Animated marker at the arrow tip (Figma Pulsing Dot). Only applies when a\n   * pointer is shown. Default on; set false for reduced motion preference at the\n   * callsite or a static tour step.\n   */\n  showPulsingDot?: boolean;\n  onClose?: () => void;\n  progress?: TourPointProgress;\n  primaryAction?: TourPointPrimaryAction;\n  className?: string;\n}\n\nexport default function TourPoint({\n  title,\n  children,\n  media,\n  pointerPosition = 'top-center',\n  showPulsingDot = true,\n  onClose,\n  progress,\n  primaryAction,\n  className = '',\n}: TourPointProps) {\n  const showPointer = pointerPosition !== 'none';\n  const pointerModifier =\n    showPointer &&\n    styles[\n      `tour-point--pointer-${toKebab(pointerPosition as TourPointPointerPosition)}`\n    ];\n\n  const rootClass = [styles['tour-point'], pointerModifier, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const showFooter = progress != null || primaryAction != null;\n\n  return (\n    <div className={rootClass}>\n      {showPointer && (\n        <span className={styles['tour-point__pointer']} aria-hidden>\n          <span className={styles['tour-point__pointer-triangle']} />\n          {showPulsingDot && (\n            <span className={styles['tour-point__pointer-pulse']}>\n              <span className={styles['tour-point__pointer-pulse-ring']} />\n              <span\n                className={[\n                  styles['tour-point__pointer-pulse-ring'],\n                  styles['tour-point__pointer-pulse-ring--delay'],\n                ].join(' ')}\n              />\n              <span className={styles['tour-point__pointer-pulse-core']} />\n            </span>\n          )}\n        </span>\n      )}\n\n      <div className={styles['tour-point__panel']}>\n        <div className={styles['tour-point__header']}>\n          <h2 className={styles['tour-point__title']}>{title}</h2>\n          {onClose && (\n            <IconButton\n              className={styles['tour-point__close']}\n              aria-label=\"Close\"\n              size=\"small\"\n              padding=\"compact\"\n              style=\"default\"\n              icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n              onClick={onClose}\n            />\n          )}\n        </div>\n\n        <div className={styles['tour-point__body']}>\n          <div className={styles['tour-point__description']}>{children}</div>\n          {media != null && (\n            <div className={styles['tour-point__media']}>{media}</div>\n          )}\n        </div>\n\n        {showFooter && (\n          <div className={styles['tour-point__footer']}>\n            {progress != null ? (\n              <PaginationDots\n                className={styles['tour-point__progress']}\n                pages={progress.pages}\n                activePage={progress.activePage}\n                dotStyle=\"on-primary\"\n                onPageChange={progress.onPageChange}\n              />\n            ) : (\n              <span\n                className={styles['tour-point__footer-spacer']}\n                aria-hidden\n              />\n            )}\n\n            {primaryAction != null ? (\n              <div className={styles['tour-point__next-wrap']}>\n                <Button\n                  emphasis=\"primary\"\n                  size=\"small\"\n                  trailingIcon={<Icon size=\"16\" glyph={<ChevronRightIcon />} />}\n                  onClick={primaryAction.onClick}\n                >\n                  {primaryAction.label}\n                </Button>\n              </div>\n            ) : null}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["TourPoint","title","children","media","pointerPosition","showPulsingDot","onClose","progress","primaryAction","className","showPointer","pointerModifier","styles","toKebab","rootClass","showFooter","jsxs","jsx","IconButton","Icon","CloseIcon","PaginationDots","Button","ChevronRightIcon"],"mappings":"kfAkDA,SAAwBA,EAAU,CAChC,MAAAC,EACA,SAAAC,EACA,MAAAC,EACA,gBAAAC,EAAkB,aAClB,eAAAC,EAAiB,GACjB,QAAAC,EACA,SAAAC,EACA,cAAAC,EACA,UAAAC,EAAY,EACd,EAAmB,CACjB,MAAMC,EAAcN,IAAoB,OAClCO,EACJD,GACAE,UACE,uBAAuBC,UAAQT,CAA2C,CAAC,EAC7E,EAEIU,EAAY,CAACF,UAAO,YAAY,EAAGD,EAAiBF,CAAS,EAChE,OAAO,OAAO,EACd,KAAK,GAAG,EAELM,EAAaR,GAAY,MAAQC,GAAiB,KAExD,OACEQ,EAAAA,KAAC,MAAA,CAAI,UAAWF,EACb,SAAA,CAAAJ,UACE,OAAA,CAAK,UAAWE,UAAO,qBAAqB,EAAG,cAAW,GACzD,SAAA,CAAAK,EAAAA,IAAC,OAAA,CAAK,UAAWL,EAAAA,QAAO,8BAA8B,CAAA,CAAG,EACxDP,GACCW,EAAAA,KAAC,OAAA,CAAK,UAAWJ,UAAO,2BAA2B,EACjD,SAAA,CAAAK,EAAAA,IAAC,OAAA,CAAK,UAAWL,EAAAA,QAAO,gCAAgC,CAAA,CAAG,EAC3DK,EAAAA,IAAC,OAAA,CACC,UAAW,CACTL,EAAAA,QAAO,gCAAgC,EACvCA,EAAAA,QAAO,uCAAuC,CAAA,EAC9C,KAAK,GAAG,CAAA,CAAA,EAEZK,EAAAA,IAAC,OAAA,CAAK,UAAWL,EAAAA,QAAO,gCAAgC,CAAA,CAAG,CAAA,CAAA,CAC7D,CAAA,EAEJ,EAGFI,EAAAA,KAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,mBAAmB,EACxC,SAAA,CAAAI,EAAAA,KAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,oBAAoB,EACzC,SAAA,CAAAK,MAAC,KAAA,CAAG,UAAWL,EAAAA,QAAO,mBAAmB,EAAI,SAAAX,EAAM,EAClDK,GACCW,EAAAA,IAACC,EAAAA,QAAA,CACC,UAAWN,EAAAA,QAAO,mBAAmB,EACrC,aAAW,QACX,KAAK,QACL,QAAQ,UACR,MAAM,UACN,WAAOO,UAAA,CAAK,KAAK,KAAK,MAAOF,MAACG,IAAU,EAAI,EAC5C,QAASd,CAAA,CAAA,CACX,EAEJ,EAEAU,EAAAA,KAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,kBAAkB,EACvC,SAAA,CAAAK,EAAAA,IAAC,MAAA,CAAI,UAAWL,EAAAA,QAAO,yBAAyB,EAAI,SAAAV,EAAS,EAC5DC,GAAS,MACRc,EAAAA,IAAC,MAAA,CAAI,UAAWL,EAAAA,QAAO,mBAAmB,EAAI,SAAAT,CAAA,CAAM,CAAA,EAExD,EAECY,GACCC,EAAAA,KAAC,MAAA,CAAI,UAAWJ,UAAO,oBAAoB,EACxC,SAAA,CAAAL,GAAY,KACXU,EAAAA,IAACI,EAAAA,QAAA,CACC,UAAWT,EAAAA,QAAO,sBAAsB,EACxC,MAAOL,EAAS,MAChB,WAAYA,EAAS,WACrB,SAAS,aACT,aAAcA,EAAS,YAAA,CAAA,EAGzBU,EAAAA,IAAC,OAAA,CACC,UAAWL,EAAAA,QAAO,2BAA2B,EAC7C,cAAW,EAAA,CAAA,EAIdJ,GAAiB,KAChBS,EAAAA,IAAC,OAAI,UAAWL,UAAO,uBAAuB,EAC5C,SAAAK,EAAAA,IAACK,EAAAA,QAAA,CACC,SAAS,UACT,KAAK,QACL,mBAAeH,UAAA,CAAK,KAAK,KAAK,MAAOF,MAACM,IAAiB,EAAI,EAC3D,QAASf,EAAc,QAEtB,SAAAA,EAAc,KAAA,CAAA,EAEnB,EACE,IAAA,CAAA,CACN,CAAA,CAAA,CAEJ,CAAA,EACF,CAEJ"}

package/dist/components/tour-point/TourPoint.css

@@ -0,0 +1 @@
+@keyframes _tour-point-panel-in_xtgrh_1{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes _tour-point-pulse-ring_xtgrh_1{0%{transform:scale(1);opacity:0}2.25%{opacity:.52}8.25%{opacity:.38}37.5%,to{transform:scale(4.25);opacity:0}}._tour-point_xtgrh_28{position:relative;display:inline-flex;flex-direction:column;align-items:stretch;max-width:352px;min-width:280px}._tour-point__pointer_xtgrh_36{position:absolute;z-index:2;pointer-events:none;overflow:visible}._tour-point__pointer-triangle_xtgrh_42{position:relative;z-index:2;display:block;width:100%;height:100%;background-color:var(--button-bg)}._tour-point__pointer-pulse_xtgrh_50{position:absolute;z-index:0;width:40px;height:40px;pointer-events:none}._tour-point__pointer-pulse-ring_xtgrh_57{position:absolute;left:50%;top:50%;z-index:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:var(--radius-full);background-color:rgba(var(--color-success-rgb),.36);transform-origin:center center;animation:_tour-point-pulse-ring_xtgrh_1 calc(4 * var(--duration-moderate) + 40 * var(--duration-quick) / 3) linear infinite;will-change:transform,opacity}._tour-point__pointer-pulse-ring--delay_xtgrh_71{animation-delay:calc(2 * var(--duration-moderate))}@media(prefers-reduced-motion:reduce){._tour-point__pointer-pulse-ring_xtgrh_57{animation:none;opacity:0}}._tour-point__pointer-pulse-core_xtgrh_80{position:absolute;left:50%;top:50%;z-index:1;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:var(--radius-full);background-color:var(--color-success)}._tour-point__panel_xtgrh_91{position:relative;z-index:1;display:flex;flex-direction:column;border-radius:var(--radius-m);background-color:var(--button-bg);box-shadow:var(--elevation-4);animation:_tour-point-panel-in_xtgrh_1 var(--duration-quick) var(--ease-entrance) both}._tour-point--pointer-top-center_xtgrh_101 ._tour-point__panel_xtgrh_91,._tour-point--pointer-top-left_xtgrh_101 ._tour-point__panel_xtgrh_91,._tour-point--pointer-top-right_xtgrh_101 ._tour-point__panel_xtgrh_91{transform-origin:50% 0}._tour-point--pointer-bottom-center_xtgrh_104 ._tour-point__panel_xtgrh_91,._tour-point--pointer-bottom-left_xtgrh_104 ._tour-point__panel_xtgrh_91,._tour-point--pointer-bottom-right_xtgrh_104 ._tour-point__panel_xtgrh_91{transform-origin:50% 100%}._tour-point--pointer-left-center_xtgrh_107 ._tour-point__panel_xtgrh_91{transform-origin:0 50%}._tour-point--pointer-right-center_xtgrh_110 ._tour-point__panel_xtgrh_91{transform-origin:100% 50%}._tour-point__header_xtgrh_113{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-m);padding:var(--spacing-xl) var(--spacing-xl) 0}._tour-point_xtgrh_28 ._tour-point__panel_xtgrh_91 ._tour-point__header_xtgrh_113 ._tour-point__close_xtgrh_120{--focus-ring-color: var(--button-color);position:relative;top:-4px;right:-4px;color:color-mix(in srgb,var(--button-color) 64%,transparent)}._tour-point_xtgrh_28 ._tour-point__panel_xtgrh_91 ._tour-point__header_xtgrh_113 ._tour-point__close_xtgrh_120:hover:not(:disabled):not(:active){background-color:color-mix(in srgb,var(--button-color) 8%,transparent);color:color-mix(in srgb,var(--button-color) 75%,transparent)}._tour-point_xtgrh_28 ._tour-point__panel_xtgrh_91 ._tour-point__header_xtgrh_113 ._tour-point__close_xtgrh_120:active:not(:disabled){background-color:color-mix(in srgb,var(--button-color) 20%,transparent)}._tour-point__title_xtgrh_134{margin:0;padding-right:var(--spacing-xs);font-family:var(--font-family-body);font-size:var(--font-size-100);font-weight:var(--font-weight-semibold);line-height:var(--line-height-100);color:var(--neutral-0)}._tour-point__body_xtgrh_143{display:flex;flex-direction:column;gap:var(--spacing-m);padding:var(--spacing-m) var(--spacing-xl) var(--spacing-xl)}._tour-point__description_xtgrh_149{font-size:var(--font-size-100);font-weight:var(--font-weight-regular);line-height:var(--line-height-100);color:color-mix(in srgb,var(--neutral-0) 92%,transparent)}._tour-point__media_xtgrh_155{border-radius:var(--radius-s);background-color:var(--color-blue-800);padding:var(--spacing-m);color:color-mix(in srgb,var(--neutral-0) 88%,transparent);font-size:var(--font-size-75);line-height:var(--line-height-100);border:1px solid color-mix(in srgb,var(--neutral-0) 20%,transparent)}._tour-point__media_xtgrh_155 img{display:block;width:100%;height:auto;border-radius:var(--radius-xs)}._tour-point__footer_xtgrh_170{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-l);padding:0 var(--spacing-xl) var(--spacing-xl)}._tour-point__footer-spacer_xtgrh_177{flex:1 0 0;min-width:0}._tour-point__progress_xtgrh_181,._tour-point__next-wrap_xtgrh_184{flex-shrink:0}._tour-point__next-wrap_xtgrh_184 button{--focus-ring-color: var(--neutral-0);background-color:var(--neutral-0);border-color:transparent;color:var(--button-bg);transition:background-color var(--duration-quick) var(--ease-transition),color var(--duration-quick) var(--ease-transition),outline-color var(--duration-quick) var(--ease-transition),outline-offset var(--duration-quick) var(--ease-transition)}._tour-point__next-wrap_xtgrh_184 button:hover:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 92%,transparent)}._tour-point__next-wrap_xtgrh_184 button:active:not(:disabled){background-color:color-mix(in srgb,var(--neutral-0) 86%,transparent)}._tour-point--pointer-top-center_xtgrh_101 ._tour-point__pointer_xtgrh_36{top:-9px;left:50%;width:18px;height:9px;transform:translate(-50%)}._tour-point--pointer-top-center_xtgrh_101 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 0%,0% 100%,100% 100%)}._tour-point--pointer-top-center_xtgrh_101 ._tour-point__pointer-pulse_xtgrh_50{left:50%;top:0;margin-left:-20px;margin-top:-20px}._tour-point--pointer-top-left_xtgrh_101 ._tour-point__pointer_xtgrh_36{top:-9px;left:var(--spacing-xl);width:18px;height:9px;transform:translate(-50%)}._tour-point--pointer-top-left_xtgrh_101 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 0%,0% 100%,100% 100%)}._tour-point--pointer-top-left_xtgrh_101 ._tour-point__pointer-pulse_xtgrh_50{left:50%;top:0;margin-left:-20px;margin-top:-20px}._tour-point--pointer-top-right_xtgrh_101 ._tour-point__pointer_xtgrh_36{top:-9px;right:var(--spacing-xl);width:18px;height:9px;transform:translate(50%)}._tour-point--pointer-top-right_xtgrh_101 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 0%,0% 100%,100% 100%)}._tour-point--pointer-top-right_xtgrh_101 ._tour-point__pointer-pulse_xtgrh_50{left:50%;top:0;margin-left:-20px;margin-top:-20px}._tour-point--pointer-bottom-center_xtgrh_104 ._tour-point__pointer_xtgrh_36{bottom:-9px;left:50%;width:18px;height:9px;transform:translate(-50%)}._tour-point--pointer-bottom-center_xtgrh_104 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 100%,0% 0%,100% 0%)}._tour-point--pointer-bottom-center_xtgrh_104 ._tour-point__pointer-pulse_xtgrh_50{left:50%;bottom:0;margin-left:-20px;margin-bottom:-20px}._tour-point--pointer-bottom-left_xtgrh_104 ._tour-point__pointer_xtgrh_36{bottom:-9px;left:var(--spacing-xl);width:18px;height:9px;transform:translate(-50%)}._tour-point--pointer-bottom-left_xtgrh_104 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 100%,0% 0%,100% 0%)}._tour-point--pointer-bottom-left_xtgrh_104 ._tour-point__pointer-pulse_xtgrh_50{left:50%;bottom:0;margin-left:-20px;margin-bottom:-20px}._tour-point--pointer-bottom-right_xtgrh_104 ._tour-point__pointer_xtgrh_36{bottom:-9px;right:var(--spacing-xl);width:18px;height:9px;transform:translate(50%)}._tour-point--pointer-bottom-right_xtgrh_104 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(50% 100%,0% 0%,100% 0%)}._tour-point--pointer-bottom-right_xtgrh_104 ._tour-point__pointer-pulse_xtgrh_50{left:50%;bottom:0;margin-left:-20px;margin-bottom:-20px}._tour-point--pointer-left-center_xtgrh_107 ._tour-point__pointer_xtgrh_36{left:-9px;top:50%;width:9px;height:18px;transform:translateY(-50%)}._tour-point--pointer-left-center_xtgrh_107 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(0% 50%,100% 0%,100% 100%)}._tour-point--pointer-left-center_xtgrh_107 ._tour-point__pointer-pulse_xtgrh_50{left:0;top:50%;margin-left:-20px;margin-top:-20px}._tour-point--pointer-right-center_xtgrh_110 ._tour-point__pointer_xtgrh_36{right:-9px;top:50%;width:9px;height:18px;transform:translateY(-50%)}._tour-point--pointer-right-center_xtgrh_110 ._tour-point__pointer-triangle_xtgrh_42{clip-path:polygon(100% 50%,0% 0%,0% 100%)}._tour-point--pointer-right-center_xtgrh_110 ._tour-point__pointer-pulse_xtgrh_50{right:0;top:50%;margin-right:-20px;margin-top:-20px}

package/dist/components/tour-point/TourPoint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TourPoint.d.ts","sourceRoot":"","sources":["../../../src/components/tour-point/TourPoint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUvC,MAAM,MAAM,wBAAwB,GAChC,YAAY,GACZ,UAAU,GACV,WAAW,GACX,eAAe,GACf,aAAa,GACb,cAAc,GACd,aAAa,GACb,cAAc,CAAC;AAEnB,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,mFAAmF;IACnF,eAAe,CAAC,EAAE,wBAAwB,GAAG,MAAM,CAAC;IACpD;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,KAAK,EACL,eAA8B,EAC9B,cAAqB,EACrB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,SAAc,GACf,EAAE,cAAc,2CA2FhB"}

package/dist/components/tour-point/TourPoint.js

@@ -0,0 +1,93 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import __f from "@mattermost/compass-icons/components/close.js";const f=__f&&__f.default?__f.default:__f;
+import __g from "@mattermost/compass-icons/components/chevron-right.js";const g=__g&&__g.default?__g.default:__g;
+import v from "../button/Button.js";
+import p from "../icon/Icon.js";
+import C from "../icon-button/IconButton.js";
+import y from "../pagination-dots/PaginationDots.js";
+import { toKebab as P } from "../../utils/string.js";
+import o from "./TourPoint.module.scss.js";
+function F({
+  title: c,
+  children: u,
+  media: a,
+  pointerPosition: r = "top-center",
+  showPulsingDot: m = !0,
+  onClose: l,
+  progress: n,
+  primaryAction: i,
+  className: _ = ""
+}) {
+  const s = r !== "none", d = s && o[`tour-point--pointer-${P(r)}`], h = [o["tour-point"], d, _].filter(Boolean).join(" "), N = n != null || i != null;
+  return /* @__PURE__ */ e("div", { className: h, children: [
+    s && /* @__PURE__ */ e("span", { className: o["tour-point__pointer"], "aria-hidden": !0, children: [
+      /* @__PURE__ */ t("span", { className: o["tour-point__pointer-triangle"] }),
+      m && /* @__PURE__ */ e("span", { className: o["tour-point__pointer-pulse"], children: [
+        /* @__PURE__ */ t("span", { className: o["tour-point__pointer-pulse-ring"] }),
+        /* @__PURE__ */ t(
+          "span",
+          {
+            className: [
+              o["tour-point__pointer-pulse-ring"],
+              o["tour-point__pointer-pulse-ring--delay"]
+            ].join(" ")
+          }
+        ),
+        /* @__PURE__ */ t("span", { className: o["tour-point__pointer-pulse-core"] })
+      ] })
+    ] }),
+    /* @__PURE__ */ e("div", { className: o["tour-point__panel"], children: [
+      /* @__PURE__ */ e("div", { className: o["tour-point__header"], children: [
+        /* @__PURE__ */ t("h2", { className: o["tour-point__title"], children: c }),
+        l && /* @__PURE__ */ t(
+          C,
+          {
+            className: o["tour-point__close"],
+            "aria-label": "Close",
+            size: "small",
+            padding: "compact",
+            style: "default",
+            icon: /* @__PURE__ */ t(p, { size: "16", glyph: /* @__PURE__ */ t(f, {}) }),
+            onClick: l
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e("div", { className: o["tour-point__body"], children: [
+        /* @__PURE__ */ t("div", { className: o["tour-point__description"], children: u }),
+        a != null && /* @__PURE__ */ t("div", { className: o["tour-point__media"], children: a })
+      ] }),
+      N && /* @__PURE__ */ e("div", { className: o["tour-point__footer"], children: [
+        n != null ? /* @__PURE__ */ t(
+          y,
+          {
+            className: o["tour-point__progress"],
+            pages: n.pages,
+            activePage: n.activePage,
+            dotStyle: "on-primary",
+            onPageChange: n.onPageChange
+          }
+        ) : /* @__PURE__ */ t(
+          "span",
+          {
+            className: o["tour-point__footer-spacer"],
+            "aria-hidden": !0
+          }
+        ),
+        i != null ? /* @__PURE__ */ t("div", { className: o["tour-point__next-wrap"], children: /* @__PURE__ */ t(
+          v,
+          {
+            emphasis: "primary",
+            size: "small",
+            trailingIcon: /* @__PURE__ */ t(p, { size: "16", glyph: /* @__PURE__ */ t(g, {}) }),
+            onClick: i.onClick,
+            children: i.label
+          }
+        ) }) : null
+      ] })
+    ] })
+  ] });
+}
+export {
+  F as default
+};
+//# sourceMappingURL=TourPoint.js.map

package/dist/components/tour-point/TourPoint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TourPoint.js","sources":["../../../src/components/tour-point/TourPoint.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport ChevronRightIcon from '@mattermost/compass-icons/components/chevron-right';\nimport Button from '@/components/button/Button';\nimport Icon from '@/components/icon/Icon';\nimport IconButton from '@/components/icon-button/IconButton';\nimport PaginationDots from '@/components/pagination-dots/PaginationDots';\nimport { toKebab } from '@/utils/string';\nimport styles from './TourPoint.module.scss';\n\nexport type TourPointPointerPosition =\n  | 'top-center'\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-center'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'left-center'\n  | 'right-center';\n\nexport interface TourPointProgress {\n  pages: number;\n  activePage: number;\n  onPageChange?: (page: number) => void;\n}\n\nexport interface TourPointPrimaryAction {\n  label: string;\n  onClick?: () => void;\n}\n\nexport interface TourPointProps {\n  title: string;\n  children: ReactNode;\n  /** Optional image between body copy and footer (e.g. screenshot as an img). */\n  media?: ReactNode;\n  /** Where the pointer sits on the card edge; omit or `none` to hide the pointer. */\n  pointerPosition?: TourPointPointerPosition | 'none';\n  /**\n   * Animated marker at the arrow tip (Figma Pulsing Dot). Only applies when a\n   * pointer is shown. Default on; set false for reduced motion preference at the\n   * callsite or a static tour step.\n   */\n  showPulsingDot?: boolean;\n  onClose?: () => void;\n  progress?: TourPointProgress;\n  primaryAction?: TourPointPrimaryAction;\n  className?: string;\n}\n\nexport default function TourPoint({\n  title,\n  children,\n  media,\n  pointerPosition = 'top-center',\n  showPulsingDot = true,\n  onClose,\n  progress,\n  primaryAction,\n  className = '',\n}: TourPointProps) {\n  const showPointer = pointerPosition !== 'none';\n  const pointerModifier =\n    showPointer &&\n    styles[\n      `tour-point--pointer-${toKebab(pointerPosition as TourPointPointerPosition)}`\n    ];\n\n  const rootClass = [styles['tour-point'], pointerModifier, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const showFooter = progress != null || primaryAction != null;\n\n  return (\n    <div className={rootClass}>\n      {showPointer && (\n        <span className={styles['tour-point__pointer']} aria-hidden>\n          <span className={styles['tour-point__pointer-triangle']} />\n          {showPulsingDot && (\n            <span className={styles['tour-point__pointer-pulse']}>\n              <span className={styles['tour-point__pointer-pulse-ring']} />\n              <span\n                className={[\n                  styles['tour-point__pointer-pulse-ring'],\n                  styles['tour-point__pointer-pulse-ring--delay'],\n                ].join(' ')}\n              />\n              <span className={styles['tour-point__pointer-pulse-core']} />\n            </span>\n          )}\n        </span>\n      )}\n\n      <div className={styles['tour-point__panel']}>\n        <div className={styles['tour-point__header']}>\n          <h2 className={styles['tour-point__title']}>{title}</h2>\n          {onClose && (\n            <IconButton\n              className={styles['tour-point__close']}\n              aria-label=\"Close\"\n              size=\"small\"\n              padding=\"compact\"\n              style=\"default\"\n              icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n              onClick={onClose}\n            />\n          )}\n        </div>\n\n        <div className={styles['tour-point__body']}>\n          <div className={styles['tour-point__description']}>{children}</div>\n          {media != null && (\n            <div className={styles['tour-point__media']}>{media}</div>\n          )}\n        </div>\n\n        {showFooter && (\n          <div className={styles['tour-point__footer']}>\n            {progress != null ? (\n              <PaginationDots\n                className={styles['tour-point__progress']}\n                pages={progress.pages}\n                activePage={progress.activePage}\n                dotStyle=\"on-primary\"\n                onPageChange={progress.onPageChange}\n              />\n            ) : (\n              <span\n                className={styles['tour-point__footer-spacer']}\n                aria-hidden\n              />\n            )}\n\n            {primaryAction != null ? (\n              <div className={styles['tour-point__next-wrap']}>\n                <Button\n                  emphasis=\"primary\"\n                  size=\"small\"\n                  trailingIcon={<Icon size=\"16\" glyph={<ChevronRightIcon />} />}\n                  onClick={primaryAction.onClick}\n                >\n                  {primaryAction.label}\n                </Button>\n              </div>\n            ) : null}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["TourPoint","title","children","media","pointerPosition","showPulsingDot","onClose","progress","primaryAction","className","showPointer","pointerModifier","styles","toKebab","rootClass","showFooter","jsxs","jsx","IconButton","Icon","CloseIcon","PaginationDots","Button","ChevronRightIcon"],"mappings":";;;;;;;;;AAkDA,SAAwBA,EAAU;AAAA,EAChC,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,gBAAAC,IAAiB;AAAA,EACjB,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAmB;AACjB,QAAMC,IAAcN,MAAoB,QAClCO,IACJD,KACAE,EACE,uBAAuBC,EAAQT,CAA2C,CAAC,EAC7E,GAEIU,IAAY,CAACF,EAAO,YAAY,GAAGD,GAAiBF,CAAS,EAChE,OAAO,OAAO,EACd,KAAK,GAAG,GAELM,IAAaR,KAAY,QAAQC,KAAiB;AAExD,SACE,gBAAAQ,EAAC,OAAA,EAAI,WAAWF,GACb,UAAA;AAAA,IAAAJ,uBACE,QAAA,EAAK,WAAWE,EAAO,qBAAqB,GAAG,eAAW,IACzD,UAAA;AAAA,MAAA,gBAAAK,EAAC,QAAA,EAAK,WAAWL,EAAO,8BAA8B,EAAA,CAAG;AAAA,MACxDP,KACC,gBAAAW,EAAC,QAAA,EAAK,WAAWJ,EAAO,2BAA2B,GACjD,UAAA;AAAA,QAAA,gBAAAK,EAAC,QAAA,EAAK,WAAWL,EAAO,gCAAgC,EAAA,CAAG;AAAA,QAC3D,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACTL,EAAO,gCAAgC;AAAA,cACvCA,EAAO,uCAAuC;AAAA,YAAA,EAC9C,KAAK,GAAG;AAAA,UAAA;AAAA,QAAA;AAAA,QAEZ,gBAAAK,EAAC,QAAA,EAAK,WAAWL,EAAO,gCAAgC,EAAA,CAAG;AAAA,MAAA,EAAA,CAC7D;AAAA,IAAA,GAEJ;AAAA,IAGF,gBAAAI,EAAC,OAAA,EAAI,WAAWJ,EAAO,mBAAmB,GACxC,UAAA;AAAA,MAAA,gBAAAI,EAAC,OAAA,EAAI,WAAWJ,EAAO,oBAAoB,GACzC,UAAA;AAAA,QAAA,gBAAAK,EAAC,MAAA,EAAG,WAAWL,EAAO,mBAAmB,GAAI,UAAAX,GAAM;AAAA,QAClDK,KACC,gBAAAW;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWN,EAAO,mBAAmB;AAAA,YACrC,cAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,OAAM;AAAA,YACN,wBAAOO,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACG,KAAU,GAAI;AAAA,YAC5C,SAASd;AAAA,UAAA;AAAA,QAAA;AAAA,MACX,GAEJ;AAAA,MAEA,gBAAAU,EAAC,OAAA,EAAI,WAAWJ,EAAO,kBAAkB,GACvC,UAAA;AAAA,QAAA,gBAAAK,EAAC,OAAA,EAAI,WAAWL,EAAO,yBAAyB,GAAI,UAAAV,GAAS;AAAA,QAC5DC,KAAS,QACR,gBAAAc,EAAC,OAAA,EAAI,WAAWL,EAAO,mBAAmB,GAAI,UAAAT,EAAA,CAAM;AAAA,MAAA,GAExD;AAAA,MAECY,KACC,gBAAAC,EAAC,OAAA,EAAI,WAAWJ,EAAO,oBAAoB,GACxC,UAAA;AAAA,QAAAL,KAAY,OACX,gBAAAU;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAWT,EAAO,sBAAsB;AAAA,YACxC,OAAOL,EAAS;AAAA,YAChB,YAAYA,EAAS;AAAA,YACrB,UAAS;AAAA,YACT,cAAcA,EAAS;AAAA,UAAA;AAAA,QAAA,IAGzB,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWL,EAAO,2BAA2B;AAAA,YAC7C,eAAW;AAAA,UAAA;AAAA,QAAA;AAAA,QAIdJ,KAAiB,OAChB,gBAAAS,EAAC,SAAI,WAAWL,EAAO,uBAAuB,GAC5C,UAAA,gBAAAK;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,MAAK;AAAA,YACL,gCAAeH,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAF,EAACM,KAAiB,GAAI;AAAA,YAC3D,SAASf,EAAc;AAAA,YAEtB,UAAAA,EAAc;AAAA,UAAA;AAAA,QAAA,GAEnB,IACE;AAAA,MAAA,EAAA,CACN;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/tour-point/TourPoint.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./TourPoint.css');const t={"tour-point":"_tour-point_xtgrh_28","tour-point__pointer":"_tour-point__pointer_xtgrh_36","tour-point__pointer-triangle":"_tour-point__pointer-triangle_xtgrh_42","tour-point__pointer-pulse":"_tour-point__pointer-pulse_xtgrh_50","tour-point__pointer-pulse-ring":"_tour-point__pointer-pulse-ring_xtgrh_57","tour-point-pulse-ring":"_tour-point-pulse-ring_xtgrh_1","tour-point__pointer-pulse-ring--delay":"_tour-point__pointer-pulse-ring--delay_xtgrh_71","tour-point__pointer-pulse-core":"_tour-point__pointer-pulse-core_xtgrh_80","tour-point__panel":"_tour-point__panel_xtgrh_91","tour-point-panel-in":"_tour-point-panel-in_xtgrh_1","tour-point--pointer-top-center":"_tour-point--pointer-top-center_xtgrh_101","tour-point--pointer-top-left":"_tour-point--pointer-top-left_xtgrh_101","tour-point--pointer-top-right":"_tour-point--pointer-top-right_xtgrh_101","tour-point--pointer-bottom-center":"_tour-point--pointer-bottom-center_xtgrh_104","tour-point--pointer-bottom-left":"_tour-point--pointer-bottom-left_xtgrh_104","tour-point--pointer-bottom-right":"_tour-point--pointer-bottom-right_xtgrh_104","tour-point--pointer-left-center":"_tour-point--pointer-left-center_xtgrh_107","tour-point--pointer-right-center":"_tour-point--pointer-right-center_xtgrh_110","tour-point__header":"_tour-point__header_xtgrh_113","tour-point__close":"_tour-point__close_xtgrh_120","tour-point__title":"_tour-point__title_xtgrh_134","tour-point__body":"_tour-point__body_xtgrh_143","tour-point__description":"_tour-point__description_xtgrh_149","tour-point__media":"_tour-point__media_xtgrh_155","tour-point__footer":"_tour-point__footer_xtgrh_170","tour-point__footer-spacer":"_tour-point__footer-spacer_xtgrh_177","tour-point__progress":"_tour-point__progress_xtgrh_181","tour-point__next-wrap":"_tour-point__next-wrap_xtgrh_184"};exports.default=t;
+//# sourceMappingURL=TourPoint.module.scss.cjs.map

package/dist/components/tour-point/TourPoint.module.scss.cjs.map

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

package/dist/components/tour-point/TourPoint.module.scss.js

@@ -0,0 +1,34 @@
+import './TourPoint.css';const t = {
+  "tour-point": "_tour-point_xtgrh_28",
+  "tour-point__pointer": "_tour-point__pointer_xtgrh_36",
+  "tour-point__pointer-triangle": "_tour-point__pointer-triangle_xtgrh_42",
+  "tour-point__pointer-pulse": "_tour-point__pointer-pulse_xtgrh_50",
+  "tour-point__pointer-pulse-ring": "_tour-point__pointer-pulse-ring_xtgrh_57",
+  "tour-point-pulse-ring": "_tour-point-pulse-ring_xtgrh_1",
+  "tour-point__pointer-pulse-ring--delay": "_tour-point__pointer-pulse-ring--delay_xtgrh_71",
+  "tour-point__pointer-pulse-core": "_tour-point__pointer-pulse-core_xtgrh_80",
+  "tour-point__panel": "_tour-point__panel_xtgrh_91",
+  "tour-point-panel-in": "_tour-point-panel-in_xtgrh_1",
+  "tour-point--pointer-top-center": "_tour-point--pointer-top-center_xtgrh_101",
+  "tour-point--pointer-top-left": "_tour-point--pointer-top-left_xtgrh_101",
+  "tour-point--pointer-top-right": "_tour-point--pointer-top-right_xtgrh_101",
+  "tour-point--pointer-bottom-center": "_tour-point--pointer-bottom-center_xtgrh_104",
+  "tour-point--pointer-bottom-left": "_tour-point--pointer-bottom-left_xtgrh_104",
+  "tour-point--pointer-bottom-right": "_tour-point--pointer-bottom-right_xtgrh_104",
+  "tour-point--pointer-left-center": "_tour-point--pointer-left-center_xtgrh_107",
+  "tour-point--pointer-right-center": "_tour-point--pointer-right-center_xtgrh_110",
+  "tour-point__header": "_tour-point__header_xtgrh_113",
+  "tour-point__close": "_tour-point__close_xtgrh_120",
+  "tour-point__title": "_tour-point__title_xtgrh_134",
+  "tour-point__body": "_tour-point__body_xtgrh_143",
+  "tour-point__description": "_tour-point__description_xtgrh_149",
+  "tour-point__media": "_tour-point__media_xtgrh_155",
+  "tour-point__footer": "_tour-point__footer_xtgrh_170",
+  "tour-point__footer-spacer": "_tour-point__footer-spacer_xtgrh_177",
+  "tour-point__progress": "_tour-point__progress_xtgrh_181",
+  "tour-point__next-wrap": "_tour-point__next-wrap_xtgrh_184"
+};
+export {
+  t as default
+};
+//# sourceMappingURL=TourPoint.module.scss.js.map

package/dist/components/tour-point/TourPoint.module.scss.js.map

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

package/dist/components/tour-point/index.cjs

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

package/dist/components/tour-point/index.cjs.map

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

package/dist/components/tour-point/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tour-point/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,YAAY,EACV,cAAc,EACd,wBAAwB,EACxB,iBAAiB,EACjB,sBAAsB,GACvB,MAAM,aAAa,CAAC"}

package/dist/components/tour-point/index.js

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

package/dist/components/tour-point/index.js.map

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

package/dist/components/unread-badge/UnreadBadge.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),d=require("../../utils/string.cjs"),e=require("./UnreadBadge.module.scss.cjs");function i({"aria-label":a="unread",className:t="",context:s="team-icon",size:n="8"}){const r=e.default[`unread-badge--size-${n}`],o=e.default[`unread-badge--context-${d.toKebab(s)}`],u=[e.default["unread-badge"],r,o,t].filter(Boolean).join(" ");return l.jsx("span",{className:u,role:"status","aria-label":a})}exports.default=i;
+//# sourceMappingURL=UnreadBadge.cjs.map

package/dist/components/unread-badge/UnreadBadge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnreadBadge.cjs","sources":["../../../src/components/unread-badge/UnreadBadge.tsx"],"sourcesContent":["import { toKebab } from '@/utils/string';\nimport styles from './UnreadBadge.module.scss';\n\nexport type UnreadBadgeSize = '6' | '8';\n\nexport type UnreadBadgeContext = 'team-icon' | 'icon-button';\n\nexport interface UnreadBadgeProps {\n  /** Dot size in px. Default: 8. */\n  size?: UnreadBadgeSize;\n  /** Display context affects dot colour. Default: Team Icon (same fill as MentionBadge). */\n  context?: UnreadBadgeContext;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Accessible label. Default: \"unread\". */\n  'aria-label'?: string;\n}\n\n/**\n * The Unread Badge is a small dot that signals \"something's new here\" without specifying how\n * much. Reach for it when the count would be noisy, distracting, or simply isn't useful — a\n * Team has unread channels, an icon button has a new state, a tab has activity behind it.\n */\nexport default function UnreadBadge({\n  'aria-label': ariaLabel = 'unread',\n  className = '',\n  context = 'team-icon',\n  size = '8',\n}: UnreadBadgeProps) {\n  const sizeClass = styles[`unread-badge--size-${size}`];\n  const contextClass = styles[`unread-badge--context-${toKebab(context)}`];\n  const rootClass = [styles['unread-badge'], sizeClass, contextClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return <span className={rootClass} role=\"status\" aria-label={ariaLabel} />;\n}\n"],"names":["UnreadBadge","ariaLabel","className","context","size","sizeClass","styles","contextClass","toKebab","rootClass"],"mappings":"gOAuBA,SAAwBA,EAAY,CAClC,aAAcC,EAAY,SAC1B,UAAAC,EAAY,GACZ,QAAAC,EAAU,YACV,KAAAC,EAAO,GACT,EAAqB,CACnB,MAAMC,EAAYC,EAAAA,QAAO,sBAAsBF,CAAI,EAAE,EAC/CG,EAAeD,EAAAA,QAAO,yBAAyBE,EAAAA,QAAQL,CAAO,CAAC,EAAE,EACjEM,EAAY,CAACH,EAAAA,QAAO,cAAc,EAAGD,EAAWE,EAAcL,CAAS,EAC1E,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,aAAQ,OAAA,CAAK,UAAWO,EAAW,KAAK,SAAS,aAAYR,EAAW,CAC1E"}

package/dist/components/unread-badge/UnreadBadge.css

@@ -0,0 +1 @@
+._unread-badge_1a64l_2{display:inline-block;flex-shrink:0;border-radius:var(--radius-full)}._unread-badge--size-6_1a64l_7{width:6px;height:6px}._unread-badge--size-8_1a64l_11{width:8px;height:8px}._unread-badge--context-team-icon_1a64l_15{background-color:var(--mention-bg)}._unread-badge--context-icon-button_1a64l_18{background-color:var(--button-bg)}

package/dist/components/unread-badge/UnreadBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnreadBadge.d.ts","sourceRoot":"","sources":["../../../src/components/unread-badge/UnreadBadge.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,eAAe,GAAG,GAAG,GAAG,GAAG,CAAC;AAExC,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,aAAa,CAAC;AAE7D,MAAM,WAAW,gBAAgB;IAC/B,kCAAkC;IAClC,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2CAA2C;IAC3C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,YAAY,EAAE,SAAoB,EAClC,SAAc,EACd,OAAqB,EACrB,IAAU,GACX,EAAE,gBAAgB,2CAQlB"}

package/dist/components/unread-badge/UnreadBadge.js

@@ -0,0 +1,16 @@
+import { jsx as i } from "react/jsx-runtime";
+import { toKebab as d } from "../../utils/string.js";
+import a from "./UnreadBadge.module.scss.js";
+function b({
+  "aria-label": e = "unread",
+  className: o = "",
+  context: t = "team-icon",
+  size: s = "8"
+}) {
+  const r = a[`unread-badge--size-${s}`], n = a[`unread-badge--context-${d(t)}`], l = [a["unread-badge"], r, n, o].filter(Boolean).join(" ");
+  return /* @__PURE__ */ i("span", { className: l, role: "status", "aria-label": e });
+}
+export {
+  b as default
+};
+//# sourceMappingURL=UnreadBadge.js.map

package/dist/components/unread-badge/UnreadBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnreadBadge.js","sources":["../../../src/components/unread-badge/UnreadBadge.tsx"],"sourcesContent":["import { toKebab } from '@/utils/string';\nimport styles from './UnreadBadge.module.scss';\n\nexport type UnreadBadgeSize = '6' | '8';\n\nexport type UnreadBadgeContext = 'team-icon' | 'icon-button';\n\nexport interface UnreadBadgeProps {\n  /** Dot size in px. Default: 8. */\n  size?: UnreadBadgeSize;\n  /** Display context affects dot colour. Default: Team Icon (same fill as MentionBadge). */\n  context?: UnreadBadgeContext;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Accessible label. Default: \"unread\". */\n  'aria-label'?: string;\n}\n\n/**\n * The Unread Badge is a small dot that signals \"something's new here\" without specifying how\n * much. Reach for it when the count would be noisy, distracting, or simply isn't useful — a\n * Team has unread channels, an icon button has a new state, a tab has activity behind it.\n */\nexport default function UnreadBadge({\n  'aria-label': ariaLabel = 'unread',\n  className = '',\n  context = 'team-icon',\n  size = '8',\n}: UnreadBadgeProps) {\n  const sizeClass = styles[`unread-badge--size-${size}`];\n  const contextClass = styles[`unread-badge--context-${toKebab(context)}`];\n  const rootClass = [styles['unread-badge'], sizeClass, contextClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return <span className={rootClass} role=\"status\" aria-label={ariaLabel} />;\n}\n"],"names":["UnreadBadge","ariaLabel","className","context","size","sizeClass","styles","contextClass","toKebab","rootClass"],"mappings":";;;AAuBA,SAAwBA,EAAY;AAAA,EAClC,cAAcC,IAAY;AAAA,EAC1B,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AACT,GAAqB;AACnB,QAAMC,IAAYC,EAAO,sBAAsBF,CAAI,EAAE,GAC/CG,IAAeD,EAAO,yBAAyBE,EAAQL,CAAO,CAAC,EAAE,GACjEM,IAAY,CAACH,EAAO,cAAc,GAAGD,GAAWE,GAAcL,CAAS,EAC1E,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,2BAAQ,QAAA,EAAK,WAAWO,GAAW,MAAK,UAAS,cAAYR,GAAW;AAC1E;"}