@viasat/beam-react 2.22.0 → 2.24.0

package/lib/{wip/Search → Search}/Search.d.ts

@@ -1,11 +1,11 @@
 import { ThemeTypes } from '@viasat/beam-shared/utils';
 import { Nullable } from '@viasat/beam-shared/utils/types';
-import { default as React } from 'react';
-import { default as Results } from './Search.Results';
-import { IconComponentType } from '../../../utils/types';
+import { default as React, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
+import { Results } from './Search.Results';
+import { IconComponentType } from '../../utils/types';
 export interface SearchProps extends React.ComponentPropsWithRef<'input'> {
     /**
-     * Specify a callback called whenever a search is conducted
+     * Specify a callback that gets called whenever a search is conducted
      */
     onSearch: (query: string) => void;
     /**
@@ -72,17 +72,26 @@ export interface SearchProps extends React.ComponentPropsWithRef<'input'> {
     noResults?: string;
     /**
      * Aria label for the clear button
-     * @default 'Clear search'
+     * @default Clear search
      */
     clearButtonAriaLabel?: string;
+    /**
+     * Specify if Search displays in a disabled state
+     * @default false
+     */
+    disabled?: boolean;
     /**
      * Specify the theme of the Search. By default it inherits the theme from the parent
      */
     theme?: ThemeTypes;
+    /**
+     * Specify the Search results to display in the Search dropdown
+     * (see Search.Results)
+     */
     children?: React.ReactNode;
 }
-declare const SearchComponent: React.ForwardRefExoticComponent<Omit<SearchProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
-export declare const Search: typeof SearchComponent & {
+interface SearchComponent extends ForwardRefExoticComponent<PropsWithoutRef<SearchProps> & RefAttributes<HTMLInputElement>> {
     Results: typeof Results;
-};
-export default Search;
+}
+export declare const Search: SearchComponent;
+export {};

package/lib/Search/Search.es.js

@@ -0,0 +1,179 @@
+import { jsxs as S, jsx as t } from "react/jsx-runtime";
+import { g as ue } from "../../chunks/classNames.BTJmrO_L.js";
+import { t as fe } from "../../chunks/constants.CKKGf1-i.js";
+import pe, { forwardRef as be, useCallback as he } from "react";
+import { s as r, S as xe, R as Ie } from "../../chunks/Search.Results.XLqY_iES.js";
+import q from "clsx";
+import { H as ye } from "../../chunks/form.context.D7b4066_.js";
+import { LabelProvider as Se } from "../Form/contexts/label.context.es.js";
+import { HelperTextProvider as Ne } from "../Form/contexts/helperText.context.es.js";
+import { useUniversalRef as Re } from "../Form/hooks/useUniversalRef.hook.es.js";
+import { useAccessibleId as f } from "../Form/hooks/useAccessibleId.hook.es.js";
+import { Icon as Pe } from "../Icon/Icon.es.js";
+import { useSearchDropdown as ve } from "./useSearchDropdown.es.js";
+import { SearchDropdown as De } from "./SearchDropdown.es.js";
+import { ActionList as $e } from "../ActionList/ActionList.es.js";
+import { useDebounced as ge } from "../../utils/hooks/useDebounced.es.js";
+import { useEffectAfterMount as _e } from "../../utils/hooks/useEffectAfterMount.es.js";
+import { Spinner as we } from "../Spinner/Spinner.es.js";
+import { CloseButton as Ee } from "../CloseButton/CloseButton.es.js";
+const { baseClassNamePrefix: ke, subElementClassPrefix: o, classModifierPrefix: p } = ue("search"), n = be(
+  ({
+    id: z,
+    defaultValue: C = "",
+    value: N,
+    onChange: a,
+    onSearch: U,
+    loading: R = !1,
+    debounce: W = 200,
+    onKeyDown: b,
+    label: P,
+    contentAfter: v,
+    contentBefore: D,
+    helperText: $,
+    fluid: G,
+    width: J,
+    theme: g,
+    disabled: s,
+    hideIcon: Q,
+    icon: X = xe,
+    error: i,
+    readOnly: d,
+    clearable: _ = !0,
+    noResults: w,
+    clearButtonAriaLabel: Y = "Clear search",
+    className: Z,
+    children: E,
+    "aria-describedby": K,
+    "aria-labelledby": O,
+    "aria-label": k,
+    ...h
+  }, ee) => {
+    const { refFn: te, ref: re } = Re(ee), [ae, A] = pe.useState(String(C)), m = N !== void 0, c = m ? String(N) : ae, se = (e) => {
+      m || A(e.target.value), a == null || a(e);
+    }, { immediate: x, debounced: H } = ge(U, W), ie = (e) => {
+      if (b == null || b(e), e.key === "Enter") {
+        if (e.isDefaultPrevented() || e.isPropagationStopped())
+          return;
+        const { activeIndex: l, elementsRef: me } = I, y = l !== null ? me.current[l] : null;
+        y && y.getAttribute("aria-disabled") !== "true" ? (e.preventDefault(), y.click()) : l === null && x(c);
+      }
+      e.key === "Escape" && (!_ || I.open) && e.preventDefault();
+    }, { id: u } = f(), { id: M } = f(), { id: V } = f(), { id: B } = f(), F = !!(i != null && i.length), L = !!E || !!w, T = q(
+      $ && B,
+      F && V,
+      K
+    ), j = O ?? (P ? M : void 0), { dropdownProps: I, getFieldProps: le, getInputProps: oe } = ve({
+      enabled: L,
+      disabled: !!s,
+      readOnly: !!d
+    });
+    _e(() => {
+      H(c);
+    }, [c, H]);
+    const ce = q(
+      r[ke],
+      g && fe(g),
+      G && r[`${p}fluid`],
+      s && r[`${p}disabled`],
+      d && r[`${p}read-only`],
+      i && r[`${p}error`],
+      Z
+    ), ne = (e) => {
+      var l;
+      s || e.target instanceof HTMLInputElement || e.target.closest(
+        'button,[role="button"],a,[role="link"]'
+      ) || (e.preventDefault(), e.stopPropagation(), (l = re.current) == null || l.focus());
+    }, de = he(() => {
+      m ? a == null || a({
+        target: {
+          value: "",
+          name: h.name,
+          id: u,
+          type: "search"
+        }
+      }) : A(""), x("");
+    }, [u, m, a, x, h.name]);
+    return /* @__PURE__ */ S(
+      "div",
+      {
+        id: z,
+        className: ce,
+        role: "search",
+        style: { maxWidth: J },
+        "aria-labelledby": j,
+        "aria-label": k,
+        "aria-describedby": T,
+        "aria-busy": R,
+        children: [
+          /* @__PURE__ */ t(
+            Se,
+            {
+              ctxDisabled: !!s,
+              ctxRequired: !1,
+              ctxHtmlFor: u,
+              ctxId: M,
+              children: P
+            }
+          ),
+          /* @__PURE__ */ S(
+            "div",
+            {
+              className: r[`${o}field`],
+              ...le({ onPointerDown: ne }),
+              children: [
+                !Q && /* @__PURE__ */ t(Pe, { icon: X, "aria-hidden": !0 }),
+                D && /* @__PURE__ */ t("div", { className: r[`${o}content`], children: D }),
+                /* @__PURE__ */ t(
+                  "input",
+                  {
+                    id: u,
+                    type: "search",
+                    className: r[`${o}field__input`],
+                    value: c,
+                    disabled: s,
+                    readOnly: d,
+                    "aria-invalid": !!i,
+                    "aria-labelledby": j,
+                    "aria-label": k,
+                    "aria-describedby": T,
+                    ...oe({
+                      ...h,
+                      onChange: se,
+                      onKeyDown: ie
+                    }),
+                    ref: te
+                  }
+                ),
+                R && /* @__PURE__ */ t("div", { className: r[`${o}field__spinner`], children: /* @__PURE__ */ t(we, { size: "xxs" }) }),
+                _ && c && !s && !d && /* @__PURE__ */ t(
+                  Ee,
+                  {
+                    onClick: de,
+                    className: `${o}field__clear-button`,
+                    size: "sm",
+                    "aria-label": Y
+                  }
+                ),
+                v && /* @__PURE__ */ t("div", { className: r[`${o}content`], children: v })
+              ]
+            }
+          ),
+          /* @__PURE__ */ S(Ne, { ctxId: B, ctxDisabled: !!s, children: [
+            $,
+            F && /* @__PURE__ */ t(ye, { id: V, appearance: "negative", children: i })
+          ] }),
+          L && /* @__PURE__ */ t(De, { ...I, children: /* @__PURE__ */ t($e, { role: "listbox", noResults: w, children: E }) })
+        ]
+      }
+    );
+  }
+);
+n.displayName = "Search";
+n.Results = Ie;
+n.Results.displayName = "Search.Results";
+n.Results.Item.displayName = "Search.Results.Item";
+n.Results.ViewAll.displayName = "Search.Results.ViewAll";
+export {
+  n as Search
+};

package/lib/Search/SearchDropdown.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),p=require("@floating-ui/react"),q=require("../Box/Box.cjs.js"),N=require("clsx"),t=require("../../chunks/classNames.DAeKwerT.js"),_=require("../../chunks/constants.hwjHOsvT.js"),b=require("../ActionList/ActionList.context.cjs.js"),g=require("react"),e=require("../../chunks/Search.Results.DqEXVJeE.js"),h=require("../../chunks/floatingui.module.D3Aw_aYe.js"),B=require("../../chunks/popover.module.DGUJIXrP.js"),{baseClassNamePrefix:P}=t.getBEMClassNames("floatingui"),{baseClassNamePrefix:S}=t.getBEMClassNames("popover"),{subElementClassPrefix:y}=t.getBEMClassNames("search"),v=[e.Results,e.Results.Item,e.Results.ViewAll],w=({setOpen:o,isMounted:r,getFloatingProps:a,floatingStyles:i,labelsRef:n,elementsRef:c,getItemProps:u,setFloating:m,theme:l,className:x,children:f,activeIndex:C})=>{const d=g.useCallback(()=>o(!1),[o]);return r?s.jsx(p.FloatingPortal,{children:s.jsx(q.Box,{className:N(l&&_.themeClassName(l),h.floatinguiStyles[P],B.popoverStyles[S],e.styles[`${y}dropdown`],x),...a(),style:i,ref:m,children:s.jsx(b.ActionListContextProvider,{allowChildrenTypes:v,getItemProps:u,itemsFocusable:!1,onItemClick:d,labelsRef:n,elementsRef:c,activeIndex:C,children:f})})}):null};exports.SearchDropdown=w;

