@arc-ui/components 11.4.2 → 11.5.0

package/dist/_shared/cjs/DisclosureMini-5af13d3c.d.ts

@@ -0,0 +1,37 @@
+import { FC, ReactNode } from "react";
+/**
+ * Use `DisclosureMini` to display content that is only visible when toggled into
+ * an "open" state.
+ */
+declare const DisclosureMini: FC<DisclosureMiniProps>;
+interface DisclosureMiniProps {
+    /**
+     * Content to display in the DisclosureMini.
+     */
+    children: ReactNode;
+    /**
+     * DisclosureMini ID.
+     */
+    id?: string;
+    /**
+     * The DisclosureMini summary text.
+     */
+    summary: string;
+    /**
+     * Should the Disclosure content be open by default?
+     */
+    isOpen?: boolean;
+    /**
+     * Position of the DisclosureMini icon?
+     */
+    iconPosition?: "left" | "right";
+    /**
+     * On Click handler for DisclosureMini summary disclosure.
+     */
+    onClick?: () => void;
+    /**
+     * Disclosure size.
+     */
+    size?: "s" | "l";
+}
+export { DisclosureMini, DisclosureMiniProps };

package/dist/_shared/cjs/DisclosureMini-5af13d3c.js

@@ -0,0 +1,42 @@
+'use strict';
+
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
+var React = require('react');
+var BtIconChevronDown2Px = require('./BtIconChevronDown2Px-8fb4e2eb.js');
+var Text = require('./Text-6f2827e6.js');
+var Surface = require('./Surface-6da0a78e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Use `DisclosureMini` to display content that is only visible when toggled into
+ * an "open" state.
+ */
+var DisclosureMini = function (_a) {
+    var children = _a.children, summary = _a.summary, onClick = _a.onClick, id = _a.id, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.iconPosition, iconPosition = _c === void 0 ? "left" : _c, _d = _a.size, size = _d === void 0 ? "l" : _d, props = filterDataAttrs.__rest(_a, ["children", "summary", "onClick", "id", "isOpen", "iconPosition", "size"]);
+    var surface = React.useContext(Surface.Context).surface;
+    var _e = React.useState(false), disclousreState = _e[0], setDisclosureState = _e[1];
+    var handleOnClick = function () {
+        onClick && onClick();
+        setDisclosureState(function (prevState) { return !prevState; });
+    };
+    return (React__default["default"].createElement("details", filterDataAttrs.__assign({ "data-testid": "DisclosureMini", className: index.classNames({
+            "arc-DisclosureMini": true,
+            "arc-DisclosureMini--onDarkSurface": surface === "dark"
+        }), open: isOpen }, filterDataAttrs.filterDataAttrs(props)),
+        React__default["default"].createElement("summary", { "data-testid": "DisclosureMiniSummary", className: index.classNames("arc-DisclosureMini-summary", {
+                "arc-DisclosureMini-summary--icon-left": iconPosition === "left",
+                "arc-DisclosureMini-summary--icon-right": iconPosition === "right"
+            }), onClick: handleOnClick, "aria-expanded": disclousreState },
+            React__default["default"].createElement("span", { className: "arc-DisclosureMini-summary-icon" },
+                React__default["default"].createElement(BtIconChevronDown2Px.BtIconChevronDown2Px_2, null)),
+            React__default["default"].createElement(Text.Text, { size: size === "l" ? "m" : "s" }, summary)),
+        React__default["default"].createElement("div", { className: "arc-DisclosureMini-details" },
+            React__default["default"].createElement(Text.Text, { size: size === "l" ? "m" : "s" },
+                React__default["default"].createElement("span", { id: id }, children)))));
+};
+
+exports.DisclosureMini = DisclosureMini;

package/dist/_shared/cjs/{FormControl-d4d9c665.d.ts → FormControl-42360ae8.d.ts}

@@ -1,33 +1,6 @@
 /// <reference types="react" />
 import React from "react";
-import { FC, ReactNode } from "react";
-/**
- * Use `FormControlDisclosure` to display content that is only visible when toggled into
- * an "open" state.
- */
-declare const FormControlDisclosure: FC<FormControlDisclosureProps>;
-interface FormControlDisclosureProps {
-    /**
-     * Content to display in the FormControlDisclosure.
-     */
-    children: ReactNode;
-    /**
-     * FormControlDisclosure ID.
-     */
-    id?: string;
-    /**
-     * The FormControlDisclosure summary text.
-     */
-    summary: string;
-    /**
-     * On Click handler for FormControlDisclosure summary disclosure.
-     */
-    onClick?: () => void;
-    /**
-     * Disclosure size.
-     */
-    size?: "s" | "l";
-}
+import { FC } from "react";
 /**
  * Optionally define ariaDescribedBy if errorMessage or helper exist.
  */
@@ -119,4 +92,4 @@ interface FormControlProps {
      */
     helperUnderLabel?: boolean;
 }
-export { FormControlDisclosure, FormControlDisclosureProps, useAriaDescribedby, FormControl, FormControlProps, Context as FormControlContext };
+export { useAriaDescribedby, FormControl, FormControlProps, Context as FormControlContext };

package/dist/_shared/cjs/{FormControl-d4d9c665.js → FormControl-42360ae8.js}

@@ -1,15 +1,16 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
-var React$1 = require('react');
-var Surface = require('./Surface-d6b8010e.js');
-var Text = require('./Text-1d3844be.js');
-var BtIconChevronRightMid = require('./BtIconChevronRightMid-5a38d855.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
+var React = require('react');
+var BtIconAlert = require('./BtIconAlert-637db790.js');
+var Surface = require('./Surface-6da0a78e.js');
+var DisclosureMini = require('./DisclosureMini-5af13d3c.js');
+var VerticalSpace = require('./VerticalSpace-86f697e7.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 /**
  * Optionally define ariaDescribedBy if errorMessage or helper exist.
@@ -38,71 +39,17 @@ var useAriaDescribedby = function (_a) {
     return { ariaDescribedby: ariaDescribedby, idError: idError, idHelper: idHelper, idDisclosure: idDisclosure };
 };
 
-const React = React__default["default"];
-const BtIconAlert = 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:
-        "M16,2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Zm0,27A13,13,0,1,1,29,16,13.01474,13.01474,0,0,1,16,29Z",
-      fill: "currentColor"
-    }),
-    /*#__PURE__*/ React.createElement("path", {
-      fill: "currentColor",
-      d: "M16 20.99335A1 1 0 1 0 16 22.99335 1 1 0 1 0 16 20.99335z"
-    }),
-    /*#__PURE__*/ React.createElement("path", {
-      d:
-        "M16.00488,19.00977a.49972.49972,0,0,0,.5-.5L16.50684,9.5a.5.5,0,0,0-1,0l-.002,9.00977A.5.5,0,0,0,16.00488,19.00977Z",
-      fill: "currentColor"
-    })
-  );
-var BtIconAlert_2 = BtIconAlert;
-
-/**
- * Use `FormControlDisclosure` to display content that is only visible when toggled into
- * an "open" state.
- */
-var FormControlDisclosure = function (_a) {
-    var children = _a.children, summary = _a.summary, onClick = _a.onClick, _b = _a.size, size = _b === void 0 ? "l" : _b, id = _a.id, props = index.__rest(_a, ["children", "summary", "onClick", "size", "id"]);
-    var surface = React$1.useContext(Surface.Context).surface;
-    var _c = React$1.useState(false), disclousreState = _c[0], setDisclosureState = _c[1];
-    var handleOnClick = function () {
-        onClick && onClick();
-        setDisclosureState(function (prevState) { return !prevState; });
-    };
-    return (React__default["default"].createElement("details", index.__assign({ className: index$1.classNames({
-            "arc-FormControlDisclosure": true,
-            "arc-FormControlDisclosure--onDarkSurface": surface === "dark"
-        }) }, index.filterDataAttrs(props), { "data-testid": "FormControlDisclosure" }),
-        React__default["default"].createElement("summary", { className: "arc-FormControlDisclosure-summary", onClick: handleOnClick, "aria-expanded": disclousreState },
-            React__default["default"].createElement("span", { className: "arc-FormControlDisclosure-summary-icon" },
-                React__default["default"].createElement(BtIconChevronRightMid.BtIconChevronRightMid_2, null)),
-            React__default["default"].createElement(Text.Text, { size: size === "l" ? "m" : "s" }, summary)),
-        React__default["default"].createElement("div", { className: "arc-FormControlDisclosure-details" },
-            React__default["default"].createElement(Text.Text, { size: size === "l" ? "m" : "s" },
-                React__default["default"].createElement("span", { id: id }, children)))));
-};
-
 var defaultContext = {
     requirementStatus: null
 };
