@telia/teddy 0.7.17 → 0.7.27

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.
Files changed (136) hide show
  1. package/README.md +1 -1
  2. package/dist/components/avatar/avatar-root.d.ts +1 -1
  3. package/dist/components/avatar/index.d.ts +1 -1
  4. package/dist/components/breadcrumbs/breadcrumbs-link.d.ts +1 -1
  5. package/dist/components/breadcrumbs/index.d.ts +1 -1
  6. package/dist/components/card/card-illustration.d.ts +1 -1
  7. package/dist/components/card/card-link.d.ts +1 -1
  8. package/dist/components/channel-button/channel-button-root.d.ts +3 -3
  9. package/dist/components/channel-button/index.d.ts +3 -3
  10. package/dist/components/checkbox/checkbox-group.d.ts +1 -1
  11. package/dist/components/checkbox/index.d.ts +1 -1
  12. package/dist/components/checkbox-card-group/checkbox-card-group-content.cjs +65 -0
  13. package/dist/components/checkbox-card-group/checkbox-card-group-content.d.ts +5 -0
  14. package/dist/components/checkbox-card-group/checkbox-card-group-content.js +65 -0
  15. package/dist/components/checkbox-card-group/checkbox-card-group-indicator.cjs +1466 -0
  16. package/dist/components/checkbox-card-group/checkbox-card-group-indicator.d.ts +12 -0
  17. package/dist/components/checkbox-card-group/checkbox-card-group-indicator.js +1447 -0
  18. package/dist/components/checkbox-card-group/checkbox-card-group-item-body.cjs +15 -0
  19. package/dist/components/checkbox-card-group/checkbox-card-group-item-body.d.ts +5 -0
  20. package/dist/components/checkbox-card-group/checkbox-card-group-item-body.js +15 -0
  21. package/dist/components/checkbox-card-group/checkbox-card-group-item-title.cjs +66 -0
  22. package/dist/components/checkbox-card-group/checkbox-card-group-item-title.d.ts +14 -0
  23. package/dist/components/checkbox-card-group/checkbox-card-group-item-title.js +66 -0
  24. package/dist/components/checkbox-card-group/checkbox-card-group-item.cjs +67 -0
  25. package/dist/components/checkbox-card-group/checkbox-card-group-item.d.ts +22 -0
  26. package/dist/components/checkbox-card-group/checkbox-card-group-item.js +67 -0
  27. package/dist/components/checkbox-card-group/checkbox-card-group-label.cjs +29 -0
  28. package/dist/components/checkbox-card-group/checkbox-card-group-label.d.ts +65 -0
  29. package/dist/components/checkbox-card-group/checkbox-card-group-label.js +29 -0
  30. package/dist/components/checkbox-card-group/checkbox-card-group-root.cjs +42 -0
  31. package/dist/components/checkbox-card-group/checkbox-card-group-root.d.ts +39 -0
  32. package/dist/components/checkbox-card-group/checkbox-card-group-root.js +42 -0
  33. package/dist/components/checkbox-card-group/index.cjs +7 -0
  34. package/dist/components/checkbox-card-group/index.d.ts +76 -0
  35. package/dist/components/checkbox-card-group/index.js +7 -0
  36. package/dist/components/chip/chip-indicator.d.ts +3 -2
  37. package/dist/components/chip/index.d.ts +3 -2
  38. package/dist/components/color-dot/index.d.ts +1 -1
  39. package/dist/components/dashboard-card/dashboard-card-avatar.d.ts +1 -1
  40. package/dist/components/expandable-card/expandable-card-button.d.ts +2 -2
  41. package/dist/components/expandable-card/index.d.ts +3 -3
  42. package/dist/components/flip-card/flip-card-trigger.d.ts +2 -2
  43. package/dist/components/icon/icon.cjs +4 -1
  44. package/dist/components/icon/icon.d.ts +1 -0
  45. package/dist/components/icon/icon.js +4 -1
  46. package/dist/components/icon/utils.d.ts +1 -1
  47. package/dist/components/index.cjs +8 -5
  48. package/dist/components/index.d.ts +2 -0
  49. package/dist/components/index.js +4 -1
  50. package/dist/components/modal/index.cjs +2 -2
  51. package/dist/components/modal/index.js +1 -1
  52. package/dist/components/modal/modal-close.cjs +3 -2
  53. package/dist/components/modal/modal-close.js +3 -2
  54. package/dist/components/navigation-menu/global-navigation/global-navigation-desktop-simplified.cjs +2 -2
  55. package/dist/components/navigation-menu/global-navigation/global-navigation-desktop-simplified.js +2 -2
  56. package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.cjs +2 -2
  57. package/dist/components/navigation-menu/global-navigation/global-navigation-desktop.js +1 -1
  58. package/dist/components/navigation-menu/global-navigation/global-navigation-mobile-simplified.cjs +2 -2
  59. package/dist/components/navigation-menu/global-navigation/global-navigation-mobile-simplified.js +2 -2
  60. package/dist/components/navigation-menu/global-navigation/global-navigation-mobile.cjs +3 -3
  61. package/dist/components/navigation-menu/global-navigation/global-navigation-mobile.js +2 -2
  62. package/dist/components/navigation-menu/global-navigation/global-navigation-my-pages.cjs +2 -2
  63. package/dist/components/navigation-menu/global-navigation/global-navigation-my-pages.js +2 -2
  64. package/dist/components/navigation-menu/global-navigation/global-navigation-root.cjs +4 -4
  65. package/dist/components/navigation-menu/global-navigation/global-navigation-root.js +4 -4
  66. package/dist/components/navigation-menu/global-navigation/global-navigation-search-field.cjs +2 -2
  67. package/dist/components/navigation-menu/global-navigation/global-navigation-search-field.js +2 -2
  68. package/dist/components/navigation-menu/global-navigation/global-navigation-search.cjs +2 -2
  69. package/dist/components/navigation-menu/global-navigation/global-navigation-search.js +2 -2
  70. package/dist/components/navigation-menu/global-navigation/global-navigation-shopping-cart.cjs +2 -2
  71. package/dist/components/navigation-menu/global-navigation/global-navigation-shopping-cart.js +2 -2
  72. package/dist/components/navigation-menu/global-navigation/index.cjs +2 -2
  73. package/dist/components/navigation-menu/global-navigation/index.js +1 -1
  74. package/dist/components/navigation-menu/index.cjs +3 -3
  75. package/dist/components/navigation-menu/index.js +1 -1
  76. package/dist/components/navigation-menu/navigation-menu.cjs +5 -4
  77. package/dist/components/navigation-menu/navigation-menu.js +2 -1
  78. package/dist/components/notabene/notabene-icon.d.ts +3 -2
  79. package/dist/components/notification/index.d.ts +1 -1
  80. package/dist/components/notification/notification-icon.d.ts +3 -2
  81. package/dist/components/notification/notification-root.d.ts +1 -1
  82. package/dist/components/pagination/pagination-button.d.ts +1 -1
  83. package/dist/components/radio-card-group/index.cjs +2 -2
  84. package/dist/components/radio-card-group/index.js +1 -1
  85. package/dist/components/radio-card-group/radio-card-group-content.cjs +3 -2
  86. package/dist/components/radio-card-group/radio-card-group-content.js +3 -2
  87. package/dist/components/radio-card-group/radio-card-group-item-title.cjs +22 -1328
  88. package/dist/components/radio-card-group/radio-card-group-item-title.js +22 -1309
  89. package/dist/components/radio-card-group/radio-card-group-item.cjs +4 -3
  90. package/dist/components/radio-card-group/radio-card-group-item.js +4 -3
  91. package/dist/components/scroll-area/index.d.ts +3 -3
  92. package/dist/components/scroll-area/scroll-area-button.d.ts +2 -2
  93. package/dist/components/select/index.cjs +4 -1
  94. package/dist/components/select/index.d.ts +5 -1
  95. package/dist/components/select/index.js +4 -1
  96. package/dist/components/select/select-group.cjs +6 -2
  97. package/dist/components/select/select-group.d.ts +4 -2
  98. package/dist/components/select/select-group.js +7 -3
  99. package/dist/components/select/select-root.cjs +12 -10
  100. package/dist/components/select/select-root.js +12 -10
  101. package/dist/components/select/select-separator.cjs +30 -0
  102. package/dist/components/select/select-separator.d.ts +5 -0
  103. package/dist/components/select/select-separator.js +13 -0
  104. package/dist/components/step-indicator/index.cjs +14 -0
  105. package/dist/components/step-indicator/index.d.ts +38 -0
  106. package/dist/components/step-indicator/index.js +14 -0
  107. package/dist/components/step-indicator/step-indicator-root.cjs +8 -0
  108. package/dist/components/step-indicator/step-indicator-root.d.ts +55 -0
  109. package/dist/components/step-indicator/step-indicator-root.js +8 -0
  110. package/dist/components/step-indicator/step-indicator-step-element.cjs +157 -0
  111. package/dist/components/step-indicator/step-indicator-step-element.d.ts +14 -0
  112. package/dist/components/step-indicator/step-indicator-step-element.js +157 -0
  113. package/dist/components/step-indicator/step-indicator-step-line.cjs +6 -0
  114. package/dist/components/step-indicator/step-indicator-step-line.d.ts +9 -0
  115. package/dist/components/step-indicator/step-indicator-step-line.js +6 -0
  116. package/dist/components/step-indicator/step-indicator-step.cjs +8 -0
  117. package/dist/components/step-indicator/step-indicator-step.d.ts +24 -0
  118. package/dist/components/step-indicator/step-indicator-step.js +8 -0
  119. package/dist/components/tabs/index.d.ts +1 -1
  120. package/dist/components/tabs/tabs-root.d.ts +1 -1
  121. package/dist/components/tabs/tabs-scroll-button.d.ts +2 -2
  122. package/dist/components/tabs/tabs-scroll.d.ts +1 -1
  123. package/dist/components/text-field/index.d.ts +2 -2
  124. package/dist/components/text-field/text-field-button.d.ts +2 -2
  125. package/dist/components/toggle/toggle.d.ts +3 -2
  126. package/dist/components/tooltip/index.d.ts +1 -1
  127. package/dist/main.cjs +8 -5
  128. package/dist/main.js +4 -1
  129. package/dist/style.css +529 -113
  130. package/dist/tokens/color/variables.cjs +32 -32
  131. package/dist/tokens/color/variables.d.ts +32 -32
  132. package/dist/tokens/color/variables.js +32 -32
  133. package/dist/utils/generate-styling/grid.d.ts +24 -24
  134. package/dist/utils/generate-styling/index.d.ts +16 -16
  135. package/dist/utils/generate-styling/util.d.ts +2 -2
  136. package/package.json +5 -5
