@sonic-equipment/ui 260.1.0 → 260.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -10,7 +10,10 @@ function useCookie(name, options = defaultCookieOptions) {
|
|
|
10
10
|
const Cookies = context
|
|
11
11
|
? isCookieGetterSetter(context)
|
|
12
12
|
? context
|
|
13
|
-
:
|
|
13
|
+
: {
|
|
14
|
+
get: createReadonlyCookieReader(context).get,
|
|
15
|
+
set: clientCookieContextValue.set,
|
|
16
|
+
}
|
|
14
17
|
: clientCookieContextValue;
|
|
15
18
|
const cookieValue = Cookies.get()?.[name];
|
|
16
19
|
const [stateValue, setStateValue] = useState(cookieValue);
|
package/dist/header/header.js
CHANGED
|
@@ -5,7 +5,7 @@ import clsx from 'clsx';
|
|
|
5
5
|
import { useDrawer } from '../drawer/use-drawer.js';
|
|
6
6
|
import { useGlobalSearchDisclosure } from '../global-search/global-search-provider/use-search-disclosure.js';
|
|
7
7
|
import { useFormattedMessage } from '../intl/use-formatted-message.js';
|
|
8
|
-
import {
|
|
8
|
+
import { isNavigationSection, isNavigationLinkItem } from '../shared/api/bff/model/bff.model.js';
|
|
9
9
|
import { useIsBreakpoint } from '../shared/hooks/use-is-breakpoint.js';
|
|
10
10
|
import { useResizeObserver } from '../shared/hooks/use-resize-observer.js';
|
|
11
11
|
import { useOnNavigate } from '../shared/routing/use-on-navigate.js';
|
|
@@ -67,13 +67,10 @@ function Header({ className, headerNavigationSection, sticky, }) {
|
|
|
67
67
|
if (activeLinkGroup)
|
|
68
68
|
setDesktopNavigationOpen(true);
|
|
69
69
|
}, [activeLinkGroup, setDesktopNavigationOpen]);
|
|
70
|
-
const homeLink = headerNavigationSection?.items
|
|
71
|
-
.filter(isNavigationLink)
|
|
72
|
-
.find(item => item.key === 'home');
|
|
73
70
|
const mainNavigationSection = headerNavigationSection?.items
|
|
74
71
|
.filter(isNavigationSection)
|
|
75
72
|
.find(item => item.key === 'main-navigation');
|
|
76
|
-
return (jsxs(Fragment, { children: [jsx("header", { ref: headerRef, className: clsx(styles['header'], sticky && styles['sticky'], className), "data-test-selector": "pageHeader", children: jsx(HeaderLayout, { hamburgerButton: jsx(HamburgerButton, { "aria-controls": "mobile-navigation", "data-test-selector": "pageHeaderHamburgerButton", isActive: mobileNavigationOpen, onActiveChange: toggleMobileNavigation }), hasDrawersOpen: hasDrawersOpen, logo: jsx(SonicLogo, { "data-test-selector": "pageHeaderLogo", href:
|
|
73
|
+
return (jsxs(Fragment, { children: [jsx("header", { ref: headerRef, className: clsx(styles['header'], sticky && styles['sticky'], className), "data-test-selector": "pageHeader", children: jsx(HeaderLayout, { hamburgerButton: jsx(HamburgerButton, { "aria-controls": "mobile-navigation", "data-test-selector": "pageHeaderHamburgerButton", isActive: mobileNavigationOpen, onActiveChange: toggleMobileNavigation }), hasDrawersOpen: hasDrawersOpen, logo: jsx(SonicLogo, { "data-test-selector": "pageHeaderLogo", href: "/", title: t('Home') }), mainNavigation: jsx(NavigationLinkList, { activeLink: activeLinkGroup, "data-test-selector": "pageHeaderMainNavigation", navigationSection: mainNavigationSection, onSubmenuToggle: toggleActiveSubmenu }), navigationActions: jsxs(Fragment, { children: [jsx(ConnectedAccountButton, { "data-test-selector": "pageHeaderAccountButton" }), jsx(ConnectedFavoritesButton, { "data-test-selector": "pageHeaderFavoritesButton", href: "abc" }), jsx(ConnectedCartButton, { "data-test-selector": "pageHeaderCartButton", href: paths.CART })] }), search: jsx(SearchButton, { "aria-controls": "global-search", "data-test-selector": "pageHeaderSearchButton", isActive: searchOpen, onActiveChange: toggleSearch }) }) }), jsx(SearchDrawer, { groupId: searchGroupId, instanceId: searchInstanceId }), !isXl && (jsx(MobileNavigationDrawer, { groupId: mobileNavigationDrawer.groupId, instanceId: mobileNavigationDrawer.instanceId, linkItems: mainNavigationSection?.items.filter(isNavigationLinkItem) })), isXl && (jsx(DesktopNavigationDrawer, { groupId: desktopNavigationDrawer.groupId, instanceId: desktopNavigationDrawer.instanceId, linkGroup: activeLinkGroup, onClosed: () => setActiveLinkGroup(undefined) }))] }));
|
|
77
74
|
}
|
|
78
75
|
|
|
79
76
|
export { Header };
|
|
@@ -11,7 +11,7 @@ import styles from './menu-list.module.css.js';
|
|
|
11
11
|
function MenuListItem({ 'aria-controls': ariaControls, badge, children, className, 'data-test-selector': dataTestSelector, hasChildren, href, image, isSelected, onClick, openInNewTab, ...rest }) {
|
|
12
12
|
const t = useFormattedMessage();
|
|
13
13
|
useMenuListItem({ canCollapse: Boolean(badge) });
|
|
14
|
-
return (jsxs("li", { "aria-owns": ariaControls, className: clsx(styles['menu-list-item'], isSelected && styles['selected'], hasChildren && styles['has-children'], className), "data-test-selector": dataTestSelector, ...rest, children: [image && (jsx("span", { className: styles['image'], role: "presentation", children: jsx(Image, { fit: "contain", image: image, title: "" }) })), badge && jsx("span", { className: styles['badge'], children: badge }), jsx(Link, {
|
|
14
|
+
return (jsxs("li", { "aria-owns": ariaControls, className: clsx(styles['menu-list-item'], isSelected && styles['selected'], hasChildren && styles['has-children'], className), "data-test-selector": dataTestSelector, ...rest, children: [image && (jsx("span", { className: styles['image'], role: "presentation", children: jsx(Image, { fit: "contain", image: image, title: "" }) })), badge && jsx("span", { className: styles['badge'], children: badge }), jsx(Link, { "aria-controls": ariaControls, "aria-expanded": ariaControls && isSelected, "aria-haspopup": hasChildren ? 'true' : undefined, className: styles['label'], href: href || undefined, onClick: onClick, role: hasChildren ? 'menuitem' : undefined, target: openInNewTab ? '_blank' : undefined, children: jsx("span", { children: children }) }), hasChildren && (jsx(Icon, { className: styles['icon'], label: t('Submenu'), name: "ArrowRight", size: "xxs" }))] }));
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
export { MenuListItem };
|
|
@@ -8,9 +8,11 @@ export interface PageModel {
|
|
|
8
8
|
canonicalPath: string;
|
|
9
9
|
metaDescription: string;
|
|
10
10
|
metaKeywords: string;
|
|
11
|
+
needRedirect: boolean;
|
|
11
12
|
openGraphImage: string;
|
|
12
13
|
openGraphTitle: string;
|
|
13
14
|
openGraphUrl: string;
|
|
15
|
+
redirectUrl: string;
|
|
14
16
|
title: string;
|
|
15
17
|
}
|
|
16
18
|
interface Category {
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
+
const malformedLinkRegex = /\b[a-z]{2}-[a-z]{2}\/[a-z]{2}(?=[#/?]|$)/i;
|
|
1
2
|
function buildHref({ basePathname, href, ignoreLocalePrefix, }) {
|
|
2
3
|
if (!href.startsWith('http') &&
|
|
3
4
|
basePathname &&
|
|
4
5
|
basePathname !== '/' &&
|
|
5
6
|
!ignoreLocalePrefix &&
|
|
6
7
|
!href.startsWith(`/${basePathname}`)) {
|
|
7
|
-
|
|
8
|
+
const urlWithbasePath = `/${basePathname.replace(/^\//, '')}/${href.replace(/^\//, '')}`;
|
|
9
|
+
const isMalformed = new RegExp(malformedLinkRegex).test(urlWithbasePath);
|
|
10
|
+
return isMalformed
|
|
11
|
+
? urlWithbasePath.replace(/([a-z]{2}-[a-z]{2})\/[a-z]{2}(?=[#/?]|$)/i, '$1')
|
|
12
|
+
: urlWithbasePath;
|
|
8
13
|
}
|
|
9
14
|
return href;
|
|
10
15
|
}
|