Add the Button component.

CMakeLists.txt

@@ -65,6 +65,18 @@ add_library(dom
 )
 
 add_library(component
+  include/ftxui/component/button.hpp
+  include/ftxui/component/checkbox.hpp
+  include/ftxui/component/component.hpp
+  include/ftxui/component/container.hpp
+  include/ftxui/component/event.hpp
+  include/ftxui/component/input.hpp
+  include/ftxui/component/menu.hpp
+  include/ftxui/component/radiobox.hpp
+  include/ftxui/component/receiver.hpp
+  include/ftxui/component/screen_interactive.hpp
+  include/ftxui/component/toggle.hpp
+  src/ftxui/component/button.cpp
   src/ftxui/component/checkbox.cpp
   src/ftxui/component/component.cpp
   src/ftxui/component/container.cpp
@@ -75,16 +87,6 @@ add_library(component
   src/ftxui/component/radiobox.cpp
   src/ftxui/component/screen_interactive.cpp
   src/ftxui/component/toggle.cpp
-  include/ftxui/component/checkbox.hpp
-  include/ftxui/component/component.hpp
-  include/ftxui/component/container.hpp
-  include/ftxui/component/event.hpp
-  include/ftxui/component/input.hpp
-  include/ftxui/component/menu.hpp
-  include/ftxui/component/radiobox.hpp
-  include/ftxui/component/screen_interactive.hpp
-  include/ftxui/component/receiver.hpp
-  include/ftxui/component/toggle.hpp
 )
 
 add_library(ftxui::screen ALIAS screen)

examples/component/CMakeLists.txt

@@ -4,9 +4,11 @@ function(example name)
   set_property(TARGET ${name} PROPERTY CXX_STANDARD 17)
 endfunction(example)
 
+example(button)
 example(checkbox)
 example(checkbox_in_frame)
 example(gallery)
+example(homescreen)
 example(input)
 example(menu)
 example(menu2)
@@ -16,4 +18,3 @@ example(radiobox_in_frame)
 example(tab_horizontal)
 example(tab_vertical)
 example(toggle)
-example(homescreen)

examples/component/button.cpp

@@ -0,0 +1,48 @@
+// Copyright 2020 Arthur Sonzogni. All rights reserved.
+// Use of this source code is governed by the MIT license that can be found in
+// the LICENSE file.
+
+#include "ftxui/component/button.hpp"
+
+#include "ftxui/component/component.hpp"
+#include "ftxui/component/container.hpp"
+#include "ftxui/component/screen_interactive.hpp"
+
+using namespace ftxui;
+
+class MyComponent : public Component {
+ private:
+  std::vector<std::unique_ptr<Button>> buttons_;
+  Container container_ = Container::Horizontal();
+
+ public:
+  MyComponent() {
+    Add(&container_);
+
+    auto button_add = std::make_unique<Button>();
+    auto button_remove = std::make_unique<Button>();
+    container_.Add(button_add.get());
+    container_.Add(button_remove.get());
+    button_add->label = L"Add one button";
+    button_remove->label = L"Remove last button";
+
+    button_add->on_click = [&] {
+      auto extra_button = std::make_unique<Button>();
+      extra_button->label = L"extra button";
+      container_.Add(extra_button.get());
+      buttons_.push_back(std::move(extra_button));
+    };
+
+    button_remove->on_click = [&] { buttons_.resize(buttons_.size() - 1); };
+
+    buttons_.push_back(std::move(button_add));
+    buttons_.push_back(std::move(button_remove));
+  }
+};
+
+int main(int argc, const char* argv[]) {
+  auto screen = ScreenInteractive::TerminalOutput();
+  MyComponent component;
+  screen.Loop(&component);
+  return 0;
+}

examples/component/gallery.cpp

@@ -3,6 +3,7 @@
 // the LICENSE file.
 
 #include "ftxui/component/checkbox.hpp"
+#include "ftxui/component/button.hpp"
 #include "ftxui/component/container.hpp"
 #include "ftxui/component/input.hpp"
 #include "ftxui/component/menu.hpp"
@@ -21,6 +22,7 @@ class MyComponent : public Component {
   CheckBox checkbox2;
   RadioBox radiobox;
   Input input;
+  Button button;
 
  public:
   MyComponent() {
@@ -55,6 +57,10 @@ class MyComponent : public Component {
 
     input.placeholder = L"Input placeholder";
     container.Add(&input);
+
+    button.label = L"Quit";
+    button.on_click = [&] { on_quit(); };
+    container.Add(&button);
   }
 
   Element Render(std::wstring name, Component& component) {
@@ -66,24 +72,30 @@ class MyComponent : public Component {
   }
 
   Element Render() override {
-    return vbox({
-               Render(L"menu", menu),
-               separator(),
-               Render(L"toggle", toggle),
-               separator(),
-               Render(L"checkbox", checkbox_container),
-               separator(),
-               Render(L"radiobox", radiobox),
-               separator(),
-               Render(L"input", input) | size(WIDTH, LESS_THAN, 30),
-           }) |
-           border;
+    return  //
+        vbox({
+            Render(L"menu", menu),
+            separator(),
+            Render(L"toggle", toggle),
+            separator(),
+            Render(L"checkbox", checkbox_container),
+            separator(),
+            Render(L"radiobox", radiobox),
+            separator(),
+            Render(L"input", input) | size(WIDTH, LESS_THAN, 30),
+            separator(),
+            Render(L"button", button),
+        }) |
+        border;
   }
+
+  std::function<void()> on_quit = [] {};
 };
 
 int main(int argc, const char* argv[]) {
   auto screen = ScreenInteractive::FitComponent();
   MyComponent component;
+  component.on_quit = screen.ExitLoopClosure();
   screen.Loop(&component);
 
   return 0;

include/ftxui/component/button.hpp

@@ -0,0 +1,36 @@
+#ifndef FTXUI_COMPONENT_BUTTON_HPP
+#define FTXUI_COMPONENT_BUTTON_HPP
+
+#include <functional>
+
+#include "ftxui/component/component.hpp"
+
+namespace ftxui {
+
+/// @brief A button. An action is associated to the click event.
+/// @ingroup dom
+class Button : public Component {
+ public:
+  // Constructor.
+  Button() = default;
+  Button(std::wstring label) : label(label) {}
+  ~Button() override = default;
+
+  /// The Button label.
+  std::wstring label = L"button";
+
+  /// Called when the user press the "enter" button.
+  std::function<void()> on_click = [] {};
+
+  // Component implementation.
+  Element Render() override;
+  bool OnEvent(Event) override;
+};
+
+}  // namespace ftxui
+
+#endif /* end of include guard: FTXUI_COMPONENT_BUTTON_HPP */
+
+// Copyright 2020 Arthur Sonzogni. All rights reserved.
+// Use of this source code is governed by the MIT license that can be found in
+// the LICENSE file.

src/ftxui/component/button.cpp

@@ -0,0 +1,26 @@
+#include "ftxui/component/button.hpp"
+
+#include <functional>
+
+namespace ftxui {
+
+Element Button::Render() {
+  if (Focused())
+    return text(label) | border |inverted;
+  else
+    return text(label) | border;
+}
+
+bool Button::OnEvent(Event event) {
+  if (event == Event::Return) {
+    on_click();
+    return true;
+  }
+  return false;
+}
+
+}  // namespace ftxui
+
+// Copyright 2020 Arthur Sonzogni. All rights reserved.
+// Use of this source code is governed by the MIT license that can be found in
+// the LICENSE file.