@searchcraft/react-sdk 0.1.0 → 0.1.1

package/dist/index.js

@@ -1,75 +1,68 @@
-import { jsx as n, jsxs as l, Fragment as T } from "react/jsx-runtime";
-import z, { useMemo as W, useState as y, useContext as Q, useEffect as Z } from "react";
-var K = Object.defineProperty, J = (t, e, s) => e in t ? K(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s, S = (t, e, s) => J(t, typeof e != "symbol" ? e + "" : e, s);
-class G {
+import { jsx as n, jsxs as u, Fragment as k } from "react/jsx-runtime";
+import Q, { useState as g, useContext as Z, useEffect as K } from "react";
+var U = Object.defineProperty, H = (t, e, s) => e in t ? U(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s, N = (t, e, s) => H(t, typeof e != "symbol" ? e + "" : e, s);
+class Jn {
   constructor(e) {
-    if (S(this, "config"), S(this, "searchResult"), S(this, "search", async (s, c) => {
+    if (N(this, "config"), N(this, "search", async (s) => {
       try {
-        this.config.setIsRequestingTrue();
-        const o = `http://localhost:3000${this.config.endpointPath}`, r = {
-          query: s,
-          mode: c,
+        const i = this.config.index.join(","), o = `${this.config.endpointURL}/index/${i}/search`, r = {
+          query: s.query,
+          mode: s.mode,
           app: this.config.index
         }, a = {
           method: "POST",
           headers: {
             "Content-Type": "application/json",
-            Authorization: `${this.config.apiKey}`
+            "Access-Control-Allow-Origin": "*",
+            Authorization: this.config.apiKey ? `${this.config.apiKey}` : ""
           },
           body: JSON.stringify(r)
-        }, i = await (await fetch(o, a)).json();
-        return this.searchResult = i.data, i;
-      } catch (o) {
-        return o;
-      } finally {
-        this.config.setIsRequestingFalse();
+        };
+        return await (await fetch(o, a)).json();
+      } catch (i) {
+        return i;
       }
-    }), !e.apiKey || !e.endpointPath || !e.index)
-      throw new Error(
-        "API key, endpoint path, and index value(s) must be provided"
-      );
-    this.config = e, this.searchResult = null;
+    }), !e.endpointURL || !e.index)
+      throw new Error("Endpoint URL and Index value(s) must be provided");
+    this.config = e;
   }
 }
-const H = {
+const J = {
   error: null,
-  index: "",
+  index: [""],
   isRequesting: !1,
   mode: "fuzzy",
   query: "",
   setQuery: (t) => t,
   search: async () => null
-}, $ = z.createContext(H), Kn = ({
+}, F = Q.createContext(J), Gn = ({
   children: t,
-  config: e
+  searchcraft: e
 }) => {
-  const s = W(
-    () => new G({
-      ...e,
-      setIsRequestingFalse: () => a(!1),
-      setIsRequestingTrue: () => a(!0)
-    }),
-    [e]
-  ), [c, o] = y(""), [r, a] = y(!1), i = {
+  const [s, i] = g(""), [o, r] = g(!1), [a, l] = g(null), c = async () => {
+    r(!0);
+    const _ = await e.search({ query: s, mode: "fuzzy" });
+    l(_), r(!1);
+  }, h = {
     error: null,
-    index: s.config.index,
-    isRequesting: r,
+    index: e.config.index,
+    isRequesting: o,
     mode: "fuzzy",
-    query: c,
-    search: s.search,
-    searchResult: s.searchResult,
-    setQuery: o
+    query: s,
+    search: c,
+    searchResults: a,
+    setQuery: i
   };
-  return /* @__PURE__ */ n($.Provider, { value: i, children: t });
-}, D = () => Q($), U = "_formLTR_dvuqa_5", X = "_formRTL_dvuqa_9", Y = "_searchContainer_dvuqa_13", g = {
-  formLTR: U,
-  formRTL: X,
-  searchContainer: Y
+  return /* @__PURE__ */ n(F.Provider, { value: h, children: t });
+}, v = () => Z(F), G = "_formLTR_dvuqa_5", V = "_formRTL_dvuqa_9", X = "_searchContainer_dvuqa_13", L = {
+  formLTR: G,
+  formRTL: V,
+  searchContainer: X
 };
-function V(t) {
+function Y(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var F = { exports: {} };
+var D = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -80,12 +73,12 @@ var F = { exports: {} };
     var e = {}.hasOwnProperty;
     function s() {
       for (var r = "", a = 0; a < arguments.length; a++) {
-        var i = arguments[a];
-        i && (r = o(r, c(i)));
+        var l = arguments[a];
+        l && (r = o(r, i(l)));
       }
       return r;
     }
-    function c(r) {
+    function i(r) {
       if (typeof r == "string" || typeof r == "number")
         return r;
       if (typeof r != "object")
@@ -95,8 +88,8 @@ var F = { exports: {} };
       if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
         return r.toString();
       var a = "";
-      for (var i in r)
-        e.call(r, i) && r[i] && (a = o(a, i));
+      for (var l in r)
+        e.call(r, l) && r[l] && (a = o(a, l));
       return a;
     }
     function o(r, a) {
@@ -104,79 +97,149 @@ var F = { exports: {} };
     }
     t.exports ? (s.default = s, t.exports = s) : window.classNames = s;
   })();
-})(F);
-var O = F.exports;
-const _ = /* @__PURE__ */ V(O), nn = "_spinnerContainer_1noam_1", tn = "_spinnerDark_1noam_7", en = "_spinning_1noam_1", rn = "_spinnerLight_1noam_16", I = {
-  spinnerContainer: nn,
-  spinnerDark: tn,
-  spinning: en,
-  spinnerLight: rn
-}, N = () => /* @__PURE__ */ n("div", { className: I.spinnerContainer, children: /* @__PURE__ */ n("div", { className: I.spinnerLight }) }), k = () => /* @__PURE__ */ n("div", { className: I.spinnerContainer, children: /* @__PURE__ */ n("div", { className: I.spinnerDark }) }), sn = "_button_8jqm2_5", an = "_spinnerMarginRight_8jqm2_26", on = "_spinnerMarginLeft_8jqm2_32", cn = "_buttonLabel_8jqm2_38", ln = "_rightandback_8jqm2_1", b = {
-  button: sn,
-  spinnerMarginRight: an,
-  spinnerMarginLeft: on,
-  buttonLabel: cn,
-  rightandback: ln
-}, E = ({
+})(D);
+var O = D.exports;
+const p = /* @__PURE__ */ Y(O), nn = "_button_8jqm2_5", tn = "_spinnerMarginRight_8jqm2_26", en = "_spinnerMarginLeft_8jqm2_32", rn = "_buttonLabel_8jqm2_38", on = "_rightandback_8jqm2_1", b = {
+  button: nn,
+  spinnerMarginRight: tn,
+  spinnerMarginLeft: en,
+  buttonLabel: rn,
+  rightandback: on
+}, sn = "_spinnerContainer_1noam_1", an = "_spinnerDark_1noam_7", cn = "_spinning_1noam_1", ln = "_spinnerLight_1noam_16", S = {
+  spinnerContainer: sn,
+  spinnerDark: an,
+  spinning: cn,
+  spinnerLight: ln
+}, x = () => /* @__PURE__ */ n("div", { className: S.spinnerContainer, children: /* @__PURE__ */ n("div", { className: S.spinnerLight }) }), I = () => /* @__PURE__ */ n("div", { className: S.spinnerContainer, children: /* @__PURE__ */ n("div", { className: S.spinnerDark }) }), w = ({
   className: t,
   iconElement: e,
   iconOnly: s = !1,
-  iconPosition: c = "left",
-  isRequesting: o = !1,
-  label: r = "Search",
-  onClick: a
-}) => /* @__PURE__ */ l(T, { children: [
-  s && /* @__PURE__ */ n(
+  iconPosition: i = "left",
+  label: o = "Search",
+  onClick: r
+}) => {
+  const { isRequesting: a } = v();
+  return /* @__PURE__ */ u(k, { children: [
+    s && /* @__PURE__ */ n(
+      "button",
+      {
+        className: p(
+          b.button,
+          t,
+          ".searchcraft-button"
+        ),
+        onClick: r,
+        type: "submit",
+        children: a ? /* @__PURE__ */ n(I, {}) : e
+      }
+    ),
+    !s && /* @__PURE__ */ u(
+      "button",
+      {
+        className: p(
+          b.button,
+          t,
+          ".searchcraft-button"
+        ),
+        onClick: r,
+        type: "submit",
+        children: [
+          i === "left" && a ? /* @__PURE__ */ n("div", { className: b.spinnerMarginRight, children: /* @__PURE__ */ n(I, {}) }) : e,
+          /* @__PURE__ */ n(
+            "span",
+            {
+              className: p(
+                a && b.buttonLabel,
+                t,
+                ".searchcraft-button-label"
+              ),
+              children: o
+            }
+          ),
+          i === "right" && a ? /* @__PURE__ */ n("div", { className: b.spinnerMarginLeft, children: /* @__PURE__ */ n(I, {}) }) : e
+        ]
+      }
+    )
+  ] });
+}, un = "_errorMessage_12dc9_5", pn = {
+  errorMessage: un
+}, hn = ({ className: t, errorMessage: e }) => /* @__PURE__ */ n("p", { className: p(pn.errorMessage, t), children: e || "Search term is required." }), dn = "_inputContainerLTR_s1rq8_5", _n = "_inputContainerRTL_s1rq8_9", Cn = "_inputLTR_s1rq8_14", fn = "_inputRTL_s1rq8_35", mn = "_inputErrorLTR_s1rq8_57", Ln = "_inputErrorRTL_s1rq8_82", m = {
+  inputContainerLTR: dn,
+  inputContainerRTL: _n,
+  inputLTR: Cn,
+  inputRTL: fn,
+  inputErrorLTR: mn,
+  inputErrorRTL: Ln
+}, Rn = "_inputClearButtonLTR_t63ei_5", bn = "_inputClearButtonRTL_t63ei_19", E = {
+  inputClearButtonLTR: Rn,
+  inputClearButtonRTL: bn
+}, M = () => /* @__PURE__ */ u("svg", { width: "22", height: "22", viewBox: "0 0 22 22", fill: "none", children: [
+  /* @__PURE__ */ n("title", { children: "Searchcraft Clear Input Icon" }),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z",
+      stroke: "black",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  )
+] }), q = () => /* @__PURE__ */ u("svg", { width: "20", height: "21", viewBox: "0 0 20 21", fill: "none", children: [
+  /* @__PURE__ */ n("title", { children: "Searchcraft Arrow Right Icon" }),
+  /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M7.5 15.0444L12.5 10.0444L7.5 5.04443",
+      stroke: "#737373",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  )
+] }), B = ({
+  onClearInput: t,
+  rightToLeftOrientation: e = !1
+}) => {
+  const { isRequesting: s } = v();
+  return e ? /* @__PURE__ */ n(
     "button",
     {
-      className: _(b.button, t),
-      onClick: a,
-      type: "submit",
-      children: o ? /* @__PURE__ */ n(k, {}) : e
+      className: p(
+        E.inputClearButtonRTL,
+        ".sc-clear-input-button-rtl"
+      ),
+      onClick: t,
+      type: "button",
+      children: s ? /* @__PURE__ */ n(x, {}) : /* @__PURE__ */ n(M, {})
     }
-  ),
-  !s && /* @__PURE__ */ l(
+  ) : /* @__PURE__ */ n(
     "button",
     {
-      className: _(b.button, t),
-      onClick: a,
-      type: "submit",
-      children: [
-        c === "left" && o ? /* @__PURE__ */ n("div", { className: b.spinnerMarginRight, children: /* @__PURE__ */ n(k, {}) }) : e,
-        /* @__PURE__ */ n(
-          "span",
-          {
-            className: _(
-              o && b.buttonLabel,
-              t
-            ),
-            children: r
-          }
-        ),
-        c === "right" && o ? /* @__PURE__ */ n("div", { className: b.spinnerMarginLeft, children: /* @__PURE__ */ n(k, {}) }) : e
-      ]
+      className: p(
+        E.inputClearButtonLTR,
+        ".sc-clear-input-button-ltr"
+      ),
+      onClick: t,
+      type: "button",
+      children: s ? /* @__PURE__ */ n(x, {}) : /* @__PURE__ */ n(M, {})
     }
-  )
-] }), un = "_errorMessage_12dc9_5", hn = {
-  errorMessage: un
-}, pn = ({
-  className: t,
-  errorMessage: e
-}) => /* @__PURE__ */ n("p", { className: _(hn.errorMessage, t), children: e || "Search term is required." }), dn = "_inputCaption_hmjqk_5", _n = "_inputCaptionError_hmjqk_14", mn = "_inputCaptionRTL_hmjqk_24", Cn = "_inputCaptionErrorRTL_hmjqk_34", v = {
-  inputCaption: dn,
-  inputCaptionError: _n,
-  inputCaptionRTL: mn,
-  inputCaptionErrorRTL: Cn
-}, M = ({
+  );
+}, gn = "_inputCaptionLTR_xoy9r_5", vn = "_inputCaptionErrorLTR_xoy9r_14", Tn = "_inputCaptionRTL_xoy9r_24", yn = "_inputCaptionErrorRTL_xoy9r_34", T = {
+  inputCaptionLTR: gn,
+  inputCaptionErrorLTR: vn,
+  inputCaptionRTL: Tn,
+  inputCaptionErrorRTL: yn
+}, j = ({
   error: t = !1,
   inputCaptionClassName: e,
   inputCaptionValue: s = "Enter Search",
-  rightToLeftOrientation: c = !1
-}) => c ? /* @__PURE__ */ n(
+  rightToLeftOrientation: i = !1
+}) => i ? /* @__PURE__ */ n(
   "p",
   {
-    className: _(
-      t ? v.inputCaptionErrorRTL : v.inputCaptionRTL,
+    className: p(
+      t ? T.inputCaptionErrorRTL : T.inputCaptionRTL,
       e
     ),
     children: s
@@ -184,16 +247,16 @@ const _ = /* @__PURE__ */ V(O), nn = "_spinnerContainer_1noam_1", tn = "_spinner
 ) : /* @__PURE__ */ n(
   "p",
   {
-    className: _(
-      t ? v.inputCaptionError : v.inputCaption,
+    className: p(
+      t ? T.inputCaptionErrorLTR : T.inputCaptionLTR,
       e
     ),
     children: s
   }
-), fn = "_inputIcon_101v2_5", gn = "_inputIconRTL_101v2_13", R = {
-  inputIcon: fn,
-  inputIconRTL: gn
-}, Ln = () => /* @__PURE__ */ l("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+), Sn = "_inputIconLTR_cusap_5", In = "_inputIconRTL_cusap_13", y = {
+  inputIconLTR: Sn,
+  inputIconRTL: In
+}, kn = () => /* @__PURE__ */ u("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
   /* @__PURE__ */ n("title", { children: "Searchcraft Search Icon" }),
   /* @__PURE__ */ n(
     "path",
@@ -205,7 +268,7 @@ const _ = /* @__PURE__ */ V(O), nn = "_spinnerContainer_1noam_1", tn = "_spinner
       strokeLinejoin: "round"
     }
   )
-] }), bn = () => /* @__PURE__ */ l("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+] }), Nn = () => /* @__PURE__ */ u("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
   /* @__PURE__ */ n("title", { children: "Searchcraft Error Search Icon" }),
   /* @__PURE__ */ n(
     "path",
@@ -217,246 +280,224 @@ const _ = /* @__PURE__ */ V(O), nn = "_spinnerContainer_1noam_1", tn = "_spinner
       strokeLinejoin: "round"
     }
   )
-] }), x = ({
+] }), $ = ({
   error: t = !1,
   rightToLeftOrientation: e = !1
 }) => t ? /* @__PURE__ */ n(
   "div",
   {
-    className: e ? R.inputIconRTL : R.inputIcon,
-    children: /* @__PURE__ */ n(bn, {})
+    className: e ? y.inputIconRTL : y.inputIconLTR,
+    children: /* @__PURE__ */ n(Nn, {})
   }
 ) : /* @__PURE__ */ n(
   "div",
   {
-    className: e ? R.inputIconRTL : R.inputIcon,
-    children: /* @__PURE__ */ n(Ln, {})
-  }
-), w = () => /* @__PURE__ */ l("svg", { width: "22", height: "22", viewBox: "0 0 22 22", fill: "none", children: [
-  /* @__PURE__ */ n("title", { children: "Searchcraft Clear Input Icon" }),
-  /* @__PURE__ */ n(
-    "path",
-    {
-      d: "M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z",
-      stroke: "black",
-      strokeWidth: "1.5",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  )
-] }), j = () => /* @__PURE__ */ l("svg", { width: "20", height: "21", viewBox: "0 0 20 21", fill: "none", children: [
-  /* @__PURE__ */ n("title", { children: "Searchcraft Arrow Right Icon" }),
-  /* @__PURE__ */ n(
-    "path",
-    {
-      d: "M7.5 15.0444L12.5 10.0444L7.5 5.04443",
-      stroke: "#737373",
-      strokeWidth: "1.5",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  )
-] }), vn = "_inputClearButton_xi5sa_5", Rn = "_inputClearButtonRTL_xi5sa_19", q = {
-  inputClearButton: vn,
-  inputClearButtonRTL: Rn
-}, B = ({
-  isAutoSearch: t = !1,
-  isRequesting: e = !1,
-  onClearInput: s,
-  rightToLeftOrientation: c = !1
-}) => c ? /* @__PURE__ */ n(
-  "button",
-  {
-    className: q.inputClearButtonRTL,
-    onClick: s,
-    type: "button",
-    children: e ? /* @__PURE__ */ n(N, {}) : /* @__PURE__ */ n(w, {})
+    className: e ? y.inputIconRTL : y.inputIconLTR,
+    children: /* @__PURE__ */ n(kn, {})
   }
-) : /* @__PURE__ */ n(
-  "button",
-  {
-    className: q.inputClearButton,
-    onClick: s,
-    type: "button",
-    children: e ? /* @__PURE__ */ n(N, {}) : /* @__PURE__ */ n(w, {})
-  }
-), yn = "_inputContainer_17hag_5", In = "_inputContainerRTL_17hag_9", Sn = "_input_17hag_5", kn = "_inputRTL_17hag_35", Tn = "_inputError_17hag_57", Nn = "_inputErrorRTL_17hag_82", f = {
-  inputContainer: yn,
-  inputContainerRTL: In,
-  input: Sn,
-  inputRTL: kn,
-  inputError: Tn,
-  inputErrorRTL: Nn
-}, P = ({
+), A = ({
   error: t = !1,
   formClassName: e = "",
   inputCaptionClassName: s = "",
-  inputClassName: c = "",
+  inputClassName: i = "",
   inputCaptionValue: o = "",
-  isRequesting: r = !1,
-  onClearInput: a,
-  onSearchInputChange: i,
-  placeholderValue: d = "Enter Search",
-  rightToLeftOrientation: u = !1,
+  onClearInput: r,
+  onSearchInputChange: a,
+  placeholderValue: l = "Enter Search",
+  rightToLeftOrientation: c = !1,
   query: h = ""
 }) => {
-  const C = u ? f.inputContainerRTL : f.inputContainer;
-  return /* @__PURE__ */ n("div", { className: _(C, e), children: u ? /* @__PURE__ */ l(T, { children: [
-    /* @__PURE__ */ n(
-      "input",
-      {
-        className: _(
-          t ? f.inputErrorRTL : f.inputRTL,
-          c
+  const _ = c ? m.inputContainerRTL : m.inputContainerLTR;
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: p(
+        _,
+        e,
+        "searchcraft-input-form"
+      ),
+      children: c ? /* @__PURE__ */ u(k, { children: [
+        /* @__PURE__ */ n(
+          "input",
+          {
+            className: p(
+              t ? m.inputErrorRTL : m.inputRTL,
+              i,
+              "searchcraft-input"
+            ),
+            id: "searchcraft-input-id",
+            onChange: a,
+            placeholder: l,
+            type: "text",
+            value: h
+          }
         ),
-        id: "sc-input",
-        onChange: i,
-        placeholder: d,
-        type: "text",
-        value: h
-      }
-    ),
-    o && /* @__PURE__ */ n(
-      M,
-      {
-        inputCaptionClassName: s,
-        inputCaptionValue: o,
-        rightToLeftOrientation: u
-      }
-    ),
-    h.length > 0 && /* @__PURE__ */ n(
-      B,
-      {
-        isRequesting: r,
-        onClearInput: a,
-        rightToLeftOrientation: u
-      }
-    ),
-    /* @__PURE__ */ n(
-      x,
-      {
-        error: t,
-        rightToLeftOrientation: u
-      }
-    )
-  ] }) : /* @__PURE__ */ l(T, { children: [
-    /* @__PURE__ */ n(
-      "input",
-      {
-        className: _(
-          t ? f.inputError : f.input,
-          c
+        o && /* @__PURE__ */ n(
+          j,
+          {
+            inputCaptionClassName: s,
+            inputCaptionValue: o,
+            rightToLeftOrientation: c
+          }
         ),
-        id: "sc-input",
-        onChange: i,
-        placeholder: d,
-        type: "text",
-        value: h
-      }
-    ),
-    o && /* @__PURE__ */ n(
-      M,
-      {
-        inputCaptionClassName: s,
-        inputCaptionValue: o,
-        rightToLeftOrientation: u
-      }
-    ),
-    h.length > 0 && /* @__PURE__ */ n(
-      B,
-      {
-        onClearInput: a,
-        isRequesting: r,
-        rightToLeftOrientation: u
-      }
-    ),
-    /* @__PURE__ */ n(x, { error: t })
-  ] }) });
-}, En = "_label_1euwf_5", Mn = {
-  label: En
-}, A = ({
+        h.length > 0 && /* @__PURE__ */ n(
+          B,
+          {
+            onClearInput: r,
+            rightToLeftOrientation: c
+          }
+        ),
+        /* @__PURE__ */ n(
+          $,
+          {
+            error: t,
+            rightToLeftOrientation: c
+          }
+        )
+      ] }) : /* @__PURE__ */ u(k, { children: [
+        /* @__PURE__ */ n(
+          "input",
+          {
+            className: p(
+              t ? m.inputErrorLTR : m.inputLTR,
+              i,
+              "searchcraft-input"
+            ),
+            id: "searchcraft-input-id",
+            onChange: a,
+            placeholder: l,
+            type: "text",
+            value: h
+          }
+        ),
+        o && /* @__PURE__ */ n(
+          j,
+          {
+            inputCaptionClassName: s,
+            inputCaptionValue: o,
+            rightToLeftOrientation: c
+          }
+        ),
+        h.length > 0 && /* @__PURE__ */ n(
+          B,
+          {
+            onClearInput: r,
+            rightToLeftOrientation: c
+          }
+        ),
+        /* @__PURE__ */ n($, { error: t })
+      ] })
+    }
+  );
+}, xn = "_label_1euwf_5", wn = {
+  label: xn
+}, z = ({
   className: t,
   label: e = "Enter Search"
-}) => /* @__PURE__ */ n("label", { className: _(Mn.label, t), htmlFor: "sc-input", children: e }), Jn = ({
+}) => /* @__PURE__ */ n(
+  "label",
+  {
+    className: p(wn.label, t),
+    htmlFor: "searchcraft-input-id",
+    children: e
+  }
+), Vn = ({
   errorMessage: t,
   handleSubmit: e,
   labelForInput: s = "Search",
-  placeholderValue: c = "Enter Search Term",
+  placeholderValue: i = "Enter Search Term",
   rightToLeftOrientation: o = !1
 }) => {
-  const { query: r, isRequesting: a, setQuery: i } = D(), [d, u] = y(!1), h = (m) => {
-    m.preventDefault(), r.trim() === "" ? u(!0) : (u(!1), e(r));
-  }, C = (m) => i(m.target.value), L = () => i("");
-  return /* @__PURE__ */ l(
+  const { query: r, setQuery: a } = v(), [l, c] = g(!1), h = (C) => {
+    C.preventDefault(), r.trim() === "" ? c(!0) : (c(!1), e(r));
+  }, _ = (C) => a(C.target.value), f = () => a("");
+  return /* @__PURE__ */ u(
     "form",
     {
-      className: o ? g.formRTL : g.formLTR,
+      className: o ? L.formRTL : L.formLTR,
       onSubmit: h,
       children: [
-        /* @__PURE__ */ n(A, { label: s }),
-        /* @__PURE__ */ l("div", { className: g.searchContainer, children: [
-          o && /* @__PURE__ */ n(E, { isRequesting: a }),
+        /* @__PURE__ */ n(z, { label: s }),
+        /* @__PURE__ */ u("div", { className: L.searchContainer, children: [
+          o && /* @__PURE__ */ n(w, {}),
           /* @__PURE__ */ n(
-            P,
+            A,
             {
-              error: d,
-              onClearInput: L,
-              onSearchInputChange: C,
-              placeholderValue: c,
+              error: l,
+              onClearInput: f,
+              onSearchInputChange: _,
+              placeholderValue: i,
               query: r,
               rightToLeftOrientation: o
             }
           ),
-          !o && /* @__PURE__ */ n(E, { isRequesting: a })
+          !o && /* @__PURE__ */ n(w, {})
         ] }),
-        d && /* @__PURE__ */ n(pn, { errorMessage: t })
+        l && /* @__PURE__ */ n(hn, { errorMessage: t })
       ]
     }
   );
-}, Gn = ({
-  handleSubmit: t,
-  inputCaptionValue: e = "",
-  labelForInput: s = "Search",
-  onClearedInput: c = () => {
+}, Xn = ({
+  autoSearchFormClass: t = "",
+  handleSubmit: e,
+  inputCaptionValue: s = "",
+  labelForInput: i = "Search",
+  onClearedInput: o = () => {
   },
-  placeholderValue: o = "Search here",
-  rightToLeftOrientation: r = !1
+  placeholderValue: r = "Search here",
+  rightToLeftOrientation: a = !1,
+  searchContainerClass: l = ""
 }) => {
-  const { isRequesting: a, query: i, setQuery: d } = D(), [u, h] = y(!1), C = (m) => {
-    m.preventDefault(), d(m.currentTarget.value), i !== m.currentTarget.value && h(!0);
-  }, L = () => {
-    d(""), c();
+  const { query: c, setQuery: h } = v(), [_, f] = g(!1), C = (R) => {
+    R.preventDefault(), h(R.currentTarget.value), c !== R.currentTarget.value && f(!0);
+  }, P = () => {
+    h(""), o();
   };
-  return Z(() => {
-    if (u)
-      t(i), h(!1);
+  K(() => {
+    if (_)
+      e(c), f(!1);
     else
       return;
-  }, [u, t, i]), /* @__PURE__ */ l(
+  }, [_, e, c]);
+  const W = a ? L.formRTL : L.formLTR;
+  return /* @__PURE__ */ u(
     "form",
     {
-      className: r ? g.formRTL : g.formLTR,
-      onSubmit: (m) => {
-        m.preventDefault();
+      className: p(
+        W,
+        t,
+        "searchcraft-auto-search-form"
+      ),
+      onSubmit: (R) => {
+        R.preventDefault();
       },
       children: [
-        /* @__PURE__ */ n(A, { label: s }),
-        /* @__PURE__ */ n("div", { className: g.searchContainer, children: /* @__PURE__ */ n(
-          P,
+        /* @__PURE__ */ n(z, { label: i }),
+        /* @__PURE__ */ n(
+          "div",
           {
-            inputCaptionValue: e,
-            isRequesting: a,
-            onClearInput: L,
-            onSearchInputChange: C,
-            placeholderValue: o,
-            query: i,
-            rightToLeftOrientation: r
+            className: p(
+              L.searchContainer,
+              l,
+              "searchcraft-input-container"
+            ),
+            children: /* @__PURE__ */ n(
+              A,
+              {
+                inputCaptionValue: s,
+                onClearInput: P,
+                onSearchInputChange: C,
+                placeholderValue: r,
+                query: c,
+                rightToLeftOrientation: a
+              }
+            )
           }
-        ) })
+        )
       ]
     }
   );
-}, xn = () => /* @__PURE__ */ l("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
+}, En = () => /* @__PURE__ */ u("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [
   /* @__PURE__ */ n("title", { children: "Searchcraft Button Icon" }),
   /* @__PURE__ */ n(
     "path",
@@ -468,77 +509,105 @@ const _ = /* @__PURE__ */ V(O), nn = "_spinnerContainer_1noam_1", tn = "_spinner
       strokeLinejoin: "round"
     }
   )
-] }), wn = "_resultContainer_10d68_5", jn = "_interactiveResultContainer_10d68_17", qn = "_interactiveIconLarge_10d68_33", Bn = "_interactiveIconSmall_10d68_45", $n = "_imageContainer_10d68_57", Dn = "_contentContainer_10d68_68", Fn = "_image_10d68_57", Pn = "_heading_10d68_86", An = "_subheading_10d68_97", zn = "_bodyContent_10d68_107", Wn = "_button_10d68_117", p = {
-  resultContainer: wn,
-  interactiveResultContainer: jn,
-  interactiveIconLarge: qn,
-  interactiveIconSmall: Bn,
+] }), Mn = "_resultContainer_10d68_5", qn = "_interactiveResultContainer_10d68_17", Bn = "_interactiveIconLarge_10d68_33", jn = "_interactiveIconSmall_10d68_45", $n = "_imageContainer_10d68_57", Fn = "_contentContainer_10d68_68", Dn = "_image_10d68_57", An = "_heading_10d68_86", zn = "_subheading_10d68_97", Pn = "_bodyContent_10d68_107", Wn = "_button_10d68_117", d = {
+  resultContainer: Mn,
+  interactiveResultContainer: qn,
+  interactiveIconLarge: Bn,
+  interactiveIconSmall: jn,
   imageContainer: $n,
-  contentContainer: Dn,
-  image: Fn,
-  heading: Pn,
-  subheading: An,
-  bodyContent: zn,
+  contentContainer: Fn,
+  image: Dn,
+  heading: An,
+  subheading: zn,
+  bodyContent: Pn,
   button: Wn
-}, Hn = ({
+}, Qn = ({
   buttonCallbackFn: t = () => {
   },
   buttonLabel: e = "",
   callbackFn: s = () => {
   },
-  keyDownCallbackFn: c = () => {
+  keyDownCallbackFn: i = () => {
   },
   imageAltText: o = "",
   interactiveResult: r = !1,
   imageSrc: a = "",
-  resultBodyContent: i = "",
-  resultHeading: d = "",
-  resultSubheading: u = ""
+  resultBodyContent: l = "",
+  resultHeading: c = "",
+  resultSubheading: h = ""
 }) => {
-  const h = (L) => {
-    L.stopPropagation(), t();
-  }, C = () => {
+  const _ = (C) => {
+    C.stopPropagation(), t();
+  }, f = () => {
     if (r)
       s();
     else
       return;
   };
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(
     "div",
     {
-      className: r ? p.interactiveResultContainer : p.resultContainer,
+      className: r ? d.interactiveResultContainer : d.resultContainer,
       id: "searchcraft-item",
-      onClick: C,
-      onKeyDown: c,
+      onClick: f,
+      onKeyDown: i,
       children: [
-        r && /* @__PURE__ */ n("div", { className: p.interactiveIconLarge, children: /* @__PURE__ */ n(j, {}) }),
-        /* @__PURE__ */ n("div", { className: p.imageContainer, children: /* @__PURE__ */ n("img", { alt: o, className: p.image, src: a }) }),
-        /* @__PURE__ */ l("div", { className: p.contentContainer, children: [
-          /* @__PURE__ */ l("h2", { className: p.heading, children: [
-            d,
+        r && /* @__PURE__ */ n("div", { className: d.interactiveIconLarge, children: /* @__PURE__ */ n(q, {}) }),
+        /* @__PURE__ */ n("div", { className: d.imageContainer, children: /* @__PURE__ */ n("img", { alt: o, className: d.image, src: a }) }),
+        /* @__PURE__ */ u("div", { className: d.contentContainer, children: [
+          /* @__PURE__ */ u("h2", { className: d.heading, children: [
+            c,
             " ",
-            r && /* @__PURE__ */ n("div", { className: p.interactiveIconSmall, children: /* @__PURE__ */ n(j, {}) })
+            r && /* @__PURE__ */ n("div", { className: d.interactiveIconSmall, children: /* @__PURE__ */ n(q, {}) })
           ] }),
-          /* @__PURE__ */ n("h3", { className: p.subheading, children: u }),
-          /* @__PURE__ */ n("p", { className: p.bodyContent, children: i }),
-          /* @__PURE__ */ l("button", { className: p.button, onClick: h, type: "button", children: [
-            /* @__PURE__ */ n(xn, {}),
+          /* @__PURE__ */ n("h3", { className: d.subheading, children: h }),
+          /* @__PURE__ */ n("p", { className: d.bodyContent, children: l }),
+          /* @__PURE__ */ u("button", { className: d.button, onClick: _, type: "button", children: [
+            /* @__PURE__ */ n(En, {}),
             /* @__PURE__ */ n("span", { children: e })
           ] })
         ] })
       ]
     }
   );
+}, Zn = "_resultsContainer_pfxt4_5", Kn = {
+  resultsContainer: Zn
+}, Yn = () => {
+  var e;
+  const { searchResults: t } = v();
+  return /* @__PURE__ */ n("div", { className: Kn.resultsContainer, children: t != null && t.hits ? (e = t == null ? void 0 : t.hits) == null ? void 0 : e.map((s, i) => {
+    const { doc: o } = s;
+    return /* @__PURE__ */ n(
+      Qn,
+      {
+        buttonLabel: "View More",
+        buttonCallbackFn: () => {
+          console.log("button callback");
+        },
+        callbackFn: () => {
+          console.log("interactive");
+        },
+        interactiveResult: !0,
+        imageSrc: o == null ? void 0 : o.poster,
+        resultBodyContent: o == null ? void 0 : o.overview,
+        resultHeading: o == null ? void 0 : o.title,
+        resultSubheading: o == null ? void 0 : o.release_date
+      },
+      `${o == null ? void 0 : o.id}-${i}`
+    );
+  }) : /* @__PURE__ */ n("div", { children: "no results found" }) });
 };
 export {
-  Gn as AutoSearchForm,
-  Jn as BaseSearchForm,
-  Hn as BaseSearchResult,
-  E as Button,
-  pn as ErrorMessage,
-  P as Input,
-  A as InputLabel,
-  Kn as SearchcraftProvider,
-  D as useSearchcraft
+  Xn as AutoSearchForm,
+  Vn as BaseSearchForm,
+  Qn as BaseSearchResult,
+  Yn as BaseSearchResults,
+  w as Button,
+  hn as ErrorMessage,
+  A as Input,
+  z as InputLabel,
+  Jn as Searchcraft,
+  Gn as SearchcraftProvider,
+  v as useSearchcraft
 };
 //# sourceMappingURL=index.js.map