@copilotkit/react-ui 1.8.2-next.2 → 1.8.2-next.4

package/dist/index.mjs

@@ -5,17 +5,17 @@ import "./chunk-SQMEPWVT.mjs";
 import "./chunk-WB3YULQ4.mjs";
 import {
   CopilotPopup
-} from "./chunk-DKYAA4DM.mjs";
+} from "./chunk-2D24Q2YO.mjs";
 import {
   CopilotSidebar
-} from "./chunk-N5QWMFFT.mjs";
-import "./chunk-FGVMRZ5D.mjs";
+} from "./chunk-X7HMY3S6.mjs";
+import "./chunk-OG2LUNMO.mjs";
 import "./chunk-P7S3E5UW.mjs";
-import "./chunk-Y5RNSFAD.mjs";
+import "./chunk-2OTVZXDX.mjs";
 import "./chunk-V7W6IM2V.mjs";
 import {
   CopilotDevConsole
-} from "./chunk-7BXD65QV.mjs";
+} from "./chunk-D5XIJNXQ.mjs";
 import {
   shouldShowDevConsole
 } from "./chunk-6TCUJ3B7.mjs";

package/package.json

@@ -9,7 +9,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.8.2-next.2",
+  "version": "1.8.2-next.4",
   "sideEffects": [
     "**/*.css"
   ],
@@ -50,9 +50,9 @@
     "react-syntax-highlighter": "^15.5.0",
     "remark-gfm": "^3.0.1",
     "remark-math": "^5.1.1",
