@acarmisc/backstage-plugin-litellm 0.31.1 → 0.33.0

package/dist/index.esm.js

@@ -3124,6 +3124,7 @@ import Box10 from "@mui/material/Box";
 import Divider2 from "@mui/material/Divider";
 import Typography8 from "@mui/material/Typography";
 import IconButton4 from "@mui/material/IconButton";
+import Tooltip4 from "@mui/material/Tooltip";
 import Paper4 from "@mui/material/Paper";
 import Table2 from "@mui/material/Table";
 import TableBody2 from "@mui/material/TableBody";
@@ -3166,7 +3167,10 @@ var init_ManageTeamDialog = __esm({
       onSaveKnowledgeBases,
       canManageMcpServers,
       mcpServers,
-      onSaveMcpServers
+      onSaveMcpServers,
+      membersOnly,
+      currentUserId,
+      memberManagerRoles
     }) => {
       const [alias, setAlias] = useState6("");
       const [models, setModels] = useState6([]);
@@ -3180,6 +3184,7 @@ var init_ManageTeamDialog = __esm({
       const [memberBudget, setMemberBudget] = useState6("");
       const [memberBusy, setMemberBusy] = useState6(false);
       const [memberError, setMemberError] = useState6(null);
+      const [pendingMembers, setPendingMembers] = useState6([]);
       const [kbIds, setKbIds] = useState6([]);
       const [kbBusy, setKbBusy] = useState6(false);
       const [kbError, setKbError] = useState6(null);
@@ -3190,8 +3195,17 @@ var init_ManageTeamDialog = __esm({
       const maxBudgetCeiling = config?.teamManagement?.maxBudgetCeiling ?? FALLBACK_BUDGET_CEILING;
       const hideBudgetForManagers = config?.display?.hideTeamBudgetForManagers ?? false;
       const budgetWriteOnly = hideBudgetForManagers && mode === "edit";
-      const members = useMemo4(() => team?.members_with_roles ?? [], [team]);
-      const showMembers = mode === "edit" && !!canManageMembers;
+      const creating = mode === "create";
+      const members = useMemo4(
+        () => creating ? pendingMembers.map((p) => ({
+          user_id: p.userEntityRef,
+          user_email: p.label,
+          role: "user"
+        })) : team?.members_with_roles ?? [],
+        [creating, pendingMembers, team]
+      );
+      const showMembers = !!canManageMembers || !!membersOnly;
+      const wide = showMembers && !membersOnly;
       const catalogApi = useApi3(catalogApiRef);
       const [searchUsers, setSearchUsers] = useState6([]);
       const [usersLoading, setUsersLoading] = useState6(false);
@@ -3236,8 +3250,8 @@ var init_ManageTeamDialog = __esm({
             email,
             label: email ? `${displayName} (${email})` : displayName
           };
-        }).filter((o) => !(o.email && existingEmails.has(o.email.toLowerCase()))).sort((a, b) => a.label.localeCompare(b.label));
-      }, [searchUsers, members]);
+        }).filter((o) => !(o.email && existingEmails.has(o.email.toLowerCase()))).filter((o) => !pendingMembers.some((p) => p.userEntityRef === o.ref)).sort((a, b) => a.label.localeCompare(b.label));
+      }, [searchUsers, members, pendingMembers]);
       useEffect4(() => {
         return () => {
           if (debounceTimerRef.current) {
@@ -3271,6 +3285,7 @@ var init_ManageTeamDialog = __esm({
           setMemberRef("");
           setMemberBudget("");
           setMemberError(null);
+          setPendingMembers([]);
           setKbIds(team?.object_permission?.vector_stores ?? []);
           setKbError(null);
           setMcpIds(team?.object_permission?.mcp_servers ?? []);
@@ -3329,7 +3344,13 @@ var init_ManageTeamDialog = __esm({
               ...budgetDuration && { budget_duration: budgetDuration }
             };
           }
-          await onSubmit(payload);
+          await onSubmit(
+            payload,
+            creating ? pendingMembers.map(({ userEntityRef, maxBudgetInTeam }) => ({
+              userEntityRef,
+              ...maxBudgetInTeam !== void 0 && { maxBudgetInTeam }
+            })) : void 0
+          );
           onClose();
         } catch (err) {
           setError(err instanceof Error ? err.message : "An error occurred");
@@ -3338,13 +3359,26 @@ var init_ManageTeamDialog = __esm({
         }
       };
       const handleAddMember = async () => {
-        if (!onAddMember || !memberRef.trim()) return;
+        if (!memberRef.trim() || !creating && !onAddMember) return;
         setMemberError(null);
-        const budget = memberBudget ? parseFloat(memberBudget) : void 0;
+        const budget = !membersOnly && memberBudget ? parseFloat(memberBudget) : void 0;
         if (budget !== void 0 && (isNaN(budget) || budget <= 0)) {
           setMemberError("Max budget in team must be a positive number");
           return;
         }
+        if (creating) {
+          const ref = memberRef.trim();
+          if (!pendingMembers.some((p) => p.userEntityRef === ref)) {
+            setPendingMembers((list) => [
+              ...list,
+              { userEntityRef: ref, label: memberQuery.trim() || ref, maxBudgetInTeam: budget }
+            ]);
+          }
+          setMemberQuery("");
+          setMemberRef("");
+          setMemberBudget("");
+          return;
+        }
         try {
           setMemberBusy(true);
           await onAddMember(memberRef.trim(), budget);
@@ -3358,6 +3392,10 @@ var init_ManageTeamDialog = __esm({
         }
       };
       const handleRemoveMember = async (userId) => {
+        if (creating) {
+          setPendingMembers((list) => list.filter((p) => p.userEntityRef !== userId));
+          return;
+        }
         if (!onRemoveMember) return;
         setMemberError(null);
         try {
@@ -3401,186 +3439,242 @@ var init_ManageTeamDialog = __esm({
       const showMcpServers = mode === "edit" && !!canManageMcpServers;
       const mcpOptions = (mcpServers ?? []).map((s) => s.id);
       const mcpLabel = (id) => (mcpServers ?? []).find((s) => s.id === id)?.name ?? id;
-      return /* @__PURE__ */ jsxs10(Dialog3, { open, onClose, maxWidth: "sm", fullWidth: true, children: [
-        /* @__PURE__ */ jsx11(DialogTitle3, { children: mode === "create" ? "Create Team" : "Edit Team" }),
+      const isRemovalDisabled = (memberUserId, memberRole) => {
+        if (!membersOnly) return { disabled: false };
+        if (memberUserId === currentUserId) {
+          return { disabled: true, reason: "You can't remove yourself" };
+        }
+        if (memberManagerRoles?.includes(memberRole)) {
+          return { disabled: true, reason: `Only platform admins can remove a team ${memberRole}` };
+        }
+        return { disabled: false };
+      };
+      const submitLabel = creating ? "Create team" : "Save";
+      const getDialogTitle = () => {
+        if (membersOnly) {
+          return `Manage members \u2014 ${team?.team_alias || "Untitled team"}`;
+        }
+        return mode === "create" ? "Create Team" : "Edit Team";
+      };
+      return /* @__PURE__ */ jsxs10(Dialog3, { open, onClose, maxWidth: wide ? "md" : "sm", fullWidth: true, children: [
+        /* @__PURE__ */ jsx11(DialogTitle3, { children: getDialogTitle() }),
         /* @__PURE__ */ jsxs10(DialogContent3, { sx: { pt: 2, display: "flex", flexDirection: "column", gap: 2 }, children: [
           error && /* @__PURE__ */ jsx11(Alert2, { severity: "error", children: error }),
-          /* @__PURE__ */ jsx11(
-            TextField3,
-            {
-              label: "Team Alias",
-              value: alias,
-              onChange: (e) => setAlias(e.target.value),
-              disabled: submitting,
-              fullWidth: true
-            }
-          ),
-          /* @__PURE__ */ jsx11(
-            Autocomplete2,
-            {
-              multiple: true,
-              options: modelNames,
-              value: models,
-              onChange: (_, newValue) => setModels(newValue),
-              disabled: submitting,
-              renderInput: (params) => /* @__PURE__ */ jsx11(
-                TextField3,
-                {
-                  ...params,
-                  label: "Models",
-                  required: true,
-                  helperText: "At least one model is required here \u2014 this delegated flow only grants access to models your admin has allow-listed for team creation, not every proxy model. (Teams with no model restriction shown elsewhere were configured directly in LiteLLM.)"
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx11(
-            TextField3,
-            {
-              label: budgetWriteOnly ? "New Max Budget ($)" : "Max Budget ($)",
-              type: "number",
-              value: maxBudget,
-              onChange: (e) => setMaxBudget(e.target.value),
-              disabled: submitting || unlimited,
-              inputProps: { min: 0, max: maxBudgetCeiling },
-              helperText: budgetWriteOnly ? "Current budget is hidden \u2014 leave blank to keep it, or enter a new value" : `Maximum: $${maxBudgetCeiling}`,
-              fullWidth: true
-            }
-          ),
-          allowUnlimitedBudget && /* @__PURE__ */ jsx11(
-            FormControlLabel2,
-            {
-              control: /* @__PURE__ */ jsx11(Checkbox2, { checked: unlimited, onChange: (e) => setUnlimited(e.target.checked), disabled: submitting }),
-              label: "Unlimited Budget"
-            }
-          ),
-          /* @__PURE__ */ jsx11(
-            TextField3,
+          membersOnly && /* @__PURE__ */ jsxs10(Alert2, { severity: "info", children: [
+            "As a team ",
+            team?.members_with_roles?.find((m) => m.user_id === currentUserId)?.role || "member",
+            " you can add or remove members. Budgets and models are managed by your platform admins."
+          ] }),
+          /* @__PURE__ */ jsxs10(
+            Box10,
             {
-              select: true,
-              label: "Budget Duration",
-              value: budgetDuration,
-              onChange: (e) => setBudgetDuration(e.target.value),
-              disabled: submitting || unlimited,
-              helperText: "Spend-reset period for the team budget",
-              fullWidth: true,
-              children: durationOptions.map((o) => /* @__PURE__ */ jsx11(MenuItem2, { value: o.value, children: o.label }, o.value))
-            }
-          ),
-          showMembers && /* @__PURE__ */ jsxs10(Box10, { children: [
-            /* @__PURE__ */ jsx11(Divider2, { sx: { my: 1 } }),
-            /* @__PURE__ */ jsx11(Typography8, { variant: "subtitle2", sx: { mb: 1 }, children: "Members" }),
-            memberError && /* @__PURE__ */ jsx11(Alert2, { severity: "error", sx: { mb: 1 }, onClose: () => setMemberError(null), children: memberError }),
-            members.length === 0 ? /* @__PURE__ */ jsx11(Typography8, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: "No members yet." }) : /* @__PURE__ */ jsx11(TableContainer2, { component: Paper4, variant: "outlined", sx: { borderRadius: 1.5, mb: 1.5 }, children: /* @__PURE__ */ jsxs10(Table2, { size: "small", sx: dataTableSx, children: [
-              /* @__PURE__ */ jsx11(TableHead2, { children: /* @__PURE__ */ jsxs10(TableRow2, { children: [
-                /* @__PURE__ */ jsx11(TableCell2, { children: "User" }),
-                /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: "Role" }),
-                /* @__PURE__ */ jsx11(TableCell2, { align: "right", sx: { width: 40 } })
-              ] }) }),
-              /* @__PURE__ */ jsx11(TableBody2, { children: members.map((m) => /* @__PURE__ */ jsxs10(TableRow2, { children: [
-                /* @__PURE__ */ jsx11(TableCell2, { children: m.user_email ? /* @__PURE__ */ jsxs10(Fragment4, { children: [
-                  /* @__PURE__ */ jsx11(Typography8, { variant: "body2", children: m.user_email }),
+              sx: {
+                display: "grid",
+                gridTemplateColumns: {
+                  xs: "1fr",
+                  md: wide ? "minmax(0, 1fr) minmax(0, 1fr)" : "1fr"
+                },
+                gap: 3,
+                alignItems: "start"
+              },
+              children: [
+                !membersOnly && /* @__PURE__ */ jsxs10(Box10, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+                  wide && /* @__PURE__ */ jsx11(Typography8, { variant: "subtitle2", children: "Settings" }),
                   /* @__PURE__ */ jsx11(
-                    Typography8,
+                    TextField3,
                     {
-                      variant: "caption",
-                      color: "text.secondary",
-                      sx: { fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontSize: 11 },
-                      children: m.user_id
+                      label: "Team Alias",
+                      value: alias,
+                      onChange: (e) => setAlias(e.target.value),
+                      disabled: submitting,
+                      fullWidth: true
                     }
-                  )
-                ] }) : /* @__PURE__ */ jsx11(
-                  Typography8,
-                  {
-                    variant: "body2",
-                    sx: { fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace" },
-                    children: m.user_id
-                  }
-                ) }),
-                /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: /* @__PURE__ */ jsx11(StatusPill, { label: m.role, tone: m.role === "admin" ? "accent" : "neutral", dot: false }) }),
-                /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: /* @__PURE__ */ jsx11(
-                  IconButton4,
-                  {
-                    edge: "end",
-                    size: "small",
-                    "aria-label": `remove ${m.user_id}`,
-                    disabled: memberBusy,
-                    onClick: () => handleRemoveMember(m.user_id),
-                    children: /* @__PURE__ */ jsx11(DeleteIcon, { fontSize: "small" })
-                  }
-                ) })
-              ] }, m.user_id)) })
-            ] }) }),
-            /* @__PURE__ */ jsxs10(Box10, { sx: { display: "flex", gap: 1, alignItems: "flex-start", flexWrap: "wrap" }, children: [
-              /* @__PURE__ */ jsx11(
-                Autocomplete2,
-                {
-                  freeSolo: true,
-                  autoHighlight: true,
-                  options: userOptions,
-                  loading: usersLoading,
-                  inputValue: memberQuery,
-                  onInputChange: (_, newInputValue, reason) => {
-                    setMemberQuery(newInputValue);
-                    if (reason === "input" || reason === "clear") {
-                      setMemberRef(newInputValue);
-                      handleUserSearch(newInputValue);
+                  ),
+                  /* @__PURE__ */ jsx11(
+                    Autocomplete2,
+                    {
+                      multiple: true,
+                      options: modelNames,
+                      value: models,
+                      onChange: (_, newValue) => setModels(newValue),
+                      disabled: submitting,
+                      renderInput: (params) => /* @__PURE__ */ jsx11(
+                        TextField3,
+                        {
+                          ...params,
+                          label: "Models",
+                          required: true,
+                          helperText: "Only models your admin allow-listed for teams. At least one is required."
+                        }
+                      )
                     }
-                  },
-                  onChange: (_, newValue) => {
-                    if (newValue && typeof newValue !== "string") {
-                      setMemberQuery(newValue.label);
-                      setMemberRef(newValue.ref);
+                  ),
+                  /* @__PURE__ */ jsxs10(
+                    Box10,
+                    {
+                      sx: {
+                        display: "grid",
+                        gridTemplateColumns: { xs: "1fr", sm: "1fr 1fr" },
+                        gap: 2
+                      },
+                      children: [
+                        /* @__PURE__ */ jsx11(
+                          TextField3,
+                          {
+                            label: budgetWriteOnly ? "New Max Budget ($)" : "Max Budget ($)",
+                            type: "number",
+                            value: maxBudget,
+                            onChange: (e) => setMaxBudget(e.target.value),
+                            disabled: submitting || unlimited,
+                            inputProps: { min: 0, max: maxBudgetCeiling },
+                            helperText: budgetWriteOnly ? "Current budget is hidden \u2014 leave blank to keep it, or enter a new value" : `Maximum: $${maxBudgetCeiling}`,
+                            fullWidth: true
+                          }
+                        ),
+                        /* @__PURE__ */ jsx11(
+                          TextField3,
+                          {
+                            select: true,
+                            label: "Budget Duration",
+                            value: budgetDuration,
+                            onChange: (e) => setBudgetDuration(e.target.value),
+                            disabled: submitting || unlimited,
+                            helperText: "Spend-reset period for the team budget",
+                            fullWidth: true,
+                            children: durationOptions.map((o) => /* @__PURE__ */ jsx11(MenuItem2, { value: o.value, children: o.label }, o.value))
+                          }
+                        )
+                      ]
                     }
-                  },
-                  getOptionLabel: (o) => typeof o === "string" ? o : o.label,
-                  isOptionEqualToValue: (o, v) => o.ref === (typeof v === "string" ? v : v.ref),
-                  disabled: memberBusy,
-                  sx: { flex: 1, minWidth: 260 },
-                  renderInput: (params) => /* @__PURE__ */ jsx11(
-                    TextField3,
+                  ),
+                  allowUnlimitedBudget && /* @__PURE__ */ jsx11(
+                    FormControlLabel2,
                     {
-                      ...params,
-                      label: "Add member",
-                      placeholder: "Search by name or email\u2026",
-                      size: "small",
-                      helperText: "Pick a catalog user, or paste a user entity ref",
-                      InputProps: {
-                        ...params.InputProps,
-                        endAdornment: /* @__PURE__ */ jsxs10(Fragment4, { children: [
-                          usersLoading ? /* @__PURE__ */ jsx11(CircularProgress3, { color: "inherit", size: 14 }) : null,
-                          params.InputProps.endAdornment
-                        ] })
-                      }
+                      control: /* @__PURE__ */ jsx11(Checkbox2, { checked: unlimited, onChange: (e) => setUnlimited(e.target.checked), disabled: submitting }),
+                      label: "Unlimited Budget"
                     }
                   )
-                }
-              ),
-              /* @__PURE__ */ jsx11(
-                TextField3,
-                {
-                  label: "Max budget in team ($)",
-                  type: "number",
-                  value: memberBudget,
-                  onChange: (e) => setMemberBudget(e.target.value),
-                  disabled: memberBusy,
-                  size: "small",
-                  sx: { width: 160 }
-                }
-              ),
-              /* @__PURE__ */ jsx11(
-                Button4,
-                {
-                  onClick: handleAddMember,
-                  disabled: memberBusy || !memberRef.trim(),
-                  variant: "outlined",
-                  sx: { mt: 0.5 },
-                  children: "Add"
-                }
-              )
-            ] })
-          ] }),
-          showKnowledgeBases && /* @__PURE__ */ jsxs10(Box10, { children: [
+                ] }),
+                showMembers && /* @__PURE__ */ jsxs10(Box10, { children: [
+                  /* @__PURE__ */ jsx11(Typography8, { variant: "subtitle2", sx: { mb: creating ? 0.25 : 1 }, children: creating ? "Initial members" : "Members" }),
+                  creating && /* @__PURE__ */ jsx11(Typography8, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: "Added as team users right after the team is created." }),
+                  memberError && /* @__PURE__ */ jsx11(Alert2, { severity: "error", sx: { mb: 1 }, onClose: () => setMemberError(null), children: memberError }),
+                  members.length === 0 ? /* @__PURE__ */ jsx11(Typography8, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: creating ? "No members picked yet \u2014 you can also add them later." : "No members yet." }) : /* @__PURE__ */ jsx11(TableContainer2, { component: Paper4, variant: "outlined", sx: { borderRadius: 1.5, mb: 1.5 }, children: /* @__PURE__ */ jsxs10(Table2, { size: "small", sx: dataTableSx, children: [
+                    /* @__PURE__ */ jsx11(TableHead2, { children: /* @__PURE__ */ jsxs10(TableRow2, { children: [
+                      /* @__PURE__ */ jsx11(TableCell2, { children: "User" }),
+                      /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: "Role" }),
+                      /* @__PURE__ */ jsx11(TableCell2, { align: "right", sx: { width: 40 } })
+                    ] }) }),
+                    /* @__PURE__ */ jsx11(TableBody2, { children: members.map((m) => /* @__PURE__ */ jsxs10(TableRow2, { children: [
+                      /* @__PURE__ */ jsx11(TableCell2, { children: m.user_email ? /* @__PURE__ */ jsxs10(Fragment4, { children: [
+                        /* @__PURE__ */ jsx11(Typography8, { variant: "body2", children: m.user_email }),
+                        /* @__PURE__ */ jsx11(
+                          Typography8,
+                          {
+                            variant: "caption",
+                            color: "text.secondary",
+                            sx: { fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", fontSize: 11 },
+                            children: m.user_id
+                          }
+                        )
+                      ] }) : /* @__PURE__ */ jsx11(
+                        Typography8,
+                        {
+                          variant: "body2",
+                          sx: { fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace" },
+                          children: m.user_id
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: /* @__PURE__ */ jsx11(StatusPill, { label: m.role, tone: m.role === "admin" ? "accent" : "neutral", dot: false }) }),
+                      /* @__PURE__ */ jsx11(TableCell2, { align: "right", children: (() => {
+                        const { disabled, reason } = isRemovalDisabled(m.user_id, m.role);
+                        return /* @__PURE__ */ jsx11(Tooltip4, { title: reason ?? "", children: /* @__PURE__ */ jsx11("span", { children: /* @__PURE__ */ jsx11(
+                          IconButton4,
+                          {
+                            edge: "end",
+                            size: "small",
+                            "aria-label": `remove ${m.user_id}`,
+                            disabled: memberBusy || disabled,
+                            onClick: () => handleRemoveMember(m.user_id),
+                            children: /* @__PURE__ */ jsx11(DeleteIcon, { fontSize: "small" })
+                          }
+                        ) }) });
+                      })() })
+                    ] }, m.user_id)) })
+                  ] }) }),
+                  /* @__PURE__ */ jsxs10(Box10, { sx: { display: "flex", gap: 1, alignItems: "flex-start", flexWrap: "wrap" }, children: [
+                    /* @__PURE__ */ jsx11(
+                      Autocomplete2,
+                      {
+                        freeSolo: true,
+                        autoHighlight: true,
+                        options: userOptions,
+                        loading: usersLoading,
+                        inputValue: memberQuery,
+                        onInputChange: (_, newInputValue, reason) => {
+                          setMemberQuery(newInputValue);
+                          if (reason === "input" || reason === "clear") {
+                            setMemberRef(newInputValue);
+                            handleUserSearch(newInputValue);
+                          }
+                        },
+                        onChange: (_, newValue) => {
+                          if (newValue && typeof newValue !== "string") {
+                            setMemberQuery(newValue.label);
+                            setMemberRef(newValue.ref);
+                          }
+                        },
+                        getOptionLabel: (o) => typeof o === "string" ? o : o.label,
+                        isOptionEqualToValue: (o, v) => o.ref === (typeof v === "string" ? v : v.ref),
+                        disabled: memberBusy,
+                        sx: { flex: "1 1 240px" },
+                        renderInput: (params) => /* @__PURE__ */ jsx11(
+                          TextField3,
+                          {
+                            ...params,
+                            label: "Add member",
+                            placeholder: "Search by name or email\u2026",
+                            size: "small",
+                            helperText: "Pick a catalog user, or paste a user entity ref",
+                            InputProps: {
+                              ...params.InputProps,
+                              endAdornment: /* @__PURE__ */ jsxs10(Fragment4, { children: [
+                                usersLoading ? /* @__PURE__ */ jsx11(CircularProgress3, { color: "inherit", size: 14 }) : null,
+                                params.InputProps.endAdornment
+                              ] })
+                            }
+                          }
+                        )
+                      }
+                    ),
+                    !membersOnly && /* @__PURE__ */ jsx11(
+                      TextField3,
+                      {
+                        label: "Max budget in team ($)",
+                        type: "number",
+                        value: memberBudget,
+                        onChange: (e) => setMemberBudget(e.target.value),
+                        disabled: memberBusy,
+                        size: "small",
+                        sx: { width: 150 }
+                      }
+                    ),
+                    /* @__PURE__ */ jsx11(
+                      Button4,
+                      {
+                        onClick: handleAddMember,
+                        disabled: memberBusy || !memberRef.trim(),
+                        variant: "outlined",
+                        sx: { mt: 0.5 },
+                        children: "Add"
+                      }
+                    )
+                  ] })
+                ] })
+              ]
+            }
+          ),
+          !membersOnly && showKnowledgeBases && /* @__PURE__ */ jsxs10(Box10, { children: [
             /* @__PURE__ */ jsx11(Divider2, { sx: { my: 1 } }),
             /* @__PURE__ */ jsx11(Typography8, { variant: "subtitle2", sx: { mb: 1 }, children: "Knowledge Bases" }),
             /* @__PURE__ */ jsx11(Typography8, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: "Attaching a knowledge base exposes its documents to every key in this team." }),
@@ -3607,7 +3701,7 @@ var init_ManageTeamDialog = __esm({
               }
             ) })
           ] }),
-          showMcpServers && /* @__PURE__ */ jsxs10(Box10, { children: [
+          !membersOnly && showMcpServers && /* @__PURE__ */ jsxs10(Box10, { children: [
             /* @__PURE__ */ jsx11(Divider2, { sx: { my: 1 } }),
             /* @__PURE__ */ jsx11(Typography8, { variant: "subtitle2", sx: { mb: 1 }, children: "MCP Servers" }),
             /* @__PURE__ */ jsx11(Typography8, { variant: "body2", color: "text.secondary", sx: { mb: 1 }, children: "Attaching an MCP server lets every key in this team invoke that server's tools through the model \u2014 including any side effects those tools have." }),
@@ -3636,8 +3730,8 @@ var init_ManageTeamDialog = __esm({
           ] })
         ] }),
         /* @__PURE__ */ jsxs10(DialogActions3, { children: [
-          /* @__PURE__ */ jsx11(Button4, { onClick: onClose, disabled: submitting, children: "Cancel" }),
-          /* @__PURE__ */ jsx11(Button4, { onClick: handleSubmit, disabled: submitting, variant: "contained", children: submitting ? "Saving..." : "Save" })
+          /* @__PURE__ */ jsx11(Button4, { onClick: onClose, disabled: submitting, children: membersOnly ? "Done" : "Cancel" }),
+          !membersOnly && /* @__PURE__ */ jsx11(Button4, { onClick: handleSubmit, disabled: submitting, variant: "contained", children: submitting ? "Saving..." : submitLabel })
         ] })
       ] });
     };
@@ -3848,7 +3942,7 @@ import {
   XAxis,
   YAxis,
   CartesianGrid,
-  Tooltip as Tooltip4,
+  Tooltip as Tooltip5,
   ResponsiveContainer,
   Legend,
   ReferenceLine,
@@ -4185,7 +4279,7 @@ var init_UsageStats = __esm({
                   /* @__PURE__ */ jsx12(XAxis, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }),
                   /* @__PURE__ */ jsx12(YAxis, { tickFormatter: fmtUsdCompact, width: 56, ...chart.axis }),
                   /* @__PURE__ */ jsx12(
-                    Tooltip4,
+                    Tooltip5,
                     {
                       cursor: chart.cursor,
                       content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd, hideZero: true })
@@ -4211,7 +4305,7 @@ var init_UsageStats = __esm({
                 /* @__PURE__ */ jsx12(CartesianGrid, { ...chart.grid }),
                 /* @__PURE__ */ jsx12(XAxis, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }),
                 /* @__PURE__ */ jsx12(YAxis, { tickFormatter: fmtCompact, width: 48, ...chart.axis }),
-                /* @__PURE__ */ jsx12(Tooltip4, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt }) }),
+                /* @__PURE__ */ jsx12(Tooltip5, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt }) }),
                 /* @__PURE__ */ jsx12(Legend, { ...chart.legend }),
                 /* @__PURE__ */ jsx12(Area, { type: "monotone", dataKey: "promptTokens", name: "Input", stackId: "tok", stroke: SERIES.input, strokeWidth: 1.5, fill: SERIES.input, fillOpacity: 0.25 }),
                 /* @__PURE__ */ jsx12(Area, { type: "monotone", dataKey: "completionTokens", name: "Output", stackId: "tok", stroke: SERIES.output, strokeWidth: 1.5, fill: SERIES.output, fillOpacity: 0.25 })
@@ -4220,7 +4314,7 @@ var init_UsageStats = __esm({
                 /* @__PURE__ */ jsx12(CartesianGrid, { ...chart.grid }),
                 /* @__PURE__ */ jsx12(XAxis, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }),
                 /* @__PURE__ */ jsx12(YAxis, { tickFormatter: fmtCompact, width: 48, ...chart.axis }),
-                /* @__PURE__ */ jsx12(Tooltip4, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt }) }),
+                /* @__PURE__ */ jsx12(Tooltip5, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt }) }),
                 /* @__PURE__ */ jsx12(Legend, { ...chart.legend }),
                 /* @__PURE__ */ jsx12(Bar, { dataKey: "successfulRequests", name: "Successful", fill: SERIES.success, stackId: "r" }),
                 /* @__PURE__ */ jsx12(Bar, { dataKey: "failedRequests", name: "Failed", fill: SERIES.failure, stackId: "r", radius: [3, 3, 0, 0] })
@@ -4230,7 +4324,7 @@ var init_UsageStats = __esm({
                 /* @__PURE__ */ jsx12(XAxis, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }),
                 /* @__PURE__ */ jsx12(YAxis, { domain: [0, 100], tickFormatter: (v) => `${v}%`, width: 44, ...chart.axis }),
                 /* @__PURE__ */ jsx12(
-                  Tooltip4,
+                  Tooltip5,
                   {
                     cursor: chart.cursor,
                     content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: (v) => `${v}%` })
@@ -4267,7 +4361,7 @@ var init_UsageStats = __esm({
                       }
                     ),
                     /* @__PURE__ */ jsx12(
-                      Tooltip4,
+                      Tooltip5,
                       {
                         cursor: chart.cursor,
                         content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd })
@@ -4309,7 +4403,7 @@ var init_UsageStats = __esm({
                     /* @__PURE__ */ jsx12(CartesianGrid, { ...chart.grid, vertical: true, horizontal: false }),
                     /* @__PURE__ */ jsx12(XAxis, { type: "number", tickFormatter: fmtUsdCompact, ...chart.axis }),
                     /* @__PURE__ */ jsx12(YAxis, { type: "category", dataKey: "model", width: 170, ...chart.axis, tick: { fontSize: 10.5, fill: chart.axis.tick.fill } }),
-                    /* @__PURE__ */ jsx12(Tooltip4, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd, labelFormatter: (l) => l }) }),
+                    /* @__PURE__ */ jsx12(Tooltip5, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd, labelFormatter: (l) => l }) }),
                     /* @__PURE__ */ jsx12(Bar, { dataKey: "spend", name: "Spend", radius: [0, 3, 3, 0], barSize: 14, children: topModelSpendBars.map((r) => /* @__PURE__ */ jsx12(Cell, { fill: chartColor(r.model) }, r.model)) })
                   ] }) })
                 }