@@ -0,0 +1,1447 @@
1
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
+ import React__default, { useEffect } from "react";
3
+ import clsx from "clsx";
4
+ import { MY_PAGE_RETAILER_LINKS, MY_PAGE_LINKS, LOGGED_IN_LINKS_BUSINESS, getLinks, getActiveSubLink, DEFAULT_PRIVATE_LINKS, DEFAULT_BUSINESS_LINKS, DEFAULT_MDU_LINKS } from "../navigation-menu/global-navigation/utils.js";
5
+ import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
6
+ import { useComposedRefs } from "../../utils/composeRefs.js";
7
+ import { VisuallyHidden } from "../visually-hidden/visually-hidden.js";
8
+ import { composeEventHandlers } from "../../utils/composeEventHandlers.js";
9
+ import { Slot } from "@radix-ui/react-slot";
10
+ import { useControllableState } from "@radix-ui/react-use-controllable-state";
11
+ import { mergeStyles } from "../../utils/generate-styling/index.js";
12
+ import { teddyMotionDuration300 } from "../../tokens/motion/variables.js";
13
+ import "../step-indicator/index.js";
14
+ import "../metric-meter/metric-meter.js";
15
+ import "../footer/index.js";
16
+ import "../pagination/index.js";
17
+ import "../select/index.js";
18
+ import "../avatar/index.js";
19
+ import "../dashboard-card/index.js";
20
+ import "../table/index.js";
21
+ import "../flip-card/index.js";
22
+ import "../channel-button/index.js";
23
+ import "../collapsible/index.js";
24
+ import "../meter-bar/index.js";
25
+ import "../skeleton/index.js";
26
+ import { Checkbox } from "../checkbox/index.js";
27
+ import { s as styles$2, rootClassName as rootClassName$2, Root as Root$2 } from "./checkbox-card-group-root.js";
28
+ import { GroupLabel } from "./checkbox-card-group-label.js";
29
+ import "../toast/toast-root.js";
30
+ import "sonner";
31
+ import "../toggletip/index.js";
32
+ import "../breadcrumbs/index.js";
33
+ import { s as styles$3, rootClassName as rootClassName$3, Root as Root$3 } from "../radio-card-group/radio-card-group-root.js";
34
+ import { GroupLabel as GroupLabel$1 } from "../radio-card-group/radio-card-group-label.js";
35
+ import "../ribbon/index.js";
36
+ import "../expandable-card/index.js";
37
+ import "../color-dot/color-dot-root.js";
38
+ import "../progress-bar/progress-bar.js";
39
+ import "../notabene/index.js";
40
+ import "../tooltip/index.js";
41
+ import { List as List$1 } from "../list/index.js";
42
+ import "../scroll-area/index.js";
43
+ import { Tabs } from "../tabs/index.js";
44
+ import { Drawer } from "../drawer/index.js";
45
+ import "../image/image.js";
46
+ import "../chip/index.js";
47
+ import "../../assets/sprite.6511e521-teddy.svg";
48
+ import { rootClassName as rootClassName$4, RootContext as RootContext$1, Root as Root$4 } from "../modal/modal-root.js";
49
+ import { Trigger as Trigger$1 } from "../modal/modal-trigger.js";
50
+ import { Content as Content$3 } from "../modal/modal-content.js";
51
+ import { Title as Title$2 } from "../modal/modal-title.js";
52
+ import { Description } from "../modal/modal-description.js";
53
+ import { Overlay } from "../modal/modal-overlay.js";
54
+ import { Group } from "../modal/modal-group.js";
55
+ import * as DrawerPrimitive from "@radix-ui/react-dialog";
56
+ import { Icon } from "../icon/icon.js";
57
+ import "../notification/index.js";
58
+ import "../radio-group/index.js";
59
+ import { Box } from "../box/box.js";
60
+ import { Flex } from "../flex/flex.js";
61
+ import "../card/index.js";
62
+ import { Grid } from "../grid/grid.js";
63
+ import "../toggle/toggle.js";
64
+ import "../accordion/index.js";
65
+ import "../link/link.js";
66
+ import "../badge/badge.js";
67
+ import "../badge/alert-badge.js";
68
+ import { CounterBadge } from "../badge/counter-badge.js";
69
+ import { Button } from "../button/button.js";
70
+ import "../field-error-text/field-error-text.js";
71
+ import "../helper-text/helper-text.js";
72
+ import "../input/index.js";
73
+ import "../label/label.js";
74
+ import "../spinner/spinner.js";
75
+ import { Text } from "../text/text.js";
76
+ import { TextField } from "../text-field/index.js";
77
+ import { Heading } from "../heading/heading.js";
78
+ import { TextSpacing } from "../text-spacing/text-spacing.js";
79
+ import "../container/container.js";
80
+ import "../carousel/carousel-root.js";
81
+ import "../slider/slider.js";
82
+ import { s as styles$4 } from "../../modal.module-DuP4in7f.js";
83
+ import { Image } from "../modal/modal-image.js";
84
+ import { Indicator as Indicator$2 } from "../radio-card-group/radio-card-group-indicator.js";
85
+ import { Body as Body$1 } from "../radio-card-group/radio-card-group-item-body.js";
86
+ import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
87
+ import { Body } from "./checkbox-card-group-item-body.js";
88
+ import { useSize } from "../../utils/useSize.js";
89
+ const Indicator$1 = React__default.forwardRef(
90
+ ({ className, checked, onCheckedChange, disabled, ...props }, forwardRef) => {
91
+ const classes = clsx([styles$2[`${rootClassName$2}__checkbox-wrapper`]], className);
92
+ return /* @__PURE__ */ jsx("div", { ref: forwardRef, className: classes, ...props, children: /* @__PURE__ */ jsx(Checkbox, { children: /* @__PURE__ */ jsx(
93
+ Checkbox.Trigger,
94
+ {
95
+ className: styles$2[`${rootClassName$2}__trigger`],
96
+ checked,
97
+ onCheckedChange,
98
+ disabled
99
+ }
100
+ ) }) });
101
+ }
102
+ );
103
+ Indicator$1.displayName = "Indicator";
104
+ const Title$1 = React__default.forwardRef(
105
+ ({ className, children, asChild, checked, onCheckedChange, disabled, ...props }, forwardRef) => {
106
+ const classes = clsx([styles$2[`${rootClassName$2}__title`]], className);
107
+ return /* @__PURE__ */ jsxs(Flex, { width: "100%", gap: "150", className: styles$2[`${rootClassName$2}__title-wrapper`], children: [
108
+ asChild ? /* @__PURE__ */ jsx(Slot, { ...props, ref: forwardRef, className: classes, children }) : /* @__PURE__ */ jsx(Text, { variant: "paragraph-100-bold", ref: forwardRef, className: classes, children }),
109
+ /* @__PURE__ */ jsx(Indicator$1, { checked, onCheckedChange, disabled })
110
+ ] });
111
+ }
112
+ );
113
+ Title$1.displayName = "Title";
114
+ const Content$2 = React__default.forwardRef(
115
+ ({ className, children, ...props }, forwardRef) => {
116
+ const classes = clsx([styles$2[`${rootClassName$2}__content-wrapper`]], className);
117
+ return /* @__PURE__ */ jsx(Flex, { direction: "column", width: "100%", gap: "50", ...props, ref: forwardRef, className: classes, children });
118
+ }
119
+ );
120
+ Content$2.displayName = "Content";
121
+ const ItemContext$1 = React__default.createContext(void 0);
122
+ const Item$2 = React__default.forwardRef(
123
+ ({ className, children, value, imageUrl, checked, onCheckedChange, disabled, ...props }, forwardedRef) => {
124
+ const classes = clsx([styles$2[`${rootClassName$2}__card-item`]], className);
125
+ const context = React__default.useContext(ItemContext$1);
126
+ const ref = useComposedRefs(forwardedRef, context == null ? void 0 : context.triggerRef);
127
+ const id = props.id || (context == null ? void 0 : context.id);
128
+ return /* @__PURE__ */ jsxs(
129
+ "div",
130
+ {
131
+ id,
132
+ ...props,
133
+ ref,
134
+ className: classes,
135
+ "data-state": checked ? "checked" : "unchecked",
136
+ "data-disabled": disabled ? "" : void 0,
137
+ "aria-checked": checked,
138
+ children: [
139
+ imageUrl ? /* @__PURE__ */ jsx(Flex, { className: clsx([styles$2[`${rootClassName$2}__illustration`]], className), justify: "center", align: "center", children: /* @__PURE__ */ jsx("img", { src: imageUrl, alt: value }) }) : null,
140
+ /* @__PURE__ */ jsx(Content$2, { children: React__default.Children.map(children, (child) => {
141
+ if (React__default.isValidElement(child) && child.type === Title$1) {
142
+ return React__default.cloneElement(child, {
143
+ ...child.props,
144
+ checked,
145
+ onCheckedChange,
146
+ disabled
147
+ });
148
+ }
149
+ return child;
150
+ }) })
151
+ ]
152
+ }
153
+ );
154
+ }
155
+ );
156
+ Item$2.displayName = "Item";
157
+ Root$2.displayName = "CheckboxCardGroup";
158
+ GroupLabel.displayName = "CheckboxCardGroup.GroupLabel";
159
+ Item$2.displayName = "CheckboxCardGroup.Item";
160
+ Title$1.displayName = "CheckboxCardGroup.Title";
161
+ Body.displayName = "CheckboxCardGroup.Body";
162
+ Indicator$1.displayName = "CheckboxCardGroup.Indicator";
163
+ const CheckboxCardGroup = Object.assign(Root$2, {
164
+ GroupLabel,
165
+ Item: Item$2,
166
+ Title: Title$1,
167
+ Body,
168
+ Indicator: Indicator$1
169
+ });
170
+ const Title = React__default.forwardRef(
171
+ ({ className, children, asChild, ...props }, forwardRef) => {
172
+ const classes = clsx([styles$3[`${rootClassName$3}__title`]], className);
173
+ return /* @__PURE__ */ jsxs(Flex, { width: "100%", gap: "150", className: styles$3[`${rootClassName$3}__title-wrapper`], children: [
174
+ asChild ? /* @__PURE__ */ jsx(Slot, { ...props, ref: forwardRef, className: classes, children }) : /* @__PURE__ */ jsx(Text, { variant: "paragraph-100-bold", ref: forwardRef, className: classes, children }),
175
+ /* @__PURE__ */ jsx(Indicator$2, {})
176
+ ] });
177
+ }
178
+ );
179
+ Title.displayName = "Title";
180
+ const Content$1 = React__default.forwardRef(
181
+ ({ className, children, ...props }, forwardRef) => {
182
+ const classes = clsx([styles$3[`${rootClassName$3}__content-wrapper`]], className);
183
+ return /* @__PURE__ */ jsx(Flex, { direction: "column", width: "100%", gap: "50", ...props, ref: forwardRef, className: classes, children });
184
+ }
185
+ );
186
+ Content$1.displayName = "Content";
187
+ const ItemContext = React__default.createContext(void 0);
188
+ const Item$1 = React__default.forwardRef(
189
+ ({ className, children, value, ...props }, forwardedRef) => {
190
+ const classes = clsx([styles$3[`${rootClassName$3}__card-item`]], className);
191
+ const context = React__default.useContext(ItemContext);
192
+ const ref = useComposedRefs(forwardedRef, context == null ? void 0 : context.triggerRef);
193
+ const id = props.id || (context == null ? void 0 : context.id);
194
+ return /* @__PURE__ */ jsxs(RadioGroupPrimitive.Item, { value, id, ...props, asChild: false, ref, className: classes, children: [
195
+ props.imageUrl ? /* @__PURE__ */ jsx(Flex, { className: clsx([styles$3[`${rootClassName$3}__illustration`]], className), justify: "center", align: "center", children: /* @__PURE__ */ jsx("img", { src: props.imageUrl, alt: value }) }) : null,
196
+ /* @__PURE__ */ jsx(Content$1, { children })
197
+ ] });
198
+ }
199
+ );
200
+ Item$1.displayName = "Item";
201
+ Root$3.displayName = "RadioCardGroup";
202
+ GroupLabel$1.displayName = "RadioCardGroup.GroupLabel";
203
+ Item$1.displayName = "RadioCardGroup.Item";
204
+ Title.displayName = "RadioCardGroup.Title";
205
+ Body$1.displayName = "RadioCardGroup.Body";
206
+ const RadioCardGroup = Object.assign(Root$3, {
207
+ GroupLabel: GroupLabel$1,
208
+ Item: Item$1,
209
+ Title,
210
+ Body: Body$1
211
+ });
212
+ const Close = React__default.forwardRef(
213
+ ({ className, ...props }, forwardedRef) => {
214
+ const classes = clsx([styles$4[`${rootClassName$4}__close`]], {
215
+ [styles$4[`${rootClassName$4}__close--floating`]]: props.slot === "floating",
216
+ className
217
+ });
218
+ const imageRef = React__default.useContext(RootContext$1).imageRef;
219
+ const [hasImage, setHasImage] = React__default.useState(false);
220
+ useEffect(() => {
221
+ if (imageRef == null ? void 0 : imageRef.current) {
222
+ setHasImage(true);
223
+ }
224
+ }, [imageRef]);
225
+ return /* @__PURE__ */ jsx(DrawerPrimitive.Close, { ...props, className: classes, ref: forwardedRef, asChild: true, children: props.children || /* @__PURE__ */ jsx(
226
+ Button,
227
+ {
228
+ variant: hasImage ? "primary-negative" : "tertiary-purple",
229
+ iconOnly: true,
230
+ "aria-label": props["aria-label"] ?? "Lukk",
231
+ children: /* @__PURE__ */ jsx(Icon, { name: "close" })
232
+ }
233
+ ) });
234
+ }
235
+ );
236
+ Close.displayName = "Close";
237
+ const Modal = Root$4;
238
+ Modal.displayName = "Modal";
239
+ Modal.Trigger = Trigger$1;
240
+ Modal.Trigger.displayName = "Modal.Trigger";
241
+ Modal.Content = Content$3;
242
+ Modal.Content.displayName = "Modal.Content";
243
+ Modal.Title = Title$2;
244
+ Modal.Title.displayName = "Modal.Title";
245
+ Modal.Description = Description;
246
+ Modal.Description.displayName = "Modal.Description";
247
+ Modal.Overlay = Overlay;
248
+ Modal.Overlay.displayName = "Modal.Overlay";
249
+ Modal.Group = Group;
250
+ Modal.Group.displayName = "Modal.Group";
251
+ Modal.Close = Close;
252
+ Modal.Close.displayName = "Modal.Close";
253
+ Modal.Image = Image;
254
+ Modal.Image.displayName = "Modal.Image";
255
+ const styles$1 = {
256
+ "teddy-navigation-menu": "_teddy-navigation-menu_6p30v_1",
257
+ "teddy-navigation-menu__viewport": "_teddy-navigation-menu__viewport_6p30v_34",
258
+ "teddy-navigation-menu__separator": "_teddy-navigation-menu__separator_6p30v_37",
259
+ "teddy-navigation-menu__list": "_teddy-navigation-menu__list_6p30v_40",
260
+ "teddy-navigation-menu__top-menu-list": "_teddy-navigation-menu__top-menu-list_6p30v_66",
261
+ "teddy-navigation-menu__top-menu-trigger": "_teddy-navigation-menu__top-menu-trigger_6p30v_87",
262
+ "teddy-navigation-menu__top-menu-trigger--small": "_teddy-navigation-menu__top-menu-trigger--small_6p30v_106",
263
+ "teddy-navigation-menu__top-menu-trigger--button": "_teddy-navigation-menu__top-menu-trigger--button_6p30v_112",
264
+ "teddy-navigation-menu__content": "_teddy-navigation-menu__content_6p30v_187",
265
+ "teddy-navigation-menu__trigger": "_teddy-navigation-menu__trigger_6p30v_219",
266
+ "teddy-navigation-menu__trigger--small": "_teddy-navigation-menu__trigger--small_6p30v_239",
267
+ "teddy-navigation-menu__trigger--button": "_teddy-navigation-menu__trigger--button_6p30v_245",
268
+ "teddy-navigation-menu__link": "_teddy-navigation-menu__link_6p30v_313",
269
+ "teddy-navigation-menu__link--small": "_teddy-navigation-menu__link--small_6p30v_333",
270
+ "teddy-navigation-menu__link--button": "_teddy-navigation-menu__link--button_6p30v_339"
271
+ };
272
+ const rootClassName$1 = "teddy-navigation-menu";
273
+ const NavigationMenuContext = React__default.createContext({
274
+ selectedTopMenu: void 0,
275
+ setSelectedTopMenu: () => {
276
+ },
277
+ contentRef: { current: null },
278
+ focusProxyRef: { current: null },
279
+ topMenuRef: { current: null },
280
+ id: "",
281
+ dir: "ltr",
282
+ orientation: "horizontal",
283
+ onEntryKeyDown: () => {
284
+ },
285
+ onFocusProxyEnter: () => {
286
+ },
287
+ onContentFocusOutside: () => {
288
+ }
289
+ });
290
+ const Root$1 = React__default.forwardRef(
291
+ ({ className, defaultTopMenuValue, topMenuValue, onTopMenuValueChange, ...props }, forwardRef) => {
292
+ const [selectedTopMenu, setSelectedTopMenu] = useControllableState({
293
+ defaultProp: defaultTopMenuValue,
294
+ prop: topMenuValue,
295
+ onChange: onTopMenuValueChange
296
+ });
297
+ const contentRef = React__default.useRef(null);
298
+ const [allowAnimationOfHeight, setAllowAnimationOfHeight] = React__default.useState(false);
299
+ const timerRef = React__default.useRef(void 0);
300
+ const restoreContentTabOrderRef = React__default.useRef(() => {
301
+ });
302
+ const focusProxyRef = React__default.useRef(null);
303
+ const topMenuRef = React__default.useRef(null);
304
+ const id = React__default.useId();
305
+ const handleContentEntry = React__default.useCallback((side = "start") => {
306
+ if (contentRef.current) {
307
+ restoreContentTabOrderRef.current();
308
+ const candidates = getTabbableCandidates(contentRef.current);
309
+ if (candidates.length) focusFirst(side === "start" ? candidates : candidates.reverse());
310
+ }
311
+ }, []);
312
+ const handleContentExit = React__default.useCallback(() => {
313
+ if (contentRef.current) {
314
+ const candidates = getTabbableCandidates(contentRef.current);
315
+ if (candidates.length) restoreContentTabOrderRef.current = removeFromTabOrder(candidates);
316
+ }
317
+ }, []);
318
+ React__default.useEffect(() => {
319
+ timerRef.current = setTimeout(() => {
320
+ setAllowAnimationOfHeight(true);
321
+ }, 500);
322
+ return () => {
323
+ timerRef.current && clearTimeout(timerRef.current);
324
+ };
325
+ }, []);
326
+ const classes = clsx([styles$1[`${rootClassName$1}`]], className);
327
+ return /* @__PURE__ */ jsx(
328
+ NavigationMenuContext.Provider,
329
+ {
330
+ value: {
331
+ contentRef,
332
+ focusProxyRef,
333
+ topMenuRef,
334
+ id,
335
+ dir: props.dir || "ltr",
336
+ orientation: props.orientation || "horizontal",
337
+ onEntryKeyDown: handleContentEntry,
338
+ onFocusProxyEnter: handleContentEntry,
339
+ onContentFocusOutside: handleContentExit,
340
+ selectedTopMenu,
341
+ setSelectedTopMenu
342
+ },
343
+ children: /* @__PURE__ */ jsx(
344
+ NavigationMenuPrimitive.Root,
345
+ {
346
+ ...props,
347
+ style: allowAnimationOfHeight ? mergeStyles(props.style, { ["--teddy-motion-duration-controlled"]: teddyMotionDuration300 }) : props.style,
348
+ ref: forwardRef,
349
+ className: classes
350
+ }
351
+ )
352
+ }
353
+ );
354
+ }
355
+ );
356
+ Root$1.displayName = "NavigationMenu";
357
+ const TopMenuList = React__default.forwardRef(
358
+ ({ className, ...props }, forwardRef) => {
359
+ const classes = clsx([styles$1[`${rootClassName$1}__top-menu-list`]], className);
360
+ const context = React__default.useContext(NavigationMenuContext);
361
+ const ref = useComposedRefs(context.topMenuRef, forwardRef);
362
+ return /* @__PURE__ */ jsx("ul", { ...props, ref, className: classes });
363
+ }
364
+ );
365
+ TopMenuList.displayName = "NavigationMenu.TopMenuList";
366
+ const TopMenuItem = React__default.forwardRef(
367
+ ({ className, ...props }, forwardRef) => {
368
+ const classes = clsx([styles$1[`${rootClassName$1}__top-menu-item`]], className);
369
+ return /* @__PURE__ */ jsx("li", { ...props, ref: forwardRef, className: classes });
370
+ }
371
+ );
372
+ const TopMenuTrigger = React__default.forwardRef(
373
+ ({ className, asChild, active, ...props }, forwardRef) => {
374
+ const classes = clsx(
375
+ [styles$1[`${rootClassName$1}__top-menu-trigger`], styles$1[`${rootClassName$1}__top-menu-trigger--small`]],
376
+ className
377
+ );
378
+ const Comp = asChild ? Slot : "button";
379
+ const context = React__default.useContext(NavigationMenuContext);
380
+ const innerRef = React__default.useRef(null);
381
+ const ref = useComposedRefs(innerRef, forwardRef);
382
+ const isOpen = context.selectedTopMenu === props.value;
383
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
384
+ /* @__PURE__ */ jsx(
385
+ Comp,
386
+ {
387
+ ...props,
388
+ ref,
389
+ className: classes,
390
+ "data-state": isOpen ? "open" : "closed",
391
+ "data-active": active ? "true" : void 0,
392
+ "aria-expanded": isOpen,
393
+ "aria-controls": makeContentId({ value: props.value, baseId: context.id }),
394
+ ...{ [ITEM_DATA_ATTR]: "" },
395
+ onClick: composeEventHandlers(props.onClick, () => {
396
+ context.setSelectedTopMenu(props.value);
397
+ }),
398
+ onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
399
+ var _a;
400
+ const verticalEntryKey = context.dir === "rtl" ? "ArrowLeft" : "ArrowRight";
401
+ const entryKey = { horizontal: "ArrowDown", vertical: verticalEntryKey }[context.orientation];
402
+ if (isOpen && event.key === entryKey) {
403
+ context.onEntryKeyDown();
404
+ return event.preventDefault();
405
+ }
406
+ const isFocusNavigationKey = ["Home", "End", ...ARROW_KEYS].includes(event.key);
407
+ if (isFocusNavigationKey) {
408
+ const triggers = (_a = context.topMenuRef.current) == null ? void 0 : _a.querySelectorAll(`[${ITEM_DATA_ATTR}]`);
409
+ if (!triggers) return;
410
+ let candidateNodes = Array.from(triggers == null ? void 0 : triggers.values());
411
+ const prevItemKey = context.dir === "rtl" ? "ArrowRight" : "ArrowLeft";
412
+ const prevKeys = [prevItemKey, "ArrowUp", "End"];
413
+ if (prevKeys.includes(event.key)) candidateNodes.reverse();
414
+ if (ARROW_KEYS.includes(event.key)) {
415
+ const currentIndex = candidateNodes.indexOf(event.currentTarget);
416
+ candidateNodes = candidateNodes.slice(currentIndex + 1);
417
+ focusFirst(candidateNodes);
418
+ event.preventDefault();
419
+ }
420
+ }
421
+ })
422
+ }
423
+ ),
424
+ isOpen && /* @__PURE__ */ jsx(
425
+ VisuallyHidden,
426
+ {
427
+ tabIndex: 0,
428
+ ref: context.focusProxyRef,
429
+ onFocus: (event) => {
430
+ const content = context.contentRef.current;
431
+ const prevFocusedElement = event.relatedTarget;
432
+ const wasTriggerFocused = prevFocusedElement === innerRef.current;
433
+ const wasFocusFromContent = content == null ? void 0 : content.contains(prevFocusedElement);
434
+ if (wasTriggerFocused || !wasFocusFromContent) {
435
+ context.onFocusProxyEnter(wasTriggerFocused ? "start" : "end");
436
+ }
437
+ }
438
+ }
439
+ )
440
+ ] });
441
+ }
442
+ );
443
+ const List = React__default.forwardRef(
444
+ ({ className, variant, value, ...props }, forwardRef) => {
445
+ const classes = clsx([styles$1[`${rootClassName$1}__list`]], [styles$1[`${rootClassName$1}__list--${variant}`]], className);
446
+ const context = React__default.useContext(NavigationMenuContext);
447
+ const refOnOpen = useComposedRefs(context.contentRef, forwardRef);
448
+ const hasTopMenu = context.selectedTopMenu !== void 0;
449
+ const isOpen = context.selectedTopMenu === value;
450
+ if (!isOpen) return null;
451
+ return /* @__PURE__ */ jsx(
452
+ NavigationMenuPrimitive.List,
453
+ {
454
+ ref: hasTopMenu ? refOnOpen : forwardRef,
455
+ id: value && makeContentId({ value, baseId: context.id }),
456
+ ...props,
457
+ onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
458
+ var _a;
459
+ if (!value) return;
460
+ const isMetaKey = event.altKey || event.ctrlKey || event.metaKey;
461
+ const isTabKey = event.key === "Tab" && !isMetaKey;
462
+ if (isTabKey) {
463
+ const candidates = getTabbableCandidates(event.currentTarget);
464
+ const focusedElement = document.activeElement;
465
+ const index = candidates.findIndex((candidate) => candidate === focusedElement);
466
+ const isMovingBackwards = event.shiftKey;
467
+ const nextCandidates = isMovingBackwards ? candidates.slice(0, index).reverse() : candidates.slice(index + 1, candidates.length);
468
+ if (focusFirst(nextCandidates)) {
469
+ event.preventDefault();
470
+ } else {
471
+ (_a = context.focusProxyRef.current) == null ? void 0 : _a.focus();
472
+ context.onContentFocusOutside();
473
+ }
474
+ }
475
+ }),
476
+ className: classes
477
+ }
478
+ );
479
+ }
480
+ );
481
+ List.displayName = "NavigationMenu.List";
482
+ const Separator = React__default.forwardRef(({ className, ...props }, forwardRef) => {
483
+ const classes = clsx(
484
+ [styles$1[`${rootClassName$1}__separator`]],
485
+ className
486
+ );
487
+ return /* @__PURE__ */ jsx(Box, { width: "100%", p: "0", m: "0", ...props, ref: forwardRef, className: classes, asChild: true, children: /* @__PURE__ */ jsx("hr", {}) });
488
+ });
489
+ Separator.displayName = "NavigationMenu.Separator";
490
+ const Item = React__default.forwardRef(
491
+ ({ className, ...props }, forwardRef) => {
492
+ const classes = clsx([styles$1[`${rootClassName$1}__item`]], className);
493
+ return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Item, { ...props, ref: forwardRef, className: classes });
494
+ }
495
+ );
496
+ Item.displayName = "NavigationMenu.Item";
497
+ const Trigger = React__default.forwardRef(
498
+ ({ className, active, variant = "default", ...props }, forwardRef) => {
499
+ const classes = clsx(
500
+ [styles$1[`${rootClassName$1}__trigger`]],
501
+ [styles$1[`${rootClassName$1}__trigger--${variant}`]],
502
+ className
503
+ );
504
+ const innerRef = React__default.useRef(null);
505
+ const ref = useComposedRefs(forwardRef, innerRef);
506
+ return /* @__PURE__ */ jsx(
507
+ NavigationMenuPrimitive.Trigger,
508
+ {
509
+ ...props,
510
+ ref,
511
+ "data-active": active ? "true" : void 0,
512
+ className: classes,
513
+ "data-text": getLabelFromChildren(props.children)
514
+ }
515
+ );
516
+ }
517
+ );
518
+ Trigger.displayName = "NavigationMenu.Trigger";
519
+ const Content = React__default.forwardRef(
520
+ ({ className, variant = "default", ...props }, forwardRef) => {
521
+ const classes = clsx(
522
+ [styles$1[`${rootClassName$1}__content`]],
523
+ [styles$1[`${rootClassName$1}__content--${variant}`]],
524
+ className
525
+ );
526
+ return /* @__PURE__ */ jsx(
527
+ NavigationMenuPrimitive.Content,
528
+ {
529
+ ...props,
530
+ ref: forwardRef,
531
+ className: classes
532
+ }
533
+ );
534
+ }
535
+ );
536
+ const Link = React__default.forwardRef(
537
+ ({ className, variant = "default", ...props }, forwardRef) => {
538
+ const classes = clsx([styles$1[`${rootClassName$1}__link`]], [styles$1[`${rootClassName$1}__link--${variant}`]], className);
539
+ return /* @__PURE__ */ jsx(
540
+ NavigationMenuPrimitive.Link,
541
+ {
542
+ ...props,
543
+ ref: forwardRef,
544
+ className: classes,
545
+ "data-text": getLabelFromChildren(props.children)
546
+ }
547
+ );
548
+ }
549
+ );
550
+ Link.displayName = "NavigationMenu.Link";
551
+ const Indicator = React__default.forwardRef(
552
+ ({ className, ...props }, forwardRef) => {
553
+ const classes = clsx([styles$1[`${rootClassName$1}__indicator`]], className);
554
+ return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Indicator, { ...props, ref: forwardRef, className: classes });
555
+ }
556
+ );
557
+ Indicator.displayName = "NavigationMenu.Indicator";
558
+ const Viewport = React__default.forwardRef(
559
+ ({ className, ...props }, forwardRef) => {
560
+ const classes = clsx([styles$1[`${rootClassName$1}__viewport`]], className);
561
+ return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Viewport, { ...props, ref: forwardRef, className: classes });
562
+ }
563
+ );
564
+ Viewport.displayName = "NavigationMenu.Viewport";
565
+ const Sub = React__default.forwardRef(
566
+ ({ className, ...props }, forwardRef) => {
567
+ const classes = clsx([styles$1[`${rootClassName$1}__sub`]], className);
568
+ return /* @__PURE__ */ jsx(NavigationMenuPrimitive.Sub, { ...props, ref: forwardRef, className: classes });
569
+ }
570
+ );
571
+ Sub.displayName = "NavigationMenu.Sub";
572
+ function getLabelFromChildren(children) {
573
+ function findLabel(node) {
574
+ if (typeof node === "string") {
575
+ return node;
576
+ }
577
+ if (React__default.isValidElement(node) && node.props.children) {
578
+ return findLabel(node.props.children);
579
+ }
580
+ if (Array.isArray(node)) {
581
+ for (let i = node.length - 1; i >= 0; i--) {
582
+ const label = findLabel(node[i]);
583
+ if (label) {
584
+ return label;
585
+ }
586
+ }
587
+ }
588
+ return void 0;
589
+ }
590
+ return findLabel(children);
591
+ }
592
+ function getTabbableCandidates(container) {
593
+ const nodes = [];
594
+ const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
595
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
596
+ acceptNode: (node) => {
597
+ const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
598
+ if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP;
599
+ return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
600
+ }
601
+ });
602
+ while (walker.nextNode()) nodes.push(walker.currentNode);
603
+ return nodes;
604
+ }
605
+ function focusFirst(candidates) {
606
+ const previouslyFocusedElement = document.activeElement;
607
+ return candidates.some((candidate) => {
608
+ if (candidate === previouslyFocusedElement) return true;
609
+ candidate.focus();
610
+ return document.activeElement !== previouslyFocusedElement;
611
+ });
612
+ }
613
+ function removeFromTabOrder(candidates) {
614
+ candidates.forEach((candidate) => {
615
+ candidate.dataset.tabindex = candidate.getAttribute("tabindex") || "";
616
+ candidate.setAttribute("tabindex", "-1");
617
+ });
618
+ return () => {
619
+ candidates.forEach((candidate) => {
620
+ const prevTabIndex = candidate.dataset.tabindex;
621
+ candidate.setAttribute("tabindex", prevTabIndex);
622
+ });
623
+ };
624
+ }
625
+ const ITEM_DATA_ATTR = "data-teddy-top-selector-trigger";
626
+ const ARROW_KEYS = ["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"];
627
+ function makeContentId(args) {
628
+ return `teddy-navigation-menu-${args.baseId}-${args.value}-content`;
629
+ }
630
+ const NavigationMenu = Object.assign(Root$1, {
631
+ List,
632
+ Separator,
633
+ Item,
634
+ Trigger,
635
+ Content,
636
+ Link,
637
+ Indicator,
638
+ Viewport,
639
+ Sub,
640
+ TopMenuList,
641
+ TopMenuItem,
642
+ TopMenuTrigger
643
+ });
644
+ const styles = {
645
+ "teddy-global-navigation": "_teddy-global-navigation_1eacg_1",
646
+ "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1eacg_6",
647
+ "teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1eacg_26",
648
+ "teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1eacg_31",
649
+ "teddy-global-navigation__link": "_teddy-global-navigation__link_1eacg_35",
650
+ "teddy-global-navigation__header": "_teddy-global-navigation__header_1eacg_48",
651
+ "teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1eacg_51",
652
+ "teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1eacg_55",
653
+ "teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1eacg_59",
654
+ "teddy-global-navigation__list": "_teddy-global-navigation__list_1eacg_65",
655
+ "teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1eacg_70",
656
+ "teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1eacg_73",
657
+ "teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1eacg_77",
658
+ "teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1eacg_84",
659
+ "close-viewport": "_close-viewport_1eacg_1",
660
+ "teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1eacg_101",
661
+ "teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1eacg_104"
662
+ };
663
+ function MyPages(props) {
664
+ var _a, _b;
665
+ const rootContext = React__default.useContext(RootContext);
666
+ const isLoggedIn = (((_a = rootContext == null ? void 0 : rootContext.loggedInUser) == null ? void 0 : _a.name.length) || 0) > 0;
667
+ return /* @__PURE__ */ jsxs(Drawer, { ...props, children: [
668
+ /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: ((_b = rootContext == null ? void 0 : rootContext.loggedInUser) == null ? void 0 : _b.name.length) ? /* @__PURE__ */ jsxs("button", { "data-di-mask": true, children: [
669
+ /* @__PURE__ */ jsx(Icon, { name: "end-user", size: "sm" }),
670
+ rootContext.loggedInUser.name
671
+ ] }) : /* @__PURE__ */ jsxs("button", { children: [
672
+ /* @__PURE__ */ jsx(Icon, { name: "login", size: "sm" }),
673
+ "Logg inn"
674
+ ] }) }) }),
675
+ /* @__PURE__ */ jsxs(Drawer.Content, { asChild: true, size: rootContext == null ? void 0 : rootContext.drawerSize, children: [
676
+ /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
677
+ isLoggedIn ? /* @__PURE__ */ jsx(LoggedInContent, {}) : /* @__PURE__ */ jsx(LoggedOutContent, {}),
678
+ /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { variant: "secondary", children: "Lukk" }) }) })
679
+ ] })
680
+ ] });
681
+ }
682
+ function LoggedOutContent() {
683
+ return /* @__PURE__ */ jsxs(Grid, { gap: "400", children: [
684
+ /* @__PURE__ */ jsx(Drawer.Title, { children: "Logg inn" }),
685
+ /* @__PURE__ */ jsxs(TextSpacing, { children: [
686
+ /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", children: "Privat" }),
687
+ /* @__PURE__ */ jsx(Button, { variant: "secondary", asChild: true, children: /* @__PURE__ */ jsxs("a", { href: MY_PAGE_LINKS.link, children: [
688
+ MY_PAGE_LINKS.name,
689
+ " ",
690
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
691
+ ] }) })
692
+ ] }),
693
+ /* @__PURE__ */ jsxs(TextSpacing, { children: [
694
+ /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", children: "Bedrift" }),
695
+ /* @__PURE__ */ jsx(Grid, { gap: "150", children: LOGGED_IN_LINKS_BUSINESS.map((link) => /* @__PURE__ */ jsx(Button, { variant: "secondary", asChild: true, children: /* @__PURE__ */ jsxs("a", { href: link.link, children: [
696
+ link.name,
697
+ " ",
698
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
699
+ ] }) })) })
700
+ ] })
701
+ ] });
702
+ }
703
+ function LoggedInContent() {
704
+ var _a, _b, _c;
705
+ const rootContext = React__default.useContext(RootContext);
706
+ const isRetailerLoggedIn = (_a = rootContext == null ? void 0 : rootContext.loggedInUser) == null ? void 0 : _a.isRetailer;
707
+ if (isRetailerLoggedIn) {
708
+ return /* @__PURE__ */ jsxs(TextSpacing, { children: [
709
+ /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", mb: "100", mt: "400", children: "Min Side" }),
710
+ (_b = MY_PAGE_RETAILER_LINKS.links) == null ? void 0 : _b.map((link) => /* @__PURE__ */ jsx(Button, { variant: "list-item", fullWidth: true, asChild: true, children: /* @__PURE__ */ jsx("a", { href: link.link, children: /* @__PURE__ */ jsx(Icon, { name: link.icon, children: link.name }) }) }, link.link)),
711
+ /* @__PURE__ */ jsx(Button, { mt: "200", onClick: () => rootContext == null ? void 0 : rootContext.onLogoutClick(), variant: "secondary", children: /* @__PURE__ */ jsx(Icon, { name: "logout", children: "Logg ut" }) })
712
+ ] });
713
+ }
714
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
715
+ /* @__PURE__ */ jsx(Drawer.Title, { children: "Mine sider" }),
716
+ /* @__PURE__ */ jsxs(Tabs, { defaultValue: "private", children: [
717
+ /* @__PURE__ */ jsxs(Tabs.List, { children: [
718
+ /* @__PURE__ */ jsx(Tabs.Trigger, { value: "private", children: "Privat" }),
719
+ /* @__PURE__ */ jsx(Tabs.Trigger, { value: "business", children: "Bedrift" })
720
+ ] }),
721
+ /* @__PURE__ */ jsxs(TextSpacing, { children: [
722
+ /* @__PURE__ */ jsxs(Tabs.Content, { value: "private", children: [
723
+ /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", mb: "100", mt: "400", children: "Min Side" }),
724
+ (_c = MY_PAGE_LINKS.links) == null ? void 0 : _c.map((link) => /* @__PURE__ */ jsx(Button, { variant: "list-item", fullWidth: true, asChild: true, children: /* @__PURE__ */ jsx("a", { href: link.link, children: /* @__PURE__ */ jsx(Icon, { name: link.icon, children: link.name }) }) }, link.link))
725
+ ] }),
726
+ /* @__PURE__ */ jsxs(Tabs.Content, { value: "business", children: [
727
+ /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", mb: "100", mt: "400", children: "Bedriftsportaler" }),
728
+ LOGGED_IN_LINKS_BUSINESS.map((link) => /* @__PURE__ */ jsx(Button, { variant: "list-item", fullWidth: true, asChild: true, children: /* @__PURE__ */ jsx("a", { href: link.link, children: /* @__PURE__ */ jsx(Icon, { name: link.icon, children: link.name }) }) }, link.link))
729
+ ] }),
730
+ /* @__PURE__ */ jsx(Button, { mt: "200", onClick: () => rootContext == null ? void 0 : rootContext.onLogoutClick(), variant: "secondary", children: /* @__PURE__ */ jsx(Icon, { name: "logout", children: "Logg ut" }) })
731
+ ] })
732
+ ] })
733
+ ] });
734
+ }
735
+ MyPages.displayName = "MyPages";
736
+ const SearchField = React__default.forwardRef(
737
+ (props, forwardRef) => {
738
+ const ref = React__default.useRef(null);
739
+ const context = React__default.useContext(RootContext);
740
+ const composedRef = useComposedRefs(forwardRef, ref);
741
+ return /* @__PURE__ */ jsx(
742
+ "form",
743
+ {
744
+ onSubmit: (e) => {
745
+ var _a, _b;
746
+ if (context == null ? void 0 : context.onSearchSubmit) {
747
+ context.onSearchSubmit(e, (_a = ref.current) == null ? void 0 : _a.value);
748
+ }
749
+ if (!window || e.isDefaultPrevented()) return;
750
+ e.preventDefault();
751
+ window.location.href = `/sok?q=${encodeURIComponent(((_b = ref.current) == null ? void 0 : _b.value) || "")}`;
752
+ },
753
+ children: /* @__PURE__ */ jsxs(TextField, { ...props, children: [
754
+ /* @__PURE__ */ jsx(TextField.Label, { children: "Søk i innhold" }),
755
+ /* @__PURE__ */ jsxs(TextField.InputGroup, { children: [
756
+ /* @__PURE__ */ jsx(Icon, { name: "search" }),
757
+ /* @__PURE__ */ jsx(
758
+ TextField.Input,
759
+ {
760
+ ref: composedRef,
761
+ value: context == null ? void 0 : context.searchValue,
762
+ onChange: (e) => {
763
+ var _a, _b;
764
+ if (((_a = ref.current) == null ? void 0 : _a.value) && (context == null ? void 0 : context.onSearchInputChange)) {
765
+ context == null ? void 0 : context.onSearchInputChange(e, (_b = ref.current) == null ? void 0 : _b.value);
766
+ }
767
+ },
768
+ onKeyDown: (e) => {
769
+ if (context == null ? void 0 : context.onSearchKeyDown) {
770
+ context.onSearchKeyDown(e);
771
+ }
772
+ },
773
+ placeholder: "Søk her"
774
+ }
775
+ ),
776
+ /* @__PURE__ */ jsx(TextField.ClearButton, { onClick: () => {
777
+ if (context == null ? void 0 : context.onClear) {
778
+ context.onClear();
779
+ }
780
+ } })
781
+ ] }),
782
+ /* @__PURE__ */ jsx(TextField.Button, { variant: "separated", children: "Søk" })
783
+ ] })
784
+ }
785
+ );
786
+ }
787
+ );
788
+ SearchField.displayName = "SearchField";
789
+ function Search(props) {
790
+ const rootContext = React__default.useContext(RootContext);
791
+ const additionalSearchContent = rootContext == null ? void 0 : rootContext.additionalSearchContent;
792
+ const searchFieldRef = React__default.useRef(null);
793
+ return /* @__PURE__ */ jsxs(Drawer, { ...props, children: [
794
+ /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
795
+ /* @__PURE__ */ jsx(Icon, { name: "search", size: "sm" }),
796
+ " Søk"
797
+ ] }) }) }),
798
+ /* @__PURE__ */ jsxs(
799
+ Drawer.Content,
800
+ {
801
+ size: rootContext == null ? void 0 : rootContext.drawerSize,
802
+ onOpenAutoFocus: (e) => {
803
+ var _a;
804
+ e.preventDefault();
805
+ (_a = searchFieldRef.current) == null ? void 0 : _a.focus();
806
+ },
807
+ children: [
808
+ /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
809
+ /* @__PURE__ */ jsx(Drawer.Title, { children: "Hva leter du etter?" }),
810
+ /* @__PURE__ */ jsx(SearchField, { ref: searchFieldRef }),
811
+ additionalSearchContent ? additionalSearchContent : null,
812
+ /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { variant: "secondary", children: "Lukk" }) }) })
813
+ ]
814
+ }
815
+ )
816
+ ] });
817
+ }
818
+ Search.displayName = "Search";
819
+ const ShoppingCart = React__default.forwardRef(() => {
820
+ const rootContext = React__default.useContext(RootContext);
821
+ const shoppingCartContent = rootContext == null ? void 0 : rootContext.shoppingCart;
822
+ const numberOfItemsInCart = (rootContext == null ? void 0 : rootContext.shoppingCartNumberOfItems) || 0;
823
+ const titleSuffix = numberOfItemsInCart > 0 ? `(${numberOfItemsInCart})` : "";
824
+ if (!numberOfItemsInCart) return null;
825
+ return /* @__PURE__ */ jsxs(Drawer, { open: rootContext == null ? void 0 : rootContext.isCartOpen, onOpenChange: rootContext == null ? void 0 : rootContext.onCartOpenChange, children: [
826
+ /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
827
+ /* @__PURE__ */ jsxs("div", { className: clsx([styles[`${rootClassName}__item-wrapper`]]), children: [
828
+ /* @__PURE__ */ jsx(Icon, { name: "cart", size: "sm" }),
829
+ numberOfItemsInCart > 0 && /* @__PURE__ */ jsx("span", { className: clsx([styles[`${rootClassName}__item-count`]]), children: /* @__PURE__ */ jsx(CounterBadge, { variant: "attention", children: numberOfItemsInCart }) })
830
+ ] }),
831
+ "Handlekurv"
832
+ ] }) }) }),
833
+ /* @__PURE__ */ jsxs(Drawer.Content, { size: rootContext == null ? void 0 : rootContext.drawerSize, children: [
834
+ /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
835
+ /* @__PURE__ */ jsxs(Drawer.Title, { children: [
836
+ "Handlekurv ",
837
+ titleSuffix
838
+ ] }),
839
+ shoppingCartContent ? shoppingCartContent : null,
840
+ /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { variant: "secondary", children: "Lukk" }) }) })
841
+ ] })
842
+ ] });
843
+ });
844
+ ShoppingCart.displayName = "ShoppingCart";
845
+ const Desktop = React__default.forwardRef(() => {
846
+ const rootContext = React__default.useContext(RootContext);
847
+ const [showMenu, setShowMenu] = React__default.useState(false);
848
+ const [isClientSide, setIsClientSide] = React__default.useState(false);
849
+ const topMenuRef = React__default.useRef(null);
850
+ const topMenuSize = useSize(topMenuRef.current);
851
+ React__default.useEffect(() => {
852
+ setIsClientSide(true);
853
+ }, []);
854
+ if (!rootContext) return null;
855
+ const links = getLinks(rootContext.pathname.includes("bedrift/utstyrsavtale"), rootContext.customLinks);
856
+ const shouldShowViewport = links.flatMap((link) => link.links || []).some((link) => {
857
+ var _a;
858
+ const sameParent = link.link.split("/")[1] === (rootContext == null ? void 0 : rootContext.pathname.split("/")[1]) || !link.link && (rootContext == null ? void 0 : rootContext.pathname) === "/";
859
+ return (((_a = link.links) == null ? void 0 : _a.length) || 0) > 0 && link.name === (rootContext == null ? void 0 : rootContext.specifiedLink) && sameParent;
860
+ });
861
+ const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
862
+ const { selectedMenuItem, setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
863
+ const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
864
+ const handleInteractions = (linkName) => {
865
+ setSpecifiedLink(linkName || "");
866
+ setSelectedMenuItem(linkName || "", true);
867
+ };
868
+ const viewPortHeight = shouldShowViewport ? "333px" : void 0;
869
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
870
+ /* @__PURE__ */ jsx("div", { className: styles[`${rootClassName}__top-menu-color`], children: /* @__PURE__ */ jsx(
871
+ "div",
872
+ {
873
+ style: mergeStyles({ ["--teddy-top-menu-height"]: topMenuHeight }),
874
+ className: styles[`${rootClassName}__top-menu-wrapper`],
875
+ children: /* @__PURE__ */ jsxs(NavigationMenu.TopMenuList, { ref: topMenuRef, children: [
876
+ links.map((link) => /* @__PURE__ */ jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsx(
877
+ NavigationMenu.TopMenuTrigger,
878
+ {
879
+ value: link.name,
880
+ asChild: true,
881
+ onClick: () => {
882
+ rootContext.setPathname(link.link);
883
+ setSpecifiedLink("");
884
+ },
885
+ children: link.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: link.link, children: link.name }) : /* @__PURE__ */ jsx("a", { href: link.link, children: link.name })
886
+ }
887
+ ) }, link.name)),
888
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { style: { marginLeft: "auto" } }),
889
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(ShoppingCart, {}) }),
890
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(Search, {}) }),
891
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(MyPages, {}) })
892
+ ] })
893
+ }
894
+ ) }),
895
+ links.map((link) => {
896
+ var _a;
897
+ return /* @__PURE__ */ jsx(NavigationMenu.List, { value: link.name, children: (_a = link.links) == null ? void 0 : _a.map(
898
+ (subLink) => /* @__PURE__ */ jsxs(
899
+ NavigationMenu.Item,
900
+ {
901
+ value: subLink.name,
902
+ onMouseEnter: () => setShowMenu(true),
903
+ onMouseLeave: () => setShowMenu(false),
904
+ children: [
905
+ subLink.name === "Logo" ? /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(
906
+ Link2,
907
+ {
908
+ href: subLink.link,
909
+ onMouseEnter: () => handleInteractions(),
910
+ onClick: () => handleInteractions(),
911
+ children: /* @__PURE__ */ jsx(
912
+ "img",
913
+ {
914
+ src: "https://www.telia.no/globalassets/static/svg/telia-primary-default-v2.svg",
915
+ draggable: "false",
916
+ alt: "Telia logo"
917
+ }
918
+ )
919
+ }
920
+ ) : /* @__PURE__ */ jsx(
921
+ "a",
922
+ {
923
+ href: subLink.link,
924
+ onMouseEnter: () => handleInteractions(),
925
+ onClick: () => handleInteractions(),
926
+ children: /* @__PURE__ */ jsx(
927
+ "img",
928
+ {
929
+ src: "https://www.telia.no/globalassets/static/svg/telia-primary-default-v2.svg",
930
+ draggable: "false",
931
+ alt: "Telia logo"
932
+ }
933
+ )
934
+ }
935
+ ) }) : /* @__PURE__ */ jsx(
936
+ NavigationMenu.Link,
937
+ {
938
+ asChild: true,
939
+ active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
940
+ onFocus: () => {
941
+ handleInteractions(subLink.name);
942
+ setShowMenu(true);
943
+ },
944
+ children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(
945
+ Link2,
946
+ {
947
+ onMouseEnter: () => handleInteractions(subLink.name),
948
+ onClick: () => {
949
+ handleInteractions(subLink.name);
950
+ setShowMenu(false);
951
+ },
952
+ href: subLink.link,
953
+ children: subLink.name
954
+ }
955
+ ) : /* @__PURE__ */ jsx(
956
+ "a",
957
+ {
958
+ onMouseEnter: () => handleInteractions(subLink.name),
959
+ onClick: () => {
960
+ handleInteractions(subLink.name);
961
+ setShowMenu(false);
962
+ },
963
+ onFocus: () => {
964
+ setShowMenu(true);
965
+ },
966
+ href: subLink.link,
967
+ children: subLink.name
968
+ }
969
+ )
970
+ }
971
+ ),
972
+ /* @__PURE__ */ jsx(
973
+ "div",
974
+ {
975
+ style: mergeStyles({ ["--teddy-viewport-wrapper-height"]: viewPortHeight }),
976
+ className: styles[`${rootClassName}__viewport-wrapper`],
977
+ "data-state": showMenu ? "open" : "closed",
978
+ children: isClientSide && /* @__PURE__ */ jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxs(Fragment, { children: [
979
+ subLink.links && subLink.links.length > 0 && /* @__PURE__ */ jsx(
980
+ HightlightedLinksDesktop,
981
+ {
982
+ listName: subLink.name,
983
+ setShowMenu,
984
+ links: subLink.links
985
+ }
986
+ ),
987
+ subLink.highlightedLinks && subLink.highlightedLinks.length > 0 && /* @__PURE__ */ jsx(
988
+ HightlightedLinksDesktop,
989
+ {
990
+ colored: true,
991
+ listName: "Nyttige snarveier",
992
+ setShowMenu,
993
+ links: subLink.highlightedLinks
994
+ }
995
+ )
996
+ ] }) })
997
+ }
998
+ )
999
+ ]
1000
+ },
1001
+ subLink.name
1002
+ )
1003
+ ) }, link.name);
1004
+ })
1005
+ ] });
1006
+ });
1007
+ Desktop.displayName = "Desktop";
1008
+ const HightlightedLinksDesktop = ({ links, listName, colored, setShowMenu }) => {
1009
+ const rootContext = React__default.useContext(RootContext);
1010
+ if (!rootContext) return null;
1011
+ const { linkComponent: Link2, setSpecifiedLink, setSelectedMenuItem } = rootContext;
1012
+ const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
1013
+ const firstPart = links.slice(0, 4);
1014
+ const secondPart = links.slice(4);
1015
+ return /* @__PURE__ */ jsxs(Box, { pt: "40px", pb: "40px", className: colored ? styles[`${rootClassName}__colored-box`] : "", children: [
1016
+ /* @__PURE__ */ jsx(Heading, { pl: "100", pb: "100", variant: "title-200", as: "h2", children: listName }),
1017
+ /* @__PURE__ */ jsxs(Flex, { gap: "400", children: [
1018
+ /* @__PURE__ */ jsx(Box, { children: firstPart == null ? void 0 : firstPart.map((subSubLink) => {
1019
+ return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
1020
+ NavigationMenu.Link,
1021
+ {
1022
+ asChild: true,
1023
+ variant: "small",
1024
+ active: getActiveSubLink(currentLocation, links || []) === subSubLink.link,
1025
+ onClick: () => {
1026
+ rootContext.setPathname(subSubLink.link);
1027
+ setSpecifiedLink("");
1028
+ setSelectedMenuItem("", true);
1029
+ setShowMenu(false);
1030
+ },
1031
+ children: subSubLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", align: "center", children: [
1032
+ subSubLink.name,
1033
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1034
+ ] }) }) : /* @__PURE__ */ jsx("a", { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", align: "center", children: [
1035
+ subSubLink.name,
1036
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1037
+ ] }) })
1038
+ }
1039
+ ) }, subSubLink.name);
1040
+ }) }),
1041
+ /* @__PURE__ */ jsx(Box, { children: secondPart.map((subSubLink) => {
1042
+ return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
1043
+ NavigationMenu.Link,
1044
+ {
1045
+ asChild: true,
1046
+ variant: "small",
1047
+ active: getActiveSubLink(currentLocation, links || []) === subSubLink.link,
1048
+ onClick: () => {
1049
+ rootContext.setPathname(subSubLink.link);
1050
+ setSpecifiedLink("");
1051
+ setSelectedMenuItem("", true);
1052
+ setShowMenu(false);
1053
+ },
1054
+ children: subSubLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", align: "center", children: [
1055
+ subSubLink.name,
1056
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1057
+ ] }) }) : /* @__PURE__ */ jsx("a", { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", align: "center", children: [
1058
+ subSubLink.name,
1059
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1060
+ ] }) })
1061
+ }
1062
+ ) }, subSubLink.name);
1063
+ }) })
1064
+ ] })
1065
+ ] });
1066
+ };
1067
+ function Mobile(props) {
1068
+ const [specifiedLink, setSpecifiedLink] = React__default.useState("");
1069
+ const rootContext = React__default.useContext(RootContext);
1070
+ const drawerRef = React__default.useRef(null);
1071
+ if (!rootContext) return null;
1072
+ const links = getLinks(rootContext.pathname.includes("bedrift/utstyrsavtale"), rootContext.customLinks);
1073
+ const { linkComponent: NavLink } = rootContext;
1074
+ const classes = clsx([styles[`${rootClassName}__mobile`]], props.className);
1075
+ const linkClasses = clsx([styles[`${rootClassName}__link`]]);
1076
+ const headerClasses = clsx([styles[`${rootClassName}__header`]]);
1077
+ return /* @__PURE__ */ jsx(Flex, { ...props, className: classes, children: /* @__PURE__ */ jsxs(
1078
+ Flex,
1079
+ {
1080
+ flexGrow: "1",
1081
+ justify: "between",
1082
+ align: "center",
1083
+ gap: "200",
1084
+ className: styles[`${rootClassName}__top-icon-wrapper`],
1085
+ children: [
1086
+ /* @__PURE__ */ jsx(Box, { flexShrink: "0", children: /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: rootContext.appKey === "open-pages" ? /* @__PURE__ */ jsx(NavLink, { href: "/", children: /* @__PURE__ */ jsx(Icon, { size: "lg", name: "telia-logo", "aria-label": "Telia logo" }) }) : /* @__PURE__ */ jsx("a", { href: "/", children: /* @__PURE__ */ jsx(Icon, { size: "lg", name: "telia-logo", "aria-label": "Telia logo" }) }) }) }),
1087
+ /* @__PURE__ */ jsxs(Flex, { flexBasis: "0", gap: { sm: "100", md: "200" }, className: styles[`${rootClassName}__top-menu-icons`], children: [
1088
+ /* @__PURE__ */ jsx(Search, {}),
1089
+ /* @__PURE__ */ jsx(ShoppingCart, {}),
1090
+ /* @__PURE__ */ jsx(MyPages, {}),
1091
+ /* @__PURE__ */ jsxs(Drawer, { children: [
1092
+ /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
1093
+ /* @__PURE__ */ jsx(Icon, { name: "menu", size: "sm" }),
1094
+ " Meny"
1095
+ ] }) }) }),
1096
+ /* @__PURE__ */ jsxs(Drawer.Content, { gap: "400", size: rootContext.drawerSize, children: [
1097
+ /* @__PURE__ */ jsx(Drawer.Close, { ref: drawerRef, slot: "floating", "aria-label": "Lukk" }),
1098
+ !specifiedLink ? /* @__PURE__ */ jsxs(Fragment, { children: [
1099
+ /* @__PURE__ */ jsx(Drawer.Title, { children: "Meny" }),
1100
+ /* @__PURE__ */ jsxs(
1101
+ Tabs,
1102
+ {
1103
+ value: rootContext.selectedDomainItem,
1104
+ onValueChange: (v) => rootContext.setSelectedDomainItem(v, true),
1105
+ children: [
1106
+ /* @__PURE__ */ jsx(Tabs.List, { children: links.map((link) => /* @__PURE__ */ jsx(Tabs.Trigger, { asChild: true, value: link.name, children: link.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(NavLink, { href: link.link, children: link.name }) : /* @__PURE__ */ jsx("a", { href: link.link, children: link.name }) }, link.name)) }),
1107
+ /* @__PURE__ */ jsx(Fragment, { children: links.map((link) => {
1108
+ var _a, _b;
1109
+ return /* @__PURE__ */ jsxs(Tabs.Content, { value: link.name, children: [
1110
+ /* @__PURE__ */ jsx(Box, { mt: "400", children: (_a = link.links) == null ? void 0 : _a.filter((l) => l.name !== "Logo").map(
1111
+ (subLink) => subLink.links && subLink.links.length > 0 ? /* @__PURE__ */ jsxs(Box, { onClick: () => setSpecifiedLink(subLink.name), className: linkClasses, children: [
1112
+ /* @__PURE__ */ jsx(Heading, { asChild: true, variant: "title-300", children: /* @__PURE__ */ jsx(Button, { className: styles[`${rootClassName}__sublink-button--mobile`], children: subLink.name }) }),
1113
+ /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "md" })
1114
+ ] }) : /* @__PURE__ */ jsx(Fragment, { children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxs(NavLink, { href: subLink.link, className: linkClasses, children: [
1115
+ /* @__PURE__ */ jsx(Heading, { variant: "title-300", as: "h2", className: headerClasses, children: subLink.name }),
1116
+ /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "md" })
1117
+ ] }) : /* @__PURE__ */ jsxs("a", { href: subLink.link, className: linkClasses, children: [
1118
+ /* @__PURE__ */ jsx(Heading, { variant: "title-300", as: "h2", children: subLink.name }),
1119
+ /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: "md" })
1120
+ ] }) })
1121
+ ) }),
1122
+ link.highlightedLinks && ((_b = link.highlightedLinks) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsx(Box, { className: styles[`${rootClassName}__colored-box--mobile`], children: /* @__PURE__ */ jsx(Box, { mt: "400", pt: "250", pb: "250", pl: "300", children: /* @__PURE__ */ jsx(
1123
+ HighlightedLinks,
1124
+ {
1125
+ item: link,
1126
+ links: link.highlightedLinks,
1127
+ drawerRef,
1128
+ listTitle: "Nyttige snarveier"
1129
+ }
1130
+ ) }) })
1131
+ ] }, link.name);
1132
+ }) })
1133
+ ]
1134
+ }
1135
+ )
1136
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1137
+ /* @__PURE__ */ jsx(Drawer.Title, { children: /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "secondary", onClick: () => setSpecifiedLink(""), children: [
1138
+ /* @__PURE__ */ jsx(Icon, { name: "arrow-left" }),
1139
+ "Tilbake"
1140
+ ] }) }),
1141
+ /* @__PURE__ */ jsx(Box, { mt: "100", children: links.filter((item) => item.name === rootContext.selectedDomainItem).map(
1142
+ (link) => {
1143
+ var _a;
1144
+ return (_a = link.links) == null ? void 0 : _a.filter((l) => l.name !== "Logo").map(
1145
+ (subLink) => subLink.links && subLink.links.length > 0 && subLink.name === specifiedLink && /* @__PURE__ */ jsxs(Fragment, { children: [
1146
+ /* @__PURE__ */ jsx(
1147
+ HighlightedLinks,
1148
+ {
1149
+ item: subLink,
1150
+ listTitle: subLink.name,
1151
+ links: subLink.links,
1152
+ drawerRef
1153
+ }
1154
+ ),
1155
+ subLink.highlightedLinks && subLink.highlightedLinks.length > 0 && /* @__PURE__ */ jsx(Box, { className: styles[`${rootClassName}__colored-box--mobile`], children: /* @__PURE__ */ jsx(Box, { mt: "400", pt: "250", pb: "250", pl: "300", children: /* @__PURE__ */ jsx(
1156
+ HighlightedLinks,
1157
+ {
1158
+ item: subLink,
1159
+ listTitle: "Nyttige snarveier",
1160
+ links: subLink.highlightedLinks,
1161
+ drawerRef
1162
+ }
1163
+ ) }) })
1164
+ ] })
1165
+ );
1166
+ }
1167
+ ) })
1168
+ ] })
1169
+ ] })
1170
+ ] })
1171
+ ] })
1172
+ ]
1173
+ }
1174
+ ) });
1175
+ }
1176
+ Mobile.displayName = "Mobile";
1177
+ const HighlightedLinks = ({
1178
+ listTitle,
1179
+ links,
1180
+ item,
1181
+ drawerRef
1182
+ }) => {
1183
+ const rootContext = React__default.useContext(RootContext);
1184
+ if (!rootContext) return null;
1185
+ const { linkComponent: NavLink } = rootContext;
1186
+ const currentLocation = rootContext.pathname;
1187
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1188
+ /* @__PURE__ */ jsx(Heading, { pl: "100", pb: "100", variant: "title-200", as: "h2", children: listTitle }),
1189
+ /* @__PURE__ */ jsx(List$1, { gap: "10", pl: "25", children: links == null ? void 0 : links.map((subSubLink) => /* @__PURE__ */ jsx(List$1.Item, { children: /* @__PURE__ */ jsx(
1190
+ NavigationMenu.Link,
1191
+ {
1192
+ asChild: true,
1193
+ variant: "small",
1194
+ active: getActiveSubLink(currentLocation, item.links || []) === subSubLink.link,
1195
+ onClick: () => {
1196
+ var _a;
1197
+ (_a = drawerRef == null ? void 0 : drawerRef.current) == null ? void 0 : _a.click();
1198
+ rootContext.setPathname(subSubLink.link);
1199
+ },
1200
+ children: subSubLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(NavLink, { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "icon" in subSubLink ? "25" : "100", align: "center", children: [
1201
+ subSubLink.name,
1202
+ subSubLink.icon ? /* @__PURE__ */ jsx(Icon, { name: subSubLink.icon }) : /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1203
+ ] }) }) : /* @__PURE__ */ jsx("a", { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "icon" in subSubLink ? "25" : "100", align: "center", children: [
1204
+ subSubLink.name,
1205
+ subSubLink.icon ? /* @__PURE__ */ jsx(Icon, { name: subSubLink.icon }) : /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
1206
+ ] }) })
1207
+ }
1208
+ ) }, subSubLink.name)) })
1209
+ ] });
1210
+ };
1211
+ const DesktopSimplified = React__default.forwardRef(() => {
1212
+ var _a;
1213
+ const rootContext = React__default.useContext(RootContext);
1214
+ const isRetailerLoggedIn = (_a = rootContext == null ? void 0 : rootContext.loggedInUser) == null ? void 0 : _a.isRetailer;
1215
+ if (!rootContext) return null;
1216
+ const { setSelectedMenuItem, linkComponent: Link2 } = rootContext;
1217
+ const isBusinessRental = rootContext.pathname.includes("bedrift/utstyrsavtale");
1218
+ const links = getLinks(isBusinessRental, rootContext.customLinks);
1219
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1220
+ links.map((link) => {
1221
+ var _a2;
1222
+ return /* @__PURE__ */ jsxs(NavigationMenu.List, { value: link.name, children: [
1223
+ (_a2 = link.links) == null ? void 0 : _a2.map((subLink) => /* @__PURE__ */ jsxs(NavigationMenu.Item, { value: subLink.name, children: [
1224
+ subLink.name === "Logo" && /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subLink.link, onClick: () => setSelectedMenuItem(""), children: /* @__PURE__ */ jsx(
1225
+ "img",
1226
+ {
1227
+ src: "https://www.telia.no/globalassets/static/svg/telia-primary-default-v2.svg",
1228
+ draggable: "false",
1229
+ alt: "Telia logo"
1230
+ }
1231
+ ) }) : /* @__PURE__ */ jsx("a", { href: subLink.link, onClick: () => setSelectedMenuItem(""), children: /* @__PURE__ */ jsx(
1232
+ "img",
1233
+ {
1234
+ src: "https://www.telia.no/globalassets/static/svg/telia-primary-default-v2.svg",
1235
+ draggable: "false",
1236
+ alt: "Telia logo"
1237
+ }
1238
+ ) }) }),
1239
+ subLink.name === "Hjem" && isBusinessRental && /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, children: /* @__PURE__ */ jsx("a", { href: subLink.link, children: subLink.name }) })
1240
+ ] }, subLink.name)),
1241
+ /* @__PURE__ */ jsx(Box, { ml: "auto" }),
1242
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(ShoppingCart, {}) }),
1243
+ isRetailerLoggedIn && /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(MyPages, {}) })
1244
+ ] }, link.name);
1245
+ }),
1246
+ /* @__PURE__ */ jsx(NavigationMenu.Viewport, { className: styles[`${rootClassName}__viewport`] })
1247
+ ] });
1248
+ });
1249
+ DesktopSimplified.displayName = "DesktopSimplified";
1250
+ function MobileSimplified(props) {
1251
+ const rootContext = React__default.useContext(RootContext);
1252
+ if (!rootContext) return null;
1253
+ const { linkComponent: NavLink } = rootContext;
1254
+ const classes = clsx([styles[`${rootClassName}__mobile`]], props.className);
1255
+ return /* @__PURE__ */ jsx(Flex, { ...props, className: classes, children: /* @__PURE__ */ jsxs(Flex, { flexGrow: "1", justify: "between", align: "center", gap: "200", children: [
1256
+ /* @__PURE__ */ jsx(Box, { flexShrink: "0", children: /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: rootContext.appKey === "open-pages" ? /* @__PURE__ */ jsx(NavLink, { href: "/", children: /* @__PURE__ */ jsx(Icon, { size: "lg", name: "telia-logo", "aria-label": "Telia logo" }) }) : /* @__PURE__ */ jsx("a", { href: "/", children: /* @__PURE__ */ jsx(Icon, { size: "lg", name: "telia-logo", "aria-label": "Telia logo" }) }) }) }),
1257
+ /* @__PURE__ */ jsx(Flex, { flexBasis: "0", gap: { sm: "100", md: "200" }, children: /* @__PURE__ */ jsx(ShoppingCart, {}) })
1258
+ ] }) });
1259
+ }
1260
+ MobileSimplified.displayName = "MobileSimplified";
1261
+ const rootClassName = "teddy-global-navigation";
1262
+ const RootContext = React__default.createContext(null);
1263
+ function Root({
1264
+ className,
1265
+ appKey,
1266
+ loggedInUser,
1267
+ linkComponent,
1268
+ onLogoutClick,
1269
+ shoppingCart,
1270
+ shoppingCartNumberOfItems,
1271
+ onSearchSubmit,
1272
+ additionalSearchContent,
1273
+ isCartOpen,
1274
+ onCartOpenChange,
1275
+ drawerSize = "md",
1276
+ isSimplified,
1277
+ customLinks,
1278
+ currentPath,
1279
+ onSearchInputChange,
1280
+ onSearchKeyDown,
1281
+ searchValue,
1282
+ onClear,
1283
+ ...props
1284
+ }) {
1285
+ const [selectedMenuItem, setSelectedMenuItem] = React__default.useState(getInitialMenuItem(currentPath, customLinks));
1286
+ const [selectedDomainItem, setSelectedDomainItem] = React__default.useState(getInitialDomain(currentPath, customLinks));
1287
+ const [pathname, setPathname] = React__default.useState(currentPath || "");
1288
+ const [specifiedLink, setSpecifiedLink] = React__default.useState(getInitialMenuItem(currentPath, customLinks));
1289
+ const classes = clsx([styles[`${rootClassName}`]], className);
1290
+ useEffect(() => {
1291
+ setPathname(currentPath || "");
1292
+ }, [currentPath]);
1293
+ return /* @__PURE__ */ jsx(
1294
+ RootContext.Provider,
1295
+ {
1296
+ value: {
1297
+ appKey,
1298
+ loggedInUser,
1299
+ selectedMenuItem,
1300
+ setSelectedMenuItem(v, onlyStateChange) {
1301
+ if (appKey === "open-pages" && !onlyStateChange) return;
1302
+ setSelectedMenuItem(v);
1303
+ },
1304
+ linkComponent,
1305
+ selectedDomainItem,
1306
+ setSelectedDomainItem(v, onlyStateChange) {
1307
+ if (appKey === "open-pages" && !onlyStateChange) return;
1308
+ setSelectedDomainItem(v);
1309
+ },
1310
+ pathname,
1311
+ setPathname(v) {
1312
+ if (appKey === "open-pages") return;
1313
+ setPathname(v);
1314
+ },
1315
+ onLogoutClick,
1316
+ shoppingCart,
1317
+ shoppingCartNumberOfItems,
1318
+ onSearchSubmit,
1319
+ additionalSearchContent,
1320
+ isCartOpen,
1321
+ onCartOpenChange,
1322
+ drawerSize,
1323
+ specifiedLink,
1324
+ setSpecifiedLink,
1325
+ onSearchInputChange,
1326
+ onSearchKeyDown,
1327
+ searchValue,
1328
+ onClear,
1329
+ customLinks
1330
+ },
1331
+ children: /* @__PURE__ */ jsx(Box, { ...props, className: classes, children: /* @__PURE__ */ jsxs(
1332
+ NavigationMenu,
1333
+ {
1334
+ topMenuValue: selectedDomainItem,
1335
+ onTopMenuValueChange: setSelectedDomainItem,
1336
+ value: selectedMenuItem,
1337
+ onValueChange: (v) => {
1338
+ if (v === "" || appKey === "open-pages") return;
1339
+ setSelectedMenuItem(v);
1340
+ },
1341
+ children: [
1342
+ /* @__PURE__ */ jsxs(Box, { display: { sm: "none", lg: "block" }, children: [
1343
+ isSimplified && /* @__PURE__ */ jsx(DesktopSimplified, {}),
1344
+ !isSimplified && /* @__PURE__ */ jsx(Desktop, {})
1345
+ ] }),
1346
+ /* @__PURE__ */ jsxs(Box, { display: { lg: "none" }, children: [
1347
+ isSimplified && /* @__PURE__ */ jsx(MobileSimplified, {}),
1348
+ !isSimplified && /* @__PURE__ */ jsx(Mobile, {})
1349
+ ] })
1350
+ ]
1351
+ }
1352
+ ) })
1353
+ }
1354
+ );
1355
+ }
1356
+ Root.displayName = "Root";
1357
+ function getInitialDomain(currentPath, customLinks) {
1358
+ const privateLinks = (customLinks == null ? void 0 : customLinks.privateLinks) || DEFAULT_PRIVATE_LINKS;
1359
+ const businessLinks = (customLinks == null ? void 0 : customLinks.businessLinks) || DEFAULT_BUSINESS_LINKS;
1360
+ const mduLinks = (customLinks == null ? void 0 : customLinks.mduLinks) || DEFAULT_MDU_LINKS;
1361
+ if (!currentPath) return privateLinks.name;
1362
+ const locationArray = currentPath ? currentPath.split("/") : [];
1363
+ const domainPartOfLocation = `/${locationArray[1].toLowerCase()}/`;
1364
+ const initDomain = domainPartOfLocation === businessLinks.link ? businessLinks.name : domainPartOfLocation === mduLinks.link ? mduLinks.name : privateLinks.name;
1365
+ return initDomain;
1366
+ }
1367
+ function getInitialMenuItem(currentPath, customLinks) {
1368
+ var _a, _b, _c, _d, _e, _f;
1369
+ const privateLinks = (customLinks == null ? void 0 : customLinks.privateLinks) || DEFAULT_PRIVATE_LINKS;
1370
+ const businessLinks = (customLinks == null ? void 0 : customLinks.businessLinks) || DEFAULT_BUSINESS_LINKS;
1371
+ const mduLinks = (customLinks == null ? void 0 : customLinks.mduLinks) || DEFAULT_MDU_LINKS;
1372
+ if (!currentPath) return;
1373
+ const locationArray = currentPath ? currentPath.split("/") : [];
1374
+ const initialDomain = getInitialDomain(currentPath, customLinks);
1375
+ if (initialDomain === businessLinks.name) {
1376
+ const mainMenuPartOfLocation2 = locationArray[2];
1377
+ return (_b = (_a = businessLinks.links) == null ? void 0 : _a.find(
1378
+ (link) => {
1379
+ var _a2;
1380
+ return link.link === `/${initialDomain.toLowerCase()}/${mainMenuPartOfLocation2}/` || ((_a2 = link.links) == null ? void 0 : _a2.some((link2) => link2.link === `/${initialDomain.toLowerCase()}/${mainMenuPartOfLocation2}/`));
1381
+ }
1382
+ )) == null ? void 0 : _b.name;
1383
+ }
1384
+ if (initialDomain === mduLinks.name) {
1385
+ const mainMenuPartOfLocation2 = locationArray[2];
1386
+ return (_d = (_c = mduLinks.links) == null ? void 0 : _c.find((link) => link.link === `/${initialDomain.toLowerCase()}/${mainMenuPartOfLocation2}/`)) == null ? void 0 : _d.name;
1387
+ }
1388
+ const mainMenuPartOfLocation = locationArray[1];
1389
+ return (_f = (_e = privateLinks.links) == null ? void 0 : _e.find((link) => {
1390
+ var _a2;
1391
+ return link.name.toLowerCase() === mainMenuPartOfLocation || ((_a2 = link.links) == null ? void 0 : _a2.some((link2) => link2.link === `/${mainMenuPartOfLocation}/`));
1392
+ })) == null ? void 0 : _f.name;
1393
+ }
1394
+ Root.displayName = "GlobalNavigation";
1395
+ const GlobalNavigation = Root;
1396
+ export {
1397
+ CheckboxCardGroup as C,
1398
+ CheckboxCardGroup,
1399
+ Close,
1400
+ Content$2 as Content,
1401
+ Desktop as D,
1402
+ Desktop,
1403
+ DesktopSimplified,
1404
+ GlobalNavigation as G,
1405
+ GlobalNavigation,
1406
+ HighlightedLinks as H,
1407
+ HighlightedLinks,
1408
+ ItemContext$1 as I,
1409
+ Indicator$1 as Indicator,
1410
+ Item$2 as Item,
1411
+ ItemContext$1 as ItemContext,
1412
+ Modal as M,
1413
+ Mobile,
1414
+ MobileSimplified,
1415
+ Modal,
1416
+ MyPages,
1417
+ NavigationMenu as N,
1418
+ NavigationMenu,
1419
+ RadioCardGroup as R,
1420
+ RadioCardGroup,
1421
+ Separator as S,
1422
+ Search,
1423
+ SearchField,
1424
+ Separator,
1425
+ ShoppingCart,
1426
+ Title$1 as T,
1427
+ Title$1 as Title,
1428
+ Content$2 as a,
1429
+ Item$2 as b,
1430
+ Title as c,
1431
+ Content$1 as d,
1432
+ ItemContext as e,
1433
+ Item$1 as f,
1434
+ Close as g,
1435
+ MyPages as h,
1436
+ SearchField as i,
1437
+ Search as j,
1438
+ ShoppingCart as k,
1439
+ Mobile as l,
1440
+ DesktopSimplified as m,
1441
+ MobileSimplified as n,
1442
+ rootClassName as o,
1443
+ RootContext as p,
1444
+ Root as q,
1445
+ rootClassName$1 as r,
1446
+ rootClassName$1 as rootClassName
1447
+ };