@phillips/seldon 1.47.0 → 1.48.0

package/dist/_virtual/_commonjsHelpers.js

@@ -1,26 +1,28 @@
-function n(e) {
+var u = typeof globalThis != "undefined" ? globalThis : typeof window != "undefined" ? window : typeof global != "undefined" ? global : typeof self != "undefined" ? self : {};
+function f(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-function c(e) {
+function l(e) {
   if (e.__esModule) return e;
-  var o = e.default;
-  if (typeof o == "function") {
-    var t = function r() {
-      return this instanceof r ? Reflect.construct(o, arguments, this.constructor) : o.apply(this, arguments);
+  var r = e.default;
+  if (typeof r == "function") {
+    var t = function o() {
+      return this instanceof o ? Reflect.construct(r, arguments, this.constructor) : r.apply(this, arguments);
     };
-    t.prototype = o.prototype;
+    t.prototype = r.prototype;
   } else t = {};
-  return Object.defineProperty(t, "__esModule", { value: !0 }), Object.keys(e).forEach(function(r) {
-    var u = Object.getOwnPropertyDescriptor(e, r);
-    Object.defineProperty(t, r, u.get ? u : {
+  return Object.defineProperty(t, "__esModule", { value: !0 }), Object.keys(e).forEach(function(o) {
+    var n = Object.getOwnPropertyDescriptor(e, o);
+    Object.defineProperty(t, o, n.get ? n : {
       enumerable: !0,
       get: function() {
-        return e[r];
+        return e[o];
       }
     });
   }), t;
 }
 export {
-  c as getAugmentedNamespace,
-  n as getDefaultExportFromCjs
+  u as commonjsGlobal,
+  l as getAugmentedNamespace,
+  f as getDefaultExportFromCjs
 };

package/dist/assets/PhillipsLogo.svg.js

@@ -1,5 +1,5 @@
 import * as e from "react";
-const l = (t) => /* @__PURE__ */ e.createElement("svg", { "data-testid": "header-logo-svg", width: 131, height: 18, viewBox: "0 0 131 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("g", { id: "Logo/ HP Button", clipPath: "url(#clip0_3288_4057)" }, /* @__PURE__ */ e.createElement("path", { id: "Phillips Logo", d: "M54.8166 0.274027H52.6224V13.726H63.7504V11.6083H54.8166V0.274027ZM41.3171 13.7273H43.5119V0.274027H41.3171V13.7273ZM21.276 0.274027H19.1214V13.726H21.2566V8.86215H30.0526V13.726H32.2079V0.274027H30.0526V6.80339H21.2566L21.276 0.274027ZM87.8477 13.7273H90.0425V0.274027H87.8477V13.7273ZM118.23 10.402L117.489 12.3843C119.214 13.3651 122.153 14 124.23 14C128.07 14 130.48 12.4912 130.48 9.84295C130.48 6.72565 127.521 6.17565 124.309 5.86211C122.252 5.66647 120.096 5.50969 120.096 4.01971C120.096 2.86206 121.135 2.11772 123.898 2.11772C125.543 2.11772 127.444 2.49021 129.031 3.15747L129.716 1.157C127.953 0.39193 125.817 0 123.936 0C120.058 0 117.863 1.52885 117.863 4.01971C117.863 7.1571 120.861 7.7058 124.034 7.99991C126.091 8.1962 128.227 8.37305 128.227 9.8436C128.227 11.0401 127.15 11.8829 124.25 11.8829C122.467 11.8823 120.004 11.3485 118.23 10.402ZM72.4298 0.274027H70.2357V13.726H81.3637V11.6083H72.4298V0.274027ZM106.676 0.274027H99.1724V13.726H101.367V9.27417H106.676C109.811 9.27417 111.614 7.39161 111.614 4.76406C111.614 2.15659 109.85 0.274027 106.676 0.274027ZM106.421 7.1571H101.367V2.39174H106.421C108.321 2.39174 109.379 3.27407 109.379 4.7647C109.38 6.25533 108.361 7.1571 106.421 7.1571ZM7.50343 0.274027H0V13.726H2.19414V9.27417H7.50343C10.638 9.27417 12.4399 7.39161 12.4399 4.76406C12.4406 2.15659 10.6775 0.274027 7.50343 0.274027ZM7.24907 7.1571H2.19414V2.39174H7.24907C9.14936 2.39174 10.2069 3.27407 10.2069 4.7647C10.2063 6.25533 9.18819 7.1571 7.24907 7.1571Z", fill: "black" })), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3288_4057" }, /* @__PURE__ */ e.createElement("rect", { width: 130.667, height: 14, fill: "white" }))));
+const l = (t) => /* @__PURE__ */ e.createElement("svg", { "data-testid": "header-logo-svg", viewBox: "0 0 131 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("g", { id: "Logo/ HP Button", clipPath: "url(#clip0_3288_4057)" }, /* @__PURE__ */ e.createElement("path", { id: "Phillips Logo", d: "M54.8166 0.274027H52.6224V13.726H63.7504V11.6083H54.8166V0.274027ZM41.3171 13.7273H43.5119V0.274027H41.3171V13.7273ZM21.276 0.274027H19.1214V13.726H21.2566V8.86215H30.0526V13.726H32.2079V0.274027H30.0526V6.80339H21.2566L21.276 0.274027ZM87.8477 13.7273H90.0425V0.274027H87.8477V13.7273ZM118.23 10.402L117.489 12.3843C119.214 13.3651 122.153 14 124.23 14C128.07 14 130.48 12.4912 130.48 9.84295C130.48 6.72565 127.521 6.17565 124.309 5.86211C122.252 5.66647 120.096 5.50969 120.096 4.01971C120.096 2.86206 121.135 2.11772 123.898 2.11772C125.543 2.11772 127.444 2.49021 129.031 3.15747L129.716 1.157C127.953 0.39193 125.817 0 123.936 0C120.058 0 117.863 1.52885 117.863 4.01971C117.863 7.1571 120.861 7.7058 124.034 7.99991C126.091 8.1962 128.227 8.37305 128.227 9.8436C128.227 11.0401 127.15 11.8829 124.25 11.8829C122.467 11.8823 120.004 11.3485 118.23 10.402ZM72.4298 0.274027H70.2357V13.726H81.3637V11.6083H72.4298V0.274027ZM106.676 0.274027H99.1724V13.726H101.367V9.27417H106.676C109.811 9.27417 111.614 7.39161 111.614 4.76406C111.614 2.15659 109.85 0.274027 106.676 0.274027ZM106.421 7.1571H101.367V2.39174H106.421C108.321 2.39174 109.379 3.27407 109.379 4.7647C109.38 6.25533 108.361 7.1571 106.421 7.1571ZM7.50343 0.274027H0V13.726H2.19414V9.27417H7.50343C10.638 9.27417 12.4399 7.39161 12.4399 4.76406C12.4406 2.15659 10.6775 0.274027 7.50343 0.274027ZM7.24907 7.1571H2.19414V2.39174H7.24907C9.14936 2.39174 10.2069 3.27407 10.2069 4.7647C10.2063 6.25533 9.18819 7.1571 7.24907 7.1571Z", fill: "black" })), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3288_4057" }, /* @__PURE__ */ e.createElement("rect", { width: 130.667, height: 14, fill: "white" }))));
 export {
   l as default
 };

package/dist/components/Header/Header.d.ts

@@ -21,12 +21,21 @@ export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
      */
     logoText?: string;
 }
-export declare const HeaderContext: React.Context<{
+export type HeaderContextType = {
     defaultMobileMenuLabel: string;
     expandedItem: string;
-    setExpandedItem: (_item: string) => void;
+    setExpandedItem: (item: string) => void;
     isExpanded: boolean;
-    onSelect: (_label: string) => void;
-}>;
+    onSelect: (label: string) => void;
+    /**
+     * Is the user within the search input and searching
+     */
+    isSearchExpanded: boolean;
+    /**
+     * Set the search expanded state
+     */
+    setIsSearchExpanded: React.Dispatch<React.SetStateAction<boolean>>;
+};
+export declare const HeaderContext: React.Context<HeaderContextType>;
 declare const Header: ({ defaultMobileMenuLabel, logo, className, children, toggleOpenText, toggleCloseText, logoText, ...props }: React.PropsWithChildren<HeaderProps>) => import("react/jsx-runtime").JSX.Element;
 export default Header;

package/dist/components/Header/Header.js

@@ -1,74 +1,79 @@
-import { jsxs as N, jsx as e } from "react/jsx-runtime";
-import r from "../../node_modules/classnames/index.js";
-import * as i from "react";
-import { findChildrenOfType as _, px as a } from "../../utils/index.js";
-import x from "../Search/Search.js";
-import P from "../../assets/PhillipsLogo.svg.js";
-const j = i.createContext({
-  defaultMobileMenuLabel: "",
-  expandedItem: "",
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
-  setExpandedItem: (t) => {
-  },
-  isExpanded: !1,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
-  onSelect: (t) => {
-  }
-}), R = ({
-  defaultMobileMenuLabel: t = "Main Menu",
-  logo: s = /* @__PURE__ */ e(P, {}),
-  className: v,
-  children: l,
-  toggleOpenText: m = "Open Menu",
-  toggleCloseText: h = "Close Menu",
+import { jsxs as _, jsx as t } from "react/jsx-runtime";
+import s from "../../node_modules/classnames/index.js";
+import * as o from "react";
+import { findChildrenOfType as x, px as a } from "../../utils/index.js";
+import v from "../Search/Search.js";
+import k from "../../assets/PhillipsLogo.svg.js";
+import { defaultHeaderContext as T } from "./utils.js";
+const w = o.createContext(T), D = ({
+  defaultMobileMenuLabel: r = "Main Menu",
+  logo: d = /* @__PURE__ */ t(k, {}),
+  className: S,
+  children: h,
+  toggleOpenText: l = "Open Menu",
+  toggleCloseText: m = "Close Menu",
   logoText: f = "Home Page",
-  ...S
+  ...E
 }) => {
-  const $ = _(l, x), u = _(l, x, !0), [d, E] = i.useState(!1), [p, c] = i.useState(t), o = d ? h : m, y = p !== t, g = function() {
-    E((n) => !n), c(t);
-  }, I = function(n) {
-    c((C) => C === t ? n : t);
+  const $ = x(h, v), u = x(h, v, !0), [c, y] = o.useState(!1), [p, i] = o.useState(r), [C, I] = o.useState(!1), n = c ? m : l, N = p !== r, g = function() {
+    y((e) => !e), i(r);
+  }, H = function(e) {
+    i((j) => j === r ? e : r);
+  }, P = (e) => {
+    I(e);
   };
-  return /* @__PURE__ */ N("header", { ...S, className: r(`${a}-header`, v), children: [
-    /* @__PURE__ */ e(
+  return /* @__PURE__ */ _("header", { ...E, className: s(`${a}-header`, S), children: [
+    /* @__PURE__ */ t("div", { className: `${a}-header__top-row`, children: /* @__PURE__ */ t(
+      "h1",
+      {
+        "data-testid": "header-logo",
+        className: `${a}-header__logo`,
+        tabIndex: n === l ? 0 : -1,
+        children: /* @__PURE__ */ t("a", { href: "/", "aria-label": f, children: typeof d == "object" ? d : /* @__PURE__ */ t("img", { alt: "Phillips", "data-testid": "header-logo-img", src: d, height: "14" }) })
+      }
+    ) }),
+    /* @__PURE__ */ t(
       "div",
       {
-        className: r(`${a}-header__overlay`, { [`${a}-header__overlay--active`]: d }),
+        className: s(`${a}-header__overlay`, { [`${a}-header__overlay--active`]: c }),
         "data-testid": "header-overlay",
         onClick: g
       }
     ),
-    /* @__PURE__ */ e(
+    /* @__PURE__ */ t(
       "button",
       {
-        "aria-label": o,
+        "aria-label": n,
         "data-testid": "mobile-menu-toggle",
         type: "button",
         onClick: g,
-        className: r(`${a}-header__toggle-btn`, {
-          [`${a}-header__toggle-btn--open`]: o === h
+        className: s(`${a}-header__toggle-btn`, {
+          [`${a}-header__toggle-btn--open`]: n === m
         }),
-        children: /* @__PURE__ */ e("span", { children: o })
+        children: /* @__PURE__ */ t("span", { children: n })
       }
     ),
-    /* @__PURE__ */ e("h1", { "data-testid": "header-logo", className: `${a}-header__logo`, tabIndex: o === m ? 0 : -1, children: /* @__PURE__ */ e("a", { href: "/", "aria-label": f, children: typeof s == "object" ? s : /* @__PURE__ */ e("img", { alt: "Phillips", "data-testid": "header-logo-img", src: s, height: "14" }) }) }),
-    /* @__PURE__ */ e("div", { className: r(`${a}-header__nav`, { [`${a}-header__nav--open`]: d }), children: /* @__PURE__ */ e(
-      j.Provider,
+    /* @__PURE__ */ _(
+      w.Provider,
       {
         value: {
-          defaultMobileMenuLabel: t,
+          defaultMobileMenuLabel: r,
           expandedItem: p,
-          setExpandedItem: (n) => c(n),
-          isExpanded: y,
-          onSelect: (n) => I(n)
+          setExpandedItem: (e) => i(e),
+          isExpanded: N,
+          onSelect: (e) => H(e),
+          isSearchExpanded: C,
+          setIsSearchExpanded: P
         },
-        children: u
+        children: [
+          /* @__PURE__ */ t("div", { className: s(`${a}-header__nav`, { [`${a}-header__nav--open`]: c }), children: u }),
+          $
+        ]
       }
-    ) }),
-    $
+    )
   ] });
 };
 export {
-  j as HeaderContext,
-  R as default
+  w as HeaderContext,
+  D as default
 };

package/dist/components/Header/utils.d.ts

@@ -0,0 +1,9 @@
+export declare const defaultHeaderContext: {
+    defaultMobileMenuLabel: string;
+    expandedItem: string;
+    setExpandedItem: () => void;
+    isExpanded: boolean;
+    onSelect: () => void;
+    isSearchExpanded: boolean;
+    setIsSearchExpanded: () => void;
+};

package/dist/components/Header/utils.js

@@ -0,0 +1,13 @@
+import { noOp as e } from "../../utils/index.js";
+const d = {
+  defaultMobileMenuLabel: "",
+  expandedItem: "",
+  setExpandedItem: e,
+  isExpanded: !1,
+  onSelect: e,
+  isSearchExpanded: !1,
+  setIsSearchExpanded: e
+};
+export {
+  d as defaultHeaderContext
+};

package/dist/components/Navigation/Navigation.js

@@ -1,50 +1,54 @@
-import { jsxs as p, jsx as o } from "react/jsx-runtime";
-import * as x from "react";
-import { px as e } from "../../utils/index.js";
-import d from "../../node_modules/classnames/index.js";
-import { HeaderContext as v } from "../Header/Header.js";
-const _ = ({
-  backBtnLabel: i,
-  children: r,
-  className: b,
-  id: a,
-  visible: n = !0
+import { jsxs as r, jsx as c } from "react/jsx-runtime";
+import * as l from "react";
+import { findChildrenOfType as m, px as a } from "../../utils/index.js";
+import b from "../../node_modules/classnames/index.js";
+import { HeaderContext as _ } from "../Header/Header.js";
+import p from "./NavigationList/NavigationList.js";
+const g = ({
+  backBtnLabel: f,
+  children: i,
+  className: v,
+  id: e,
+  visible: s = !0
 }) => {
-  const { defaultMobileMenuLabel: l, isExpanded: s, expandedItem: t, setExpandedItem: m } = x.useContext(v), c = () => m(t === l ? t : l);
-  return /* @__PURE__ */ p(
+  const { defaultMobileMenuLabel: o, isExpanded: d, expandedItem: n, setExpandedItem: x, isSearchExpanded: $ } = l.useContext(_), h = () => x(n === o ? n : o), t = m(i, p), u = m(i, p, !0);
+  return /* @__PURE__ */ r(
     "nav",
     {
       role: "navigation",
-      "aria-labelledby": `${a}-label`,
-      "data-testid": a,
-      id: a,
-      className: d(`${e}-nav`, b, { [`${e}-nav--expanded`]: s }),
+      "aria-labelledby": `${e}-label`,
+      "data-testid": e,
+      id: e,
+      className: b(`${a}-nav`, v, { [`${a}-nav--expanded`]: d }),
       children: [
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ c(
           "button",
           {
-            "data-testid": `${a}-back-btn`,
-            tabIndex: s ? 0 : -1,
-            className: `${e}-nav__back-btn`,
-            onClick: c,
-            children: i
+            "data-testid": `${e}-back-btn`,
+            tabIndex: d ? 0 : -1,
+            className: `${a}-nav__back-btn`,
+            onClick: h,
+            children: f
           }
         ),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ c(
           "h2",
           {
-            id: `${a}-label`,
-            "data-testid": `${a}-label`,
-            className: d(`${e}-nav__label`, { [`${e}-nav__label--hidden`]: !n }),
-            style: { "--visible": n ? "visible" : "hidden" },
-            children: t || "Main Menu"
+            id: `${e}-label`,
+            "data-testid": `${e}-label`,
+            className: b(`${a}-nav__label`, { [`${a}-nav__label--hidden`]: !s }),
+            style: { "--visible": s ? "visible" : "hidden" },
+            children: n || "Main Menu"
           }
         ),
-        r
+        /* @__PURE__ */ r("div", { className: `${a}-nav__list-container`, children: [
+          l.isValidElement(t == null ? void 0 : t[0]) ? l.cloneElement(t[0], { isOffScreen: $ }) : void 0,
+          u
+        ] })
       ]
     }
   );
 };
 export {
-  _ as default
+  g as default
 };

package/dist/components/Navigation/NavigationList/NavigationList.d.ts

@@ -4,6 +4,10 @@ export interface NavigationListProps extends React.HTMLAttributes<HTMLElement> {
      * id for the navigation list
      */
     id: string;
+    /**
+     * Is the nav list offscreen?
+     */
+    isOffScreen?: boolean;
 }
-declare const NavigationList: ({ id, children, className }: React.PropsWithChildren<NavigationListProps>) => import("react/jsx-runtime").JSX.Element;
+declare const NavigationList: React.FC<NavigationListProps>;
 export default NavigationList;

package/dist/components/Navigation/NavigationList/NavigationList.js

@@ -1,24 +1,28 @@
-import { jsxs as p, jsx as _ } from "react/jsx-runtime";
+import { jsxs as c, jsx as _ } from "react/jsx-runtime";
 import * as r from "react";
 import { px as a } from "../../../utils/index.js";
 import l from "../../../node_modules/classnames/index.js";
-import { HeaderContext as v } from "../../Header/Header.js";
-const x = ({ id: o, children: n, className: m }) => {
-  const { isExpanded: i } = r.useContext(v), s = r.Children.toArray(n).filter((t) => {
+import { HeaderContext as f } from "../../Header/Header.js";
+const $ = ({ id: o, children: n, className: m, isOffScreen: p, ...v }) => {
+  const { isExpanded: i } = r.useContext(f), s = r.Children.toArray(n).filter((t) => {
     if (t && t.props.navGroup === "nav-link-lg")
       return t;
   }), e = r.Children.toArray(n).filter((t) => {
     if (t && t.props.navGroup === "nav-link-sm")
       return t;
   });
-  return /* @__PURE__ */ p(
+  return /* @__PURE__ */ c(
     "ul",
     {
       id: o,
       "data-testid": o,
       role: "list",
       "aria-expanded": i,
-      className: l(m, `${a}-nav__list`, { [`${a}-nav__list--expanded`]: i }),
+      className: l(m, `${a}-nav__list`, {
+        [`${a}-nav__list--expanded`]: i,
+        [`${a}-nav__list--offscreen`]: p
+      }),
+      ...v,
       children: [
         s.length > 0 ? /* @__PURE__ */ _("div", { className: l(`${a}-nav__list__section`, `${a}-nav__list__section--large-cta`), children: s }) : null,
         e.length > 0 ? /* @__PURE__ */ _("div", { className: l(`${a}-nav__list__section`, `${a}-nav__list__section--small-cta`), children: e }) : null,
@@ -28,5 +32,5 @@ const x = ({ id: o, children: n, className: m }) => {
   );
 };
 export {
-  x as default
+  $ as default
 };

package/dist/components/Search/Search.js

@@ -1,137 +1,145 @@
-import { jsxs as v, jsx as a } from "react/jsx-runtime";
-import * as d from "react";
-import { getCommonProps as P, encodeURLSearchParams as N } from "../../utils/index.js";
-import f from "../../node_modules/classnames/index.js";
-import T from "../Input/Input.js";
-import j from "../../assets/search.svg.js";
-import D from "../../assets/close.svg.js";
-import V from "../../assets/loading_spinner.svg.js";
-import A from "../Link/Link.js";
+import { jsxs as p, Fragment as k, jsx as a } from "react/jsx-runtime";
+import * as f from "react";
+import { getCommonProps as P, px as y, encodeURLSearchParams as N } from "../../utils/index.js";
+import u from "../../node_modules/classnames/index.js";
+import j from "../Input/Input.js";
+import D from "../Link/Link.js";
 import F from "./SearchResults/SearchResults.js";
 import { TextVariants as H } from "../Text/types.js";
-import K from "../Text/Text.js";
-const Z = ({
-  onSearch: h,
-  searchResults: R = [],
-  state: s = "idle",
-  defaultValue: C = "",
-  className: w,
-  placeholder: l,
-  searchButtonText: c = "Search",
-  loadingText: x = "Search In Progress...",
-  invalidText: k = "Invalid search",
-  getAllResultsText: y = (e) => `View all results for ${e}`,
-  getAllResultsLink: _ = (e) => `/Search?Search=${e}`,
-  ...p
+import O from "../Text/Text.js";
+import { useOnClickOutside as V } from "../../node_modules/usehooks-ts/dist/index.js";
+import { HeaderContext as A } from "../Header/Header.js";
+import { SearchButton as K } from "./SearchButton.js";
+import M from "../../node_modules/react-transition-group/esm/CSSTransition.js";
+const re = ({
+  onSearch: S,
+  searchResults: C = [],
+  state: c = "idle",
+  defaultValue: I = "",
+  className: R,
+  placeholder: b = "",
+  searchButtonText: l = "Search",
+  loadingText: w = "Search In Progress...",
+  invalidText: E = "Invalid search",
+  getAllResultsText: L = (e) => `View all results for ${e}`,
+  getAllResultsLink: v = (e) => `/Search?Search=${e}`,
+  ...x
 }) => {
-  var g;
-  const { className: e, "data-testid": r, ...L } = P(p, "Search"), [n, b] = d.useState(!1), m = d.useRef(null), u = d.useRef(null), o = (g = m.current) == null ? void 0 : g.value, E = s === "loading" || s === "submitting", $ = () => {
-    var t, i;
-    if (b(!n), n) {
-      (t = u.current) == null || t.reset();
-      return;
-    }
-    (i = m.current) == null || i.focus();
-  }, S = (t) => {
-    var i;
-    if (t.stopPropagation(), t.key === "Enter") {
-      if (t.preventDefault(), o && o.length > 2) {
-        const I = N(_(o));
-        window.location.href = I;
+  var $;
+  const { className: e, "data-testid": m, ...T } = P(x, "Search"), d = f.useContext(A), h = f.useRef(null), o = f.useRef(null), t = d.isSearchExpanded, s = ($ = h.current) == null ? void 0 : $.value;
+  V(o, () => g(!1));
+  const _ = (r) => {
+    var n;
+    if (r.stopPropagation(), r.key === "Enter") {
+      if (r.preventDefault(), s && s.length > 2) {
+        const i = N(v(s));
+        window.location.href = i;
       }
-      t.currentTarget instanceof HTMLAnchorElement && t.currentTarget.click();
+      r.currentTarget instanceof HTMLAnchorElement && r.currentTarget.click();
+    }
+    r.key === "Escape" && (d.setIsSearchExpanded(!1), (n = o.current) == null || n.reset());
+  }, g = (r) => {
+    var n, i;
+    if (d.setIsSearchExpanded(r), r) {
+      (n = h.current) == null || n.focus();
+      return;
     }
-    t.key === "Escape" && (b(!1), (i = u.current) == null || i.reset());
+    (i = o.current) == null || i.reset();
   };
-  return /* @__PURE__ */ v(
-    "div",
-    {
-      ...L,
-      className: f(e, w),
-      "data-testid": r,
-      role: "search",
-      ...p,
-      children: [
-        /* @__PURE__ */ a(K, { variant: H.heading3, className: `${e}__label`, children: c }),
-        n ? null : /* @__PURE__ */ a(
-          "button",
-          {
-            type: "button",
-            "data-testid": `${r}-button`,
-            "aria-label": c,
-            className: `${e}__button ${e}__button--search`,
-            onClick: $,
-            children: /* @__PURE__ */ a(j, { "data-testid": `${r}-button-icon`, className: `${e}__button__icon` })
-          }
-        ),
-        n && s === "idle" ? /* @__PURE__ */ a(
-          "button",
-          {
-            type: "button",
-            "data-testid": `${r}-close-button`,
-            "aria-label": "Close Search",
-            className: `${e}__button ${e}__button--close`,
-            onClick: $,
-            children: /* @__PURE__ */ a(D, { "data-testid": `${r}-form-icon`, className: `${e}__button__icon` })
-          }
-        ) : null,
-        n && E ? /* @__PURE__ */ a(
-          V,
-          {
-            "data-testid": `${r}-form-icon`,
-            className: `${e}__button__icon ${e}__input-status-icon`
-          }
-        ) : null,
-        /* @__PURE__ */ a(
+  return /* @__PURE__ */ p(k, { children: [
+    /* @__PURE__ */ a(O, { variant: H.heading3, className: `${e}__label`, children: l }),
+    /* @__PURE__ */ a(
+      "div",
+      {
+        ...T,
+        className: u(e, R, { [`${e}--active`]: t }),
+        "data-testid": m,
+        role: "search",
+        ...x,
+        children: /* @__PURE__ */ p(
           "form",
           {
-            "data-testid": `${r}-form`,
-            className: f(`${e}__form`, { [`${e}__form--active`]: n }),
-            "aria-hidden": !n,
-            ref: u,
-            children: /* @__PURE__ */ v("div", { className: f(`${e}__content-wrapper`), role: "combobox", "aria-haspopup": "listbox", children: [
-              /* @__PURE__ */ a(
-                T,
+            "data-testid": `${m}-form`,
+            className: u(`${e}__form`, {
+              [`${e}__form--active`]: t
+            }),
+            ref: o,
+            children: [
+              /* @__PURE__ */ p(
+                "div",
                 {
-                  className: `${e}__input`,
-                  id: "search-input",
-                  hideLabel: !0,
-                  labelText: c,
-                  placeholder: l != null ? l : null,
-                  type: "text",
-                  defaultValue: C,
-                  invalid: s === "invalid",
-                  invalidText: k,
-                  onKeyDown: S,
-                  onChange: h ? (t) => {
-                    h(t.target.value);
-                  } : void 0,
-                  ref: m
+                  className: u(`${e}__content-wrapper`, {
+                    [`${e}__content-wrapper--active`]: t
+                  }),
+                  role: "combobox",
+                  "aria-haspopup": "listbox",
+                  children: [
+                    /* @__PURE__ */ a(
+                      M,
+                      {
+                        in: t,
+                        classNames: `${y}-input`,
+                        addEndListener: () => {
+                        },
+                        children: /* @__PURE__ */ a(
+                          j,
+                          {
+                            "aria-hidden": !t,
+                            className: `${e}__input`,
+                            id: "search-input",
+                            hideLabel: !0,
+                            labelText: l,
+                            placeholder: t ? b : "",
+                            type: "text",
+                            defaultValue: I,
+                            invalid: c === "invalid",
+                            invalidText: E,
+                            onKeyDown: _,
+                            onChange: S ? (r) => {
+                              S(r.target.value);
+                            } : void 0,
+                            ref: h
+                          }
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ a(
+                      K,
+                      {
+                        className: e,
+                        searchButtonText: l,
+                        state: c,
+                        testId: m,
+                        isSearchExpanded: t,
+                        setIsSearchExpanded: g
+                      }
+                    )
+                  ]
                 }
               ),
-              o && o.length > 2 ? /* @__PURE__ */ a(
+              s && s.length > 2 ? /* @__PURE__ */ a(
                 F,
                 {
-                  autoCompleteResults: R,
-                  isLoading: s === "loading",
-                  loadingText: x,
-                  onKeyDown: S,
+                  autoCompleteResults: C,
+                  isLoading: c === "loading",
+                  loadingText: w,
+                  onKeyDown: _,
                   children: /* @__PURE__ */ a("li", { className: `${e}__result`, children: /* @__PURE__ */ a(
-                    A,
+                    D,
                     {
-                      href: ((t) => N(_(t)))(o),
-                      children: /* @__PURE__ */ a("p", { children: y(o) })
+                      href: ((r) => N(v(r)))(s),
+                      children: /* @__PURE__ */ a("p", { children: L(s) })
                     }
                   ) }, "viewAllSearchResults")
                 }
               ) : null
-            ] })
+            ]
           }
         )
-      ]
-    }
-  );
+      }
+    )
+  ] });
 };
 export {
-  Z as default
+  re as default
 };