@arc-ui/components 11.13.1 → 12.0.0-alpha.0

package/dist/PaginationSimple/PaginationSimple.cjs.js

@@ -5,10 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var index = require('../_shared/cjs/index-9947ac13.js');
 var React = require('react');
-var BtIconChevronRightMid_esm = require('../_shared/cjs/BtIconChevronRightMid.esm-d01ebbd4.js');
-var BtIconChevronLeftMid_esm = require('../_shared/cjs/BtIconChevronLeftMid.esm-0aaa6770.js');
-var Icon = require('../_shared/cjs/Icon-a9801f05.js');
 var Surface = require('../_shared/cjs/Surface-038db6e1.js');
+var ThemeIcon = require('../_shared/cjs/ThemeIcon-9534f091.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -32,7 +30,7 @@ var PaginationSimple = function (_a) {
                 onPrevPage();
             } },
             React__default["default"].createElement("div", { className: "arc-PaginationSimple-iconContainer arc-PaginationSimple-iconContainer--left" },
-                React__default["default"].createElement(Icon.Icon, { color: "brand", size: 32, icon: BtIconChevronLeftMid_esm.BtIconChevronLeftMid })),
+                React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 32, icon: "paginationSimplePrevious" })),
             React__default["default"].createElement("span", { className: "arc-PaginationSimple-prevText" }, "Prev")),
         React__default["default"].createElement("button", { className: index.classNames("arc-PaginationSimple-navigationButton", {
                 "arc-PaginationSimple-navigationButton--hidden": hideNext
@@ -41,7 +39,7 @@ var PaginationSimple = function (_a) {
             } },
             React__default["default"].createElement("span", { className: "arc-PaginationSimple-nextText" }, "Next"),
             React__default["default"].createElement("div", { className: "arc-PaginationSimple-iconContainer arc-PaginationSimple-iconContainer--right" },
-                React__default["default"].createElement(Icon.Icon, { color: "brand", size: 32, icon: BtIconChevronRightMid_esm.BtIconChevronRightMid })))));
+                React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 32, icon: "paginationSimpleNext" })))));
 };
 
 exports.PaginationSimple = PaginationSimple;

package/dist/PaginationSimple/PaginationSimple.esm.js

@@ -1,10 +1,8 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
 import React__default, { useContext } from 'react';
-import { B as BtIconChevronRightMid } from '../_shared/esm/BtIconChevronRightMid.esm-32268f1a.js';
-import { B as BtIconChevronLeftMid } from '../_shared/esm/BtIconChevronLeftMid.esm-1ed8330b.js';
-import { I as Icon } from '../_shared/esm/Icon-abd0d990.js';
 import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
