kenobi-js 0.1.36 → 0.1.38

package/browser/dist.js

@@ -1,5 +1,5 @@
 /*!
- * Kenobi SDK v0.1.35
+ * Kenobi SDK v0.1.37
  * (c) 2025 Kenobi.ai
  */
 "use strict";
@@ -2398,6 +2398,11 @@ var KenobiLib = (() => {
   };
   __name(_TransitionOrchestrator, "TransitionOrchestrator");
   var TransitionOrchestrator = _TransitionOrchestrator;
+  var isCueCardConfigResponse = /* @__PURE__ */ __name((value) => {
+    if (typeof value !== "object" || value === null) return false;
+    const candidate = value;
+    return typeof candidate.enabled === "boolean";
+  }, "isCueCardConfigResponse");
   var TRANSFORMATION_ACTIONS = /* @__PURE__ */ new Set(["Replace", "InsertBefore", "InsertAfter", "Delete", "SetFormField"]);
   var isString = /* @__PURE__ */ __name((value) => typeof value === "string", "isString");
   var isStringArray = /* @__PURE__ */ __name((value) => Array.isArray(value) && value.every((item) => isString(item)), "isStringArray");
@@ -2434,6 +2439,7 @@ var KenobiLib = (() => {
       __publicField(this, "currentUrl");
       __publicField(this, "navTicking", false);
       __publicField(this, "transitionDefaults");
+      __publicField(this, "cueCardPaths");
       __publicField(this, "startAutoTransform", /* @__PURE__ */ __name(async () => {
         try {
           this.syncChangeStack();
@@ -2566,6 +2572,23 @@ var KenobiLib = (() => {
       __publicField(this, "getDurationInMilliseconds", /* @__PURE__ */ __name((start, end) => +end - +start, "getDurationInMilliseconds"));
       __publicField(this, "formatThousands", /* @__PURE__ */ __name((number) => new Intl.NumberFormat("en-US").format(number), "formatThousands"));
       __publicField(this, "setDebug", /* @__PURE__ */ __name((value) => this.config.debug = value, "setDebug"));
+      /**
+       * Checks if a path matches a pattern.
+       * Supports exact matches ("/pricing") and wildcard suffixes ("/blog/*").
+       */
+      __publicField(this, "matchesPathPattern", /* @__PURE__ */ __name((path, pattern) => {
+        const normalizedPath = path === "/" ? "/" : path.replace(/\/$/, "");
+        const normalizedPattern = pattern === "/" ? "/" : pattern.replace(/\/$/, "");
+        if (normalizedPattern.endsWith("/*")) {
+          const base = normalizedPattern.slice(0, -2);
+          return normalizedPath === base || normalizedPath.startsWith(base + "/");
+        }
+        return normalizedPath === normalizedPattern;
+      }, "matchesPathPattern"));
+      /**
+       * Checks if the given path matches any of the configured cueCardPaths.
+       */
+      __publicField(this, "isPathAllowedForCueCard", /* @__PURE__ */ __name((path) => this.cueCardPaths.some((pattern) => this.matchesPathPattern(path, pattern)), "isPathAllowedForCueCard"));
       __publicField(this, "isInputElement", /* @__PURE__ */ __name((el) => {
         if (!(el instanceof HTMLInputElement) && !(el instanceof HTMLTextAreaElement) && !(el instanceof HTMLSelectElement))
           return false;
@@ -2675,6 +2698,7 @@ var KenobiLib = (() => {
                 this.undoAll();
                 void this.startAutoTransform();
               }
+              this.syncCueCardVisibility();
             }
           });
         }, "schedule");
@@ -3037,21 +3061,74 @@ var KenobiLib = (() => {
       ----
       */
       /**
-       * Initializes and mounts a CueCard with default configuration.
+       * Fetches the CueCard configuration from the API to check if an active
+       * template exists for the given path.
+       *
+       * @param pagePath - The page path to check for active template
+       * @returns The config response, or null if the request failed
+       */
+      __publicField(this, "fetchCueCardConfig", /* @__PURE__ */ __name(async (pagePath) => {
+        if (!this.config.publicKey) return null;
+        try {
+          const searchParams = new URLSearchParams({
+            publicKey: this.config.publicKey,
+            pagePath
+          });
+          const response = await fetch(
+            `${this.config.apiHost}/v1/cue-card-config?${searchParams.toString()}`
+          );
+          if (!response.ok) {
+            this.log(
+              "warn",
+              `CueCard config request failed with status ${response.status}`
+            );
+            return null;
+          }
+          const data = await response.json();
+          if (!isCueCardConfigResponse(data)) {
+            this.log("warn", "Invalid CueCard config response format");
+            return null;
+          }
+          return data;
+        } catch (error) {
+          this.log("error", "Failed to fetch CueCard config:", error);
+          return null;
+        }
+      }, "fetchCueCardConfig"));
+      /**
+       * Initializes and mounts a CueCard with configuration from the API.
        * Called automatically when publicKey is provided.
        *
-       * Default config matches the template editor settings.
-       * Future: This config will be fetched per-org from the database.
+       * The CueCard will only be mounted if an active template exists for
+       * the current path on the server.
        */
-      __publicField(this, "initCueCard", /* @__PURE__ */ __name(() => {
+      __publicField(this, "initCueCard", /* @__PURE__ */ __name(async () => {
         if (this.cueCardInstance) {
           this.log("warn", "CueCard already initialized, skipping...");
           return;
         }
+        if (!this.isPathAllowedForCueCard(this.currentPath)) {
+          this.log(
+            "debug",
+            `CueCard not mounted: path "${this.currentPath}" not in allowed paths`
+          );
+          return;
+        }
+        const configResponse = await this.fetchCueCardConfig(this.currentPath);
+        if (!configResponse || !configResponse.enabled) {
+          this.log(
+            "debug",
+            `CueCard not mounted: no active template for path "${this.currentPath}"`
+          );
+          return;
+        }
+        this.log("debug", "Active template found, mounting CueCard...");
+        const serverConfig = configResponse.config;
         this.cueCardInstance = new CueCard({
-          theme: "light",
-          position: "top-center",
-          fields: [
+          theme: serverConfig?.theme ?? "light",
+          position: serverConfig?.position ?? "top-center",
+          direction: serverConfig?.direction ?? "top-to-bottom",
+          fields: serverConfig?.fields ?? [
             {
               name: "companyDomain",
               label: "Company Name or Domain",
@@ -3062,10 +3139,12 @@ var KenobiLib = (() => {
             }
           ],
           isVisible: true,
-          enableFocusMode: false,
-          showWatermark: false,
-          showKeyboardHints: true,
-          enableLauncher: true,
+          enableFocusMode: serverConfig?.enableFocusMode ?? false,
+          showWatermark: serverConfig?.showWatermark ?? false,
+          showKeyboardHints: serverConfig?.showKeyboardHints ?? true,
+          enableLauncher: serverConfig?.enableLauncher ?? true,
+          customTheme: serverConfig?.customTheme,
+          textOverrides: serverConfig?.textOverrides,
           onDismiss: /* @__PURE__ */ __name(() => {
             this.log("debug", "CueCard dismissed by user");
           }, "onDismiss"),
@@ -3080,6 +3159,29 @@ var KenobiLib = (() => {
         this.cueCardInstance.mount();
         this.log("debug", "CueCard mounted successfully");
       }, "initCueCard"));
+      /**
+       * Syncs CueCard visibility based on the current path.
+       * Mounts CueCard if on an allowed path and active template exists, unmounts if not.
+       * Called after navigation changes.
+       */
+      __publicField(this, "syncCueCardVisibility", /* @__PURE__ */ __name(() => {
+        if (!this.config.publicKey) return;
+        const isAllowed = this.isPathAllowedForCueCard(this.currentPath);
+        if (isAllowed && !this.cueCardInstance) {
+          this.log(
+            "debug",
+            `Navigated to allowed path "${this.currentPath}", checking for active template...`
+          );
+          void this.initCueCard();
+        } else if (!isAllowed && this.cueCardInstance) {
+          this.log(
+            "debug",
+            `Navigated away from allowed paths to "${this.currentPath}", unmounting CueCard`
+          );
+          this.cueCardInstance.unmount();
+          this.cueCardInstance = null;
+        }
+      }, "syncCueCardVisibility"));
       /**
        * Triggers personalization by calling the API with the provided input.
        * Updates CueCard status during the flow and applies transformations.
@@ -3158,6 +3260,7 @@ var KenobiLib = (() => {
         this.config.transitionDefaults
       );
       this.orchestrator = new TransitionOrchestrator();
+      this.cueCardPaths = this.config.cueCardPaths ?? ["/"];
       this.syncVisitorKey();
       this.currentPath = this.getCurrentPath();
       this.currentUrl = this.getCurrentUrl();
@@ -3176,8 +3279,8 @@ var KenobiLib = (() => {
         void this.startAutoTransform();
       }
       if (this.config.publicKey) {
-        this.log("debug", "Public key provided, auto-mounting CueCard...");
-        this.initCueCard();
+        this.log("debug", "Public key provided, checking for active template...");
+        void this.initCueCard();
       }
     }
   };