@hellotext/hellotext 2.3.9 → 2.4.1

package/lib/controllers/webchat/useBehaviour.cjs

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useBehaviour = void 0;
+// This mixin owns automatic opening only. The webchat controller still owns the
+// Stimulus lifecycle and `usePopover` still owns the mechanics of opening and
+// closing the popover. Keeping this policy here gives the configured behaviour
+// value one place to translate into timers, storage gates, and cleanup.
+const useBehaviour = controller => {
+  Object.assign(controller, {
+    // Called from `connect` after the controller has wired channels, targets,
+    // and popover state. Even a zero-second delay goes through a timeout so the
+    // automatic open happens after the mount pass rather than during setup.
+    scheduleBehaviourOpen() {
+      if (!this.shouldAutoOpenFromBehaviour()) return;
+      const delay = Number(this.behaviourValue.delay_seconds || 0) * 1000;
+      this.behaviourOpenTimeout = window.setTimeout(() => {
+        this.behaviourOpenTimeout = null;
+        if (this.openValue) return;
+        this.openValue = true;
+        this.markBehaviourAutoOpened();
+      }, delay);
+    },
+    // This is the shared escape hatch for lifecycle teardown and manual user
+    // intent. `disconnect` calls it to avoid orphaned timers; `usePopover`
+    // calls it before show/toggle so a delayed behaviour cannot reopen the chat
+    // or consume gates after the user has already acted.
+    cancelBehaviourOpen() {
+      window.clearTimeout(this.behaviourOpenTimeout);
+      this.behaviourOpenTimeout = null;
+    },
+    // Eligibility is deliberately read-only. A visit should only be marked as
+    // auto-opened after the timer opens the widget, not when we merely discover
+    // that it would be allowed. That keeps blocked, cancelled, and manually
+    // opened visits from being counted as behaviour-driven opens.
+    shouldAutoOpenFromBehaviour() {
+      const behaviour = this.behaviourValue;
+      if (!behaviour || behaviour.trigger !== 'on_load') return false;
+      if (behaviour.first_visit_only && localStorage.getItem(this.firstVisitKey())) {
+        return false;
+      }
+      if (behaviour.once_per_session && sessionStorage.getItem(this.sessionKey())) {
+        return false;
+      }
+      return true;
+    },
+    // The gates are independent because they answer different product
+    // questions. `first_visit_only` is a long-lived visitor gate in
+    // localStorage; `once_per_session` is intentionally softer and resets with
+    // sessionStorage.
+    markBehaviourAutoOpened() {
+      if (this.behaviourValue.first_visit_only) {
+        localStorage.setItem(this.firstVisitKey(), '1');
+      }
+      if (this.behaviourValue.once_per_session) {
+        sessionStorage.setItem(this.sessionKey(), '1');
+      }
+    },
+    // Records that this widget has already used its long-lived first-visit
+    // automatic open. This is the durable gate behind `first_visit_only`.
+    firstVisitKey() {
+      return `hellotext--webchat--${this.idValue}--auto-opened`;
+    },
+    // Records that this widget has already used its automatic open during the
+    // current browser session. This is the shorter-lived gate behind
+    // `once_per_session`.
+    sessionKey() {
+      return `hellotext--webchat--${this.idValue}--auto-opened-session`;
+    }
+  });
+};
+exports.useBehaviour = useBehaviour;

package/lib/controllers/webchat/useBehaviour.js