-var Context = React$1.createContext(defaultContext);
+var Context = React.createContext(defaultContext);
 var Provider = Context.Provider;
 /**
  * Use `FormControl` to provide inputs with labels, helper text and error messages
  */
 var FormControl = function (_a) {
-    var children = _a.children, _b = _a.elementType, ElementType = _b === void 0 ? "div" : _b, errorMessage = _a.errorMessage, helper = _a.helper, htmlFor = _a.htmlFor, id = _a.id, label = _a.label, _c = _a.labelSize, labelSize = _c === void 0 ? "l" : _c, _d = _a.requirementStatus, requirementStatus = _d === void 0 ? "optional" : _d, _e = _a.helperUnderLabel, helperUnderLabel = _e === void 0 ? false : _e, isDisabled = _a.isDisabled, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, props = index.__rest(_a, ["children", "elementType", "errorMessage", "helper", "htmlFor", "id", "label", "labelSize", "requirementStatus", "helperUnderLabel", "isDisabled", "disclosureTitle", "disclosureText", "onClickDisclosure"]);
-    var surface = React$1.useContext(Surface.Context).surface;
+    var children = _a.children, _b = _a.elementType, ElementType = _b === void 0 ? "div" : _b, errorMessage = _a.errorMessage, helper = _a.helper, htmlFor = _a.htmlFor, id = _a.id, label = _a.label, _c = _a.labelSize, labelSize = _c === void 0 ? "l" : _c, _d = _a.requirementStatus, requirementStatus = _d === void 0 ? "optional" : _d, _e = _a.helperUnderLabel, helperUnderLabel = _e === void 0 ? false : _e, isDisabled = _a.isDisabled, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, props = filterDataAttrs.__rest(_a, ["children", "elementType", "errorMessage", "helper", "htmlFor", "id", "label", "labelSize", "requirementStatus", "helperUnderLabel", "isDisabled", "disclosureTitle", "disclosureText", "onClickDisclosure"]);
+    var surface = React.useContext(Surface.Context).surface;
     var _f = useAriaDescribedby({
         disclosureText: disclosureText,
         errorMessage: errorMessage,
@@ -125,24 +72,25 @@ var FormControl = function (_a) {
         elementProps["aria-describedby"] = ariaDescribedby;
     }
     return (React__default["default"].createElement(Provider, { value: { requirementStatus: requirementStatus } },
-        React__default["default"].createElement(ElementType, index.__assign({ className: index$1.classNames({
+        React__default["default"].createElement(ElementType, filterDataAttrs.__assign({ className: index.classNames({
                 "arc-FormControl": true,
                 "arc-FormControl--isDisabled": isDisabled,
                 "arc-FormControl--smallLabel": labelSize === "s",
                 "arc-FormControl--onDarkSurface": surface === "dark"
-            }), id: id }, elementProps, index.filterDataAttrs(props)),
-            React__default["default"].createElement(LabelType, index.__assign({ className: "arc-FormControl-label" }, labelProps),
+            }), id: id }, elementProps, filterDataAttrs.filterDataAttrs(props)),
+            React__default["default"].createElement(LabelType, filterDataAttrs.__assign({ className: "arc-FormControl-label" }, labelProps),
                 label,
                 requirementStatus === "optional" && (React__default["default"].createElement("span", { className: "arc-FormControl-labelOptional" }, "(optional)"))),
             helperUnderLabel && (React__default["default"].createElement(React__default["default"].Fragment, null, helper && (React__default["default"].createElement("div", { className: "arc-FormControl-helper arc-FormControl-helper--underLabel", id: idHelper }, helper)))),
             children,
             !helperUnderLabel && (React__default["default"].createElement(React__default["default"].Fragment, null, errorMessage ? (React__default["default"].createElement("div", { className: "arc-FormControl-error", id: idError },
                 React__default["default"].createElement("span", { className: "arc-FormControl-error--icon" },
-                    React__default["default"].createElement(BtIconAlert_2, null)),
-                errorMessage)) : disclosureTitle ? (React__default["default"].createElement(FormControlDisclosure, { onClick: onClickDisclosure, summary: disclosureTitle, size: labelSize, id: idDisclosure }, disclosureText)) : (helper && (React__default["default"].createElement("div", { className: "arc-FormControl-helper", id: idHelper }, helper))))))));
+                    React__default["default"].createElement(BtIconAlert.BtIconAlert_2, null)),
+                errorMessage)) : disclosureTitle ? (React__default["default"].createElement(React__default["default"].Fragment, null,
+                React__default["default"].createElement(VerticalSpace.VerticalSpace, { size: "12" }),
+                React__default["default"].createElement(DisclosureMini.DisclosureMini, { onClick: onClickDisclosure, summary: disclosureTitle, size: labelSize, id: idDisclosure }, disclosureText))) : (helper && (React__default["default"].createElement("div", { className: "arc-FormControl-helper", id: idHelper }, helper))))))));
 };
 