-    "@copilotkit/react-core": "1.8.2-next.2",
-    "@copilotkit/runtime-client-gql": "1.8.2-next.2",
-    "@copilotkit/shared": "1.8.2-next.2"
+    "@copilotkit/react-core": "1.8.2-next.4",
+    "@copilotkit/runtime-client-gql": "1.8.2-next.4",
+    "@copilotkit/shared": "1.8.2-next.4"
   },
   "keywords": [
     "copilotkit",

package/src/components/chat/Header.tsx

@@ -11,7 +11,11 @@ export const Header = ({}: HeaderProps) => {
       <div>{labels.title}</div>
       <div className="copilotKitHeaderControls">
         <CopilotDevConsole />
-        <button onClick={() => setOpen(false)} aria-label="Close">
+        <button
+          onClick={() => setOpen(false)}
+          aria-label="Close"
+          className="copilotKitHeaderCloseButton"
+        >
           {icons.headerCloseIcon}
         </button>
       </div>

package/src/components/dev-console/console.tsx

@@ -194,7 +194,7 @@ export default function DebugMenuButton({
   const messagesContext = useCopilotMessagesContext();
 
   return (
-    <div className="bg-black top-24 w-52 text-right">
+    <>
       <Menu>
         <MenuButton
           className={`copilotKitDebugMenuTriggerButton ${mode === "compact" ? "compact" : ""}`}
@@ -239,6 +239,6 @@ export default function DebugMenuButton({
           </MenuItem>
         </MenuItems>
       </Menu>
-    </div>
+    </>
   );
 }

package/src/css/colors.css

@@ -66,66 +66,3 @@ body[style*="color-scheme: dark"] :root {
   /* Large shadow for modals */
   --copilot-kit-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
 }
-
-/* Dark theme - based on system preference - FOLLOWS BASE DARK THEME */
-@media (prefers-color-scheme: dark) {
-  :root {
-    /* Main brand/action color - used for buttons, interactive elements */
-    --copilot-kit-primary-color: rgb(255, 255, 255);
-    /* Color that contrasts with primary - used for text on primary elements */
-    --copilot-kit-contrast-color: rgb(28, 28, 28);
-    /* Main page/container background color */
-    --copilot-kit-background-color: rgb(17, 17, 17);
-    /* Input box background color */
-    --copilot-kit-input-background-color: #2c2c2c;
-    /* Secondary background - used for cards, panels, elevated surfaces */
-    --copilot-kit-secondary-color: rgb(28, 28, 28);
-    /* Primary text color for main content */
-    --copilot-kit-secondary-contrast-color: rgb(255, 255, 255);
-    /* Border color for dividers and containers */
-    --copilot-kit-separator-color: rgb(45, 45, 45);
-    /* Muted color for disabled/inactive states */
-    --copilot-kit-muted-color: rgb(45, 45, 45);
-
-    /* Small shadow for subtle elevation */
-    --copilot-kit-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-    /* Medium shadow for cards */
-    --copilot-kit-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
-    /* Large shadow for modals */
-    --copilot-kit-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
-  }
-
-  /* When app has light theme, it should prevail over dark theme of OS - FOLLOWS BASE LIGHT THEME */
-  .light,
-  html.light,
-  body.light,
-  [data-theme="light"],
-  html[style*="color-scheme: light"],
-  body[style*="color-scheme: light"] :root {
-    /* Semantic color tokens */
-    /* Main brand/action color - used for buttons, interactive elements */
-    --copilot-kit-primary-color: rgb(28, 28, 28);
-    /* Color that contrasts with primary - used for text on primary elements */
-    --copilot-kit-contrast-color: rgb(255, 255, 255);
-    /* Main page/container background color */
-    --copilot-kit-background-color: rgb(255 255 255);
-    /* Input box background color */
-    --copilot-kit-input-background-color: #fbfbfb;
-    /* Secondary background - used for cards, panels, elevated surfaces */
-    --copilot-kit-secondary-color: rgb(255 255 255);
-    /* Primary text color for main content */
-    --copilot-kit-secondary-contrast-color: rgb(28, 28, 28);
-    /* Border color for dividers and containers */
-    --copilot-kit-separator-color: rgb(200 200 200);
-    /* Muted color for disabled/inactive states */
-    --copilot-kit-muted-color: rgb(200 200 200);
-
-    /* Shadow tokens */
-    /* Small shadow for subtle elevation */
-    --copilot-kit-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-    /* Medium shadow for cards */
-    --copilot-kit-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-    /* Large shadow for modals */
-    --copilot-kit-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
-  }
-}

package/src/css/header.css

@@ -22,6 +22,11 @@
   display: flex;
 }
 
+.copilotKitHeaderCloseButton {
+  background: none;
+  border: none;
+}
+
 @media (min-width: 640px) {
   .copilotKitHeader {
     padding-left: 1.5rem;

package/src/css/messages.css

@@ -109,6 +109,8 @@
   padding: 0;
   z-index: 10;
   margin: 0;
+  background: transparent;
+  border: none;
 }
 
 .copilotKitMessageControlButton:hover {

package/dist/chunk-Y5RNSFAD.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/chat/Header.tsx"],"sourcesContent":["import { HeaderProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport { CopilotDevConsole } from \"../dev-console\";\nimport React from \"react\";\n\nexport const Header = ({}: HeaderProps) => {\n  const { setOpen, icons, labels } = useChatContext();\n\n  return (\n    <div className=\"copilotKitHeader\">\n      <div>{labels.title}</div>\n      <div className=\"copilotKitHeaderControls\">\n        <CopilotDevConsole />\n        <button onClick={() => setOpen(false)} aria-label=\"Close\">\n          {icons.headerCloseIcon}\n        </button>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAUM,cACA,YADA;AALC,IAAM,SAAS,CAAC,CAAC,MAAmB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,IAAI,eAAe;AAElD,SACE,qBAAC,SAAI,WAAU,oBACb;AAAA,wBAAC,SAAK,iBAAO,OAAM;AAAA,IACnB,qBAAC,SAAI,WAAU,4BACb;AAAA,0BAAC,qBAAkB;AAAA,MACnB,oBAAC,YAAO,SAAS,MAAM,QAAQ,KAAK,GAAG,cAAW,SAC/C,gBAAM,iBACT;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}