@usereactify/search 4.4.1 → 5.0.0-beta.0

package/dist/src/components/filter/Filter.js

@@ -0,0 +1,89 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Filter = void 0;
+const react_1 = __importDefault(require("react"));
+const MultiList_1 = __importDefault(require("@appbaseio/reactivesearch/lib/components/list/MultiList"));
+const SingleList_1 = __importDefault(require("@appbaseio/reactivesearch/lib/components/list/SingleList"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const Filter = (props) => {
+    if ("single" === props.filter.displayType) {
+        return (react_1.default.createElement(FilterSingleList, Object.assign({}, props)));
+    }
+    if ("multi" === props.filter.displayType) {
+        return (react_1.default.createElement(FilterMultiList, Object.assign({}, props)));
+    }
+    if ("range" === props.filter.displayType) {
+        return (react_1.default.createElement(FilterRange, Object.assign({}, props)));
+    }
+    if ("slider" === props.filter.displayType) {
+        return (react_1.default.createElement(FilterSlider, Object.assign({}, props)));
+    }
+    console.log(`filter with display type "${props.filter.displayType}" not yet supported`);
+    return null;
+};
+exports.Filter = Filter;
+const FilterSingleList = (props) => {
+    const reactiveFilterListProps = (0, hooks_1.useReactiveFilterListProps)(props.filter);
+    return (react_1.default.createElement(SingleList_1.default, Object.assign({}, reactiveFilterListProps, { render: (reactivesearchFilterProps) => (react_1.default.createElement(FilterListInner, Object.assign({}, props, { reactivesearchFilterProps: reactivesearchFilterProps }))) })));
+};
+const FilterMultiList = (props) => {
+    const reactiveFilterListProps = (0, hooks_1.useReactiveFilterListProps)(props.filter);
+    return (react_1.default.createElement(MultiList_1.default, Object.assign({}, reactiveFilterListProps, { render: (reactivesearchFilterProps) => (react_1.default.createElement(FilterListInner, Object.assign({}, props, { reactivesearchFilterProps: reactivesearchFilterProps }))) })));
+};
+const FilterRange = (props) => {
+    const reactiveFilterRangeProps = (0, hooks_1.useReactiveFilterRangeProps)(props.filter);
+    if (props.renderFilterRange) {
+        const Component = props.renderFilterRange;
+        return (react_1.default.createElement(Component, Object.assign({}, props, { reactiveFilterRangeProps: reactiveFilterRangeProps })));
+    }
+    return null;
+};
+const FilterSlider = (props) => {
+    const reactiveFilterSliderProps = (0, hooks_1.useReactiveFilterSliderProps)(props.filter);
+    if (props.renderFilterSlider) {
+        const Component = props.renderFilterSlider;
+        return (react_1.default.createElement(Component, Object.assign({}, props, { reactiveFilterSliderProps: reactiveFilterSliderProps })));
+    }
+    return null;
+};
+// inner component exists only so we can use memos in reactivesearch render functions
+const FilterListInner = (props) => {
+    const { filter, renderFilterList, reactivesearchFilterProps } = props, otherProps = __rest(props, ["filter", "renderFilterList", "reactivesearchFilterProps"]);
+    const { track } = (0, hooks_1.useAnalytics)();
+    const _a = (0, hooks_1.useFilterListProps)(filter, reactivesearchFilterProps), { handleChange } = _a, filterListProps = __rest(_a, ["handleChange"]);
+    const handleFilterChange = react_1.default.useCallback((value) => {
+        handleChange(value);
+        track({
+            eventName: "filterChange",
+            payload: {
+                name: filter.name,
+                value: value,
+            },
+        });
+    }, [filterListProps]);
+    const updatedFilterListProps = Object.assign(Object.assign({}, filterListProps), { handleChange: handleFilterChange });
+    // hide entire filter when no options available
+    if (0 === filterListProps.options.length) {
+        return null;
+    }
+    if (renderFilterList) {
+        const Component = renderFilterList;
+        return (react_1.default.createElement(Component, Object.assign({ filterListProps: updatedFilterListProps, filter: filter }, otherProps)));
+    }
+    return (react_1.default.createElement(components_1.ExampleFilterList, Object.assign({ filterListProps: updatedFilterListProps, filter: filter }, otherProps)));
+};

package/dist/src/components/filter/FilterStack.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { useFilters } from "../../hooks";
+export declare type FilterStackProps = {
+    /** Render method called once for all filters */
+    renderFilters?: React.FC<ReturnType<typeof useFilters>>;
+};
+export declare const FilterStack: React.FC<FilterStackProps>;

package/dist/src/components/filter/FilterStack.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilterStack = void 0;
+const react_1 = __importDefault(require("react"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const FilterStack = (props) => {
+    var _a;
+    const filtersHook = (0, hooks_1.useFilters)();
+    const RenderFiltersComponent = (_a = props.renderFilters) !== null && _a !== void 0 ? _a : components_1.ExampleFilterStack;
+    return (react_1.default.createElement(RenderFiltersComponent, Object.assign({}, filtersHook)));
+};
+exports.FilterStack = FilterStack;

package/dist/src/{filter → components/filter}/index.d.ts

@@ -1,3 +1,2 @@
 export * from "./Filter";
-export * from "./FilterList";
 export * from "./FilterStack";

package/dist/src/{filter → components/filter}/index.js

@@ -11,5 +11,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./Filter"), exports);
-__exportStar(require("./FilterList"), exports);
 __exportStar(require("./FilterStack"), exports);

package/dist/src/components/index.d.ts

@@ -0,0 +1,8 @@
+export * from "./context";
+export * from "./example";
+export * from "./filter";
+export * from "./result";
+export * from "./search";
+export * from "./sensor";
+export * from "./sortby";
+export * from "./utility";

package/dist/src/components/index.js

@@ -0,0 +1,20 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./context"), exports);
+__exportStar(require("./example"), exports);
+__exportStar(require("./filter"), exports);
+__exportStar(require("./result"), exports);
+__exportStar(require("./search"), exports);
+__exportStar(require("./sensor"), exports);
+__exportStar(require("./sortby"), exports);
+__exportStar(require("./utility"), exports);

package/dist/src/components/result/ResultCardCallout.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { ElasticCallout } from "../../types";
+export declare type ResultCardCalloutProps = {
+    pagePosition: number;
+    document: ElasticCallout;
+    callout: ElasticCallout["callout"];
+    render?: React.FC<Omit<ResultCardCalloutProps, "render"> & {
+        itemRef: (node?: Element | null) => void;
+        handleClick: () => void;
+    }>;
+};
+export declare const ResultCardCallout: React.FC<ResultCardCalloutProps>;

package/dist/src/{result → components/result}/ResultCardCallout.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ResultCardCallout = void 0;
 const react_1 = __importDefault(require("react"));
 const react_intersection_observer_1 = require("react-intersection-observer");
-const hooks_1 = require("../hooks");
+const hooks_1 = require("../../hooks");
+const __1 = require("..");
 const ResultCardCallout = (props) => {
-    const { callout, render } = props;
     const { track } = (0, hooks_1.useAnalytics)();
     const { ref, inView } = (0, react_intersection_observer_1.useInView)({
         threshold: 0.5,
@@ -18,36 +18,29 @@ const ResultCardCallout = (props) => {
         track({
             eventName: "clickPromotion",
             payload: {
-                link: callout.link,
-                title: callout.title,
+                link: props.callout.link,
+                title: props.callout.title,
             },
         });
-    }, [track, callout]);
+    }, [track, props.callout]);
     const handleView = react_1.default.useCallback(() => {
         track({
             eventName: "viewPromotion",
             payload: {
-                link: callout.link,
-                title: callout.title,
+                link: props.callout.link,
+                title: props.callout.title,
             },
         });
-    }, [track, callout]);
+    }, [track, props.callout]);
     react_1.default.useEffect(() => {
-        if (inView)
+        if (inView) {
             handleView();
+        }
     }, [inView]);
-    const styleProp = react_1.default.useMemo(() => {
-        var _a, _b;
-        return ({
-            gridRow: `span ${(_a = callout.displayRows) !== null && _a !== void 0 ? _a : 1}`,
-            gridColumn: `span ${(_b = callout.displayColumns) !== null && _b !== void 0 ? _b : 1}`,
-        });
-    }, [callout]);
-    if (render)
-        return render(Object.assign(Object.assign({}, props), { itemRef: ref, handleClick }));
-    return (react_1.default.createElement("article", { ref: ref, style: styleProp },
-        react_1.default.createElement("a", { href: callout.link, onClick: handleClick },
-            callout.desktopImage && (react_1.default.createElement("img", { src: callout.desktopImage, width: "100%" })),
-            callout.title)));
+    if (props.render) {
+        const Component = props.render;
+        return (react_1.default.createElement(Component, Object.assign({}, props, { itemRef: ref, handleClick: handleClick })));
+    }
+    return (react_1.default.createElement(__1.ExampleResultCardCallout, Object.assign({}, props, { itemRef: ref, handleClick: handleClick })));
 };
 exports.ResultCardCallout = ResultCardCallout;

package/dist/src/components/result/ResultCardProduct.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import type { ElasticProduct } from "../../types";
+import { useProductPrice } from "../../hooks";
+export declare type ResultCardProductProps = {
+    pagePosition: number;
+    product: ElasticProduct;
+    document: ElasticProduct;
+    render?: React.FC<Omit<ResultCardProductProps, "render"> & ReturnType<typeof useProductPrice> & {
+        itemRef: (node?: Element | null) => void;
+        handleClick: () => void;
+    }>;
+};
+export declare const ResultCardProduct: React.FC<ResultCardProductProps>;

package/dist/src/{result/ResultCard.js → components/result/ResultCardProduct.js}

@@ -14,15 +14,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ResultCard = void 0;
+exports.ResultCardProduct = void 0;
 const react_1 = __importDefault(require("react"));
 const react_intersection_observer_1 = require("react-intersection-observer");
-const hooks_1 = require("../hooks");
-const ResultCard = (_a) => {
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const ResultCardProduct = (_a) => {
     var { render } = _a, props = __rest(_a, ["render"]);
-    const { product } = props;
-    const productPrice = (0, hooks_1.useProductPrice)(product);
-    const { formattedPrice, formattedCompareAtPrice, onSale } = productPrice;
+    const productPrice = (0, hooks_1.useProductPrice)(props.product);
     const { track } = (0, hooks_1.useAnalytics)();
     const { ref, inView } = (0, react_intersection_observer_1.useInView)({
         threshold: 0.5,
@@ -33,34 +32,32 @@ const ResultCard = (_a) => {
             eventName: "clickProduct",
             payload: {
                 elasticProduct: {
-                    id: product.id,
-                    title: product.title,
+                    id: props.product.id,
+                    title: props.product.title,
                 },
             },
         });
-    }, [track, product]);
+    }, [track, props.product]);
     const handleView = react_1.default.useCallback(() => {
         track({
             eventName: "viewProduct",
             payload: {
                 elasticProduct: {
-                    id: product.id,
-                    title: product.title,
+                    id: props.product.id,
+                    title: props.product.title,
                 },
             },
         });
-    }, [track, product]);
+    }, [track, props.product]);
     react_1.default.useEffect(() => {
-        if (inView)
+        if (inView) {
             handleView();
+        }
     }, [inView]);
