@burtson-labs/bandit-engine 2.0.109 → 2.0.111

package/dist/index.js

@@ -36980,16 +36980,7 @@ var PreferencesTab = ({
         children: "Preferences"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
-      import_material41.Typography,
-      {
-        variant: "body1",
-        color: "text.secondary",
-        paragraph: true,
-        sx: { opacity: 0.9, fontSize: { xs: "0.95rem", sm: "1rem" }, lineHeight: 1.5 },
-        children: "Control which AI features are enabled to optimize performance for your device. Disabling features can help reduce resource usage on machines with limited capabilities."
-      }
-    ),
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_material41.Typography, { variant: "body2", color: "text.secondary", sx: { mb: 1.5 }, children: "Turn features on or off to tune performance for your device." }),
     /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_material41.Paper, { sx: { p: { xs: 1.5, sm: 1.75 }, mb: { xs: 1.5, md: 1.75 }, border: "1px solid", borderColor: "divider", borderRadius: 2 }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_material41.Box, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_material41.Typography, { variant: "h6", sx: { fontWeight: 600, color: "text.primary" }, children: "Conversation Starters" }),
@@ -43214,7 +43205,7 @@ var ProviderTab = () => {
     }
   };
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Box, { sx: { p: { xs: 1.5, sm: 2.5, md: 3 } }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Box, { sx: { mb: { xs: 2.5, md: 3 } }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Box, { sx: { mb: { xs: 1.5, md: 2 } }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
         import_material49.Typography,
         {
@@ -43223,18 +43214,9 @@ var ProviderTab = () => {
           children: "AI Provider Configuration"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-        import_material49.Typography,
-        {
-          variant: "body1",
-          color: "text.secondary",
-          paragraph: true,
-          sx: { opacity: 0.9, fontSize: { xs: "0.95rem", sm: "1rem" }, lineHeight: 1.5 },
-          children: "Configure your AI provider for chat, generation, and model services. This determines which backend service powers your AI interactions."
-        }
-      ),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "body2", color: "text.secondary", sx: { mb: 1.5 }, children: "Choose the backend that powers your AI." }),
       /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Paper, { sx: { p: { xs: 1.5, sm: 1.75 }, mb: { xs: 1.5, md: 1.75 }, bgcolor: "background.paper", border: "1px solid", borderColor: "divider", borderRadius: 2 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "h6", sx: { mb: 2, fontWeight: 600, color: "text.primary" }, children: "Current Provider" }),
+        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "overline", sx: { fontWeight: 700, color: "text.secondary", letterSpacing: 0.6, display: "block", mb: 1 }, children: "Current Provider" }),
         currentProvider ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Box, { sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
           /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
             import_material49.Chip,
@@ -43257,7 +43239,7 @@ var ProviderTab = () => {
               alignItems: { xs: "flex-start", sm: "center" },
               justifyContent: "space-between",
               gap: { xs: 1, sm: 2 },
-              mb: 3
+              mb: 2
             },
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "h6", sx: { fontWeight: 600, color: "text.primary" }, children: "Provider Configuration" }),
@@ -43546,10 +43528,7 @@ var ProviderTab = () => {
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_material49.Paper, { sx: { p: 3, bgcolor: "info.main", color: "info.contrastText", borderRadius: 2 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "h6", sx: { mb: 1, fontWeight: 600, color: "text.primary" }, children: "Gateway Provider Recommended" }),
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "body2", children: "For production deployments, we recommend using the Gateway provider which routes requests through your secure backend API. This approach keeps API keys secure, enables rate limiting, and provides better monitoring capabilities." })
-      ] })
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_material49.Typography, { variant: "caption", color: "text.secondary", sx: { display: "block", mt: 0.5, lineHeight: 1.5 }, children: "Gateway is recommended for production \u2014 it routes through your secure backend, keeps API keys server-side, and enables rate limiting + monitoring." })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       import_material49.Snackbar,
@@ -45017,6 +44996,12 @@ var Management = () => {
           styleOverrides: {
             root: { borderRadius: 12 }
           }
+        },
+        MuiTextField: {
+          defaultProps: { size: "small" }
+        },
+        MuiButton: {
+          defaultProps: { size: "small" }
         }
       }
     });
