@depict-ai/ui 3.0.14 → 3.0.16

package/latest/index.js

@@ -7,7 +7,7 @@ import { createStore as $9HbP8$createStore, reconcile as $9HbP8$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 = "3.0.14";
+const $ec291e0010116877$export$83d89fbfd8236492 = "3.0.16";
 const $fbbadcb080ad1d4a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0"fill=#0f0f0f>`);
 function $fbbadcb080ad1d4a$export$8be2714ec7f169ee(props = {}) {
   return (() => {
@@ -6603,7 +6603,11 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
               product_card_template_: product_card_template_,
               num_placeholders_: num_placeholders_
             }) : undefined);
-            const layout = $9HbP8$createMemo(() => layout_options_().layout || "grid");
+            const layout = $9HbP8$createMemo(() => {
+              const incoming_layout = layout_options_().layout;
+              if (incoming_layout === "slider-without-filters") return "slider";
+              return incoming_layout || "grid";
+            });
             const [get_suspense_is_blocked, set_suspense_is_blocked] = $9HbP8$createSignal(false);
             const block_suspense_if_needed = () => {
               if (!is_just_after_plp_results_update) return;
@@ -6626,6 +6630,7 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
             }, {
               defer: true
             }));
+            $9HbP8$createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $9HbP8$dwarn("Slider layout doesn't support content blocks"));
             /*
             This suspense ensures that if someone has async templates, we still show placeholders until the product cards actually have finished rendering (automagically since they're createResource's)
             We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -6714,9 +6719,8 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
                         } = 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_options_, {
+                        $9HbP8$createComponent(Layout, $9HbP8$mergeProps(layout_options_, {
+                          rows: "all",
                           get cols_at_size() {
                             return modified_cols_at_size();
                           },
@@ -7264,6 +7268,7 @@ function $cdea4cf8c5c071ef$export$d7841e452f2e59a8({
   expanded_hierarchical_filters_: expanded_hierarchical_filters_,
   number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
   set_sort_and_filter_element_: set_sort_and_filter_element_,
+  sort_and_filter_disabled_: sort_and_filter_disabled_,
   formatted_number_of_results_: formatted_number_of_results_,
   filter_button_width_: filter_button_width_,
   sort_button_width_: sort_button_width_,
@@ -7394,23 +7399,35 @@ function $cdea4cf8c5c071ef$export$d7841e452f2e59a8({
     })();
     get_extra_filters_button_?.(make_open_filters_button());
     get_extra_sorting_button_?.(make_open_sorting_button());
-    return (() => {
-      const _el$5 = $9HbP8$getNextElement($cdea4cf8c5c071ef$var$_tmpl$3),
-        _el$6 = _el$5.firstChild,
-        _el$7 = _el$6.firstChild,
-        _el$8 = _el$7.firstChild,
-        [_el$9, _co$] = $9HbP8$getNextMarker(_el$8.nextSibling),
-        _el$10 = _el$9.nextSibling,
-        [_el$11, _co$2] = $9HbP8$getNextMarker(_el$10.nextSibling),
-        _el$12 = _el$11.nextSibling,
-        [_el$13, _co$3] = $9HbP8$getNextMarker(_el$12.nextSibling);
-      const _ref$ = set_sort_and_filter_element_;
-      typeof _ref$ === "function" ? $9HbP8$use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
-      $9HbP8$insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
-      $9HbP8$insert(_el$7, () => middle_elements_?.(), _el$11, _co$2);
-      $9HbP8$insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
-      return _el$5;
-    })();
+    $9HbP8$createEffect(() => {
+      if (sort_and_filter_disabled_()) {
+        // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
+        set_filters_open(false);
+        set_sorting_open(false);
+      }
+    });
+    return $9HbP8$createComponent((0, $9HbP8$Show), {
+      get when() {
+        return !sort_and_filter_disabled_();
+      },
+      get children() {
+        const _el$5 = $9HbP8$getNextElement($cdea4cf8c5c071ef$var$_tmpl$3),
+          _el$6 = _el$5.firstChild,
+          _el$7 = _el$6.firstChild,
+          _el$8 = _el$7.firstChild,
+          [_el$9, _co$] = $9HbP8$getNextMarker(_el$8.nextSibling),
+          _el$10 = _el$9.nextSibling,
+          [_el$11, _co$2] = $9HbP8$getNextMarker(_el$10.nextSibling),
+          _el$12 = _el$11.nextSibling,
+          [_el$13, _co$3] = $9HbP8$getNextMarker(_el$12.nextSibling);
+        const _ref$ = set_sort_and_filter_element_;
+        typeof _ref$ === "function" ? $9HbP8$use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
+        $9HbP8$insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
+        $9HbP8$insert(_el$7, () => middle_elements_?.(), _el$11, _co$2);
+        $9HbP8$insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
+        return _el$5;
+      }
+    });
   };
   return $9HbP8$createComponent((0, $b7436a6d1fd64e3b$export$b69d0d92862de18b), {
     message_: "Sorting and filters failed",
@@ -8375,7 +8392,9 @@ function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
     i18n_: i18n_
   });
   const [sort_and_filter_element_, set_sort_and_filter_element_] = $9HbP8$createSignal();
+  // Sort and filter button
   const [results_filters, set_results_filters] = $9HbP8$createSignal();
+  // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
   const [observed_results_filters_elements, set_observed_results_filters_elements_] = $9HbP8$createSignal();
   const is_slim_ = $dc9262ef6f786812$export$d9f36cf74e24d595("(max-width:600px)");
   // @ts-ignore - there's no type error here when writing the code, but parcel can't generate types that include the symbol, so we need to suppress the error that creates in our pipelines
@@ -8454,6 +8473,7 @@ function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
     $9HbP8$report1(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
     results_for = $9HbP8$getNextElement($df5d81d0fe61ff21$var$_tmpl$2);
   }
+  const sort_and_filter_disabled_ = $9HbP8$createMemo(() => layout_options_().layout === "slider-without-filters");
   const filters_opener = $cdea4cf8c5c071ef$export$d7841e452f2e59a8({
     set_sort_or_filter_open_: set_sort_or_filter_open_,
     set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -8471,6 +8491,7 @@ function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
     local_filter_cache_: local_filter_cache_,
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     ...extra_sort_and_filter_args_
   });
   $9HbP8$catchify((0, $641bba2917fe862b$export$6e49da55e449af7c))({
@@ -8960,6 +8981,7 @@ function $961b5c64bef4662f$export$e2bf8ce7779e827e(props) {
       return newId;
     });
     $9HbP8$onCleanup(() => $d8dbf52fea1773e2$export$f50b88e2a00918b5(props.on_listing_query_change)());
+    const is_grid = $9HbP8$createMemo(() => props.layout === "grid");
     const grid_spacing_override = $9HbP8$createMemo(() => {
       const {
         grid_spacing: grid_spacing
@@ -9006,9 +9028,10 @@ function $961b5c64bef4662f$export$e2bf8ce7779e827e(props) {
         return depict_category.listing_query.type;
       }),
       i18n_: i18n_,
-      show_quicklinks_: $9HbP8$createMemo(() => props.show_quicklinks ?? true),
+      // default disable quicklinks and breadcrumbs for sliders
+      show_quicklinks_: $9HbP8$createMemo(() => props.show_quicklinks ?? is_grid()),
       category_title_: category_title,
-      show_breadcrumbs_: $9HbP8$createMemo(() => props.show_breadcrumbs ?? true),
+      show_breadcrumbs_: $9HbP8$createMemo(() => props.show_breadcrumbs ?? is_grid()),
       current_sorting_: current_sorting_,
       router_: router_,
       get_breadcrumb_accessor_: accessor => $9HbP8$createComputed(() => breadcrumb_signal_[1](accessor())),
@@ -9024,7 +9047,7 @@ function $961b5c64bef4662f$export$e2bf8ce7779e827e(props) {
       layout_options_: $9HbP8$createMemo(() => ({
         cols_at_size: $b5cccc8ee7d24677$export$6daf8749b65a1b77(props.cols_at_size),
         ...grid_spacing_override(),
-        layout: props.layout || "grid"
+        layout: props.layout
       })),
       product_card_template_: product_card_template,
       sorting_query_param_: sorting_query_param_,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "3.0.14",
+  "version": "3.0.16",
   "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",

package/server/ES10/index.cjs

@@ -83,7 +83,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 = "3.0.14";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "3.0.16";
 const $9d19451330d04c3c$var$_tmpl$ = ["<svg", ' xmlns="http://www.w3.org/2000/svg"', ' viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0" fill="#0f0f0f"></path></svg>'];
 function $9d19451330d04c3c$export$8be2714ec7f169ee() {
   var _$escape2, _$escape3;
@@ -5960,7 +5960,11 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
             product_card_template_: product_card_template_,
             num_placeholders_: num_placeholders_
           }) : undefined);
-          const layout = $3hooq$solidjs.createMemo(() => layout_options_().layout || "grid");
+          const layout = $3hooq$solidjs.createMemo(() => {
+            const incoming_layout = layout_options_().layout;
+            if (incoming_layout === "slider-without-filters") return "slider";
+            return incoming_layout || "grid";
+          });
           const [get_suspense_is_blocked, set_suspense_is_blocked] = $3hooq$solidjs.createSignal(false);
           const block_suspense_if_needed = () => {
             if (!is_just_after_plp_results_update) return;
@@ -5983,6 +5987,7 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
           }, {
             defer: true
           }));
+          $3hooq$solidjs.createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $3hooq$depictaiutilishared.dwarn("Slider layout doesn't support content blocks"));
           /*
           This suspense ensures that if someone has async templates, we still show placeholders until the product cards actually have finished rendering (automagically since they're createResource's)
           We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -6071,9 +6076,8 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
                       } = 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_options_, {
+                      $3hooq$solidjsweb.createComponent(Layout, $3hooq$solidjsweb.mergeProps(layout_options_, {
+                        rows: "all",
                         get cols_at_size() {
                           return modified_cols_at_size();
                         },
@@ -6379,6 +6383,7 @@ function $f70cc6dfcadf0fd5$export$d7841e452f2e59a8(_ref) {
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
     set_sort_and_filter_element_: set_sort_and_filter_element_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     formatted_number_of_results_: formatted_number_of_results_,
     filter_button_width_: filter_button_width_,
     sort_button_width_: sort_button_width_,
@@ -6521,7 +6526,21 @@ function $f70cc6dfcadf0fd5$export$d7841e452f2e59a8(_ref) {
     })();
     get_extra_filters_button_ === null || get_extra_filters_button_ === void 0 || get_extra_filters_button_(make_open_filters_button());
     get_extra_sorting_button_ === null || get_extra_sorting_button_ === void 0 || get_extra_sorting_button_(make_open_sorting_button());
-    return $3hooq$solidjsweb.ssr($f70cc6dfcadf0fd5$var$_tmpl$3, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.escape(make_open_filters_button(true, true)), $3hooq$solidjsweb.escape(middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_()), $3hooq$solidjsweb.escape(make_open_sorting_button(true, true)));
+    $3hooq$solidjs.createEffect(() => {
+      if (sort_and_filter_disabled_()) {
+        // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
+        set_filters_open(false);
+        set_sorting_open(false);
+      }
+    });
+    return $3hooq$solidjsweb.createComponent((0, $3hooq$solidjs.Show), {
+      get when() {
+        return !sort_and_filter_disabled_();
+      },
+      get children() {
+        return $3hooq$solidjsweb.ssr($f70cc6dfcadf0fd5$var$_tmpl$3, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.escape(make_open_filters_button(true, true)), $3hooq$solidjsweb.escape(middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_()), $3hooq$solidjsweb.escape(make_open_sorting_button(true, true)));
+      }
+    });
   };
   return $3hooq$solidjsweb.createComponent((0, $1b3cf201cdd38687$export$b69d0d92862de18b), {
     message_: "Sorting and filters failed",
@@ -7476,7 +7495,9 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
     i18n_: i18n_
   });
   const [sort_and_filter_element_, set_sort_and_filter_element_] = $3hooq$solidjs.createSignal();
+  // Sort and filter button
   const [results_filters, set_results_filters] = $3hooq$solidjs.createSignal();
+  // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
   const [observed_results_filters_elements, set_observed_results_filters_elements_] = $3hooq$solidjs.createSignal();
   const is_slim_ = $3e17e871e9d0911d$export$d9f36cf74e24d595("(max-width:600px)");
   // @ts-ignore - there's no type error here when writing the code, but parcel can't generate types that include the symbol, so we need to suppress the error that creates in our pipelines
@@ -7552,6 +7573,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
     $3hooq$depictaiutilisharedlatest.report(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
     results_for = $3hooq$solidjsweb.ssr($ede6c70ecdca46fe$var$_tmpl$2, $3hooq$solidjsweb.ssrHydrationKey());
   }
+  const sort_and_filter_disabled_ = $3hooq$solidjs.createMemo(() => layout_options_().layout === "slider-without-filters");
   const filters_opener = $f70cc6dfcadf0fd5$export$d7841e452f2e59a8({
     set_sort_or_filter_open_: set_sort_or_filter_open_,
     set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -7569,6 +7591,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
     local_filter_cache_: local_filter_cache_,
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     ...extra_sort_and_filter_args_
   });
   $3hooq$depictaiutilisharedlatest.catchify((0, $fef4890f1f8e0544$export$6e49da55e449af7c))({
@@ -8088,6 +8111,7 @@ function $9cbefc32b9dab36d$export$e2bf8ce7779e827e(props) {
       return newId;
     });
     $3hooq$solidjs.onCleanup(() => $bdea39a75c454f4f$export$f50b88e2a00918b5(props.on_listing_query_change)());
+    const is_grid = $3hooq$solidjs.createMemo(() => props.layout === "grid");
     const grid_spacing_override = $3hooq$solidjs.createMemo(() => {
       const {
         grid_spacing: grid_spacing
@@ -8134,14 +8158,15 @@ function $9cbefc32b9dab36d$export$e2bf8ce7779e827e(props) {
         return depict_category.listing_query.type;
       }),
       i18n_: i18n_,
+      // default disable quicklinks and breadcrumbs for sliders
       show_quicklinks_: $3hooq$solidjs.createMemo(() => {
         var _props$show_quicklink;
-        return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : true;
+        return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : is_grid();
       }),
       category_title_: category_title,
       show_breadcrumbs_: $3hooq$solidjs.createMemo(() => {
         var _props$show_breadcrum;
-        return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : true;
+        return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : is_grid();
       }),
       current_sorting_: current_sorting_,
       router_: router_,
@@ -8158,7 +8183,7 @@ function $9cbefc32b9dab36d$export$e2bf8ce7779e827e(props) {
       layout_options_: $3hooq$solidjs.createMemo(() => ({
         cols_at_size: $5401a6698b0c0658$export$6daf8749b65a1b77(props.cols_at_size),
         ...grid_spacing_override(),
-        layout: props.layout || "grid"
+        layout: props.layout
       })),
       product_card_template_: product_card_template,
       sorting_query_param_: sorting_query_param_,

package/server/ES10/index.d.ts

@@ -10,7 +10,7 @@ import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequ
 import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "3.0.14";
+export const version = "3.0.16";
 export type SDKColsAtSize = [number, number?][];
 /**
  * Transform SDK ColsAtSize into valid Layout ColsAtSize
@@ -74,6 +74,7 @@ export type SomethingTakingADisplayTransformers<InputDisplay extends Display, Ou
   page_url_creator?: never;
   display_transformers?: never;
 };
+type PossibleLayout = "grid" | "slider" | "slider-without-filters";
 export type BaseProviderConfig<InputDisplay extends Display, PossibleTransformedDisplay extends ModernDisplay | never> = {
   /**
    * The merchant to use for the search.
@@ -183,10 +184,13 @@ export interface BaseCategoryPageConfig extends BaseProductListingConfig {
    */
   showQuicklinks?: boolean;
   /**
-   * Whether to show the listing in a grid or a slider.
+   * The layout used for listing the products.
+   *     1. `"grid"` is the default and shows the products in a grid
+   *     2. `"slider"` shows the products in a slider and has default `false` for showBreadcrumbs and showQuicklinks
+   *     3. `"slider-without-filters"` is the same as `"slider"` but does also not render any sorting or filter buttons
    * @default "grid"
    */
