Add documentation for ResizableSplit

doc/example_list.h

@@ -1,7 +1,10 @@
 /// @example ./examples/util/print_key_press.cpp
+/// @example ./examples/dom/color_truecolor_HSV.cpp
 /// @example ./examples/dom/dbox.cpp
 /// @example ./examples/dom/separator.cpp
 /// @example ./examples/dom/style_color.cpp
+/// @example ./examples/dom/color_info_palette256.cpp
+/// @example ./examples/dom/color_truecolor_RGB.cpp
 /// @example ./examples/dom/paragraph.cpp
 /// @example ./examples/dom/style_blink.cpp
 /// @example ./examples/dom/style_dim.cpp
@@ -12,6 +15,7 @@
 /// @example ./examples/dom/html_like.cpp
 /// @example ./examples/dom/border.cpp
 /// @example ./examples/dom/style_underlined.cpp
+/// @example ./examples/dom/color_gallery.cpp
 /// @example ./examples/dom/gauge.cpp
 /// @example ./examples/dom/style_bold.cpp
 /// @example ./examples/dom/spinner.cpp
@@ -25,10 +29,15 @@
 /// @example ./examples/component/checkbox_in_frame.cpp
 /// @example ./examples/component/menu2.cpp
 /// @example ./examples/component/tab_horizontal.cpp
+/// @example ./examples/component/slider.cpp
+/// @example ./examples/component/slider_rgb.cpp
 /// @example ./examples/component/input.cpp
 /// @example ./examples/component/homescreen.cpp
 /// @example ./examples/component/radiobox.cpp
+/// @example ./examples/component/resizable_split.cpp
 /// @example ./examples/component/menu.cpp
 /// @example ./examples/component/menu_style.cpp
 /// @example ./examples/component/radiobox_in_frame.cpp
+/// @example ./examples/component/button.cpp
 /// @example ./examples/component/toggle.cpp
+/// @example ./examples/component/modal_dialog.cpp

doc/example_list.md

@@ -31,10 +31,11 @@
 @example ./examples/component/menu2.cpp
 @example ./examples/component/tab_horizontal.cpp
 @example ./examples/component/slider.cpp
+@example ./examples/component/slider_rgb.cpp
 @example ./examples/component/input.cpp
 @example ./examples/component/homescreen.cpp
 @example ./examples/component/radiobox.cpp
-@example ./examples/component/slider_rgb.cpp
+@example ./examples/component/resizable_split.cpp
 @example ./examples/component/menu.cpp
 @example ./examples/component/menu_style.cpp
 @example ./examples/component/radiobox_in_frame.cpp

doc/mainpage.md

@@ -459,6 +459,12 @@ Produced by: ftxui::Renderer() from \ref "ftxui/component/component.hpp". This
 component decorate another one by using a different function to render an
 interface.
 
+## CatchEvent 
+
+Produced by: ftxui::CatchEvent() from \ref "ftxui/component/component.hpp". This
+component decorate another one and catch the events before the underlying
+component.
+
 ## Container::Horizontal 
 
 Produced by: ftxui::Container::Horizontal() from
@@ -476,3 +482,21 @@ and handles keyboard/mouse navigation.
 Produced by: ftxui::Container::Tab() from
 "ftxui/component/component.hpp". It take a list of component and display only
 one of them. This is useful for implementing a tab bar.
+
+## ResizableSplit::{Left, Right, Top, Bottom} 
+
+Produced by:
+- ftxui::ResizableSplitLeft()
+- ftxui::ResizableSplitRight()
+- ftxui::ResizableSplitTop()
+- ftxui::ResizableSplitBottom()
+
+from "ftxui/component/component.hpp"
+
+It defines an horizontal or vertical separation in between two chilren
+component. The position of the split is variable and controlable using the
+mouse.
+
+@htmlonly
+<script id="asciicast-tprMH2EdkUoMb7D2YxgMGgpzx" src="https://asciinema.org/a/tprMH2EdkUoMb7D2YxgMGgpzx.js" async></script>
+@endhtmlonly

examples/component/resizable_split.cpp

