kenobi-js 0.1.43 → 0.1.44

package/browser/dist.js

@@ -1333,8 +1333,6 @@ var KenobiLib = (() => {
   .backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0); backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); transition: all 0.5s ease; z-index: 0; pointer-events: none; }
   .backdrop.active { background: rgba(0,0,0,0.1); backdrop-filter: blur(var(--kb-focus-blur)); -webkit-backdrop-filter: blur(var(--kb-focus-blur)); }
   .launcher { position: absolute; pointer-events: auto; background-color: var(--kb-bg-container); border: 1px solid var(--kb-border-container); box-shadow: var(--kb-shadow-container); backdrop-filter: blur(var(--kb-backdrop-blur)); -webkit-backdrop-filter: blur(var(--kb-backdrop-blur)); border-radius: 9999px; padding: 0.5rem 1rem; display: flex; align-items: center; gap: 0.75rem; cursor: pointer; transition: transform 0.2s, opacity 0.3s; opacity: 0; z-index: 1; color: var(--kb-text-title); font-weight: 500; font-size: 0.875rem; font-family: var(--kb-font-family); }
-  .launcher .kbd-hint .kbd { background: var(--kb-kbd-bg); border: 1px solid var(--kb-kbd-border); color: var(--kb-kbd-text); }
-  .launcher .kbd-hint .kbd-text { color: var(--kb-kbd-text); }
   .launcher:hover { transform: scale(1.02); background-color: var(--kb-bg-container); }
   .kb-chip-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
   .kb-chip { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.35rem 0.8rem; border-radius: 9999px; border: 1px solid rgba(255,255,255,0.85); background: linear-gradient(135deg, rgba(255,255,255,0.28), rgba(255,255,255,0.08)); color: var(--kb-text-title); font-size: 0.8rem; font-weight: 600; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 8px 18px rgba(0,0,0,0.4), inset 0 0 0 1px rgba(255,255,255,0.45); }