package/lib/Search/SearchDropdown.es.js

@@ -0,0 +1,58 @@
+import { jsx as s } from "react/jsx-runtime";
+import { FloatingPortal as d } from "@floating-ui/react";
+import { Box as N } from "../Box/Box.es.js";
+import P from "clsx";
+import { g as e } from "../../chunks/classNames.BTJmrO_L.js";
+import { t as g } from "../../chunks/constants.CKKGf1-i.js";
+import { ActionListContextProvider as h } from "../ActionList/ActionList.context.es.js";
+import { useCallback as b } from "react";
+import { R as o, s as y } from "../../chunks/Search.Results.XLqY_iES.js";
+import { f as v } from "../../chunks/floatingui.module.BcBFebz0.js";
+import { p as w } from "../../chunks/popover.module.3dnl8y6-.js";
+const { baseClassNamePrefix: B } = e("floatingui"), { baseClassNamePrefix: k } = e("popover"), { subElementClassPrefix: I } = e("search"), S = [o, o.Item, o.ViewAll], q = ({
+  setOpen: r,
+  isMounted: t,
+  getFloatingProps: l,
+  floatingStyles: m,
+  labelsRef: i,
+  elementsRef: f,
+  getItemProps: n,
+  setFloating: p,
+  theme: a,
+  className: c,
+  children: C,
+  activeIndex: u
+}) => {
+  const x = b(() => r(!1), [r]);
+  return t ? /* @__PURE__ */ s(d, { children: /* @__PURE__ */ s(
+    N,
+    {
+      className: P(
+        a && g(a),
+        v[B],
+        w[k],
+        y[`${I}dropdown`],
+        c
+      ),
+      ...l(),
+      style: m,
+      ref: p,
+      children: /* @__PURE__ */ s(
+        h,
+        {
+          allowChildrenTypes: S,
+          getItemProps: n,
+          itemsFocusable: !1,
+          onItemClick: x,
+          labelsRef: i,
+          elementsRef: f,
+          activeIndex: u,
+          children: C
+        }
+      )
+    }
+  ) }) : null;
+};
+export {
+  q as SearchDropdown
+};