-exports.BtIconAlert_2 = BtIconAlert_2;
 exports.Context = Context;
 exports.FormControl = FormControl;
 exports.useAriaDescribedby = useAriaDescribedby;

package/dist/_shared/cjs/{Heading-cc38c3ec.js → Heading-d45f6a7f.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
-var suffixModifier = require('./suffix-modifier-edf7851e.js');
-var Surface = require('./Surface-d6b8010e.js');
+var suffixModifier = require('./suffix-modifier-1ee2da04.js');
+var Surface = require('./Surface-6da0a78e.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -15,13 +15,13 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  */
 var Heading = function (_a) {
     var _b;
-    var _c = _a.align, align = _c === void 0 ? "left" : _c, _d = _a.casing, casing = _d === void 0 ? "auto" : _d, children = _a.children, _e = _a.color, color = _e === void 0 ? "auto" : _e, level = _a.level, size = _a.size, props = index.__rest(_a, ["align", "casing", "children", "color", "level", "size"]);
+    var _c = _a.align, align = _c === void 0 ? "left" : _c, _d = _a.casing, casing = _d === void 0 ? "auto" : _d, children = _a.children, _e = _a.color, color = _e === void 0 ? "auto" : _e, level = _a.level, size = _a.size, props = filterDataAttrs.__rest(_a, ["align", "casing", "children", "color", "level", "size"]);
     var surface = React.useContext(Surface.Context).surface;
     var Element = "span";
     if (level) {
         Element = "h".concat(level);
     }
-    return (React__default["default"].createElement(Element, index.__assign({ className: index$1.classNames((_b = {
+    return (React__default["default"].createElement(Element, filterDataAttrs.__assign({ className: index.classNames((_b = {
                 "arc-Heading": true
             },
             _b[suffixModifier.suffixModifier("arc-Heading--align", align)] = align && align !== "left",
@@ -29,7 +29,7 @@ var Heading = function (_a) {
             _b["arc-Heading--casingNone"] = casing === "none",
             _b["arc-Heading--colorBrand"] = color === "brand",
             _b["arc-Heading--onDarkSurface"] = surface === "dark",
-            _b)) }, index.filterDataAttrs(props)), children));
+            _b)) }, filterDataAttrs.filterDataAttrs(props)), children));
 };
 var HeadingProposition = function (_a) {
     var children = _a.children;

package/dist/_shared/cjs/{Icon-719d13d4.js → Icon-9ae8dbe1.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
 var React$1 = require('react');
-var index$1 = require('./index-45bfb67b.js');
-var suffixModifier = require('./suffix-modifier-edf7851e.js');
-var Surface = require('./Surface-d6b8010e.js');
+var index = require('./index-45bfb67b.js');
+var suffixModifier = require('./suffix-modifier-1ee2da04.js');
+var Surface = require('./Surface-6da0a78e.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -34,10 +34,10 @@ var ArcIconArc_2 = ArcIconArc;
  */
 var Icon = function (_a) {
     var _b;
-    var testId = _a.testId, _c = _a.color, color = _c === void 0 ? "auto" : _c, _d = _a.icon, icon = _d === void 0 ? ArcIconArc_2 : _d, _e = _a.isInline, isInline = _e === void 0 ? false : _e, label = _a.label, size = _a.size, props = index.__rest(_a, ["testId", "color", "icon", "isInline", "label", "size"]);
+    var testId = _a.testId, _c = _a.color, color = _c === void 0 ? "auto" : _c, _d = _a.icon, icon = _d === void 0 ? ArcIconArc_2 : _d, _e = _a.isInline, isInline = _e === void 0 ? false : _e, label = _a.label, size = _a.size, props = filterDataAttrs.__rest(_a, ["testId", "color", "icon", "isInline", "label", "size"]);
     var surface = React$1.useContext(Surface.Context).surface;
     var Icon = icon;
-    return (React__default["default"].createElement("span", index.__assign({ "data-testid": testId, "aria-label": label, className: index$1.classNames((_b = {},
+    return (React__default["default"].createElement("span", filterDataAttrs.__assign({ "data-testid": testId, "aria-label": label, className: index.classNames((_b = {},
             _b["arc-Icon"] = true,
             _b[suffixModifier.suffixModifier("arc-Icon--color", color)] = color !== "auto",
             _b["arc-Icon--inline"] = isInline,
@@ -45,7 +45,7 @@ var Icon = function (_a) {
             _b)), role: label ? "img" : undefined, style: {
             height: size,
             width: size
-        } }, index.filterDataAttrs(props)),
+        } }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement(Icon, null)));
 };
 

package/dist/_shared/cjs/{Image-fe760a06.js → Image-3bf4b4f3.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
-var suffixModifier = require('./suffix-modifier-edf7851e.js');
+var suffixModifier = require('./suffix-modifier-1ee2da04.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -15,7 +15,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  */
 var Image = function (_a) {
     var _b;
-    var alt = _a.alt, _c = _a.anchor, anchor = _c === void 0 ? "C" : _c, children = _a.children, fillColor = _a.fillColor, fit = _a.fit, height = _a.height, loading = _a.loading, overlay = _a.overlay, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet, width = _a.width, props = index.__rest(_a, ["alt", "anchor", "children", "fillColor", "fit", "height", "loading", "overlay", "sizes", "src", "srcSet", "width"]);
+    var alt = _a.alt, _c = _a.anchor, anchor = _c === void 0 ? "C" : _c, children = _a.children, fillColor = _a.fillColor, fit = _a.fit, height = _a.height, loading = _a.loading, overlay = _a.overlay, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet, width = _a.width, props = filterDataAttrs.__rest(_a, ["alt", "anchor", "children", "fillColor", "fit", "height", "loading", "overlay", "sizes", "src", "srcSet", "width"]);
     React.useEffect(function () {
         React__default["default"].Children.map(children, function (item) {
             if (item && item.type !== ImageSource) {
@@ -24,20 +24,20 @@ var Image = function (_a) {
         });
     }, [children]);
     var img = (React__default["default"].createElement("img", { className: "arc-Image-img", alt: alt, height: fit === "cover" ? undefined : height, loading: loading, sizes: children ? undefined : sizes, src: src, srcSet: children ? undefined : srcSet, width: fit === "cover" ? undefined : width }));
-    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames((_b = {
                 "arc-Image": true,
                 "arc-Image--cover": fit === "cover"
             },
             _b["arc-Image--anchor".concat(anchor)] = fit === "cover",
             _b[suffixModifier.suffixModifier("arc-Image--overlay", overlay || "")] = overlay,
-            _b)), style: index.__assign(index.__assign(index.__assign({}, (fillColor && { backgroundColor: fillColor })), (fit === "cover" && height ? { height: "".concat(height, "px") } : null)), (fit === "cover" && width ? { width: "".concat(width, "px") } : null)) }, index.filterDataAttrs(props)), children ? (React__default["default"].createElement("picture", null,
+            _b)), style: filterDataAttrs.__assign(filterDataAttrs.__assign(filterDataAttrs.__assign({}, (fillColor && { backgroundColor: fillColor })), (fit === "cover" && height ? { height: "".concat(height, "px") } : null)), (fit === "cover" && width ? { width: "".concat(width, "px") } : null)) }, filterDataAttrs.filterDataAttrs(props)), children ? (React__default["default"].createElement("picture", null,
         children,
         " ",
         img)) : (React__default["default"].createElement(React__default["default"].Fragment, null, img))));
 };
 var ImageSource = function (_a) {
-    var height = _a.height, media = _a.media, srcSet = _a.srcSet, sizes = _a.sizes, type = _a.type; _a.width; var props = index.__rest(_a, ["height", "media", "srcSet", "sizes", "type", "width"]);
-    return (React__default["default"].createElement("source", index.__assign({ height: height, media: media, sizes: sizes, srcSet: srcSet, type: type }, index.filterDataAttrs(props))));
+    var height = _a.height, media = _a.media, srcSet = _a.srcSet, sizes = _a.sizes, type = _a.type; _a.width; var props = filterDataAttrs.__rest(_a, ["height", "media", "srcSet", "sizes", "type", "width"]);
+    return (React__default["default"].createElement("source", filterDataAttrs.__assign({ height: height, media: media, sizes: sizes, srcSet: srcSet, type: type }, filterDataAttrs.filterDataAttrs(props))));
 };
 ImageSource.displayName = "Image.Source";
 Image.Source = ImageSource;

package/dist/_shared/cjs/{Section-780f2377.js → Section-48aca5f5.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -12,12 +12,12 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * Use `Section` to compose content into vertical page layouts.
  */
 var Section = function (_a) {
-    var children = _a.children, _b = _a.isFullWidth, isFullWidth = _b === void 0 ? false : _b, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, props = index.__rest(_a, ["children", "isFullWidth", "isDebugVisible"]);
-    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames({
+    var children = _a.children, _b = _a.isFullWidth, isFullWidth = _b === void 0 ? false : _b, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, props = filterDataAttrs.__rest(_a, ["children", "isFullWidth", "isDebugVisible"]);
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames({
             "arc-Section": true,
             "arc-Section--fullWidth": isFullWidth,
             "arc-Section--debugVisible": isDebugVisible
-        }) }, index.filterDataAttrs(props)), children));
+        }) }, filterDataAttrs.filterDataAttrs(props)), children));
 };
 
 exports.Section = Section;

package/dist/_shared/cjs/{Surface-d6b8010e.js → Surface-6da0a78e.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -16,7 +16,7 @@ var Provider = Context.Provider;
  */
 var Surface = function (_a) {
     var _b;
-    var background = _a.background, children = _a.children, _c = _a.growVertically, growVertically = _c === void 0 ? false : _c, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, props = index.__rest(_a, ["background", "children", "growVertically", "padding", "paddingHorizontal", "paddingVertical"]);
+    var background = _a.background, children = _a.children, _c = _a.growVertically, growVertically = _c === void 0 ? false : _c, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, props = filterDataAttrs.__rest(_a, ["background", "children", "growVertically", "padding", "paddingHorizontal", "paddingVertical"]);
     var surface = "light";
     if (background === "black" ||
         background === "brand" ||
@@ -26,16 +26,16 @@ var Surface = function (_a) {
         surface = "dark";
     }
     return (React__default["default"].createElement(Provider, { value: { surface: surface } },
-        React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {
+        React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames((_b = {
                     "arc-Surface": true
                 },
                 _b["arc-Surface--".concat(background &&
-                    index.camelCase(background), "Background")] = background,
+                    filterDataAttrs.camelCase(background), "Background")] = background,
                 _b["arc-Surface--growVertically"] = growVertically,
                 _b["arc-Surface--padding".concat(padding)] = padding,
                 _b["arc-Surface--paddingHorizontal".concat(paddingHorizontal)] = paddingHorizontal,
                 _b["arc-Surface--paddingVertical".concat(paddingVertical)] = paddingVertical,
-                _b)) }, index.filterDataAttrs(props)), children)));
+                _b)) }, filterDataAttrs.filterDataAttrs(props)), children)));
 };
 var backgroundsShared = [
     "black",
@@ -49,8 +49,8 @@ var backgroundsShared = [
     "lighter",
     "white"
 ];
-var backgrounds = index.__spreadArray([], backgroundsShared, true);
-var backgroundsBT = index.__spreadArray([], backgroundsShared, true);
+var backgrounds = filterDataAttrs.__spreadArray([], backgroundsShared, true);
+var backgroundsBT = filterDataAttrs.__spreadArray([], backgroundsShared, true);
 
 exports.Context = Context;
 exports.Surface = Surface;

package/dist/_shared/cjs/{Text-1d3844be.js → Text-6f2827e6.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
-var suffixModifier = require('./suffix-modifier-edf7851e.js');
-var Surface = require('./Surface-d6b8010e.js');
+var suffixModifier = require('./suffix-modifier-1ee2da04.js');
+var Surface = require('./Surface-6da0a78e.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -15,9 +15,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  */
 var Text = function (_a) {
     var _b;
-    var _c = _a.align, align = _c === void 0 ? "left" : _c, children = _a.children, _d = _a.isInline, isInline = _d === void 0 ? false : _d, _e = _a.isMeasured, isMeasured = _e === void 0 ? false : _e, _f = _a.size, size = _f === void 0 ? "m" : _f, _g = _a.tone, tone = _g === void 0 ? "default" : _g, props = index.__rest(_a, ["align", "children", "isInline", "isMeasured", "size", "tone"]);
+    var _c = _a.align, align = _c === void 0 ? "left" : _c, children = _a.children, _d = _a.isInline, isInline = _d === void 0 ? false : _d, _e = _a.isMeasured, isMeasured = _e === void 0 ? false : _e, _f = _a.size, size = _f === void 0 ? "m" : _f, _g = _a.tone, tone = _g === void 0 ? "default" : _g, props = filterDataAttrs.__rest(_a, ["align", "children", "isInline", "isMeasured", "size", "tone"]);
     var surface = React.useContext(Surface.Context).surface;
-    return (React__default["default"].createElement("span", index.__assign({ className: index$1.classNames((_b = {
+    return (React__default["default"].createElement("span", filterDataAttrs.__assign({ className: index.classNames((_b = {
                 "arc-Text": true
             },
             _b[suffixModifier.suffixModifier("arc-Text--align", align)] = align !== "left",
@@ -26,7 +26,7 @@ var Text = function (_a) {
             _b["arc-Text--size".concat(size && size.toUpperCase())] = size && size !== "m",
             _b["arc-Text--".concat(tone)] = tone !== "default",
             _b["arc-Text--onDarkSurface"] = surface === "dark",
-            _b)) }, index.filterDataAttrs(props)), children));
+            _b)) }, filterDataAttrs.filterDataAttrs(props)), children));
 };
 
 exports.Text = Text;

package/dist/_shared/cjs/{VerticalSpace-7aed88ab.js → VerticalSpace-86f697e7.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
-var index$1 = require('./index-45bfb67b.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
+var index = require('./index-45bfb67b.js');
 var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -13,8 +13,8 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  */
 var VerticalSpace = function (_a) {
     var _b;
-    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, props = index.__rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL"]);
-    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {
+    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, props = filterDataAttrs.__rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL"]);
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames((_b = {
                 "arc-VerticalSpace": true
             },
             _b["arc-VerticalSpace--size".concat(size)] = size,
@@ -23,7 +23,7 @@ var VerticalSpace = function (_a) {
             _b["arc-VerticalSpace--sizeL".concat(sizeL)] = sizeL && sizeL,
             _b["arc-VerticalSpace--sizeXL".concat(sizeXL)] = sizeXL && sizeXL,
             _b["arc-VerticalSpace--debugVisible"] = isDebugVisible,
-            _b)) }, index.filterDataAttrs(props))));
+            _b)) }, filterDataAttrs.filterDataAttrs(props))));
 };
 
 exports.VerticalSpace = VerticalSpace;