@@ -1409,19 +1407,17 @@ var KenobiLib = (() => {
   .popover-watermark { position: absolute; top: 100%; left: 0; right: 0; text-align: center; font-size: 0.625rem; color: var(--kb-watermark-text); opacity: 0.6; font-weight: 500; letter-spacing: 0.025em; padding-top: 0.5rem; }
   .popover-watermark a { color: inherit; text-decoration: none; cursor: pointer; }
   .popover-watermark a:hover { text-decoration: underline; opacity: 1; }
-  /* Launcher hint positioning */
-  .launcher .kbd-hint { position: static; transform: none; opacity: 0.6; transition: opacity 0.2s; }
-  .launcher:hover .kbd-hint { opacity: 1; }
-  .pos-top-right.launcher .kbd-hint { left: auto; right: auto; }
+  /* Launcher helper hint (below launcher) */
+  .launcher-hint { position: absolute; top: calc(100% + 0.4rem); left: 50%; transform: translateX(-50%); pointer-events: none; white-space: nowrap; }
+  .launcher-hint.visible { opacity: 0.65; }
   /* Launcher dismiss button */
   .launcher .btn-dismiss.launcher-dismiss { top: -0.375rem; left: -0.375rem; width: 1.25rem; height: 1.25rem; opacity: 0; transition: opacity 0.2s ease-out, background-color 0.3s ease-out, color 0.3s ease-out; }
   .launcher:hover .btn-dismiss.launcher-dismiss { opacity: 1; }
   /* Launcher logo */
   .launcher-logo { width: 20px; height: 20px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
   .launcher-logo svg { width: 20px; height: 20px; }
-  /* Mobile: hide keyboard hints, show dismiss button */
+  /* Mobile: show dismiss button */
   @media (max-width: 768px) {
-    .launcher .kbd-hint { display: none; }
     .launcher .btn-dismiss.launcher-dismiss { opacity: 1; }
   }
   /* Toggle personalization button */
@@ -1431,6 +1427,11 @@ var KenobiLib = (() => {
   /* Custom tooltip for toggle button */
   .btn-toggle-personalization .toggle-tooltip { position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); white-space: nowrap; background-color: var(--kb-bg-container); border: 1px solid var(--kb-border-container); color: var(--kb-text-title); font-size: 0.7rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 4px; opacity: 0; visibility: hidden; transition: opacity 0.15s ease-out, visibility 0.15s ease-out; pointer-events: none; z-index: 100; box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
   .btn-toggle-personalization:hover .toggle-tooltip { opacity: 1; visibility: visible; }
+  .btn-toggle-personalization.loading { cursor: default; opacity: 0.7; }
+  .btn-toggle-personalization.loading:hover { transform: none; }
+  .btn-toggle-personalization:disabled { cursor: default; }
+  .launcher-domain { text-decoration: underline; text-underline-offset: 2px; }
+  .launcher-actions { display: flex; align-items: center; gap: 0.25rem; }
 `;
   var useEnterExitAnimation = /* @__PURE__ */ __name((ref, isVisible, config) => {
     const hasEnteredRef = A2(false);
@@ -1769,19 +1770,35 @@ var KenobiLib = (() => {
       config.onDismiss,
       isPopoverEnabled
     ]);
+    const [isMobile, setIsMobile] = d2(false);
     const isMac = typeof navigator !== "undefined" && /Mac/.test(navigator.userAgent);
-    const shortcutDisplay = (() => {
+    y2(() => {
+      if (typeof window === "undefined") return;
+      const media = window.matchMedia("(max-width: 768px)");
+      const update = /* @__PURE__ */ __name(() => setIsMobile(media.matches), "update");
+      update();
+      if ("addEventListener" in media) {
+        media.addEventListener("change", update);
+        return () => media.removeEventListener("change", update);
+      }
+      window.addEventListener("resize", update);
+      return () => window.removeEventListener("resize", update);
+    }, []);
+    const launcherHint = (() => {
+      if (isMobile) {
+        return { keys: [], label: "tap to launch" };
+      }
       if (config.keyboardShortcut) {
         const mods = config.keyboardShortcut.modifiers || [];
         const keys = [];
-        if (mods.includes("meta")) keys.push(isMac ? "\u2318" : "Win");
+        if (mods.includes("meta")) keys.push(isMac ? "\u2318" : "Ctrl");
         if (mods.includes("ctrl")) keys.push("Ctrl");
         if (mods.includes("alt")) keys.push(isMac ? "Opt" : "Alt");
         if (mods.includes("shift")) keys.push("Shift");
         keys.push(config.keyboardShortcut.key.toUpperCase());
-        return keys;
+        return { keys, label: "to launch" };
       }
-      return [isMac ? "\u2318" : "Ctrl", "P"];
+      return { keys: [isMac ? "\u2318" : "Ctrl", "P"], label: "to launch" };
     })();
     const [logoFailed, setLogoFailed] = d2(false);
     const [logoAttempt, setLogoAttempt] = d2(
@@ -2057,6 +2074,7 @@ var KenobiLib = (() => {
     const isContainerVisible = !!config.isVisible && mode === "card" && !isDismissed;
     const isLauncherVisible = !!config.isVisible && mode === "launcher" && !isDismissed;
     const isAnythingVisible = isContainerVisible || isLauncherVisible;
+    const showLauncherHint = !!config.showKeyboardHints && isLauncherVisible;
     return /* @__PURE__ */ u3(k, { children: [
       /* @__PURE__ */ u3(
         "div",
@@ -2254,25 +2272,55 @@ var KenobiLib = (() => {
             ),
             config.showLauncherLogo !== false && /* @__PURE__ */ u3("div", { class: "launcher-logo", children: /* @__PURE__ */ u3(LogoIcon, {}) }),
             /* @__PURE__ */ u3("div", { class: "launcher-label", children: [
-              /* @__PURE__ */ u3("span", { children: launcherLabelText }),
+              /* @__PURE__ */ u3("span", { children: (() => {
+                const forMatch = launcherLabelText.match(/^(For\s+)(.+)$/i);
+                if (forMatch) {
+                  return /* @__PURE__ */ u3(k, { children: [
+                    forMatch[1],
+                    /* @__PURE__ */ u3("span", { class: "launcher-domain", children: forMatch[2] })
+                  ] });
+                }
+                return launcherLabelText;
+              })() }),
               isDeanonymized && renderDeanonymizedChip("launcher")
             ] }),
-            config.enableUndoToggle && hasHadSuccess && /* @__PURE__ */ u3(
-              "button",
-              {
-                class: "btn-toggle-personalization",
-                "aria-label": config.isPersonalized ? "Show original" : "Show personalized",
-                onClick: (e3) => {
-                  e3.stopPropagation();
-                  config.onTogglePersonalization?.();
-                },
-                children: [
-                  /* @__PURE__ */ u3(ArrowPathIcon, {}),
-                  /* @__PURE__ */ u3("span", { class: "toggle-tooltip", children: config.isPersonalized ? "Show original" : "Show personalized" })
-                ]
-              }
-            ),
-            config.showKeyboardHints && /* @__PURE__ */ u3("div", { class: "kbd-hint visible", children: /* @__PURE__ */ u3("div", { class: "kbd-group", children: shortcutDisplay.map((k3, i3) => /* @__PURE__ */ u3("div", { class: "kbd", children: k3 }, i3)) }) })
+            /* @__PURE__ */ u3("div", { class: "launcher-actions", children: [
+              config.enableUndoToggle && hasHadSuccess && /* @__PURE__ */ u3(
+                "button",
+                {
+                  class: "btn-toggle-personalization",
+                  "aria-label": config.isPersonalized ? "Show original" : "Show personalized",
+                  onClick: (e3) => {
+                    e3.stopPropagation();
+                    config.onTogglePersonalization?.();
+                  },
+                  children: [
+                    /* @__PURE__ */ u3(ArrowPathIcon, {}),
+                    /* @__PURE__ */ u3("span", { class: "toggle-tooltip", children: config.isPersonalized ? "Show original" : "Show personalized" })
+                  ]
+                }
+              ),
+              config.launcherAction && config.launcherAction.status !== "idle" && hasHadSuccess && /* @__PURE__ */ u3(
+                "button",
+                {
+                  class: `btn-toggle-personalization${config.launcherAction.status === "loading" ? " loading" : ""}`,
+                  "aria-label": config.launcherAction.tooltip || "Action",
+                  onClick: (e3) => {
+                    e3.stopPropagation();
+                    config.launcherAction?.onClick?.();
+                  },
+                  disabled: config.launcherAction.status === "loading",
+                  children: [
+                    config.launcherAction.status === "loading" ? /* @__PURE__ */ u3(LoaderIcon, {}) : /* @__PURE__ */ u3(ArrowRightIcon, {}),
+                    config.launcherAction.tooltip && /* @__PURE__ */ u3("span", { class: "toggle-tooltip", children: config.launcherAction.tooltip })
+                  ]
+                }
+              )
+            ] }),
+            showLauncherHint && /* @__PURE__ */ u3("div", { class: "kbd-hint visible launcher-hint", "aria-hidden": "true", children: [
+              launcherHint.keys.length > 0 && /* @__PURE__ */ u3("div", { class: "kbd-group", children: launcherHint.keys.map((key, index) => /* @__PURE__ */ u3("div", { class: "kbd", children: key }, index)) }),
+              /* @__PURE__ */ u3("span", { class: "kbd-text", children: launcherHint.label })
+            ] })
           ]
         }
       )
@@ -3965,7 +4013,7 @@ var KenobiLib = (() => {
       __publicField(this, "personalize", /* @__PURE__ */ __name(async (input) => {
         if (!this.config.publicKey) {
           this.log("error", "Cannot personalize: publicKey not configured");
-          return;
+          return null;
         }
         const startTime = /* @__PURE__ */ new Date();
         this.log("debug", "Starting personalization with input:", input);
@@ -4013,6 +4061,7 @@ var KenobiLib = (() => {
             source: prepared ? "prefetch" : "api",
             deanonymized: isDeanonymizedInput
           });
+          return result;
         } catch (error) {
           this.log("error", "Personalization failed:", error);
           if (this.cueCardInstance) {
@@ -4025,6 +4074,7 @@ var KenobiLib = (() => {
             deanonymized: isDeanonymizedInput
           });
         }
+        return null;
       }, "personalize"));
       /**
        * Returns the CueCard instance if one was auto-mounted.