@arc-ui/components 11.23.0 → 11.24.1

package/dist/Calendar/Calendar.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Calendar = require('../_shared/cjs/Calendar-6ea75d05.js');
+var Calendar = require('../_shared/cjs/Calendar-b022545c.js');
 require('react');
 require('../_shared/cjs/use-media-query-e61881d8.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');

package/dist/Calendar/Calendar.esm.js

@@ -1,4 +1,4 @@
-export { C as Calendar } from '../_shared/esm/Calendar-fafaca6b.js';
+export { C as Calendar } from '../_shared/esm/Calendar-ea232839.js';
 import 'react';
 import '../_shared/esm/use-media-query-4c807227.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';

package/dist/Card/Card.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Card = require('../_shared/cjs/Card-5b19cabc.js');
+var Card = require('../_shared/cjs/Card-78a70e63.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('../_shared/cjs/index-9947ac13.js');
 require('react');

package/dist/Card/Card.esm.js

@@ -1,4 +1,4 @@
-export { C as Card } from '../_shared/esm/Card-7fc6c9b4.js';
+export { C as Card } from '../_shared/esm/Card-a4b78406.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import 'react';

package/dist/Clock/Clock.cjs.js

@@ -10,8 +10,13 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 /**
- * `Clock` is a demo component that shows the current time.
- */
+#### Deprecation Notice
+
+The `Clock` component is being deprecated from Arc  and will be removed in a future release.
+
+Do not use `Clock` for any new work, and prepare to update any design that features it to remove it.
+
+*/
 var Clock = function (_a) {
     var _b = _a.locale, locale = _b === void 0 ? "en-GB" : _b, props = filterDataAttrs.__rest(_a, ["locale"]);
     var _c = React.useState(new Date()), time = _c[0], setTime = _c[1];

package/dist/Clock/Clock.esm.js

@@ -2,8 +2,13 @@ import { _ as __rest, a as __assign, f as filterDataAttrs, d as __awaiter, e as
 import React__default, { useState, useEffect } from 'react';
 
 /**
- * `Clock` is a demo component that shows the current time.
- */
+#### Deprecation Notice
+
+The `Clock` component is being deprecated from Arc  and will be removed in a future release.
+
+Do not use `Clock` for any new work, and prepare to update any design that features it to remove it.
+
+*/
 var Clock = function (_a) {
     var _b = _a.locale, locale = _b === void 0 ? "en-GB" : _b, props = __rest(_a, ["locale"]);
     var _c = useState(new Date()), time = _c[0], setTime = _c[1];

package/dist/Curve/Curve.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Curve = require('../_shared/cjs/Curve-d038052b.js');
+var Curve = require('../_shared/cjs/Curve-b5117889.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('../_shared/cjs/index-9947ac13.js');
 require('react');

package/dist/Curve/Curve.esm.js

@@ -1,4 +1,4 @@
-export { C as Curve } from '../_shared/esm/Curve-d8679dde.js';
+export { C as Curve } from '../_shared/esm/Curve-e05b3c3f.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import 'react';

package/dist/DatePicker/DatePicker.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Calendar = require('../_shared/cjs/Calendar-6ea75d05.js');
+var Calendar = require('../_shared/cjs/Calendar-b022545c.js');
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var React = require('react');
 var index$4 = require('../_shared/cjs/index-9947ac13.js');
@@ -13,7 +13,7 @@ var index$2 = require('../_shared/cjs/index-6eb396a3.js');
 var index$1 = require('../_shared/cjs/index-77ab5c6a.js');
 var index$3 = require('../_shared/cjs/index-d38f1bd0.js');
 var Base = require('../_shared/cjs/Base-f5a86eed.js');
-var TextInput = require('../_shared/cjs/TextInput-8912dd41.js');
+var TextInput = require('../_shared/cjs/TextInput-8d139489.js');
 require('../_shared/cjs/use-media-query-e61881d8.js');
 require('../_shared/cjs/Text-606ca3a2.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');

package/dist/DatePicker/DatePicker.esm.js

@@ -1,4 +1,4 @@
-import { r as requiredArgs, t as toDate, i as isValid, f as format, C as Calendar, a as isBefore, b as isAfter, c as compareAsc } from '../_shared/esm/Calendar-fafaca6b.js';
+import { r as requiredArgs, t as toDate, i as isValid, f as format, C as Calendar, a as isBefore, b as isAfter, c as compareAsc } from '../_shared/esm/Calendar-ea232839.js';
 import { b as __spreadArray, _ as __rest, a as __assign } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import React__default, { useRef, useState, createElement, useCallback, forwardRef, useEffect, useContext } from 'react';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
@@ -9,7 +9,7 @@ import { $ as $1746a345f3d73bb7$export$f680877a34711e37 } from '../_shared/esm/i
 import { $ as $cf1ac5d9fe0e8206$export$722aac194ae923, a as $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, b as $cf1ac5d9fe0e8206$export$b688253958b8dfe7, c as $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 } from '../_shared/esm/index-b84a20c6.js';
 import { $ as $921a889cee6df7e8$export$99c2b779aa4e8b8b } from '../_shared/esm/index-ca72c9d5.js';
 import { A as ArcRootElementContext } from '../_shared/esm/Base-f200653c.js';
-import { T as TextInputWithPlaceHolder } from '../_shared/esm/TextInput-5ffa05da.js';
+import { T as TextInputWithPlaceHolder } from '../_shared/esm/TextInput-c0388103.js';
 import '../_shared/esm/use-media-query-4c807227.js';
 import '../_shared/esm/Text-14f586ac.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';

package/dist/ProgressStepper/ProgressStepper.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var ProgressStepper = require('../_shared/cjs/ProgressStepper-57cfef1e.js');
+var ProgressStepper = require('../_shared/cjs/ProgressStepper-491f0286.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
 require('../_shared/cjs/index-9947ac13.js');

package/dist/ProgressStepper/ProgressStepper.esm.js

@@ -1,4 +1,4 @@
-export { P as ProgressStepper } from '../_shared/esm/ProgressStepper-6c811282.js';
+export { P as ProgressStepper } from '../_shared/esm/ProgressStepper-7eba3a6a.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
 import '../_shared/esm/index-2e73c2e9.js';

package/dist/RadioGroup/RadioGroup.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var RadioGroup = require('../_shared/cjs/RadioGroup-85eda600.js');
+var RadioGroup = require('../_shared/cjs/RadioGroup-26dc00fc.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
 require('../_shared/cjs/FormControl-68258ce1.js');
@@ -17,4 +17,5 @@ require('../_shared/cjs/VisuallyHidden-b0de4c7b.js');
 
 
 
+exports.RadioButton = RadioGroup.RadioButton;
 exports.RadioGroup = RadioGroup.RadioGroup;

package/dist/RadioGroup/RadioGroup.esm.js

@@ -1,4 +1,4 @@
-export { R as RadioGroup } from '../_shared/esm/RadioGroup-6c8f8454.js';
+export { a as RadioButton, R as RadioGroup } from '../_shared/esm/RadioGroup-427652ac.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
 import '../_shared/esm/FormControl-8e836656.js';

package/dist/SiteFooter/SiteFooter.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var SiteFooter = require('../_shared/cjs/SiteFooter-65b6360c.js');
+var SiteFooter = require('../_shared/cjs/SiteFooter-20d5a9fa.js');
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var React = require('react');
 require('../_shared/cjs/use-media-query-e61881d8.js');
@@ -11,7 +11,7 @@ require('../_shared/cjs/BrandLogo-aea340c8.js');
 require('../_shared/cjs/index-9947ac13.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
 require('../_shared/cjs/Surface-038db6e1.js');
-require('../_shared/cjs/Curve-d038052b.js');
+require('../_shared/cjs/Curve-b5117889.js');
 require('../_shared/cjs/Section-59804166.js');
 require('../_shared/cjs/handle-link-click-17a44cf4.js');
 

package/dist/SiteFooter/SiteFooter.esm.js

@@ -1,5 +1,5 @@
-import { S as SiteFooter } from '../_shared/esm/SiteFooter-38ee1536.js';
-export { S as SiteFooter } from '../_shared/esm/SiteFooter-38ee1536.js';
+import { S as SiteFooter } from '../_shared/esm/SiteFooter-86f910b4.js';
+export { S as SiteFooter } from '../_shared/esm/SiteFooter-86f910b4.js';
 import { d as __awaiter, e as __generator, a as __assign } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import React__default from 'react';
 import '../_shared/esm/use-media-query-4c807227.js';
@@ -8,7 +8,7 @@ import '../_shared/esm/BrandLogo-1af78f76.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/Surface-0ca6817d.js';
-import '../_shared/esm/Curve-d8679dde.js';
+import '../_shared/esm/Curve-e05b3c3f.js';
 import '../_shared/esm/Section-73781b56.js';
 import '../_shared/esm/handle-link-click-f64f55a2.js';
 

package/dist/SiteHeader/SiteHeader.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var SiteHeader_rehydrator = require('../_shared/cjs/SiteHeader.rehydrator-b76b0889.js');
+var SiteHeader_rehydrator = require('../_shared/cjs/SiteHeader.rehydrator-9d8f3dad.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
 require('../_shared/cjs/index-9947ac13.js');

package/dist/SiteHeader/SiteHeader.esm.js

@@ -1,4 +1,4 @@
-export { S as SiteHeader, a as SiteHeaderRehydrator } from '../_shared/esm/SiteHeader.rehydrator-8ad7651b.js';
+export { S as SiteHeader, a as SiteHeaderRehydrator } from '../_shared/esm/SiteHeader.rehydrator-2ec02ee7.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
 import '../_shared/esm/index-2e73c2e9.js';

package/dist/TextArea/TextArea.cjs.js

@@ -12,7 +12,7 @@ require('../_shared/cjs/Image-e873b8fc.js');
 require('../_shared/cjs/Base-f5a86eed.js');
 require('../_shared/cjs/Breadcrumbs-c6eaf5c4.js');
 require('../_shared/cjs/Button-6ba21d3b.js');
-require('../_shared/cjs/Card-5b19cabc.js');
+require('../_shared/cjs/Card-78a70e63.js');
 require('../_shared/cjs/Checkbox-0253327b.js');
 require('../_shared/cjs/Columns-ae4f8cef.js');
 require('../_shared/cjs/Filter-f9506dfa.js');
@@ -20,14 +20,14 @@ var FormControl = require('../_shared/cjs/FormControl-68258ce1.js');
 require('../_shared/cjs/Grid-da776e77.js');
 require('../_shared/cjs/Group-0429741a.js');
 require('../_shared/cjs/Poster-9b48fd61.js');
-require('../_shared/cjs/ProgressStepper-57cfef1e.js');
-require('../_shared/cjs/RadioGroup-85eda600.js');
+require('../_shared/cjs/ProgressStepper-491f0286.js');
+require('../_shared/cjs/RadioGroup-26dc00fc.js');
 require('../_shared/cjs/debounce-123468fb.js');
-require('../_shared/cjs/SiteFooter-65b6360c.js');
-require('../_shared/cjs/SiteHeader.rehydrator-b76b0889.js');
+require('../_shared/cjs/SiteFooter-20d5a9fa.js');
+require('../_shared/cjs/SiteHeader.rehydrator-9d8f3dad.js');
 require('../_shared/cjs/SiteHeaderV2-ce1c8737.js');
 require('../_shared/cjs/Tabs-bc9fac46.js');
-require('../_shared/cjs/TextInput-8912dd41.js');
+require('../_shared/cjs/TextInput-8d139489.js');
 require('../_shared/cjs/Toast-26207fef.js');
 require('../_shared/cjs/UniversalHeader-b8389447.js');
 var VisuallyHidden = require('../_shared/cjs/VisuallyHidden-b0de4c7b.js');
@@ -43,7 +43,7 @@ require('../_shared/cjs/DisclosureMini-09c749e5.js');
 require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
 require('../_shared/cjs/use-media-query-e61881d8.js');
 require('../_shared/cjs/BrandLogo-aea340c8.js');
-require('../_shared/cjs/Curve-d038052b.js');
+require('../_shared/cjs/Curve-b5117889.js');
 require('../_shared/cjs/Section-59804166.js');
 require('../_shared/cjs/ConditionalWrapper-be3b2625.js');
 require('../_shared/cjs/extends-8c5e4b48.js');
@@ -65,7 +65,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 /** Use `TextArea` to allow custom user text entry via keyboard, for long-form and multi-line descriptions */
 var TextArea = React.forwardRef(function (_a, ref) {
-    var _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, _c = _a.resize, resize = _c === void 0 ? "manual" : _c, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, _g = _a.showCharacterCount, showCharacterCount = _g === void 0 ? true : _g, label = _a.label, _h = _a.labelSize, labelSize = _h === void 0 ? "l" : _h, maxLength = _a.maxLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, onClickDisclosure = _a.onClickDisclosure, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, width = _a.width, props = filterDataAttrs.__rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "resize", "isDisabled", "isReadOnly", "isRequired", "showCharacterCount", "label", "labelSize", "maxLength", "name", "onBlur", "onChange", "onClickDisclosure", "value", "disclosureTitle", "disclosureText", "width"]);
+    var _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, _c = _a.resize, resize = _c === void 0 ? "manual" : _c, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, _g = _a.showCharacterCount, showCharacterCount = _g === void 0 ? true : _g, label = _a.label, _h = _a.labelSize, labelSize = _h === void 0 ? "l" : _h, maxLength = _a.maxLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, onClickDisclosure = _a.onClickDisclosure, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, width = _a.width, autoComplete = _a.autoComplete, props = filterDataAttrs.__rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "resize", "isDisabled", "isReadOnly", "isRequired", "showCharacterCount", "label", "labelSize", "maxLength", "name", "onBlur", "onChange", "onClickDisclosure", "value", "disclosureTitle", "disclosureText", "width", "autoComplete"]);
     var surface = React.useContext(Surface.Context).surface;
     var ourRef = React.useRef(null);
     var _j = React.useState((value && value.length) || (defaultValue && defaultValue.length) || 0), characterCount = _j[0], setCharacterCount = _j[1];
@@ -100,7 +100,7 @@ var TextArea = React.forwardRef(function (_a, ref) {
                 "arc-TextArea--noResize": resize !== "manual",
                 "arc-TextArea--onDarkSurface": surface === "dark",
                 "arc-TextArea--invalid": errorMessage
-            }), defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, value: value, readOnly: isReadOnly, maxLength: maxLength, name: name, onChange: handleOnChange, onBlur: onBlur, ref: getTextAreaRef, style: { width: width }, "aria-describedby": "".concat(id, "-helper") })));
+            }), defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, value: value, readOnly: isReadOnly, maxLength: maxLength, name: name, onChange: handleOnChange, onBlur: onBlur, ref: getTextAreaRef, style: { width: width }, "aria-describedby": "".concat(id, "-helper"), autoComplete: autoComplete })));
 });
 
 exports.TextArea = TextArea;

