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

package/dist/components/search-input/SearchInput.js

@@ -0,0 +1,123 @@
+import { jsx as s, jsxs as x } from "react/jsx-runtime";
+import { forwardRef as Y, useId as B, useRef as D, useState as z, useCallback as i } from "react";
+import { toKebab as K } from "../../utils/string.js";
+import E from "../icon/Icon.js";
+import __tt from "@mattermost/compass-icons/components/magnify.js";const tt=__tt&&__tt.default?__tt.default:__tt;
+import __et from "@mattermost/compass-icons/components/close-circle.js";const et=__et&&__et.default?__et.default:__et;
+import e from "./SearchInput.module.scss.js";
+const st = {
+  small: "12",
+  medium: "16",
+  large: "20"
+}, at = {
+  small: "12",
+  medium: "16",
+  large: "16"
+}, dt = Y(
+  function({
+    className: j = "",
+    size: d = "medium",
+    label: f,
+    invalid: v = !1,
+    onClear: m,
+    id: k,
+    value: h,
+    defaultValue: N,
+    placeholder: A,
+    onFocus: n,
+    onBlur: u,
+    onChange: a,
+    disabled: l,
+    onKeyDown: o,
+    ...M
+  }, r) {
+    const V = B(), S = k ?? V, _ = D(null), c = h !== void 0, [F, b] = z(
+      N ?? ""
+    ), g = c ? h : F, p = g != null && g !== "", [L, C] = z(!1), O = L || p, T = i(
+      (t) => {
+        C(!0), n == null || n(t);
+      },
+      [n]
+    ), Z = i(
+      (t) => {
+        C(!1), u == null || u(t);
+      },
+      [u]
+    ), P = i(
+      (t) => {
+        c || b(t.target.value), a == null || a(t);
+      },
+      [c, a]
+    ), U = i(
+      (t) => {
+        _.current = t, typeof r == "function" ? r(t) : r && (r.current = t);
+      },
+      [r]
+    ), I = i(() => {
+      var R;
+      if (l) return;
+      if (m) {
+        m(), (R = _.current) == null || R.focus();
+        return;
+      }
+      const t = _.current;
+      t != null && (t.value = "", c || b(""), a == null || a({
+        target: t,
+        currentTarget: t
+      }), t.focus());
+    }, [l, c, a, m]), $ = i(
+      (t) => {
+        o == null || o(t), !(t.defaultPrevented || l) && t.key === "Escape" && p && (t.preventDefault(), I());
+      },
+      [l, I, p, o]
+    ), y = p && !l, q = e[`search-input--size-${K(d)}`], w = v ? e["search-input--invalid"] : "", G = f != null && O ? e["search-input--label-floated"] : "", H = e["search-input--has-leading-icon"], J = y ? e["search-input--has-trailing-icon"] : "", Q = st[d], W = at[d], X = [
+      e["search-input"],
+      q,
+      w,
+      G,
+      H,
+      J,
+      j
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ s("div", { className: X, children: /* @__PURE__ */ x("div", { className: e["search-input__wrapper"], children: [
+      f != null && /* @__PURE__ */ s("label", { className: e["search-input__label"], htmlFor: S, children: f }),
+      /* @__PURE__ */ x("div", { className: e["search-input__inner"], children: [
+        /* @__PURE__ */ s("span", { className: e["search-input__leading-icon"], "aria-hidden": !0, children: /* @__PURE__ */ s(E, { size: Q, glyph: /* @__PURE__ */ s(tt, {}) }) }),
+        /* @__PURE__ */ s(
+          "input",
+          {
+            ref: U,
+            id: S,
+            type: "search",
+            className: e["search-input__input"],
+            value: c ? h : void 0,
+            defaultValue: c ? void 0 : N,
+            placeholder: A,
+            disabled: l,
+            onFocus: T,
+            onBlur: Z,
+            onChange: P,
+            onKeyDown: $,
+            "aria-invalid": v ? !0 : void 0,
+            ...M
+          }
+        ),
+        y && /* @__PURE__ */ s("span", { className: e["search-input__trailing-icon"], children: /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            className: e["search-input__clear-button"],
+            onClick: I,
+            "aria-label": "Clear search",
+            tabIndex: -1,
+            children: /* @__PURE__ */ s(E, { size: W, glyph: /* @__PURE__ */ s(et, {}) })
+          }
+        ) })
+      ] })
+    ] }) });
+  }
+);
+export {
+  dt as default
+};
+//# sourceMappingURL=SearchInput.js.map

