@arc-ui/components 11.6.0 → 11.7.0

package/dist/_shared/cjs/index-699086a7.d.ts

@@ -1,2 +1,2 @@
-export { Item } from "./SiteHeader.rehydrator-f7fa2efe";
+export { Item } from "./SiteHeader.rehydrator-ccbebde6";
 export {};

package/dist/_shared/cjs/index-74488a9f.d.ts

@@ -1,2 +1,2 @@
 export { SubNavItem } from "./SubNavItem-a84d1bf4";
-export { default as SubNavItemRehydrator } from "./SiteHeader.rehydrator-f7fa2efe";
+export { default as SubNavItemRehydrator } from "./SiteHeader.rehydrator-ccbebde6";

package/dist/_shared/cjs/index-c81c9401.d.ts

@@ -1,4 +1,4 @@
-export * from "./FormControl-9aaddd54";
-export * from "./Card-804ab0e5";
+export * from "./FormControl-78b007b7";
+export * from "./Card-f1108bfe";
 export * from "./index.es-77def0c9";
-export * from "./TextInput-33314fc4";
+export * from "./TextInput-b768e346";

package/dist/_shared/cjs/index-e340924e.d.ts

@@ -1,2 +1,2 @@
 export { ItemGroup } from "./ItemGroup-5af4d600";
-export { default as ItemGroupRehydrator } from "./SiteHeader.rehydrator-f7fa2efe";
+export { default as ItemGroupRehydrator } from "./SiteHeader.rehydrator-ccbebde6";

package/dist/_shared/cjs/index-e6d20018.d.ts

@@ -1,3 +1,3 @@
 export { NavItem } from "./NavItem-df20237c";
-export { default as NavItemRehydrator, default as NavItemWithSubNavRehydrator } from "./SiteHeader.rehydrator-f7fa2efe";
+export { default as NavItemRehydrator, default as NavItemWithSubNavRehydrator } from "./SiteHeader.rehydrator-ccbebde6";
 export { NavItemWithSubNav } from "./NavItemWithSubNav-65f21828";

package/dist/_shared/cjs/index-eb06f640.d.ts

@@ -1,2 +1,2 @@
-export { Panel } from "./SiteHeader.rehydrator-f7fa2efe";
+export { Panel } from "./SiteHeader.rehydrator-ccbebde6";
 export {};

package/dist/_shared/cjs/index-f419cf04.d.ts

@@ -1,2 +1,2 @@
-export { Column } from "./SiteHeader.rehydrator-f7fa2efe";
+export { Column } from "./SiteHeader.rehydrator-ccbebde6";
 export {};

package/dist/_shared/cjs/index.module-5ea728f4.js

@@ -0,0 +1,23 @@
+'use strict';
+
+var React = require('react');
+
+function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value) {
+    const ref = React.useRef({
+        value: value,
+        previous: value
+    }); // We compare values before making an update to ensure that
+    // a change has been made. This ensures the previous value is
+    // persisted correctly between renders.
+    return React.useMemo(()=>{
+        if (ref.current.value !== value) {
+            ref.current.previous = ref.current.value;
+            ref.current.value = value;
+        }
+        return ref.current.previous;
+    }, [
+        value
+    ]);
+}
+
+exports.$010c2913dbd2fe3d$export$5cae361ad82dce8b = $010c2913dbd2fe3d$export$5cae361ad82dce8b;

package/dist/_shared/cjs/{index.module-af7c85f2.js → index.module-9b87a34d.js}

@@ -28,6 +28,29 @@ function $e42e1063c40fb3ef$export$b9ecd428b558ff10(originalEventHandler, ourEven
     };
 }
 