package/dist/TextArea/TextArea.esm.js

@@ -8,7 +8,7 @@ import '../_shared/esm/Image-12fbd327.js';
 import '../_shared/esm/Base-f200653c.js';
 import '../_shared/esm/Breadcrumbs-7d55e1a6.js';
 import '../_shared/esm/Button-a7d134c6.js';
-import '../_shared/esm/Card-7fc6c9b4.js';
+import '../_shared/esm/Card-a4b78406.js';
 import '../_shared/esm/Checkbox-588619c7.js';
 import '../_shared/esm/Columns-d96b7425.js';
 import '../_shared/esm/Filter-258ba675.js';
@@ -16,14 +16,14 @@ import { F as FormControl } from '../_shared/esm/FormControl-8e836656.js';
 import '../_shared/esm/Grid-07dbf4bd.js';
 import '../_shared/esm/Group-73fdb896.js';
 import '../_shared/esm/Poster-4ec2f679.js';
-import '../_shared/esm/ProgressStepper-6c811282.js';
-import '../_shared/esm/RadioGroup-6c8f8454.js';
+import '../_shared/esm/ProgressStepper-7eba3a6a.js';
+import '../_shared/esm/RadioGroup-427652ac.js';
 import '../_shared/esm/debounce-6fed6b84.js';
