@usereactify/search 5.0.0-beta.1 → 5.0.0-beta.12

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

@@ -0,0 +1,78 @@
+"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 filterListProps = (0, hooks_1.useFilterListProps)(filter, reactivesearchFilterProps);
+    // 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: filterListProps, filter: filter }, otherProps)));
+    }
+    return (react_1.default.createElement(components_1.ExampleFilterList, Object.assign({ filterListProps: filterListProps, filter: filter }, otherProps)));
+};
+//# sourceMappingURL=Filter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Filter.js","sourceRoot":"","sources":["../../../../src/components/Filter/Filter.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport MultiList from \"@appbaseio/reactivesearch/lib/components/list/MultiList\";\nimport SingleList from \"@appbaseio/reactivesearch/lib/components/list/SingleList\";\n\nimport type {\n  ConfigFilterOption,\n  ReactivesearchFilterProps,\n} from \"../../types\";\nimport {\n  useAnalytics,\n  useFilterListProps,\n  useReactiveFilterListProps,\n  useReactiveFilterRangeProps,\n  useReactiveFilterSliderProps,\n} from \"../../hooks\";\nimport { ExampleFilterList } from \"../../components\";\nimport { debug } from \"../../utility\";\n\nexport type FilterProps = {\n  /** The filter option being rendered */\n  filter: ConfigFilterOption;\n  /** Render method for List filters */\n  renderFilterList?: React.FC<\n    Omit<FilterProps, \"renderFilterList\"> & {\n      filterListProps: ReturnType<typeof useFilterListProps>;\n    }\n  >;\n  /** Render method for Range filters */\n  renderFilterRange?: React.FC<\n    Omit<FilterProps, \"renderFilterRange\"> & {\n      reactiveFilterRangeProps: ReturnType<typeof useReactiveFilterRangeProps>;\n    }\n  >;\n  /** Render method for Slider filters */\n  renderFilterSlider?: React.FC<\n    Omit<FilterProps, \"renderFilterSlider\"> & {\n      reactiveFilterSliderProps: ReturnType<\n        typeof useReactiveFilterSliderProps\n      >;\n    }\n  >;\n};\n\nexport const Filter: React.FC<FilterProps> = (props) => {\n  if (\"single\" === props.filter.displayType) {\n    return <FilterSingleList {...props} />;\n  }\n\n  if (\"multi\" === props.filter.displayType) {\n    return <FilterMultiList {...props} />;\n  }\n\n  if (\"range\" === props.filter.displayType) {\n    return <FilterRange {...props} />;\n  }\n\n  if (\"slider\" === props.filter.displayType) {\n    return <FilterSlider {...props} />;\n  }\n\n  console.log(\n    `filter with display type \"${props.filter.displayType}\" not yet supported`\n  );\n\n  return null;\n};\n\nconst FilterSingleList: React.FC<FilterProps> = (props) => {\n  const reactiveFilterListProps = useReactiveFilterListProps(props.filter);\n\n  return (\n    <SingleList\n      {...reactiveFilterListProps}\n      render={(reactivesearchFilterProps: ReactivesearchFilterProps) => (\n        <FilterListInner\n          {...props}\n          reactivesearchFilterProps={reactivesearchFilterProps}\n        />\n      )}\n    />\n  );\n};\n\nconst FilterMultiList: React.FC<FilterProps> = (props) => {\n  const reactiveFilterListProps = useReactiveFilterListProps(props.filter);\n\n  return (\n    <MultiList\n      {...reactiveFilterListProps}\n      render={(reactivesearchFilterProps: ReactivesearchFilterProps) => (\n        <FilterListInner\n          {...props}\n          reactivesearchFilterProps={reactivesearchFilterProps}\n        />\n      )}\n    />\n  );\n};\n\nconst FilterRange: React.FC<FilterProps> = (props) => {\n  const reactiveFilterRangeProps = useReactiveFilterRangeProps(props.filter);\n\n  if (props.renderFilterRange) {\n    const Component = props.renderFilterRange;\n\n    return (\n      <Component\n        {...props}\n        reactiveFilterRangeProps={reactiveFilterRangeProps}\n      />\n    );\n  }\n\n  return null;\n};\n\nconst FilterSlider: React.FC<FilterProps> = (props) => {\n  const reactiveFilterSliderProps = useReactiveFilterSliderProps(props.filter);\n\n  if (props.renderFilterSlider) {\n    const Component = props.renderFilterSlider;\n\n    return (\n      <Component\n        {...props}\n        reactiveFilterSliderProps={reactiveFilterSliderProps}\n      />\n    );\n  }\n\n  return null;\n};\n\n// inner component exists only so we can use memos in reactivesearch render functions\nconst FilterListInner: React.FC<\n  FilterProps & { reactivesearchFilterProps: ReactivesearchFilterProps }\n> = (props) => {\n  const { filter, renderFilterList, reactivesearchFilterProps, ...otherProps } =\n    props;\n\n  const filterListProps = useFilterListProps(filter, reactivesearchFilterProps);\n\n  // hide entire filter when no options available\n  if (0 === filterListProps.options.length) {\n    return null;\n  }\n\n  if (renderFilterList) {\n    const Component = renderFilterList;\n    return (\n      <Component\n        filterListProps={filterListProps}\n        filter={filter}\n        {...otherProps}\n      />\n    );\n  }\n\n  return (\n    <ExampleFilterList\n      filterListProps={filterListProps}\n      filter={filter}\n      {...otherProps}\n    />\n  );\n};\n"]}

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

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

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

