@arc-ui/components 11.4.1 → 11.5.0

package/dist/Button/Button.cjs.js

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Button = require('../_shared/cjs/Button-1af6868c.js');
-require('../_shared/cjs/index-78b35bc1.js');
+var Button = require('../_shared/cjs/Button-5dff284a.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 require('react');
 require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
 require('../_shared/cjs/index-45bfb67b.js');
-require('../_shared/cjs/suffix-modifier-edf7851e.js');
-require('../_shared/cjs/Icon-719d13d4.js');
-require('../_shared/cjs/Surface-d6b8010e.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/Icon-9ae8dbe1.js');
+require('../_shared/cjs/Surface-6da0a78e.js');
 
 
 

package/dist/Button/Button.esm.d.ts

@@ -1 +1 @@
-export { Button } from "../_shared/esm/Button-10700df4";
+export { Button } from "../_shared/esm/Button-61241dd0";

package/dist/Button/Button.esm.js

@@ -1,8 +1,8 @@
-export { B as Button } from '../_shared/esm/Button-10700df4.js';
-import '../_shared/esm/index-229fc864.js';
+export { B as Button } from '../_shared/esm/Button-61241dd0.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import 'react';
 import '../_shared/esm/BtIconChevronRightMid-d9b11761.js';
 import '../_shared/esm/index-2ae58626.js';
-import '../_shared/esm/suffix-modifier-f5e28822.js';
-import '../_shared/esm/Icon-61f7237a.js';
-import '../_shared/esm/Surface-bf201530.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/Icon-fd247973.js';
+import '../_shared/esm/Surface-bb100ef8.js';

package/dist/Card/Card.cjs.js

@@ -2,15 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
-var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+var index = require('../_shared/cjs/index-45bfb67b.js');
 var React = require('react');
 var BtIconChevronRightMid = require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
-var Icon = require('../_shared/cjs/Icon-719d13d4.js');
-var Image = require('../_shared/cjs/Image-fe760a06.js');
-var Heading = require('../_shared/cjs/Heading-cc38c3ec.js');
-var suffixModifier = require('../_shared/cjs/suffix-modifier-edf7851e.js');
-var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+var Icon = require('../_shared/cjs/Icon-9ae8dbe1.js');
+var Image = require('../_shared/cjs/Image-3bf4b4f3.js');
+var Heading = require('../_shared/cjs/Heading-d45f6a7f.js');
+var suffixModifier = require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+var Surface = require('../_shared/cjs/Surface-6da0a78e.js');
 var handleLinkClick = require('../_shared/cjs/handle-link-click-17a44cf4.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -51,7 +51,7 @@ var useInteractionMode = function () {
  */
 var Card = function (_a) {
     var _b;
-    var actionId = _a.actionId, _c = _a.actionLabel, actionLabel = _c === void 0 ? "Read more" : _c, children = _a.children, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, href = _a.href, imageAlt = _a.imageAlt, imageHeight = _a.imageHeight, imageLoading = _a.imageLoading, imageSrc = _a.imageSrc, imageSrcSet = _a.imageSrcSet, linkData = _a.linkData, minHeight = _a.minHeight, onClick = _a.onClick, target = _a.target, title = _a.title, _e = _a.titleSize, titleSize = _e === void 0 ? "s" : _e, props = index.__rest(_a, ["actionId", "actionLabel", "children", "fill", "href", "imageAlt", "imageHeight", "imageLoading", "imageSrc", "imageSrcSet", "linkData", "minHeight", "onClick", "target", "title", "titleSize"]);
+    var actionId = _a.actionId, _c = _a.actionLabel, actionLabel = _c === void 0 ? "Read more" : _c, children = _a.children, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, href = _a.href, imageAlt = _a.imageAlt, imageHeight = _a.imageHeight, imageLoading = _a.imageLoading, imageSrc = _a.imageSrc, imageSrcSet = _a.imageSrcSet, linkData = _a.linkData, minHeight = _a.minHeight, onClick = _a.onClick, target = _a.target, title = _a.title, _e = _a.titleSize, titleSize = _e === void 0 ? "s" : _e, props = filterDataAttrs.__rest(_a, ["actionId", "actionLabel", "children", "fill", "href", "imageAlt", "imageHeight", "imageLoading", "imageSrc", "imageSrcSet", "linkData", "minHeight", "onClick", "target", "title", "titleSize"]);
     var surface = React.useContext(Surface.Context).surface;
     var interactionMode = useInteractionMode().interactionMode;
     var Wrapper = function (_a) {
@@ -59,13 +59,13 @@ var Card = function (_a) {
         return fill === "outlined" || fill === "neutral" ? (React__default["default"].createElement("div", null, children)) : (React__default["default"].createElement(Surface.Surface, { background: surface === "dark" ? "white" : "darker" }, children));
     };
     var coverImage = imageSrc && (React__default["default"].createElement(CardImage, { alt: imageAlt, height: imageHeight, loading: imageLoading, src: imageSrc, srcSet: imageSrcSet }));
-    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-Card": true,
                 "arc-Card--onDarkSurface": surface === "dark"
             },
             _b[suffixModifier.suffixModifier("arc-Card--fill", fill)] = fill !== "solid",
             _b["arc-is-".concat(interactionMode, "InteractionMode")] = interactionMode,
-            _b)) }, index.filterDataAttrs(props)),
+            _b)) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement(Wrapper, null,
             React__default["default"].createElement("div", { className: "arc-Card-inner", style: { minHeight: minHeight } },
                 React__default["default"].createElement("div", { className: "arc-Card-header" },
@@ -83,7 +83,7 @@ var Card = function (_a) {
  */
 var CardBlock = function (_a) {
     var _b = _a.align, align = _b === void 0 ? "left" : _b, children = _a.children, _c = _a.isFullWidth, isFullWidth = _c === void 0 ? false : _c, _d = _a.grow, grow = _d === void 0 ? false : _d;
-    return (React__default["default"].createElement("div", { className: index$1.classNames({
+    return (React__default["default"].createElement("div", { className: index.classNames({
             "arc-Card-block": true,
             "arc-Card-block--alignCenter": align === "center",
             "arc-Card-block--alignRight": align === "right",
@@ -99,7 +99,7 @@ Card.Block = CardBlock;
  */
 var CardImage = function (_a) {
     var _b = _a.alt, alt = _b === void 0 ? "" : _b, _c = _a.height, height = _c === void 0 ? 176 : _c, loading = _a.loading, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet;
-    return (React__default["default"].createElement("div", { className: index$1.classNames({
+    return (React__default["default"].createElement("div", { className: index.classNames({
             "arc-Card-image": true
         }) },
         React__default["default"].createElement(Image.Image, { alt: alt, fit: "cover", height: height, loading: loading, sizes: sizes, src: src, srcSet: srcSet })));
@@ -112,12 +112,12 @@ Card.Image = CardImage;
 var CardLink = function (_a) {
     var actionId = _a.actionId, isButton = _a.isButton, children = _a.children, fill = _a.fill, href = _a.href, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, onClick = _a.onClick, stretch = _a.stretch, target = _a.target;
     var surface = React.useContext(Surface.Context).surface;
-    return (React__default["default"].createElement("a", index.__assign({ onClick: handleLinkClick.handleLinkClick({ handler: onClick }), "aria-describedby": actionId, className: index$1.classNames({
+    return (React__default["default"].createElement("a", filterDataAttrs.__assign({ onClick: handleLinkClick.handleLinkClick({ handler: onClick }), "aria-describedby": actionId, className: index.classNames({
             "arc-Card-link": true,
             "arc-Card-link--button": isButton,
             "arc-Card-link--onDarkSurface": surface === "dark" && fill !== "neutral",
             "arc-Card-link--stretch": stretch
-        }), href: href, rel: target === "_blank" ? "noopener noreferrer" : undefined, tabIndex: isButton ? -1 : undefined, target: target }, index.filterDataAttrs(linkData)),
+        }), href: href, rel: target === "_blank" ? "noopener noreferrer" : undefined, tabIndex: isButton ? -1 : undefined, target: target }, filterDataAttrs.filterDataAttrs(linkData)),
         React__default["default"].createElement("span", { className: "arc-Card-linkText" }, children),
         isButton && (React__default["default"].createElement("span", { className: "arc-Card-linkIcon" },
             React__default["default"].createElement(Icon.Icon, { testId: "cardIcon", icon: BtIconChevronRightMid.BtIconChevronRightMid_2, size: 24 })))));

package/dist/Card/Card.esm.js

@@ -1,12 +1,12 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React__default, { useState, useEffect, useContext } from 'react';
 import { B as BtIconChevronRightMid_2 } from '../_shared/esm/BtIconChevronRightMid-d9b11761.js';
-import { I as Icon } from '../_shared/esm/Icon-61f7237a.js';
-import { I as Image } from '../_shared/esm/Image-c0f3d42f.js';
-import { H as Heading } from '../_shared/esm/Heading-eb1e42db.js';
-import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js';
-import { C as Context, S as Surface } from '../_shared/esm/Surface-bf201530.js';
+import { I as Icon } from '../_shared/esm/Icon-fd247973.js';
+import { I as Image } from '../_shared/esm/Image-3596ce55.js';
+import { H as Heading } from '../_shared/esm/Heading-b61432fb.js';
+import { s as suffixModifier } from '../_shared/esm/suffix-modifier-7e640670.js';
+import { C as Context, S as Surface } from '../_shared/esm/Surface-bb100ef8.js';
 import { h as handleLinkClick } from '../_shared/esm/handle-link-click-f64f55a2.js';
 
 /**

package/dist/Checkbox/Checkbox.cjs.d.ts

@@ -14,6 +14,11 @@ interface CheckboxProps {
      * Helper text for the Checkbox, shown below the label.
      */
     helper?: React.ReactNode;
+    /**
+     * Determine the alignment the Checkbox.
+     *
+     */
+    checkboxAlignment?: "top" | "center";
     /**
      * ID for the Checkbox.
      */
@@ -23,7 +28,7 @@ interface CheckboxProps {
      */
     checked?: boolean;
     /**
-     * Should the Checkbox be disabled?
+     * `isDisabled` is a legacy property and not recommended from a UX usability best practice perspective.
      */
     isDisabled?: boolean;
     /**

package/dist/Checkbox/Checkbox.cjs.js

@@ -2,15 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 var React = require('react');
 var BtIconTickAlt2Px = require('../_shared/cjs/BtIconTickAlt2Px-bdf06f8c.js');
-var FormControl = require('../_shared/cjs/FormControl-d4d9c665.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');
+var BtIconAlert = require('../_shared/cjs/BtIconAlert-637db790.js');
+var index = require('../_shared/cjs/index-45bfb67b.js');
+var FormControl = require('../_shared/cjs/FormControl-42360ae8.js');
+var Surface = require('../_shared/cjs/Surface-6da0a78e.js');
+require('../_shared/cjs/DisclosureMini-5af13d3c.js');
+require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
+require('../_shared/cjs/Text-6f2827e6.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/VerticalSpace-86f697e7.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -20,13 +23,13 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  *  Use `Checkbox` to allow users to select individual options.
  */
 var Checkbox = React.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 _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, _f = _a.checkboxAlignment, checkboxAlignment = _f === void 0 ? "center" : _f, props = filterDataAttrs.__rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment"]);
     var requirementStatus = React.useContext(FormControl.Context).requirementStatus;
     var surface = React.useContext(Surface.Context).surface;
-    var _f = FormControl.useAriaDescribedby({
+    var _g = FormControl.useAriaDescribedby({
         id: id,
         errorMessage: errorMessage
-    }), ariaDescribedby = _f.ariaDescribedby, idError = _f.idError;
+    }), ariaDescribedby = _g.ariaDescribedby, idError = _g.idError;
     var idLabel = "".concat(id, "-label");
     var checkedProps = {};
     if (typeof onChange === "function") {
@@ -38,24 +41,28 @@ var Checkbox = React.forwardRef(function (_a, ref) {
     if (requirementStatus === "required") {
         isRequired = true;
     }
-    return (React__default["default"].createElement("div", { className: index$1.classNames({
+    return (React__default["default"].createElement("div", { className: index.classNames({
             "arc-Checkbox": true,
             "arc-Checkbox--disabled": isDisabled,
             "arc-Checkbox--invalid": errorMessage,
             "arc-Checkbox--small": size === "s",
             "arc-Checkbox--onDarkSurface": surface === "dark"
         }) },
-        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("label", { id: idLabel, htmlFor: id, className: index.classNames("arc-Checkbox-label", {
+                "arc-Checkbox-label--top": checkboxAlignment === "top"
+            }) },
+            React__default["default"].createElement("input", filterDataAttrs.__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.filterDataAttrs(props))),
             React__default["default"].createElement("span", { className: "arc-Checkbox-box" },
                 React__default["default"].createElement(BtIconTickAlt2Px.BtIconTickAlt2Px_2, null)),
-            React__default["default"].createElement("span", null,
+            React__default["default"].createElement("span", filterDataAttrs.__assign({}, (checkboxAlignment === "top" && {
+                className: "arc-Checkbox-content--marginTop"
+            })),
                 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" },
             React__default["default"].createElement("span", { className: "arc-Checkbox-error--icon" },
-                React__default["default"].createElement(FormControl.BtIconAlert_2, null)),
+                React__default["default"].createElement(BtIconAlert.BtIconAlert_2, null)),
             errorMessage))));
 });
 

package/dist/Checkbox/Checkbox.esm.d.ts

@@ -14,6 +14,11 @@ interface CheckboxProps {
      * Helper text for the Checkbox, shown below the label.
      */
     helper?: React.ReactNode;
+    /**
+     * Determine the alignment the Checkbox.
+     *
+     */
+    checkboxAlignment?: "top" | "center";
     /**
      * ID for the Checkbox.
      */
@@ -23,7 +28,7 @@ interface CheckboxProps {
      */
     checked?: boolean;
     /**
-     * Should the Checkbox be disabled?
+     * `isDisabled` is a legacy property and not recommended from a UX usability best practice perspective.
      */
     isDisabled?: boolean;
     /**

package/dist/Checkbox/Checkbox.esm.js

@@ -1,24 +1,27 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import React__default, { forwardRef, useContext } from 'react';
 import { B as BtIconTickAlt2Px_2 } from '../_shared/esm/BtIconTickAlt2Px-da97e9ae.js';
-import { C as Context, u as useAriaDescribedby, B as BtIconAlert_2 } from '../_shared/esm/FormControl-2cb96de7.js';
+import { B as BtIconAlert_2 } from '../_shared/esm/BtIconAlert-55a6ed5c.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.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';
+import { C as Context, u as useAriaDescribedby } from '../_shared/esm/FormControl-0744f93f.js';
+import { C as Context$1 } from '../_shared/esm/Surface-bb100ef8.js';
+import '../_shared/esm/DisclosureMini-322fccc0.js';
+import '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
+import '../_shared/esm/Text-00e9743b.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/VerticalSpace-93980c9c.js';
 
 /**
  *  Use `Checkbox` to allow users to select individual options.
  */
 var Checkbox = 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 = __rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value"]);
+    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, _f = _a.checkboxAlignment, checkboxAlignment = _f === void 0 ? "center" : _f, props = __rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment"]);
     var requirementStatus = useContext(Context).requirementStatus;
     var surface = useContext(Context$1).surface;
-    var _f = useAriaDescribedby({
+    var _g = useAriaDescribedby({
         id: id,
         errorMessage: errorMessage
-    }), ariaDescribedby = _f.ariaDescribedby, idError = _f.idError;
+    }), ariaDescribedby = _g.ariaDescribedby, idError = _g.idError;
     var idLabel = "".concat(id, "-label");
     var checkedProps = {};
     if (typeof onChange === "function") {
@@ -37,11 +40,15 @@ var Checkbox = forwardRef(function (_a, ref) {
             "arc-Checkbox--small": size === "s",
             "arc-Checkbox--onDarkSurface": surface === "dark"
         }) },
-        React__default.createElement("label", { id: idLabel, htmlFor: id, className: "arc-Checkbox-label" },
+        React__default.createElement("label", { id: idLabel, htmlFor: id, className: classNames("arc-Checkbox-label", {
+                "arc-Checkbox-label--top": checkboxAlignment === "top"
+            }) },
             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(BtIconTickAlt2Px_2, null)),
-            React__default.createElement("span", null,
+            React__default.createElement("span", __assign({}, (checkboxAlignment === "top" && {
+                className: "arc-Checkbox-content--marginTop"
+            })),
                 label,
                 !isRequired && requirementStatus !== "optional" ? (React__default.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
                 helper && React__default.createElement("span", { className: "arc-Checkbox-helper" }, helper))),

package/dist/Clock/Clock.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -13,7 +13,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * `Clock` is a demo component that shows the current time.
  */
 var Clock = function (_a) {
-    var _b = _a.locale, locale = _b === void 0 ? "en-GB" : _b, props = index.__rest(_a, ["locale"]);
+    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];
     var _d = React.useState(time.toLocaleTimeString(locale)), humanTime = _d[0], setHumanTime = _d[1];
     React.useEffect(function () {
@@ -26,16 +26,16 @@ var Clock = function (_a) {
         var interval = setInterval(tick, 1000);
         return function () { return clearInterval(interval); };
     }, [locale]);
-    return (React__default["default"].createElement("time", index.__assign({ className: "arc-Clock", dateTime: time.toISOString() }, index.filterDataAttrs(props), { "data-locale": locale }), humanTime));
+    return (React__default["default"].createElement("time", filterDataAttrs.__assign({ className: "arc-Clock", dateTime: time.toISOString() }, filterDataAttrs.filterDataAttrs(props), { "data-locale": locale }), humanTime));
 };
 
-var Clock_rehydrator = (function (el) { return index.__awaiter(void 0, void 0, void 0, function () {
+var Clock_rehydrator = (function (el) { return filterDataAttrs.__awaiter(void 0, void 0, void 0, function () {
     var props;
-    return index.__generator(this, function (_a) {
+    return filterDataAttrs.__generator(this, function (_a) {
         props = {
             locale: el.dataset.locale
         };
-        return [2 /*return*/, React__default["default"].createElement(Clock, index.__assign({}, props))];
+        return [2 /*return*/, React__default["default"].createElement(Clock, filterDataAttrs.__assign({}, props))];
     });
 }); });
 

package/dist/Clock/Clock.esm.js

@@ -1,4 +1,4 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs, d as __awaiter, e as __generator } from '../_shared/esm/index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs, d as __awaiter, e as __generator } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import React__default, { useState, useEffect } from 'react';
 
 /**

package/dist/Columns/Columns.cjs.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
-var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+var index = require('../_shared/cjs/index-45bfb67b.js');
 var React = require('react');
-var suffixModifier = require('../_shared/cjs/suffix-modifier-edf7851e.js');
+var suffixModifier = require('../_shared/cjs/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);
  * Use `Columns` to compose layouts on a 12-column grid.
  */
 var Columns = function (_a) {
-    var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, props = index.__rest(_a, ["children", "isGutterless"]);
+    var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, props = filterDataAttrs.__rest(_a, ["children", "isGutterless"]);
     React.useEffect(function () {
         React__default["default"].Children.map(children, function (item) {
             if (item && item.type !== Col) {
@@ -23,16 +23,16 @@ var Columns = function (_a) {
             }
         });
     }, [children]);
-    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames({
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames({
             "arc-Columns": true,
             "arc-Columns--gutterless": isGutterless
-        }) }, index.filterDataAttrs(props)),
+        }) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["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 = index.__rest(_a, ["align", "children", "isDebugVisible", "offset", "offsetS", "offsetM", "offsetL", "offsetXL", "span", "spanS", "spanM", "spanL", "spanXL"]);
-    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_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 = filterDataAttrs.__rest(_a, ["align", "children", "isDebugVisible", "offset", "offsetS", "offsetM", "offsetL", "offsetXL", "span", "spanS", "spanM", "spanL", "spanXL"]);
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames((_b = {},
             _b["arc-Columns-col"] = true,
             _b[suffixModifier.suffixModifier("arc-Columns-col--align", align || "")] = align,
             _b["arc-Columns-col--".concat(span)] = typeof span !== "undefined",
@@ -51,7 +51,7 @@ var Col = function (_a) {
             _b["arc-Columns-col--offsetL".concat(offsetL)] = typeof offsetL !== "undefined",
             _b["arc-Columns-col--offsetXL".concat(offsetXL)] = typeof offsetXL !== "undefined",
             _b["arc-Columns-col--debugVisible"] = isDebugVisible,
-            _b)) }, index.filterDataAttrs(props)), children));
+            _b)) }, filterDataAttrs.filterDataAttrs(props)), children));
 };
 Col.displayName = "Columns.Col";
 Columns.Col = Col;

package/dist/Columns/Columns.esm.js

@@ -1,7 +1,7 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React__default, { useEffect } from 'react';
-import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js';
+import { s as suffixModifier } from '../_shared/esm/suffix-modifier-7e640670.js';
 
 /**
  * Use `Columns` to compose layouts on a 12-column grid.

package/dist/Curve/Curve.cjs.d.ts

@@ -1 +1 @@
-export { Curve } from "../_shared/cjs/Curve-e72ce25b";
+export { Curve } from "../_shared/cjs/Curve-b05589d8";

package/dist/Curve/Curve.cjs.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Curve = require('../_shared/cjs/Curve-e72ce25b.js');
-require('../_shared/cjs/index-78b35bc1.js');
+var Curve = require('../_shared/cjs/Curve-b05589d8.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 require('../_shared/cjs/index-45bfb67b.js');
 require('react');
-require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
 
 
 

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

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

package/dist/Curve/Curve.esm.js

@@ -1,5 +1,5 @@
-export { C as Curve } from '../_shared/esm/Curve-50697f7e.js';
-import '../_shared/esm/index-229fc864.js';
+export { C as Curve } from '../_shared/esm/Curve-3e87b1bc.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';
-import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';

package/dist/Disclosure/Disclosure.cjs.d.ts

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

package/dist/Disclosure/Disclosure.cjs.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
-var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+var index = require('../_shared/cjs/index-45bfb67b.js');
 var React = require('react');
-var Heading = require('../_shared/cjs/Heading-cc38c3ec.js');
+var Heading = require('../_shared/cjs/Heading-d45f6a7f.js');
 var BtIconChevronDown2Px = require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
-var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
-require('../_shared/cjs/suffix-modifier-edf7851e.js');
+var Surface = require('../_shared/cjs/Surface-6da0a78e.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -19,13 +19,13 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * an "open" state.
  */
 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 = index.__rest(_a, ["children", "headingLevel", "indentDetails", "isOpen", "summary"]);
+    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 = filterDataAttrs.__rest(_a, ["children", "headingLevel", "indentDetails", "isOpen", "summary"]);
     var surface = React.useContext(Surface.Context).surface;
-    return (React__default["default"].createElement("details", index.__assign({ className: index$1.classNames({
+    return (React__default["default"].createElement("details", filterDataAttrs.__assign({ className: index.classNames({
             "arc-Disclosure": true,
             "arc-Disclosure--indentDetails": indentDetails,
             "arc-Disclosure--onDarkSurface": surface === "dark"
-        }), open: isOpen }, index.filterDataAttrs(props)),
+        }), open: isOpen }, filterDataAttrs.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)),

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

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

package/dist/Disclosure/Disclosure.esm.js

@@ -1,10 +1,10 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React__default, { useContext } from 'react';
-import { H as Heading } from '../_shared/esm/Heading-eb1e42db.js';
+import { H as Heading } from '../_shared/esm/Heading-b61432fb.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';
+import { C as Context } from '../_shared/esm/Surface-bb100ef8.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
 
 /**
  * Use `Disclosure` to display content that is only visible when toggled into

package/dist/DisclosureMini/DisclosureMini.cjs.d.ts

@@ -0,0 +1 @@
+export { DisclosureMini } from "../_shared/cjs/DisclosureMini-5af13d3c";

package/dist/DisclosureMini/DisclosureMini.cjs.js

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var DisclosureMini = require('../_shared/cjs/DisclosureMini-5af13d3c.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
+require('../_shared/cjs/Text-6f2827e6.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/Surface-6da0a78e.js');
+
+
+
+exports.DisclosureMini = DisclosureMini.DisclosureMini;

package/dist/DisclosureMini/DisclosureMini.esm.d.ts

@@ -0,0 +1 @@
+export { DisclosureMini } from "../_shared/esm/DisclosureMini-322fccc0";

package/dist/DisclosureMini/DisclosureMini.esm.js

@@ -0,0 +1,8 @@
+export { D as DisclosureMini } from '../_shared/esm/DisclosureMini-322fccc0.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
+import '../_shared/esm/Text-00e9743b.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/Surface-bb100ef8.js';

package/dist/DisclosureMini/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/disclosuremini",
+  "types": "./DisclosureMini.esm.d.ts",
+  "main": "./DisclosureMini.cjs.js",
+  "module": "./DisclosureMini.esm.js",
+  "private": true
+}

package/dist/Elevation/Elevation.cjs.d.ts

@@ -8,6 +8,10 @@ interface ElevationProps {
      * Contents to Elevate.
      */
     children: ReactNode;
+    /**
+     * Shadow Elevation level.
+     */
+    elevationLevel?: "1" | "2";
     /**
      * Should the Elevation be full width?
      */