@depict-ai/ui 4.9.9 → 4.10.1

package/ES10/index.cjs

@@ -115,7 +115,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $335c02c1241a9ca8$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $335c02c1241a9ca8$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $c10e33c4681f8c9b$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.9.9";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.1";
 function $3e17e871e9d0911d$export$d9f36cf74e24d595(media_query) {
   const signal = $52FdA$solidjs.createSignal(false);
   $52FdA$solidjs.onCleanup($52FdA$depictaiutilishared.javascript_media_query(media_query, _ref => {
@@ -8052,7 +8052,7 @@ async function $8e8c89c02c16dc7b$export$5d2f6cd705125cd3() {
   $8e8c89c02c16dc7b$var$cachedHlsModule = hlsModule;
   return hlsModule;
 }
-var $c19709057a32b2e7$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<video loop class=d-standard-content>`);
+var $c19709057a32b2e7$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<video class=d-standard-content>`);
 function $c19709057a32b2e7$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -8126,7 +8126,14 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
               var _ref$ = $52FdA$depictaiutilisharedlatest.catchify(async element => {
                 const pageVisible = $e7a7d2fe8a8217d8$export$54299a3c81f5425();
                 const owner = $52FdA$solidjs.getOwner();
+                const [retryPlayToggle, setRetryPlayToggle] = $52FdA$solidjs.createSignal(false);
                 element.addEventListener("loadedmetadata", $52FdA$depictaiutilisharedlatest.catchify(() => setAspectRatio(element.videoWidth / element.videoHeight)));
+                // Work around https://github.com/ryansolid/dom-expressions/issues/384
+                element.controls = false;
+                element.muted = true;
+                element.autoplay = true;
+                element.playsInline = true;
+                element.loop = true;
                 // If hls is not supported, dynamically import hls.js as polyfill
                 if (mediaUrl_.includes(".m3u8") && !element.canPlayType("application/vnd.apple.mpegurl")) {
                   const hlsJs = await $8e8c89c02c16dc7b$export$5d2f6cd705125cd3().catch(e => $52FdA$depictaiutilisharedlatest.report([e, "Failed to load hls.js"], "error"));
@@ -8137,16 +8144,21 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
                 }
                 // need runWithOwner for createEffect, because we potentially awaited above
                 $52FdA$solidjs.runWithOwner(owner, () => $52FdA$solidjs.createEffect(() => {
-                  if (pageVisible()) element.play().catch(e => $52FdA$depictaiutilishared.dlog("Failed to play", e));else element.pause();
+                  retryPlayToggle();
+                  if (pageVisible()) element.play().catch(async e => {
+                    $52FdA$depictaiutilishared.dlog("Failed to play", e);
+                    // If we're not in the DOM yet, wait until we are and then try again
+                    if (!document.documentElement.contains(element)) {
+                      await (0, $52FdA$depictaiutilisharedlatest.observer).wait_for_element(element);
+                      setRetryPlayToggle(prev => !prev);
+                    }
+                  });else element.pause();
                 }));
               });
               typeof _ref$ === "function" && $52FdA$solidjsweb.use(_ref$, _el$);
               _el$.addEventListener("playing", () => setHasLoaded(true));
               $52FdA$solidjsweb.setAttribute(_el$, "src", mediaUrl_);
-              $52FdA$solidjsweb.setProperty(_el$, "controls", false);
-              $52FdA$solidjsweb.setProperty(_el$, "muted", true);
-              $52FdA$solidjsweb.setProperty(_el$, "autoplay", true);
-              $52FdA$solidjsweb.setProperty(_el$, "playsinline", true);
+              $52FdA$solidjsweb.setAttribute(_el$, "disablepictureinpicture", true);
               return _el$;
             }
           })];
@@ -10627,11 +10639,11 @@ function $210882b9ebe2b1d8$export$e872e2339fb04a7f(_ref) {
           searching_for_value_: searching_for_value_
         })), (() => {
           var _el$3 = $52FdA$solidjsweb.getNextElement($210882b9ebe2b1d8$var$_tmpl$3);
-          $52FdA$solidjsweb.insert(_el$3, $52FdA$solidjs.createMemo(() => {
+          $52FdA$solidjsweb.insert(_el$3, () => $52FdA$solidjs.createMemo(() => {
             if (input_obj().type === "content") return i18n_.content_();
             if (input_obj().listing_type === "brand") return i18n_.brand_();
             return i18n_.category_();
-          }));
+          })());
           return _el$3;
         })()];
       })());
@@ -11269,7 +11281,7 @@ function $29e5dbeb69da7a36$export$b94867ecbd698f21(_ref) {
       },
       get children() {
         var _el$4 = $52FdA$solidjsweb.getNextElement($29e5dbeb69da7a36$var$_tmpl$3);
-        $52FdA$solidjsweb.effect(() => (getBackButtonWidth(), _el$4.style.setProperty("width", getBackButtonWidth() + "px")));
+        $52FdA$solidjsweb.effect(_$p => (_$p = getBackButtonWidth() + "px", _el$4.style.setProperty("width", _$p)));
         return _el$4;
       }
     }), _el$13, _co$3);
@@ -11982,7 +11994,7 @@ function $f765bad01136eee1$export$c8d7e00464029b45(_ref) {
           });
         }
       }), _el$4, _co$);
-      $52FdA$solidjsweb.effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $52FdA$solidjsweb.effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -12100,7 +12112,7 @@ function $79a8fa74cb5cdfb9$export$d4994a86c6235f72(_ref) {
           });
         }
       }));