@@ -0,0 +1,17 @@
+"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 filterStackHook = (0, hooks_1.useFilterStack)();
+    const RenderFiltersComponent = (_a = props.renderFilters) !== null && _a !== void 0 ? _a : components_1.ExampleFilterStack;
+    return react_1.default.createElement(RenderFiltersComponent, Object.assign({}, filterStackHook));
+};
+exports.FilterStack = FilterStack;
+//# sourceMappingURL=FilterStack.js.map

package/dist/src/components/Filter/FilterStack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterStack.js","sourceRoot":"","sources":["../../../../src/components/Filter/FilterStack.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,uCAA6C;AAC7C,iDAAsD;AAO/C,MAAM,WAAW,GAA+B,CAAC,KAAK,EAAE,EAAE;;IAC/D,MAAM,eAAe,GAAG,IAAA,sBAAc,GAAE,CAAC;IAEzC,MAAM,sBAAsB,GAAG,MAAA,KAAK,CAAC,aAAa,mCAAI,+BAAkB,CAAC;IAEzE,OAAO,8BAAC,sBAAsB,oBAAK,eAAe,EAAI,CAAC;AACzD,CAAC,CAAC;AANW,QAAA,WAAW,eAMtB","sourcesContent":["import React from \"react\";\n\nimport { useFilterStack } from \"../../hooks\";\nimport { ExampleFilterStack } from \"../../components\";\n\nexport type FilterStackProps = {\n  /** Render method called once for all filters */\n  renderFilters?: React.FC<ReturnType<typeof useFilterStack>>;\n};\n\nexport const FilterStack: React.FC<FilterStackProps> = (props) => {\n  const filterStackHook = useFilterStack();\n\n  const RenderFiltersComponent = props.renderFilters ?? ExampleFilterStack;\n\n  return <RenderFiltersComponent {...filterStackHook} />;\n};\n"]}

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

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

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

@@ -0,0 +1,15 @@
+"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("./Filter"), exports);
+__exportStar(require("./FilterStack"), exports);
+//# sourceMappingURL=index.js.map

package/dist/src/components/Filter/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Filter/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,2CAAyB;AACzB,gDAA8B","sourcesContent":["export * from \"./Filter\";\nexport * from \"./FilterStack\";\n"]}

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

@@ -0,0 +1,42 @@
+import React from "react";
+export declare type ReactifySearchBaseProps = {
+    /** The search area the provider will be used in */
+    mode: "search" | "collection" | "instant-search";
+    /** Shopify store domain used to resolve the site configuration */
+    shopifyPermanentDomain: string;
+    /** Specific filter group handle, used to override automated logic */
+    filterStackHandle?: string;
+    /** Callback function for redirects, suitable for headless sites to avoid full page refresh */
+    onRedirect?: (type: "redirect" | "search", url: string) => void;
+    /** Render method to display a component when the config is loading */
+    renderBooting?: () => JSX.Element | null;
+    /** Advanced usage: Allows you to wrap the ReactifySearchBase in your own ReactiveBase component */
+    noReactiveBase?: boolean;
+    /** Advanced usage: Array of additional component IDs managed outside of Reactify Search */
+    additionalComponentHandles?: string[];
+    /** Advanced usage: Override the default Elasticsearch index */
+    index?: string;
+    /** Advanced usage: Override the default Reactify Search config (for multi-instance stores) */
+    configId?: string;
+    /** Advanced usage: Override the default Elasticsearch credentials */
+    credentials?: {
+        username: string;
+        password: string;
+        endpoint: string;
+    };
+    /** Advanced usage: Override the default ReactiveBase theme */
+    theme?: Record<string, unknown>;
+} & ({
+    mode: "search";
+} | {
+    mode: "collection";
+    /** Collection object that includes the handle, used to find curations */
+    collection: {
+        id: number;
+        title: string;
+        handle: string;
+    };
+} | {
+    mode: "instant-search";
+});
+export declare const ReactifySearchBase: React.FC<ReactifySearchBaseProps>;