package/lib/Search/index.d.ts

@@ -0,0 +1,4 @@
+export { Search, type SearchProps } from './Search';
+export type { SearchResultsProps } from './Search.Results';
+export type { SearchResultsItemProps } from './Search.Results.Item';
+export type { SearchResultsViewAllProps } from './Search.Results.ViewAll';

package/lib/Search/useSearchDropdown.cjs.js

@@ -0,0 +1 @@
+"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 → Search}/useSearchDropdown.es.js

@@ -1,7 +1,7 @@
 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";
+import Q from "../FloatingUI/useTyping.es.js";
+import { useBlur as W } from "../FloatingUI/useBlur.es.js";
 const te = (H) => {
   const { disabled: n, readOnly: o, enabled: e = !0 } = H, [s, i] = h(!1), f = u(s);
   f.current = s;

package/lib/Switch/Switch.figma.d.ts

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

package/lib/Tooltip/Tooltip.es.js

@@ -3,7 +3,7 @@ import { jsx as t, jsxs as w } from "react/jsx-runtime";
 import { createContext as h, forwardRef as T, useContext as S, useMemo as N } from "react";
 import { FloatingUIRoot as P } from "../FloatingUI/FloatingUI.root.es.js";
 import { Trigger as _ } from "../FloatingUI/FloatingUI.trigger.es.js";
-import "../../chunks/FloatingUI.context.Dl4Y1y1z.js";
+import "../../chunks/FloatingUI.context.D3kSM-y1.js";
 import { Content as k } from "../FloatingUI/FloatingUI.content.es.js";
 import { j as v, k as O } from "../../chunks/tokens.BD_71qmL.js";
 import { g as $ } from "../../chunks/classNames.BTJmrO_L.js";

package/lib/Tooltip/Tooltip.figma.d.ts

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

package/lib/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./Accordion/Accordion.cjs.js"),l=require("./Accordion/AccordionGroup.cjs.js"),s=require("./Alert/Alert.cjs.js"),c=require("./Autocomplete/Autocomplete.cjs.js"),d=require("./Avatar/index.cjs.js"),b=require("./CloseButton/CloseButton.cjs.js"),r=require("./Button/Button.cjs.js"),p=require("./Dialog/Dialog.cjs.js"),S=require("./Breadcrumbs/Breadcrumbs.cjs.js"),q=require("../chunks/BreadcrumbsItem.DM3uQ5rs.js"),A=require("./EmptyState/EmptyState.cjs.js"),T=require("./Badge/Badge.cjs.js"),C=require("./BadgeDot/BadgeDot.cjs.js"),B=require("./Box/Box.cjs.js"),g=require("./Checkbox/Checkbox.cjs.js"),P=require("./Chips/Chip.cjs.js"),v=require("./Chips/ChipGroup.cjs.js"),L=require("./Divider/Divider.cjs.js"),x=require("./FileUpload/FileUpload.cjs.js"),N=require("./Flag/Flag.cjs.js"),m=require("./Form/Form.cjs.js"),h=require("../chunks/form.context.hesWPMlU.js"),H=require("./Icon/Icon.cjs.js"),G=require("./InputChoiceGroup/SwitchGroup/SwitchGroup.cjs.js"),R=require("./InputChoiceGroup/CheckboxGroup/CheckboxGroup.cjs.js"),D=require("./InputChoiceGroup/RadioButtonGroup/RadioButtonGroup.cjs.js"),I=require("./Label/Label.cjs.js"),O=require("./Link/Link.cjs.js"),y=require("./List/List.cjs.js"),E=require("./ActionList/ActionList.cjs.js"),F=require("./Logo/Logo.cjs.js"),k=require("./Menu/Menu.cjs.js"),M=require("./Menu/Menu.context.cjs.js"),U=require("./NativeSelect/NativeSelect.cjs.js"),w=require("./Pagination/Pagination.cjs.js"),Y=require("./ProgressBar/ProgressBar.cjs.js"),W=require("./RadioButton/RadioButton.cjs.js"),e=require("./SideNav/SideNav.cjs.js"),o=require("./SideNav/SideNavContext.cjs.js"),V=require("./SegmentedControl/SegmentedControl.cjs.js"),K=require("./Select/Select.cjs.js"),f=require("./Spinner/Spinner.cjs.js"),Q=require("./StateLayer/StateLayer.cjs.js"),j=require("./Stepper/Stepper.cjs.js"),t=require("./Stepper/useBeamStepper.cjs.js"),z=require("./Switch/Switch.cjs.js"),J=require("./Tabs/Tabs.cjs.js"),X=require("./Text/Text.cjs.js"),Z=require("./TextArea/TextArea.cjs.js"),$=require("./TextField/TextField.cjs.js"),ee=require("./Toasts/Toast.cjs.js"),i=require("../chunks/ToastContext.BJK1U8nL.js"),re=require("./Toasts/ToastContainer.cjs.js"),a=require("./Tooltip/Tooltip.cjs.js"),n=require("./Header/Header.cjs.js"),oe=require("./Header/HeaderMasthead.cjs.js"),te=require("./Header/HeaderActionGroup.cjs.js"),ie=require("./Header/HeaderNavigation.cjs.js"),_=require("./PortalProvider/PortalContext.cjs.js"),ae=require("./PortalProvider/PortalProvider.cjs.js"),ne=require("./Popover/Popover.cjs.js"),_e=require("./PageHeader/PageHeader.cjs.js"),ue=require("./PageLayout/PageLayout.cjs.js"),le=require("./Slider/Slider.cjs.js"),se=require("./Card/Card.cjs.js"),ce=require("./Card/CardGroup.cjs.js"),de=require("../chunks/useFormValidator.hook.BtP4A6XY.js");exports.Accordion=u.Accordion;exports.AccordionGroup=l.AccordionGroup;exports.Alert=s.Alert;exports.Autocomplete=c.Autocomplete;exports.Avatar=d.Avatar;exports.CloseButton=b.CloseButton;exports.Button=r.Button;exports.ButtonIconWrap=r.ButtonIconWrap;exports.Dialog=p.Dialog;exports.Breadcrumb=S.Breadcrumb;exports.BreadcrumbItem=q.BreadcrumbItem;exports.EmptyState=A.EmptyState;exports.Badge=T.Badge;exports.BadgeDot=C.BadgeDot;exports.Box=B.Box;exports.Checkbox=g.Checkbox;exports.Chip=P.Chip;exports.ChipGroup=v.ChipGroup;exports.Divider=L.Divider;exports.FileUpload=x.default;exports.Flag=N.Flag;exports.Form=m.Form;exports.HelperText=h.HelperText;exports.Icon=H.Icon;exports.SwitchGroup=G.SwitchGroup;exports.CheckboxGroup=R.CheckboxGroup;exports.RadioButtonGroup=D.RadioButtonGroup;exports.Label=I.Label;exports.Link=O.Link;exports.List=y.List;exports.ActionList=E.ActionList;exports.Logo=F.Logo;exports.Menu=k.Menu;exports.useMenuContext=M.useMenuContext;exports.NativeSelect=U.NativeSelect;exports.Pagination=w.Pagination;exports.ProgressBar=Y.ProgressBar;exports.RadioButton=W.RadioButton;exports.DRAWER_LAYOUT=e.DRAWER_LAYOUT;exports.HIDDEN_LAYOUT=e.HIDDEN_LAYOUT;exports.LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME=e.LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME;exports.NO_LAYOUT=e.NO_LAYOUT;exports.OPAQUE_BACKDROP=e.OPAQUE_BACKDROP;exports.RAIL_LAYOUT=e.RAIL_LAYOUT;exports.Root=e.Root;exports.SideNav=e.SideNav;exports.SideNavBackdrops=e.SideNavBackdrops;exports.SideNavClosedLayouts=e.SideNavClosedLayouts;exports.SideNavOpenLayouts=e.SideNavOpenLayouts;exports.TRANSPARENT_BACKDROP=e.TRANSPARENT_BACKDROP;exports.SideNavProvider=o.SideNavProvider;exports.useSideNavContext=o.useSideNavContext;exports.SegmentedControl=V.SegmentedControl;exports.Select=K.Select;exports.Spinner=f.Spinner;exports.StateLayer=Q.StateLayer;exports.Stepper=j.Stepper;exports.processMetadata=t.processMetadata;exports.useBeamStepper=t.useBeamStepper;exports.Switch=z.Switch;exports.Tabs=J.Tabs;exports.Text=X.Text;exports.TextArea=Z.TextArea;exports.TextField=$.TextField;exports.Toast=ee.Toast;exports.ToastProvider=i.ToastProvider;exports.useToast=i.useToast;exports.ToastContainer=re.ToastContainer;exports.Tooltip=a.Tooltip;exports.TooltipIconTrigger=a.TooltipIconTrigger;exports.Header=n.Header;exports.InternalHeader=n.InternalHeader;exports.HeaderMasthead=oe.HeaderMasthead;exports.HeaderActionGroup=te.HeaderActionGroup;exports.HeaderNavigation=ie.HeaderNavigation;exports.PortalContext=_.PortalContext;exports.usePortal=_.usePortal;exports.PortalProvider=ae.PortalProvider;exports.Popover=ne.Popover;exports.PageHeader=_e.PageHeader;exports.PageLayout=ue.PageLayout;exports.Slider=le.Slider;exports.Card=se.Card;exports.CardGroup=ce.CardGroup;exports.validators=de.validators;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./Accordion/Accordion.cjs.js"),c=require("./Accordion/AccordionGroup.cjs.js"),l=require("./Alert/Alert.cjs.js"),s=require("./Autocomplete/Autocomplete.cjs.js"),d=require("./Avatar/index.cjs.js"),b=require("./CloseButton/CloseButton.cjs.js"),r=require("./Button/Button.cjs.js"),p=require("./Dialog/Dialog.cjs.js"),S=require("./Breadcrumbs/Breadcrumbs.cjs.js"),q=require("../chunks/BreadcrumbsItem.DM3uQ5rs.js"),A=require("./EmptyState/EmptyState.cjs.js"),T=require("./Badge/Badge.cjs.js"),C=require("./BadgeDot/BadgeDot.cjs.js"),B=require("./Box/Box.cjs.js"),g=require("./Checkbox/Checkbox.cjs.js"),P=require("./Chips/Chip.cjs.js"),v=require("./Chips/ChipGroup.cjs.js"),L=require("./Divider/Divider.cjs.js"),x=require("./FileUpload/FileUpload.cjs.js"),h=require("./Flag/Flag.cjs.js"),N=require("./Form/Form.cjs.js"),m=require("../chunks/form.context.hesWPMlU.js"),H=require("./Icon/Icon.cjs.js"),G=require("./InputChoiceGroup/SwitchGroup/SwitchGroup.cjs.js"),R=require("./InputChoiceGroup/CheckboxGroup/CheckboxGroup.cjs.js"),D=require("./InputChoiceGroup/RadioButtonGroup/RadioButtonGroup.cjs.js"),I=require("./Label/Label.cjs.js"),O=require("./Link/Link.cjs.js"),y=require("./List/List.cjs.js"),E=require("./ActionList/ActionList.cjs.js"),F=require("./Logo/Logo.cjs.js"),k=require("./Menu/Menu.cjs.js"),M=require("./Menu/Menu.context.cjs.js"),U=require("./NativeSelect/NativeSelect.cjs.js"),w=require("./Pagination/Pagination.cjs.js"),Y=require("./ProgressBar/ProgressBar.cjs.js"),W=require("./RadioButton/RadioButton.cjs.js"),e=require("./SideNav/SideNav.cjs.js"),o=require("./SideNav/SideNavContext.cjs.js"),V=require("./SegmentedControl/SegmentedControl.cjs.js"),K=require("./Select/Select.cjs.js"),f=require("./Spinner/Spinner.cjs.js"),Q=require("./StateLayer/StateLayer.cjs.js"),j=require("./Stepper/Stepper.cjs.js"),t=require("./Stepper/useBeamStepper.cjs.js"),z=require("./Switch/Switch.cjs.js"),J=require("./Tabs/Tabs.cjs.js"),X=require("./Text/Text.cjs.js"),Z=require("./TextArea/TextArea.cjs.js"),$=require("./TextField/TextField.cjs.js"),ee=require("./Toasts/Toast.cjs.js"),i=require("../chunks/ToastContext.BJK1U8nL.js"),re=require("./Toasts/ToastContainer.cjs.js"),a=require("./Tooltip/Tooltip.cjs.js"),n=require("./Header/Header.cjs.js"),oe=require("./Header/HeaderMasthead.cjs.js"),te=require("./Header/HeaderActionGroup.cjs.js"),ie=require("./Header/HeaderNavigation.cjs.js"),_=require("./PortalProvider/PortalContext.cjs.js"),ae=require("./PortalProvider/PortalProvider.cjs.js"),ne=require("./Popover/Popover.cjs.js"),_e=require("./PageHeader/PageHeader.cjs.js"),ue=require("./PageLayout/PageLayout.cjs.js"),ce=require("./Slider/Slider.cjs.js"),le=require("./Card/Card.cjs.js"),se=require("./Card/CardGroup.cjs.js"),de=require("./Search/Search.cjs.js"),be=require("../chunks/useFormValidator.hook.BtP4A6XY.js");exports.Accordion=u.Accordion;exports.AccordionGroup=c.AccordionGroup;exports.Alert=l.Alert;exports.Autocomplete=s.Autocomplete;exports.Avatar=d.Avatar;exports.CloseButton=b.CloseButton;exports.Button=r.Button;exports.ButtonIconWrap=r.ButtonIconWrap;exports.Dialog=p.Dialog;exports.Breadcrumb=S.Breadcrumb;exports.BreadcrumbItem=q.BreadcrumbItem;exports.EmptyState=A.EmptyState;exports.Badge=T.Badge;exports.BadgeDot=C.BadgeDot;exports.Box=B.Box;exports.Checkbox=g.Checkbox;exports.Chip=P.Chip;exports.ChipGroup=v.ChipGroup;exports.Divider=L.Divider;exports.FileUpload=x.default;exports.Flag=h.Flag;exports.Form=N.Form;exports.HelperText=m.HelperText;exports.Icon=H.Icon;exports.SwitchGroup=G.SwitchGroup;exports.CheckboxGroup=R.CheckboxGroup;exports.RadioButtonGroup=D.RadioButtonGroup;exports.Label=I.Label;exports.Link=O.Link;exports.List=y.List;exports.ActionList=E.ActionList;exports.Logo=F.Logo;exports.Menu=k.Menu;exports.useMenuContext=M.useMenuContext;exports.NativeSelect=U.NativeSelect;exports.Pagination=w.Pagination;exports.ProgressBar=Y.ProgressBar;exports.RadioButton=W.RadioButton;exports.DRAWER_LAYOUT=e.DRAWER_LAYOUT;exports.HIDDEN_LAYOUT=e.HIDDEN_LAYOUT;exports.LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME=e.LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME;exports.NO_LAYOUT=e.NO_LAYOUT;exports.OPAQUE_BACKDROP=e.OPAQUE_BACKDROP;exports.RAIL_LAYOUT=e.RAIL_LAYOUT;exports.Root=e.Root;exports.SideNav=e.SideNav;exports.SideNavBackdrops=e.SideNavBackdrops;exports.SideNavClosedLayouts=e.SideNavClosedLayouts;exports.SideNavOpenLayouts=e.SideNavOpenLayouts;exports.TRANSPARENT_BACKDROP=e.TRANSPARENT_BACKDROP;exports.SideNavProvider=o.SideNavProvider;exports.useSideNavContext=o.useSideNavContext;exports.SegmentedControl=V.SegmentedControl;exports.Select=K.Select;exports.Spinner=f.Spinner;exports.StateLayer=Q.StateLayer;exports.Stepper=j.Stepper;exports.processMetadata=t.processMetadata;exports.useBeamStepper=t.useBeamStepper;exports.Switch=z.Switch;exports.Tabs=J.Tabs;exports.Text=X.Text;exports.TextArea=Z.TextArea;exports.TextField=$.TextField;exports.Toast=ee.Toast;exports.ToastProvider=i.ToastProvider;exports.useToast=i.useToast;exports.ToastContainer=re.ToastContainer;exports.Tooltip=a.Tooltip;exports.TooltipIconTrigger=a.TooltipIconTrigger;exports.Header=n.Header;exports.InternalHeader=n.InternalHeader;exports.HeaderMasthead=oe.HeaderMasthead;exports.HeaderActionGroup=te.HeaderActionGroup;exports.HeaderNavigation=ie.HeaderNavigation;exports.PortalContext=_.PortalContext;exports.usePortal=_.usePortal;exports.PortalProvider=ae.PortalProvider;exports.Popover=ne.Popover;exports.PageHeader=_e.PageHeader;exports.PageLayout=ue.PageLayout;exports.Slider=ce.Slider;exports.Card=le.Card;exports.CardGroup=se.CardGroup;exports.Search=de.Search;exports.validators=be.validators;

