@depict-ai/ui 1.4.23 → 1.4.24

package/ES10/index.cjs

@@ -1,6 +1,7 @@
 var $52FdA$depictaiutilishared = require("@depict-ai/utilishared/ES10");
 var $52FdA$solidjsweb = require("solid-js/web");
 var $52FdA$solidjs = require("solid-js");
+var $52FdA$depictaiutilisharedlatest = require("@depict-ai/utilishared/latest/ES10");
 var $52FdA$babelruntimehelpersclassPrivateFieldSet = require("@babel/runtime/helpers/classPrivateFieldSet");
 var $52FdA$babelruntimehelpersclassPrivateFieldGet = require("@babel/runtime/helpers/classPrivateFieldGet");
 var $52FdA$babelruntimehelpersdefineProperty = require("@babel/runtime/helpers/defineProperty");
@@ -66,7 +67,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $33eed84f447aa0c0$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $33eed84f447aa0c0$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $aa1938dec50d6c12$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "1.4.23";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "1.4.24";
 const $5401a6698b0c0658$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -521,7 +522,8 @@ function $ad8ec7729fffeb9c$export$6649caad96ef8870(_ref) {
     children: children,
     slider_ref_: slider_ref_,
     faded_opacity_ = 0.7,
-    mutation_plugins_ = []
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_
   } = _ref;
   const slider = new (0, $52FdA$depictaiutilishared.Amazing_Slider)({
     button_contents: {
@@ -537,10 +539,10 @@ function $ad8ec7729fffeb9c$export$6649caad96ef8870(_ref) {
       })()]
     },
     constructor_plugins: [$52FdA$depictaiutilishared.slider_snap_css().constructor_plugin],
-    mutation_plugins: [$52FdA$depictaiutilishared.slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$52FdA$depictaiutilishared.slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $52FdA$solidjsweb.insert(slider.insert_here, children);
   $52FdA$solidjs.onCleanup(() => slider.observer.disconnect());
@@ -561,14 +563,19 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
   });
   const num_placeholders_ = () => 20;
   const slider = $52FdA$solidjsweb.createComponent((0, $ad8ec7729fffeb9c$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $6c2c739b113a8ddf$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $6c2c739b113a8ddf$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $52FdA$solidjsweb.createComponent(Layout, $52FdA$solidjsweb.mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($8edd3cf30d1fd8b4$export$a2cc176055f8f08());
+      $52FdA$depictaiutilisharedlatest.slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($8edd3cf30d1fd8b4$export$a2cc176055f8f08());
     },
     get children() {
       return $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Suspense), {
@@ -600,7 +607,7 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
     children: slider
   });
 }
