@arc-ui/components 11.4.2 → 11.6.0

package/dist/ScrollToTop/ScrollToTop.cjs.js

@@ -0,0 +1,68 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+var index = require('../_shared/cjs/index-45bfb67b.js');
+var React$1 = require('react');
+var debounce = require('../_shared/cjs/debounce-506538c5.js');
+var Icon = require('../_shared/cjs/Icon-9ae8dbe1.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/Surface-6da0a78e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+
+const React = React__default["default"];
+const BtIconArrowAltUp = props =>
+  /*#__PURE__*/ React.createElement(
+    "svg",
+    Object.assign(
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 32 32"
+      },
+      props
+    ),
+    /*#__PURE__*/ React.createElement("defs", null),
+    /*#__PURE__*/ React.createElement("path", {
+      d:
+        "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"
+    })
+  );
+var BtIconArrowAltUp_2 = BtIconArrowAltUp;
+
+/**
+ * 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$1.useState(false), hasScrolled = _f[0], setHasScrolled = _f[1];
+    React$1.useEffect(function () {
+        var handleScroll = debounce.debounce_1(function () {
+            setHasScrolled(window.scrollY > 0);
+        }, 100);
+        window.addEventListener("scroll", handleScroll);
+        return function () { return window.removeEventListener("scroll", handleScroll); };
+    });
+    var onClick = function () {
+        window.scrollTo({
+            top: 0,
+            behavior: "smooth"
+        });
+    };
+    return (React__default["default"].createElement("button", filterDataAttrs.__assign({ onClick: onClick, style: {
+            zIndex: zIndex
+        }, className: index.classNames("arc-ScrollToTop", "arc-ScrollToTop--".concat(fill), {
+            "arc-ScrollToTop--fixed": isFixed,
+            "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_2, size: 44 }))));
+};
+
+exports.ScrollToTop = ScrollToTop;

package/dist/ScrollToTop/ScrollToTop.esm.d.ts

@@ -0,0 +1,25 @@
+import { FC } from "react";
+/**
+ * Use `ScrollToTop` to allow the user to scroll to the top of the page by clicking a button.
+ */
+declare const ScrollToTop: FC<ScrollToTopProps>;
+interface ScrollToTopProps {
+    /**
+     * If true, the button will stick to the bottom right corner of the screen.
+     */
+    isFixed?: boolean;
+    /**
+     * Sets when the scroll button should appear. `always` will show the button all the time.
+     * `afterScroll` will show the button when the user has stopped scrolling and have passed the fold.
+     */
+    appear?: "always" | "afterScroll";
+    /**
+     * Z-index for the button. Used to fine tune the overlapping of other page elements.
+     */
+    zIndex?: number;
+    /**
+     * Button fill.
+     */
+    fill?: "solid" | "outlined";
+}
+export { ScrollToTop };

package/dist/ScrollToTop/ScrollToTop.esm.js