-    if (render)
-        return render(Object.assign(Object.assign(Object.assign({}, props), productPrice), { itemRef: ref, handleClick }));
-    return (react_1.default.createElement("article", { ref: ref },
-        react_1.default.createElement("a", { onClick: handleClick, href: `/products/${product.handle}` },
-            product.image && react_1.default.createElement("img", { src: product.image, width: "100%" }),
-            product.title),
-        react_1.default.createElement("span", null, formattedPrice),
-        onSale && (react_1.default.createElement("span", { style: { textDecoration: "line-through" } }, formattedCompareAtPrice))));
+    if (render) {
+        const Component = render;
+        return (react_1.default.createElement(Component, Object.assign({}, props, productPrice, { itemRef: ref, handleClick: handleClick })));
+    }
+    return (react_1.default.createElement(components_1.ExampleResultCardProduct, Object.assign({}, props, productPrice, { itemRef: ref, handleClick: handleClick })));
 };
-exports.ResultCard = ResultCard;
+exports.ResultCardProduct = ResultCardProduct;

package/dist/src/components/result/ResultPaginationLoadMore.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { ReactivesearchResultProps } from "../../types";
+import { usePaginationLoadMore } from "../../hooks";
+export declare type ResultPaginationLoadMoreProps = ReactivesearchResultProps & {
+    render?: React.FC<ReturnType<typeof usePaginationLoadMore>>;
+};
+export declare const ResultPaginationLoadMore: React.FC<ResultPaginationLoadMoreProps>;