+/**
+ * Set a given ref to a given value
+ * This utility takes care of different types of refs: callback refs and RefObject(s)
+ */ function $6ed0406888f73fc4$var$setRef(ref, value) {
+    if (typeof ref === 'function') ref(value);
+    else if (ref !== null && ref !== undefined) ref.current = value;
+}
+/**
+ * A utility to compose multiple refs together
+ * Accepts callback refs and RefObject(s)
+ */ function $6ed0406888f73fc4$export$43e446d32b3d21af(...refs) {
+    return (node)=>refs.forEach((ref)=>$6ed0406888f73fc4$var$setRef(ref, node)
+        )
+    ;
+}
+/**
+ * A custom hook that composes multiple refs
+ * Accepts callback refs and RefObject(s)
+ */ function $6ed0406888f73fc4$export$c7b2cbe3552a0d05(...refs) {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return React.useCallback($6ed0406888f73fc4$export$43e446d32b3d21af(...refs), refs);
+}
+
 /* -------------------------------------------------------------------------------------------------
  * createContextScope
  * -----------------------------------------------------------------------------------------------*/ function $c512c27ab02ef895$export$50c7b4e9d9f19c1(scopeName, createContextScopeDeps = []) {
@@ -126,26 +149,69 @@ function $e42e1063c40fb3ef$export$b9ecd428b558ff10(originalEventHandler, ourEven
 }
 
 /**
- * Set a given ref to a given value
- * This utility takes care of different types of refs: callback refs and RefObject(s)
- */ function $6ed0406888f73fc4$var$setRef(ref, value) {
-    if (typeof ref === 'function') ref(value);
-    else if (ref !== null && ref !== undefined) ref.current = value;
-}
+ * On the server, React emits a warning when calling `useLayoutEffect`.
+ * This is because neither `useLayoutEffect` nor `useEffect` run on the server.
+ * We use this safe version which suppresses the warning by replacing it with a noop on the server.
+ *
+ * See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
+ */ const $9f79659886946c16$export$e5c5a5f917a5871c = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) ? React.useLayoutEffect : ()=>{};
+
 /**
- * A utility to compose multiple refs together
- * Accepts callback refs and RefObject(s)
- */ function $6ed0406888f73fc4$export$43e446d32b3d21af(...refs) {
-    return (node)=>refs.forEach((ref)=>$6ed0406888f73fc4$var$setRef(ref, node)
-        )
-    ;
+ * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a
+ * prop or avoid re-executing effects when passed as a dependency
+ */ function $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(callback) {
+    const callbackRef = React.useRef(callback);
+    React.useEffect(()=>{
+        callbackRef.current = callback;
+    }); // https://github.com/facebook/react/issues/19240
+    return React.useMemo(()=>(...args)=>{
+            var _callbackRef$current;
+            return (_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 ? void 0 : _callbackRef$current.call(callbackRef, ...args);
+        }
+    , []);
 }
-/**
- * A custom hook that composes multiple refs
- * Accepts callback refs and RefObject(s)
- */ function $6ed0406888f73fc4$export$c7b2cbe3552a0d05(...refs) {
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    return React.useCallback($6ed0406888f73fc4$export$43e446d32b3d21af(...refs), refs);
+
+function $71cd76cc60e0454e$export$6f32135080cb4c3({ prop: prop , defaultProp: defaultProp , onChange: onChange = ()=>{}  }) {
+    const [uncontrolledProp, setUncontrolledProp] = $71cd76cc60e0454e$var$useUncontrolledState({
+        defaultProp: defaultProp,
+        onChange: onChange
+    });
+    const isControlled = prop !== undefined;
+    const value1 = isControlled ? prop : uncontrolledProp;
+    const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
+    const setValue = React.useCallback((nextValue)=>{
+        if (isControlled) {
+            const setter = nextValue;
+            const value = typeof nextValue === 'function' ? setter(prop) : nextValue;
+            if (value !== prop) handleChange(value);
+        } else setUncontrolledProp(nextValue);
+    }, [
+        isControlled,
+        prop,
+        setUncontrolledProp,
+        handleChange
+    ]);
+    return [
+        value1,
+        setValue
+    ];
+}
+function $71cd76cc60e0454e$var$useUncontrolledState({ defaultProp: defaultProp , onChange: onChange  }) {
+    const uncontrolledState = React.useState(defaultProp);
+    const [value] = uncontrolledState;
+    const prevValueRef = React.useRef(value);
+    const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
+    React.useEffect(()=>{
+        if (prevValueRef.current !== value) {
+            handleChange(value);
+            prevValueRef.current = value;
+        }
+    }, [
+        value,
+        prevValueRef,
+        handleChange
+    ]);
+    return uncontrolledState;
 }
 
 /* -------------------------------------------------------------------------------------------------
@@ -303,91 +369,6 @@ const $8927f6f2acc4f386$var$NODES = [
     );
 }
 
-/**
- * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a
- * prop or avoid re-executing effects when passed as a dependency
- */ function $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(callback) {
-    const callbackRef = React.useRef(callback);
-    React.useEffect(()=>{
-        callbackRef.current = callback;
-    }); // https://github.com/facebook/react/issues/19240
-    return React.useMemo(()=>(...args)=>{
-            var _callbackRef$current;
-            return (_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 ? void 0 : _callbackRef$current.call(callbackRef, ...args);
-        }
-    , []);
-}
-
-/**
- * On the server, React emits a warning when calling `useLayoutEffect`.
- * This is because neither `useLayoutEffect` nor `useEffect` run on the server.
- * We use this safe version which suppresses the warning by replacing it with a noop on the server.
- *
- * See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
- */ const $9f79659886946c16$export$e5c5a5f917a5871c = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) ? React.useLayoutEffect : ()=>{};
-
-function $71cd76cc60e0454e$export$6f32135080cb4c3({ prop: prop , defaultProp: defaultProp , onChange: onChange = ()=>{}  }) {
-    const [uncontrolledProp, setUncontrolledProp] = $71cd76cc60e0454e$var$useUncontrolledState({
-        defaultProp: defaultProp,
-        onChange: onChange
-    });
-    const isControlled = prop !== undefined;
-    const value1 = isControlled ? prop : uncontrolledProp;
-    const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
-    const setValue = React.useCallback((nextValue)=>{
-        if (isControlled) {
-            const setter = nextValue;
-            const value = typeof nextValue === 'function' ? setter(prop) : nextValue;
-            if (value !== prop) handleChange(value);
-        } else setUncontrolledProp(nextValue);
-    }, [
-        isControlled,
-        prop,
-        setUncontrolledProp,
-        handleChange
-    ]);
-    return [
-        value1,
-        setValue
-    ];
-}
-function $71cd76cc60e0454e$var$useUncontrolledState({ defaultProp: defaultProp , onChange: onChange  }) {
-    const uncontrolledState = React.useState(defaultProp);
-    const [value] = uncontrolledState;
-    const prevValueRef = React.useRef(value);
-    const handleChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onChange);
-    React.useEffect(()=>{
-        if (prevValueRef.current !== value) {
-            handleChange(value);
-            prevValueRef.current = value;
-        }
-    }, [
-        value,
-        prevValueRef,
-        handleChange
-    ]);
-    return uncontrolledState;
-}
-
-function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value) {
-    const ref = React.useRef({
-        value: value,
-        previous: value
-    }); // We compare values before making an update to ensure that
-    // a change has been made. This ensures the previous value is
-    // persisted correctly between renders.
-    return React.useMemo(()=>{
-        if (ref.current.value !== value) {
-            ref.current.previous = ref.current.value;
-            ref.current.value = value;
-        }
-        return ref.current.previous;
-    }, [
-        value
-    ]);
-}
-
-exports.$010c2913dbd2fe3d$export$5cae361ad82dce8b = $010c2913dbd2fe3d$export$5cae361ad82dce8b;
 exports.$5e63c961fc1ce211$export$8c6ed5c666ac1360 = $5e63c961fc1ce211$export$8c6ed5c666ac1360;
 exports.$6ed0406888f73fc4$export$c7b2cbe3552a0d05 = $6ed0406888f73fc4$export$c7b2cbe3552a0d05;
 exports.$71cd76cc60e0454e$export$6f32135080cb4c3 = $71cd76cc60e0454e$export$6f32135080cb4c3;

package/dist/_shared/esm/Box-06d99d8a.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+import React from "react";
+import { FC } from "react";
+import { SurfaceBackgroundColor, SurfacePadding } from "./Surface-dde51789";
+/**
+ * Use `Box` as a simple way to group bespoke content and interactive elements together.
+ */
+declare const Box: FC<BoxProps>;
+interface BoxProps {
+    /**
+     * Contents of the Box.
+     */
+    children: React.ReactNode;
+    /**
+     * Set Box to fill parent element.
+     */
+    isFullHeight?: boolean;
+    /**
+     * Add rounded corners to the box.
+     */
+    isBorderRadius?: boolean;
+    /**
+     * The border width of the box.
+     */
+    borderWidth?: "thin" | "medium";
+    /**
+     * Box shadow for the box.
+     */
+    elevationLevel?: "1" | "2";
+    /**
+     * Padding for the box.
+     */
+    padding?: SurfacePadding;
+    /**
+     * Background color for the box.
+     */
+    surface?: SurfaceBackgroundColor;
+}
+export { Box, BoxProps };

package/dist/_shared/esm/Box-06d99d8a.js

@@ -0,0 +1,24 @@
+import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
+import React__default from 'react';
+import { c as classNames } from './index-2ae58626.js';
+import { S as Surface } from './Surface-dde51789.js';
+
+// Do equal height boxes story
+/**
+ * Use `Box` as a simple way to group bespoke content and interactive elements together.
+ */
+var Box = function (_a) {
+    var _b;
+    var children = _a.children, borderWidth = _a.borderWidth, elevationLevel = _a.elevationLevel, padding = _a.padding, _c = _a.isFullHeight, isFullHeight = _c === void 0 ? false : _c, _d = _a.isBorderRadius, isBorderRadius = _d === void 0 ? false : _d, _e = _a.surface, surface = _e === void 0 ? "white" : _e, props = __rest(_a, ["children", "borderWidth", "elevationLevel", "padding", "isFullHeight", "isBorderRadius", "surface"]);
+    return (React__default.createElement("div", __assign({ className: classNames("arc-Box", (_b = {},
+            _b["arc-Box--fullHeight"] = isFullHeight,
+            _b["arc-Box--borderRadius"] = isBorderRadius,
+            _b["arc-Box--borderThin"] = borderWidth === "thin",
+            _b["arc-Box--borderMedium"] = borderWidth === "medium",
+            _b["arc-Box--elevation1"] = elevationLevel === "1",
+            _b["arc-Box--elevation2"] = elevationLevel === "2",
+            _b)) }, filterDataAttrs(props)),
+        React__default.createElement(Surface, { padding: padding, background: surface }, children)));
+};
+
+export { Box as B };

package/dist/_shared/esm/{BrandLogo-56699561.js → BrandLogo-9ec620e8.js}

@@ -2,7 +2,7 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useContext } from 'react';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `BrandLogo` to display the brand logo.