@@ -0,0 +1,60 @@
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
+import React__default, { useState, useEffect } from 'react';
+import { d as debounce_1 } from '../_shared/esm/debounce-e228705f.js';
+import { I as Icon } from '../_shared/esm/Icon-fd247973.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/Surface-bb100ef8.js';
+
+const React = React__default;
+const BtIconArrowAltUp = props =>
+  /*#__PURE__*/ React.createElement(
+    "svg",
+    Object.assign(
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 32 32"
+      },
+      props
+    ),
+    /*#__PURE__*/ React.createElement("defs", null),
+    /*#__PURE__*/ React.createElement("path", {
+      d:
+        "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"
+    })
+  );
+var BtIconArrowAltUp_2 = BtIconArrowAltUp;
+
+/**
+ * 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 = __rest(_a, ["appear", "isFixed", "fill", "zIndex"]);
+    var _f = useState(false), hasScrolled = _f[0], setHasScrolled = _f[1];
+    useEffect(function () {
+        var handleScroll = debounce_1(function () {
+            setHasScrolled(window.scrollY > 0);
+        }, 100);
+        window.addEventListener("scroll", handleScroll);
+        return function () { return window.removeEventListener("scroll", handleScroll); };
+    });
+    var onClick = function () {
+        window.scrollTo({
+            top: 0,
+            behavior: "smooth"
+        });
+    };
+    return (React__default.createElement("button", __assign({ onClick: onClick, style: {
+            zIndex: zIndex
+        }, className: classNames("arc-ScrollToTop", "arc-ScrollToTop--".concat(fill), {
+            "arc-ScrollToTop--fixed": isFixed,
+            "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_2, size: 44 }))));
+};
+
+export { ScrollToTop };

package/dist/ScrollToTop/package.json

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

package/dist/Section/Section.cjs.d.ts

@@ -1 +1 @@
-export { Section } from "../_shared/cjs/Section-780f2377";
+export { Section } from "../_shared/cjs/Section-48aca5f5";

package/dist/Section/Section.cjs.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Section = require('../_shared/cjs/Section-780f2377.js');
-require('../_shared/cjs/index-78b35bc1.js');
+var Section = require('../_shared/cjs/Section-48aca5f5.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 require('../_shared/cjs/index-45bfb67b.js');
 require('react');
 

package/dist/Section/Section.esm.d.ts

@@ -1 +1 @@
-export { Section } from "../_shared/esm/Section-7bc71e26";
+export { Section } from "../_shared/esm/Section-b8038d66";

package/dist/Section/Section.esm.js

@@ -1,4 +1,4 @@
-export { S as Section } from '../_shared/esm/Section-7bc71e26.js';
-import '../_shared/esm/index-229fc864.js';
+export { S as Section } from '../_shared/esm/Section-b8038d66.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
 import '../_shared/esm/index-2ae58626.js';
 import 'react';

package/dist/Select/Select.cjs.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
 import React from "react";
 import { FocusEvent } from "react";
-import { FormControlProps } from "../_shared/cjs/FormControl-d4d9c665";
+import { FormControlProps } from "../_shared/cjs/FormControl-9aaddd54";
 /** Use `Select` to choose from a dropdown list of options. */
 declare const Select: React.FC<SelectProps>;
