@depict-ai/ui 4.10.18 → 4.10.19

package/ES10/index.cjs

@@ -115,7 +115,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $335c02c1241a9ca8$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $335c02c1241a9ca8$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $c10e33c4681f8c9b$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.18";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.19";
 function $3e17e871e9d0911d$export$d9f36cf74e24d595(media_query) {
   const signal = $52FdA$solidjs.createSignal(false);
   $52FdA$solidjs.onCleanup($52FdA$depictaiutilishared.javascript_media_query(media_query, _ref => {
@@ -8253,7 +8253,8 @@ async function $8e8c89c02c16dc7b$export$5d2f6cd705125cd3() {
   return hlsModule;
 }
 var $c19709057a32b2e7$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<video class=d-standard-content>`),
-  $c19709057a32b2e7$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<span class=d-standard-content-text>`);
+  $c19709057a32b2e7$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class=d-standard-content-text-group><span class=d-standard-content-text></span><span class=d-standard-content-cta>`),
+  $c19709057a32b2e7$var$_tmpl$3 = /*#__PURE__*/$52FdA$solidjsweb.template(`<span class=d-standard-content-text>`);
 function $c19709057a32b2e7$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -8264,7 +8265,8 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
     aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
     imageResizer_: imageResizer_,
     text_: text_,
-    textPosition_: textPosition_
+    textPosition_: textPosition_,
+    cta_: cta_
   } = _ref;
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $52FdA$solidjs.createSignal();
@@ -8371,15 +8373,44 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
       }), $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Show), {
         when: text_,
         get children() {
-          var _el$2 = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$2);
-          $52FdA$solidjsweb.setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
-          $52FdA$solidjsweb.insert(_el$2, text_);
-          return _el$2;
+          return $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Show), {
+            when: cta_,
+            get fallback() {
+              return (() => {
+                var _el$5 = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$3);
+                $52FdA$solidjsweb.setAttribute(_el$5, "data-position", textPosition_ || "bottom-center");
+                $52FdA$solidjsweb.insert(_el$5, text_);
+                return _el$5;
+              })();
+            },
+            get children() {
+              var _el$2 = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$2),
+                _el$3 = _el$2.firstChild,
+                _el$4 = _el$3.nextSibling;
+              $52FdA$solidjsweb.setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
+              $52FdA$solidjsweb.setAttribute(_el$3, "data-position", textPosition_ || "bottom-center");
+              $52FdA$solidjsweb.insert(_el$3, text_);
+              $52FdA$solidjsweb.setAttribute(_el$4, "data-position", textPosition_ || "bottom-center");
+              $52FdA$solidjsweb.insert(_el$4, cta_);
+              return _el$2;
+            }
+          });
         }
       })];
     }
   }));
 }
+const $0c035bbe7e30b438$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null, cta !== null && cta !== void 0 ? cta : null]);
+};
 function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -8417,13 +8448,11 @@ function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null]);
+      const componentCacheKey = $0c035bbe7e30b438$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -8443,7 +8472,8 @@ function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/ES10/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.10.18";
+export const version = "4.10.19";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/ES10/index.js

@@ -10,7 +10,7 @@ import $8tj43$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpe
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.18";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.19";
 function $00a5b94f0c11efbb$export$d9f36cf74e24d595(media_query) {
   const signal = $8tj43$createSignal(false);
   $8tj43$onCleanup($8tj43$javascript_media_query(media_query, _ref => {
@@ -8148,7 +8148,8 @@ async function $e92c154db502596d$export$5d2f6cd705125cd3() {
   return hlsModule;
 }
 var $3b772ef9a35560fe$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<video class=d-standard-content>`),
-  $3b772ef9a35560fe$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<span class=d-standard-content-text>`);
+  $3b772ef9a35560fe$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class=d-standard-content-text-group><span class=d-standard-content-text></span><span class=d-standard-content-cta>`),
+  $3b772ef9a35560fe$var$_tmpl$3 = /*#__PURE__*/$8tj43$template(`<span class=d-standard-content-text>`);
 function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -8159,7 +8160,8 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
     aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
     imageResizer_: imageResizer_,
     text_: text_,
-    textPosition_: textPosition_
+    textPosition_: textPosition_,
+    cta_: cta_
   } = _ref;
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $8tj43$createSignal();
@@ -8266,15 +8268,44 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
       }), $8tj43$createComponent((0, $8tj43$Show), {
         when: text_,
         get children() {
-          var _el$2 = $8tj43$getNextElement($3b772ef9a35560fe$var$_tmpl$2);
-          $8tj43$setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
-          $8tj43$insert(_el$2, text_);
-          return _el$2;
+          return $8tj43$createComponent((0, $8tj43$Show), {
+            when: cta_,
+            get fallback() {
+              return (() => {
+                var _el$5 = $8tj43$getNextElement($3b772ef9a35560fe$var$_tmpl$3);
+                $8tj43$setAttribute(_el$5, "data-position", textPosition_ || "bottom-center");
+                $8tj43$insert(_el$5, text_);
+                return _el$5;
+              })();
+            },
+            get children() {
+              var _el$2 = $8tj43$getNextElement($3b772ef9a35560fe$var$_tmpl$2),
+                _el$3 = _el$2.firstChild,
+                _el$4 = _el$3.nextSibling;
+              $8tj43$setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
+              $8tj43$setAttribute(_el$3, "data-position", textPosition_ || "bottom-center");
+              $8tj43$insert(_el$3, text_);
+              $8tj43$setAttribute(_el$4, "data-position", textPosition_ || "bottom-center");
+              $8tj43$insert(_el$4, cta_);
+              return _el$2;
+            }
+          });
         }
       })];
     }
   }));
 }