+import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-eab5a4d0.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 
 /**
@@ -24,7 +22,7 @@ var PaginationSimple = function (_a) {
                 onPrevPage();
             } },
             React__default.createElement("div", { className: "arc-PaginationSimple-iconContainer arc-PaginationSimple-iconContainer--left" },
-                React__default.createElement(Icon, { color: "brand", size: 32, icon: BtIconChevronLeftMid })),
+                React__default.createElement(ThemeIcon, { size: 32, icon: "paginationSimplePrevious" })),
             React__default.createElement("span", { className: "arc-PaginationSimple-prevText" }, "Prev")),
         React__default.createElement("button", { className: classNames("arc-PaginationSimple-navigationButton", {
                 "arc-PaginationSimple-navigationButton--hidden": hideNext
@@ -33,7 +31,7 @@ var PaginationSimple = function (_a) {
             } },
             React__default.createElement("span", { className: "arc-PaginationSimple-nextText" }, "Next"),
             React__default.createElement("div", { className: "arc-PaginationSimple-iconContainer arc-PaginationSimple-iconContainer--right" },
-                React__default.createElement(Icon, { color: "brand", size: 32, icon: BtIconChevronRightMid })))));
+                React__default.createElement(ThemeIcon, { size: 32, icon: "paginationSimpleNext" })))));
 };
 
 export { PaginationSimple };

package/dist/Poster/Poster.cjs.js

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

package/dist/Poster/Poster.esm.js

@@ -1,4 +1,4 @@
-export { P as Poster } from '../_shared/esm/Poster-4ec2f679.js';
+export { P as Poster } from '../_shared/esm/Poster-699dc89b.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import 'react';

package/dist/ProgressBar/ProgressBar.cjs.js

@@ -8,41 +8,18 @@ var React = require('react');
 var Text = require('../_shared/cjs/Text-606ca3a2.js');
 var Heading = require('../_shared/cjs/Heading-27cba320.js');
 var VerticalSpace = require('../_shared/cjs/VerticalSpace-dc53bb70.js');
-var Icon = require('../_shared/cjs/Icon-a9801f05.js');
 var Surface = require('../_shared/cjs/Surface-038db6e1.js');
-var BtIconTickAlt2Px_esm = require('../_shared/cjs/BtIconTickAlt2Px.esm-57c89acc.js');
-var BtIconCrossAlt2Px_esm = require('../_shared/cjs/BtIconCrossAlt2Px.esm-1452b14b.js');
+var ThemeIcon = require('../_shared/cjs/ThemeIcon-9534f091.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const BtIconRefresh = (props) =>
-  /*#__PURE__*/ React__default["default"].createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default["default"].createElement("defs", null),
-    /*#__PURE__*/ React__default["default"].createElement("path", {
-      d: "M13.41077,21.99951a.5005.5005,0,0,0-.35743.8501l2.04609,2.08716A8.98732,8.98732,0,0,1,13.15332,7.46631a.50028.50028,0,1,0-.31641-.94922A9.98437,9.98437,0,0,0,15.127,25.93823l.00159.02881c.0011.01.02008.00128.03015.002L13.026,28.16846a.50036.50036,0,0,0,.71875.69629l3.28418-3.38819-3.26074-3.32715A.50106.50106,0,0,0,13.41077,21.99951Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React__default["default"].createElement("path", {
-      d: "M16.79028,6.04633,16.79,6.04077c-.0011-.01-.02008-.00128-.03015-.00195l2.13275-2.19946a.50036.50036,0,0,0-.71875-.69629L14.88965,6.53125,18.15039,9.8584a.50106.50106,0,0,0,.35742.1499.5005.5005,0,0,0,.35742-.8501L16.7951,7.04657a8.98484,8.98484,0,0,1,2.05646,17.47589.49982.49982,0,1,0,.31641.94824A9.98244,9.98244,0,0,0,16.79028,6.04633Z",
-      fill: "currentColor",
-    }),
-  );
-
 var PROGRESS_BAR_ICON_MAP = {
-    refresh: BtIconRefresh,
-    tick: BtIconTickAlt2Px_esm.BtIconTickAlt2Px,
-    cross: BtIconCrossAlt2Px_esm.BtIconCrossAlt2Px
+    refresh: "progressBarRefresh",
+    tick: "progressBarSuccess",
+    cross: "progressBarError"
 };
 
 var getProgressBarProps = function (isIndeterminate, progressValue, ariaLabel) {
@@ -84,7 +61,7 @@ var ProgressBar = function (_a) {
                     React__default["default"].createElement("div", { className: "arc-ProgressBar-actionContainer" },
                         React__default["default"].createElement(Text.Text, null, action.text),
                         action.icon && (React__default["default"].createElement("div", { className: "arc-ProgressBar-actionIcon" },
-                            React__default["default"].createElement(Icon.Icon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))))))))));
+                            React__default["default"].createElement(ThemeIcon.ThemeIcon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))))))))));
 };
 
 exports.ProgressBar = ProgressBar;

package/dist/ProgressBar/ProgressBar.esm.js

@@ -4,37 +4,14 @@ import React__default, { useContext } from 'react';
 import { T as Text } from '../_shared/esm/Text-14f586ac.js';
 import { H as Heading } from '../_shared/esm/Heading-d16e0e53.js';
 import { V as VerticalSpace } from '../_shared/esm/VerticalSpace-43cd9138.js';
-import { I as Icon } from '../_shared/esm/Icon-abd0d990.js';
 import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
