@arc-ui/components 10.8.1 → 11.1.0

package/dist/Checkbox/Checkbox.cjs.js

@@ -3,22 +3,45 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var index = require('../_shared/cjs/index-78b35bc1.js');
-var React = require('react');
+var React$1 = require('react');
+var FormControl = require('../_shared/cjs/FormControl-e6b7d7c5.js');
 var index$1 = require('../_shared/cjs/index-45bfb67b.js');
-var FormControl = require('../_shared/cjs/FormControl-7d8e10fa.js');
 var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+require('../_shared/cjs/Text-1d3844be.js');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+
+const React = React__default["default"];
+const BtIconTickVariant = props =>
+  /*#__PURE__*/ React.createElement(
+    "svg",
+    Object.assign(
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 32 32"
+      },
+      props
+    ),
+    /*#__PURE__*/ React.createElement("defs", null),
+    /*#__PURE__*/ React.createElement("path", {
+      d:
+        "M13.5,21.207,9.14648,16.85352a.5.5,0,0,1,.707-.707L13.5,19.793l8.64648-8.64649a.5.5,0,0,1,.707.707Z",
+      fill: "currentColor"
+    })
+  );
+var BtIconTickVariant_2 = BtIconTickVariant;
 
 /**
  *  Use `Checkbox` to allow users to select individual options.
  */
-var Checkbox = React.forwardRef(function (_a, ref) {
+var Checkbox = React$1.forwardRef(function (_a, ref) {
     var _b = _a.checked, checked = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, label = _a.label, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _e = _a.size, size = _e === void 0 ? "l" : _e, value = _a.value, props = index.__rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value"]);
-    var requirementStatus = React.useContext(FormControl.Context).requirementStatus;
-    var surface = React.useContext(Surface.Context).surface;
+    var requirementStatus = React$1.useContext(FormControl.Context).requirementStatus;
+    var surface = React$1.useContext(Surface.Context).surface;
     var _f = FormControl.useAriaDescribedby({
         id: id,
         errorMessage: errorMessage
@@ -43,12 +66,16 @@ var Checkbox = React.forwardRef(function (_a, ref) {
         }) },
         React__default["default"].createElement("label", { id: idLabel, htmlFor: id, className: "arc-Checkbox-label" },
             React__default["default"].createElement("input", index.__assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: ref, required: isRequired, type: "checkbox", value: value }, index.filterDataAttrs(props))),
-            React__default["default"].createElement("span", { className: "arc-Checkbox-box" }),
+            React__default["default"].createElement("span", { className: "arc-Checkbox-box" },
+                React__default["default"].createElement(BtIconTickVariant_2, null)),
             React__default["default"].createElement("span", null,
                 label,
                 !isRequired && requirementStatus !== "optional" ? (React__default["default"].createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
                 helper && React__default["default"].createElement("span", { className: "arc-Checkbox-helper" }, helper))),
-        errorMessage && (React__default["default"].createElement("div", { id: idError, className: "arc-Checkbox-error" }, errorMessage))));
+        errorMessage && (React__default["default"].createElement("div", { id: idError, className: "arc-Checkbox-error" },
+            React__default["default"].createElement("span", { className: "arc-Checkbox-error--icon" },
+                React__default["default"].createElement(FormControl.BtIconAlert_2, null)),
+            errorMessage))));
 });
 
 exports.Checkbox = Checkbox;

package/dist/Checkbox/Checkbox.esm.js