-import '../_shared/esm/SiteFooter-38ee1536.js';
-import '../_shared/esm/SiteHeader.rehydrator-8ad7651b.js';
+import '../_shared/esm/SiteFooter-86f910b4.js';
+import '../_shared/esm/SiteHeader.rehydrator-2ec02ee7.js';
 import '../_shared/esm/SiteHeaderV2-a7c1b1cb.js';
 import '../_shared/esm/Tabs-9485cab6.js';
-import '../_shared/esm/TextInput-5ffa05da.js';
+import '../_shared/esm/TextInput-c0388103.js';
 import '../_shared/esm/Toast-fcbfc194.js';
 import '../_shared/esm/UniversalHeader-80c7313f.js';
 import { V as VisuallyHidden } from '../_shared/esm/VisuallyHidden-06692fd3.js';
@@ -39,7 +39,7 @@ import '../_shared/esm/DisclosureMini-56719716.js';
 import '../_shared/esm/BtIconChevronDown2Px.esm-217276c2.js';
 import '../_shared/esm/use-media-query-4c807227.js';
 import '../_shared/esm/BrandLogo-1af78f76.js';
-import '../_shared/esm/Curve-d8679dde.js';
+import '../_shared/esm/Curve-e05b3c3f.js';
 import '../_shared/esm/Section-73781b56.js';
 import '../_shared/esm/ConditionalWrapper-59be8f35.js';
 import '../_shared/esm/extends-8cc61aad.js';
