flow_chat 0.9.0 → 0.10.0

data/lib/flow_chat/whatsapp/middleware/choice_mapper.rb

@@ -1,38 +1,37 @@
-require_relative "../id_generator"
-
 module FlowChat
   module Whatsapp
     module Middleware
-      # Maps WhatsApp button/list IDs back to original choice keys
+      # Maps what WhatsApp sends back to the choice key the flow branches on.
       #
-      # Similar to USSD::ChoiceMapper, but for WhatsApp interactive messages.
-      # WhatsApp uses generated IDs (from IdGenerator) for buttons and list items,
-      # and this middleware maps the user's response back to the original choice key.
+      # The value on the wire is the title the user was shown, so a tap and a
+      # user typing what they read arrive as the same string and resolve
+      # through the same map.
       #
       # Flow:
-      # 1. Flow returns choices with original keys (e.g., {"create" => "Create Account"})
-      # 2. Middleware generates WhatsApp-safe IDs from labels
-      # 3. Middleware transforms choices to use generated IDs as keys
-      # 4. Middleware stores mapping (generated_id → original_key)
-      # 5. Renderer receives transformed choices and renders them
-      # 6. User selects a button/list item (WhatsApp sends the ID)
-      # 7. This middleware intercepts and replaces ID with original key
-      # 8. Flow sees the original choice key (not the generated ID)
+      # 1. Flow returns choices with original keys ({"create" => "Create Account"})
+      # 2. This middleware asks FlowChat::ChoiceTitles for each displayed title
+      # 3. It re-keys the choices by title and stores title => original key
+      # 4. Renderer receives the re-keyed choices and renders them
+      # 5. User taps a button, or types the title on it
+      # 6. This middleware resolves either back to the original key
       #
       # @example
       #   # Flow provides: {"create" => "Create Account"}
-      #   # Middleware generates ID: "Create Account"
-      #   # Middleware transforms to: {"Create Account" => "Create Account"}
-      #   # Middleware stores: {"Create Account" => "create"}
-      #   # User clicks, WhatsApp sends: "Create Account"
-      #   # Middleware intercepts and maps back to: "create"
+      #   # Titles built:  "Create Account"
+      #   # Transformed:   {"Create Account" => "Create Account"}
+      #   # Mapping:       {"Create Account" => "create"}
       #
       #   # With duplicates: {"yes" => "Accept", "no" => "Accept"}
-      #   # IDs generated: "Accept", "Accept 3a4"
-      #   # Transformed: {"Accept" => "Accept", "Accept 3a4" => "Accept"}
-      #   # Mapping: {"Accept" => "yes", "Accept 3a4" => "no"}
-      #   # User clicks second, WhatsApp sends: "Accept 3a4"
-      #   # Middleware maps back to: "no"
+      #   # Titles built:  "1. Accept", "2. Accept"
+      #   # Mapping:       {"1. Accept" => "yes", "2. Accept" => "no"}
+      #
+      # A title is truncated to the rung's cap (see
+      # FlowChat::Whatsapp::Renderer::BUTTON_TITLE_LENGTH /
+      # LIST_ROW_TITLE_LENGTH). When truncation, or a duplicate label, would
+      # leave two titles indistinguishable, FlowChat::ChoiceTitles numbers
+      # every title in the set instead - which is what keeps them distinct,
+      # and why nothing here has to check for collisions itself. See its docs
+      # for why that decision is made once for the whole set.
       #
       class ChoiceMapper
         def initialize(app)
@@ -52,8 +51,25 @@ module FlowChat
             handle_choice_input
           end
 
-          # Clear choice mapping state for new flows
-          clear_choice_state_if_needed
+          # The maps belong to exactly one screen: this turn's, if it had a
+          # resolvable answer, or one that already fell out of use otherwise.
+          # Either way nothing here is still owed to the next screen, so they
+          # are cleared unconditionally rather than asked whether they still
+          # look "live" - create_id_mapping immediately below repopulates
+          # them whenever the app actually returns choices.
+          #
+          # An earlier version asked should_clear_for_new_flow? that question
+          # after handle_choice_input had already rewritten @context.input to
+          # the *resolved* value, which can equal one of the map's own keys
+          # (an Array choice's key is its label, and the wire value is the
+          # title built from that label), so the check answered
+          # "still live" about a value that was never a fresh reply. That let
+          # the maps survive into a free-text screen and reinterpret a typed
+          # answer there as the previous menu's choice. This was fixed once
+          # here in Task 6 and once for Messenger in Task 13; both fixes had
+          # the same shape and the same blind spot, which is why the guard is
+          # gone rather than patched a third time.
+          clear_choice_state
 
           # Call the app (executor -> flow)
           type, prompt, choices, media = @app.call(context)
