@depict-ai/ui 3.0.15 → 3.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/ES10/index.cjs CHANGED
@@ -83,7 +83,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $33eed84f447aa0c0$expo
83
83
  $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $33eed84f447aa0c0$export$7bf543b9d9be2c22);
84
84
  $parcel$export(module.exports, "version", () => $aa1938dec50d6c12$export$83d89fbfd8236492);
85
85
  /*! Depict.ai search and product listing SDK */
86
- const $aa1938dec50d6c12$export$83d89fbfd8236492 = "3.0.15";
86
+ const $aa1938dec50d6c12$export$83d89fbfd8236492 = "3.0.17";
87
87
  const $9d19451330d04c3c$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.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>`);
88
88
  function $9d19451330d04c3c$export$8be2714ec7f169ee() {
89
89
  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -7117,7 +7117,11 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
7117
7117
  product_card_template_: product_card_template_,
7118
7118
  num_placeholders_: num_placeholders_
7119
7119
  }) : undefined);
7120
- const layout = $52FdA$solidjs.createMemo(() => layout_options_().layout || "grid");
7120
+ const layout = $52FdA$solidjs.createMemo(() => {
7121
+ const incoming_layout = layout_options_().layout;
7122
+ if (incoming_layout === "slider-without-filters") return "slider";
7123
+ return incoming_layout || "grid";
7124
+ });
7121
7125
  const [get_suspense_is_blocked, set_suspense_is_blocked] = $52FdA$solidjs.createSignal(false);
7122
7126
  const block_suspense_if_needed = () => {
7123
7127
  if (!is_just_after_plp_results_update) return;
@@ -7140,7 +7144,7 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
7140
7144
  }, {
7141
7145
  defer: true
7142
7146
  }));
7143
- $52FdA$solidjs.createEffect(() => layout() === "slider" && !doesnt_have_content_blocks() && $52FdA$depictaiutilishared.dwarn("Slider layout doesn't support content blocks yet"));
7147
+ $52FdA$solidjs.createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $52FdA$depictaiutilishared.dwarn("Slider layout doesn't support content blocks"));
7144
7148
  /*
7145
7149
  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)
7146
7150
  We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -7229,9 +7233,8 @@ function $484eec37514a982e$export$3925f87b1545cfc6(_ref) {
7229
7233
  } = slider;
7230
7234
  const Layout = props => $6c2c739b113a8ddf$export$445d8d3f5f706a40(props, insert_here, true);
7231
7235
  // Do like this, so we don't have to call mergeProps ourselves
7232
- $52FdA$solidjsweb.createComponent(Layout, $52FdA$solidjsweb.mergeProps({
7233
- rows: "all"
7234
- }, layout_options_, {
7236
+ $52FdA$solidjsweb.createComponent(Layout, $52FdA$solidjsweb.mergeProps(layout_options_, {
7237
+ rows: "all",
7235
7238
  get cols_at_size() {
7236
7239
  return modified_cols_at_size();
7237
7240
  },
@@ -7804,6 +7807,7 @@ function $f70cc6dfcadf0fd5$export$d7841e452f2e59a8(_ref) {
7804
7807
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
7805
7808
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
7806
7809
  set_sort_and_filter_element_: set_sort_and_filter_element_,
7810
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
7807
7811
  formatted_number_of_results_: formatted_number_of_results_,
7808
7812
  filter_button_width_: filter_button_width_,
7809
7813
  sort_button_width_: sort_button_width_,
@@ -7954,23 +7958,35 @@ function $f70cc6dfcadf0fd5$export$d7841e452f2e59a8(_ref) {
7954
7958
  })();
7955
7959
  get_extra_filters_button_ === null || get_extra_filters_button_ === void 0 || get_extra_filters_button_(make_open_filters_button());
7956
7960
  get_extra_sorting_button_ === null || get_extra_sorting_button_ === void 0 || get_extra_sorting_button_(make_open_sorting_button());
7957
- return (() => {
7958
- const _el$5 = $52FdA$solidjsweb.getNextElement($f70cc6dfcadf0fd5$var$_tmpl$3),
7959
- _el$6 = _el$5.firstChild,
7960
- _el$7 = _el$6.firstChild,
7961
- _el$8 = _el$7.firstChild,
7962
- [_el$9, _co$] = $52FdA$solidjsweb.getNextMarker(_el$8.nextSibling),
7963
- _el$10 = _el$9.nextSibling,
7964
- [_el$11, _co$2] = $52FdA$solidjsweb.getNextMarker(_el$10.nextSibling),
7965
- _el$12 = _el$11.nextSibling,
7966
- [_el$13, _co$3] = $52FdA$solidjsweb.getNextMarker(_el$12.nextSibling);
7967
- const _ref$ = set_sort_and_filter_element_;
7968
- typeof _ref$ === "function" ? $52FdA$solidjsweb.use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7969
- $52FdA$solidjsweb.insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7970
- $52FdA$solidjsweb.insert(_el$7, () => middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_(), _el$11, _co$2);
7971
- $52FdA$solidjsweb.insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7972
- return _el$5;
7973
- })();
7961
+ $52FdA$solidjs.createEffect(() => {
7962
+ if (sort_and_filter_disabled_ !== null && sort_and_filter_disabled_ !== void 0 && sort_and_filter_disabled_()) {
7963
+ // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
7964
+ set_filters_open(false);
7965
+ set_sorting_open(false);
7966
+ }
7967
+ });
7968
+ return $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Show), {
7969
+ get when() {
7970
+ return !(sort_and_filter_disabled_ !== null && sort_and_filter_disabled_ !== void 0 && sort_and_filter_disabled_());
7971
+ },
7972
+ get children() {
7973
+ const _el$5 = $52FdA$solidjsweb.getNextElement($f70cc6dfcadf0fd5$var$_tmpl$3),
7974
+ _el$6 = _el$5.firstChild,
7975
+ _el$7 = _el$6.firstChild,
7976
+ _el$8 = _el$7.firstChild,
7977
+ [_el$9, _co$] = $52FdA$solidjsweb.getNextMarker(_el$8.nextSibling),
7978
+ _el$10 = _el$9.nextSibling,
7979
+ [_el$11, _co$2] = $52FdA$solidjsweb.getNextMarker(_el$10.nextSibling),
7980
+ _el$12 = _el$11.nextSibling,
7981
+ [_el$13, _co$3] = $52FdA$solidjsweb.getNextMarker(_el$12.nextSibling);
7982
+ const _ref$ = set_sort_and_filter_element_;
7983
+ typeof _ref$ === "function" ? $52FdA$solidjsweb.use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7984
+ $52FdA$solidjsweb.insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7985
+ $52FdA$solidjsweb.insert(_el$7, () => middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_(), _el$11, _co$2);
7986
+ $52FdA$solidjsweb.insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7987
+ return _el$5;
7988
+ }
7989
+ });
7974
7990
  };
7975
7991
  return $52FdA$solidjsweb.createComponent((0, $1b3cf201cdd38687$export$b69d0d92862de18b), {
7976
7992
  message_: "Sorting and filters failed",
@@ -9007,7 +9023,9 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
9007
9023
  i18n_: i18n_
9008
9024
  });
9009
9025
  const [sort_and_filter_element_, set_sort_and_filter_element_] = $52FdA$solidjs.createSignal();
9026
+ // Sort and filter button
9010
9027
  const [results_filters, set_results_filters] = $52FdA$solidjs.createSignal();
9028
+ // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
9011
9029
  const [observed_results_filters_elements, set_observed_results_filters_elements_] = $52FdA$solidjs.createSignal();
9012
9030
  const is_slim_ = $3e17e871e9d0911d$export$d9f36cf74e24d595("(max-width:600px)");
9013
9031
  // @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
@@ -9093,6 +9111,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
9093
9111
  $52FdA$depictaiutilisharedlatest.report(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
9094
9112
  results_for = $52FdA$solidjsweb.getNextElement($ede6c70ecdca46fe$var$_tmpl$2);
9095
9113
  }
9114
+ const sort_and_filter_disabled_ = $52FdA$solidjs.createMemo(() => layout_options_().layout === "slider-without-filters");
9096
9115
  const filters_opener = $f70cc6dfcadf0fd5$export$d7841e452f2e59a8({
9097
9116
  set_sort_or_filter_open_: set_sort_or_filter_open_,
9098
9117
  set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -9110,6 +9129,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
9110
9129
  local_filter_cache_: local_filter_cache_,
9111
9130
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
9112
9131
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
9132
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
9113
9133
  ...extra_sort_and_filter_args_
9114
9134
  });
9115
9135
  $52FdA$depictaiutilisharedlatest.catchify((0, $fef4890f1f8e0544$export$6e49da55e449af7c))({
@@ -9673,7 +9693,7 @@ function $9cbefc32b9dab36d$export$e2bf8ce7779e827e(props) {
9673
9693
  return newId;
9674
9694
  });
9675
9695
  $52FdA$solidjs.onCleanup(() => $bdea39a75c454f4f$export$f50b88e2a00918b5(props.on_listing_query_change)());
9676
- const is_slider = $52FdA$solidjs.createMemo(() => props.layout === "slider");
9696
+ const is_grid = $52FdA$solidjs.createMemo(() => props.layout === "grid");
9677
9697
  const grid_spacing_override = $52FdA$solidjs.createMemo(() => {
9678
9698
  const {
9679
9699
  grid_spacing: grid_spacing
@@ -9723,12 +9743,12 @@ function $9cbefc32b9dab36d$export$e2bf8ce7779e827e(props) {
9723
9743
  // default disable quicklinks and breadcrumbs for sliders
9724
9744
  show_quicklinks_: $52FdA$solidjs.createMemo(() => {
9725
9745
  var _props$show_quicklink;
9726
- return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : !is_slider();
9746
+ return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : is_grid();
9727
9747
  }),
9728
9748
  category_title_: category_title,
9729
9749
  show_breadcrumbs_: $52FdA$solidjs.createMemo(() => {
9730
9750
  var _props$show_breadcrum;
9731
- return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : !is_slider();
9751
+ return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : is_grid();
9732
9752
  }),
9733
9753
  current_sorting_: current_sorting_,
9734
9754
  router_: router_,
package/ES10/index.d.ts CHANGED
@@ -10,7 +10,7 @@ import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequ
10
10
  import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
11
11
  import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
12
12
  import { SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/SearchRequestV2";
13
- export const version = "3.0.15";
13
+ export const version = "3.0.17";
14
14
  export type SDKColsAtSize = [number, number?][];
15
15
  /**
16
16
  * Transform SDK ColsAtSize into valid Layout ColsAtSize
@@ -74,6 +74,7 @@ export type SomethingTakingADisplayTransformers<InputDisplay extends Display, Ou
74
74
  page_url_creator?: never;
75
75
  display_transformers?: never;
76
76
  };
77
+ type PossibleLayout = "grid" | "slider" | "slider-without-filters";
77
78
  export type BaseProviderConfig<InputDisplay extends Display, PossibleTransformedDisplay extends ModernDisplay | never> = {
78
79
  /**
79
80
  * The merchant to use for the search.
@@ -183,10 +184,13 @@ export interface BaseCategoryPageConfig extends BaseProductListingConfig {
183
184
  */
184
185
  showQuicklinks?: boolean;
185
186
  /**
186
- * Whether to show the listing in a grid or a slider.
187
+ * The layout used for listing the products.
188
+ * 1. `"grid"` is the default and shows the products in a grid
189
+ * 2. `"slider"` shows the products in a slider and has default `false` for showBreadcrumbs and showQuicklinks
190
+ * 3. `"slider-without-filters"` is the same as `"slider"` but does also not render any sorting or filter buttons
187
191
  * @default "grid"
188
192
  */
189
- layout?: "grid" | "slider";
193
+ layout?: PossibleLayout;
190
194
  }
191
195
  /**
192
196
  * The listing to query Depict for. `type` can be `"listingId"` or `"externalId"` and `id` is the actual id.
@@ -970,7 +974,7 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
970
974
  category_title: typeof CategoryTitle | typeof embedded_num_products;
971
975
  on_listing_query_change?: (new_listing_query?: ListingQuery | undefined, old_listing_query?: ListingQuery | undefined) => void;
972
976
  content_blocks_by_row?: ContentBlocksByRow;
973
- layout?: "slider" | "grid";
977
+ layout?: PossibleLayout;
974
978
  }): import("@depict-ai/utilishared/latest").Node_Array;
975
979
  export function BreadCrumbs<T extends Display>({
976
980
  depict_category
package/ES10/index.js CHANGED
@@ -10,7 +10,7 @@ import { createStore as $8tj43$createStore, reconcile as $8tj43$reconcile } from
10
10
  /*! Depict.ai search and product listing SDK */
11
11
  import { register_es_version } from "../multi_import_deduplicator.mjs";
12
12
  register_es_version("ui", "ES10");
13
- const $8db9a15135765c11$export$83d89fbfd8236492 = "3.0.15";
13
+ const $8db9a15135765c11$export$83d89fbfd8236492 = "3.0.17";
14
14
  const $ca6ab5f08bd28bca$var$_tmpl$ = /*#__PURE__*/$8tj43$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>`);