-      $52FdA$solidjsweb.effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $52FdA$solidjsweb.effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -12541,7 +12553,7 @@ function $43600b30502feeda$var$RawSearchModalV2(_ref) {
             }),
             ...instant_results_options_
           }), _el$4, _co$);
-          $52FdA$solidjsweb.effect(() => itemIndexes.instantResultsIndex_() != null ? _el$.style.setProperty("order", itemIndexes.instantResultsIndex_()) : _el$.style.removeProperty("order"));
+          $52FdA$solidjsweb.effect(_$p => (_$p = itemIndexes.instantResultsIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
           return _el$;
         }
       });
@@ -15131,9 +15143,9 @@ function $eab939d0b95b75ee$export$6d0c9c22f6652669(_ref) {
         });
       }
     })), _el$5, _co$2);
-    $52FdA$solidjsweb.effect(() => {
+    $52FdA$solidjsweb.effect(_$p => {
       var _content_results2;
-      return is_loading_() && placeholders_enabled() || (_content_results2 = content_results()) === null || _content_results2 === void 0 || _content_results2.length, _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || ((_content_results2 = content_results()) === null || _content_results2 === void 0 ? void 0 : _content_results2.length) > 0 ? "" : "none");
+      return _$p = is_loading_() && placeholders_enabled() || ((_content_results2 = content_results()) === null || _content_results2 === void 0 ? void 0 : _content_results2.length) > 0 ? "" : "none", _el$.style.setProperty("display", _$p);
     });
     return _el$;
   })();

package/ES10/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.9.9";
+export const version = "4.10.1";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -1541,7 +1541,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1622,5 +1622,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   filterModalParent_?: HTMLElement | ShadowRoot;
   showSliderArrow_?: boolean;
   hideCount0FilterOptions_?: boolean;
-}): import("@depict-ai/utilishared").Node_Array;
+}): import("@depict-ai/utilishared/latest").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";

package/ES10/index.js

@@ -1,7 +1,7 @@
 import { add_to_version_info as $8tj43$add_to_version_info, javascript_media_query as $8tj43$javascript_media_query, standard_price_format as $8tj43$standard_price_format, catchify as $8tj43$catchify1, observer as $8tj43$observer, slider_fractional_factory as $8tj43$slider_fractional_factory, report as $8tj43$report1, dlog as $8tj43$dlog, camelCasifyObject as $8tj43$camelCasifyObject, make_random_classname as $8tj43$make_random_classname, n_col_styling_with_dist as $8tj43$n_col_styling_with_dist, layout_get_visible_recs_without_partial_rows as $8tj43$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $8tj43$layout_get_total_rec_amount_for_row, layout_media_query_header as $8tj43$layout_media_query_header, dwarn as $8tj43$dwarn, slider_fading_factory as $8tj43$slider_fading_factory, Amazing_Slider as $8tj43$Amazing_Slider, slider_snap_css as $8tj43$slider_snap_css, useExpandingContainer as $8tj43$useExpandingContainer, hex_to_rgb as $8tj43$hex_to_rgb, relative_luminance_from_rgb as $8tj43$relative_luminance_from_rgb, instant_exec_on_suspect_history_change as $8tj43$instant_exec_on_suspect_history_change, base64_encode_unicode as $8tj43$base64_encode_unicode, base64_decode_unicode as $8tj43$base64_decode_unicode, queueMacroTask as $8tj43$queueMacroTask, is_debug as $8tj43$is_debug, findMostFrequentItem as $8tj43$findMostFrequentItem, is_available_in as $8tj43$is_available_in, fetch_retry as $8tj43$fetch_retry, base_url as $8tj43$base_url, deparallelize_no_drop as $8tj43$deparallelize_no_drop, ContainedImage as $8tj43$ContainedImage, buildThresholdList as $8tj43$buildThresholdList, make_asyncIterable_exiter as $8tj43$make_asyncIterable_exiter, href_change_ipns as $8tj43$href_change_ipns, use_href_accessor as $8tj43$use_href_accessor1, get_session_id as $8tj43$get_session_id, add_version_query_params as $8tj43$add_version_query_params, snakeCasifyObject as $8tj43$snakeCasifyObject, make_url_with_query_params as $8tj43$make_url_with_query_params, sort_obj as $8tj43$sort_obj, insert_surfaces as $8tj43$insert_surfaces } from "@depict-ai/utilishared/ES10";
 import { template as $8tj43$template, createComponent as $8tj43$createComponent, getNextElement as $8tj43$getNextElement, getNextMarker as $8tj43$getNextMarker, insert as $8tj43$insert, isServer as $8tj43$isServer, use as $8tj43$use, effect as $8tj43$effect, setAttribute as $8tj43$setAttribute, memo as $8tj43$memo, mergeProps as $8tj43$mergeProps1, addEventListener as $8tj43$addEventListener, runHydrationEvents as $8tj43$runHydrationEvents, delegateEvents as $8tj43$delegateEvents, spread as $8tj43$spread, classList as $8tj43$classList, className as $8tj43$className, style as $8tj43$style, Dynamic as $8tj43$Dynamic, setProperty as $8tj43$setProperty } from "solid-js/web";
 import { createContext as $8tj43$createContext, createSignal as $8tj43$createSignal, getOwner as $8tj43$getOwner, createResource as $8tj43$createResource, untrack as $8tj43$untrack, createRoot as $8tj43$createRoot, createEffect as $8tj43$createEffect, runWithOwner as $8tj43$runWithOwner, onCleanup as $8tj43$onCleanup, createMemo as $8tj43$createMemo, Show as $8tj43$Show, createComputed as $8tj43$createComputed, createRenderEffect as $8tj43$createRenderEffect, mergeProps as $8tj43$mergeProps, useContext as $8tj43$useContext, createReaction as $8tj43$createReaction, on as $8tj43$on, Suspense as $8tj43$Suspense, ErrorBoundary as $8tj43$ErrorBoundary, Index as $8tj43$Index, For as $8tj43$For, createUniqueId as $8tj43$createUniqueId, mapArray as $8tj43$mapArray, batch as $8tj43$batch, Switch as $8tj43$Switch, Match as $8tj43$Match, splitProps as $8tj43$splitProps, createComponent as $8tj43$createComponent1, createSelector as $8tj43$createSelector, children as $8tj43$children } from "solid-js";