@@ -4324,7 +4418,7 @@ var init_UsageStats = __esm({
                     /* @__PURE__ */ jsx12(CartesianGrid, { ...chart.grid, vertical: true, horizontal: false }),
                     /* @__PURE__ */ jsx12(XAxis, { type: "number", tickFormatter: fmtCompact, ...chart.axis }),
                     /* @__PURE__ */ jsx12(YAxis, { type: "category", dataKey: "model", width: 170, ...chart.axis, tick: { fontSize: 10.5, fill: chart.axis.tick.fill } }),
-                    /* @__PURE__ */ jsx12(Tooltip4, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt, labelFormatter: (l) => l }) }),
+                    /* @__PURE__ */ jsx12(Tooltip5, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtInt, labelFormatter: (l) => l }) }),
                     /* @__PURE__ */ jsx12(Legend, { ...chart.legend }),
                     /* @__PURE__ */ jsx12(Bar, { dataKey: "promptTokens", name: "Input", fill: SERIES.input, stackId: "t", barSize: 14 }),
                     /* @__PURE__ */ jsx12(Bar, { dataKey: "completionTokens", name: "Output", fill: SERIES.output, stackId: "t", barSize: 14, radius: [0, 3, 3, 0] })
@@ -4356,7 +4450,7 @@ var init_UsageStats = __esm({
                     /* @__PURE__ */ jsx12(CartesianGrid, { ...chart.grid, vertical: true, horizontal: false }),
                     /* @__PURE__ */ jsx12(XAxis, { type: "number", tickFormatter: fmtUsdCompact, ...chart.axis }),
                     /* @__PURE__ */ jsx12(YAxis, { type: "category", dataKey: "keyAlias", width: 160, ...chart.axis, tick: { fontSize: 10.5, fill: chart.axis.tick.fill } }),
-                    /* @__PURE__ */ jsx12(Tooltip4, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd, labelFormatter: (l) => l }) }),
+                    /* @__PURE__ */ jsx12(Tooltip5, { cursor: chart.cursor, content: /* @__PURE__ */ jsx12(ChartTooltip, { valueFormatter: fmtUsd, labelFormatter: (l) => l }) }),
                     /* @__PURE__ */ jsx12(Bar, { dataKey: "spend", name: "Spend", fill: SERIES.input, radius: [0, 3, 3, 0], barSize: 14 })
                   ] }) })
                 }
