@arc-ui/components 12.0.0-beta.16 → 12.0.0-beta.18

package/lib/Modal/Modal.mjs

@@ -2,27 +2,28 @@
 import { _ as __rest, a as __assign, f as filterAttrs } from '../_shared/esm/filter-attrs-B6CM-NUr.mjs';
 import React__default, { useRef } from 'react';
 import { c as classNames } from '../_shared/esm/index-5C0-U8cc.mjs';
-import { R as Root, P as Portal, O as Overlay, C as Content, T as Title, D as Description } from '../_shared/esm/index-pkbjTTz_.mjs';
-import { e as useThemeElement } from '../_shared/esm/index-Bz2JQq34.mjs';
+import { R as Root, P as Portal, O as Overlay, C as Content, T as Title, D as Description } from '../_shared/esm/index-J5IHetgg.mjs';
 import { H as Heading } from '../_shared/esm/Heading-CxHWefi7.mjs';
-import { B as ButtonV2 } from '../_shared/esm/ButtonV2-CkFdHviV.mjs';
+import { B as ButtonV2 } from '../_shared/esm/ButtonV2-2U4PvnpS.mjs';
 import { T as Text } from '../_shared/esm/Text-CBlnm5CT.mjs';
 import { V as VerticalSpace } from '../_shared/esm/VerticalSpace-Duhm0zXP.mjs';
 import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-CN_Ed5b1.mjs';
 import { S as Surface } from '../_shared/esm/Surface-Colbp3Zx.mjs';
-import '../_shared/esm/Combination-CFD0IA8r.mjs';
+import { e as useThemeElement } from '../_shared/esm/index-Bz2JQq34.mjs';
+import '../_shared/esm/Combination-BpO6XTeS.mjs';
 import 'react/jsx-runtime';
 import 'react-dom';
-import '../_shared/esm/index-BUp5JjoD.mjs';
+import '../_shared/esm/index-DXTwueLZ.mjs';
 import '../_shared/esm/index-Spae4j7j.mjs';
 import '../_shared/esm/suffix-modifier-B_pO0UkF.mjs';
