@bikdotai/bik-component-library 0.0.871 → 0.0.872

package/dist/esm/components/agent-builder/components/MentionPicker.js

@@ -1,262 +1,264 @@
-import { jsxs as x, jsx as c, Fragment as ce } from "react/jsx-runtime";
+import { jsxs as x, jsx as a, Fragment as ce } from "react/jsx-runtime";
 import se from "../../../assets/icons/chevronRight.svg.js";
 import de from "../../../assets/icons/searchIcon.svg.js";
 import ue from "../../../icons/Arrows/Normal arrows/ArrowLeft.js";
-import { useState as z, useMemo as I, useEffect as j, useRef as he } from "react";
-import u from "styled-components";
+import { useState as D, useMemo as I, useEffect as V, useRef as he } from "react";
+import h from "styled-components";
 import { TitleSmall as pe, BodySecondary as fe, BodyCaption as ge } from "../../TypographyStyle.js";
 import { COLORS as o } from "../../../constants/Theme.js";
 import { PickerType as be } from "../../variable-picker-v3/model.js";
-import { CATEGORIES as me, MORE_INTEGRATIONS_KEY as v, isMoreIntegrationSource as q, toolSourceRank as Y, MORE_INTEGRATIONS_LABEL as te, isIntegrationSource as ke, CONFIG_TOOL_SOURCES as xe, MORE_INTEGRATIONS_RANK as ve } from "../constants/tools.js";
-import { toolSourceLabel as H } from "../utils/mentionSerialization.js";
-import { renderSourceIcon as re, sourceIcon as D } from "../utils/sourceIcons.js";
-import we from "../../../icons/Informational/Identity/PuzzlePiece.js";
-import { VariablePicker as ye } from "../../variable-picker-v3/VariablePicker.js";
-import ne from "../../../icons/Informational/Common UI/Shield.js";
-const oe = {
-  Icon: we,
-  w: 20,
-  h: 20
-}, b = (s) => s.meta, A = (s) => b(s)?.plainLabel ?? s.label, Ie = "__bik_create_subagent__", Ze = ({
-  items: s,
-  onSelect: C,
-  registerKeyHandler: $,
-  onClose: w,
+import { CATEGORIES as me, INTEGRATIONS_KEY as k, toolSourceRank as xe, INTEGRATIONS_LABEL as Z, isIntegrationSource as ke, CONFIG_TOOL_SOURCES as ve, INTEGRATIONS_RANK as ye } from "../constants/tools.js";
+import { toolSourceLabel as j } from "../utils/mentionSerialization.js";
+import { partitionSources as we, isUnconnectedSource as Ie } from "../utils/sourceGrouping.js";
+import { INTEGRATIONS_ICON as ee, renderSourceIcon as te, sourceIcon as M } from "../utils/sourceIcons.js";
+import { VariablePicker as Re } from "../../variable-picker-v3/VariablePicker.js";
+import re from "../../../icons/Informational/Common UI/Shield.js";
+const g = (c) => c.meta, A = (c) => g(c)?.plainLabel ?? c.label, Se = "__bik_create_subagent__", Ae = 5, nt = ({
+  items: c,
+  onSelect: E,
+  registerKeyHandler: C,
+  onClose: v,
   onCreateSubAgent: R,
-  initialSource: J,
+  initialSource: H,
   toolActions: y,
-  integrationStatus: K,
-  onConnectIntegration: Q,
+  integrationStatus: $,
+  onConnectIntegration: K,
   appLabel: B,
   variablesData: G,
-  onSelectVariable: F
+  onSelectVariable: U
 }) => {
-  const [ie, O] = z(null), [i, S] = z(J ?? null), [T, m] = z(-1), [E, W] = z(""), k = I(
-    () => s.filter((e) => b(e)?.kind === "tool"),
-    [s]
-  ), L = I(
-    () => s.filter((e) => b(e)?.kind === "subagent"),
-    [s]
-  ), U = I(() => {
+  const [ne, T] = D(null), [i, S] = D(H ?? null), [L, b] = D(-1), [w, W] = D(""), m = I(
+    () => c.filter((e) => g(e)?.kind === "tool"),
+    [c]
+  ), O = I(
+    () => c.filter((e) => g(e)?.kind === "subagent"),
+    [c]
+  ), F = I(() => {
     const e = [];
-    return k.forEach((n) => {
-      const f = b(n)?.source ?? "other";
-      e.includes(f) || e.push(f);
+    return m.forEach((n) => {
+      const t = g(n)?.source ?? "other";
+      e.includes(t) || e.push(t);
     }), e;
-  }, [k]), V = I(
-    () => new Map(
-      (y ?? []).map((e) => [e.source, e])
-    ),
-    [y]
-  ), _ = I(
-    () => me.filter((e) => e.key === "tool" ? k.length > 0 || (y?.length ?? 0) > 0 : e.key === "variable" ? (G?.length ?? 0) > 0 && !!F : L.length > 0 || !!R),
+  }, [m]), _ = I(() => {
+    const e = /* @__PURE__ */ new Map();
+    return (y ?? []).forEach((n) => {
+      const t = e.get(n.source);
+      t ? t.push(n) : e.set(n.source, [n]);
+    }), e;
+  }, [y]), N = I(
+    () => me.filter((e) => e.key === "tool" ? m.length > 0 || (y?.length ?? 0) > 0 : e.key === "variable" ? (G?.length ?? 0) > 0 && !!U : O.length > 0 || !!R),
     [
-      k.length,
-      L.length,
+      m.length,
+      O.length,
       R,
       y?.length,
       G?.length,
-      F
+      U
     ]
-  ), P = _.length === 1 ? _[0].key : null, a = ie ?? P, h = a ? a === "subagent" ? (
+  ), P = N.length === 1 ? N[0].key : null, l = ne ?? P, p = l ? l === "subagent" ? (
     // Always titled — with a back arrow only when the category chooser is above.
     {
       title: "Sub-agent",
-      onBack: P ? void 0 : () => O(null)
+      onBack: P ? void 0 : () => T(null)
     }
-  ) : a === "variable" ? {
+  ) : l === "variable" ? {
     title: "Variables",
-    onBack: P ? void 0 : () => O(null)
-  } : i === v ? {
-    title: te,
+    onBack: P ? void 0 : () => T(null)
+  } : i === k ? {
+    title: Z,
     onBack: () => S(null),
-    icon: oe
+    icon: ee
   } : i ? {
-    title: H(i, B),
+    title: j(i, B),
     // Deep-linked to a source (opened from a right-panel source button):
-    // that source IS the root, so no back arrow. Otherwise back returns to
-    // the "More Integrations" umbrella for a vendor that lives under it,
-    // else to the source chooser.
-    onBack: J ? void 0 : () => S(
-      q(i) ? v : null
+    // that source IS the root, so no back arrow. Otherwise back returns
+    // where the row was: the "Integrations" umbrella for a source the store
+    // hasn't connected, else the source chooser.
+    onBack: H ? void 0 : () => S(
+      Ie(i, $) ? k : null
     ),
-    icon: D(i)
+    icon: M(i)
   } : (
     // Always titled — matches the Sub-agent header; back arrow only when the
     // category chooser is above (i.e. not the sole category).
     {
       title: "Tools",
-      onBack: P ? void 0 : () => O(null)
+      onBack: P ? void 0 : () => T(null)
     }
-  ) : null, d = I(() => {
-    if (!a)
-      return _.map((r) => ({
-        id: r.key,
-        label: r.label,
+  ) : null, s = I(() => {
+    if (!l)
+      return N.map((t) => ({
+        id: t.key,
+        label: t.label,
         drillsIn: !0,
         onActivate: () => {
-          O(r.key), S(null);
+          T(t.key), S(null);
         }
       }));
-    if (a === "subagent") {
-      const r = E.trim().toLowerCase(), p = L.filter((g) => !r || A(g).toLowerCase().includes(r)).map((g) => ({
-        id: String(g.id),
-        label: A(g),
+    if (l === "subagent") {
+      const t = w.trim().toLowerCase(), f = O.filter((u) => !t || A(u).toLowerCase().includes(t)).map((u) => ({
+        id: String(u.id),
+        label: A(u),
         drillsIn: !1,
-        onActivate: () => C(g)
+        onActivate: () => E(u)
       }));
-      return R && p.push({
-        id: Ie,
+      return R && f.push({
+        id: Se,
         label: "Create new",
         drillsIn: !1,
         isCreate: !0,
         onActivate: () => {
-          w?.(), R();
+          v?.(), R();
         }
-      }), p;
+      }), f;
     }
-    if (a === "variable")
+    if (l === "variable")
       return [];
-    if (!i || i === v) {
-      const r = (y ?? []).map((t) => t.source).filter((t) => !U.includes(t)), p = [...U, ...r], g = (t) => {
-        const l = V.get(t);
-        if ((l !== void 0 ? l.connected : K?.[t]) === !1)
+    if (!i || i === k) {
+      const t = Array.from(
+        new Set((y ?? []).map((r) => r.source))
+      ).filter((r) => !F.includes(r)), f = [...F, ...t], u = (r) => {
+        const d = _.get(r)?.[0];
+        if ((d !== void 0 ? d.connected : $?.[r]) === !1)
           return {
-            id: t,
-            label: H(t, B),
+            id: r,
+            label: j(r, B),
             drillsIn: !1,
-            icon: D(t) ?? l?.icon,
+            icon: M(r) ?? d?.icon,
             rightLabel: "Connect",
             onActivate: () => {
-              w?.(), l?.onConnect ? l.onConnect() : Q?.(t);
+              v?.(), d?.onConnect ? d.onConnect() : K?.(r);
             }
           };
-        const ee = k.filter(
-          (N) => (b(N)?.source ?? "other") === t
-        );
-        if (ee.length + (l ? 1 : 0) === 1 && !(l === void 0 && ke(t))) {
-          const N = D(t) ?? l?.icon;
-          if (l)
+        const X = m.filter(
+          (q) => (g(q)?.source ?? "other") === r
+        ), ae = (_.get(r) ?? []).length;
+        if (X.length + ae === 1 && !(d === void 0 && ke(r))) {
+          const q = M(r) ?? d?.icon;
+          if (d)
             return {
-              id: t,
-              label: l.label,
+              id: r,
+              label: d.label,
               drillsIn: !1,
-              icon: N,
+              icon: q,
               onActivate: () => {
-                w?.(), l.onSelect();
+                v?.(), d.onSelect();
               }
             };
-          const M = ee[0];
+          const z = X[0];
           return {
-            id: String(M.id),
-            label: A(M),
+            id: String(z.id),
+            label: A(z),
             drillsIn: !1,
-            icon: N,
-            authRequired: b(M)?.authRequired,
-            onActivate: () => C(M)
+            icon: q,
+            authRequired: g(z)?.authRequired,
+            onActivate: () => E(z)
           };
         }
         return {
-          id: t,
-          label: H(t, B),
+          id: r,
+          label: j(r, B),
           drillsIn: !0,
-          icon: D(t) ?? l?.icon,
-          onActivate: () => S(t)
+          icon: M(r) ?? d?.icon,
+          onActivate: () => S(r)
         };
-      };
-      if (i === v)
-        return p.filter((t) => q(t)).sort((t, l) => Y(t) - Y(l)).map(g);
-      const Z = p.filter((t) => !q(t)).map((t) => ({ row: g(t), rank: Y(t) }));
-      return p.some((t) => q(t)) && Z.push({
-        rank: ve,
+      }, { outside: le, inside: J } = we(f, $);
+      if (i === k)
+        return J.map(u);
+      const Q = le.map(
+        (r) => ({ row: u(r), rank: xe(r) })
+      );
+      return J.length > 0 && Q.push({
+        rank: ye,
         row: {
-          id: v,
-          label: te,
+          id: k,
+          label: Z,
           drillsIn: !0,
-          icon: oe,
-          onActivate: () => S(v)
+          icon: ee,
+          onActivate: () => S(k)
         }
-      }), Z.sort((t, l) => t.rank - l.rank).map((t) => t.row);
+      }), Q.sort((r, d) => r.rank - d.rank).map((r) => r.row);
     }
-    const e = E.trim().toLowerCase(), n = k.filter((r) => (b(r)?.source ?? "other") === i).filter((r) => !e || A(r).toLowerCase().includes(e)).map((r) => ({
-      id: String(r.id),
-      label: A(r),
+    const e = w.trim().toLowerCase(), n = m.filter((t) => (g(t)?.source ?? "other") === i).filter((t) => !e || A(t).toLowerCase().includes(e)).map((t) => ({
+      id: String(t.id),
+      label: A(t),
       drillsIn: !1,
-      authRequired: b(r)?.authRequired,
-      onActivate: () => C(r)
-    })), f = V.get(i);
-    if (f) {
-      const r = i in xe;
+      authRequired: g(t)?.authRequired,
+      onActivate: () => E(t)
+    }));
+    return (_.get(i) ?? []).forEach((t) => {
+      const f = i in ve;
       n.push({
-        id: `create:${i}`,
-        label: f.label,
+        // A source with several config tools gets one row each, so the key
+        // carries the tool it opens.
+        id: `create:${i}:${t.toolKey ?? ""}`,
+        label: t.label,
         drillsIn: !1,
-        isCreate: !r,
+        isCreate: !f,
         onActivate: () => {
-          w?.(), f.onSelect();
+          v?.(), t.onSelect();
         }
       });
-    }
-    return n;
+    }), n;
   }, [
-    a,
-    _,
+    l,
+    N,
     i,
-    E,
-    k,
-    L,
-    U,
-    C,
     w,
+    m,
+    O,
+    F,
+    E,
+    v,
     R,
     y,
-    V,
+    _,
+    $,
     K,
-    Q,
     B
   ]);
-  j(() => m(-1), [a, i, E, s]), j(() => W(""), [a, i]);
-  const X = he({ rows: d, activeIndex: T, header: h });
-  X.current = { rows: d, activeIndex: T, header: h }, j(() => {
-    if ($)
-      return $((e) => {
-        const { rows: n, activeIndex: f, header: r } = X.current;
+  V(() => b(-1), [l, i, w, c]), V(() => W(""), [l, i]);
+  const Y = he({ rows: s, activeIndex: L, header: p });
+  Y.current = { rows: s, activeIndex: L, header: p }, V(() => {
+    if (C)
+      return C((e) => {
+        const { rows: n, activeIndex: t, header: f } = Y.current;
         if (!n.length && e.key !== "ArrowLeft")
           return !1;
         switch (e.key) {
           case "ArrowDown":
-            return m((p) => (p + 1) % n.length), !0;
+            return b((u) => (u + 1) % n.length), !0;
           case "ArrowUp":
-            return m((p) => (p + n.length - 1) % n.length), !0;
+            return b((u) => (u + n.length - 1) % n.length), !0;
           case "ArrowRight":
           case "Enter":
-            return (n[f] ?? n[0])?.onActivate(), !0;
+            return (n[t] ?? n[0])?.onActivate(), !0;
           case "ArrowLeft":
-            return r?.onBack ? (r.onBack(), !0) : !1;
+            return f?.onBack ? (f.onBack(), !0) : !1;
           default:
             return !1;
         }
-      }), () => $(null);
-  }, [$]);
-  const le = a ? d.length && !d[0].drillsIn ? "items" : "sources" : "categories", ae = a === "tool" && !!i && i !== v || a === "subagent";
+      }), () => C(null);
+  }, [C]);
+  const oe = l ? s.length && !s[0].drillsIn ? "items" : "sources" : "categories", ie = (l === "tool" && !!i && i !== k || l === "subagent") && (s.length >= Ae || w.trim().length > 0);
   return /* @__PURE__ */ x(
-    Re,
+    Ee,
     {
-      className: `bik-mention-picker bik-mention-picker--${le}`,
-      $fixedHeight: a === "variable",
+      className: `bik-mention-picker bik-mention-picker--${oe}`,
+      $fixedHeight: l === "variable",
       children: [
-        h && /* @__PURE__ */ x(
-          _e,
+        p && /* @__PURE__ */ x(
+          qe,
           {
             type: "button",
-            onClick: h.onBack,
-            disabled: !h.onBack,
+            onClick: p.onBack,
+            disabled: !p.onBack,
             style: {
               background: o.surface.subdued,
-              cursor: h.onBack ? "pointer" : "default"
+              cursor: p.onBack ? "pointer" : "default"
             },
             children: [
-              h.onBack && /* @__PURE__ */ c(
+              p.onBack && /* @__PURE__ */ a(
                 ue,
                 {
                   width: 20,
@@ -264,16 +266,16 @@ const oe = {
                   color: o.content.primary
                 }
               ),
-              h.icon && re(h.icon),
+              p.icon && te(p.icon),
               /* @__PURE__ */ x(pe, { children: [
                 " ",
-                h.title
+                p.title
               ] })
             ]
           }
         ),
-        ae && /* @__PURE__ */ x(Ae, { children: [
-          /* @__PURE__ */ c(
+        ie && /* @__PURE__ */ x(Be, { children: [
+          /* @__PURE__ */ a(
             de,
             {
               width: 20,
@@ -281,84 +283,84 @@ const oe = {
               color: o.content.placeholder
             }
           ),
-          /* @__PURE__ */ c(
-            Ce,
+          /* @__PURE__ */ a(
+            Te,
             {
               autoFocus: !0,
-              value: E,
+              value: w,
               placeholder: "Search",
               "data-test": "mention-picker-search",
               onChange: (e) => W(e.target.value),
               onKeyDown: (e) => {
-                d.length && (e.key === "ArrowDown" ? (e.preventDefault(), m((n) => (n + 1) % d.length)) : e.key === "ArrowUp" ? (e.preventDefault(), m((n) => (n + d.length - 1) % d.length)) : e.key === "Enter" && (e.preventDefault(), (d[T] ?? d[0])?.onActivate()));
+                s.length && (e.key === "ArrowDown" ? (e.preventDefault(), b((n) => (n + 1) % s.length)) : e.key === "ArrowUp" ? (e.preventDefault(), b((n) => (n + s.length - 1) % s.length)) : e.key === "Enter" && (e.preventDefault(), (s[L] ?? s[0])?.onActivate()));
               }
             }
           )
         ] }),
-        a === "variable" ? (
+        l === "variable" ? (
           // Shared variable catalog, embedded as this drill-in view. The fill
           // wrapper hands it the remaining card height, so ITS search bar stays
           // fixed and only the variable list below scrolls. Selecting a
           // variable dismisses the menu FIRST (strips the typed "@" + query),
           // then hands the variable up to insert its `{{token}}` at the cursor.
-          /* @__PURE__ */ c(Ee, { children: /* @__PURE__ */ c(
-            ye,
+          /* @__PURE__ */ a($e, { children: /* @__PURE__ */ a(
+            Re,
             {
               type: be.EMBEDDED,
               data: G ?? [],
               showRecommendedBar: !0,
               skipDefaultVariableContent: !0,
               onSelect: (e) => {
-                w?.(), F?.(e);
+                v?.(), U?.(e);
               }
             }
           ) })
-        ) : d.length === 0 ? /* @__PURE__ */ c(Pe, { children: a === "subagent" ? null : "No tools available" }) : /* @__PURE__ */ c(Se, { children: d.map((e, n) => /* @__PURE__ */ c(
-          $e,
+        ) : s.length === 0 ? /* @__PURE__ */ a(ze, { children: l === "subagent" ? null : "No tools available" }) : /* @__PURE__ */ a(Ce, { children: s.map((e, n) => /* @__PURE__ */ a(
+          Le,
           {
             type: "button",
-            $active: n === T,
-            onMouseEnter: () => m(n),
-            onMouseLeave: () => m(-1),
+            $active: n === L,
+            onMouseEnter: () => b(n),
+            onMouseLeave: () => b(-1),
             onClick: e.onActivate,
-            children: e.isCreate ? /* @__PURE__ */ c(Le, { children: e.label }) : /* @__PURE__ */ x(ce, { children: [
-              /* @__PURE__ */ x(Be, { children: [
-                re(e.icon),
-                /* @__PURE__ */ c(fe, { color: o.content.primary, children: e.label }),
-                e.authRequired && /* @__PURE__ */ c(
-                  ne,
+            children: e.isCreate ? /* @__PURE__ */ a(Pe, { children: e.label }) : /* @__PURE__ */ x(ce, { children: [
+              /* @__PURE__ */ x(Oe, { children: [
+                te(e.icon),
+                /* @__PURE__ */ a(fe, { color: o.content.primary, children: e.label }),
+                e.authRequired && /* @__PURE__ */ a(
+                  re,
                   {
                     size: 14,
                     "aria-label": "Requires customer verification"
                   }
                 )
               ] }),
-              e.rightLabel ? /* @__PURE__ */ c(Te, { children: e.rightLabel }) : e.drillsIn && /* @__PURE__ */ c(se, { width: 12, height: 12 })
+              e.rightLabel ? /* @__PURE__ */ a(Ne, { children: e.rightLabel }) : e.drillsIn && /* @__PURE__ */ a(se, { width: 12, height: 12 })
             ] })
           },
           e.id
         )) }),
-        d.some((e) => e.authRequired) && /* @__PURE__ */ x(Oe, { children: [
-          /* @__PURE__ */ c(ne, { size: 16 }),
-          /* @__PURE__ */ c(ge, { color: o.content.secondary, children: "Requires customer verification" })
+        s.some((e) => e.authRequired) && /* @__PURE__ */ x(_e, { children: [
+          /* @__PURE__ */ a(re, { size: 16 }),
+          /* @__PURE__ */ a(ge, { color: o.content.secondary, children: "Requires customer verification" })
         ] })
       ]
     }
   );
-}, Re = u.div`
+}, Ee = h.div`
 	display: flex;
 	flex-direction: column;
 	min-width: 240px;
 	/* Variables view is 45px taller: that is what the embedded picker's "Only
 	   Recommended" bar costs, so the variable list keeps the room it had before
 	   the bar was turned on (VariablePicker's calculateHeight subtracts it). */
-	${(s) => s.$fixedHeight ? "height: 346px;" : "max-height: 301px;"}
+	${(c) => c.$fixedHeight ? "height: 346px;" : "max-height: 301px;"}
 	overflow: hidden;
 	background: ${o.surface.standard};
 	border: 1px solid ${o.stroke.primary};
 	border-radius: 4px;
 	box-shadow: 0px -2px 8px 0px #0000001f;
-`, Se = u.div`
+`, Ce = h.div`
 	flex: 1 1 auto;
 	min-height: 0;
 	overflow-y: auto;
@@ -367,7 +369,7 @@ const oe = {
 	&::-webkit-scrollbar {
 		display: none;
 	}
-`, Ee = u.div`
+`, $e = h.div`
 	flex: 1 1 auto;
 	min-height: 0;
 
@@ -382,14 +384,14 @@ const oe = {
 	*::-webkit-scrollbar {
 		display: none;
 	}
-`, Ae = u.div`
+`, Be = h.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	padding: 10px 12px;
 	flex-shrink: 0;
 	border-bottom: 1px solid ${o.stroke.primary};
-`, Ce = u.input`
+`, Te = h.input`
 	flex: 1;
 	min-width: 0;
 	border: none;
@@ -402,7 +404,7 @@ const oe = {
 	&::placeholder {
 		color: ${o.content.placeholder};
 	}
-`, $e = u.button`
+`, Le = h.button`
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
@@ -417,39 +419,39 @@ const oe = {
 	flex-shrink: 0;
 	border: none;
 	border-bottom: 1px solid ${o.stroke.primary};
-	background: ${(s) => s.$active ? o.surface.subdued : "transparent"};
+	background: ${(c) => c.$active ? o.surface.subdued : "transparent"};
 	cursor: pointer;
 	text-align: left;
 
 	&:hover {
 		background: ${o.surface.hovered};
 	}
-`, Be = u.div`
+`, Oe = h.div`
 	display: flex;
 	align-items: center;
 	gap: 12px;
 	min-width: 0;
-`, Oe = u.div`
+`, _e = h.div`
 	display: flex;
 	align-items: center;
 	gap: 6px;
 	padding: 8px 12px;
 	border-top: 1px solid ${o.stroke.primary};
-`, Te = u.span`
+`, Ne = h.span`
 	flex-shrink: 0;
 	color: ${o.content.brand};
 	font-family: Inter;
 	font-size: 14px;
 	font-weight: 600;
 	white-space: nowrap;
-`, Le = u.div`
+`, Pe = h.div`
 	width: 100%;
 	text-align: center;
 	color: ${o.content.brand};
 	font-family: Inter;
 	font-size: 14px;
 	font-weight: 600;
-`, _e = u.button`
+`, qe = h.button`
 	display: flex;
 	align-items: center;
 	padding: 12px 16px;
@@ -464,13 +466,13 @@ const oe = {
 	box-sizing: border-box;
 	flex-shrink: 0;
 	gap: 4px;
-`, Pe = u.div`
+`, ze = h.div`
 	padding: 12px 10px;
 	font-family: Inter;
 	font-size: 13px;
 	color: ${o.content.secondary};
 `;
 export {
-  Ze as MentionPicker
+  nt as MentionPicker
 };
 //# sourceMappingURL=MentionPicker.js.map