@syntrologie/runtime-sdk 2.14.0 → 2.16.0

package/dist/index.js

@@ -1,6 +1,7 @@
 import {
   ANIMATION_KEYFRAMES,
   AppRegistry,
+  COOKIE_NAME,
   CanvasEvents,
   ContextManager,
   DEFAULT_COOLDOWN,
@@ -21,6 +22,9 @@ import {
   SessionMetricTracker,
   ShadowCanvasOverlay,
   ShadowRootProvider,
+  ShopifyAdapter,
+  ShopifyAntiFlicker,
+  ShopifyPixelBridge,
   SmartCanvasApp,
   SmartCanvasController,
   SmartCanvasElement,
@@ -31,7 +35,6 @@ import {
   WidgetRegistry,
   appRegistry,
   applyStaticSlotStyles,
-  base,
   cleanupAppContext,
   createActionEngine,
   createAnchorResolver,
@@ -54,6 +57,7 @@ import {
   createSurfaceContainer,
   createSurfaces,
   decodeToken,
+  detectPlatform,
   encodeToken,
   evaluate,
   evaluateCondition,
@@ -76,8 +80,6 @@ import {
   normalizePostHogEvent,
   playEnterAnimation,
   playExitAnimation,
-  purple,
-  red,
   registerConfigPredicates,
   registerSmartCanvasElement,
   resolveConfigUri,
@@ -86,7 +88,6 @@ import {
   setupAdjacentPositioning,
   setupInlinePositioning,
   shouldNormalizeEvent,
-  slateGrey,
   useDecision,
   useNotifications,
   useNotifyWatcher,
@@ -104,7 +105,13 @@ import {
   validateEventName,
   validateProps,
   widgetRegistry
-} from "./chunk-JCDCANR7.js";
+} from "./chunk-NVV7IWJC.js";
+import {
+  base,
+  purple,
+  red,
+  slateGrey
+} from "./chunk-2IQ2PTLJ.js";
 import {
   AddClassZ,
   AnchorIdZ,
@@ -138,8 +145,8 @@ import {
   WaitZ,
   WidgetConfigZ,
   coreActionStepSchemas
-} from "./chunk-77TNZ66J.js";
-import "./chunk-IR6UOR63.js";
+} from "./chunk-XVRDKBYF.js";
+import "./chunk-GX7BBYX6.js";
 import {
   ActivationConfigZ,
   AnchorVisibleConditionZ,
@@ -164,12 +171,14 @@ import {
   StateEqualsConditionZ,
   TriggerWhenZ,
   ViewportConditionZ,
-  __publicField,
   decisionSchemas,
   validateActivationConfig,
   validateCondition,
   validateStrategy
-} from "./chunk-YLLWLUQX.js";
+} from "./chunk-4HXPGXUC.js";
+import {
+  __publicField
+} from "./chunk-JMHRHAEL.js";
 
 // src/index.ts
 import React4 from "react";
@@ -506,6 +515,342 @@ var ChatAssistantMountableWidget = {
   }
 };
 
+// ../adaptives/adaptive-chatbot/dist/ChatAssistantLit.js
+import { html, LitElement, nothing } from "lit";
+import { styleMap } from "lit/directives/style-map.js";
+var __classPrivateFieldGet = function(receiver, state, kind, f) {
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = function(receiver, state, value, kind, f) {
+  if (kind === "m") throw new TypeError("Private method is not writable");
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value), value;
+};
+var _ChatAssistantElement_instances;
+var _ChatAssistantElement_batchHandle;
+var _ChatAssistantElement_inputEl;
+var _ChatAssistantElement_messageListEl;
+var _ChatAssistantElement_renderBubble;
+var _ChatAssistantElement_handleSubmit;
+var _ChatAssistantElement_sendMessage;
+var TOKEN_PURPLE_4 = "#6a59ce";
+var TOKEN_WHITE = "#ffffff";
+var TOKEN_SLATE_10 = "#cbd0d7";
+var TOKEN_SLATE_12 = "#f6f7f9";
+var TOKEN_SLATE_8 = "#87919f";
+var TOKEN_RED_4 = "#ff2524";
+var _nextId = 0;
+function generateId2() {
+  return `msg-${Date.now()}-${++_nextId}`;
+}
+var containerStyle = {
+  display: "flex",
+  flexDirection: "column",
+  height: "100%",
+  fontFamily: "system-ui, -apple-system, sans-serif",
+  fontSize: "14px",
+  touchAction: "none"
+};
+var messageListStyle = {
+  flex: "1",
+  overflowY: "auto",
+  padding: "12px",
+  display: "flex",
+  flexDirection: "column",
+  gap: "8px"
+};
+var bubbleBaseStyle = {
+  maxWidth: "85%",
+  padding: "8px 12px",
+  borderRadius: "12px",
+  lineHeight: "1.5",
+  wordBreak: "break-word"
+};
+var userBubbleExtra = {
+  alignSelf: "flex-end",
+  backgroundColor: `var(--sc-color-primary, ${TOKEN_PURPLE_4})`,
+  color: `var(--sc-color-primary-text, ${TOKEN_WHITE})`,
+  borderBottomRightRadius: "4px"
+};
+var assistantBubbleExtra = {
+  alignSelf: "flex-start",
+  backgroundColor: "var(--sc-chat-assistant-bubble-bg, rgba(255, 255, 255, 0.08))",
+  color: `var(--sc-content-text-color, ${TOKEN_SLATE_10})`,
+  borderBottomLeftRadius: "4px"
+};
+var loadingDotsStyle = {
+  alignSelf: "flex-start",
+  padding: "8px 16px",
+  backgroundColor: "var(--sc-chat-loading-bg, rgba(255, 255, 255, 0.05))",
+  borderRadius: "12px",
+  color: `var(--sc-content-text-secondary-color, ${TOKEN_SLATE_8})`,
+  fontSize: "13px"
+};
+var errorBannerStyle = {
+  padding: "8px 12px",
+  backgroundColor: "var(--sc-color-error-bg, rgba(239, 68, 68, 0.1))",
+  color: `var(--sc-color-error, ${TOKEN_RED_4})`,
+  fontSize: "13px",
+  borderRadius: "8px",
+  margin: "0 12px"
+};
+var inputFormStyle = {
+  display: "flex",
+  gap: "8px",
+  padding: "12px",
+  borderTop: "1px solid var(--sc-content-border-color, rgba(255, 255, 255, 0.06))"
+};
+var inputStyle = {
+  flex: "1",
+  padding: "8px 12px",
+  borderRadius: "8px",
+  border: "1px solid var(--sc-content-border-color, rgba(255, 255, 255, 0.1))",
+  backgroundColor: "var(--sc-chat-input-bg, rgba(0, 0, 0, 0.2))",
+  color: `var(--sc-content-heading-color, ${TOKEN_SLATE_12})`,
+  fontSize: "14px",
+  outline: "none",
+  fontFamily: "inherit"
+};
+var sendButtonStyle = {
+  padding: "8px 16px",
+  borderRadius: "8px",
+  border: "none",
+  backgroundColor: `var(--sc-color-primary, ${TOKEN_PURPLE_4})`,
+  color: `var(--sc-color-primary-text, ${TOKEN_WHITE})`,
+  fontWeight: "600",
+  fontSize: "13px",
+  cursor: "pointer",
+  whiteSpace: "nowrap"
+};
+var sendButtonDisabledExtra = {
+  opacity: "0.5",
+  cursor: "not-allowed"
+};
+var ChatAssistantElement = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    _ChatAssistantElement_instances.add(this);
+    this.config = void 0;
+    this.runtime = void 0;
+    this.tileId = "chatbot-widget";
+    this._messages = [];
+    this._isLoading = false;
+    this._error = null;
+    _ChatAssistantElement_batchHandle.set(this, null);
+    _ChatAssistantElement_inputEl.set(this, null);
+    _ChatAssistantElement_messageListEl.set(this, null);
+    _ChatAssistantElement_handleSubmit.set(this, (e) => {
+      var _a2;
+      e.preventDefault();
+      const input = (_a2 = __classPrivateFieldGet(this, _ChatAssistantElement_inputEl, "f")) != null ? _a2 : this.querySelector("[data-chat-input]");
+      if (!input || !input.value.trim() || this._isLoading)
+        return;
+      const text = input.value;
+      input.value = "";
+      __classPrivateFieldGet(this, _ChatAssistantElement_instances, "m", _ChatAssistantElement_sendMessage).call(this, text);
+    });
+  }
+  createRenderRoot() {
+    return this;
+  }
+  // ---------- Lifecycle: connectedCallback --------------------------------
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  // ---------- Lifecycle: disconnectedCallback -----------------------------
+  disconnectedCallback() {
+    var _a2;
+    super.disconnectedCallback();
+    if ((_a2 = __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f")) == null ? void 0 : _a2.isApplied()) {
+      __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f").revertAll().catch((err) => {
+        console.error("[ChatAssistantElement] Failed to revert actions on disconnect:", err);
+      });
+      __classPrivateFieldSet(this, _ChatAssistantElement_batchHandle, null, "f");
+    }
+  }
+  // ---------- Lifecycle: firstUpdated -------------------------------------
+  firstUpdated() {
+    __classPrivateFieldSet(this, _ChatAssistantElement_inputEl, this.querySelector("[data-chat-input]"), "f");
+    __classPrivateFieldSet(this, _ChatAssistantElement_messageListEl, this.querySelector("[data-message-list]"), "f");
+  }
+  // ---------- Lifecycle: updated ------------------------------------------
+  updated(changed) {
+    var _a2;
+    if (changed.has("_messages") || changed.has("_isLoading")) {
+      if (__classPrivateFieldGet(this, _ChatAssistantElement_messageListEl, "f")) {
+        __classPrivateFieldGet(this, _ChatAssistantElement_messageListEl, "f").scrollTop = __classPrivateFieldGet(this, _ChatAssistantElement_messageListEl, "f").scrollHeight;
+      }
+    }
+    if (changed.has("config") && ((_a2 = this.config) == null ? void 0 : _a2.greeting) && this._messages.length === 0) {
+      this._messages = [
+        {
+          id: generateId2(),
+          role: "assistant",
+          text: this.config.greeting,
+          timestamp: Date.now()
+        }
+      ];
+    }
+  }
+  // ---------- Render -------------------------------------------------------
+  render() {
+    return html`
+      <div style=${styleMap(containerStyle)} data-testid="chat-assistant">
+        <!-- Message list -->
+        <div style=${styleMap(messageListStyle)} data-message-list>
+          ${this._messages.map((msg) => __classPrivateFieldGet(this, _ChatAssistantElement_instances, "m", _ChatAssistantElement_renderBubble).call(this, msg))}
+          ${this._isLoading ? html`<div style=${styleMap(loadingDotsStyle)}>Thinking...</div>` : nothing}
+        </div>
+
+        <!-- Error banner -->
+        ${this._error ? html`<div style=${styleMap(errorBannerStyle)}>${this._error}</div>` : nothing}
+
+        <!-- Composer -->
+        <form
+          style=${styleMap(inputFormStyle)}
+          @submit=${__classPrivateFieldGet(this, _ChatAssistantElement_handleSubmit, "f")}
+        >
+          <input
+            data-chat-input
+            style=${styleMap(inputStyle)}
+            placeholder="Ask anything..."
+            ?disabled=${this._isLoading}
+            data-testid="chat-input"
+          />
+          <button
+            type="submit"
+            ?disabled=${this._isLoading}
+            style=${styleMap(this._isLoading ? { ...sendButtonStyle, ...sendButtonDisabledExtra } : sendButtonStyle)}
+            data-testid="chat-send"
+          >
+            Send
+          </button>
+        </form>
+      </div>
+    `;
+  }
+  // ---------- Public API --------------------------------------------------
+  /** Programmatically clear the conversation (mirrors useChat.clearMessages) */
+  clearMessages() {
+    var _a2;
+    this._messages = [];
+    this._error = null;
+    if ((_a2 = __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f")) == null ? void 0 : _a2.isApplied()) {
+      __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f").revertAll().catch((err) => {
+        console.error("[ChatAssistantElement] Failed to revert actions on clear:", err);
+      });
+      __classPrivateFieldSet(this, _ChatAssistantElement_batchHandle, null, "f");
+    }
+    sessionStorage.removeItem(`syntro:chatbot:history:${this.tileId}`);
+  }
+};
+_ChatAssistantElement_batchHandle = /* @__PURE__ */ new WeakMap(), _ChatAssistantElement_inputEl = /* @__PURE__ */ new WeakMap(), _ChatAssistantElement_messageListEl = /* @__PURE__ */ new WeakMap(), _ChatAssistantElement_handleSubmit = /* @__PURE__ */ new WeakMap(), _ChatAssistantElement_instances = /* @__PURE__ */ new WeakSet(), _ChatAssistantElement_renderBubble = function _ChatAssistantElement_renderBubble2(msg) {
+  const isUser = msg.role === "user";
+  const bubbleStyle = isUser ? { ...bubbleBaseStyle, ...userBubbleExtra } : { ...bubbleBaseStyle, ...assistantBubbleExtra };
+  return html`<div style=${styleMap(bubbleStyle)}>${msg.text}</div>`;
+}, _ChatAssistantElement_sendMessage = // ---------- Message sending logic (replaces useChat) --------------------
+async function _ChatAssistantElement_sendMessage2(text) {
+  var _a2, _b;
+  const trimmed = text.trim();
+  if (!trimmed || !this.config || !this.runtime)
+    return;
+  this._error = null;
+  const userMessage = {
+    id: generateId2(),
+    role: "user",
+    text: trimmed,
+    timestamp: Date.now()
+  };
+  this._messages = [...this._messages, userMessage];
+  this._isLoading = true;
+  this.dispatchEvent(new CustomEvent("chat-message-sent", {
+    detail: { text: trimmed },
+    bubbles: true
+  }));
+  try {
+    const maxHistory = (_a2 = this.config.maxHistory) != null ? _a2 : 20;
+    const historySlice = [...this._messages].slice(-maxHistory).map((m2) => ({
+      role: m2.role,
+      content: m2.text
+    }));
+    const response = await sendMessage(this.config.backendUrl, {
+      message: trimmed,
+      history: historySlice,
+      mlflow_run_id: this.config.mlflowRunId
+    });
+    const { displayText, actions } = parseActions(response.response);
+    const assistantMessage = {
+      id: generateId2(),
+      role: "assistant",
+      text: displayText,
+      timestamp: Date.now()
+    };
+    this._messages = [...this._messages, assistantMessage];
+    if (actions.length > 0) {
+      if ((_b = __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f")) == null ? void 0 : _b.isApplied()) {
+        await __classPrivateFieldGet(this, _ChatAssistantElement_batchHandle, "f").revertAll();
+      }
+      __classPrivateFieldSet(this, _ChatAssistantElement_batchHandle, await this.runtime.actions.applyBatch(actions), "f");
+      this.runtime.events.publish("chatbot.actions_applied", {
+        count: actions.length,
+        kinds: actions.map((a) => a.kind),
+        tileId: this.tileId
+      });
+    }
+    this.dispatchEvent(new CustomEvent("chat-response-received", {
+      detail: { text: displayText, actions },
+      bubbles: true
+    }));
+  } catch (err) {
+    const message = err instanceof Error ? err.message : "An unexpected error occurred";
+    this._error = message;
+  } finally {
+    this._isLoading = false;
+  }
+};
+ChatAssistantElement.properties = {
+  // Public inputs
+  config: { attribute: false },
+  runtime: { attribute: false },
+  tileId: { type: String },
+  // Internal reactive state
+  _messages: { state: true },
+  _isLoading: { state: true },
+  _error: { state: true }
+};
+var TAG_NAME = "syntro-chat-assistant";
+var registerChatAssistantElement = () => {
+  if (typeof window === "undefined")
+    return;
+  if (!customElements.get(TAG_NAME)) {
+    customElements.define(TAG_NAME, ChatAssistantElement);
+  }
+};
+var ChatAssistantLitMountable = {
+  mount(container, mountConfig) {
+    const { config, runtime: runtime7, tileId = "chatbot-widget" } = mountConfig != null ? mountConfig : {};
+    if (!config || !runtime7) {
+      container.innerHTML = `<div style="padding: 16px; color: var(--sc-content-text-secondary-color, ${TOKEN_SLATE_8});">Chat widget requires config and runtime.</div>`;
+      return () => {
+        container.innerHTML = "";
+      };
+    }
+    registerChatAssistantElement();
+    const el = document.createElement("syntro-chat-assistant");
+    el.config = config;
+    el.runtime = runtime7;
+    el.tileId = tileId;
+    el.style.cssText = "display:flex;flex-direction:column;height:100%;width:100%;";
+    container.appendChild(el);
+    return () => {
+      el.remove();
+    };
+  }
+};
+
 // ../adaptives/adaptive-chatbot/dist/runtime.js
 var runtime3 = {
   id: "adaptive-chatbot",
@@ -524,6 +869,15 @@ var runtime3 = {
         description: "AI-powered chat assistant that can execute DOM actions",
         icon: "\u{1F4AC}"
       }
+    },
+    {
+      id: "adaptive-chatbot:assistant-lit",
+      component: ChatAssistantLitMountable,
+      metadata: {
+        name: "Chat Assistant (Lit)",
+        description: "Lit web component chat assistant \u2014 no React dependency",
+        icon: "\u{1F4AC}"
+      }
     }
   ]
 };