-const $2badc30d7c6610e1$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class="depict plp"></div>`, 2);
+const $2badc30d7c6610e1$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class="depict recommendations"></div>`, 2);
 function $2badc30d7c6610e1$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $52FdA$solidjs.createMemo(() => {
     const {
@@ -694,7 +701,7 @@ function $2c920813c92d6987$export$7da560f849543dff(_ref) {
   });
 }
 const $41227f10ad680afd$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<button class="show-more major" type="button"></button>`, 2),
-  $41227f10ad680afd$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class="depict plp"></div>`, 2);
+  $41227f10ad680afd$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class="depict plp recommendations"></div>`, 2);
 function $41227f10ad680afd$export$9756467d34d91cdb(props) {
   const rows_object_ = $52FdA$solidjs.createMemo(() => {
     const view_more_button = props.view_more_button;

package/ES10/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
-export const version = "1.4.23";
+export const version = "1.4.24";
 export type SDKGridSpacing = string | {
   horizontal: string;
   vertical: string;

package/ES10/index.js

@@ -1,6 +1,7 @@
 import { add_to_version_info as $8tj43$add_to_version_info, make_random_classname as $8tj43$make_random_classname, n_col_styling_with_dist as $8tj43$n_col_styling_with_dist, catchify as $8tj43$catchify, 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, report as $8tj43$report, Amazing_Slider as $8tj43$Amazing_Slider, slider_snap_css as $8tj43$slider_snap_css, slider_fading_factory as $8tj43$slider_fading_factory, is_safari as $8tj43$is_safari, observer as $8tj43$observer, useExpandingContainer as $8tj43$useExpandingContainer, standard_price_format as $8tj43$standard_price_format, dlog as $8tj43$dlog, hex_to_rgb as $8tj43$hex_to_rgb, relative_luminance_from_rgb as $8tj43$relative_luminance_from_rgb, javascript_media_query as $8tj43$javascript_media_query, fetch_recs as $8tj43$fetch_recs, snakeCasifyObject as $8tj43$snakeCasifyObject, instant_exec_on_suspect_history_change as $8tj43$instant_exec_on_suspect_history_change, base_url as $8tj43$base_url, get_depict_id as $8tj43$get_depict_id, get_user_id as $8tj43$get_user_id, get_session_id as $8tj43$get_session_id, make_url_with_query_params as $8tj43$make_url_with_query_params, fetch_retry as $8tj43$fetch_retry, add_version_query_params as $8tj43$add_version_query_params, dwarn as $8tj43$dwarn, sort_obj as $8tj43$sort_obj, edit_current_page_meta_tags as $8tj43$edit_current_page_meta_tags, use_href_accessor as $8tj43$use_href_accessor, 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, make_asyncIterable_exiter as $8tj43$make_asyncIterable_exiter, href_change_ipns as $8tj43$href_change_ipns, ContainedImage as $8tj43$ContainedImage, buildThresholdList as $8tj43$buildThresholdList, deparallelize_no_drop as $8tj43$deparallelize_no_drop, insert_surfaces as $8tj43$insert_surfaces } from "@depict-ai/utilishared/ES10";
 import { template as $8tj43$template, getNextElement as $8tj43$getNextElement, insert as $8tj43$insert, createComponent as $8tj43$createComponent, mergeProps as $8tj43$mergeProps, isServer as $8tj43$isServer, spread as $8tj43$spread, runHydrationEvents as $8tj43$runHydrationEvents, addEventListener as $8tj43$addEventListener, className as $8tj43$className, memo as $8tj43$memo, delegateEvents as $8tj43$delegateEvents, effect as $8tj43$effect, classList as $8tj43$classList, setAttribute as $8tj43$setAttribute, getNextMarker as $8tj43$getNextMarker, style as $8tj43$style, Dynamic as $8tj43$Dynamic, use as $8tj43$use } from "solid-js/web";
 import { createMemo as $8tj43$createMemo, createResource as $8tj43$createResource, Suspense as $8tj43$Suspense, Show as $8tj43$Show, createSignal as $8tj43$createSignal, createRenderEffect as $8tj43$createRenderEffect, createRoot as $8tj43$createRoot, onCleanup as $8tj43$onCleanup, For as $8tj43$For, getOwner as $8tj43$getOwner, runWithOwner as $8tj43$runWithOwner, createEffect as $8tj43$createEffect, untrack as $8tj43$untrack, createComputed as $8tj43$createComputed, ErrorBoundary as $8tj43$ErrorBoundary, Index as $8tj43$Index, on as $8tj43$on, batch as $8tj43$batch, createReaction as $8tj43$createReaction } from "solid-js";
+import { slider_fractional_factory as $8tj43$slider_fractional_factory } from "@depict-ai/utilishared/latest/ES10";
 import $8tj43$babelruntimehelpersclassPrivateFieldSet from "@babel/runtime/helpers/classPrivateFieldSet";
 import $8tj43$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpers/classPrivateFieldGet";
 import $8tj43$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/defineProperty";
@@ -8,7 +9,7 @@ import $8tj43$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/def
 /*! 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 = "1.4.23";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "1.4.24";
 const $a9c7ba6087881ac2$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -463,7 +464,8 @@ function $002f09d00aac50b2$export$6649caad96ef8870(_ref) {
     children: children,
     slider_ref_: slider_ref_,
     faded_opacity_ = 0.7,
-    mutation_plugins_ = []
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_
   } = _ref;
   const slider = new (0, $8tj43$Amazing_Slider)({
     button_contents: {
@@ -479,10 +481,10 @@ function $002f09d00aac50b2$export$6649caad96ef8870(_ref) {
       })()]
     },
     constructor_plugins: [$8tj43$slider_snap_css().constructor_plugin],
-    mutation_plugins: [$8tj43$slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$8tj43$slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $8tj43$insert(slider.insert_here, children);
   $8tj43$onCleanup(() => slider.observer.disconnect());
@@ -503,14 +505,19 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
   });
   const num_placeholders_ = () => 20;
   const slider = $8tj43$createComponent((0, $002f09d00aac50b2$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $8tj43$createComponent(Layout, $8tj43$mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($ca55612a53dbbdd2$export$a2cc176055f8f08());
+      $8tj43$slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($ca55612a53dbbdd2$export$a2cc176055f8f08());
     },
     get children() {
       return $8tj43$createComponent((0, $8tj43$Suspense), {
@@ -542,7 +549,7 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
     children: slider
   });
 }
-const $d5d7e58c5c9d8db0$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class="depict plp"></div>`, 2);
+const $d5d7e58c5c9d8db0$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class="depict recommendations"></div>`, 2);
 function $d5d7e58c5c9d8db0$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $8tj43$createMemo(() => {
     const {
@@ -636,7 +643,7 @@ function $e3efeb558d952696$export$7da560f849543dff(_ref) {
   });
 }
 const $b432b11321ad4c97$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<button class="show-more major" type="button"></button>`, 2),