package/dist/components/search-input/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","sources":["../../../src/components/search-input/SearchInput.tsx"],"sourcesContent":["import type {\n  ChangeEvent,\n  InputHTMLAttributes,\n  KeyboardEvent,\n  ReactNode,\n} from 'react';\nimport {\n  forwardRef,\n  useId,\n  useState,\n  useCallback,\n  useRef,\n} from 'react';\nimport { toKebab } from '@/utils/string';\nimport type { IconSize } from '@/components/icon/Icon';\nimport Icon from '@/components/icon/Icon';\nimport MagnifyIcon from '@mattermost/compass-icons/components/magnify';\nimport CloseCircleIcon from '@mattermost/compass-icons/components/close-circle';\nimport styles from './SearchInput.module.scss';\n\nexport type SearchInputSize = 'small' | 'medium' | 'large';\n\nconst ICON_SIZE_MAP: Record<SearchInputSize, IconSize> = {\n  small: '12',\n  medium: '16',\n  large: '20',\n};\n\nconst CLEAR_ICON_SIZE_MAP: Record<SearchInputSize, IconSize> = {\n  small: '12',\n  medium: '16',\n  large: '16',\n};\n\nexport interface SearchInputProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  'size' | 'type'\n> {\n  /** Optional CSS class name. */\n  className?: string;\n  /** When true, shows invalid/error styling. */\n  invalid?: boolean;\n  /** Floating label (placeholder-style). Floats above border when filled. */\n  label?: ReactNode;\n  /** Size variant. Default: Medium. */\n  size?: SearchInputSize;\n  /** Called when the clear button is pressed. Omit to use built-in clearing. */\n  onClear?: () => void;\n}\n\n/**\n * Search Inputs are the entry point to filtering or finding content — global search, channel\n * switcher, member picker, file finder. They look like a text input with a leading magnifier\n * so the affordance is obvious before the user reads a single word.\n */\nconst SearchInput = forwardRef<HTMLInputElement, SearchInputProps>(\n  function SearchInput(\n    {\n      className = '',\n      size = 'medium',\n      label,\n      invalid = false,\n      onClear,\n      id: idProp,\n      value: valueProp,\n      defaultValue,\n      placeholder,\n      onFocus,\n      onBlur,\n      onChange,\n      disabled,\n      onKeyDown,\n      ...rest\n    },\n    ref,\n  ) {\n    const generatedId = useId();\n    const id = idProp ?? generatedId;\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const isControlled = valueProp !== undefined;\n    const [uncontrolledValue, setUncontrolledValue] = useState(\n      defaultValue ?? '',\n    );\n    const value = isControlled ? (valueProp as string) : uncontrolledValue;\n    const hasValue = value != null && value !== '';\n\n    const [isFocused, setIsFocused] = useState(false);\n    const labelFloated = isFocused || hasValue;\n\n    const handleFocus = useCallback(\n      (e: React.FocusEvent<HTMLInputElement>) => {\n        setIsFocused(true);\n        onFocus?.(e);\n      },\n      [onFocus],\n    );\n    const handleBlur = useCallback(\n      (e: React.FocusEvent<HTMLInputElement>) => {\n        setIsFocused(false);\n        onBlur?.(e);\n      },\n      [onBlur],\n    );\n    const handleChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        if (!isControlled) setUncontrolledValue(e.target.value);\n        onChange?.(e);\n      },\n      [isControlled, onChange],\n    );\n\n    const setInputRef = useCallback(\n      (node: HTMLInputElement | null) => {\n        inputRef.current = node;\n        if (typeof ref === 'function') {\n          ref(node);\n        } else if (ref) {\n          ref.current = node;\n        }\n      },\n      [ref],\n    );\n\n    const handleClear = useCallback(() => {\n      if (disabled) return;\n\n      if (onClear) {\n        onClear();\n        inputRef.current?.focus();\n        return;\n      }\n\n      const input = inputRef.current;\n      if (input == null) return;\n\n      input.value = '';\n      if (!isControlled) setUncontrolledValue('');\n\n      onChange?.({\n        target: input,\n        currentTarget: input,\n      } as ChangeEvent<HTMLInputElement>);\n\n      input.focus();\n    }, [disabled, isControlled, onChange, onClear]);\n\n    const handleKeyDown = useCallback(\n      (e: KeyboardEvent<HTMLInputElement>) => {\n        onKeyDown?.(e);\n        if (e.defaultPrevented || disabled) return;\n        if (e.key === 'Escape' && hasValue) {\n          e.preventDefault();\n          handleClear();\n        }\n      },\n      [disabled, handleClear, hasValue, onKeyDown],\n    );\n\n    const showClearButton = hasValue && !disabled;\n\n    const sizeClass = styles[`search-input--size-${toKebab(size)}`];\n    const invalidClass = invalid ? styles['search-input--invalid'] : '';\n    const labelFloatedClass =\n      label != null && labelFloated ? styles['search-input--label-floated'] : '';\n    const hasLeadingClass = styles['search-input--has-leading-icon'];\n    const hasTrailingClass = showClearButton\n      ? styles['search-input--has-trailing-icon']\n      : '';\n    const iconSize = ICON_SIZE_MAP[size];\n    const clearIconSize = CLEAR_ICON_SIZE_MAP[size];\n\n    const rootClass = [\n      styles['search-input'],\n      sizeClass,\n      invalidClass,\n      labelFloatedClass,\n      hasLeadingClass,\n      hasTrailingClass,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div className={rootClass}>\n        <div className={styles['search-input__wrapper']}>\n          {label != null && (\n            <label className={styles['search-input__label']} htmlFor={id}>\n              {label}\n            </label>\n          )}\n          <div className={styles['search-input__inner']}>\n            <span className={styles['search-input__leading-icon']} aria-hidden>\n              <Icon size={iconSize} glyph={<MagnifyIcon />} />\n            </span>\n            <input\n              ref={setInputRef}\n              id={id}\n              type=\"search\"\n              className={styles['search-input__input']}\n              value={isControlled ? valueProp : undefined}\n              defaultValue={isControlled ? undefined : defaultValue}\n              placeholder={placeholder}\n              disabled={disabled}\n              onFocus={handleFocus}\n              onBlur={handleBlur}\n              onChange={handleChange}\n              onKeyDown={handleKeyDown}\n              aria-invalid={invalid ? true : undefined}\n              {...rest}\n            />\n            {showClearButton && (\n              <span className={styles['search-input__trailing-icon']}>\n                <button\n                  type=\"button\"\n                  className={styles['search-input__clear-button']}\n                  onClick={handleClear}\n                  aria-label=\"Clear search\"\n                  tabIndex={-1}\n                >\n                  <Icon size={clearIconSize} glyph={<CloseCircleIcon />} />\n                </button>\n              </span>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n\nexport default SearchInput;\n"],"names":["ICON_SIZE_MAP","CLEAR_ICON_SIZE_MAP","SearchInput","forwardRef","className","size","label","invalid","onClear","idProp","valueProp","defaultValue","placeholder","onFocus","onBlur","onChange","disabled","onKeyDown","rest","ref","generatedId","useId","id","inputRef","useRef","isControlled","uncontrolledValue","setUncontrolledValue","useState","value","hasValue","isFocused","setIsFocused","labelFloated","handleFocus","useCallback","e","handleBlur","handleChange","setInputRef","node","handleClear","_a","input","handleKeyDown","showClearButton","sizeClass","styles","toKebab","invalidClass","labelFloatedClass","hasLeadingClass","hasTrailingClass","iconSize","clearIconSize","rootClass","jsx","jsxs","Icon","MagnifyIcon","CloseCircleIcon"],"mappings":";;;;;;;AAsBA,MAAMA,KAAmD;AAAA,EACvD,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT,GAEMC,KAAyD;AAAA,EAC7D,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT,GAuBMC,KAAcC;AAAA,EAClB,SACE;AAAA,IACE,WAAAC,IAAY;AAAA,IACZ,MAAAC,IAAO;AAAA,IACP,OAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,SAAAC;AAAA,IACA,IAAIC;AAAA,IACJ,OAAOC;AAAA,IACP,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,UAAMC,IAAcC,EAAA,GACdC,IAAKb,KAAUW,GACfG,IAAWC,EAAyB,IAAI,GAExCC,IAAef,MAAc,QAC7B,CAACgB,GAAmBC,CAAoB,IAAIC;AAAA,MAChDjB,KAAgB;AAAA,IAAA,GAEZkB,IAAQJ,IAAgBf,IAAuBgB,GAC/CI,IAAWD,KAAS,QAAQA,MAAU,IAEtC,CAACE,GAAWC,CAAY,IAAIJ,EAAS,EAAK,GAC1CK,IAAeF,KAAaD,GAE5BI,IAAcC;AAAA,MAClB,CAACC,MAA0C;AACzC,QAAAJ,EAAa,EAAI,GACjBnB,KAAA,QAAAA,EAAUuB;AAAA,MACZ;AAAA,MACA,CAACvB,CAAO;AAAA,IAAA,GAEJwB,IAAaF;AAAA,MACjB,CAACC,MAA0C;AACzC,QAAAJ,EAAa,EAAK,GAClBlB,KAAA,QAAAA,EAASsB;AAAA,MACX;AAAA,MACA,CAACtB,CAAM;AAAA,IAAA,GAEHwB,IAAeH;AAAA,MACnB,CAACC,MAAqC;AACpC,QAAKX,KAAcE,EAAqBS,EAAE,OAAO,KAAK,GACtDrB,KAAA,QAAAA,EAAWqB;AAAA,MACb;AAAA,MACA,CAACX,GAAcV,CAAQ;AAAA,IAAA,GAGnBwB,IAAcJ;AAAA,MAClB,CAACK,MAAkC;AACjC,QAAAjB,EAAS,UAAUiB,GACf,OAAOrB,KAAQ,aACjBA,EAAIqB,CAAI,IACCrB,MACTA,EAAI,UAAUqB;AAAA,MAElB;AAAA,MACA,CAACrB,CAAG;AAAA,IAAA,GAGAsB,IAAcN,EAAY,MAAM;;AACpC,UAAInB,EAAU;AAEd,UAAIR,GAAS;AACX,QAAAA,EAAA,IACAkC,IAAAnB,EAAS,YAAT,QAAAmB,EAAkB;AAClB;AAAA,MACF;AAEA,YAAMC,IAAQpB,EAAS;AACvB,MAAIoB,KAAS,SAEbA,EAAM,QAAQ,IACTlB,KAAcE,EAAqB,EAAE,GAE1CZ,KAAA,QAAAA,EAAW;AAAA,QACT,QAAQ4B;AAAA,QACR,eAAeA;AAAA,MAAA,IAGjBA,EAAM,MAAA;AAAA,IACR,GAAG,CAAC3B,GAAUS,GAAcV,GAAUP,CAAO,CAAC,GAExCoC,IAAgBT;AAAA,MACpB,CAACC,MAAuC;AAEtC,QADAnB,KAAA,QAAAA,EAAYmB,IACR,EAAAA,EAAE,oBAAoBpB,MACtBoB,EAAE,QAAQ,YAAYN,MACxBM,EAAE,eAAA,GACFK,EAAA;AAAA,MAEJ;AAAA,MACA,CAACzB,GAAUyB,GAAaX,GAAUb,CAAS;AAAA,IAAA,GAGvC4B,IAAkBf,KAAY,CAACd,GAE/B8B,IAAYC,EAAO,sBAAsBC,EAAQ3C,CAAI,CAAC,EAAE,GACxD4C,IAAe1C,IAAUwC,EAAO,uBAAuB,IAAI,IAC3DG,IACJ5C,KAAS,QAAQ2B,IAAec,EAAO,6BAA6B,IAAI,IACpEI,IAAkBJ,EAAO,gCAAgC,GACzDK,IAAmBP,IACrBE,EAAO,iCAAiC,IACxC,IACEM,IAAWrD,GAAcK,CAAI,GAC7BiD,IAAgBrD,GAAoBI,CAAI,GAExCkD,IAAY;AAAA,MAChBR,EAAO,cAAc;AAAA,MACrBD;AAAA,MACAG;AAAA,MACAC;AAAA,MACAC;AAAA,MACAC;AAAA,MACAhD;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACE,gBAAAoD,EAAC,SAAI,WAAWD,GACd,4BAAC,OAAA,EAAI,WAAWR,EAAO,uBAAuB,GAC3C,UAAA;AAAA,MAAAzC,KAAS,0BACP,SAAA,EAAM,WAAWyC,EAAO,qBAAqB,GAAG,SAASzB,GACvD,UAAAhB,EAAA,CACH;AAAA,MAEF,gBAAAmD,EAAC,OAAA,EAAI,WAAWV,EAAO,qBAAqB,GAC1C,UAAA;AAAA,QAAA,gBAAAS,EAAC,QAAA,EAAK,WAAWT,EAAO,4BAA4B,GAAG,eAAW,IAChE,UAAA,gBAAAS,EAACE,GAAA,EAAK,MAAML,GAAU,OAAO,gBAAAG,EAACG,IAAA,CAAA,CAAY,GAAI,GAChD;AAAA,QACA,gBAAAH;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKjB;AAAA,YACL,IAAAjB;AAAA,YACA,MAAK;AAAA,YACL,WAAWyB,EAAO,qBAAqB;AAAA,YACvC,OAAOtB,IAAef,IAAY;AAAA,YAClC,cAAce,IAAe,SAAYd;AAAA,YACzC,aAAAC;AAAA,YACA,UAAAI;AAAA,YACA,SAASkB;AAAA,YACT,QAAQG;AAAA,YACR,UAAUC;AAAA,YACV,WAAWM;AAAA,YACX,gBAAcrC,IAAU,KAAO;AAAA,YAC9B,GAAGW;AAAA,UAAA;AAAA,QAAA;AAAA,QAEL2B,KACC,gBAAAW,EAAC,QAAA,EAAK,WAAWT,EAAO,6BAA6B,GACnD,UAAA,gBAAAS;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAWT,EAAO,4BAA4B;AAAA,YAC9C,SAASN;AAAA,YACT,cAAW;AAAA,YACX,UAAU;AAAA,YAEV,4BAACiB,GAAA,EAAK,MAAMJ,GAAe,OAAO,gBAAAE,EAACI,MAAgB,EAAA,CAAI;AAAA,UAAA;AAAA,QAAA,EACzD,CACF;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF,EAAA,CACF;AAAA,EAEJ;AACF;"}