+const $12ff24fdc4b26d88$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null, cta !== null && cta !== void 0 ? cta : null]);
+};
 function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -8312,13 +8343,11 @@ function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null]);
+      const componentCacheKey = $12ff24fdc4b26d88$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -8338,7 +8367,8 @@ function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/latest/index.cjs

@@ -109,7 +109,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $1f4925833f07df29$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $1f4925833f07df29$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $14f289047713d67a$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.18";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.19";
 function $b54e6192d0caa293$export$d9f36cf74e24d595(media_query) {
   const signal = $gVhhF$solidjs.createSignal(false);
   $gVhhF$solidjs.onCleanup($gVhhF$depictaiutilishared.javascript_media_query(media_query, ({
@@ -7816,7 +7816,8 @@ async function $20ff40266d725403$export$5d2f6cd705125cd3() {
   return hlsModule;
 }
 var $32c662f618f5d80d$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<video class=d-standard-content>`),
-  $32c662f618f5d80d$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<span class=d-standard-content-text>`);
+  $32c662f618f5d80d$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=d-standard-content-text-group><span class=d-standard-content-text></span><span class=d-standard-content-cta>`),
+  $32c662f618f5d80d$var$_tmpl$3 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<span class=d-standard-content-text>`);
 function $32c662f618f5d80d$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -7826,7 +7827,8 @@ function $32c662f618f5d80d$export$780a853d15174484({
   aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
   imageResizer_: imageResizer_,
   text_: text_,
-  textPosition_: textPosition_
+  textPosition_: textPosition_,
+  cta_: cta_
 }) {
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $gVhhF$solidjs.createSignal();
@@ -7927,15 +7929,44 @@ function $32c662f618f5d80d$export$780a853d15174484({
       }), $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
         when: text_,
         get children() {
-          var _el$2 = $gVhhF$solidjsweb.getNextElement($32c662f618f5d80d$var$_tmpl$2);
-          $gVhhF$solidjsweb.setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
-          $gVhhF$solidjsweb.insert(_el$2, text_);
-          return _el$2;
+          return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
+            when: cta_,
+            get fallback() {
+              return (() => {
+                var _el$5 = $gVhhF$solidjsweb.getNextElement($32c662f618f5d80d$var$_tmpl$3);
+                $gVhhF$solidjsweb.setAttribute(_el$5, "data-position", textPosition_ || "bottom-center");
+                $gVhhF$solidjsweb.insert(_el$5, text_);
+                return _el$5;
+              })();
+            },
+            get children() {
+              var _el$2 = $gVhhF$solidjsweb.getNextElement($32c662f618f5d80d$var$_tmpl$2),
+                _el$3 = _el$2.firstChild,
+                _el$4 = _el$3.nextSibling;
+              $gVhhF$solidjsweb.setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
+              $gVhhF$solidjsweb.setAttribute(_el$3, "data-position", textPosition_ || "bottom-center");
+              $gVhhF$solidjsweb.insert(_el$3, text_);
+              $gVhhF$solidjsweb.setAttribute(_el$4, "data-position", textPosition_ || "bottom-center");
+              $gVhhF$solidjsweb.insert(_el$4, cta_);
+              return _el$2;
+            }
+          });
         }
       })];
     }
   }));
 }
