@telia/teddy 0.1.19 → 0.1.20
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 +1 -0
- package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.js +1 -0
- package/dist/components/navigation-menu/global-navigation/global-navigation-root.d.ts +2 -0
- package/dist/components/navigation-menu/global-navigation/utils.cjs +5 -5
- package/dist/components/navigation-menu/global-navigation/utils.d.ts +10 -10
- package/dist/components/navigation-menu/global-navigation/utils.js +5 -5
- package/dist/components/radio-card-group/radio-card-group-item-title.cjs +30 -27
- package/dist/components/radio-card-group/radio-card-group-item-title.js +31 -28
- package/dist/style.css +39 -33
- package/package.json +1 -1
|
@@ -26,6 +26,8 @@ type RootContext = {
|
|
|
26
26
|
setSelectedDomainItem: (v: string, onlyStateChange?: boolean) => void;
|
|
27
27
|
pathname: string;
|
|
28
28
|
setPathname: (v: string) => void;
|
|
29
|
+
specifiedLink: string;
|
|
30
|
+
setSpecifiedLink: (v: string) => void;
|
|
29
31
|
} & Pick<RootProps, 'onSearchSubmit' | 'shoppingCart' | 'shoppingCartNumberOfItems' | 'loggedInUser' | 'appKey' | 'onLogoutClick' | 'linkComponent' | 'isCartOpen' | 'onCartOpenChange' | 'drawerSize'>;
|
|
30
32
|
export declare const RootContext: React.Context<RootContext | null>;
|
|
31
33
|
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;
|
|
@@ -113,7 +113,7 @@ const PRIVATE_LINKS = {
|
|
|
113
113
|
},
|
|
114
114
|
{
|
|
115
115
|
name: "Mobil",
|
|
116
|
-
link: "
|
|
116
|
+
link: "",
|
|
117
117
|
appKey: APP_KEYS["open-pages"],
|
|
118
118
|
highlightedLinks: [
|
|
119
119
|
{
|
|
@@ -207,7 +207,7 @@ const PRIVATE_LINKS = {
|
|
|
207
207
|
},
|
|
208
208
|
{
|
|
209
209
|
name: "TV",
|
|
210
|
-
link: "
|
|
210
|
+
link: "",
|
|
211
211
|
appKey: APP_KEYS["open-pages"],
|
|
212
212
|
highlightedLinks: [
|
|
213
213
|
{
|
|
@@ -297,7 +297,7 @@ const PRIVATE_LINKS = {
|
|
|
297
297
|
},
|
|
298
298
|
{
|
|
299
299
|
name: "Internett",
|
|
300
|
-
link: "
|
|
300
|
+
link: "",
|
|
301
301
|
appKey: APP_KEYS["open-pages"],
|
|
302
302
|
highlightedLinks: [
|
|
303
303
|
{
|
|
@@ -376,7 +376,7 @@ const PRIVATE_LINKS = {
|
|
|
376
376
|
},
|
|
377
377
|
{
|
|
378
378
|
name: "Trygghet",
|
|
379
|
-
link: "
|
|
379
|
+
link: "",
|
|
380
380
|
appKey: APP_KEYS["open-pages"],
|
|
381
381
|
highlightedLinks: [
|
|
382
382
|
{
|
|
@@ -460,7 +460,7 @@ const PRIVATE_LINKS = {
|
|
|
460
460
|
},
|
|
461
461
|
{
|
|
462
462
|
name: "Hjelp",
|
|
463
|
-
link: "
|
|
463
|
+
link: "",
|
|
464
464
|
appKey: APP_KEYS["open-pages"],
|
|
465
465
|
highlightedLinks: [
|
|
466
466
|
{
|
|
@@ -165,7 +165,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
165
165
|
readonly highlightedLinks: [];
|
|
166
166
|
}, {
|
|
167
167
|
readonly name: "Mobil";
|
|
168
|
-
readonly link: "
|
|
168
|
+
readonly link: "";
|
|
169
169
|
readonly appKey: "open-pages";
|
|
170
170
|
readonly highlightedLinks: [{
|
|
171
171
|
readonly name: "Telia X";
|
|
@@ -235,7 +235,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
235
235
|
}];
|
|
236
236
|
}, {
|
|
237
237
|
readonly name: "TV";
|
|
238
|
-
readonly link: "
|
|
238
|
+
readonly link: "";
|
|
239
239
|
readonly appKey: "open-pages";
|
|
240
240
|
readonly highlightedLinks: [{
|
|
241
241
|
readonly name: "Valgmenyen i Telia Play";
|
|
@@ -297,7 +297,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
297
297
|
}];
|
|
298
298
|
}, {
|
|
299
299
|
readonly name: "Internett";
|
|
300
|
-
readonly link: "
|
|
300
|
+
readonly link: "";
|
|
301
301
|
readonly appKey: "open-pages";
|
|
302
302
|
readonly highlightedLinks: [{
|
|
303
303
|
readonly name: "Søk på adresse";
|
|
@@ -359,7 +359,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
359
359
|
}];
|
|
360
360
|
}, {
|
|
361
361
|
readonly name: "Trygghet";
|
|
362
|
-
readonly link: "
|
|
362
|
+
readonly link: "";
|
|
363
363
|
readonly appKey: "open-pages";
|
|
364
364
|
readonly highlightedLinks: [{
|
|
365
365
|
readonly name: "Telia Trygg";
|
|
@@ -425,7 +425,7 @@ export declare const PRIVATE_LINKS: {
|
|
|
425
425
|
}];
|
|
426
426
|
}, {
|
|
427
427
|
readonly name: "Hjelp";
|
|
428
|
-
readonly link: "
|
|
428
|
+
readonly link: "";
|
|
429
429
|
readonly appKey: "open-pages";
|
|
430
430
|
readonly highlightedLinks: [{
|
|
431
431
|
readonly name: "SIM, PIN og PUK";
|
|
@@ -610,7 +610,7 @@ export declare const LINKS: [{
|
|
|
610
610
|
readonly highlightedLinks: [];
|
|
611
611
|
}, {
|
|
612
612
|
readonly name: "Mobil";
|
|
613
|
-
readonly link: "
|
|
613
|
+
readonly link: "";
|
|
614
614
|
readonly appKey: "open-pages";
|
|
615
615
|
readonly highlightedLinks: [{
|
|
616
616
|
readonly name: "Telia X";
|
|
@@ -680,7 +680,7 @@ export declare const LINKS: [{
|
|
|
680
680
|
}];
|
|
681
681
|
}, {
|
|
682
682
|
readonly name: "TV";
|
|
683
|
-
readonly link: "
|
|
683
|
+
readonly link: "";
|
|
684
684
|
readonly appKey: "open-pages";
|
|
685
685
|
readonly highlightedLinks: [{
|
|
686
686
|
readonly name: "Valgmenyen i Telia Play";
|
|
@@ -742,7 +742,7 @@ export declare const LINKS: [{
|
|
|
742
742
|
}];
|
|
743
743
|
}, {
|
|
744
744
|
readonly name: "Internett";
|
|
745
|
-
readonly link: "
|
|
745
|
+
readonly link: "";
|
|
746
746
|
readonly appKey: "open-pages";
|
|
747
747
|
readonly highlightedLinks: [{
|
|
748
748
|
readonly name: "Søk på adresse";
|
|
@@ -804,7 +804,7 @@ export declare const LINKS: [{
|
|
|
804
804
|
}];
|
|
805
805
|
}, {
|
|
806
806
|
readonly name: "Trygghet";
|
|
807
|
-
readonly link: "
|
|
807
|
+
readonly link: "";
|
|
808
808
|
readonly appKey: "open-pages";
|
|
809
809
|
readonly highlightedLinks: [{
|
|
810
810
|
readonly name: "Telia Trygg";
|
|
@@ -870,7 +870,7 @@ export declare const LINKS: [{
|
|
|
870
870
|
}];
|
|
871
871
|
}, {
|
|
872
872
|
readonly name: "Hjelp";
|
|
873
|
-
readonly link: "
|
|
873
|
+
readonly link: "";
|
|
874
874
|
readonly appKey: "open-pages";
|
|
875
875
|
readonly highlightedLinks: [{
|
|
876
876
|
readonly name: "SIM, PIN og PUK";
|
|
@@ -111,7 +111,7 @@ const PRIVATE_LINKS = {
|
|
|
111
111
|
},
|
|
112
112
|
{
|
|
113
113
|
name: "Mobil",
|
|
114
|
-
link: "
|
|
114
|
+
link: "",
|
|
115
115
|
appKey: APP_KEYS["open-pages"],
|
|
116
116
|
highlightedLinks: [
|
|
117
117
|
{
|
|
@@ -205,7 +205,7 @@ const PRIVATE_LINKS = {
|
|
|
205
205
|
},
|
|
206
206
|
{
|
|
207
207
|
name: "TV",
|
|
208
|
-
link: "
|
|
208
|
+
link: "",
|
|
209
209
|
appKey: APP_KEYS["open-pages"],
|
|
210
210
|
highlightedLinks: [
|
|
211
211
|
{
|
|
@@ -295,7 +295,7 @@ const PRIVATE_LINKS = {
|
|
|
295
295
|
},
|
|
296
296
|
{
|
|
297
297
|
name: "Internett",
|
|
298
|
-
link: "
|
|
298
|
+
link: "",
|
|
299
299
|
appKey: APP_KEYS["open-pages"],
|
|
300
300
|
highlightedLinks: [
|
|
301
301
|
{
|
|
@@ -374,7 +374,7 @@ const PRIVATE_LINKS = {
|
|
|
374
374
|
},
|
|
375
375
|
{
|
|
376
376
|
name: "Trygghet",
|
|
377
|
-
link: "
|
|
377
|
+
link: "",
|
|
378
378
|
appKey: APP_KEYS["open-pages"],
|
|
379
379
|
highlightedLinks: [
|
|
380
380
|
{
|
|
@@ -458,7 +458,7 @@ const PRIVATE_LINKS = {
|
|
|
458
458
|
},
|
|
459
459
|
{
|
|
460
460
|
name: "Hjelp",
|
|
461
|
-
link: "
|
|
461
|
+
link: "",
|
|
462
462
|
appKey: APP_KEYS["open-pages"],
|
|
463
463
|
highlightedLinks: [
|
|
464
464
|
{
|
|
@@ -699,26 +699,27 @@ const NavigationMenu = Object.assign(Root$1, {
|
|
|
699
699
|
TopMenuTrigger
|
|
700
700
|
});
|
|
701
701
|
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-
|
|
713
|
-
"teddy-global-
|
|
714
|
-
"teddy-global-
|
|
715
|
-
"teddy-global-navigation__item-
|
|
716
|
-
"teddy-global-
|
|
717
|
-
"
|
|
718
|
-
"
|
|
719
|
-
"teddy-global-navigation__top-menu-
|
|
720
|
-
"teddy-global-
|
|
721
|
-
"teddy-global-
|
|
702
|
+
"teddy-global-navigation": "_teddy-global-navigation_1i7an_1",
|
|
703
|
+
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-trigger_1i7an_6",
|
|
704
|
+
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-header_1i7an_9",
|
|
705
|
+
"teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1i7an_6",
|
|
706
|
+
"teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1i7an_32",
|
|
707
|
+
"teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1i7an_37",
|
|
708
|
+
"teddy-global-navigation__link": "_teddy-global-navigation__link_1i7an_41",
|
|
709
|
+
"teddy-global-navigation__header": "_teddy-global-navigation__header_1i7an_51",
|
|
710
|
+
"teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1i7an_54",
|
|
711
|
+
"teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1i7an_57",
|
|
712
|
+
"teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1i7an_61",
|
|
713
|
+
"teddy-global-navigation__list": "_teddy-global-navigation__list_1i7an_67",
|
|
714
|
+
"teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1i7an_72",
|
|
715
|
+
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1i7an_75",
|
|
716
|
+
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1i7an_79",
|
|
717
|
+
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1i7an_86",
|
|
718
|
+
"close-viewport": "_close-viewport_1i7an_1",
|
|
719
|
+
"teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1i7an_97",
|
|
720
|
+
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1i7an_100",
|
|
721
|
+
"teddy-global-navigation__accordion-look": "_teddy-global-navigation__accordion-look_1i7an_117",
|
|
722
|
+
"teddy-global-navigation__mobile-link--accordion-look": "_teddy-global-navigation__mobile-link--accordion-look_1i7an_133"
|
|
722
723
|
};
|
|
723
724
|
function MyPages(props) {
|
|
724
725
|
var _a, _b;
|
|
@@ -879,14 +880,13 @@ const ANIMATION_DURATION = 300;
|
|
|
879
880
|
const Desktop = React.forwardRef(() => {
|
|
880
881
|
const rootContext = React.useContext(RootContext);
|
|
881
882
|
const [hideMenu, setHideMenu] = React.useState(null);
|
|
882
|
-
const [specifiedLink, setSpecifiedLink] = React.useState("");
|
|
883
883
|
const lastScrollDirection = React.useRef();
|
|
884
884
|
const scrollStartPos = React.useRef(0);
|
|
885
885
|
const lastScrollPos = React.useRef(0);
|
|
886
886
|
const topMenuRef = React.useRef(null);
|
|
887
887
|
const viewPortRef = React.useRef(null);
|
|
888
888
|
const shouldShowViewport = [...components_navigationMenu_globalNavigation_utils.PRIVATE_LINKS.links, ...components_navigationMenu_globalNavigation_utils.BUSINESS_LINKS.links, ...components_navigationMenu_globalNavigation_utils.MDU_LINKS.links].some(
|
|
889
|
-
(link) =>
|
|
889
|
+
(link) => link.links.length && link.name === (rootContext == null ? void 0 : rootContext.specifiedLink)
|
|
890
890
|
);
|
|
891
891
|
const viewPortSize = utils_useSize.useSize(viewPortRef.current);
|
|
892
892
|
const topMenuSize = utils_useSize.useSize(topMenuRef.current);
|
|
@@ -947,7 +947,7 @@ const Desktop = React.forwardRef(() => {
|
|
|
947
947
|
lastScrollPos.current = window.scrollY;
|
|
948
948
|
setHideMenu(false);
|
|
949
949
|
}
|
|
950
|
-
const { setSelectedMenuItem, linkComponent: Link2 } = rootContext;
|
|
950
|
+
const { setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
|
|
951
951
|
const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
|
|
952
952
|
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
953
953
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: styles[`${rootClassName}__top-menu-color`], children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1000,7 +1000,7 @@ const Desktop = React.forwardRef(() => {
|
|
|
1000
1000
|
asChild: true,
|
|
1001
1001
|
active: currentLocation === subLink.link,
|
|
1002
1002
|
onClick: () => setSpecifiedLink(subLink.name),
|
|
1003
|
-
children:
|
|
1003
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { children: subLink.name })
|
|
1004
1004
|
}
|
|
1005
1005
|
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1006
1006
|
NavigationMenu.Link,
|
|
@@ -1011,7 +1011,7 @@ const Desktop = React.forwardRef(() => {
|
|
|
1011
1011
|
children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href: subLink.link, children: subLink.name })
|
|
1012
1012
|
}
|
|
1013
1013
|
),
|
|
1014
|
-
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Content, { children: subLink.name === specifiedLink && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1014
|
+
/* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1015
1015
|
((_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, subLink, links: subLink.links }) }),
|
|
1016
1016
|
((_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: "40px", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", subLink, links: subLink.highlightedLinks }) })
|
|
1017
1017
|
] }) })
|
|
@@ -1122,7 +1122,7 @@ function Mobile(props) {
|
|
|
1122
1122
|
return /* @__PURE__ */ jsxRuntime.jsxs(components_tabs_index.Tabs.Content, { value: link.name, children: [
|
|
1123
1123
|
/* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { mt: "400", children: (_a = link.links) == null ? void 0 : _a.filter((l) => l.name !== "Logo").map(
|
|
1124
1124
|
(subLink) => subLink.links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(components_box_box.Box, { onClick: () => setSpecifiedLink(subLink.name), className: linkClasses, children: [
|
|
1125
|
-
/* @__PURE__ */ jsxRuntime.jsx(components_heading_heading.Heading, { asChild: true, variant: "title-300", children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, {
|
|
1125
|
+
/* @__PURE__ */ jsxRuntime.jsx(components_heading_heading.Heading, { asChild: true, variant: "title-300", children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { className: styles[`${rootClassName}__sublink-button--mobile`], children: subLink.name }) }),
|
|
1126
1126
|
/* @__PURE__ */ jsxRuntime.jsx(components_icon_icon.Icon, { name: "chevron-right", size: "md" })
|
|
1127
1127
|
] }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsxs(NavLink, { href: subLink.link, className: linkClasses, children: [
|
|
1128
1128
|
/* @__PURE__ */ jsxRuntime.jsx(components_heading_heading.Heading, { variant: "title-300", as: "h2", className: headerClasses, children: subLink.name }),
|
|
@@ -1265,6 +1265,7 @@ function Root({
|
|
|
1265
1265
|
const [selectedMenuItem, setSelectedMenuItem] = React.useState(getInitialMenuItem(currentPath));
|
|
1266
1266
|
const [selectedDomainItem, setSelectedDomainItem] = React.useState(getInitialDomain(currentPath));
|
|
1267
1267
|
const [pathname, setPathname] = React.useState(currentPath || "");
|
|
1268
|
+
const [specifiedLink, setSpecifiedLink] = React.useState("");
|
|
1268
1269
|
const classes = clsx([styles[`${rootClassName}`]], className);
|
|
1269
1270
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1270
1271
|
RootContext.Provider,
|
|
@@ -1297,7 +1298,9 @@ function Root({
|
|
|
1297
1298
|
onSearchSubmit,
|
|
1298
1299
|
isCartOpen,
|
|
1299
1300
|
onCartOpenChange,
|
|
1300
|
-
drawerSize
|
|
1301
|
+
drawerSize,
|
|
1302
|
+
specifiedLink,
|
|
1303
|
+
setSpecifiedLink
|
|
1301
1304
|
},
|
|
1302
1305
|
children: /* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { ...props, className: classes, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1303
1306
|
NavigationMenu,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
2
2
|
import React__default, { useEffect } from "react";
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
-
import { MY_PAGE_LINKS, LOGGED_IN_LINKS_BUSINESS, PRIVATE_LINKS, BUSINESS_LINKS, MDU_LINKS,
|
|
4
|
+
import { MY_PAGE_LINKS, LOGGED_IN_LINKS_BUSINESS, PRIVATE_LINKS, BUSINESS_LINKS, MDU_LINKS, LINKS, getActiveSubLink } from "../navigation-menu/global-navigation/utils.js";
|
|
5
5
|
import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
|
|
6
6
|
import { useComposedRefs, composeRefs } from "../../utils/composeRefs.js";
|
|
7
7
|
import { VisuallyHidden } from "../visually-hidden/visually-hidden.js";
|
|
@@ -678,26 +678,27 @@ const NavigationMenu = Object.assign(Root$1, {
|
|
|
678
678
|
TopMenuTrigger
|
|
679
679
|
});
|
|
680
680
|
const styles = {
|
|
681
|
-
"teddy-global-navigation": "_teddy-global-
|
|
682
|
-
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-
|
|
683
|
-
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-
|
|
684
|
-
"teddy-global-navigation__mobile": "_teddy-global-
|
|
685
|
-
"teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-
|
|
686
|
-
"teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-
|
|
687
|
-
"teddy-global-navigation__link": "_teddy-global-
|
|
688
|
-
"teddy-global-navigation__header": "_teddy-global-
|
|
689
|
-
"teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-
|
|
690
|
-
"teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--
|
|
691
|
-
"teddy-global-
|
|
692
|
-
"teddy-global-
|
|
693
|
-
"teddy-global-
|
|
694
|
-
"teddy-global-navigation__item-
|
|
695
|
-
"teddy-global-
|
|
696
|
-
"
|
|
697
|
-
"
|
|
698
|
-
"teddy-global-navigation__top-menu-
|
|
699
|
-
"teddy-global-
|
|
700
|
-
"teddy-global-
|
|
681
|
+
"teddy-global-navigation": "_teddy-global-navigation_1i7an_1",
|
|
682
|
+
"teddy-global-navigation__mobile-trigger": "_teddy-global-navigation__mobile-trigger_1i7an_6",
|
|
683
|
+
"teddy-global-navigation__mobile-header": "_teddy-global-navigation__mobile-header_1i7an_9",
|
|
684
|
+
"teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1i7an_6",
|
|
685
|
+
"teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1i7an_32",
|
|
686
|
+
"teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1i7an_37",
|
|
687
|
+
"teddy-global-navigation__link": "_teddy-global-navigation__link_1i7an_41",
|
|
688
|
+
"teddy-global-navigation__header": "_teddy-global-navigation__header_1i7an_51",
|
|
689
|
+
"teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1i7an_54",
|
|
690
|
+
"teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1i7an_57",
|
|
691
|
+
"teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1i7an_61",
|
|
692
|
+
"teddy-global-navigation__list": "_teddy-global-navigation__list_1i7an_67",
|
|
693
|
+
"teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1i7an_72",
|
|
694
|
+
"teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1i7an_75",
|
|
695
|
+
"teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1i7an_79",
|
|
696
|
+
"teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1i7an_86",
|
|
697
|
+
"close-viewport": "_close-viewport_1i7an_1",
|
|
698
|
+
"teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1i7an_97",
|
|
699
|
+
"teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1i7an_100",
|
|
700
|
+
"teddy-global-navigation__accordion-look": "_teddy-global-navigation__accordion-look_1i7an_117",
|
|
701
|
+
"teddy-global-navigation__mobile-link--accordion-look": "_teddy-global-navigation__mobile-link--accordion-look_1i7an_133"
|
|
701
702
|
};
|
|
702
703
|
function MyPages(props) {
|
|
703
704
|
var _a, _b;
|
|
@@ -858,14 +859,13 @@ const ANIMATION_DURATION = 300;
|
|
|
858
859
|
const Desktop = React__default.forwardRef(() => {
|
|
859
860
|
const rootContext = React__default.useContext(RootContext);
|
|
860
861
|
const [hideMenu, setHideMenu] = React__default.useState(null);
|
|
861
|
-
const [specifiedLink, setSpecifiedLink] = React__default.useState("");
|
|
862
862
|
const lastScrollDirection = React__default.useRef();
|
|
863
863
|
const scrollStartPos = React__default.useRef(0);
|
|
864
864
|
const lastScrollPos = React__default.useRef(0);
|
|
865
865
|
const topMenuRef = React__default.useRef(null);
|
|
866
866
|
const viewPortRef = React__default.useRef(null);
|
|
867
867
|
const shouldShowViewport = [...PRIVATE_LINKS.links, ...BUSINESS_LINKS.links, ...MDU_LINKS.links].some(
|
|
868
|
-
(link) =>
|
|
868
|
+
(link) => link.links.length && link.name === (rootContext == null ? void 0 : rootContext.specifiedLink)
|
|
869
869
|
);
|
|
870
870
|
const viewPortSize = useSize(viewPortRef.current);
|
|
871
871
|
const topMenuSize = useSize(topMenuRef.current);
|
|
@@ -926,7 +926,7 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
926
926
|
lastScrollPos.current = window.scrollY;
|
|
927
927
|
setHideMenu(false);
|
|
928
928
|
}
|
|
929
|
-
const { setSelectedMenuItem, linkComponent: Link2 } = rootContext;
|
|
929
|
+
const { setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
|
|
930
930
|
const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
|
|
931
931
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
932
932
|
/* @__PURE__ */ jsx("div", { className: styles[`${rootClassName}__top-menu-color`], children: /* @__PURE__ */ jsx(
|
|
@@ -979,7 +979,7 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
979
979
|
asChild: true,
|
|
980
980
|
active: currentLocation === subLink.link,
|
|
981
981
|
onClick: () => setSpecifiedLink(subLink.name),
|
|
982
|
-
children:
|
|
982
|
+
children: /* @__PURE__ */ jsx(Button, { children: subLink.name })
|
|
983
983
|
}
|
|
984
984
|
) : /* @__PURE__ */ jsx(
|
|
985
985
|
NavigationMenu.Link,
|
|
@@ -990,7 +990,7 @@ const Desktop = React__default.forwardRef(() => {
|
|
|
990
990
|
children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsx("a", { href: subLink.link, children: subLink.name })
|
|
991
991
|
}
|
|
992
992
|
),
|
|
993
|
-
/* @__PURE__ */ jsx(NavigationMenu.Content, { children: subLink.name === specifiedLink && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
993
|
+
/* @__PURE__ */ jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
994
994
|
((_b = subLink.links) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", pt: "400", pl: "150", children: /* @__PURE__ */ jsx(HightlightedLinksDesktop, { listName: subLink.name, subLink, links: subLink.links }) }),
|
|
995
995
|
((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "40px", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", subLink, links: subLink.highlightedLinks }) })
|
|
996
996
|
] }) })
|
|
@@ -1101,7 +1101,7 @@ function Mobile(props) {
|
|
|
1101
1101
|
return /* @__PURE__ */ jsxs(Tabs.Content, { value: link.name, children: [
|
|
1102
1102
|
/* @__PURE__ */ jsx(Box, { mt: "400", children: (_a = link.links) == null ? void 0 : _a.filter((l) => l.name !== "Logo").map(
|
|
1103
1103
|
(subLink) => subLink.links.length > 0 ? /* @__PURE__ */ jsxs(Box, { onClick: () => setSpecifiedLink(subLink.name), className: linkClasses, children: [
|
|
1104
|
-
/* @__PURE__ */ jsx(Heading, { asChild: true, variant: "title-300", children: /* @__PURE__ */ jsx(Button, {
|
|
1104
|
+
/* @__PURE__ */ jsx(Heading, { asChild: true, variant: "title-300", children: /* @__PURE__ */ jsx(Button, { className: styles[`${rootClassName}__sublink-button--mobile`], children: subLink.name }) }),
|
|
1105
1105
|
/* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "md" })
|
|
1106
1106
|
] }) : /* @__PURE__ */ jsx(Fragment, { children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxs(NavLink, { href: subLink.link, className: linkClasses, children: [
|
|
1107
1107
|
/* @__PURE__ */ jsx(Heading, { variant: "title-300", as: "h2", className: headerClasses, children: subLink.name }),
|
|
@@ -1244,6 +1244,7 @@ function Root({
|
|
|
1244
1244
|
const [selectedMenuItem, setSelectedMenuItem] = React__default.useState(getInitialMenuItem(currentPath));
|
|
1245
1245
|
const [selectedDomainItem, setSelectedDomainItem] = React__default.useState(getInitialDomain(currentPath));
|
|
1246
1246
|
const [pathname, setPathname] = React__default.useState(currentPath || "");
|
|
1247
|
+
const [specifiedLink, setSpecifiedLink] = React__default.useState("");
|
|
1247
1248
|
const classes = clsx([styles[`${rootClassName}`]], className);
|
|
1248
1249
|
return /* @__PURE__ */ jsx(
|
|
1249
1250
|
RootContext.Provider,
|
|
@@ -1276,7 +1277,9 @@ function Root({
|
|
|
1276
1277
|
onSearchSubmit,
|
|
1277
1278
|
isCartOpen,
|
|
1278
1279
|
onCartOpenChange,
|
|
1279
|
-
drawerSize
|
|
1280
|
+
drawerSize,
|
|
1281
|
+
specifiedLink,
|
|
1282
|
+
setSpecifiedLink
|
|
1280
1283
|
},
|
|
1281
1284
|
children: /* @__PURE__ */ jsx(Box, { ...props, className: classes, children: /* @__PURE__ */ jsxs(
|
|
1282
1285
|
NavigationMenu,
|
package/dist/style.css
CHANGED
|
@@ -5177,47 +5177,47 @@
|
|
|
5177
5177
|
opacity: 0;
|
|
5178
5178
|
transform: translateX(-200px);
|
|
5179
5179
|
}
|
|
5180
|
-
}._teddy-global-
|
|
5180
|
+
}._teddy-global-navigation_1i7an_1 {
|
|
5181
5181
|
position: sticky;
|
|
5182
5182
|
inset: 0 0 auto 0;
|
|
5183
5183
|
z-index: 39;
|
|
5184
5184
|
}
|
|
5185
|
-
._teddy-global-navigation__mobile-
|
|
5185
|
+
._teddy-global-navigation__mobile-trigger_1i7an_6 {
|
|
5186
5186
|
border-inline: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
5187
5187
|
}
|
|
5188
|
-
._teddy-global-navigation__mobile-
|
|
5188
|
+
._teddy-global-navigation__mobile-header_1i7an_9[data-state=open] {
|
|
5189
5189
|
border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
5190
5190
|
}
|
|
5191
|
-
._teddy-global-
|
|
5191
|
+
._teddy-global-navigation__mobile_1i7an_6 {
|
|
5192
5192
|
padding: var(--teddy-spacing-25) var(--teddy-spacing-200);
|
|
5193
5193
|
border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-border-weak);
|
|
5194
5194
|
}
|
|
5195
5195
|
@media screen and (max-width: 335px) {
|
|
5196
|
-
._teddy-global-
|
|
5196
|
+
._teddy-global-navigation__mobile_1i7an_6 {
|
|
5197
5197
|
padding: var(--teddy-spacing-25) 0;
|
|
5198
5198
|
}
|
|
5199
5199
|
}
|
|
5200
|
-
._teddy-global-
|
|
5200
|
+
._teddy-global-navigation__mobile_1i7an_6::before {
|
|
5201
5201
|
content: "";
|
|
5202
5202
|
display: block;
|
|
5203
5203
|
width: var(--width-for-centering-element);
|
|
5204
5204
|
}
|
|
5205
|
-
._teddy-global-
|
|
5205
|
+
._teddy-global-navigation__mobile_1i7an_6::after {
|
|
5206
5206
|
content: "";
|
|
5207
5207
|
display: block;
|
|
5208
5208
|
width: var(--width-for-centering-element);
|
|
5209
5209
|
}
|
|
5210
5210
|
@media screen and (max-width: 335px) {
|
|
5211
|
-
._teddy-global-navigation__top-icon-
|
|
5211
|
+
._teddy-global-navigation__top-icon-wrapper_1i7an_32 {
|
|
5212
5212
|
gap: 0;
|
|
5213
5213
|
}
|
|
5214
5214
|
}
|
|
5215
5215
|
@media screen and (max-width: 335px) {
|
|
5216
|
-
._teddy-global-navigation__top-menu-
|
|
5216
|
+
._teddy-global-navigation__top-menu-icons_1i7an_37 {
|
|
5217
5217
|
gap: 0;
|
|
5218
5218
|
}
|
|
5219
5219
|
}
|
|
5220
|
-
._teddy-global-
|
|
5220
|
+
._teddy-global-navigation__link_1i7an_41 {
|
|
5221
5221
|
text-decoration: none;
|
|
5222
5222
|
display: flex;
|
|
5223
5223
|
justify-content: space-between;
|
|
@@ -5227,67 +5227,73 @@
|
|
|
5227
5227
|
font-weight: var(--teddy-typography-weight-bold);
|
|
5228
5228
|
font-size: var(--teddy-typography-scale-400);
|
|
5229
5229
|
}
|
|
5230
|
-
._teddy-global-
|
|
5230
|
+
._teddy-global-navigation__header_1i7an_51 {
|
|
5231
5231
|
color: var(--teddy-color-text-interactive-primary);
|
|
5232
5232
|
}
|
|
5233
|
-
._teddy-global-navigation__colored-
|
|
5233
|
+
._teddy-global-navigation__colored-box_1i7an_54 {
|
|
5234
5234
|
background-color: var(--teddy-color-background-secondary);
|
|
5235
5235
|
}
|
|
5236
|
-
._teddy-global-navigation__colored-box--
|
|
5236
|
+
._teddy-global-navigation__colored-box--mobile_1i7an_57 {
|
|
5237
5237
|
margin: 0 -1.5rem;
|
|
5238
5238
|
background-color: var(--teddy-color-background-secondary);
|
|
5239
5239
|
}
|
|
5240
|
-
._teddy-global-
|
|
5240
|
+
._teddy-global-navigation__sublink-button--mobile_1i7an_61 {
|
|
5241
|
+
background-color: transparent;
|
|
5242
|
+
padding: 0;
|
|
5243
|
+
color: var(--teddy-color-text-interactive-primary);
|
|
5244
|
+
border-radius: unset;
|
|
5245
|
+
}
|
|
5246
|
+
._teddy-global-navigation__list_1i7an_67 {
|
|
5241
5247
|
column-count: 2;
|
|
5242
5248
|
max-height: 13rem;
|
|
5243
5249
|
column-gap: var(--teddy-spacing-300);
|
|
5244
5250
|
}
|
|
5245
|
-
._teddy-global-
|
|
5251
|
+
._teddy-global-navigation__viewport_1i7an_72._teddy-global-navigation__viewport_1i7an_72 {
|
|
5246
5252
|
height: var(--teddy-viewport-wrapper-height);
|
|
5247
5253
|
}
|
|
5248
|
-
._teddy-global-navigation__item-
|
|
5254
|
+
._teddy-global-navigation__item-wrapper_1i7an_75 {
|
|
5249
5255
|
position: relative;
|
|
5250
5256
|
display: flex;
|
|
5251
5257
|
}
|
|
5252
|
-
._teddy-global-navigation__item-
|
|
5258
|
+
._teddy-global-navigation__item-count_1i7an_79 {
|
|
5253
5259
|
display: flex;
|
|
5254
5260
|
justify-content: center;
|
|
5255
5261
|
align-items: center;
|
|
5256
5262
|
position: absolute;
|
|
5257
5263
|
transform: translate(calc(var(--teddy-spacing-150) + var(--teddy-spacing-25)), calc(-1 * var(--teddy-spacing-100) + var(--teddy-spacing-10)));
|
|
5258
5264
|
}
|
|
5259
|
-
._teddy-global-navigation__viewport-
|
|
5265
|
+
._teddy-global-navigation__viewport-wrapper_1i7an_86 {
|
|
5260
5266
|
overflow: hidden;
|
|
5261
5267
|
transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
|
|
5262
5268
|
}
|
|
5263
|
-
._teddy-global-navigation__viewport-
|
|
5269
|
+
._teddy-global-navigation__viewport-wrapper_1i7an_86[data-state=open] {
|
|
5264
5270
|
max-height: var(--teddy-viewport-wrapper-height);
|
|
5265
5271
|
}
|
|
5266
|
-
._teddy-global-navigation__viewport-
|
|
5267
|
-
animation: _close-
|
|
5272
|
+
._teddy-global-navigation__viewport-wrapper_1i7an_86[data-state=closed] {
|
|
5273
|
+
animation: _close-viewport_1i7an_1 var(--teddy-motion-duration-controlled, 0) ease;
|
|
5268
5274
|
max-height: 0;
|
|
5269
5275
|
}
|
|
5270
|
-
._teddy-global-navigation__top-menu-
|
|
5276
|
+
._teddy-global-navigation__top-menu-color_1i7an_97 {
|
|
5271
5277
|
background-color: var(--teddy-color-background-secondary);
|
|
5272
5278
|
}
|
|
5273
|
-
._teddy-global-navigation__top-menu-
|
|
5279
|
+
._teddy-global-navigation__top-menu-wrapper_1i7an_100 {
|
|
5274
5280
|
overflow: hidden;
|
|
5275
5281
|
max-width: 84rem;
|
|
5276
5282
|
transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
|
|
5277
5283
|
margin: 0 var(--teddy-spacing-600);
|
|
5278
5284
|
}
|
|
5279
5285
|
@media (min-width: 1440px) {
|
|
5280
|
-
._teddy-global-navigation__top-menu-
|
|
5286
|
+
._teddy-global-navigation__top-menu-wrapper_1i7an_100 {
|
|
5281
5287
|
margin: 0 auto;
|
|
5282
5288
|
}
|
|
5283
5289
|
}
|
|
5284
|
-
._teddy-global-navigation__top-menu-
|
|
5290
|
+
._teddy-global-navigation__top-menu-wrapper_1i7an_100[data-state=open] {
|
|
5285
5291
|
max-height: var(--teddy-top-menu-height, 47px);
|
|
5286
5292
|
}
|
|
5287
|
-
._teddy-global-navigation__top-menu-
|
|
5293
|
+
._teddy-global-navigation__top-menu-wrapper_1i7an_100[data-state=closed] {
|
|
5288
5294
|
max-height: 0;
|
|
5289
5295
|
}
|
|
5290
|
-
._teddy-global-navigation__accordion-
|
|
5296
|
+
._teddy-global-navigation__accordion-look_1i7an_117 {
|
|
5291
5297
|
background-color: var(--teddy-color-background-interactive-transparent);
|
|
5292
5298
|
display: grid;
|
|
5293
5299
|
grid-template-columns: minmax(0, 1fr) auto;
|
|
@@ -5297,13 +5303,13 @@
|
|
|
5297
5303
|
font-weight: var(--teddy-typography-weight-bold);
|
|
5298
5304
|
border-top: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
5299
5305
|
}
|
|
5300
|
-
._teddy-global-navigation__accordion-
|
|
5306
|
+
._teddy-global-navigation__accordion-look_1i7an_117:first-child {
|
|
5301
5307
|
margin-top: 0;
|
|
5302
5308
|
}
|
|
5303
|
-
._teddy-global-navigation__accordion-
|
|
5309
|
+
._teddy-global-navigation__accordion-look_1i7an_117:last-child {
|
|
5304
5310
|
border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
5305
5311
|
}
|
|
5306
|
-
._teddy-global-navigation__mobile-link--accordion-
|
|
5312
|
+
._teddy-global-navigation__mobile-link--accordion-look_1i7an_133 {
|
|
5307
5313
|
padding: calc(var(--teddy-spacing-150) + var(--teddy-spacing-25)) 0;
|
|
5308
5314
|
font-family: var(--teddy-typography-family-default);
|
|
5309
5315
|
font-weight: var(--teddy-typography-weight-bold);
|
|
@@ -5311,16 +5317,16 @@
|
|
|
5311
5317
|
line-height: var(--teddy-typography-line-height-default);
|
|
5312
5318
|
}
|
|
5313
5319
|
@media (min-width: 600px) {
|
|
5314
|
-
._teddy-global-navigation__mobile-link--accordion-
|
|
5320
|
+
._teddy-global-navigation__mobile-link--accordion-look_1i7an_133 {
|
|
5315
5321
|
padding: calc(var(--teddy-spacing-250) + var(--teddy-spacing-10)) 0;
|
|
5316
5322
|
}
|
|
5317
5323
|
}
|
|
5318
5324
|
@media (min-width: 1024px) {
|
|
5319
|
-
._teddy-global-navigation__mobile-link--accordion-
|
|
5325
|
+
._teddy-global-navigation__mobile-link--accordion-look_1i7an_133 {
|
|
5320
5326
|
padding: calc(var(--teddy-spacing-300) + var(--teddy-spacing-10)) 0;
|
|
5321
5327
|
}
|
|
5322
5328
|
}
|
|
5323
|
-
@keyframes _close-
|
|
5329
|
+
@keyframes _close-viewport_1i7an_1 {
|
|
5324
5330
|
0% {
|
|
5325
5331
|
max-height: var(--teddy-viewport-wrapper-height);
|
|
5326
5332
|
}
|