-import { B as BtIconTickAlt2Px } from '../_shared/esm/BtIconTickAlt2Px.esm-0bc2ded0.js';
-import { B as BtIconCrossAlt2Px } from '../_shared/esm/BtIconCrossAlt2Px.esm-7165ab1a.js';
+import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-eab5a4d0.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 
-const BtIconRefresh = (props) =>
-  /*#__PURE__*/ React__default.createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default.createElement("defs", null),
-    /*#__PURE__*/ React__default.createElement("path", {
-      d: "M13.41077,21.99951a.5005.5005,0,0,0-.35743.8501l2.04609,2.08716A8.98732,8.98732,0,0,1,13.15332,7.46631a.50028.50028,0,1,0-.31641-.94922A9.98437,9.98437,0,0,0,15.127,25.93823l.00159.02881c.0011.01.02008.00128.03015.002L13.026,28.16846a.50036.50036,0,0,0,.71875.69629l3.28418-3.38819-3.26074-3.32715A.50106.50106,0,0,0,13.41077,21.99951Z",
-      fill: "currentColor",
-    }),
-    /*#__PURE__*/ React__default.createElement("path", {
-      d: "M16.79028,6.04633,16.79,6.04077c-.0011-.01-.02008-.00128-.03015-.00195l2.13275-2.19946a.50036.50036,0,0,0-.71875-.69629L14.88965,6.53125,18.15039,9.8584a.50106.50106,0,0,0,.35742.1499.5005.5005,0,0,0,.35742-.8501L16.7951,7.04657a8.98484,8.98484,0,0,1,2.05646,17.47589.49982.49982,0,1,0,.31641.94824A9.98244,9.98244,0,0,0,16.79028,6.04633Z",
-      fill: "currentColor",
-    }),
-  );
-
 var PROGRESS_BAR_ICON_MAP = {
-    refresh: BtIconRefresh,
-    tick: BtIconTickAlt2Px,
-    cross: BtIconCrossAlt2Px
+    refresh: "progressBarRefresh",
+    tick: "progressBarSuccess",
+    cross: "progressBarError"
 };
 
 var getProgressBarProps = function (isIndeterminate, progressValue, ariaLabel) {
@@ -76,7 +53,7 @@ var ProgressBar = function (_a) {
                     React__default.createElement("div", { className: "arc-ProgressBar-actionContainer" },
                         React__default.createElement(Text, null, action.text),
                         action.icon && (React__default.createElement("div", { className: "arc-ProgressBar-actionIcon" },
-                            React__default.createElement(Icon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))))))))));
+                            React__default.createElement(ThemeIcon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))))))))));
 };
 
 export { ProgressBar };

package/dist/ProgressStepper/ProgressStepper.cjs.js