-import { catchify as $8tj43$catchify, report as $8tj43$report, use_href_accessor as $8tj43$use_href_accessor, dlog as $8tj43$dlog1, ListenableSet as $8tj43$ListenableSet, queueMacroTask as $8tj43$queueMacroTask1 } from "@depict-ai/utilishared/ES10";
+import { catchify as $8tj43$catchify, report as $8tj43$report, use_href_accessor as $8tj43$use_href_accessor, observer as $8tj43$observer1, dlog as $8tj43$dlog1, ListenableSet as $8tj43$ListenableSet, queueMacroTask as $8tj43$queueMacroTask1 } from "@depict-ai/utilishared/ES10";
 import { createStore as $8tj43$createStore, reconcile as $8tj43$reconcile } from "solid-js/store";
 import $8tj43$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/defineProperty";
 import $8tj43$babelruntimehelpersclassPrivateFieldSet from "@babel/runtime/helpers/classPrivateFieldSet";
@@ -10,7 +10,7 @@ import $8tj43$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpe
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "4.9.9";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.1";
 function $00a5b94f0c11efbb$export$d9f36cf74e24d595(media_query) {
   const signal = $8tj43$createSignal(false);
   $8tj43$onCleanup($8tj43$javascript_media_query(media_query, _ref => {
@@ -7947,7 +7947,7 @@ async function $e92c154db502596d$export$5d2f6cd705125cd3() {
   $e92c154db502596d$var$cachedHlsModule = hlsModule;
   return hlsModule;
 }
-var $3b772ef9a35560fe$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<video loop class=d-standard-content>`);
+var $3b772ef9a35560fe$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<video class=d-standard-content>`);
 function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -8021,7 +8021,14 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
               var _ref$ = $8tj43$catchify(async element => {
                 const pageVisible = $a35e6f680c5bbc60$export$54299a3c81f5425();
                 const owner = $8tj43$getOwner();
+                const [retryPlayToggle, setRetryPlayToggle] = $8tj43$createSignal(false);
                 element.addEventListener("loadedmetadata", $8tj43$catchify(() => setAspectRatio(element.videoWidth / element.videoHeight)));
+                // Work around https://github.com/ryansolid/dom-expressions/issues/384
+                element.controls = false;
+                element.muted = true;
+                element.autoplay = true;
+                element.playsInline = true;
+                element.loop = true;
                 // If hls is not supported, dynamically import hls.js as polyfill
                 if (mediaUrl_.includes(".m3u8") && !element.canPlayType("application/vnd.apple.mpegurl")) {
                   const hlsJs = await $e92c154db502596d$export$5d2f6cd705125cd3().catch(e => $8tj43$report([e, "Failed to load hls.js"], "error"));
@@ -8032,16 +8039,21 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
                 }
                 // need runWithOwner for createEffect, because we potentially awaited above
                 $8tj43$runWithOwner(owner, () => $8tj43$createEffect(() => {
-                  if (pageVisible()) element.play().catch(e => $8tj43$dlog("Failed to play", e));else element.pause();
+                  retryPlayToggle();
+                  if (pageVisible()) element.play().catch(async e => {
+                    $8tj43$dlog("Failed to play", e);
+                    // If we're not in the DOM yet, wait until we are and then try again
+                    if (!document.documentElement.contains(element)) {
+                      await (0, $8tj43$observer1).wait_for_element(element);
+                      setRetryPlayToggle(prev => !prev);
+                    }
+                  });else element.pause();
                 }));
               });
               typeof _ref$ === "function" && $8tj43$use(_ref$, _el$);
               _el$.addEventListener("playing", () => setHasLoaded(true));
               $8tj43$setAttribute(_el$, "src", mediaUrl_);
-              $8tj43$setProperty(_el$, "controls", false);
-              $8tj43$setProperty(_el$, "muted", true);
-              $8tj43$setProperty(_el$, "autoplay", true);
-              $8tj43$setProperty(_el$, "playsinline", true);
+              $8tj43$setAttribute(_el$, "disablepictureinpicture", true);
               return _el$;
             }
           })];
@@ -10522,11 +10534,11 @@ function $b055f9e9aeceeb48$export$e872e2339fb04a7f(_ref) {
           searching_for_value_: searching_for_value_
         })), (() => {
           var _el$3 = $8tj43$getNextElement($b055f9e9aeceeb48$var$_tmpl$3);
-          $8tj43$insert(_el$3, $8tj43$createMemo(() => {
+          $8tj43$insert(_el$3, () => $8tj43$createMemo(() => {
             if (input_obj().type === "content") return i18n_.content_();
             if (input_obj().listing_type === "brand") return i18n_.brand_();
             return i18n_.category_();
-          }));
+          })());
           return _el$3;
         })()];
       })());
