extractStatefulComponent

Maturity: stable

Since 1.0.0

View the Project on GitHub workiva/over_react

When a VDom element is selected by the user, the assist extracts the selection into the return value of render within a new OverReact stateful component declaration:

EXAMPLE:

ReactElement renderTheFoo() {
  return Dom.div()(
    'oh hai',
    Dom.span()('again'),
    Dom.em()(' wow this is a lot we should extract it into a component!'),
  );
}

BECOMES:

ReactElement renderTheFoo() {
  return Foo()();
}

UiFactory<FooProps> Foo = _$Foo; // ignore: undefined_identifier

mixin FooProps on UiProps {}

mixin FooState on UiState {}

class FooComponent extends UiStatefulComponent2<FooProps, FooState> {
  @override
  get defaultProps => (newProps());
  
  @override
  get initialState => (newState());

  @override
  render() {
    return Dom.div()(
      'oh hai',
      Dom.span()('again'),
      Dom.em()(' wow this is a lot we should extract it into a component!'),
    );
  }
}