package/dist/components/search-input/SearchInput.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./SearchInput.css');const i={"search-input":"_search-input_1iq6i_2","search-input__wrapper":"_search-input__wrapper_1iq6i_7","search-input__input":"_search-input__input_1iq6i_17","search-input__label":"_search-input__label_1iq6i_27","search-input--label-floated":"_search-input--label-floated_1iq6i_47","search-input__inner":"_search-input__inner_1iq6i_54","search-input__leading-icon":"_search-input__leading-icon_1iq6i_85","search-input__trailing-icon":"_search-input__trailing-icon_1iq6i_85","search-input__clear-button":"_search-input__clear-button_1iq6i_99","search-input--size-small":"_search-input--size-small_1iq6i_114","search-input--size-medium":"_search-input--size-medium_1iq6i_130","search-input--size-large":"_search-input--size-large_1iq6i_150","search-input--has-leading-icon":"_search-input--has-leading-icon_1iq6i_171","search-input--invalid":"_search-input--invalid_1iq6i_189"};exports.default=i;
+//# sourceMappingURL=SearchInput.module.scss.cjs.map

package/dist/components/search-input/SearchInput.module.scss.cjs.map

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

package/dist/components/search-input/SearchInput.module.scss.js

@@ -0,0 +1,20 @@
+import './SearchInput.css';const i = {
+  "search-input": "_search-input_1iq6i_2",
+  "search-input__wrapper": "_search-input__wrapper_1iq6i_7",
+  "search-input__input": "_search-input__input_1iq6i_17",
+  "search-input__label": "_search-input__label_1iq6i_27",
+  "search-input--label-floated": "_search-input--label-floated_1iq6i_47",
+  "search-input__inner": "_search-input__inner_1iq6i_54",
+  "search-input__leading-icon": "_search-input__leading-icon_1iq6i_85",
+  "search-input__trailing-icon": "_search-input__trailing-icon_1iq6i_85",
+  "search-input__clear-button": "_search-input__clear-button_1iq6i_99",
+  "search-input--size-small": "_search-input--size-small_1iq6i_114",
+  "search-input--size-medium": "_search-input--size-medium_1iq6i_130",
+  "search-input--size-large": "_search-input--size-large_1iq6i_150",
+  "search-input--has-leading-icon": "_search-input--has-leading-icon_1iq6i_171",
+  "search-input--invalid": "_search-input--invalid_1iq6i_189"
+};
+export {
+  i as default
+};
+//# sourceMappingURL=SearchInput.module.scss.js.map

package/dist/components/search-input/SearchInput.module.scss.js.map

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

package/dist/components/search-input/index.cjs

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

package/dist/components/search-input/index.cjs.map

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

package/dist/components/search-input/index.d.ts.map

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

package/dist/components/search-input/index.js

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

package/dist/components/search-input/index.js.map

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

package/dist/components/search-tip-banner/SearchTipBanner.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("../icon-button/IconButton.cjs"),o=require("../icon/Icon.cjs"),d=require("../shortcut-tag/ShortcutTag.cjs"),__h=require("@mattermost/compass-icons/components/close.js"),h=__h?.default??__h,a=require("./SearchTipBanner.module.scss.cjs");function p({prefix:l="Tip: Try",suffix:n="to search this channel",shortcutKeys:r=[{label:"⌘"},{label:"Shift"},{label:"F"}],onDismiss:t,className:s="",children:i}){return e.jsxs("div",{className:[a.default["search-tip-banner"],s].filter(Boolean).join(" "),children:[e.jsx("div",{className:a.default["search-tip-banner__content"],children:i??e.jsxs(e.Fragment,{children:[e.jsx("span",{className:a.default["search-tip-banner__text"],children:l}),e.jsx(d.ShortcutTagGroup,{labels:r.map(c=>c.label),size:"medium"}),e.jsx("span",{className:a.default["search-tip-banner__text"],children:n})]})}),t!=null&&e.jsx(u.default,{"aria-label":"Dismiss tip",size:"small",icon:e.jsx(o.default,{size:"16",glyph:e.jsx(h,{})}),onClick:t})]})}exports.default=p;
+//# sourceMappingURL=SearchTipBanner.cjs.map