@@ -0,0 +1,67 @@
+// This mixin owns automatic opening only. The webchat controller still owns the
+// Stimulus lifecycle and `usePopover` still owns the mechanics of opening and
+// closing the popover. Keeping this policy here gives the configured behaviour
+// value one place to translate into timers, storage gates, and cleanup.
+export var useBehaviour = controller => {
+  Object.assign(controller, {
+    // Called from `connect` after the controller has wired channels, targets,
+    // and popover state. Even a zero-second delay goes through a timeout so the
+    // automatic open happens after the mount pass rather than during setup.
+    scheduleBehaviourOpen() {
+      if (!this.shouldAutoOpenFromBehaviour()) return;
+      var delay = Number(this.behaviourValue.delay_seconds || 0) * 1000;
+      this.behaviourOpenTimeout = window.setTimeout(() => {
+        this.behaviourOpenTimeout = null;
+        if (this.openValue) return;
+        this.openValue = true;
+        this.markBehaviourAutoOpened();
+      }, delay);
+    },
+    // This is the shared escape hatch for lifecycle teardown and manual user
+    // intent. `disconnect` calls it to avoid orphaned timers; `usePopover`
+    // calls it before show/toggle so a delayed behaviour cannot reopen the chat
+    // or consume gates after the user has already acted.
+    cancelBehaviourOpen() {
+      window.clearTimeout(this.behaviourOpenTimeout);
+      this.behaviourOpenTimeout = null;
+    },
+    // Eligibility is deliberately read-only. A visit should only be marked as
+    // auto-opened after the timer opens the widget, not when we merely discover
+    // that it would be allowed. That keeps blocked, cancelled, and manually
+    // opened visits from being counted as behaviour-driven opens.
+    shouldAutoOpenFromBehaviour() {
+      var behaviour = this.behaviourValue;
+      if (!behaviour || behaviour.trigger !== 'on_load') return false;
+      if (behaviour.first_visit_only && localStorage.getItem(this.firstVisitKey())) {
+        return false;
+      }
+      if (behaviour.once_per_session && sessionStorage.getItem(this.sessionKey())) {
+        return false;
+      }
+      return true;
+    },
+    // The gates are independent because they answer different product
+    // questions. `first_visit_only` is a long-lived visitor gate in
+    // localStorage; `once_per_session` is intentionally softer and resets with
+    // sessionStorage.
+    markBehaviourAutoOpened() {
+      if (this.behaviourValue.first_visit_only) {
+        localStorage.setItem(this.firstVisitKey(), '1');
+      }
+      if (this.behaviourValue.once_per_session) {
+        sessionStorage.setItem(this.sessionKey(), '1');
+      }
+    },
+    // Records that this widget has already used its long-lived first-visit
+    // automatic open. This is the durable gate behind `first_visit_only`.
+    firstVisitKey() {
+      return "hellotext--webchat--".concat(this.idValue, "--auto-opened");
+    },
+    // Records that this widget has already used its automatic open during the
+    // current browser session. This is the shorter-lived gate behind
+    // `once_per_session`.
+    sessionKey() {
+      return "hellotext--webchat--".concat(this.idValue, "--auto-opened-session");
+    }
+  });
+};