package/dist/_shared/cjs/{index-78b35bc1.js → filter-data-attrs-a30dcf5f.js}

@@ -86,18 +86,6 @@ function __spreadArray(to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 }
 
-var dataAttrRe = /^(data-.*)$/;
-var filterDataAttrs = function (props) {
-    var filteredProps = {};
-    for (var prop in props) {
-        if (Object.prototype.hasOwnProperty.call(props, prop) &&
-            dataAttrRe.test(prop)) {
-            filteredProps[prop] = props[prop];
-        }
-    }
-    return filteredProps;
-};
-
 var camelcase = {exports: {}};
 
 const UPPERCASE = /[\p{Lu}]/u;
@@ -207,6 +195,18 @@ camelcase.exports.default = camelCase;
 
 var camelCase$1 = camelcase.exports;
 
+var dataAttrRe = /^(data-.*)$/;
+var filterDataAttrs = function (props) {
+    var filteredProps = {};
+    for (var prop in props) {
+        if (Object.prototype.hasOwnProperty.call(props, prop) &&
+            dataAttrRe.test(prop)) {
+            filteredProps[prop] = props[prop];
+        }
+    }
+    return filteredProps;
+};
+
 exports.__awaiter = __awaiter;
 exports.__generator = __generator;
 exports.__rest = __rest;