package/dist/src/components/ReactifySearchBase/ReactifySearchBase.js

@@ -0,0 +1,131 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReactifySearchBase = void 0;
+const react_1 = __importDefault(require("react"));
+const Sentry = __importStar(require("@sentry/react"));
+const hooks_1 = require("../../hooks");
+const components_1 = require("../../components");
+const utility_1 = require("../../utility");
+const ReactifySearchBase = (props) => {
+    react_1.default.useEffect(() => {
+        utility_1.debug.log("ReactifySearchBase", "props", props);
+        Sentry.setTags({
+            "reactifysearch.index": props.index,
+            "reactifysearch.shop": props.shopifyPermanentDomain,
+            "reactifysearch.mode": props.mode,
+            "reactifysearch.collection": props.mode === "collection" ? props.collection.handle : undefined,
+            "reactifysearch.filter": props.filterStackHandle,
+        });
+    }, [props]);
+    return (react_1.default.createElement(Sentry.ErrorBoundary, { fallback: react_1.default.createElement("p", null, "An error has occurred") },
+        react_1.default.createElement(ReactifySearchInner, Object.assign({}, props))));
+};
+exports.ReactifySearchBase = ReactifySearchBase;
+const ReactifySearchInner = (props) => {
+    var _a, _b;
+    const { config } = (0, hooks_1.useConfig)(props.shopifyPermanentDomain, props.configId);
+    const [searchQuery, setSearchQuery] = react_1.default.useState("");
+    const [instantSearchVisible, setInstantSearchVisible] = react_1.default.useState(false);
+    const [sortOption, setSortOption] = react_1.default.useState("");
+    const credentials = (_a = props.credentials) !== null && _a !== void 0 ? _a : {
+        username: "guest",
+        password: "password",
+        endpoint: "https://api.search.reactify.app",
+    };
+    const theme = (_b = props.theme) !== null && _b !== void 0 ? _b : {
+        typography: {
+            fontFamily: "inherit",
+            fontSize: "inherit",
+        },
+    };
+    const searchQueryFromURL = react_1.default.useMemo(() => {
+        var _a;
+        if (typeof window === "undefined") {
+            return;
+        }
+        const urlParams = new URLSearchParams(window.location.search);
+        return (_a = urlParams.get("q")) !== null && _a !== void 0 ? _a : undefined;
+    }, [typeof window !== "undefined" && window.location.search]);
+    const searchSortFromURL = react_1.default.useMemo(() => {
+        var _a;
+        if (typeof window === "undefined") {
+            return;
+        }
+        const urlParams = new URLSearchParams(window.location.search);
+        return (_a = urlParams.get("sort")) !== null && _a !== void 0 ? _a : undefined;
+    }, [typeof window !== "undefined" && window.location.search]);
+    react_1.default.useEffect(() => {
+        if (searchQueryFromURL && searchQuery !== searchQueryFromURL) {
+            setSearchQuery(searchQueryFromURL);
+        }
+    }, [searchQueryFromURL]);
+    react_1.default.useEffect(() => {
+        if (searchSortFromURL && sortOption !== searchSortFromURL) {
+            setSortOption(searchSortFromURL);
+        }
+    }, [searchSortFromURL]);
+    react_1.default.useEffect(() => {
+        if (typeof window == "undefined") {
+            return;
+        }
+        if (window.location.search === "" && sortOption) {
+            setSortOption(sortOption);
+        }
+    }, [typeof window !== "undefined" && window.location.search]);
+    const contextValue = react_1.default.useMemo(() => {
+        var _a;
+        if (!config) {
+            return;
+        }
+        const memoValue = {
+            config: config,
+            options: Object.assign(Object.assign({}, props), { index: (_a = props.index) !== null && _a !== void 0 ? _a : config.index, filterStackHandle: props.filterStackHandle, credentials: credentials, theme: theme }),
+            search: {
+                searchQuery: searchQuery,
+                setSearchQuery: setSearchQuery,
+                instantSearchVisible: instantSearchVisible,
+                setInstantSearchVisible: setInstantSearchVisible,
+            },
+            sortby: {
+                sortOption: sortOption,
+                setSortOption: setSortOption,
+            },
+        };
+        utility_1.debug.log("ReactifySearchBase", "context", memoValue);
+        return memoValue;
+    }, [config, props, searchQuery, instantSearchVisible, sortOption]);
+    if (!contextValue) {
+        if (props.renderBooting) {
+            return props.renderBooting();
+        }
+        return null;
+    }
+    if (props.noReactiveBase) {
+        return (react_1.default.createElement(hooks_1.ReactifySearchContext.Provider, { value: contextValue }, props.children));
+    }
+    return (react_1.default.createElement(hooks_1.ReactifySearchContext.Provider, { value: contextValue },
+        react_1.default.createElement(components_1.UtilityAuthenticatedReactiveBase, null, props.children)));
+};
+//# sourceMappingURL=ReactifySearchBase.js.map