@@ -2,16 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var ProgressStepper = require('../_shared/cjs/ProgressStepper-9cdc0afe.js');
+var ProgressStepper = require('../_shared/cjs/ProgressStepper-74ee1eec.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
 require('../_shared/cjs/index-9947ac13.js');
-require('../_shared/cjs/BtIconAlert.esm-1a0ff9f0.js');
-require('../_shared/cjs/Icon-a9801f05.js');
-require('../_shared/cjs/suffix-modifier-64dcd338.js');
 require('../_shared/cjs/Surface-038db6e1.js');
 require('../_shared/cjs/VerticalSpace-dc53bb70.js');
 require('../_shared/cjs/VisuallyHidden-e2c8b291.js');
+require('../_shared/cjs/ThemeIcon-9534f091.js');
+require('../_shared/cjs/suffix-modifier-64dcd338.js');
 
 
 

package/dist/ProgressStepper/ProgressStepper.esm.js

@@ -1,10 +1,9 @@
-export { P as ProgressStepper } from '../_shared/esm/ProgressStepper-f51f86c3.js';
+export { P as ProgressStepper } from '../_shared/esm/ProgressStepper-5de34269.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
 import '../_shared/esm/index-2e73c2e9.js';
-import '../_shared/esm/BtIconAlert.esm-a4608d47.js';
-import '../_shared/esm/Icon-abd0d990.js';
-import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/Surface-0ca6817d.js';
 import '../_shared/esm/VerticalSpace-43cd9138.js';
 import '../_shared/esm/VisuallyHidden-b9eebf71.js';
+import '../_shared/esm/ThemeIcon-eab5a4d0.js';
+import '../_shared/esm/suffix-modifier-3d548e45.js';

package/dist/RadioGroup/RadioGroup.cjs.js

@@ -2,17 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var RadioGroup = require('../_shared/cjs/RadioGroup-56e3b0e5.js');
+var RadioGroup = require('../_shared/cjs/RadioGroup-9bc96f6a.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
-require('../_shared/cjs/FormControl-7daf8110.js');
+require('../_shared/cjs/FormControl-30f2330f.js');
 require('../_shared/cjs/index-9947ac13.js');
-require('../_shared/cjs/BtIconAlert.esm-1a0ff9f0.js');
 require('../_shared/cjs/Surface-038db6e1.js');
-require('../_shared/cjs/DisclosureMini-d0eeb6bb.js');
-require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
+require('../_shared/cjs/DisclosureMini-145105a4.js');
 require('../_shared/cjs/Text-606ca3a2.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
+require('../_shared/cjs/ThemeIcon-9534f091.js');
 
 
 

package/dist/RadioGroup/RadioGroup.esm.js

@@ -1,11 +1,10 @@
-export { R as RadioGroup } from '../_shared/esm/RadioGroup-c838764c.js';
+export { R as RadioGroup } from '../_shared/esm/RadioGroup-002a32ba.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
-import '../_shared/esm/FormControl-351e5f1b.js';
+import '../_shared/esm/FormControl-433228f5.js';
 import '../_shared/esm/index-2e73c2e9.js';
-import '../_shared/esm/BtIconAlert.esm-a4608d47.js';
 import '../_shared/esm/Surface-0ca6817d.js';
-import '../_shared/esm/DisclosureMini-ec17b008.js';
-import '../_shared/esm/BtIconChevronDown2Px.esm-217276c2.js';
+import '../_shared/esm/DisclosureMini-bf95a9db.js';
 import '../_shared/esm/Text-14f586ac.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
+import '../_shared/esm/ThemeIcon-eab5a4d0.js';

package/dist/Rule/Rule.cjs.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
-var index = require('../_shared/cjs/index-9947ac13.js');
 var React = require('react');
-var Surface = require('../_shared/cjs/Surface-038db6e1.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -15,11 +13,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * Use `Rule` to display a horizontal rule.
  */
 var Rule = function (props) {
-    var surface = React.useContext(Surface.Context).surface;
-    return (React__default["default"].createElement("hr", filterDataAttrs.__assign({ className: index.classNames({
-            "arc-Rule": true,
-            "arc-Rule--onDarkSurface": surface === "dark"
-        }) }, filterDataAttrs.filterDataAttrs(props))));
+    return React__default["default"].createElement("hr", filterDataAttrs.__assign({ className: "arc-Rule" }, filterDataAttrs.filterDataAttrs(props)));
 };
 
 exports.Rule = Rule;

package/dist/Rule/Rule.esm.js

@@ -1,17 +1,11 @@
 import { a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
-import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
-import React__default, { useContext } from 'react';
-import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
+import React__default from 'react';
 
 /**
  * Use `Rule` to display a horizontal rule.
  */
 var Rule = function (props) {
-    var surface = useContext(Context).surface;
-    return (React__default.createElement("hr", __assign({ className: classNames({
-            "arc-Rule": true,
-            "arc-Rule--onDarkSurface": surface === "dark"
-        }) }, filterDataAttrs(props))));
+    return React__default.createElement("hr", __assign({ className: "arc-Rule" }, filterDataAttrs(props)));
 };
 
 export { Rule };

package/dist/ScrollToTop/ScrollToTop.cjs.js

@@ -6,37 +6,21 @@ var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var index = require('../_shared/cjs/index-9947ac13.js');
 var React = require('react');
 var debounce = require('../_shared/cjs/debounce-123468fb.js');
-var Icon = require('../_shared/cjs/Icon-a9801f05.js');
+var Surface = require('../_shared/cjs/Surface-038db6e1.js');
+var ThemeIcon = require('../_shared/cjs/ThemeIcon-9534f091.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
-require('../_shared/cjs/Surface-038db6e1.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const BtIconArrowAltUp = (props) =>
-  /*#__PURE__*/ React__default["default"].createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default["default"].createElement("defs", null),
-    /*#__PURE__*/ React__default["default"].createElement("path", {
-      d: "M20.35352,13.14648,16,8.793l-4.35352,4.35352a.49995.49995,0,0,0,.707.707L15.5,10.707V22.5a.5.5,0,0,0,1,0V10.707l3.14648,3.14648a.49995.49995,0,0,0,.707-.707Z",
-      fill: "currentColor",
-    }),
-  );
-
 /**
  * Use `ScrollToTop` to allow the user to scroll to the top of the page by clicking a button.
  */
 var ScrollToTop = function (_a) {
     var _b = _a.appear, appear = _b === void 0 ? "always" : _b, _c = _a.isFixed, isFixed = _c === void 0 ? true : _c, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = filterDataAttrs.__rest(_a, ["appear", "isFixed", "fill", "zIndex"]);
     var _f = React.useState(false), hasScrolled = _f[0], setHasScrolled = _f[1];
+    var surface = React.useContext(Surface.Context).surface;
     React.useEffect(function () {
         var handleScroll = debounce.debounce_1(function () {
             setHasScrolled(window.scrollY > 0);
@@ -54,12 +38,13 @@ var ScrollToTop = function (_a) {
             zIndex: zIndex
         }, className: index.classNames("arc-ScrollToTop", "arc-ScrollToTop--".concat(fill), {
             "arc-ScrollToTop--fixed": isFixed,
+            "arc-ScrollToTop--onDarkSurface": surface === "dark",
             "arc-ScrollToTop--visible": appear === "always" || (appear === "afterScroll" && hasScrolled)
         }) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement("div", { className: "arc-ScrollToTop-textWrapper" },
             React__default["default"].createElement("span", { className: "arc-ScrollToTop-text" }, "Scroll to top")),
         React__default["default"].createElement("span", { className: "arc-ScrollToTop-iconContainer" },
-            React__default["default"].createElement(Icon.Icon, { icon: BtIconArrowAltUp, size: 44 }))));
+            React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 44, icon: "scrollToTop" }))));
 };
 
 exports.ScrollToTop = ScrollToTop;

package/dist/ScrollToTop/ScrollToTop.esm.js

@@ -1,27 +1,10 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
-import React__default, { useState, useEffect } from 'react';
+import React__default, { useState, useContext, useEffect } from 'react';
 import { d as debounce_1 } from '../_shared/esm/debounce-6fed6b84.js';
-import { I as Icon } from '../_shared/esm/Icon-abd0d990.js';
+import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
+import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-eab5a4d0.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
-import '../_shared/esm/Surface-0ca6817d.js';
-
-const BtIconArrowAltUp = (props) =>
-  /*#__PURE__*/ React__default.createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default.createElement("defs", null),
-    /*#__PURE__*/ React__default.createElement("path", {
-      d: "M20.35352,13.14648,16,8.793l-4.35352,4.35352a.49995.49995,0,0,0,.707.707L15.5,10.707V22.5a.5.5,0,0,0,1,0V10.707l3.14648,3.14648a.49995.49995,0,0,0,.707-.707Z",
-      fill: "currentColor",
-    }),
-  );
 
 /**
  * Use `ScrollToTop` to allow the user to scroll to the top of the page by clicking a button.
@@ -29,6 +12,7 @@ const BtIconArrowAltUp = (props) =>
 var ScrollToTop = function (_a) {
     var _b = _a.appear, appear = _b === void 0 ? "always" : _b, _c = _a.isFixed, isFixed = _c === void 0 ? true : _c, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["appear", "isFixed", "fill", "zIndex"]);
     var _f = useState(false), hasScrolled = _f[0], setHasScrolled = _f[1];
+    var surface = useContext(Context).surface;
     useEffect(function () {
         var handleScroll = debounce_1(function () {
             setHasScrolled(window.scrollY > 0);
@@ -46,12 +30,13 @@ var ScrollToTop = function (_a) {
             zIndex: zIndex
         }, className: classNames("arc-ScrollToTop", "arc-ScrollToTop--".concat(fill), {
             "arc-ScrollToTop--fixed": isFixed,
+            "arc-ScrollToTop--onDarkSurface": surface === "dark",
             "arc-ScrollToTop--visible": appear === "always" || (appear === "afterScroll" && hasScrolled)
         }) }, filterDataAttrs(props)),
         React__default.createElement("div", { className: "arc-ScrollToTop-textWrapper" },
             React__default.createElement("span", { className: "arc-ScrollToTop-text" }, "Scroll to top")),
         React__default.createElement("span", { className: "arc-ScrollToTop-iconContainer" },
-            React__default.createElement(Icon, { icon: BtIconArrowAltUp, size: 44 }))));
+            React__default.createElement(ThemeIcon, { size: 44, icon: "scrollToTop" }))));
 };
 
 export { ScrollToTop };

package/dist/Select/Select.cjs.js

@@ -7,18 +7,15 @@ var index$1 = require('../_shared/cjs/index-9947ac13.js');
 var React = require('react');
 var _extends = require('../_shared/cjs/extends-8c5e4b48.js');
 var $7SXl2$reactdom = require('react-dom');
-var index_module = require('../_shared/cjs/index.module-dd1d7d0b.js');
-var index = require('../_shared/cjs/index-43458549.js');
-var BtIconChevronDown2Px_esm = require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
-var BtIconTickAlt2Px_esm = require('../_shared/cjs/BtIconTickAlt2Px.esm-57c89acc.js');
-var Icon = require('../_shared/cjs/Icon-a9801f05.js');
-var FormControl = require('../_shared/cjs/FormControl-7daf8110.js');
+var index_module = require('../_shared/cjs/index.module-7d7228b3.js');
+var index = require('../_shared/cjs/index-38d3848e.js');
+var FormControl = require('../_shared/cjs/FormControl-30f2330f.js');
 var Surface = require('../_shared/cjs/Surface-038db6e1.js');
 var Base = require('../_shared/cjs/Base-f5a86eed.js');
-require('../_shared/cjs/suffix-modifier-64dcd338.js');
-require('../_shared/cjs/BtIconAlert.esm-1a0ff9f0.js');
-require('../_shared/cjs/DisclosureMini-d0eeb6bb.js');
+var ThemeIcon = require('../_shared/cjs/ThemeIcon-9534f091.js');
+require('../_shared/cjs/DisclosureMini-145105a4.js');
 require('../_shared/cjs/Text-606ca3a2.js');
+require('../_shared/cjs/suffix-modifier-64dcd338.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -1705,23 +1702,6 @@ const $cc7e05a45900e73f$export$c3468e2714d175fa = $cc7e05a45900e73f$export$6b919
 const $cc7e05a45900e73f$export$2f60d3ec9ad468f2 = $cc7e05a45900e73f$export$d8117927658af6d7;
 const $cc7e05a45900e73f$export$bf1aedc3039c8d63 = $cc7e05a45900e73f$export$ff951e476c12189;
 
-const BtIconChevronUp2Px = (props) =>
-  /*#__PURE__*/ React__default["default"].createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default["default"].createElement("defs", null),
-    /*#__PURE__*/ React__default["default"].createElement("path", {
-      d: "M28.999,23.5a.99676.99676,0,0,1-.707-.293l-12.28515-12.293L3.708,23.207A.99989.99989,0,0,1,2.294,21.793l13.71289-13.707L29.70605,21.793a.99976.99976,0,0,1-.707,1.707Z",
-      fill: "currentColor",
-    }),
-  );
-
 /** Use `Select` to choose from a dropdown list of options. */
 var Select = function (_a) {
     var _b;
@@ -1759,13 +1739,13 @@ var Select = function (_a) {
                     _b)) }, filterDataAttrs.filterDataAttrs(props)),
                 React__default["default"].createElement($cc7e05a45900e73f$export$4c8d1a57a761ef94, { asChild: true, "aria-label": getSelectedValueName(selectedValue) }, !selectedValue ? (React__default["default"].createElement("span", { "aria-hidden": true, className: "arc-Select-placeHolder" }, placeholder)) : (React__default["default"].createElement("span", { className: "arc-Select-valueItem" }, getSelectedValueName(selectedValue)))),
                 React__default["default"].createElement($cc7e05a45900e73f$export$f04a61298a47a40f, { className: "arc-Select-triggerIcon" },
-                    React__default["default"].createElement(Icon.Icon, { icon: BtIconChevronDown2Px_esm.BtIconChevronDown2Px, size: getIconSize(selectSize) }))),
+                    React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: getIconSize(selectSize), icon: "selectTrigger" }))),
             React__default["default"].createElement($cc7e05a45900e73f$export$602eac185826482c, { container: arcRootElement || undefined },
                 React__default["default"].createElement($cc7e05a45900e73f$export$7c6e2c02157bb7d2, { className: index$1.classNames("arc-Select-content", {
                         "arc-Select-content--onDarkSurface": surface === "dark"
                     }) },
                     React__default["default"].createElement($cc7e05a45900e73f$export$2f60d3ec9ad468f2, { className: "arc-Select-scrollButton" },
-                        React__default["default"].createElement(Icon.Icon, { icon: BtIconChevronUp2Px, size: 16 })),
+                        React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 16, icon: "selectScrollUp" })),
                     React__default["default"].createElement($cc7e05a45900e73f$export$d5c6c08dc2d3ca7, null, options.map(function (_a, i) {
                         var name = _a.name, value = _a.value;
                         return (React__default["default"].createElement($cc7e05a45900e73f$export$6d08773d2e66f8f2, { className: "arc-Select-item", key: "select-item-".concat(i), value: value },
@@ -1773,10 +1753,10 @@ var Select = function (_a) {
                                 React__default["default"].createElement($cc7e05a45900e73f$export$d6e5bf9c43ea9319, { asChild: true },
                                     React__default["default"].createElement("span", { className: "arc-Select-itemText" }, name))),
                             React__default["default"].createElement($cc7e05a45900e73f$export$c3468e2714d175fa, null,
-                                React__default["default"].createElement(Icon.Icon, { icon: BtIconTickAlt2Px_esm.BtIconTickAlt2Px, size: 20 }))));
+                                React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 20, icon: "selectIndicator" }))));
                     })),
                     React__default["default"].createElement($cc7e05a45900e73f$export$bf1aedc3039c8d63, { className: "arc-Select-scrollButton" },
-                        React__default["default"].createElement(Icon.Icon, { icon: BtIconChevronDown2Px_esm.BtIconChevronDown2Px, size: 16 })))))));
+                        React__default["default"].createElement(ThemeIcon.ThemeIcon, { size: 16, icon: "selectScrollDown" })))))));
 };
 
 exports.Select = Select;