package/dist/_shared/esm/{Breadcrumbs-04590057.js → Breadcrumbs-5dc0afa7.js}

@@ -1,7 +1,7 @@
 import React__default, { useRef, useState, useEffect } from 'react';
 import { d as debounce_1 } from './debounce-e228705f.js';
 import { B as BtIconChevronLeft2Px_2, a as BtIconChevronRight2Px_2 } from './BtIconChevronRight2Px-b8e7b4ad.js';
-import { I as Icon } from './Icon-fd247973.js';
+import { I as Icon } from './Icon-c1af47bc.js';
 import { a as __assign } from './filter-data-attrs-afdb7d32.js';
 import { c as classNames } from './index-2ae58626.js';
 import { h as handleLinkClick } from './handle-link-click-f64f55a2.js';

package/dist/_shared/esm/{Button-d319fa11.js → Button-9c3b0b11.js}

@@ -4,8 +4,8 @@ import { B as BtIconChevronRightMid_2 } from './BtIconChevronRightMid-d9b11761.j
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { forwardRef, useContext } from 'react';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { I as Icon } from './Icon-fd247973.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { I as Icon } from './Icon-c1af47bc.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `Button` to allow users to take actions with clicks and taps.

package/dist/_shared/esm/{Card-e79eb6c8.js → Card-79b6eae0.js}