package/dist/src/components/ReactifySearchBase/ReactifySearchBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactifySearchBase.js","sourceRoot":"","sources":["../../../../src/components/ReactifySearchBase/ReactifySearchBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport * as Sentry from \"@sentry/react\";\n\nimport { ReactifySearchContext, useConfig } from \"../../hooks\";\nimport { UtilityAuthenticatedReactiveBase } from \"../../components\";\nimport { debug } from \"../../utility\";\n\nexport type ReactifySearchBaseProps = {\n  /** The search area the provider will be used in */\n  mode: \"search\" | \"collection\" | \"instant-search\";\n  /** Shopify store domain used to resolve the site configuration */\n  shopifyPermanentDomain: string;\n  /** Specific filter group handle, used to override automated logic */\n  filterStackHandle?: string;\n  /** Callback function for redirects, suitable for headless sites to avoid full page refresh */\n  onRedirect?: (type: \"redirect\" | \"search\", url: string) => void;\n  /** Render method to display a component when the config is loading */\n  renderBooting?: () => JSX.Element | null;\n  /** Advanced usage: Allows you to wrap the ReactifySearchBase in your own ReactiveBase component */\n  noReactiveBase?: boolean;\n  /** Advanced usage: Array of additional component IDs managed outside of Reactify Search */\n  additionalComponentHandles?: string[];\n  /** Advanced usage: Override the default Elasticsearch index */\n  index?: string;\n  /** Advanced usage: Override the default Reactify Search config (for multi-instance stores) */\n  configId?: string;\n  /** Advanced usage: Override the default Elasticsearch credentials */\n  credentials?: {\n    username: string;\n    password: string;\n    endpoint: string;\n  };\n  /** Advanced usage: Override the default ReactiveBase theme */\n  theme?: Record<string, unknown>;\n} & (\n  | {\n      mode: \"search\";\n    }\n  | {\n      mode: \"collection\";\n      /** Collection object that includes the handle, used to find curations */\n      collection: {\n        id: number;\n        title: string;\n        handle: string;\n      };\n    }\n  | {\n      mode: \"instant-search\";\n    }\n);\n\nexport const ReactifySearchBase: React.FC<ReactifySearchBaseProps> = (\n  props\n) => {\n  React.useEffect(() => {\n    debug.log(\"ReactifySearchBase\", \"props\", props);\n\n    Sentry.setTags({\n      \"reactifysearch.index\": props.index,\n      \"reactifysearch.shop\": props.shopifyPermanentDomain,\n      \"reactifysearch.mode\": props.mode,\n      \"reactifysearch.collection\":\n        props.mode === \"collection\" ? props.collection.handle : undefined,\n      \"reactifysearch.filter\": props.filterStackHandle,\n    });\n  }, [props]);\n\n  return (\n    <Sentry.ErrorBoundary fallback={<p>An error has occurred</p>}>\n      <ReactifySearchInner {...props} />\n    </Sentry.ErrorBoundary>\n  );\n};\n\nconst ReactifySearchInner: React.FC<ReactifySearchBaseProps> = (props) => {\n  const { config } = useConfig(props.shopifyPermanentDomain, props.configId);\n\n  const [searchQuery, setSearchQuery] = React.useState<string>(\"\");\n  const [instantSearchVisible, setInstantSearchVisible] =\n    React.useState<boolean>(false);\n  const [sortOption, setSortOption] = React.useState<string>(\"\");\n\n  const credentials = props.credentials ?? {\n    username: \"guest\",\n    password: \"password\",\n    endpoint: \"https://api.search.reactify.app\",\n  };\n\n  const theme = props.theme ?? {\n    typography: {\n      fontFamily: \"inherit\",\n      fontSize: \"inherit\",\n    },\n  };\n\n  const searchQueryFromURL = React.useMemo(() => {\n    if (typeof window === \"undefined\") {\n      return;\n    }\n    const urlParams = new URLSearchParams(window.location.search);\n    return urlParams.get(\"q\") ?? undefined;\n  }, [typeof window !== \"undefined\" && window.location.search]);\n\n  const searchSortFromURL = React.useMemo(() => {\n    if (typeof window === \"undefined\") {\n      return;\n    }\n    const urlParams = new URLSearchParams(window.location.search);\n    return urlParams.get(\"sort\") ?? undefined;\n  }, [typeof window !== \"undefined\" && window.location.search]);\n\n  React.useEffect(() => {\n    if (searchQueryFromURL && searchQuery !== searchQueryFromURL) {\n      setSearchQuery(searchQueryFromURL);\n    }\n  }, [searchQueryFromURL]);\n\n  React.useEffect(() => {\n    if (searchSortFromURL && sortOption !== searchSortFromURL) {\n      setSortOption(searchSortFromURL);\n    }\n  }, [searchSortFromURL]);\n\n  React.useEffect(() => {\n    if (typeof window == \"undefined\") {\n      return;\n    }\n\n    if (window.location.search === \"\" && sortOption) {\n      setSortOption(sortOption);\n    }\n  }, [typeof window !== \"undefined\" && window.location.search]);\n\n  const contextValue = React.useMemo(() => {\n    if (!config) {\n      return;\n    }\n\n    const memoValue = {\n      config: config,\n      options: {\n        ...props,\n        index: props.index ?? config.index,\n        filterStackHandle: props.filterStackHandle,\n        credentials: credentials,\n        theme: theme,\n      },\n      search: {\n        searchQuery: searchQuery,\n        setSearchQuery: setSearchQuery,\n        instantSearchVisible: instantSearchVisible,\n        setInstantSearchVisible: setInstantSearchVisible,\n      },\n      sortby: {\n        sortOption: sortOption,\n        setSortOption: setSortOption,\n      },\n    };\n\n    debug.log(\"ReactifySearchBase\", \"context\", memoValue);\n\n    return memoValue;\n  }, [config, props, searchQuery, instantSearchVisible, sortOption]);\n\n  if (!contextValue) {\n    if (props.renderBooting) {\n      return props.renderBooting();\n    }\n    return null;\n  }\n\n  if (props.noReactiveBase) {\n    return (\n      <ReactifySearchContext.Provider value={contextValue}>\n        {props.children}\n      </ReactifySearchContext.Provider>\n    );\n  }\n\n  return (\n    <ReactifySearchContext.Provider value={contextValue}>\n      <UtilityAuthenticatedReactiveBase>\n        {props.children}\n      </UtilityAuthenticatedReactiveBase>\n    </ReactifySearchContext.Provider>\n  );\n};\n"]}

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