@@ -11164,7 +11176,7 @@ function $584c06c09cf4609d$export$b94867ecbd698f21(_ref) {
       },
       get children() {
         var _el$4 = $8tj43$getNextElement($584c06c09cf4609d$var$_tmpl$3);
-        $8tj43$effect(() => (getBackButtonWidth(), _el$4.style.setProperty("width", getBackButtonWidth() + "px")));
+        $8tj43$effect(_$p => (_$p = getBackButtonWidth() + "px", _el$4.style.setProperty("width", _$p)));
         return _el$4;
       }
     }), _el$13, _co$3);
@@ -11877,7 +11889,7 @@ function $ab401afaded322ab$export$c8d7e00464029b45(_ref) {
           });
         }
       }), _el$4, _co$);
-      $8tj43$effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $8tj43$effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -11995,7 +12007,7 @@ function $5175a47d13b7c228$export$d4994a86c6235f72(_ref) {
           });
         }
       }));
-      $8tj43$effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $8tj43$effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -12436,7 +12448,7 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
             }),
             ...instant_results_options_
           }), _el$4, _co$);
-          $8tj43$effect(() => itemIndexes.instantResultsIndex_() != null ? _el$.style.setProperty("order", itemIndexes.instantResultsIndex_()) : _el$.style.removeProperty("order"));
+          $8tj43$effect(_$p => (_$p = itemIndexes.instantResultsIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
           return _el$;
         }
       });
@@ -15026,9 +15038,9 @@ function $d53ebed6f63304e4$export$6d0c9c22f6652669(_ref) {
         });
       }
     })), _el$5, _co$2);
-    $8tj43$effect(() => {
+    $8tj43$effect(_$p => {
       var _content_results2;
-      return is_loading_() && placeholders_enabled() || (_content_results2 = content_results()) === null || _content_results2 === void 0 || _content_results2.length, _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || ((_content_results2 = content_results()) === null || _content_results2 === void 0 ? void 0 : _content_results2.length) > 0 ? "" : "none");
+      return _$p = is_loading_() && placeholders_enabled() || ((_content_results2 = content_results()) === null || _content_results2 === void 0 ? void 0 : _content_results2.length) > 0 ? "" : "none", _el$.style.setProperty("display", _$p);
     });
     return _el$;
   })();

package/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.9.9";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.1";
 function $b54e6192d0caa293$export$d9f36cf74e24d595(media_query) {
   const signal = $gVhhF$solidjs.createSignal(false);
   $gVhhF$solidjs.onCleanup($gVhhF$depictaiutilishared.javascript_media_query(media_query, ({
@@ -7621,7 +7621,7 @@ async function $20ff40266d725403$export$5d2f6cd705125cd3() {
   $20ff40266d725403$var$cachedHlsModule = hlsModule;
   return hlsModule;
 }
-var $32c662f618f5d80d$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<video loop class=d-standard-content>`);
+var $32c662f618f5d80d$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<video class=d-standard-content>`);
 function $32c662f618f5d80d$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -7688,7 +7688,14 @@ function $32c662f618f5d80d$export$780a853d15174484({
               var _ref$ = $gVhhF$depictaiutilisharedlatest.catchify(async element => {
                 const pageVisible = $55cbacb79d3e0cea$export$54299a3c81f5425();
                 const owner = $gVhhF$solidjs.getOwner();
+                const [retryPlayToggle, setRetryPlayToggle] = $gVhhF$solidjs.createSignal(false);
                 element.addEventListener("loadedmetadata", $gVhhF$depictaiutilisharedlatest.catchify(() => setAspectRatio(element.videoWidth / element.videoHeight)));
+                // Work around https://github.com/ryansolid/dom-expressions/issues/384
+                element.controls = false;
+                element.muted = true;
+                element.autoplay = true;
+                element.playsInline = true;
+                element.loop = true;
                 // If hls is not supported, dynamically import hls.js as polyfill
                 if (mediaUrl_.includes(".m3u8") && !element.canPlayType("application/vnd.apple.mpegurl")) {
                   const hlsJs = await $20ff40266d725403$export$5d2f6cd705125cd3().catch(e => $gVhhF$depictaiutilisharedlatest.report([e, "Failed to load hls.js"], "error"));
@@ -7699,16 +7706,21 @@ function $32c662f618f5d80d$export$780a853d15174484({
                 }
                 // need runWithOwner for createEffect, because we potentially awaited above
                 $gVhhF$solidjs.runWithOwner(owner, () => $gVhhF$solidjs.createEffect(() => {
-                  if (pageVisible()) element.play().catch(e => $gVhhF$depictaiutilishared.dlog("Failed to play", e));else element.pause();
+                  retryPlayToggle();
+                  if (pageVisible()) element.play().catch(async e => {
+                    $gVhhF$depictaiutilishared.dlog("Failed to play", e);
+                    // If we're not in the DOM yet, wait until we are and then try again
+                    if (!document.documentElement.contains(element)) {
+                      await (0, $gVhhF$depictaiutilisharedlatest.observer).wait_for_element(element);
+                      setRetryPlayToggle(prev => !prev);
+                    }
+                  });else element.pause();
                 }));
               });
               typeof _ref$ === "function" && $gVhhF$solidjsweb.use(_ref$, _el$);
               _el$.addEventListener("playing", () => setHasLoaded(true));
               $gVhhF$solidjsweb.setAttribute(_el$, "src", mediaUrl_);
-              $gVhhF$solidjsweb.setProperty(_el$, "controls", false);
-              $gVhhF$solidjsweb.setProperty(_el$, "muted", true);
-              $gVhhF$solidjsweb.setProperty(_el$, "autoplay", true);
-              $gVhhF$solidjsweb.setProperty(_el$, "playsinline", true);
+              $gVhhF$solidjsweb.setAttribute(_el$, "disablepictureinpicture", true);
               return _el$;
             }
           })];
@@ -10046,11 +10058,11 @@ function $1dbed937c406bdf0$export$e872e2339fb04a7f({
           searching_for_value_: searching_for_value_
         })), (() => {
           var _el$3 = $gVhhF$solidjsweb.getNextElement($1dbed937c406bdf0$var$_tmpl$3);
-          $gVhhF$solidjsweb.insert(_el$3, $gVhhF$solidjs.createMemo(() => {
+          $gVhhF$solidjsweb.insert(_el$3, () => $gVhhF$solidjs.createMemo(() => {
             if (input_obj().type === "content") return i18n_.content_();
             if (input_obj().listing_type === "brand") return i18n_.brand_();
             return i18n_.category_();
-          }));
+          })());
           return _el$3;
         })()];
       })());