package/lib/index.d.ts

@@ -49,3 +49,4 @@ export * from './PageHeader';
 export * from './PageLayout';
 export * from './Slider';
 export * from './Card';
+export * from './Search';

package/lib/index.es.js

@@ -5,7 +5,7 @@ import { Autocomplete as f } from "./Autocomplete/Autocomplete.es.js";
 import { Avatar as d } from "./Avatar/index.es.js";
 import { CloseButton as s } from "./CloseButton/CloseButton.es.js";
 import { Button as A, ButtonIconWrap as l } from "./Button/Button.es.js";
-import { Dialog as c } from "./Dialog/Dialog.es.js";
+import { Dialog as S } from "./Dialog/Dialog.es.js";
 import { Breadcrumb as v } from "./Breadcrumbs/Breadcrumbs.es.js";
 import { B as C } from "../chunks/BreadcrumbsItem.6c7NEqgi.js";
 import { EmptyState as P } from "./EmptyState/EmptyState.es.js";
@@ -13,7 +13,7 @@ import { Badge as g } from "./Badge/Badge.es.js";
 import { BadgeDot as _ } from "./BadgeDot/BadgeDot.es.js";
 import { Box as D } from "./Box/Box.es.js";
 import { Checkbox as I } from "./Checkbox/Checkbox.es.js";