15
15
  function $ca6ab5f08bd28bca$export$8be2714ec7f169ee() {
16
16
  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -7044,7 +7044,11 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
7044
7044
  product_card_template_: product_card_template_,
7045
7045
  num_placeholders_: num_placeholders_
7046
7046
  }) : undefined);
7047
- const layout = $8tj43$createMemo(() => layout_options_().layout || "grid");
7047
+ const layout = $8tj43$createMemo(() => {
7048
+ const incoming_layout = layout_options_().layout;
7049
+ if (incoming_layout === "slider-without-filters") return "slider";
7050
+ return incoming_layout || "grid";
7051
+ });
7048
7052
  const [get_suspense_is_blocked, set_suspense_is_blocked] = $8tj43$createSignal(false);
7049
7053
  const block_suspense_if_needed = () => {
7050
7054
  if (!is_just_after_plp_results_update) return;
@@ -7067,7 +7071,7 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
7067
7071
  }, {
7068
7072
  defer: true
7069
7073
  }));
7070
- $8tj43$createEffect(() => layout() === "slider" && !doesnt_have_content_blocks() && $8tj43$dwarn("Slider layout doesn't support content blocks yet"));
7074
+ $8tj43$createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $8tj43$dwarn("Slider layout doesn't support content blocks"));
7071
7075
  /*
7072
7076
  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)
7073
7077
  We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -7156,9 +7160,8 @@ function $7faea0096f14b59b$export$3925f87b1545cfc6(_ref) {
7156
7160
  } = slider;
7157
7161
  const Layout = props => $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, insert_here, true);
7158
7162
  // Do like this, so we don't have to call mergeProps ourselves
7159
- $8tj43$createComponent(Layout, $8tj43$mergeProps({
7160
- rows: "all"
7161
- }, layout_options_, {
7163
+ $8tj43$createComponent(Layout, $8tj43$mergeProps(layout_options_, {
7164
+ rows: "all",
7162
7165
  get cols_at_size() {
7163
7166
  return modified_cols_at_size();
7164
7167
  },
@@ -7731,6 +7734,7 @@ function $7396052a1484264f$export$d7841e452f2e59a8(_ref) {
7731
7734
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
7732
7735
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
7733
7736
  set_sort_and_filter_element_: set_sort_and_filter_element_,
7737
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
7734
7738
  formatted_number_of_results_: formatted_number_of_results_,
7735
7739
  filter_button_width_: filter_button_width_,
7736
7740
  sort_button_width_: sort_button_width_,
@@ -7881,23 +7885,35 @@ function $7396052a1484264f$export$d7841e452f2e59a8(_ref) {
7881
7885
  })();
7882
7886
  get_extra_filters_button_ === null || get_extra_filters_button_ === void 0 || get_extra_filters_button_(make_open_filters_button());
7883
7887
  get_extra_sorting_button_ === null || get_extra_sorting_button_ === void 0 || get_extra_sorting_button_(make_open_sorting_button());
7884
- return (() => {
7885
- const _el$5 = $8tj43$getNextElement($7396052a1484264f$var$_tmpl$3),
7886
- _el$6 = _el$5.firstChild,
7887
- _el$7 = _el$6.firstChild,
7888
- _el$8 = _el$7.firstChild,
7889
- [_el$9, _co$] = $8tj43$getNextMarker(_el$8.nextSibling),
7890
- _el$10 = _el$9.nextSibling,
7891
- [_el$11, _co$2] = $8tj43$getNextMarker(_el$10.nextSibling),
7892
- _el$12 = _el$11.nextSibling,
7893
- [_el$13, _co$3] = $8tj43$getNextMarker(_el$12.nextSibling);
7894
- const _ref$ = set_sort_and_filter_element_;
7895
- typeof _ref$ === "function" ? $8tj43$use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7896
- $8tj43$insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7897
- $8tj43$insert(_el$7, () => middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_(), _el$11, _co$2);
7898
- $8tj43$insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7899
- return _el$5;
7900
- })();
7888
+ $8tj43$createEffect(() => {
7889
+ if (sort_and_filter_disabled_ !== null && sort_and_filter_disabled_ !== void 0 && sort_and_filter_disabled_()) {
7890
+ // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
7891
+ set_filters_open(false);
7892
+ set_sorting_open(false);
7893
+ }
7894
+ });
7895
+ return $8tj43$createComponent((0, $8tj43$Show), {
7896
+ get when() {
7897
+ return !(sort_and_filter_disabled_ !== null && sort_and_filter_disabled_ !== void 0 && sort_and_filter_disabled_());
7898
+ },
7899
+ get children() {
7900
+ const _el$5 = $8tj43$getNextElement($7396052a1484264f$var$_tmpl$3),
7901
+ _el$6 = _el$5.firstChild,
7902
+ _el$7 = _el$6.firstChild,
7903
+ _el$8 = _el$7.firstChild,
7904
+ [_el$9, _co$] = $8tj43$getNextMarker(_el$8.nextSibling),
7905
+ _el$10 = _el$9.nextSibling,
7906
+ [_el$11, _co$2] = $8tj43$getNextMarker(_el$10.nextSibling),
7907
+ _el$12 = _el$11.nextSibling,
7908
+ [_el$13, _co$3] = $8tj43$getNextMarker(_el$12.nextSibling);
7909
+ const _ref$ = set_sort_and_filter_element_;
7910
+ typeof _ref$ === "function" ? $8tj43$use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7911
+ $8tj43$insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7912
+ $8tj43$insert(_el$7, () => middle_elements_ === null || middle_elements_ === void 0 ? void 0 : middle_elements_(), _el$11, _co$2);
7913
+ $8tj43$insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7914
+ return _el$5;
7915
+ }
7916
+ });
7901
7917
  };
7902
7918
  return $8tj43$createComponent((0, $74777e8fe65b3dcb$export$b69d0d92862de18b), {
7903
7919
  message_: "Sorting and filters failed",
@@ -8934,7 +8950,9 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
8934
8950
  i18n_: i18n_
8935
8951
  });
8936
8952
  const [sort_and_filter_element_, set_sort_and_filter_element_] = $8tj43$createSignal();
8953
+ // Sort and filter button
8937
8954
  const [results_filters, set_results_filters] = $8tj43$createSignal();
8955
+ // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
8938
8956
  const [observed_results_filters_elements, set_observed_results_filters_elements_] = $8tj43$createSignal();
8939
8957
  const is_slim_ = $00a5b94f0c11efbb$export$d9f36cf74e24d595("(max-width:600px)");
8940
8958
  // @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
@@ -9020,6 +9038,7 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
9020
9038
  $8tj43$report1(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
9021
9039
  results_for = $8tj43$getNextElement($4b4b262708b516ee$var$_tmpl$2);
9022
9040
  }
9041
+ const sort_and_filter_disabled_ = $8tj43$createMemo(() => layout_options_().layout === "slider-without-filters");
9023
9042
  const filters_opener = $7396052a1484264f$export$d7841e452f2e59a8({
9024
9043
  set_sort_or_filter_open_: set_sort_or_filter_open_,
9025
9044
  set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -9037,6 +9056,7 @@ function $4b4b262708b516ee$export$f7d2f673fc2f091d(_ref) {
9037
9056
  local_filter_cache_: local_filter_cache_,
9038
9057
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
9039
9058
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
9059
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
9040
9060
  ...extra_sort_and_filter_args_
9041
9061
  });
9042
9062
  $8tj43$catchify((0, $5e6abec0dab4e610$export$6e49da55e449af7c))({
@@ -9600,7 +9620,7 @@ function $f5f54892fd0c7d9f$export$e2bf8ce7779e827e(props) {
9600
9620
  return newId;
9601
9621
  });
9602
9622
  $8tj43$onCleanup(() => $01c33966d9ddb108$export$f50b88e2a00918b5(props.on_listing_query_change)());
9603
- const is_slider = $8tj43$createMemo(() => props.layout === "slider");
9623
+ const is_grid = $8tj43$createMemo(() => props.layout === "grid");
9604
9624
  const grid_spacing_override = $8tj43$createMemo(() => {
9605
9625
  const {
9606
9626
  grid_spacing: grid_spacing
@@ -9650,12 +9670,12 @@ function $f5f54892fd0c7d9f$export$e2bf8ce7779e827e(props) {
9650
9670
  // default disable quicklinks and breadcrumbs for sliders
9651
9671
  show_quicklinks_: $8tj43$createMemo(() => {
9652
9672
  var _props$show_quicklink;
9653
- return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : !is_slider();
9673
+ return (_props$show_quicklink = props.show_quicklinks) !== null && _props$show_quicklink !== void 0 ? _props$show_quicklink : is_grid();
9654
9674
  }),
9655
9675
  category_title_: category_title,
9656
9676
  show_breadcrumbs_: $8tj43$createMemo(() => {
9657
9677
  var _props$show_breadcrum;
9658
- return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : !is_slider();
9678
+ return (_props$show_breadcrum = props.show_breadcrumbs) !== null && _props$show_breadcrum !== void 0 ? _props$show_breadcrum : is_grid();
9659
9679
  }),
9660
9680
  current_sorting_: current_sorting_,
9661
9681
  router_: router_,
package/latest/index.cjs CHANGED
@@ -77,7 +77,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $a3280f0aad997933$expo
77
77
  $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad997933$export$7bf543b9d9be2c22);
78
78
  $parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
79
79
  /*! Depict.ai search and product listing SDK */
