some issue

src/lib.rs

@@ -86,8 +86,9 @@ impl App {
             match self.element.update(key::read_key()) {
                 UpdateResponse::Exit => {
                     crossterm::terminal::disable_raw_mode().unwrap();
-                    utils::show_cursor();
                     utils::clear();
+                    utils::show_cursor();
+                    println!("");
                     return;
                 }
                 UpdateResponse::Tick(ticks) => {

src/main.rs

@@ -1,23 +1,53 @@
-use osui::{oml, ui::*, App};
+use osui::{key::KeyKind, oml, ui::*, App};
 
 fn main() {
     let mut app_screen = App::new();
-    app_screen.set_component(app());
+    app_screen.set_component(oml!(
+
+        tab {
+            div {
+                // Some welcome text
+                text("Welcome! This is the OSUI Tutorial! Press tab to go to the next Page or press Shift+Tab to go to a previous page";)
+            }
+
+            // A button example With a div
+
+            div {
+                text("On the bottom there is a button. To hover it click the down key, Then press enter to select it";)
+
+                // Button
+                button("Click me!"; y = 3, style = Style {
+                    hover_fg: Color::Magenta,
+                    ..Default::default()
+                }, on_click = |btn| {
+                    btn.text = "Press tab to go to the next page".to_string();
+                })
+                
+            }
+
+            div {
+                text("This is a menu, ";)
+
+                // Button
+                menu(y = 2, items = vec![
+                    String::from("Item 1"),
+                    String::from("Item 2"),
+                    String::from("Item 3"),
+                    String::from("Item 4"),
+                    String::from("Item 5"),
+                    String::from("Item 6"),
+                ], on_click = |m, k| {
+                    if k.kind == KeyKind::Escape {
+                        return ClickResponse::Exit;
+                    } else if k.kind == KeyKind::Enter {
+                        m.items[m.selected] = "Press Tab to go to the next page".to_string();
+                    }
+                    ClickResponse::None
+                })
+                
+            }
+        }
+
+    ));
     app_screen.run();
 }
-
-fn app() -> Box<Tab> {
-    oml!(
-        tab {
-            text("Hello!"; style = Style {
-                hover_fg: Color::Red,
-                ..Default::default()
-            })
-            button("Hello 2!"; y = 1, style = Style {
-                hover_fg: Color::Green,
-                ..Default::default()
-            })
-            menu(items = vec![String::from("Hello, World!"), String::from("Item 2!")])
-        }
-    )
-}

src/ui/elements.rs

@@ -207,9 +207,9 @@ element! {
         let mut v: String = " ".repeat((self.width / 2) - self.children.len());
         for (i, _) in (&self.children).into_iter().enumerate() {
             if i == self.child {
-                v += self.style.write_selected("*").as_str()
+                v += self.style.write_selected("•").as_str()
             } else {
-                v += self.style.write("*").as_str()
+                v += self.style.write("•").as_str()
             }
         }
         format!("{}\n{}", v, frame.join("\n"))
@@ -233,11 +233,16 @@ element! {
         pub items: Vec<String>,
         pub selected: usize,
         pub on_click: fn(&mut Menu, _: Key) -> ClickResponse,
+        pub binds: HashMap<KeyKind, String>,
     }
     defaults {
         items: Vec::new(),
         selected: 0,
-        on_click: |_, _|ClickResponse::None
+        on_click: |_, _|ClickResponse::None,
+        binds: HashMap::from([
+            (KeyKind::Char(String::from("w")), String::from("up")),
+            (KeyKind::Char(String::from("s")), String::from("down"))
+        ])
     }
     fn render(&mut self) -> String {
         let mut res: Vec<String> = Vec::new();
@@ -257,17 +262,28 @@ element! {
     }
 
     fn update(&mut self, k: Key) -> UpdateResponse {
-        if k.kind == KeyKind::Down {
-            if self.items.len() > self.selected + 1 {
-                self.selected += 1;
-            } else {
-                self.selected = 0;
-            }
-        } else if k.kind == KeyKind::Up {
-            if self.child > 0 {
-                self.selected -= 1;
-            } else {
-                self.selected = self.items.len() - 1;
+        if let Some(c) = self.binds.get(&k.kind) {
+            match c.as_str() {
+                "up" => {
+                    if self.selected > 0 {
+                        self.selected -= 1;
+                    } else {
+                        self.selected = self.items.len() - 1;
+                    }
+                }
+                "down" => {
+                    if self.items.len() > self.selected + 1 {
+                        self.selected += 1;
+                    } else {
+                        self.selected = 0;
+                    }
+                }
+                _ => {
+                    return match (self.on_click)(self, k) {
+                        ClickResponse::Exit => UpdateResponse::Exit,
+                        ClickResponse::None => UpdateResponse::None,
+                    }
+                }
             }
         } else {
             return match (self.on_click)(self, k) {

src/utils.rs

@@ -26,9 +26,10 @@ pub fn compress_string(input: &str, re: &Regex) -> (String, HashMap<usize, Strin
 
     let mut i = 0;
     while i < input_chars.len() {
-        if let Some(loc) = re.find(&input[i..]) {
+        if let Some(loc) = re.find(&(input_chars[i..]).iter().collect::<String>()) {
             if loc.start() == 0 {
-                let ansi_seq = &input[i..i + loc.end()];
+                let ansi_seq = &(input_chars[i..i + loc.end()]).iter().collect::<String>();
+                // let ansi_seq = &input[i..i + loc.end()];
                 matches_map.insert(res.len(), ansi_seq.to_string());
                 i += ansi_seq.chars().count();
             } else {