+const $0a80939bf0a1e9cc$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text ?? null, text_position ?? null, cta ?? null]);
+};
 function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -7972,13 +8003,11 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text ?? null, text_position ?? null]);
+      const componentCacheKey = $0a80939bf0a1e9cc$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -7998,7 +8027,8 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/latest/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.10.18";
+export const version = "4.10.19";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

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 = "4.10.18";
+const $ec291e0010116877$export$83d89fbfd8236492 = "4.10.19";
 function $dc9262ef6f786812$export$d9f36cf74e24d595(media_query) {
   const signal = $9HbP8$createSignal(false);
   $9HbP8$onCleanup($9HbP8$javascript_media_query(media_query, ({
@@ -7714,7 +7714,8 @@ async function $e422ea9eccb7892b$export$5d2f6cd705125cd3() {
   return hlsModule;
 }
 var $f916989c4b1be9f7$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<video class=d-standard-content>`),
-  $f916989c4b1be9f7$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span class=d-standard-content-text>`);
+  $f916989c4b1be9f7$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=d-standard-content-text-group><span class=d-standard-content-text></span><span class=d-standard-content-cta>`),
+  $f916989c4b1be9f7$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<span class=d-standard-content-text>`);
 function $f916989c4b1be9f7$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -7724,7 +7725,8 @@ function $f916989c4b1be9f7$export$780a853d15174484({
   aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
   imageResizer_: imageResizer_,
   text_: text_,
-  textPosition_: textPosition_
+  textPosition_: textPosition_,
+  cta_: cta_
 }) {
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $9HbP8$createSignal();
@@ -7825,15 +7827,44 @@ function $f916989c4b1be9f7$export$780a853d15174484({
       }), $9HbP8$createComponent((0, $9HbP8$Show), {
         when: text_,
         get children() {
-          var _el$2 = $9HbP8$getNextElement($f916989c4b1be9f7$var$_tmpl$2);
-          $9HbP8$setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
-          $9HbP8$insert(_el$2, text_);
-          return _el$2;
+          return $9HbP8$createComponent((0, $9HbP8$Show), {
+            when: cta_,
+            get fallback() {
+              return (() => {
+                var _el$5 = $9HbP8$getNextElement($f916989c4b1be9f7$var$_tmpl$3);
+                $9HbP8$setAttribute(_el$5, "data-position", textPosition_ || "bottom-center");
+                $9HbP8$insert(_el$5, text_);
+                return _el$5;
+              })();
+            },
+            get children() {
+              var _el$2 = $9HbP8$getNextElement($f916989c4b1be9f7$var$_tmpl$2),
+                _el$3 = _el$2.firstChild,
+                _el$4 = _el$3.nextSibling;
+              $9HbP8$setAttribute(_el$2, "data-position", textPosition_ || "bottom-center");
+              $9HbP8$setAttribute(_el$3, "data-position", textPosition_ || "bottom-center");
+              $9HbP8$insert(_el$3, text_);
+              $9HbP8$setAttribute(_el$4, "data-position", textPosition_ || "bottom-center");
+              $9HbP8$insert(_el$4, cta_);
+              return _el$2;
+            }
+          });
         }
       })];
     }
   }));
 }