@@ -2,11 +2,11 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useState, useEffect, useContext } from 'react';
 import { B as BtIconChevronRightMid_2 } from './BtIconChevronRightMid-d9b11761.js';
-import { I as Icon } from './Icon-fd247973.js';
-import { I as Image } from './Image-3596ce55.js';
-import { H as Heading } from './Heading-b61432fb.js';
+import { I as Icon } from './Icon-c1af47bc.js';
+import { I as Image } from './Image-3ed3863c.js';
+import { H as Heading } from './Heading-ee6bec51.js';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { C as Context, S as Surface } from './Surface-bb100ef8.js';
+import { C as Context, S as Surface } from './Surface-dde51789.js';
 import { h as handleLinkClick } from './handle-link-click-f64f55a2.js';
 
 /**

package/dist/_shared/esm/{Checkbox-94300d8c.js → Checkbox-2d144384.js}

@@ -3,8 +3,8 @@ import React__default, { forwardRef, useContext } from 'react';
 import { B as BtIconTickAlt2Px_2 } from './BtIconTickAlt2Px-da97e9ae.js';
 import { B as BtIconAlert_2 } from './BtIconAlert-55a6ed5c.js';
 import { c as classNames } from './index-2ae58626.js';
-import { C as Context, u as useAriaDescribedby } from './FormControl-5e3fdca3.js';
-import { C as Context$1 } from './Surface-bb100ef8.js';
+import { C as Context, u as useAriaDescribedby } from './FormControl-2fa7aae5.js';
+import { C as Context$1 } from './Surface-dde51789.js';
 
 /**
  *  Use `Checkbox` to allow users to select individual options.

package/dist/_shared/esm/{DisclosureMini-022beae3.js → DisclosureMini-78a8f392.js}

@@ -2,8 +2,8 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useContext, useState } from 'react';
 import { B as BtIconChevronDown2Px_2 } from './BtIconChevronDown2Px-782876e2.js';
-import { T as Text } from './Text-00e9743b.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { T as Text } from './Text-14deb70e.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `DisclosureMini` to display content that is only visible when toggled into

package/dist/_shared/esm/{Filter-41b391e3.js → Filter-a01aed11.js}

@@ -1,6 +1,6 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs, b as __spreadArray } from './filter-data-attrs-afdb7d32.js';
 import React__default, { useContext, useState, useEffect } from 'react';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 import { c as classNames } from './index-2ae58626.js';
 
 var FilterControl = function (_a) {

package/dist/_shared/esm/{FormControl-5e3fdca3.js → FormControl-2fa7aae5.js}

@@ -2,8 +2,8 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { createContext, useContext } from 'react';
 import { B as BtIconAlert_2 } from './BtIconAlert-55a6ed5c.js';
-import { C as Context$1 } from './Surface-bb100ef8.js';
-import { D as DisclosureMini } from './DisclosureMini-022beae3.js';
+import { C as Context$1 } from './Surface-dde51789.js';
+import { D as DisclosureMini } from './DisclosureMini-78a8f392.js';
 
 /**
  * Optionally define ariaDescribedBy if errorMessage or helper exist.

package/dist/_shared/esm/{Group-d62c3f56.js → Group-fb26fd32.js}

@@ -1,7 +1,7 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useContext, useEffect } from 'react';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `Group` to arrange flexible items in a row.

package/dist/_shared/esm/{Heading-b61432fb.js → Heading-ee6bec51.js}

@@ -2,7 +2,7 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useContext } from 'react';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `Heading` to display heading text.

package/dist/_shared/esm/{Icon-fd247973.js → Icon-c1af47bc.js}

@@ -2,7 +2,7 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import React__default, { useContext } from 'react';
 import { c as classNames } from './index-2ae58626.js';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 const React = React__default;
 const ArcIconArc = props =>

package/dist/_shared/esm/{Image-3596ce55.js → Image-3ed3863c.js}

@@ -35,5 +35,6 @@ var ImageSource = function (_a) {
 };
 ImageSource.displayName = "Image.Source";
 Image.Source = ImageSource;
+var loadingOptions = ["eager", "lazy"];
 
-export { Image as I };
+export { Image as I, loadingOptions as l };

package/dist/_shared/esm/{Poster-107d6954.d.ts → Poster-a83ae770.d.ts}

@@ -1,7 +1,7 @@
 import React from "react";
 import { FC, ReactNode } from "react";
 import { anchorPoints } from "./index-9483ad5f";
-import { loadingOptions } from "./Image-3596ce55";
+import { loadingOptions } from "./Image-3ed3863c";
 declare const PosterVideo: FC<PosterVideoProps>;
 interface PosterVideoProps {
     /**

package/dist/_shared/esm/{Poster-107d6954.js → Poster-a83ae770.js}

@@ -1,8 +1,8 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
 import { c as classNames } from './index-2ae58626.js';
 import React__default from 'react';
-import { S as Surface } from './Surface-bb100ef8.js';
-import { I as Image } from './Image-3596ce55.js';
+import { S as Surface } from './Surface-dde51789.js';
+import { I as Image } from './Image-3ed3863c.js';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
 
 var PosterImage = function (_a) {

package/dist/_shared/{cjs/RadioGroup-81805ef9.d.ts → esm/RadioGroup-65b8c8bf.d.ts}

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from "react";
 import { FC } from "react";
-import { FormControlProps } from "./FormControl-9aaddd54";
+import { FormControlProps } from "./FormControl-2fa7aae5";
 /**
  * Radio Button component.
  */

