@phillips/seldon 1.246.0 → 1.247.0

package/dist/components/Navigation/NavigationSubmenu/NavigationSubmenu.js

@@ -0,0 +1,41 @@
+import { jsxs as s, Fragment as h, jsx as i } from "react/jsx-runtime";
+import l from "../../../_virtual/index.js";
+import * as n from "react";
+import { px as e } from "../../../utils/index.js";
+import { TextVariants as d } from "../../Text/types.js";
+import f from "../../Text/Text.js";
+const k = n.forwardRef(
+  ({ id: r, children: o, className: N, leftSectionHeading: m, rightSectionHeading: _, onClick: u, wrapLinksInRadixLink: c, ...x }, C) => {
+    const p = n.Children.toArray(o).map((t) => {
+      if (n.isValidElement(t) && t.props.navGroup === "nav-link-start")
+        return n.cloneElement(t, {
+          onClick: (a) => {
+            u?.(a), t.props?.onClick?.(a);
+          },
+          ...c ? { asRadixSubmenuLink: !0 } : {}
+        });
+    }).filter(Boolean), v = n.Children.toArray(o).map((t) => {
+      if (n.isValidElement(t) && t.props.navGroup === "nav-link-end")
+        return n.cloneElement(t, {
+          onClick: (a) => {
+            u?.(a), t.props?.onClick?.(a);
+          },
+          ...c ? { asRadixSubmenuLink: !0 } : {}
+        });
+    }).filter(Boolean), $ = /* @__PURE__ */ s(h, { children: [
+      p.length > 0 ? /* @__PURE__ */ s("div", { className: l(`${e}-nav__list__section`, `${e}-nav__list__section--start`), children: [
+        m ? /* @__PURE__ */ i(f, { variant: d.headingMedium, className: `${e}-nav__list__section--start__title`, children: m }) : null,
+        p
+      ] }) : null,
+      v.length > 0 ? /* @__PURE__ */ s("div", { className: l(`${e}-nav__list__section`, `${e}-nav__list__section--end`), children: [
+        _ ? /* @__PURE__ */ i(f, { variant: d.headingMedium, className: `${e}-nav__list__section--end__title`, children: _ }) : null,
+        v
+      ] }) : null
+    ] }), g = l(N, `${e}-nav__list`);
+    return /* @__PURE__ */ i("ul", { id: r, "data-testid": r, role: "list", className: g, ref: C, ...x, children: $ });
+  }
+);
+k.displayName = "NavigationSubmenu";
+export {
+  k as default
+};

package/dist/components/Navigation/NavigationSubmenu/NavigationSubmenu.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Search/Search.js