@@ -69,46 +85,116 @@ module FlowChat
 
         private
 
+        # Titles first, then positions. A tap sends the title as its payload
+        # and a user who types what they read sends the same string, so both
+        # arrive at the same entry - which is why there is no separate alias
+        # map any more. A position is the fallback, and only means anything
+        # when a number is genuinely on screen; it loses to a title because a
+        # choice labelled "1" would otherwise be unreachable.
+        def resolved_choice
+          input = @context.input.to_s
+          get_choice_mapping[input] || get_position_mapping[input]
+        end
+
         def intercept?
-          # Intercept if we have choice mapping state and user input matches a generated ID
-          choice_mapping = get_choice_mapping
-          should_intercept = choice_mapping.present? &&
-            @context.input.present? &&
-            choice_mapping.key?(@context.input.to_s)
+          # Intercept if user input matches a generated id or a stored position
+          should_intercept = @context.input.present? && resolved_choice.present?
 
           if should_intercept
-            FlowChat.logger.debug { "Whatsapp::ChoiceMapper: Intercepting - input: #{@context.input}, mapped to: #{choice_mapping[@context.input.to_s]}" }
+            FlowChat.logger.debug { "Whatsapp::ChoiceMapper: Intercepting - input: #{@context.input}, mapped to: #{resolved_choice}" }
           end
 
           should_intercept
         end
 
         def handle_choice_input
-          choice_mapping = get_choice_mapping
-          original_choice = choice_mapping[@context.input.to_s]
+          original_choice = resolved_choice
 
           FlowChat.logger.info { "Whatsapp::ChoiceMapper: Resolving choice input #{@context.input} to #{original_choice}" }
 
-          # Replace the generated ID with the original choice key
+          # Replace the generated ID (or typed position) with the original choice key
           @context.input = original_choice
         end
 
+        # The value WhatsApp sends back IS the displayed title.
+        # FlowChat::ChoiceTitles guarantees the titles in a set are distinct -
+        # numbering the whole set when they would not be - so a title needs no
+        # separate id space to be unique in, and there is nothing left for a
+        # generated id to collide with.
+        #
+        # This replaces an id generated by normalizing the label, which was
+        # lossy: stripping "!" turned "Yes!" into the id "Yes", which was
+        # another choice's label verbatim, and the id map was consulted before
+        # the alias map. Titles are also bounded by the rung's cap (20 button,
+        # 24 list row), comfortably inside WhatsApp's id caps of 256 and 200.
         def create_id_mapping(choices)
-          # Choices are always a hash after normalize_choices
-          id_generator = IdGenerator.new
-          id_choices = {}
+          cap = display_title_cap(choices.length)
+          return passthrough_mapping(choices) if cap.nil?
+
+          title_choices = {}
           choice_mapping = {}
 
-          choices.each do |key, value|
-            # Generate WhatsApp-safe ID from the label
-            generated_id = id_generator.generate_id(value.to_s)
-            id_choices[generated_id] = value
-            choice_mapping[generated_id] = key.to_s
+          FlowChat::ChoiceTitles.build(choices, cap).each do |key, label, title, _truncated|
+            title_choices[title] = label
+            choice_mapping[title] = key
           end
 
           store_choice_mapping(choice_mapping)
