@ethisyscore/plugin-ui 1.93.0 → 1.95.0

package/dist/components/connectors/index.cjs

@@ -8,6 +8,94 @@ var react = require('react');
 function Dialog(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(material.Dialog, { disableScrollLock: true, disableRestoreFocus: true, ...props });
 }
+function NiArchive({
+  className,
+  variant = "outlined",
+  size = "medium",
+  oneTone = false
+}) {
+  const iconSize = sizeHelper(size);
+  const iconStrokeWidth = strokeSizeHelper(iconSize);
+  if (variant === "outlined") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        className,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M22 7V5.71496C22 4.17371 20.8321 2.88321 19.2985 2.72985L17.9702 2.59702C14 2.2 10 2.2 6.02978 2.59702L4.70149 2.72985C3.16788 2.88321 2 4.17371 2 5.71496V7C2 8.10457 2.89543 9 4 9H20C21.1046 9 22 8.10457 22 7Z",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M4.53333 9.5L4.4768 9.74619C3.83435 12.544 3.8494 15.4543 4.51997 18.2455V18.2455C4.85389 19.6354 5.95655 20.7108 7.35451 21.009V21.009C10.4171 21.6623 13.5829 21.6623 16.6455 21.009V21.009C18.0434 20.7108 19.1461 19.6354 19.48 18.2455V18.2455C20.1506 15.4543 20.1657 12.544 19.5232 9.74618L19.4667 9.5",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.6,
+              d: "M14.0945 13.9189C14.3504 13.9701 14.5682 14.1365 14.6849 14.3698V14.3698C14.8833 14.7665 14.8833 15.2335 14.6849 15.6302V15.6302C14.5682 15.8635 14.3504 16.0299 14.0945 16.0811L13.8853 16.1229C12.6408 16.3718 11.3592 16.3718 10.1147 16.1229L9.90546 16.0811C9.64963 16.0299 9.43176 15.8635 9.31508 15.6302V15.6302C9.11673 15.2335 9.11673 14.7665 9.31508 14.3698V14.3698C9.43176 14.1365 9.64963 13.9701 9.90546 13.9189L10.1147 13.8771C11.3592 13.6282 12.6408 13.6282 13.8853 13.8771L14.0945 13.9189Z",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth
+            }
+          )
+        ]
+      }
+    );
+  } else {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        className,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M5.95508 1.85031C9.9749 1.44833 14.0251 1.44833 18.0449 1.85031L19.373 1.98312C21.2897 2.17479 22.7495 3.78844 22.75 5.71457V6.99972C22.75 7.86931 22.345 8.64326 21.7148 9.14719C21.1107 7.71812 19.7022 6.75088 18.1025 6.7507H5.89746C4.29778 6.75078 2.8884 7.71735 2.28418 9.14621C1.65469 8.64226 1.25 7.86881 1.25 6.99972V5.71457C1.2505 3.78844 2.71028 2.17479 4.62695 1.98312L5.95508 1.85031Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M18.1028 8.25C19.2525 8.25003 20.2447 9.05777 20.4778 10.1836C20.9988 12.7045 20.957 15.3105 20.3557 17.8135L20.2092 18.4219C19.8078 20.0924 18.4823 21.3837 16.802 21.7422C13.6364 22.4174 10.3641 22.4174 7.19849 21.7422C5.51812 21.3837 4.19273 20.0925 3.79126 18.4219L3.64478 17.8135C3.04349 15.3105 3.00171 12.7045 3.52271 10.1836C3.75577 9.05776 4.74793 8.25 5.89771 8.25H18.1028ZM14.0334 13.1406C12.6922 12.8724 11.3103 12.8725 9.96899 13.1406L9.75903 13.1826C9.27649 13.2792 8.86496 13.5931 8.64477 14.0332C8.34086 14.641 8.34086 15.357 8.64477 15.9648C8.86494 16.405 9.27646 16.7188 9.75903 16.8154L9.96899 16.8574C11.3103 17.1255 12.6922 17.1257 14.0334 16.8574L14.2424 16.8154C14.7249 16.7187 15.1366 16.4049 15.3567 15.9648C15.6604 15.3571 15.6604 14.6409 15.3567 14.0332C15.1366 13.5931 14.7249 13.2793 14.2424 13.1826L14.0334 13.1406Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 0 : 0.4,
+              d: "M9.96866 13.1406C11.3101 12.8724 12.6917 12.8723 14.0331 13.1406L14.2421 13.1826C14.7247 13.2792 15.1362 13.593 15.3563 14.0332C15.6602 14.641 15.6602 15.357 15.3563 15.9648C15.1362 16.405 14.7247 16.7188 14.2421 16.8154L14.0331 16.8574C12.6917 17.1257 11.3101 17.1256 9.96866 16.8574L9.7587 16.8154C9.27607 16.7188 8.86459 16.4051 8.64444 15.9648C8.34052 15.357 8.34052 14.641 8.64444 14.0332C8.86461 13.593 9.27611 13.2792 9.7587 13.1826L9.96866 13.1406Z",
+              fill: "currentColor"
+            }
+          )
+        ]
+      }
+    );
+  }
+}
 function NiBinEmpty({ className, variant = "outlined", size = "medium" }) {
   const iconSize = sizeHelper(size);
   const iconStrokeWidth = strokeSizeHelper(iconSize);
@@ -220,6 +308,94 @@ function NiChevronUpSmall({ className, variant = "outlined", size = "medium" })
     );
   }
 }
