@bikdotai/bik-component-library 0.0.853-beta.0 → 0.0.854

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

@@ -1,28 +1,29 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import m from "../../../assets/icons/arrow_left.svg.js";
-import { TitleRegular as p } from "../../TypographyStyle.js";
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import p from "../../../assets/icons/arrow_left.svg.js";
+import { TitleRegular as u } from "../../TypographyStyle.js";
 import { COLORS as a } from "../../../constants/Theme.js";
-import { TopBar as s, TopBarSide as n, BackButton as f, DraftButtonScope as u } from "../AgentBuilder.styled.js";
-import { Tag as g } from "../../tag/Tag.js";
-import { Button as h } from "../../button/Button.js";
-const S = ({
-  name: r,
-  status: l,
-  onBack: e,
-  onSaveDraft: d,
-  isSaving: c
+import { TopBar as f, TopBarSide as n, BackButton as g, DraftButtonScope as v } from "../AgentBuilder.styled.js";
+import { useAgentBuilderContext as h } from "../context/AgentBuilderContext.js";
+import { Tag as B } from "../../tag/Tag.js";
+import { Button as b } from "../../button/Button.js";
+const D = ({
+  name: l,
+  status: d,
+  onBack: r,
+  onSaveDraft: c,
+  isSaving: m
 }) => {
-  const i = l === "live";
-  return /* @__PURE__ */ o(s, { children: [
-    /* @__PURE__ */ o(n, { children: [
-      e && /* @__PURE__ */ t(
-        f,
+  const { validation: e } = h(), o = d === "live", s = e.about && e.trigger;
+  return /* @__PURE__ */ i(f, { children: [
+    /* @__PURE__ */ i(n, { children: [
+      r && /* @__PURE__ */ t(
+        g,
         {
           "data-test": "agent-builder-back",
-          onClick: e,
+          onClick: r,
           "aria-label": "Back",
           children: /* @__PURE__ */ t(
-            m,
+            p,
             {
               width: 24,
               height: 24,
@@ -31,31 +32,31 @@ const S = ({
           )
         }
       ),
-      /* @__PURE__ */ t(p, { color: a.content.primary, children: r || "Untitled agent" }),
+      /* @__PURE__ */ t(u, { color: a.content.primary, children: l || "Untitled agent" }),
       /* @__PURE__ */ t(
-        g,
+        B,
         {
-          tagText: i ? "Live" : "Draft",
-          type: i ? "positive" : "neutral",
+          tagText: o ? "Live" : "Draft",
+          type: o ? "positive" : "neutral",
           variant: "regular"
         }
       )
     ] }),
-    /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(u, { children: /* @__PURE__ */ t(
-      h,
+    /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(v, { children: /* @__PURE__ */ t(
+      b,
       {
         "data-test": "agent-builder-save-draft",
         buttonType: "secondary",
         size: "small",
         buttonText: "Save as draft",
-        disabled: !r.trim(),
-        isLoading: c,
-        onClick: d
+        disabled: !s,
+        isLoading: m,
+        onClick: c
       }
     ) }) })
   ] });
 };
 export {
-  S as AgentBuilderTopBar
+  D as AgentBuilderTopBar
 };
 //# sourceMappingURL=AgentBuilderTopBar.js.map

package/dist/esm/components/agent-builder/components/AgentBuilderTopBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentBuilderTopBar.js","sources":["../../../../../src/components/agent-builder/components/AgentBuilderTopBar.tsx"],"sourcesContent":["import ArrowLeftIcon from '@src/assets/icons/arrow_left.svg';\nimport React from 'react';\nimport { Button } from '@src/components/button';\nimport { Tag } from '@src/components/tag';\nimport { TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentStatus } from '../AgentBuilder.model';\nimport {\n\tBackButton,\n\tDraftButtonScope,\n\tTopBar,\n\tTopBarSide,\n} from '../AgentBuilder.styled';\n\ninterface AgentBuilderTopBarProps {\n\tname: string;\n\tstatus: AgentStatus;\n\tonBack?: () => void;\n\tonSaveDraft: () => void;\n\tisSaving?: boolean;\n}\n\nexport const AgentBuilderTopBar: React.FC<AgentBuilderTopBarProps> = ({\n\tname,\n\tstatus,\n\tonBack,\n\tonSaveDraft,\n\tisSaving,\n}) => {\n\tconst isLive = status === 'live';\n\treturn (\n\t\t<TopBar>\n\t\t\t<TopBarSide>\n\t\t\t\t{onBack && (\n\t\t\t\t\t<BackButton\n\t\t\t\t\t\tdata-test=\"agent-builder-back\"\n\t\t\t\t\t\tonClick={onBack}\n\t\t\t\t\t\taria-label=\"Back\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeftIcon\n\t\t\t\t\t\t\twidth={24}\n\t\t\t\t\t\t\theight={24}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BackButton>\n\t\t\t\t)}\n\t\t\t\t<TitleRegular color={COLORS.content.primary}>\n\t\t\t\t\t{name || 'Untitled agent'}\n\t\t\t\t</TitleRegular>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</TopBarSide>\n\n\t\t\t<TopBarSide>\n\t\t\t\t<DraftButtonScope>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-save-draft\"\n\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Save as draft\"\n\t\t\t\t\t\t// A draft still needs a name to be identifiable in the listing.\n\t\t\t\t\t\tdisabled={!name.trim()}\n\t\t\t\t\t\tisLoading={isSaving}\n\t\t\t\t\t\tonClick={onSaveDraft}\n\t\t\t\t\t/>\n\t\t\t\t</DraftButtonScope>\n\t\t\t</TopBarSide>\n\t\t</TopBar>\n\t);\n};\n"],"names":["AgentBuilderTopBar","name","status","onBack","onSaveDraft","isSaving","isLive","TopBar","jsxs","TopBarSide","jsx","BackButton","ArrowLeftIcon","COLORS","TitleRegular","Tag","DraftButtonScope","Button"],"mappings":";;;;;;;AAsBO,MAAMA,IAAwD,CAAC;AAAA,EACrE,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AACD,MAAM;AACL,QAAMC,IAASJ,MAAW;AAC1B,2BACEK,GAAA,EACA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,MAAAN,KACA,gBAAAO;AAAA,QAACC;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,SAASR;AAAA,UACT,cAAW;AAAA,UAEX,UAAA,gBAAAO;AAAA,YAACE;AAAAA,YAAA;AAAA,cACA,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,OAAOC,EAAO,QAAQ;AAAA,YAAA;AAAA,UAAA;AAAA,QACvB;AAAA,MAAA;AAAA,wBAGDC,GAAA,EAAa,OAAOD,EAAO,QAAQ,SAClC,eAAQ,kBACV;AAAA,MACA,gBAAAH;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,SAAST,IAAS,SAAS;AAAA,UAC3B,MAAMA,IAAS,aAAa;AAAA,UAC5B,SAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IACT,GACD;AAAA,IAEA,gBAAAI,EAACD,GAAA,EACA,UAAA,gBAAAC,EAACM,GAAA,EACA,UAAA,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QACA,aAAU;AAAA,QACV,YAAW;AAAA,QACX,MAAK;AAAA,QACL,YAAW;AAAA,QAEX,UAAU,CAAChB,EAAK,KAAA;AAAA,QAChB,WAAWI;AAAA,QACX,SAASD;AAAA,MAAA;AAAA,IAAA,GAEX,EAAA,CACD;AAAA,EAAA,GACD;AAEF;"}
+{"version":3,"file":"AgentBuilderTopBar.js","sources":["../../../../../src/components/agent-builder/components/AgentBuilderTopBar.tsx"],"sourcesContent":["import ArrowLeftIcon from '@src/assets/icons/arrow_left.svg';\nimport React from 'react';\nimport { Button } from '@src/components/button';\nimport { Tag } from '@src/components/tag';\nimport { TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentStatus } from '../AgentBuilder.model';\nimport {\n\tBackButton,\n\tDraftButtonScope,\n\tTopBar,\n\tTopBarSide,\n} from '../AgentBuilder.styled';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\ninterface AgentBuilderTopBarProps {\n\tname: string;\n\tstatus: AgentStatus;\n\tonBack?: () => void;\n\tonSaveDraft: () => void;\n\tisSaving?: boolean;\n}\n\nexport const AgentBuilderTopBar: React.FC<AgentBuilderTopBarProps> = ({\n\tname,\n\tstatus,\n\tonBack,\n\tonSaveDraft,\n\tisSaving,\n}) => {\n\tconst { validation } = useAgentBuilderContext();\n\tconst isLive = status === 'live';\n\t// A draft needs both a name and a trigger (topic/phrases) — without either it\n\t// isn't identifiable or runnable from the listing.\n\tconst canSaveDraft = validation.about && validation.trigger;\n\treturn (\n\t\t<TopBar>\n\t\t\t<TopBarSide>\n\t\t\t\t{onBack && (\n\t\t\t\t\t<BackButton\n\t\t\t\t\t\tdata-test=\"agent-builder-back\"\n\t\t\t\t\t\tonClick={onBack}\n\t\t\t\t\t\taria-label=\"Back\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeftIcon\n\t\t\t\t\t\t\twidth={24}\n\t\t\t\t\t\t\theight={24}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BackButton>\n\t\t\t\t)}\n\t\t\t\t<TitleRegular color={COLORS.content.primary}>\n\t\t\t\t\t{name || 'Untitled agent'}\n\t\t\t\t</TitleRegular>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</TopBarSide>\n\n\t\t\t<TopBarSide>\n\t\t\t\t<DraftButtonScope>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"agent-builder-save-draft\"\n\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Save as draft\"\n\t\t\t\t\t\tdisabled={!canSaveDraft}\n\t\t\t\t\t\tisLoading={isSaving}\n\t\t\t\t\t\tonClick={onSaveDraft}\n\t\t\t\t\t/>\n\t\t\t\t</DraftButtonScope>\n\t\t\t</TopBarSide>\n\t\t</TopBar>\n\t);\n};\n"],"names":["AgentBuilderTopBar","name","status","onBack","onSaveDraft","isSaving","validation","useAgentBuilderContext","isLive","canSaveDraft","TopBar","jsxs","TopBarSide","jsx","BackButton","ArrowLeftIcon","COLORS","TitleRegular","Tag","DraftButtonScope","Button"],"mappings":";;;;;;;;AAuBO,MAAMA,IAAwD,CAAC;AAAA,EACrE,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AACD,MAAM;AACL,QAAM,EAAE,YAAAC,EAAA,IAAeC,EAAA,GACjBC,IAASN,MAAW,QAGpBO,IAAeH,EAAW,SAASA,EAAW;AACpD,2BACEI,GAAA,EACA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,MAAAT,KACA,gBAAAU;AAAA,QAACC;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,SAASX;AAAA,UACT,cAAW;AAAA,UAEX,UAAA,gBAAAU;AAAA,YAACE;AAAAA,YAAA;AAAA,cACA,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,OAAOC,EAAO,QAAQ;AAAA,YAAA;AAAA,UAAA;AAAA,QACvB;AAAA,MAAA;AAAA,wBAGDC,GAAA,EAAa,OAAOD,EAAO,QAAQ,SAClC,eAAQ,kBACV;AAAA,MACA,gBAAAH;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,SAASV,IAAS,SAAS;AAAA,UAC3B,MAAMA,IAAS,aAAa;AAAA,UAC5B,SAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IACT,GACD;AAAA,IAEA,gBAAAK,EAACD,GAAA,EACA,UAAA,gBAAAC,EAACM,GAAA,EACA,UAAA,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QACA,aAAU;AAAA,QACV,YAAW;AAAA,QACX,MAAK;AAAA,QACL,YAAW;AAAA,QACX,UAAU,CAACX;AAAA,QACX,WAAWJ;AAAA,QACX,SAASD;AAAA,MAAA;AAAA,IAAA,GAEX,EAAA,CACD;AAAA,EAAA,GACD;AAEF;"}

package/dist/esm/components/agent-builder/components/ConfigToolPanel.d.ts

@@ -1,5 +1,4 @@
 import { default as React } from 'react';
-import { VariableListInterfaceV3 } from '../../variable-picker-v3/model';
 import { ConfigToolConfig, ConfigToolKey, ParamsBlob } from '../AgentBuilder.model';
 import { AgentCharLimits } from '../constants/charLimits';
 interface ConfigToolPanelProps {
@@ -19,13 +18,6 @@ interface ConfigToolPanelProps {
     /** Optional "Improve with AI" for multiline fields. Omit to hide it. */
     onImprove?: (text: string) => Promise<string>;
     charLimits?: AgentCharLimits;
-    /**
-     * Variable catalog for the `@` trigger. When non-empty, `@` in the email
-     * tool's Subject / Send To / Reply To / CC opens the variable picker
-     * directly, and Message Instructions upgrades to the variables-only mention
-     * editor. Absent → the drawer behaves exactly as before.
-     */
-    variablesData?: VariableListInterfaceV3[];
     /** SideModal stacking order — raise it when opened over another drawer. */
     zIndex?: number;
 }

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

@@ -1,19 +1,18 @@
-import { jsx as r, jsxs as I } from "react/jsx-runtime";
-import L from "../../../assets/icons/cross.svg.js";
-import j, { useState as R, useRef as T } from "react";
-import w from "styled-components";
-import { TitleSmall as O, BodyCaption as F } from "../../TypographyStyle.js";
-import { COLORS as u } from "../../../constants/Theme.js";
-import { FieldBlock as P } from "../AgentBuilder.styled.js";
-import { AGENT_CHAR_LIMITS as Y } from "../constants/charLimits.js";
-import { DRAWER_BODY_STYLE as V, DRAWER_HEADER_STYLE as z, DrawerHeaderText as M } from "./DrawerHeaderText.js";
-import { ToolInstructionsField as H } from "./ToolInstructionsField.js";
-import { VariableTriggerArea as A } from "./VariableTriggerArea.js";
-import { SideModal as W } from "../../side-modal/SideModal.js";
-import { Switch as q } from "../../switch/Switch.js";
-import { Input as G } from "../../input/Input.js";
-import { Tag as N } from "../../tag/Tag.js";
-const J = {
+import { jsx as r, jsxs as k } from "react/jsx-runtime";
+import $ from "../../../assets/icons/cross.svg.js";
+import { useState as w } from "react";
+import u from "styled-components";
+import { TitleSmall as C, BodyCaption as E } from "../../TypographyStyle.js";
+import { COLORS as i } from "../../../constants/Theme.js";
+import { FieldBlock as D } from "../AgentBuilder.styled.js";
+import { AGENT_CHAR_LIMITS as O } from "../constants/charLimits.js";
+import { DRAWER_BODY_STYLE as R, DRAWER_HEADER_STYLE as L, DrawerHeaderText as A } from "./DrawerHeaderText.js";
+import { ToolInstructionsField as j } from "./ToolInstructionsField.js";
+import { SideModal as P } from "../../side-modal/SideModal.js";
+import { Switch as Y } from "../../switch/Switch.js";
+import { Input as F } from "../../input/Input.js";
+import { Tag as z } from "../../tag/Tag.js";
+const V = {
   send_email: {
     title: "Send email",
     subtitle: "Notify someone by email when this agent can't continue. You pick the recipient, the AI drafts the message."
@@ -22,267 +21,222 @@ const J = {
     title: "Send Slack message",
     subtitle: "Post a message to a Slack channel. You pick the channel, the AI composes the message from the conversation."
   }
-}, K = ({
+}, H = ({
   chips: n,
-  onChange: s,
-  placeholder: h,
-  nativeID: y,
-  hint: C,
-  variablesData: E
+  onChange: a,
+  placeholder: c,
+  nativeID: p,
+  hint: d
 }) => {
-  const [i, g] = R(""), [$, a] = R(!1), v = T(null), S = T(null), x = () => {
-    const t = i.split(",").map((c) => c.trim()).filter(Boolean);
-    t.length && s([...n, ...t.filter((c) => !n.includes(c))]), g("");
-  }, f = T(x);
-  f.current = x;
-  const b = T(!1), l = T(!1);
-  return /* @__PURE__ */ I(X, { ref: v, children: [
+  const [m, h] = w(""), y = () => {
+    const e = m.split(",").map((s) => s.trim()).filter(Boolean);
+    e.length && a([...n, ...e.filter((s) => !n.includes(s))]), h("");
+  };
+  return /* @__PURE__ */ k(G, { children: [
     /* @__PURE__ */ r(
-      A,
+      N,
       {
-        addDataButton: !0,
-        variablesData: E,
-        onOpenChange: (t) => {
-          b.current = t, !t && setTimeout(() => {
-            !l.current && !v.current?.contains(document.activeElement) && f.current(), l.current = !1;
-          }, 0);
-        },
-        onInsert: (t, c) => {
-          l.current = !0;
-          const k = c ?? i.length;
-          g(`${i.slice(0, k)}${t}${i.slice(k)}`), requestAnimationFrame(() => {
-            const p = S.current;
-            p?.focus(), p?.setSelectionRange(k + t.length, k + t.length);
-          });
-        },
-        children: /* @__PURE__ */ r(
-          Z,
-          {
-            id: y,
-            ref: S,
-            type: "text",
-            placeholder: $ && i === "" && (E?.length ?? 0) > 0 ? "Enter text, type @ to add variable" : h,
-            value: i,
-            onChange: (t) => g(t.target.value),
-            onFocus: () => a(!0),
-            onBlur: () => {
-              a(!1), setTimeout(() => {
-                !b.current && !v.current?.contains(document.activeElement) && f.current();
-              }, 0);
-            },
-            onKeyDown: (t) => {
-              t.key === "Enter" || t.key === "," ? (t.preventDefault(), x()) : t.key === "Backspace" && i === "" && n.length > 0 && s(n.slice(0, -1));
-            }
-          }
-        )
+        id: p,
+        type: "text",
+        placeholder: c,
+        value: m,
+        onChange: (e) => h(e.target.value),
+        onBlur: y,
+        onKeyDown: (e) => {
+          e.key === "Enter" || e.key === "," ? (e.preventDefault(), y()) : e.key === "Backspace" && m === "" && n.length > 0 && a(n.slice(0, -1));
+        }
       }
     ),
-    C,
-    n.length > 0 && /* @__PURE__ */ r(ee, { children: n.map((t, c) => /* @__PURE__ */ r(
-      N,
+    d,
+    n.length > 0 && /* @__PURE__ */ r(q, { children: n.map((e, s) => /* @__PURE__ */ r(
+      z,
       {
-        tagText: t.replace(/\{\{variable:([^}]+)\}\}/g, "{{$1}}"),
+        tagText: e,
         theme: "light",
         type: "neutral",
         variant: "regular",
-        TrailingIcon: L,
-        onTrailingIconClicked: () => s(n.filter((k, p) => p !== c))
+        TrailingIcon: $,
+        onTrailingIconClicked: () => a(n.filter((x, g) => g !== s))
       },
-      `${t}-${c}`
+      `${e}-${s}`
     )) })
   ] });
-}, Q = (n, s) => {
-  const h = {};
-  return Object.keys(n).forEach((y) => {
-    h[y] = s?.params[y]?.value ?? n[y].value;
-  }), h;
-}, U = (n) => String(n ?? "").split(",").map((s) => s.trim()).filter(Boolean), ke = ({
+}, M = (n, a) => {
+  const c = {};
+  return Object.keys(n).forEach((p) => {
+    c[p] = a?.params[p]?.value ?? n[p].value;
+  }), c;
+}, W = (n) => String(n ?? "").split(",").map((a) => a.trim()).filter(Boolean), pt = ({
   toolKey: n,
-  template: s,
-  onClose: h,
-  onSave: y,
-  initial: C,
-  onImprove: E,
-  charLimits: i = Y,
-  variablesData: g,
-  zIndex: $
+  template: a,
+  onClose: c,
+  onSave: p,
+  initial: d,
+  onImprove: m,
+  charLimits: h = O,
+  zIndex: y
 }) => {
-  const [a, v] = R(
-    () => Q(s, C)
-  ), [S, x] = R(!1), f = Object.values(s), b = n === "send_email", l = (e, m) => v((d) => ({ ...d, [e]: m })), t = f.every((e) => !(e.required && String(a[e.key] ?? "").trim() === "" || e.component === "MultilineInput" && String(a[e.key] ?? "").length > i.instructions)), c = async () => {
-    if (!t || S)
+  const [e, s] = w(
+    () => M(a, d)
+  ), [x, g] = w(!1), v = Object.values(a), B = n === "send_email", f = (t, l) => s((o) => ({ ...o, [t]: l })), T = v.every(
+    (t) => !t.required || String(e[t.key] ?? "").trim() !== ""
+  ), I = async () => {
+    if (!T || x)
       return;
-    const e = {};
-    f.forEach((o) => {
-      e[o.key] = { ...o, value: a[o.key] };
+    const t = {};
+    v.forEach((S) => {
+      t[S.key] = { ...S, value: e[S.key] };
     });
-    const m = {
-      id: C?.id ?? `${n}_${Date.now().toString(36)}`,
+    const l = {
+      id: d?.id ?? `${n}_${Date.now().toString(36)}`,
       tool_key: n,
-      params: e
-    }, d = y(m);
-    if (d && typeof d.then == "function") {
-      x(!0);
+      params: t
+    }, o = p(l);
+    if (o && typeof o.then == "function") {
+      g(!0);
       try {
-        await d;
+        await o;
       } finally {
-        x(!1);
+        g(!1);
       }
     }
-  }, k = (e) => {
-    const m = `config-tool-${e.key.toLowerCase()}`;
-    switch (e.component) {
+  }, _ = (t) => {
+    const l = `config-tool-${t.key.toLowerCase()}`;
+    switch (t.component) {
       // Multi-value email chips — only for the email tool. Slack's KeywordInput
       // (channelId) falls through to the plain input below.
       case "KeywordInput":
-        if (!b)
+        if (!B)
           break;
-        return /* @__PURE__ */ I(P, { children: [
-          /* @__PURE__ */ r(O, { color: u.content.primary, children: e.title }),
+        return /* @__PURE__ */ k(D, { children: [
+          /* @__PURE__ */ r(C, { color: i.content.primary, children: t.title }),
           /* @__PURE__ */ r(
-            K,
+            H,
             {
-              nativeID: m,
-              placeholder: e.hint ?? "",
-              chips: U(a[e.key]),
-              onChange: (o) => l(e.key, o.join(",")),
-              variablesData: g,
-              hint: /* @__PURE__ */ r(F, { color: u.content.secondary, children: "Press Enter or comma to add multiple emails" })
+              nativeID: l,
+              placeholder: t.hint ?? "",
+              chips: W(e[t.key]),
+              onChange: (o) => f(t.key, o.join(",")),
+              hint: /* @__PURE__ */ r(E, { color: i.content.secondary, children: "Press Enter or comma to add multiple emails" })
             }
           )
-        ] }, e.key);
+        ] }, t.key);
       case "MultilineInput":
         return /* @__PURE__ */ r(
-          H,
+          j,
           {
-            "data-test": m,
-            label: e.title,
-            value: String(a[e.key] ?? ""),
-            onChange: (o) => l(e.key, o),
-            maxLength: i.instructions,
-            placeholder: e.hint ?? "",
-            onImprove: E,
-            variablesData: g
+            "data-test": l,
+            label: t.title,
+            value: String(e[t.key] ?? ""),
+            onChange: (o) => f(t.key, o),
+            maxLength: h.instructions,
+            placeholder: t.hint ?? "",
+            onImprove: m
           },
-          e.key
+          t.key
         );
       case "Switch":
-        return /* @__PURE__ */ I(te, { children: [
-          /* @__PURE__ */ I(ne, { children: [
-            /* @__PURE__ */ r(O, { color: u.content.primary, children: e.title }),
-            e.hint && /* @__PURE__ */ r(F, { color: u.content.secondary, children: e.hint })
+        return /* @__PURE__ */ k(J, { children: [
+          /* @__PURE__ */ k(K, { children: [
+            /* @__PURE__ */ r(C, { color: i.content.primary, children: t.title }),
+            t.hint && /* @__PURE__ */ r(E, { color: i.content.secondary, children: t.hint })
           ] }),
           /* @__PURE__ */ r(
-            q,
+            Y,
             {
-              "data-test": m,
-              value: !!a[e.key],
-              onValueChange: async (o) => l(e.key, o)
+              "data-test": l,
+              value: !!e[t.key],
+              onValueChange: async (o) => f(t.key, o)
             }
           )
-        ] }, e.key);
+        ] }, t.key);
     }
-    const d = /* @__PURE__ */ r(
-      G,
+    return /* @__PURE__ */ r(
+      F,
       {
-        "data-test": m,
+        "data-test": l,
         variant: "small",
-        labelText: e.title,
+        labelText: t.title,
         labelTextBold: !0,
-        placeholder: e.hint ?? "",
-        value: String(a[e.key] ?? ""),
-        onChangeText: (o) => l(e.key, o)
-      }
-    );
-    return b ? /* @__PURE__ */ r(
-      A,
-      {
-        addDataButton: !0,
-        variablesData: g,
-        onInsert: (o, D) => {
-          const B = String(a[e.key] ?? ""), _ = D ?? B.length;
-          l(
-            e.key,
-            `${B.slice(0, _)}${o}${B.slice(_)}`
-          );
-        },
-        children: d
+        placeholder: t.hint ?? "",
+        value: String(e[t.key] ?? ""),
+        onChangeText: (o) => f(t.key, o)
       },
-      e.key
-    ) : /* @__PURE__ */ r(j.Fragment, { children: d }, e.key);
-  }, p = J[n];
+      t.key
+    );
+  }, b = V[n];
   return /* @__PURE__ */ r(
-    W,
+    P,
     {
-      header: p.title,
+      header: b.title,
       closeOnEscapeKey: !1,
-      zIndex: $,
-      headerCustomComponent: /* @__PURE__ */ r(M, { title: p.title, subtitle: p.subtitle }),
+      zIndex: y,
+      headerCustomComponent: /* @__PURE__ */ r(A, { title: b.title, subtitle: b.subtitle }),
       hideCrossButton: !1,
       width: "431px",
-      headerStyle: z,
-      bodyStyle: V,
-      onClose: h,
+      headerStyle: L,
+      bodyStyle: R,
+      onClose: c,
       saveButtonProps: {
         "data-test": "config-tool-save",
         buttonText: "Save",
         buttonType: "primary",
         size: "small",
-        disabled: !t,
-        isLoading: S,
-        onClick: c
+        disabled: !T,
+        isLoading: x,
+        onClick: I
       },
       cancelButtonProps: {
         "data-test": "config-tool-cancel",
         buttonText: "Cancel",
         buttonType: "tertiaryGray",
         size: "small",
-        onClick: h
+        onClick: c
       },
-      children: f.map(k)
+      children: v.map(_)
     }
   );
-}, X = w.div`
+}, G = u.div`
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`, Z = w.input`
+`, N = u.input`
 	width: 100%;
 	min-width: 0;
 	box-sizing: border-box;
 	height: 32px;
 	padding: 0 8px;
-	border: 1px solid ${u.stroke.primary};
+	border: 1px solid ${i.stroke.primary};
 	border-radius: 4px;
 	font-family: 'Inter', sans-serif;
 	font-size: 14px;
-	color: ${u.content.primary};
-	background: ${u.surface.standard};
+	color: ${i.content.primary};
+	background: ${i.surface.standard};
 	outline: none;
 
 	&::placeholder {
-		color: ${u.content.secondary};
+		color: ${i.content.secondary};
 	}
 
 	&:focus {
-		border-color: ${u.stroke.brand};
+		border-color: ${i.stroke.brand};
 	}
-`, ee = w.div`
+`, q = u.div`
 	display: flex;
 	flex-wrap: wrap;
 	gap: 6px;
-`, te = w.div`
+`, J = u.div`
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
 	gap: 12px;
-`, ne = w.div`
+`, K = u.div`
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 	min-width: 0;
 `;
 export {
-  ke as ConfigToolPanel
+  pt as ConfigToolPanel
 };
 //# sourceMappingURL=ConfigToolPanel.js.map