Adding a way to open the SearchModal

import { onExistsObserver } from "@depict-ai/js-ui";

onExistsObserver(".open-search-button", button => {
  button.addEventListener("click", () => searchProvider.openModal());
});

import { onExistsObserver } from "@depict-ai/js-ui";

onExistsObserver(".open-search-button", button => {
  button.addEventListener("click", () => {
    const header = document.querySelector(".page-header");
    if (!header) return console.error("Could not find header element");
    searchProvider.openModal({
      alignerRef: header,
    });
  });
});

import { SearchField, onExistsObserver } from "@depict-ai/js-ui";

onExistsObserver(".search-field-wrapper", (element) =>
  element.append(SearchField({ searchProvider }))
);

import { SearchField, onExistsObserver } from "@depict-ai/js-ui";

const header = await new Promise(resolve => onExistsObserver(".page-header", resolve));
onExistsObserver(".open-search-button", button => {
  button.addEventListener("click", () => searchProvider.openModal({ alignerRef: header }));
});