package/dist/src/components/result/ResultPaginationLoadMore.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResultPaginationLoadMore = void 0;
+const react_1 = __importDefault(require("react"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const ResultPaginationLoadMore = (props) => {
+    var _a;
+    const paginationLoadMoreHook = (0, hooks_1.usePaginationLoadMore)(props);
+    const RenderPaginationComponent = (_a = props.render) !== null && _a !== void 0 ? _a : components_1.ExampleResultPaginationLoadMore;
+    return (react_1.default.createElement(RenderPaginationComponent, Object.assign({}, paginationLoadMoreHook)));
+};
+exports.ResultPaginationLoadMore = ResultPaginationLoadMore;

package/dist/src/components/result/ResultPaginationNextPrev.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { usePagination } from "../../hooks";
+import { ReactivesearchPaginationProps } from "../../types";
+export declare type ResultPaginationNextPrevProps = ReactivesearchPaginationProps & {
+    render?: React.FC<ReturnType<typeof usePagination>>;
+};
+export declare const ResultPaginationNextPrev: React.FC<ResultPaginationNextPrevProps>;

package/dist/src/components/result/ResultPaginationNextPrev.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResultPaginationNextPrev = void 0;
+const react_1 = __importDefault(require("react"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const ResultPaginationNextPrev = (props) => {
+    var _a;
+    const paginationHook = (0, hooks_1.usePagination)(props);
+    const RenderPaginationComponent = (_a = props.render) !== null && _a !== void 0 ? _a : components_1.ExampleResultPaginationNextPrev;
+    return (react_1.default.createElement(RenderPaginationComponent, Object.assign({}, paginationHook)));
+};
+exports.ResultPaginationNextPrev = ResultPaginationNextPrev;

package/dist/src/components/result/ResultPaginationNumbered.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { ReactivesearchPaginationProps } from "../../types";
+import { usePagination } from "../../hooks";
+export declare type ResultPaginationNumberedProps = ReactivesearchPaginationProps & {
+    render?: React.FC<ReturnType<typeof usePagination>>;
+};
+export declare const ResultPaginationNumbered: React.FC<ResultPaginationNumberedProps>;

package/dist/src/components/result/ResultPaginationNumbered.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResultPaginationNumbered = void 0;
+const react_1 = __importDefault(require("react"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const ResultPaginationNumbered = (props) => {
+    var _a;
+    const paginationHook = (0, hooks_1.usePagination)(props);
+    if (!paginationHook.totalPages) {
+        return null;
+    }
+    const RenderPaginationComponent = (_a = props.render) !== null && _a !== void 0 ? _a : components_1.ExampleResultPaginationNumbered;
+    return (react_1.default.createElement(RenderPaginationComponent, Object.assign({}, paginationHook)));
+};
+exports.ResultPaginationNumbered = ResultPaginationNumbered;

package/dist/src/components/result/ResultStack.d.ts

@@ -0,0 +1,40 @@
+import React from "react";
+import { ResultCardCallout } from "./ResultCardCallout";
+import { ResultCardProduct } from "./ResultCardProduct";
+import { ResultPaginationNumbered } from "./ResultPaginationNumbered";
+import { ResultPaginationLoadMore } from "./ResultPaginationLoadMore";
+import { ResultPaginationNextPrev } from "./ResultPaginationNextPrev";
+import { ElasticCallout, ElasticProduct, ReactivesearchError, ReactivesearchResultProps } from "../../types";
+export declare type ResultProps = ReactivesearchResultProps & {
+    callouts: ElasticCallout[];
+    products: ElasticProduct[];
+};
+export declare type ResultStackProps = {
+    /** Style prop for the list wrapper */
+    listStyle?: React.HTMLAttributes<HTMLElement>["style"];
+    /** Classname prop for the list wrapper */
+    listClassName?: string;
+    /** Render method called when an error occurs */
+    renderError?: React.FC<{
+        error: ReactivesearchError;
+    }>;
+    /** Render method called while loading for the first time */
+    renderLoading?: React.FC;
+    /** Render method called when no results are found */
+    renderNoResults?: React.FC;
+    /** Render method called once for each product result */
+    renderResultCardProduct?: React.ComponentProps<typeof ResultCardProduct>["render"];
+    /** Render method called once for each callout result */
+    renderResultCardCallout?: React.ComponentProps<typeof ResultCardCallout>["render"];
+    /** Render method called for pagination type "pagination" */
+    renderPaginationNumbered?: React.ComponentProps<typeof ResultPaginationNumbered>["render"];
+    /** Render method called for pagination type "next_prev" */
+    renderPaginationNextPrev?: React.ComponentProps<typeof ResultPaginationNextPrev>["render"];
+    /** Render method called for pagination type "load_more" */
+    renderPaginationLoadMore?: React.ComponentProps<typeof ResultPaginationLoadMore>["render"];
+    /** Render method called for pagination type "infinite_scroll" */
+    renderPaginationInfiniteScroll?: React.ComponentProps<typeof ResultPaginationLoadMore>["render"];
+    /** Advanced Usage: Override the default amount of results per page */
+    pageSize?: number;
+};
+export declare const ResultStack: React.FC<ResultStackProps>;

package/dist/src/components/result/ResultStack.js

@@ -0,0 +1,107 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResultStack = void 0;
+const react_1 = __importDefault(require("react"));
+const ReactiveList_1 = __importDefault(require("@appbaseio/reactivesearch/lib/components/result/ReactiveList"));
+const ResultCardCallout_1 = require("./ResultCardCallout");
+const ResultCardProduct_1 = require("./ResultCardProduct");
+const ResultPaginationNumbered_1 = require("./ResultPaginationNumbered");
+const ResultPaginationLoadMore_1 = require("./ResultPaginationLoadMore");
+const ResultPaginationNextPrev_1 = require("./ResultPaginationNextPrev");
+const hooks_1 = require("../../hooks");
+const types_1 = require("../../types");
+const ResultStack = (props) => {
+    const reactiveResultStackProps = (0, hooks_1.useReactiveResultStackProps)({
+        pageSize: props.pageSize,
+    });
+    return (react_1.default.createElement(ReactiveList_1.default, Object.assign({}, reactiveResultStackProps, { render: (reactivesearchResultProps) => (react_1.default.createElement(ResultStackInner, Object.assign({}, props, { reactivesearchResultProps: reactivesearchResultProps }))), renderPagination: (reactivesearchPaginationProps) => (react_1.default.createElement(ResultStackPaginationStack, Object.assign({}, props, reactivesearchPaginationProps))) })));
+};
+exports.ResultStack = ResultStack;
+const ResultStackRenderErrorComponent = (props) => {
+    return (react_1.default.createElement("div", null,
+        "Error: ",
+        props.error.statusText));
+};
+const ResultStackRenderLoadingComponent = () => {
+    return (react_1.default.createElement("div", null, "Loading"));
+};
+const ResultStackRenderNoResultsComponent = () => {
+    return (react_1.default.createElement("div", null, "No results"));
+};
+const ResultStackInner = (props) => {
+    var _a, _b, _c;
+    const { track } = (0, hooks_1.useAnalytics)();
+    const { searchQuery } = (0, hooks_1.useSearch)();
+    const initialSearchHasRun = react_1.default.useMemo(() => "undefined" !==
+        typeof props.reactivesearchResultProps.resultStats.numberOfResults, [props.reactivesearchResultProps]);
+    const listStyle = react_1.default.useMemo(() => {
+        var _a;
+        return (_a = props.listStyle) !== null && _a !== void 0 ? _a : {
+            display: "grid",
+            gap: "8px",
+            gridTemplateColumns: "repeat(4, minmax(0, 1fr))",
+        };
+    }, [props.listStyle]);
+    if (props.reactivesearchResultProps.error) {
+        const RenderErrorComponent = (_a = props.renderError) !== null && _a !== void 0 ? _a : ResultStackRenderErrorComponent;
+        return (react_1.default.createElement(RenderErrorComponent, { error: props.reactivesearchResultProps.error }));
+    }
+    if (!initialSearchHasRun) {
+        const RenderLoadingComponent = (_b = props.renderLoading) !== null && _b !== void 0 ? _b : ResultStackRenderLoadingComponent;
+        return (react_1.default.createElement(RenderLoadingComponent, null));
+    }
+    if (!props.reactivesearchResultProps.resultStats.numberOfResults) {
+        if (searchQuery) {
+            track({
+                eventName: "zeroResults",
+                payload: {
+                    searchTerm: searchQuery,
+                },
+            });
+        }
+        const RenderNoResultsComponent = (_c = props.renderNoResults) !== null && _c !== void 0 ? _c : ResultStackRenderNoResultsComponent;
+        return (react_1.default.createElement(RenderNoResultsComponent, null));
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("section", { style: listStyle, className: props.listClassName }, props.reactivesearchResultProps.data.map((item, key) => {
+            // @todo result.type is missing in v1 indexes, this check ensures that they are assumed to be products
+            if (types_1.ElasticDocumentType.Product === item.type || !item.type) {
+                return (react_1.default.createElement(ResultCardProduct_1.ResultCardProduct, { key: item._id, product: item, document: item, pagePosition: key + 1, render: props.renderResultCardProduct }));
+            }
+            if (types_1.ElasticDocumentType.Callout === item.type) {
+                return (react_1.default.createElement(ResultCardCallout_1.ResultCardCallout, { key: item._id, document: item, pagePosition: key + 1, callout: item.callout, render: props.renderResultCardCallout }));
+            }
+            return null;
+        })),
+        react_1.default.createElement(ResultStackPaginationStackLoadMore, Object.assign({}, props, props.reactivesearchResultProps))));
+};
+/** Handles rendering pagination for types that use "pagination props" */
+const ResultStackPaginationStack = (props) => {
+    const { options } = (0, hooks_1.useReactifySearchContext)();
+    const filterStack = (0, hooks_1.useFilterStack)();
+    if (options.mode === "instant-search") {
+        return null;
+    }
+    if ("pagination" === (filterStack === null || filterStack === void 0 ? void 0 : filterStack.paginationType)) {
+        return (react_1.default.createElement(ResultPaginationNumbered_1.ResultPaginationNumbered, Object.assign({}, props, { render: props.renderPaginationNumbered })));
+    }
+    if ("next_prev" === (filterStack === null || filterStack === void 0 ? void 0 : filterStack.paginationType)) {
+        return (react_1.default.createElement(ResultPaginationNextPrev_1.ResultPaginationNextPrev, Object.assign({}, props, { render: props.renderPaginationNextPrev })));
+    }
+    return null;
+};
+/** Handles rendering pagination for types that use "result props" */
+const ResultStackPaginationStackLoadMore = (props) => {
+    const { options } = (0, hooks_1.useReactifySearchContext)();
+    const filterStack = (0, hooks_1.useFilterStack)();
+    if (options.mode === "instant-search") {
+        return null;
+    }
+    if ("load_more" === (filterStack === null || filterStack === void 0 ? void 0 : filterStack.paginationType)) {
+        return (react_1.default.createElement(ResultPaginationLoadMore_1.ResultPaginationLoadMore, Object.assign({}, props.reactivesearchResultProps, { render: props.renderPaginationLoadMore })));
+    }
+    return null;
+};

package/dist/src/components/result/ResultStateProvider.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ReactivesearchSearchStatePage } from "../../types";
+export declare type ResultStateProvidedProps = {
+    render: (props: ReactivesearchSearchStatePage) => JSX.Element | null;
+};
+export declare const ResultStateProvider: React.FC<ResultStateProvidedProps>;

package/dist/src/components/result/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./ResultStack";
+export * from "./ResultCardCallout";
+export * from "./ResultCardProduct";
+export * from "./ResultStateProvider";
+export * from "./ResultPaginationNumbered";
+export * from "./ResultPaginationLoadMore";
+export * from "./ResultPaginationNextPrev";

package/dist/src/{result → components/result}/index.js

@@ -10,9 +10,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./ResultList"), exports);
-__exportStar(require("./ResultCard"), exports);
-__exportStar(require("./ResultPagination"), exports);
+__exportStar(require("./ResultStack"), exports);
+__exportStar(require("./ResultCardCallout"), exports);
+__exportStar(require("./ResultCardProduct"), exports);
 __exportStar(require("./ResultStateProvider"), exports);
-__exportStar(require("./ResultLoadMoreButton"), exports);
+__exportStar(require("./ResultPaginationNumbered"), exports);
+__exportStar(require("./ResultPaginationLoadMore"), exports);
 __exportStar(require("./ResultPaginationNextPrev"), exports);

package/dist/src/components/search/SearchInput.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import DataSearch from "@appbaseio/reactivesearch/lib/components/search/DataSearch";
+export declare type SearchInputProps = Omit<React.ComponentProps<typeof DataSearch>, "componentId"> & {
+    debounce?: number;
+    placeholder?: string;
+    inputClassName?: string;
+};
+export declare const SearchInput: React.FC<SearchInputProps>;

package/dist/src/{search → components/search}/SearchInput.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SearchInput = void 0;
 const react_1 = __importDefault(require("react"));
 const DataSearch_1 = __importDefault(require("@appbaseio/reactivesearch/lib/components/search/DataSearch"));
-const hooks_1 = require("../hooks");
+const hooks_1 = require("../../hooks");
 const SearchInput = (props) => {
     const { debounce, placeholder, inputClassName } = props;
     const reactiveDataSearchProps = (0, hooks_1.useReactiveDataSearchProps)(Object.assign({ debounce,
         placeholder,
         inputClassName }, props));
-    return react_1.default.createElement(DataSearch_1.default, Object.assign({}, reactiveDataSearchProps));
+    return (react_1.default.createElement(DataSearch_1.default, Object.assign({}, reactiveDataSearchProps)));
 };
 exports.SearchInput = SearchInput;