package/dist/Select/Select.esm.js

@@ -4,18 +4,15 @@ import * as React from 'react';
 import React__default, { useContext, createContext, useEffect, forwardRef, useState, createElement, useRef, useCallback, Fragment, useMemo, useId } from 'react';
 import { _ as _extends } from '../_shared/esm/extends-8cc61aad.js';
 import $7SXl2$reactdom, { createPortal } from 'react-dom';
-import { $ as $c512c27ab02ef895$export$50c7b4e9d9f19c1, a as $6ed0406888f73fc4$export$c7b2cbe3552a0d05, b as $5e63c961fc1ce211$export$8c6ed5c666ac1360, c as $b1b2314f5f9a1d84$export$25bec8c6f54ee79a, d as $8927f6f2acc4f386$export$250ffa63cdc0d034, e as $e42e1063c40fb3ef$export$b9ecd428b558ff10, f as $8927f6f2acc4f386$export$6d1a0317bde7de7f, g as $9f79659886946c16$export$e5c5a5f917a5871c, h as $71cd76cc60e0454e$export$6f32135080cb4c3, i as $010c2913dbd2fe3d$export$5cae361ad82dce8b } from '../_shared/esm/index.module-44714d3f.js';
-import { h as hideOthers, $ as $01b9c$RemoveScroll } from '../_shared/esm/index-41d7af2b.js';
-import { B as BtIconChevronDown2Px } from '../_shared/esm/BtIconChevronDown2Px.esm-217276c2.js';
-import { B as BtIconTickAlt2Px } from '../_shared/esm/BtIconTickAlt2Px.esm-0bc2ded0.js';
-import { I as Icon } from '../_shared/esm/Icon-abd0d990.js';
-import { F as FormControl } from '../_shared/esm/FormControl-351e5f1b.js';
+import { $ as $c512c27ab02ef895$export$50c7b4e9d9f19c1, a as $6ed0406888f73fc4$export$c7b2cbe3552a0d05, b as $5e63c961fc1ce211$export$8c6ed5c666ac1360, c as $b1b2314f5f9a1d84$export$25bec8c6f54ee79a, d as $8927f6f2acc4f386$export$250ffa63cdc0d034, e as $e42e1063c40fb3ef$export$b9ecd428b558ff10, f as $8927f6f2acc4f386$export$6d1a0317bde7de7f, g as $9f79659886946c16$export$e5c5a5f917a5871c, h as $71cd76cc60e0454e$export$6f32135080cb4c3, i as $010c2913dbd2fe3d$export$5cae361ad82dce8b } from '../_shared/esm/index.module-50b2c98a.js';
+import { h as hideOthers, $ as $01b9c$RemoveScroll } from '../_shared/esm/index-ffd720d0.js';
+import { F as FormControl } from '../_shared/esm/FormControl-433228f5.js';
 import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
 import { A as ArcRootElementContext } from '../_shared/esm/Base-f200653c.js';