@@ -0,0 +1 @@
+export * from "./ReactifySearchBase";

package/dist/src/components/ReactifySearchBase/index.js

@@ -0,0 +1,14 @@
+"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("./ReactifySearchBase"), exports);
+//# sourceMappingURL=index.js.map

package/dist/src/components/ReactifySearchBase/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ReactifySearchBase/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,uDAAqC","sourcesContent":["export * from \"./ReactifySearchBase\";"]}

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/components/Result/ResultCardCallout.js

@@ -0,0 +1,45 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+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 __1 = require("..");
+const ResultCardCallout = (props) => {
+    var _a;
+    const { track } = (0, hooks_1.useAnalytics)();
+    const { ref, inView } = (0, react_intersection_observer_1.useInView)({
+        threshold: 0.5,
+        triggerOnce: true,
+    });
+    const handleClick = react_1.default.useCallback(() => {
+        track({
+            eventName: "clickPromotion",
+            payload: {
+                link: props.callout.link,
+                title: props.callout.title,
+            },
+        });
+    }, [track, props.callout]);
+    const handleView = react_1.default.useCallback(() => {
+        track({
+            eventName: "viewPromotion",
+            payload: {
+                link: props.callout.link,
+                title: props.callout.title,
+            },
+        });
+    }, [track, props.callout]);
+    react_1.default.useEffect(() => {
+        if (inView) {
+            handleView();
+        }
+    }, [inView]);
+    const RenderComponent = (_a = props.render) !== null && _a !== void 0 ? _a : __1.ExampleResultCardCallout;
+    return react_1.default.createElement(RenderComponent, Object.assign({}, props, { itemRef: ref, handleClick: handleClick }));
+};
+exports.ResultCardCallout = ResultCardCallout;
+//# sourceMappingURL=ResultCardCallout.js.map