+const $486360b09f0d5729$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text ?? null, text_position ?? null, cta ?? null]);
+};
 function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -7870,13 +7901,11 @@ function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text ?? null, text_position ?? null]);
+      const componentCacheKey = $486360b09f0d5729$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -7896,7 +7925,8 @@ function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "4.10.18",
+  "version": "4.10.19",
   "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": "^7.22.6",
     "@babel/runtime-corejs3": "^7.22.6",
-    "@depict-ai/plp-styling": "^4.6.10",
-    "@depict-ai/types": "^5.6.8",
-    "@depict-ai/utilishared": "^2.6.8",
+    "@depict-ai/plp-styling": "^4.6.11",
+    "@depict-ai/types": "^5.6.9",
+    "@depict-ai/utilishared": "^2.6.9",
     "solid-js": "^1.9.10"
   },
   "type": "module",

package/server/ES10/index.cjs

@@ -115,7 +115,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $335c02c1241a9ca8$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $335c02c1241a9ca8$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $c10e33c4681f8c9b$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.18";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.10.19";
 function $3e17e871e9d0911d$export$d9f36cf74e24d595(media_query) {
   const signal = $3hooq$solidjs.createSignal(false);
   $3hooq$solidjs.onCleanup($3hooq$depictaiutilishared.javascript_media_query(media_query, _ref => {
@@ -6744,7 +6744,8 @@ function $f3db423dc84bc35d$export$140423fa4bfb6d63(props) {
   }));
 }
 var $c19709057a32b2e7$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'],
-  $c19709057a32b2e7$var$_tmpl$2 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
+  $c19709057a32b2e7$var$_tmpl$2 = ["<div", ' class="d-standard-content-text-group"', '><span class="d-standard-content-text"', ">", '</span><span class="d-standard-content-cta"', ">", "</span></div>"],
+  $c19709057a32b2e7$var$_tmpl$3 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
 function $c19709057a32b2e7$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -6755,7 +6756,8 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
     aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
     imageResizer_: imageResizer_,
     text_: text_,
-    textPosition_: textPosition_
+    textPosition_: textPosition_,
+    cta_: cta_
   } = _ref;
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $3hooq$solidjs.createSignal();
@@ -6823,12 +6825,31 @@ function $c19709057a32b2e7$export$780a853d15174484(_ref) {
       }), $3hooq$solidjsweb.createComponent((0, $3hooq$solidjs.Show), {
         when: text_,
         get children() {
-          return $3hooq$solidjsweb.ssr($c19709057a32b2e7$var$_tmpl$2, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.ssrAttribute("data-position", $3hooq$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $3hooq$solidjsweb.escape(text_));
+          return $3hooq$solidjsweb.createComponent((0, $3hooq$solidjs.Show), {
+            when: cta_,
+            get fallback() {
+              return $3hooq$solidjsweb.ssr($c19709057a32b2e7$var$_tmpl$3, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.ssrAttribute("data-position", $3hooq$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $3hooq$solidjsweb.escape(text_));
+            },
+            get children() {
+              return $3hooq$solidjsweb.ssr($c19709057a32b2e7$var$_tmpl$2, $3hooq$solidjsweb.ssrHydrationKey(), $3hooq$solidjsweb.ssrAttribute("data-position", $3hooq$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $3hooq$solidjsweb.ssrAttribute("data-position", $3hooq$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $3hooq$solidjsweb.escape(text_), $3hooq$solidjsweb.ssrAttribute("data-position", $3hooq$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $3hooq$solidjsweb.escape(cta_));
+            }
+          });
         }
       })];
     }
   }));
 }