@@ -18,10 +18,10 @@ int main(int argc, const char* argv[]) {
   int bottom_size = 10;
 
   auto container = middle;
-  container = ResizableSplit::Left(left, container, &left_size);
+  container = ResizableSplitLeft(left, container, &left_size);
-  container = ResizableSplit::Right(right, container, &right_size);
+  container = ResizableSplitRight(right, container, &right_size);
-  container = ResizableSplit::Top(top, container, &top_size);
+  container = ResizableSplitTop(top, container, &top_size);
-  container = ResizableSplit::Bottom(bottom, container, &bottom_size);
+  container = ResizableSplitBottom(bottom, container, &bottom_size);
 
   auto renderer =
       Renderer(container, [&] { return container->Render() | border; });

include/ftxui/component/component.hpp

@@ -44,12 +44,10 @@ Component Tab(Components children, int* selector);
 
 }  // namespace Container
 
-namespace ResizableSplit {
+Component ResizableSplitLeft(Component main, Component back, int* main_size);
-Component Left(Component main, Component back, int* main_size);
+Component ResizableSplitRight(Component main, Component back, int* main_size);
-Component Right(Component main, Component back, int* main_size);
+Component ResizableSplitTop(Component main, Component back, int* main_size);
-Component Top(Component main, Component back, int* main_size);
+Component ResizableSplitBottom(Component main, Component back, int* main_size);
-Component Bottom(Component main, Component back, int* main_size);
-}  // namespace ResizableSplit
 
 }  // namespace ftxui
 

src/ftxui/component/resizable_split.cpp