package/dist/src/components/Result/ResultCardCallout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResultCardCallout.js","sourceRoot":"","sources":["../../../../src/components/Result/ResultCardCallout.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,6EAAwD;AAGxD,uCAA2C;AAC3C,0BAA8C;AAcvC,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;;IAC3E,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IACjC,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,IAAA,uCAAS,EAAC;QAChC,SAAS,EAAE,GAAG;QACd,WAAW,EAAE,IAAI;KAClB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,KAAK,CAAC;YACJ,SAAS,EAAE,gBAAgB;YAC3B,OAAO,EAAE;gBACP,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;gBACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;aAC3B;SACF,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3B,MAAM,UAAU,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,KAAK,CAAC;YACJ,SAAS,EAAE,eAAe;YAC1B,OAAO,EAAE;gBACP,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;gBACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;aAC3B;SACF,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3B,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,MAAM,EAAE;YACV,UAAU,EAAE,CAAC;SACd;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,MAAM,eAAe,GAAG,MAAA,KAAK,CAAC,MAAM,mCAAI,4BAAwB,CAAC;IAEjE,OAAO,8BAAC,eAAe,oBAAK,KAAK,IAAE,OAAO,EAAE,GAAG,EAAE,WAAW,EAAE,WAAW,IAAI,CAAC;AAChF,CAAC,CAAC;AApCW,QAAA,iBAAiB,qBAoC5B","sourcesContent":["import React from \"react\";\nimport { useInView } from \"react-intersection-observer\";\n\nimport { ElasticCallout } from \"../../types\";\nimport { useAnalytics } from \"../../hooks\";\nimport { ExampleResultCardCallout } from \"..\";\n\nexport type ResultCardCalloutProps = {\n  pagePosition: number;\n  document: ElasticCallout;\n  callout: ElasticCallout[\"callout\"];\n  render?: React.FC<\n    Omit<ResultCardCalloutProps, \"render\"> & {\n      itemRef: (node?: Element | null) => void;\n      handleClick: () => void;\n    }\n  >;\n};\n\nexport const ResultCardCallout: React.FC<ResultCardCalloutProps> = (props) => {\n  const { track } = useAnalytics();\n  const { ref, inView } = useInView({\n    threshold: 0.5,\n    triggerOnce: true,\n  });\n\n  const handleClick = React.useCallback(() => {\n    track({\n      eventName: \"clickPromotion\",\n      payload: {\n        link: props.callout.link,\n        title: props.callout.title,\n      },\n    });\n  }, [track, props.callout]);\n\n  const handleView = React.useCallback(() => {\n    track({\n      eventName: \"viewPromotion\",\n      payload: {\n        link: props.callout.link,\n        title: props.callout.title,\n      },\n    });\n  }, [track, props.callout]);\n\n  React.useEffect(() => {\n    if (inView) {\n      handleView();\n    }\n  }, [inView]);\n\n  const RenderComponent = props.render ?? ExampleResultCardCallout;\n\n  return <RenderComponent {...props} itemRef={ref} handleClick={handleClick} />;\n};\n"]}

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/components/Result/ResultCardProduct.js

@@ -0,0 +1,50 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+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 components_1 = require("../../components");
+const ResultCardProduct = (props) => {
+    var _a;
+    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,
+        triggerOnce: true,
+    });
+    const handleClick = react_1.default.useCallback(() => {
+        track({
+            eventName: "clickProduct",
+            payload: {
+                elasticProduct: {
+                    id: props.product.id,
+                    title: props.product.title,
+                },
+            },
+        });
+    }, [track, props.product]);
+    const handleView = react_1.default.useCallback(() => {
+        track({
+            eventName: "viewProduct",
+            payload: {
+                elasticProduct: {
+                    id: props.product.id,
+                    title: props.product.title,
+                },
+            },
+        });
+    }, [track, props.product]);
+    react_1.default.useEffect(() => {
+        if (inView) {
+            handleView();
+        }
+    }, [inView]);
+    const RenderComponent = (_a = props.render) !== null && _a !== void 0 ? _a : components_1.ExampleResultCardProduct;
+    return (react_1.default.createElement(RenderComponent, Object.assign({}, productPrice, { pagePosition: props.pagePosition, product: props.product, document: props.document, itemRef: ref, handleClick: handleClick })));
+};
+exports.ResultCardProduct = ResultCardProduct;
+//# sourceMappingURL=ResultCardProduct.js.map