package/lib/controllers/webchat/useOpeningSequence.cjs

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useOpeningSequence = void 0;
+// Opening sequence markup is already present in the document; this mixin only
+// manages when those staged messages become visible and which ids should travel
+// with the first customer message. It never creates a conversation or posts the
+// staged messages by itself.
+const useOpeningSequence = controller => {
+  Object.assign(controller, {
+    // Called from `connect` to prepare lifecycle state before the webchat opens.
+    // The sequence may not exist on every widget, so the rest of the runtime can
+    // safely call these helpers even when there are no sequence targets.
+    setupOpeningSequence() {
+      this.openingSequenceStarted = false;
+      this.openingSequenceCancelled = false;
+      this.openingSequenceTimeout = null;
+      this.openingSequenceMessages = [];
+      this.revealedOpeningSequenceMessageIds = [];
+    },
+    // Disconnect shares the same cancellation path as a user send. Both cases
+    // must stop pending timers so hidden staged messages cannot reveal later.
+    teardownOpeningSequence() {
+      this.cancelOpeningSequence();
+    },
+    // The sequence is a first-conversation affordance only. A present
+    // conversation id means the transcript already exists, so staged messages
+    // should remain untouched.
+    startOpeningSequence() {
+      this.openingSequenceMessages = Array.from(this.openingSequenceMessageTargets || []);
+      if (!this.openingSequenceCanStart()) return;
+      this.openingSequenceStarted = true;
+      this.openingSequenceCancelled = false;
+      this.revealedOpeningSequenceMessageIds = [];
+      this.playOpeningSequenceMessageAt(0);
+    },
+    openingSequenceCanStart() {
+      return !this.conversationIdValue && this.hasOpeningSequenceTarget && this.openingSequenceMessages.length > 0 && !this.openingSequenceStarted;
+    },
+    // Each staged message owns the delay before it appears. A zero-second delay
+    // still uses a timeout so reveal work stays outside the popover-open call
+    // stack and cancellation has one consistent path.
+    playOpeningSequenceMessageAt(index) {
+      const message = this.openingSequenceMessages[index];
+      if (!message) return;
+      const delay = this.openingSequenceMessageDelay(message) * 1000;
+      this.openingSequenceTimeout = window.setTimeout(() => {
+        this.openingSequenceTimeout = null;
+        if (this.openingSequenceCancelled) return;
+        this.revealOpeningSequenceMessage(message);
+        this.playOpeningSequenceMessageAt(index + 1);
+      }, delay);
+    },
+    // Revealing moves the staged node into the live message list. The message
+    // markup itself is preserved; JS only relocates it, unhides it, and remembers
+    // the hashed id if the visitor actually saw it.
+    revealOpeningSequenceMessage(message) {
+      this.messagesContainerTarget.insertBefore(message, this.messageTemplateTarget);
+      message.hidden = false;
+      this.recordOpeningSequenceMessage(message);
+      this.scrollOpeningSequenceToBottom();
+    },
+    recordOpeningSequenceMessage(message) {
+      const id = message.dataset.openingSequenceMessageId;
+      if (!id || this.revealedOpeningSequenceMessageIds.includes(id)) return;
+      this.revealedOpeningSequenceMessageIds.push(id);
+    },
+    openingSequenceMessageDelay(message) {
+      const delay = Number(message.dataset.delaySeconds || 0);
+      return Number.isFinite(delay) ? delay : 0;
+    },
+    scrollOpeningSequenceToBottom() {
+      if (!this.messagesContainerTarget.scroll) return;
+      this.messagesContainerTarget.scroll({
+        top: this.messagesContainerTarget.scrollHeight,
+        behavior: 'smooth'
+      });
+    },
+    cancelOpeningSequence() {
+      this.openingSequenceCancelled = true;
+      if (this.openingSequenceTimeout === null || this.openingSequenceTimeout === undefined) return;
+      window.clearTimeout(this.openingSequenceTimeout);
+      this.openingSequenceTimeout = null;
+    },
+    // Customer sends promote only what was actually revealed. Calling this also
+    // interrupts pending reveals so the payload cannot include later messages.
+    appendOpeningSequenceMessageIds(formData) {
+      this.cancelOpeningSequence();
+      const ids = this.revealedOpeningSequenceMessageIds || [];
+      ids.forEach(id => {
+        formData.append('message[opening_sequence_message_ids][]', id);
+      });
+    },
+    // Clear after a successful customer send. Failed sends keep the ids available
+    // so retrying the first message can still promote the revealed sequence.
+    clearRevealedOpeningSequenceMessageIds() {
+      this.revealedOpeningSequenceMessageIds = [];
+    }
+  });
+};
+exports.useOpeningSequence = useOpeningSequence;

package/lib/controllers/webchat/useOpeningSequence.js

