@elevasis/ui 2.56.0 → 2.58.0

package/dist/app/index.js

@@ -1,4 +1,4 @@
-import { useSessionCheck, AppErrorBoundary, SidebarProvider, ElevasisSystemsProvider, useElevasisSystems, AppShellContainer, Sidebar, AppShellRightSideContainer, AppShellRightSideOuterContainer, SystemShell, ElevasisUIProvider } from '../chunk-36IF4TXC.js';
+import { useSessionCheck, AppErrorBoundary, SidebarProvider, ElevasisSystemsProvider, useElevasisSystems, AppShellContainer, Sidebar, AppShellRightSideContainer, AppShellRightSideOuterContainer, SystemShell, ElevasisUIProvider } from '../chunk-WZ3PL4O7.js';
 import '../chunk-NZ2F5RQ4.js';
 import '../chunk-OJJK27GC.js';
 import '../chunk-ZTWA5H77.js';
@@ -12,7 +12,7 @@ import '../chunk-S3XR4II4.js';
 import { useInitialization } from '../chunk-LO7GWG24.js';
 import '../chunk-DD3CCMCZ.js';
 import '../chunk-M7WWRZ5Z.js';
-import '../chunk-E6NSKXYN.js';
+import '../chunk-T73S4G4P.js';
 import { TanStackRouterBridge, ScrollToTop } from '../chunk-2IFYDILW.js';
 import '../chunk-Q7DJKLEN.js';
 import '../chunk-HENXLGVD.js';

package/dist/auth/index.js