-          FlowChat.logger.debug { "Whatsapp::ChoiceMapper: Created mapping: #{choice_mapping}" }
-          id_choices
+
+          if number_choices?(choices)
+            store_position_mapping(choices.keys.map.with_index(1) { |key, i| [i.to_s, key.to_s] }.to_h)
+          else
+            clear_position_mapping
+          end
+
+          title_choices
+        end
+
+        # Above the row cap the renderer numbers the body and prints each full
+        # label beside its number, so the label itself is what is on screen and
+        # stays resolvable - nothing is truncated, so there is no shortened
+        # form to key on instead.
+        #
+        # A label shared by two choices is dropped rather than resolved to the
+        # first of them. It identifies neither on a screen that shows both, and
+        # the number printed next to each is the reply that does.
+        def passthrough_mapping(choices)
+          labels = choices.map { |key, label| [label.to_s, key.to_s] }
+          repeated = labels.map(&:first).tally
+
+          store_choice_mapping(labels.reject { |label, _| repeated[label] > 1 }.to_h)
+          store_position_mapping(choices.keys.map.with_index(1) { |key, i| [i.to_s, key.to_s] }.to_h)
+          choices
+        end
+
+        # The title cap the renderer will use for these choices, or nil above
+        # the list cap, where the renderer falls back to a numbered body and
+        # shows the full label (no truncation, so no alias is needed).
+        #
+        # Goes through FlowChat::Meta::ChoiceLadder, the same helper
+        # FlowChat::Whatsapp::Renderer#build_interactive_message consults
+        # (via FlowChat::Config.whatsapp#ladder_limits), rather than
+        # re-deriving the rung from its own count comparisons: the mapper
+        # runs before the renderer and has no way to ask it which rung it
+        # chose, so both asking the same shared helper is what keeps them
+        # from disagreeing, the same reason Messenger's mapper does this too.
+        def display_title_cap(count)
+          case FlowChat::Meta::ChoiceLadder.rung_for(count, FlowChat::Config.whatsapp.ladder_limits)
+          when :quick_replies then FlowChat::Whatsapp::Renderer::BUTTON_TITLE_LENGTH
+          when :carousel then FlowChat::Whatsapp::Renderer::LIST_ROW_TITLE_LENGTH
+          end
+        end
+
+        # A position number is only worth resolving when one is genuinely on
+        # screen: above the row cap, where the renderer has no title left to
+        # show and numbers the body directly (display_title_cap is nil), or
+        # on a button/list rung whose titles FlowChat::ChoiceTitles decided
+        # were ambiguous and prefixed with a number. A short, unique set of
+        # titles (the common case) shows no number at all, so a typed digit
+        # there is free text, not a position.
+        def number_choices?(choices)
+          cap = display_title_cap(choices.length)
+          cap.nil? || FlowChat::ChoiceTitles.ambiguous?(choices, cap)
         end
 
         def store_choice_mapping(mapping)
@@ -125,21 +211,22 @@ module FlowChat
           FlowChat.logger.debug { "Whatsapp::ChoiceMapper: Cleared choice mapping" }
         end
 
-        def clear_choice_state_if_needed
-          # Clear choice mapping if this is a new flow (no input or fresh start)
-          if @context.input.blank? || should_clear_for_new_flow?
-            clear_choice_mapping
-          end
+        def store_position_mapping(mapping)
+          @session.set("whatsapp.position_mapping", mapping)
+          FlowChat.logger.debug { "Whatsapp::ChoiceMapper: Stored position mapping: #{mapping}" }
+        end
+
+        def get_position_mapping
+          @session.get("whatsapp.position_mapping") || {}
         end
 
-        def should_clear_for_new_flow?
-          # Clear mapping if this input doesn't match any stored mapping
-          # This indicates we're in a new flow step
-          choice_mapping = get_choice_mapping
-          return false if choice_mapping.empty?
+        def clear_position_mapping
+          @session.delete("whatsapp.position_mapping")
+        end
 
-          # If input is present but doesn't match any mapping, we're in a new flow
-          @context.input.present? && !choice_mapping.key?(@context.input.to_s)
+        def clear_choice_state
+          clear_choice_mapping
+          clear_position_mapping
         end
       end
     end

data/lib/flow_chat/whatsapp/renderer.rb

@@ -5,6 +5,20 @@ module FlowChat
     class Renderer
       include FlowChat::Renderers::MarkdownSupport
 
+      # WhatsApp button and list row title limits. The choice mapper reads
+      # these too, to alias the truncated title it knows this renderer will
+      # display for a given choice count.
+      BUTTON_TITLE_LENGTH = 20
+      LIST_ROW_TITLE_LENGTH = 24
+
+      # Meta: "Media asset caption text. Maximum 1024 characters." Documented
+      # for image, video, and document messages. Audio and sticker messages'
+      # own schemas list only id/link (audio also has voice) - no caption
+      # field at all - so they can never carry the numbered body this way,
+      # however short it is.
+      MAX_CAPTION_LENGTH = 1024
+      CAPTIONABLE_MEDIA_TYPES = [:image, :video, :document].freeze
+
       attr_reader :message, :choices, :media
 
       def initialize(message, choices: nil, media: nil)