@@ -7,9 +7,9 @@
 namespace ftxui {
 namespace {
 
-class ResizableSplitLeft : public ComponentBase {
+class ResizableSplitLeftBase : public ComponentBase {
  public:
-  ResizableSplitLeft(Component main, Component child, int* main_size)
+  ResizableSplitLeftBase(Component main, Component child, int* main_size)
       : main_(main), child_(child), main_size_(main_size) {
     Add(Container::Horizontal({
         main,
@@ -63,9 +63,9 @@ class ResizableSplitLeft : public ComponentBase {
   Box global_box_;
 };
 
-class ResizableSplitRight: public ComponentBase {
+class ResizableSplitRightBase: public ComponentBase {
  public:
-  ResizableSplitRight(Component main, Component child, int* main_size)
+  ResizableSplitRightBase(Component main, Component child, int* main_size)
       : main_(main), child_(child), main_size_(main_size) {
     Add(Container::Horizontal({
         child,
@@ -119,9 +119,9 @@ class ResizableSplitRight: public ComponentBase {
   Box global_box_;
 };
 
-class ResizableSplitTop: public ComponentBase {
+class ResizableSplitTopBase: public ComponentBase {
  public:
-  ResizableSplitTop(Component main, Component child, int* main_size)
+  ResizableSplitTopBase(Component main, Component child, int* main_size)
       : main_(main), child_(child), main_size_(main_size) {
     Add(Container::Vertical({
         main,
@@ -175,9 +175,9 @@ class ResizableSplitTop: public ComponentBase {
   Box global_box_;
 };
 
-class ResizableSplitBottom: public ComponentBase {
+class ResizableSplitBottomBase: public ComponentBase {
  public:
-  ResizableSplitBottom(Component main, Component child, int* main_size)
+  ResizableSplitBottomBase(Component main, Component child, int* main_size)
       : main_(main), child_(child), main_size_(main_size) {
     Add(Container::Vertical({
         child,
@@ -233,25 +233,120 @@ class ResizableSplitBottom: public ComponentBase {
 
 }  // namespace
 
-namespace ResizableSplit {
+/// @brief An horizontal split in between two components, configurable using the
-Component Left(Component main, Component back, int* main_size) {
+/// mouse.
-  return Make<ResizableSplitLeft>(std::move(main), std::move(back), main_size);
+/// @param main The main component of size |main_size|, on the left.
+/// @param back The back component taking the remaining size, on the right.
+/// @param main_size The size of the |main| component.
+/// @ingroup component
+///
+/// ### Example
+///
+/// ```cpp
+/// auto screen = ScreenInteractive::Fullscreen();
+/// int left_size = 10;
+/// auto left = Renderer([] { return text(L"Left") | center;});
+/// auto right = Renderer([] { return text(L"right") | center;});
+/// auto split = ResizableSplitLeft(left, right, &left_size);
+/// screen.Loop(split);
+/// ```
+///
+/// ### Output
+///
+/// ```bash
+///           │           
+///    left   │   right   
+///           │           
+/// ```
+Component ResizableSplitLeft(Component main, Component back, int* main_size) {
+  return Make<ResizableSplitLeftBase>(std::move(main), std::move(back), main_size);
 }
-Component Right(Component main, Component back, int* main_size) {
+
-  return Make<ResizableSplitRight>(std::move(main), std::move(back), main_size);
+/// @brief An horizontal split in between two components, configurable using the
+/// mouse.
+/// @param main The main component of size |main_size|, on the right.
+/// @param back The back component taking the remaining size, on the left.
+/// @param main_size The size of the |main| component.
+/// @ingroup component
+///
+/// ### Example
+///
+/// ```cpp
+/// auto screen = ScreenInteractive::Fullscreen();
+/// int right_size = 10;
+/// auto left = Renderer([] { return text(L"Left") | center;});
+/// auto right = Renderer([] { return text(L"right") | center;});
+/// auto split = ResizableSplitRight(right, left, &right_size);
+/// screen.Loop(split);
+/// ```
+///
+/// ### Output
+///
+/// ```bash
+///           │
+///    left   │   right
+///           │
+/// ```
+Component ResizableSplitRight(Component main, Component back, int* main_size) {
+  return Make<ResizableSplitRightBase>(std::move(main), std::move(back),
+                                       main_size);
 }
-Component Top(Component main, Component back, int* main_size) {
+
-  return Make<ResizableSplitTop>(std::move(main), std::move(back), main_size);
+/// @brief An vertical split in between two components, configurable using the
+/// mouse.
+/// @param main The main component of size |main_size|, on the top.
+/// @param back The back component taking the remaining size, on the bottom.
+/// @param main_size The size of the |main| component.
+/// @ingroup component
+///
+/// ### Example
+///
+/// ```cpp
+/// auto screen = ScreenInteractive::Fullscreen();
+/// int top_size = 1;
+/// auto top = Renderer([] { return text(L"Top") | center;});
+/// auto bottom = Renderer([] { return text(L"Bottom") | center;});
+/// auto split = ResizableSplitTop(top, bottom, &top_size);
+/// screen.Loop(split);
+/// ```
+///
+/// ### Output
+///
+/// ```bash
+///    top
+/// ────────────
+///    bottom
+/// ```
+Component ResizableSplitTop(Component main, Component back, int* main_size) {
+  return Make<ResizableSplitTopBase>(std::move(main), std::move(back), main_size);
 }
-Component Bottom(Component main, Component back, int* main_size) {
+
-  return Make<ResizableSplitBottom>(std::move(main), std::move(back), main_size);
+/// @brief An vertical split in between two components, configurable using the
+/// mouse.
+/// @param main The main component of size |main_size|, on the bottom.
+/// @param back The back component taking the remaining size, on the top.
+/// @param main_size The size of the |main| component.
+/// @ingroup component
+///
+/// ### Example
+///
+/// ```cpp
+/// auto screen = ScreenInteractive::Fullscreen();
+/// int bottom_size = 1;
+/// auto top = Renderer([] { return text(L"Top") | center;});
+/// auto bottom = Renderer([] { return text(L"Bottom") | center;});
+/// auto split = ResizableSplit::Bottom(bottom, top, &bottom_size);
+/// screen.Loop(split);
+/// ```
+///
+/// ### Output
+///
+/// ```bash
+///    top
+/// ────────────
+///    bottom
+/// ```
+Component ResizableSplitBottom(Component main, Component back, int* main_size) {
+  return Make<ResizableSplitBottomBase>(std::move(main), std::move(back), main_size);
 }
-//Component Top(Component main, Component back, int main_size) {
-  //return Make<ResizableSplitTop>(std::move(main), std::move(back), main_size);
-//}
-//Component Bottom(Component main, Component back, int main_size) {
-  //return Make<ResizableSplitBottom>(std::move(main), std::move(back),
-                                    //main_size);
-//}
-}  // namespace ResizableSplit
 }  // namespace ftxui