@@ -0,0 +1,96 @@
+// Opening sequence markup is already present in the document; this mixin only
+// manages when those staged messages become visible and which ids should travel
+// with the first customer message. It never creates a conversation or posts the
+// staged messages by itself.
+export var useOpeningSequence = controller => {
+  Object.assign(controller, {
+    // Called from `connect` to prepare lifecycle state before the webchat opens.
+    // The sequence may not exist on every widget, so the rest of the runtime can
+    // safely call these helpers even when there are no sequence targets.
+    setupOpeningSequence() {
+      this.openingSequenceStarted = false;
+      this.openingSequenceCancelled = false;
+      this.openingSequenceTimeout = null;
+      this.openingSequenceMessages = [];
+      this.revealedOpeningSequenceMessageIds = [];
+    },
+    // Disconnect shares the same cancellation path as a user send. Both cases
+    // must stop pending timers so hidden staged messages cannot reveal later.
+    teardownOpeningSequence() {
+      this.cancelOpeningSequence();
+    },
+    // The sequence is a first-conversation affordance only. A present
+    // conversation id means the transcript already exists, so staged messages
+    // should remain untouched.
+    startOpeningSequence() {
+      this.openingSequenceMessages = Array.from(this.openingSequenceMessageTargets || []);
+      if (!this.openingSequenceCanStart()) return;
+      this.openingSequenceStarted = true;
+      this.openingSequenceCancelled = false;
+      this.revealedOpeningSequenceMessageIds = [];
+      this.playOpeningSequenceMessageAt(0);
+    },
+    openingSequenceCanStart() {
+      return !this.conversationIdValue && this.hasOpeningSequenceTarget && this.openingSequenceMessages.length > 0 && !this.openingSequenceStarted;
+    },
+    // Each staged message owns the delay before it appears. A zero-second delay
+    // still uses a timeout so reveal work stays outside the popover-open call
+    // stack and cancellation has one consistent path.
+    playOpeningSequenceMessageAt(index) {
+      var message = this.openingSequenceMessages[index];
+      if (!message) return;
+      var delay = this.openingSequenceMessageDelay(message) * 1000;
+      this.openingSequenceTimeout = window.setTimeout(() => {
+        this.openingSequenceTimeout = null;
+        if (this.openingSequenceCancelled) return;
+        this.revealOpeningSequenceMessage(message);
+        this.playOpeningSequenceMessageAt(index + 1);
+      }, delay);
+    },
+    // Revealing moves the staged node into the live message list. The message
+    // markup itself is preserved; JS only relocates it, unhides it, and remembers
+    // the hashed id if the visitor actually saw it.
+    revealOpeningSequenceMessage(message) {
+      this.messagesContainerTarget.insertBefore(message, this.messageTemplateTarget);
+      message.hidden = false;
+      this.recordOpeningSequenceMessage(message);
+      this.scrollOpeningSequenceToBottom();
+    },
+    recordOpeningSequenceMessage(message) {
+      var id = message.dataset.openingSequenceMessageId;
+      if (!id || this.revealedOpeningSequenceMessageIds.includes(id)) return;
+      this.revealedOpeningSequenceMessageIds.push(id);
+    },
+    openingSequenceMessageDelay(message) {
+      var delay = Number(message.dataset.delaySeconds || 0);
+      return Number.isFinite(delay) ? delay : 0;
+    },
+    scrollOpeningSequenceToBottom() {
+      if (!this.messagesContainerTarget.scroll) return;
+      this.messagesContainerTarget.scroll({
+        top: this.messagesContainerTarget.scrollHeight,
+        behavior: 'smooth'
+      });
+    },
+    cancelOpeningSequence() {
+      this.openingSequenceCancelled = true;
+      if (this.openingSequenceTimeout === null || this.openingSequenceTimeout === undefined) return;
+      window.clearTimeout(this.openingSequenceTimeout);
+      this.openingSequenceTimeout = null;
+    },
+    // Customer sends promote only what was actually revealed. Calling this also
+    // interrupts pending reveals so the payload cannot include later messages.
+    appendOpeningSequenceMessageIds(formData) {
+      this.cancelOpeningSequence();
+      var ids = this.revealedOpeningSequenceMessageIds || [];
+      ids.forEach(id => {
+        formData.append('message[opening_sequence_message_ids][]', id);
+      });
+    },
+    // Clear after a successful customer send. Failed sends keep the ids available
+    // so retrying the first message can still promote the revealed sequence.
+    clearRevealedOpeningSequenceMessageIds() {
+      this.revealedOpeningSequenceMessageIds = [];
+    }
+  });
+};

package/lib/controllers/webchat/useTeaser.cjs