-import '../_shared/esm/suffix-modifier-3d548e45.js';
-import '../_shared/esm/BtIconAlert.esm-a4608d47.js';
-import '../_shared/esm/DisclosureMini-ec17b008.js';
+import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-eab5a4d0.js';
+import '../_shared/esm/DisclosureMini-bf95a9db.js';
 import '../_shared/esm/Text-14f586ac.js';
+import '../_shared/esm/suffix-modifier-3d548e45.js';
 
 function $ae6933e535247d3d$export$7d15b64cf5a3a4c4(value, [min, max]) {
     return Math.min(max, Math.max(min, value));
@@ -1678,23 +1675,6 @@ const $cc7e05a45900e73f$export$c3468e2714d175fa = $cc7e05a45900e73f$export$6b919
 const $cc7e05a45900e73f$export$2f60d3ec9ad468f2 = $cc7e05a45900e73f$export$d8117927658af6d7;
 const $cc7e05a45900e73f$export$bf1aedc3039c8d63 = $cc7e05a45900e73f$export$ff951e476c12189;
 
-const BtIconChevronUp2Px = (props) =>
-  /*#__PURE__*/ React__default.createElement(
-    "svg",
-    Object.assign(
-      {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 32 32",
-      },
-      props,
-    ),
-    /*#__PURE__*/ React__default.createElement("defs", null),
-    /*#__PURE__*/ React__default.createElement("path", {
-      d: "M28.999,23.5a.99676.99676,0,0,1-.707-.293l-12.28515-12.293L3.708,23.207A.99989.99989,0,0,1,2.294,21.793l13.71289-13.707L29.70605,21.793a.99976.99976,0,0,1-.707,1.707Z",
-      fill: "currentColor",
-    }),
-  );
-
 /** Use `Select` to choose from a dropdown list of options. */
 var Select = function (_a) {
     var _b;
@@ -1732,13 +1712,13 @@ var Select = function (_a) {
                     _b)) }, filterDataAttrs(props)),
                 React__default.createElement($cc7e05a45900e73f$export$4c8d1a57a761ef94, { asChild: true, "aria-label": getSelectedValueName(selectedValue) }, !selectedValue ? (React__default.createElement("span", { "aria-hidden": true, className: "arc-Select-placeHolder" }, placeholder)) : (React__default.createElement("span", { className: "arc-Select-valueItem" }, getSelectedValueName(selectedValue)))),
                 React__default.createElement($cc7e05a45900e73f$export$f04a61298a47a40f, { className: "arc-Select-triggerIcon" },
-                    React__default.createElement(Icon, { icon: BtIconChevronDown2Px, size: getIconSize(selectSize) }))),
+                    React__default.createElement(ThemeIcon, { size: getIconSize(selectSize), icon: "selectTrigger" }))),
             React__default.createElement($cc7e05a45900e73f$export$602eac185826482c, { container: arcRootElement || undefined },
                 React__default.createElement($cc7e05a45900e73f$export$7c6e2c02157bb7d2, { className: classNames("arc-Select-content", {
                         "arc-Select-content--onDarkSurface": surface === "dark"
                     }) },
                     React__default.createElement($cc7e05a45900e73f$export$2f60d3ec9ad468f2, { className: "arc-Select-scrollButton" },
-                        React__default.createElement(Icon, { icon: BtIconChevronUp2Px, size: 16 })),
+                        React__default.createElement(ThemeIcon, { size: 16, icon: "selectScrollUp" })),
                     React__default.createElement($cc7e05a45900e73f$export$d5c6c08dc2d3ca7, null, options.map(function (_a, i) {
                         var name = _a.name, value = _a.value;
                         return (React__default.createElement($cc7e05a45900e73f$export$6d08773d2e66f8f2, { className: "arc-Select-item", key: "select-item-".concat(i), value: value },
@@ -1746,10 +1726,10 @@ var Select = function (_a) {
                                 React__default.createElement($cc7e05a45900e73f$export$d6e5bf9c43ea9319, { asChild: true },
                                     React__default.createElement("span", { className: "arc-Select-itemText" }, name))),
                             React__default.createElement($cc7e05a45900e73f$export$c3468e2714d175fa, null,
-                                React__default.createElement(Icon, { icon: BtIconTickAlt2Px, size: 20 }))));
+                                React__default.createElement(ThemeIcon, { size: 20, icon: "selectIndicator" }))));
                     })),
                     React__default.createElement($cc7e05a45900e73f$export$bf1aedc3039c8d63, { className: "arc-Select-scrollButton" },
-                        React__default.createElement(Icon, { icon: BtIconChevronDown2Px, size: 16 })))))));
+                        React__default.createElement(ThemeIcon, { size: 16, icon: "selectScrollDown" })))))));
 };
 
 export { Select };