@@ -18,66 +18,66 @@ const X = j(
     onSearch: S,
     onCancel: _,
     searchResults: N = [],
-    state: o = "idle",
+    state: i = "idle",
     defaultValue: R = "",
-    className: C,
+    className: b,
     placeholder: I = "",
-    searchButtonText: i = "Search",
-    loadingText: E = "Search In Progress...",
-    invalidText: b = "Invalid search",
+    searchButtonText: l = "Search",
+    loadingText: C = "Search In Progress...",
+    invalidText: E = "Invalid search",
     getAllResultsText: k = (e) => `View all results for ${e}`,
     getAllResultsLink: v = (e) => `/Search?Search=${e}`,
     ...x
   }, L) => {
-    const { className: e, "data-testid": l, ...P } = A(x, "Search"), c = D(B), d = f(null), m = f(null), g = f(null), a = c.isSearchExpanded, n = d.current?.value, [T, h] = H(!0), y = S ? (r) => {
-      S(r.target.value);
+    const { className: e, "data-testid": n, ...P } = A(x, "Search"), c = D(B), d = f(null), m = f(null), $ = f(null), r = c.isSearchExpanded, o = d.current?.value, [T, h] = H(!0), y = S ? (a) => {
+      S(a.target.value);
     } : void 0;
-    z(g, (r) => {
-      _?.(), p(!1), r.stopPropagation();
+    z($, (a) => {
+      _?.(), p(!1), a.stopPropagation();
     });
-    const $ = (r) => {
-      if (r.stopPropagation(), r.key === "Enter") {
-        if (r.preventDefault(), n && n.length > 2) {
-          const V = w(v(n));
+    const g = (a) => {
+      if (a.stopPropagation(), a.key === "Enter") {
+        if (a.preventDefault(), o && o.length > 2) {
+          const V = w(v(o));
           h(!1), window.location.href = V;
         }
-        r.currentTarget instanceof HTMLAnchorElement && (h(!1), r.currentTarget.click());
+        a.currentTarget instanceof HTMLAnchorElement && (h(!1), a.currentTarget.click());
       }
-      r.key === "Escape" && (m.current?.reset(), c.setIsSearchExpanded(!1));
+      a.key === "Escape" && (m.current?.reset(), c.setIsSearchExpanded(!1));
     };
     O(() => {
-      if (a) {
+      if (r) {
         d.current?.focus();
         return;
       }
-    }, [a]);
-    const p = (r) => {
-      m.current?.reset(), c.setIsSearchExpanded(r);
+    }, [r]);
+    const p = (a) => {
+      m.current?.reset(), c.setIsSearchExpanded(a);
     };
-    return /* @__PURE__ */ t(J, { enabled: a, allowPinchZoom: !0, removeScrollBar: !1, children: /* @__PURE__ */ t("div", { className: `${e}__container`, ref: L, children: /* @__PURE__ */ u(
+    return /* @__PURE__ */ t(J, { enabled: r, allowPinchZoom: !0, removeScrollBar: !1, children: /* @__PURE__ */ t("div", { className: `${e}__container`, ref: L, children: /* @__PURE__ */ u(
       "div",
       {
         className: `${e}__container__inner`,
-        ref: g,
-        onClick: (r) => {
-          a || (p(!0), r.stopPropagation());
+        ref: $,
+        onClick: (a) => {
+          r || (p(!0), a.stopPropagation());
         },
         children: [
-          /* @__PURE__ */ t(q, { variant: Z.headingSmall, className: `${e}__container__inner__label`, children: i }),
+          /* @__PURE__ */ t(q, { variant: Z.headingSmall, className: `${e}__container__inner__label`, children: l }),
           /* @__PURE__ */ t(
             "div",
             {
               ...P,
-              className: s(e, C, { [`${e}--active`]: a }),
-              "data-testid": l,
+              className: s(e, b, { [`${e}--active`]: r }),
+              "data-testid": n,
               role: "search",
               ...x,
               children: /* @__PURE__ */ u(
                 "form",
                 {
-                  "data-testid": `${l}-form`,
+                  "data-testid": `${n}-form`,
                   className: s(`${e}__form`, {
-                    [`${e}__form--active`]: a
+                    [`${e}__form--active`]: r
                   }),
                   ref: m,
                   children: [
@@ -85,34 +85,37 @@ const X = j(
                       "div",
                       {
                         className: s(`${e}__content-wrapper`, {
-                          [`${e}__content-wrapper--active`]: a
+                          [`${e}__content-wrapper--active`]: r
                         }),
                         role: "combobox",
                         "aria-haspopup": "listbox",
+                        "aria-expanded": r,
+                        "aria-controls": r ? `${n}-listbox` : void 0,
                         children: [
                           /* @__PURE__ */ t(
                             W,
                             {
-                              in: a,
+                              in: r,
                               classNames: `${F}-input`,
                               addEndListener: () => {
                               },
                               children: /* @__PURE__ */ t(
                                 K,
                                 {
-                                  "aria-hidden": !a,
+                                  "aria-hidden": !r,
                                   className: `${e}__input`,
                                   id: "search-input",
                                   hideLabel: !0,
-                                  labelText: i,
-                                  placeholder: a ? I : "",
+                                  labelText: l,
+                                  placeholder: r ? I : "",
                                   type: "text",
                                   defaultValue: R,
-                                  invalid: o === "invalid",
-                                  invalidText: b,
-                                  onKeyDown: $,
+                                  invalid: i === "invalid",
+                                  invalidText: E,
+                                  onKeyDown: g,
                                   onChange: y,
-                                  ref: d
+                                  ref: d,
+                                  tabIndex: r ? 0 : -1
                                 }
                               )
                             }
@@ -121,10 +124,10 @@ const X = j(
                             G,
                             {
                               className: e,
-                              searchButtonText: i,
-                              state: o,
-                              testId: l,
-                              isSearchExpanded: a,
+                              searchButtonText: l,
+                              state: i,
+                              testId: n,
+                              isSearchExpanded: r,
                               setIsSearchExpanded: p,
                               onCancel: _
                             }
@@ -132,20 +135,21 @@ const X = j(
                         ]
                       }
                     ),
-                    a && T && n && n.length > 2 ? /* @__PURE__ */ t(
+                    r && T && o && o.length > 2 ? /* @__PURE__ */ t(
                       U,
                       {
+                        id: `${n}-listbox`,
                         autoCompleteResults: N,
-                        isLoading: o === "loading",
-                        loadingText: E,
-                        onKeyDown: $,
-                        userInputValue: n,
+                        isLoading: i === "loading",
+                        loadingText: C,
+                        onKeyDown: g,
+                        userInputValue: o,
                         closeSearch: h,
                         children: /* @__PURE__ */ t(
                           "li",
                           {
                             className: s(`${e}__result`, `${e}__result--view-all`),
-                            children: /* @__PURE__ */ t(M, { href: w(v(n)), variant: Q.linkLarge, children: /* @__PURE__ */ t("p", { children: k(n) }) })
+                            children: /* @__PURE__ */ t(M, { href: w(v(o)), variant: Q.linkLarge, children: /* @__PURE__ */ t("p", { children: k(o) }) })
                           },
                           "viewAllSearchResults"
                         )

package/dist/components/Search/SearchButton.js

@@ -1,37 +1,37 @@
 import { jsx as n } from "react/jsx-runtime";
 import e from "../Icon/Icon.js";
 const f = ({
-  state: c,
+  state: b,
   isSearchExpanded: r,
-  setIsSearchExpanded: u,
-  searchButtonText: _,
+  setIsSearchExpanded: a,
+  searchButtonText: c,
   className: t,
   testId: o,
-  onCancel: b,
-  ...a
+  onCancel: _,
+  ...u
 }) => r ? r ? /* @__PURE__ */ n(
   "button",
   {
-    ...a,
+    ...u,
     type: "button",
     "data-testid": `${o}-close-button`,
     "aria-label": "Close Search",
     className: `${t}__button ${t}__button--close`,
     onClick: (i) => {
-      b?.(), u(!1), i.stopPropagation();
+      _?.(), a(!1), i.stopPropagation();
     },
     children: /* @__PURE__ */ n(e, { icon: "CloseX", "data-testid": `${o}-form-icon`, className: `${t}__button__icon` })
   }
 ) : null : /* @__PURE__ */ n(
   "button",
   {
-    ...a,
+    ...u,
     type: "button",
     "data-testid": `${o}-button`,
-    "aria-label": _,
+    "aria-label": c || "Search",
     className: `${t}__button ${t}__button--search`,
     onClick: (i) => {
-      u(!0), i.stopPropagation();
+      a(!0), i.stopPropagation();
     },
     children: /* @__PURE__ */ n(e, { icon: "Search", "data-testid": `${o}-button-icon`, className: `${t}__button__icon` })
   }

package/dist/components/Search/SearchResults/SearchResults.d.ts

@@ -12,6 +12,7 @@ export interface SearchResultsProps extends React.HTMLAttributes<HTMLElement> {
     onKeyDown?: (event: React.KeyboardEvent<HTMLAnchorElement>) => void;
     userInputValue?: string;
     closeSearch: (value: boolean) => void;
+    id?: string;
 }
-declare const SearchResults: ({ autoCompleteResults, isLoading, children, loadingText, onKeyDown, userInputValue, closeSearch, }: React.PropsWithChildren<SearchResultsProps>) => import("react/jsx-runtime").JSX.Element;
+declare const SearchResults: ({ autoCompleteResults, isLoading, children, loadingText, onKeyDown, userInputValue, closeSearch, id, }: React.PropsWithChildren<SearchResultsProps>) => import("react/jsx-runtime").JSX.Element;
 export default SearchResults;

package/dist/components/Search/SearchResults/SearchResults.js

@@ -1,37 +1,38 @@
-import { jsx as r, jsxs as u } from "react/jsx-runtime";
+import { jsx as r, jsxs as f } from "react/jsx-runtime";
 import { px as e } from "../../../utils/index.js";
-import f from "../../Link/Link.js";
-import { LinkVariants as L } from "../../Link/types.js";
-const b = ({
+import L from "../../Link/Link.js";
+import { LinkVariants as x } from "../../Link/types.js";
+const w = ({
   autoCompleteResults: l = [],
-  isLoading: n,
-  children: t,
+  isLoading: t,
+  children: n,
   loadingText: c = "Loading...",
   onKeyDown: o,
   userInputValue: h = "",
-  closeSearch: d
+  closeSearch: d,
+  id: m
 }) => {
-  const m = Array.isArray(l) && l.length > 0;
-  function _(a, s) {
-    return a.split(new RegExp(`(${s})`, "gi")).map(
-      (i, p) => i.toLocaleLowerCase() === s.toLocaleLowerCase() ? /* @__PURE__ */ r("strong", { children: i }, p) : i
+  const _ = Array.isArray(l) && l.length > 0;
+  function p(s, a) {
+    return s.split(new RegExp(`(${a})`, "gi")).map(
+      (i, u) => i.toLocaleLowerCase() === a.toLocaleLowerCase() ? /* @__PURE__ */ r("strong", { children: i }, u) : i
     );
   }
-  return /* @__PURE__ */ r("div", { className: `${e}-search__results`, children: /* @__PURE__ */ u("ul", { "data-testid": "search-results", className: `${e}-search__results-container`, children: [
-    n ? /* @__PURE__ */ r("li", { className: `${e}-search__result`, children: c }) : null,
-    m && l.map((a, s) => /* @__PURE__ */ r("li", { className: `${e}-search__result`, children: /* @__PURE__ */ r(
-      f,
+  return /* @__PURE__ */ r("div", { className: `${e}-search__results`, children: /* @__PURE__ */ f("ul", { id: m, role: "listbox", "data-testid": "search-results", className: `${e}-search__results-container`, children: [
+    t ? /* @__PURE__ */ r("li", { className: `${e}-search__result`, children: c }) : null,
+    _ && l.map((s, a) => /* @__PURE__ */ r("li", { className: `${e}-search__result`, children: /* @__PURE__ */ r(
+      L,
       {
-        href: a.url,
+        href: s.url,
         onKeyDown: o,
         onClick: () => d(!1),
-        variant: L.linkLarge,
-        children: /* @__PURE__ */ r("span", { "data-testid": `search-result-${s}`, className: "${px}-search__result__label", children: _(a.label, h) })
+        variant: x.linkLarge,
+        children: /* @__PURE__ */ r("span", { "data-testid": `search-result-${a}`, className: "${px}-search__result__label", children: p(s.label, h) })
       }
-    ) }, a.id)),
-    t
+    ) }, s.id)),
+    n
   ] }) });
 };
 export {
-  b as default
+  w as default
 };

package/dist/index.d.ts

@@ -26,8 +26,10 @@ export { default as LinkList, type LinkListProps } from './components/LinkList/L
 export { default as Modal, type ModalProps } from './components/Modal/Modal';
 export { default as Navigation, type NavigationProps } from './components/Navigation/Navigation';
 export { default as NavigationItem, type NavigationItemProps, } from './components/Navigation/NavigationItem/NavigationItem';
-export { default as NavigationItemTrigger, type NavigationItemTriggerProps, } from './components/Navigation/NavigationItemTrigger/NavigationItemTrigger';
+export { default as NavigationItemWithSubmenu, type NavigationItemWithSubmenuProps, } from './components/Navigation/NavigationItemWithSubmenu/';
 export { default as NavigationList, type NavigationListProps, } from './components/Navigation/NavigationList/NavigationList';
+export { default as NavigationSubmenu, type NavigationSubmenuProps, } from './components/Navigation/NavigationSubmenu/NavigationSubmenu';
+export { NavigationDesktopSubmenu, type NavigationDesktopSubmenuProps, } from './components/Navigation/NavigationItemWithSubmenu/';
 export { default as Pagination, type PaginationOption, type PaginationOptionValue, type PaginationProps, } from './components/Pagination/Pagination';
 export * from './components/PinchZoom';
 export { default as Row, type RowProps } from './components/Row/Row';