@depict-ai/ui 4.10.18 → 4.10.20

package/server/latest/index.cjs

@@ -109,7 +109,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $1f4925833f07df29$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $1f4925833f07df29$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $14f289047713d67a$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.18";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.20";
 function $b54e6192d0caa293$export$d9f36cf74e24d595(media_query) {
   const signal = $5vyXB$solidjs.createSignal(false);
   $5vyXB$solidjs.onCleanup($5vyXB$depictaiutilishared.javascript_media_query(media_query, ({
@@ -2151,6 +2151,7 @@ async function $9abb0a35d4b60ed3$export$79b1565500412d9b(search_modal, modal_fn_
     const modal_els = $5vyXB$solidjs.createRoot(dispose => {
       let closing_animation;
       let animation_started;
+      let focus_target_after_close;
       dispose_and_remove = () => {
         const actually_close = () => {
           dispose();
@@ -2169,11 +2170,19 @@ async function $9abb0a35d4b60ed3$export$79b1565500412d9b(search_modal, modal_fn_
               activeElement?.blur?.();
             el.remove();
           });
-          if (should_restore_focus && element_focused_before_open?.isConnected) {
+          const requested_focus_target = focus_target_after_close?.();
+          if (should_restore_focus && (requested_focus_target?.isConnected || element_focused_before_open?.isConnected)) {
             restoring_focus = true;
             try {
               // preventScroll so this can't re-introduce the safari page-jump the blur() above works around
-              element_focused_before_open.focus({
+              let focused = false;
+              if (requested_focus_target?.isConnected) {
+                requested_focus_target.focus({
+                  preventScroll: true
+                });
+                focused = requested_focus_target.getRootNode().activeElement === requested_focus_target;
+              }
+              if (!focused && element_focused_before_open?.isConnected) element_focused_before_open.focus({
                 preventScroll: true
               });
             } finally {
@@ -2194,7 +2203,8 @@ async function $9abb0a35d4b60ed3$export$79b1565500412d9b(search_modal, modal_fn_
         ...extra_options_for_modal,
         close_modal_: close_modal_,
         open_modal_: open_modal_,
-        register_closing_animation_: animation => closing_animation = animation
+        register_closing_animation_: animation => closing_animation = animation,
+        set_focus_target_after_close_: get_target => focus_target_after_close = get_target
       });
     });
     body.append(...modal_els);
@@ -6363,7 +6373,8 @@ function $d212a67662c5cf38$export$140423fa4bfb6d63(props) {
   }));
 }
 var $32c662f618f5d80d$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'],
-  $32c662f618f5d80d$var$_tmpl$2 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
+  $32c662f618f5d80d$var$_tmpl$2 = ["<div", ' class="d-standard-content-text-group"', '><span class="d-standard-content-text"', ">", '</span><span class="d-standard-content-cta"', ">", "</span></div>"],
+  $32c662f618f5d80d$var$_tmpl$3 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
 function $32c662f618f5d80d$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -6373,7 +6384,8 @@ function $32c662f618f5d80d$export$780a853d15174484({
   aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
   imageResizer_: imageResizer_,
   text_: text_,
-  textPosition_: textPosition_
+  textPosition_: textPosition_,
+  cta_: cta_
 }) {
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $5vyXB$solidjs.createSignal();
@@ -6435,12 +6447,31 @@ function $32c662f618f5d80d$export$780a853d15174484({
       }), $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
         when: text_,
         get children() {
-          return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$2, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_));
+          return $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
+            when: cta_,
+            get fallback() {
+              return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$3, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_));
+            },
+            get children() {
+              return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$2, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(cta_));
+            }
+          });
         }
       })];
     }
   }));
 }
+const $0a80939bf0a1e9cc$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text ?? null, text_position ?? null, cta ?? null]);
+};
 function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -6477,13 +6508,11 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text ?? null, text_position ?? null]);