package/dist/src/components/Result/ResultCardProduct.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResultCardProduct.js","sourceRoot":"","sources":["../../../../src/components/Result/ResultCardProduct.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,6EAAwD;AAGxD,uCAA4D;AAC5D,iDAA4D;AAerD,MAAM,iBAAiB,GAAqC,CAAC,KAAK,EAAE,EAAE;;IAC3E,MAAM,YAAY,GAAG,IAAA,uBAAe,EAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAEpD,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IACjC,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,IAAA,uCAAS,EAAC;QAChC,SAAS,EAAE,GAAG;QACd,WAAW,EAAE,IAAI;KAClB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,KAAK,CAAC;YACJ,SAAS,EAAE,cAAc;YACzB,OAAO,EAAE;gBACP,cAAc,EAAE;oBACd,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;oBACpB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;iBAC3B;aACF;SACF,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3B,MAAM,UAAU,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,KAAK,CAAC;YACJ,SAAS,EAAE,aAAa;YACxB,OAAO,EAAE;gBACP,cAAc,EAAE;oBACd,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;oBACpB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;iBAC3B;aACF;SACF,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3B,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,MAAM,EAAE;YACV,UAAU,EAAE,CAAC;SACd;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,MAAM,eAAe,GAAG,MAAA,KAAK,CAAC,MAAM,mCAAI,qCAAwB,CAAC;IAEjE,OAAO,CACL,8BAAC,eAAe,oBACV,YAAY,IAChB,YAAY,EAAE,KAAK,CAAC,YAAY,EAChC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,GAAG,EACZ,WAAW,EAAE,WAAW,IACxB,CACH,CAAC;AACJ,CAAC,CAAC;AAnDW,QAAA,iBAAiB,qBAmD5B","sourcesContent":["import React from \"react\";\nimport { useInView } from \"react-intersection-observer\";\n\nimport type { ElasticProduct } from \"../../types\";\nimport { useProductPrice, useAnalytics } from \"../../hooks\";\nimport { ExampleResultCardProduct } from \"../../components\";\n\nexport type ResultCardProductProps = {\n  pagePosition: number;\n  product: ElasticProduct;\n  document: ElasticProduct;\n  render?: React.FC<\n    Omit<ResultCardProductProps, \"render\"> &\n      ReturnType<typeof useProductPrice> & {\n        itemRef: (node?: Element | null) => void;\n        handleClick: () => void;\n      }\n  >;\n};\n\nexport const ResultCardProduct: React.FC<ResultCardProductProps> = (props) => {\n  const productPrice = useProductPrice(props.product);\n\n  const { track } = useAnalytics();\n  const { ref, inView } = useInView({\n    threshold: 0.5,\n    triggerOnce: true,\n  });\n\n  const handleClick = React.useCallback(() => {\n    track({\n      eventName: \"clickProduct\",\n      payload: {\n        elasticProduct: {\n          id: props.product.id,\n          title: props.product.title,\n        },\n      },\n    });\n  }, [track, props.product]);\n\n  const handleView = React.useCallback(() => {\n    track({\n      eventName: \"viewProduct\",\n      payload: {\n        elasticProduct: {\n          id: props.product.id,\n          title: props.product.title,\n        },\n      },\n    });\n  }, [track, props.product]);\n\n  React.useEffect(() => {\n    if (inView) {\n      handleView();\n    }\n  }, [inView]);\n\n  const RenderComponent = props.render ?? ExampleResultCardProduct;\n\n  return (\n    <RenderComponent\n      {...productPrice}\n      pagePosition={props.pagePosition}\n      product={props.product}\n      document={props.document}\n      itemRef={ref}\n      handleClick={handleClick}\n    />\n  );\n};\n"]}

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,17 @@
+"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;
+//# sourceMappingURL=ResultPaginationLoadMore.js.map