@@ -39,7 +53,11 @@ module FlowChat
         message.present? ? to_whatsapp(message) : nil
       end
 
-      def build_media_message
+      # @param caption [String, nil] defaults to the prompt text. Pass nil when
+      #   this media is a companion sent ahead of a choice message: the prompt
+      #   is about to appear in that message's body, and a caption here would
+      #   just duplicate it.
+      def build_media_message(caption: formatted_caption)
         media_type = media[:type] || :image
         url = media[:url]
         id = media[:id]
@@ -50,26 +68,28 @@ module FlowChat
           options = {}
           options[:url] = url if url
           options[:id] = id if id
-          options[:caption] = formatted_caption if formatted_caption
+          options[:caption] = caption if caption
           [:media_image, "", options]
         when :document
           options = {}
           options[:url] = url if url
           options[:id] = id if id
-          options[:caption] = formatted_caption if formatted_caption
+          options[:caption] = caption if caption
           options[:filename] = filename if filename
           [:media_document, "", options]
         when :audio
           options = {}
           options[:url] = url if url
           options[:id] = id if id
-          options[:caption] = formatted_caption if formatted_caption
+          # Meta's audio message schema carries id, link and voice, with no
+          # caption, so a caption here would claim a field the API does not
+          # accept. Same as stickers below.
           [:media_audio, "", options]
         when :video
           options = {}
           options[:url] = url if url
           options[:id] = id if id
-          options[:caption] = formatted_caption if formatted_caption
+          options[:caption] = caption if caption
           [:media_video, "", options]
         when :sticker
           options = {}
@@ -95,45 +115,99 @@ module FlowChat
         end
       end
 
+      # Media is additive: it does not change which choice surface is used.
+      # 3 or fewer choices is the one case WhatsApp can carry both in a
+      # single message (buttons with a media header), so that stays as is.
+      # Above that, there is no interactive surface left that can carry
+      # media - Meta's interactive message reference documents header.type:
+      # text for list messages; image, video and document headers are only
+      # defined for button messages - so the media goes out as its own
+      # message and the list or numbered rendering follows unchanged.
+      #
+      # The one exception is the numbered rung above the list cap: there the
+      # choices are already nothing but text, and a captionable media
+      # message can carry that text itself, so a captioned single message
+      # replaces the media-then-text split whenever it fits.
       def build_selection_message_with_media
-        # Convert array to hash with index-based keys if needed, same as build_selection_message
+        choice_hash = normalized_choices
+
+        return build_buttons_message_with_media(choice_hash) if buttons_rung?(choice_hash.length)
+
+        type, content, options = build_interactive_message(choice_hash)
+
+        if type == :text
+          merged = media_caption_message(content)
+          return merged if merged
+        end
+
+        [type, content, options.merge(media: build_media_message(caption: nil))]
+      end
+
+      # Returns the single-message [type, content, options] triple when the
+      # media type can carry a caption and the combined text fits under
+      # Meta's cap, or nil when it does not - the caller falls back to the
+      # existing media-then-text split, which loses nothing.
+      def media_caption_message(content)
+        return nil unless CAPTIONABLE_MEDIA_TYPES.include?((media[:type] || :image).to_sym)
+        return nil if content.length > MAX_CAPTION_LENGTH
+
+        build_media_message(caption: content)
+      end
+
+      def normalized_choices
         if choices.is_a?(Array)
-          choice_hash = choices.each_with_index.to_h { |choice, index| [index.to_s, choice] }
-          build_buttons_message_with_media(choice_hash)
+          choices.each_with_index.to_h { |choice, index| [index.to_s, choice] }
         elsif choices.is_a?(Hash)
-          build_buttons_message_with_media(choices)
+          choices
         else
           raise ArgumentError, "choices must be an Array or Hash"
         end
       end
 
+      # Goes through FlowChat::Meta::ChoiceLadder, shared with Messenger and
+      # Instagram, rather than its own count comparisons - see
+      # FlowChat::Config::WhatsappConfig#ladder_limits for how WhatsApp's two
+      # flat thresholds are bridged to the shape that helper expects. The
+      # choice mapper asks the same question the same way, so the two cannot
+      # drift on which rung a given count lands on.
       def build_interactive_message(choice_hash)
