@viasat/beam-react 2.14.0 → 2.16.0

package/chunks/combobox.--djB8BC.js

@@ -0,0 +1,4 @@
+const o = "var(--bm-combobox-dropdown-max-items, 8)", e = "var(--bm-comp-actionlist-size-height, 2.5rem)", c = "var(--bm-sem-space-50, 0.5rem)", t = "var(--bm-sem-space-100, 1rem)", a = (m) => `min(calc(${m}px - ${t}), calc(${o} * ${e} + 2 * ${c}))`;
+export {
+  a as g
+};

package/chunks/combobox.9scnST_n.js

@@ -0,0 +1 @@
+"use strict";const o="var(--bm-combobox-dropdown-max-items, 8)",e="var(--bm-comp-actionlist-size-height, 2.5rem)",t="var(--bm-sem-space-50, 0.5rem)",c="var(--bm-sem-space-100, 1rem)",s=m=>`min(calc(${m}px - ${c}), calc(${o} * ${e} + 2 * ${t}))`;exports.getDropdownMaxHeight=s;

package/lib/Autocomplete/useAutocompleteDropdown.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const te=require("../../chunks/constants.hwjHOsvT.js"),ne=require("../../chunks/dom.zgzOBFUw.js"),r=require("@floating-ui/react"),t=require("react"),se=`${te.prefix}combobox__field__chevron`,oe=j=>{const{disabled:x,readOnly:F,lastSelectedOptionIndex:l,fieldRef:p}=j,[n,$]=t.useState(!1),o=t.useRef(null),E=t.useRef(n);E.current=n;const R=r.useFloatingNodeId(),[I,z]=t.useState(null),[g,v]=t.useState(!0),[P,S]=t.useState(!1),b=t.useRef(!1),V=t.useCallback(e=>{I!==e&&(P?(S(!1),l===void 0&&v(!0)):v(!0),z(e))},[I,P,l]),f=t.useCallback((e,s,a)=>{var i;const u=l===void 0&&((i=o.current)==null?void 0:i.value)==="";!e&&a==="click"&&s instanceof MouseEvent&&!u&&!(s.target instanceof HTMLElement&&s.target.classList.contains(se))||($(e),e&&a==="click"&&(s instanceof MouseEvent||s instanceof PointerEvent)&&(S(!0),v(!1)))},[l,o]),{context:d,refs:c,floatingStyles:D}=r.useFloating({placement:"bottom-start",middleware:[{name:"overrideReference",fn:({rects:e})=>({reset:{rects:{...e,reference:ne.getElementScrollBoundingClientRect(p.current)??e.reference}}})},r.flip(),r.size({apply({elements:e,rects:s}){Object.assign(e.floating.style,{width:`${s.reference.width}px`})}})],whileElementsMounted:r.autoUpdate,open:n,onOpenChange:f,nodeId:R});o.current=c.domReference.current;const k=t.useCallback(e=>{b.current=!0,e.target!==o.current&&e.preventDefault()},[o]),y=t.useCallback(e=>{b.current=!1,e.target!==o.current&&e.preventDefault()},[o]),m=t.useRef([]),G=t.useRef([]),J=r.useClick(d,{enabled:!x&&!F,keyboardHandlers:!1}),Q=r.useRole(d,{role:"listbox"}),W=r.useDismiss(d,{outsidePress:!1}),O=m.current.length===0?null:I??null,M=t.useRef(l??null),X=t.useMemo(()=>n?M.current:(M.current=l??null,m.current.length===0?null:l??null),[l,n]),Y=r.useListNavigation(d,{enabled:!x&&!F,listRef:m,activeIndex:O,selectedIndex:X,onNavigate:V,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),{getReferenceProps:h,getFloatingProps:A,getItemProps:K}=r.useInteractions([Q,W,Y]),{getReferenceProps:_}=r.useInteractions([J]),[T,Z]=t.useState(n);t.useEffect(()=>Z(n),[n]);const C=n?"open":"closed",w=t.useCallback(e=>{var i;if(!n)return;const s=e.type==="focus"?e.target:e.relatedTarget,a=c.floating.current,u=p.current;if(a!=null&&a.contains(s)||u!=null&&u.contains(s)||b.current){e.preventDefault(),e.stopPropagation(),(i=o.current)==null||i.focus();return}f(!1,e.nativeEvent,"focus-out")},[p,n,o,c.floating,f]),q=t.useRef(n);t.useEffect(()=>{var e;q.current&&!n&&((e=o.current)==null||e.focus()),q.current=n},[n,o]);const N=t.useCallback((e={})=>({ref:c.setReference,...h({...e})}),[c.setReference,h]),B=t.useCallback((e={})=>({ref:p,onKeyDownCapture:s=>{var U;const a=E.current,u=o.current,i=u==null?void 0:u.getAttribute("aria-activedescendant"),L=i?document.getElementById(i):null;if(s.key==="Enter"&&a){if(s.preventDefault(),s.stopPropagation(),g&&L){const ee=new KeyboardEvent("keydown",s.nativeEvent);L.dispatchEvent(ee)}return}(U=e.onKeyDownCapture)==null||U.call(e,s)},onFocusCapture:w,onBlurCapture:w,..._({...e,onMouseDownCapture:k,onMouseUpCapture:y,onPointerDownCapture:k,onPointerUpCapture:y})}),[p,w,_,k,y,o,g]),H=t.useMemo(()=>({isMounted:T,status:C,getFloatingProps:A,getItemProps:K,floatingStyles:D,setOpen:f,nodeId:R,context:d,labelsRef:G,elementsRef:m,setFloating:c.setFloating,activeIndex:g?O:null}),[T,C,A,K,D,f,R,d,c.setFloating,O,g]);return t.useMemo(()=>({getFieldProps:B,getInputProps:N,dropdownProps:H,refs:c,open:n,setOpen:f,status:C,setDisplayActiveIndex:v}),[H,B,N,n,c,f,C])};exports.useAutocompleteDropdown=oe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const te=require("../../chunks/constants.hwjHOsvT.js"),ne=require("../../chunks/dom.zgzOBFUw.js"),u=require("@floating-ui/react"),t=require("react"),se=require("../../chunks/combobox.9scnST_n.js"),oe=`${te.prefix}combobox__field__chevron`,re=u.flip({crossAxis:!1,mainAxis:!0,flipAlignment:!1}),ce=U=>{const{disabled:O,readOnly:F,lastSelectedOptionIndex:i,fieldRef:p}=U,[s,$]=t.useState(!1),r=t.useRef(null),P=t.useRef(s);P.current=s;const C=u.useFloatingNodeId(),[b,z]=t.useState(null),[g,m]=t.useState(!0),[D,E]=t.useState(!1),I=t.useRef(!1),V=t.useCallback(e=>{b!==e&&(D?(E(!1),i===void 0&&m(!0)):m(!0),z(e))},[b,D,i]),f=t.useCallback((e,n,o)=>{var l;const c=i===void 0&&((l=r.current)==null?void 0:l.value)==="";!e&&o==="click"&&n instanceof MouseEvent&&!c&&!(n.target instanceof HTMLElement&&n.target.classList.contains(oe))||($(e),e&&o==="click"&&(n instanceof MouseEvent||n instanceof PointerEvent)&&(E(!0),m(!1)))},[i,r]),{context:d,refs:a,floatingStyles:S}=u.useFloating({placement:"bottom-start",middleware:[{name:"overrideReference",fn:async e=>{const n=ne.getElementScrollBoundingClientRect(p.current),o=n?{...e.rects,reference:n}:e.rects,c=await re.fn({...e,rects:o}),l=typeof c.reset=="object"?c.reset.placement:void 0;return l?{reset:{placement:l,rects:o}}:n?{reset:{rects:o}}:{}}},u.size({apply({elements:e,rects:n,availableHeight:o}){Object.assign(e.floating.style,{width:`${n.reference.width}px`,maxHeight:se.getDropdownMaxHeight(o)})}})],whileElementsMounted:u.autoUpdate,open:s,onOpenChange:f,nodeId:C});r.current=a.domReference.current;const y=t.useCallback(e=>{I.current=!0,e.target!==r.current&&e.preventDefault()},[r]),k=t.useCallback(e=>{I.current=!1,e.target!==r.current&&e.preventDefault()},[r]),v=t.useRef([]),G=t.useRef([]),J=u.useClick(d,{enabled:!O&&!F,keyboardHandlers:!1}),Q=u.useRole(d,{role:"listbox"}),W=u.useDismiss(d,{outsidePress:!1}),x=v.current.length===0?null:b??null,M=t.useRef(i??null),X=t.useMemo(()=>s?M.current:(M.current=i??null,v.current.length===0?null:i??null),[i,s]),Y=u.useListNavigation(d,{enabled:!O&&!F,listRef:v,activeIndex:x,selectedIndex:X,onNavigate:V,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),{getReferenceProps:h,getFloatingProps:A,getItemProps:K}=u.useInteractions([Q,W,Y]),{getReferenceProps:_}=u.useInteractions([J]),[q,Z]=t.useState(s);t.useEffect(()=>Z(s),[s]);const R=s?"open":"closed",w=t.useCallback(e=>{var l;if(!s)return;const n=e.type==="focus"?e.target:e.relatedTarget,o=a.floating.current,c=p.current;if(o!=null&&o.contains(n)||c!=null&&c.contains(n)||I.current){e.preventDefault(),e.stopPropagation(),(l=r.current)==null||l.focus();return}f(!1,e.nativeEvent,"focus-out")},[p,s,r,a.floating,f]),H=t.useRef(s);t.useEffect(()=>{var e;H.current&&!s&&((e=r.current)==null||e.focus()),H.current=s},[s,r]);const T=t.useCallback((e={})=>({ref:a.setReference,...h({...e})}),[a.setReference,h]),N=t.useCallback((e={})=>({ref:p,onKeyDownCapture:n=>{var L;const o=P.current,c=r.current,l=c==null?void 0:c.getAttribute("aria-activedescendant"),B=l?document.getElementById(l):null;if(n.key==="Enter"&&o){if(n.preventDefault(),n.stopPropagation(),g&&B){const ee=new KeyboardEvent("keydown",n.nativeEvent);B.dispatchEvent(ee)}return}(L=e.onKeyDownCapture)==null||L.call(e,n)},onFocusCapture:w,onBlurCapture:w,..._({...e,onMouseDownCapture:y,onMouseUpCapture:k,onPointerDownCapture:y,onPointerUpCapture:k})}),[p,w,_,y,k,r,g]),j=t.useMemo(()=>({isMounted:q,status:R,getFloatingProps:A,getItemProps:K,floatingStyles:S,setOpen:f,nodeId:C,context:d,labelsRef:G,elementsRef:v,setFloating:a.setFloating,activeIndex:g?x:null}),[q,R,A,K,S,f,C,d,a.setFloating,x,g]);return t.useMemo(()=>({getFieldProps:N,getInputProps:T,dropdownProps:j,refs:a,open:s,setOpen:f,status:R,setDisplayActiveIndex:m}),[j,N,T,s,a,f,R])};exports.useAutocompleteDropdown=ce;

package/lib/Autocomplete/useAutocompleteDropdown.es.js

@@ -1,51 +1,59 @@
 import { p as re } from "../../chunks/constants.CKKGf1-i.js";
 import { g as ce } from "../../chunks/dom.DGM-dxLe.js";
-import { useFloatingNodeId as le, useFloating as ie, autoUpdate as ae, flip as ue, size as fe, useClick as de, useRole as pe, useDismiss as ge, useListNavigation as me, useInteractions as V } from "@floating-ui/react";
-import { useState as g, useRef as u, useCallback as f, useMemo as E, useEffect as q } from "react";
-const ve = `${re}combobox__field__chevron`, Oe = (G) => {
-  const { disabled: P, readOnly: b, lastSelectedOptionIndex: c, fieldRef: p } = G, [t, J] = g(!1), o = u(null), D = u(t);
-  D.current = t;
-  const y = le(), [R, Q] = g(null), [m, v] = g(!0), [h, A] = g(!1), x = u(!1), W = f((e) => {
-    R !== e && (h ? (A(!1), c === void 0 && v(!0)) : v(!0), Q(e));
-  }, [R, h, c]), a = f((e, n, l) => {
-    var i;
-    const r = c === void 0 && ((i = o.current) == null ? void 0 : i.value) === "";
-    !e && l === "click" && n instanceof MouseEvent && !r && !(n.target instanceof HTMLElement && n.target.classList.contains(ve)) || (J(e), e && l === "click" && (n instanceof MouseEvent || n instanceof PointerEvent) && (A(!0), v(!1)));
-  }, [c, o]), { context: d, refs: s, floatingStyles: M } = ie({
+import { flip as ie, useFloatingNodeId as le, useFloating as ae, autoUpdate as ue, size as fe, useClick as de, useRole as pe, useDismiss as ge, useListNavigation as me, useInteractions as V } from "@floating-ui/react";
+import { useState as g, useRef as u, useCallback as f, useMemo as P, useEffect as q } from "react";
+import { g as ve } from "../../chunks/combobox.--djB8BC.js";
+const Ie = `${re}combobox__field__chevron`, xe = ie({ crossAxis: !1, mainAxis: !0, flipAlignment: !1 }), ke = (G) => {
+  const { disabled: b, readOnly: D, lastSelectedOptionIndex: l, fieldRef: p } = G, [n, J] = g(!1), s = u(null), E = u(n);
+  E.current = n;
+  const y = le(), [w, Q] = g(null), [m, v] = g(!0), [h, A] = g(!1), C = u(!1), W = f((e) => {
+    w !== e && (h ? (A(!1), l === void 0 && v(!0)) : v(!0), Q(e));
+  }, [w, h, l]), a = f((e, t, o) => {
+    var c;
+    const r = l === void 0 && ((c = s.current) == null ? void 0 : c.value) === "";
+    !e && o === "click" && t instanceof MouseEvent && !r && !(t.target instanceof HTMLElement && t.target.classList.contains(Ie)) || (J(e), e && o === "click" && (t instanceof MouseEvent || t instanceof PointerEvent) && (A(!0), v(!1)));
+  }, [l, s]), { context: d, refs: i, floatingStyles: M } = ae({
     placement: "bottom-start",
     middleware: [
+      // Floating UI does not re-run flip() after a middleware returns `reset` with
+      // overridden rects, so we manually invoke flip inside this custom middleware
+      // to ensure the dropdown flips correctly when the reference rect is replaced.
       {
         name: "overrideReference",
-        fn: ({ rects: e }) => ({
-          reset: {
-            rects: {
-              ...e,
-              reference: ce(p.current) ?? e.reference
+        fn: async (e) => {
+          const t = ce(p.current), o = t ? {
+            ...e.rects,
+            reference: t
+          } : e.rects, r = await xe.fn({ ...e, rects: o }), c = typeof r.reset == "object" ? r.reset.placement : void 0;
+          return c ? {
+            reset: {
+              placement: c,
+              rects: o
             }
-          }
-        })
+          } : t ? { reset: { rects: o } } : {};
+        }
       },
-      ue(),
       fe({
-        apply({ elements: e, rects: n }) {
+        apply({ elements: e, rects: t, availableHeight: o }) {
           Object.assign(e.floating.style, {
-            width: `${n.reference.width}px`
+            width: `${t.reference.width}px`,
+            maxHeight: ve(o)
           });
         }
       })
     ],
-    whileElementsMounted: ae,
-    open: t,
+    whileElementsMounted: ue,
+    open: n,
     onOpenChange: a,
     nodeId: y
   });
-  o.current = s.domReference.current;
-  const O = f((e) => {
-    x.current = !0, e.target !== o.current && e.preventDefault();
-  }, [o]), w = f((e) => {
-    x.current = !1, e.target !== o.current && e.preventDefault();
-  }, [o]), I = u([]), X = u([]), Y = de(d, { enabled: !P && !b, keyboardHandlers: !1 }), Z = pe(d, { role: "listbox" }), ee = ge(d, { outsidePress: !1 }), F = I.current.length === 0 ? null : R ?? null, S = u(c ?? null), te = E(() => t ? S.current : (S.current = c ?? null, I.current.length === 0 ? null : c ?? null), [c, t]), ne = me(d, {
-    enabled: !P && !b,
+  s.current = i.domReference.current;
+  const R = f((e) => {
+    C.current = !0, e.target !== s.current && e.preventDefault();
+  }, [s]), O = f((e) => {
+    C.current = !1, e.target !== s.current && e.preventDefault();
+  }, [s]), I = u([]), X = u([]), Y = de(d, { enabled: !b && !D, keyboardHandlers: !1 }), Z = pe(d, { role: "listbox" }), ee = ge(d, { outsidePress: !1 }), F = I.current.length === 0 ? null : w ?? null, S = u(l ?? null), te = P(() => n ? S.current : (S.current = l ?? null, I.current.length === 0 ? null : l ?? null), [l, n]), ne = me(d, {
+    enabled: !b && !D,
     listRef: I,
     activeIndex: F,
     selectedIndex: te,
@@ -57,95 +65,95 @@ const ve = `${re}combobox__field__chevron`, Oe = (G) => {
     loop: !0,
     virtual: !0,
     scrollItemIntoView: !0
-  }), { getReferenceProps: K, getFloatingProps: _, getItemProps: N } = V([
+  }), { getReferenceProps: K, getFloatingProps: _, getItemProps: H } = V([
     Z,
     ee,
     ne
-  ]), { getReferenceProps: T } = V([Y]), [B, oe] = g(t);
-  q(() => oe(t), [t]);
-  const C = t ? "open" : "closed", k = f(
+  ]), { getReferenceProps: N } = V([Y]), [T, oe] = g(n);
+  q(() => oe(n), [n]);
+  const x = n ? "open" : "closed", k = f(
     (e) => {
-      var i;
-      if (!t)
+      var c;
+      if (!n)
         return;
-      const n = e.type === "focus" ? e.target : e.relatedTarget, l = s.floating.current, r = p.current;
-      if (l != null && l.contains(n) || r != null && r.contains(n) || x.current) {
-        e.preventDefault(), e.stopPropagation(), (i = o.current) == null || i.focus();
+      const t = e.type === "focus" ? e.target : e.relatedTarget, o = i.floating.current, r = p.current;
+      if (o != null && o.contains(t) || r != null && r.contains(t) || C.current) {
+        e.preventDefault(), e.stopPropagation(), (c = s.current) == null || c.focus();
         return;
       }
       a(!1, e.nativeEvent, "focus-out");
     },
-    [p, t, o, s.floating, a]
-  ), H = u(t);
+    [p, n, s, i.floating, a]
+  ), B = u(n);
   q(() => {
     var e;
-    H.current && !t && ((e = o.current) == null || e.focus()), H.current = t;
-  }, [t, o]);
+    B.current && !n && ((e = s.current) == null || e.focus()), B.current = n;
+  }, [n, s]);
   const L = f(
     (e = {}) => ({
-      ref: s.setReference,
+      ref: i.setReference,
       ...K({
         ...e
       })
     }),
-    [s.setReference, K]
+    [i.setReference, K]
   ), U = f(
     (e = {}) => ({
       ref: p,
-      onKeyDownCapture: (n) => {
+      onKeyDownCapture: (t) => {
         var z;
-        const l = D.current, r = o.current, i = r == null ? void 0 : r.getAttribute("aria-activedescendant"), j = i ? document.getElementById(i) : null;
-        if (n.key === "Enter" && l) {
-          if (n.preventDefault(), n.stopPropagation(), m && j) {
-            const se = new KeyboardEvent("keydown", n.nativeEvent);
-            j.dispatchEvent(se);
+        const o = E.current, r = s.current, c = r == null ? void 0 : r.getAttribute("aria-activedescendant"), $ = c ? document.getElementById(c) : null;
+        if (t.key === "Enter" && o) {
+          if (t.preventDefault(), t.stopPropagation(), m && $) {
+            const se = new KeyboardEvent("keydown", t.nativeEvent);
+            $.dispatchEvent(se);
           }
           return;
         }
-        (z = e.onKeyDownCapture) == null || z.call(e, n);
+        (z = e.onKeyDownCapture) == null || z.call(e, t);
       },
       onFocusCapture: k,
       onBlurCapture: k,
-      ...T({
+      ...N({
         ...e,
-        onMouseDownCapture: O,
-        onMouseUpCapture: w,
-        onPointerDownCapture: O,
-        onPointerUpCapture: w
+        onMouseDownCapture: R,
+        onMouseUpCapture: O,
+        onPointerDownCapture: R,
+        onPointerUpCapture: O
       })
     }),
-    [p, k, T, O, w, o, m]
-  ), $ = E(
+    [p, k, N, R, O, s, m]
+  ), j = P(
     () => ({
-      isMounted: B,
-      status: C,
+      isMounted: T,
+      status: x,
       getFloatingProps: _,
-      getItemProps: N,
+      getItemProps: H,
       floatingStyles: M,
       setOpen: a,
       nodeId: y,
       context: d,
       labelsRef: X,
       elementsRef: I,
-      setFloating: s.setFloating,
+      setFloating: i.setFloating,
       activeIndex: m ? F : null
     }),
-    [B, C, _, N, M, a, y, d, s.setFloating, F, m]
+    [T, x, _, H, M, a, y, d, i.setFloating, F, m]
   );
-  return E(
+  return P(
     () => ({
       getFieldProps: U,
       getInputProps: L,
-      dropdownProps: $,
-      refs: s,
-      open: t,
+      dropdownProps: j,
+      refs: i,
+      open: n,
       setOpen: a,
-      status: C,
+      status: x,
       setDisplayActiveIndex: v
     }),
-    [$, U, L, t, s, a, C]
+    [j, U, L, n, i, a, x]
   );
 };
 export {
-  Oe as useAutocompleteDropdown
+  ke as useAutocompleteDropdown
 };

package/lib/Select/useSelectDropdown.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@floating-ui/react"),t=require("react"),Q=B=>{const{disabled:v,readOnly:m,lastSelectedOptionIndex:i}=B,[n,H]=t.useState(!1),x=t.useRef(n);x.current=n;const I=c.useFloatingNodeId(),[R,z]=t.useState(null),[d,y]=t.useState(!0),[S,k]=t.useState(!1),w=t.useCallback(e=>{R!==e&&(S?(k(!1),i===void 0&&y(!0)):y(!0),z(e))},[R,S,i]),r=t.useCallback((e,o,u)=>{H(e),e&&u==="click"&&o instanceof PointerEvent&&(k(!0),y(!1))},[]),{context:l,refs:s,floatingStyles:O}=c.useFloating({placement:"bottom-start",middleware:[c.flip(),c.size({apply({rects:e,elements:o}){Object.assign(o.floating.style,{width:`${e.reference.width}px`})}})],whileElementsMounted:c.autoUpdate,open:n,onOpenChange:r,nodeId:I}),f=t.useRef([]),C=t.useRef([]),L=c.useClick(l,{enabled:!v&&!m,keyboardHandlers:!0}),U=c.useRole(l,{role:"listbox"}),V=c.useDismiss(l),p=f.current.length===0?null:R??null,h=t.useRef(i??null),F=t.useMemo(()=>n?h.current:(h.current=i??null,f.current.length===0?null:i??null),[i,n]),_=c.useListNavigation(l,{enabled:!v&&!m,listRef:f,activeIndex:p,selectedIndex:F,onNavigate:w,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),$=c.useTypeahead(l,{enabled:!v&&!m,listRef:C,activeIndex:p,selectedIndex:F,onMatch:w}),{getReferenceProps:D,getFloatingProps:E,getItemProps:P}=c.useInteractions([L,U,V,_,$]),[A,G]=t.useState(n);t.useEffect(()=>G(n),[n]);const g=n?"open":"closed",b=t.useCallback(e=>{if(!n)return;const o=e.type==="focus"?e.target:e.relatedTarget,u=s.floating.current,a=s.domReference.current;if(u!=null&&u.contains(o)||a!=null&&a.contains(o)){e.preventDefault(),e.stopPropagation(),a==null||a.focus();return}r(!1,e.nativeEvent,"focus-out")},[n,s.domReference,s.floating,r]),M=t.useRef(n);t.useEffect(()=>{var e;M.current&&!n&&((e=s.domReference.current)==null||e.focus()),M.current=n},[n,s.domReference]);const K=t.useCallback((e={})=>({ref:s.setReference,...D({...e,onKeyDownCapture:o=>{var q;const u=x.current,a=s.domReference.current,N=a==null?void 0:a.getAttribute("aria-activedescendant"),j=N?document.getElementById(N):null;if((o.key==="Enter"||o.key===" ")&&u){if(o.preventDefault(),o.stopPropagation(),d&&j){const J=new KeyboardEvent("keydown",o.nativeEvent);j.dispatchEvent(J)}return}(q=e.onKeyDownCapture)==null||q.call(e,o)},onFocusCapture:b,onBlurCapture:b})}),[s.setReference,s.domReference,D,b,d]),T=t.useMemo(()=>({isMounted:A,status:g,getFloatingProps:E,getItemProps:P,floatingStyles:O,setOpen:r,nodeId:I,context:l,labelsRef:C,elementsRef:f,setFloating:s.setFloating,activeIndex:d?p:null}),[A,g,E,P,O,r,I,l,s.setFloating,p,d]);return t.useMemo(()=>({getFieldProps:K,dropdownProps:T,refs:s,open:n,setOpen:r,status:g}),[T,K,n,s,r,g])};exports.useSelectDropdown=Q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@floating-ui/react"),t=require("react"),Q=require("../../chunks/combobox.9scnST_n.js"),W=j=>{const{disabled:v,readOnly:m,lastSelectedOptionIndex:i}=j,[n,B]=t.useState(!1),x=t.useRef(n);x.current=n;const I=c.useFloatingNodeId(),[R,z]=t.useState(null),[d,y]=t.useState(!0),[w,S]=t.useState(!1),k=t.useCallback(e=>{R!==e&&(w?(S(!1),i===void 0&&y(!0)):y(!0),z(e))},[R,w,i]),l=t.useCallback((e,o,a)=>{B(e),e&&a==="click"&&o instanceof PointerEvent&&(S(!0),y(!1))},[]),{context:u,refs:s,floatingStyles:O}=c.useFloating({placement:"bottom-start",middleware:[c.flip(),c.size({apply({rects:e,elements:o,availableHeight:a}){Object.assign(o.floating.style,{width:`${e.reference.width}px`,maxHeight:Q.getDropdownMaxHeight(a)})}})],whileElementsMounted:c.autoUpdate,open:n,onOpenChange:l,nodeId:I}),f=t.useRef([]),h=t.useRef([]),L=c.useClick(u,{enabled:!v&&!m,keyboardHandlers:!0}),U=c.useRole(u,{role:"listbox"}),V=c.useDismiss(u),g=f.current.length===0?null:R??null,C=t.useRef(i??null),D=t.useMemo(()=>n?C.current:(C.current=i??null,f.current.length===0?null:i??null),[i,n]),_=c.useListNavigation(u,{enabled:!v&&!m,listRef:f,activeIndex:g,selectedIndex:D,onNavigate:k,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),$=c.useTypeahead(u,{enabled:!v&&!m,listRef:h,activeIndex:g,selectedIndex:D,onMatch:k}),{getReferenceProps:F,getFloatingProps:E,getItemProps:M}=c.useInteractions([L,U,V,_,$]),[P,G]=t.useState(n);t.useEffect(()=>G(n),[n]);const p=n?"open":"closed",b=t.useCallback(e=>{if(!n)return;const o=e.type==="focus"?e.target:e.relatedTarget,a=s.floating.current,r=s.domReference.current;if(a!=null&&a.contains(o)||r!=null&&r.contains(o)){e.preventDefault(),e.stopPropagation(),r==null||r.focus();return}l(!1,e.nativeEvent,"focus-out")},[n,s.domReference,s.floating,l]),A=t.useRef(n);t.useEffect(()=>{var e;A.current&&!n&&((e=s.domReference.current)==null||e.focus()),A.current=n},[n,s.domReference]);const K=t.useCallback((e={})=>({ref:s.setReference,...F({...e,onKeyDownCapture:o=>{var q;const a=x.current,r=s.domReference.current,H=r==null?void 0:r.getAttribute("aria-activedescendant"),N=H?document.getElementById(H):null;if((o.key==="Enter"||o.key===" ")&&a){if(o.preventDefault(),o.stopPropagation(),d&&N){const J=new KeyboardEvent("keydown",o.nativeEvent);N.dispatchEvent(J)}return}(q=e.onKeyDownCapture)==null||q.call(e,o)},onFocusCapture:b,onBlurCapture:b})}),[s.setReference,s.domReference,F,b,d]),T=t.useMemo(()=>({isMounted:P,status:p,getFloatingProps:E,getItemProps:M,floatingStyles:O,setOpen:l,nodeId:I,context:u,labelsRef:h,elementsRef:f,setFloating:s.setFloating,activeIndex:d?g:null}),[P,p,E,M,O,l,I,u,s.setFloating,g,d]);return t.useMemo(()=>({getFieldProps:K,dropdownProps:T,refs:s,open:n,setOpen:l,status:p}),[T,K,n,s,l,p])};exports.useSelectDropdown=W;

package/lib/Select/useSelectDropdown.es.js

@@ -1,30 +1,32 @@
-import { useFloatingNodeId as Y, useFloating as Z, autoUpdate as ee, flip as te, size as ne, useClick as oe, useRole as se, useDismiss as ce, useListNavigation as re, useTypeahead as le, useInteractions as ae } from "@floating-ui/react";
-import { useState as i, useRef as u, useCallback as v, useMemo as O, useEffect as L } from "react";
-const fe = (U) => {
-  const { disabled: m, readOnly: I, lastSelectedOptionIndex: a } = U, [t, V] = i(!1), b = u(t);
-  b.current = t;
-  const y = Y(), [R, _] = i(null), [d, x] = i(!0), [h, k] = i(!1), F = v((e) => {
-    R !== e && (h ? (k(!1), a === void 0 && x(!0)) : x(!0), _(e));
-  }, [R, h, a]), c = v((e, o, l) => {
-    V(e), e && l === "click" && o instanceof PointerEvent && (k(!0), x(!1));
-  }, []), { context: r, refs: n, floatingStyles: C } = Z({
+import { useFloatingNodeId as Y, useFloating as Z, autoUpdate as ee, flip as te, size as ne, useClick as oe, useRole as se, useDismiss as ce, useListNavigation as re, useTypeahead as ae, useInteractions as le } from "@floating-ui/react";
+import { useState as i, useRef as u, useCallback as m, useMemo as h, useEffect as L } from "react";
+import { g as ie } from "../../chunks/combobox.--djB8BC.js";
+const ge = (U) => {
+  const { disabled: v, readOnly: I, lastSelectedOptionIndex: l } = U, [t, V] = i(!1), O = u(t);
+  O.current = t;
+  const y = Y(), [x, _] = i(null), [d, R] = i(!0), [b, k] = i(!1), F = m((e) => {
+    x !== e && (b ? (k(!1), l === void 0 && R(!0)) : R(!0), _(e));
+  }, [x, b, l]), r = m((e, o, c) => {
+    V(e), e && c === "click" && o instanceof PointerEvent && (k(!0), R(!1));
+  }, []), { context: a, refs: n, floatingStyles: C } = Z({
     placement: "bottom-start",
     middleware: [
       te(),
       ne({
-        apply({ rects: e, elements: o }) {
+        apply({ rects: e, elements: o, availableHeight: c }) {
           Object.assign(o.floating.style, {
-            width: `${e.reference.width}px`
+            width: `${e.reference.width}px`,
+            maxHeight: ie(c)
           });
         }
       })
     ],
     whileElementsMounted: ee,
     open: t,
-    onOpenChange: c,
+    onOpenChange: r,
     nodeId: y
-  }), f = u([]), D = u([]), $ = oe(r, { enabled: !m && !I, keyboardHandlers: !0 }), q = se(r, { role: "listbox" }), G = ce(r), p = f.current.length === 0 ? null : R ?? null, E = u(a ?? null), S = O(() => t ? E.current : (E.current = a ?? null, f.current.length === 0 ? null : a ?? null), [a, t]), J = re(r, {
-    enabled: !m && !I,
+  }), f = u([]), D = u([]), $ = oe(a, { enabled: !v && !I, keyboardHandlers: !0 }), q = se(a, { role: "listbox" }), G = ce(a), p = f.current.length === 0 ? null : x ?? null, E = u(l ?? null), S = h(() => t ? E.current : (E.current = l ?? null, f.current.length === 0 ? null : l ?? null), [l, t]), J = re(a, {
+    enabled: !v && !I,
     listRef: f,
     activeIndex: p,
     selectedIndex: S,
@@ -36,13 +38,13 @@ const fe = (U) => {
     loop: !0,
     virtual: !0,
     scrollItemIntoView: !0
-  }), Q = le(r, {
-    enabled: !m && !I,
+  }), Q = ae(a, {
+    enabled: !v && !I,
     listRef: D,
     activeIndex: p,
     selectedIndex: S,
     onMatch: F
-  }), { getReferenceProps: A, getFloatingProps: P, getItemProps: K } = ae([
+  }), { getReferenceProps: A, getFloatingProps: P, getItemProps: K } = le([
     $,
     q,
     G,
@@ -50,32 +52,32 @@ const fe = (U) => {
     Q
   ]), [M, W] = i(t);
   L(() => W(t), [t]);
-  const g = t ? "open" : "closed", w = v(
+  const g = t ? "open" : "closed", w = m(
     (e) => {
       if (!t)
         return;
-      const o = e.type === "focus" ? e.target : e.relatedTarget, l = n.floating.current, s = n.domReference.current;
-      if (l != null && l.contains(o) || s != null && s.contains(o)) {
+      const o = e.type === "focus" ? e.target : e.relatedTarget, c = n.floating.current, s = n.domReference.current;
+      if (c != null && c.contains(o) || s != null && s.contains(o)) {
         e.preventDefault(), e.stopPropagation(), s == null || s.focus();
         return;
       }
-      c(!1, e.nativeEvent, "focus-out");
+      r(!1, e.nativeEvent, "focus-out");
     },
-    [t, n.domReference, n.floating, c]
-  ), N = u(t);
+    [t, n.domReference, n.floating, r]
+  ), H = u(t);
   L(() => {
     var e;
-    N.current && !t && ((e = n.domReference.current) == null || e.focus()), N.current = t;
+    H.current && !t && ((e = n.domReference.current) == null || e.focus()), H.current = t;
   }, [t, n.domReference]);
-  const T = v(
+  const N = m(
     (e = {}) => ({
       ref: n.setReference,
       ...A({
         ...e,
         onKeyDownCapture: (o) => {
           var z;
-          const l = b.current, s = n.domReference.current, H = s == null ? void 0 : s.getAttribute("aria-activedescendant"), j = H ? document.getElementById(H) : null;
-          if ((o.key === "Enter" || o.key === " ") && l) {
+          const c = O.current, s = n.domReference.current, B = s == null ? void 0 : s.getAttribute("aria-activedescendant"), j = B ? document.getElementById(B) : null;
+          if ((o.key === "Enter" || o.key === " ") && c) {
             if (o.preventDefault(), o.stopPropagation(), d && j) {
               const X = new KeyboardEvent("keydown", o.nativeEvent);
               j.dispatchEvent(X);
@@ -89,35 +91,35 @@ const fe = (U) => {
       })
     }),
     [n.setReference, n.domReference, A, w, d]
-  ), B = O(
+  ), T = h(
     () => ({
       isMounted: M,
       status: g,
       getFloatingProps: P,
       getItemProps: K,
       floatingStyles: C,
-      setOpen: c,
+      setOpen: r,
       nodeId: y,
-      context: r,
+      context: a,
       labelsRef: D,
       elementsRef: f,
       setFloating: n.setFloating,
       activeIndex: d ? p : null
     }),
-    [M, g, P, K, C, c, y, r, n.setFloating, p, d]
+    [M, g, P, K, C, r, y, a, n.setFloating, p, d]
   );
-  return O(
+  return h(
     () => ({
-      getFieldProps: T,
-      dropdownProps: B,
+      getFieldProps: N,
+      dropdownProps: T,
       refs: n,
       open: t,
-      setOpen: c,
+      setOpen: r,
       status: g
     }),
-    [B, T, t, n, c, g]
+    [T, N, t, n, r, g]
   );
 };
 export {
-  fe as useSelectDropdown
+  ge as useSelectDropdown
 };

package/lib/wip/Search/useSearchDropdown.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@floating-ui/react"),n=require("react"),_=require("../../FloatingUI/useTyping.cjs.js"),N=require("../../FloatingUI/useBlur.cjs.js"),T=S=>{const{disabled:r,readOnly:l,enabled:e=!0}=S,[s,i]=n.useState(!1),d=n.useRef(s);d.current=s;const[f,g]=n.useState(null);n.useEffect(()=>s?void 0:g(null),[s]);const{context:c,refs:a,floatingStyles:p}=t.useFloating({placement:"bottom-start",middleware:[t.flip(),t.size({apply({elements:o,rects:u}){Object.assign(o.floating.style,{width:`${u.reference.width}px`})}})],whileElementsMounted:t.autoUpdate,open:s,onOpenChange:i}),b=n.useRef([]),k=n.useRef([]),h=t.useClick(c,{enabled:!s&&e&&!r&&!l,toggle:!1,stickIfOpen:!1,keyboardHandlers:!1}),x=t.useRole(c,{enabled:e,role:"listbox"}),E=_.default(c,{enabled:!s&&e&&!r&&!l,event:"keyboard"}),M=t.useFocus(c,{enabled:!s&&e&&!r&&!l,visibleOnly:!0}),q=t.useDismiss(c,{enabled:s&&e&&!r&&!l,escapeKey:!0,outsidePress:!0,referencePress:!1}),C=N.useBlur(c,{enabled:e&&!r&&!l}),D=t.useListNavigation(c,{enabled:e&&!r&&!l,listRef:b,activeIndex:f,onNavigate:g,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),{getReferenceProps:m,getFloatingProps:R,getItemProps:y}=t.useInteractions([x,E,D]),{getReferenceProps:I}=t.useInteractions([h,M,q,C]),{isMounted:v,styles:P}=t.useTransitionStyles(c,{duration:50});n.useEffect(()=>{if(!e||r||l||d.current)return;const o=a.domReference.current,u=document.activeElement;o&&u&&o.contains(u)&&i(!0)},[e,r,l,i,a.domReference]);const O=n.useCallback((o={})=>e?m(o):o,[m,e]),w=n.useCallback((o={})=>e?{ref:a.setReference,...I(o)}:o,[e,a.setReference,I]),F=n.useMemo(()=>({isMounted:v,getFloatingProps:R,getItemProps:y,floatingStyles:{...p,...P},setOpen:i,labelsRef:k,elementsRef:b,setFloating:a.setFloating,activeIndex:f,open:s}),[v,R,y,p,P,a.setFloating,f,s]);return n.useMemo(()=>({getFieldProps:w,getInputProps:O,dropdownProps:F,refs:a}),[F,w,O,a])};exports.useSearchDropdown=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("@floating-ui/react"),o=require("react"),H=require("../../FloatingUI/useTyping.cjs.js"),_=require("../../FloatingUI/useBlur.cjs.js"),N=h=>{const{disabled:r,readOnly:l,enabled:e=!0}=h,[n,i]=o.useState(!1),d=o.useRef(n);d.current=n;const[f,g]=o.useState(null);o.useEffect(()=>n?void 0:g(null),[n]);const{context:c,refs:a,floatingStyles:p}=s.useFloating({placement:"bottom-start",middleware:[s.flip(),s.size({apply({elements:t,rects:u,availableHeight:S}){Object.assign(t.floating.style,{width:`${u.reference.width}px`}),S<t.floating.scrollHeight?Object.assign(t.floating.style,{maxHeight:`${S}px`,overflowY:"auto"}):Object.assign(t.floating.style,{maxHeight:""})}})],whileElementsMounted:s.autoUpdate,open:n,onOpenChange:i}),b=o.useRef([]),x=o.useRef([]),k=s.useClick(c,{enabled:!n&&e&&!r&&!l,toggle:!1,stickIfOpen:!1,keyboardHandlers:!1}),E=s.useRole(c,{enabled:e,role:"listbox"}),M=H.default(c,{enabled:!n&&e&&!r&&!l,event:"keyboard"}),j=s.useFocus(c,{enabled:!n&&e&&!r&&!l,visibleOnly:!0}),q=s.useDismiss(c,{enabled:n&&e&&!r&&!l,escapeKey:!0,outsidePress:!0,referencePress:!1}),C=_.useBlur(c,{enabled:e&&!r&&!l}),D=s.useListNavigation(c,{enabled:e&&!r&&!l,listRef:b,activeIndex:f,onNavigate:g,focusItemOnHover:!1,focusItemOnOpen:"auto",openOnArrowKeyDown:!0,nested:!1,loop:!0,virtual:!0,scrollItemIntoView:!0}),{getReferenceProps:m,getFloatingProps:y,getItemProps:R}=s.useInteractions([E,M,D]),{getReferenceProps:I}=s.useInteractions([k,j,q,C]),{isMounted:v,styles:O}=s.useTransitionStyles(c,{duration:50});o.useEffect(()=>{if(!e||r||l||d.current)return;const t=a.domReference.current,u=document.activeElement;t&&u&&t.contains(u)&&i(!0)},[e,r,l,i,a.domReference]);const P=o.useCallback((t={})=>e?m(t):t,[m,e]),w=o.useCallback((t={})=>e?{ref:a.setReference,...I(t)}:t,[e,a.setReference,I]),F=o.useMemo(()=>({isMounted:v,getFloatingProps:y,getItemProps:R,floatingStyles:{...p,...O},setOpen:i,labelsRef:x,elementsRef:b,setFloating:a.setFloating,activeIndex:f,open:n}),[v,y,R,p,O,a.setFloating,f,n]);return o.useMemo(()=>({getFieldProps:w,getInputProps:P,dropdownProps:F,refs:a}),[F,w,P,a])};exports.useSearchDropdown=N;

package/lib/wip/Search/useSearchDropdown.es.js

@@ -1,35 +1,42 @@
-import { useFloating as j, autoUpdate as z, flip as B, size as L, useClick as U, useRole as V, useFocus as $, useDismiss as q, useListNavigation as G, useInteractions as F, useTransitionStyles as J } from "@floating-ui/react";
-import { useState as k, useRef as u, useEffect as x, useCallback as h, useMemo as S } from "react";
+import { useFloating as $, autoUpdate as z, flip as B, size as L, useClick as U, useRole as V, useFocus as Y, useDismiss as q, useListNavigation as G, useInteractions as F, useTransitionStyles as J } from "@floating-ui/react";
+import { useState as h, useRef as u, useEffect as k, useCallback as S, useMemo as E } from "react";
 import Q from "../../FloatingUI/useTyping.es.js";
 import { useBlur as W } from "../../FloatingUI/useBlur.es.js";
-const ee = (E) => {
-  const { disabled: n, readOnly: o, enabled: e = !0 } = E, [t, c] = k(!1), f = u(t);
-  f.current = t;
-  const [a, d] = k(null);
-  x(() => t ? void 0 : d(null), [t]);
-  const { context: r, refs: l, floatingStyles: p } = j({
+const te = (H) => {
+  const { disabled: n, readOnly: o, enabled: e = !0 } = H, [s, i] = h(!1), f = u(s);
+  f.current = s;
+  const [a, d] = h(null);
+  k(() => s ? void 0 : d(null), [s]);
+  const { context: r, refs: l, floatingStyles: g } = $({
     placement: "bottom-start",
     middleware: [
       B(),
+      // Search does not cap the dropdown to a fixed number of items like Select
+      // and Autocomplete — it shows all results and only constrains to viewport.
       L({
-        apply({ elements: s, rects: i }) {
-          Object.assign(s.floating.style, {
-            width: `${i.reference.width}px`
+        apply({ elements: t, rects: c, availableHeight: x }) {
+          Object.assign(t.floating.style, {
+            width: `${c.reference.width}px`
+          }), x < t.floating.scrollHeight ? Object.assign(t.floating.style, {
+            maxHeight: `${x}px`,
+            overflowY: "auto"
+          }) : Object.assign(t.floating.style, {
+            maxHeight: ""
           });
         }
       })
     ],
     whileElementsMounted: z,
-    open: t,
-    onOpenChange: c
-  }), g = u([]), C = u([]), D = U(r, {
-    enabled: !t && e && !n && !o,
+    open: s,
+    onOpenChange: i
+  }), p = u([]), j = u([]), C = U(r, {
+    enabled: !s && e && !n && !o,
     toggle: !1,
     stickIfOpen: !1,
     keyboardHandlers: !1
-  }), M = V(r, { enabled: e, role: "listbox" }), N = Q(r, { enabled: !t && e && !n && !o, event: "keyboard" }), A = $(r, { enabled: !t && e && !n && !o, visibleOnly: !0 }), H = q(r, { enabled: t && e && !n && !o, escapeKey: !0, outsidePress: !0, referencePress: !1 }), K = W(r, { enabled: e && !n && !o }), T = G(r, {
+  }), D = V(r, { enabled: e, role: "listbox" }), M = Q(r, { enabled: !s && e && !n && !o, event: "keyboard" }), N = Y(r, { enabled: !s && e && !n && !o, visibleOnly: !0 }), A = q(r, { enabled: s && e && !n && !o, escapeKey: !0, outsidePress: !0, referencePress: !1 }), K = W(r, { enabled: e && !n && !o }), T = G(r, {
     enabled: e && !n && !o,
-    listRef: g,
+    listRef: p,
     activeIndex: a,
     onNavigate: d,
     focusItemOnHover: !1,
@@ -40,53 +47,53 @@ const ee = (E) => {
     virtual: !0,
     scrollItemIntoView: !0
   }), { getReferenceProps: m, getFloatingProps: b, getItemProps: y } = F([
+    D,
     M,
-    N,
     T
-  ]), { getReferenceProps: R } = F([D, A, H, K]), { isMounted: v, styles: I } = J(r, { duration: 50 });
-  x(() => {
+  ]), { getReferenceProps: R } = F([C, N, A, K]), { isMounted: v, styles: O } = J(r, { duration: 50 });
+  k(() => {
     if (!e || n || o || f.current)
       return;
-    const s = l.domReference.current, i = document.activeElement;
-    s && i && s.contains(i) && c(!0);
-  }, [e, n, o, c, l.domReference]);
-  const P = h(
-    (s = {}) => e ? m(s) : s,
+    const t = l.domReference.current, c = document.activeElement;
+    t && c && t.contains(c) && i(!0);
+  }, [e, n, o, i, l.domReference]);
+  const I = S(
+    (t = {}) => e ? m(t) : t,
     [m, e]
-  ), O = h(
-    (s = {}) => e ? {
+  ), P = S(
+    (t = {}) => e ? {
       ref: l.setReference,
-      ...R(s)
-    } : s,
+      ...R(t)
+    } : t,
     [e, l.setReference, R]
-  ), w = S(
+  ), w = E(
     () => ({
       isMounted: v,
       getFloatingProps: b,
       getItemProps: y,
       floatingStyles: {
-        ...p,
-        ...I
+        ...g,
+        ...O
       },
-      setOpen: c,
-      labelsRef: C,
-      elementsRef: g,
+      setOpen: i,
+      labelsRef: j,
+      elementsRef: p,
       setFloating: l.setFloating,
       activeIndex: a,
-      open: t
+      open: s
     }),
-    [v, b, y, p, I, l.setFloating, a, t]
+    [v, b, y, g, O, l.setFloating, a, s]
   );
-  return S(
+  return E(
     () => ({
-      getFieldProps: O,
-      getInputProps: P,
+      getFieldProps: P,
+      getInputProps: I,
       dropdownProps: w,
       refs: l
     }),
-    [w, O, P, l]
+    [w, P, I, l]
   );
 };
 export {
-  ee as useSearchDropdown
+  te as useSearchDropdown
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viasat/beam-react",
-  "version": "2.14.0",
+  "version": "2.16.0",
   "description": "React component library for the Beam design system",
   "license": "MIT",
   "author": "Viasat",
@@ -59,11 +59,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@viasat/beam-fonts": "2.14.0",
-    "@viasat/beam-shared": "2.14.0",
-    "@viasat/beam-styles": "2.14.0",
-    "@viasat/beam-tokens": "2.14.0",
-    "@viasat/beam-icons": "2.14.0",
+    "@viasat/beam-fonts": "2.16.0",
+    "@viasat/beam-shared": "2.16.0",
+    "@viasat/beam-styles": "2.16.0",
+    "@viasat/beam-tokens": "2.16.0",
+    "@viasat/beam-icons": "2.16.0",
     "clsx": "^1.2.1",
     "@floating-ui/react": "^0.26.18",
     "@stepperize/react": "^5.1.5",