@depict-ai/ui 0.0.41 → 0.0.42

package/dist/index.d.ts

@@ -9,7 +9,7 @@ import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestions
 import { ProductListingRequest } from "@depict-ai/types/api/ProductListingRequest";
 import { ProductListingResponse, BaseCategoryDisplay } from "@depict-ai/types/api/ProductListingResponse";
 import { JSX as _JSX1 } from "solid-js/types/jsx";
-export const version = "0.0.41";
+export const version = "0.0.42";
 type ExclusiveId = {
     categoryId: string;
     productId?: undefined;
@@ -292,6 +292,14 @@ export type RenderCategorySuggestion = (category_suggestion: Accessor<CategorySu
     op: WithRequired<SearchFilter, "op">["op"];
     data: WithRequired<SearchFilter, "data">["data"];
 }[]>) => JSX.Element;
+/**
+ * Connects the height of the query input to the height of the aligner.
+ * @param aligner
+ * @returns
+ */
+export function connect_query_input_height_to_aligner_height(aligner: HTMLElement): {
+    cleanup: () => void;
+};
 type ConstructorOptions = {
     search_query_url_param_name?: string;
     market: string;

package/dist/main.js

@@ -30,10 +30,11 @@ $parcel$export(module.exports, "media_query_to_accessor", () => $beec9d22e42ed2c
 $parcel$export(module.exports, "setup_fast_leave", () => $d589470b68ce5b67$export$689e204eadb33baf);
 $parcel$export(module.exports, "show_toast", () => $b3e6a0e9382bf87e$export$5196e4c01fa56fcb);
 $parcel$export(module.exports, "solid_format_price", () => $5fc9fc23df1591db$export$469c7af753d08925);
+$parcel$export(module.exports, "connect_query_input_height_to_aligner_height", () => $94360f5c066c55b9$export$bec48a3a3ca6bc09);
 $parcel$export(module.exports, "PageReplacer", () => $37e96a5ebc768cc7$export$3ccaa27d81dd8556);
 $parcel$export(module.exports, "version", () => $ae93561d5649a847$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */ 
-const $ae93561d5649a847$export$83d89fbfd8236492 = "0.0.41";
+const $ae93561d5649a847$export$83d89fbfd8236492 = "0.0.42";
 
 
 
@@ -7343,6 +7344,29 @@ function $93779a41dce11249$export$a54ec244c8863715(opts) {
 
 
 
+
+function $94360f5c066c55b9$export$bec48a3a3ca6bc09(aligner) {
+    const style_element = document.createElement("style");
+    document.head.append(style_element);
+    const resize_observer = new ResizeObserver((0, $46MJV$depictaiutilishared.catchify)(()=>{
+        const styles = (0, $d3c94b3b96557917$export$1233ca167bf71f9a)({
+            ".depict.plp .depict-search-modal .query-input": {
+                "height": `${aligner?.clientHeight}px`
+            }
+        });
+        style_element.replaceChildren(styles);
+    }));
+    resize_observer.observe(aligner);
+    const cleanup = ()=>{
+        resize_observer.disconnect();
+        style_element.remove();
+    };
+    return {
+        cleanup: cleanup
+    };
+}
+
+
 const $79fbf145b15af988$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$46MJV$solidjsweb.template)(`<div class="depict plp search"></div>`, 2);
 /**
  * Type for the private properties that are shared between the different exported search SDK wrapper functions. SDK users are not allowed to change/access these, they're an internal implementation detail.
@@ -7658,7 +7682,11 @@ function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_searc
             },
             disabled_: true,
             field_element_ref_: (field)=>{
-                const handler = click_handler ?? (0, $46MJV$depictaiutilishared.catchify)(()=>{
+                const style_props_ = (0, $46MJV$solidjs.createSignal)({
+                    position: "fixed"
+                });
+                const { cleanup: align_field_cleanup  } = $79fbf145b15af988$var$align_field_modal(style_props_, field, aligner_ref);
+                const defaultHandler = (0, $46MJV$depictaiutilishared.catchify)(()=>{
                     depict_search.modal_open = [
                         {
                             style_props_: style_props_
@@ -7666,27 +7694,14 @@ function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_searc
                         modal_dispose_handler
                     ];
                 });
+                const handler = click_handler ?? defaultHandler;
                 field.addEventListener("click", handler);
-                (0, $46MJV$solidjs.onCleanup)(()=>field.removeEventListener("click", handler));
+                (0, $46MJV$solidjs.onCleanup)(()=>{
+                    field.removeEventListener("click", handler);
+                    align_field_cleanup?.();
+                });
             }
         });
-        const style_props_ = (0, $46MJV$solidjs.createSignal)({
-            position: "fixed"
-        });
-        if (aligner_ref) {
-            const style_element = document.createElement("style");
-            document.head.append(style_element);
-            const resize_observer = new ResizeObserver((0, $46MJV$depictaiutilishared.catchify)(()=>{
-                const styles = (0, $d3c94b3b96557917$export$1233ca167bf71f9a)({
-                    ".depict.plp .depict-search-modal .query-input": {
-                        "height": `${aligner_ref?.clientHeight}px`
-                    }
-                });
-                style_element.replaceChildren(styles);
-            }));
-            resize_observer.observe(aligner_ref);
-            (0, $67b60b572b7b7059$export$b3ad617e9036868)(style_props_, aligner_ref, undefined, false, "top");
-        } else (0, $67b60b572b7b7059$export$b3ad617e9036868)(style_props_, input);
         return [
             (()=>{
                 const _el$ = $79fbf145b15af988$var$_tmpl$.cloneNode(true);
@@ -7697,6 +7712,20 @@ function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_searc
         ];
     }, "SearchField failed");
 }
+function $79fbf145b15af988$var$align_field_modal(style_props_, input, aligner_ref) {
+    if (aligner_ref) {
+        const { cleanup: cleanup  } = (0, $94360f5c066c55b9$export$bec48a3a3ca6bc09)(aligner_ref);
+        (0, $67b60b572b7b7059$export$b3ad617e9036868)(style_props_, aligner_ref, undefined, false, "top");
+        return {
+            cleanup: cleanup
+        };
+    } else {
+        (0, $67b60b572b7b7059$export$b3ad617e9036868)(style_props_, input);
+        return {
+            cleanup: null
+        };
+    }
+}
 
 
 
@@ -7757,6 +7786,7 @@ function $d589470b68ce5b67$export$689e204eadb33baf(pr) {
 
 
 
+
 class $37e96a5ebc768cc7$export$3ccaa27d81dd8556 extends EventTarget {
     #stop_listening;
     #disconnect_observer;

package/dist/module.js

@@ -3,7 +3,7 @@ import {template as $g9l4l$template, insert as $g9l4l$insert, effect as $g9l4l$e
 import {createSignal as $g9l4l$createSignal, onCleanup as $g9l4l$onCleanup, createComputed as $g9l4l$createComputed, createEffect as $g9l4l$createEffect, untrack as $g9l4l$untrack, batch as $g9l4l$batch, createResource as $g9l4l$createResource, createMemo as $g9l4l$createMemo, Show as $g9l4l$Show, createRenderEffect as $g9l4l$createRenderEffect, runWithOwner as $g9l4l$runWithOwner, createRoot as $g9l4l$createRoot, getOwner as $g9l4l$getOwner, on as $g9l4l$on, Index as $g9l4l$Index, For as $g9l4l$For, ErrorBoundary as $g9l4l$ErrorBoundary} from "solid-js";
 
 /*! Depict.ai search and product listing SDK */ 
-const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.41";
+const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.42";
 
 
 
@@ -7313,6 +7313,29 @@ function $b76e8f62b1f313ef$export$a54ec244c8863715(opts) {
 
 
 
+
+function $9783d52321be38fe$export$bec48a3a3ca6bc09(aligner) {
+    const style_element = document.createElement("style");
+    document.head.append(style_element);
+    const resize_observer = new ResizeObserver((0, $g9l4l$catchify)(()=>{
+        const styles = (0, $246aa49a8f85c7f3$export$1233ca167bf71f9a)({
+            ".depict.plp .depict-search-modal .query-input": {
+                "height": `${aligner?.clientHeight}px`
+            }
+        });
+        style_element.replaceChildren(styles);
+    }));
+    resize_observer.observe(aligner);
+    const cleanup = ()=>{
+        resize_observer.disconnect();
+        style_element.remove();
+    };
+    return {
+        cleanup: cleanup
+    };
+}
+
+
 const $540e930c58500cbe$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict plp search"></div>`, 2);
 /**
  * Type for the private properties that are shared between the different exported search SDK wrapper functions. SDK users are not allowed to change/access these, they're an internal implementation detail.
@@ -7628,7 +7651,11 @@ function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_searc
             },
             disabled_: true,
             field_element_ref_: (field)=>{
-                const handler = click_handler ?? (0, $g9l4l$catchify)(()=>{
+                const style_props_ = (0, $g9l4l$createSignal)({
+                    position: "fixed"
+                });
+                const { cleanup: align_field_cleanup  } = $540e930c58500cbe$var$align_field_modal(style_props_, field, aligner_ref);
+                const defaultHandler = (0, $g9l4l$catchify)(()=>{
                     depict_search.modal_open = [
                         {
                             style_props_: style_props_
@@ -7636,27 +7663,14 @@ function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_searc
                         modal_dispose_handler
                     ];
                 });
+                const handler = click_handler ?? defaultHandler;
                 field.addEventListener("click", handler);
-                (0, $g9l4l$onCleanup)(()=>field.removeEventListener("click", handler));
+                (0, $g9l4l$onCleanup)(()=>{
+                    field.removeEventListener("click", handler);
+                    align_field_cleanup?.();
+                });
             }
         });
-        const style_props_ = (0, $g9l4l$createSignal)({
-            position: "fixed"
-        });
-        if (aligner_ref) {
-            const style_element = document.createElement("style");
-            document.head.append(style_element);
-            const resize_observer = new ResizeObserver((0, $g9l4l$catchify)(()=>{
-                const styles = (0, $246aa49a8f85c7f3$export$1233ca167bf71f9a)({
-                    ".depict.plp .depict-search-modal .query-input": {
-                        "height": `${aligner_ref?.clientHeight}px`
-                    }
-                });
-                style_element.replaceChildren(styles);
-            }));
-            resize_observer.observe(aligner_ref);
-            (0, $079defea521d5e2a$export$b3ad617e9036868)(style_props_, aligner_ref, undefined, false, "top");
-        } else (0, $079defea521d5e2a$export$b3ad617e9036868)(style_props_, input);
         return [
             (()=>{
                 const _el$ = $540e930c58500cbe$var$_tmpl$.cloneNode(true);
@@ -7667,6 +7681,20 @@ function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_searc
         ];
     }, "SearchField failed");
 }
+function $540e930c58500cbe$var$align_field_modal(style_props_, input, aligner_ref) {
+    if (aligner_ref) {
+        const { cleanup: cleanup  } = (0, $9783d52321be38fe$export$bec48a3a3ca6bc09)(aligner_ref);
+        (0, $079defea521d5e2a$export$b3ad617e9036868)(style_props_, aligner_ref, undefined, false, "top");
+        return {
+            cleanup: cleanup
+        };
+    } else {
+        (0, $079defea521d5e2a$export$b3ad617e9036868)(style_props_, input);
+        return {
+            cleanup: null
+        };
+    }
+}
 
 
 
@@ -7727,6 +7755,7 @@ function $36316d7b4c897a03$export$689e204eadb33baf(pr) {
 
 
 
+
 class $ba6c9609228edf6b$export$3ccaa27d81dd8556 extends EventTarget {
     #stop_listening;
     #disconnect_observer;
@@ -7827,4 +7856,4 @@ class $ba6c9609228edf6b$export$3ccaa27d81dd8556 extends EventTarget {
 (0, $g9l4l$dlog)("@depict-ai/ui version", (0, $18bf1d29fb889cca$export$83d89fbfd8236492));
 
 
-export {$e95f1855a5e3864f$export$58e808b1db15d3bc as fetchDepictRecommendations, $ec52ef1e6c117813$export$de035477d6fef996 as QuickLinks, $ec52ef1e6c117813$export$5b7c3ce0ebe51f86 as BreadCrumbs, $6340962f8bafd049$export$b91cec6bdc6b32a1 as CategoryTitle, $9b693ea3ff420de6$export$824dde41348efed1 as embedded_num_products, $80a49d3809ecb080$export$643598a327b5833e as get_categories, $ec52ef1e6c117813$export$f34314aa9505732e as DepictCategory, $ec52ef1e6c117813$export$e2bf8ce7779e827e as CategoryPage, $540e930c58500cbe$export$ac6237957a15b3f0 as DepictSearch, $540e930c58500cbe$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $540e930c58500cbe$export$f2dc7e4e4aa11abb as SearchPage, $540e930c58500cbe$export$b94867ecbd698f21 as SearchField, $aaacfac0064e97d9$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $079defea521d5e2a$export$b3ad617e9036868 as align_field, $246aa49a8f85c7f3$export$1233ca167bf71f9a as styles_to_valid_css_string, $a1123c5ed9b0ee29$export$fe334901e8bebd57 as disable_scrolling, $a3e81b85527bc866$export$d0596b5cae35ad4 as open_search_with_shift_slash, $972ebf2641490830$export$26df08e242fe83a3 as push_state_with_query_param_value, $3846bb34098c738f$export$e015ed2f2950f2e3 as DepictAPI, $f22123a20b6b80b3$export$2cefb7e61fcbae00 as add_to_version_info, $fefe7683325039b3$export$d9f36cf74e24d595 as media_query_to_accessor, $36316d7b4c897a03$export$689e204eadb33baf as setup_fast_leave, $886fa987db4f3805$export$5196e4c01fa56fcb as show_toast, $5178263ed1e394ca$export$469c7af753d08925 as solid_format_price, $ba6c9609228edf6b$export$3ccaa27d81dd8556 as PageReplacer, $18bf1d29fb889cca$export$83d89fbfd8236492 as version};
+export {$e95f1855a5e3864f$export$58e808b1db15d3bc as fetchDepictRecommendations, $ec52ef1e6c117813$export$de035477d6fef996 as QuickLinks, $ec52ef1e6c117813$export$5b7c3ce0ebe51f86 as BreadCrumbs, $6340962f8bafd049$export$b91cec6bdc6b32a1 as CategoryTitle, $9b693ea3ff420de6$export$824dde41348efed1 as embedded_num_products, $80a49d3809ecb080$export$643598a327b5833e as get_categories, $ec52ef1e6c117813$export$f34314aa9505732e as DepictCategory, $ec52ef1e6c117813$export$e2bf8ce7779e827e as CategoryPage, $540e930c58500cbe$export$ac6237957a15b3f0 as DepictSearch, $540e930c58500cbe$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $540e930c58500cbe$export$f2dc7e4e4aa11abb as SearchPage, $540e930c58500cbe$export$b94867ecbd698f21 as SearchField, $aaacfac0064e97d9$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $079defea521d5e2a$export$b3ad617e9036868 as align_field, $246aa49a8f85c7f3$export$1233ca167bf71f9a as styles_to_valid_css_string, $a1123c5ed9b0ee29$export$fe334901e8bebd57 as disable_scrolling, $a3e81b85527bc866$export$d0596b5cae35ad4 as open_search_with_shift_slash, $972ebf2641490830$export$26df08e242fe83a3 as push_state_with_query_param_value, $3846bb34098c738f$export$e015ed2f2950f2e3 as DepictAPI, $f22123a20b6b80b3$export$2cefb7e61fcbae00 as add_to_version_info, $fefe7683325039b3$export$d9f36cf74e24d595 as media_query_to_accessor, $36316d7b4c897a03$export$689e204eadb33baf as setup_fast_leave, $886fa987db4f3805$export$5196e4c01fa56fcb as show_toast, $5178263ed1e394ca$export$469c7af753d08925 as solid_format_price, $9783d52321be38fe$export$bec48a3a3ca6bc09 as connect_query_input_height_to_aligner_height, $ba6c9609228edf6b$export$3ccaa27d81dd8556 as PageReplacer, $18bf1d29fb889cca$export$83d89fbfd8236492 as version};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "0.0.41",
+  "version": "0.0.42",
   "packageManager": "yarn@3.2.2",
   "source": [
     "src/index.ts",
@@ -82,7 +82,7 @@
     "ts-jest": "^29.0.3"
   },
   "dependencies": {
-    "@depict-ai/utilishared": "^0.0.39",
+    "@depict-ai/utilishared": "^0.0.40",
     "solid-js": "^1.6.2"
   },
   "types": "dist/index.d.ts"