@telia/teddy 0.1.23 → 0.1.24
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.
- package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.cjs +0 -2
- package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.js +0 -2
- package/dist/components/navigation-menu/global-navigation/global-navigation-root.d.ts +3 -2
- package/dist/components/radio-card-group/radio-card-group-item-title.cjs +82 -101
- package/dist/components/radio-card-group/radio-card-group-item-title.js +82 -101
- package/dist/style.css +116 -111
- package/package.json +1 -1
|
@@ -7,8 +7,6 @@ require("./utils.cjs");
|
|
|
7
7
|
require("../../box/box.cjs");
|
|
8
8
|
require("../../../utils/useSize.cjs");
|
|
9
9
|
require("../../../utils/generate-styling/index.cjs");
|
|
10
|
-
require("../../../utils/useCallbackRef.cjs");
|
|
11
|
-
require("../../../tokens/motion/variables.cjs");
|
|
12
10
|
require("../../../assets/sprite.269ba410-teddy.svg");
|
|
13
11
|
require("../../icon/icon.cjs");
|
|
14
12
|
require("../../flex/flex.cjs");
|
|
@@ -5,8 +5,6 @@ import "./utils.js";
|
|
|
5
5
|
import "../../box/box.js";
|
|
6
6
|
import "../../../utils/useSize.js";
|
|
7
7
|
import "../../../utils/generate-styling/index.js";
|
|
8
|
-
import "../../../utils/useCallbackRef.js";
|
|
9
|
-
import "../../../tokens/motion/variables.js";
|
|
10
8
|
import "../../../assets/sprite.269ba410-teddy.svg";
|
|
11
9
|
import "../../icon/icon.js";
|
|
12
10
|
import "../../flex/flex.js";
|
|
@@ -13,6 +13,7 @@ export type RootProps = React.ComponentPropsWithoutRef<'div'> & {
|
|
|
13
13
|
shoppingCart?: React.ReactNode;
|
|
14
14
|
shoppingCartNumberOfItems?: number;
|
|
15
15
|
onSearchSubmit?: (e: React.FormEvent<HTMLFormElement>, value?: string) => void;
|
|
16
|
+
additionalSearchContent?: React.ReactNode;
|
|
16
17
|
isCartOpen?: boolean;
|
|
17
18
|
onCartOpenChange?: (open: boolean) => void;
|
|
18
19
|
drawerSize: 'md' | 'lg';
|
|
@@ -29,9 +30,9 @@ type RootContext = {
|
|
|
29
30
|
specifiedLink?: string;
|
|
30
31
|
setSpecifiedLink: (v: string) => void;
|
|
31
32
|
hideMenu?: boolean | null;
|
|
32
|
-
} & Pick<RootProps, 'onSearchSubmit' | 'shoppingCart' | 'shoppingCartNumberOfItems' | 'loggedInUser' | 'appKey' | 'onLogoutClick' | 'linkComponent' | 'isCartOpen' | 'onCartOpenChange' | 'drawerSize'>;
|
|
33
|
+
} & Pick<RootProps, 'onSearchSubmit' | 'additionalSearchContent' | 'shoppingCart' | 'shoppingCartNumberOfItems' | 'loggedInUser' | 'appKey' | 'onLogoutClick' | 'linkComponent' | 'isCartOpen' | 'onCartOpenChange' | 'drawerSize'>;
|
|
33
34
|
export declare const RootContext: React.Context<RootContext | null>;
|
|
34
|
-
export declare function Root({ className, appKey, loggedInUser, linkComponent, onLogoutClick, shoppingCart, shoppingCartNumberOfItems, onSearchSubmit, isCartOpen, onCartOpenChange, drawerSize, isSimplified, currentPath, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
|
|
35
|
+
export declare function Root({ className, appKey, loggedInUser, linkComponent, onLogoutClick, shoppingCart, shoppingCartNumberOfItems, onSearchSubmit, additionalSearchContent, isCartOpen, onCartOpenChange, drawerSize, isSimplified, currentPath, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
|
|
35
36
|
export declare namespace Root {
|
|
36
37
|
var displayName: string;
|
|
37
38
|
}
|
|
@@ -65,7 +65,6 @@ const components_radioCardGroup_radioCardGroupIndicator = require("./radio-card-
|
|
|
65
65
|
const components_radioCardGroup_radioCardGroupItemBody = require("./radio-card-group-item-body.cjs");
|
|
66
66
|
const RadioGroupPrimitive = require("@radix-ui/react-radio-group");
|
|
67
67
|
const utils_useSize = require("../../utils/useSize.cjs");
|
|
68
|
-
const utils_useCallbackRef = require("../../utils/useCallbackRef.cjs");
|
|
69
68
|
function _interopNamespaceDefault(e) {
|
|
70
69
|
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
71
70
|
if (e) {
|
|
@@ -282,28 +281,28 @@ const Close = React.forwardRef(
|
|
|
282
281
|
);
|
|
283
282
|
Close.displayName = "Dialog.Close";
|
|
284
283
|
const Modal = Object.assign(Root$2, { Trigger: Trigger$1, Content: Content$1, Title, Overlay, Description, Close, Image, Group });
|
|
285
|
-
const scaleIn = "
|
|
286
|
-
const scaleOut = "
|
|
287
|
-
const enterFromRight = "
|
|
288
|
-
const enterFromLeft = "
|
|
289
|
-
const exitToRight = "
|
|
290
|
-
const exitToLeft = "
|
|
284
|
+
const scaleIn = "_scaleIn_19565_1";
|
|
285
|
+
const scaleOut = "_scaleOut_19565_1";
|
|
286
|
+
const enterFromRight = "_enterFromRight_19565_1";
|
|
287
|
+
const enterFromLeft = "_enterFromLeft_19565_1";
|
|
288
|
+
const exitToRight = "_exitToRight_19565_1";
|
|
289
|
+
const exitToLeft = "_exitToLeft_19565_1";
|
|
291
290
|
const styles$1 = {
|
|
292
|
-
"teddy-navigation-menu": "_teddy-navigation-
|
|
293
|
-
"teddy-navigation-menu__viewport": "_teddy-navigation-
|
|
294
|
-
"teddy-navigation-menu__separator": "_teddy-navigation-
|
|
295
|
-
"teddy-navigation-menu__list": "_teddy-navigation-
|
|
296
|
-
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-
|
|
297
|
-
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-
|
|
298
|
-
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--
|
|
299
|
-
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--
|
|
300
|
-
"teddy-navigation-menu__content": "_teddy-navigation-
|
|
301
|
-
"teddy-navigation-menu__trigger": "_teddy-navigation-
|
|
302
|
-
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--
|
|
303
|
-
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--
|
|
304
|
-
"teddy-navigation-menu__link": "_teddy-navigation-
|
|
305
|
-
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--
|
|
306
|
-
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--
|
|
291
|
+
"teddy-navigation-menu": "_teddy-navigation-menu_19565_1",
|
|
292
|
+
"teddy-navigation-menu__viewport": "_teddy-navigation-menu__viewport_19565_34",
|
|
293
|
+
"teddy-navigation-menu__separator": "_teddy-navigation-menu__separator_19565_37",
|
|
294
|
+
"teddy-navigation-menu__list": "_teddy-navigation-menu__list_19565_40",
|
|
295
|
+
"teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-list_19565_66",
|
|
296
|
+
"teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-trigger_19565_87",
|
|
297
|
+
"teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--small_19565_106",
|
|
298
|
+
"teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--button_19565_112",
|
|
299
|
+
"teddy-navigation-menu__content": "_teddy-navigation-menu__content_19565_187",
|
|
300
|
+
"teddy-navigation-menu__trigger": "_teddy-navigation-menu__trigger_19565_228",
|
|
301
|
+
"teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--small_19565_248",
|
|
302
|
+
"teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--button_19565_254",
|
|
303
|
+
"teddy-navigation-menu__link": "_teddy-navigation-menu__link_19565_322",
|
|
304
|
+
"teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--small_19565_342",
|
|
305
|
+
"teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--button_19565_348",
|
|
307
306
|
scaleIn,
|
|
308
307
|
scaleOut,
|
|
309
308
|
enterFromRight,
|
|
@@ -699,27 +698,27 @@ const NavigationMenu = Object.assign(Root$1, {
|
|
|
699
698
|
TopMenuTrigger
|
|
700
699
|
});
|
|
701
700
|
const styles = {
|
|
702
|
-
"teddy-global-navigation": "_teddy-global-
|
|
703
|
-
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-
|
|
704
|
-
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-
|
|
705
|
-
"teddy-global-navigation__mobile": "_teddy-global-
|
|
706
|
-
"teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-
|
|
707
|
-
"teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-
|
|
708
|
-
"teddy-global-navigation__link": "_teddy-global-
|
|
709
|
-
"teddy-global-navigation__header": "_teddy-global-
|
|
710
|
-
"teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-
|
|
711
|
-
"teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--
|
|
712
|
-
"teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--
|
|
713
|
-
"teddy-global-navigation__list": "_teddy-global-
|
|
714
|
-
"teddy-global-navigation__viewport": "_teddy-global-
|
|
715
|
-
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-
|
|
716
|
-
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-
|
|
717
|
-
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-
|
|
718
|
-
"close-viewport": "_close-
|
|
719
|
-
"teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-
|
|
720
|
-
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-
|
|
721
|
-
"teddy-global-navigation__accordion-look": "_teddy-global-navigation__accordion-
|
|
722
|
-
"teddy-global-navigation__mobile-link--accordion-look": "_teddy-global-navigation__mobile-link--accordion-
|
|
701
|
+
"teddy-global-navigation": "_teddy-global-navigation_1kpy3_1",
|
|
702
|
+
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-trigger_1kpy3_6",
|
|
703
|
+
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-header_1kpy3_9",
|
|
704
|
+
"teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1kpy3_6",
|
|
705
|
+
"teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1kpy3_32",
|
|
706
|
+
"teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1kpy3_37",
|
|
707
|
+
"teddy-global-navigation__link": "_teddy-global-navigation__link_1kpy3_41",
|
|
708
|
+
"teddy-global-navigation__header": "_teddy-global-navigation__header_1kpy3_51",
|
|
709
|
+
"teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1kpy3_54",
|
|
710
|
+
"teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1kpy3_57",
|
|
711
|
+
"teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1kpy3_61",
|
|
712
|
+
"teddy-global-navigation__list": "_teddy-global-navigation__list_1kpy3_67",
|
|
713
|
+
"teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1kpy3_72",
|
|
714
|
+
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1kpy3_75",
|
|
715
|
+
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1kpy3_79",
|
|
716
|
+
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1kpy3_86",
|
|
717
|
+
"close-viewport": "_close-viewport_1kpy3_1",
|
|
718
|
+
"teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1kpy3_102",
|
|
719
|
+
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1kpy3_105",
|
|
720
|
+
"teddy-global-navigation__accordion-look": "_teddy-global-navigation__accordion-look_1kpy3_122",
|
|
721
|
+
"teddy-global-navigation__mobile-link--accordion-look": "_teddy-global-navigation__mobile-link--accordion-look_1kpy3_138"
|
|
723
722
|
};
|
|
724
723
|
function MyPages(props) {
|
|
725
724
|
var _a, _b;
|
|
@@ -821,6 +820,7 @@ const SearchField = React.forwardRef(
|
|
|
821
820
|
SearchField.displayName = "SearchField";
|
|
822
821
|
function Search(props) {
|
|
823
822
|
const rootContext = React.useContext(RootContext);
|
|
823
|
+
const additionalSearchContent = rootContext == null ? void 0 : rootContext.additionalSearchContent;
|
|
824
824
|
const searchFieldRef = React.useRef(null);
|
|
825
825
|
return /* @__PURE__ */ jsxRuntime.jsxs(components_drawer_index.Drawer, { ...props, children: [
|
|
826
826
|
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsxRuntime.jsx(components_drawer_index.Drawer.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsxs("button", { children: [
|
|
@@ -840,6 +840,7 @@ function Search(props) {
|
|
|
840
840
|
/* @__PURE__ */ jsxRuntime.jsx(components_drawer_index.Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
|
|
841
841
|
/* @__PURE__ */ jsxRuntime.jsx(components_drawer_index.Drawer.Title, { children: "Hva leter du etter?" }),
|
|
842
842
|
/* @__PURE__ */ jsxRuntime.jsx(SearchField, { ref: searchFieldRef }),
|
|
843
|
+
additionalSearchContent ? additionalSearchContent : null,
|
|
843
844
|
/* @__PURE__ */ jsxRuntime.jsx(components_drawer_index.Drawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(components_drawer_index.Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { variant: "secondary", children: "Lukk" }) }) })
|
|
844
845
|
]
|
|
845
846
|
}
|
|
@@ -885,38 +886,13 @@ const Desktop = React.forwardRef(() => {
|
|
|
885
886
|
(link) => {
|
|
886
887
|
const highlightedLinkSelected = [...link.highlightedLinks].some((highlightedLink) => highlightedLink.link === (rootContext == null ? void 0 : rootContext.pathname));
|
|
887
888
|
const linkSelected = [...link.links].some((subLink) => subLink.link === (rootContext == null ? void 0 : rootContext.pathname));
|
|
888
|
-
|
|
889
|
+
const sameParent = link.link.split("/")[1] === (rootContext == null ? void 0 : rootContext.pathname.split("/")[1]) || !link.link && (rootContext == null ? void 0 : rootContext.pathname) === "/";
|
|
890
|
+
return linkSelected || highlightedLinkSelected || link.links.length && link.name === (rootContext == null ? void 0 : rootContext.specifiedLink) && sameParent;
|
|
889
891
|
}
|
|
890
892
|
);
|
|
891
893
|
const topMenuSize = utils_useSize.useSize(topMenuRef.current);
|
|
892
894
|
const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
|
|
893
895
|
const viewPortHeight = shouldShowViewport ? "288px" : void 0;
|
|
894
|
-
const [allowAnimationOfHeight, setAllowAnimationOfHeight] = React.useState(false);
|
|
895
|
-
const timerRef = React.useRef(void 0);
|
|
896
|
-
React.useEffect(() => {
|
|
897
|
-
timerRef.current = setTimeout(() => {
|
|
898
|
-
setAllowAnimationOfHeight(true);
|
|
899
|
-
}, 500);
|
|
900
|
-
return () => {
|
|
901
|
-
timerRef.current && clearTimeout(timerRef.current);
|
|
902
|
-
};
|
|
903
|
-
}, []);
|
|
904
|
-
const handleScroll = () => {
|
|
905
|
-
const scrollY = window.scrollY;
|
|
906
|
-
const scrollDirection = scrollY > lastScrollPos.current ? "down" : "up";
|
|
907
|
-
if (scrollDirection !== lastScrollDirection.current) {
|
|
908
|
-
scrollStartPos.current = scrollY;
|
|
909
|
-
}
|
|
910
|
-
lastScrollDirection.current = scrollDirection;
|
|
911
|
-
lastScrollPos.current = scrollY;
|
|
912
|
-
};
|
|
913
|
-
const throttledScrollHandler = useDebounceCallback(handleScroll, 5);
|
|
914
|
-
React.useEffect(() => {
|
|
915
|
-
window.addEventListener("scroll", throttledScrollHandler);
|
|
916
|
-
return () => {
|
|
917
|
-
window.removeEventListener("scroll", throttledScrollHandler);
|
|
918
|
-
};
|
|
919
|
-
}, [throttledScrollHandler]);
|
|
920
896
|
if (!rootContext)
|
|
921
897
|
return null;
|
|
922
898
|
function resetAndShowMenu() {
|
|
@@ -931,8 +907,7 @@ const Desktop = React.forwardRef(() => {
|
|
|
931
907
|
"div",
|
|
932
908
|
{
|
|
933
909
|
style: utils_generateStyling_index.mergeStyles(
|
|
934
|
-
{ ["--teddy-top-menu-height"]: topMenuHeight }
|
|
935
|
-
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: tokens_motion_variables.teddyMotionDuration300 } : {}
|
|
910
|
+
{ ["--teddy-top-menu-height"]: topMenuHeight }
|
|
936
911
|
),
|
|
937
912
|
className: styles[`${rootClassName}__top-menu-wrapper`],
|
|
938
913
|
children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuList, { onFocus: resetAndShowMenu, ref: topMenuRef, children: components_navigationMenu_globalNavigation_utils.LINKS.map((link) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -956,17 +931,10 @@ const Desktop = React.forwardRef(() => {
|
|
|
956
931
|
(subLink) => {
|
|
957
932
|
var _a2, _b, _c;
|
|
958
933
|
return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu.Item, { value: subLink.name, children: [
|
|
959
|
-
subLink.name === "Logo" ? /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { href: subLink.link,
|
|
934
|
+
subLink.name === "Logo" ? /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { href: subLink.link, onMouseEnter: () => {
|
|
960
935
|
setSelectedMenuItem("", true);
|
|
961
936
|
setSpecifiedLink("");
|
|
962
|
-
},
|
|
963
|
-
"img",
|
|
964
|
-
{
|
|
965
|
-
src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
|
|
966
|
-
draggable: "false",
|
|
967
|
-
alt: "Telia logo"
|
|
968
|
-
}
|
|
969
|
-
) }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href: subLink.link, onClick: () => {
|
|
937
|
+
}, onClick: () => {
|
|
970
938
|
setSelectedMenuItem("", true);
|
|
971
939
|
setSpecifiedLink("");
|
|
972
940
|
}, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -976,32 +944,54 @@ const Desktop = React.forwardRef(() => {
|
|
|
976
944
|
draggable: "false",
|
|
977
945
|
alt: "Telia logo"
|
|
978
946
|
}
|
|
979
|
-
) })
|
|
947
|
+
) }) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
948
|
+
"a",
|
|
949
|
+
{
|
|
950
|
+
href: subLink.link,
|
|
951
|
+
onMouseEnter: () => {
|
|
952
|
+
setSelectedMenuItem("", true);
|
|
953
|
+
setSpecifiedLink("");
|
|
954
|
+
},
|
|
955
|
+
onClick: () => {
|
|
956
|
+
setSelectedMenuItem("", true);
|
|
957
|
+
setSpecifiedLink("");
|
|
958
|
+
},
|
|
959
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
960
|
+
"img",
|
|
961
|
+
{
|
|
962
|
+
src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
|
|
963
|
+
draggable: "false",
|
|
964
|
+
alt: "Telia logo"
|
|
965
|
+
}
|
|
966
|
+
)
|
|
967
|
+
}
|
|
968
|
+
) }) : ((_a2 = subLink.links) == null ? void 0 : _a2.length) ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
980
969
|
NavigationMenu.Trigger,
|
|
981
970
|
{
|
|
982
971
|
asChild: true,
|
|
983
972
|
active: currentLocation === subLink.link,
|
|
984
|
-
|
|
973
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { onMouseEnter: () => {
|
|
985
974
|
setSpecifiedLink(subLink.name);
|
|
986
975
|
setSelectedMenuItem(subLink.name, true);
|
|
987
|
-
},
|
|
988
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { children: subLink.name })
|
|
976
|
+
}, children: subLink.name })
|
|
989
977
|
}
|
|
990
978
|
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
991
979
|
NavigationMenu.Link,
|
|
992
980
|
{
|
|
993
981
|
asChild: true,
|
|
994
982
|
active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
|
|
995
|
-
|
|
983
|
+
children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { onMouseEnter: () => {
|
|
996
984
|
setSpecifiedLink(subLink.name);
|
|
997
985
|
setSelectedMenuItem(subLink.name, true);
|
|
998
|
-
},
|
|
999
|
-
|
|
986
|
+
}, href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsxRuntime.jsx("a", { onMouseEnter: () => {
|
|
987
|
+
setSpecifiedLink(subLink.name);
|
|
988
|
+
setSelectedMenuItem(subLink.name, true);
|
|
989
|
+
}, href: subLink.link, children: subLink.name })
|
|
1000
990
|
}
|
|
1001
991
|
),
|
|
1002
992
|
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1003
993
|
((_b = subLink.links) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "150", children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: subLink.name, links: subLink.links }) }),
|
|
1004
|
-
((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "
|
|
994
|
+
((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "250", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", links: subLink.highlightedLinks }) })
|
|
1005
995
|
] }) })
|
|
1006
996
|
] }, subLink.name);
|
|
1007
997
|
}
|
|
@@ -1012,13 +1002,11 @@ const Desktop = React.forwardRef(() => {
|
|
|
1012
1002
|
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(MyPages, {}) })
|
|
1013
1003
|
] }, link.name);
|
|
1014
1004
|
}),
|
|
1015
|
-
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Separator, {}),
|
|
1016
1005
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1017
1006
|
"div",
|
|
1018
1007
|
{
|
|
1019
1008
|
style: utils_generateStyling_index.mergeStyles(
|
|
1020
|
-
{ ["--teddy-viewport-wrapper-height"]: viewPortHeight }
|
|
1021
|
-
allowAnimationOfHeight ? { ["--teddy-motion-duration-controlled"]: tokens_motion_variables.teddyMotionDuration300 } : {}
|
|
1009
|
+
{ ["--teddy-viewport-wrapper-height"]: viewPortHeight }
|
|
1022
1010
|
),
|
|
1023
1011
|
className: styles[`${rootClassName}__viewport-wrapper`],
|
|
1024
1012
|
"data-state": hideMenu === null ? "" : hideMenu ? "closed" : "open",
|
|
@@ -1035,15 +1023,6 @@ const Desktop = React.forwardRef(() => {
|
|
|
1035
1023
|
] });
|
|
1036
1024
|
});
|
|
1037
1025
|
Desktop.displayName = "Desktop";
|
|
1038
|
-
function useDebounceCallback(callback, delay) {
|
|
1039
|
-
const handleCallback = utils_useCallbackRef.useCallbackRef(callback);
|
|
1040
|
-
const debounceTimerRef = React.useRef(0);
|
|
1041
|
-
React.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
|
|
1042
|
-
return React.useCallback(() => {
|
|
1043
|
-
window.clearTimeout(debounceTimerRef.current);
|
|
1044
|
-
debounceTimerRef.current = window.setTimeout(handleCallback, delay);
|
|
1045
|
-
}, [handleCallback, delay]);
|
|
1046
|
-
}
|
|
1047
1026
|
const HightlightedLinksDesktop = ({ links, listName }) => {
|
|
1048
1027
|
const rootContext = React.useContext(RootContext);
|
|
1049
1028
|
if (!rootContext)
|
|
@@ -1245,6 +1224,7 @@ function Root({
|
|
|
1245
1224
|
shoppingCart,
|
|
1246
1225
|
shoppingCartNumberOfItems,
|
|
1247
1226
|
onSearchSubmit,
|
|
1227
|
+
additionalSearchContent,
|
|
1248
1228
|
isCartOpen,
|
|
1249
1229
|
onCartOpenChange,
|
|
1250
1230
|
drawerSize = "md",
|
|
@@ -1290,6 +1270,7 @@ function Root({
|
|
|
1290
1270
|
shoppingCart,
|
|
1291
1271
|
shoppingCartNumberOfItems,
|
|
1292
1272
|
onSearchSubmit,
|
|
1273
|
+
additionalSearchContent,
|
|
1293
1274
|
isCartOpen,
|
|
1294
1275
|
onCartOpenChange,
|
|
1295
1276
|
drawerSize,
|