@@ -1,8 +1,31 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
-import React, { forwardRef, useContext } from 'react';
+import React__default, { forwardRef, useContext } from 'react';
+import { C as Context, u as useAriaDescribedby, B as BtIconAlert_2 } from '../_shared/esm/FormControl-84c9ace6.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import { C as Context, u as useAriaDescribedby } from '../_shared/esm/FormControl-33194106.js';
-import { C as Context$1 } from '../_shared/esm/Surface-d515d212.js';
+import { C as Context$1 } from '../_shared/esm/Surface-bf201530.js';
+import '../_shared/esm/Text-6b958ad8.js';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/BtIconChevronRightMid-d9b11761.js';
+
+const React = React__default;
+const BtIconTickVariant = props =>
+  /*#__PURE__*/ React.createElement(
+    "svg",
+    Object.assign(
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 32 32"
+      },
+      props
+    ),
+    /*#__PURE__*/ React.createElement("defs", null),
+    /*#__PURE__*/ React.createElement("path", {
+      d:
+        "M13.5,21.207,9.14648,16.85352a.5.5,0,0,1,.707-.707L13.5,19.793l8.64648-8.64649a.5.5,0,0,1,.707.707Z",
+      fill: "currentColor"
+    })
+  );
+var BtIconTickVariant_2 = BtIconTickVariant;
 
 /**
  *  Use `Checkbox` to allow users to select individual options.
@@ -26,21 +49,25 @@ var Checkbox = forwardRef(function (_a, ref) {
     if (requirementStatus === "required") {
         isRequired = true;
     }
-    return (React.createElement("div", { className: classNames({
+    return (React__default.createElement("div", { className: classNames({
             "arc-Checkbox": true,
             "arc-Checkbox--disabled": isDisabled,
             "arc-Checkbox--invalid": errorMessage,
             "arc-Checkbox--small": size === "s",
             "arc-Checkbox--onDarkSurface": surface === "dark"
         }) },
-        React.createElement("label", { id: idLabel, htmlFor: id, className: "arc-Checkbox-label" },
-            React.createElement("input", __assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: ref, required: isRequired, type: "checkbox", value: value }, filterDataAttrs(props))),
-            React.createElement("span", { className: "arc-Checkbox-box" }),
-            React.createElement("span", null,
+        React__default.createElement("label", { id: idLabel, htmlFor: id, className: "arc-Checkbox-label" },
+            React__default.createElement("input", __assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: ref, required: isRequired, type: "checkbox", value: value }, filterDataAttrs(props))),
+            React__default.createElement("span", { className: "arc-Checkbox-box" },
+                React__default.createElement(BtIconTickVariant_2, null)),
+            React__default.createElement("span", null,
                 label,
-                !isRequired && requirementStatus !== "optional" ? (React.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
-                helper && React.createElement("span", { className: "arc-Checkbox-helper" }, helper))),
-        errorMessage && (React.createElement("div", { id: idError, className: "arc-Checkbox-error" }, errorMessage))));
+                !isRequired && requirementStatus !== "optional" ? (React__default.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
+                helper && React__default.createElement("span", { className: "arc-Checkbox-helper" }, helper))),
+        errorMessage && (React__default.createElement("div", { id: idError, className: "arc-Checkbox-error" },
+            React__default.createElement("span", { className: "arc-Checkbox-error--icon" },
+                React__default.createElement(BtIconAlert_2, null)),
+            errorMessage))));
 });
 
 export { Checkbox };

package/dist/Clock/Clock.esm.js

@@ -1,5 +1,5 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs, d as __awaiter, e as __generator } from '../_shared/esm/index-229fc864.js';
-import React, { useState, useEffect } from 'react';
+import React__default, { useState, useEffect } from 'react';
 
 /**
  * `Clock` is a demo component that shows the current time.
@@ -18,7 +18,7 @@ var Clock = function (_a) {
         var interval = setInterval(tick, 1000);
         return function () { return clearInterval(interval); };
     }, [locale]);
-    return (React.createElement("time", __assign({ className: "arc-Clock", dateTime: time.toISOString() }, filterDataAttrs(props), { "data-locale": locale }), humanTime));
+    return (React__default.createElement("time", __assign({ className: "arc-Clock", dateTime: time.toISOString() }, filterDataAttrs(props), { "data-locale": locale }), humanTime));
 };
 
 var Clock_rehydrator = (function (el) { return __awaiter(void 0, void 0, void 0, function () {
@@ -27,7 +27,7 @@ var Clock_rehydrator = (function (el) { return __awaiter(void 0, void 0, void 0,
         props = {
             locale: el.dataset.locale
         };
-        return [2 /*return*/, React.createElement(Clock, __assign({}, props))];
+        return [2 /*return*/, React__default.createElement(Clock, __assign({}, props))];
     });
 }); });
 