+function NiCode({
+  className,
+  variant = "outlined",
+  size = "medium",
+  oneTone = false
+}) {
+  const iconSize = sizeHelper(size);
+  const iconStrokeWidth = strokeSizeHelper(iconSize);
+  if (variant === "outlined") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        className,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M17 6L21.5858 10.5858C22.3668 11.3668 22.3668 12.6332 21.5858 13.4142L17 18",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M7 6L2.41421 10.5858C1.63317 11.3668 1.63316 12.6332 2.41421 13.4142L7 18",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.6,
+              d: "M9.81053 20.2205L14.2104 3.7998",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          )
+        ]
+      }
+    );
+  } else {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        className,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M16.4697 5.46967C16.7626 5.17678 17.2373 5.17678 17.5302 5.46967L22.1162 10.0556C23.1899 11.1295 23.1899 12.8704 22.1162 13.9443L17.5302 18.5302C17.2373 18.8231 16.7626 18.8231 16.4697 18.5302C16.1768 18.2373 16.1768 17.7626 16.4697 17.4697L21.0556 12.8837C21.5436 12.3956 21.5436 11.6043 21.0556 11.1162L16.4697 6.53022C16.1768 6.23732 16.1768 5.76256 16.4697 5.46967Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M7.53033 5.46967C7.23744 5.17678 6.76268 5.17678 6.46978 5.46967L1.88385 10.0556C0.810106 11.1295 0.810105 12.8704 1.88385 13.9443L6.46978 18.5302C6.76268 18.8231 7.23744 18.8231 7.53033 18.5302C7.82322 18.2373 7.82322 17.7626 7.53033 17.4697L2.94439 12.8837C2.45644 12.3956 2.45644 11.6043 2.94439 11.1162L7.53033 6.53022C7.82322 6.23732 7.82322 5.76256 7.53033 5.46967Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.4,
+              d: "M10.5349 20.4147C10.4277 20.8148 10.0164 21.0523 9.61631 20.945C9.21621 20.8378 8.97877 20.4266 9.08598 20.0265L13.4859 3.60575C13.5931 3.20565 14.0044 2.96821 14.4045 3.07542C14.8046 3.18262 15.042 3.59388 14.9348 3.99398L10.5349 20.4147Z",
+              fill: "currentColor"
+            }
+          )
+        ]
+      }
+    );
+  }
+}
 function NiCross({ className, variant = "outlined", size = "medium" }) {
   const iconSize = sizeHelper(size);
   const iconStrokeWidth = strokeSizeHelper(iconSize);
@@ -401,6 +577,112 @@ function NiPlus({ className, variant = "outlined", size = "medium" }) {
     );
   }
 }
