Add text version of the response Timeline tab

src-web/components/core/Editor/timeline/extension.ts

@@ -0,0 +1,12 @@
+import { LanguageSupport, LRLanguage } from '@codemirror/language';
+import { parser } from './timeline';
+
+export const timelineLanguage = LRLanguage.define({
+  name: 'timeline',
+  parser,
+  languageData: {},
+});
+
+export function timeline() {
+  return new LanguageSupport(timelineLanguage);
+}

src-web/components/core/Editor/timeline/highlight.ts

@@ -0,0 +1,7 @@
+import { styleTags, tags as t } from '@lezer/highlight';
+
+export const highlight = styleTags({
+  OutgoingText: t.propertyName, // > lines - primary color (matches timeline icons)
+  IncomingText: t.tagName, // < lines - info color (matches timeline icons)
+  InfoText: t.comment, // * lines - subtle color (matches timeline icons)
+});

src-web/components/core/Editor/timeline/timeline.grammar

@@ -0,0 +1,21 @@
+@top Timeline { line* }
+
+line { OutgoingLine | IncomingLine | InfoLine | PlainLine }
+
+@skip {} {
+  OutgoingLine { OutgoingText Newline }
+  IncomingLine { IncomingText Newline }
+  InfoLine { InfoText Newline }
+  PlainLine { PlainText Newline }
+}
+
+@tokens {
+  OutgoingText { "> " ![\n]* }
+  IncomingText { "< " ![\n]* }
+  InfoText { "* " ![\n]* }
+  PlainText { ![\n]+ }
+  Newline { "\n" }
+  @precedence { OutgoingText, IncomingText, InfoText, PlainText }
+}
+
+@external propSource highlight from "./highlight"

src-web/components/core/Editor/timeline/timeline.terms.ts

@@ -0,0 +1,12 @@
+// This file was generated by lezer-generator. You probably shouldn't edit it.
+export const
+  Timeline = 1,
+  OutgoingLine = 2,
+  OutgoingText = 3,
+  Newline = 4,
+  IncomingLine = 5,
+  IncomingText = 6,
+  InfoLine = 7,
+  InfoText = 8,
+  PlainLine = 9,
+  PlainText = 10

src-web/components/core/Editor/timeline/timeline.ts

@@ -0,0 +1,18 @@
+// This file was generated by lezer-generator. You probably shouldn't edit it.
+import {LRParser} from "@lezer/lr"
+import {highlight} from "./highlight"
+export const parser = LRParser.deserialize({
+  version: 14,
+  states: "!pQQOPOOO`OPO'#C^OeOPO'#CaOjOPO'#CcOoOPO'#CeOOOO'#Ci'#CiOOOO'#Cg'#CgQQOPOOOOOO,58x,58xOOOO,58{,58{OOOO,58},58}OOOO,59P,59POOOO-E6e-E6e",
+  stateData: "z~ORPOUQOWROYSO~OSWO~OSXO~OSYO~OSZO~ORUWYW~",
+  goto: "m^PP_PP_P_P_PcPiTTOVQVOR[VTUOV",
+  nodeNames: "⚠ Timeline OutgoingLine OutgoingText Newline IncomingLine IncomingText InfoLine InfoText PlainLine PlainText",
+  maxTerm: 13,
+  propSources: [highlight],
+  skippedNodes: [0],
+  repeatNodeCount: 1,
+  tokenData: "%h~RZOYtYZ!]Zztz{!b{!^t!^!_#d!_!`t!`!a$f!a;'St;'S;=`!V<%lOt~ySY~OYtZ;'St;'S;=`!V<%lOt~!YP;=`<%lt~!bOS~~!gUY~OYtZptpq!yq;'St;'S;=`!V<%lOt~#QSW~Y~OY!yZ;'S!y;'S;=`#^<%lO!y~#aP;=`<%l!y~#iUY~OYtZptpq#{q;'St;'S;=`!V<%lOt~$SSU~Y~OY#{Z;'S#{;'S;=`$`<%lO#{~$cP;=`<%l#{~$kUY~OYtZptpq$}q;'St;'S;=`!V<%lOt~%USR~Y~OY$}Z;'S$};'S;=`%b<%lO$}~%eP;=`<%l$}",
+  tokenizers: [0],
+  topRules: {"Timeline":[0,1]},
+  tokenPrec: 36
+})