extractComponent

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 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 {}

class FooComponent extends UiComponent2<FooProps> {
  @override
  get defaultProps => (newProps());

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