@@ -10657,7 +10669,7 @@ function $66b8b9a9613c141d$export$b94867ecbd698f21({
       },
       get children() {
         var _el$4 = $gVhhF$solidjsweb.getNextElement($66b8b9a9613c141d$var$_tmpl$3);
-        $gVhhF$solidjsweb.effect(() => (getBackButtonWidth(), _el$4.style.setProperty("width", getBackButtonWidth() + "px")));
+        $gVhhF$solidjsweb.effect(_$p => (_$p = getBackButtonWidth() + "px", _el$4.style.setProperty("width", _$p)));
         return _el$4;
       }
     }), _el$13, _co$3);
@@ -11339,7 +11351,7 @@ function $83e616b38be339e4$export$c8d7e00464029b45({
           });
         }
       }), _el$4, _co$);
-      $gVhhF$solidjsweb.effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $gVhhF$solidjsweb.effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -11455,7 +11467,7 @@ function $a13dbcf80d79229c$export$d4994a86c6235f72({
           });
         }
       }));
-      $gVhhF$solidjsweb.effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $gVhhF$solidjsweb.effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -11884,7 +11896,7 @@ function $11597ae03e703a47$var$RawSearchModalV2({
             }),
             ...instant_results_options_
           }), _el$4, _co$);
-          $gVhhF$solidjsweb.effect(() => itemIndexes.instantResultsIndex_() != null ? _el$.style.setProperty("order", itemIndexes.instantResultsIndex_()) : _el$.style.removeProperty("order"));
+          $gVhhF$solidjsweb.effect(_$p => (_$p = itemIndexes.instantResultsIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
           return _el$;
         }
       });
@@ -14264,7 +14276,7 @@ function $3716b8caf7f959e2$export$6d0c9c22f6652669({
         });
       }
     })), _el$5, _co$2);
-    $gVhhF$solidjsweb.effect(() => (is_loading_() && placeholders_enabled() || content_results()?.length, _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none")));
+    $gVhhF$solidjsweb.effect(_$p => (_$p = is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none", _el$.style.setProperty("display", _$p)));
     return _el$;
   })();
 }

package/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.9.9";
+export const version = "4.10.1";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -1541,7 +1541,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1622,5 +1622,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   filterModalParent_?: HTMLElement | ShadowRoot;
   showSliderArrow_?: boolean;
   hideCount0FilterOptions_?: boolean;
-}): import("@depict-ai/utilishared").Node_Array;
+}): import("@depict-ai/utilishared/latest").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";

package/latest/index.js