@@ -4891,14 +4985,15 @@ import IconButton6 from "@mui/material/IconButton";
 import Button6 from "@mui/material/Button";
 import CircularProgress4 from "@mui/material/CircularProgress";
 import { alpha as alpha10 } from "@mui/material/styles";
-import { ExpandMore as ExpandMore3, Group, Add as Add2 } from "@mui/icons-material";
+import MuiTooltip from "@mui/material/Tooltip";
+import { ExpandMore as ExpandMore3, Group, Add as Add2, LockOutlined, GroupAddOutlined } from "@mui/icons-material";
 import {
   AreaChart as AreaChart2,
   Area as Area2,
   XAxis as XAxis2,
   YAxis as YAxis2,
   CartesianGrid as CartesianGrid2,
-  Tooltip as Tooltip5,
+  Tooltip as Tooltip6,
   ResponsiveContainer as ResponsiveContainer2
 } from "recharts";
 import { Fragment as Fragment8, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
@@ -4922,7 +5017,7 @@ var init_TeamUsage = __esm({
     "use strict";
     init_ui();
     fmtUsd2 = (n) => `$${(n ?? 0).toFixed(2)}`;
-    TeamCard = ({ team, usage, usageLoading, canManage, onEditTeam, onExpand }) => {
+    TeamCard = ({ team, usage, usageLoading, canManage, onEditTeam, canManageMembers, onManageMembers, onExpand }) => {
       const [expanded, setExpanded] = useState9(false);
       const chart = useChartTheme();
       const handleExpandChange = (newExpanded) => {
@@ -4959,7 +5054,7 @@ var init_TeamUsage = __esm({
             /* @__PURE__ */ jsx15(XAxis2, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }),
             /* @__PURE__ */ jsx15(YAxis2, { tickFormatter: fmtUsdCompact, width: 52, ...chart.axis }),
             /* @__PURE__ */ jsx15(
-              Tooltip5,
+              Tooltip6,
               {
                 cursor: chart.cursor,
                 content: /* @__PURE__ */ jsx15(ChartTooltip, { valueFormatter: (v) => `$${v.toFixed(4)}` })
@@ -5032,6 +5127,17 @@ var init_TeamUsage = __esm({
               children: "Edit"
             }
           ),
+          canManageMembers && onManageMembers && !canManage && /* @__PURE__ */ jsx15(MuiTooltip, { title: "Add or remove members of this team", children: /* @__PURE__ */ jsx15(
+            Button6,
+            {
+              size: "small",
+              variant: "text",
+              startIcon: /* @__PURE__ */ jsx15(GroupAddOutlined, {}),
+              onClick: () => onManageMembers(team),
+              sx: { textTransform: "none" },
+              children: "Manage members"
+            }
+          ) }),
           /* @__PURE__ */ jsx15(
             IconButton6,
             {
@@ -5162,9 +5268,23 @@ var init_TeamUsage = __esm({
       onEditTeam,
       canCreate,
       onCreateTeam,
-      onTeamExpand
+      onTeamExpand,
+      canManageMembers,
+      onManageMembers,
+      readOnly
     }) => {
-      const createAction = canCreate && onCreateTeam ? /* @__PURE__ */ jsx15(
+      const readOnlyBadge = /* @__PURE__ */ jsx15(MuiTooltip, { title: "Teams and memberships are managed in your identity provider. Changes made here would be overwritten, so editing is disabled.", children: /* @__PURE__ */ jsxs14(
+        Box14,
+        {
+          component: "span",
+          sx: { display: "inline-flex", alignItems: "center", gap: 0.5, color: "text.secondary", fontSize: 12.5 },
+          children: [
+            /* @__PURE__ */ jsx15(LockOutlined, { sx: { fontSize: 15 } }),
+            "Synced from identity provider"
+          ]
+        }
+      ) });
+      const createButton = canCreate && onCreateTeam ? /* @__PURE__ */ jsx15(
         Button6,
         {
           variant: "contained",
@@ -5175,6 +5295,7 @@ var init_TeamUsage = __esm({
           children: "Create Team"
         }
       ) : void 0;
+      const createAction = readOnly ? readOnlyBadge : createButton;
       if (loading) {
         return /* @__PURE__ */ jsxs14(SectionCard, { title: "Teams", actions: createAction, children: [
           /* @__PURE__ */ jsx15(Skeleton5, { variant: "rounded", height: 120, sx: { mb: 2 } }),
@@ -5204,6 +5325,8 @@ var init_TeamUsage = __esm({
               usageLoading: getTeamUsageLoading(team.team_id),
               canManage,
               onEditTeam,
+              canManageMembers: canManageMembers?.(team),
+              onManageMembers,
               onExpand: onTeamExpand
             },
             team.team_id
@@ -5233,7 +5356,7 @@ import TextField5 from "@mui/material/TextField";
 import InputAdornment3 from "@mui/material/InputAdornment";
 import { Search as Search2 } from "@mui/icons-material";
 import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import Tooltip6 from "@mui/material/Tooltip";
+import Tooltip7 from "@mui/material/Tooltip";
 import Snackbar from "@mui/material/Snackbar";
 import Alert4 from "@mui/material/Alert";
 import { alpha as alpha11, useTheme as useTheme3 } from "@mui/material/styles";
@@ -5417,7 +5540,7 @@ var init_ModelsTable = __esm({
               ] }) }),
               /* @__PURE__ */ jsx16(TableBody5, { children: filteredModels.map((m) => /* @__PURE__ */ jsxs15(TableRow5, { hover: true, children: [
                 /* @__PURE__ */ jsx16(TableCell5, { children: /* @__PURE__ */ jsxs15(Box15, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-                  /* @__PURE__ */ jsx16(Tooltip6, { title: m.model_name, placement: "top", children: /* @__PURE__ */ jsx16(
+                  /* @__PURE__ */ jsx16(Tooltip7, { title: m.model_name, placement: "top", children: /* @__PURE__ */ jsx16(
                     "span",
                     {
                       role: "button",
@@ -5429,7 +5552,7 @@ var init_ModelsTable = __esm({
                       children: /* @__PURE__ */ jsx16(TagChip, { label: m.model_name, title: "Copy model ID" })
                     }
                   ) }),
-                  /* @__PURE__ */ jsx16(Tooltip6, { title: "Copy model ID", children: /* @__PURE__ */ jsx16(
+                  /* @__PURE__ */ jsx16(Tooltip7, { title: "Copy model ID", children: /* @__PURE__ */ jsx16(
                     Box15,
                     {
                       component: "span",
@@ -5852,6 +5975,19 @@ var init_feedback = __esm({
   }
 });
 
+// src/teamMemberManager.ts
+function isTeamMemberManager(team, userId, memberManagerRoles, readOnly) {
+  if (!team || !userId || !memberManagerRoles || memberManagerRoles.length === 0 || readOnly) {
+    return false;
+  }
+  return team.members_with_roles?.some((m) => m.user_id === userId && memberManagerRoles.includes(m.role)) ?? false;
+}
+var init_teamMemberManager = __esm({
+  "src/teamMemberManager.ts"() {
+    "use strict";
+  }
+});
+
 // src/unprovisionedCopy.ts
 function getUnprovisionedTitle() {
   return "Your LiteLLM account isn't set up yet";
@@ -5929,6 +6065,7 @@ var init_LiteLLMPage = __esm({
     init_dates();
     init_permissions();
     init_feedback();
+    init_teamMemberManager();
     init_unprovisionedCopy();
     PERIOD_LS_KEY2 = "litellm_usage_period";
     PAGE_TABS = ["overview", "keys", "teams", "models", "audit"];
@@ -6374,6 +6511,8 @@ var init_LiteLLMPage = __esm({
             for (const t of managedTeams ?? []) teamsById.set(t.team_id, t);
             for (const t of teams ?? []) teamsById.set(t.team_id, t);
             const visibleTeams = Array.from(teamsById.values());
+            const readOnly = liteLlmConfig?.teamManagement?.readOnly ?? false;
+            const memberManagerRoles = liteLlmConfig?.teamManagement?.memberManagerRoles ?? [];
             return /* @__PURE__ */ jsx18(
               TeamUsage,
               {
@@ -6381,10 +6520,13 @@ var init_LiteLLMPage = __esm({
                 loading: teamsLoading,
                 getTeamUsage: (teamId) => teamUsageCache[teamId] ?? null,
                 getTeamUsageLoading: (teamId) => teamUsageLoading[teamId] ?? false,
-                canManage: teamMgmtEnabled && canManageTeam,
+                canManage: teamMgmtEnabled && canManageTeam && !readOnly,
                 onEditTeam: (t) => setManageTeam({ mode: "edit", team: t }),
-                canCreate: teamMgmtEnabled && canCreateTeam,
+                canCreate: teamMgmtEnabled && canCreateTeam && !readOnly,
                 onCreateTeam: () => setManageTeam({ mode: "create" }),
+                canManageMembers: (t) => teamMgmtEnabled && canManageMembers && isTeamMemberManager(t, userInfo?.user_id, memberManagerRoles, readOnly),
+                onManageMembers: (t) => setManageTeam({ mode: "members", team: t }),
+                readOnly,
                 onTeamExpand: (team) => loadTeamUsage(team.team_id)
               }
             );
@@ -6436,11 +6578,14 @@ var init_LiteLLMPage = __esm({
           {
             open: !!manageTeam,
             onClose: () => setManageTeam(null),
-            mode: manageTeam?.mode ?? "create",
+            mode: manageTeam?.mode === "members" ? "edit" : manageTeam?.mode ?? "create",
             team: manageTeam?.team,
             allModels: allModels ?? [],
             config: liteLlmConfig,
-            onSubmit: async (payload) => {
+            membersOnly: manageTeam?.mode === "members",
+            currentUserId: userInfo?.user_id,
+            memberManagerRoles: liteLlmConfig?.teamManagement?.memberManagerRoles,
+            onSubmit: async (payload, initialMembers) => {
               try {
                 if (manageTeam?.mode === "edit" && manageTeam.team) {
                   const loadedAt = manageTeam.team.metadata?.updated_at_iso;
@@ -6450,7 +6595,23 @@ var init_LiteLLMPage = __esm({
                     ...typeof loadedAt === "string" ? { expectedUpdatedAtIso: loadedAt } : {}
                   });
                 } else {
-                  await api.createTeam(payload);
+                  const created = await api.createTeam(payload);
+                  const failed = [];
+                  for (const m of initialMembers ?? []) {
+                    try {
+                      await api.addTeamMember(created.team_id, m);
+                    } catch (e) {
+                      failed.push(`${m.userEntityRef} (${e.message})`);
+                    }
+                  }
+                  if (failed.length) {
+                    alertApi.post({
+                      message: `Team created, but some members could not be added: ${failed.join(", ")}`,
+                      severity: "warning"
+                    });
+                    refreshTeams();
+                    return;
+                  }
                 }
                 const alert = toastFor("teamSaveSuccess");
                 if (alert) alertApi.post(alert);
@@ -6460,7 +6621,7 @@ var init_LiteLLMPage = __esm({
                 if (alert) alertApi.post(alert);
               }
             },
-            canManageMembers: teamMgmtEnabled && canManageMembers,
+            canManageMembers: teamMgmtEnabled && canManageMembers && !liteLlmConfig?.teamManagement?.readOnly,
             onAddMember: async (userEntityRef, maxBudgetInTeam) => {
               if (!manageTeam?.team) return;
               const updated = await api.addTeamMember(manageTeam.team.team_id, {
@@ -6584,7 +6745,7 @@ import FormControl2 from "@mui/material/FormControl";
 import Select2 from "@mui/material/Select";
 import MenuItem6 from "@mui/material/MenuItem";
 import Skeleton7 from "@mui/material/Skeleton";
-import { AreaChart as AreaChart3, Area as Area3, XAxis as XAxis3, Tooltip as Tooltip7, ResponsiveContainer as ResponsiveContainer3 } from "recharts";
+import { AreaChart as AreaChart3, Area as Area3, XAxis as XAxis3, Tooltip as Tooltip8, ResponsiveContainer as ResponsiveContainer3 } from "recharts";
 import { useApi as useApi5 } from "@backstage/core-plugin-api";
 import { useRouteRef as useRouteRef2 } from "@backstage/frontend-plugin-api";
 import { Link as Link3 } from "@backstage/core-components";
@@ -6749,7 +6910,7 @@ var LiteLLMHomeWidget = ({
             sx: { mb: 0.5 },
             children: /* @__PURE__ */ jsx20(ResponsiveContainer3, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs18(AreaChart3, { data: dailyData, margin: { top: 4, right: 0, bottom: 0, left: 0 }, children: [
               /* @__PURE__ */ jsx20(XAxis3, { dataKey: "date", hide: true }),
-              /* @__PURE__ */ jsx20(Tooltip7, { content: /* @__PURE__ */ jsx20(ChartTooltip, { valueFormatter: fmtUsd }) }),
+              /* @__PURE__ */ jsx20(Tooltip8, { content: /* @__PURE__ */ jsx20(ChartTooltip, { valueFormatter: fmtUsd }) }),
               /* @__PURE__ */ jsx20(
                 Area3,
                 {
@@ -6796,7 +6957,7 @@ import Collapse4 from "@mui/material/Collapse";
 import { useTheme as useTheme4 } from "@mui/material/styles";
 import useMediaQuery from "@mui/material/useMediaQuery";
 import { ExpandMore as ExpandMore4 } from "@mui/icons-material";
-import { AreaChart as AreaChart4, Area as Area4, ResponsiveContainer as ResponsiveContainer4, Tooltip as Tooltip8, ReferenceLine as ReferenceLine2, XAxis as XAxis4 } from "recharts";
+import { AreaChart as AreaChart4, Area as Area4, ResponsiveContainer as ResponsiveContainer4, Tooltip as Tooltip9, ReferenceLine as ReferenceLine2, XAxis as XAxis4 } from "recharts";
 import { useApi as useApi6 } from "@backstage/core-plugin-api";
 import { Link as Link4 } from "@backstage/core-components";
 
@@ -7098,7 +7259,7 @@ var SpendStrip = ({ data, mtdSpend, loading, height, usageUnavailable = false, m
     }
     return /* @__PURE__ */ jsx21(ResponsiveContainer4, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs19(AreaChart4, { data, margin: { top: 4, right: 0, bottom: 0, left: 0 }, children: [
       /* @__PURE__ */ jsx21(XAxis4, { dataKey: "date", hide: true }),
-      /* @__PURE__ */ jsx21(Tooltip8, { content: /* @__PURE__ */ jsx21(ChartTooltip, { valueFormatter: fmtUsd }) }),
+      /* @__PURE__ */ jsx21(Tooltip9, { content: /* @__PURE__ */ jsx21(ChartTooltip, { valueFormatter: fmtUsd }) }),
       maxBudget !== void 0 && /* @__PURE__ */ jsx21(
         ReferenceLine2,
         {