+function NiRefresh({
+  className,
+  variant = "outlined",
+  size = "medium",
+  oneTone = false
+}) {
+  const iconSize = sizeHelper(size);
+  const iconStrokeWidth = strokeSizeHelper(iconSize);
+  if (variant === "outlined") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        viewBox: "0 0 24 24",
+        className,
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.6,
+              d: "M4.24658 5.68421C6.08028 3.4358 8.87252 2 12.0001 2C17.5229 2 22.0001 6.47715 22.0001 12C22.0001 12.6849 21.9312 13.3538 21.8001 14",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M4 2L4 4.99995C4 5.55223 4.44771 5.99995 4.99998 5.99995L8 6",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.6,
+              d: "M19.7534 18.3158C17.9197 20.5642 15.1275 22 11.9999 22C6.47705 22 1.9999 17.5228 1.9999 12C1.9999 11.3151 2.06876 10.6462 2.19994 10",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M20 22L20 19C20 18.4478 19.5523 18.0001 19 18L16 18",
+              stroke: "currentColor",
+              strokeWidth: iconStrokeWidth,
+              strokeLinecap: "round"
+            }
+          )
+        ]
+      }
+    );
+  } else {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "svg",
+      {
+        width: iconSize,
+        height: iconSize,
+        className,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.4,
+              d: "M21.2503 12C21.2503 6.8915 17.1087 2.75021 12.0003 2.75C9.10755 2.75 6.5248 4.07694 4.82741 6.1582C4.5657 6.47903 4.09369 6.5271 3.77272 6.26562C3.45173 6.00383 3.40351 5.53096 3.6653 5.20996C5.63532 2.79453 8.63792 1.25 12.0003 1.25C17.9371 1.25021 22.7503 6.06307 22.7503 12C22.7503 12.7353 22.6755 13.4544 22.5344 14.1494C22.4519 14.5552 22.0565 14.8177 21.6507 14.7354C21.2447 14.653 20.9823 14.2565 21.0647 13.8506C21.186 13.2533 21.2503 12.6345 21.2503 12Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M4 1.25011C3.58579 1.25011 3.25008 1.58582 3.25008 2.00003L3.25008 4.99971C3.25008 5.96617 4.03344 6.74947 4.99989 6.74953L8.00026 6.75022C8.41427 6.75008 8.75004 6.4143 8.75018 6.0003C8.75019 5.58617 8.41436 5.25052 8.00026 5.25038L4.99989 5.24969C4.86187 5.24963 4.74992 5.13775 4.74992 4.99971L4.74992 2.00003C4.74992 1.58582 4.41421 1.25011 4 1.25011Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              opacity: oneTone ? 1 : 0.4,
+              d: "M2.74974 12C2.74974 17.1085 6.89128 21.2498 11.9997 21.25C14.8925 21.25 17.4752 19.9231 19.1726 17.8418C19.4343 17.521 19.9063 17.4729 20.2273 17.7344C20.5483 17.9962 20.5965 18.469 20.3347 18.79C18.3647 21.2055 15.3621 22.75 11.9997 22.75C6.06285 22.7498 1.24974 17.9369 1.24974 12C1.24974 11.2647 1.32447 10.5456 1.46556 9.85059C1.54808 9.44484 1.94354 9.18232 2.34935 9.26465C2.75528 9.34705 3.01768 9.74348 2.93528 10.1494C2.81404 10.7467 2.74974 11.3655 2.74974 12Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: "M20 22.7499C20.4142 22.7499 20.7499 22.4142 20.7499 22L20.7499 19.0003C20.7499 18.0338 19.9666 17.2505 19.0001 17.2505L15.9997 17.2498C15.5857 17.2499 15.25 17.5857 15.2498 17.9997C15.2498 18.4138 15.5856 18.7495 15.9997 18.7496L19.0001 18.7503C19.1381 18.7504 19.2501 18.8623 19.2501 19.0003L19.2501 22C19.2501 22.4142 19.5858 22.7499 20 22.7499Z",
+              fill: "currentColor"
+            }
+          )
+        ]
+      }
+    );
+  }
+}
 function NiSearch({
   className,
   variant = "outlined",
@@ -848,17 +1130,27 @@ function selectMappingReadiness(operations) {
     isReady: required.length > 0 && complete === required.length
   };
 }
+
+// src/components/connectors/providerLabels.ts
+var PROVIDER_CONTROL_LABEL = "Served by";
+var PROVIDER_OPTION_LABEL = {
+  plugin: "This organisation's apps",
+  connector: "External system"
+};
+var PLUGIN_PROVIDER_CONTROL_LABEL = "App";
+var CONNECTOR_CONTROL_LABEL = "Connector";
 function MappingCompletenessBanner({
   operations,
   onSuggestWithAi,
   onOpenMappingEditor,
   onConfigureTranslation,
   suggestingOperationKey = null,
-  disableSuggest = false
+  disableSuggest = false,
+  isProviderUnconfigured = false
 }) {
   const required = selectRequiredIncompleteOperations(operations);
   const optional = selectOptionalIncompleteOperations(operations);
-  if (required.length === 0 && optional.length === 0) {
+  if (!isProviderUnconfigured && required.length === 0 && optional.length === 0) {
     return null;
   }
   const renderRow = (op) => {
@@ -913,6 +1205,26 @@ function MappingCompletenessBanner({
     ) }, op.operationKey);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { mb: 2 }, children: [
+    isProviderUnconfigured && /* @__PURE__ */ jsxRuntime.jsxs(
+      material.Alert,
+      {
+        severity: "warning",
+        sx: { mb: required.length > 0 || optional.length > 0 ? 2 : 0 },
+        "data-testid": "provider-unconfigured-alert",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(material.AlertTitle, { children: "Nothing serves this module yet" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(material.Typography, { variant: "body2", children: [
+            'No provider has been chosen, so every operation below resolves as unmapped no matter what is mapped against it. Set one with the "',
+            PROVIDER_CONTROL_LABEL,
+            '" control at the top of this page: choose "',
+            PROVIDER_OPTION_LABEL.plugin,
+            '" to have another app this organisation already runs answer these operations, or "',
+            PROVIDER_OPTION_LABEL.connector,
+            '" to route them through a connector to a third-party system. The choice is per module and can be changed later.'
+          ] })
+        ]
+      }
+    ),
     required.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(material.Alert, { severity: "warning", sx: { mb: optional.length > 0 ? 2 : 0 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(material.AlertTitle, { children: "Required operations are missing request-field mappings" }),
       /* @__PURE__ */ jsxRuntime.jsxs(material.Typography, { variant: "body2", children: [
@@ -942,6 +1254,335 @@ function MappingCompletenessBanner({
     ] })
   ] });
 }
+function EmptyState({
+  icon = /* @__PURE__ */ jsxRuntime.jsx(NiArchive, { className: "text-text-disabled", size: "large" }),
+  title = "No items yet",
+  description = "Create your first item to get started",
+  fill = false
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: `flex flex-col items-center justify-center py-12 text-center ${fill ? "flex-1" : ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(material.Box, { className: "mb-3", children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", className: "text-text-secondary", children: title }),
+    description ? /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", className: "text-text-disabled mt-1", children: description }) : null
+  ] });
+}
+var SOURCE = {
+  keyword: "keyword",
+  ai: "ai",
+  manual: "manual"
+};
+var SOURCE_COLOURS = {
+  [SOURCE.keyword]: "info",
+  [SOURCE.ai]: "secondary",
+  [SOURCE.manual]: "success"
+};
+var CONFLICT_REASON = {
+  AnotherAutoMatchInProgress: "another_auto_match_in_progress"
+};
+function renderSourceChip(item) {
+  if (!item.mappedToolName || !item.source) {
+    return /* @__PURE__ */ jsxRuntime.jsx(material.Chip, { label: "\u2014", size: "small", color: "default", variant: "outlined" });
+  }
+  let label;
+  if (item.source === SOURCE.manual) {
+    label = "manual";
+  } else if (item.source === SOURCE.keyword) {
+    label = "auto (keyword)";
+  } else {
+    const pct = Math.round((item.confidence ?? 0) * 100);
+    label = `auto (AI, ${pct}%)`;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(material.Chip, { label, size: "small", color: SOURCE_COLOURS[item.source], variant: "outlined" });
+}
+function renderBanner(banner, onDismiss) {
+  const dismissButton = /* @__PURE__ */ jsxRuntime.jsx(
+    material.IconButton,
+    {
+      "aria-label": "Dismiss",
+      size: "small",
+      onClick: onDismiss,
+      "data-testid": "dismiss-banner",
+      children: /* @__PURE__ */ jsxRuntime.jsx(NiCross, { size: "small" })
+    }
+  );
+  if (banner.conflictReason === CONFLICT_REASON.AnotherAutoMatchInProgress) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(material.Alert, { severity: "warning", className: "mb-2", action: dismissButton, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.AlertTitle, { children: "Auto-match already running" }),
+      "Another user is currently running auto-match. Please refresh the page in a few seconds."
+    ] });
+  }
+  if (banner.unmatchedRequiredCount > 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(material.Alert, { severity: "warning", className: "mb-2", action: dismissButton, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.AlertTitle, { children: "Some required operations are unmapped" }),
+      banner.aiAvailable ? `AI matched ${banner.matchedByAi}, keywords matched ${banner.matchedByKeyword}.` : `Keywords matched ${banner.matchedByKeyword}.`,
+      " ",
+      banner.unmatchedRequiredCount,
+      " required operation",
+      banner.unmatchedRequiredCount === 1 ? "" : "s",
+      " still need",
+      banner.unmatchedRequiredCount === 1 ? "s" : "",
+      " a mapping."
+    ] });
+  }
+  return null;
+}
+function renderNoProviderEmptyState(kind, moduleLabel) {
+  const icon = /* @__PURE__ */ jsxRuntime.jsx(NiCode, { className: "text-text-disabled", size: "large" });
+  const module = moduleLabel.toLowerCase();
+  if (kind === void 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      EmptyState,
+      {
+        icon,
+        title: `Choose what serves ${module}`,
+        description: `Use "${PROVIDER_CONTROL_LABEL}" above: "${PROVIDER_OPTION_LABEL.plugin}" to have another app you already run answer these operations, or "${PROVIDER_OPTION_LABEL.connector}" to route them through a connector. Nothing resolves until one is chosen.`
+      }
+    );
+  }
+  if (kind === "plugin") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      EmptyState,
+      {
+        icon,
+        title: "Select an app",
+        description: `Choose the app under "${PLUGIN_PROVIDER_CONTROL_LABEL}" above to view and configure which of its tools answer each ${module} operation`
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    EmptyState,
+    {
+      icon,
+      title: "Select a connector",
+      description: `Choose a connector to view and configure its ${module} tool mappings`
+    }
+  );
+}
+function ConnectorMappingView({
+  isLoading,
+  moduleLabel,
+  breadcrumbs,
+  loadingFallback,
+  connectors,
+  selectedConnectorId,
+  onConnectorChange,
+  providerKind,
+  onProviderKindChange,
+  pluginProviders = [],
+  selectedPluginExtensionId = "",
+  onPluginProviderChange,
+  mappings,
+  availableTools,
+  onUpdateMapping,
+  onAutoMatch,
+  isUpdating,
+  isAutoMatching,
+  bannerState,
+  onDismissBanner,
+  onEditTranslation,
+  withHeader = true
+}) {
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingFallback ?? /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: "flex flex-col gap-4", "data-testid": "connector-mapping-skeleton", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { variant: "rounded", height: 56 }),
+      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { variant: "rounded", height: 240 })
+    ] }) });
+  }
+  const disableInputs = isUpdating || isAutoMatching;
+  const banner = bannerState ? renderBanner(bannerState, onDismissBanner) : null;
+  const providerPickerEnabled = !!onProviderKindChange;
+  const effectiveKind = providerPickerEnabled ? providerKind : "connector";
+  const isPluginMode = effectiveKind === "plugin";
+  const hasProvider = isPluginMode ? !!selectedPluginExtensionId : !!selectedConnectorId;
+  const showAutoMatch = !isPluginMode && !!selectedConnectorId;
+  return /* @__PURE__ */ jsxRuntime.jsxs(material.Grid, { container: true, spacing: 5, children: [
+    (withHeader || showAutoMatch) && /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      material.Box,
+      {
+        className: `flex flex-row items-start ${withHeader ? "justify-between" : "justify-end"}`,
+        children: [
+          withHeader && /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(material.Typography, { variant: "h1", component: "h1", className: "mb-0", children: [
+              moduleLabel,
+              " Mappings"
+            ] }),
+            breadcrumbs
+          ] }),
+          showAutoMatch && /* @__PURE__ */ jsxRuntime.jsx(material.Box, { className: "flex flex-row items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title: "Re-run Auto-Match", children: /* @__PURE__ */ jsxRuntime.jsx(
+            material.Button,
+            {
+              className: "icon-only surface-standard",
+              color: "grey",
+              variant: "surface",
+              startIcon: /* @__PURE__ */ jsxRuntime.jsx(NiRefresh, { size: "medium" }),
+              onClick: onAutoMatch,
+              "aria-label": "Re-run Auto-Match",
+              disabled: disableInputs,
+              "data-testid": "auto-match-button"
+            }
+          ) }) })
+        ]
+      }
+    ) }),
+    providerPickerEnabled && /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: { xs: 12, sm: 6 }, children: /* @__PURE__ */ jsxRuntime.jsxs(material.FormControl, { variant: "filled", size: "medium", className: "surface mb-0 w-full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.InputLabel, { children: PROVIDER_CONTROL_LABEL }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        material.Select,
+        {
+          value: providerKind ?? "",
+          onChange: (e) => onProviderKindChange?.(e.target.value),
+          disabled: disableInputs,
+          "data-testid": "provider-kind-select",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: "plugin", children: PROVIDER_OPTION_LABEL.plugin }),
+            /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: "connector", children: PROVIDER_OPTION_LABEL.connector })
+          ]
+        }
+      )
+    ] }) }),
+    providerPickerEnabled && isPluginMode && /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: { xs: 12, sm: 6 }, children: /* @__PURE__ */ jsxRuntime.jsxs(material.FormControl, { variant: "filled", size: "medium", className: "surface mb-0 w-full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.InputLabel, { children: PLUGIN_PROVIDER_CONTROL_LABEL }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        material.Select,
+        {
+          value: selectedPluginExtensionId,
+          onChange: (e) => onPluginProviderChange?.(e.target.value),
+          disabled: disableInputs,
+          "data-testid": "plugin-provider-select",
+          children: [
+            selectedPluginExtensionId ? /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: "", children: /* @__PURE__ */ jsxRuntime.jsx("em", { children: "None" }) }) : null,
+            pluginProviders.map((p) => /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: p.extensionId, children: p.name }, p.extensionId))
+          ]
+        }
+      )
+    ] }) }),
+    !isPluginMode && /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: { xs: 12, sm: 6 }, children: /* @__PURE__ */ jsxRuntime.jsxs(material.FormControl, { variant: "filled", size: "medium", className: "surface mb-0 w-full", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(material.InputLabel, { children: CONNECTOR_CONTROL_LABEL }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        material.Select,
+        {
+          value: selectedConnectorId,
+          onChange: (e) => onConnectorChange(e.target.value),
+          "data-testid": "connector-select",
+          children: [
+            selectedConnectorId ? /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: "", children: /* @__PURE__ */ jsxRuntime.jsx("em", { children: "None" }) }) : null,
+            connectors.map((c) => /* @__PURE__ */ jsxRuntime.jsx(material.MenuItem, { value: c.id, children: c.name }, c.id))
+          ]
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: 12, children: !hasProvider ? renderNoProviderEmptyState(effectiveKind, moduleLabel) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      banner,
+      /* @__PURE__ */ jsxRuntime.jsx(material.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(material.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(material.Grid, { container: true, spacing: 2, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: "border-border flex flex-row items-center gap-4 border-b px-2 pb-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            material.Typography,
+            {
+              variant: "caption",
+              className: "text-text-secondary flex-1 font-semibold uppercase tracking-wider",
+              children: "Operation"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            material.Typography,
+            {
+              variant: "caption",
+              className: "text-text-secondary font-semibold uppercase tracking-wider",
+              sx: { width: 300 },
+              children: "Mapped Tool"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            material.Typography,
+            {
+              variant: "caption",
+              className: "text-text-secondary font-semibold uppercase tracking-wider",
+              sx: { width: 160 },
+              children: "Source"
+            }
+          )
+        ] }) }),
+        mappings.map((m) => {
+          const canEditTranslation = !!m.mappedToolName && m.canonicalRequestFields != null && m.canonicalResponseFields != null;
+          return /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { size: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(
+            material.Box,
+            {
+              className: "flex flex-row items-center gap-4 px-2 py-1.5",
+              "data-testid": `mapping-row-${m.operationKey}`,
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: "flex flex-1 items-center gap-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "subtitle2", children: m.label }),
+                  m.isRequired && /* @__PURE__ */ jsxRuntime.jsx(material.Chip, { label: "Required", size: "small", color: "primary", variant: "outlined" })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  material.Autocomplete,
+                  {
+                    sx: { width: 300 },
+                    size: "small",
+                    options: availableTools.map((t) => t.name),
+                    value: m.mappedToolName ?? null,
+                    onChange: (_, next) => onUpdateMapping(m.operationKey, next ?? "", m.rowVersion ?? ""),
+                    disabled: disableInputs,
+                    disableClearable: false,
+                    clearText: "Not mapped",
+                    renderInput: (params) => /* @__PURE__ */ jsxRuntime.jsx(
+                      material.TextField,
+                      {
+                        ...params,
+                        variant: "filled",
+                        label: "Tool",
+                        placeholder: "Type to search\u2026",
+                        className: "surface mb-0",
+                        slotProps: { inputLabel: { shrink: true } },
+                        "data-testid": `mapping-tool-input-${m.operationKey}`
+                      }
+                    ),
+                    renderOption: (props, option) => {
+                      const tool = availableTools.find((t) => t.name === option);
+                      return /* @__PURE__ */ react.createElement(material.Box, { component: "li", ...props, key: option }, /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", children: option }),
+                        tool?.description && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "caption", className: "text-text-secondary", children: tool.description })
+                      ] }));
+                    }
+                  }
+                ),
+                canEditTranslation ? /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title: "Configure field translation", children: /* @__PURE__ */ jsxRuntime.jsx(
+                  material.IconButton,
+                  {
+                    size: "small",
+                    onClick: () => onEditTranslation(m.operationKey, {
+                      requestFieldMap: m.requestFieldMap ?? null,
+                      responseFieldPaths: m.responseFieldPaths ?? null,
+                      staticRequestFields: m.staticRequestFields ?? null
+                    }),
+                    disabled: disableInputs,
+                    "aria-label": "Configure field translation",
+                    "data-testid": `edit-translation-${m.operationKey}`,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(NiSettings, { size: "small" })
+                  }
+                ) }) : (
+                  // A spacer, not nothing. Without it the source column shifts left on
+                  // rows with no translation affordance and the table stops being a table.
+                  /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { width: 32, flexShrink: 0 } })
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: "flex items-center gap-1.5", sx: { width: 160 }, children: [
+                  renderSourceChip(m),
+                  m.requiresReview && /* @__PURE__ */ jsxRuntime.jsx(material.Tooltip, { title: "AI suggestion, low confidence \u2014 please confirm.", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    material.Box,
+                    {
+                      className: "bg-warning",
+                      sx: { width: 8, height: 8, borderRadius: "50%" }
+                    }
+                  ) })
+                ] })
+              ]
+            }
+          ) }, m.operationKey);
+        })
+      ] }) }) })
+    ] }) })
+  ] });
+}
 function ConnectorMappingTranslationEditorView({
   open,
   operationLabel,
@@ -1383,14 +2024,27 @@ var CONNECTOR_MAPPINGS_ROOT = "connector-mappings";
 function connectorMappingsQueryKey(connectorId, moduleKey) {
   return [CONNECTOR_MAPPINGS_ROOT, connectorId, moduleKey];
 }
+function connectorMappingsRootQueryKey() {
+  return [CONNECTOR_MAPPINGS_ROOT];
+}
+function pluginTargetMappingsQueryKey(moduleKey) {
+  return [CONNECTOR_MAPPINGS_ROOT, "plugin-target", moduleKey];
+}
 function connectorMappingCompletenessQueryKey(connectorId, moduleKey) {
   return [...connectorMappingsQueryKey(connectorId, moduleKey), "completeness"];
 }
 
+exports.CONNECTOR_CONTROL_LABEL = CONNECTOR_CONTROL_LABEL;
 exports.ConnectorMappingTranslationEditorView = ConnectorMappingTranslationEditorView;
+exports.ConnectorMappingView = ConnectorMappingView;
 exports.MappingCompletenessBanner = MappingCompletenessBanner;
+exports.PLUGIN_PROVIDER_CONTROL_LABEL = PLUGIN_PROVIDER_CONTROL_LABEL;
+exports.PROVIDER_CONTROL_LABEL = PROVIDER_CONTROL_LABEL;
+exports.PROVIDER_OPTION_LABEL = PROVIDER_OPTION_LABEL;
 exports.connectorMappingCompletenessQueryKey = connectorMappingCompletenessQueryKey;
 exports.connectorMappingsQueryKey = connectorMappingsQueryKey;
+exports.connectorMappingsRootQueryKey = connectorMappingsRootQueryKey;
+exports.pluginTargetMappingsQueryKey = pluginTargetMappingsQueryKey;
 exports.selectIncompleteOperations = selectIncompleteOperations;
 exports.selectMappingReadiness = selectMappingReadiness;
 exports.selectOptionalIncompleteOperations = selectOptionalIncompleteOperations;