+      const componentCacheKey = $0a80939bf0a1e9cc$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -6503,7 +6532,8 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }
@@ -8820,6 +8850,7 @@ function $0175183387c8923a$export$f7658c347b037c3f(props = {}) {
 var $66b8b9a9613c141d$var$_tmpl$ = ["<div", ' style="', '" class="spacer"></div>'],
   $66b8b9a9613c141d$var$_tmpl$2 = ['<div class="field"><!--$-->', "<!--/-->", "<!--$-->", "<!--/--></div>"],
   $66b8b9a9613c141d$var$_tmpl$3 = ["<button", ' class="submit major" type="button"', ">", "</button>"];
+const $66b8b9a9613c141d$var$keys_not_opening_modal = new Set(["Tab", "Shift", "Control", "Alt", "AltGraph", "Meta", "CapsLock", "Escape", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "PageUp", "PageDown", "Home", "End", "Insert", "ContextMenu", "NumLock", "ScrollLock", "Pause", "PrintScreen"]);
 function $66b8b9a9613c141d$export$b94867ecbd698f21({
   search_field_value_: [searchFieldValue, setSearchFieldValue],
   input_field_ref_: input_field_ref_,
@@ -8961,6 +8992,31 @@ function $eb3039a27db40508$export$93d9bfd0c9c1a5b8(close_modal, search_query_url
     }
   })();
 }
+function $5f9dc76a99175920$export$9e9e2ae069cf2fe1({
+  props_search_field_value_: props_search_field_value_,
+  props_submit_query_: props_submit_query_,
+  dont_sync_search_field_value_except_on_submit_: dont_sync_search_field_value_except_on_submit_,
+  set_focus_target_after_close_: set_focus_target_after_close_,
+  get_search_page_input_element_: get_search_page_input_element_
+}) {
+  const search_field_value_ = dont_sync_search_field_value_except_on_submit_ ? $5vyXB$solidjs.createSignal("") : props_search_field_value_;
+  let submits_in_flight = 0;
+  const submit_query_ = async (new_query = $5vyXB$solidjs.untrack(search_field_value_[0])) => {
+    submits_in_flight++;
+    try {
+      return await props_submit_query_(new_query, () => set_focus_target_after_close_(get_search_page_input_element_));
+    } finally {
+      submits_in_flight--;
+    }
+  };
+  if (dont_sync_search_field_value_except_on_submit_) $5vyXB$solidjs.createEffect($5vyXB$solidjs.on(search_field_value_[0], value => submits_in_flight > 0 && props_search_field_value_[1](value), {
+    defer: true
+  }));
+  return {
+    search_field_value_: search_field_value_,
+    submit_query_: submit_query_
+  };
+}
 var $44f0b2e312a9b710$var$_tmpl$ = ["<div", ' class="discover-more"><button class="major" type="button">', "</button></div>"],
   $44f0b2e312a9b710$var$_tmpl$2 = ["<b", ">", "</b>"],
   $44f0b2e312a9b710$var$_tmpl$3 = ["<div", ' class="', '"><div class="', '" role="search" aria-label="Search modal with search field, query suggestions and result preview"><!--$-->', '<!--/--><div id="depict-suggestions-and-result-preview" class="padded"><!--$-->', "<!--/--><!--$-->", "<!--/--><!--$-->", "<!--/--></div><!--$-->", "<!--/--></div><!--$-->", "<!--/--></div>"],
