@smart-cloud/ai-kit-ui 1.1.17 → 1.1.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smart-cloud/ai-kit-ui",
-  "version": "1.1.17",
+  "version": "1.1.19",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -20,7 +20,7 @@
     "@emotion/cache": "^11.14.0",
     "@emotion/react": "^11.14.0",
     "@mantine/colors-generator": "^8.3.13",
-    "@smart-cloud/ai-kit-core": "^1.1.7",
+    "@smart-cloud/ai-kit-core": "^1.1.8",
     "@smart-cloud/wpsuite-core": "^2.0.5",
     "@tabler/icons-react": "^3.36.1",
     "chroma-js": "^3.2.0",

package/src/ai-chatbot/AiChatbot.tsx

@@ -53,8 +53,9 @@ const TWENTY_FOUR_HOURS_MS = 24 * 60 * 60 * 1000;
 
 // New: history storage support
 const DEFAULT_HISTORY_STORAGE: HistoryStorageMode = "localstorage";
-const HISTORY_STORAGE_KEY = `ai-kit-chatbot-history-v1:${typeof window !== "undefined" ? window.location.hostname : "unknown"
-  }`;
+const HISTORY_STORAGE_KEY = `ai-kit-chatbot-history-v1:${
+  typeof window !== "undefined" ? window.location.hostname : "unknown"
+}`;
 
 export const DEFAULT_CHATBOT_LABELS: Required<AiChatbotLabels> = {
   modalTitle: "AI Assistant",
@@ -295,7 +296,6 @@ const AiChatbotBase: FC<AiChatbotProps & AiKitShellInjectedProps> = (props) => {
 
   useEffect(() => {
     if (language) {
-      console.log(`AiChatbot: setting language to ${language}`);
       I18n.setLanguage(language || "en");
     }
   }, [language]);
@@ -595,7 +595,7 @@ const AiChatbotBase: FC<AiChatbotProps & AiKitShellInjectedProps> = (props) => {
       try {
         const activeSessionId =
           sessionRef.current &&
-            Date.now() - sessionRef.current.storedAt < TWENTY_FOUR_HOURS_MS
+          Date.now() - sessionRef.current.storedAt < TWENTY_FOUR_HOURS_MS
             ? sessionRef.current.id
             : undefined;
         if (!activeSessionId) return;
@@ -680,7 +680,7 @@ const AiChatbotBase: FC<AiChatbotProps & AiKitShellInjectedProps> = (props) => {
     try {
       const activeSessionId =
         sessionRef.current &&
-          Date.now() - sessionRef.current.storedAt < TWENTY_FOUR_HOURS_MS
+        Date.now() - sessionRef.current.storedAt < TWENTY_FOUR_HOURS_MS
           ? sessionRef.current.id
           : undefined;
 

package/src/withAiKitShell.tsx

@@ -22,14 +22,21 @@ export type AiKitShellInjectedProps = {
   rootElement: HTMLElement;
 };
 
-function hashStringDjb2(str: string): string {
+const hashStringDjb2 = (str: string): string => {
   let hash = 5381;
   for (let i = 0; i < str.length; i++) {
     hash = ((hash << 5) + hash) ^ str.charCodeAt(i);
   }
   // unsigned + base36
   return (hash >>> 0).toString(36);
-}
+};
+
+const sanitizeThemeOverrides = (input: string): string =>
+  input
+    .replace(/<\/?(?:style|script)\b[^>]*>/gi, "")
+    .replace(/@import\s+['"]?javascript:[^;]+;?/gi, "")
+    .replace(/url\(\s*(['"]?)javascript:[^)]+\)/gi, "")
+    .replace(/\bexpression\s*\([^)]*\)/gi, "");
 
 const STYLE_TEXT_ID = "ai-kit-style-text";
 
@@ -126,19 +133,19 @@ export function withAiKitShell<P extends object>(
         ].includes(primaryColor) && { primaryColor }),
       ...(primaryShade &&
         Object.keys(primaryShade).length > 0 && {
-        primaryShade: {
-          light:
-            primaryShade.light ??
-            (typeof DEFAULT_THEME.primaryShade === "object"
-              ? DEFAULT_THEME.primaryShade.light
-              : (DEFAULT_THEME.primaryShade ?? 6)),
-          dark:
-            primaryShade.dark ??
-            (typeof DEFAULT_THEME.primaryShade === "object"
-              ? DEFAULT_THEME.primaryShade.dark
-              : (DEFAULT_THEME.primaryShade ?? 6)),
-        },
-      }),
+          primaryShade: {
+            light:
+              primaryShade.light ??
+              (typeof DEFAULT_THEME.primaryShade === "object"
+                ? DEFAULT_THEME.primaryShade.light
+                : (DEFAULT_THEME.primaryShade ?? 6)),
+            dark:
+              primaryShade.dark ??
+              (typeof DEFAULT_THEME.primaryShade === "object"
+                ? DEFAULT_THEME.primaryShade.dark
+                : (DEFAULT_THEME.primaryShade ?? 6)),
+          },
+        }),
       components: {
         Button: {
           styles: { root: { borderRadius: "inherit" } },
@@ -179,41 +186,32 @@ export function withAiKitShell<P extends object>(
       return themeOverrides ? hashStringDjb2(themeOverrides) : "";
     }, [themeOverrides]);
 
-    useEffect(
-      () => {
-
-        if (!host) {
-          return;
-        }
-
-        const existingStyle = host.shadowRoot!.getElementById(
-          STYLE_TEXT_ID,
-        ) as HTMLStyleElement | null;
+    useEffect(() => {
+      if (!host) {
+        return;
+      }
 
-        console.log('injectStyle called', host, host.shadowRoot, existingStyle);
+      const existingStyle = host.shadowRoot!.getElementById(
+        STYLE_TEXT_ID,
+      ) as HTMLStyleElement | null;
 
-        if (themeOverrides) {
-          if (!existingStyle) {
-            console.log('Creating new style element');
-            const s = host.shadowRoot!.ownerDocument.createElement("style");
-            s.id = STYLE_TEXT_ID;
-            s.setAttribute("data-hash", themeOverridesHash);
-            s.textContent = themeOverrides;
-            host.shadowRoot!.appendChild(s);
-          } else {
-            const prevHash = existingStyle.getAttribute("data-hash") || "";
-            if (prevHash !== themeOverridesHash) {
-              console.log('Updating existing style element');
-              existingStyle.textContent = themeOverrides;
-            }
+      if (themeOverrides) {
+        if (!existingStyle) {
+          const s = host.shadowRoot!.ownerDocument.createElement("style");
+          s.id = STYLE_TEXT_ID;
+          s.setAttribute("data-hash", themeOverridesHash);
+          s.textContent = sanitizeThemeOverrides(themeOverrides);
+          host.shadowRoot!.appendChild(s);
+        } else {
+          const prevHash = existingStyle.getAttribute("data-hash") || "";
+          if (prevHash !== themeOverridesHash) {
+            existingStyle.textContent = sanitizeThemeOverrides(themeOverrides);
           }
-        } else if (existingStyle) {
-          console.log('Removing existing style element');
-          existingStyle.remove();
         }
-      },
-      [host, themeOverrides, themeOverridesHash],
-    );
+      } else if (existingStyle) {
+        existingStyle.remove();
+      }
+    }, [host, themeOverrides, themeOverridesHash]);
 
     return (
       <ShadowBoundary
@@ -266,7 +264,8 @@ export function withAiKitShell<P extends object>(
     );
   };
 
-  Wrapped.displayName = `withAiKitShell(${RootComponent.displayName ?? RootComponent.name ?? "Component"
-    })`;
+  Wrapped.displayName = `withAiKitShell(${
+    RootComponent.displayName ?? RootComponent.name ?? "Component"
+  })`;
   return Wrapped;
 }