How to use the scrivito.provideComponent function in scrivito

currentMaxItems={this.state.maxItems}
            onClick={this.incrementMaxItems}
          />
          <br>
          <br>
        
      
    );
  }

  incrementMaxItems() {
    this.setState({ maxItems: this.state.maxItems + 10 });
  }
}

Scrivito.provideComponent("SearchResults", SearchResultsComponent);

const blacklistObjClasses = ["Image", "SearchResults", "Video"];

import * as React from "react";
import * as Scrivito from "scrivito";

import "./PriceWidget.scss";

Scrivito.provideComponent("PriceWidget", ({ widget }) => (
  <div>
    
    
    </div>

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("PricingSpecWidget", ({ widget }) => (
  <div>
    
    
  </div>
));

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("ImageWidget", ({ widget }) => {
  let image = (
    
  );

  const link = widget.get("link");
  if (link && !Scrivito.isInPlaceEditingActive()) {
    image = {image};
  }

  if (["center", "right"].includes(widget.get("alignment"))) {
    return <div>{image}</div>;
  }

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("LandingPage", ({ page }) => (
  
));

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("Homepage", ({ page }) => (
  
));

);
  }

  const classNames = ["btn"];
  classNames.push(widget.get("style") || "btn-primary");

  return (
    
      {text}
      <i aria-hidden="true">
    </i><i aria-hidden="true">
  );
});

Scrivito.provideComponent("ButtonWidget", ({ widget }) =&gt; {
  if (["center", "right"].includes(widget.get("alignment"))) {
    return (
      <div>
        
      </div>
    );
  }

  return ;
});
</i>

import * as React from "react";
import * as Scrivito from "scrivito";

import InPlaceEditingPlaceholder from "../../Components/InPlaceEditingPlaceholder";
import "./LinkContainerWidget.scss";

Scrivito.provideComponent("LinkContainerWidget", ({ widget }) => (
  
    
    
  
));

const Headline = Scrivito.connect(({ widget }) => {
  const headline = widget.get("headline");

  if (!headline) {
    return (

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("HeadlineWidget", ({ widget }) => {
  const style = widget.get("style") || "h2";
  const level = widget.get("level") || style;
  const classNames = [style];
  if (widget.get("alignment")) {
    classNames.push(`text-${widget.get("alignment")}`);
  }
  if (widget.get("showDividingLine") === "yes") {
    classNames.push("b-bottom");
  }
  if (widget.get("showMargin") === "no") {
    classNames.push("no-margin");
  }

  return (

import * as React from "react";
import * as Scrivito from "scrivito";

Scrivito.provideComponent("FeaturePanelWidget", ({ widget }) => {
  return (
    <div>
      <div>
        <i aria-hidden="true">
      </i></div><i aria-hidden="true">
      <div>
        
        </div></i></div>