@@ -57,7 +57,7 @@ import '../_shared/esm/BtIconTick.esm-e265098f.js';
 
 /** Use `TextArea` to allow custom user text entry via keyboard, for long-form and multi-line descriptions */
 var TextArea = forwardRef(function (_a, ref) {
-    var _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, _c = _a.resize, resize = _c === void 0 ? "manual" : _c, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, _g = _a.showCharacterCount, showCharacterCount = _g === void 0 ? true : _g, label = _a.label, _h = _a.labelSize, labelSize = _h === void 0 ? "l" : _h, maxLength = _a.maxLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, onClickDisclosure = _a.onClickDisclosure, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, width = _a.width, props = __rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "resize", "isDisabled", "isReadOnly", "isRequired", "showCharacterCount", "label", "labelSize", "maxLength", "name", "onBlur", "onChange", "onClickDisclosure", "value", "disclosureTitle", "disclosureText", "width"]);
+    var _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, _c = _a.resize, resize = _c === void 0 ? "manual" : _c, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, _g = _a.showCharacterCount, showCharacterCount = _g === void 0 ? true : _g, label = _a.label, _h = _a.labelSize, labelSize = _h === void 0 ? "l" : _h, maxLength = _a.maxLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, onClickDisclosure = _a.onClickDisclosure, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, width = _a.width, autoComplete = _a.autoComplete, props = __rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "resize", "isDisabled", "isReadOnly", "isRequired", "showCharacterCount", "label", "labelSize", "maxLength", "name", "onBlur", "onChange", "onClickDisclosure", "value", "disclosureTitle", "disclosureText", "width", "autoComplete"]);
     var surface = useContext(Context).surface;
     var ourRef = useRef(null);
     var _j = useState((value && value.length) || (defaultValue && defaultValue.length) || 0), characterCount = _j[0], setCharacterCount = _j[1];
@@ -92,7 +92,7 @@ var TextArea = forwardRef(function (_a, ref) {
                 "arc-TextArea--noResize": resize !== "manual",
                 "arc-TextArea--onDarkSurface": surface === "dark",
                 "arc-TextArea--invalid": errorMessage
-            }), defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, value: value, readOnly: isReadOnly, maxLength: maxLength, name: name, onChange: handleOnChange, onBlur: onBlur, ref: getTextAreaRef, style: { width: width }, "aria-describedby": "".concat(id, "-helper") })));
+            }), defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, value: value, readOnly: isReadOnly, maxLength: maxLength, name: name, onChange: handleOnChange, onBlur: onBlur, ref: getTextAreaRef, style: { width: width }, "aria-describedby": "".concat(id, "-helper"), autoComplete: autoComplete })));
 });
 
 export { TextArea };

