A way to extend/inherit from components?

[litoj]

I haven't found a way with the current headers to create custom components by using existing ones and inheriting from them (other than ComponentBase). This is a must-have feature for me - instead of wrapping around the components used, I can just modify the small part I am working with and use the rest (i.e.: dynamic content modification - current Container copies the vector, so adding/removing of elemenst won't propagate).
I also struggle with a need to display the last component of a stack/list, so a wrapper there is also needed, but Renderer and CatchEvent (in combination) would add more than a single wrapping layer;

Am I missing something, or has everyone used a wrapper to go around?

[ArthurSonzogni]

It used to be possible, but then I wasn't able to extend FTXUI because the API surface was too large and I had to break users often.

So I removed this and the implementations are now fully hidden.

Instead of inheritance, what about using composition?

The Dropdown component is a Good example:
https://github.com/ArthurSonzogni/FTXUI/blob/main/src/ftxui/component/dropdown.cpp

Please let me know if you encounter any issues, and have suggestions how to improve FTXUI.

[litoj]

What exactly would composition mean?
I have a custom component, that can be rendered as an item/MenuEntry and when picked, will be added to the stack and displayed it's contents, which for directories means to display all of it's children, but that is already implemented in Container, though not accessible, so I defer events to it, but (probably) have to defer all virtual methods, so that focus works correctly. Currently the directory displays all content as focused, but not focusable, so it skips over my component when rendered in full show mode.

bool selected; // whether the component should display contents or as item
	Element Render() override {
		return selected ? container->Render() : asItem->Render();
	}

	bool OnEvent(Event e) override {
		if (ANote::OnEvent(e)) return true;
		if (!selected) return false;
		if (container->OnEvent(e)) return true;
		if (e == Event::Character('\n') && children_.size() > 0) {
			setSelected(false);
			((ANote*) children_[focused].get())->setSelected(true);
			stack.push_back(children_[focused]);
			return true;
		} else return false;
	}

Sorry, this is my first time trying to make a basic app, and it's for a school project.

[ArthurSonzogni]

Did you considered:

int selected_ = 0;

auto tab = Container::Tab({
  container,
  asItem
}, selected);

Add(tab);

then, the value of selected_ select either container or asItem to be displayed.

This way, you don't have to override Render() and you can simplify OnEvent. You can call ComponentBase::OnEvent(), which contains a good default impementation.

[litoj]

The problem is the container has to be recreated whenever I add or remove a new Component (ANote), because it copies the list instead of looking into it.

[ArthurSonzogni]

I see!
So, you would need to pass the list by reference. Maybe this is something we could implement.

[litoj]

It would be quite different from outside, so a separate class DynamicContainer alike would probably be the way(?)

[litoj]

Oh, I just noticed I also cannot use CatchEvent, because it first tries to catch, then defer to the component, I need the opposite order.

[ArthurSonzogni]

The second time someone ask for a second version. I wouldn't oppose against introducing alternative versions.

[litoj]

maybe with a bool for order?

[ArthurSonzogni]

I think a different function name would be better.

We could even have a version where we pass whether the event was handled by the underlying component.

• CatchEventFallback((Event -> bool))
• CatcheventFallback((Event, bool handled) -> bool)

[litoj]

or you can give the handler function access to the wrapped component, so it can decide on it's own, but that is then identical to overwriting OnEvent itself

[litoj]

BTW why is parent_ a simple pointer when everywhere else we use a shared pointer?

Edit: Because we don't have the reference to the original shared pointer anyway, but that could be improved by holding a shared_ptr onto itself and converting into it when necessary, that way only one ptr to a component ever exists. (Also further allowing for simpler component creation)

  const Component _this((ComponentBase *) this);
public:
  operator Component() const { return _this; }

[litoj]

The parent requirement is putting me into a difficult situation. Because I have two ways to display my component, based on the way it's being displayed it has a different parent, but changing the parent is possible only through the Add method that cannot be changed.

This means, that initially, all children are allright.
Then when I open one of the children, it loses track of its parent because it has to be parented by the root frame (or my dir wrapper to add back and new ANote elements).
Now when using the back element, the component goes back to item representation, but won't show up, because it has to have a parent (why?), but the parent doesn't know the component lost track of it and I have no way of updating it other than removing it from the parent and adding back (needing to sort the array again because we cannot insert element to a position).

This can be worked around by adding the element to the parent again and then manually removing it from the end again, but by directly accessing children_.
In most of the context parent is representing the container/content display form of my active component.

Edit: well, actually I cannot do even that because for whatever reason, cpp doesn't allow access of protected values of different entities, although the accessing class is extending the source of that protected value.

[litoj]

Well, now I am completely confused: When keeping the container Components by reference myself (forced access by converting pointer to current class type) and I add Components directly to the list and not through Add() it shows all components even when I don't update the parent of the previously focused ANote, but all children are constantly highlighted as focused:

on the other hand, when I do use the container's Add() method, even when I do update the parent (verified correctly set parent with debugger), it still doesn't show that dir item, but highlighting works as expected: