@phillips/seldon 1.51.1 → 1.53.0

package/dist/assets/account_circle.svg.js

@@ -1,5 +1,5 @@
 import * as e from "react";
-const C = (t) => /* @__PURE__ */ e.createElement("svg", { width: 19, height: 20, viewBox: "0 0 19 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M9.5026 0.833984C4.4426 0.833984 0.335938 4.94065 0.335938 10.0007C0.335938 15.0607 4.4426 19.1673 9.5026 19.1673C14.5626 19.1673 18.6693 15.0607 18.6693 10.0007C18.6693 4.94065 14.5626 0.833984 9.5026 0.833984ZM9.5026 3.58398C11.0243 3.58398 12.2526 4.81232 12.2526 6.33398C12.2526 7.85565 11.0243 9.08398 9.5026 9.08398C7.98094 9.08398 6.7526 7.85565 6.7526 6.33398C6.7526 4.81232 7.98094 3.58398 9.5026 3.58398ZM9.5026 16.6007C7.21094 16.6007 5.1851 15.4273 4.0026 13.649C4.0301 11.8248 7.66927 10.8257 9.5026 10.8257C11.3268 10.8257 14.9751 11.8248 15.0026 13.649C13.8201 15.4273 11.7943 16.6007 9.5026 16.6007Z", fill: "#ADADAD" }));
+const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("g", { clipPath: "url(#clip0_11553_447)" }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.5 5.5C10.5 6.88071 9.38071 8 8 8C6.61929 8 5.5 6.88071 5.5 5.5C5.5 4.11929 6.61929 3 8 3C9.38071 3 10.5 4.11929 10.5 5.5ZM9.5 5.5C9.5 6.32843 8.82843 7 8 7C7.17157 7 6.5 6.32843 6.5 5.5C6.5 4.67157 7.17157 4 8 4C8.82843 4 9.5 4.67157 9.5 5.5Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { d: "M5.375 10C4.75 10 4.5 10.75 4.5 11.0769V12.5C4.5 12.75 4.25 13 4 13C3.75 13 3.5 12.75 3.5 12.5V11.0769C3.5 10.0148 4.33947 9 5.375 9H10.625C11.6605 9 12.5 10.0148 12.5 11.0769V12.5C12.5 12.75 12.25 13 12 13C11.75 13 11.5 12.75 11.5 12.5V11.0769C11.5 10.75 11.2463 10 10.625 10H5.375Z", fill: "black" })), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_11553_447" }, /* @__PURE__ */ e.createElement("rect", { width: 16, height: 16, fill: "white" }))));
 export {
-  C as default
+  t as default
 };

package/dist/assets/minus.svg.js

@@ -1,5 +1,5 @@
 import * as e from "react";
-const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "#323232" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "#323232" }));
+const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "currentColor" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "currentColor" }));
 export {
   t as default
 };

package/dist/assets/plus.svg.js

@@ -1,5 +1,5 @@
 import * as e from "react";
-const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "#323232" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.1071 4.5C12.5805 4.5 12.9643 4.83579 12.9643 5.25L12.9643 18.75C12.9643 19.1642 12.5805 19.5 12.1071 19.5C11.6338 19.5 11.25 19.1642 11.25 18.75L11.25 5.25C11.25 4.83579 11.6338 4.5 12.1071 4.5Z", fill: "#323232" }));
+const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.5 11.8929C4.5 11.4195 4.83579 11.0357 5.25 11.0357L18.75 11.0357C19.1642 11.0357 19.5 11.4195 19.5 11.8929C19.5 12.3662 19.1642 12.75 18.75 12.75L5.25 12.75C4.83579 12.75 4.5 12.3662 4.5 11.8929Z", fill: "currentColor" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.1071 4.5C12.5805 4.5 12.9643 4.83579 12.9643 5.25L12.9643 18.75C12.9643 19.1642 12.5805 19.5 12.1071 19.5C11.6338 19.5 11.25 19.1642 11.25 18.75L11.25 5.25C11.25 4.83579 11.6338 4.5 12.1071 4.5Z", fill: "currentColor" }));
 export {
   t as default
 };

package/dist/components/Accordion/AccordionItem.d.ts

@@ -7,15 +7,19 @@ export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement>
     /**
      * When true, prevents the user from interacting with the item.
      */
-    isLocked: boolean;
+    isLocked?: boolean;
     /**
      * Determines whether the variation on text style is large or small.
      */
     variation: string;
     /**
-     * Text string for the Accordion header for label.
+     * Uniqueid for the Accordion Item.
      */
-    label: string;
+    id: string;
+    /**
+     * Accordion item label.
+     */
+    label: React.ReactNode;
     /**
      * Child element pass in to display as item content.
      */
@@ -25,5 +29,5 @@ export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement>
      */
     hasTransition?: boolean;
 }
-declare const AccordionItem: ({ isLocked, variation, label, isLastItem, hasTransition, children, ...props }: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const AccordionItem: ({ isLocked, variation, id, label, isLastItem, hasTransition, children, ...props }: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
 export default AccordionItem;

package/dist/components/Accordion/AccordionItem.js

@@ -1,108 +1,110 @@
-import { jsxs as g, jsx as t, Fragment as h } from "react/jsx-runtime";
+import { jsxs as g, jsx as o, Fragment as h } from "react/jsx-runtime";
 import { getCommonProps as $ } from "../../utils/index.js";
-import v from "../../assets/plus.svg.js";
-import f from "../../assets/minus.svg.js";
+import f from "../../assets/plus.svg.js";
+import v from "../../assets/minus.svg.js";
 import I from "../../assets/lock.svg.js";
-import a from "../../node_modules/classnames/index.js";
-import { Item as _, Trigger as C, Content as p } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
-import { getIconClasses as u } from "./utils.js";
-const x = ({
+import d from "../../node_modules/classnames/index.js";
+import { Item as _, Trigger as C, Content as x } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
+import { getIconClasses as p } from "./utils.js";
+const N = ({
   children: n,
-  className: d,
-  baseClassName: o,
-  disable: i,
+  className: s,
+  baseClassName: t,
+  disable: c,
   isLargeVariation: e,
-  id: c
+  id: r
 }) => {
-  const r = i, l = /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+  const a = c, l = /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
     I,
     {
-      className: u(o, e, "lock"),
-      "data-testid": `${c}-lockedIcon`,
+      className: p(t, e, "lock"),
+      "data-testid": `${r}-lockedIcon`,
       "aria-hidden": !0
     }
-  ) }), m = /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
-    v,
+  ) }), u = /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
+    f,
     {
-      className: u(o, e, "plus"),
-      "data-testid": `${c}-plusIcon`,
+      className: p(t, e, "plus"),
+      "data-testid": `${r}-plusIcon`,
       "aria-hidden": !0
     }