+const $0c035bbe7e30b438$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null, cta !== null && cta !== void 0 ? cta : null]);
+};
 function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -6866,13 +6887,11 @@ function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null]);
+      const componentCacheKey = $0c035bbe7e30b438$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -6892,7 +6911,8 @@ function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/server/ES10/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.10.18";
+export const version = "4.10.19";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/server/ES10/index.js

@@ -10,7 +10,7 @@ import $b8hua$babelruntimehelpersclassPrivateFieldGet from "@babel/runtime/helpe
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.18";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.10.19";
 function $00a5b94f0c11efbb$export$d9f36cf74e24d595(media_query) {
   const signal = $b8hua$createSignal(false);
   $b8hua$onCleanup($b8hua$javascript_media_query(media_query, _ref => {
@@ -6639,7 +6639,8 @@ function $98688279b9059f50$export$140423fa4bfb6d63(props) {
   }));
 }
 var $3b772ef9a35560fe$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'],
-  $3b772ef9a35560fe$var$_tmpl$2 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
+  $3b772ef9a35560fe$var$_tmpl$2 = ["<div", ' class="d-standard-content-text-group"', '><span class="d-standard-content-text"', ">", '</span><span class="d-standard-content-cta"', ">", "</span></div>"],
+  $3b772ef9a35560fe$var$_tmpl$3 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
 function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
   let {
     link_: link_,
@@ -6650,7 +6651,8 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
     aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
     imageResizer_: imageResizer_,
     text_: text_,
-    textPosition_: textPosition_
+    textPosition_: textPosition_,
+    cta_: cta_
   } = _ref;
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $b8hua$createSignal();
@@ -6718,12 +6720,31 @@ function $3b772ef9a35560fe$export$780a853d15174484(_ref) {
       }), $b8hua$createComponent((0, $b8hua$Show), {
         when: text_,
         get children() {
-          return $b8hua$ssr($3b772ef9a35560fe$var$_tmpl$2, $b8hua$ssrHydrationKey(), $b8hua$ssrAttribute("data-position", $b8hua$escape(textPosition_, true) || "bottom-center", false), $b8hua$escape(text_));
+          return $b8hua$createComponent((0, $b8hua$Show), {
+            when: cta_,
+            get fallback() {
+              return $b8hua$ssr($3b772ef9a35560fe$var$_tmpl$3, $b8hua$ssrHydrationKey(), $b8hua$ssrAttribute("data-position", $b8hua$escape(textPosition_, true) || "bottom-center", false), $b8hua$escape(text_));
+            },
+            get children() {
+              return $b8hua$ssr($3b772ef9a35560fe$var$_tmpl$2, $b8hua$ssrHydrationKey(), $b8hua$ssrAttribute("data-position", $b8hua$escape(textPosition_, true) || "bottom-center", false), $b8hua$ssrAttribute("data-position", $b8hua$escape(textPosition_, true) || "bottom-center", false), $b8hua$escape(text_), $b8hua$ssrAttribute("data-position", $b8hua$escape(textPosition_, true) || "bottom-center", false), $b8hua$escape(cta_));
+            }
+          });
         }
       })];
     }
   }));
 }
+const $12ff24fdc4b26d88$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null, cta !== null && cta !== void 0 ? cta : null]);
+};
 function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -6761,13 +6782,11 @@ function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text !== null && text !== void 0 ? text : null, text_position !== null && text_position !== void 0 ? text_position : null]);
+      const componentCacheKey = $12ff24fdc4b26d88$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -6787,7 +6806,8 @@ function $12ff24fdc4b26d88$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/server/latest/index.cjs