@@ -1,13 +1,13 @@
 import { add_to_version_info as $9HbP8$add_to_version_info, javascript_media_query as $9HbP8$javascript_media_query, standard_price_format as $9HbP8$standard_price_format, catchify as $9HbP8$catchify1, observer as $9HbP8$observer, slider_fractional_factory as $9HbP8$slider_fractional_factory, report as $9HbP8$report1, dlog as $9HbP8$dlog, camelCasifyObject as $9HbP8$camelCasifyObject, make_random_classname as $9HbP8$make_random_classname, n_col_styling_with_dist as $9HbP8$n_col_styling_with_dist, layout_get_visible_recs_without_partial_rows as $9HbP8$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $9HbP8$layout_get_total_rec_amount_for_row, layout_media_query_header as $9HbP8$layout_media_query_header, dwarn as $9HbP8$dwarn, slider_fading_factory as $9HbP8$slider_fading_factory, Amazing_Slider as $9HbP8$Amazing_Slider, slider_snap_css as $9HbP8$slider_snap_css, useExpandingContainer as $9HbP8$useExpandingContainer, hex_to_rgb as $9HbP8$hex_to_rgb, relative_luminance_from_rgb as $9HbP8$relative_luminance_from_rgb, instant_exec_on_suspect_history_change as $9HbP8$instant_exec_on_suspect_history_change, base64_encode_unicode as $9HbP8$base64_encode_unicode, base64_decode_unicode as $9HbP8$base64_decode_unicode, queueMacroTask as $9HbP8$queueMacroTask, is_debug as $9HbP8$is_debug, findMostFrequentItem as $9HbP8$findMostFrequentItem, is_available_in as $9HbP8$is_available_in, fetch_retry as $9HbP8$fetch_retry, base_url as $9HbP8$base_url, deparallelize_no_drop as $9HbP8$deparallelize_no_drop, ContainedImage as $9HbP8$ContainedImage, buildThresholdList as $9HbP8$buildThresholdList, make_asyncIterable_exiter as $9HbP8$make_asyncIterable_exiter, href_change_ipns as $9HbP8$href_change_ipns, use_href_accessor as $9HbP8$use_href_accessor1, get_session_id as $9HbP8$get_session_id, add_version_query_params as $9HbP8$add_version_query_params, snakeCasifyObject as $9HbP8$snakeCasifyObject, sort_obj as $9HbP8$sort_obj, make_url_with_query_params as $9HbP8$make_url_with_query_params, insert_surfaces as $9HbP8$insert_surfaces } from "@depict-ai/utilishared/latest";
 import { template as $9HbP8$template, createComponent as $9HbP8$createComponent, getNextElement as $9HbP8$getNextElement, getNextMarker as $9HbP8$getNextMarker, insert as $9HbP8$insert, isServer as $9HbP8$isServer, use as $9HbP8$use, effect as $9HbP8$effect, setAttribute as $9HbP8$setAttribute, memo as $9HbP8$memo, mergeProps as $9HbP8$mergeProps1, addEventListener as $9HbP8$addEventListener, runHydrationEvents as $9HbP8$runHydrationEvents, delegateEvents as $9HbP8$delegateEvents, spread as $9HbP8$spread, classList as $9HbP8$classList, className as $9HbP8$className, style as $9HbP8$style, Dynamic as $9HbP8$Dynamic, setProperty as $9HbP8$setProperty } from "solid-js/web";
 import { createContext as $9HbP8$createContext, createSignal as $9HbP8$createSignal, getOwner as $9HbP8$getOwner, createResource as $9HbP8$createResource, untrack as $9HbP8$untrack, createRoot as $9HbP8$createRoot, createEffect as $9HbP8$createEffect, runWithOwner as $9HbP8$runWithOwner, onCleanup as $9HbP8$onCleanup, createMemo as $9HbP8$createMemo, Show as $9HbP8$Show, createComputed as $9HbP8$createComputed, createRenderEffect as $9HbP8$createRenderEffect, mergeProps as $9HbP8$mergeProps, useContext as $9HbP8$useContext, createReaction as $9HbP8$createReaction, on as $9HbP8$on, Suspense as $9HbP8$Suspense, ErrorBoundary as $9HbP8$ErrorBoundary, Index as $9HbP8$Index, For as $9HbP8$For, createUniqueId as $9HbP8$createUniqueId, mapArray as $9HbP8$mapArray, batch as $9HbP8$batch, Switch as $9HbP8$Switch, Match as $9HbP8$Match, splitProps as $9HbP8$splitProps, createComponent as $9HbP8$createComponent1, createSelector as $9HbP8$createSelector, children as $9HbP8$children } from "solid-js";