-  $b432b11321ad4c97$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class="depict plp"></div>`, 2);
+  $b432b11321ad4c97$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class="depict plp recommendations"></div>`, 2);
 function $b432b11321ad4c97$export$9756467d34d91cdb(props) {
   const rows_object_ = $8tj43$createMemo(() => {
     const view_more_button = props.view_more_button;

package/latest/index.cjs

@@ -1,6 +1,7 @@
 var $gVhhF$depictaiutilishared = require("@depict-ai/utilishared/latest");
 var $gVhhF$solidjsweb = require("solid-js/web");
 var $gVhhF$solidjs = require("solid-js");
+var $gVhhF$depictaiutilisharedlatest = require("@depict-ai/utilishared/latest/latest");
 require("../multi_import_deduplicator.cjs").register_es_version("ui", "latest");
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {
@@ -60,7 +61,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $a3280f0aad997933$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad997933$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "1.4.23";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "1.4.24";
 const $4e04be41243c3d80$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -476,7 +477,8 @@ function $a0e53f99354809d9$export$6649caad96ef8870({
   children: children,
   slider_ref_: slider_ref_,
   faded_opacity_ = 0.7,
-  mutation_plugins_ = []
+  mutation_plugins_ = [],
+  disable_fading_: disable_fading_
 }) {
   const slider = new (0, $gVhhF$depictaiutilishared.Amazing_Slider)({
     button_contents: {
@@ -492,10 +494,10 @@ function $a0e53f99354809d9$export$6649caad96ef8870({
       })()]
     },
     constructor_plugins: [$gVhhF$depictaiutilishared.slider_snap_css().constructor_plugin],
-    mutation_plugins: [$gVhhF$depictaiutilishared.slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$gVhhF$depictaiutilishared.slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $gVhhF$solidjsweb.insert(slider.insert_here, children);
   $gVhhF$solidjs.onCleanup(() => slider.observer.disconnect());
@@ -512,14 +514,19 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
   const is_showing_something = $gVhhF$solidjs.createMemo(() => recommendations_resource_.loading || recommendations_resource_()?.length);
   const num_placeholders_ = () => 20;
   const slider = $gVhhF$solidjsweb.createComponent((0, $a0e53f99354809d9$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $gVhhF$solidjsweb.createComponent(Layout, $gVhhF$solidjsweb.mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($fc23d7668ae0011d$export$a2cc176055f8f08());
+      $gVhhF$depictaiutilisharedlatest.slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($fc23d7668ae0011d$export$a2cc176055f8f08());
     },
     get children() {
       return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Suspense), {
@@ -551,7 +558,7 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
     children: slider
   });
 }
-const $72f96c4782db0b1b$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict plp"></div>`, 2);
+const $72f96c4782db0b1b$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict recommendations"></div>`, 2);
 function $72f96c4782db0b1b$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $gVhhF$solidjs.createMemo(() => {
     const {
@@ -639,7 +646,7 @@ function $b8e79813f4f7ebe4$export$7da560f849543dff({
   });
 }
 const $1f8dbf7e28b3eff2$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<button class="show-more major" type="button"></button>`, 2),
-  $1f8dbf7e28b3eff2$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict plp"></div>`, 2);
+  $1f8dbf7e28b3eff2$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict plp recommendations"></div>`, 2);
 function $1f8dbf7e28b3eff2$export$9756467d34d91cdb(props) {
   const rows_object_ = $gVhhF$solidjs.createMemo(() => {
     const view_more_button = props.view_more_button;

package/latest/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
-export const version = "1.4.23";
+export const version = "1.4.24";
 export type SDKGridSpacing = string | {
   horizontal: string;
   vertical: string;

package/latest/index.js

@@ -1,11 +1,12 @@
 import { add_to_version_info as $9HbP8$add_to_version_info, make_random_classname as $9HbP8$make_random_classname, n_col_styling_with_dist as $9HbP8$n_col_styling_with_dist, catchify as $9HbP8$catchify, 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, report as $9HbP8$report, Amazing_Slider as $9HbP8$Amazing_Slider, slider_snap_css as $9HbP8$slider_snap_css, slider_fading_factory as $9HbP8$slider_fading_factory, is_safari as $9HbP8$is_safari, observer as $9HbP8$observer, useExpandingContainer as $9HbP8$useExpandingContainer, standard_price_format as $9HbP8$standard_price_format, dlog as $9HbP8$dlog, hex_to_rgb as $9HbP8$hex_to_rgb, relative_luminance_from_rgb as $9HbP8$relative_luminance_from_rgb, javascript_media_query as $9HbP8$javascript_media_query, fetch_recs as $9HbP8$fetch_recs, snakeCasifyObject as $9HbP8$snakeCasifyObject, instant_exec_on_suspect_history_change as $9HbP8$instant_exec_on_suspect_history_change, base_url as $9HbP8$base_url, get_depict_id as $9HbP8$get_depict_id, get_user_id as $9HbP8$get_user_id, get_session_id as $9HbP8$get_session_id, sort_obj as $9HbP8$sort_obj, fetch_retry as $9HbP8$fetch_retry, add_version_query_params as $9HbP8$add_version_query_params, dwarn as $9HbP8$dwarn, make_url_with_query_params as $9HbP8$make_url_with_query_params, edit_current_page_meta_tags as $9HbP8$edit_current_page_meta_tags, use_href_accessor as $9HbP8$use_href_accessor, 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, make_asyncIterable_exiter as $9HbP8$make_asyncIterable_exiter, href_change_ipns as $9HbP8$href_change_ipns, ContainedImage as $9HbP8$ContainedImage, buildThresholdList as $9HbP8$buildThresholdList, deparallelize_no_drop as $9HbP8$deparallelize_no_drop, insert_surfaces as $9HbP8$insert_surfaces } from "@depict-ai/utilishared/latest";
 import { template as $9HbP8$template, getNextElement as $9HbP8$getNextElement, insert as $9HbP8$insert, createComponent as $9HbP8$createComponent, mergeProps as $9HbP8$mergeProps, isServer as $9HbP8$isServer, spread as $9HbP8$spread, runHydrationEvents as $9HbP8$runHydrationEvents, addEventListener as $9HbP8$addEventListener, className as $9HbP8$className, memo as $9HbP8$memo, delegateEvents as $9HbP8$delegateEvents, effect as $9HbP8$effect, classList as $9HbP8$classList, setAttribute as $9HbP8$setAttribute, getNextMarker as $9HbP8$getNextMarker, style as $9HbP8$style, Dynamic as $9HbP8$Dynamic, use as $9HbP8$use } from "solid-js/web";
 import { createMemo as $9HbP8$createMemo, createResource as $9HbP8$createResource, Suspense as $9HbP8$Suspense, Show as $9HbP8$Show, createSignal as $9HbP8$createSignal, createRenderEffect as $9HbP8$createRenderEffect, createRoot as $9HbP8$createRoot, onCleanup as $9HbP8$onCleanup, For as $9HbP8$For, getOwner as $9HbP8$getOwner, runWithOwner as $9HbP8$runWithOwner, createEffect as $9HbP8$createEffect, untrack as $9HbP8$untrack, createComputed as $9HbP8$createComputed, ErrorBoundary as $9HbP8$ErrorBoundary, Index as $9HbP8$Index, on as $9HbP8$on, batch as $9HbP8$batch, createReaction as $9HbP8$createReaction } from "solid-js";
+import { slider_fractional_factory as $9HbP8$slider_fractional_factory } from "@depict-ai/utilishared/latest/latest";
 
 /*! 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 = "1.4.23";
+const $ec291e0010116877$export$83d89fbfd8236492 = "1.4.24";
 const $b5cccc8ee7d24677$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -421,7 +422,8 @@ function $f32e14878e75af51$export$6649caad96ef8870({
   children: children,
   slider_ref_: slider_ref_,
   faded_opacity_ = 0.7,
-  mutation_plugins_ = []
+  mutation_plugins_ = [],
+  disable_fading_: disable_fading_
 }) {
   const slider = new (0, $9HbP8$Amazing_Slider)({
     button_contents: {
@@ -437,10 +439,10 @@ function $f32e14878e75af51$export$6649caad96ef8870({
       })()]
     },
     constructor_plugins: [$9HbP8$slider_snap_css().constructor_plugin],
-    mutation_plugins: [$9HbP8$slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$9HbP8$slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $9HbP8$insert(slider.insert_here, children);
   $9HbP8$onCleanup(() => slider.observer.disconnect());
@@ -457,14 +459,19 @@ function $c4492d24952ed731$export$d41d19e89346fa2({
   const is_showing_something = $9HbP8$createMemo(() => recommendations_resource_.loading || recommendations_resource_()?.length);
   const num_placeholders_ = () => 20;
   const slider = $9HbP8$createComponent((0, $f32e14878e75af51$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $c8d5ff4524619fcd$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $c8d5ff4524619fcd$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $9HbP8$createComponent(Layout, $9HbP8$mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($a458486f22b22f63$export$a2cc176055f8f08());
+      $9HbP8$slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($a458486f22b22f63$export$a2cc176055f8f08());
     },
     get children() {
       return $9HbP8$createComponent((0, $9HbP8$Suspense), {
@@ -496,7 +503,7 @@ function $c4492d24952ed731$export$d41d19e89346fa2({
     children: slider
   });
 }
-const $ee116da074deb002$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict plp"></div>`, 2);
+const $ee116da074deb002$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict recommendations"></div>`, 2);
 function $ee116da074deb002$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $9HbP8$createMemo(() => {
     const {
@@ -584,7 +591,7 @@ function $3da8afe3ed57cf34$export$7da560f849543dff({
   });
 }
 const $9ea5383493360761$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="show-more major" type="button"></button>`, 2),
-  $9ea5383493360761$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp"></div>`, 2);
+  $9ea5383493360761$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp recommendations"></div>`, 2);
 function $9ea5383493360761$export$9756467d34d91cdb(props) {
   const rows_object_ = $9HbP8$createMemo(() => {
     const view_more_button = props.view_more_button;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "1.4.23",
+  "version": "1.4.24",
   "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",
@@ -236,9 +236,9 @@
     "@babel/plugin-transform-typescript": "^7.22.9",
     "@babel/runtime": "latest",
     "@babel/runtime-corejs3": "^7.22.6",
-    "@depict-ai/plp-styling": "^1.1.3",
+    "@depict-ai/plp-styling": "^1.1.4",
     "@depict-ai/types": "^1.0.38",
-    "@depict-ai/utilishared": "^1.0.39",
+    "@depict-ai/utilishared": "^1.0.40",
     "solid-js": "^1.7.3"
   },
   "type": "module",

package/server/ES10/index.cjs

@@ -1,6 +1,7 @@
 var $3hooq$depictaiutilishared = require("@depict-ai/utilishared/ES10");
 var $3hooq$solidjsweb = require("solid-js/web");
 var $3hooq$solidjs = require("solid-js");
+var $3hooq$depictaiutilisharedlatest = require("@depict-ai/utilishared/latest/ES10");
 var $3hooq$babelruntimehelpersclassPrivateFieldSet = require("@babel/runtime/helpers/classPrivateFieldSet");
 var $3hooq$babelruntimehelpersclassPrivateFieldGet = require("@babel/runtime/helpers/classPrivateFieldGet");
 var $3hooq$babelruntimehelpersdefineProperty = require("@babel/runtime/helpers/defineProperty");
@@ -66,7 +67,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $33eed84f447aa0c0$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $33eed84f447aa0c0$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $aa1938dec50d6c12$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "1.4.23";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "1.4.24";
 const $5401a6698b0c0658$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -469,7 +470,8 @@ function $ad8ec7729fffeb9c$export$6649caad96ef8870(_ref) {
     children: children,
     slider_ref_: slider_ref_,
     faded_opacity_ = 0.7,
-    mutation_plugins_ = []
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_
   } = _ref;
   const slider = new (0, $3hooq$depictaiutilishared.Amazing_Slider)({
     button_contents: {
@@ -477,10 +479,10 @@ function $ad8ec7729fffeb9c$export$6649caad96ef8870(_ref) {
       right: [$3hooq$solidjsweb.ssr($ad8ec7729fffeb9c$var$_tmpl$, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.escape($3hooq$solidjsweb.createComponent((0, $9d19451330d04c3c$export$8be2714ec7f169ee), {})))]
     },
     constructor_plugins: [$3hooq$depictaiutilishared.slider_snap_css().constructor_plugin],
-    mutation_plugins: [$3hooq$depictaiutilishared.slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$3hooq$depictaiutilishared.slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $3hooq$solidjsweb.insert(slider.insert_here, children);
   $3hooq$solidjs.onCleanup(() => slider.observer.disconnect());
@@ -501,14 +503,19 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
   });
   const num_placeholders_ = () => 20;
   const slider = $3hooq$solidjsweb.createComponent((0, $ad8ec7729fffeb9c$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $6c2c739b113a8ddf$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $6c2c739b113a8ddf$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $3hooq$solidjsweb.createComponent(Layout, $3hooq$solidjsweb.mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($8edd3cf30d1fd8b4$export$a2cc176055f8f08());
+      $3hooq$depictaiutilisharedlatest.slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($8edd3cf30d1fd8b4$export$a2cc176055f8f08());
     },
     get children() {
       return $3hooq$solidjsweb.createComponent((0, $3hooq$solidjs.Suspense), {
@@ -540,7 +547,7 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
     children: slider
   });
 }
-const $2badc30d7c6610e1$var$_tmpl$ = ["<div", ' class="depict plp">', "</div>"];
+const $2badc30d7c6610e1$var$_tmpl$ = ["<div", ' class="depict recommendations">', "</div>"];
 function $2badc30d7c6610e1$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $3hooq$solidjs.createMemo(() => {
     const {
@@ -623,7 +630,7 @@ function $2c920813c92d6987$export$7da560f849543dff(_ref) {
   });
 }
 const $41227f10ad680afd$var$_tmpl$ = ["<button", ' class="show-more major" type="button">', "</button>"],
-  $41227f10ad680afd$var$_tmpl$2 = ["<div", ' class="depict plp">', "</div>"];
+  $41227f10ad680afd$var$_tmpl$2 = ["<div", ' class="depict plp recommendations">', "</div>"];
 function $41227f10ad680afd$export$9756467d34d91cdb(props) {
   const rows_object_ = $3hooq$solidjs.createMemo(() => {
     const view_more_button = props.view_more_button;

package/server/ES10/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
-export const version = "1.4.23";
+export const version = "1.4.24";
 export type SDKGridSpacing = string | {
   horizontal: string;
   vertical: string;

package/server/ES10/index.js

@@ -1,6 +1,7 @@
 import { add_to_version_info as $b8hua$add_to_version_info, make_random_classname as $b8hua$make_random_classname, n_col_styling_with_dist as $b8hua$n_col_styling_with_dist, catchify as $b8hua$catchify, layout_get_visible_recs_without_partial_rows as $b8hua$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $b8hua$layout_get_total_rec_amount_for_row, layout_media_query_header as $b8hua$layout_media_query_header, report as $b8hua$report, Amazing_Slider as $b8hua$Amazing_Slider, slider_snap_css as $b8hua$slider_snap_css, slider_fading_factory as $b8hua$slider_fading_factory, is_safari as $b8hua$is_safari, observer as $b8hua$observer, useExpandingContainer as $b8hua$useExpandingContainer, standard_price_format as $b8hua$standard_price_format, dlog as $b8hua$dlog, hex_to_rgb as $b8hua$hex_to_rgb, relative_luminance_from_rgb as $b8hua$relative_luminance_from_rgb, javascript_media_query as $b8hua$javascript_media_query, fetch_recs as $b8hua$fetch_recs, snakeCasifyObject as $b8hua$snakeCasifyObject, instant_exec_on_suspect_history_change as $b8hua$instant_exec_on_suspect_history_change, base_url as $b8hua$base_url, get_depict_id as $b8hua$get_depict_id, get_user_id as $b8hua$get_user_id, get_session_id as $b8hua$get_session_id, make_url_with_query_params as $b8hua$make_url_with_query_params, fetch_retry as $b8hua$fetch_retry, add_version_query_params as $b8hua$add_version_query_params, dwarn as $b8hua$dwarn, sort_obj as $b8hua$sort_obj, edit_current_page_meta_tags as $b8hua$edit_current_page_meta_tags, use_href_accessor as $b8hua$use_href_accessor, base64_encode_unicode as $b8hua$base64_encode_unicode, base64_decode_unicode as $b8hua$base64_decode_unicode, queueMacroTask as $b8hua$queueMacroTask, make_asyncIterable_exiter as $b8hua$make_asyncIterable_exiter, href_change_ipns as $b8hua$href_change_ipns, ContainedImage as $b8hua$ContainedImage, deparallelize_no_drop as $b8hua$deparallelize_no_drop, insert_surfaces as $b8hua$insert_surfaces } from "@depict-ai/utilishared/ES10";
 import { ssr as $b8hua$ssr, ssrHydrationKey as $b8hua$ssrHydrationKey, escape as $b8hua$escape, createComponent as $b8hua$createComponent, mergeProps as $b8hua$mergeProps, isServer as $b8hua$isServer, ssrElement as $b8hua$ssrElement, ssrClassList as $b8hua$ssrClassList, insert as $b8hua$insert, ssrAttribute as $b8hua$ssrAttribute, ssrStyle as $b8hua$ssrStyle, Dynamic as $b8hua$Dynamic } from "solid-js/web";
 import { createMemo as $b8hua$createMemo, createResource as $b8hua$createResource, Suspense as $b8hua$Suspense, Show as $b8hua$Show, createSignal as $b8hua$createSignal, createRenderEffect as $b8hua$createRenderEffect, createRoot as $b8hua$createRoot, onCleanup as $b8hua$onCleanup, For as $b8hua$For, getOwner as $b8hua$getOwner, runWithOwner as $b8hua$runWithOwner, createEffect as $b8hua$createEffect, untrack as $b8hua$untrack, createComputed as $b8hua$createComputed, ErrorBoundary as $b8hua$ErrorBoundary, Index as $b8hua$Index, on as $b8hua$on, batch as $b8hua$batch, createReaction as $b8hua$createReaction } from "solid-js";
+import { slider_fractional_factory as $b8hua$slider_fractional_factory } from "@depict-ai/utilishared/latest/ES10";
 import $b8hua$babelruntimehelpersclassPrivateFieldSet from "@babel/runtime/helpers/classPrivateFieldSet";
 import $b8hua$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpers/classPrivateFieldGet";
 import $b8hua$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/defineProperty";
@@ -8,7 +9,7 @@ import $b8hua$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/def
 /*! 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 = "1.4.23";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "1.4.24";
 const $a9c7ba6087881ac2$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -411,7 +412,8 @@ function $002f09d00aac50b2$export$6649caad96ef8870(_ref) {
     children: children,
     slider_ref_: slider_ref_,
     faded_opacity_ = 0.7,
-    mutation_plugins_ = []
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_
   } = _ref;
   const slider = new (0, $b8hua$Amazing_Slider)({
     button_contents: {
@@ -419,10 +421,10 @@ function $002f09d00aac50b2$export$6649caad96ef8870(_ref) {
       right: [$b8hua$ssr($002f09d00aac50b2$var$_tmpl$, $b8hua$ssrHydrationKey(), $b8hua$escape($b8hua$createComponent((0, $ca6ab5f08bd28bca$export$8be2714ec7f169ee), {})))]
     },
     constructor_plugins: [$b8hua$slider_snap_css().constructor_plugin],
-    mutation_plugins: [$b8hua$slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$b8hua$slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $b8hua$insert(slider.insert_here, children);
   $b8hua$onCleanup(() => slider.observer.disconnect());
@@ -443,14 +445,19 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
   });
   const num_placeholders_ = () => 20;
   const slider = $b8hua$createComponent((0, $002f09d00aac50b2$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $b8hua$createComponent(Layout, $b8hua$mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($ca55612a53dbbdd2$export$a2cc176055f8f08());
+      $b8hua$slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($ca55612a53dbbdd2$export$a2cc176055f8f08());
     },
     get children() {
       return $b8hua$createComponent((0, $b8hua$Suspense), {
@@ -482,7 +489,7 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
     children: slider
   });
 }
-const $d5d7e58c5c9d8db0$var$_tmpl$ = ["<div", ' class="depict plp">', "</div>"];
+const $d5d7e58c5c9d8db0$var$_tmpl$ = ["<div", ' class="depict recommendations">', "</div>"];
 function $d5d7e58c5c9d8db0$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $b8hua$createMemo(() => {
     const {
@@ -565,7 +572,7 @@ function $e3efeb558d952696$export$7da560f849543dff(_ref) {
   });
 }
 const $b432b11321ad4c97$var$_tmpl$ = ["<button", ' class="show-more major" type="button">', "</button>"],
-  $b432b11321ad4c97$var$_tmpl$2 = ["<div", ' class="depict plp">', "</div>"];
+  $b432b11321ad4c97$var$_tmpl$2 = ["<div", ' class="depict plp recommendations">', "</div>"];
 function $b432b11321ad4c97$export$9756467d34d91cdb(props) {
   const rows_object_ = $b8hua$createMemo(() => {
     const view_more_button = props.view_more_button;

package/server/latest/index.cjs

@@ -1,6 +1,7 @@
 var $5vyXB$depictaiutilishared = require("@depict-ai/utilishared/latest");
 var $5vyXB$solidjsweb = require("solid-js/web");
 var $5vyXB$solidjs = require("solid-js");
+var $5vyXB$depictaiutilisharedlatest = require("@depict-ai/utilishared/latest/latest");
 require("../../multi_import_deduplicator.cjs").register_es_version("ui", "latest");
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {
@@ -60,7 +61,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $a3280f0aad997933$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad997933$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "1.4.23";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "1.4.24";
 const $4e04be41243c3d80$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -433,7 +434,8 @@ function $a0e53f99354809d9$export$6649caad96ef8870({
   children: children,
   slider_ref_: slider_ref_,
   faded_opacity_ = 0.7,
-  mutation_plugins_ = []
+  mutation_plugins_ = [],
+  disable_fading_: disable_fading_
 }) {
   const slider = new (0, $5vyXB$depictaiutilishared.Amazing_Slider)({
     button_contents: {
@@ -441,10 +443,10 @@ function $a0e53f99354809d9$export$6649caad96ef8870({
       right: [$5vyXB$solidjsweb.ssr($a0e53f99354809d9$var$_tmpl$, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.escape($5vyXB$solidjsweb.createComponent((0, $0f313083912e447a$export$8be2714ec7f169ee), {})))]
     },
     constructor_plugins: [$5vyXB$depictaiutilishared.slider_snap_css().constructor_plugin],
-    mutation_plugins: [$5vyXB$depictaiutilishared.slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$5vyXB$depictaiutilishared.slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $5vyXB$solidjsweb.insert(slider.insert_here, children);
   $5vyXB$solidjs.onCleanup(() => slider.observer.disconnect());
@@ -461,14 +463,19 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
   const is_showing_something = $5vyXB$solidjs.createMemo(() => recommendations_resource_.loading || recommendations_resource_()?.length);
   const num_placeholders_ = () => 20;
   const slider = $5vyXB$solidjsweb.createComponent((0, $a0e53f99354809d9$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $5vyXB$solidjsweb.createComponent(Layout, $5vyXB$solidjsweb.mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($fc23d7668ae0011d$export$a2cc176055f8f08());
+      $5vyXB$depictaiutilisharedlatest.slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($fc23d7668ae0011d$export$a2cc176055f8f08());
     },
     get children() {
       return $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Suspense), {
@@ -500,7 +507,7 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
     children: slider
   });
 }
-const $72f96c4782db0b1b$var$_tmpl$ = ["<div", ' class="depict plp">', "</div>"];
+const $72f96c4782db0b1b$var$_tmpl$ = ["<div", ' class="depict recommendations">', "</div>"];
 function $72f96c4782db0b1b$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $5vyXB$solidjs.createMemo(() => {
     const {
@@ -577,7 +584,7 @@ function $b8e79813f4f7ebe4$export$7da560f849543dff({
   });
 }
 const $1f8dbf7e28b3eff2$var$_tmpl$ = ["<button", ' class="show-more major" type="button">', "</button>"],
-  $1f8dbf7e28b3eff2$var$_tmpl$2 = ["<div", ' class="depict plp">', "</div>"];
+  $1f8dbf7e28b3eff2$var$_tmpl$2 = ["<div", ' class="depict plp recommendations">', "</div>"];
 function $1f8dbf7e28b3eff2$export$9756467d34d91cdb(props) {
   const rows_object_ = $5vyXB$solidjs.createMemo(() => {
     const view_more_button = props.view_more_button;

package/server/latest/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
-export const version = "1.4.23";
+export const version = "1.4.24";
 export type SDKGridSpacing = string | {
   horizontal: string;
   vertical: string;

package/server/latest/index.js

@@ -1,11 +1,12 @@
 import { add_to_version_info as $i7OB2$add_to_version_info, make_random_classname as $i7OB2$make_random_classname, n_col_styling_with_dist as $i7OB2$n_col_styling_with_dist, catchify as $i7OB2$catchify, layout_get_visible_recs_without_partial_rows as $i7OB2$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $i7OB2$layout_get_total_rec_amount_for_row, layout_media_query_header as $i7OB2$layout_media_query_header, report as $i7OB2$report, Amazing_Slider as $i7OB2$Amazing_Slider, slider_snap_css as $i7OB2$slider_snap_css, slider_fading_factory as $i7OB2$slider_fading_factory, is_safari as $i7OB2$is_safari, observer as $i7OB2$observer, useExpandingContainer as $i7OB2$useExpandingContainer, standard_price_format as $i7OB2$standard_price_format, dlog as $i7OB2$dlog, hex_to_rgb as $i7OB2$hex_to_rgb, relative_luminance_from_rgb as $i7OB2$relative_luminance_from_rgb, javascript_media_query as $i7OB2$javascript_media_query, fetch_recs as $i7OB2$fetch_recs, snakeCasifyObject as $i7OB2$snakeCasifyObject, instant_exec_on_suspect_history_change as $i7OB2$instant_exec_on_suspect_history_change, base_url as $i7OB2$base_url, get_depict_id as $i7OB2$get_depict_id, get_user_id as $i7OB2$get_user_id, get_session_id as $i7OB2$get_session_id, sort_obj as $i7OB2$sort_obj, fetch_retry as $i7OB2$fetch_retry, add_version_query_params as $i7OB2$add_version_query_params, dwarn as $i7OB2$dwarn, make_url_with_query_params as $i7OB2$make_url_with_query_params, edit_current_page_meta_tags as $i7OB2$edit_current_page_meta_tags, use_href_accessor as $i7OB2$use_href_accessor, base64_encode_unicode as $i7OB2$base64_encode_unicode, base64_decode_unicode as $i7OB2$base64_decode_unicode, queueMacroTask as $i7OB2$queueMacroTask, make_asyncIterable_exiter as $i7OB2$make_asyncIterable_exiter, href_change_ipns as $i7OB2$href_change_ipns, ContainedImage as $i7OB2$ContainedImage, deparallelize_no_drop as $i7OB2$deparallelize_no_drop, insert_surfaces as $i7OB2$insert_surfaces } from "@depict-ai/utilishared/latest";
 import { ssr as $i7OB2$ssr, ssrHydrationKey as $i7OB2$ssrHydrationKey, escape as $i7OB2$escape, createComponent as $i7OB2$createComponent, mergeProps as $i7OB2$mergeProps, isServer as $i7OB2$isServer, ssrElement as $i7OB2$ssrElement, ssrClassList as $i7OB2$ssrClassList, insert as $i7OB2$insert, ssrAttribute as $i7OB2$ssrAttribute, ssrStyle as $i7OB2$ssrStyle, Dynamic as $i7OB2$Dynamic } from "solid-js/web";
 import { createMemo as $i7OB2$createMemo, createResource as $i7OB2$createResource, Suspense as $i7OB2$Suspense, Show as $i7OB2$Show, createSignal as $i7OB2$createSignal, createRenderEffect as $i7OB2$createRenderEffect, createRoot as $i7OB2$createRoot, onCleanup as $i7OB2$onCleanup, For as $i7OB2$For, getOwner as $i7OB2$getOwner, runWithOwner as $i7OB2$runWithOwner, createEffect as $i7OB2$createEffect, untrack as $i7OB2$untrack, createComputed as $i7OB2$createComputed, ErrorBoundary as $i7OB2$ErrorBoundary, Index as $i7OB2$Index, on as $i7OB2$on, batch as $i7OB2$batch, createReaction as $i7OB2$createReaction } from "solid-js";
+import { slider_fractional_factory as $i7OB2$slider_fractional_factory } from "@depict-ai/utilishared/latest/latest";
 
 /*! 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 = "1.4.23";
+const $ec291e0010116877$export$83d89fbfd8236492 = "1.4.24";
 const $b5cccc8ee7d24677$var$transform_elements = sorted_cols_at_size => {
   const cols_at_size = [];
   for (let i = 0; i < sorted_cols_at_size.length; i++) {
@@ -378,7 +379,8 @@ function $f32e14878e75af51$export$6649caad96ef8870({
   children: children,
   slider_ref_: slider_ref_,
   faded_opacity_ = 0.7,
-  mutation_plugins_ = []
+  mutation_plugins_ = [],
+  disable_fading_: disable_fading_
 }) {
   const slider = new (0, $i7OB2$Amazing_Slider)({
     button_contents: {
@@ -386,10 +388,10 @@ function $f32e14878e75af51$export$6649caad96ef8870({
       right: [$i7OB2$ssr($f32e14878e75af51$var$_tmpl$, $i7OB2$ssrHydrationKey(), $i7OB2$escape($i7OB2$createComponent((0, $fbbadcb080ad1d4a$export$8be2714ec7f169ee), {})))]
     },
     constructor_plugins: [$i7OB2$slider_snap_css().constructor_plugin],
-    mutation_plugins: [$i7OB2$slider_fading_factory({
+    mutation_plugins: [...(disable_fading_ ? [] : [$i7OB2$slider_fading_factory({
       threshold_: 0.96,
       faded_opacity_: faded_opacity_
-    }).mutation_plugin_, ...mutation_plugins_]
+    }).mutation_plugin_]), ...mutation_plugins_]
   });
   $i7OB2$insert(slider.insert_here, children);
   $i7OB2$onCleanup(() => slider.observer.disconnect());
@@ -406,14 +408,19 @@ function $c4492d24952ed731$export$d41d19e89346fa2({
   const is_showing_something = $i7OB2$createMemo(() => recommendations_resource_.loading || recommendations_resource_()?.length);
   const num_placeholders_ = () => 20;
   const slider = $i7OB2$createComponent((0, $f32e14878e75af51$export$6649caad96ef8870), {
+    disable_fading_: true,
     slider_ref_: slider => {
-      const Layout = props => $c8d5ff4524619fcd$export$445d8d3f5f706a40(props, slider.insert_here, true);
+      const {
+        insert_here: insert_here
+      } = slider;
+      const Layout = props => $c8d5ff4524619fcd$export$445d8d3f5f706a40(props, insert_here, true);
       // Do like this, so we don't have to call mergeProps ourselves
       $i7OB2$createComponent(Layout, $i7OB2$mergeProps({
         rows: "all",
         layout: "slider"
       }, layout_options_));
-      slider.insert_here.before($a458486f22b22f63$export$a2cc176055f8f08());
+      $i7OB2$slider_fractional_factory(0, 0.75).constructor_plugin.call(slider, {}); // enable fractional scrolling
+      insert_here.before($a458486f22b22f63$export$a2cc176055f8f08());
     },
     get children() {
       return $i7OB2$createComponent((0, $i7OB2$Suspense), {
@@ -445,7 +452,7 @@ function $c4492d24952ed731$export$d41d19e89346fa2({
     children: slider
   });
 }
-const $ee116da074deb002$var$_tmpl$ = ["<div", ' class="depict plp">', "</div>"];
+const $ee116da074deb002$var$_tmpl$ = ["<div", ' class="depict recommendations">', "</div>"];
 function $ee116da074deb002$export$9574e176201e5e8d(props) {
   const grid_spacing_override = $i7OB2$createMemo(() => {
     const {
@@ -522,7 +529,7 @@ function $3da8afe3ed57cf34$export$7da560f849543dff({
   });
 }
 const $9ea5383493360761$var$_tmpl$ = ["<button", ' class="show-more major" type="button">', "</button>"],
-  $9ea5383493360761$var$_tmpl$2 = ["<div", ' class="depict plp">', "</div>"];
+  $9ea5383493360761$var$_tmpl$2 = ["<div", ' class="depict plp recommendations">', "</div>"];
 function $9ea5383493360761$export$9756467d34d91cdb(props) {
   const rows_object_ = $i7OB2$createMemo(() => {
     const view_more_button = props.view_more_button;