@@ -109,7 +109,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $1f4925833f07df29$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $1f4925833f07df29$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $14f289047713d67a$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.18";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.10.19";
 function $b54e6192d0caa293$export$d9f36cf74e24d595(media_query) {
   const signal = $5vyXB$solidjs.createSignal(false);
   $5vyXB$solidjs.onCleanup($5vyXB$depictaiutilishared.javascript_media_query(media_query, ({
@@ -6363,7 +6363,8 @@ function $d212a67662c5cf38$export$140423fa4bfb6d63(props) {
   }));
 }
 var $32c662f618f5d80d$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'],
-  $32c662f618f5d80d$var$_tmpl$2 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
+  $32c662f618f5d80d$var$_tmpl$2 = ["<div", ' class="d-standard-content-text-group"', '><span class="d-standard-content-text"', ">", '</span><span class="d-standard-content-cta"', ">", "</span></div>"],
+  $32c662f618f5d80d$var$_tmpl$3 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
 function $32c662f618f5d80d$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -6373,7 +6374,8 @@ function $32c662f618f5d80d$export$780a853d15174484({
   aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
   imageResizer_: imageResizer_,
   text_: text_,
-  textPosition_: textPosition_
+  textPosition_: textPosition_,
+  cta_: cta_
 }) {
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $5vyXB$solidjs.createSignal();
@@ -6435,12 +6437,31 @@ function $32c662f618f5d80d$export$780a853d15174484({
       }), $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
         when: text_,
         get children() {
-          return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$2, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_));
+          return $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
+            when: cta_,
+            get fallback() {
+              return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$3, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_));
+            },
+            get children() {
+              return $5vyXB$solidjsweb.ssr($32c662f618f5d80d$var$_tmpl$2, $5vyXB$solidjsweb.ssrHydrationKey(), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(text_), $5vyXB$solidjsweb.ssrAttribute("data-position", $5vyXB$solidjsweb.escape(textPosition_, true) || "bottom-center", false), $5vyXB$solidjsweb.escape(cta_));
+            }
+          });
         }
       })];
     }
   }));
 }
+const $0a80939bf0a1e9cc$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text ?? null, text_position ?? null, cta ?? null]);
+};
 function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -6477,13 +6498,11 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text ?? null, text_position ?? null]);
+      const componentCacheKey = $0a80939bf0a1e9cc$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -6503,7 +6522,8 @@ function $0a80939bf0a1e9cc$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }

package/server/latest/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.10.18";
+export const version = "4.10.19";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/server/latest/index.js