package/dist/src/components/Result/ResultPaginationLoadMore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResultPaginationLoadMore.js","sourceRoot":"","sources":["../../../../src/components/Result/ResultPaginationLoadMore.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAG1B,uCAAoD;AACpD,iDAAmE;AAM5D,MAAM,wBAAwB,GAA4C,CAAC,KAAK,EAAE,EAAE;;IACzF,MAAM,sBAAsB,GAAG,IAAA,6BAAqB,EAAC,KAAK,CAAC,CAAC;IAE5D,MAAM,yBAAyB,GAAG,MAAA,KAAK,CAAC,MAAM,mCAAI,4CAA+B,CAAC;IAElF,OAAO,CACL,8BAAC,yBAAyB,oBACpB,sBAAsB,EAC1B,CACH,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,wBAAwB,4BAUnC","sourcesContent":["import React from \"react\";\n\nimport { ReactivesearchResultProps } from \"../../types\";\nimport { usePaginationLoadMore } from \"../../hooks\";\nimport { ExampleResultPaginationLoadMore } from \"../../components\";\n\nexport type ResultPaginationLoadMoreProps = ReactivesearchResultProps & {\n  render?: React.FC<ReturnType<typeof usePaginationLoadMore>>;\n};\n\nexport const ResultPaginationLoadMore: React.FC<ResultPaginationLoadMoreProps> = (props) => {\n  const paginationLoadMoreHook = usePaginationLoadMore(props);\n\n  const RenderPaginationComponent = props.render ?? ExampleResultPaginationLoadMore;\n\n  return (\n    <RenderPaginationComponent\n      {...paginationLoadMoreHook}\n    />\n  );\n};\n"]}

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,17 @@
+"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;
+//# sourceMappingURL=ResultPaginationNextPrev.js.map

package/dist/src/components/Result/ResultPaginationNextPrev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResultPaginationNextPrev.js","sourceRoot":"","sources":["../../../../src/components/Result/ResultPaginationNextPrev.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,uCAA4C;AAE5C,iDAAmE;AAM5D,MAAM,wBAAwB,GAA4C,CAAC,KAAK,EAAE,EAAE;;IACzF,MAAM,cAAc,GAAG,IAAA,qBAAa,EAAC,KAAK,CAAC,CAAC;IAE5C,MAAM,yBAAyB,GAAG,MAAA,KAAK,CAAC,MAAM,mCAAI,4CAA+B,CAAC;IAElF,OAAO,CACL,8BAAC,yBAAyB,oBACpB,cAAc,EAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,wBAAwB,4BAUnC","sourcesContent":["import React from \"react\";\n\nimport { usePagination } from \"../../hooks\";\nimport { ReactivesearchPaginationProps } from \"../../types\";\nimport { ExampleResultPaginationNextPrev } from \"../../components\";\n\nexport type ResultPaginationNextPrevProps = ReactivesearchPaginationProps & {\n  render?: React.FC<ReturnType<typeof usePagination>>;\n};\n\nexport const ResultPaginationNextPrev: React.FC<ResultPaginationNextPrevProps> = (props) => {\n  const paginationHook = usePagination(props);\n\n  const RenderPaginationComponent = props.render ?? ExampleResultPaginationNextPrev;\n\n  return (\n    <RenderPaginationComponent\n      {...paginationHook}\n    />\n  );\n};\n"]}

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,20 @@
+"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;
+//# sourceMappingURL=ResultPaginationNumbered.js.map

package/dist/src/components/Result/ResultPaginationNumbered.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResultPaginationNumbered.js","sourceRoot":"","sources":["../../../../src/components/Result/ResultPaginationNumbered.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAG1B,uCAA4C;AAC5C,iDAAmE;AAM5D,MAAM,wBAAwB,GAA4C,CAAC,KAAK,EAAE,EAAE;;IACzF,MAAM,cAAc,GAAG,IAAA,qBAAa,EAAC,KAAK,CAAC,CAAC;IAE5C,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE;QAC9B,OAAO,IAAI,CAAC;KACb;IAED,MAAM,yBAAyB,GAAG,MAAA,KAAK,CAAC,MAAM,mCAAI,4CAA+B,CAAC;IAElF,OAAO,CACL,8BAAC,yBAAyB,oBACpB,cAAc,EAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAdW,QAAA,wBAAwB,4BAcnC","sourcesContent":["import React from \"react\";\n\nimport { ReactivesearchPaginationProps } from \"../../types\";\nimport { usePagination } from \"../../hooks\";\nimport { ExampleResultPaginationNumbered } from \"../../components\";\n\nexport type ResultPaginationNumberedProps = ReactivesearchPaginationProps & {\n  render?: React.FC<ReturnType<typeof usePagination>>;\n};\n\nexport const ResultPaginationNumbered: React.FC<ResultPaginationNumberedProps> = (props) => {\n  const paginationHook = usePagination(props);\n\n  if (!paginationHook.totalPages) {\n    return null;\n  }\n  \n  const RenderPaginationComponent = props.render ?? ExampleResultPaginationNumbered;\n\n  return (\n    <RenderPaginationComponent\n      {...paginationHook}\n    />\n  );\n};\n"]}