package/dist/_shared/esm/{RadioGroup-1fd0f389.js → RadioGroup-65b8c8bf.js}

@@ -1,8 +1,8 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
 import React__default, { createContext, useContext, forwardRef, useEffect } from 'react';
-import { F as FormControl } from './FormControl-5e3fdca3.js';
+import { F as FormControl } from './FormControl-2fa7aae5.js';
 import { c as classNames } from './index-2ae58626.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 var RadioContext = createContext({});
 var Provider = RadioContext.Provider;

package/dist/_shared/esm/{SiteFooter-8075a9bd.js → SiteFooter-51bdc7df.js}

@@ -2,10 +2,10 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { u as useMediaQuery, A as ArcBreakpointM } from './index.es-00cb3bcb.js';
 import { B as BtIconChevronDown2Px_2 } from './BtIconChevronDown2Px-782876e2.js';
 import React__default, { useEffect, Fragment } from 'react';
-import { B as BrandLogo } from './BrandLogo-56699561.js';
+import { B as BrandLogo } from './BrandLogo-9ec620e8.js';
 import { C as Curve } from './Curve-3e87b1bc.js';
 import { S as Section } from './Section-b8038d66.js';
-import { S as Surface } from './Surface-bb100ef8.js';
+import { S as Surface } from './Surface-dde51789.js';
 import { h as handleLinkClick } from './handle-link-click-f64f55a2.js';
 
 /**

package/dist/_shared/esm/SiteHeader-c25ee36e.d.ts

@@ -1,12 +1,12 @@
 /// <reference types="react" />
 import React from "react";
 import { FC, ReactNode } from "react";
-import { subBrands } from "./BrandLogo-56699561";
+import { subBrands } from "./BrandLogo-9ec620e8";
 import { Column } from "./index-f419cf04";
 import { Item } from "./index-699086a7";
 import { ItemGroup } from "./index-e340924e";
 import { NavItem, NavItemWithSubNav } from "./index-e6d20018";
-import { NodeItem } from "./SiteHeader.rehydrator-4da8ac64";
+import { NodeItem } from "./SiteHeader.rehydrator-382d1c03";
 import { SubNavItem } from "./index-74488a9f";
 declare const Context: React.Context<{
     transparent: boolean;
@@ -74,5 +74,5 @@ interface SiteHeaderProps {
      */
     subBrand?: typeof subBrands[number];
 }
