@viasat/beam-react 2.2.0 → 2.8.0

package/lib/Autocomplete/AutocompleteDropdown.es.js

@@ -10,7 +10,7 @@ import { f as j } from "../../chunks/floatingui.module.BcBFebz0.js";
 import { p as D } from "../../chunks/popover.module.C6KFea25.js";
 import "../_Options/Option.context.es.js";
 import { Option as E } from "../_Options/Option.es.js";
-import "../../chunks/form.context.CNWjF5qA.js";
+import "../../chunks/form.context.CfsTSQpm.js";
 import "../Form/contexts/label.context.es.js";
 import "../Form/contexts/helperText.context.es.js";
 const { baseClassNamePrefix: L } = a("floatingui"), { baseClassNamePrefix: q } = a("popover"), z = [E], I = ({

package/lib/Autocomplete/useAutocompleteA11y.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const _=require("react"),e=require("../Form/hooks/useAccessibleId.hook.cjs.js");require("react/jsx-runtime");require("../../chunks/form.context.B1PXIJNq.js");const l=require("clsx");function n({helperText:a,externalDescribedBy:b,error:s,errorShown:A,invalid:i}){const{id:o}=e.useAccessibleId(),{id:c}=e.useAccessibleId(),{id:t}=e.useAccessibleId(),{id:d}=e.useAccessibleId(),I=!!(s!=null&&s.length),u=l(a&&c,b)||void 0,r=l(I&&o,A&&t)||void 0;return _.useMemo(()=>({ids:{helperTextId:c,errorId:o,validationErrorsId:t,labelId:d},aria:{describedBy:u,errorMessage:r,invalid:i}}),[c,o,t,d,u,r,i])}exports.default=n;exports.useAutocompleteA11y=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const _=require("react"),e=require("../Form/hooks/useAccessibleId.hook.cjs.js");require("react/jsx-runtime");require("../../chunks/form.context.B26th8Od.js");const l=require("clsx");function n({helperText:a,externalDescribedBy:b,error:s,errorShown:A,invalid:i}){const{id:o}=e.useAccessibleId(),{id:c}=e.useAccessibleId(),{id:t}=e.useAccessibleId(),{id:d}=e.useAccessibleId(),I=!!(s!=null&&s.length),u=l(a&&c,b)||void 0,r=l(I&&o,A&&t)||void 0;return _.useMemo(()=>({ids:{helperTextId:c,errorId:o,validationErrorsId:t,labelId:d},aria:{describedBy:u,errorMessage:r,invalid:i}}),[c,o,t,d,u,r,i])}exports.default=n;exports.useAutocompleteA11y=n;

package/lib/Autocomplete/useAutocompleteA11y.es.js

@@ -1,7 +1,7 @@
 import { useMemo as f } from "react";
 import { useAccessibleId as o } from "../Form/hooks/useAccessibleId.hook.es.js";
 import "react/jsx-runtime";
-import "../../chunks/form.context.CNWjF5qA.js";
+import "../../chunks/form.context.CfsTSQpm.js";
 import m from "clsx";
 function A({
   helperText: a,

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.PCrm8EUc.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"),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;

package/lib/Autocomplete/useAutocompleteDropdown.es.js

@@ -1,5 +1,5 @@
 import { p as re } from "../../chunks/constants.BBi77pmH.js";
-import { a as ce } from "../../chunks/dom.CVmkHCnh.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) => {

package/lib/Box/utils.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/tokens.Bc11gmpN.js"),m={none:e.bmSemRadiusNone,xs:e.bmSemRadiusXs,sm:e.bmSemRadiusSm,md:e.bmSemRadiusMd,lg:e.bmSemRadiusLg,round:e.bmSemRadiusRound};exports.BOX_BORDER_RADIUS_TO_CSS_VAR=m;

package/lib/Box/utils.d.ts

@@ -0,0 +1,6 @@
+import { BoxBorderRadius } from '@viasat/beam-shared/components/box';
+/**
+ * Maps BoxBorderRadius values to their corresponding CSS custom property references.
+ * Used when a component needs to pass radius as a CSS variable (e.g. --bm-card-radius-outer).
+ */
+export declare const BOX_BORDER_RADIUS_TO_CSS_VAR: Record<BoxBorderRadius, string>;

package/lib/Box/utils.es.js

@@ -0,0 +1,12 @@
+import { d as m, e as s, f as a, g as d, h as R, i as e } from "../../chunks/tokens.BD_71qmL.js";
+const i = {
+  none: e,
+  xs: R,
+  sm: d,
+  md: a,
+  lg: s,
+  round: m
+};
+export {
+  i as BOX_BORDER_RADIUS_TO_CSS_VAR
+};

package/lib/Button/Button.cjs.js

@@ -1 +1 @@
-var et=require("../../assets/Button.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("../../chunks/classNames.DAeKwerT.js"),x=require("../../chunks/constants.hwjHOsvT.js"),D=require("clsx"),g=require("react"),G=require("../StateLayer/StateLayer.cjs.js"),K=require("../../chunks/form.context.B1PXIJNq.js");require("../Form/contexts/label.context.cjs.js");require("../Form/contexts/helperText.context.cjs.js");const C=require("../../utils/spacing.cjs.js"),J=require("../Spinner/Spinner.cjs.js"),Q="button",{baseClassNamePrefix:nt,classModifierPrefix:i,subElementClassPrefix:h}=m.getBEMClassNames(Q),b={label:`${h}label`,loading:`${i}loading`,fluid:`${i}fluid`,iconOnly:`${i}icon-only`,loadingSpinner:`${h}loading-spinner`},U=(s,a)=>`${i}${a}-${s}`,n={"bm-light":"bm-light","bm-dark":"bm-dark","bm-inverse":"bm-inverse","bm-button__icon-wrap":"bm-button__icon-wrap","bm-button":"bm-button","bm-button--sm":"bm-button--sm","bm-button--md":"bm-button--md","bm-button--lg":"bm-button--lg","bm-button--icon-only":"bm-button--icon-only","bm-button__label":"bm-button__label","bm-button--accent-filled":"bm-button--accent-filled","bm-button__loading-spinner":"bm-button__loading-spinner","bm-spinner__circle":"bm-spinner__circle","bm-spinner__circle-bg":"bm-spinner__circle-bg","bm-state-layer":"bm-state-layer","bm-state-layer--without-hover":"bm-state-layer--without-hover","bm-state-layer--without-active":"bm-state-layer--without-active","bm-button--accent-outline":"bm-button--accent-outline","bm-button--accent-ghost":"bm-button--accent-ghost","bm-button--accent-bare":"bm-button--accent-bare","bm-button--neutral-filled":"bm-button--neutral-filled","bm-button--neutral-outline":"bm-button--neutral-outline","bm-button--neutral-ghost":"bm-button--neutral-ghost","bm-button--neutral-bare":"bm-button--neutral-bare","bm-button--neutral-subtle-filled":"bm-button--neutral-subtle-filled","bm-button--neutral-subtle-outline":"bm-button--neutral-subtle-outline","bm-button--neutral-subtle-ghost":"bm-button--neutral-subtle-ghost","bm-button--neutral-subtle-bare":"bm-button--neutral-subtle-bare","bm-button--destructive-filled":"bm-button--destructive-filled","bm-button--destructive-outline":"bm-button--destructive-outline","bm-button--destructive-ghost":"bm-button--destructive-ghost","bm-button--destructive-bare":"bm-button--destructive-bare","bm-button--loading":"bm-button--loading","bm-spinner-wrap":"bm-spinner-wrap","bm-button--fluid":"bm-button--fluid"},V="button",{baseClassNamePrefix:X,classModifierPrefix:Y,subElementClassPrefix:Z}=m.getBEMClassNames(V),c=({children:s})=>t.jsx("span",{className:`${Z}icon-wrap`,children:s}),z=({loading:s,size:a,loadingValue:o,iconOnly:e,iconBefore:u,iconAfter:l,children:r})=>s?t.jsxs(t.Fragment,{children:[t.jsx(J.Spinner,{className:n[b.loadingSpinner],size:a==="sm"?"xxs":"xs",value:o}),!e&&t.jsx("span",{className:n[b.label],children:r})]}):t.jsxs(t.Fragment,{children:[u&&t.jsx(c,{children:u}),!e&&t.jsx("span",{className:n[b.label],children:r}),l&&t.jsx(c,{children:l})]}),tt=g.forwardRef(({appearance:s="accent",kind:a="filled",size:o="md",loading:e,loadingValue:u,fluid:l,width:r,iconBefore:y,iconAfter:N,iconOnly:d,productType:p,disabled:v=!1,theme:f,children:P,"aria-label":$,...j},S)=>{const q=y,B=e?void 0:N,w=U(a,s),{style:M,className:k,...A}=j,{ctxDisabled:E}=g.useContext(K.FormContext),_=v||E,[R,I]=C.partitionSpacingProps(A,C.MARGIN_PROP_NAMES),L=D(f&&x.themeClassName(f),p&&x.productTypeThemeClassName(p),n[X],n[w],e&&n[b.loading],l&&n[b.fluid],d&&n[b.iconOnly],o&&n[`${Y}${o}`],...m.generateSpacingClasses(R),k),T={...r&&!l&&{width:r},...M},F="default",{onClick:H,...O}=I,W=e?void 0:H;return t.jsxs("button",{className:L,disabled:_,style:T,tabIndex:e?-1:0,"aria-busy":e,"aria-label":$,"aria-disabled":_,onClick:W,...O,ref:S,children:[!e&&t.jsx(G.StateLayer,{appearance:F}),t.jsx(z,{loading:e,size:o,loadingValue:u,iconOnly:d,iconBefore:q,iconAfter:B,children:P})]})});exports.Button=tt;exports.ButtonIconWrap=c;
+var et=require("../../assets/Button.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("../../chunks/classNames.DAeKwerT.js"),x=require("../../chunks/constants.hwjHOsvT.js"),D=require("clsx"),g=require("react"),G=require("../StateLayer/StateLayer.cjs.js"),K=require("../../chunks/form.context.B26th8Od.js");require("../Form/contexts/label.context.cjs.js");require("../Form/contexts/helperText.context.cjs.js");const C=require("../../utils/spacing.cjs.js"),J=require("../Spinner/Spinner.cjs.js"),Q="button",{baseClassNamePrefix:nt,classModifierPrefix:i,subElementClassPrefix:h}=m.getBEMClassNames(Q),b={label:`${h}label`,loading:`${i}loading`,fluid:`${i}fluid`,iconOnly:`${i}icon-only`,loadingSpinner:`${h}loading-spinner`},U=(s,a)=>`${i}${a}-${s}`,n={"bm-light":"bm-light","bm-dark":"bm-dark","bm-inverse":"bm-inverse","bm-button__icon-wrap":"bm-button__icon-wrap","bm-button":"bm-button","bm-button--sm":"bm-button--sm","bm-button--md":"bm-button--md","bm-button--lg":"bm-button--lg","bm-button--icon-only":"bm-button--icon-only","bm-button__label":"bm-button__label","bm-button--accent-filled":"bm-button--accent-filled","bm-button__loading-spinner":"bm-button__loading-spinner","bm-spinner__circle":"bm-spinner__circle","bm-spinner__circle-bg":"bm-spinner__circle-bg","bm-state-layer":"bm-state-layer","bm-state-layer--without-hover":"bm-state-layer--without-hover","bm-state-layer--without-active":"bm-state-layer--without-active","bm-button--accent-outline":"bm-button--accent-outline","bm-button--accent-ghost":"bm-button--accent-ghost","bm-button--accent-bare":"bm-button--accent-bare","bm-button--neutral-filled":"bm-button--neutral-filled","bm-button--neutral-outline":"bm-button--neutral-outline","bm-button--neutral-ghost":"bm-button--neutral-ghost","bm-button--neutral-bare":"bm-button--neutral-bare","bm-button--neutral-subtle-filled":"bm-button--neutral-subtle-filled","bm-button--neutral-subtle-outline":"bm-button--neutral-subtle-outline","bm-button--neutral-subtle-ghost":"bm-button--neutral-subtle-ghost","bm-button--neutral-subtle-bare":"bm-button--neutral-subtle-bare","bm-button--destructive-filled":"bm-button--destructive-filled","bm-button--destructive-outline":"bm-button--destructive-outline","bm-button--destructive-ghost":"bm-button--destructive-ghost","bm-button--destructive-bare":"bm-button--destructive-bare","bm-button--loading":"bm-button--loading","bm-spinner-wrap":"bm-spinner-wrap","bm-button--fluid":"bm-button--fluid"},V="button",{baseClassNamePrefix:X,classModifierPrefix:Y,subElementClassPrefix:Z}=m.getBEMClassNames(V),c=({children:s})=>t.jsx("span",{className:`${Z}icon-wrap`,children:s}),z=({loading:s,size:a,loadingValue:o,iconOnly:e,iconBefore:u,iconAfter:l,children:r})=>s?t.jsxs(t.Fragment,{children:[t.jsx(J.Spinner,{className:n[b.loadingSpinner],size:a==="sm"?"xxs":"xs",value:o}),!e&&t.jsx("span",{className:n[b.label],children:r})]}):t.jsxs(t.Fragment,{children:[u&&t.jsx(c,{children:u}),!e&&t.jsx("span",{className:n[b.label],children:r}),l&&t.jsx(c,{children:l})]}),tt=g.forwardRef(({appearance:s="accent",kind:a="filled",size:o="md",loading:e,loadingValue:u,fluid:l,width:r,iconBefore:y,iconAfter:N,iconOnly:d,productType:p,disabled:v=!1,theme:f,children:P,"aria-label":$,...j},S)=>{const q=y,B=e?void 0:N,w=U(a,s),{style:M,className:k,...A}=j,{ctxDisabled:E}=g.useContext(K.FormContext),_=v||E,[R,I]=C.partitionSpacingProps(A,C.MARGIN_PROP_NAMES),L=D(f&&x.themeClassName(f),p&&x.productTypeThemeClassName(p),n[X],n[w],e&&n[b.loading],l&&n[b.fluid],d&&n[b.iconOnly],o&&n[`${Y}${o}`],...m.generateSpacingClasses(R),k),T={...r&&!l&&{width:r},...M},F="default",{onClick:H,...O}=I,W=e?void 0:H;return t.jsxs("button",{className:L,disabled:_,style:T,tabIndex:e?-1:0,"aria-busy":e,"aria-label":$,"aria-disabled":_,onClick:W,...O,ref:S,children:[!e&&t.jsx(G.StateLayer,{appearance:F}),t.jsx(z,{loading:e,size:o,loadingValue:u,iconOnly:d,iconBefore:q,iconAfter:B,children:P})]})});exports.Button=tt;exports.ButtonIconWrap=c;

package/lib/Button/Button.es.js

@@ -5,7 +5,7 @@ import { t as T, d as W } from "../../chunks/constants.BBi77pmH.js";
 import q from "clsx";
 import H, { forwardRef as J } from "react";
 import { StateLayer as Q } from "../StateLayer/StateLayer.es.js";
-import { F as U } from "../../chunks/form.context.CNWjF5qA.js";
+import { F as U } from "../../chunks/form.context.CfsTSQpm.js";
 import "../Form/contexts/label.context.es.js";
 import "../Form/contexts/helperText.context.es.js";
 import { partitionSpacingProps as V, MARGIN_PROP_NAMES as X } from "../../utils/spacing.es.js";

package/lib/Card/Card.Body.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),c=require("clsx"),l=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const n=require("../../chunks/card.module.BG9mkRao.js"),{subElementClassPrefix:d}=l.getBEMClassNames("card"),i=`${d}body`,s=({children:e,className:r,...t})=>{const a=c(n.styles[i],r);return o.jsx("div",{className:a,...t,children:e})};s.displayName="Card.Body";exports.Body=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),c=require("clsx"),l=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const n=require("../../chunks/card.module.8KnCe1uR.js"),{subElementClassPrefix:d}=l.getBEMClassNames("card"),i=`${d}body`,s=({children:e,className:r,...t})=>{const a=c(n.styles[i],r);return o.jsx("div",{className:a,...t,children:e})};s.displayName="Card.Body";exports.Body=s;

package/lib/Card/Card.Body.es.js

@@ -2,7 +2,7 @@ import { jsx as m } from "react/jsx-runtime";
 import t from "clsx";
 import { g as e } from "../../chunks/classNames.DNsS4J__.js";
 import "../../chunks/constants.BBi77pmH.js";
-import { s as l } from "../../chunks/card.module.Dy87qmTH.js";
+import { s as l } from "../../chunks/card.module.ByBYpexJ.js";
 const { subElementClassPrefix: c } = e("card"), i = `${c}body`, d = ({
   children: s,
   className: o,

package/lib/Card/Card.Content.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),i=require("clsx"),l=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const u=require("./CardContext.cjs.js"),d=require("../../chunks/card.module.BG9mkRao.js"),{subElementClassPrefix:C}=l.getBEMClassNames("card"),s=`${C}content`,t=({children:n,className:r,...a})=>{const{density:e}=u.useCard(),o=i(d.styles[s],e&&`${s}--density-${e}`,r);return c.jsx("div",{className:o,...a,children:n})};t.displayName="Card.Content";exports.Content=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("clsx"),o=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const l=require("../../chunks/card.module.8KnCe1uR.js"),{subElementClassPrefix:i}=o.getBEMClassNames("card"),u=`${i}content`,e=({children:s,className:t,...n})=>{const r=c(l.styles[u],t);return a.jsx("div",{className:r,...n,children:s})};e.displayName="Card.Content";exports.Content=e;

package/lib/Card/Card.Content.es.js

@@ -1,22 +1,17 @@
-import { jsx as m } from "react/jsx-runtime";
-import n from "clsx";
-import { g as i } from "../../chunks/classNames.DNsS4J__.js";
+import { jsx as e } from "react/jsx-runtime";
+import r from "clsx";
+import { g as m } from "../../chunks/classNames.DNsS4J__.js";
 import "../../chunks/constants.BBi77pmH.js";
-import { useCard as c } from "./CardContext.es.js";
-import { s as l } from "../../chunks/card.module.Dy87qmTH.js";
-const { subElementClassPrefix: p } = i("card"), t = `${p}content`, d = ({
-  children: o,
-  className: e,
-  ...r
+import { s as n } from "../../chunks/card.module.ByBYpexJ.js";
+const { subElementClassPrefix: c } = m("card"), l = `${c}content`, i = ({
+  children: s,
+  className: t,
+  ...o
 }) => {
-  const { density: s } = c(), a = n(
-    l[t],
-    s && `${t}--density-${s}`,
-    e
-  );
-  return /* @__PURE__ */ m("div", { className: a, ...r, children: o });
+  const a = r(n[l], t);
+  return /* @__PURE__ */ e("div", { className: a, ...o, children: s });
 };
-d.displayName = "Card.Content";
+i.displayName = "Card.Content";
 export {
-  d as Content
+  i as Content
 };

package/lib/Card/Card.Footer.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),i=require("clsx"),d=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const r=require("../../chunks/card.module.BG9mkRao.js"),{subElementClassPrefix:u}=d.getBEMClassNames("card"),N=`${u}footer`,a=({children:s,className:e,...t})=>{const o=i(r.styles[N],e);return l.jsx("div",{className:o,...t,children:s})};a.displayName="Card.Footer";const c=({layout:s="start",children:e,className:t,...o})=>{const n=`${u}footer__actions`,m=i(r.styles[n],r.styles[`${n}--${s}`],t);return l.jsx("div",{className:m,...o,children:e})};c.displayName="Card.Footer.Actions";a.Actions=c;exports.Actions=c;exports.Footer=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),i=require("clsx"),d=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const r=require("../../chunks/card.module.8KnCe1uR.js"),{subElementClassPrefix:u}=d.getBEMClassNames("card"),N=`${u}footer`,a=({children:s,className:e,...t})=>{const o=i(r.styles[N],e);return l.jsx("div",{className:o,...t,children:s})};a.displayName="Card.Footer";const c=({layout:s="start",children:e,className:t,...o})=>{const n=`${u}footer__actions`,m=i(r.styles[n],r.styles[`${n}--${s}`],t);return l.jsx("div",{className:m,...o,children:e})};c.displayName="Card.Footer.Actions";a.Actions=c;exports.Actions=c;exports.Footer=a;

package/lib/Card/Card.Footer.d.ts

@@ -1,5 +1,5 @@
 import { default as React, ComponentPropsWithoutRef } from 'react';
-import { FooterActionLayout } from '@viasat/beam-shared/components/card';
+import { FooterActionLayout } from '@viasat/beam-shared/components/footer';
 export interface CardFooterProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Specify the content for the card footer

package/lib/Card/Card.Footer.es.js

@@ -2,7 +2,7 @@ import { jsx as c } from "react/jsx-runtime";
 import m from "clsx";
 import { g as d } from "../../chunks/classNames.DNsS4J__.js";
 import "../../chunks/constants.BBi77pmH.js";
-import { s as r } from "../../chunks/card.module.Dy87qmTH.js";
+import { s as r } from "../../chunks/card.module.ByBYpexJ.js";
 const { subElementClassPrefix: i } = d("card"), f = `${i}footer`, n = ({
   children: s,
   className: o,

package/lib/Card/Card.Header.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),d=require("clsx"),g=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const o=require("../../chunks/card.module.BG9mkRao.js"),{subElementClassPrefix:c}=g.getBEMClassNames("card"),x=`${c}header`,r=({children:e,className:s,...a})=>{const t=d(o.styles[x],s);return n.jsx("div",{className:t,...a,children:e})},i=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading`],s);return n.jsx("div",{className:t,...a,children:e})},l=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__text`],s);return n.jsx("div",{className:t,...a,children:e})},m=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__eyebrow`],s);return n.jsx("div",{className:t,...a,children:e})},u=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__supporting-text`],s);return n.jsx("div",{className:t,...a,children:e})},N=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__content-before`],s);return n.jsx("div",{className:t,...a,children:e})},y=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__content-after`],s);return n.jsx("div",{className:t,...a,children:e})};r.displayName="Card.Header";i.displayName="Card.Header.Heading";l.displayName="Card.Header.HeadingText";m.displayName="Card.Header.Eyebrow";u.displayName="Card.Header.SupportingText";N.displayName="Card.Header.ContentBefore";y.displayName="Card.Header.ContentAfter";r.Heading=i;r.HeadingText=l;r.Eyebrow=m;r.SupportingText=u;r.ContentBefore=N;r.ContentAfter=y;exports.ContentAfter=y;exports.ContentBefore=N;exports.Eyebrow=m;exports.Header=r;exports.Heading=i;exports.HeadingText=l;exports.SupportingText=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),d=require("clsx"),g=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const o=require("../../chunks/card.module.8KnCe1uR.js"),{subElementClassPrefix:c}=g.getBEMClassNames("card"),x=`${c}header`,r=({children:e,className:s,...a})=>{const t=d(o.styles[x],s);return n.jsx("div",{className:t,...a,children:e})},i=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading`],s);return n.jsx("div",{className:t,...a,children:e})},l=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__text`],s);return n.jsx("div",{className:t,...a,children:e})},m=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__eyebrow`],s);return n.jsx("div",{className:t,...a,children:e})},u=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__heading__supporting-text`],s);return n.jsx("div",{className:t,...a,children:e})},N=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__content-before`],s);return n.jsx("div",{className:t,...a,children:e})},y=({children:e,className:s,...a})=>{const t=d(o.styles[`${c}header__content-after`],s);return n.jsx("div",{className:t,...a,children:e})};r.displayName="Card.Header";i.displayName="Card.Header.Heading";l.displayName="Card.Header.HeadingText";m.displayName="Card.Header.Eyebrow";u.displayName="Card.Header.SupportingText";N.displayName="Card.Header.ContentBefore";y.displayName="Card.Header.ContentAfter";r.Heading=i;r.HeadingText=l;r.Eyebrow=m;r.SupportingText=u;r.ContentBefore=N;r.ContentAfter=y;exports.ContentAfter=y;exports.ContentBefore=N;exports.Eyebrow=m;exports.Header=r;exports.Heading=i;exports.HeadingText=l;exports.SupportingText=u;

package/lib/Card/Card.Header.es.js

@@ -2,7 +2,7 @@ import { jsx as r } from "react/jsx-runtime";
 import n from "clsx";
 import { g } from "../../chunks/classNames.DNsS4J__.js";
 import "../../chunks/constants.BBi77pmH.js";
-import { s as d } from "../../chunks/card.module.Dy87qmTH.js";
+import { s as d } from "../../chunks/card.module.ByBYpexJ.js";
 const { subElementClassPrefix: o } = g("card"), C = `${o}header`, c = ({
   children: e,
   className: a,

package/lib/Card/Card.Media.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("react"),j=require("clsx"),_=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const s=require("../../chunks/card.module.BG9mkRao.js"),R=require("../Box/Box.cjs.js"),$=require("./AspectRatio.cjs.js"),t=f.forwardRef(({children:o,position:a,aspectRatio:u="4:3",borderRadius:m,overlayColor:i,overlayContentTop:c,overlayContentMiddle:l,overlayContentBottom:d,className:n,...x},b)=>{const{baseClassNamePrefix:N,classModifierPrefix:q,subElementClassPrefix:r}=_.getBEMClassNames(`card__media-${a}`),y=j(s.styles[N],i&&s.styles[`${q}overlay-color-${i}`],n);return e.jsx(R.Box,{ref:b,className:y,borderRadius:a==="below"?m:void 0,...x,children:e.jsxs($.AspectRatio,{aspectRatio:u,children:[o,c&&e.jsx("div",{className:s.styles[`${r}overlay-top`],children:c}),l&&e.jsx("div",{className:s.styles[`${r}overlay-middle`],children:l}),d&&e.jsx("div",{className:s.styles[`${r}overlay-bottom`],children:d})]})})});t.displayName="Card.Media";exports.Media=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("react"),j=require("clsx"),_=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const s=require("../../chunks/card.module.8KnCe1uR.js"),R=require("../Box/Box.cjs.js"),$=require("./AspectRatio.cjs.js"),t=f.forwardRef(({children:o,position:a,aspectRatio:u="4:3",borderRadius:m,overlayColor:i,overlayContentTop:c,overlayContentMiddle:l,overlayContentBottom:d,className:n,...x},b)=>{const{baseClassNamePrefix:N,classModifierPrefix:q,subElementClassPrefix:r}=_.getBEMClassNames(`card__media-${a}`),y=j(s.styles[N],i&&s.styles[`${q}overlay-color-${i}`],n);return e.jsx(R.Box,{ref:b,className:y,borderRadius:a==="below"?m:void 0,...x,children:e.jsxs($.AspectRatio,{aspectRatio:u,children:[o,c&&e.jsx("div",{className:s.styles[`${r}overlay-top`],children:c}),l&&e.jsx("div",{className:s.styles[`${r}overlay-middle`],children:l}),d&&e.jsx("div",{className:s.styles[`${r}overlay-bottom`],children:d})]})})});t.displayName="Card.Media";exports.Media=t;

package/lib/Card/Card.Media.es.js

@@ -3,7 +3,7 @@ import { forwardRef as v } from "react";
 import n from "clsx";
 import { g as u } from "../../chunks/classNames.DNsS4J__.js";
 import "../../chunks/constants.BBi77pmH.js";
-import { s } from "../../chunks/card.module.Dy87qmTH.js";
+import { s } from "../../chunks/card.module.ByBYpexJ.js";
 import { Box as M } from "../Box/Box.es.js";
 import { AspectRatio as P } from "./AspectRatio.es.js";
 const R = v(

package/lib/Card/Card.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react/jsx-runtime"),y=require("react"),I=require("clsx"),L=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const g=require("../../chunks/dom.PCrm8EUc.js"),D=require("../Box/Box.cjs.js"),a=require("../../chunks/card.module.BG9mkRao.js"),H=require("./Card.MediaAbove.cjs.js"),R=require("./Card.Header.cjs.js"),T=require("./Card.MediaBelow.cjs.js"),F=require("./Card.Body.cjs.js"),K=require("./Card.Content.cjs.js"),O=require("./Card.Footer.cjs.js"),V=require("./CardContext.cjs.js"),W=require("../StateLayer/StateLayer.cjs.js"),{baseClassNamePrefix:n,classModifierPrefix:C}=L.getBEMClassNames("card"),k='button, a, input, select, textarea, [role="button"], [role="link"], [tabindex]:not([tabindex="-1"])',i=({children:M,className:p,density:N="md",borderColor:m,borderRadius:q,backgroundColor:x,shadow:E,type:d,as:S,disabled:t=!1,href:u,target:f,rel:$,onClick:s,...v})=>{const _=!!d,o=d==="clickable",l=S??(u?"a":"div"),c=y.useCallback(e=>{if(!e||!(e instanceof Element))return!1;const B=e.closest(k);if(!B)return!1;const A=e.closest(`.${a.styles[n]}`);return B!==A},[]),P=y.useCallback(e=>{if(!(t||!o)){if(c(e.target)){e.preventDefault(),e.stopPropagation();return}s==null||s(e)}},[t,o,c,s]),h=y.useCallback(e=>{t||!o||e.key!=="Enter"&&e.key!==" "||c(e.target)||(e.preventDefault(),s==null||s(e))},[t,o,c,s]),j=l==="div",w=I(a.styles[n],!x&&a.styles[`${n}--default-background`],!E&&a.styles[`${n}--default-shadow`],!m&&a.styles[`${n}--default-border`],!q&&a.styles[`${n}--default-border-radius`],_&&a.styles[`${C}interactive`],o&&a.styles[`${C}clickable`],t&&a.styles[`${C}disabled`],p),r={};return _&&(r.tabIndex=t?-1:0,r["aria-disabled"]=t||void 0,o&&(r.onClick=P,j&&(r.onKeyDown=h),l==="a"&&u&&!t&&(r.href=u,f&&(r.target=f),r.rel=g.getSecureRelAttribute(f,$)),l==="button"&&(r.type="button"),l==="div"&&(r.role="button"))),b.jsx(V.CardProvider,{value:{density:N,type:d,disabled:t},children:b.jsxs(D.Box,{as:l,className:w,borderColor:m,borderRadius:q,borderWidth:"md",backgroundColor:x,shadow:E,...r,...v,children:[_&&!t&&b.jsx(W.StateLayer,{}),M]})})};i.displayName="Card";i.MediaAbove=H.MediaAbove;i.MediaBelow=T.MediaBelow;i.Header=R.Header;i.Body=F.Body;i.Content=K.Content;i.Footer=O.Footer;exports.Card=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),o=require("react"),P=require("clsx"),ne=require("../../chunks/classNames.DAeKwerT.js");require("../../chunks/constants.hwjHOsvT.js");const de=require("../Box/Box.cjs.js");require("../../chunks/CSSLookup.DESAWWRT.js");require("../../utils/hooks/useId.cjs.js");const oe=require("../../utils/hooks/useInteractiveProps.cjs.js"),t=require("../../chunks/card.module.8KnCe1uR.js"),ce=require("../Box/utils.cjs.js"),ue=require("./Card.MediaAbove.cjs.js"),be=require("./Card.Header.cjs.js"),_e=require("./Card.MediaBelow.cjs.js"),fe=require("./Card.Body.cjs.js"),ye=require("./Card.Content.cjs.js"),Ce=require("./Card.Footer.cjs.js"),me=require("./CardContext.cjs.js"),pe=require("./useCardGroup.cjs.js"),he=require("../StateLayer/StateLayer.cjs.js"),{baseClassNamePrefix:c,classModifierPrefix:d,subElementClassPrefix:u}=ne.getBEMClassNames("card"),qe='button, a, input:not([data-card-input]), select, textarea, [role="button"], [role="link"], [tabindex]:not([tabindex="-1"])',n=({children:R,className:k,density:N="md",borderColor:g,borderRadius:C,backgroundColor:B,shadow:E,type:S,as:L,disabled:T=!1,href:M,target:A,rel:j,onClick:s,selectionMode:O="single",showIndicator:G=!1,selected:H,defaultSelected:V=!1,onSelect:F,name:K,value:U,style:m,...b})=>{const p=me.useCardGroupContext();process.env.NODE_ENV!=="production"&&p&&S==="clickable"&&console.warn('Card: type="clickable" is ignored when Card is inside a CardGroup; treating as selectable instead.');const h=p?"selectable":S,q=!!h,a=h==="clickable",i=h==="selectable",{selected:v,handleChange:W,resolvedValue:X,isSelectionEligible:x,resolvedDisabled:r,resolvedName:z,resolvedShowIndicator:J,inputType:w}=pe.useCardGroup({cardGroup:p,selected:H,defaultSelected:V,value:U,id:b.id,disabled:T,name:K,selectionMode:O,showIndicator:G,onSelect:F}),I=o.useRef(null),_=L??(a&&M?"a":"div"),Q=o.useMemo(()=>C?{...m,"--bm-card-radius-outer":ce.BOX_BORDER_RADIUS_TO_CSS_VAR[C]}:m,[C,m]),f=o.useCallback(e=>{if(!e||!(e instanceof Element))return!1;const $=e.closest(qe);if(!$)return!1;const l=e.closest(`.${t.styles[c]}`);return $!==l},[]),Y=o.useCallback(e=>{if(r)return;if(f(e.target)){if(a&&_==="a"){const l=e.target,D=l==null?void 0:l.closest('a, [role="link"]');(!D||D===e.currentTarget)&&e.preventDefault()}return}if(a&&(s==null||s(e)),i){if(!x)return;const l=e.target;if(l.tagName==="INPUT"&&l.hasAttribute("data-card-input"))return;I.current&&I.current.click()}},[a,i,x,f,_,s,r]),Z=o.useCallback(e=>{r||e.key!=="Enter"&&e.key!==" "||f(e.target)||(e.preventDefault(),a&&(s==null||s(e)))},[a,f,s,r]),ee=P(t.styles[c],!B&&t.styles[`${c}--default-background`],!E&&t.styles[`${c}--default-shadow`],!g&&t.styles[`${c}--default-border`],q&&t.styles[`${d}interactive`],a&&t.styles[`${d}clickable`],i&&t.styles[`${d}selectable`],i&&v&&t.styles[`${d}selected`],r&&t.styles[`${d}disabled`],N&&t.styles[`${d}density-${N}`],k),te=oe.useInteractiveProps({isInteractive:q,disabled:r,isClickable:a,elementType:_,href:a?M:void 0,target:a?A:void 0,rel:a?j:void 0,onClick:Y,onKeyDown:Z}),ae=()=>!i||!x?null:y.jsx("input",{ref:I,type:w,className:t.styles[`${u}hidden-input`],checked:v,disabled:r,name:z,value:X,onChange:W,"aria-label":b["aria-label"],"aria-labelledby":b["aria-labelledby"],"data-card-input":""}),re=()=>{if(!i||!J)return null;const e=P(t.styles[`${u}selection-indicator`],t.styles[`${u}selection-indicator--${w}`],v&&t.styles[`${u}selection-indicator--checked`],r&&t.styles[`${u}selection-indicator--disabled`]);return y.jsx("span",{className:e,"aria-hidden":"true"})},{"aria-label":se,"aria-labelledby":ie,...le}=b;return y.jsxs(de.Box,{as:_,className:ee,borderColor:g,borderWidth:"md",backgroundColor:B,shadow:E,style:Q,...te,...le,"aria-label":i?void 0:se,"aria-labelledby":i?void 0:ie,children:[ae(),re(),q&&!r&&y.jsx(he.StateLayer,{}),R]})};n.displayName="Card";n.MediaAbove=ue.MediaAbove;n.MediaBelow=_e.MediaBelow;n.Header=be.Header;n.Body=fe.Body;n.Content=ye.Content;n.Footer=Ce.Footer;exports.Card=n;

package/lib/Card/Card.d.ts

@@ -1,66 +1,109 @@
 import { default as React } from 'react';
 import { BoxProps } from '../Box/Box';
 import { BoxBackgroundColor, BoxBorderColor, BoxBorderRadius, BoxShadow } from '@viasat/beam-shared/components/box';
-import { CardDensity, CardType } from '@viasat/beam-shared/components/card';
+import { CardDensity, CardGroupSelectionMode, CardType } from '@viasat/beam-shared/components/card';
 export interface CardProps extends Pick<BoxProps, 'borderColor' | 'borderRadius' | 'backgroundColor' | 'm' | 'mBefore' | 'mAfter' | 'mBottom' | 'mTop' | 'mx' | 'my' | 'shadow'>, React.HTMLAttributes<HTMLElement> {
     /**
      * Specify the content and sub-components of the Card
      */
-    children: React.ReactNode;
+    'children': React.ReactNode;
     /**
      * Specify the density of the Card
      * @default 'md'
      */
-    density?: CardDensity;
+    'density'?: CardDensity;
     /**
      * Specify the border color of the Card
      */
-    borderColor?: BoxBorderColor;
+    'borderColor'?: BoxBorderColor;
     /**
      * Specify the border radius of the Card
      */
-    borderRadius?: BoxBorderRadius;
+    'borderRadius'?: BoxBorderRadius;
     /**
      * Specify the surface color of the Card
      */
-    backgroundColor?: BoxBackgroundColor;
+    'backgroundColor'?: BoxBackgroundColor;
     /**
      * Specify a shadow on the Card
      */
-    shadow?: BoxShadow;
+    'shadow'?: BoxShadow;
     /**
-     * Specify the interactive type of the Card.
+     * Specify the interactive type of the Card. When type="selectable", you should provide either aria-label or aria-labelledby for the selection input to ensure accessibility
      * @default undefined
      */
-    type?: CardType;
+    'type'?: CardType;
     /**
-     * Specify the HTML element type of the Card when interactive.
+     * Specify the HTML element type of the Card when interactive
      */
-    as?: 'div' | 'a' | 'button';
+    'as'?: 'div' | 'a' | 'button';
     /**
-     * Specify if the Card is disabled. Only applies when type is set.
+     * Specify if the Card is disabled. Only applies when type is set
      * @default false
      */
-    disabled?: boolean;
+    'disabled'?: boolean;
     /**
      * Specify the href for the Card when type="clickable" and as="a"
      */
-    href?: string;
+    'href'?: string;
     /**
      * Specify the target for the Card link (e.g., "_blank")
      */
-    target?: string;
+    'target'?: string;
     /**
      * Specify the rel attribute for the Card link
      */
-    rel?: string;
+    'rel'?: string;
     /**
      * Specify a click handler for the Card when type="clickable"
      */
-    onClick?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
+    'onClick'?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
+    /**
+     * Selection mode when type="selectable". Ignored when Card is inside a CardGroup (group's selectionMode wins)
+     * @default 'single'
+     */
+    'selectionMode'?: CardGroupSelectionMode;
+    /**
+     * When true, shows a visual selection indicator (radio or checkbox) on the Card
+     * @default false
+     */
+    'showIndicator'?: boolean;
+    /**
+     * Specify if the Card is selected (controlled). Only applies when type="selectable"
+     */
+    'selected'?: boolean;
+    /**
+     * Specify if the Card is initially selected (uncontrolled). Only applies when type="selectable"
+     */
+    'defaultSelected'?: boolean;
+    /**
+     * Callback when selection changes. Only applies when type="selectable"
+     */
+    'onSelect'?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Name attribute for the underlying input when type="selectable".
+     * Used for form integration
+     */
+    'name'?: string;
+    /**
+     * Value attribute for the underlying input when type="selectable".
+     * Used for form integration
+     *
+     * > When used inside a selectable CardGroup, this (or `id`) is required so the
+     * group can manage selection state
+     */
+    'value'?: string;
+    /**
+     * Accessible label for the selectable Card's input. Required when type="selectable"
+     */
+    'aria-label'?: string;
+    /**
+     * ID(s) of elements that label the selection input. Alternative to aria-label when type="selectable"
+     */
+    'aria-labelledby'?: string;
 }
 export declare const Card: {
-    ({ children, className: _className, density, borderColor, borderRadius, backgroundColor, shadow, type, as, disabled, href, target, rel, onClick, ...props }: CardProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, className: _className, density, borderColor, borderRadius, backgroundColor, shadow, type, as, disabled: _disabled, href, target, rel, onClick, selectionMode: _selectionMode, showIndicator: _showIndicator, selected: controlledSelected, defaultSelected, onSelect, name: _name, value: _value, style, ...props }: CardProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
     MediaAbove: {
         (props: import('./Card.MediaAbove').CardMediaAboveProps): import("react/jsx-runtime").JSX.Element;