-import { Chip as G } from "./Chips/Chip.es.js";
+import { Chip as E } from "./Chips/Chip.es.js";
 import { ChipGroup as b } from "./Chips/ChipGroup.es.js";
 import { Divider as y } from "./Divider/Divider.es.js";
 import { default as k } from "./FileUpload/FileUpload.es.js";
@@ -31,11 +31,11 @@ import { ActionList as ao } from "./ActionList/ActionList.es.js";
 import { Logo as io } from "./Logo/Logo.es.js";
 import { Menu as so } from "./Menu/Menu.es.js";
 import { useMenuContext as Ao } from "./Menu/Menu.context.es.js";
-import { NativeSelect as To } from "./NativeSelect/NativeSelect.es.js";
-import { Pagination as So } from "./Pagination/Pagination.es.js";
+import { NativeSelect as co } from "./NativeSelect/NativeSelect.es.js";
+import { Pagination as To } from "./Pagination/Pagination.es.js";
 import { ProgressBar as Bo } from "./ProgressBar/ProgressBar.es.js";
 import { RadioButton as Lo } from "./RadioButton/RadioButton.es.js";
-import { DRAWER_LAYOUT as No, HIDDEN_LAYOUT as go, LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME as Ro, NO_LAYOUT as _o, OPAQUE_BACKDROP as Oo, RAIL_LAYOUT as Do, Root as Ho, SideNav as Io, SideNavBackdrops as Eo, SideNavClosedLayouts as Go, SideNavOpenLayouts as ho, TRANSPARENT_BACKDROP as bo } from "./SideNav/SideNav.es.js";
+import { DRAWER_LAYOUT as No, HIDDEN_LAYOUT as go, LOCAL_STORAGE_SIDE_NAV_WIDTH_VAR_NAME as Ro, NO_LAYOUT as _o, OPAQUE_BACKDROP as Oo, RAIL_LAYOUT as Do, Root as Ho, SideNav as Io, SideNavBackdrops as ho, SideNavClosedLayouts as Eo, SideNavOpenLayouts as Go, TRANSPARENT_BACKDROP as bo } from "./SideNav/SideNav.es.js";
 import { SideNavProvider as yo, useSideNavContext as Mo } from "./SideNav/SideNavContext.es.js";
 import { SegmentedControl as Fo } from "./SegmentedControl/SegmentedControl.es.js";
 import { Select as Wo } from "./Select/Select.es.js";