-export { MenuButton } from "./SiteHeader.rehydrator-4da8ac64";
+export { MenuButton } from "./SiteHeader.rehydrator-382d1c03";
 export { SiteHeader, SiteHeaderProps, Context as SiteHeaderContext };

package/dist/_shared/esm/{SiteHeader.rehydrator-4da8ac64.js → SiteHeader.rehydrator-382d1c03.js}

@@ -5,11 +5,11 @@ import { u as useMediaQuery, a as ArcBreakpointL } from './index.es-00cb3bcb.js'
 import { B as BtIconChevronDown2Px_2 } from './BtIconChevronDown2Px-782876e2.js';
 import { h as handleLinkClick } from './handle-link-click-f64f55a2.js';
 import { a as BtIconChevronRight2Px_2, B as BtIconChevronLeft2Px_2 } from './BtIconChevronRight2Px-b8e7b4ad.js';
-import { S as Surface } from './Surface-bb100ef8.js';
-import { B as BrandLogo } from './BrandLogo-56699561.js';
-import { B as Button } from './Button-d319fa11.js';
+import { S as Surface } from './Surface-dde51789.js';
+import { B as BrandLogo } from './BrandLogo-9ec620e8.js';
+import { B as Button } from './Button-9c3b0b11.js';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { T as Text } from './Text-00e9743b.js';
+import { T as Text } from './Text-14deb70e.js';
 
 var Item = function (_a) {
     var _b;

package/dist/_shared/esm/{Surface-bb100ef8.d.ts → Surface-dde51789.d.ts}

@@ -12,12 +12,13 @@ declare const Surface: FC<SurfaceProps>;
 declare const backgrounds: readonly ["black", "brand", "brand-flat", "dark", "darker", "coral", "turquoise", "light", "lighter", "white"];
 declare const backgroundsBT: readonly ["black", "brand", "brand-flat", "dark", "darker", "coral", "turquoise", "light", "lighter", "white"];
 type SurfacePadding = "8" | "12" | "16" | "24" | "32" | "48" | "64";
+type SurfaceBackgroundColor = "black" | "brand" | "brand-flat" | "dark" | "darker" | "coral" | "turquoise" | "light" | "lighter" | "white";
 interface SurfaceProps extends HTMLAttributes<HTMLElement> {
     /**
      * Background colour of the Surface. Contents will change colour to meet
      * accessibility requirements.
      */
-    background?: typeof backgrounds[number];
+    background?: SurfaceBackgroundColor;
     /**
      * Content to display on the Surface.
      */
@@ -47,4 +48,4 @@ interface SurfaceProps extends HTMLAttributes<HTMLElement> {
      */
     paddingVertical?: SurfacePadding;
 }
-export { Surface, backgrounds, backgroundsBT, SurfacePadding, SurfaceProps, Context as SurfaceContext };
+export { Surface, backgrounds, backgroundsBT, SurfacePadding, SurfaceBackgroundColor, SurfaceProps, Context as SurfaceContext };

package/dist/_shared/esm/{Surface-bb100ef8.js → Surface-dde51789.js}

@@ -20,7 +20,7 @@ var Surface = function (_a) {
         surface = "dark";
     }
     return (React__default.createElement(Provider, { value: { surface: surface } },
-        React__default.createElement("div", __assign({ className: classNames((_b = {
+        React__default.createElement("div", __assign({ "data-testid": "arc-surface", className: classNames((_b = {
                     "arc-Surface": true
                 },
                 _b["arc-Surface--".concat(background &&

package/dist/_shared/esm/{Text-00e9743b.js → Text-14deb70e.js}

@@ -2,7 +2,7 @@ import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { useContext } from 'react';
 import { s as suffixModifier } from './suffix-modifier-7e640670.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { C as Context } from './Surface-dde51789.js';
 
 /**
  * Use `Text` to display text.

package/dist/_shared/esm/{TextInput-1631dbc4.js → TextInput-62bb7dee.js}

@@ -1,8 +1,8 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
 import { c as classNames } from './index-2ae58626.js';
 import React__default, { forwardRef, useContext, useState } from 'react';
-import { u as useAriaDescribedby, F as FormControl } from './FormControl-5e3fdca3.js';
-import { C as Context } from './Surface-bb100ef8.js';
+import { u as useAriaDescribedby, F as FormControl } from './FormControl-2fa7aae5.js';
+import { C as Context } from './Surface-dde51789.js';
 import { V as VisuallyHidden } from './VisuallyHidden-b9eebf71.js';
 
 /**