@@ -1,4 +1,4 @@
-export { AccessGuard, AccessKeys, ProtectedRoute, useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from '../chunk-36IF4TXC.js';
+export { AccessGuard, AccessKeys, ProtectedRoute, useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from '../chunk-WZ3PL4O7.js';
 import '../chunk-NZ2F5RQ4.js';
 import '../chunk-OJJK27GC.js';
 import '../chunk-ZTWA5H77.js';
@@ -12,7 +12,7 @@ import '../chunk-S3XR4II4.js';
 import '../chunk-LO7GWG24.js';
 import '../chunk-DD3CCMCZ.js';
 import '../chunk-M7WWRZ5Z.js';
-import '../chunk-E6NSKXYN.js';
+import '../chunk-T73S4G4P.js';
 import '../chunk-2IFYDILW.js';
 import '../chunk-Q7DJKLEN.js';
 import '../chunk-HENXLGVD.js';

package/dist/charts/index.js

@@ -1,4 +1,4 @@
-export { ActivityTrendChart, ChartFrame, CombinedTrendChart, CostTrendChart, CyberAreaChart, CyberDonut, CyberDonutTooltip, CyberLegendItem, HeroStatsRow, getSeriesColor, useCyberColors } from '../chunk-36IF4TXC.js';
+export { ActivityTrendChart, ChartFrame, CombinedTrendChart, CostTrendChart, CyberAreaChart, CyberDonut, CyberDonutTooltip, CyberLegendItem, HeroStatsRow, getSeriesColor, useCyberColors } from '../chunk-WZ3PL4O7.js';
 import '../chunk-NZ2F5RQ4.js';
 import '../chunk-OJJK27GC.js';
 import '../chunk-ZTWA5H77.js';
@@ -12,7 +12,7 @@ import '../chunk-S3XR4II4.js';
 import '../chunk-LO7GWG24.js';
 import '../chunk-DD3CCMCZ.js';
 import '../chunk-M7WWRZ5Z.js';
-import '../chunk-E6NSKXYN.js';
+import '../chunk-T73S4G4P.js';
 import '../chunk-2IFYDILW.js';
 import '../chunk-Q7DJKLEN.js';
 import '../chunk-HENXLGVD.js';

package/dist/{chunk-E6NSKXYN.js → chunk-T73S4G4P.js}

@@ -108,15 +108,18 @@ var ChatInputArea = memo(function ChatInputArea2({
     [onSend]
   );
   const canSend = isConnected && !isDisabled && !isProcessing && input.trim();
-  return /* @__PURE__ */ jsx(Stack, { gap: 4, pt: 6, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Stack, { gap: 4, pt: 6, px: "sm", pb: "sm", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsxs(
     "div",
     {
       style: {
         display: "flex",
         gap: "10px",
         alignItems: "flex-end",
-        background: "var(--color-surface)",
-        border: focused ? "1px solid color-mix(in srgb, var(--color-primary) 50%, var(--color-border))" : "1px solid var(--color-border)",
+        // Solid, opaque input surface. The theme's --color-surface is only ~20%
+        // opaque (glassy) and renders as "no bg" over the dark canvas, so derive
+        // an opaque, slightly-lifted fill from tokens instead.
+        background: "color-mix(in srgb, var(--color-text) 7%, var(--color-background))",
+        border: focused ? "1px solid color-mix(in srgb, var(--color-primary) 50%, var(--color-border))" : "1px solid color-mix(in srgb, var(--color-text) 14%, var(--color-border))",
         borderRadius: "14px",
         padding: "6px 6px 6px 16px",
         transition: "border-color 180ms, box-shadow 180ms",
@@ -660,8 +663,16 @@ function ChatInterface({
       scrollContainerRef.current.scrollTop = scrollContainerRef.current.scrollHeight;
     }
   }, [visibleMessages.length, isConnected, isProcessing]);
-  return /* @__PURE__ */ jsxs(Stack, { className, gap: 0, style: { height: "100%", overflow: "hidden", ...style }, children: [
-    /* @__PURE__ */ jsx(ScrollableContainer, { containerRef: scrollContainerRef, variant: messageAreaVariant, children: /* @__PURE__ */ jsx(
+  const isPanel = messageAreaVariant === "grid";
+  const layout = {
+    flex: 1,
+    minHeight: 0,
+    display: "flex",
+    flexDirection: "column",
+    overflow: "hidden"
+  };
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ScrollableContainer, { containerRef: scrollContainerRef, children: /* @__PURE__ */ jsx(
       MessageAreaContent,
       {
         isConnected,
@@ -698,33 +709,27 @@ function ChatInterface({
       }
     )
   ] });
+  return /* @__PURE__ */ jsx(Stack, { className, gap: 0, style: { height: "100%", overflow: "hidden", ...style }, children: isPanel ? /* @__PURE__ */ jsx(Paper, { withBorder: true, p: 0, style: layout, children: body }) : /* @__PURE__ */ jsx("div", { style: layout, children: body }) });
 }
 function ScrollableContainer({
   children,
-  containerRef,
-  variant
+  containerRef
 }) {
-  const isGrid = variant === "grid";
   return /* @__PURE__ */ jsx(
     "div",
     {
       ref: containerRef,
       style: {
         flex: 1,
+        minHeight: 0,
         display: "flex",
         flexDirection: "column",
         overflowY: "auto",
         overflowX: "hidden",
         scrollBehavior: "smooth",
-        backgroundColor: isGrid ? "var(--color-background)" : "transparent",
-        backgroundImage: isGrid ? [
-          "linear-gradient(color-mix(in srgb, var(--color-primary) 5%, transparent) 1px, transparent 1px)",
-          "linear-gradient(90deg, color-mix(in srgb, var(--color-primary) 5%, transparent) 1px, transparent 1px)",
-          "radial-gradient(ellipse at 50% 50%, color-mix(in srgb, var(--color-primary) 5%, transparent) 0%, transparent 70%)"
-        ].join(", ") : void 0,
-        backgroundSize: isGrid ? "40px 40px, 40px 40px, 100% 100%" : void 0,
-        borderRadius: "var(--mantine-radius-sm)",
-        padding: "8px",
+        // Transparent — the panel surface now lives on the unified wrapper so the
+        // message stream and input share one container.
+        padding: "12px",
         // Custom scrollbar styling
         scrollbarWidth: "thin",
         scrollbarColor: "color-mix(in srgb, var(--color-text-subtle) 50%, var(--color-border)) transparent"