@@ -51,20 +51,21 @@ import { TextField as ar } from "./TextField/TextField.es.js";
 import { Toast as ir } from "./Toasts/Toast.es.js";
 import { T as nr, u as sr } from "../chunks/ToastContext.CYGy7l7R.js";
 import { ToastContainer as Ar } from "./Toasts/ToastContainer.es.js";
-import { Tooltip as Tr, TooltipIconTrigger as cr } from "./Tooltip/Tooltip.es.js";
+import { Tooltip as cr, TooltipIconTrigger as Sr } from "./Tooltip/Tooltip.es.js";
 import { Header as vr, InternalHeader as Br } from "./Header/Header.es.js";
 import { HeaderMasthead as Lr } from "./Header/HeaderMasthead.es.js";
 import { HeaderActionGroup as Nr } from "./Header/HeaderActionGroup.es.js";
 import { HeaderNavigation as Rr } from "./Header/HeaderNavigation.es.js";
 import { PortalContext as Or, usePortal as Dr } from "./PortalProvider/PortalContext.es.js";
 import { PortalProvider as Ir } from "./PortalProvider/PortalProvider.es.js";
-import { Popover as Gr } from "./Popover/Popover.es.js";
+import { Popover as Er } from "./Popover/Popover.es.js";
 import { PageHeader as br } from "./PageHeader/PageHeader.es.js";
 import { PageLayout as yr } from "./PageLayout/PageLayout.es.js";
 import { Slider as kr } from "./Slider/Slider.es.js";
 import { Card as Yr } from "./Card/Card.es.js";
 import { CardGroup as wr } from "./Card/CardGroup.es.js";