package/dist/_shared/cjs/index-9483ad5f.d.ts

@@ -10,5 +10,5 @@ declare const anchorPoints: readonly [
     "C"
 ];
 export { anchorPoints };
-export * from "./index-78b35bc1";
-export * from "./suffix-modifier-edf7851e";
+export * from "./filter-data-attrs-a30dcf5f";
+export * from "./suffix-modifier-1ee2da04";

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

@@ -1,4 +1,4 @@
-export * from "./FormControl-d4d9c665";
+export * from "./FormControl-42360ae8";
 export * from "../../Card/Card.cjs";
 export * from "./index.es-77def0c9";
 export * from "../../TextInput/TextInput.cjs";

package/dist/_shared/cjs/{suffix-modifier-edf7851e.js → suffix-modifier-1ee2da04.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-78b35bc1.js');
+var filterDataAttrs = require('./filter-data-attrs-a30dcf5f.js');
 
 /**
  * Suffixes a modifier value onto the end of a className, converting it to
@@ -11,7 +11,7 @@ var index = require('./index-78b35bc1.js');
  * @param suffix The suffix to convert into pascal case.
  */
 var suffixModifier = function (rootClassName, suffix) {
-    return "".concat(rootClassName).concat(index.camelCase(suffix, {
+    return "".concat(rootClassName).concat(filterDataAttrs.camelCase(suffix, {
         pascalCase: true
     }));
 };

package/dist/_shared/esm/{Base-c235dc45.js → Base-6c01e0ec.js}

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from './filter-data-attrs-afdb7d32.js';
 import React__default, { createContext } from 'react';
 
 var ArcRootElementContext = createContext(null);

package/dist/_shared/esm/{BrandLogo-4f13fe85.js → BrandLogo-56699561.js}

@@ -1,8 +1,8 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from './index-229fc864.js';
+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 } from 'react';
-import { s as suffixModifier } from './suffix-modifier-f5e28822.js';
-import { C as Context } from './Surface-bf201530.js';
+import { s as suffixModifier } from './suffix-modifier-7e640670.js';
+import { C as Context } from './Surface-bb100ef8.js';
 
 /**
  * Use `BrandLogo` to display the brand logo.