80
- const $b757f75811f3261f$export$83d89fbfd8236492 = "3.0.15";
80
+ const $b757f75811f3261f$export$83d89fbfd8236492 = "3.0.17";
81
81
  const $0f313083912e447a$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.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>`);
82
82
  function $0f313083912e447a$export$8be2714ec7f169ee(props = {}) {
83
83
  return (() => {
@@ -6673,7 +6673,11 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
6673
6673
  product_card_template_: product_card_template_,
6674
6674
  num_placeholders_: num_placeholders_
6675
6675
  }) : undefined);
6676
- const layout = $gVhhF$solidjs.createMemo(() => layout_options_().layout || "grid");
6676
+ const layout = $gVhhF$solidjs.createMemo(() => {
6677
+ const incoming_layout = layout_options_().layout;
6678
+ if (incoming_layout === "slider-without-filters") return "slider";
6679
+ return incoming_layout || "grid";
6680
+ });
6677
6681
  const [get_suspense_is_blocked, set_suspense_is_blocked] = $gVhhF$solidjs.createSignal(false);
6678
6682
  const block_suspense_if_needed = () => {
6679
6683
  if (!is_just_after_plp_results_update) return;
@@ -6696,7 +6700,7 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
6696
6700
  }, {
6697
6701
  defer: true
6698
6702
  }));
6699
- $gVhhF$solidjs.createEffect(() => layout() === "slider" && !doesnt_have_content_blocks() && $gVhhF$depictaiutilishared.dwarn("Slider layout doesn't support content blocks yet"));
6703
+ $gVhhF$solidjs.createEffect(() => layout() !== "grid" && !doesnt_have_content_blocks() && $gVhhF$depictaiutilishared.dwarn("Slider layout doesn't support content blocks"));
6700
6704
  /*
6701
6705
  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)
6702
6706
  We're creating it outside the <Show> so that we can benefit from <For>'s optimisation between changing results
@@ -6785,9 +6789,8 @@ function $fe76fb463cc60b89$export$3925f87b1545cfc6({
6785
6789
  } = slider;
6786
6790
  const Layout = props => $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, insert_here, true);
6787
6791
  // Do like this, so we don't have to call mergeProps ourselves
6788
- $gVhhF$solidjsweb.createComponent(Layout, $gVhhF$solidjsweb.mergeProps({
6789
- rows: "all"
6790
- }, layout_options_, {
6792
+ $gVhhF$solidjsweb.createComponent(Layout, $gVhhF$solidjsweb.mergeProps(layout_options_, {
6793
+ rows: "all",
6791
6794
  get cols_at_size() {
6792
6795
  return modified_cols_at_size();
6793
6796
  },
@@ -7335,6 +7338,7 @@ function $f8f64d05c525825b$export$d7841e452f2e59a8({
7335
7338
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
7336
7339
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
7337
7340
  set_sort_and_filter_element_: set_sort_and_filter_element_,
7341
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
7338
7342
  formatted_number_of_results_: formatted_number_of_results_,
7339
7343
  filter_button_width_: filter_button_width_,
7340
7344
  sort_button_width_: sort_button_width_,
@@ -7465,23 +7469,35 @@ function $f8f64d05c525825b$export$d7841e452f2e59a8({
7465
7469
  })();
7466
7470
  get_extra_filters_button_?.(make_open_filters_button());
7467
7471
  get_extra_sorting_button_?.(make_open_sorting_button());
7468
- return (() => {
7469
- const _el$5 = $gVhhF$solidjsweb.getNextElement($f8f64d05c525825b$var$_tmpl$3),
7470
- _el$6 = _el$5.firstChild,
7471
- _el$7 = _el$6.firstChild,
7472
- _el$8 = _el$7.firstChild,
7473
- [_el$9, _co$] = $gVhhF$solidjsweb.getNextMarker(_el$8.nextSibling),
7474
- _el$10 = _el$9.nextSibling,
7475
- [_el$11, _co$2] = $gVhhF$solidjsweb.getNextMarker(_el$10.nextSibling),
7476
- _el$12 = _el$11.nextSibling,
7477
- [_el$13, _co$3] = $gVhhF$solidjsweb.getNextMarker(_el$12.nextSibling);
7478
- const _ref$ = set_sort_and_filter_element_;
7479
- typeof _ref$ === "function" ? $gVhhF$solidjsweb.use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7480
- $gVhhF$solidjsweb.insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7481
- $gVhhF$solidjsweb.insert(_el$7, () => middle_elements_?.(), _el$11, _co$2);
7482
- $gVhhF$solidjsweb.insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7483
- return _el$5;
7484
- })();
7472
+ $gVhhF$solidjs.createEffect(() => {
7473
+ if (sort_and_filter_disabled_?.()) {
7474
+ // If someone changes the layout to slider-without-filters dynamically, close sorting and filters
7475
+ set_filters_open(false);
7476
+ set_sorting_open(false);
7477
+ }
7478
+ });
7479
+ return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
7480
+ get when() {
7481
+ return !sort_and_filter_disabled_?.();
7482
+ },
7483
+ get children() {
7484
+ const _el$5 = $gVhhF$solidjsweb.getNextElement($f8f64d05c525825b$var$_tmpl$3),
7485
+ _el$6 = _el$5.firstChild,
7486
+ _el$7 = _el$6.firstChild,
7487
+ _el$8 = _el$7.firstChild,
7488
+ [_el$9, _co$] = $gVhhF$solidjsweb.getNextMarker(_el$8.nextSibling),
7489
+ _el$10 = _el$9.nextSibling,
7490
+ [_el$11, _co$2] = $gVhhF$solidjsweb.getNextMarker(_el$10.nextSibling),
7491
+ _el$12 = _el$11.nextSibling,
7492
+ [_el$13, _co$3] = $gVhhF$solidjsweb.getNextMarker(_el$12.nextSibling);
7493
+ const _ref$ = set_sort_and_filter_element_;
7494
+ typeof _ref$ === "function" ? $gVhhF$solidjsweb.use(_ref$, _el$5) : set_sort_and_filter_element_ = _el$5;
7495
+ $gVhhF$solidjsweb.insert(_el$7, () => make_open_filters_button(true, true), _el$9, _co$);
7496
+ $gVhhF$solidjsweb.insert(_el$7, () => middle_elements_?.(), _el$11, _co$2);
7497
+ $gVhhF$solidjsweb.insert(_el$7, () => make_open_sorting_button(true, true), _el$13, _co$3);
7498
+ return _el$5;
7499
+ }
7500
+ });
7485
7501
  };
7486
7502
  return $gVhhF$solidjsweb.createComponent((0, $edafe91daf3091d7$export$b69d0d92862de18b), {
7487
7503
  message_: "Sorting and filters failed",
@@ -8446,7 +8462,9 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
8446
8462
  i18n_: i18n_
8447
8463
  });
8448
8464
  const [sort_and_filter_element_, set_sort_and_filter_element_] = $gVhhF$solidjs.createSignal();
8465
+ // Sort and filter button
8449
8466
  const [results_filters, set_results_filters] = $gVhhF$solidjs.createSignal();
8467
+ // Cloned, invisible sort and filter button used for measuring the minimum size of the buttons if using embedded_num_products
8450
8468
  const [observed_results_filters_elements, set_observed_results_filters_elements_] = $gVhhF$solidjs.createSignal();
8451
8469
  const is_slim_ = $b54e6192d0caa293$export$d9f36cf74e24d595("(max-width:600px)");
8452
8470
  // @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
@@ -8525,6 +8543,7 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
8525
8543
  $gVhhF$depictaiutilisharedlatest.report(new Error("Unrecognised category_title_type, UI will look messed up"), "error");
8526
8544
  results_for = $gVhhF$solidjsweb.getNextElement($840d88a04b2d22a7$var$_tmpl$2);
8527
8545
  }
8546
+ const sort_and_filter_disabled_ = $gVhhF$solidjs.createMemo(() => layout_options_().layout === "slider-without-filters");
8528
8547
  const filters_opener = $f8f64d05c525825b$export$d7841e452f2e59a8({
8529
8548
  set_sort_or_filter_open_: set_sort_or_filter_open_,
8530
8549
  set_extra_els_in_results_container_: set_desktop_filter_elements,
@@ -8542,6 +8561,7 @@ function $840d88a04b2d22a7$export$f7d2f673fc2f091d({
8542
8561
  local_filter_cache_: local_filter_cache_,
8543
8562
  expanded_hierarchical_filters_: expanded_hierarchical_filters_,
8544
8563
  number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
8564
+ sort_and_filter_disabled_: sort_and_filter_disabled_,
8545
8565
  ...extra_sort_and_filter_args_
8546
8566
  });
8547
8567
  $gVhhF$depictaiutilisharedlatest.catchify((0, $276380e4607fb9fb$export$6e49da55e449af7c))({
@@ -9031,7 +9051,7 @@ function $48567ac5b39bac56$export$e2bf8ce7779e827e(props) {
9031
9051
  return newId;
9032
9052
  });
9033
9053
  $gVhhF$solidjs.onCleanup(() => $deaaf04362a1bc71$export$f50b88e2a00918b5(props.on_listing_query_change)());
9034
- const is_slider = $gVhhF$solidjs.createMemo(() => props.layout === "slider");
9054
+ const is_grid = $gVhhF$solidjs.createMemo(() => props.layout === "grid");
9035
9055
  const grid_spacing_override = $gVhhF$solidjs.createMemo(() => {
9036
9056
  const {
9037
9057
  grid_spacing: grid_spacing
@@ -9079,9 +9099,9 @@ function $48567ac5b39bac56$export$e2bf8ce7779e827e(props) {
9079
9099
  }),
9080
9100
  i18n_: i18n_,
9081
9101
  // default disable quicklinks and breadcrumbs for sliders
9082
- show_quicklinks_: $gVhhF$solidjs.createMemo(() => props.show_quicklinks ?? !is_slider()),
9102
+ show_quicklinks_: $gVhhF$solidjs.createMemo(() => props.show_quicklinks ?? is_grid()),
9083
9103
  category_title_: category_title,
9084
- show_breadcrumbs_: $gVhhF$solidjs.createMemo(() => props.show_breadcrumbs ?? !is_slider()),
9104
+ show_breadcrumbs_: $gVhhF$solidjs.createMemo(() => props.show_breadcrumbs ?? is_grid()),
9085
9105
  current_sorting_: current_sorting_,
9086
9106
  router_: router_,
9087
9107
  get_breadcrumb_accessor_: accessor => $gVhhF$solidjs.createComputed(() => breadcrumb_signal_[1](accessor())),
package/latest/index.d.ts CHANGED
@@ -10,7 +10,7 @@ import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequ
10
10
  import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
11
11
  import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
12
12
  import { SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/SearchRequestV2";
13
- export const version = "3.0.15";
13
+ export const version = "3.0.17";
14
14
  export type SDKColsAtSize = [number, number?][];
15
15
  /**
16
16
  * Transform SDK ColsAtSize into valid Layout ColsAtSize
@@ -74,6 +74,7 @@ export type SomethingTakingADisplayTransformers<InputDisplay extends Display, Ou
74
74
  page_url_creator?: never;
75
75
  display_transformers?: never;
76
76
  };
77
+ type PossibleLayout = "grid" | "slider" | "slider-without-filters";
77
78
  export type BaseProviderConfig<InputDisplay extends Display, PossibleTransformedDisplay extends ModernDisplay | never> = {
78
79
  /**
79
80
  * The merchant to use for the search.
@@ -183,10 +184,13 @@ export interface BaseCategoryPageConfig extends BaseProductListingConfig {
183
184
  */
184
185
  showQuicklinks?: boolean;
185
186
  /**
186
- * Whether to show the listing in a grid or a slider.
187
+ * The layout used for listing the products.
188
+ * 1. `"grid"` is the default and shows the products in a grid
189
+ * 2. `"slider"` shows the products in a slider and has default `false` for showBreadcrumbs and showQuicklinks
190
+ * 3. `"slider-without-filters"` is the same as `"slider"` but does also not render any sorting or filter buttons
187
191
  * @default "grid"
188
192
  */
189
- layout?: "grid" | "slider";
193
+ layout?: PossibleLayout;
190
194
  }
191
195
  /**
192
196
  * The listing to query Depict for. `type` can be `"listingId"` or `"externalId"` and `id` is the actual id.
@@ -970,7 +974,7 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
970
974
  category_title: typeof CategoryTitle | typeof embedded_num_products;
971
975
  on_listing_query_change?: (new_listing_query?: ListingQuery | undefined, old_listing_query?: ListingQuery | undefined) => void;
972
976
  content_blocks_by_row?: ContentBlocksByRow;
973
- layout?: "slider" | "grid";
977
+ layout?: PossibleLayout;
974
978
  }): import("@depict-ai/utilishared/latest").Node_Array;
975
979
  export function BreadCrumbs<T extends Display>({
976
980
  depict_category