@@ -8974,6 +9030,8 @@ function $44f0b2e312a9b710$var$RawClassicSearchModal({
   search_query_url_param_name_: search_query_url_param_name_,
   previous_searches_: previous_searches_,
   close_modal_: close_modal_,
+  set_focus_target_after_close_: set_focus_target_after_close_,
+  get_search_page_input_element_: get_search_page_input_element_,
   depict_api_: depict_api_,
   merchant_: merchant_,
   market_: market_,
@@ -8998,15 +9056,16 @@ function $44f0b2e312a9b710$var$RawClassicSearchModal({
   // As per feedback from stronger we sometimes want a modal with the search field value disconnected from the one in the rest of the UI, see https://depictaiworkspace.slack.com/archives/C02J16R9XEH/p1679065878487709.
   // This is desired for when the modal is opened from a UI element that visually does not look connected with the search page or current query
   // Basically the UI signals that the button that opens the modal starts a new search.
-  const search_field_value_ = dont_sync_search_field_value_except_on_submit_ ? $5vyXB$solidjs.createSignal("") : props_search_field_value;
-  const propagate_search_field_value_back = dont_sync_search_field_value_except_on_submit_ ? () => props_search_field_value[1]($5vyXB$solidjs.untrack(search_field_value_[0])) // Set actual search field value to the throwaway internal one before submitting
-  : undefined;
-  const submit_query_ = (...args) => {
-    // submit_query expects to read the current search field value which is why we have to write the current one to the signal before calling it
-    // It will write the old one back and then write the new one after submit
-    propagate_search_field_value_back?.();
-    return props_submit_query(...args);
-  };
+  const {
+    search_field_value_: search_field_value_,
+    submit_query_: submit_query_
+  } = $5f9dc76a99175920$export$9e9e2ae069cf2fe1({
+    props_search_field_value_: props_search_field_value,
+    props_submit_query_: props_submit_query,
+    dont_sync_search_field_value_except_on_submit_: dont_sync_search_field_value_except_on_submit_,
+    set_focus_target_after_close_: set_focus_target_after_close_,
+    get_search_page_input_element_: get_search_page_input_element_
+  });
   const [input_field, set_input_field] = $5vyXB$solidjs.createSignal();
   const [get_search_field_value_] = search_field_value_;
   // Search field alignment unused in ClassicSearchModal since the search field spans the whole modal
@@ -9604,6 +9663,8 @@ function $11597ae03e703a47$var$RawSearchModalV2({
   search_query_url_param_name_: search_query_url_param_name_,
   previous_searches_: previous_searches_,
   close_modal_: close_modal_,
+  set_focus_target_after_close_: set_focus_target_after_close_,
+  get_search_page_input_element_: get_search_page_input_element_,
   alignmentSignals_: alignmentSignals_,
   depict_api_: depict_api_,
   merchant_: merchant_,
@@ -9634,15 +9695,16 @@ function $11597ae03e703a47$var$RawSearchModalV2({
   // As per feedback from stronger we sometimes want a modal with the search field value disconnected from the one in the rest of the UI, see https://depictaiworkspace.slack.com/archives/C02J16R9XEH/p1679065878487709.
   // This is desired for when the modal is opened from a UI element that visually does not look connected with the search page or current query
   // Basically the UI signals that the button that opens the modal starts a new search.
-  const search_field_value_ = dont_sync_search_field_value_except_on_submit_ ? $5vyXB$solidjs.createSignal("") : props_search_field_value;
-  const propagate_search_field_value_back = dont_sync_search_field_value_except_on_submit_ ? () => props_search_field_value[1]($5vyXB$solidjs.untrack(search_field_value_[0])) // Set actual search field value to the throwaway internal one before submitting
-  : undefined;
-  const submit_query_ = (...args) => {
-    // submit_query expects to read the current search field value which is why we have to write the current one to the signal before calling it
-    // It will write the old one back and then write the new one after submit
-    propagate_search_field_value_back?.();
-    return props_submit_query(...args);
-  };
+  const {
+    search_field_value_: search_field_value_,
+    submit_query_: submit_query_
+  } = $5f9dc76a99175920$export$9e9e2ae069cf2fe1({
+    props_search_field_value_: props_search_field_value,
+    props_submit_query_: props_submit_query,
+    dont_sync_search_field_value_except_on_submit_: dont_sync_search_field_value_except_on_submit_,
+    set_focus_target_after_close_: set_focus_target_after_close_,
+    get_search_page_input_element_: get_search_page_input_element_
+  });
   const [input_field, set_input_field] = $5vyXB$solidjs.createSignal();
   const [searching_for_value_, set_searching_for_value_] = $5vyXB$solidjs.createSignal();
   const [show_stale_content_results_, set_show_stale_content_results_] = $5vyXB$solidjs.createSignal(false);
@@ -11470,11 +11532,12 @@ function $2b7a005a65221045$export$84bba84a7b837187(read_search_query) {
 async function $f328bd45f8ede33c$export$e16630ecb9644a1c({
   on_submit_with_unchanged_value_: on_submit_with_unchanged_value_,
   search_param_name_: search_param_name_,
-  set_search_field_value_: set_search_field_value_,
+  search_field_value_: search_field_value_,
   get_search_query_: get_search_query_,
   url_transformer_: url_transformer_,
   router_: router_,
   after_submit_: after_submit_,
+  before_navigate_: before_navigate_,
   get_new_query: get_new_query
 }) {
   const new_search_query = get_new_query();
@@ -11482,21 +11545,89 @@ async function $f328bd45f8ede33c$export$e16630ecb9644a1c({
   if (previous_query === new_search_query && new URLSearchParams(location.search).has(search_param_name_)) {
     // don't push a history entry / re-search if someone submits a search again
     // do close the modal though
+    search_field_value_.settle_(new_search_query);
     on_submit_with_unchanged_value_?.();
-    return;
+    return false;
   }
-  set_search_field_value_(previous_query); // restore the value to the previous query since this one goes to the new history entry
   const target_url = new URL(location.href);
   url_transformer_?.(target_url);
   target_url.searchParams.set(search_param_name_, new_search_query);
-  await router_.navigate_.go_to_({
-    new_url_: target_url,
-    is_replace_: false,
-    force_spa_navigation_: true
-  });
-  set_search_field_value_(new_search_query);
+  const end_submit = search_field_value_.begin_submit_(new_search_query, previous_query);
+  before_navigate_?.();
+  let landed;
+  try {
+    await router_.navigate_.go_to_({
+      new_url_: target_url,
+      is_replace_: false,
+      force_spa_navigation_: true
+    });
+  } finally {
+    landed = end_submit();
+  }
+  if (!landed) return false;
   scrollTo(0, 0);
   after_submit_?.();
+  return true;
+}
+function $380b434363eee5f6$export$d13a185c53aa5edf(persisted_, get_search_query_) {
+  const [get_persisted, set_persisted] = persisted_;
+  const [get_submitting, set_submitting] = $5vyXB$solidjs.createSignal();
+  const get_value = $5vyXB$solidjs.createMemo(() => get_submitting() ?? get_persisted());
+  const set_value = value => {
+    const new_value = typeof value === "function" ? value($5vyXB$solidjs.untrack(get_value)) : value;
+    if ($5vyXB$solidjs.untrack(get_submitting) === undefined) set_persisted(new_value);else set_submitting(new_value);
+    return new_value;
+  };
+  let current_submit;
+  const end_submit = landed => {
+    current_submit.landed_ = landed;
+    current_submit = undefined;
+    $5vyXB$solidjs.batch(() => {
+      const submitting = $5vyXB$solidjs.untrack(get_submitting);
+      set_submitting(undefined);
+      if (landed && submitting !== undefined) set_persisted(submitting);
+    });
+  };
+  const abort_on_popstate = what_happened => {
+    if (what_happened === "popstate" && current_submit) end_submit(false);
+  };
+  (0, $5vyXB$depictaiutilishared.instant_exec_on_suspect_history_change).add(abort_on_popstate);
+  $5vyXB$solidjs.onCleanup(() => (0, $5vyXB$depictaiutilishared.instant_exec_on_suspect_history_change).delete(abort_on_popstate));
+  $5vyXB$solidjs.createEffect($5vyXB$solidjs.on(get_search_query_, query => {
+    const token = current_submit;
+    if (!token || query !== token.query_) return;
+    queueMicrotask(() => {
+      if (current_submit === token) end_submit(true);
+    });
+  }, {
+    defer: true
+  }));
+  const begin_submit_ = (submitted_query, query_of_current_history_entry) => {
+    const token = current_submit = {
+      query_: submitted_query,
+      landed_: false
+    };
+    $5vyXB$solidjs.batch(() => {
+      set_submitting(submitted_query);
+      set_persisted(query_of_current_history_entry);
+    });
+    return () => {
+      if (current_submit === token) end_submit(true);
+      return token.landed_;
+    };
+  };
+  const settle_ = query => {
+    if (current_submit) return;
+    $5vyXB$solidjs.batch(() => {
+      set_submitting(undefined);
+      set_persisted(query);
+    });
+  };
+  return {
+    value_: [get_value, set_value],
+    begin_submit_: begin_submit_,
+    settle_: settle_
+  };
 }
 function $331c7a65de274e6c$export$181cceed5c91919e(callback, alsoRaF, passiveListener) {
   let aligned_this_microtask = false;
@@ -12132,6 +12263,7 @@ function $f1d7cb69f839a526$export$a54ec244c8863715({
   scroll_restoration_data_: scroll_restoration_data_,
   product_card_template_: product_card_template_,
   modalAlignmentSignalsRef_: modalAlignmentSignalsRef_,
+  inputFieldRef_: inputFieldRef_,
   router_: router_,
   content_results_rows_: content_results_rows_,
   content_layout_options_: content_layout_options_,
@@ -12311,6 +12443,8 @@ function $f1d7cb69f839a526$export$a54ec244c8863715({
       if (!search_field) break add_input_field;
       setModalBodyStyle({});
       modalAlignmentSignalsRef_?.(alignmentSignals_);
+      inputFieldRef_?.(input_element);
+      $5vyXB$solidjs.onCleanup(() => inputFieldRef_?.(undefined));
       const [pollAlignment, setPollAlignment_] = $5vyXB$solidjs.createSignal(false);
       const align_position = $5vyXB$depictaiutilishared.catchify((0, $fd463ff0edb29915$export$b3ad617e9036868))(alignmentSignals_, search_field, (0, $fd463ff0edb29915$export$3f238c96c45e6cc6) | (0, $fd463ff0edb29915$export$7895aadd1956b1c7) | (modalVersionUsed_ === 1 ? (0, $fd463ff0edb29915$export$902f8b4a7dae5d78) : (0, $fd463ff0edb29915$export$6060bc6bee850eb6) | (0, $fd463ff0edb29915$export$5097308c5200105a)), true, pollAlignment);
       div_with_field_class.addEventListener("click", $5vyXB$depictaiutilishared.catchify(e => {
@@ -12612,14 +12746,16 @@ class $2c61e4cd8229c49a$export$ac6237957a15b3f0 {
         set_search_content_results_rows((0, $3716b8caf7f959e2$export$70ceae36059a1036));
       }; // do this every time after we have submitted a new query - otherwise there might already be a saved number of rows in the state
       const on_submit_with_unchanged_value_ = () => this.modal_open = false;
-      const [get_search_field_value_, set_search_field_value_] = state_.field_value;
-      const configured_submit_query_ = new_query => $f328bd45f8ede33c$export$e16630ecb9644a1c({
+      const search_field_value_ = $380b434363eee5f6$export$d13a185c53aa5edf(state_.field_value, get_search_query_);
+      const [get_search_field_value_] = search_field_value_.value_;
+      const configured_submit_query_ = (new_query, before_navigate_) => $f328bd45f8ede33c$export$e16630ecb9644a1c({
         on_submit_with_unchanged_value_: on_submit_with_unchanged_value_,
-        set_search_field_value_: set_search_field_value_,
+        search_field_value_: search_field_value_,
         get_search_query_: get_search_query_,
         search_param_name_: search_query_url_param_name_,
         after_submit_: after_submit_,
-        get_new_query: () => new_query || $5vyXB$solidjs.untrack(get_search_field_value_),
+        before_navigate_: before_navigate_,
+        get_new_query: () => new_query ?? $5vyXB$solidjs.untrack(get_search_field_value_),
         url_transformer_: url_transformer,
         router_: this.#router
       });
@@ -12638,6 +12774,7 @@ class $2c61e4cd8229c49a$export$ac6237957a15b3f0 {
         search_query_url_param_name_: search_query_url_param_name_,
         reset_history_state_: reset_history_state_,
         state_: state_,
+        search_field_value_: search_field_value_.value_,
         router_: this.#router,
         url_transformer_: url_transformer,
         depict_api_: depict_api_,
@@ -12661,7 +12798,8 @@ class $2c61e4cd8229c49a$export$ac6237957a15b3f0 {
           $5vyXB$solidjs.onCleanup(() => this.modal_open = false);
           return searchModalComponent(...args);
         }, {
-          search_field_value_: state_.field_value,
+          search_field_value_: search_field_value_.value_,
+          get_search_page_input_element_: () => $2c61e4cd8229c49a$export$dde08b2dca8cc1ce.get(this)?.search_page_input_element_,
           get_search_query_: get_search_query_,
           search_query_url_param_name_: search_query_url_param_name_,
           previous_searches_: previous_searches,
@@ -12809,6 +12947,7 @@ function $2c61e4cd8229c49a$export$f2dc7e4e4aa11abb(props) {
     const {
       state_: state_
     } = shared_properties;
+    let registered_input_element;
     const grid_spacing_override = $5vyXB$solidjs.createMemo(() => {
       const {
         grid_spacing: grid_spacing
@@ -12837,7 +12976,7 @@ function $2c61e4cd8229c49a$export$f2dc7e4e4aa11abb(props) {
       min_products_to_fetch_: $2c61e4cd8229c49a$var$min_products_to_fetch_,
       local_filter_cache_: state_.local_filter_cache,
       content_search_enabled_: () => depict_search.enable_content_search ?? $2c61e4cd8229c49a$var$content_search_default,
-      search_field_value_: state_.field_value,
+      search_field_value_: shared_properties.search_field_value_,
       get_search_query_: shared_properties.get_search_query_,
       clear_filters_on_next_submit_: shared_properties.clear_filters_on_next_submit_,
       open_modal_: (...args) => depict_search.modal_open = args,
@@ -12845,6 +12984,16 @@ function $2c61e4cd8229c49a$export$f2dc7e4e4aa11abb(props) {
       modalVersionUsed_: shared_properties.modalVersionUsed_,
       showSliderArrow_: () => props.showSliderArrow_,
       i18n_: shared_properties.i18n_,
+      inputFieldRef_: input_element => {
+        const shared_info_right_now = $2c61e4cd8229c49a$export$dde08b2dca8cc1ce.get(depict_search);
+        if (!shared_info_right_now) return;
+        if (input_element === undefined && shared_info_right_now.search_page_input_element_ !== registered_input_element) return;
+        registered_input_element = input_element;
+        $2c61e4cd8229c49a$export$dde08b2dca8cc1ce.set(depict_search, {
+          ...shared_info_right_now,
+          search_page_input_element_: input_element
+        });
+      },
       modalAlignmentSignalsRef_: style => {
         const shared_info_right_now = $2c61e4cd8229c49a$export$dde08b2dca8cc1ce.get(depict_search);
         if (!shared_info_right_now) return;
@@ -13195,7 +13344,7 @@ function $c0a0659cf97e8eb2$export$316f6f283ae64765(props) {
         return shared_properties.BackIcon_;
       },
       get search_field_value_() {
-        return shared_properties.state_.field_value;
+        return shared_properties.search_field_value_;
       },
       get submit_query_() {
         return shared_properties.configured_submit_query_;
@@ -13238,7 +13387,7 @@ function $c0a0659cf97e8eb2$export$316f6f283ae64765(props) {
                   return shared_properties.BackIcon_;
                 },
                 get search_field_value_() {
-                  return shared_properties.state_.field_value;
+                  return shared_properties.search_field_value_;
                 },
                 get submit_query_() {
                   return shared_properties.configured_submit_query_;

package/server/latest/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.10.18";
+export const version = "4.10.20";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -713,6 +713,8 @@ declare function RawSearchModalV2<InputDisplay extends Display, OutputDisplay ex
   search_query_url_param_name_,
   previous_searches_,
   close_modal_,
+  set_focus_target_after_close_,
+  get_search_page_input_element_,
   alignmentSignals_,
   depict_api_,
   merchant_,
@@ -743,12 +745,14 @@ declare function RawSearchModalV2<InputDisplay extends Display, OutputDisplay ex
   search_query_url_param_name_: string;
   previous_searches_: Signal<string[]>;
   close_modal_: VoidFunction;
+  set_focus_target_after_close_: (get_target: (() => HTMLElement | undefined) | undefined) => void;
+  get_search_page_input_element_: () => HTMLInputElement | undefined;
   alignmentSignals_?: ModalAlignmentSignals;
   depict_api_: DepictAPI<InputDisplay, OutputDisplay>;
   clear_filters_: (user_triggered: boolean) => void;
   merchant_: Accessor<string>;
   market_: Accessor<string>;
-  submit_query_: (new_query?: string) => void;
+  submit_query_: (new_query?: string, before_navigate_?: VoidFunction) => Promise<boolean>;
   class_list_?: Accessor<Record<string, boolean>>;
   url_transformer_?: (url_object: URL) => unknown;
   disable_scrolling_?: boolean;
@@ -785,6 +789,8 @@ declare function RawClassicSearchModal({
   search_query_url_param_name_,
   previous_searches_,
   close_modal_,
+  set_focus_target_after_close_,
+  get_search_page_input_element_,
   depict_api_,
   merchant_,
   market_,
@@ -810,11 +816,13 @@ declare function RawClassicSearchModal({
   search_query_url_param_name_: string;
   previous_searches_: Signal<string[]>;
   close_modal_: VoidFunction;
+  set_focus_target_after_close_: (get_target: (() => HTMLElement | undefined) | undefined) => void;
+  get_search_page_input_element_: () => HTMLInputElement | undefined;
   depict_api_: DepictAPI<any>;
   clear_filters_: (user_triggered: boolean) => void;
   merchant_: Accessor<string>;
   market_: Accessor<string>;
-  submit_query_: (new_query?: string) => void;
+  submit_query_: (new_query?: string, before_navigate_?: VoidFunction) => Promise<boolean>;
   class_list_?: Accessor<Record<string, boolean>>;
   url_transformer_?: (url_object: URL) => unknown;
   disable_scrolling_?: boolean;
@@ -1038,6 +1046,7 @@ export function general_modal_abstraction<StaticOptions extends {
   close_modal_: VoidFunction;
   open_modal_: (extra_options_for_modal?: ExtraOptionsProvidedOnOpen, on_dispose?: VoidFunction) => void;
   register_closing_animation_: (animation: () => Promise<any>) => void;
+  set_focus_target_after_close_: (get_target: (() => HTMLElement | undefined) | undefined) => void;
 }) => Node_Array, modal_fn_opts: StaticOptions, parent?: HTMLElement | ShadowRoot): Promise<{
   open_modal_: (extra_options_for_modal?: any, on_dispose?: VoidFunction | undefined) => Promise<void | undefined>;
   close_modal_: () => void | undefined;