@@ -2057,19 +2411,19 @@ function getAnswerText(answer) {
 }
 function renderAnswer(answer) {
   if (typeof answer === "string") {
-    const html2 = marked.parse(answer);
+    const html5 = marked.parse(answer);
     return (
       // biome-ignore lint/security/noDangerouslySetInnerHtml: content is CMS/config content, not user-controlled input
-      _jsx2("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html2 } })
+      _jsx2("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html5 } })
     );
   }
   if (answer.type === "rich") {
     return _jsx2("div", { style: { margin: 0 }, dangerouslySetInnerHTML: { __html: answer.html } });
   }
-  const html = marked.parse(answer.content);
+  const html4 = marked.parse(answer.content);
   return (
     // biome-ignore lint/security/noDangerouslySetInnerHtml: markdown content is CMS/config content, not user-controlled input
-    _jsx2("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html } })
+    _jsx2("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html4 } })
   );
 }
 function resolveFeedbackConfig(feedback) {
@@ -2299,7 +2653,7 @@ function FAQWidget({ config, runtime: runtime7, instanceId }) {
       value
     });
   }, [runtime7.events]);
-  const containerStyle = {
+  const containerStyle2 = {
     ...baseStyles.container,
     ...themeStyles[resolvedTheme].container
   };
@@ -2317,9 +2671,9 @@ function FAQWidget({ config, runtime: runtime7, instanceId }) {
   };
   const renderItems = (items) => items.map((q2, index) => _jsx2(FAQItem, { item: q2, isExpanded: expandedIds.has(q2.config.id), isHighlighted: highlightId === q2.config.id, isLast: index === items.length - 1, onToggle: () => handleToggle(q2.config.id), theme: resolvedTheme, feedbackConfig, feedbackValue: feedbackState.get(q2.config.id), onFeedback: handleFeedback }, q2.config.id));
   if (visibleQuestions.length === 0) {
-    return _jsx2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: _jsx2("div", { style: emptyStateStyle, children: "You're all set for now! We'll surface answers here when they're relevant to what you're doing." }) });
+    return _jsx2("div", { style: containerStyle2, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: _jsx2("div", { style: emptyStateStyle, children: "You're all set for now! We'll surface answers here when they're relevant to what you're doing." }) });
   }
-  return _jsxs2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: [config.searchable && _jsxs2("div", { style: baseStyles.searchWrapper, children: [_jsx2("style", { children: `[data-adaptive-id="${instanceId}"] input::placeholder { color: var(--sc-content-search-color, inherit); opacity: 0.7; }` }), _jsx2("input", { type: "text", placeholder: "Search questions...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), style: searchInputStyle })] }), _jsx2("div", { style: baseStyles.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs2(React2.Fragment, { children: [category && _jsx2("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(filteredQuestions) }), config.searchable && filteredQuestions.length === 0 && searchQuery && _jsxs2("div", { style: { ...baseStyles.noResults, ...themeStyles[resolvedTheme].emptyState }, children: ['No questions found matching "', searchQuery, '"'] })] });
+  return _jsxs2("div", { style: containerStyle2, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: [config.searchable && _jsxs2("div", { style: baseStyles.searchWrapper, children: [_jsx2("style", { children: `[data-adaptive-id="${instanceId}"] input::placeholder { color: var(--sc-content-search-color, inherit); opacity: 0.7; }` }), _jsx2("input", { type: "text", placeholder: "Search questions...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), style: searchInputStyle })] }), _jsx2("div", { style: baseStyles.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs2(React2.Fragment, { children: [category && _jsx2("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(filteredQuestions) }), config.searchable && filteredQuestions.length === 0 && searchQuery && _jsxs2("div", { style: { ...baseStyles.noResults, ...themeStyles[resolvedTheme].emptyState }, children: ['No questions found matching "', searchQuery, '"'] })] });
 }
 var FAQMountableWidget = {
   mount(container, config) {
@@ -2343,6 +2697,485 @@ var FAQMountableWidget = {
   }
 };
 
+// ../adaptives/adaptive-faq/dist/FAQWidgetLit.js
+import { html as html2, LitElement as LitElement2, nothing as nothing2 } from "lit";
+import { styleMap as styleMap2 } from "lit/directives/style-map.js";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+function sm(styles2) {
+  return styles2;
+}
+var marked2 = new B({ async: false, gfm: true, breaks: true });
+function getAnswerText2(answer) {
+  if (typeof answer === "string")
+    return answer;
+  if (answer.type === "rich")
+    return answer.html;
+  return answer.content;
+}
+function renderAnswerHtml(answer) {
+  if (typeof answer === "string") {
+    return marked2.parse(answer);
+  }
+  if (answer.type === "rich") {
+    return answer.html;
+  }
+  return marked2.parse(answer.content);
+}
+function resolveFeedbackConfig2(feedback) {
+  if (!feedback)
+    return null;
+  if (feedback === true)
+    return { style: "thumbs" };
+  return feedback;
+}
+function getFeedbackPrompt2(feedbackConfig) {
+  var _a2;
+  return (_a2 = feedbackConfig.prompt) != null ? _a2 : "Was this helpful?";
+}
+function resolveTheme(theme) {
+  var _a2;
+  if (theme && theme !== "auto")
+    return theme;
+  if (typeof window !== "undefined") {
+    return ((_a2 = window.matchMedia) == null ? void 0 : _a2.call(window, "(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+  }
+  return "light";
+}
+var FAQAccordionElement = class extends LitElement2 {
+  constructor() {
+    super(...arguments);
+    this.faqConfig = {
+      expandBehavior: "single",
+      searchable: false,
+      theme: "auto",
+      actions: []
+    };
+    this.runtime = null;
+    this.instanceId = "faq-widget";
+    this._expandedIds = /* @__PURE__ */ new Set();
+    this._highlightId = null;
+    this._searchQuery = "";
+    this._feedbackState = /* @__PURE__ */ new Map();
+    this._hoveredId = null;
+    this._unsubContext = null;
+    this._unsubAccumulator = null;
+    this._unsubCta = null;
+    this._unsubDeepLink = null;
+    this._unsubSessionMetrics = null;
+    this._highlightTimer = null;
+  }
+  // -----------------------------------------------------------------------
+  // Light DOM — no Shadow DOM so CSS variables from the host page apply
+  // -----------------------------------------------------------------------
+  createRenderRoot() {
+    return this;
+  }
+  // -----------------------------------------------------------------------
+  // Lifecycle
+  // -----------------------------------------------------------------------
+  connectedCallback() {
+    super.connectedCallback();
+    this._subscribeAll();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._unsubscribeAll();
+    if (this._highlightTimer !== null) {
+      clearTimeout(this._highlightTimer);
+      this._highlightTimer = null;
+    }
+  }
+  // Re-subscribe when runtime changes (property may be set after connectedCallback)
+  updated(changedProps) {
+    if (changedProps.has("runtime")) {
+      this._unsubscribeAll();
+      this._subscribeAll();
+    }
+  }
+  // -----------------------------------------------------------------------
+  // Subscription management
+  // -----------------------------------------------------------------------
+  _subscribeAll() {
+    var _a2, _b;
+    if (!this.runtime)
+      return;
+    this._unsubContext = this.runtime.context.subscribe(() => {
+      this.requestUpdate();
+    });
+    if ((_a2 = this.runtime.accumulator) == null ? void 0 : _a2.subscribe) {
+      this._unsubAccumulator = this.runtime.accumulator.subscribe(() => {
+        this.requestUpdate();
+      });
+    }
+    if ((_b = this.runtime.sessionMetrics) == null ? void 0 : _b.subscribe) {
+      this._unsubSessionMetrics = this.runtime.sessionMetrics.subscribe(() => {
+        this.requestUpdate();
+      });
+    }
+    if (this.runtime.events.subscribe) {
+      if (this.runtime.events.getRecent) {
+        const recentEvents = this.runtime.events.getRecent({ patterns: ["^action\\.tooltip_cta_clicked$", "^action\\.modal_cta_clicked$"] }, 10);
+        const pendingEvent = recentEvents.filter((e) => {
+          var _a3;
+          const actionId = (_a3 = e.props) == null ? void 0 : _a3.actionId;
+          return typeof actionId === "string" && actionId.startsWith("faq:open:");
+        }).pop();
+        if (pendingEvent && Date.now() - pendingEvent.ts < 1e4) {
+          const questionId = pendingEvent.props.actionId.replace("faq:open:", "");
+          this._expandedIds = /* @__PURE__ */ new Set([questionId]);
+          requestAnimationFrame(() => {
+            const el = document.querySelector(`[data-faq-item-id="${questionId}"]`);
+            if (el)
+              el.scrollIntoView({ behavior: "smooth", block: "center" });
+          });
+        }
+      }
+      this._unsubCta = this.runtime.events.subscribe({ patterns: ["^action\\.tooltip_cta_clicked$", "^action\\.modal_cta_clicked$"] }, (event) => {
+        var _a3, _b2;
+        const actionId = (_a3 = event.props) == null ? void 0 : _a3.actionId;
+        if (typeof actionId !== "string" || !actionId.startsWith("faq:open:"))
+          return;
+        const questionId = actionId.replace("faq:open:", "");
+        this._expandedIds = /* @__PURE__ */ new Set([questionId]);
+        requestAnimationFrame(() => {
+          const el = document.querySelector(`[data-faq-item-id="${questionId}"]`);
+          if (el)
+            el.scrollIntoView({ behavior: "smooth", block: "center" });
+        });
+        (_b2 = this.runtime) == null ? void 0 : _b2.events.publish("canvas.requestOpen");
+      });
+    }
+    if (this.runtime.events.subscribe) {
+      const handleDeepLink = (event) => {
+        var _a3, _b2;
+        const tileId = (_a3 = event.props) == null ? void 0 : _a3.tileId;
+        const itemId = (_b2 = event.props) == null ? void 0 : _b2.itemId;
+        if (tileId !== this.instanceId)
+          return;
+        if (!itemId)
+          return;
+        this._expandedIds = /* @__PURE__ */ new Set([itemId]);
+        this._highlightId = itemId;
+        if (this._highlightTimer !== null)
+          clearTimeout(this._highlightTimer);
+        this._highlightTimer = setTimeout(() => {
+          this._highlightId = null;
+          this._highlightTimer = null;
+        }, 1500);
+        requestAnimationFrame(() => {
+          const el = document.querySelector(`[data-faq-item-id="${itemId}"]`);
+          if (el)
+            el.scrollIntoView({ behavior: "smooth", block: "center" });
+        });
+      };
+      if (this.runtime.events.getRecent) {
+        const recent = this.runtime.events.getRecent({ names: ["notification.deep_link"] }, 5);
+        const pending = recent.filter((e) => {
+          var _a3, _b2;
+          return ((_a3 = e.props) == null ? void 0 : _a3.tileId) === this.instanceId && ((_b2 = e.props) == null ? void 0 : _b2.itemId);
+        }).pop();
+        if (pending && Date.now() - pending.ts < 1e4) {
+          handleDeepLink(pending);
+        }
+      }
+      this._unsubDeepLink = this.runtime.events.subscribe({ names: ["notification.deep_link"] }, handleDeepLink);
+    }
+  }
+  _unsubscribeAll() {
+    var _a2, _b, _c, _d, _e2;
+    (_a2 = this._unsubContext) == null ? void 0 : _a2.call(this);
+    (_b = this._unsubAccumulator) == null ? void 0 : _b.call(this);
+    (_c = this._unsubSessionMetrics) == null ? void 0 : _c.call(this);
+    (_d = this._unsubCta) == null ? void 0 : _d.call(this);
+    (_e2 = this._unsubDeepLink) == null ? void 0 : _e2.call(this);
+    this._unsubContext = null;
+    this._unsubAccumulator = null;
+    this._unsubSessionMetrics = null;
+    this._unsubCta = null;
+    this._unsubDeepLink = null;
+  }
+  // -----------------------------------------------------------------------
+  // Handlers
+  // -----------------------------------------------------------------------
+  _handleToggle(id) {
+    var _a2;
+    const prev = this._expandedIds;
+    let next;
+    if (this.faqConfig.expandBehavior === "single") {
+      next = prev.has(id) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([id]);
+    } else {
+      next = new Set(prev);
+      if (prev.has(id)) {
+        next.delete(id);
+      } else {
+        next.add(id);
+      }
+    }
+    const willBeExpanded = !prev.has(id);
+    this._expandedIds = next;
+    (_a2 = this.runtime) == null ? void 0 : _a2.events.publish("faq:toggled", {
+      instanceId: this.instanceId,
+      questionId: id,
+      expanded: willBeExpanded,
+      timestamp: Date.now()
+    });
+  }
+  _handleFeedback(itemId, question, value) {
+    var _a2;
+    const next = new Map(this._feedbackState);
+    next.set(itemId, value);
+    this._feedbackState = next;
+    (_a2 = this.runtime) == null ? void 0 : _a2.events.publish("faq:feedback", { itemId, question, value });
+  }
+  // -----------------------------------------------------------------------
+  // Computed helpers
+  // -----------------------------------------------------------------------
+  _visibleQuestions() {
+    var _a2;
+    return ((_a2 = this.faqConfig.actions) != null ? _a2 : []).filter((q2) => {
+      if (!q2.triggerWhen)
+        return true;
+      if (!this.runtime)
+        return true;
+      const result = this.runtime.evaluateSync(q2.triggerWhen);
+      return result.value;
+    });
+  }
+  _orderedQuestions(visible) {
+    if (this.faqConfig.ordering === "priority") {
+      return [...visible].sort((a, b2) => {
+        var _a2, _b;
+        return ((_a2 = b2.config.priority) != null ? _a2 : 0) - ((_b = a.config.priority) != null ? _b : 0);
+      });
+    }
+    return visible;
+  }
+  _filteredQuestions(ordered) {
+    const q2 = this._searchQuery.trim().toLowerCase();
+    if (!this.faqConfig.searchable || !q2)
+      return ordered;
+    return ordered.filter((item) => {
+      var _a2;
+      return item.config.question.toLowerCase().includes(q2) || getAnswerText2(item.config.answer).toLowerCase().includes(q2) || ((_a2 = item.config.category) == null ? void 0 : _a2.toLowerCase().includes(q2));
+    });
+  }
+  _categoryGroups(filtered) {
+    const groups = /* @__PURE__ */ new Map();
+    for (const item of filtered) {
+      const cat = item.config.category;
+      if (!groups.has(cat))
+        groups.set(cat, []);
+      groups.get(cat).push(item);
+    }
+    return groups;
+  }
+  // -----------------------------------------------------------------------
+  // Render helpers
+  // -----------------------------------------------------------------------
+  _renderAnswer(answer) {
+    const html_str = renderAnswerHtml(answer);
+    return html2`<div style="margin:0" data-faq-markdown="">${unsafeHTML(html_str)}</div>`;
+  }
+  _renderFeedback(item, feedbackConfig, feedbackValue, theme) {
+    const colors = themeStyles[theme];
+    const feedbackStyle = { ...baseStyles.feedback, ...colors.feedbackPrompt };
+    return html2`
+      <div style=${styleMap2(sm(feedbackStyle))}>
+        <span>${getFeedbackPrompt2(feedbackConfig)}</span>
+        <button
+          type="button"
+          style=${styleMap2(sm({
+      ...baseStyles.feedbackButton,
+      ...feedbackValue === "up" ? baseStyles.feedbackButtonSelected : {}
+    }))}
+          aria-label="Thumbs up"
+          @click=${() => this._handleFeedback(item.config.id, item.config.question, "up")}
+        >\uD83D\uDC4D</button>
+        <button
+          type="button"
+          style=${styleMap2(sm({
+      ...baseStyles.feedbackButton,
+      ...feedbackValue === "down" ? baseStyles.feedbackButtonSelected : {}
+    }))}
+          aria-label="Thumbs down"
+          @click=${() => this._handleFeedback(item.config.id, item.config.question, "down")}
+        >\uD83D\uDC4E</button>
+      </div>
+    `;
+  }
+  _renderItem(item, isLast, theme, feedbackConfig) {
+    const colors = themeStyles[theme];
+    const isExpanded = this._expandedIds.has(item.config.id);
+    const isHighlighted = this._highlightId === item.config.id;
+    const isHovered = this._hoveredId === item.config.id;
+    const itemStyle = {
+      ...baseStyles.item,
+      ...colors.item,
+      ...isExpanded ? colors.itemExpanded : {},
+      ...isHighlighted ? {
+        boxShadow: `0 0 0 2px ${purple[4]}, 0 0 12px rgba(106, 89, 206, 0.4)`,
+        transition: "box-shadow 0.3s ease"
+      } : {},
+      ...!isLast ? { borderBottom: "var(--sc-content-item-divider, none)" } : {}
+    };
+    const questionStyle = {
+      ...baseStyles.question,
+      ...colors.question,
+      ...isHovered ? colors.questionHover : {}
+    };
+    const chevronStyle = {
+      ...baseStyles.chevron,
+      transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)"
+    };
+    const answerStyle = {
+      ...baseStyles.answer,
+      ...colors.answer,
+      maxHeight: isExpanded ? "500px" : "0",
+      paddingBottom: isExpanded ? "16px" : "0"
+    };
+    return html2`
+      <div
+        style=${styleMap2(sm(itemStyle))}
+        data-faq-item-id=${item.config.id}
+      >
+        <button
+          type="button"
+          style=${styleMap2(sm(questionStyle))}
+          aria-expanded=${isExpanded}
+          @click=${() => this._handleToggle(item.config.id)}
+          @mouseenter=${() => {
+      this._hoveredId = item.config.id;
+    }}
+          @mouseleave=${() => {
+      this._hoveredId = null;
+    }}
+        >
+          <span>${item.config.question}</span>
+          <span style=${styleMap2(sm(chevronStyle))}>\u203A</span>
+        </button>
+
+        <div
+          style=${styleMap2(sm(answerStyle))}
+          aria-hidden=${!isExpanded}
+        >
+          ${this._renderAnswer(item.config.answer)}
+          ${isExpanded && feedbackConfig ? this._renderFeedback(item, feedbackConfig, this._feedbackState.get(item.config.id), theme) : nothing2}
+        </div>
+      </div>
+    `;
+  }
+  _renderItems(items, theme, feedbackConfig) {
+    return items.map((item, index) => this._renderItem(item, index === items.length - 1, theme, feedbackConfig));
+  }
+  // -----------------------------------------------------------------------
+  // Render
+  // -----------------------------------------------------------------------
+  render() {
+    const theme = resolveTheme(this.faqConfig.theme);
+    const colors = themeStyles[theme];
+    const feedbackConfig = resolveFeedbackConfig2(this.faqConfig.feedback);
+    const visible = this._visibleQuestions();
+    const ordered = this._orderedQuestions(visible);
+    const filtered = this._filteredQuestions(ordered);
+    const hasCategories = filtered.some((q2) => q2.config.category);
+    const groups = hasCategories ? this._categoryGroups(filtered) : null;
+    const containerStyle2 = {
+      ...baseStyles.container,
+      ...colors.container
+    };
+    const emptyStateStyle = {
+      ...baseStyles.emptyState,
+      ...colors.emptyState
+    };
+    const categoryHeaderStyle = {
+      ...baseStyles.categoryHeader,
+      ...colors.categoryHeader
+    };
+    const searchInputStyle = {
+      ...baseStyles.searchInput,
+      ...colors.searchInput
+    };
+    if (visible.length === 0) {
+      return html2`
+        <div
+          style=${styleMap2(sm(containerStyle2))}
+          data-adaptive-id=${this.instanceId}
+          data-adaptive-type="adaptive-faq"
+        >
+          <div style=${styleMap2(sm(emptyStateStyle))}>
+            You're all set for now! We'll surface answers here when they're relevant to what
+            you're doing.
+          </div>
+        </div>
+      `;
+    }
+    return html2`
+      <div
+        style=${styleMap2(sm(containerStyle2))}
+        data-adaptive-id=${this.instanceId}
+        data-adaptive-type="adaptive-faq"
+      >
+        ${this.faqConfig.searchable ? html2`
+              <div style=${styleMap2(sm(baseStyles.searchWrapper))}>
+                <style>
+                  [data-adaptive-id="${this.instanceId}"] input::placeholder {
+                    color: var(--sc-content-search-color, inherit);
+                    opacity: 0.7;
+                  }
+                </style>
+                <input
+                  type="text"
+                  placeholder="Search questions..."
+                  .value=${this._searchQuery}
+                  style=${styleMap2(sm(searchInputStyle))}
+                  @input=${(e) => {
+      this._searchQuery = e.target.value;
+    }}
+                />
+              </div>
+            ` : nothing2}
+
+        <div style=${styleMap2(sm(baseStyles.accordion))}>
+          ${groups ? Array.from(groups.entries()).map(([category, items]) => html2`
+                  ${category ? html2`
+                        <div
+                          style=${styleMap2(sm(categoryHeaderStyle))}
+                          data-category-header=${category}
+                        >
+                          ${category}
+                        </div>
+                      ` : nothing2}
+                  ${this._renderItems(items, theme, feedbackConfig)}
+                `) : this._renderItems(filtered, theme, feedbackConfig)}
+        </div>
+
+        ${this.faqConfig.searchable && filtered.length === 0 && this._searchQuery ? html2`
+              <div
+                style=${styleMap2(sm({ ...baseStyles.noResults, ...colors.emptyState }))}
+              >
+                No questions found matching &quot;${this._searchQuery}&quot;
+              </div>
+            ` : nothing2}
+      </div>
+    `;
+  }
+};
+FAQAccordionElement.properties = {
+  // Public API — set from the outside
+  faqConfig: { attribute: false },
+  runtime: { attribute: false },
+  instanceId: { type: String },
+  // Internal reactive state (prefixed with _ to signal "private")
+  _expandedIds: { state: true },
+  _highlightId: { state: true },
+  _searchQuery: { state: true },
+  _feedbackState: { state: true },
+  _hoveredId: { state: true }
+};
+if (!customElements.get("syntro-faq-accordion")) {
+  customElements.define("syntro-faq-accordion", FAQAccordionElement);
+}
+
 // ../adaptives/adaptive-faq/dist/runtime.js
 var runtime4 = {
   id: "adaptive-faq",
@@ -2784,7 +3617,7 @@ function NavWidget({ config, runtime: runtime7, instanceId }) {
     pulseElement(el);
     setTimeout(() => el.focus(), 400);
   }, [runtime7.events, instanceId]);
-  const containerStyle = {
+  const containerStyle2 = {
     ...baseStyles2.container,
     ...themeStyles2[resolvedTheme].container
   };
@@ -2798,9 +3631,9 @@ function NavWidget({ config, runtime: runtime7, instanceId }) {
   };
   const renderItems = (items) => items.map((tip, index) => _jsx3(NavTipItem, { item: tip, isExpanded: expandedIds.has(tip.config.id), isLast: index === items.length - 1, onToggle: () => handleToggle(tip.config.id), onNavigate: handleNavigate, onFocusAnchor: handleFocusAnchor, theme: resolvedTheme }, tip.config.id));
   if (visibleTips.length === 0) {
-    return _jsx3("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: emptyStateStyle, children: "You're all set for now! We'll share helpful tips here when they're relevant to what you're doing." }) });
+    return _jsx3("div", { style: containerStyle2, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: emptyStateStyle, children: "You're all set for now! We'll share helpful tips here when they're relevant to what you're doing." }) });
   }
-  return _jsx3("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: baseStyles2.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs3(React3.Fragment, { children: [category && _jsx3("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(visibleTips) }) });
+  return _jsx3("div", { style: containerStyle2, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: baseStyles2.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs3(React3.Fragment, { children: [category && _jsx3("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(visibleTips) }) });
 }
 var NavMountableWidget = {
   mount(container, config) {
@@ -2823,6 +3656,423 @@ var NavMountableWidget = {
   }
 };
 
+// ../adaptives/adaptive-nav/dist/NavWidgetLit.js
+import { html as html3, LitElement as LitElement3, nothing as nothing3 } from "lit";
+import { styleMap as styleMap3 } from "lit/directives/style-map.js";
+import { unsafeHTML as unsafeHTML2 } from "lit/directives/unsafe-html.js";
+var __classPrivateFieldGet2 = function(receiver, state, kind, f) {
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet2 = function(receiver, state, value, kind, f) {
+  if (kind === "m") throw new TypeError("Private method is not writable");
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value), value;
+};
+var _NavWidgetLit_instances;
+var _NavWidgetLit_contextUnsub;
+var _NavWidgetLit_accumulatorUnsub;
+var _NavWidgetLit_subscribeRuntime;
+var _NavWidgetLit_unsubscribeRuntime;
+var _NavWidgetLit_getVisibleTips;
+var _NavWidgetLit_getResolvedTheme;
+var _NavWidgetLit_handleToggle;
+var _NavWidgetLit_handleNavigate;
+var _NavWidgetLit_handleFocusAnchor;
+var _NavWidgetLit_publishEvent;
+var _NavWidgetLit_renderTipItem;
+var TOKEN_PURPLE_42 = "#6a59ce";
+var TOKEN_SLATE_GREY_7 = "#677384";
+var TOKEN_SLATE_GREY_8 = "#87919f";
+var EMOJI_SVG_MAP2 = {
+  "\u{1F4B5}": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="12" x="2" y="6" rx="2"/><circle cx="12" cy="12" r="2"/><path d="M6 12h.01M18 12h.01"/></svg>',
+  "\u{1F3DB}\uFE0F": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" x2="21" y1="22" y2="22"/><line x1="6" x2="6" y1="18" y2="11"/><line x1="10" x2="10" y1="18" y2="11"/><line x1="14" x2="14" y1="18" y2="11"/><line x1="18" x2="18" y1="18" y2="11"/><polygon points="12 2 20 7 4 7"/></svg>',
+  "\u23ED\uFE0F": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 4 15 12 5 20 5 4"/><line x1="19" x2="19" y1="5" y2="19"/></svg>',
+  "\u27A1\uFE0F": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>',
+  "\u{1F4A1}": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5"/><path d="M9 18h6"/><path d="M10 22h4"/></svg>',
+  "\u{1F4B0}": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="12" x="2" y="6" rx="2"/><circle cx="12" cy="12" r="2"/><path d="M6 12h.01M18 12h.01"/></svg>',
+  "\u{1F4CB}": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"/><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/><path d="M12 11h4"/><path d="M12 16h4"/><path d="M8 11h.01"/><path d="M8 16h.01"/></svg>',
+  "\u2705": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><path d="m9 11 3 3L22 4"/></svg>',
+  "\u26A0\uFE0F": '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>'
+};
+function escapeHtml2(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function renderIcon2(emoji) {
+  var _a2;
+  return (_a2 = EMOJI_SVG_MAP2[emoji]) != null ? _a2 : escapeHtml2(emoji);
+}
+function routeMatchesCurrent2(routes) {
+  if (typeof window === "undefined")
+    return false;
+  const current = window.location.pathname;
+  return routes.some((route) => {
+    const routePath = route.split("?")[0].split("#")[0];
+    if (routePath.endsWith("/**")) {
+      return current.startsWith(routePath.slice(0, -3));
+    }
+    return current === routePath;
+  });
+}
+function pulseElement2(el) {
+  const keyframes = [
+    { boxShadow: "0 0 0 0 rgba(13, 148, 136, 0.5)" },
+    { boxShadow: "0 0 0 8px rgba(13, 148, 136, 0)" }
+  ];
+  el.animate(keyframes, { duration: 600, iterations: 3, easing: "ease-out" });
+}
+function resolveTheme2(theme) {
+  var _a2;
+  if (theme === "dark")
+    return "dark";
+  if (theme === "light")
+    return "light";
+  if (typeof window !== "undefined") {
+    return ((_a2 = window.matchMedia) == null ? void 0 : _a2.call(window, "(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+  }
+  return "light";
+}
+var NavWidgetLit = class extends LitElement3 {
+  constructor() {
+    super(...arguments);
+    _NavWidgetLit_instances.add(this);
+    this.config = { expandBehavior: "single", theme: "auto", actions: [] };
+    this.runtime = void 0;
+    this.instanceId = "nav-widget";
+    this._expandedIds = /* @__PURE__ */ new Set();
+    this._renderTick = 0;
+    this._hoveredId = null;
+    _NavWidgetLit_contextUnsub.set(this, null);
+    _NavWidgetLit_accumulatorUnsub.set(this, null);
+  }
+  createRenderRoot() {
+    return this;
+  }
+  // ---------- Lifecycle: connectedCallback ---------------------------------
+  connectedCallback() {
+    super.connectedCallback();
+    __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_subscribeRuntime).call(this);
+  }
+  // ---------- Lifecycle: disconnectedCallback ------------------------------
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_unsubscribeRuntime).call(this);
+  }
+  // ---------- Lifecycle: updated -------------------------------------------
+  updated(changed) {
+    if (changed.has("runtime")) {
+      __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_unsubscribeRuntime).call(this);
+      __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_subscribeRuntime).call(this);
+    }
+  }
+  // ---------- Render --------------------------------------------------------
+  render() {
+    const visibleTips = __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_getVisibleTips).call(this);
+    const theme = __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_getResolvedTheme).call(this);
+    const containerStyle2 = styleMap3({
+      fontFamily: "var(--sc-font-family, system-ui, -apple-system, sans-serif)",
+      maxWidth: "100%",
+      overflow: "hidden",
+      backgroundColor: "transparent",
+      color: "inherit"
+    });
+    const accordionStyle = styleMap3({
+      display: "flex",
+      flexDirection: "column",
+      gap: "var(--sc-content-item-gap, 6px)"
+    });
+    const categoryHeaderStyle = styleMap3({
+      fontSize: "var(--sc-content-category-font-size, 12px)",
+      fontWeight: "600",
+      textTransform: "uppercase",
+      letterSpacing: "0.05em",
+      padding: "var(--sc-content-category-padding, 8px 4px 4px 4px)",
+      color: theme === "dark" ? TOKEN_SLATE_GREY_8 : TOKEN_SLATE_GREY_7
+    });
+    const emptyStateStyle = styleMap3({
+      fontSize: "13px",
+      padding: "16px",
+      textAlign: "center",
+      color: theme === "dark" ? TOKEN_SLATE_GREY_7 : TOKEN_SLATE_GREY_8
+    });
+    if (visibleTips.length === 0) {
+      return html3`
+        <div
+          style=${containerStyle2}
+          data-adaptive-id=${this.instanceId}
+          data-adaptive-type="adaptive-nav"
+        >
+          <div style=${emptyStateStyle}>
+            You're all set for now! We'll share helpful tips here when they're relevant to what
+            you're doing.
+          </div>
+        </div>
+      `;
+    }
+    const categoryGroups = /* @__PURE__ */ new Map();
+    for (const tip of visibleTips) {
+      const cat = tip.config.category;
+      if (!categoryGroups.has(cat)) {
+        categoryGroups.set(cat, []);
+      }
+      categoryGroups.get(cat).push(tip);
+    }
+    const hasCategories = visibleTips.some((t) => t.config.category);
+    return html3`
+      <div
+        style=${containerStyle2}
+        data-adaptive-id=${this.instanceId}
+        data-adaptive-type="adaptive-nav"
+      >
+        <div style=${accordionStyle}>
+          ${hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => html3`
+                ${category ? html3`<div style=${categoryHeaderStyle} data-category-header=${category}>${category}</div>` : nothing3}
+                ${items.map((tip, idx) => __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_renderTipItem).call(this, tip, idx, items.length))}
+              `) : visibleTips.map((tip, idx) => __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_renderTipItem).call(this, tip, idx, visibleTips.length))}
+        </div>
+      </div>
+    `;
+  }
+};
+_NavWidgetLit_contextUnsub = /* @__PURE__ */ new WeakMap(), _NavWidgetLit_accumulatorUnsub = /* @__PURE__ */ new WeakMap(), _NavWidgetLit_instances = /* @__PURE__ */ new WeakSet(), _NavWidgetLit_subscribeRuntime = function _NavWidgetLit_subscribeRuntime2() {
+  var _a2;
+  if (!this.runtime)
+    return;
+  __classPrivateFieldSet2(this, _NavWidgetLit_contextUnsub, this.runtime.context.subscribe(() => {
+    this._renderTick += 1;
+  }), "f");
+  if ((_a2 = this.runtime.accumulator) == null ? void 0 : _a2.subscribe) {
+    __classPrivateFieldSet2(this, _NavWidgetLit_accumulatorUnsub, this.runtime.accumulator.subscribe(() => {
+      this._renderTick += 1;
+    }), "f");
+  }
+}, _NavWidgetLit_unsubscribeRuntime = function _NavWidgetLit_unsubscribeRuntime2() {
+  var _a2, _b;
+  (_a2 = __classPrivateFieldGet2(this, _NavWidgetLit_contextUnsub, "f")) == null ? void 0 : _a2.call(this);
+  __classPrivateFieldSet2(this, _NavWidgetLit_contextUnsub, null, "f");
+  (_b = __classPrivateFieldGet2(this, _NavWidgetLit_accumulatorUnsub, "f")) == null ? void 0 : _b.call(this);
+  __classPrivateFieldSet2(this, _NavWidgetLit_accumulatorUnsub, null, "f");
+}, _NavWidgetLit_getVisibleTips = function _NavWidgetLit_getVisibleTips2() {
+  void this._renderTick;
+  if (!this.runtime)
+    return this.config.actions;
+  return this.config.actions.filter((tip) => {
+    if (!tip.triggerWhen)
+      return true;
+    try {
+      const result = this.runtime.evaluateSync(tip.triggerWhen);
+      return result.value;
+    } catch {
+      return false;
+    }
+  });
+}, _NavWidgetLit_getResolvedTheme = function _NavWidgetLit_getResolvedTheme2() {
+  return resolveTheme2(this.config.theme);
+}, _NavWidgetLit_handleToggle = function _NavWidgetLit_handleToggle2(id) {
+  const wasExpanded = this._expandedIds.has(id);
+  let next;
+  if (this.config.expandBehavior === "single") {
+    for (const prevId of this._expandedIds) {
+      if (prevId !== id) {
+        __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_publishEvent).call(this, "nav:toggled", {
+          tipId: prevId,
+          expanded: false
+        });
+      }
+    }
+    next = wasExpanded ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([id]);
+  } else {
+    next = new Set(this._expandedIds);
+    if (wasExpanded) {
+      next.delete(id);
+    } else {
+      next.add(id);
+    }
+  }
+  __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_publishEvent).call(this, "nav:toggled", {
+    tipId: id,
+    expanded: !wasExpanded
+  });
+  this._expandedIds = next;
+}, _NavWidgetLit_handleNavigate = function _NavWidgetLit_handleNavigate2(href, external) {
+  const normalized = href.trim().toLowerCase();
+  if (normalized.startsWith("javascript:") || normalized.startsWith("data:"))
+    return;
+  __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_publishEvent).call(this, "nav:tip_clicked", { href, external });
+  this.dispatchEvent(new CustomEvent("nav-tip-clicked", {
+    bubbles: true,
+    detail: { href, external, instanceId: this.instanceId }
+  }));
+  if (external) {
+    window.open(href, "_blank", "noopener,noreferrer");
+  } else {
+    const url = new URL(href, window.location.origin);
+    url.search = window.location.search;
+    if (!navigateWithFrameworkRouter(url.toString())) {
+      window.history.pushState(null, "", url.toString());
+      window.dispatchEvent(new PopStateEvent("popstate"));
+    }
+  }
+}, _NavWidgetLit_handleFocusAnchor = function _NavWidgetLit_handleFocusAnchor2(anchor) {
+  const el = document.querySelector(anchor.selector);
+  if (!(el instanceof HTMLElement))
+    return;
+  __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_publishEvent).call(this, "nav:tip_focused", {
+    selector: anchor.selector,
+    route: anchor.route
+  });
+  this.dispatchEvent(new CustomEvent("nav-tip-focused", {
+    bubbles: true,
+    detail: { selector: anchor.selector, instanceId: this.instanceId }
+  }));
+  el.scrollIntoView({ behavior: "smooth", block: "center" });
+  pulseElement2(el);
+  setTimeout(() => el.focus(), 400);
+}, _NavWidgetLit_publishEvent = function _NavWidgetLit_publishEvent2(name, props) {
+  var _a2;
+  (_a2 = this.runtime) == null ? void 0 : _a2.events.publish(name, {
+    instanceId: this.instanceId,
+    timestamp: Date.now(),
+    ...props
+  });
+}, _NavWidgetLit_renderTipItem = function _NavWidgetLit_renderTipItem2(tip, index, total) {
+  const { id, title, description, href, icon, external, anchor, category: _cat } = tip.config;
+  const isExpanded = this._expandedIds.has(id);
+  const isLast = index === total - 1;
+  const isHovered = this._hoveredId === id;
+  const theme = __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_getResolvedTheme).call(this);
+  const effectiveHref = anchor ? Array.isArray(anchor.route) ? anchor.route[0] : anchor.route : href;
+  const isSamePage = anchor ? routeMatchesCurrent2(Array.isArray(anchor.route) ? anchor.route : [anchor.route]) : effectiveHref ? routeMatchesCurrent2([effectiveHref]) : false;
+  const hasSelector = (anchor == null ? void 0 : anchor.selector) && anchor.selector !== "*";
+  const isFocusAction = isSamePage && hasSelector;
+  const hasAction = !!effectiveHref || isFocusAction;
+  const ctaLabel = isFocusAction ? "Focus \u2192" : external ? "Go \u2197" : "Go \u2192";
+  const itemStyle = styleMap3({
+    borderRadius: "var(--sc-content-border-radius, 8px)",
+    overflow: "hidden",
+    transition: "box-shadow 0.2s ease",
+    backgroundColor: "var(--sc-content-background)",
+    border: "var(--sc-content-border)",
+    ...isExpanded ? {
+      boxShadow: theme === "dark" ? "0 4px 12px rgba(0, 0, 0, 0.15)" : "0 4px 12px rgba(0, 0, 0, 0.08)"
+    } : {},
+    ...!isLast ? { borderBottom: "var(--sc-content-item-divider, none)" } : {}
+  });
+  const headerStyle = styleMap3({
+    display: "flex",
+    alignItems: "center",
+    gap: "8px",
+    width: "100%",
+    padding: "var(--sc-content-item-padding, 12px 16px)",
+    border: "none",
+    cursor: "pointer",
+    fontSize: "var(--sc-content-item-font-size, 15px)",
+    fontWeight: "500",
+    fontFamily: "inherit",
+    textAlign: "left",
+    transition: "background-color 0.15s ease",
+    backgroundColor: isHovered ? "var(--sc-content-background-hover)" : "transparent",
+    color: "var(--sc-content-text-color)"
+  });
+  const chevronStyle = styleMap3({
+    fontSize: "20px",
+    transition: "transform 0.2s ease",
+    marginLeft: "auto",
+    flexShrink: "0",
+    color: "var(--sc-content-chevron-color, currentColor)",
+    transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)"
+  });
+  const bodyStyle = styleMap3({
+    overflow: "hidden",
+    transition: "max-height 0.25s ease, padding-bottom 0.25s ease",
+    padding: "var(--sc-content-body-padding, 0 16px 12px 16px)",
+    color: "var(--sc-content-text-secondary-color)",
+    maxHeight: isExpanded ? "500px" : "0",
+    paddingBottom: isExpanded ? "16px" : "0"
+  });
+  const descriptionStyle = styleMap3({
+    fontSize: "var(--sc-content-body-font-size, 14px)",
+    lineHeight: "1.5",
+    margin: "0"
+  });
+  const linkButtonStyle = styleMap3({
+    display: "inline-flex",
+    alignItems: "center",
+    gap: "4px",
+    marginTop: "10px",
+    padding: "6px 12px",
+    borderRadius: "6px",
+    textDecoration: "none",
+    fontSize: "13px",
+    fontWeight: "500",
+    cursor: "pointer",
+    border: "none",
+    transition: "background-color 0.15s ease",
+    backgroundColor: `var(--sc-color-primary, ${TOKEN_PURPLE_42})`,
+    color: "#ffffff"
+  });
+  const iconStyle = styleMap3({
+    fontSize: "16px",
+    flexShrink: "0"
+  });
+  const onLinkClick = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (isFocusAction && anchor) {
+      __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_handleFocusAnchor).call(this, anchor);
+    } else if (effectiveHref) {
+      __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_handleNavigate).call(this, effectiveHref, external != null ? external : false);
+    }
+  };
+  return html3`
+      <div
+        style=${itemStyle}
+        data-nav-tip-id=${id}
+      >
+        <button
+          type="button"
+          style=${headerStyle}
+          aria-expanded=${isExpanded}
+          @click=${() => __classPrivateFieldGet2(this, _NavWidgetLit_instances, "m", _NavWidgetLit_handleToggle).call(this, id)}
+          @mouseenter=${() => {
+    this._hoveredId = id;
+  }}
+          @mouseleave=${() => {
+    this._hoveredId = null;
+  }}
+        >
+          ${icon ? html3`<span style=${iconStyle}>${unsafeHTML2(renderIcon2(icon))}</span>` : nothing3}
+          <span>${title}</span>
+          <span style=${chevronStyle}>${"\u203A"}</span>
+        </button>
+        <div style=${bodyStyle} aria-hidden=${!isExpanded}>
+          <p style=${descriptionStyle}>${description}</p>
+          ${hasAction ? html3`
+                <a
+                  href=${effectiveHref || "#"}
+                  style=${linkButtonStyle}
+                  target=${external ? "_blank" : nothing3}
+                  rel=${external ? "noopener noreferrer" : nothing3}
+                  @click=${onLinkClick}
+                >${ctaLabel}</a>
+              ` : nothing3}
+        </div>
+      </div>
+    `;
+};
+NavWidgetLit.properties = {
+  // Public inputs
+  config: { attribute: false },
+  runtime: { attribute: false },
+  instanceId: { type: String },
+  // Internal reactive state
+  _expandedIds: { state: true },
+  _renderTick: { state: true },
+  _hoveredId: { state: true }
+};
+
 // ../adaptives/adaptive-nav/dist/runtime.js
 var executeScrollTo = async (action, context) => {
   var _a2, _b, _c, _d;
@@ -3325,6 +4575,68 @@ function validateEventFilter(data) {
   return EventFilterZ.safeParse(data);
 }
 
+// src/platform/ShopifyAnchorResolver.ts
+var DAWN_FAMILY = ["dawn", "sense", "craft", "ride", "refresh", "colorblock", "taste", "studio"];
+var PRESTIGE_FAMILY = ["prestige", "impact", "stretch"];
+var LEGACY_FAMILY = [
+  "debut",
+  "brooklyn",
+  "supply",
+  "minimal",
+  "narrative",
+  "simple",
+  "boundless"
+];
+var IMPULSE_FAMILY = ["impulse"];
+var TURBO_FAMILY = ["turbo"];
+var TRADEMARK_FAMILY = ["trademark", "clean canvas"];
+function detectThemeFamily() {
+  var _a2, _b;
+  const themeName = (_b = (_a2 = window == null ? void 0 : window.Shopify) == null ? void 0 : _a2.theme) == null ? void 0 : _b.name;
+  if (!themeName) return "unknown";
+  const lower = themeName.toLowerCase();
+  if (DAWN_FAMILY.includes(lower)) return "dawn";
+  if (PRESTIGE_FAMILY.includes(lower)) return "prestige";
+  if (IMPULSE_FAMILY.includes(lower)) return "impulse";
+  if (TURBO_FAMILY.includes(lower)) return "turbo";
+  if (TRADEMARK_FAMILY.includes(lower)) return "trademark";
+  if (LEGACY_FAMILY.includes(lower)) return "legacy";
+  return "unknown";
+}
+var ShopifyAnchorResolver = class {
+  /**
+   * Scope a CSS selector to its containing .shopify-section wrapper.
+   */
+  scopeSelector(selector, element) {
+    const section = element.closest(".shopify-section");
+    if (section == null ? void 0 : section.id) {
+      const escaped = typeof CSS !== "undefined" ? CSS.escape(section.id) : section.id;
+      return `#${escaped} ${selector}`;
+    }
+    return selector;
+  }
+  /**
+   * Validate that a selector matches exactly one element in the document.
+   */
+  validateUniqueness(selector) {
+    try {
+      const matches = document.querySelectorAll(selector);
+      return {
+        unique: matches.length === 1,
+        matchCount: matches.length
+      };
+    } catch {
+      return { unique: false, matchCount: 0 };
+    }
+  }
+  /**
+   * Get the current theme family for diagnostic/logging purposes.
+   */
+  getThemeFamily() {
+    return detectThemeFamily();
+  }
+};
+
 // src/state/schema.ts
 import { z as z5 } from "zod";
 var StoredValueZ = z5.object({
@@ -3424,6 +4736,7 @@ export {
   RuntimeProvider,
   SDK_SCHEMA_VERSION,
   SDK_VERSION,
+  COOKIE_NAME as SHOPIFY_COOKIE_NAME,
   STATIC_SLOT_STYLES,
   ScoreStrategyZ,
   ScrollBehaviorZ,
@@ -3439,6 +4752,10 @@ export {
   SetTextZ,
   ShadowCanvasOverlay,
   ShadowRootProvider,
+  ShopifyAdapter,
+  ShopifyAnchorResolver,
+  ShopifyAntiFlicker,
+  ShopifyPixelBridge,
   SmartCanvasApp,
   SmartCanvasController,
   SmartCanvasElement,
@@ -3490,6 +4807,8 @@ export {
   createSurfaces,
   decisionSchemas,
   decodeToken,
+  detectPlatform,
+  detectThemeFamily,
   encodeToken,
   evaluate,
   evaluateCondition,