@@ -0,0 +1,163 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTeaser = void 0;
+// The teaser markup is already present in the document; this mixin only manages
+// the runtime around it. Keeping the teaser policy here gives the controller one
+// place to delegate click-to-open, the pre-conversation presentation, and timer
+// cleanup. Message sending stays on the controller because it owns the API flow
+// and optimistic customer bubble insertion.
+const useTeaser = controller => {
+  Object.assign(controller, {
+    // Called from `connect` after `usePopover` has given the controller `show`.
+    // The teaser is optional, so setup first prepares reusable lifecycle state,
+    // wires the click surface when present, and then lets eligibility decide
+    // whether this session may still show the presentation.
+    setupTeaser() {
+      this.teaserCycleTimeout = null;
+      this.teaserMessages = [];
+      this.boundOnTeaserClick = this.boundOnTeaserClick || this.onTeaserClick.bind(this);
+      if (!this.hasTeaserTarget) return;
+      this.teaserTarget.addEventListener('click', this.boundOnTeaserClick);
+      this.startTeaserPresentation();
+    },
+    // This is the shared teardown path for Stimulus disconnect. Cycling timers
+    // and DOM listeners both outlive the current call stack, so they need to be
+    // cancelled explicitly when the rendered widget leaves the page.
+    teardownTeaser() {
+      this.stopTeaserCycle();
+      if (this.hasTeaserTarget && this.boundOnTeaserClick) {
+        this.teaserTarget.removeEventListener('click', this.boundOnTeaserClick);
+      }
+    },
+    // The current DOM is the source of truth. Each setup pass collects the
+    // rendered teaser messages from the teaser surface itself, which keeps the
+    // target list small and avoids carrying stale nodes between presentations.
+    collectTeaserMessages() {
+      if (!this.hasTeaserTarget) return [];
+      return Array.from(this.teaserTarget.querySelectorAll('[data-teaser-message]'));
+    },
+    // The teaser is a one-time, pre-conversation presentation. It can run while
+    // the popover is closed, but any active conversation signal makes the teaser
+    // ineligible for the rest of this browser session.
+    startTeaserPresentation() {
+      this.stopTeaserCycle();
+      this.teaserMessages = this.collectTeaserMessages();
+      if (!this.hasTeaserTarget) return;
+      if (this.teaserMessages.length === 0) {
+        this.hideTeaser();
+        return;
+      }
+      if (this.openValue) {
+        this.dismissTeaserForSession();
+        return;
+      }
+      if (this.conversationIdValue || this.hasRenderedConversationMessages()) {
+        this.dismissTeaserForSession();
+        return;
+      }
+      if (this.teaserSeenForSession()) {
+        this.hideTeaser();
+        return;
+      }
+      this.teaserTarget.classList.remove('invisible');
+      this.showTeaserMessage(0);
+      if (this.teaserMessages.length < 2) return;
+      this.scheduleNextTeaserMessage(0);
+    },
+    // Delays belong to the currently visible message, so each teaser controls
+    // how long it remains on screen before the next one replaces it. The
+    // presentation stops after the last message instead of looping forever.
+    scheduleNextTeaserMessage(currentIndex) {
+      const nextIndex = currentIndex + 1;
+      if (nextIndex >= this.teaserMessages.length) return;
+      const currentMessage = this.teaserMessages[currentIndex];
+      const delay = this.teaserPresentationDelay(currentMessage);
+      this.teaserCycleTimeout = window.setTimeout(() => {
+        this.teaserCycleTimeout = null;
+        this.showTeaserMessage(nextIndex);
+        this.scheduleNextTeaserMessage(nextIndex);
+      }, delay);
+    },
+    // Visibility is managed with the existing `hidden` class for initially
+    // concealed teaser messages. This keeps JS from restructuring teaser markup.
+    showTeaserMessage(index) {
+      this.teaserMessages.forEach((message, messageIndex) => {
+        message.classList.toggle('hidden', messageIndex !== index);
+      });
+    },
+    // Safe to call even when no timer exists. Lifecycle hooks call this before
+    // starting, hiding, or tearing down the teaser so only one cycle can be alive.
+    stopTeaserCycle() {
+      if (this.teaserCycleTimeout === null || this.teaserCycleTimeout === undefined) return;
+      window.clearTimeout(this.teaserCycleTimeout);
+      this.teaserCycleTimeout = null;
+    },
+    // Invalid or missing delay values should not break teaser rendering. Treat
+    // them as zero, then use a small minimum so zero-delay presentations advance
+    // deliberately instead of flashing through every message in one frame.
+    teaserMessageDelay(message) {
+      const delay = Number(message.dataset.delaySeconds || 0);
+      return Number.isFinite(delay) ? delay : 0;
+    },
+    teaserPresentationDelay(message) {
+      return Math.max(this.teaserMessageDelay(message) * 1000, 250);
+    },
+    // A rendered transcript means the visitor is no longer in the pre-conversation
+    // state. The hidden template is deliberately excluded because it is not a live
+    // customer-visible message.
+    hasRenderedConversationMessages() {
+      let messages = [];
+      try {
+        messages = Array.from(this.messageTargets || []);
+      } catch (_error) {
+        messages = [];
+      }
+      return messages.some(message => message !== this.messageTemplateTarget);
+    },
+    teaserSeenKey() {
+      return `hellotext:webchat:${this.idValue || this.element.id}:teaser-seen`;
+    },
+    teaserSeenForSession() {
+      try {
+        return window.sessionStorage.getItem(this.teaserSeenKey()) === 'true';
+      } catch (_error) {
+        return false;
+      }
+    },
+    markTeaserSeenForSession() {
+      try {
+        window.sessionStorage.setItem(this.teaserSeenKey(), 'true');
+      } catch (_error) {
+        // Storage can be unavailable in locked-down browsers. The in-memory hide
+        // still keeps the active controller from showing the teaser again.
+      }
+    },
+    // Opening or sending ends the pre-conversation window for this browser
+    // session. Incoming message teasers are separate ephemeral content, so they
+    // use `hideTeaser`/`updateMessageTeaser` without writing this session flag.
+    dismissTeaserForSession() {
+      this.markTeaserSeenForSession();
+      this.hideTeaser();
+    },
+    // Stopping the timer before hiding prevents queued presentation steps from
+    // flipping hidden messages after the teaser surface has been dismissed.
+    hideTeaser() {
+      this.stopTeaserCycle();
+      if (this.hasTeaserTarget) {
+        this.teaserTarget.classList.add('invisible');
+      }
+    },
+    // A teaser surface click is a user request to open chat, but links inside the
+    // teaser already have native browser behavior. Leaving anchors alone keeps
+    // external URLs and `tel:` actions working without extra JS.
+    onTeaserClick(event) {
+      if (event.target.closest('a')) return;
+      this.dismissTeaserForSession();
+      this.show();
+    }
+  });
+};
+exports.useTeaser = useTeaser;