@@ -7,7 +7,7 @@ import { createStore as $i7OB2$createStore, reconcile as $i7OB2$reconcile } from
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("ui", "latest");
-const $ec291e0010116877$export$83d89fbfd8236492 = "4.10.18";
+const $ec291e0010116877$export$83d89fbfd8236492 = "4.10.19";
 function $dc9262ef6f786812$export$d9f36cf74e24d595(media_query) {
   const signal = $i7OB2$createSignal(false);
   $i7OB2$onCleanup($i7OB2$javascript_media_query(media_query, ({
@@ -6261,7 +6261,8 @@ function $70bb27cc6be01fc7$export$140423fa4bfb6d63(props) {
   }));
 }
 var $f916989c4b1be9f7$var$_tmpl$ = ["<video", ' disablepictureinpicture="true" class="d-standard-content"></video>'],
-  $f916989c4b1be9f7$var$_tmpl$2 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
+  $f916989c4b1be9f7$var$_tmpl$2 = ["<div", ' class="d-standard-content-text-group"', '><span class="d-standard-content-text"', ">", '</span><span class="d-standard-content-cta"', ">", "</span></div>"],
+  $f916989c4b1be9f7$var$_tmpl$3 = ["<span", ' class="d-standard-content-text"', ">", "</span>"];
 function $f916989c4b1be9f7$export$780a853d15174484({
   link_: link_,
   type_: type_,
@@ -6271,7 +6272,8 @@ function $f916989c4b1be9f7$export$780a853d15174484({
   aspectRatioWhenAloneInRow_: aspectRatioWhenAloneInRow_,
   imageResizer_: imageResizer_,
   text_: text_,
-  textPosition_: textPosition_
+  textPosition_: textPosition_,
+  cta_: cta_
 }) {
   let wroteAspectRatioToContainer = false; // Only write this once so we don't get into a aspect ratio changed -> size changed -> image source changed -> aspect ratio slightly changed infinite loop
   const [wrapperSize, setWrapperSize] = $i7OB2$createSignal();
@@ -6333,12 +6335,31 @@ function $f916989c4b1be9f7$export$780a853d15174484({
       }), $i7OB2$createComponent((0, $i7OB2$Show), {
         when: text_,
         get children() {
-          return $i7OB2$ssr($f916989c4b1be9f7$var$_tmpl$2, $i7OB2$ssrHydrationKey(), $i7OB2$ssrAttribute("data-position", $i7OB2$escape(textPosition_, true) || "bottom-center", false), $i7OB2$escape(text_));
+          return $i7OB2$createComponent((0, $i7OB2$Show), {
+            when: cta_,
+            get fallback() {
+              return $i7OB2$ssr($f916989c4b1be9f7$var$_tmpl$3, $i7OB2$ssrHydrationKey(), $i7OB2$ssrAttribute("data-position", $i7OB2$escape(textPosition_, true) || "bottom-center", false), $i7OB2$escape(text_));
+            },
+            get children() {
+              return $i7OB2$ssr($f916989c4b1be9f7$var$_tmpl$2, $i7OB2$ssrHydrationKey(), $i7OB2$ssrAttribute("data-position", $i7OB2$escape(textPosition_, true) || "bottom-center", false), $i7OB2$ssrAttribute("data-position", $i7OB2$escape(textPosition_, true) || "bottom-center", false), $i7OB2$escape(text_), $i7OB2$ssrAttribute("data-position", $i7OB2$escape(textPosition_, true) || "bottom-center", false), $i7OB2$escape(cta_));
+            }
+          });
         }
       })];
     }
   }));
 }
+const $486360b09f0d5729$export$af2c67164f68e9e9 = content => {
+  const {
+    link: link,
+    type: type,
+    url: url,
+    text: text,
+    text_position: text_position,
+    cta: cta
+  } = content;
+  return JSON.stringify([link, type, url, text ?? null, text_position ?? null, cta ?? null]);
+};
 function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_, products_request_loading_, imageResizer_) {
   let hasSeenContentBlock = false;
   const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
@@ -6375,13 +6396,11 @@ function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_
           type: type,
           url: url,
           text: text,
-          text_position: text_position
+          text_position: text_position,
+          cta: cta
         }
       } = row;
-      // Key the "content"-component by its rendered inputs, so we can reuse the component (and later downstream the block elements) if it's the same
-      // This makes the block not flicker when going backwards/forwards if the content is the same on both pages
-      // Also it lets us rewrite the blocks state in the history based on the block aspect ratio without infinite looping
-      const componentCacheKey = JSON.stringify([link, type, url, text ?? null, text_position ?? null]);
+      const componentCacheKey = $486360b09f0d5729$export$af2c67164f68e9e9(row.content);
       // The aspect ratio depends only on the media, so its history key must stay the pre-text 3-element shape — widening it would orphan every ratio already persisted in history.state
       const mediaCacheKey = JSON.stringify([link, type, url]);
       let component = contentComponents.get(componentCacheKey);
@@ -6401,7 +6420,8 @@ function $486360b09f0d5729$export$7a92d995f1bf3592(history_content_blocks_, plp_
           })),
           imageResizer_: imageResizer_,
           text_: text,
-          textPosition_: text_position
+          textPosition_: text_position,
+          cta_: cta
         });
         contentComponents.set(componentCacheKey, component);
       }