@depict-ai/ui 0.0.36 → 0.0.38

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.36";
+export const version = "0.0.38";
 type ExclusiveId = {
     categoryId: string;
     productId?: undefined;
@@ -342,11 +342,13 @@ export function SearchPage({ depict_search, include_input_field, grid_spacing, c
         recommendations_cols_at_size?: SDKColsAtSize;
     };
 }): Node_Array;
-export function SearchField({ depict_search, modal_dispose_handler, click_handler, }: {
+interface SearchFieldParams {
     depict_search: DepictSearch;
     modal_dispose_handler?: VoidFunction;
     click_handler?: (this: HTMLDivElement, ev: MouseEvent) => any;
-}): Node_Array;
+    aligner_ref?: HTMLElement | null;
+}
+export function SearchField({ depict_search, modal_dispose_handler, click_handler, aligner_ref }: SearchFieldParams): Node_Array;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
     readonly render_: (is_prerendering: boolean) => Node_Array;

package/dist/main.js

@@ -33,7 +33,7 @@ $parcel$export(module.exports, "solid_format_price", () => $5fc9fc23df1591db$exp
 $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.36";
+const $ae93561d5649a847$export$83d89fbfd8236492 = "0.0.38";
 
 
 
@@ -7342,6 +7342,7 @@ function $93779a41dce11249$export$a54ec244c8863715(opts) {
 
 
 
+
 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.
@@ -7636,7 +7637,7 @@ function $79fbf145b15af988$export$f2dc7e4e4aa11abb({ depict_search: depict_searc
         });
     }, "Entire SearchPage failed");
 }
-function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_search , modal_dispose_handler: modal_dispose_handler , click_handler: click_handler  }) {
+function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_search , modal_dispose_handler: modal_dispose_handler , click_handler: click_handler , aligner_ref: aligner_ref  }) {
     const shared_properties = $79fbf145b15af988$var$get_shared_properties(depict_search);
     return (0, $f27b0b326e0a87e2$export$23fca46f3143581f)(()=>{
         const input = (0, $46MJV$solidjsweb.createComponent)((0, $231c39725f8fde87$export$ff21851bb5d30e15), {
@@ -7672,7 +7673,20 @@ function $79fbf145b15af988$export$b94867ecbd698f21({ depict_search: depict_searc
         const style_props_ = (0, $46MJV$solidjs.createSignal)({
             position: "fixed"
         });
-        (0, $67b60b572b7b7059$export$b3ad617e9036868)(style_props_, input);
+        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);

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.36";
+const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.38";
 
 
 
@@ -7312,6 +7312,7 @@ function $b76e8f62b1f313ef$export$a54ec244c8863715(opts) {
 
 
 
+
 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.
@@ -7606,7 +7607,7 @@ function $540e930c58500cbe$export$f2dc7e4e4aa11abb({ depict_search: depict_searc
         });
     }, "Entire SearchPage failed");
 }
-function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_search , modal_dispose_handler: modal_dispose_handler , click_handler: click_handler  }) {
+function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_search , modal_dispose_handler: modal_dispose_handler , click_handler: click_handler , aligner_ref: aligner_ref  }) {
     const shared_properties = $540e930c58500cbe$var$get_shared_properties(depict_search);
     return (0, $c7f938ac40924f3b$export$23fca46f3143581f)(()=>{
         const input = (0, $g9l4l$createComponent)((0, $3a2af5e36c43cf2f$export$ff21851bb5d30e15), {
@@ -7642,7 +7643,20 @@ function $540e930c58500cbe$export$b94867ecbd698f21({ depict_search: depict_searc
         const style_props_ = (0, $g9l4l$createSignal)({
             position: "fixed"
         });
-        (0, $079defea521d5e2a$export$b3ad617e9036868)(style_props_, input);
+        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);

package/package.json

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