-import '../_shared/esm/Icon-B626JGP1.mjs';
+import '../_shared/esm/Icon-MZfaoOo9.mjs';
 import '../_shared/esm/Spinner-Cd7LiPTy.mjs';
 
 /** Use `Modal` to display information that needs immediate action from a user. */
 var Modal = function (_a) {
-    var title = _a.title, description = _a.description, ariaDescribedBy = _a.ariaDescribedBy, isOpen = _a.isOpen, actions = _a.actions, onRequestClose = _a.onRequestClose, children = _a.children, _b = _a.role, role = _b === void 0 ? "dialog" : _b, _c = _a.shouldReturnFocus, shouldReturnFocus = _c === void 0 ? true : _c, _d = _a.isContentScrollable, isContentScrollable = _d === void 0 ? false : _d, _e = _a.size, size = _e === void 0 ? "l" : _e, _f = _a.fullBleed, fullBleed = _f === void 0 ? false : _f, customWidth = _a.customWidth, props = __rest(_a, ["title", "description", "ariaDescribedBy", "isOpen", "actions", "onRequestClose", "children", "role", "shouldReturnFocus", "isContentScrollable", "size", "fullBleed", "customWidth"]);
-    var _g = useThemeElement(), themeElement = _g[0], setThemeElement = _g[1];
+    var _b;
+    var title = _a.title, description = _a.description, ariaDescribedBy = _a.ariaDescribedBy, isOpen = _a.isOpen, actions = _a.actions, onRequestClose = _a.onRequestClose, children = _a.children, _c = _a.role, role = _c === void 0 ? "dialog" : _c, _d = _a.shouldReturnFocus, shouldReturnFocus = _d === void 0 ? true : _d, _e = _a.isContentScrollable, isContentScrollable = _e === void 0 ? false : _e, _f = _a.size, size = _f === void 0 ? "l" : _f, _g = _a.fullBleed, fullBleed = _g === void 0 ? false : _g, customWidths = _a.customWidths, props = __rest(_a, ["title", "description", "ariaDescribedBy", "isOpen", "actions", "onRequestClose", "children", "role", "shouldReturnFocus", "isContentScrollable", "size", "fullBleed", "customWidths"]);
+    var _h = useThemeElement(), themeElement = _h[0], setThemeElement = _h[1];
     var triggerRef = useRef(null);
     var setTriggerElement = function () {
         return shouldReturnFocus &&
@@ -44,10 +45,15 @@ var Modal = function (_a) {
         React__default.createElement(Root, { open: isOpen },
             React__default.createElement(Portal, { container: themeElement },
                 React__default.createElement(Overlay, { className: "arc-Modal-overlay" },
-                    React__default.createElement(Content, __assign({}, ariaProps, { role: role, onOpenAutoFocus: setTriggerElement, onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: closeModal, onInteractOutside: closeModal, "aria-modal": "true", className: classNames("arc-Modal-dialog", "arc-Modal-dialog--".concat(size), {
-                            "arc-Modal-dialog--maxHeightWindow": isContentScrollable,
-                            "arc-Modal-dialog--fullBleed": fullBleed,
-                        }) }, filterAttrs(props), { style: { maxWidth: customWidth } }),
+                    React__default.createElement(Content, __assign({}, ariaProps, { role: role, onOpenAutoFocus: setTriggerElement, onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: closeModal, onInteractOutside: closeModal, "aria-modal": "true", className: classNames("arc-Modal-dialog", (_b = {},
+                            _b["arc-Modal-dialog--".concat(size)] = !customWidths,
+                            _b["arc-Modal-dialog--xs-span-".concat(customWidths === null || customWidths === void 0 ? void 0 : customWidths.xs)] = customWidths === null || customWidths === void 0 ? void 0 : customWidths.xs,
+                            _b["arc-Modal-dialog--s-span-".concat(customWidths === null || customWidths === void 0 ? void 0 : customWidths.s)] = customWidths === null || customWidths === void 0 ? void 0 : customWidths.s,
+                            _b["arc-Modal-dialog--m-span-".concat(customWidths === null || customWidths === void 0 ? void 0 : customWidths.m)] = customWidths === null || customWidths === void 0 ? void 0 : customWidths.m,
+                            _b["arc-Modal-dialog--l-span-".concat(customWidths === null || customWidths === void 0 ? void 0 : customWidths.l)] = customWidths === null || customWidths === void 0 ? void 0 : customWidths.l,
+                            _b["arc-Modal-dialog--maxHeightWindow"] = isContentScrollable,
+                            _b["arc-Modal-dialog--fullBleed"] = fullBleed,
+                            _b)) }, filterAttrs(props)),
                         React__default.createElement(React__default.Fragment, null,
                             title && (React__default.createElement(React__default.Fragment, null,
                                 React__default.createElement("div", { className: "arc-Modal-section" },

package/lib/Modal/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-Modal{color:auto}.arc-v12-0-0-beta-16 .arc .arc-Modal-overlay{align-items:center;background-color:var(--overlay-colors-overlay-default);display:flex;height:100%;justify-content:center;left:0;overflow-x:hidden;overflow-y:auto;padding:16px;position:fixed;top:0;width:100%;z-index:100}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog{background-color:var(--modal-colors-light-bg-default);border-radius:24px;display:flex;flex-direction:column;margin:auto;position:relative;width:100%}.arc-v12-0-0-beta-16 .arc .arc-Modal-section{padding:0 var(--modal-padding-m)}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--fullBleed .arc-Modal-custom-section{padding:0}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--maxHeightWindow{height:100%}.arc-v12-0-0-beta-16 .arc .arc-Modal-iconContainer{position:absolute;right:8px;top:8px}.arc-v12-0-0-beta-16 .arc .arc-Modal-closeButton{background-color:transparent;border:none;cursor:pointer;margin:0;padding:0}.arc-v12-0-0-beta-16 .arc .arc-Modal-closeButton:focus-visible{border-radius:var(--focus-border-radius-s);outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-16 .arc .arc-Modal-content{overflow-x:hidden;overflow-y:auto}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton:nth-of-type(n+2){margin-top:var(--modal-gap-s)}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--s{max-width:var(--modal-size-m)}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--m,.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--l{max-width:var(--modal-size-l)}@media (min-width:636px){.arc-v12-0-0-beta-16 .arc .arc-Modal-overlay{padding:80px 0}.arc-v12-0-0-beta-16 .arc .arc-Modal-actions{display:flex}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton{flex:1 1 auto}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton:nth-of-type(n+2){margin-left:var(--modal-gap-s);margin-top:0}}@media (min-width:768px){.arc-v12-0-0-beta-16 .arc .arc-Modal-actions{justify-content:flex-end}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton{flex:0 1 auto}}@media (min-width:1024px){.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--m{max-width:var(--modal-size-xl)}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog--l{max-width:var(--modal-size-xxl)}.arc-v12-0-0-beta-16 .arc .arc-Modal-actions{justify-content:flex-end}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton{flex:0 1 auto}}@media (prefers-reduced-motion:no-preference){.arc-v12-0-0-beta-16 .arc .arc-Modal-overlay{animation:overlay-show 100ms cubic-bezier(0.44,0,0.55,0.94)}.arc-v12-0-0-beta-16 .arc .arc-Modal-dialog{animation:content-show 100ms cubic-bezier(0.44,0,0.55,0.94)}@keyframes content-show{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}@keyframes overlay-show{from{opacity:0}to{opacity:1}}}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton--compact{display:flex}@media (min-width:636px){.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton--compact button{width:auto}}@media (min-width:768px){.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton--compact{width:100%}.arc-v12-0-0-beta-16 .arc .arc-Modal-actionButton--compact::after{content:"";flex-grow:1}}
+.arc-v12-0-0-beta-18 .arc .arc-Modal{color:auto}.arc-v12-0-0-beta-18 .arc .arc-Modal-overlay{align-items:center;background-color:var(--overlay-colors-overlay-default);display:flex;height:100%;justify-content:center;left:0;overflow-x:hidden;overflow-y:auto;padding:16px;position:fixed;top:0;width:100%;z-index:100}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog{background-color:var(--modal-colors-light-bg-default);border-radius:24px;display:flex;flex-direction:column;margin:auto;position:relative;width:100%}.arc-v12-0-0-beta-18 .arc .arc-Modal-section{padding:0 var(--modal-padding-m)}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--fullBleed .arc-Modal-custom-section{padding:0}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--maxHeightWindow{height:100%}.arc-v12-0-0-beta-18 .arc .arc-Modal-iconContainer{background:var(--modal-colors-light-bg-default);border-radius:16px;height:32px;position:absolute;right:8px;top:8px}.arc-v12-0-0-beta-18 .arc .arc-Modal-closeButton{background-color:transparent;border:none;cursor:pointer;margin:0;padding:0}.arc-v12-0-0-beta-18 .arc .arc-Modal-closeButton:focus-visible{border-radius:var(--focus-border-radius-s);outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-18 .arc .arc-Modal-content{overflow-x:hidden;overflow-y:auto}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton:nth-of-type(n+2){margin-top:var(--modal-gap-s)}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--s{max-width:var(--modal-size-m)}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--m,.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--l{max-width:var(--modal-size-l)}@media (min-width:636px){.arc-v12-0-0-beta-18 .arc .arc-Modal-overlay{padding:80px 24px}.arc-v12-0-0-beta-18 .arc .arc-Modal-actions{display:flex}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton{flex:1 1 auto}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton:nth-of-type(n+2){margin-left:var(--modal-gap-s);margin-top:0}}@media (min-width:768px){.arc-v12-0-0-beta-18 .arc .arc-Modal-actions{justify-content:flex-end}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton{flex:0 1 auto}}@media (min-width:1024px){.arc-v12-0-0-beta-18 .arc .arc-Modal-overlay{padding-left:32px;padding-right:32px}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--m{max-width:var(--modal-size-xl)}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog--l{max-width:var(--modal-size-xxl)}.arc-v12-0-0-beta-18 .arc .arc-Modal-actions{justify-content:flex-end}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton{flex:0 1 auto}}@media (prefers-reduced-motion:no-preference){.arc-v12-0-0-beta-18 .arc .arc-Modal-overlay{animation:overlay-show 100ms cubic-bezier(0.44,0,0.55,0.94)}.arc-v12-0-0-beta-18 .arc .arc-Modal-dialog{animation:content-show 100ms cubic-bezier(0.44,0,0.55,0.94)}@keyframes content-show{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}@keyframes overlay-show{from{opacity:0}to{opacity:1}}}.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton--compact{display:flex}@media (min-width:636px){.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton--compact button{width:auto}}@media (min-width:768px){.arc-v12-0-0-beta-18 .arc .arc-Modal-actionButton--compact{flex-grow:1}}:root{--columns-gutter-xs:var(--arc-size-grid-gutter-s);--columns-gutter-s:var(--arc-size-grid-gutter-m);--columns-gutter-m:var(--arc-size-grid-gutter-m);--columns-gutter-l:var(--arc-size-grid-gutter-m);--columns-gutter-xl:var(--arc-size-grid-gutter-l);--arc-columns-gap:var(--columns-gutter-xs);--arc-columns-count:12;--modal-max-width:100%;--arc-column-width:calc((calc(var(--modal-max-width) + var(--arc-columns-gap))/var(--arc-columns-count)));--arc-columns-span-4-width:calc((var(--arc-column-width) * 4) - var(--arc-columns-gap));--arc-columns-span-6-width:calc((var(--arc-column-width) * 6) - var(--arc-columns-gap));--arc-columns-span-8-width:calc((var(--arc-column-width) * 8) - var(--arc-columns-gap));--arc-columns-span-10-width:calc((var(--arc-column-width) * 10) - var(--arc-columns-gap));--arc-columns-span-12-width:calc((var(--arc-column-width) * 12) - var(--arc-columns-gap))}@media (min-width:320px){.arc-v12-0-0-beta-18 :root{--arc-columns-gap:var(--columns-gutter-s);--arc-column-width:calc((calc(var(--modal-max-width) + var(--arc-columns-gap))/var(--arc-columns-count)))}}@media (min-width:636px){:root{--arc-columns-gap:var(--columns-gutter-m);--arc-column-width:calc((calc(var(--modal-max-width) + var(--arc-columns-gap))/var(--arc-columns-count)))}}@media (min-width:1280px){.arc-v12-0-0-beta-18 .arc .arc-Modal-overlay{padding-left:32px;padding-right:32px}:root{--modal-max-width:calc(var(--arc-size-breakpoints-xl) - calc(2 * var(--arc-size-section-margin-32)));--arc-columns-gap:var(--columns-gutter-xl);--arc-column-width:calc((calc(var(--modal-max-width) + var(--arc-columns-gap))/var(--arc-columns-count)))}}@media (min-width:320px){.arc-v12-0-0-beta-18 .arc-Modal-dialog--xs-span-4{max-width:var(--arc-columns-span-2-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--xs-span-6{max-width:var(--arc-columns-span-6-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--xs-span-8{max-width:var(--arc-columns-span-8-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--xs-span-10{max-width:var(--arc-columns-span-10-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--xs-span-12{max-width:var(--arc-columns-span-12-width)}}@media (min-width:636px){.arc-v12-0-0-beta-18 .arc-Modal-dialog--s-span-4{max-width:var(--arc-columns-span-2-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--s-span-6{max-width:var(--arc-columns-span-6-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--s-span-8{max-width:var(--arc-columns-span-8-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--s-span-10{max-width:var(--arc-columns-span-10-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--s-span-12{max-width:var(--arc-columns-span-12-width)}}@media (min-width:768px){.arc-v12-0-0-beta-18 .arc-Modal-dialog--m-span-4{max-width:var(--arc-columns-span-2-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--m-span-6{max-width:var(--arc-columns-span-6-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--m-span-8{max-width:var(--arc-columns-span-8-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--m-span-10{max-width:var(--arc-columns-span-10-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--m-span-12{max-width:var(--arc-columns-span-12-width)}}@media (min-width:1024px){.arc-v12-0-0-beta-18 .arc-Modal-dialog--l-span-4{max-width:var(--arc-columns-span-2-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--l-span-6{max-width:var(--arc-columns-span-6-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--l-span-8{max-width:var(--arc-columns-span-8-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--l-span-10{max-width:var(--arc-columns-span-10-width)}.arc-v12-0-0-beta-18 .arc-Modal-dialog--l-span-12{max-width:var(--arc-columns-span-12-width)}}

package/lib/Pagination/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-Pagination{align-items:center;display:flex;flex-wrap:nowrap}.arc-v12-0-0-beta-16 .arc .arc-Pagination-pageNumberContainer{display:flex;flex-wrap:nowrap}.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButton{align-items:center;background:transparent;border:none;border-radius:var(--pagination-border-radius-m);color:var(--pagination-colors-light-fg-default);cursor:pointer;display:flex;height:var(--pagination-size-m);justify-content:center;line-height:0;margin:0;outline:none;padding:0;width:var(--pagination-size-m)}.arc-v12-0-0-beta-16 .arc .arc-Pagination--onDarkSurface .arc-Pagination-navigationButton{color:var(--pagination-colors-dark-fg-default)}.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButtonIcon--left{margin-left:-2px}.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButtonIcon--right{margin-right:-2px}.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButton--hidden{visibility:hidden}.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButton:focus-visible{outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-16 .arc .arc-Pagination-value--number{background:transparent;border:none;color:inherit;cursor:pointer;font:var(--sem-type-interface-reg-s);outline:none;padding:0}.arc-v12-0-0-beta-16 .arc .arc-Pagination-value--number:focus-visible{outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-16 .arc .arc-Pagination .arc-Pagination-value--number:active{background-color:var(--pagination-colors-light-bg-pressed);color:var(--pagination-colors-light-text-default)}.arc-v12-0-0-beta-16 .arc .arc-Pagination-value{align-items:center;border-radius:var(--pagination-border-radius-m);display:flex;height:var(--pagination-size-m);justify-content:center;width:var(--pagination-size-m)}@media (hover:hover){.arc-v12-0-0-beta-16 .arc .arc-Pagination-navigationButton:hover,.arc-v12-0-0-beta-16 .arc .arc-Pagination-value--number:not(.arc-Pagination-value--selected):hover{background-color:var(--pagination-colors-light-bg-hover);color:var(--pagination-colors-light-text-default)}}.arc-v12-0-0-beta-16 .arc .arc-Pagination-value--selected{background-color:var(--pagination-colors-light-bg-selected);color:var(--pagination-colors-light-text-default)}@media (min-width: 768px){.arc-v12-0-0-beta-16 .arc .arc-Pagination-value{margin:0 calc(var(--pagination-gap-m) / 2)}.arc-v12-0-0-beta-16 .arc .arc-Pagination-pageNumberContainer{display:flex;flex-wrap:nowrap;margin:0 calc(var(--pagination-gap-m) / 2)}}
+.arc-v12-0-0-beta-18 .arc .arc-Pagination{align-items:center;display:flex;flex-wrap:nowrap}.arc-v12-0-0-beta-18 .arc .arc-Pagination-pageNumberContainer{display:flex;flex-wrap:nowrap}.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButton{align-items:center;background:transparent;border:none;border-radius:var(--pagination-border-radius-m);color:var(--pagination-colors-light-fg-default);cursor:pointer;display:flex;height:var(--pagination-size-m);justify-content:center;line-height:0;margin:0;outline:none;padding:0;width:var(--pagination-size-m)}.arc-v12-0-0-beta-18 .arc .arc-Pagination--onDarkSurface .arc-Pagination-navigationButton{color:var(--pagination-colors-dark-fg-default)}.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButtonIcon--left{margin-left:-2px}.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButtonIcon--right{margin-right:-2px}.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButton--hidden{visibility:hidden}.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButton:focus-visible{outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-18 .arc .arc-Pagination-value--number{background:transparent;border:none;color:inherit;cursor:pointer;font:var(--sem-type-interface-reg-s);outline:none;padding:0}.arc-v12-0-0-beta-18 .arc .arc-Pagination-value--number:focus-visible{outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle);outline-offset:2px}.arc-v12-0-0-beta-18 .arc .arc-Pagination .arc-Pagination-value--number:active{background-color:var(--pagination-colors-light-bg-pressed);color:var(--pagination-colors-light-text-default)}.arc-v12-0-0-beta-18 .arc .arc-Pagination-value{align-items:center;border-radius:var(--pagination-border-radius-m);display:flex;height:var(--pagination-size-m);justify-content:center;width:var(--pagination-size-m)}@media (hover:hover){.arc-v12-0-0-beta-18 .arc .arc-Pagination-navigationButton:hover,.arc-v12-0-0-beta-18 .arc .arc-Pagination-value--number:not(.arc-Pagination-value--selected):hover{background-color:var(--pagination-colors-light-bg-hover);color:var(--pagination-colors-light-text-default)}}.arc-v12-0-0-beta-18 .arc .arc-Pagination-value--selected{background-color:var(--pagination-colors-light-bg-selected);color:var(--pagination-colors-light-text-default)}@media (min-width: 768px){.arc-v12-0-0-beta-18 .arc .arc-Pagination-value{margin:0 calc(var(--pagination-gap-m) / 2)}.arc-v12-0-0-beta-18 .arc .arc-Pagination-pageNumberContainer{display:flex;flex-wrap:nowrap;margin:0 calc(var(--pagination-gap-m) / 2)}}

package/lib/PaginationSimple/PaginationSimple.cjs

@@ -5,60 +5,26 @@ var filterAttrs = require('../_shared/cjs/filter-attrs-eK6E_34o.cjs');
 var React = require('react');
 var index = require('../_shared/cjs/index-CTlXMLug.cjs');
 var ThemeIcon = require('../_shared/cjs/ThemeIcon-BoxbjTaQ.cjs');
-var Icon = require('../_shared/cjs/Icon-DdqFr6bT.cjs');
+var Icon = require('../_shared/cjs/Icon-KMACQ1i3.cjs');
 require('../_shared/cjs/suffix-modifier-DLUGR-yG.cjs');
 require('../_shared/cjs/index-DR8Rkav9.cjs');
 require('../_shared/cjs/Surface-BFx1yNsq.cjs');
 
-const BtIconFirstMid = (props) =>
-  /*#__PURE__*/ React.createElement(
-    "svg",
-    Object.assign(
-      {
-        viewBox: "0 0 16 16",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M4.675 4.00537C5.04779 4.00537 5.35 4.30758 5.35 4.68037V11.3204C5.35 11.6932 5.04779 11.9954 4.675 11.9954C4.30221 11.9954 4 11.6932 4 11.3204V4.68037C4 4.30758 4.30221 4.00537 4.675 4.00537Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M7.97265 8.0002L10.8213 10.8522C10.9473 10.9785 11.0181 11.1495 11.0181 11.3279C11.0181 11.5063 10.9473 11.6773 10.8213 11.8036C10.759 11.866 10.6851 11.9155 10.6036 11.9493C10.5222 11.983 10.4349 12.0004 10.3467 12.0004C10.2585 12.0004 10.1712 11.983 10.0897 11.9493C10.0083 11.9155 9.93428 11.866 9.87199 11.8036L6.54799 8.47553C6.42219 8.34932 6.35156 8.17839 6.35156 8.0002C6.35156 7.822 6.42219 7.65107 6.54799 7.52486L9.87199 4.19686C9.93428 4.13446 10.0083 4.08495 10.0897 4.05117C10.1712 4.01738 10.2585 4 10.3467 4C10.4348 4 10.5222 4.01738 10.6036 4.05117C10.6851 4.08495 10.759 4.13446 10.8213 4.19686C10.9473 4.3231 11.0181 4.49417 11.0181 4.67253C11.0181 4.85089 10.9473 5.02196 10.8213 5.1482L7.97265 8.0002Z",
-      fill: "currentColor",
-    }),
-  );
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconFirstMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M4.675 4.005c.373 0 .675.303.675.675v6.64a.675.675 0 1 1-1.35 0V4.68c0-.372.302-.675.675-.675M7.973 8l2.848 2.852a.673.673 0 0 1-.731 1.097.7.7 0 0 1-.218-.145L6.548 8.476a.673.673 0 0 1 0-.951l3.324-3.328a.671.671 0 1 1 .95.951z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
 
-const BtIconLastMid = (props) =>
-  /*#__PURE__*/ React.createElement(
-    "svg",
-    Object.assign(
-      {
-        viewBox: "0 0 16 16",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M10.3406 11.9951C9.96783 11.9951 9.66562 11.6929 9.66562 11.3201V4.68012C9.66562 4.30732 9.96783 4.00512 10.3406 4.00512C10.7134 4.00512 11.0156 4.30732 11.0156 4.68012L11.0156 11.3201C11.0156 11.6929 10.7134 11.9951 10.3406 11.9951Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M7.04297 8.00029L4.19434 5.14832C4.06834 5.02202 3.99754 4.85102 3.99754 4.67262C3.99754 4.49422 4.06834 4.32322 4.19434 4.19692C4.25664 4.13452 4.33054 4.08502 4.41204 4.05122C4.49344 4.01752 4.58074 4.00012 4.66897 4.00012C4.75714 4.00012 4.84445 4.01752 4.9259 4.05122C5.00735 4.08502 5.08134 4.13452 5.14363 4.19692L8.46763 7.52496C8.59343 7.65117 8.66406 7.8221 8.66406 8.00029C8.66406 8.17849 8.59343 8.34942 8.46763 8.47563L5.14363 11.8036C5.08134 11.866 5.00735 11.9155 4.9259 11.9493C4.84445 11.9831 4.75714 12.0005 4.66897 12.0005C4.58084 12.0005 4.49344 11.9831 4.41204 11.9493C4.33054 11.9155 4.25664 11.866 4.19434 11.8036C4.06834 11.6774 3.99754 11.5063 3.99754 11.328C3.99754 11.1496 4.06834 10.9785 4.19434 10.8523L7.04297 8.00029Z",
-      fill: "currentColor",
-    }),
-  );
+const BtIconLastMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M10.34 11.995a.675.675 0 0 1-.674-.675V4.68a.675.675 0 1 1 1.35 0v6.64a.675.675 0 0 1-.675.675M7.043 8 4.194 5.148a.673.673 0 0 1 .732-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329a.671.671 0 1 1-.95-.952z' clip-rule='evenodd'/%3e%3c/svg%3e";
 
 /**
  * TODO! Revise method of aligning svg's

package/lib/PaginationSimple/PaginationSimple.mjs

@@ -3,60 +3,26 @@ import { _ as __rest, a as __assign, f as filterAttrs } from '../_shared/esm/fil
 import React__default from 'react';
 import { c as classNames } from '../_shared/esm/index-5C0-U8cc.mjs';
 import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-CN_Ed5b1.mjs';
-import { I as Icon } from '../_shared/esm/Icon-B626JGP1.mjs';
+import { I as Icon } from '../_shared/esm/Icon-MZfaoOo9.mjs';
 import '../_shared/esm/suffix-modifier-B_pO0UkF.mjs';
 import '../_shared/esm/index-Spae4j7j.mjs';
 import '../_shared/esm/Surface-Colbp3Zx.mjs';
 
-const BtIconFirstMid = (props) =>
-  /*#__PURE__*/ React__default.createElement(
-    "svg",
-    Object.assign(
-      {
-        viewBox: "0 0 16 16",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M4.675 4.00537C5.04779 4.00537 5.35 4.30758 5.35 4.68037V11.3204C5.35 11.6932 5.04779 11.9954 4.675 11.9954C4.30221 11.9954 4 11.6932 4 11.3204V4.68037C4 4.30758 4.30221 4.00537 4.675 4.00537Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React__default.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M7.97265 8.0002L10.8213 10.8522C10.9473 10.9785 11.0181 11.1495 11.0181 11.3279C11.0181 11.5063 10.9473 11.6773 10.8213 11.8036C10.759 11.866 10.6851 11.9155 10.6036 11.9493C10.5222 11.983 10.4349 12.0004 10.3467 12.0004C10.2585 12.0004 10.1712 11.983 10.0897 11.9493C10.0083 11.9155 9.93428 11.866 9.87199 11.8036L6.54799 8.47553C6.42219 8.34932 6.35156 8.17839 6.35156 8.0002C6.35156 7.822 6.42219 7.65107 6.54799 7.52486L9.87199 4.19686C9.93428 4.13446 10.0083 4.08495 10.0897 4.05117C10.1712 4.01738 10.2585 4 10.3467 4C10.4348 4 10.5222 4.01738 10.6036 4.05117C10.6851 4.08495 10.759 4.13446 10.8213 4.19686C10.9473 4.3231 11.0181 4.49417 11.0181 4.67253C11.0181 4.85089 10.9473 5.02196 10.8213 5.1482L7.97265 8.0002Z",
-      fill: "currentColor",
-    }),
-  );
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconFirstMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M4.675 4.005c.373 0 .675.303.675.675v6.64a.675.675 0 1 1-1.35 0V4.68c0-.372.302-.675.675-.675M7.973 8l2.848 2.852a.673.673 0 0 1-.731 1.097.7.7 0 0 1-.218-.145L6.548 8.476a.673.673 0 0 1 0-.951l3.324-3.328a.671.671 0 1 1 .95.951z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
 
-const BtIconLastMid = (props) =>
-  /*#__PURE__*/ React__default.createElement(
-    "svg",
-    Object.assign(
-      {
-        viewBox: "0 0 16 16",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M10.3406 11.9951C9.96783 11.9951 9.66562 11.6929 9.66562 11.3201V4.68012C9.66562 4.30732 9.96783 4.00512 10.3406 4.00512C10.7134 4.00512 11.0156 4.30732 11.0156 4.68012L11.0156 11.3201C11.0156 11.6929 10.7134 11.9951 10.3406 11.9951Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React__default.createElement("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M7.04297 8.00029L4.19434 5.14832C4.06834 5.02202 3.99754 4.85102 3.99754 4.67262C3.99754 4.49422 4.06834 4.32322 4.19434 4.19692C4.25664 4.13452 4.33054 4.08502 4.41204 4.05122C4.49344 4.01752 4.58074 4.00012 4.66897 4.00012C4.75714 4.00012 4.84445 4.01752 4.9259 4.05122C5.00735 4.08502 5.08134 4.13452 5.14363 4.19692L8.46763 7.52496C8.59343 7.65117 8.66406 7.8221 8.66406 8.00029C8.66406 8.17849 8.59343 8.34942 8.46763 8.47563L5.14363 11.8036C5.08134 11.866 5.00735 11.9155 4.9259 11.9493C4.84445 11.9831 4.75714 12.0005 4.66897 12.0005C4.58084 12.0005 4.49344 11.9831 4.41204 11.9493C4.33054 11.9155 4.25664 11.866 4.19434 11.8036C4.06834 11.6774 3.99754 11.5063 3.99754 11.328C3.99754 11.1496 4.06834 10.9785 4.19434 10.8523L7.04297 8.00029Z",
-      fill: "currentColor",
-    }),
-  );
+const BtIconLastMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M10.34 11.995a.675.675 0 0 1-.674-.675V4.68a.675.675 0 1 1 1.35 0v6.64a.675.675 0 0 1-.675.675M7.043 8 4.194 5.148a.673.673 0 0 1 .732-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329a.671.671 0 1 1-.95-.952z' clip-rule='evenodd'/%3e%3c/svg%3e";
 
 /**
  * TODO! Revise method of aligning svg's

package/lib/PaginationSimple/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple{width:100%}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-list{align-items:center;display:flex;list-style:none;margin:0;padding:0;width:100%}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple--centered .arc-PaginationSimple-list{justify-content:center}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton{align-items:center;background:transparent;border:none;color:var(--pagination-colors-light-text-strong);cursor:pointer;display:flex;font:var(--sem-type-interface-reg-s);margin:0;outline:none;padding:0;text-decoration:none;width:-moz-max-content;width:max-content}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-iconContainer{align-items:center;border-radius:50%;display:flex}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton .arc-PaginationSimple-iconContainer{color:var(--pagination-colors-light-fg-default)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton:focus-visible .arc-PaginationSimple-iconContainer{border-radius:100%;outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-listItem{align-items:center;display:flex;gap:var(--pagination-gap-m)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-listItemEllipsis{margin:0 calc(var(--pagination-gap-s) * 2)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-listItem:first-child{margin-right:calc(var(--pagination-gap-s) * 2.5)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-listItem:last-child{margin-left:calc(var(--pagination-gap-s) * 2.5)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-listItem:first-child{flex-grow:1}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-listItemEllipsis{flex-grow:1}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-prevText{margin-left:var(--pagination-gap-s)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-nextText{margin-right:var(--pagination-gap-s)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-navigationButton--hidden{visibility:hidden}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple--centered .arc-PaginationSimple-navigationButton--hidden,.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-listItemEllipsis--hidden{display:none}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-iconContainer--left>:first-child{position:relative;right:1px}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-iconContainer--right>:first-child{left:1px;position:relative}@media (hover:hover){.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton:hover .arc-PaginationSimple-iconContainer{background-color:var(--pagination-colors-light-bg-hover);color:var(--pagination-colors-light-text-default)}}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton:active .arc-PaginationSimple-iconContainer{background-color:var(--pagination-colors-light-bg-pressed);color:var(--pagination-colors-light-text-default)}.arc-v12-0-0-beta-16 .arc .arc-PaginationSimple-navigationButton:focus-visible{outline:none}
+.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple{width:100%}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-list{align-items:center;display:flex;list-style:none;margin:0;padding:0;width:100%}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple--centered .arc-PaginationSimple-list{justify-content:center}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton{align-items:center;background:transparent;border:none;color:var(--pagination-colors-light-text-strong);cursor:pointer;display:flex;font:var(--sem-type-interface-reg-s);margin:0;outline:none;padding:0;text-decoration:none;width:-moz-max-content;width:max-content}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-iconContainer{align-items:center;border-radius:50%;display:flex}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton .arc-PaginationSimple-iconContainer{color:var(--pagination-colors-light-fg-default)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton:focus-visible .arc-PaginationSimple-iconContainer{border-radius:100%;outline:var(--focus-border-weight-s) solid var(--focus-colors-light-border-subtle)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-listItem{align-items:center;display:flex;gap:var(--pagination-gap-m)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-listItemEllipsis{margin:0 calc(var(--pagination-gap-s) * 2)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-listItem:first-child{margin-right:calc(var(--pagination-gap-s) * 2.5)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-listItem:last-child{margin-left:calc(var(--pagination-gap-s) * 2.5)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-listItem:first-child{flex-grow:1}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-listItemEllipsis{flex-grow:1}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-prevText{margin-left:var(--pagination-gap-s)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-nextText{margin-right:var(--pagination-gap-s)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple--fluid .arc-PaginationSimple-navigationButton--hidden{visibility:hidden}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple--centered .arc-PaginationSimple-navigationButton--hidden,.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-listItemEllipsis--hidden{display:none}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-iconContainer--left>:first-child{position:relative;right:1px}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-iconContainer--right>:first-child{left:1px;position:relative}@media (hover:hover){.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton:hover .arc-PaginationSimple-iconContainer{background-color:var(--pagination-colors-light-bg-hover);color:var(--pagination-colors-light-text-default)}}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton:active .arc-PaginationSimple-iconContainer{background-color:var(--pagination-colors-light-bg-pressed);color:var(--pagination-colors-light-text-default)}.arc-v12-0-0-beta-18 .arc .arc-PaginationSimple-navigationButton:focus-visible{outline:none}

package/lib/Popover/Popover.cjs

@@ -4,15 +4,15 @@
 var filterAttrs = require('../_shared/cjs/filter-attrs-eK6E_34o.cjs');
 var React = require('react');
 var index$2 = require('../_shared/cjs/index-CTlXMLug.cjs');
-var index$1 = require('../_shared/cjs/index-Cn7XSNle.cjs');
+var index$1 = require('../_shared/cjs/index-CaO6cOF0.cjs');
 var index = require('../_shared/cjs/index-DXNM3D1d.cjs');
 var Surface = require('../_shared/cjs/Surface-BFx1yNsq.cjs');
-require('../_shared/cjs/Combination-iNPq-pNP.cjs');
+require('../_shared/cjs/Combination-B-rSVLfT.cjs');
 require('react/jsx-runtime');
 require('react-dom');
-require('../_shared/cjs/index-DbQ2PCr3.cjs');
+require('../_shared/cjs/index-Bt7hfZBc.cjs');
 require('../_shared/cjs/index-B11wQrRa.cjs');
-require('../_shared/cjs/index-DNgUhsBO.cjs');
+require('../_shared/cjs/index-Dv1xvB_E.cjs');
 require('../_shared/cjs/index-DR8Rkav9.cjs');
 
 /** Use `Popover` to display content in a portal, triggered by a button. */
@@ -25,13 +25,13 @@ var Popover = function (_a) {
             React.createElement("div", { ref: setThemeElement },
                 React.createElement(index$1.Portal, { container: themeElement },
                     React.createElement("div", { "data-cy": "z-index", style: { position: "absolute", zIndex: zIndex } },
-                        React.createElement(index$1.Content2, { asChild: true, side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -16 : align === "end" ? -16 : undefined, onOpenAutoFocus: onOpenAutoFocus, onCloseAutoFocus: onCloseAutoFocus, onEscapeKeyDown: onEscapeKeyDown, onPointerDownOutside: onPointerDownOutside, onFocusOutside: onFocusOutside, onInteractOutside: onInteractOutside },
+                        React.createElement(index$1.Content2, { side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -16 : align === "end" ? -16 : undefined, onOpenAutoFocus: onOpenAutoFocus, onCloseAutoFocus: onCloseAutoFocus, onEscapeKeyDown: onEscapeKeyDown, onPointerDownOutside: onPointerDownOutside, onFocusOutside: onFocusOutside, onInteractOutside: onInteractOutside },
                             React.createElement(Surface.Surface, { isTransparent: true, background: background === "light" ? "light-white" : "dark-black" },
                                 React.createElement("div", { className: index$2.classNames("arc-Popover-content", {
                                         "arc-Popover-content--dark": background === "dark",
                                         "arc-Popover-content--brand": background === "brand",
-                                    }), style: { maxWidth: maxWidth } },
-                                    content && (React.createElement("div", { className: "arc-Popover-contentNodeItem" }, content)),
+                                    }), style: { maxWidth: maxWidth }, "aria-labelledby": "popover-content" },
+                                    content && (React.createElement("div", { className: "arc-Popover-contentNodeItem", id: "popover-content" }, content)),
                                     arrow && (React.createElement(index$1.PopoverArrow, { className: "arc-Popover-arrow" })))))))))));
 };
 

package/lib/Popover/Popover.mjs

@@ -2,15 +2,15 @@
 import { _ as __rest, a as __assign, f as filterAttrs } from '../_shared/esm/filter-attrs-B6CM-NUr.mjs';
 import React__default from 'react';
 import { c as classNames } from '../_shared/esm/index-5C0-U8cc.mjs';
-import { R as Root2, T as Trigger, P as Portal, C as Content2, a as PopoverArrow } from '../_shared/esm/index-ZYyu0Vjh.mjs';
+import { R as Root2, T as Trigger, P as Portal, C as Content2, a as PopoverArrow } from '../_shared/esm/index-CxrL7jIX.mjs';
 import { e as useThemeElement } from '../_shared/esm/index-Bz2JQq34.mjs';
 import { S as Surface } from '../_shared/esm/Surface-Colbp3Zx.mjs';
-import '../_shared/esm/Combination-CFD0IA8r.mjs';
+import '../_shared/esm/Combination-BpO6XTeS.mjs';
 import 'react/jsx-runtime';
 import 'react-dom';
-import '../_shared/esm/index-DNxTGgc1.mjs';
+import '../_shared/esm/index-DLovItWo.mjs';
 import '../_shared/esm/index-CWHcEz3_.mjs';
-import '../_shared/esm/index-BUp5JjoD.mjs';
+import '../_shared/esm/index-DXTwueLZ.mjs';
 import '../_shared/esm/index-Spae4j7j.mjs';
 
 /** Use `Popover` to display content in a portal, triggered by a button. */
@@ -23,13 +23,13 @@ var Popover = function (_a) {
             React__default.createElement("div", { ref: setThemeElement },
                 React__default.createElement(Portal, { container: themeElement },
                     React__default.createElement("div", { "data-cy": "z-index", style: { position: "absolute", zIndex: zIndex } },
-                        React__default.createElement(Content2, { asChild: true, side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -16 : align === "end" ? -16 : undefined, onOpenAutoFocus: onOpenAutoFocus, onCloseAutoFocus: onCloseAutoFocus, onEscapeKeyDown: onEscapeKeyDown, onPointerDownOutside: onPointerDownOutside, onFocusOutside: onFocusOutside, onInteractOutside: onInteractOutside },
+                        React__default.createElement(Content2, { side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -16 : align === "end" ? -16 : undefined, onOpenAutoFocus: onOpenAutoFocus, onCloseAutoFocus: onCloseAutoFocus, onEscapeKeyDown: onEscapeKeyDown, onPointerDownOutside: onPointerDownOutside, onFocusOutside: onFocusOutside, onInteractOutside: onInteractOutside },
                             React__default.createElement(Surface, { isTransparent: true, background: background === "light" ? "light-white" : "dark-black" },
                                 React__default.createElement("div", { className: classNames("arc-Popover-content", {
                                         "arc-Popover-content--dark": background === "dark",
                                         "arc-Popover-content--brand": background === "brand",
-                                    }), style: { maxWidth: maxWidth } },
-                                    content && (React__default.createElement("div", { className: "arc-Popover-contentNodeItem" }, content)),
+                                    }), style: { maxWidth: maxWidth }, "aria-labelledby": "popover-content" },
+                                    content && (React__default.createElement("div", { className: "arc-Popover-contentNodeItem", id: "popover-content" }, content)),
                                     arrow && (React__default.createElement(PopoverArrow, { className: "arc-Popover-arrow" })))))))))));
 };
 

package/lib/Popover/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-Popover-content{background:var(--popover-colors-light-bg-default);border:var(--popover-border-width) solid var(--popover-colors-light-border);border-radius:var(--popover-border-radius);box-shadow:var(--elevation-01);outline:none;overflow:hidden;padding:16px}.arc-v12-0-0-beta-16 .arc .arc-Popover-arrow{background:var(--popover-colors-light-bg-default);border-bottom:var(--popover-border-width) solid var(--popover-colors-light-border);border-bottom-right-radius:1px;border-right:var(--popover-border-width) solid var(--popover-colors-light-border);fill:none;height:11.31px;position:relative;transform:translate(0,-52%) rotate(45deg);width:11.31px}.arc-v12-0-0-beta-16 .arc .arc-Popover-content:not(:focus-visible){outline:none}.arc-v12-0-0-beta-16 .arc .arc-Popover-content--dark,.arc-v12-0-0-beta-16 .arc .arc-Popover-content--dark .arc-Popover-arrow{background:var(--popover-colors-dark-bg-default);border-color:var(--popover-colors-dark-border)}.arc-v12-0-0-beta-16 .arc .arc-Popover-content--brand,.arc-v12-0-0-beta-16 .arc .arc-Popover-content--brand .arc-Popover-arrow{background:var(--popover-colors-brand-bg-default);border-color:var(--popover-colors-brand-border)}.arc-v12-0-0-beta-16 .arc .arc-Popover-trigger{all:unset;cursor:pointer}.arc-v12-0-0-beta-16 .arc .arc-Popover-trigger:focus-visible{outline:2px solid var(--focus-colors-light-border-subtle);outline-offset:2px}
+.arc-v12-0-0-beta-18 .arc .arc-Popover-content{background:var(--popover-colors-light-bg-default);border:var(--popover-border-width) solid var(--popover-colors-light-border);border-radius:var(--popover-border-radius);box-shadow:var(--elevation-01);outline:none;overflow:hidden;padding:16px}.arc-v12-0-0-beta-18 .arc .arc-Popover-arrow{background:var(--popover-colors-light-bg-default);border-bottom:var(--popover-border-width) solid var(--popover-colors-light-border);border-bottom-right-radius:1px;border-right:var(--popover-border-width) solid var(--popover-colors-light-border);fill:none;height:11.31px;position:relative;transform:translate(0,-52%) rotate(45deg);width:11.31px}.arc-v12-0-0-beta-18 .arc .arc-Popover-content:not(:focus-visible){outline:none}.arc-v12-0-0-beta-18 .arc .arc-Popover-content--dark,.arc-v12-0-0-beta-18 .arc .arc-Popover-content--dark .arc-Popover-arrow{background:var(--popover-colors-dark-bg-default);border-color:var(--popover-colors-dark-border)}.arc-v12-0-0-beta-18 .arc .arc-Popover-content--brand,.arc-v12-0-0-beta-18 .arc .arc-Popover-content--brand .arc-Popover-arrow{background:var(--popover-colors-brand-bg-default);border-color:var(--popover-colors-brand-border)}.arc-v12-0-0-beta-18 .arc .arc-Popover-trigger{all:unset;cursor:pointer}.arc-v12-0-0-beta-18 .arc .arc-Popover-trigger:focus-visible{outline:2px solid var(--focus-colors-light-border-subtle);outline-offset:2px}

package/lib/Poster/styles.css

@@ -1 +1 @@
-:root{--arc-poster-linear-gradient-scrim-left-light:linear-gradient(to left,transparent 0%,rgba(255,255,255,0.002) 0.4%,rgba(255,255,255,0.008) 0.8%,rgba(255,255,255,0.021) 4.8%,rgba(255,255,255,0.042) 9%,rgba(255,255,255,0.075) 13.9%,rgba(255,255,255,0.126) 19.8%,rgba(255,255,255,0.25) 27%,rgba(255,255,255,0.53) 35%,rgba(255,255,255,0.75) 43.5%,rgba(255,255,255,0.85) 53%,rgba(255,255,255,0.9) 66%,rgba(255,255,255,0.93) 81%,rgba(255,255,255,0.96) 100%);--arc-poster-overlay-light:linear-gradient(to left,rgba(255,255,255,0.541) 0%,rgba(255,255,255,0.541) 100%);--arc-poster-linear-gradient-scrim-left-dark:linear-gradient(to left,transparent 0%,rgba(85,20,180,0.002) 0.4%,rgba(85,20,180,0.008) 0.8%,rgba(85,20,180,0.021) 4.8%,rgba(85,20,180,0.042) 9%,rgba(85,20,180,0.075) 13.9%,rgba(85,20,180,0.126) 19.8%,rgba(85,20,180,0.19399999999999998) 27%,rgba(85,20,180,0.278) 35%,rgba(85,20,180,0.382) 43.5%,rgba(85,20,180,0.541) 53%,rgba(85,20,180,0.738) 66%,rgba(42,28,74,0.9) 81%,rgba(42,28,74,0.9) 100%);--arc-poster-overlay-dark:linear-gradient(to left,rgba(42,28,74,0.382) 0%,rgba(42,28,74,0.382) 100%)}.arc-v12-0-0-beta-16 .arc .arc-Poster{position:relative}.arc .arc-Poster-body{position:relative;z-index:1}.arc-v12-0-0-beta-16 .arc .arc-Poster-backgroundWrapper{bottom:0;display:block;left:0;overflow:hidden;position:absolute;right:0;top:0}.arc-v12-0-0-beta-16 .arc .arc-Poster--overlay{position:relative}.arc-v12-0-0-beta-16 .arc .arc-Poster--overlay::after{background-image:var(--arc-poster-overlay-dark);bottom:0;content:"";left:0;position:absolute;right:0;top:0}.arc-v12-0-0-beta-16 .arc .arc-Poster--overlayLight::after{background-image:var(--arc-poster-overlay-light)}@media (min-width:768px){.arc-v12-0-0-beta-16 .arc .arc-Poster--overlay::after{background-image:var(--arc-poster-linear-gradient-scrim-left-dark)}.arc-v12-0-0-beta-16 .arc .arc-Poster--overlayLight::after{background-image:var(--arc-poster-linear-gradient-scrim-left-light)}}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo{height:100%;width:100%}@supports (object-fit:cover) and (object-position:50% 50%){.arc-v12-0-0-beta-16 .arc .arc-PosterVideo{object-fit:cover;visibility:visible}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorN{object-position:50% 0}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorNE{object-position:100% 0}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorE{object-position:100% 50%}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorSE{object-position:100% 100%}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorS{object-position:50% 100%}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorSW{object-position:0 100%}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorW{object-position:0 50%}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorNW{object-position:0 0}.arc-v12-0-0-beta-16 .arc .arc-PosterVideo--anchorC{object-position:50% 50%}}.arc-v12-0-0-beta-16 .arc .arc-Poster--overlay:not(.arc-Poster--overlayLight)::after{background-image:var(--arc-poster-overlay-dark)}@media (min-width:768px){.arc-v12-0-0-beta-16 .arc .arc-Poster--overlay:not(.arc-Poster--overlayLight)::after{background-image:var(--arc-poster-linear-gradient-scrim-left-dark)}}
+:root{--arc-poster-linear-gradient-scrim-left-light:linear-gradient(to left,transparent 0%,rgba(255,255,255,0.002) 0.4%,rgba(255,255,255,0.008) 0.8%,rgba(255,255,255,0.021) 4.8%,rgba(255,255,255,0.042) 9%,rgba(255,255,255,0.075) 13.9%,rgba(255,255,255,0.126) 19.8%,rgba(255,255,255,0.25) 27%,rgba(255,255,255,0.53) 35%,rgba(255,255,255,0.75) 43.5%,rgba(255,255,255,0.85) 53%,rgba(255,255,255,0.9) 66%,rgba(255,255,255,0.93) 81%,rgba(255,255,255,0.96) 100%);--arc-poster-overlay-light:linear-gradient(to left,rgba(255,255,255,0.541) 0%,rgba(255,255,255,0.541) 100%);--arc-poster-linear-gradient-scrim-left-dark:linear-gradient(to left,transparent 0%,rgba(85,20,180,0.002) 0.4%,rgba(85,20,180,0.008) 0.8%,rgba(85,20,180,0.021) 4.8%,rgba(85,20,180,0.042) 9%,rgba(85,20,180,0.075) 13.9%,rgba(85,20,180,0.126) 19.8%,rgba(85,20,180,0.19399999999999998) 27%,rgba(85,20,180,0.278) 35%,rgba(85,20,180,0.382) 43.5%,rgba(85,20,180,0.541) 53%,rgba(85,20,180,0.738) 66%,rgba(42,28,74,0.9) 81%,rgba(42,28,74,0.9) 100%);--arc-poster-overlay-dark:linear-gradient(to left,rgba(42,28,74,0.382) 0%,rgba(42,28,74,0.382) 100%)}.arc-v12-0-0-beta-18 .arc .arc-Poster{position:relative}.arc .arc-Poster-body{position:relative;z-index:1}.arc-v12-0-0-beta-18 .arc .arc-Poster-backgroundWrapper{bottom:0;display:block;left:0;overflow:hidden;position:absolute;right:0;top:0}.arc-v12-0-0-beta-18 .arc .arc-Poster--overlay{position:relative}.arc-v12-0-0-beta-18 .arc .arc-Poster--overlay::after{background-image:var(--arc-poster-overlay-dark);bottom:0;content:"";left:0;position:absolute;right:0;top:0}.arc-v12-0-0-beta-18 .arc .arc-Poster--overlayLight::after{background-image:var(--arc-poster-overlay-light)}@media (min-width:768px){.arc-v12-0-0-beta-18 .arc .arc-Poster--overlay::after{background-image:var(--arc-poster-linear-gradient-scrim-left-dark)}.arc-v12-0-0-beta-18 .arc .arc-Poster--overlayLight::after{background-image:var(--arc-poster-linear-gradient-scrim-left-light)}}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo{height:100%;width:100%}@supports (object-fit:cover) and (object-position:50% 50%){.arc-v12-0-0-beta-18 .arc .arc-PosterVideo{object-fit:cover;visibility:visible}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorN{object-position:50% 0}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorNE{object-position:100% 0}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorE{object-position:100% 50%}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorSE{object-position:100% 100%}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorS{object-position:50% 100%}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorSW{object-position:0 100%}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorW{object-position:0 50%}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorNW{object-position:0 0}.arc-v12-0-0-beta-18 .arc .arc-PosterVideo--anchorC{object-position:50% 50%}}.arc-v12-0-0-beta-18 .arc .arc-Poster--overlay:not(.arc-Poster--overlayLight)::after{background-image:var(--arc-poster-overlay-dark)}@media (min-width:768px){.arc-v12-0-0-beta-18 .arc .arc-Poster--overlay:not(.arc-Poster--overlayLight)::after{background-image:var(--arc-poster-linear-gradient-scrim-left-dark)}}

package/lib/ProgressBar/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-container{margin:var(--progress-bar-gap-m) 0 0}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-outerBar{background:var(--progress-bar-colors-light-bg-default-alt);border-radius:20px;height:var(--progress-bar-size-s);overflow:hidden}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-description{margin:var(--progress-bar-gap-m) 0 0}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-bar{height:100%}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-titleDisplayValueContainer{align-items:flex-end;display:flex}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-titleContainer{flex:1 1 auto}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-displayValueContainer{flex:0 1 auto}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-actionContainer{align-items:center;display:flex}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-actionButton{background:transparent;border:none;cursor:pointer;font:inherit;margin:0;outline:none;padding:0;position:relative}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-actionButton:focus-visible::before{border-radius:10px;bottom:calc(0px - 4px);box-shadow:0 0 0 var(--focus-border-weight-s) var(--focus-colors-light-border-subtle);content:"";left:calc(0px - 4px);position:absolute;right:calc(0px - 4px);top:calc(0px - 4px)}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar-actionButton:focus:not(:focus-visible)::before{box-shadow:none}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-fg-default)}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-default-alt)}@media (hover:hover){.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-default-alt-hover)}}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-fg-error)}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-description,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-error)}@media (hover:hover){.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-error-hover)}}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-bg-success)}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-success)}@media (hover:hover){.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-success-hover)}}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--loading .arc-ProgressBar-bar--indeterminate{animation:indeterminate 2s ease infinite;width:calc(100% / 3)}.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--error .arc-ProgressBar-bar--indeterminate,.arc-v12-0-0-beta-16 .arc .arc-ProgressBar--success .arc-ProgressBar-bar--indeterminate{width:100%}@keyframes indeterminate{from{transform:translateX(-100%)}to{transform:translateX(calc(300%))}}
+.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-container{margin:var(--progress-bar-gap-m) 0 0}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-outerBar{background:var(--progress-bar-colors-light-bg-default-alt);border-radius:20px;height:var(--progress-bar-size-s);overflow:hidden}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-description{margin:var(--progress-bar-gap-m) 0 0}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-bar{height:100%}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-titleDisplayValueContainer{align-items:flex-end;display:flex}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-titleContainer{flex:1 1 auto}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-displayValueContainer{flex:0 1 auto}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-actionContainer{align-items:center;display:flex}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-actionButton{background:transparent;border:none;cursor:pointer;font:inherit;margin:0;outline:none;padding:0;position:relative}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-actionButton:focus-visible::before{border-radius:10px;bottom:calc(0px - 4px);box-shadow:0 0 0 var(--focus-border-weight-s) var(--focus-colors-light-border-subtle);content:"";left:calc(0px - 4px);position:absolute;right:calc(0px - 4px);top:calc(0px - 4px)}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar-actionButton:focus:not(:focus-visible)::before{box-shadow:none}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-fg-default)}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-default-alt)}@media (hover:hover){.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-default-alt-hover)}}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-fg-error)}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-description,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-error)}@media (hover:hover){.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-error-hover)}}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-bar{background:var(--progress-bar-colors-light-bg-success)}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-success)}@media (hover:hover){.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton:hover,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-actionButton:hover .arc-ProgressBar-actionIcon{color:var(--progress-bar-colors-light-text-success-hover)}}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--loading .arc-ProgressBar-bar--indeterminate{animation:indeterminate 2s ease infinite;width:calc(100% / 3)}.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--error .arc-ProgressBar-bar--indeterminate,.arc-v12-0-0-beta-18 .arc .arc-ProgressBar--success .arc-ProgressBar-bar--indeterminate{width:100%}@keyframes indeterminate{from{transform:translateX(-100%)}to{transform:translateX(calc(300%))}}

package/lib/ProgressStepper/ProgressStepper.cjs

@@ -4,38 +4,22 @@
 var filterAttrs = require('../_shared/cjs/filter-attrs-eK6E_34o.cjs');
 var React = require('react');
 var index = require('../_shared/cjs/index-CTlXMLug.cjs');
+var index$1 = require('../_shared/cjs/index-CqYNiqix.cjs');
 var capitaliseFirstLetter = require('../_shared/cjs/capitalise-first-letter-CdhexpSx.cjs');
 var VisuallyHidden = require('../_shared/cjs/VisuallyHidden-B4XCvPYP.cjs');
-var Icon = require('../_shared/cjs/Icon-DdqFr6bT.cjs');
+var Icon = require('../_shared/cjs/Icon-KMACQ1i3.cjs');
 require('../_shared/cjs/suffix-modifier-DLUGR-yG.cjs');
 require('../_shared/cjs/index-DR8Rkav9.cjs');
 require('../_shared/cjs/Surface-BFx1yNsq.cjs');
 
-var Error = function () { return (React.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React.createElement("g", { clipPath: "url(#a)" },
-        React.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.createElement("defs", null,
-        React.createElement("clipPath", { id: "a" },
-            React.createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
+var Error = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <g clipPath=\"url(#a)\">\n      <path\n        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\"\n        fill=\"currentColor\"\n      />\n    </g>\n    <defs>\n      <clipPath id=\"a\">\n        <rect width=\"24\" height=\"24\" rx=\"12\" />\n      </clipPath>\n    </defs>\n  </svg>\n  ";
 
-var Warning = function () { return (React.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React.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 Warning = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path\n      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\"\n      fill=\"currentColor\"\n      stroke=\"currentColor\"\n      strokeWidth=\".3\"\n    />\n  </svg>\n";
 
-var Complete = function () { return (React.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React.createElement("g", { clipPath: "url(#a)" },
-        React.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.createElement("defs", null,
-        React.createElement("clipPath", null,
-            React.createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
+var Complete = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <g clipPath=\"url(#a)\">\n      <path\n        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\"\n        fill=\"currentColor\"\n      />\n    </g>\n    <defs>\n      <clipPath>\n        <rect width=\"24\" height=\"24\" rx=\"12\" />\n      </clipPath>\n    </defs>\n  </svg>\n  ";
 
-var Current = function () { return (React.createElement("svg", { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-    React.createElement("circle", { cx: "12", cy: "12", r: "7", fill: "currentColor" }),
-    React.createElement("defs", null,
-        React.createElement("linearGradient", { id: "paint0_linear_1_1050", x1: "36.6036", y1: "-4.31391e-07", x2: "-12.6036", y2: "24", gradientUnits: "userSpaceOnUse" },
-            React.createElement("stop", { stopColor: "#F200F5" }),
-            React.createElement("stop", { offset: "1", stopColor: "#1EC8E6" }))))); };
+var Current = "\n  <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <circle cx=\"12\" cy=\"12\" r=\"7\" fill=\"currentColor\" />\n    <defs>\n      <linearGradient\n        id=\"paint0_linear_1_1050\"\n        x1=\"36.6036\"\n        y1=\"-4.31391e-07\"\n        x2=\"-12.6036\"\n        y2=\"24\"\n        gradientUnits=\"userSpaceOnUse\"\n      >\n        <stop stopColor=\"#F200F5\" />\n        <stop offset=\"1\" stopColor=\"#1EC8E6\" />\n      </linearGradient>\n    </defs>\n  </svg>\n  ";
 
-// export current step as an icon
 var ProgressStepperItem = function (_a) {
     var _b;
     var title = _a.title, titleHref = _a.titleHref, subTitle = _a.subTitle, _c = _a.direction, direction = _c === void 0 ? "horizontal" : _c, _d = _a.status, status = _d === void 0 ? "todo" : _d, _e = _a.size, size = _e === void 0 ? "large" : _e, isFluid = _a.isFluid, invertLabelPosition = _a.invertLabelPosition, ariaLabel = _a.ariaLabel, onClick = _a.onClick, previousStep = _a.previousStep, stepContent = _a.stepContent, isStepContentHidden = _a.isStepContentHidden, props = filterAttrs.__rest(_a, ["title", "titleHref", "subTitle", "direction", "status", "size", "isFluid", "invertLabelPosition", "ariaLabel", "onClick", "previousStep", "stepContent", "isStepContentHidden"]);
@@ -50,6 +34,7 @@ var ProgressStepperItem = function (_a) {
         event.preventDefault();
         onClick && onClick();
     };
+    var statusIcon = statusIcons[status];
     return (React.createElement("div", filterAttrs.__assign({ className: index.classNames("arc-ProgressStepperItem", "arc-ProgressStepperItem--".concat(status), "arc-ProgressStepperItem--".concat(size), (_b = {
                 "arc-ProgressStepperItem--vertical": direction === "vertical",
                 "arc-ProgressStepperItem--isFluid": isFluid && direction !== "vertical",
@@ -62,7 +47,7 @@ var ProgressStepperItem = function (_a) {
             React.createElement("div", { className: "arc-ProgressStepperItem-iconWrapper", "data-testid": "arc-ProgressStepperItem-iconWrapper" },
                 React.createElement("span", { className: index.classNames("arc-ProgressStepperItem-statusIcon", {
                         "arc-ProgressStepperItem-statusIcon--small": size === "small",
-                    }) }, status === "todo" ? null : status === "current" ? (React.createElement("div", { className: "arc-ProgressStepperItem-statusIconInner" })) : (React.createElement(Icon.Icon, { icon: statusIcons[status] }))))),
+                    }) }, status === "todo" ? null : status === "current" ? (React.createElement("div", { className: "arc-ProgressStepperItem-statusIconInner" })) : (React.createElement(Icon.Icon, { icon: statusIcon && index$1.svgToMiniDataURI(statusIcon) }))))),
         React.createElement("div", { className: "arc-ProgressStepperItem-textSection" },
             titleHref || onClick ? (React.createElement("a", { role: !titleHref && onClick ? "button" : undefined, href: titleHref, "aria-label": ariaLabel, className: index.classNames("arc-ProgressStepperItem-title", "arc-ProgressStepperItem-title--link"), onClick: onClickHandler },
                 title,

package/lib/ProgressStepper/ProgressStepper.mjs

@@ -2,38 +2,22 @@
 import { _ as __rest, a as __assign, f as filterAttrs } from '../_shared/esm/filter-attrs-B6CM-NUr.mjs';
 import React__default from 'react';
 import { c as classNames } from '../_shared/esm/index-5C0-U8cc.mjs';
+import { s as svgToMiniDataURI } from '../_shared/esm/index-CL6dwOYV.mjs';
 import { c as capitaliseFirstLetter } from '../_shared/esm/capitalise-first-letter-Cubg2CS1.mjs';
 import { V as VisuallyHidden } from '../_shared/esm/VisuallyHidden-DqAgoqJo.mjs';
-import { I as Icon } from '../_shared/esm/Icon-B626JGP1.mjs';
+import { I as Icon } from '../_shared/esm/Icon-MZfaoOo9.mjs';
 import '../_shared/esm/suffix-modifier-B_pO0UkF.mjs';
 import '../_shared/esm/index-Spae4j7j.mjs';
 import '../_shared/esm/Surface-Colbp3Zx.mjs';
 
-var Error = function () { return (React__default.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default.createElement("g", { clipPath: "url(#a)" },
-        React__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.createElement("defs", null,
-        React__default.createElement("clipPath", { id: "a" },
-            React__default.createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
+var Error = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <g clipPath=\"url(#a)\">\n      <path\n        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\"\n        fill=\"currentColor\"\n      />\n    </g>\n    <defs>\n      <clipPath id=\"a\">\n        <rect width=\"24\" height=\"24\" rx=\"12\" />\n      </clipPath>\n    </defs>\n  </svg>\n  ";
 
-var Warning = function () { return (React__default.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__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 Warning = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path\n      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\"\n      fill=\"currentColor\"\n      stroke=\"currentColor\"\n      strokeWidth=\".3\"\n    />\n  </svg>\n";
 
-var Complete = function () { return (React__default.createElement("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
-    React__default.createElement("g", { clipPath: "url(#a)" },
-        React__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.createElement("defs", null,
-        React__default.createElement("clipPath", null,
-            React__default.createElement("rect", { width: "24", height: "24", rx: "12" }))))); };
+var Complete = "\n  <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <g clipPath=\"url(#a)\">\n      <path\n        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\"\n        fill=\"currentColor\"\n      />\n    </g>\n    <defs>\n      <clipPath>\n        <rect width=\"24\" height=\"24\" rx=\"12\" />\n      </clipPath>\n    </defs>\n  </svg>\n  ";
 
-var Current = function () { return (React__default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-    React__default.createElement("circle", { cx: "12", cy: "12", r: "7", fill: "currentColor" }),
-    React__default.createElement("defs", null,
-        React__default.createElement("linearGradient", { id: "paint0_linear_1_1050", x1: "36.6036", y1: "-4.31391e-07", x2: "-12.6036", y2: "24", gradientUnits: "userSpaceOnUse" },
-            React__default.createElement("stop", { stopColor: "#F200F5" }),
-            React__default.createElement("stop", { offset: "1", stopColor: "#1EC8E6" }))))); };
+var Current = "\n  <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <circle cx=\"12\" cy=\"12\" r=\"7\" fill=\"currentColor\" />\n    <defs>\n      <linearGradient\n        id=\"paint0_linear_1_1050\"\n        x1=\"36.6036\"\n        y1=\"-4.31391e-07\"\n        x2=\"-12.6036\"\n        y2=\"24\"\n        gradientUnits=\"userSpaceOnUse\"\n      >\n        <stop stopColor=\"#F200F5\" />\n        <stop offset=\"1\" stopColor=\"#1EC8E6\" />\n      </linearGradient>\n    </defs>\n  </svg>\n  ";
 
-// export current step as an icon
 var ProgressStepperItem = function (_a) {
     var _b;
     var title = _a.title, titleHref = _a.titleHref, subTitle = _a.subTitle, _c = _a.direction, direction = _c === void 0 ? "horizontal" : _c, _d = _a.status, status = _d === void 0 ? "todo" : _d, _e = _a.size, size = _e === void 0 ? "large" : _e, isFluid = _a.isFluid, invertLabelPosition = _a.invertLabelPosition, ariaLabel = _a.ariaLabel, onClick = _a.onClick, previousStep = _a.previousStep, stepContent = _a.stepContent, isStepContentHidden = _a.isStepContentHidden, props = __rest(_a, ["title", "titleHref", "subTitle", "direction", "status", "size", "isFluid", "invertLabelPosition", "ariaLabel", "onClick", "previousStep", "stepContent", "isStepContentHidden"]);
@@ -48,6 +32,7 @@ var ProgressStepperItem = function (_a) {
         event.preventDefault();
         onClick && onClick();
     };
+    var statusIcon = statusIcons[status];
     return (React__default.createElement("div", __assign({ className: classNames("arc-ProgressStepperItem", "arc-ProgressStepperItem--".concat(status), "arc-ProgressStepperItem--".concat(size), (_b = {
                 "arc-ProgressStepperItem--vertical": direction === "vertical",
                 "arc-ProgressStepperItem--isFluid": isFluid && direction !== "vertical",
@@ -60,7 +45,7 @@ var ProgressStepperItem = function (_a) {
             React__default.createElement("div", { className: "arc-ProgressStepperItem-iconWrapper", "data-testid": "arc-ProgressStepperItem-iconWrapper" },
                 React__default.createElement("span", { className: classNames("arc-ProgressStepperItem-statusIcon", {
                         "arc-ProgressStepperItem-statusIcon--small": size === "small",
-                    }) }, status === "todo" ? null : status === "current" ? (React__default.createElement("div", { className: "arc-ProgressStepperItem-statusIconInner" })) : (React__default.createElement(Icon, { icon: statusIcons[status] }))))),
+                    }) }, status === "todo" ? null : status === "current" ? (React__default.createElement("div", { className: "arc-ProgressStepperItem-statusIconInner" })) : (React__default.createElement(Icon, { icon: statusIcon && svgToMiniDataURI(statusIcon) }))))),
         React__default.createElement("div", { className: "arc-ProgressStepperItem-textSection" },
             titleHref || onClick ? (React__default.createElement("a", { role: !titleHref && onClick ? "button" : undefined, href: titleHref, "aria-label": ariaLabel, className: classNames("arc-ProgressStepperItem-title", "arc-ProgressStepperItem-title--link"), onClick: onClickHandler },
                 title,

package/lib/ProgressStepper/styles.css

@@ -1 +1 @@
-.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem{display:flex;flex-direction:column;max-width:164px;min-width:164px}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--invertLabelPosition{flex-direction:column-reverse;justify-content:space-between}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-iconWrapper{align-self:center;border-radius:100%;flex:0 0 auto;position:relative}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-nodeItem{margin-bottom:var(--vertical-space-size-24)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-title{font:var(--sem-type-body-semi-m)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-title--link{cursor:pointer;text-decoration:none}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-subTitle{font:var(--sem-type-body-reg-s);font-style:normal}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-textSection{padding:var(--stepper-padding-s) var(--stepper-padding-s) 0 0}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--invertLabelPosition .arc-ProgressStepperItem-textSection{padding:0 var(--stepper-padding-s) var(--stepper-padding-s) 0}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-iconSection{align-items:center;display:flex}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem .arc-ProgressStepperItem-iconSection::after{background-color:var(--stepper-colors-light-bg-subtle);content:"";display:block;height:1px;width:100%}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem:last-of-type .arc-ProgressStepperItem-iconSection::after{display:none}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-statusIcon{border:var(--stepper-border-weight-m) solid transparent;border-radius:var(--stepper-border-radius);display:block;height:var(--stepper-size-icon-l);width:var(--stepper-size-icon-l)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-title,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-subTitle{color:var(--stepper-colors-light-text-default)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-title--link:hover,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-title--link:hover{color:var(--stepper-colors-light-text-hover);-webkit-text-decoration:var(--sem-underline);text-decoration:var(--sem-underline)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-title,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-subTitle{color:var(--stepper-colors-light-text-subtle)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-iconSection::after{background-color:var(--stepper-colors-light-bg-default)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-statusIcon{border-color:var(--stepper-colors-light-border-subtle)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--current .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-statusIcon{border-color:var(--stepper-colors-light-border-default);color:var(--stepper-colors-light-border-default)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--current .arc-ProgressStepperItem-iconWrapper{animation:pulse-animation 2s infinite}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--error .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--error .arc-ProgressStepperItem-statusIcon{background-color:var(--stepper-colors-light-bg-error-subtle);border-color:var(--stepper-colors-light-border-error);color:var(--stepper-colors-light-border-error)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--warning .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--warning .arc-ProgressStepperItem-statusIcon{background-color:var(--stepper-colors-light-bg-warning-subtle);border-color:var(--stepper-colors-light-border-warning);color:var(--stepper-colors-light-border-warning)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--isFluid .arc-ProgressStepperItem::after,.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--isFluid .arc-ProgressStepperItem-iconSection{width:100%}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--isFluid{flex:1 1 0;max-width:100%;min-width:auto}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--small .arc-ProgressStepperItem-title{font:var(--sem-type-body-semi-s);font-style:normal}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--small .arc-ProgressStepperItem-subTitle{font:var(--sem-type-body-reg-xs);font-style:normal}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start;max-width:100%;min-height:68px;min-width:auto}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-iconSection::after{height:100%;width:1px}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-iconSection{align-items:center;flex:0 1 auto;flex-direction:column}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-textSection{flex:1 1 auto;margin-top:-4px;padding:0 0 0 var(--vertical-space-size-16);width:100%}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-subTitle{margin-bottom:var(--vertical-space-size-24)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical.arc-ProgressStepperItem--small{min-height:64px}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical:last-of-type{min-height:auto}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical:last-of-type .arc-ProgressStepperItem-nodeItem{margin-bottom:0;margin-top:var(--vertical-space-size-24)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem--vertical:last-of-type .arc-ProgressStepperItem-subTitle{margin-bottom:0}@keyframes pulse-animation{from{box-shadow:0 0 0 0 var(--stepper-colors-light-pluse-from)}to{box-shadow:0 0 0 8px var(--stepper-colors-light-pluse-to)}}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-statusIcon--small{height:var(--stepper-size-icon-s);width:var(--stepper-size-icon-s)}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-statusIconInner::before{background:var(--stepper-colors-light-border-variant) border-box;border:var(--stepper-border-weight-m) solid transparent;border-radius:var(--stepper-border-radius);bottom:0;content:"";left:0;-webkit-mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);-webkit-mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);-webkit-mask:linear-gradient(#ffffff 0 0) padding-box,linear-gradient(#ffffff 0 0);mask:linear-gradient(#ffffff 0 0) padding-box,linear-gradient(#ffffff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;position:absolute;right:0;top:0}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepperItem-statusIconInner::after{background:var(--stepper-colors-light-fg-variant);border-radius:1000px;content:"";height:100%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0.5);width:100%}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepper{display:flex}.arc-v12-0-0-beta-16 .arc .arc-ProgressStepper--vertical{flex-direction:column}
+.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem{display:flex;flex-direction:column;max-width:164px;min-width:164px}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--invertLabelPosition{flex-direction:column-reverse;justify-content:space-between}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-iconWrapper{align-self:center;border-radius:100%;flex:0 0 auto;position:relative}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-nodeItem{margin-bottom:var(--vertical-space-size-24)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-title{font:var(--sem-type-body-semi-m)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-title--link{cursor:pointer;text-decoration:none}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-subTitle{font:var(--sem-type-body-reg-s);font-style:normal}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-textSection{padding:var(--stepper-padding-s) var(--stepper-padding-s) 0 0}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--invertLabelPosition .arc-ProgressStepperItem-textSection{padding:0 var(--stepper-padding-s) var(--stepper-padding-s) 0}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-iconSection{align-items:center;display:flex}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem .arc-ProgressStepperItem-iconSection::after{background-color:var(--stepper-colors-light-bg-subtle);content:"";display:block;height:1px;width:100%}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem:last-of-type .arc-ProgressStepperItem-iconSection::after{display:none}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-statusIcon{border:var(--stepper-border-weight-s) solid transparent;border-radius:var(--stepper-border-radius);display:block;height:var(--stepper-size-icon-l);width:var(--stepper-size-icon-l)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-title,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-subTitle{color:var(--stepper-colors-light-text-default)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--hasInteractiveStatus .arc-ProgressStepperItem-title--link:hover,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-title--link:hover{color:var(--stepper-colors-light-text-hover);-webkit-text-decoration:var(--sem-underline);text-decoration:var(--sem-underline)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-title,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-subTitle{color:var(--stepper-colors-light-text-subtle)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-iconSection::after{background-color:var(--stepper-colors-light-bg-default)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--todo .arc-ProgressStepperItem-statusIcon{border-color:var(--stepper-colors-light-border-subtle)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--current .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--completed .arc-ProgressStepperItem-statusIcon{border-color:var(--stepper-colors-light-border-default);color:var(--stepper-colors-light-border-default)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--current .arc-ProgressStepperItem-iconWrapper{animation:pulse-animation 2s infinite}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--error .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--error .arc-ProgressStepperItem-statusIcon{background-color:var(--stepper-colors-light-bg-error-subtle);border-color:var(--stepper-colors-light-border-error);color:var(--stepper-colors-light-border-error)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--warning .arc-ProgressStepperItem-iconWrapper,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--warning .arc-ProgressStepperItem-statusIcon{background-color:var(--stepper-colors-light-bg-warning-subtle);border-color:var(--stepper-colors-light-border-warning);color:var(--stepper-colors-light-border-warning)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--isFluid .arc-ProgressStepperItem::after,.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--isFluid .arc-ProgressStepperItem-iconSection{width:100%}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--isFluid{flex:1 1 0;max-width:100%;min-width:auto}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--small .arc-ProgressStepperItem-title{font:var(--sem-type-body-semi-s);font-style:normal}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--small .arc-ProgressStepperItem-subTitle{font:var(--sem-type-body-reg-xs);font-style:normal}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start;max-width:100%;min-height:68px;min-width:auto}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-iconSection::after{height:100%;width:1px}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-iconSection{align-items:center;flex:0 1 auto;flex-direction:column}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-textSection{flex:1 1 auto;margin-top:-4px;padding:0 0 0 var(--vertical-space-size-16);width:100%}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical .arc-ProgressStepperItem-subTitle{margin-bottom:var(--vertical-space-size-24)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical.arc-ProgressStepperItem--small{min-height:64px}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical:last-of-type{min-height:auto}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical:last-of-type .arc-ProgressStepperItem-nodeItem{margin-bottom:0;margin-top:var(--vertical-space-size-24)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem--vertical:last-of-type .arc-ProgressStepperItem-subTitle{margin-bottom:0}@keyframes pulse-animation{from{box-shadow:0 0 0 0 var(--stepper-colors-light-pluse-from)}to{box-shadow:0 0 0 8px var(--stepper-colors-light-pluse-to)}}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-statusIcon--small{height:var(--stepper-size-icon-s);width:var(--stepper-size-icon-s)}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-statusIconInner::before{background:var(--stepper-colors-light-border-variant) border-box;border:var(--stepper-border-weight-s) solid transparent;border-radius:var(--stepper-border-radius);bottom:0;content:"";left:0;-webkit-mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);-webkit-mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);mask:linear-gradient(#ffffff 0,#ffffff 0) padding-box,linear-gradient(#ffffff 0,#ffffff 0);-webkit-mask:linear-gradient(#ffffff 0 0) padding-box,linear-gradient(#ffffff 0 0);mask:linear-gradient(#ffffff 0 0) padding-box,linear-gradient(#ffffff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;position:absolute;right:0;top:0}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepperItem-statusIconInner::after{background:var(--stepper-colors-light-fg-variant);border-radius:1000px;content:"";height:100%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0.5);width:100%}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepper{display:flex}.arc-v12-0-0-beta-18 .arc .arc-ProgressStepper--vertical{flex-direction:column}