package/dist/components/search-tip-banner/SearchTipBanner.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchTipBanner.cjs","sources":["../../../src/components/search-tip-banner/SearchTipBanner.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport { ShortcutTagGroup } from '@/components/shortcut-tag/ShortcutTag';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './SearchTipBanner.module.scss';\n\nexport interface ShortcutKey {\n  label: string;\n}\n\nexport interface SearchTipBannerProps {\n  /** Text shown before the shortcut keys. Default: \"Tip: Try\". */\n  prefix?: string;\n  /** Text shown after the shortcut keys. Default: \"to search this channel\". */\n  suffix?: string;\n  /** Keyboard shortcut keys to display. */\n  shortcutKeys?: ShortcutKey[];\n  /** Called when the dismiss button is clicked. */\n  onDismiss?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Custom content to replace the default tip content. */\n  children?: ReactNode;\n}\n\n/**\n * The Search Tip Banner nudges people toward the keyboard shortcut for in-channel search. It\n * appears once a user has scrolled up far enough that they're clearly looking for something,\n * and offers a faster path than scroll-and-skim.\n */\nexport default function SearchTipBanner({\n  prefix = 'Tip: Try',\n  suffix = 'to search this channel',\n  shortcutKeys = [{ label: '⌘' }, { label: 'Shift' }, { label: 'F' }],\n  onDismiss,\n  className = '',\n  children,\n}: SearchTipBannerProps) {\n  return (\n    <div\n      className={[styles['search-tip-banner'], className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={styles['search-tip-banner__content']}>\n        {children ?? (\n          <>\n            <span className={styles['search-tip-banner__text']}>{prefix}</span>\n            <ShortcutTagGroup\n              labels={shortcutKeys.map((key) => key.label)}\n              size=\"medium\"\n            />\n            <span className={styles['search-tip-banner__text']}>{suffix}</span>\n          </>\n        )}\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          aria-label=\"Dismiss tip\"\n          size=\"small\"\n          icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["SearchTipBanner","prefix","suffix","shortcutKeys","onDismiss","className","children","jsxs","styles","jsx","Fragment","ShortcutTagGroup","key","IconButton","Icon","CloseIcon"],"mappings":"4WA+BA,SAAwBA,EAAgB,CACtC,OAAAC,EAAS,WACT,OAAAC,EAAS,yBACT,aAAAC,EAAe,CAAC,CAAE,MAAO,KAAO,CAAE,MAAO,SAAW,CAAE,MAAO,IAAK,EAClE,UAAAC,EACA,UAAAC,EAAY,GACZ,SAAAC,CACF,EAAyB,CACvB,OACEC,EAAAA,KAAC,MAAA,CACC,UAAW,CAACC,UAAO,mBAAmB,EAAGH,CAAS,EAC/C,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,SAAA,CAAAI,EAAAA,IAAC,OAAI,UAAWD,EAAAA,QAAO,4BAA4B,EAChD,YACCD,EAAAA,KAAAG,EAAAA,SAAA,CACE,SAAA,CAAAD,MAAC,OAAA,CAAK,UAAWD,EAAAA,QAAO,yBAAyB,EAAI,SAAAP,EAAO,EAC5DQ,EAAAA,IAACE,EAAAA,iBAAA,CACC,OAAQR,EAAa,IAAKS,GAAQA,EAAI,KAAK,EAC3C,KAAK,QAAA,CAAA,QAEN,OAAA,CAAK,UAAWJ,EAAAA,QAAO,yBAAyB,EAAI,SAAAN,CAAA,CAAO,CAAA,CAAA,CAC9D,CAAA,CAEJ,EACCE,GAAa,MACZK,EAAAA,IAACI,EAAAA,QAAA,CACC,aAAW,cACX,KAAK,QACL,WAAOC,UAAA,CAAK,KAAK,KAAK,MAAOL,MAACM,IAAU,EAAI,EAC5C,QAASX,CAAA,CAAA,CACX,CAAA,CAAA,CAIR"}

package/dist/components/search-tip-banner/SearchTipBanner.css

@@ -0,0 +1 @@
+._search-tip-banner_slriu_2{display:inline-flex;align-items:center;justify-content:flex-start;width:fit-content;max-width:100%;gap:var(--spacing-l);padding:var(--spacing-xxxs) var(--spacing-xxxs) var(--spacing-xxxs) var(--spacing-m);background-color:var(--center-channel-bg);border:1px solid rgba(var(--center-channel-color-rgb),.16);border-radius:var(--radius-s);box-shadow:var(--elevation-2)}._search-tip-banner__content_slriu_15{display:inline-flex;align-items:center;gap:var(--spacing-s);height:24px;overflow:hidden}._search-tip-banner__text_slriu_22{font-size:var(--font-size-100);font-weight:var(--font-weight-semibold);line-height:var(--line-height-100);color:var(--center-channel-color);white-space:nowrap}

package/dist/components/search-tip-banner/SearchTipBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchTipBanner.d.ts","sourceRoot":"","sources":["../../../src/components/search-tip-banner/SearchTipBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB;IACnC,gEAAgE;IAChE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6EAA6E;IAC7E,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yCAAyC;IACzC,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,MAAmB,EACnB,MAAiC,EACjC,YAAmE,EACnE,SAAS,EACT,SAAc,EACd,QAAQ,GACT,EAAE,oBAAoB,2CA6BtB"}

package/dist/components/search-tip-banner/SearchTipBanner.js

@@ -0,0 +1,47 @@
+import { jsxs as l, jsx as e, Fragment as m } from "react/jsx-runtime";
+import p from "../icon-button/IconButton.js";
+import h from "../icon/Icon.js";
+import { ShortcutTagGroup as b } from "../shortcut-tag/ShortcutTag.js";
+import __f from "@mattermost/compass-icons/components/close.js";const f=__f&&__f.default?__f.default:__f;
+import a from "./SearchTipBanner.module.scss.js";
+function g({
+  prefix: n = "Tip: Try",
+  suffix: i = "to search this channel",
+  shortcutKeys: t = [{ label: "⌘" }, { label: "Shift" }, { label: "F" }],
+  onDismiss: r,
+  className: s = "",
+  children: o
+}) {
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      className: [a["search-tip-banner"], s].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ e("div", { className: a["search-tip-banner__content"], children: o ?? /* @__PURE__ */ l(m, { children: [
+          /* @__PURE__ */ e("span", { className: a["search-tip-banner__text"], children: n }),
+          /* @__PURE__ */ e(
+            b,
+            {
+              labels: t.map((c) => c.label),
+              size: "medium"
+            }
+          ),
+          /* @__PURE__ */ e("span", { className: a["search-tip-banner__text"], children: i })
+        ] }) }),
+        r != null && /* @__PURE__ */ e(
+          p,
+          {
+            "aria-label": "Dismiss tip",
+            size: "small",
+            icon: /* @__PURE__ */ e(h, { size: "16", glyph: /* @__PURE__ */ e(f, {}) }),
+            onClick: r
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  g as default
+};
+//# sourceMappingURL=SearchTipBanner.js.map

package/dist/components/search-tip-banner/SearchTipBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchTipBanner.js","sources":["../../../src/components/search-tip-banner/SearchTipBanner.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport { ShortcutTagGroup } from '@/components/shortcut-tag/ShortcutTag';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './SearchTipBanner.module.scss';\n\nexport interface ShortcutKey {\n  label: string;\n}\n\nexport interface SearchTipBannerProps {\n  /** Text shown before the shortcut keys. Default: \"Tip: Try\". */\n  prefix?: string;\n  /** Text shown after the shortcut keys. Default: \"to search this channel\". */\n  suffix?: string;\n  /** Keyboard shortcut keys to display. */\n  shortcutKeys?: ShortcutKey[];\n  /** Called when the dismiss button is clicked. */\n  onDismiss?: () => void;\n  /** Optional CSS class name. */\n  className?: string;\n  /** Custom content to replace the default tip content. */\n  children?: ReactNode;\n}\n\n/**\n * The Search Tip Banner nudges people toward the keyboard shortcut for in-channel search. It\n * appears once a user has scrolled up far enough that they're clearly looking for something,\n * and offers a faster path than scroll-and-skim.\n */\nexport default function SearchTipBanner({\n  prefix = 'Tip: Try',\n  suffix = 'to search this channel',\n  shortcutKeys = [{ label: '⌘' }, { label: 'Shift' }, { label: 'F' }],\n  onDismiss,\n  className = '',\n  children,\n}: SearchTipBannerProps) {\n  return (\n    <div\n      className={[styles['search-tip-banner'], className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={styles['search-tip-banner__content']}>\n        {children ?? (\n          <>\n            <span className={styles['search-tip-banner__text']}>{prefix}</span>\n            <ShortcutTagGroup\n              labels={shortcutKeys.map((key) => key.label)}\n              size=\"medium\"\n            />\n            <span className={styles['search-tip-banner__text']}>{suffix}</span>\n          </>\n        )}\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          aria-label=\"Dismiss tip\"\n          size=\"small\"\n          icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["SearchTipBanner","prefix","suffix","shortcutKeys","onDismiss","className","children","jsxs","styles","jsx","Fragment","ShortcutTagGroup","key","IconButton","Icon","CloseIcon"],"mappings":";;;;;;AA+BA,SAAwBA,EAAgB;AAAA,EACtC,QAAAC,IAAS;AAAA,EACT,QAAAC,IAAS;AAAA,EACT,cAAAC,IAAe,CAAC,EAAE,OAAO,OAAO,EAAE,OAAO,WAAW,EAAE,OAAO,KAAK;AAAA,EAClE,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC;AACF,GAAyB;AACvB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAACC,EAAO,mBAAmB,GAAGH,CAAS,EAC/C,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MAEX,UAAA;AAAA,QAAA,gBAAAI,EAAC,SAAI,WAAWD,EAAO,4BAA4B,GAChD,eACC,gBAAAD,EAAAG,GAAA,EACE,UAAA;AAAA,UAAA,gBAAAD,EAAC,QAAA,EAAK,WAAWD,EAAO,yBAAyB,GAAI,UAAAP,GAAO;AAAA,UAC5D,gBAAAQ;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,QAAQR,EAAa,IAAI,CAACS,MAAQA,EAAI,KAAK;AAAA,cAC3C,MAAK;AAAA,YAAA;AAAA,UAAA;AAAA,4BAEN,QAAA,EAAK,WAAWJ,EAAO,yBAAyB,GAAI,UAAAN,EAAA,CAAO;AAAA,QAAA,EAAA,CAC9D,EAAA,CAEJ;AAAA,QACCE,KAAa,QACZ,gBAAAK;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,cAAW;AAAA,YACX,MAAK;AAAA,YACL,wBAAOC,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAL,EAACM,KAAU,GAAI;AAAA,YAC5C,SAASX;AAAA,UAAA;AAAA,QAAA;AAAA,MACX;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/search-tip-banner/SearchTipBanner.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./SearchTipBanner.css');const e={"search-tip-banner":"_search-tip-banner_slriu_2","search-tip-banner__content":"_search-tip-banner__content_slriu_15","search-tip-banner__text":"_search-tip-banner__text_slriu_22"};exports.default=e;
+//# sourceMappingURL=SearchTipBanner.module.scss.cjs.map

package/dist/components/search-tip-banner/SearchTipBanner.module.scss.cjs.map

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

package/dist/components/search-tip-banner/SearchTipBanner.module.scss.js

@@ -0,0 +1,9 @@
+import './SearchTipBanner.css';const e = {
+  "search-tip-banner": "_search-tip-banner_slriu_2",
+  "search-tip-banner__content": "_search-tip-banner__content_slriu_15",
+  "search-tip-banner__text": "_search-tip-banner__text_slriu_22"
+};
+export {
+  e as default
+};
+//# sourceMappingURL=SearchTipBanner.module.scss.js.map

package/dist/components/search-tip-banner/SearchTipBanner.module.scss.js.map

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

package/dist/components/search-tip-banner/index.cjs

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

package/dist/components/search-tip-banner/index.cjs.map

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

package/dist/components/search-tip-banner/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/search-tip-banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/search-tip-banner/index.js

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

package/dist/components/search-tip-banner/index.js.map

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

package/dist/components/section-notice/SectionNotice.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("../button/Button.cjs"),p=require("../icon-button/IconButton.cjs"),i=require("../icon/Icon.cjs"),__d=require("@mattermost/compass-icons/components/information-outline.js"),d=__d?.default??__d,__v=require("@mattermost/compass-icons/components/alert-outline.js"),v=__v?.default??__v,__I=require("@mattermost/compass-icons/components/alert-circle-outline.js"),I=__I?.default??__I,__N=require("@mattermost/compass-icons/components/check-circle-outline.js"),N=__N?.default??__N,__g=require("@mattermost/compass-icons/components/close.js"),g=__g?.default??__g,s=require("./SectionNotice.module.scss.cjs"),q={info:e.jsx(i.default,{size:"20",glyph:e.jsx(d,{})}),warning:e.jsx(i.default,{size:"20",glyph:e.jsx(I,{})}),danger:e.jsx(i.default,{size:"20",glyph:e.jsx(v,{})}),success:e.jsx(i.default,{size:"20",glyph:e.jsx(N,{})}),hint:e.jsx(i.default,{size:"20",glyph:e.jsx(d,{})})};function z({className:j="",type:t="info",icon:c,title:f,description:o,primaryButtonLabel:n,onPrimaryAction:x,secondaryButtonLabel:l,onSecondaryAction:h,onDismiss:a}){const _=s.default[`section-notice--type-${t.toLowerCase()}`],m=[s.default["section-notice"],_,j].filter(Boolean).join(" "),u=c!==void 0?c:q[t],C=n!=null||l!=null;return e.jsxs("div",{className:m,children:[e.jsxs("div",{className:s.default["section-notice__content"],children:[u!=null&&e.jsx("span",{className:s.default["section-notice__icon"],"aria-hidden":!0,children:e.jsx(i.IconSlotContext.Provider,{value:{size:"20"},children:u})}),e.jsxs("div",{className:s.default["section-notice__body"],children:[e.jsx("p",{className:s.default["section-notice__title"],children:f}),o!=null&&e.jsx("div",{className:s.default["section-notice__description"],children:o}),C&&e.jsxs("div",{className:s.default["section-notice__actions"],children:[n!=null&&e.jsx(r.default,{emphasis:"primary",size:"small",onClick:x,children:n}),l!=null&&e.jsx(r.default,{emphasis:"secondary",size:"small",onClick:h,children:l})]})]})]}),a!=null&&e.jsx(p.default,{className:s.default["section-notice__dismiss"],"aria-label":"Dismiss",size:"small",icon:e.jsx(i.default,{size:"16",glyph:e.jsx(g,{})}),onClick:a})]})}exports.default=z;
+//# sourceMappingURL=SectionNotice.cjs.map

package/dist/components/section-notice/SectionNotice.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionNotice.cjs","sources":["../../../src/components/section-notice/SectionNotice.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 InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport CheckCircleOutlineIcon from '@mattermost/compass-icons/components/check-circle-outline';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './SectionNotice.module.scss';\n\nexport type SectionNoticeType =\n  | 'info'\n  | 'warning'\n  | 'danger'\n  | 'success'\n  | 'hint';\n\nexport interface SectionNoticeProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** Type controls color-coding. Default: Info. */\n  type?: SectionNoticeType;\n  /** Optional leading icon. When omitted a default type icon is shown. Pass `<Icon glyph={<SomeIcon />} />` — SectionNotice provides the correct size via context. */\n  icon?: ReactNode;\n  /** Title / headline text. */\n  title: string;\n  /** Optional body description. */\n  description?: ReactNode;\n  /** Primary action button label. */\n  primaryButtonLabel?: string;\n  /** Primary action callback. */\n  onPrimaryAction?: () => void;\n  /** Secondary action button label. */\n  secondaryButtonLabel?: string;\n  /** Secondary action callback. */\n  onSecondaryAction?: () => void;\n  /** Called when dismiss (×) button is clicked. When omitted, dismiss button is hidden. */\n  onDismiss?: () => void;\n}\n\nconst DEFAULT_ICONS: Record<SectionNoticeType, ReactNode> = {\n  info: <Icon size=\"20\" glyph={<InformationOutlineIcon />} />,\n  warning: <Icon size=\"20\" glyph={<AlertCircleOutlineIcon />} />,\n  danger: <Icon size=\"20\" glyph={<AlertOutlineIcon />} />,\n  success: <Icon size=\"20\" glyph={<CheckCircleOutlineIcon />} />,\n  hint: <Icon size=\"20\" glyph={<InformationOutlineIcon />} />,\n};\n\n/**\n * A Section Notice is an in-context alert that lives inside a settings page, admin panel, or\n * other content region. Use it to flag important information, report a state change, or\n * surface a problem the user needs to act on — without yanking them out of the flow.\n */\nexport default function SectionNotice({\n  className = '',\n  type = 'info',\n  icon,\n  title,\n  description,\n  primaryButtonLabel,\n  onPrimaryAction,\n  secondaryButtonLabel,\n  onSecondaryAction,\n  onDismiss,\n}: SectionNoticeProps) {\n  const typeClass = styles[`section-notice--type-${type.toLowerCase()}`];\n\n  const rootClass = [styles['section-notice'], typeClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const resolvedIcon = icon !== undefined ? icon : DEFAULT_ICONS[type];\n\n  const hasActions = primaryButtonLabel != null || secondaryButtonLabel != null;\n\n  return (\n    <div className={rootClass}>\n      <div className={styles['section-notice__content']}>\n        {resolvedIcon != null && (\n          <span className={styles['section-notice__icon']} aria-hidden>\n            <IconSlotContext.Provider value={{ size: '20' }}>\n              {resolvedIcon}\n            </IconSlotContext.Provider>\n          </span>\n        )}\n        <div className={styles['section-notice__body']}>\n          <p className={styles['section-notice__title']}>{title}</p>\n          {description != null && (\n            <div className={styles['section-notice__description']}>\n              {description}\n            </div>\n          )}\n          {hasActions && (\n            <div className={styles['section-notice__actions']}>\n              {primaryButtonLabel != null && (\n                <Button\n                  emphasis=\"primary\"\n                  size=\"small\"\n                  onClick={onPrimaryAction}\n                >\n                  {primaryButtonLabel}\n                </Button>\n              )}\n              {secondaryButtonLabel != null && (\n                <Button\n                  emphasis=\"secondary\"\n                  size=\"small\"\n                  onClick={onSecondaryAction}\n                >\n                  {secondaryButtonLabel}\n                </Button>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          className={styles['section-notice__dismiss']}\n          aria-label=\"Dismiss\"\n          size=\"small\"\n          icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["DEFAULT_ICONS","Icon","jsx","InformationOutlineIcon","AlertCircleOutlineIcon","AlertOutlineIcon","CheckCircleOutlineIcon","SectionNotice","className","type","icon","title","description","primaryButtonLabel","onPrimaryAction","secondaryButtonLabel","onSecondaryAction","onDismiss","typeClass","styles","rootClass","resolvedIcon","hasActions","jsxs","IconSlotContext","Button","IconButton","CloseIcon"],"mappings":"onBA0CMA,EAAsD,CAC1D,WAAOC,UAAA,CAAK,KAAK,KAAK,MAAOC,MAACC,IAAuB,EAAI,EACzD,cAAUF,UAAA,CAAK,KAAK,KAAK,MAAOC,MAACE,IAAuB,EAAI,EAC5D,aAASH,UAAA,CAAK,KAAK,KAAK,MAAOC,MAACG,IAAiB,EAAI,EACrD,cAAUJ,UAAA,CAAK,KAAK,KAAK,MAAOC,MAACI,IAAuB,EAAI,EAC5D,WAAOL,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOC,EAAAA,IAACC,IAAuB,CAAA,CAAI,CAC3D,EAOA,SAAwBI,EAAc,CACpC,UAAAC,EAAY,GACZ,KAAAC,EAAO,OACP,KAAAC,EACA,MAAAC,EACA,YAAAC,EACA,mBAAAC,EACA,gBAAAC,EACA,qBAAAC,EACA,kBAAAC,EACA,UAAAC,CACF,EAAuB,CACrB,MAAMC,EAAYC,EAAAA,QAAO,wBAAwBV,EAAK,YAAA,CAAa,EAAE,EAE/DW,EAAY,CAACD,UAAO,gBAAgB,EAAGD,EAAWV,CAAS,EAC9D,OAAO,OAAO,EACd,KAAK,GAAG,EAELa,EAAeX,IAAS,OAAYA,EAAOV,EAAcS,CAAI,EAE7Da,EAAaT,GAAsB,MAAQE,GAAwB,KAEzE,OACEQ,EAAAA,KAAC,MAAA,CAAI,UAAWH,EACd,SAAA,CAAAG,EAAAA,KAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,yBAAyB,EAC7C,SAAA,CAAAE,GAAgB,MACfnB,EAAAA,IAAC,OAAA,CAAK,UAAWiB,EAAAA,QAAO,sBAAsB,EAAG,cAAW,GAC1D,eAACK,kBAAgB,SAAhB,CAAyB,MAAO,CAAE,KAAM,IAAA,EACtC,WACH,EACF,EAEFD,EAAAA,KAAC,MAAA,CAAI,UAAWJ,EAAAA,QAAO,sBAAsB,EAC3C,SAAA,CAAAjB,MAAC,IAAA,CAAE,UAAWiB,EAAAA,QAAO,uBAAuB,EAAI,SAAAR,EAAM,EACrDC,GAAe,MACdV,MAAC,MAAA,CAAI,UAAWiB,EAAAA,QAAO,6BAA6B,EACjD,SAAAP,EACH,EAEDU,GACCC,EAAAA,KAAC,MAAA,CAAI,UAAWJ,UAAO,yBAAyB,EAC7C,SAAA,CAAAN,GAAsB,MACrBX,EAAAA,IAACuB,EAAAA,QAAA,CACC,SAAS,UACT,KAAK,QACL,QAASX,EAER,SAAAD,CAAA,CAAA,EAGJE,GAAwB,MACvBb,EAAAA,IAACuB,EAAAA,QAAA,CACC,SAAS,YACT,KAAK,QACL,QAAST,EAER,SAAAD,CAAA,CAAA,CACH,CAAA,CAEJ,CAAA,CAAA,CAEJ,CAAA,EACF,EACCE,GAAa,MACZf,EAAAA,IAACwB,EAAAA,QAAA,CACC,UAAWP,EAAAA,QAAO,yBAAyB,EAC3C,aAAW,UACX,KAAK,QACL,WAAOlB,UAAA,CAAK,KAAK,KAAK,MAAOC,MAACyB,IAAU,EAAI,EAC5C,QAASV,CAAA,CAAA,CACX,EAEJ,CAEJ"}

package/dist/components/section-notice/SectionNotice.css

@@ -0,0 +1 @@
+._section-notice_853w8_2{display:flex;flex-direction:column;align-items:flex-end;position:relative;border-radius:var(--radius-s);border:1px solid rgba(var(--color-info-rgb),.16);background-color:rgba(var(--color-info-rgb),.04)}._section-notice__content_853w8_11{display:flex;align-items:flex-start;gap:var(--spacing-m);padding:var(--spacing-m);width:100%}._section-notice__icon_853w8_18{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--color-info)}._section-notice__body_853w8_25{display:flex;flex:1 0 0;flex-direction:column;gap:var(--spacing-xs);min-width:0;overflow:hidden;padding-right:var(--spacing-xl)}._section-notice__title_853w8_34{font-size:var(--font-size-100);font-weight:var(--font-weight-semibold);line-height:var(--line-height-100);color:var(--center-channel-color);margin:0}._section-notice__description_853w8_41{font-size:var(--font-size-100);font-weight:var(--font-weight-regular);line-height:var(--line-height-100);color:var(--center-channel-color)}._section-notice__actions_853w8_47{display:flex;align-items:center;gap:var(--spacing-s);padding:var(--spacing-xxs) 0}._section-notice__dismiss_853w8_53{position:absolute;top:var(--spacing-xxs);right:var(--spacing-xxs)}._section-notice--type-warning_853w8_58{background-color:rgba(var(--color-warning-rgb),.04);border-color:rgba(var(--color-warning-rgb),.16)}._section-notice--type-warning_853w8_58 ._section-notice__icon_853w8_18{color:var(--color-warning)}._section-notice--type-danger_853w8_65{background-color:rgba(var(--error-text-color-rgb, var(--color-danger-rgb)),.04);border-color:rgba(var(--error-text-color-rgb, var(--color-danger-rgb)),.16)}._section-notice--type-danger_853w8_65 ._section-notice__icon_853w8_18{color:var(--error-text, var(--color-danger))}._section-notice--type-success_853w8_72{background-color:rgba(var(--color-success-rgb),.04);border-color:rgba(var(--color-success-rgb),.16)}._section-notice--type-success_853w8_72 ._section-notice__icon_853w8_18{color:var(--color-success)}._section-notice--type-hint_853w8_79{background-color:rgba(var(--center-channel-color-rgb),.04);border-color:rgba(var(--center-channel-color-rgb),.16)}._section-notice--type-hint_853w8_79 ._section-notice__icon_853w8_18{color:rgba(var(--center-channel-color-rgb),.64)}

package/dist/components/section-notice/SectionNotice.d.ts

@@ -0,0 +1,31 @@
+import { ReactNode } from 'react';
+export type SectionNoticeType = 'info' | 'warning' | 'danger' | 'success' | 'hint';
+export interface SectionNoticeProps {
+    /** Optional CSS class name. */
+    className?: string;
+    /** Type controls color-coding. Default: Info. */
+    type?: SectionNoticeType;
+    /** Optional leading icon. When omitted a default type icon is shown. Pass `<Icon glyph={<SomeIcon />} />` — SectionNotice provides the correct size via context. */
+    icon?: ReactNode;
+    /** Title / headline text. */
+    title: string;
+    /** Optional body description. */
+    description?: ReactNode;
+    /** Primary action button label. */
+    primaryButtonLabel?: string;
+    /** Primary action callback. */
+    onPrimaryAction?: () => void;
+    /** Secondary action button label. */
+    secondaryButtonLabel?: string;
+    /** Secondary action callback. */
+    onSecondaryAction?: () => void;
+    /** Called when dismiss (×) button is clicked. When omitted, dismiss button is hidden. */
+    onDismiss?: () => void;
+}
+/**
+ * A Section Notice is an in-context alert that lives inside a settings page, admin panel, or
+ * other content region. Use it to flag important information, report a state change, or
+ * surface a problem the user needs to act on — without yanking them out of the flow.
+ */
+export default function SectionNotice({ className, type, icon, title, description, primaryButtonLabel, onPrimaryAction, secondaryButtonLabel, onSecondaryAction, onDismiss, }: SectionNoticeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SectionNotice.d.ts.map

package/dist/components/section-notice/SectionNotice.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionNotice.d.ts","sourceRoot":"","sources":["../../../src/components/section-notice/SectionNotice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,MAAM,MAAM,iBAAiB,GACzB,MAAM,GACN,SAAS,GACT,QAAQ,GACR,SAAS,GACT,MAAM,CAAC;AAEX,MAAM,WAAW,kBAAkB;IACjC,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,oKAAoK;IACpK,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,iCAAiC;IACjC,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,mCAAmC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,+BAA+B;IAC/B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,qCAAqC;IACrC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iCAAiC;IACjC,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,yFAAyF;IACzF,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAUD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,SAAc,EACd,IAAa,EACb,IAAI,EACJ,KAAK,EACL,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,oBAAoB,EACpB,iBAAiB,EACjB,SAAS,GACV,EAAE,kBAAkB,2CA+DpB"}

package/dist/components/section-notice/SectionNotice.js

@@ -0,0 +1,74 @@
+import { jsxs as n, jsx as i } from "react/jsx-runtime";
+import d from "../button/Button.js";
+import N from "../icon-button/IconButton.js";
+import e, { IconSlotContext as v } from "../icon/Icon.js";
+import __h from "@mattermost/compass-icons/components/information-outline.js";const h=__h&&__h.default?__h.default:__h;
+import __g from "@mattermost/compass-icons/components/alert-outline.js";const g=__g&&__g.default?__g.default:__g;
+import __y from "@mattermost/compass-icons/components/alert-circle-outline.js";const y=__y&&__y.default?__y.default:__y;
+import __O from "@mattermost/compass-icons/components/check-circle-outline.js";const O=__O&&__O.default?__O.default:__O;
+import __k from "@mattermost/compass-icons/components/close.js";const k=__k&&__k.default?__k.default:__k;
+import o from "./SectionNotice.module.scss.js";
+const x = {
+  info: /* @__PURE__ */ i(e, { size: "20", glyph: /* @__PURE__ */ i(h, {}) }),
+  warning: /* @__PURE__ */ i(e, { size: "20", glyph: /* @__PURE__ */ i(y, {}) }),
+  danger: /* @__PURE__ */ i(e, { size: "20", glyph: /* @__PURE__ */ i(g, {}) }),
+  success: /* @__PURE__ */ i(e, { size: "20", glyph: /* @__PURE__ */ i(O, {}) }),
+  hint: /* @__PURE__ */ i(e, { size: "20", glyph: /* @__PURE__ */ i(h, {}) })
+};
+function $({
+  className: p = "",
+  type: l = "info",
+  icon: t,
+  title: f,
+  description: r,
+  primaryButtonLabel: s,
+  onPrimaryAction: u,
+  secondaryButtonLabel: c,
+  onSecondaryAction: _,
+  onDismiss: m
+}) {
+  const C = o[`section-notice--type-${l.toLowerCase()}`], I = [o["section-notice"], C, p].filter(Boolean).join(" "), a = t !== void 0 ? t : x[l], z = s != null || c != null;
+  return /* @__PURE__ */ n("div", { className: I, children: [
+    /* @__PURE__ */ n("div", { className: o["section-notice__content"], children: [
+      a != null && /* @__PURE__ */ i("span", { className: o["section-notice__icon"], "aria-hidden": !0, children: /* @__PURE__ */ i(v.Provider, { value: { size: "20" }, children: a }) }),
+      /* @__PURE__ */ n("div", { className: o["section-notice__body"], children: [
+        /* @__PURE__ */ i("p", { className: o["section-notice__title"], children: f }),
+        r != null && /* @__PURE__ */ i("div", { className: o["section-notice__description"], children: r }),
+        z && /* @__PURE__ */ n("div", { className: o["section-notice__actions"], children: [
+          s != null && /* @__PURE__ */ i(
+            d,
+            {
+              emphasis: "primary",
+              size: "small",
+              onClick: u,
+              children: s
+            }
+          ),
+          c != null && /* @__PURE__ */ i(
+            d,
+            {
+              emphasis: "secondary",
+              size: "small",
+              onClick: _,
+              children: c
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    m != null && /* @__PURE__ */ i(
+      N,
+      {
+        className: o["section-notice__dismiss"],
+        "aria-label": "Dismiss",
+        size: "small",
+        icon: /* @__PURE__ */ i(e, { size: "16", glyph: /* @__PURE__ */ i(k, {}) }),
+        onClick: m
+      }
+    )
+  ] });
+}
+export {
+  $ as default
+};
+//# sourceMappingURL=SectionNotice.js.map

package/dist/components/section-notice/SectionNotice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionNotice.js","sources":["../../../src/components/section-notice/SectionNotice.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 InformationOutlineIcon from '@mattermost/compass-icons/components/information-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport CheckCircleOutlineIcon from '@mattermost/compass-icons/components/check-circle-outline';\nimport CloseIcon from '@mattermost/compass-icons/components/close';\nimport styles from './SectionNotice.module.scss';\n\nexport type SectionNoticeType =\n  | 'info'\n  | 'warning'\n  | 'danger'\n  | 'success'\n  | 'hint';\n\nexport interface SectionNoticeProps {\n  /** Optional CSS class name. */\n  className?: string;\n  /** Type controls color-coding. Default: Info. */\n  type?: SectionNoticeType;\n  /** Optional leading icon. When omitted a default type icon is shown. Pass `<Icon glyph={<SomeIcon />} />` — SectionNotice provides the correct size via context. */\n  icon?: ReactNode;\n  /** Title / headline text. */\n  title: string;\n  /** Optional body description. */\n  description?: ReactNode;\n  /** Primary action button label. */\n  primaryButtonLabel?: string;\n  /** Primary action callback. */\n  onPrimaryAction?: () => void;\n  /** Secondary action button label. */\n  secondaryButtonLabel?: string;\n  /** Secondary action callback. */\n  onSecondaryAction?: () => void;\n  /** Called when dismiss (×) button is clicked. When omitted, dismiss button is hidden. */\n  onDismiss?: () => void;\n}\n\nconst DEFAULT_ICONS: Record<SectionNoticeType, ReactNode> = {\n  info: <Icon size=\"20\" glyph={<InformationOutlineIcon />} />,\n  warning: <Icon size=\"20\" glyph={<AlertCircleOutlineIcon />} />,\n  danger: <Icon size=\"20\" glyph={<AlertOutlineIcon />} />,\n  success: <Icon size=\"20\" glyph={<CheckCircleOutlineIcon />} />,\n  hint: <Icon size=\"20\" glyph={<InformationOutlineIcon />} />,\n};\n\n/**\n * A Section Notice is an in-context alert that lives inside a settings page, admin panel, or\n * other content region. Use it to flag important information, report a state change, or\n * surface a problem the user needs to act on — without yanking them out of the flow.\n */\nexport default function SectionNotice({\n  className = '',\n  type = 'info',\n  icon,\n  title,\n  description,\n  primaryButtonLabel,\n  onPrimaryAction,\n  secondaryButtonLabel,\n  onSecondaryAction,\n  onDismiss,\n}: SectionNoticeProps) {\n  const typeClass = styles[`section-notice--type-${type.toLowerCase()}`];\n\n  const rootClass = [styles['section-notice'], typeClass, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const resolvedIcon = icon !== undefined ? icon : DEFAULT_ICONS[type];\n\n  const hasActions = primaryButtonLabel != null || secondaryButtonLabel != null;\n\n  return (\n    <div className={rootClass}>\n      <div className={styles['section-notice__content']}>\n        {resolvedIcon != null && (\n          <span className={styles['section-notice__icon']} aria-hidden>\n            <IconSlotContext.Provider value={{ size: '20' }}>\n              {resolvedIcon}\n            </IconSlotContext.Provider>\n          </span>\n        )}\n        <div className={styles['section-notice__body']}>\n          <p className={styles['section-notice__title']}>{title}</p>\n          {description != null && (\n            <div className={styles['section-notice__description']}>\n              {description}\n            </div>\n          )}\n          {hasActions && (\n            <div className={styles['section-notice__actions']}>\n              {primaryButtonLabel != null && (\n                <Button\n                  emphasis=\"primary\"\n                  size=\"small\"\n                  onClick={onPrimaryAction}\n                >\n                  {primaryButtonLabel}\n                </Button>\n              )}\n              {secondaryButtonLabel != null && (\n                <Button\n                  emphasis=\"secondary\"\n                  size=\"small\"\n                  onClick={onSecondaryAction}\n                >\n                  {secondaryButtonLabel}\n                </Button>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n      {onDismiss != null && (\n        <IconButton\n          className={styles['section-notice__dismiss']}\n          aria-label=\"Dismiss\"\n          size=\"small\"\n          icon={<Icon size=\"16\" glyph={<CloseIcon />} />}\n          onClick={onDismiss}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["DEFAULT_ICONS","Icon","jsx","InformationOutlineIcon","AlertCircleOutlineIcon","AlertOutlineIcon","CheckCircleOutlineIcon","SectionNotice","className","type","icon","title","description","primaryButtonLabel","onPrimaryAction","secondaryButtonLabel","onSecondaryAction","onDismiss","typeClass","styles","rootClass","resolvedIcon","hasActions","jsxs","IconSlotContext","Button","IconButton","CloseIcon"],"mappings":";;;;;;;;;;AA0CA,MAAMA,IAAsD;AAAA,EAC1D,wBAAOC,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACC,KAAuB,GAAI;AAAA,EACzD,2BAAUF,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACE,KAAuB,GAAI;AAAA,EAC5D,0BAASH,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACG,KAAiB,GAAI;AAAA,EACrD,2BAAUJ,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACI,KAAuB,GAAI;AAAA,EAC5D,wBAAOL,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACC,KAAuB,EAAA,CAAI;AAC3D;AAOA,SAAwBI,EAAc;AAAA,EACpC,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AACF,GAAuB;AACrB,QAAMC,IAAYC,EAAO,wBAAwBV,EAAK,YAAA,CAAa,EAAE,GAE/DW,IAAY,CAACD,EAAO,gBAAgB,GAAGD,GAAWV,CAAS,EAC9D,OAAO,OAAO,EACd,KAAK,GAAG,GAELa,IAAeX,MAAS,SAAYA,IAAOV,EAAcS,CAAI,GAE7Da,IAAaT,KAAsB,QAAQE,KAAwB;AAEzE,SACE,gBAAAQ,EAAC,OAAA,EAAI,WAAWH,GACd,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWJ,EAAO,yBAAyB,GAC7C,UAAA;AAAA,MAAAE,KAAgB,QACf,gBAAAnB,EAAC,QAAA,EAAK,WAAWiB,EAAO,sBAAsB,GAAG,eAAW,IAC1D,4BAACK,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAM,KAAA,GACtC,aACH,GACF;AAAA,MAEF,gBAAAD,EAAC,OAAA,EAAI,WAAWJ,EAAO,sBAAsB,GAC3C,UAAA;AAAA,QAAA,gBAAAjB,EAAC,KAAA,EAAE,WAAWiB,EAAO,uBAAuB,GAAI,UAAAR,GAAM;AAAA,QACrDC,KAAe,QACd,gBAAAV,EAAC,OAAA,EAAI,WAAWiB,EAAO,6BAA6B,GACjD,UAAAP,GACH;AAAA,QAEDU,KACC,gBAAAC,EAAC,OAAA,EAAI,WAAWJ,EAAO,yBAAyB,GAC7C,UAAA;AAAA,UAAAN,KAAsB,QACrB,gBAAAX;AAAA,YAACuB;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAK;AAAA,cACL,SAASX;AAAA,cAER,UAAAD;AAAA,YAAA;AAAA,UAAA;AAAA,UAGJE,KAAwB,QACvB,gBAAAb;AAAA,YAACuB;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAK;AAAA,cACL,SAAST;AAAA,cAER,UAAAD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,CAEJ;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,GACF;AAAA,IACCE,KAAa,QACZ,gBAAAf;AAAA,MAACwB;AAAA,MAAA;AAAA,QACC,WAAWP,EAAO,yBAAyB;AAAA,QAC3C,cAAW;AAAA,QACX,MAAK;AAAA,QACL,wBAAOlB,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAC,EAACyB,KAAU,GAAI;AAAA,QAC5C,SAASV;AAAA,MAAA;AAAA,IAAA;AAAA,EACX,GAEJ;AAEJ;"}

package/dist/components/section-notice/SectionNotice.module.scss.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./SectionNotice.css');const e={"section-notice":"_section-notice_853w8_2","section-notice__content":"_section-notice__content_853w8_11","section-notice__icon":"_section-notice__icon_853w8_18","section-notice__body":"_section-notice__body_853w8_25","section-notice__title":"_section-notice__title_853w8_34","section-notice__description":"_section-notice__description_853w8_41","section-notice__actions":"_section-notice__actions_853w8_47","section-notice__dismiss":"_section-notice__dismiss_853w8_53","section-notice--type-warning":"_section-notice--type-warning_853w8_58","section-notice--type-danger":"_section-notice--type-danger_853w8_65","section-notice--type-success":"_section-notice--type-success_853w8_72","section-notice--type-hint":"_section-notice--type-hint_853w8_79"};exports.default=e;
+//# sourceMappingURL=SectionNotice.module.scss.cjs.map

package/dist/components/section-notice/SectionNotice.module.scss.cjs.map

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

package/dist/components/section-notice/SectionNotice.module.scss.js

@@ -0,0 +1,18 @@
+import './SectionNotice.css';const t = {
+  "section-notice": "_section-notice_853w8_2",
+  "section-notice__content": "_section-notice__content_853w8_11",
+  "section-notice__icon": "_section-notice__icon_853w8_18",
+  "section-notice__body": "_section-notice__body_853w8_25",
+  "section-notice__title": "_section-notice__title_853w8_34",
+  "section-notice__description": "_section-notice__description_853w8_41",
+  "section-notice__actions": "_section-notice__actions_853w8_47",
+  "section-notice__dismiss": "_section-notice__dismiss_853w8_53",
+  "section-notice--type-warning": "_section-notice--type-warning_853w8_58",
+  "section-notice--type-danger": "_section-notice--type-danger_853w8_65",
+  "section-notice--type-success": "_section-notice--type-success_853w8_72",
+  "section-notice--type-hint": "_section-notice--type-hint_853w8_79"
+};
+export {
+  t as default
+};
+//# sourceMappingURL=SectionNotice.module.scss.js.map

package/dist/components/section-notice/SectionNotice.module.scss.js.map

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

package/dist/components/section-notice/index.cjs

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

package/dist/components/section-notice/index.cjs.map

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

package/dist/components/section-notice/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/section-notice/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/section-notice/index.js

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

package/dist/components/section-notice/index.js.map

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

package/dist/components/select/Select.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),s=require("react"),__me=require("@mattermost/compass-icons/components/chevron-down.js"),me=__me?.default??__me,U=require("../icon/Icon.cjs"),xe=require("../menu-item/MenuItem.cjs"),K=require("../popover-menu/PopoverMenu.cjs"),_e=require("../../hooks/use-anchored-popup-portal.cjs"),je=require("../../hooks/use-outside-close.cjs"),ge=require("../../hooks/use-popover-transition.cjs"),ke=require("../../utils/string.cjs"),l=require("./Select.module.scss.cjs"),L=280;function ye({option:u,listboxId:b,selected:_,active:k,onSelect:v,onHover:y}){return o.jsx("li",{className:l.default.select__option,role:"presentation",children:o.jsx(xe.default,{id:`${b}-option-${u.value}`,role:"option",label:u.label,secondaryLabel:u.secondaryLabel,leadingElement:u.leadingVisual!=null,leadingVisual:u.leadingVisual,trailingElement:_,active:k,disabled:u.disabled,"aria-selected":_,onMouseDown:d=>d.preventDefault(),onMouseEnter:y,onPointerUp:()=>{u.disabled||v(u)}})})}const Ie=s.forwardRef(function({options:b,value:_,defaultValue:k="",onChange:v,placeholder:y,label:d,leadingIcon:I,size:G="medium",invalid:D=!1,disabled:h=!1,id:X,name:R,className:J="","aria-label":q,portalContainer:Q=null,zIndex:W},j){const Y=s.useId(),P=X??Y,m=`${P}-listbox`,C=s.useRef(null),E=s.useRef(null),M=s.useRef(null),Z=s.useCallback(e=>{M.current=e,typeof j=="function"?j(e):j&&(j.current=e)},[j]),S=_!==void 0,[ee,te]=s.useState(k),f=S?_:ee,[n,N]=s.useState(!1),[le,O]=s.useState(!1),[i,p]=s.useState(-1),w=s.useMemo(()=>b.find(e=>e.value===f),[b,f]),a=s.useMemo(()=>b.filter(e=>e.value!==""),[b]),V=f!=="",{mounted:$,visible:se}=ge.usePopoverTransition(n),{placement:ne,maxHeight:ae,style:oe,portalRef:A,renderPortal:ce}=_e.useAnchoredPopupPortal(E,$,{preferredHeight:L,maxHeightCap:L,portalContainer:Q,zIndex:W}),x=s.useCallback(()=>{N(!1),p(-1)},[]),g=s.useCallback(()=>{h||N(!0)},[h]);je.useOutsideClose(C,n,x,A),s.useEffect(()=>{n&&p(e=>{if(a.length===0)return-1;if(e>=0&&e<a.length)return e;const t=a.findIndex(r=>r.value===f);if(t>=0)return t;const c=a.findIndex(r=>!r.disabled);return c>=0?c:0})},[n,a,f]);const H=s.useCallback(e=>{S||te(e),v==null||v(e)},[S,v]),B=s.useCallback(e=>{var t;e.disabled||(H(e.value),x(),(t=M.current)==null||t.focus())},[H,x]),F=s.useCallback(e=>{const t=a.map((c,r)=>({o:c,i:r})).filter(({o:c})=>!c.disabled);if(t.length===0){p(-1);return}p(c=>{const r=t.findIndex(({i:he})=>he===c),ve=r<0?e>0?0:t.length-1:(r+e+t.length)%t.length;return t[ve].i})},[a]);s.useEffect(()=>{if(!n||i<0)return;const e=a[i];if(!e)return;const t=document.getElementById(`${m}-option-${e.value}`);t==null||t.scrollIntoView({block:"nearest"})},[n,i,a,m]);const re=e=>{var t;if(!h)switch(e.key){case"ArrowDown":e.preventDefault(),n?F(1):g();break;case"ArrowUp":e.preventDefault(),n?F(-1):g();break;case"Home":if(n&&a.length>0){e.preventDefault();const c=a.findIndex(r=>!r.disabled);p(c>=0?c:0)}break;case"End":if(n&&a.length>0){e.preventDefault();for(let c=a.length-1;c>=0;c--)if(!((t=a[c])!=null&&t.disabled)){p(c);break}}break;case"Enter":case" ":e.preventDefault(),n&&i>=0&&a[i]?B(a[i]):n||g();break;case"Escape":n&&(e.preventDefault(),x());break;case"Tab":x();break}},ue=le||n||V,T=(w==null?void 0:w.label)??y??"",ie=!V&&T!=="",z=i>=0?a[i]:void 0,de=n&&z!=null?`${m}-option-${z.value}`:void 0,fe=l.default[`select--size-${ke.toKebab(G)}`],pe=[l.default.select,fe,D?l.default["select--invalid"]:"",d!=null&&ue?l.default["select--label-floated"]:"",I!=null?l.default["select--has-leading-icon"]:"",n?l.default["select--open"]:"",h?l.default["select--disabled"]:"",J].filter(Boolean).join(" "),be=[l.default.select__control,ie?l.default["select__control--placeholder"]:""].filter(Boolean).join(" ");return o.jsxs("div",{className:pe,ref:C,children:[o.jsxs("div",{className:l.default.select__wrapper,ref:E,children:[d!=null&&o.jsx("label",{className:l.default.select__label,htmlFor:P,children:d}),o.jsxs("button",{ref:Z,id:P,type:"button",role:"combobox",className:be,disabled:h,"aria-haspopup":"listbox","aria-expanded":n,"aria-controls":m,"aria-activedescendant":de,"aria-invalid":D?!0:void 0,"aria-label":q,onClick:()=>n?x():g(),onFocus:()=>O(!0),onBlur:()=>O(!1),onKeyDown:re,children:[I!=null&&o.jsx("span",{className:l.default["select__leading-icon"],"aria-hidden":!0,children:o.jsx(U.IconSlotContext.Provider,{value:{size:"16"},children:I})}),o.jsx("span",{className:l.default.select__value,children:T}),o.jsx("span",{className:l.default["select__trailing-icon"],"aria-hidden":!0,children:o.jsx(U.default,{size:"12",glyph:o.jsx(me,{})})})]})]}),R!=null&&!h&&o.jsx("input",{type:"hidden",name:R,value:f}),$&&ce(o.jsx("div",{ref:A,className:[l.default.select__popup,ne==="above"?l.default["select__popup--above"]:"",se?l.default["select__popup--visible"]:""].filter(Boolean).join(" "),style:oe,children:o.jsx(K.default,{className:l.default.select__menu,children:o.jsx(K.PopoverMenuScroll,{maxHeight:ae,children:o.jsx("ul",{id:m,className:l.default.select__list,role:"listbox","aria-label":typeof d=="string"?d:q??"Options",children:a.map((e,t)=>o.jsx(ye,{option:e,listboxId:m,selected:e.value===f,active:t===i,onSelect:B,onHover:()=>p(t)},e.value))})})})}))]})});exports.default=Ie;
+//# sourceMappingURL=Select.cjs.map