@arc-ui/components 7.0.0 → 8.0.1

package/dist/index.es.js

@@ -1331,7 +1331,7 @@ var Section = function (_a) {
  * Use `SiteFooter` to display information at the bottom of a page.
  */
 var SiteFooter = function (_a) {
-    var children = _a.children, currentYear = _a.currentYear, logoLabel = _a.logoLabel, main = _a.main, siteName = _a.siteName, props = __rest(_a, ["children", "currentYear", "logoLabel", "main", "siteName"]);
+    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.Children.map(children, function (item) {
             if (item && item.type !== SiteFooterItem) {
@@ -1340,7 +1340,7 @@ var SiteFooter = function (_a) {
         });
     }, [children]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(Curve, { bottomColor: "brand-flat", from: "topLeft", size: "s" }),
+        curve ? (React.createElement(Curve, { bottomColor: "brand-flat", from: "topLeft", size: "s" })) : null,
         React.createElement("footer", __assign({ className: "arc-SiteFooter" }, filterDataAttrs(props)),
             React.createElement(Surface, { background: "brand-flat", paddingVertical: "24" },
                 (siteName || main) && (React.createElement(React.Fragment, null,
@@ -1897,9 +1897,9 @@ var Provider = Context.Provider;
  */
 var SiteHeader = function (_a) {
     var _b;
-    var children = _a.children, _c = _a.basketHref, basketHref = _c === void 0 ? "/basket" : _c, _d = _a.hasBasket, hasBasket = _d === void 0 ? false : _d, _e = _a.hasLogin, hasLogin = _e === void 0 ? true : _e, _f = _a.isTransparent, isTransparent = _f === void 0 ? false : _f, _g = _a.loginHref, loginHref = _g === void 0 ? "/login" : _g, _h = _a.loginTitle, loginTitle = _h === void 0 ? "Login / Register" : _h, _j = _a.logoHref, logoHref = _j === void 0 ? "/" : _j, _k = _a.logoLabel, logoLabel = _k === void 0 ? "Home" : _k, search = _a.search, subBrand = _a.subBrand, props = __rest(_a, ["children", "basketHref", "hasBasket", "hasLogin", "isTransparent", "loginHref", "loginTitle", "logoHref", "logoLabel", "search", "subBrand"]);
-    var _l = useState(false), hasClientSideJavaScript = _l[0], setHasClientSideJavaScript = _l[1];
-    var _m = useState(false), menuOpen = _m[0], setMenuOpen = _m[1];
+    var children = _a.children, basket = _a.basket, _c = _a.hasLogin, hasLogin = _c === void 0 ? true : _c, _d = _a.isTransparent, isTransparent = _d === void 0 ? false : _d, _e = _a.loginHref, loginHref = _e === void 0 ? "/login" : _e, _f = _a.loginTitle, loginTitle = _f === void 0 ? "Login / Register" : _f, _g = _a.logoHref, logoHref = _g === void 0 ? "/" : _g, _h = _a.logoLabel, logoLabel = _h === void 0 ? "Home" : _h, search = _a.search, subBrand = _a.subBrand, props = __rest(_a, ["children", "basket", "hasLogin", "isTransparent", "loginHref", "loginTitle", "logoHref", "logoLabel", "search", "subBrand"]);
+    var _j = useState(false), hasClientSideJavaScript = _j[0], setHasClientSideJavaScript = _j[1];
+    var _k = useState(false), menuOpen = _k[0], setMenuOpen = _k[1];
     var isMinWidthArcBreakpointL = useMediaQuery("(min-width: ".concat(ArcBreakpointL, "px)"));
     useEffect(function () {
         React.Children.map(children, function (item) {
@@ -1956,10 +1956,9 @@ var SiteHeader = function (_a) {
                             React.createElement("ul", { className: "arc-SiteHeader-navItems" }, children),
                             hasLogin && (React.createElement("div", { className: "arc-SiteHeader-loginButton" },
                                 React.createElement(Button, { href: loginHref, isFullWidth: true, label: loginTitle })))))),
-                    (hasBasket || hasLogin || search) && (React.createElement("div", { className: "arc-SiteHeader-secondary" },
+                    (basket || hasLogin || search) && (React.createElement("div", { className: "arc-SiteHeader-secondary" },
                         search ? (React.createElement("div", { className: "arc-SiteHeader-search" }, search)) : null,
-                        hasBasket ? (React.createElement("a", { className: "arc-SiteHeader-basket", href: basketHref },
-                            React.createElement(Icon, { icon: "btBasket", label: "Basket", size: 24 }))) : null,
+                        basket ? (React.createElement("div", { className: "arc-SiteHeader-basket" }, basket)) : null,
                         hasLogin && (React.createElement("a", { className: "arc-SiteHeader-loginLink", href: loginHref }, loginTitle)))))))));
 };
 Column.displayName = "SiteHeader.Column";
@@ -1976,11 +1975,12 @@ SiteHeader.NavItemWithSubNav = NavItemWithSubNav;
 SiteHeader.SubNavItem = SubNavItem;
 
 var SiteHeaderRehydrator = function (el, hydrate) { return __awaiter(void 0, void 0, void 0, function () {
-    var children, search, basket, brand, login, logoHref, logoLabel, props;
+    var children, basket, search, brand, login, logoHref, logoLabel, props;
     return __generator(this, function (_a) {
         switch (_a.label) {
             case 0:
                 children = el.querySelector(".arc-SiteHeader-navItems");
+                basket = el.querySelector(".arc-SiteHeader-basket");
                 search = el.querySelector(".arc-SiteHeader-search");
                 if (!children) return [3 /*break*/, 2];
                 return [4 /*yield*/, hydrate(children)];
@@ -1988,13 +1988,18 @@ var SiteHeaderRehydrator = function (el, hydrate) { return __awaiter(void 0, voi
                 children = _a.sent();
                 _a.label = 2;
             case 2:
-                if (!search) return [3 /*break*/, 4];
-                return [4 /*yield*/, hydrate(search)];
+                if (!basket) return [3 /*break*/, 4];
+                return [4 /*yield*/, hydrate(basket)];
             case 3:
-                search = _a.sent();
+                basket = _a.sent();
                 _a.label = 4;
             case 4:
-                basket = el.querySelector(".arc-SiteHeader-basket");
+                if (!search) return [3 /*break*/, 6];
+                return [4 /*yield*/, hydrate(search)];
+            case 5:
+                search = _a.sent();
+                _a.label = 6;
+            case 6:
                 brand = el.querySelector(".arc-SiteHeader-brand");
                 login = el.querySelector(".arc-SiteHeader-loginLink");
                 logoHref = "";
@@ -2004,8 +2009,7 @@ var SiteHeaderRehydrator = function (el, hydrate) { return __awaiter(void 0, voi
                     logoLabel = brand.textContent || /* istanbul ignore next */ "";
                 }
                 props = {
-                    basketHref: (basket === null || basket === void 0 ? void 0 : basket.getAttribute("href")) || undefined,
-                    hasBasket: Boolean(basket),
+                    basket: basket,
                     hasLogin: Boolean(login),
                     isTransparent: Boolean(el.dataset.transparent),
                     loginHref: (login === null || login === void 0 ? void 0 : login.getAttribute("href")) || undefined,