-import { catchify as $9HbP8$catchify, report as $9HbP8$report, use_href_accessor as $9HbP8$use_href_accessor, dlog as $9HbP8$dlog1, ListenableSet as $9HbP8$ListenableSet, queueMacroTask as $9HbP8$queueMacroTask1 } from "@depict-ai/utilishared/latest";
+import { catchify as $9HbP8$catchify, report as $9HbP8$report, use_href_accessor as $9HbP8$use_href_accessor, observer as $9HbP8$observer1, dlog as $9HbP8$dlog1, ListenableSet as $9HbP8$ListenableSet, queueMacroTask as $9HbP8$queueMacroTask1 } from "@depict-ai/utilishared/latest";
 import { createStore as $9HbP8$createStore, reconcile as $9HbP8$reconcile } from "solid-js/store";
 
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "latest");
-const $ec291e0010116877$export$83d89fbfd8236492 = "4.9.9";
+const $ec291e0010116877$export$83d89fbfd8236492 = "4.10.1";
 function $dc9262ef6f786812$export$d9f36cf74e24d595(media_query) {
   const signal = $9HbP8$createSignal(false);
   $9HbP8$onCleanup($9HbP8$javascript_media_query(media_query, ({
@@ -7519,7 +7519,7 @@ async function $e422ea9eccb7892b$export$5d2f6cd705125cd3() {
   $e422ea9eccb7892b$var$cachedHlsModule = hlsModule;
   return hlsModule;
 }
-var $f916989c4b1be9f7$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<video loop class=d-standard-content>`);
+var $f916989c4b1be9f7$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<video class=d-standard-content>`);
 function $f916989c4b1be9f7$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -7586,7 +7586,14 @@ function $f916989c4b1be9f7$export$780a853d15174484({
               var _ref$ = $9HbP8$catchify(async element => {
                 const pageVisible = $5e3d278ef4c80cd7$export$54299a3c81f5425();
                 const owner = $9HbP8$getOwner();
+                const [retryPlayToggle, setRetryPlayToggle] = $9HbP8$createSignal(false);
                 element.addEventListener("loadedmetadata", $9HbP8$catchify(() => setAspectRatio(element.videoWidth / element.videoHeight)));
+                // Work around https://github.com/ryansolid/dom-expressions/issues/384
+                element.controls = false;
+                element.muted = true;
+                element.autoplay = true;
+                element.playsInline = true;
+                element.loop = true;
                 // If hls is not supported, dynamically import hls.js as polyfill
                 if (mediaUrl_.includes(".m3u8") && !element.canPlayType("application/vnd.apple.mpegurl")) {
                   const hlsJs = await $e422ea9eccb7892b$export$5d2f6cd705125cd3().catch(e => $9HbP8$report([e, "Failed to load hls.js"], "error"));
@@ -7597,16 +7604,21 @@ function $f916989c4b1be9f7$export$780a853d15174484({
                 }
                 // need runWithOwner for createEffect, because we potentially awaited above
                 $9HbP8$runWithOwner(owner, () => $9HbP8$createEffect(() => {
-                  if (pageVisible()) element.play().catch(e => $9HbP8$dlog("Failed to play", e));else element.pause();
+                  retryPlayToggle();
+                  if (pageVisible()) element.play().catch(async e => {
+                    $9HbP8$dlog("Failed to play", e);
+                    // If we're not in the DOM yet, wait until we are and then try again
+                    if (!document.documentElement.contains(element)) {
+                      await (0, $9HbP8$observer1).wait_for_element(element);
+                      setRetryPlayToggle(prev => !prev);
+                    }
+                  });else element.pause();
                 }));
               });
               typeof _ref$ === "function" && $9HbP8$use(_ref$, _el$);
               _el$.addEventListener("playing", () => setHasLoaded(true));
               $9HbP8$setAttribute(_el$, "src", mediaUrl_);
-              $9HbP8$setProperty(_el$, "controls", false);
-              $9HbP8$setProperty(_el$, "muted", true);
-              $9HbP8$setProperty(_el$, "autoplay", true);
-              $9HbP8$setProperty(_el$, "playsinline", true);
+              $9HbP8$setAttribute(_el$, "disablepictureinpicture", true);
               return _el$;
             }
           })];
@@ -9944,11 +9956,11 @@ function $ab4b0679fa8bd1dc$export$e872e2339fb04a7f({
           searching_for_value_: searching_for_value_
         })), (() => {
           var _el$3 = $9HbP8$getNextElement($ab4b0679fa8bd1dc$var$_tmpl$3);
-          $9HbP8$insert(_el$3, $9HbP8$createMemo(() => {
+          $9HbP8$insert(_el$3, () => $9HbP8$createMemo(() => {
             if (input_obj().type === "content") return i18n_.content_();
             if (input_obj().listing_type === "brand") return i18n_.brand_();
             return i18n_.category_();
-          }));
+          })());
           return _el$3;
         })()];
       })());
@@ -10555,7 +10567,7 @@ function $5285d2814d0fac0c$export$b94867ecbd698f21({
       },
       get children() {
         var _el$4 = $9HbP8$getNextElement($5285d2814d0fac0c$var$_tmpl$3);
-        $9HbP8$effect(() => (getBackButtonWidth(), _el$4.style.setProperty("width", getBackButtonWidth() + "px")));
+        $9HbP8$effect(_$p => (_$p = getBackButtonWidth() + "px", _el$4.style.setProperty("width", _$p)));
         return _el$4;
       }
     }), _el$13, _co$3);
@@ -11237,7 +11249,7 @@ function $44f30a4222ce604b$export$c8d7e00464029b45({
           });
         }
       }), _el$4, _co$);
-      $9HbP8$effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $9HbP8$effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -11353,7 +11365,7 @@ function $903297121898e5ff$export$d4994a86c6235f72({
           });
         }
       }));
-      $9HbP8$effect(() => itemIndex_() != null ? _el$.style.setProperty("order", itemIndex_()) : _el$.style.removeProperty("order"));
+      $9HbP8$effect(_$p => (_$p = itemIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
       return _el$;
     }
   });
@@ -11782,7 +11794,7 @@ function $500a16dd18ee5a71$var$RawSearchModalV2({
             }),
             ...instant_results_options_
           }), _el$4, _co$);
-          $9HbP8$effect(() => itemIndexes.instantResultsIndex_() != null ? _el$.style.setProperty("order", itemIndexes.instantResultsIndex_()) : _el$.style.removeProperty("order"));
+          $9HbP8$effect(_$p => (_$p = itemIndexes.instantResultsIndex_()) != null ? _el$.style.setProperty("order", _$p) : _el$.style.removeProperty("order"));
           return _el$;
         }
       });
@@ -14162,7 +14174,7 @@ function $49de9d31aeea1b5e$export$6d0c9c22f6652669({
         });
       }
     })), _el$5, _co$2);