-        if choice_hash.length <= 3
-          # Use buttons for 3 or fewer choices
-          build_buttons_message(choice_hash)
-        else
-          # Use list for more than 3 choices
-          build_list_message(choice_hash)
+        case FlowChat::Meta::ChoiceLadder.rung_for(choice_hash.length, limits.ladder_limits)
+        when :none, :quick_replies then build_buttons_message(choice_hash)
+        when :carousel then build_list_message(choice_hash)
+        when :numbered then build_numbered_message(choice_hash)
         end
       end
 
+      # :none (zero choices) counts as a buttons-rung count here, matching
+      # what the plain `count <= max_buttons` comparison this replaced did
+      # for zero: there is no real-world case with zero choices, but this
+      # keeps the two call sites in build_selection_message_with_media and
+      # build_interactive_message agreeing with each other regardless.
+      def buttons_rung?(count)
+        rung = FlowChat::Meta::ChoiceLadder.rung_for(count, limits.ladder_limits)
+        rung == :none || rung == :quick_replies
+      end
+
+      def limits
+        FlowChat::Config.whatsapp
+      end
+
+      # Whether titles are numbered, and the enumeration order positions come
+      # from, are both decided by FlowChat::ChoiceTitles over this same
+      # `choices` hash - the choice mapper goes through the same module over
+      # the same hash, so the two can never disagree on which titles are
+      # shown, which is what lets the mapper use a title as the wire value.
       def build_buttons_message(choices)
-        buttons = choices.map do |key, value|
-          {
-            id: key.to_s,
-            title: truncate_text(value.to_s, 20) # WhatsApp button titles have a 20 character limit
-          }
+        buttons = FlowChat::ChoiceTitles.build(choices, BUTTON_TITLE_LENGTH).map do |key, _label, title, _truncated|
+          {id: key, title: title}
         end
 
         [:interactive_buttons, formatted_message, {buttons: buttons}]
       end
 
       def build_buttons_message_with_media(choices)
-        buttons = choices.map do |key, value|
-          {
-            id: key.to_s,
-            title: truncate_text(value.to_s, 20) # WhatsApp button titles have a 20 character limit
-          }
+        buttons = FlowChat::ChoiceTitles.build(choices, BUTTON_TITLE_LENGTH).map do |key, _label, title, _truncated|
+          {id: key, title: title}
         end
 
         # Build media header
@@ -175,50 +249,37 @@ module FlowChat
         end
       end
 
+      # See the comment on build_buttons_message: numbering and position both
+      # come from FlowChat::ChoiceTitles over this same `choices` hash.
+      #
+      # The description (a longer, secondary line WhatsApp renders below the
+      # title, up to 72 chars) is not numbered: nothing resolves a typed
+      # description back to a choice, only the title and the position are
+      # aliased, so a prefix there would just be noise. It is populated
+      # whenever the title's own label portion didn't fit - whether that's
+      # because the label alone exceeds the cap, or because a position
+      # prefix ate into the room left for it.
       def build_list_message(choices)
-        items = choices.map do |key, value|
-          original_text = value.to_s
-          truncated_title = truncate_text(original_text, 24)
-
-          # If title was truncated, put full text in description (up to 72 chars)
-          description = if original_text.length > 24
-            truncate_text(original_text, 72)
-          end
+        items = FlowChat::ChoiceTitles.build(choices, LIST_ROW_TITLE_LENGTH).map do |key, label, title, truncated|
+          description = FlowChat::TextTruncator.truncate(label, 72) if truncated
 
           {
-            id: key.to_s,
-            title: truncated_title,
+            id: key,
+            title: title,
             description: description
           }.compact
         end
 
-        # If 10 or fewer items, use single section
-        sections = if items.length <= 10
-          [
-            {
-              title: "Options",
-              rows: items
-            }
-          ]
-        else
-          # Paginate into multiple sections (max 10 items per section)
-          items.each_slice(10).with_index.map do |section_items, index|
-            start_num = (index * 10) + 1
-            end_num = start_num + section_items.length - 1
-
-            {
-              title: "#{start_num}-#{end_num}",
-              rows: section_items
-            }
-          end
-        end
-
-        [:interactive_list, formatted_message, {sections: sections}]
+        [:interactive_list, formatted_message, {sections: [{title: "Options", rows: items}]}]
       end
 