-  layout?: "grid" | "slider";
+  layout?: PossibleLayout;
 }
 /**
  * The listing to query Depict for. `type` can be `"listingId"` or `"externalId"` and `id` is the actual id.

package/server/ES10/index.js

@@ -10,7 +10,7 @@ import { createStore as $b8hua$createStore, reconcile as $b8hua$reconcile } from
 /*! 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 = "3.0.14";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "3.0.16";
 const $ca6ab5f08bd28bca$var$_tmpl$ = ["<svg", ' xmlns="http://www.w3.org/2000/svg"', ' viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0" fill="#0f0f0f"></path></svg>'];
 function $ca6ab5f08bd28bca$export$8be2714ec7f169ee() {
   var _$escape2, _$escape3;
@@ -5887,7 +5887,11 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
             product_card_template_: product_card_template_,
             num_placeholders_: num_placeholders_
           }) : undefined);
-          const layout = $b8hua$createMemo(() => layout_options_().layout || "grid");
+          const layout = $b8hua$createMemo(() => {
+            const incoming_layout = layout_options_().layout;
+            if (incoming_layout === "slider-without-filters") return "slider";
+            return incoming_layout || "grid";
+          });
           const [get_suspense_is_blocked, set_suspense_is_blocked] = $b8hua$createSignal(false);
           const block_suspense_if_needed = () => {
             if (!is_just_after_plp_results_update) return;
@@ -5910,6 +5914,7 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
           }, {
             defer: true
           }));
+          $b8hua$createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $b8hua$dwarn("Slider layout doesn't support content blocks"));
           /*
           This suspense ensures that if someone has async templates, we still show placeholders until the product cards actually have finished rendering (automagically since they're createResource's)
           We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -5998,9 +6003,8 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
                       } = 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_options_, {
+                      $b8hua$createComponent(Layout, $b8hua$mergeProps(layout_options_, {
+                        rows: "all",
                         get cols_at_size() {
                           return modified_cols_at_size();
                         },
@@ -6306,6 +6310,7 @@ function $7396052a1484264f$export$d7841e452f2e59a8(_ref) {
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
     set_sort_and_filter_element_: set_sort_and_filter_element_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     formatted_number_of_results_: formatted_number_of_results_,
     filter_button_width_: filter_button_width_,
     sort_button_width_: sort_button_width_,
@@ -6448,7 +6453,21 @@ function $7396052a1484264f$export$d7841e452f2e59a8(_ref) {
     })();
     get_extra_filters_button_ === null || get_extra_filters_button_ === void 0 || get_extra_filters_button_(make_open_filters_button());
     get_extra_sorting_button_ === null || get_extra_sorting_button_ === void 0 || get_extra_sorting_button_(make_open_sorting_button());
-    return $b8hua$ssr($7396052a1484264f$var$_tmpl$3, $b8hua$ssrHydrationKey(), $b8hua$escape(make_open_filters_button(true, true)), $b8hua$escape(middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_()), $b8hua$escape(make_open_sorting_button(true, true)));
+    $b8hua$createEffect(() => {
+      if (sort_and_filter_disabled_()) {
+        // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
+        set_filters_open(false);
+        set_sorting_open(false);
+      }
+    });
+    return $b8hua$createComponent((0, $b8hua$Show), {
+      get when() {
+        return !sort_and_filter_disabled_();
+      },
+      get children() {
+        return $b8hua$ssr($7396052a1484264f$var$_tmpl$3, $b8hua$ssrHydrationKey(), $b8hua$escape(make_open_filters_button(true, true)), $b8hua$escape(middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_()), $b8hua$escape(make_open_sorting_button(true, true)));
+      }
+    });
   };
   return $b8hua$createComponent((0, $74777e8fe65b3dcb$export$b69d0d92862de18b), {
     message_: "Sorting and filters failed",
@@ -7403,7 +7422,9 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
     i18n_: i18n_
   });
   const [sort_and_filter_element_, set_sort_and_filter_element_] = $b8hua$createSignal();
+  // Sort and filter button
   const [results_filters, set_results_filters] = $b8hua$createSignal();
+  // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
   const [observed_results_filters_elements, set_observed_results_filters_elements_] = $b8hua$createSignal();
   const is_slim_ = $00a5b94f0c11efbb$export$d9f36cf74e24d595("(max-width:600px)");
   // @ts-ignore - there's no type error here when writing the code, but parcel can't generate types that include the symbol, so we need to suppress the error that creates in our pipelines
@@ -7479,6 +7500,7 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
     $b8hua$report1(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
     results_for = $b8hua$ssr($4b4b262708b516ee$var$_tmpl$2, $b8hua$ssrHydrationKey());
   }
+  const sort_and_filter_disabled_ = $b8hua$createMemo(() => layout_options_().layout === "slider-without-filters");
   const filters_opener = $7396052a1484264f$export$d7841e452f2e59a8({
     set_sort_or_filter_open_: set_sort_or_filter_open_,
     set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -7496,6 +7518,7 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
     local_filter_cache_: local_filter_cache_,
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     ...extra_sort_and_filter_args_
   });
   $b8hua$catchify((0, $5e6abec0dab4e610$export$6e49da55e449af7c))({
@@ -8015,6 +8038,7 @@ function $f5f54892fd0c7d9f$export$e2bf8ce7779e827e(props) {
       return newId;
     });
     $b8hua$onCleanup(() => $01c33966d9ddb108$export$f50b88e2a00918b5(props.on_listing_query_change)());
+    const is_grid = $b8hua$createMemo(() => props.layout === "grid");
     const grid_spacing_override = $b8hua$createMemo(() => {
       const {
         grid_spacing: grid_spacing
@@ -8061,14 +8085,15 @@ function $f5f54892fd0c7d9f$export$e2bf8ce7779e827e(props) {
         return depict_category.listing_query.type;
       }),
       i18n_: i18n_,
+      // default disable quicklinks and breadcrumbs for sliders
       show_quicklinks_: $b8hua$createMemo(() => {
         var _props$show_quicklink;
-        return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : true;
+        return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : is_grid();
       }),
       category_title_: category_title,
       show_breadcrumbs_: $b8hua$createMemo(() => {
         var _props$show_breadcrum;
-        return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : true;
+        return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : is_grid();
       }),
       current_sorting_: current_sorting_,
       router_: router_,
@@ -8085,7 +8110,7 @@ function $f5f54892fd0c7d9f$export$e2bf8ce7779e827e(props) {
       layout_options_: $b8hua$createMemo(() => ({
         cols_at_size: $a9c7ba6087881ac2$export$6daf8749b65a1b77(props.cols_at_size),
         ...grid_spacing_override(),
-        layout: props.layout || "grid"
+        layout: props.layout
       })),
       product_card_template_: product_card_template,
       sorting_query_param_: sorting_query_param_,

package/server/latest/index.cjs

@@ -77,7 +77,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 = "3.0.14";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "3.0.16";
 const $0f313083912e447a$var$_tmpl$ = ["<svg", ' xmlns="http://www.w3.org/2000/svg"', ' viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0" fill="#0f0f0f"></path></svg>'];
 function $0f313083912e447a$export$8be2714ec7f169ee(props = {}) {
   return $5vyXB$solidjsweb.ssr($0f313083912e447a$var$_tmpl$, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("width", $5vyXB$solidjsweb.escape(props.width_, true) ?? 14, false) + $5vyXB$solidjsweb.ssrAttribute("height", $5vyXB$solidjsweb.escape(props.height_, true) ?? 26, false));
@@ -5559,7 +5559,11 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
             product_card_template_: product_card_template_,
             num_placeholders_: num_placeholders_
           }) : undefined);
-          const layout = $5vyXB$solidjs.createMemo(() => layout_options_().layout || "grid");
+          const layout = $5vyXB$solidjs.createMemo(() => {
+            const incoming_layout = layout_options_().layout;
+            if (incoming_layout === "slider-without-filters") return "slider";
+            return incoming_layout || "grid";
+          });
           const [get_suspense_is_blocked, set_suspense_is_blocked] = $5vyXB$solidjs.createSignal(false);
           const block_suspense_if_needed = () => {
             if (!is_just_after_plp_results_update) return;
@@ -5582,6 +5586,7 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
           }, {
             defer: true
           }));
+          $5vyXB$solidjs.createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $5vyXB$depictaiutilishared.dwarn("Slider layout doesn't support content blocks"));
           /*
           This suspense ensures that if someone has async templates, we still show placeholders until the product cards actually have finished rendering (automagically since they're createResource's)
           We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -5670,9 +5675,8 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
                       } = 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_options_, {
+                      $5vyXB$solidjsweb.createComponent(Layout, $5vyXB$solidjsweb.mergeProps(layout_options_, {
+                        rows: "all",
                         get cols_at_size() {
                           return modified_cols_at_size();
                         },
@@ -5958,6 +5962,7 @@ function $f8f64d05c525825b$export$d7841e452f2e59a8({
   expanded_hierarchical_filters_: expanded_hierarchical_filters_,
   number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
   set_sort_and_filter_element_: set_sort_and_filter_element_,
+  sort_and_filter_disabled_: sort_and_filter_disabled_,
   formatted_number_of_results_: formatted_number_of_results_,
   filter_button_width_: filter_button_width_,
   sort_button_width_: sort_button_width_,
@@ -6080,7 +6085,21 @@ function $f8f64d05c525825b$export$d7841e452f2e59a8({
     })();
     get_extra_filters_button_?.(make_open_filters_button());
     get_extra_sorting_button_?.(make_open_sorting_button());
-    return $5vyXB$solidjsweb.ssr($f8f64d05c525825b$var$_tmpl$3, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.escape(make_open_filters_button(true, true)), $5vyXB$solidjsweb.escape(middle_elements_?.()), $5vyXB$solidjsweb.escape(make_open_sorting_button(true, true)));
+    $5vyXB$solidjs.createEffect(() => {
+      if (sort_and_filter_disabled_()) {
+        // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
+        set_filters_open(false);
+        set_sorting_open(false);
+      }
+    });
+    return $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
+      get when() {
+        return !sort_and_filter_disabled_();
+      },
+      get children() {
+        return $5vyXB$solidjsweb.ssr($f8f64d05c525825b$var$_tmpl$3, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.escape(make_open_filters_button(true, true)), $5vyXB$solidjsweb.escape(middle_elements_?.()), $5vyXB$solidjsweb.escape(make_open_sorting_button(true, true)));
+      }
+    });
   };
   return $5vyXB$solidjsweb.createComponent((0, $edafe91daf3091d7$export$b69d0d92862de18b), {
     message_: "Sorting and filters failed",
@@ -6973,7 +6992,9 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
     i18n_: i18n_
   });
   const [sort_and_filter_element_, set_sort_and_filter_element_] = $5vyXB$solidjs.createSignal();
+  // Sort and filter button
   const [results_filters, set_results_filters] = $5vyXB$solidjs.createSignal();
+  // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
   const [observed_results_filters_elements, set_observed_results_filters_elements_] = $5vyXB$solidjs.createSignal();
   const is_slim_ = $b54e6192d0caa293$export$d9f36cf74e24d595("(max-width:600px)");
   // @ts-ignore - there's no type error here when writing the code, but parcel can't generate types that include the symbol, so we need to suppress the error that creates in our pipelines
@@ -7042,6 +7063,7 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
     $5vyXB$depictaiutilisharedlatest.report(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
     results_for = $5vyXB$solidjsweb.ssr($840d88a04b2d22a7$var$_tmpl$2, $5vyXB$solidjsweb.ssrHydrationKey());
   }
+  const sort_and_filter_disabled_ = $5vyXB$solidjs.createMemo(() => layout_options_().layout === "slider-without-filters");
   const filters_opener = $f8f64d05c525825b$export$d7841e452f2e59a8({
     set_sort_or_filter_open_: set_sort_or_filter_open_,
     set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -7059,6 +7081,7 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
     local_filter_cache_: local_filter_cache_,
     expanded_hierarchical_filters_: expanded_hierarchical_filters_,
     number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
+    sort_and_filter_disabled_: sort_and_filter_disabled_,
     ...extra_sort_and_filter_args_
   });
   $5vyXB$depictaiutilisharedlatest.catchify((0, $276380e4607fb9fb$export$6e49da55e449af7c))({
@@ -7504,6 +7527,7 @@ function $48567ac5b39bac56$export$e2bf8ce7779e827e(props) {
       return newId;
     });
     $5vyXB$solidjs.onCleanup(() => $deaaf04362a1bc71$export$f50b88e2a00918b5(props.on_listing_query_change)());
+    const is_grid = $5vyXB$solidjs.createMemo(() => props.layout === "grid");
     const grid_spacing_override = $5vyXB$solidjs.createMemo(() => {
       const {
         grid_spacing: grid_spacing
@@ -7550,9 +7574,10 @@ function $48567ac5b39bac56$export$e2bf8ce7779e827e(props) {
         return depict_category.listing_query.type;
       }),
       i18n_: i18n_,
-      show_quicklinks_: $5vyXB$solidjs.createMemo(() => props.show_quicklinks ?? true),
+      // default disable quicklinks and breadcrumbs for sliders
+      show_quicklinks_: $5vyXB$solidjs.createMemo(() => props.show_quicklinks ?? is_grid()),
       category_title_: category_title,
-      show_breadcrumbs_: $5vyXB$solidjs.createMemo(() => props.show_breadcrumbs ?? true),
+      show_breadcrumbs_: $5vyXB$solidjs.createMemo(() => props.show_breadcrumbs ?? is_grid()),
       current_sorting_: current_sorting_,
       router_: router_,
       get_breadcrumb_accessor_: accessor => $5vyXB$solidjs.createComputed(() => breadcrumb_signal_[1](accessor())),
@@ -7568,7 +7593,7 @@ function $48567ac5b39bac56$export$e2bf8ce7779e827e(props) {
       layout_options_: $5vyXB$solidjs.createMemo(() => ({
         cols_at_size: $4e04be41243c3d80$export$6daf8749b65a1b77(props.cols_at_size),
         ...grid_spacing_override(),
-        layout: props.layout || "grid"
+        layout: props.layout
       })),
       product_card_template_: product_card_template,
       sorting_query_param_: sorting_query_param_,

package/server/latest/index.d.ts

@@ -10,7 +10,7 @@ import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequ
 import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "3.0.14";
+export const version = "3.0.16";
 export type SDKColsAtSize = [number, number?][];
 /**
  * Transform SDK ColsAtSize into valid Layout ColsAtSize
@@ -74,6 +74,7 @@ export type SomethingTakingADisplayTransformers<InputDisplay extends Display, Ou
   page_url_creator?: never;
   display_transformers?: never;
 };
+type PossibleLayout = "grid" | "slider" | "slider-without-filters";
 export type BaseProviderConfig<InputDisplay extends Display, PossibleTransformedDisplay extends ModernDisplay | never> = {
   /**
    * The merchant to use for the search.
@@ -183,10 +184,13 @@ export interface BaseCategoryPageConfig extends BaseProductListingConfig {
    */
   showQuicklinks?: boolean;
   /**
-   * Whether to show the listing in a grid or a slider.
+   * The layout used for listing the products.
+   *     1. `"grid"` is the default and shows the products in a grid
+   *     2. `"slider"` shows the products in a slider and has default `false` for showBreadcrumbs and showQuicklinks
+   *     3. `"slider-without-filters"` is the same as `"slider"` but does also not render any sorting or filter buttons
    * @default "grid"
    */
-  layout?: "grid" | "slider";
+  layout?: PossibleLayout;
 }
 /**
  * The listing to query Depict for. `type` can be `"listingId"` or `"externalId"` and `id` is the actual id.