-  ) }), s = /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
-    f,
+  ) }), i = /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
+    v,
     {
-      className: u(o, e, "minus"),
-      "data-testid": `${c}-minusIcon`,
+      className: p(t, e, "minus"),
+      "data-testid": `${r}-minusIcon`,
       "aria-hidden": !0
     }
   ) });
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ o(
     C,
     {
-      "data-disabled": i,
+      "data-disabled": c,
       asChild: !0,
-      className: a(o, { [`${o}--hoverable`]: !i }, d),
-      children: /* @__PURE__ */ g("div", { "data-testid": `${c}-trigger`, children: [
-        /* @__PURE__ */ t("div", { className: a(`${o}__text`, { [`${o}__text--lg`]: e }), children: n }),
-        r && l,
-        !r && m,
-        !r && s
+      className: d(t, { [`${t}--hoverable`]: !c }, s),
+      children: /* @__PURE__ */ g("div", { "data-testid": `${r}-trigger`, children: [
+        /* @__PURE__ */ o("div", { className: d(`${t}__text`, { [`${t}__text--lg`]: e }), children: n }),
+        a && l,
+        !a && u,
+        !a && i
       ] })
     }
   );
-}, N = ({
+}, A = ({
   children: n,
-  baseClassName: d,
-  disable: o,
-  hasTransition: i,
+  baseClassName: s,
+  disable: t,
+  hasTransition: c,
   isLargeVariation: e,
-  className: c
-}) => /* @__PURE__ */ t(h, { children: o && n ? /* @__PURE__ */ t("div", { children: n }) : /* @__PURE__ */ t(
-  p,
+  className: r
+}) => /* @__PURE__ */ o(h, { children: t && n ? /* @__PURE__ */ o("div", { children: n }) : /* @__PURE__ */ o(
+  x,
   {
     asChild: !0,
-    className: a(
-      { [`${d}__content--lg`]: e },
-      { [`${d}--transition`]: i },
-      c
+    className: d(
+      { [`${s}__content--lg`]: e },
+      { [`${s}--transition`]: c },
+      r
     ),
     children: n
   }
-) }), F = ({
-  isLocked: n,
-  variation: d,
-  label: o,
-  isLastItem: i,
-  hasTransition: e = !1,
-  children: c,
-  ...r
+) }), H = ({
+  isLocked: n = !1,
+  variation: s,
+  id: t,
+  label: c,
+  isLastItem: e,
+  hasTransition: r = !1,
+  children: a,
+  ...l
 }) => {
-  const { className: l } = $(r, "Accordion"), m = d === "lg", s = `${l}-item`;
+  const { className: u } = $({ id: t }, "Accordion"), i = s === "lg", m = `${u}-item`;
   return /* @__PURE__ */ g(
     _,
     {
       disabled: n,
-      value: o,
-      className: a(s, { [`${s}__border-bottom`]: !i }),
+      value: t,
+      className: d(m, { [`${m}__border-bottom`]: !e }),
+      ...l,
       children: [
-        /* @__PURE__ */ t(
-          x,
+        /* @__PURE__ */ o(
+          N,
           {
             disable: n,
-            isLargeVariation: m,
-            id: r == null ? void 0 : r.id,
-            baseClassName: `${s}-label`,
-            children: o
+            isLargeVariation: i,
+            id: t,
+            baseClassName: `${m}-label`,
+            children: c
           }
         ),
-        /* @__PURE__ */ t(
-          N,
+        /* @__PURE__ */ o(
+          A,
           {
             disable: n,
-            hasTransition: e,
-            isLargeVariation: m,
-            baseClassName: s,
-            children: c
+            hasTransition: r,
+            isLargeVariation: i,
+            baseClassName: m,
+            children: a
           }
         )
       ]
@@ -110,5 +112,5 @@ const x = ({
   );
 };
 export {
-  F as default
+  H as default
 };

package/dist/components/Collapsible/Collapsible.d.ts

@@ -0,0 +1,10 @@
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+export type CollapsibleProps = CollapsiblePrimitive.CollapsibleProps;
+/**
+ * ## Overview
+ *
+ * A 1:1 port of the [Radix UI Collapsible Component](https://www.radix-ui.com/primitives/docs/components/collapsible).
+ *
+ */
+declare const Collapsible: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Collapsible;

package/dist/components/Collapsible/Collapsible.js

@@ -0,0 +1,13 @@
+import { jsx as l } from "react/jsx-runtime";
+import { Root as e } from "../../node_modules/@radix-ui/react-collapsible/dist/index.js";
+import { getCommonProps as t } from "../../utils/index.js";
+import p from "../../node_modules/classnames/index.js";
+import { forwardRef as i } from "react";
+const f = i(({ className: m, ...o }, s) => {
+  const { className: a, ...r } = t(o, "Collapsible");
+  return /* @__PURE__ */ l(e, { className: p(a, m), ...r, ...o, ref: s });
+});
+f.displayName = "Collapsible";
+export {
+  f as default
+};

package/dist/components/Collapsible/CollapsibleContent.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+export type CollapsibleContentProps = CollapsiblePrimitive.CollapsibleContentProps;
+/**
+ * ## Overview
+ *
+ * A 1:1 port of the [Radix UI Collapsible Content Component](https://www.radix-ui.com/primitives/docs/components/collapsible#content).
+ *
+ */
+declare const CollapsibleContent: React.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleContentProps & React.RefAttributes<HTMLDivElement>>;
+export default CollapsibleContent;

package/dist/components/Collapsible/CollapsibleContent.js

@@ -0,0 +1,21 @@
+import { jsx as s } from "react/jsx-runtime";
+import l from "react";
+import { Content as r } from "../../node_modules/@radix-ui/react-collapsible/dist/index.js";
+import { getCommonProps as n } from "../../utils/index.js";
+import p from "../../node_modules/classnames/index.js";
+const f = l.forwardRef(({ className: t, ...o }, e) => {
+  const { className: a, ...m } = n(o, "CollapsibleContent");
+  return /* @__PURE__ */ s(
+    r,
+    {
+      ref: e,
+      className: p(a, t),
+      ...m,
+      ...o
+    }
+  );
+});
+f.displayName = "CollapsibleContent";
+export {
+  f as default
+};

package/dist/components/Collapsible/CollapsibleTrigger.d.ts

@@ -0,0 +1,10 @@
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+export type CollapsibleTriggerProps = CollapsiblePrimitive.CollapsibleTriggerProps;
+/**
+ * ## Overview
+ *
+ * A 1:1 port of the [Radix UI Collapsible Trigger Component](https://www.radix-ui.com/primitives/docs/components/collapsible#trigger).
+ *
+ */
+declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+export default CollapsibleTrigger;

package/dist/components/Collapsible/CollapsibleTrigger.js

@@ -0,0 +1,21 @@
+import { jsx as a } from "react/jsx-runtime";
+import { Trigger as l } from "../../node_modules/@radix-ui/react-collapsible/dist/index.js";
+import { getCommonProps as i } from "../../utils/index.js";
+import t from "../../node_modules/classnames/index.js";
+import { forwardRef as p } from "react";
+const g = p(({ className: o, ...r }, m) => {
+  const { className: s, ...e } = i(r, "CollapsibleTrigger");
+  return /* @__PURE__ */ a(
+    l,
+    {
+      className: t(s, o),
+      ...e,
+      ...r,
+      ref: m
+    }
+  );
+});
+g.displayName = "CollapsibleTrigger";
+export {
+  g as default
+};

package/dist/components/Collapsible/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Collapsible, type CollapsibleProps } from './Collapsible';
+export { default as CollapsibleContent, type CollapsibleContentProps } from './CollapsibleContent';
+export { default as CollapsibleTrigger, type CollapsibleTriggerProps } from './CollapsibleTrigger';

package/dist/components/Dropdown/Dropdown.d.ts

@@ -1,7 +1,7 @@
-import React, { ComponentProps } from 'react';
+import React, { ComponentPropsWithoutRef } from 'react';
 import * as DropdownSelect from '@radix-ui/react-select';
 import { DropdownItem } from './types';
-export interface DropdownProps extends Omit<DropdownSelect.SelectProps, 'defaultValue' | 'dir'>, Omit<ComponentProps<'div'>, 'ref'> {
+export interface DropdownProps extends Omit<DropdownSelect.SelectProps, 'defaultValue' | 'dir'>, ComponentPropsWithoutRef<'div'> {
     /**
      * All options to be listed in the dropdown
      */

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

@@ -1,13 +1,10 @@
-import * as React from 'react';
-export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
-    /**
-     * Default mobile menu label
-     */
-    defaultMobileMenuLabel?: string;
+import React from 'react';
+import { Component, ComponentProps, ReactElement } from 'react';
+export interface HeaderProps extends ComponentProps<'header'> {
     /**
      * Logo src
      */
-    logo?: React.ReactElement<React.Component> | string;
+    logo?: ReactElement<Component> | string;
     /**
      * Toggle open text
      */
@@ -22,11 +19,10 @@ export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
     logoText?: string;
 }
 export type HeaderContextType = {
-    defaultMobileMenuLabel: string;
-    expandedItem: string;
-    setExpandedItem: (item: string) => void;
-    isExpanded: boolean;
-    onSelect: (label: string) => void;
+    /**
+     * Used for mobile navigation menu hiding and showing
+     */
+    isMenuOpen: boolean;
     /**
      * Is the user within the search input and searching
      */
@@ -37,5 +33,16 @@ export type HeaderContextType = {
     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;
+/**
+ * ## Overview
+ *
+ * This component allows navigation, search, login/logout, and language selection and supports desktop and mobile layouts
+ *
+ * [Figma Link Mobile](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/EASEL-Compendium%3A-Tokens%2C-Components-%26-Patterns?node-id=10877-33417&node-type=INSTANCE&m=dev)
+ *
+ * [Figma Link Desktop](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/EASEL-Compendium%3A-Tokens%2C-Components-%26-Patterns?node-id=10570-6295&node-type=FRAME&m=dev)
+ *
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-header--overview)
+ */
+declare const Header: React.ForwardRefExoticComponent<Omit<HeaderProps, "ref"> & React.RefAttributes<HTMLElement>>;
 export default Header;

package/dist/components/Header/Header.js

@@ -1,79 +1,76 @@
-import { jsxs as _, jsx as t } from "react/jsx-runtime";
+import { jsxs as o, jsx as a } from "react/jsx-runtime";
+import l, { createContext as O, forwardRef as P, useState as h } from "react";
 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",
-  ...E
-}) => {
-  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__ */ _("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: s(`${a}-header__overlay`, { [`${a}-header__overlay--active`]: c }),
-        "data-testid": "header-overlay",
-        onClick: g
-      }
-    ),
-    /* @__PURE__ */ t(
-      "button",
-      {
-        "aria-label": n,
-        "data-testid": "mobile-menu-toggle",
-        type: "button",
-        onClick: g,
-        className: s(`${a}-header__toggle-btn`, {
-          [`${a}-header__toggle-btn--open`]: n === m
-        }),
-        children: /* @__PURE__ */ t("span", { children: n })
-      }
-    ),
-    /* @__PURE__ */ _(
-      w.Provider,
-      {
-        value: {
-          defaultMobileMenuLabel: r,
-          expandedItem: p,
-          setExpandedItem: (e) => i(e),
-          isExpanded: N,
-          onSelect: (e) => H(e),
-          isSearchExpanded: C,
-          setIsSearchExpanded: P
-        },
-        children: [
-          /* @__PURE__ */ t("div", { className: s(`${a}-header__nav`, { [`${a}-header__nav--open`]: c }), children: u }),
-          $
-        ]
-      }
-    )
-  ] });
-};
+import { findChildrenOfType as i, findChildrenExcludingTypes as T, px as e } from "../../utils/index.js";
+import j from "../../assets/PhillipsLogo.svg.js";
+import p from "../UserManagement/UserManagement.js";
+import g from "../LanguageSelector/LanguageSelector.js";
+import f from "../Navigation/Navigation.js";
+import { defaultHeaderContext as w } from "./utils.js";
+const I = O(w), L = P(
+  ({
+    logo: d = /* @__PURE__ */ a(j, {}),
+    className: u,
+    children: r,
+    toggleOpenText: _ = "Open Menu",
+    toggleCloseText: v = "Close Menu",
+    logoText: x = "Home Page",
+    ...C
+  }, $) => {
+    const b = i(r, p), m = i(r, g), [c, y] = h(!1), E = i(r, f), N = T(r, [f, p, g]), [n, M] = h(!1), S = n ? v : _, H = function() {
+      M((t) => !t);
+    };
+    return /* @__PURE__ */ o("header", { ...C, className: s(`${e}-header`, u), ref: $, children: [
+      /* @__PURE__ */ o("div", { className: `${e}-header__top-row`, children: [
+        m,
+        " ",
+        /* @__PURE__ */ o(
+          "button",
+          {
+            "aria-label": S,
+            "data-testid": "mobile-menu-toggle",
+            type: "button",
+            onClick: H,
+            className: s(`${e}-header__toggle-btn`, {
+              [`${e}-header__toggle-btn--open`]: n
+            }),
+            children: [
+              /* @__PURE__ */ a("span", {}),
+              " "
+            ]
+          }
+        ),
+        /* @__PURE__ */ a("h1", { "data-testid": "header-logo", className: `${e}-header__logo`, children: /* @__PURE__ */ a("a", { href: "/", "aria-label": x, children: typeof d == "object" ? d : /* @__PURE__ */ a("img", { alt: "Phillips", "data-testid": "header-logo-img", src: d, height: "14" }) }) }),
+        b
+      ] }),
+      /* @__PURE__ */ a("div", { className: s(`${e}-header__nav`, { [`${e}-header__nav--closed`]: !n }), children: /* @__PURE__ */ o(
+        I.Provider,
+        {
+          value: {
+            isMenuOpen: n,
+            isSearchExpanded: c,
+            setIsSearchExpanded: y
+          },
+          children: [
+            l.Children.map(
+              E,
+              (t) => l.isValidElement(t) ? l.cloneElement(t, {
+                children: [
+                  ...l.Children.toArray(t.props.children),
+                  m
+                ]
+              }) : t
+            ),
+            N
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: s(`${e}-header__overlay`, { [`${e}-header__overlay--active`]: c }) })
+    ] });
+  }
+);
+L.displayName = "Header";
 export {
-  w as HeaderContext,
-  D as default
+  I as HeaderContext,
+  L as default
 };

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

@@ -1,9 +1,2 @@
-export declare const defaultHeaderContext: {
-    defaultMobileMenuLabel: string;
-    expandedItem: string;
-    setExpandedItem: () => void;
-    isExpanded: boolean;
-    onSelect: () => void;
-    isSearchExpanded: boolean;
-    setIsSearchExpanded: () => void;
-};
+import { HeaderContextType } from './Header';
+export declare const defaultHeaderContext: HeaderContextType;

package/dist/components/Header/utils.js

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

package/dist/components/LanguageSelector/LanguageSelector.d.ts

@@ -0,0 +1,36 @@
+import { ComponentProps } from 'react';
+import { SupportedLanguages } from '../../types/commonTypes';
+export type LanguageOption = {
+    label: string;
+    value: SupportedLanguages;
+};
+export interface LanguageSelectorProps extends ComponentProps<'div'> {
+    /**
+     * Available language options to select from
+     */
+    languageOptions?: LanguageOption[];
+    /**
+     * The currently selected language, shows in the input
+     */
+    currentLanguage?: SupportedLanguages;
+    /**
+     * Called when the language is changed in the dropdown
+     * @param language
+     */
+    onLanguageChange?: (language: SupportedLanguages) => void;
+    /**
+     * hide or show with an opacity transition
+     */
+    isHidden?: boolean;
+}
+/**
+ * ## Overview
+ *
+ * This is used in the Header component to allow users to change the language of the site.  It is a controlled component.
+ *
+ * [Figma Link](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/EASEL-Compendium%3A-Tokens%2C-Components-%26-Patterns?node-id=10570-6295&m=dev)
+ *
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-languageselector--overview)
+ */
+declare const LanguageSelector: import("react").ForwardRefExoticComponent<Omit<LanguageSelectorProps, "ref"> & import("react").RefAttributes<HTMLElement>>;
+export default LanguageSelector;