-interface SelectProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "id" | "helperUnderLabel"> {
+interface SelectProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "id" | "helperUnderLabel" | "supplementaryInfo"> {
     name: string;
     label: string;
     placeholder: string;

package/dist/Select/Select.cjs.js

@@ -8,14 +8,15 @@ var index_module = require('../_shared/cjs/index.module-af7c85f2.js');
 var $7SXl2$reactdom = require('react-dom');
 var BtIconChevronDown2Px = require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
 var BtIconTickAlt2Px = require('../_shared/cjs/BtIconTickAlt2Px-bdf06f8c.js');
-var Icon = require('../_shared/cjs/Icon-719d13d4.js');
-var FormControl = require('../_shared/cjs/FormControl-d4d9c665.js');
-var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
-var Base = require('../_shared/cjs/Base-e2b846fe.js');
-require('../_shared/cjs/index-78b35bc1.js');
-require('../_shared/cjs/suffix-modifier-edf7851e.js');
-require('../_shared/cjs/Text-1d3844be.js');
-require('../_shared/cjs/BtIconChevronRightMid-5a38d855.js');
+var Icon = require('../_shared/cjs/Icon-9ae8dbe1.js');
+var FormControl = require('../_shared/cjs/FormControl-9aaddd54.js');
+var Surface = require('../_shared/cjs/Surface-6da0a78e.js');
+var Base = require('../_shared/cjs/Base-569e4334.js');
+require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/BtIconAlert-637db790.js');
+require('../_shared/cjs/DisclosureMini-067e0319.js');
+require('../_shared/cjs/Text-6f2827e6.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/Select/Select.esm.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
 import React from "react";
 import { FocusEvent } from "react";
-import { FormControlProps } from "../_shared/esm/FormControl-2cb96de7";
+import { FormControlProps } from "../_shared/esm/FormControl-5e3fdca3";
 /** Use `Select` to choose from a dropdown list of options. */
 declare const Select: React.FC<SelectProps>;
-interface SelectProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "id" | "helperUnderLabel"> {
+interface SelectProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "id" | "helperUnderLabel" | "supplementaryInfo"> {
     name: string;
     label: string;
     placeholder: string;

package/dist/Select/Select.esm.js

@@ -5,14 +5,15 @@ import { $ as $c512c27ab02ef895$export$50c7b4e9d9f19c1, a as $6ed0406888f73fc4$e
 import $7SXl2$reactdom, { createPortal } from 'react-dom';
 import { B as BtIconChevronDown2Px_2 } from '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
 import { B as BtIconTickAlt2Px_2 } from '../_shared/esm/BtIconTickAlt2Px-da97e9ae.js';
-import { I as Icon } from '../_shared/esm/Icon-61f7237a.js';
-import { F as FormControl } from '../_shared/esm/FormControl-2cb96de7.js';
-import { C as Context } from '../_shared/esm/Surface-bf201530.js';
-import { A as ArcRootElementContext } from '../_shared/esm/Base-c235dc45.js';
-import '../_shared/esm/index-229fc864.js';
-import '../_shared/esm/suffix-modifier-f5e28822.js';
-import '../_shared/esm/Text-6b958ad8.js';
-import '../_shared/esm/BtIconChevronRightMid-d9b11761.js';
+import { I as Icon } from '../_shared/esm/Icon-fd247973.js';
+import { F as FormControl } from '../_shared/esm/FormControl-5e3fdca3.js';
+import { C as Context } from '../_shared/esm/Surface-bb100ef8.js';
+import { A as ArcRootElementContext } from '../_shared/esm/Base-6c01e0ec.js';
+import '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/BtIconAlert-55a6ed5c.js';
+import '../_shared/esm/DisclosureMini-022beae3.js';
+import '../_shared/esm/Text-00e9743b.js';
 
 function $ae6933e535247d3d$export$7d15b64cf5a3a4c4(value, [min, max]) {
     return Math.min(max, Math.max(min, value));

package/dist/SiteFooter/SiteFooter.cjs.d.ts

@@ -1,64 +1,4 @@
 /// <reference types="react" />
-import { FC, ReactNode } from "react";
-/**
- * Use `SiteFooter` to display information at the bottom of a page.
- */
-declare const SiteFooter: FC<SiteFooterProps> & {
-    Item: typeof SiteFooterItem;
-    ItemGroup: typeof SiteFooterItemGroup;
-};
-declare const SiteFooterItemGroup: FC<SiteFooterItemGroupProps>;
-declare const SiteFooterItem: FC<SiteFooterItemProps>;
-interface SiteFooterItemGroupProps {
-    /**
-     * Contents of the SiteFooterItemGroup. Must be SiteFooter.Item components.
-     */
-    children: ReactNode;
-    /**
-     * Title text for the SiteFooterItemGroup.
-     */
-    title: string;
-}
-interface SiteFooterItemProps {
-    /**
-     * Contents of the SiteFooterItem.
-     */
-    children: ReactNode;
-    /**
-     * A URL to link to when the Item is clicked or touched.
-     */
-    href: string;
-    /**
-     * On click handler.
-     */
-    onClick?: () => void;
-}
-interface SiteFooterProps {
-    /**
-     * Secondary content of the SiteFooter. Must be SiteFooter.Item components.
-     */
-    children?: ReactNode;
-    /**
-     * Copyright year.
-     */
-    currentYear?: string;
-    /**
-     * Should the SiteFooter include a Curve?
-     */
-    curve?: boolean;
-    /**
-     * Accessible text for the SiteFooter logo.
-     */
-    logoLabel?: string;
-    /**
-     * Main content of the SiteFooter. Must be SiteFooter.ItemGroup components.
-     */
-    main?: ReactNode;
-    /**
-     * Text that appears at the top of the footer. Can be the name of the site, a
-     * brand strapline, or similar.
-     */
-    siteName?: string;
-}
 declare const _default: (el: HTMLDivElement, rehydrateChildren: any) => Promise<JSX.Element>;
-export { SiteFooter, _default as SiteFooterRehydrator };
+export { SiteFooter } from "../_shared/cjs/SiteFooter-c540b5f1";
+export { _default as SiteFooterRehydrator };

package/dist/SiteFooter/SiteFooter.cjs.js

@@ -2,81 +2,26 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('../_shared/cjs/index-78b35bc1.js');
-var index_es = require('../_shared/cjs/index.es-77def0c9.js');
-var BtIconChevronDown2Px = require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
+var SiteFooter = require('../_shared/cjs/SiteFooter-c540b5f1.js');
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-a30dcf5f.js');
 var React = require('react');
-var BrandLogo = require('../_shared/cjs/BrandLogo-3c6102ef.js');
-var Curve = require('../_shared/cjs/Curve-e72ce25b.js');
-var Section = require('../_shared/cjs/Section-780f2377.js');
-var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
-var handleLinkClick = require('../_shared/cjs/handle-link-click-17a44cf4.js');
+require('../_shared/cjs/index.es-77def0c9.js');
+require('../_shared/cjs/BtIconChevronDown2Px-8fb4e2eb.js');
+require('../_shared/cjs/BrandLogo-8008f0c4.js');
 require('../_shared/cjs/index-45bfb67b.js');
-require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/suffix-modifier-1ee2da04.js');
+require('../_shared/cjs/Surface-6da0a78e.js');
+require('../_shared/cjs/Curve-b05589d8.js');
+require('../_shared/cjs/Section-48aca5f5.js');
+require('../_shared/cjs/handle-link-click-17a44cf4.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-/**
- * Use `SiteFooter` to display information at the bottom of a page.
- */
-var SiteFooter = function (_a) {
-    var children = _a.children, currentYear = _a.currentYear, _b = _a.curve, curve = _b === void 0 ? true : _b, logoLabel = _a.logoLabel, main = _a.main, siteName = _a.siteName, props = index.__rest(_a, ["children", "currentYear", "curve", "logoLabel", "main", "siteName"]);
-    React.useEffect(function () {
-        React__default["default"].Children.map(children, function (item) {
-            if (item && item.type !== SiteFooterItem) {
-                throw new Error("Illegal child passed to <SiteFooter />. Ensure to only use <SiteFooter.Item />.");
-            }
-        });
-    }, [children]);
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        curve ? (React__default["default"].createElement(Curve.Curve, { bottomColor: "brand-flat", from: "topLeft", size: "s" })) : null,
-        React__default["default"].createElement("footer", index.__assign({ className: "arc-SiteFooter" }, index.filterDataAttrs(props)),
-            React__default["default"].createElement(Surface.Surface, { background: "brand-flat", paddingVertical: "24" },
-                (siteName || main) && (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement(Section.Section, null,
-                        siteName && (React__default["default"].createElement("div", { className: "arc-SiteFooter-name" }, siteName)),
-                        main && React__default["default"].createElement("div", { className: "arc-SiteFooter-main" }, main)),
-                    React__default["default"].createElement("hr", { className: "arc-SiteFooter-rule" }))),
-                React__default["default"].createElement(Section.Section, null,
-                    React__default["default"].createElement("div", { className: "arc-SiteFooter-secondary" },
-                        children && (React__default["default"].createElement("ul", { className: "arc-SiteFooter-secondaryItems" }, children)),
-                        React__default["default"].createElement("div", { className: "arc-SiteFooter-brand" },
-                            React__default["default"].createElement("div", { className: "arc-SiteFooter-copyright" },
-                                React__default["default"].createElement("span", { className: "arc-SiteFooter-copyrightSymbol" }, "\u00A9"), " ".concat(currentYear || new Date().getFullYear())),
-                            React__default["default"].createElement(BrandLogo.BrandLogo, { label: logoLabel }))))))));
-};
-var SiteFooterItemGroup = function (_a) {
-    var children = _a.children, title = _a.title;
-    var isMinWidthArcBreakpointM = index_es.useMediaQuery("(min-width: ".concat(index_es.ArcBreakpointM, "px)"));
-    React.useEffect(function () {
-        React__default["default"].Children.map(children, function (item) {
-            if (item && item.type !== SiteFooterItem && item.type !== React.Fragment) {
-                throw new Error("Illegal child passed to <SiteFooterItemGroup />. Ensure to only use <SiteFooter.Item />.");
-            }
-        });
-    }, [children]);
-    return (React__default["default"].createElement("details", { className: "arc-SiteFooter-disclosure", open: isMinWidthArcBreakpointM },
-        React__default["default"].createElement("summary", { className: "arc-SiteFooter-summary", tabIndex: isMinWidthArcBreakpointM ? -1 : 0 },
-            React__default["default"].createElement("span", { className: "arc-SiteFooter-icon" },
-                React__default["default"].createElement(BtIconChevronDown2Px.BtIconChevronDown2Px_2, null)),
-            React__default["default"].createElement("h2", { className: "arc-SiteFooter-title" }, title)),
-        React__default["default"].createElement("ul", { className: "arc-SiteFooter-mainItems" }, children)));
-};
-var SiteFooterItem = function (_a) {
-    var children = _a.children, href = _a.href, onClick = _a.onClick, props = index.__rest(_a, ["children", "href", "onClick"]);
-    return (React__default["default"].createElement("li", index.__assign({ className: "arc-SiteFooter-item" }, index.filterDataAttrs(props)),
-        React__default["default"].createElement("a", { onClick: handleLinkClick.handleLinkClick({ handler: onClick }), className: "arc-SiteFooter-link", href: href }, children)));
-};
-SiteFooterItem.displayName = "SiteFooter.Item";
-SiteFooter.Item = SiteFooterItem;
-SiteFooterItemGroup.displayName = "SiteFooter.ItemGroup";
-SiteFooter.ItemGroup = SiteFooterItemGroup;
-
-var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return index.__awaiter(void 0, void 0, void 0, function () {
+var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return filterDataAttrs.__awaiter(void 0, void 0, void 0, function () {
     var children, titleElement, title, props;
-    return index.__generator(this, function (_a) {
+    return filterDataAttrs.__generator(this, function (_a) {
         switch (_a.label) {
             case 0: return [4 /*yield*/, rehydrateChildren(el.querySelector(".arc-SiteFooter-mainItems"))];
             case 1:
@@ -90,10 +35,10 @@ var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return index.__a
                     children: children,
                     title: title
                 };
-                return [2 /*return*/, React__default["default"].createElement(SiteFooter.ItemGroup, index.__assign({}, props), children)];
+                return [2 /*return*/, React__default["default"].createElement(SiteFooter.SiteFooter.ItemGroup, filterDataAttrs.__assign({}, props), children)];
         }
     });
 }); });
 
-exports.SiteFooter = SiteFooter;
+exports.SiteFooter = SiteFooter.SiteFooter;
 exports.SiteFooterRehydrator = SiteFooter_rehydrator;

package/dist/SiteFooter/SiteFooter.esm.d.ts

@@ -1,64 +1,4 @@
 /// <reference types="react" />
-import { FC, ReactNode } from "react";
-/**
- * Use `SiteFooter` to display information at the bottom of a page.
- */
-declare const SiteFooter: FC<SiteFooterProps> & {
-    Item: typeof SiteFooterItem;
-    ItemGroup: typeof SiteFooterItemGroup;
-};
-declare const SiteFooterItemGroup: FC<SiteFooterItemGroupProps>;
-declare const SiteFooterItem: FC<SiteFooterItemProps>;
-interface SiteFooterItemGroupProps {
-    /**
-     * Contents of the SiteFooterItemGroup. Must be SiteFooter.Item components.
-     */
-    children: ReactNode;
-    /**
-     * Title text for the SiteFooterItemGroup.
-     */
-    title: string;
-}
-interface SiteFooterItemProps {
-    /**
-     * Contents of the SiteFooterItem.
-     */
-    children: ReactNode;
-    /**
-     * A URL to link to when the Item is clicked or touched.
-     */
-    href: string;
-    /**
-     * On click handler.
-     */
-    onClick?: () => void;
-}
-interface SiteFooterProps {
-    /**
-     * Secondary content of the SiteFooter. Must be SiteFooter.Item components.
-     */
-    children?: ReactNode;
-    /**
-     * Copyright year.
-     */
-    currentYear?: string;
-    /**
-     * Should the SiteFooter include a Curve?
-     */
-    curve?: boolean;
-    /**
-     * Accessible text for the SiteFooter logo.
-     */
-    logoLabel?: string;
-    /**
-     * Main content of the SiteFooter. Must be SiteFooter.ItemGroup components.
-     */
-    main?: ReactNode;
-    /**
-     * Text that appears at the top of the footer. Can be the name of the site, a
-     * brand strapline, or similar.
-     */
-    siteName?: string;
-}
 declare const _default: (el: HTMLDivElement, rehydrateChildren: any) => Promise<JSX.Element>;
-export { SiteFooter, _default as SiteFooterRehydrator };
+export { SiteFooter } from "../_shared/esm/SiteFooter-8075a9bd";
+export { _default as SiteFooterRehydrator };

package/dist/SiteFooter/SiteFooter.esm.js

@@ -1,70 +1,16 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs, d as __awaiter, e as __generator } from '../_shared/esm/index-229fc864.js';
-import { u as useMediaQuery, A as ArcBreakpointM } from '../_shared/esm/index.es-00cb3bcb.js';
-import { B as BtIconChevronDown2Px_2 } from '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
-import React__default, { useEffect, Fragment } from 'react';
-import { B as BrandLogo } from '../_shared/esm/BrandLogo-4f13fe85.js';
-import { C as Curve } from '../_shared/esm/Curve-50697f7e.js';
-import { S as Section } from '../_shared/esm/Section-7bc71e26.js';
-import { S as Surface } from '../_shared/esm/Surface-bf201530.js';
-import { h as handleLinkClick } from '../_shared/esm/handle-link-click-f64f55a2.js';
+import { S as SiteFooter } from '../_shared/esm/SiteFooter-8075a9bd.js';
+export { S as SiteFooter } from '../_shared/esm/SiteFooter-8075a9bd.js';
+import { d as __awaiter, e as __generator, a as __assign } from '../_shared/esm/filter-data-attrs-afdb7d32.js';
+import React__default from 'react';
+import '../_shared/esm/index.es-00cb3bcb.js';
+import '../_shared/esm/BtIconChevronDown2Px-782876e2.js';
+import '../_shared/esm/BrandLogo-56699561.js';
 import '../_shared/esm/index-2ae58626.js';
-import '../_shared/esm/suffix-modifier-f5e28822.js';
-
-/**
- * Use `SiteFooter` to display information at the bottom of a page.
- */
-var SiteFooter = function (_a) {
-    var children = _a.children, currentYear = _a.currentYear, _b = _a.curve, curve = _b === void 0 ? true : _b, logoLabel = _a.logoLabel, main = _a.main, siteName = _a.siteName, props = __rest(_a, ["children", "currentYear", "curve", "logoLabel", "main", "siteName"]);
-    useEffect(function () {
-        React__default.Children.map(children, function (item) {
-            if (item && item.type !== SiteFooterItem) {
-                throw new Error("Illegal child passed to <SiteFooter />. Ensure to only use <SiteFooter.Item />.");
-            }
-        });
-    }, [children]);
-    return (React__default.createElement(React__default.Fragment, null,
-        curve ? (React__default.createElement(Curve, { bottomColor: "brand-flat", from: "topLeft", size: "s" })) : null,
-        React__default.createElement("footer", __assign({ className: "arc-SiteFooter" }, filterDataAttrs(props)),
-            React__default.createElement(Surface, { background: "brand-flat", paddingVertical: "24" },
-                (siteName || main) && (React__default.createElement(React__default.Fragment, null,
-                    React__default.createElement(Section, null,
-                        siteName && (React__default.createElement("div", { className: "arc-SiteFooter-name" }, siteName)),
-                        main && React__default.createElement("div", { className: "arc-SiteFooter-main" }, main)),
-                    React__default.createElement("hr", { className: "arc-SiteFooter-rule" }))),
-                React__default.createElement(Section, null,
-                    React__default.createElement("div", { className: "arc-SiteFooter-secondary" },
-                        children && (React__default.createElement("ul", { className: "arc-SiteFooter-secondaryItems" }, children)),
-                        React__default.createElement("div", { className: "arc-SiteFooter-brand" },
-                            React__default.createElement("div", { className: "arc-SiteFooter-copyright" },
-                                React__default.createElement("span", { className: "arc-SiteFooter-copyrightSymbol" }, "\u00A9"), " ".concat(currentYear || new Date().getFullYear())),
-                            React__default.createElement(BrandLogo, { label: logoLabel }))))))));
-};
-var SiteFooterItemGroup = function (_a) {
-    var children = _a.children, title = _a.title;
-    var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcBreakpointM, "px)"));
-    useEffect(function () {
-        React__default.Children.map(children, function (item) {
-            if (item && item.type !== SiteFooterItem && item.type !== Fragment) {
-                throw new Error("Illegal child passed to <SiteFooterItemGroup />. Ensure to only use <SiteFooter.Item />.");
-            }
-        });
-    }, [children]);
-    return (React__default.createElement("details", { className: "arc-SiteFooter-disclosure", open: isMinWidthArcBreakpointM },
-        React__default.createElement("summary", { className: "arc-SiteFooter-summary", tabIndex: isMinWidthArcBreakpointM ? -1 : 0 },
-            React__default.createElement("span", { className: "arc-SiteFooter-icon" },
-                React__default.createElement(BtIconChevronDown2Px_2, null)),
-            React__default.createElement("h2", { className: "arc-SiteFooter-title" }, title)),
-        React__default.createElement("ul", { className: "arc-SiteFooter-mainItems" }, children)));
-};
-var SiteFooterItem = function (_a) {
-    var children = _a.children, href = _a.href, onClick = _a.onClick, props = __rest(_a, ["children", "href", "onClick"]);
-    return (React__default.createElement("li", __assign({ className: "arc-SiteFooter-item" }, filterDataAttrs(props)),
-        React__default.createElement("a", { onClick: handleLinkClick({ handler: onClick }), className: "arc-SiteFooter-link", href: href }, children)));
-};
-SiteFooterItem.displayName = "SiteFooter.Item";
-SiteFooter.Item = SiteFooterItem;
-SiteFooterItemGroup.displayName = "SiteFooter.ItemGroup";
-SiteFooter.ItemGroup = SiteFooterItemGroup;
+import '../_shared/esm/suffix-modifier-7e640670.js';
+import '../_shared/esm/Surface-bb100ef8.js';
+import '../_shared/esm/Curve-3e87b1bc.js';
+import '../_shared/esm/Section-b8038d66.js';
+import '../_shared/esm/handle-link-click-f64f55a2.js';
 
 var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return __awaiter(void 0, void 0, void 0, function () {
     var children, titleElement, title, props;
@@ -87,4 +33,4 @@ var SiteFooter_rehydrator = (function (el, rehydrateChildren) { return __awaiter
     });
 }); });
 
-export { SiteFooter, SiteFooter_rehydrator as SiteFooterRehydrator };
+export { SiteFooter_rehydrator as SiteFooterRehydrator };