package/dist/Columns/Columns.esm.js

@@ -1,6 +1,6 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React, { useEffect } from 'react';
+import React__default, { useEffect } from 'react';
 import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js';
 
 /**
@@ -9,22 +9,22 @@ import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js'
 var Columns = function (_a) {
     var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, props = __rest(_a, ["children", "isGutterless"]);
     useEffect(function () {
-        React.Children.map(children, function (item) {
+        React__default.Children.map(children, function (item) {
             if (item && item.type !== Col) {
                 throw new Error("Illegal child passed to <Columns />. Ensure to only use <Columns.Col />.");
             }
         });
     }, [children]);
-    return (React.createElement("div", __assign({ className: classNames({
+    return (React__default.createElement("div", __assign({ className: classNames({
             "arc-Columns": true,
             "arc-Columns--gutterless": isGutterless
         }) }, filterDataAttrs(props)),
-        React.createElement("div", { className: "arc-Columns-inner" }, children)));
+        React__default.createElement("div", { className: "arc-Columns-inner" }, children)));
 };
 var Col = function (_a) {
     var _b;
     var align = _a.align, children = _a.children, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, offset = _a.offset, offsetS = _a.offsetS, offsetM = _a.offsetM, offsetL = _a.offsetL, offsetXL = _a.offsetXL, span = _a.span, spanS = _a.spanS, spanM = _a.spanM, spanL = _a.spanL, spanXL = _a.spanXL, props = __rest(_a, ["align", "children", "isDebugVisible", "offset", "offsetS", "offsetM", "offsetL", "offsetXL", "span", "spanS", "spanM", "spanL", "spanXL"]);
-    return (React.createElement("div", __assign({ className: classNames((_b = {},
+    return (React__default.createElement("div", __assign({ className: classNames((_b = {},
             _b["arc-Columns-col"] = true,
             _b[suffixModifier("arc-Columns-col--align", align || "")] = align,
             _b["arc-Columns-col--".concat(span)] = typeof span !== "undefined",

package/dist/Curve/Curve.esm.d.ts

@@ -1 +1 @@
-export { Curve } from "../_shared/esm/Curve-cfdca379";
+export { Curve } from "../_shared/esm/Curve-50697f7e";

package/dist/Curve/Curve.esm.js

@@ -1,4 +1,4 @@
-export { C as Curve } from '../_shared/esm/Curve-cfdca379.js';
+export { C as Curve } from '../_shared/esm/Curve-50697f7e.js';
 import '../_shared/esm/index-229fc864.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';

package/dist/Disclosure/Disclosure.cjs.js

@@ -6,6 +6,7 @@ var index = require('../_shared/cjs/index-78b35bc1.js');
 var index$1 = require('../_shared/cjs/index-45bfb67b.js');
 var React = require('react');
 var Heading = require('../_shared/cjs/Heading-cc38c3ec.js');
+var BtIconChevronDown2Px = require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
 var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
 require('../_shared/cjs/suffix-modifier-edf7851e.js');
 
@@ -26,6 +27,8 @@ var Disclosure = function (_a) {
             "arc-Disclosure--onDarkSurface": surface === "dark"
         }), open: isOpen }, index.filterDataAttrs(props)),
         React__default["default"].createElement("summary", { className: "arc-Disclosure-summary" },
+            React__default["default"].createElement("span", { className: "arc-Disclosure-summary-icon" },
+                React__default["default"].createElement(BtIconChevronDown2Px.BtIconChevronDown2Px_2, null)),
             React__default["default"].createElement(Heading.Heading, { level: headingLevel, size: "s" }, summary)),
         React__default["default"].createElement("div", { className: "arc-Disclosure-details" }, children)));
 };

package/dist/Disclosure/Disclosure.esm.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from "react";
-import { HeadingLevel } from "../_shared/esm/Heading-183be76c";
+import { HeadingLevel } from "../_shared/esm/Heading-eb1e42db";
 /**
  * Use `Disclosure` to display content that is only visible when toggled into
  * an "open" state.

package/dist/Disclosure/Disclosure.esm.js

@@ -1,8 +1,9 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React, { useContext } from 'react';
-import { H as Heading } from '../_shared/esm/Heading-183be76c.js';
-import { C as Context } from '../_shared/esm/Surface-d515d212.js';
+import React__default, { useContext } from 'react';
+import { H as Heading } from '../_shared/esm/Heading-eb1e42db.js';
+import { B as BtIconChevronDown2Px_2 } from '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
+import { C as Context } from '../_shared/esm/Surface-bf201530.js';
 import '../_shared/esm/suffix-modifier-f5e28822.js';
 
 /**
@@ -12,14 +13,16 @@ import '../_shared/esm/suffix-modifier-f5e28822.js';
 var Disclosure = function (_a) {
     var children = _a.children, headingLevel = _a.headingLevel, _b = _a.indentDetails, indentDetails = _b === void 0 ? false : _b, _c = _a.isOpen, isOpen = _c === void 0 ? false : _c, summary = _a.summary, props = __rest(_a, ["children", "headingLevel", "indentDetails", "isOpen", "summary"]);
     var surface = useContext(Context).surface;
-    return (React.createElement("details", __assign({ className: classNames({
+    return (React__default.createElement("details", __assign({ className: classNames({
             "arc-Disclosure": true,
             "arc-Disclosure--indentDetails": indentDetails,
             "arc-Disclosure--onDarkSurface": surface === "dark"
         }), open: isOpen }, filterDataAttrs(props)),
-        React.createElement("summary", { className: "arc-Disclosure-summary" },
-            React.createElement(Heading, { level: headingLevel, size: "s" }, summary)),
-        React.createElement("div", { className: "arc-Disclosure-details" }, children)));
+        React__default.createElement("summary", { className: "arc-Disclosure-summary" },
+            React__default.createElement("span", { className: "arc-Disclosure-summary-icon" },
+                React__default.createElement(BtIconChevronDown2Px_2, null)),
+            React__default.createElement(Heading, { level: headingLevel, size: "s" }, summary)),
+        React__default.createElement("div", { className: "arc-Disclosure-details" }, children)));
 };
 
 export { Disclosure };

package/dist/Elevation/Elevation.esm.js

@@ -1,6 +1,6 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React from 'react';
+import React__default from 'react';
 
 /**
  * Use `Elevation` to elevate what matters.
@@ -8,7 +8,7 @@ import React from 'react';
 var Elevation = function (_a) {
     var _b;
     var children = _a.children, _c = _a.isFullWidth, isFullWidth = _c === void 0 ? false : _c, props = __rest(_a, ["children", "isFullWidth"]);
-    return (React.createElement("div", __assign({ className: classNames((_b = {},
+    return (React__default.createElement("div", __assign({ className: classNames((_b = {},
             _b["arc-Elevation"] = true,
             _b["arc-Elevation--fullWidth"] = isFullWidth,
             _b)) }, filterDataAttrs(props)), children));

package/dist/FormControl/FormControl.cjs.d.ts

@@ -1 +1 @@
-export { FormControl, FormControlContext } from "../_shared/cjs/FormControl-7d8e10fa";
+export { FormControl, FormControlContext } from "../_shared/cjs/FormControl-e6b7d7c5";

package/dist/FormControl/FormControl.cjs.js

@@ -2,11 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var FormControl = require('../_shared/cjs/FormControl-7d8e10fa.js');
+var FormControl = require('../_shared/cjs/FormControl-e6b7d7c5.js');
 require('../_shared/cjs/index-78b35bc1.js');
 require('../_shared/cjs/index-45bfb67b.js');
 require('react');
 require('../_shared/cjs/Surface-d6b8010e.js');
+require('../_shared/cjs/Text-1d3844be.js');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
 
 
 

package/dist/FormControl/FormControl.esm.d.ts

@@ -1 +1 @@
-export { FormControl, FormControlContext } from "../_shared/esm/FormControl-33194106";
+export { FormControl, FormControlContext } from "../_shared/esm/FormControl-84c9ace6";

package/dist/FormControl/FormControl.esm.js

@@ -1,5 +1,8 @@
-export { F as FormControl, C as FormControlContext } from '../_shared/esm/FormControl-33194106.js';
+export { F as FormControl, C as FormControlContext } from '../_shared/esm/FormControl-84c9ace6.js';
 import '../_shared/esm/index-229fc864.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';
-import '../_shared/esm/Surface-d515d212.js';
+import '../_shared/esm/Surface-bf201530.js';
+import '../_shared/esm/Text-6b958ad8.js';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/BtIconChevronRightMid-d9b11761.js';

package/dist/Group/Group.esm.js

@@ -1,7 +1,7 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React, { useContext, useEffect } from 'react';
-import { C as Context } from '../_shared/esm/Surface-d515d212.js';
+import React__default, { useContext, useEffect } from 'react';
+import { C as Context } from '../_shared/esm/Surface-bf201530.js';
 
 /**
  * Use `Group` to arrange flexible items in a row.
@@ -11,13 +11,13 @@ var Group = function (_a) {
     var children = _a.children, _c = _a.grow, grow = _c === void 0 ? false : _c, _d = _a.growEqual, growEqual = _d === void 0 ? false : _d, _e = _a.gutterBorder, gutterBorder = _e === void 0 ? false : _e, _f = _a.noWrap, noWrap = _f === void 0 ? false : _f, props = __rest(_a, ["children", "grow", "growEqual", "gutterBorder", "noWrap"]);
     var surface = useContext(Context).surface;
     useEffect(function () {
-        React.Children.map(children, function (item) {
+        React__default.Children.map(children, function (item) {
             if (item && item.type !== GroupItem) {
                 throw new Error("Illegal child passed to <Group />. Ensure to only use <Group.Item />.");
             }
         });
     }, [children]);
-    return (React.createElement("div", __assign({ className: classNames((_b = {},
+    return (React__default.createElement("div", __assign({ className: classNames((_b = {},
             _b["arc-Group"] = true,
             _b["arc-Group--grow"] = grow,
             _b["arc-Group--growEqual"] = growEqual,
@@ -25,12 +25,12 @@ var Group = function (_a) {
             _b["arc-Group--noWrap"] = noWrap,
             _b["arc-Group--onDarkSurface"] = surface === "dark",
             _b)) }, filterDataAttrs(props)),
-        React.createElement("div", { className: "arc-Group-inner" }, children)));
+        React__default.createElement("div", { className: "arc-Group-inner" }, children)));
 };
 var GroupItem = function (_a) {
     var _b;
     var children = _a.children, _c = _a.grow, grow = _c === void 0 ? false : _c, _d = _a.isDebugVisible, isDebugVisible = _d === void 0 ? false : _d, props = __rest(_a, ["children", "grow", "isDebugVisible"]);
-    return (React.createElement("div", __assign({ className: classNames((_b = {},
+    return (React__default.createElement("div", __assign({ className: classNames((_b = {},
             _b["arc-Group-item"] = true,
             _b["arc-Group-item--grow"] = grow,
             _b["arc-Group-item--debugVisible"] = isDebugVisible,

package/dist/Heading/Heading.esm.d.ts

@@ -1 +1 @@
-export { Heading } from "../_shared/esm/Heading-183be76c";
+export { Heading } from "../_shared/esm/Heading-eb1e42db";

package/dist/Heading/Heading.esm.js

@@ -1,6 +1,6 @@
-export { H as Heading } from '../_shared/esm/Heading-183be76c.js';
+export { H as Heading } from '../_shared/esm/Heading-eb1e42db.js';
 import '../_shared/esm/index-229fc864.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';
 import '../_shared/esm/suffix-modifier-f5e28822.js';
-import '../_shared/esm/Surface-d515d212.js';
+import '../_shared/esm/Surface-bf201530.js';

package/dist/Icon/Icon.cjs.d.ts

@@ -1 +1 @@
-export { Icon } from "../_shared/cjs/Icon-bb5a5fd1";
+export { Icon } from "../_shared/cjs/Icon-719d13d4";

package/dist/Icon/Icon.cjs.js

@@ -2,11 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Icon = require('../_shared/cjs/Icon-bb5a5fd1.js');
+var Icon = require('../_shared/cjs/Icon-719d13d4.js');
 require('../_shared/cjs/index-78b35bc1.js');
-require('../_shared/cjs/index.es-f590caaf.js');
-require('../_shared/cjs/index-45bfb67b.js');
 require('react');
+require('../_shared/cjs/index-45bfb67b.js');
 require('../_shared/cjs/suffix-modifier-edf7851e.js');
 require('../_shared/cjs/Surface-d6b8010e.js');
 

package/dist/Icon/Icon.esm.d.ts

@@ -1 +1 @@
-export { Icon } from "../_shared/esm/Icon-2fd92daa";
+export { Icon } from "../_shared/esm/Icon-61f7237a";

package/dist/Icon/Icon.esm.js

@@ -1,7 +1,6 @@
-export { I as Icon } from '../_shared/esm/Icon-2fd92daa.js';
+export { I as Icon } from '../_shared/esm/Icon-61f7237a.js';
 import '../_shared/esm/index-229fc864.js';
-import '../_shared/esm/index.es-42f84e2d.js';
-import '../_shared/esm/index-2ae58626.js';
 import 'react';
+import '../_shared/esm/index-2ae58626.js';
 import '../_shared/esm/suffix-modifier-f5e28822.js';
-import '../_shared/esm/Surface-d515d212.js';
+import '../_shared/esm/Surface-bf201530.js';

package/dist/Image/Image.esm.d.ts

@@ -1 +1 @@
-export { Image } from "../_shared/esm/Image-7e4948f6";
+export { Image } from "../_shared/esm/Image-c0f3d42f";

package/dist/Image/Image.esm.js

@@ -1,4 +1,4 @@
-export { I as Image } from '../_shared/esm/Image-7e4948f6.js';
+export { I as Image } from '../_shared/esm/Image-c0f3d42f.js';
 import '../_shared/esm/index-229fc864.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';

package/dist/Markup/Markup.esm.js

@@ -1,7 +1,7 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React, { useContext } from 'react';
-import { C as Context } from '../_shared/esm/Surface-d515d212.js';
+import React__default, { useContext } from 'react';
+import { C as Context } from '../_shared/esm/Surface-bf201530.js';
 
 /**
  * Use `Markup` to display HTML-formatted text.
@@ -9,7 +9,7 @@ import { C as Context } from '../_shared/esm/Surface-d515d212.js';
 var Markup = function (_a) {
     var children = _a.children, _b = _a.isMeasured, isMeasured = _b === void 0 ? false : _b, props = __rest(_a, ["children", "isMeasured"]);
     var surface = useContext(Context).surface;
-    return (React.createElement("div", __assign({ className: classNames({
+    return (React__default.createElement("div", __assign({ className: classNames({
             "arc-Markup": true,
             "arc-Markup--measured": isMeasured,
             "arc-Markup--onDarkSurface": surface === "dark"

package/dist/Poster/Poster.esm.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { FC, ReactNode } from "react";
 import { anchorPoints } from "../_shared/esm/index-9483ad5f";
-import { loadingOptions } from "../_shared/esm/Image-7e4948f6";
+import { loadingOptions } from "../_shared/esm/Image-c0f3d42f";
 declare const PosterImage: FC<PosterImageProps>;
 interface PosterImageProps {
     /**

package/dist/Poster/Poster.esm.js

@@ -1,20 +1,20 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import React from 'react';
-import { S as Surface } from '../_shared/esm/Surface-d515d212.js';
-import { I as Image } from '../_shared/esm/Image-7e4948f6.js';
+import React__default from 'react';
+import { S as Surface } from '../_shared/esm/Surface-bf201530.js';
+import { I as Image } from '../_shared/esm/Image-c0f3d42f.js';
 import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js';
 
 var PosterImage = function (_a) {
     var alt = _a.alt, _b = _a.anchor, anchor = _b === void 0 ? "C" : _b, loading = _a.loading, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet, props = __rest(_a, ["alt", "anchor", "loading", "sizes", "src", "srcSet"]);
-    return (React.createElement(Image, __assign({ alt: alt, anchor: anchor, fit: "cover", loading: loading, sizes: sizes, src: src, srcSet: srcSet }, props)));
+    return (React__default.createElement(Image, __assign({ alt: alt, anchor: anchor, fit: "cover", loading: loading, sizes: sizes, src: src, srcSet: srcSet }, props)));
 };
 PosterImage.displayName = "Poster.Image";
 
 var PosterVideo = function (_a) {
     var _b;
     var _c = _a.anchor, anchor = _c === void 0 ? "C" : _c, _d = _a.autoPlay, autoPlay = _d === void 0 ? true : _d, children = _a.children, _e = _a.loop, loop = _e === void 0 ? true : _e, props = __rest(_a, ["anchor", "autoPlay", "children", "loop"]);
-    return (React.createElement("video", __assign({ className: classNames((_b = {
+    return (React__default.createElement("video", __assign({ className: classNames((_b = {
                 "arc-PosterVideo": true
             },
             _b[suffixModifier("arc-PosterVideo--anchor", anchor)] = anchor,
@@ -27,14 +27,14 @@ PosterVideo.displayName = "Poster.Video";
  */
 var Poster = function (_a) {
     var background = _a.background, children = _a.children, _b = _a.overlay, overlay = _b === void 0 ? true : _b, _c = _a.surface, surface = _c === void 0 ? "darker" : _c, props = __rest(_a, ["background", "children", "overlay", "surface"]);
-    return (React.createElement(Surface, { background: surface },
-        React.createElement("div", __assign({ className: classNames({
+    return (React__default.createElement(Surface, { background: surface },
+        React__default.createElement("div", __assign({ className: classNames({
                 "arc-Poster": true,
                 "arc-Poster--overlay": overlay,
                 "arc-Poster--overlayLight": surface === "lighter"
             }) }, filterDataAttrs(props)),
-            React.createElement("div", { className: "arc-Poster-backgroundWrapper" }, background),
-            React.createElement("div", { className: "arc-Poster-body" }, children))));
+            React__default.createElement("div", { className: "arc-Poster-backgroundWrapper" }, background),
+            React__default.createElement("div", { className: "arc-Poster-body" }, children))));
 };
 PosterImage.displayName = "Poster.Image";
 Poster.Image = PosterImage;

package/dist/RadioGroup/RadioGroup.cjs.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from "react";
 import { FC } from "react";
-import { FormControlProps } from "../_shared/cjs/FormControl-7d8e10fa";
+import { FormControlProps } from "../_shared/cjs/FormControl-e6b7d7c5";
 /**
  * Radio Button component.
  */

package/dist/RadioGroup/RadioGroup.cjs.js

@@ -4,9 +4,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var index = require('../_shared/cjs/index-78b35bc1.js');
 var React = require('react');
-var FormControl = require('../_shared/cjs/FormControl-7d8e10fa.js');
+var FormControl = require('../_shared/cjs/FormControl-e6b7d7c5.js');
 var index$1 = require('../_shared/cjs/index-45bfb67b.js');
 var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+require('../_shared/cjs/Text-1d3844be.js');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/RadioGroup/RadioGroup.esm.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from "react";
 import { FC } from "react";
-import { FormControlProps } from "../_shared/esm/FormControl-33194106";
+import { FormControlProps } from "../_shared/esm/FormControl-84c9ace6";
 /**
  * Radio Button component.
  */

package/dist/RadioGroup/RadioGroup.esm.js

@@ -1,8 +1,11 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
-import React, { createContext, useContext, forwardRef, useEffect } from 'react';
-import { F as FormControl } from '../_shared/esm/FormControl-33194106.js';
+import React__default, { createContext, useContext, forwardRef, useEffect } from 'react';
+import { F as FormControl } from '../_shared/esm/FormControl-84c9ace6.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
-import { C as Context } from '../_shared/esm/Surface-d515d212.js';
+import { C as Context } from '../_shared/esm/Surface-bf201530.js';
+import '../_shared/esm/Text-6b958ad8.js';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/BtIconChevronRightMid-d9b11761.js';
 
 var RadioContext = createContext({});
 var Provider = RadioContext.Provider;
@@ -20,18 +23,18 @@ var RadioButton = forwardRef(function (_a, ref) {
     var surface = useContext(Context).surface;
     var idLabel = "".concat(id, "-label");
     var checked = checkedValue === value ? true : false;
-    return (React.createElement("div", __assign({ className: classNames({
+    return (React__default.createElement("div", __assign({ className: classNames({
             "arc-RadioButton": true,
             "arc-RadioButton--disabled": isDisabled || groupDisabled,
             "arc-RadioButton--small": size === "s",
             "arc-RadioButton--smallLabel": labelSize === "s",
             "arc-RadioButton--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs(props)),
-        React.createElement("label", { className: "arc-RadioButton-label", htmlFor: id, id: idLabel },
-            React.createElement("input", { className: "arc-RadioButton-input", checked: typeof changeEvent !== "function" ? undefined : checked, defaultChecked: typeof changeEvent !== "function" ? checked : undefined, disabled: isDisabled || groupDisabled, id: id, name: name, onBlur: blurEvent, onChange: changeEvent, ref: ref, type: "radio", value: value }),
-            React.createElement("span", null,
+        React__default.createElement("label", { className: "arc-RadioButton-label", htmlFor: id, id: idLabel },
+            React__default.createElement("input", { className: "arc-RadioButton-input", checked: typeof changeEvent !== "function" ? undefined : checked, defaultChecked: typeof changeEvent !== "function" ? checked : undefined, disabled: isDisabled || groupDisabled, id: id, name: name, onBlur: blurEvent, onChange: changeEvent, ref: ref, type: "radio", value: value }),
+            React__default.createElement("span", null,
                 label,
-                helper && React.createElement("span", { className: "arc-RadioButton-helper" }, helper)))));
+                helper && React__default.createElement("span", { className: "arc-RadioButton-helper" }, helper)))));
 });
 
 /**
@@ -40,13 +43,13 @@ var RadioButton = forwardRef(function (_a, ref) {
 var RadioGroup = function (_a) {
     var children = _a.children, checkedValue = _a.checkedValue, _b = _a.isDisabled, isDisabled = _b === void 0 ? false : _b, id = _a.id, helper = _a.helper, label = _a.label, _c = _a.labelSize, labelSize = _c === void 0 ? "l" : _c, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _d = _a.size, size = _d === void 0 ? "l" : _d, props = __rest(_a, ["children", "checkedValue", "isDisabled", "id", "helper", "label", "labelSize", "name", "onBlur", "onChange", "size"]);
     useEffect(function () {
-        React.Children.map(children, function (item) {
+        React__default.Children.map(children, function (item) {
             if (item && item.type !== RadioButton) {
                 throw new Error("Illegal child passed to <RadioGroup />. Ensure to only use <RadioGroup.RadioButton />.");
             }
         });
     }, [children]);
-    return (React.createElement(Provider, { value: {
+    return (React__default.createElement(Provider, { value: {
             blurEvent: onBlur,
             changeEvent: onChange,
             groupDisabled: isDisabled,
@@ -55,8 +58,8 @@ var RadioGroup = function (_a) {
             name: name,
             size: size
         } },
-        React.createElement("div", __assign({ className: "arc-RadioGroup" }, filterDataAttrs(props)),
-            React.createElement(FormControl, { elementType: "fieldset", label: label, labelSize: labelSize, helper: helper, id: id, requirementStatus: "not-applicable" }, children))));
+        React__default.createElement("div", __assign({ className: "arc-RadioGroup" }, filterDataAttrs(props)),
+            React__default.createElement(FormControl, { elementType: "fieldset", label: label, labelSize: labelSize, helper: helper, id: id, requirementStatus: "not-applicable" }, children))));
 };
 RadioButton.displayName = "RadioGroup.RadioButton";
 RadioGroup.RadioButton = RadioButton;