-import { v as Vr } from "../chunks/useFormValidator.hook.CSmddwEt.js";
+import { Search as Vr } from "./Search/Search.es.js";
+import { v as jr } from "../chunks/useFormValidator.hook.CSmddwEt.js";
 export {
   e as Accordion,
   p as AccordionGroup,
@@ -83,11 +84,11 @@ export {
   wr as CardGroup,
   I as Checkbox,
   X as CheckboxGroup,
-  G as Chip,
+  E as Chip,
   b as ChipGroup,
   s as CloseButton,
   No as DRAWER_LAYOUT,
-  c as Dialog,
+  S as Dialog,
   y as Divider,
   P as EmptyState,
   k as FileUpload,
@@ -108,12 +109,12 @@ export {
   io as Logo,
   so as Menu,
   _o as NO_LAYOUT,
-  To as NativeSelect,
+  co as NativeSelect,
   Oo as OPAQUE_BACKDROP,
   br as PageHeader,
   yr as PageLayout,
-  So as Pagination,
-  Gr as Popover,
+  To as Pagination,
+  Er as Popover,
   Or as PortalContext,
   Ir as PortalProvider,
   Bo as ProgressBar,
@@ -121,12 +122,13 @@ export {
   Lo as RadioButton,
   $ as RadioButtonGroup,
   Ho as Root,
+  Vr as Search,
   Fo as SegmentedControl,
   Wo as Select,
   Io as SideNav,
-  Eo as SideNavBackdrops,
-  Go as SideNavClosedLayouts,
-  ho as SideNavOpenLayouts,
+  ho as SideNavBackdrops,
+  Eo as SideNavClosedLayouts,
+  Go as SideNavOpenLayouts,
   yo as SideNavProvider,
   kr as Slider,
   Ko as Spinner,
@@ -142,13 +144,13 @@ export {
   ir as Toast,
   Ar as ToastContainer,
   nr as ToastProvider,
-  Tr as Tooltip,
-  cr as TooltipIconTrigger,
+  cr as Tooltip,
+  Sr as TooltipIconTrigger,
   Jo as processMetadata,
   Xo as useBeamStepper,
   Ao as useMenuContext,
   Dr as usePortal,
   Mo as useSideNavContext,
   sr as useToast,
-  Vr as validators
+  jr as validators
 };

package/lib/wip/Panel/Panel.Body.cjs.js

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

package/lib/wip/Panel/Panel.Body.d.ts

@@ -1,11 +1,16 @@
 import { default as React, ComponentPropsWithoutRef } from 'react';
+import { BoxBackgroundColor } from '@viasat/beam-shared/components/box';
 export interface PanelBodyProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Specify the content for the Panel body
      */
     children?: React.ReactNode;
+    /**
+     * Specify the background color of the body surface
+     */
+    backgroundColor?: BoxBackgroundColor;
 }
 export declare const Body: {
-    ({ children, className: _className, ...props }: PanelBodyProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, className: _className, backgroundColor, ...props }: PanelBodyProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/lib/wip/Panel/Panel.Body.es.js

@@ -1,17 +1,19 @@
-import { jsx as m } from "react/jsx-runtime";
-import t from "clsx";
-import { g as r } from "../../../chunks/classNames.BTJmrO_L.js";
+import { jsx as t } from "react/jsx-runtime";
+import e from "clsx";
+import { g as l } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { s as l } from "../../../chunks/panel.module.DGxSyRdA.js";
-const { subElementClassPrefix: i } = r("panel"), n = `${i}body`, p = ({
+import { Box as p } from "../../Box/Box.es.js";
+import { s as i } from "../../../chunks/panel.module.DJLJpnm_.js";
+const { subElementClassPrefix: n } = l("panel"), c = `${n}body`, f = ({
   children: s,
   className: o,
+  backgroundColor: m,
   ...a
 }) => {
-  const e = t(l[n], o);
-  return /* @__PURE__ */ m("div", { className: e, ...a, children: s });
+  const r = e(i[c], o);
+  return /* @__PURE__ */ t(p, { className: r, backgroundColor: m, ...a, children: s });
 };
-p.displayName = "Panel.Body";
+f.displayName = "Panel.Body";
 export {
-  p as Body
+  f as Body
 };

package/lib/wip/Panel/Panel.Divider.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),t=require("../../Divider/Divider.cjs.js"),n=require("./Panel.helpers.cjs.js"),l=({position:e,className:i,dividerColor:r=n.DEFAULT_PANEL_DIVIDER_COLOR})=>o.jsx(t.Divider,{borderColor:r,orientation:e==="bottom"?"horizontal":"vertical",className:i});exports.InlineDivider=l;

package/lib/wip/Panel/Panel.Divider.d.ts

@@ -0,0 +1,6 @@
+import { PanelDividerColor, PanelPosition } from './Panel.types';
+export declare const InlineDivider: ({ position, className, dividerColor, }: {
+    position?: PanelPosition;
+    className?: string;
+    dividerColor?: PanelDividerColor;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/wip/Panel/Panel.Divider.es.js

@@ -0,0 +1,18 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Divider as e } from "../../Divider/Divider.es.js";
+import { DEFAULT_PANEL_DIVIDER_COLOR as m } from "./Panel.helpers.es.js";
+const p = ({
+  position: o,
+  className: r,
+  dividerColor: i = m
+}) => /* @__PURE__ */ t(
+  e,
+  {
+    borderColor: i,
+    orientation: o === "bottom" ? "horizontal" : "vertical",
+    className: r
+  }
+);
+export {
+  p as InlineDivider
+};

package/lib/wip/Panel/Panel.Footer.Actions.cjs.js

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

package/lib/wip/Panel/Panel.Footer.Actions.es.js

@@ -2,7 +2,7 @@ import { jsx as n } from "react/jsx-runtime";
 import i from "clsx";
 import { g as c } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { s as o } from "../../../chunks/panel.module.DGxSyRdA.js";
+import { s as o } from "../../../chunks/panel.module.DJLJpnm_.js";
 const { subElementClassPrefix: l } = c("panel"), p = ({
   layout: t = "end",
   children: a,

package/lib/wip/Panel/Panel.Footer.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("clsx"),a=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const c=require("../../Divider/Divider.cjs.js"),u=require("./Panel.Footer.Actions.cjs.js"),m=require("../../../chunks/panel.module.a_gaicKX.js"),{subElementClassPrefix:d}=a.getBEMClassNames("panel"),_=`${d}footer`,s=({children:r,className:o,divider:t=!0,...i})=>{const n=l(m.styles[_],o);return e.jsxs(e.Fragment,{children:[t&&e.jsx(c.Divider,{borderColor:"01"}),e.jsx("footer",{className:n,...i,children:r})]})};s.displayName="Panel.Footer";s.Actions=u.Actions;exports.Footer=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("clsx"),u=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const _=require("../../Divider/Divider.cjs.js"),m=require("../../Box/Box.cjs.js"),b=require("./Panel.helpers.cjs.js"),d=require("./Panel.Footer.Actions.cjs.js"),q=require("../../../chunks/panel.module.DCpj0tSX.js"),{subElementClassPrefix:x}=u.getBEMClassNames("panel"),P=`${x}footer`,s=({children:r,className:o,divider:t=!0,dividerColor:i=b.DEFAULT_PANEL_DIVIDER_COLOR,backgroundColor:n,...l})=>{const a=c(q.styles[P],o);return e.jsxs(e.Fragment,{children:[t&&e.jsx(_.Divider,{borderColor:i}),e.jsx(m.Box,{as:"footer",className:a,backgroundColor:n,...l,children:r})]})};s.displayName="Panel.Footer";s.Actions=d.Actions;exports.Footer=s;

package/lib/wip/Panel/Panel.Footer.d.ts

@@ -1,4 +1,6 @@
 import { default as React, ComponentPropsWithoutRef } from 'react';
+import { BoxBackgroundColor } from '@viasat/beam-shared/components/box';
+import { PanelDividerColor } from './Panel.types';
 export interface PanelFooterProps extends ComponentPropsWithoutRef<'footer'> {
     /**
      * Specify the content for the Panel footer
@@ -9,9 +11,18 @@ export interface PanelFooterProps extends ComponentPropsWithoutRef<'footer'> {
      * @default true
      */
     divider?: boolean;
+    /**
+     * Specify the border color of the footer divider
+     * @default '01'
+     */
+    dividerColor?: PanelDividerColor;
+    /**
+     * Specify the background color of the footer surface
+     */
+    backgroundColor?: BoxBackgroundColor;
 }
 export declare const Footer: {
-    ({ children, className: _className, divider, ...props }: PanelFooterProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, className: _className, divider, dividerColor, backgroundColor, ...props }: PanelFooterProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
     Actions: {
         ({ layout, children, className: _className, ...props }: import('./Panel.Footer.Actions').PanelFooterActionsProps): import("react/jsx-runtime").JSX.Element;