package/dist/TextInput/TextInput.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var TextInput = require('../_shared/cjs/TextInput-8912dd41.js');
+var TextInput = require('../_shared/cjs/TextInput-8d139489.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('../_shared/cjs/index-9947ac13.js');
 require('react');

package/dist/TextInput/TextInput.esm.js

@@ -1,4 +1,4 @@
-export { a as TextInput } from '../_shared/esm/TextInput-5ffa05da.js';
+export { a as TextInput } from '../_shared/esm/TextInput-c0388103.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import 'react';

package/dist/_shared/cjs/{Calendar-6ea75d05.js → Calendar-b022545c.js}

@@ -3626,7 +3626,7 @@ var CalendarNavButton = function (_a) {
         previous: BtIconChevronLeftMid_esm.BtIconChevronLeftMid,
         next: BtIconChevronRightMid_esm.BtIconChevronRightMid
     };
-    return (React__default["default"].createElement("button", { "aria-label": ariaLabel, disabled: isDisabled, onClick: onClick, className: index.classNames("arc-CalendarNavButton", {
+    return (React__default["default"].createElement("button", { "aria-label": ariaLabel, disabled: isDisabled, onClick: onClick, type: "button", className: index.classNames("arc-CalendarNavButton", {
             "arc-CalendarNavButton--previous": direction === "previous",
             "arc-CalendarNavButton--next": direction === "next"
         }) },
@@ -3902,7 +3902,7 @@ var reducer = function (state, action) {
 var CalendarFooter = function (_a) {
     var onCancelClick = _a.onCancelClick;
     return (React__default["default"].createElement("div", { className: "arc-CalendarFooter" },
-        React__default["default"].createElement("button", { className: "arc-CalendarFooter-button", onClick: onCancelClick }, "Cancel")));
+        React__default["default"].createElement("button", { type: "button", className: "arc-CalendarFooter-button", onClick: onCancelClick }, "Cancel")));
 };
 
 var CalendarWrapper = function (_a) {

package/dist/_shared/cjs/{Card-5b19cabc.js → Card-78a70e63.js}

@@ -45,7 +45,11 @@ var useInteractionMode = function () {
 };
 
 /**
- * Use `Card` to contain content and actions about a single subject.
+#### Deprecation Notice
+
+The `Card` component has been superseded by a range of new `Card` options (`ImpactCard`, `InformationCard`, `MediaCard`, `TypographyCard`) and therefore is being deprecated from Arc and will be removed in a future release.
+
+Do not use `Card` for any new work, and prepare to update any design that features it to replace it with our newer `Card` options.
  */
 var Card = function (_a) {
     var _b;

package/dist/_shared/cjs/{Curve-d038052b.js → Curve-b5117889.js}

@@ -12,7 +12,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 /**
 #### Deprecation Notice
 
-The `Curve` component is an outdated brand feature and is being deprecated from Arc as a standalone component or sub-component within other components. Do not use Curve for any new work, and prepare to update any design that features it to remove it.
+The `Curve` component is an outdated brand feature and is being deprecated from Arc as a standalone component or sub-component within other components. Do not use `Curve` for any new work, and prepare to update any design that features it to remove it.
 
 `Curve` will be removed from Arc in a subsequent release
  */

package/dist/_shared/cjs/{ProgressStepper-57cfef1e.js → ProgressStepper-491f0286.js}

@@ -12,35 +12,35 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var Error = function () { return (React__default["default"].createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default["default"].createElement("g", { "clip-path": "url(#a)" },
+    React__default["default"].createElement("g", { clipPath: "url(#a)" },
         React__default["default"].createElement("path", { d: "m13.06 12 2.845-2.845a.75.75 0 0 0-1.06-1.06L12 10.94 9.155 8.095a.75.75 0 0 0-1.06 1.06L10.939 12l-2.844 2.845a.75.75 0 1 0 1.06 1.06L12 13.061l2.845 2.844a.75.75 0 0 0 1.06-1.06L13.06 12Z", fill: "currentColor" })),
-    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", "stroke-width": "1.333" }),
+    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", strokeWidth: "1.333" }),
     React__default["default"].createElement("defs", null,
         React__default["default"].createElement("clipPath", { id: "a" },
             React__default["default"].createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
 
 var Warning = function () { return (React__default["default"].createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", "stroke-width": "1.333" }),
-    React__default["default"].createElement("path", { d: "M12 15.747a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm.004-1.487a.375.375 0 0 0 .375-.375l.001-6.757a.375.375 0 1 0-.75 0l-.001 6.757a.375.375 0 0 0 .375.375Z", fill: "currentColor", stroke: "currentColor", "stroke-width": ".3" }))); };
+    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", strokeWidth: "1.333" }),
+    React__default["default"].createElement("path", { d: "M12 15.747a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm.004-1.487a.375.375 0 0 0 .375-.375l.001-6.757a.375.375 0 1 0-.75 0l-.001 6.757a.375.375 0 0 0 .375.375Z", fill: "currentColor", stroke: "currentColor", strokeWidth: ".3" }))); };
 
 var Complete = function () { return (React__default["default"].createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default["default"].createElement("g", { "clip-path": "url(#a)" },
+    React__default["default"].createElement("g", { clipPath: "url(#a)" },
         React__default["default"].createElement("path", { d: "m10.125 16.435-3.53-3.53a.75.75 0 0 1 0-1.06.768.768 0 0 1 1.06 0l2.47 2.47 6.22-6.22a.75.75 0 1 1 1.06 1.06l-7.28 7.28Z", fill: "currentColor" })),
-    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", "stroke-width": "1.333" }),
+    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", strokeWidth: "1.333" }),
     React__default["default"].createElement("defs", null,
         React__default["default"].createElement("clipPath", { id: "a" },
             React__default["default"].createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
 
 var Current = function () { return (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-    React__default["default"].createElement("rect", { x: "0.666667", y: "0.666667", width: "22.6667", height: "22.6667", rx: "11.3333", stroke: "url(#paint0_linear_1_1050)", "stroke-width": "1.33333" }),
+    React__default["default"].createElement("rect", { x: "0.666667", y: "0.666667", width: "22.6667", height: "22.6667", rx: "11.3333", stroke: "url(#paint0_linear_1_1050)", strokeWidth: "1.33333" }),
     React__default["default"].createElement("circle", { cx: "12", cy: "12", r: "7", fill: "currentColor" }),
     React__default["default"].createElement("defs", null,
         React__default["default"].createElement("linearGradient", { id: "paint0_linear_1_1050", x1: "36.6036", y1: "-4.31391e-07", x2: "-12.6036", y2: "24", gradientUnits: "userSpaceOnUse" },
-            React__default["default"].createElement("stop", { "stop-color": "#F200F5" }),
-            React__default["default"].createElement("stop", { offset: "1", "stop-color": "#1EC8E6" }))))); };
+            React__default["default"].createElement("stop", { stopColor: "#F200F5" }),
+            React__default["default"].createElement("stop", { offset: "1", stopColor: "#1EC8E6" }))))); };
 
 var Todo = function () { return (React__default["default"].createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", "stroke-width": "1.333" }))); };
+    React__default["default"].createElement("rect", { x: ".667", y: ".667", width: "22.667", height: "22.667", rx: "11.333", stroke: "currentColor", strokeWidth: "1.333" }))); };
 
 // export current step as an icon
 var ProgressStepperItem = function (_a) {

package/dist/_shared/cjs/{RadioGroup-85eda600.js → RadioGroup-26dc00fc.js}

@@ -5,6 +5,7 @@ var React = require('react');
 var FormControl = require('./FormControl-68258ce1.js');
 var index = require('./index-9947ac13.js');
 var Surface = require('./Surface-038db6e1.js');
+var VisuallyHidden = require('./VisuallyHidden-b0de4c7b.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -17,18 +18,15 @@ var useRadioContext = function () {
     return context;
 };
 
-/**
- * Radio Button component.
- */
 var RadioButton = React.forwardRef(function (_a, ref) {
-    var helper = _a.helper, id = _a.id, isDisabled = _a.isDisabled, label = _a.label, _b = _a.radioButtonAlignment, radioButtonAlignment = _b === void 0 ? "center" : _b, value = _a.value, props = filterDataAttrs.__rest(_a, ["helper", "id", "isDisabled", "label", "radioButtonAlignment", "value"]);
-    var _c = useRadioContext(), blurEvent = _c.blurEvent, changeEvent = _c.changeEvent, groupDisabled = _c.groupDisabled, checkedValue = _c.checkedValue, labelSize = _c.labelSize, name = _c.name, size = _c.size;
+    var id = _a.id, changeEvent = _a.changeEvent, isDisabled = _a.isDisabled, size = _a.size, labelSize = _a.labelSize, checked = _a.checked, defaultChecked = _a.defaultChecked, radioButtonAlignment = _a.radioButtonAlignment, name = _a.name, blurEvent = _a.blurEvent, value = _a.value, label = _a.label, helper = _a.helper, hideLabel = _a.hideLabel, withMargin = _a.withMargin, props = filterDataAttrs.__rest(_a, ["id", "changeEvent", "isDisabled", "size", "labelSize", "checked", "defaultChecked", "radioButtonAlignment", "name", "blurEvent", "value", "label", "helper", "hideLabel", "withMargin"]);
     var surface = React.useContext(Surface.Context).surface;
     var idLabel = "".concat(id, "-label");
-    var checked = checkedValue === value ? true : false;
     return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames({
             "arc-RadioButton": true,
-            "arc-RadioButton--disabled": isDisabled || groupDisabled,
+            "arc-RadioButton--withMargin": withMargin,
+            "arc-RadioButton--withMarginSmall": withMargin && size === "s",
+            "arc-RadioButton--disabled": isDisabled,
             "arc-RadioButton--small": size === "s",
             "arc-RadioButton--smallLabel": labelSize === "s",
             "arc-RadioButton--onDarkSurface": surface === "dark"
@@ -36,14 +34,26 @@ var RadioButton = React.forwardRef(function (_a, ref) {
         React__default["default"].createElement("label", { className: index.classNames("arc-RadioButton-label", {
                 "arc-RadioButton-label--alignTop": radioButtonAlignment === "top"
             }), htmlFor: id, id: idLabel },
-            React__default["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, "aria-checked": checked }),
+            React__default["default"].createElement("input", { className: "arc-RadioButton-input", checked: checked, defaultChecked: defaultChecked, disabled: isDisabled, id: id, name: name, onBlur: blurEvent, onChange: changeEvent, ref: ref, type: "radio", value: value, "aria-checked": checked }),
             React__default["default"].createElement("span", { className: index.classNames({
                     "arc-RadioButton-label--marginTop": radioButtonAlignment === "top"
                 }) },
-                label,
+                hideLabel ? React__default["default"].createElement(VisuallyHidden.VisuallyHidden, null, label) : label,
                 helper && React__default["default"].createElement("span", { className: "arc-RadioButton-helper" }, helper)))));
 });
 
+/**
+ * Radio Button component.
+ */
+var RadioButtonGroupInput = React.forwardRef(function (_a, ref) {
+    var helper = _a.helper, id = _a.id, isDisabled = _a.isDisabled, label = _a.label, _b = _a.radioButtonAlignment, radioButtonAlignment = _b === void 0 ? "center" : _b, value = _a.value, props = filterDataAttrs.__rest(_a, ["helper", "id", "isDisabled", "label", "radioButtonAlignment", "value"]);
+    var _c = useRadioContext(), blurEvent = _c.blurEvent, changeEvent = _c.changeEvent, groupDisabled = _c.groupDisabled, checkedValue = _c.checkedValue, labelSize = _c.labelSize, name = _c.name, size = _c.size;
+    var isChecked = checkedValue === value ? true : false;
+    var checked = typeof changeEvent !== "function" ? undefined : isChecked;
+    var defaultChecked = typeof changeEvent !== "function" ? isChecked : undefined;
+    return (React__default["default"].createElement(RadioButton, filterDataAttrs.__assign({ withMargin: true, ref: ref, id: id, name: name, helper: helper, isDisabled: isDisabled || groupDisabled, labelSize: labelSize, size: size, radioButtonAlignment: radioButtonAlignment, label: label, defaultChecked: defaultChecked, checked: checked, changeEvent: changeEvent, blurEvent: blurEvent, value: value }, props)));
+});
+
 /**
  * Use `RadioGroup` to wrap and control radio buttons and apply default values
  */
@@ -51,7 +61,7 @@ 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 = filterDataAttrs.__rest(_a, ["children", "checkedValue", "isDisabled", "id", "helper", "label", "labelSize", "name", "onBlur", "onChange", "size"]);
     React.useEffect(function () {
         React__default["default"].Children.map(children, function (item) {
-            if (item && item.type !== RadioButton) {
+            if (item && item.type !== RadioButtonGroupInput) {
                 throw new Error("Illegal child passed to <RadioGroup />. Ensure to only use <RadioGroup.RadioButton />.");
             }
         });
@@ -69,6 +79,7 @@ var RadioGroup = function (_a) {
             React__default["default"].createElement(FormControl.FormControl, { elementType: "fieldset", label: label, labelSize: labelSize, helper: helper, id: id, requirementStatus: "not-applicable", helperUnderLabel: true },
                 React__default["default"].createElement("span", { className: "arc-RadioGroup-radioButtonContainer" }, children)))));
 };
-RadioGroup.RadioButton = RadioButton;
+RadioGroup.RadioButton = RadioButtonGroupInput;
 
+exports.RadioButton = RadioButton;
 exports.RadioGroup = RadioGroup;

package/dist/_shared/cjs/{SiteFooter-65b6360c.js → SiteFooter-20d5a9fa.js}

@@ -5,7 +5,7 @@ var useMediaQuery = require('./use-media-query-e61881d8.js');
 var BtIconChevronDown2Px_esm = require('./BtIconChevronDown2Px.esm-39030ee0.js');
 var React = require('react');
 var BrandLogo = require('./BrandLogo-aea340c8.js');
-var Curve = require('./Curve-d038052b.js');
+var Curve = require('./Curve-b5117889.js');
 var Section = require('./Section-59804166.js');
 var Surface = require('./Surface-038db6e1.js');
 var handleLinkClick = require('./handle-link-click-17a44cf4.js');

package/dist/_shared/cjs/{SiteHeader.rehydrator-b76b0889.js → SiteHeader.rehydrator-9d8f3dad.js}

@@ -517,7 +517,11 @@ var defaultContext = { transparent: false };
 var Context = React.createContext(defaultContext);
 var Provider = Context.Provider;
 /**
- * Use `SiteHeader` to display brand logo and navigation at the top of a page.
+#### Deprecation Notice
+
+The `SiteHeader` component has been superseded by `SiteHeaderV2` and therefore is being deprecated from Arc and will be removed in a future release.
+
+Do not use `SiteHeader` for any new work, and prepare to update any design that features it to replace it with `SiteHeaderV2`.
  */
 var SiteHeader = function (_a) {
     var _b;

package/dist/_shared/cjs/{TextInput-8912dd41.js → TextInput-8d139489.js}

@@ -41,7 +41,7 @@ var useNumericInput = function (props) {
 
 var TextInputComponent = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.defaultValue, defaultValue = _c === void 0 ? "" : _c, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, inputMode = _a.inputMode, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, label = _a.label, _g = _a.labelSize, labelSize = _g === void 0 ? "l" : _g, maxLength = _a.maxLength, minLength = _a.minLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, placeholder = _a.placeholder, onClickDisclosure = _a.onClickDisclosure, pattern = _a.pattern, _h = _a.type, type = _h === void 0 ? "text" : _h, _j = _a.showPassword, showPassword = _j === void 0 ? false : _j, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, _k = _a.inputSize, inputSize = _k === void 0 ? "m" : _k, iconButton = _a.iconButton, prefix = _a.prefix, suffix = _a.suffix, _l = _a.inputAlignment, inputAlignment = _l === void 0 ? "left" : _l, width = _a.width, props = filterDataAttrs.__rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "inputMode", "isDisabled", "isReadOnly", "isRequired", "label", "labelSize", "maxLength", "minLength", "name", "onBlur", "onChange", "placeholder", "onClickDisclosure", "pattern", "type", "showPassword", "value", "disclosureTitle", "disclosureText", "inputSize", "iconButton", "prefix", "suffix", "inputAlignment", "width"]);
+    var _c = _a.defaultValue, defaultValue = _c === void 0 ? "" : _c, errorMessage = _a.errorMessage, helper = _a.helper, hideLabel = _a.hideLabel, id = _a.id, inputMode = _a.inputMode, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = _a.isReadOnly, isReadOnly = _e === void 0 ? false : _e, _f = _a.isRequired, isRequired = _f === void 0 ? false : _f, label = _a.label, _g = _a.labelSize, labelSize = _g === void 0 ? "l" : _g, maxLength = _a.maxLength, minLength = _a.minLength, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, placeholder = _a.placeholder, onClickDisclosure = _a.onClickDisclosure, pattern = _a.pattern, _h = _a.type, type = _h === void 0 ? "text" : _h, _j = _a.showPassword, showPassword = _j === void 0 ? false : _j, value = _a.value, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, _k = _a.inputSize, inputSize = _k === void 0 ? "m" : _k, iconButton = _a.iconButton, prefix = _a.prefix, suffix = _a.suffix, _l = _a.inputAlignment, inputAlignment = _l === void 0 ? "left" : _l, width = _a.width, autoComplete = _a.autoComplete, props = filterDataAttrs.__rest(_a, ["defaultValue", "errorMessage", "helper", "hideLabel", "id", "inputMode", "isDisabled", "isReadOnly", "isRequired", "label", "labelSize", "maxLength", "minLength", "name", "onBlur", "onChange", "placeholder", "onClickDisclosure", "pattern", "type", "showPassword", "value", "disclosureTitle", "disclosureText", "inputSize", "iconButton", "prefix", "suffix", "inputAlignment", "width", "autoComplete"]);
     var surface = React.useContext(Surface.Context).surface;
     var _m = React.useState(false), showPasswordToggle = _m[0], setShowPasswordToggle = _m[1];
     var inferredInputProps = useNumericInput({
@@ -77,7 +77,7 @@ var TextInputComponent = React.forwardRef(function (_a, ref) {
         React__default["default"].createElement(FormControl.FormControl, { errorMessage: errorMessage, helper: helper, htmlFor: id, isDisabled: isDisabled, label: label, hideLabel: hideLabel, labelSize: labelSize, requirementStatus: isRequired ? "required" : "optional", disclosureTitle: disclosureTitle, disclosureText: disclosureText, onClickDisclosure: onClickDisclosure },
             React__default["default"].createElement("div", { className: "arc-TextInput-inputWrapper", style: { width: width } },
                 prefix && (React__default["default"].createElement("span", { className: "arc-TextInput-prefix", "aria-hidden": true }, prefix)),
-                React__default["default"].createElement("input", filterDataAttrs.__assign({ placeholder: placeholder, "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-TextInput-input", defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, id: id, maxLength: maxLength, minLength: minLength, name: name, onChange: onChange, onBlur: onBlur, readOnly: isReadOnly, ref: ref, required: isRequired, value: typeof value !== "undefined" ? value : undefined }, inferredInputProps)),
+                React__default["default"].createElement("input", filterDataAttrs.__assign({ placeholder: placeholder, "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", className: "arc-TextInput-input", defaultValue: typeof value !== "undefined" ? undefined : defaultValue, disabled: isDisabled, id: id, maxLength: maxLength, minLength: minLength, name: name, onChange: onChange, onBlur: onBlur, readOnly: isReadOnly, ref: ref, required: isRequired, value: typeof value !== "undefined" ? value : undefined, autoComplete: autoComplete }, inferredInputProps)),
                 iconButton && !showPassword && (React__default["default"].createElement("div", { className: "arc-TextInput-additionalControl" },
                     React__default["default"].createElement("button", { ref: iconButton.ref, className: "arc-TextInput-iconButton", disabled: isReadOnly || isDisabled, "aria-label": iconButton.label, onFocus: iconButton.onFocus, onClick: function (e) {
                             e.preventDefault();