-      def truncate_text(text, length)
-        return text if text.length <= length
-        text[0, length - 3] + "..."
+      # Above the row cap there is no interactive surface left, so the options go
+      # in the body and the user types a number. The choice mapper stores the
+      # positions for this rung so the digit resolves to the original key.
+      def build_numbered_message(choices)
+        numbered = choices.values.map.with_index(1) { |label, i| "#{i}. #{label}" }.join("\n")
+
+        [:text, "#{formatted_message}\n\n#{numbered}", {}]
       end
 
       # Convert text to WhatsApp format

data/lib/flow_chat.rb

@@ -10,16 +10,6 @@ loader.enable_reloading if defined?(Rails.env) && Rails.env.development?
 loader.setup
 
 module FlowChat
-  # Special input markers for non-text message types
-  module Input
-    LOCATION = "$location$"
-    MEDIA = "$media$"
-    CONTACT = "$contact$"
-
-    # Session markers
-    START = "$start$"
-  end
-
   def self.root
     Pathname.new __dir__
   end

data/site/.og-card.html

@@ -0,0 +1,89 @@
+<!doctype html>
+<!--
+  Source for the social preview image (og.png), rendered at 1200x630.
+  Regenerate after editing this file:
+
+    "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \
+      --headless --disable-gpu --hide-scrollbars --force-device-scale-factor=1 \
+      --window-size=1200,630 \
+      --screenshot="site/og.png" "file://$PWD/site/.og-card.html"
+
+  Any headless Chromium works. Keep the window size at 1200x630 (the 1.91:1
+  ratio OpenGraph/Twitter scrapers expect). This file is a dotfile so it stays
+  out of normal listings; it is only ever opened locally to produce og.png.
+-->
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<style>
+  * { box-sizing: border-box; margin: 0; padding: 0; }
+  html, body { width: 1200px; height: 630px; }
+  :root {
+    --bg: #101317; --fg: #d9dde3; --soft: #8b93a0; --accent: #8b83f0;
+    --rule: #262b32; --code-bg: #191d23;
+    --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
+    --sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  }
+  body {
+    background: var(--bg);
+    color: var(--fg);
+    font-family: var(--sans);
+    -webkit-font-smoothing: antialiased;
+    position: relative;
+    overflow: hidden;
+  }
+  .frame {
+    position: absolute; inset: 64px 72px;
+    display: flex; flex-direction: column; justify-content: space-between;
+  }
+  .top { display: flex; align-items: center; gap: 28px; }
+  .glyph { width: 108px; height: 108px; flex: none; display: block; }
+  .wordmark {
+    font-family: var(--mono);
+    font-size: 68px;
+    font-weight: 600;
+    letter-spacing: -0.01em;
+    line-height: 1;
+  }
+  .tagline {
+    font-size: 40px;
+    line-height: 1.32;
+    max-width: 1010px;
+    font-weight: 400;
+  }
+  .tagline b { font-weight: 600; }
+  .foot {
+    display: flex; align-items: center; justify-content: space-between;
+    font-family: var(--mono);
+    font-size: 24px;
+    color: var(--soft);
+    border-top: 1px solid var(--rule);
+    padding-top: 22px;
+  }
+  .foot .r { color: var(--accent); }
+</style>
+</head>
+<body>
+  <div class="frame">
+    <div class="top">
+      <svg class="glyph" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+        <rect width="32" height="32" rx="7" fill="#4f46c9"/>
+        <path d="M16 7h8a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-1v3l-3-3h-4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2z" fill="none" stroke="#fff" stroke-width="1.7" opacity="0.6"/>
+        <path d="M8 13h8a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-4l-3 3v-3H8a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2z" fill="#fff"/>
+      </svg>
+      <div class="wordmark">FlowChat</div>
+    </div>
+
+    <div class="tagline">
+      Write a conversation as an ordinary Ruby method. FlowChat replays it across
+      stateless webhooks, on <b>USSD</b>, <b>WhatsApp</b>, <b>Telegram</b>, and
+      <b>HTTP</b>.
+    </div>
+
+    <div class="foot">
+      <span>Conversational interfaces for Rails</span>
+      <span class="r">Radioactive Labs</span>
+    </div>
+  </div>
+</body>
+</html>

data/site/favicon.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="7" fill="#4f46c9"/>
+  <!-- two overlapping speech bubbles: a dialogue between two sides -->
+  <path d="M16 7h8a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-1v3l-3-3h-4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2z" fill="none" stroke="#fff" stroke-width="1.7" opacity="0.6"/>
+  <path d="M8 13h8a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2h-4l-3 3v-3H8a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2z" fill="#fff"/>
+</svg>