All components must have focus

src/ui/layout/components/progress_bar.rs

@@ -31,12 +31,23 @@ use tui::{
     widgets::{Block, Borders, Gauge},
 };
 
-// NOTE: this component doesn't handle any state
+// -- state
+
+struct OwnStates {
+    focus: bool,
+}
+
+impl Default for OwnStates {
+    fn default() -> Self {
+        OwnStates { focus: false }
+    }
+}
 
 // -- component
 
 pub struct ProgressBar {
     props: Props,
+    states: OwnStates,
 }
 
 impl ProgressBar {
@@ -44,7 +55,10 @@ impl ProgressBar {
     ///
     /// Instantiate a new Progress Bar
     pub fn new(props: Props) -> Self {
-        ProgressBar { props }
+        ProgressBar {
+            props,
+            states: OwnStates::default(),
+        }
     }
 }
 
@@ -121,8 +135,13 @@ impl Component for ProgressBar {
     /// Handle input event and update internal states.
     /// Returns a Msg to the view.
     /// Returns always None, since cannot have any focus
-    fn on(&mut self, _ev: InputEvent) -> Msg {
+    fn on(&mut self, ev: InputEvent) -> Msg {
-        Msg::None
+        // Return key
+        if let InputEvent::Key(key) = ev {
+            Msg::OnKey(key)
+        } else {
+            Msg::None
+        }
     }
 
     /// ### get_value
@@ -146,13 +165,17 @@ impl Component for ProgressBar {
 
     /// ### blur
     ///
-    /// Blur component; does nothing on this component
+    /// Blur component
-    fn blur(&mut self) {}
+    fn blur(&mut self) {
+        self.states.focus = false;
+    }
 
     /// ### active
     ///
-    /// Active component; does nothing on this component
+    /// Active component
-    fn active(&mut self) {}
+    fn active(&mut self) {
+        self.states.focus = true;
+    }
 }
 
 #[cfg(test)]
@@ -174,8 +197,11 @@ mod tests {
                 .build(),
         );
         // Focus
+        assert_eq!(component.states.focus, false);
         component.active();
+        assert_eq!(component.states.focus, true);
         component.blur();
+        assert_eq!(component.states.focus, false);
         // Should umount
         assert_eq!(component.should_umount(), false);
         // Get value
@@ -185,7 +211,7 @@ mod tests {
         // Event
         assert_eq!(
             component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),
-            Msg::None
+            Msg::OnKey(KeyEvent::from(KeyCode::Delete))
         );
     }
 }

src/ui/layout/components/table.rs

@@ -33,7 +33,17 @@ use tui::{
     widgets::{Block, BorderType, Borders, List, ListItem},
 };
 
-// NOTE: this component doesn't handle any state
+// -- state
+
+struct OwnStates {
+    focus: bool,
+}
+
+impl Default for OwnStates {
+    fn default() -> Self {
+        OwnStates { focus: false }
+    }
+}
 
 // -- component
 
@@ -42,6 +52,7 @@ use tui::{
 /// Table is a table component. List n rows with n text span columns
 pub struct Table {
     props: Props,
+    states: OwnStates,
 }
 
 impl Table {
@@ -49,7 +60,10 @@ impl Table {
     ///
     /// Instantiate a new Table component
     pub fn new(props: Props) -> Self {
-        Table { props }
+        Table {
+            props,
+            states: OwnStates::default(),
+        }
     }
 }
 
@@ -134,8 +148,13 @@ impl Component for Table {
     /// Handle input event and update internal states.
     /// Returns a Msg to the view.
     /// Returns always None, since cannot have any focus
-    fn on(&mut self, _ev: InputEvent) -> Msg {
+    fn on(&mut self, ev: InputEvent) -> Msg {
-        Msg::None
+        // Return key
+        if let InputEvent::Key(key) = ev {
+            Msg::OnKey(key)
+        } else {
+            Msg::None
+        }
     }
 
     /// ### get_value
@@ -159,13 +178,17 @@ impl Component for Table {
 
     /// ### blur
     ///
-    /// Blur component; does nothing on this component
+    /// Blur component
-    fn blur(&mut self) {}
+    fn blur(&mut self) {
+        self.states.focus = false;
+    }
 
     /// ### active
     ///
-    /// Active component; does nothing on this component
+    /// Active component
-    fn active(&mut self) {}
+    fn active(&mut self) {
+        self.states.focus = true;
+    }
 }
 
 #[cfg(test)]
@@ -193,8 +216,11 @@ mod tests {
                 .build(),
         );
         // Focus
+        assert_eq!(component.states.focus, false);
         component.active();
+        assert_eq!(component.states.focus, true);
         component.blur();
+        assert_eq!(component.states.focus, false);
         // Should umount
         assert_eq!(component.should_umount(), false);
         // Get value
@@ -204,7 +230,7 @@ mod tests {
         // Event
         assert_eq!(
             component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),
-            Msg::None
+            Msg::OnKey(KeyEvent::from(KeyCode::Delete))
         );
     }
 }

src/ui/layout/components/text.rs

@@ -32,12 +32,23 @@ use tui::{
     widgets::Paragraph,
 };
 
-// NOTE: this component doesn't handle any state
+// -- state
+
+struct OwnStates {
+    focus: bool,
+}
+
+impl Default for OwnStates {
+    fn default() -> Self {
+        OwnStates { focus: false }
+    }
+}
 
 // -- component
 
 pub struct Text {
     props: Props,
+    states: OwnStates,
 }
 
 impl Text {
@@ -45,7 +56,10 @@ impl Text {
     ///
     /// Instantiate a new Text component
     pub fn new(props: Props) -> Self {
-        Text { props }
+        Text {
+            props,
+            states: OwnStates::default(),
+        }
     }
 }
 
@@ -117,8 +131,13 @@ impl Component for Text {
     /// Handle input event and update internal states.
     /// Returns a Msg to the view.
     /// Returns always None, since cannot have any focus
-    fn on(&mut self, _ev: InputEvent) -> Msg {
+    fn on(&mut self, ev: InputEvent) -> Msg {
-        Msg::None
+        // Return key
+        if let InputEvent::Key(key) = ev {
+            Msg::OnKey(key)
+        } else {
+            Msg::None
+        }
     }
 
     /// ### get_value
@@ -142,13 +161,17 @@ impl Component for Text {
 
     /// ### blur
     ///
-    /// Blur component; does nothing on this component
+    /// Blur component
-    fn blur(&mut self) {}
+    fn blur(&mut self) {
+        self.states.focus = false;
+    }
 
     /// ### active
     ///
-    /// Active component; does nothing on this component
+    /// Active component
-    fn active(&mut self) {}
+    fn active(&mut self) {
+        self.states.focus = true;
+    }
 }
 
 #[cfg(test)]
@@ -178,8 +201,11 @@ mod tests {
                 .build(),
         );
         // Focus
+        assert_eq!(component.states.focus, false);
         component.active();
+        assert_eq!(component.states.focus, true);
         component.blur();
+        assert_eq!(component.states.focus, false);
         // Should umount
         assert_eq!(component.should_umount(), false);
         // Get value
@@ -189,7 +215,7 @@ mod tests {
         // Event
         assert_eq!(
             component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),
-            Msg::None
+            Msg::OnKey(KeyEvent::from(KeyCode::Delete))
         );
     }
 }