more toolbar buttons

src/App/App.tsx

@@ -112,7 +112,7 @@ export function App() {
           paddingLeft: 1,
         }}>
           <AST {...{...ast, rt: rt.at(rtIdx!)}}/>
-          <hr/>
+          <br/>
           <RTHistory {...{ast, rt, rtIdx, setTime, setRTIdx}}/>
         </Box>
     </Stack>

src/App/TopPanel.tsx

@@ -102,13 +102,14 @@ export function TopPanel({rt, time, setTime, onInit, onClear, onRaise, ast, mode
   return <>
     <div className="toolbar">
       {([
-        ["and", <RountangleIcon kind="and"/>],
+        ["and", "AND-states", <RountangleIcon kind="and"/>],
-        ["or", <RountangleIcon kind="or"/>],
+        ["or", "OR-states", <RountangleIcon kind="or"/>],
-        ["pseudo", <PseudoStateIcon/>],
+        ["pseudo", "pseudo-states", <PseudoStateIcon/>],
-        ["transition", <TrendingFlatIcon fontSize="small"/>],
+        ["transition", "transitions", <TrendingFlatIcon fontSize="small"/>],
-        ["text", <>T</>],
+        ["text", "text", <>T</>],
-      ] as [InsertMode, ReactElement][]).map(([m, buttonTxt]) =>
+      ] as [InsertMode, string, ReactElement][]).map(([m, hint, buttonTxt]) =>
         <button
+          title={"insert "+hint}
           disabled={mode===m}
           onClick={() => setMode(m)}
         >{buttonTxt}</button>)}