package/dist/SiteFooter/SiteFooter.cjs.js

@@ -2,18 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var SiteFooter = require('../_shared/cjs/SiteFooter-6381ac4a.js');
+var SiteFooter = require('../_shared/cjs/SiteFooter-0638c27c.js');
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var React = require('react');
 require('../_shared/cjs/index.es-77def0c9.js');
-require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
 require('../_shared/cjs/BrandLogo-aea340c8.js');
 require('../_shared/cjs/index-9947ac13.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
 require('../_shared/cjs/Surface-038db6e1.js');
-require('../_shared/cjs/Curve-d038052b.js');
 require('../_shared/cjs/Section-59804166.js');
 require('../_shared/cjs/handle-link-click-17a44cf4.js');
+require('../_shared/cjs/ThemeIcon-9534f091.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/SiteFooter/SiteFooter.esm.js

@@ -1,16 +1,15 @@
-import { S as SiteFooter } from '../_shared/esm/SiteFooter-233bb926.js';
-export { S as SiteFooter } from '../_shared/esm/SiteFooter-233bb926.js';
+import { S as SiteFooter } from '../_shared/esm/SiteFooter-d21da7ab.js';
+export { S as SiteFooter } from '../_shared/esm/SiteFooter-d21da7ab.js';
 import { d as __awaiter, e as __generator, a as __assign } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import React__default from 'react';
 import '../_shared/esm/index.es-00cb3bcb.js';
-import '../_shared/esm/BtIconChevronDown2Px.esm-217276c2.js';
 import '../_shared/esm/BrandLogo-1af78f76.js';
 import '../_shared/esm/index-2e73c2e9.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/Surface-0ca6817d.js';
-import '../_shared/esm/Curve-d8679dde.js';
 import '../_shared/esm/Section-73781b56.js';
 import '../_shared/esm/handle-link-click-f64f55a2.js';
+import '../_shared/esm/ThemeIcon-eab5a4d0.js';
 
 var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return __awaiter(void 0, void 0, void 0, function () {
     var children, titleElement, title, props;