-    $9HbP8$effect(() => (is_loading_() && placeholders_enabled() || content_results()?.length, _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none")));
+    $9HbP8$effect(_$p => (_$p = is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none", _el$.style.setProperty("display", _$p)));
     return _el$;
   })();
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "4.9.9",
+  "version": "4.10.1",
   "description": "Base package containing the actual UI of Depict UI along with translations, with a not-simplified API. We recommend using @depict-ai/js-ui or @depict-ai/react-ui instead.",
   "packageManager": "yarn@3.2.2",
   "sass": "styles.scss",
@@ -226,7 +226,7 @@
     "@parcel/resolver-default": "^2.10.3",
     "@types/jest": "^29.2.4",
     "@types/node": "^18.11.11",
-    "babel-preset-solid": "^1.8.16",
+    "babel-preset-solid": "^1.9.3",
     "jest": "^29.3.1",
     "lodash": "^4.17.21",
     "parcel": "^2.10.3",
@@ -236,10 +236,10 @@
     "@babel/plugin-transform-typescript": "^7.22.9",
     "@babel/runtime": "latest",
     "@babel/runtime-corejs3": "^7.22.6",
-    "@depict-ai/plp-styling": "^4.5.1",
-    "@depict-ai/types": "^5.5.1",
-    "@depict-ai/utilishared": "^2.5.1",
-    "solid-js": "^1.8.16"
+    "@depict-ai/plp-styling": "^4.6.0",
+    "@depict-ai/types": "^5.6.0",
+    "@depict-ai/utilishared": "^2.6.0",
+    "solid-js": "^1.9.3"
   },
   "type": "module",
   "types": "ES10/index.d.ts",

package/server/ES10/index.cjs

@@ -115,7 +115,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $335c02c1241a9ca8$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $335c02c1241a9ca8$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $c10e33c4681f8c9b$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.9.9";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.1";
 function $3e17e871e9d0911d$export$d9f36cf74e24d595(media_query) {
   const signal = $3hooq$solidjs.createSignal(false);
   $3hooq$solidjs.onCleanup($3hooq$depictaiutilishared.javascript_media_query(media_query, _ref => {
@@ -6611,7 +6611,7 @@ function $f3db423dc84bc35d$export$140423fa4bfb6d63(props) {
     customUrls: $f3db423dc84bc35d$var$customUrls
   }));
 }
-var $c19709057a32b2e7$var$_tmpl$ = ["<video", ' muted="" autoplay="" playsinline="" loop class="d-standard-content"></video>'];
+var $c19709057a32b2e7$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'];
 function $c19709057a32b2e7$export$780a853d15174484(_ref) {
   let {
     link_: link_,

package/server/ES10/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.9.9";
+export const version = "4.10.1";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -1541,7 +1541,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1622,5 +1622,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   filterModalParent_?: HTMLElement | ShadowRoot;
   showSliderArrow_?: boolean;
   hideCount0FilterOptions_?: boolean;
-}): import("@depict-ai/utilishared").Node_Array;
+}): import("@depict-ai/utilishared/latest").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";

package/server/ES10/index.js

@@ -10,7 +10,7 @@ import $b8hua$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpe
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "4.9.9";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.1";
 function $00a5b94f0c11efbb$export$d9f36cf74e24d595(media_query) {
   const signal = $b8hua$createSignal(false);
   $b8hua$onCleanup($b8hua$javascript_media_query(media_query, _ref => {
@@ -6506,7 +6506,7 @@ function $98688279b9059f50$export$140423fa4bfb6d63(props) {
     customUrls: $98688279b9059f50$var$customUrls
   }));
 }
-var $3b772ef9a35560fe$var$_tmpl$ = ["<video", ' muted="" autoplay="" playsinline="" loop class="d-standard-content"></video>'];
+var $3b772ef9a35560fe$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'];
 function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
   let {
     link_: link_,

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.9.9";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.1";
 function $b54e6192d0caa293$export$d9f36cf74e24d595(media_query) {
   const signal = $5vyXB$solidjs.createSignal(false);
   $5vyXB$solidjs.onCleanup($5vyXB$depictaiutilishared.javascript_media_query(media_query, ({
@@ -6233,7 +6233,7 @@ function $d212a67662c5cf38$export$140423fa4bfb6d63(props) {
     customUrls: $d212a67662c5cf38$var$customUrls
   }));
 }
-var $32c662f618f5d80d$var$_tmpl$ = ["<video", ' muted="" autoplay="" playsinline="" loop class="d-standard-content"></video>'];
+var $32c662f618f5d80d$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'];
 function $32c662f618f5d80d$export$780a853d15174484({
   link_: link_,
   type_: type_,

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.9.9";
+export const version = "4.10.1";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -1541,7 +1541,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1622,5 +1622,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   filterModalParent_?: HTMLElement | ShadowRoot;
   showSliderArrow_?: boolean;
   hideCount0FilterOptions_?: boolean;
-}): import("@depict-ai/utilishared").Node_Array;
+}): import("@depict-ai/utilishared/latest").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";

package/server/latest/index.js

@@ -7,7 +7,7 @@ import { createStore as $i7OB2$createStore, reconcile as $i7OB2$reconcile } from
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("ui", "latest");
-const $ec291e0010116877$export$83d89fbfd8236492 = "4.9.9";
+const $ec291e0010116877$export$83d89fbfd8236492 = "4.10.1";
 function $dc9262ef6f786812$export$d9f36cf74e24d595(media_query) {
   const signal = $i7OB2$createSignal(false);
   $i7OB2$onCleanup($i7OB2$javascript_media_query(media_query, ({
@@ -6131,7 +6131,7 @@ function $70bb27cc6be01fc7$export$140423fa4bfb6d63(props) {
     customUrls: $70bb27cc6be01fc7$var$customUrls
   }));
 }
-var $f916989c4b1be9f7$var$_tmpl$ = ["<video", ' muted="" autoplay="" playsinline="" loop class="d-standard-content"></video>'];
+var $f916989c4b1be9f7$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'];
 function $f916989c4b1be9f7$export$780a853d15174484({
   link_: link_,
   type_: type_,