@@ -45159,82 +45144,46 @@ var Management = () => {
               if (isMobile) setSidebarOpen(false);
             },
             sx: {
-              minHeight: 56,
-              borderRadius: 3,
-              mx: 1,
-              my: 0.5,
-              px: 2,
-              py: 1.5,
-              border: tabIndex === idx ? (theme2) => `2px solid ${theme2.palette.primary.main}40` : "2px solid transparent",
-              bgcolor: tabIndex === idx ? (theme2) => theme2.palette.mode === "dark" ? "rgba(25,118,210,0.12)" : "rgba(25,118,210,0.08)" : "transparent",
+              minHeight: 36,
+              borderRadius: 1.5,
+              mx: 0.5,
+              my: 0.125,
+              px: 1.25,
+              py: 0.5,
+              bgcolor: tabIndex === idx ? (theme2) => theme2.palette.mode === "dark" ? "rgba(25,118,210,0.14)" : "rgba(25,118,210,0.10)" : "transparent",
               color: tabIndex === idx ? "primary.main" : "text.primary",
-              fontWeight: tabIndex === idx ? 700 : 500,
-              transition: "all 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
+              transition: "background-color 0.15s ease, color 0.15s ease",
               position: "relative",
-              overflow: "hidden",
               "&:before": {
                 content: '""',
                 position: "absolute",
                 left: 0,
-                top: 0,
-                bottom: 0,
-                width: 4,
+                top: 5,
+                bottom: 5,
+                width: 3,
                 bgcolor: tabIndex === idx ? "primary.main" : "transparent",
-                borderRadius: "0 2px 2px 0",
-                transition: "all 0.2s"
+                borderRadius: "0 2px 2px 0"
               },
               "&:hover": {
-                bgcolor: (theme2) => theme2.palette.mode === "dark" ? "rgba(25,118,210,0.15)" : "rgba(25,118,210,0.10)",
-                color: "primary.main",
-                transform: "translateX(4px)",
-                "&:before": {
-                  bgcolor: "primary.main"
-                }
-              },
-              "&:active": {
-                transform: "translateX(2px) scale(0.98)"
+                bgcolor: (theme2) => theme2.palette.mode === "dark" ? "rgba(255,255,255,0.06)" : "rgba(0,0,0,0.04)",
+                color: "primary.main"
               },
               "& .MuiListItemIcon-root": {
-                minWidth: 44,
-                mr: 1.5
-              }
+                minWidth: 28,
+                mr: 1,
+                color: tabIndex === idx ? "primary.main" : "text.secondary"
+              },
+              "& .MuiListItemIcon-root svg": { width: 17, height: 17 }
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
-                import_material52.ListItemIcon,
-                {
-                  sx: {
-                    color: tabIndex === idx ? "primary.main" : "text.secondary",
-                    fontSize: 24,
-                    transition: "all 0.2s"
-                  },
-                  children: tab.icon
-                }
-              ),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_material52.ListItemIcon, { children: tab.icon }),
               /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
                 import_material52.ListItemText,
                 {
                   primary: tab.label,
                   primaryTypographyProps: {
-                    fontWeight: tabIndex === idx ? 700 : 600,
-                    fontSize: "1rem",
-                    letterSpacing: "-0.01em"
-                  }
-                }
-              ),
-              tabIndex === idx && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
-                import_material52.Box,
-                {
-                  sx: {
-                    position: "absolute",
-                    right: -10,
-                    top: -10,
-                    width: 90,
-                    height: 90,
-                    bgcolor: (theme2) => theme2.palette.primary.main,
-                    filter: "blur(45px)",
-                    opacity: 0.35,
-                    pointerEvents: "none"
+                    fontWeight: tabIndex === idx ? 700 : 500,
+                    fontSize: "0.85rem"
                   }
                 }
               )
@@ -45441,9 +45390,9 @@ var Management = () => {
             import_material52.Box,
             {
               sx: {
-                width: 280,
-                minWidth: 280,
-                maxWidth: 280,
+                width: 240,
+                minWidth: 240,
+                maxWidth: 240,
                 height: "100vh",
                 display: "flex",
                 flexDirection: "column",
@@ -45475,7 +45424,7 @@ var Management = () => {
                 display: "flex",
                 flexDirection: "column",
                 bgcolor: "background.default",
-                ml: isMobile ? 0 : "280px",
+                ml: isMobile ? 0 : "240px",
                 // Fixed left margin only on desktop
                 mt: 0,
                 transition: "margin-left 0.2s"