             [re-complete.core :as re-complete]))
 
 ;; (set! re-com.box/debug true)
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;
+;;;      Tour          ;;;
+;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(def tour
+  (make-tour [:step1 :step2 :step3 :step4 :step5 :step6 :step7]))
+
+(def tour-steps
+  {:step1 {:title "Tour 1 of 7"
+           :body "Start"}
+   :step2 {:title "Tour 2 of 7"
+           :body "Reset"}
+   :step3 {:title "Tour 3 of 7"
+           :body "Clear"}
+   :step4 {:title "Tour 4 of 7"
+           :body "Create Gist"}
+   :step5 {:title "Tour 5 of 7"
+           :body "Clear examples"}
+   :step6 {:title "Tour 6 of 7"
+           :body "Switch input mode"}
+   :step7 {:title "Tour 7 of 7"
+           :body "Console"}})
+
+(defn create-tour-step
+  ([step position anchor]
+   (create-tour-step step position anchor nil))
+  ([step position anchor style]
+   (let [step-keyword (keyword (str "step" step))]
+     [popover-anchor-wrapper
+      :showing? (step-keyword tour)
+      :position position
+      :anchor anchor
+      :popover [popover-content-wrapper
+                :showing? (:step2 tour)
+                :position position
+                :width    "250px"
+                :title    [:strong (get-in tour-steps [step-keyword :title])]
+                :body     [:div (get-in tour-steps [step-keyword :body])
+                           [make-tour-nav tour]]]
+      :style  (if style
+                style
+                (align-style :align-self :end))])))
 
 ;;;;;;;;;;;;;;;;;;;;;;;;;;
 ;;;      Buttons       ;;;

  (let [media-query (subscribe [:media-query-size])
        console (console/console console-key opts)]
    (fn repl-component-form2 []
      (let [children [[cljs-buttons]
                      [box
                       :size "0 0 auto"
                       :child [console]]
                      [re-complete/completions console-key #(do (dispatch [:console-set-autocompleted-text console-key])
                                                                (dispatch [:focus-console-editor console-key]))]]]
        (if (= :narrow @media-query)
          [v-box
           :size "1 1 auto"

            [re-frame.core :refer [subscribe dispatch]]
            [re-com.core :refer [md-icon-button h-box v-box box gap button input-text
                                 popover-content-wrapper popover-anchor-wrapper hyperlink-href
                                 popover-tooltip title label scroller line modal-panel align-style
                                 make-tour start-tour make-tour-nav p]]
            [re-com.box :refer [flex-child-style]]
            [re-com.util :refer [px]]
            [clairvoyant.core :refer-macros [trace-forms]]