package/lib/controllers/webchat/useTeaser.js

@@ -0,0 +1,156 @@
+// The teaser markup is already present in the document; this mixin only manages
+// the runtime around it. Keeping the teaser policy here gives the controller one
+// place to delegate click-to-open, the pre-conversation presentation, and timer
+// cleanup. Message sending stays on the controller because it owns the API flow
+// and optimistic customer bubble insertion.
+export var useTeaser = controller => {
+  Object.assign(controller, {
+    // Called from `connect` after `usePopover` has given the controller `show`.
+    // The teaser is optional, so setup first prepares reusable lifecycle state,
+    // wires the click surface when present, and then lets eligibility decide
+    // whether this session may still show the presentation.
+    setupTeaser() {
+      this.teaserCycleTimeout = null;
+      this.teaserMessages = [];
+      this.boundOnTeaserClick = this.boundOnTeaserClick || this.onTeaserClick.bind(this);
+      if (!this.hasTeaserTarget) return;
+      this.teaserTarget.addEventListener('click', this.boundOnTeaserClick);
+      this.startTeaserPresentation();
+    },
+    // This is the shared teardown path for Stimulus disconnect. Cycling timers
+    // and DOM listeners both outlive the current call stack, so they need to be
+    // cancelled explicitly when the rendered widget leaves the page.
+    teardownTeaser() {
+      this.stopTeaserCycle();
+      if (this.hasTeaserTarget && this.boundOnTeaserClick) {
+        this.teaserTarget.removeEventListener('click', this.boundOnTeaserClick);
+      }
+    },
+    // The current DOM is the source of truth. Each setup pass collects the
+    // rendered teaser messages from the teaser surface itself, which keeps the
+    // target list small and avoids carrying stale nodes between presentations.
+    collectTeaserMessages() {
+      if (!this.hasTeaserTarget) return [];
+      return Array.from(this.teaserTarget.querySelectorAll('[data-teaser-message]'));
+    },
+    // The teaser is a one-time, pre-conversation presentation. It can run while
+    // the popover is closed, but any active conversation signal makes the teaser
+    // ineligible for the rest of this browser session.
+    startTeaserPresentation() {
+      this.stopTeaserCycle();
+      this.teaserMessages = this.collectTeaserMessages();
+      if (!this.hasTeaserTarget) return;
+      if (this.teaserMessages.length === 0) {
+        this.hideTeaser();
+        return;
+      }
+      if (this.openValue) {
+        this.dismissTeaserForSession();
+        return;
+      }
+      if (this.conversationIdValue || this.hasRenderedConversationMessages()) {
+        this.dismissTeaserForSession();
+        return;
+      }
+      if (this.teaserSeenForSession()) {
+        this.hideTeaser();
+        return;
+      }
+      this.teaserTarget.classList.remove('invisible');
+      this.showTeaserMessage(0);
+      if (this.teaserMessages.length < 2) return;
+      this.scheduleNextTeaserMessage(0);
+    },
+    // Delays belong to the currently visible message, so each teaser controls
+    // how long it remains on screen before the next one replaces it. The
+    // presentation stops after the last message instead of looping forever.
+    scheduleNextTeaserMessage(currentIndex) {
+      var nextIndex = currentIndex + 1;
+      if (nextIndex >= this.teaserMessages.length) return;
+      var currentMessage = this.teaserMessages[currentIndex];
+      var delay = this.teaserPresentationDelay(currentMessage);
+      this.teaserCycleTimeout = window.setTimeout(() => {
+        this.teaserCycleTimeout = null;
+        this.showTeaserMessage(nextIndex);
+        this.scheduleNextTeaserMessage(nextIndex);
+      }, delay);
+    },
+    // Visibility is managed with the existing `hidden` class for initially
+    // concealed teaser messages. This keeps JS from restructuring teaser markup.
+    showTeaserMessage(index) {
+      this.teaserMessages.forEach((message, messageIndex) => {
+        message.classList.toggle('hidden', messageIndex !== index);
+      });
+    },
+    // Safe to call even when no timer exists. Lifecycle hooks call this before
+    // starting, hiding, or tearing down the teaser so only one cycle can be alive.
+    stopTeaserCycle() {
+      if (this.teaserCycleTimeout === null || this.teaserCycleTimeout === undefined) return;
+      window.clearTimeout(this.teaserCycleTimeout);
+      this.teaserCycleTimeout = null;
+    },
+    // Invalid or missing delay values should not break teaser rendering. Treat
+    // them as zero, then use a small minimum so zero-delay presentations advance
+    // deliberately instead of flashing through every message in one frame.
+    teaserMessageDelay(message) {
+      var delay = Number(message.dataset.delaySeconds || 0);
+      return Number.isFinite(delay) ? delay : 0;
+    },
+    teaserPresentationDelay(message) {
+      return Math.max(this.teaserMessageDelay(message) * 1000, 250);
+    },
+    // A rendered transcript means the visitor is no longer in the pre-conversation
+    // state. The hidden template is deliberately excluded because it is not a live
+    // customer-visible message.
+    hasRenderedConversationMessages() {
+      var messages = [];
+      try {
+        messages = Array.from(this.messageTargets || []);
+      } catch (_error) {
+        messages = [];
+      }
+      return messages.some(message => message !== this.messageTemplateTarget);
+    },
+    teaserSeenKey() {
+      return "hellotext:webchat:".concat(this.idValue || this.element.id, ":teaser-seen");
+    },
+    teaserSeenForSession() {
+      try {
+        return window.sessionStorage.getItem(this.teaserSeenKey()) === 'true';
+      } catch (_error) {
+        return false;
+      }
+    },
+    markTeaserSeenForSession() {
+      try {
+        window.sessionStorage.setItem(this.teaserSeenKey(), 'true');
+      } catch (_error) {
+        // Storage can be unavailable in locked-down browsers. The in-memory hide
+        // still keeps the active controller from showing the teaser again.
+      }
+    },
+    // Opening or sending ends the pre-conversation window for this browser
+    // session. Incoming message teasers are separate ephemeral content, so they
+    // use `hideTeaser`/`updateMessageTeaser` without writing this session flag.
+    dismissTeaserForSession() {
+      this.markTeaserSeenForSession();
+      this.hideTeaser();
+    },
+    // Stopping the timer before hiding prevents queued presentation steps from
+    // flipping hidden messages after the teaser surface has been dismissed.
+    hideTeaser() {
+      this.stopTeaserCycle();
+      if (this.hasTeaserTarget) {
+        this.teaserTarget.classList.add('invisible');
+      }
+    },
+    // A teaser surface click is a user request to open chat, but links inside the
+    // teaser already have native browser behavior. Leaving anchors alone keeps
+    // external URLs and `tel:` actions working without extra JS.
+    onTeaserClick(event) {
+      if (event.target.closest('a')) return;
+      this.dismissTeaserForSession();
+      this.show();
+    }
+  });
+};