JSFiddle - React, Tailwind, and code Playground

by viper123

JavaScript

import React from "react";
import SiteSearchAPIConnector from "@elastic/search-ui-site-search-connector";
import "@elastic/react-search-ui-views/lib/styles/styles.css";

import {
  ErrorBoundary,
  Facet,
  SearchProvider,
  SearchBox,
  Results,
  PagingInfo,
  ResultsPerPage,
  Paging,
  Sorting,
  WithSearch
} from "@elastic/react-search-ui";
import {
  Layout,
  SingleSelectFacet,
  SingleLinksFacet
} from "@elastic/react-search-ui-views";

const connector = new SiteSearchAPIConnector({
  engineKey: "*******",
  documentType: "********"
});

const config = {
  apiConnector: connector,
  searchQuery: {
    result_fields: {
      title: {
        raw: {}
      }
    }
  }
};

export default function App() {
  return ( <
    SearchProvider config = {
      config
    } >
    <
    div className = "App" >
    <
    ErrorBoundary >
    <
    Layout header = { < SearchBox / >
    }
    bodyContent = { < Results titleField = "title" / >
    }
    /> <
    /ErrorBoundary> <
    /div>
  ); <
  /SearchProvider>
);