@telia/teddy 0.1.34 → 0.1.36

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 (5) hide show
  1. package/dist/components/navigation-menu/global-navigation/global-navigation-root.d.ts +0 -2
  2. package/dist/components/radio-card-group/radio-card-group-item-title.cjs +91 -110
  3. package/dist/components/radio-card-group/radio-card-group-item-title.js +91 -110
  4. package/dist/style.css +28 -28
  5. package/package.json +1 -1
package/dist/components/navigation-menu/global-navigation/global-navigation-root.d.ts CHANGED
@@ -29,8 +29,6 @@ type RootContext = {
29
29
  setPathname: (v: string) => void;
30
30
  specifiedLink?: string;
31
31
  setSpecifiedLink: (v: string) => void;
32
- showMenu?: boolean | null;
33
- setShowMenu: (v: boolean) => void;
34
32
  } & Pick<RootProps, 'onSearchSubmit' | 'additionalSearchContent' | 'shoppingCart' | 'shoppingCartNumberOfItems' | 'loggedInUser' | 'appKey' | 'onLogoutClick' | 'linkComponent' | 'isCartOpen' | 'onCartOpenChange' | 'drawerSize'>;
35
33
  export declare const RootContext: React.Context<RootContext | null>;
36
34
  export declare function Root({ className, appKey, loggedInUser, linkComponent, onLogoutClick, shoppingCart, shoppingCartNumberOfItems, onSearchSubmit, additionalSearchContent, isCartOpen, onCartOpenChange, drawerSize, isSimplified, currentPath, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
package/dist/components/radio-card-group/radio-card-group-item-title.cjs CHANGED
@@ -410,10 +410,7 @@ const TopMenuTrigger = React.forwardRef(
410
410
  const context = React.useContext(NavigationMenuContext);
411
411
  const innerRef = React.useRef(null);
412
412
  const ref = utils_composeRefs.useComposedRefs(innerRef, forwardRef);
413
- let isOpen = context.selectedTopMenu === props.value && props.value !== null && props.value !== "" && typeof props.value !== "undefined";
414
- if (typeof window === "undefined") {
415
- isOpen = false;
416
- }
413
+ const isOpen = context.selectedTopMenu === props.value;
417
414
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
418
415
  /* @__PURE__ */ jsxRuntime.jsx(
419
416
  Comp,
@@ -542,9 +539,6 @@ const Trigger = React.forwardRef(
542
539
  );
543
540
  const innerRef = React.useRef(null);
544
541
  const ref = utils_composeRefs.useComposedRefs(forwardRef, innerRef);
545
- if (typeof window === "undefined") {
546
- active = false;
547
- }
548
542
  return /* @__PURE__ */ jsxRuntime.jsx(
549
543
  NavigationMenuPrimitive__namespace.Trigger,
550
544
  {
@@ -687,23 +681,23 @@ const NavigationMenu = Object.assign(Root$1, {
687
681
  TopMenuTrigger
688
682
  });
689
683
  const styles = {
690
- "teddy-global-navigation": "_teddy-global-navigation_1587l_1",
691
- "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1587l_6",
692
- "teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1587l_26",
693
- "teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1587l_31",
694
- "teddy-global-navigation__link": "_teddy-global-navigation__link_1587l_35",
695
- "teddy-global-navigation__header": "_teddy-global-navigation__header_1587l_48",
696
- "teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1587l_51",
697
- "teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1587l_54",
698
- "teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1587l_58",
699
- "teddy-global-navigation__list": "_teddy-global-navigation__list_1587l_64",
700
- "teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1587l_69",
701
- "teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1587l_72",
702
- "teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1587l_76",
703
- "teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1587l_83",
704
- "close-viewport": "_close-viewport_1587l_1",
705
- "teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1587l_99",
706
- "teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1587l_102"
684
+ "teddy-global-navigation": "_teddy-global-navigation_16lml_1",
685
+ "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_16lml_6",
686
+ "teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_16lml_26",
687
+ "teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_16lml_31",
688
+ "teddy-global-navigation__link": "_teddy-global-navigation__link_16lml_35",
689
+ "teddy-global-navigation__header": "_teddy-global-navigation__header_16lml_48",
690
+ "teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_16lml_51",
691
+ "teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_16lml_54",
692
+ "teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_16lml_58",
693
+ "teddy-global-navigation__list": "_teddy-global-navigation__list_16lml_64",
694
+ "teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_16lml_69",
695
+ "teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_16lml_72",
696
+ "teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_16lml_76",
697
+ "teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_16lml_83",
698
+ "close-viewport": "_close-viewport_16lml_1",
699
+ "teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_16lml_99",
700
+ "teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_16lml_102"
707
701
  };
708
702
  function MyPages(props) {
709
703
  var _a, _b;
@@ -862,11 +856,8 @@ const ShoppingCart = React.forwardRef(() => {
862
856
  ShoppingCart.displayName = "ShoppingCart";
863
857
  const Desktop = React.forwardRef(() => {
864
858
  const rootContext = React.useContext(RootContext);
865
- const lastScrollDirection = React.useRef();
866
- const scrollStartPos = React.useRef(0);
867
- const lastScrollPos = React.useRef(0);
859
+ const [showMenu, setShowMenu] = React.useState(false);
868
860
  const topMenuRef = React.useRef(null);
869
- const viewPortRef = React.useRef(null);
870
861
  const shouldShowViewport = [...components_navigationMenu_globalNavigation_utils.PRIVATE_LINKS.links, ...components_navigationMenu_globalNavigation_utils.BUSINESS_LINKS.links, ...components_navigationMenu_globalNavigation_utils.MDU_LINKS.links].some(
871
862
  (link) => {
872
863
  const sameParent = link.link.split("/")[1] === (rootContext == null ? void 0 : rootContext.pathname.split("/")[1]) || !link.link && (rootContext == null ? void 0 : rootContext.pathname) === "/";
@@ -877,12 +868,7 @@ const Desktop = React.forwardRef(() => {
877
868
  const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
878
869
  if (!rootContext)
879
870
  return null;
880
- function resetAndShowMenu() {
881
- lastScrollDirection.current = null;
882
- scrollStartPos.current = window.scrollY;
883
- lastScrollPos.current = window.scrollY;
884
- }
885
- const { showMenu, selectedMenuItem, setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
871
+ const { selectedMenuItem, setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
886
872
  const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
887
873
  const handleInteractions = (linkName) => {
888
874
  setSpecifiedLink(linkName || "");
@@ -897,7 +883,7 @@ const Desktop = React.forwardRef(() => {
897
883
  { ["--teddy-top-menu-height"]: topMenuHeight }
898
884
  ),
899
885
  className: styles[`${rootClassName}__top-menu-wrapper`],
900
- children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuList, { onFocus: resetAndShowMenu, ref: topMenuRef, children: components_navigationMenu_globalNavigation_utils.LINKS.map((link) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
886
+ children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuList, { ref: topMenuRef, children: components_navigationMenu_globalNavigation_utils.LINKS.map((link) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
901
887
  NavigationMenu.TopMenuTrigger,
902
888
  {
903
889
  value: link.name,
@@ -913,88 +899,88 @@ const Desktop = React.forwardRef(() => {
913
899
  ) }),
914
900
  components_navigationMenu_globalNavigation_utils.LINKS.map((link) => {
915
901
  var _a;
916
- return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu.List, { onFocus: resetAndShowMenu, value: link.name, children: [
917
- (_a = link.links) == null ? void 0 : _a.map(
918
- (subLink) => {
919
- var _a2, _b, _c;
920
- return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu.Item, { value: subLink.name, children: [
921
- subLink.name === "Logo" ? /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { href: subLink.link, onMouseEnter: () => handleInteractions(), onClick: () => handleInteractions(), children: /* @__PURE__ */ jsxRuntime.jsx(
922
- "img",
923
- {
924
- src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
925
- draggable: "false",
926
- alt: "Telia logo"
927
- }
928
- ) }) : /* @__PURE__ */ jsxRuntime.jsx(
929
- "a",
930
- {
931
- href: subLink.link,
932
- onMouseEnter: () => handleInteractions(),
933
- onClick: () => handleInteractions(),
934
- children: /* @__PURE__ */ jsxRuntime.jsx(
902
+ return /* @__PURE__ */ jsxRuntime.jsxs(
903
+ NavigationMenu.List,
904
+ {
905
+ onMouseEnter: () => setShowMenu(true),
906
+ onMouseLeave: () => setShowMenu(false),
907
+ value: link.name,
908
+ children: [
909
+ (_a = link.links) == null ? void 0 : _a.map(
910
+ (subLink) => {
911
+ var _a2, _b, _c;
912
+ return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu.Item, { value: subLink.name, children: [
913
+ subLink.name === "Logo" ? /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { href: subLink.link, onMouseEnter: () => handleInteractions(), onClick: () => handleInteractions(), children: /* @__PURE__ */ jsxRuntime.jsx(
935
914
  "img",
936
915
  {
937
916
  src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
938
917
  draggable: "false",
939
918
  alt: "Telia logo"
940
919
  }
920
+ ) }) : /* @__PURE__ */ jsxRuntime.jsx(
921
+ "a",
922
+ {
923
+ href: subLink.link,
924
+ onMouseEnter: () => handleInteractions(),
925
+ onClick: () => handleInteractions(),
926
+ children: /* @__PURE__ */ jsxRuntime.jsx(
927
+ "img",
928
+ {
929
+ src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
930
+ draggable: "false",
931
+ alt: "Telia logo"
932
+ }
933
+ )
934
+ }
935
+ ) }) : ((_a2 = subLink.links) == null ? void 0 : _a2.length) ? /* @__PURE__ */ jsxRuntime.jsx(
936
+ NavigationMenu.Trigger,
937
+ {
938
+ asChild: true,
939
+ active: currentLocation === subLink.link,
940
+ children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), children: subLink.name })
941
+ }
942
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
943
+ NavigationMenu.Link,
944
+ {
945
+ asChild: true,
946
+ active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
947
+ children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsxRuntime.jsx("a", { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name })
948
+ }
949
+ ),
950
+ typeof window !== "undefined" && /* @__PURE__ */ jsxRuntime.jsx(
951
+ "div",
952
+ {
953
+ style: utils_generateStyling_index.mergeStyles(
954
+ { ["--teddy-viewport-wrapper-height"]: viewPortHeight }
955
+ ),
956
+ className: styles[`${rootClassName}__viewport-wrapper`],
957
+ "data-state": showMenu ? "open" : "closed",
958
+ children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
959
+ ((_b = subLink.links) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "150", pb: "250", children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: subLink.name, setShowMenu, links: subLink.links }) }),
960
+ ((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "250", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", setShowMenu, links: subLink.highlightedLinks }) })
961
+ ] }) })
962
+ }
941
963
  )
942
- }
943
- ) }) : ((_a2 = subLink.links) == null ? void 0 : _a2.length) ? /* @__PURE__ */ jsxRuntime.jsx(
944
- NavigationMenu.Trigger,
945
- {
946
- asChild: true,
947
- active: currentLocation === subLink.link,
948
- children: /* @__PURE__ */ jsxRuntime.jsx(components_button_button.Button, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), children: subLink.name })
949
- }
950
- ) : /* @__PURE__ */ jsxRuntime.jsx(
951
- NavigationMenu.Link,
952
- {
953
- asChild: true,
954
- active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
955
- children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsxRuntime.jsx(Link2, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsxRuntime.jsx("a", { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name })
956
- }
957
- ),
958
- /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && typeof window !== "undefined" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
959
- ((_b = subLink.links) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "150", children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: subLink.name, links: subLink.links }) }),
960
- ((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "250", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsxRuntime.jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", links: subLink.highlightedLinks }) })
961
- ] }) })
962
- ] }, subLink.name);
963
- }
964
- ),
965
- /* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { ml: "auto" }),
966
- /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(ShoppingCart, {}) }),
967
- /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Search, {}) }),
968
- /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(MyPages, {}) })
969
- ] }, link.name);
970
- }),
971
- /* @__PURE__ */ jsxRuntime.jsx(
972
- "div",
973
- {
974
- style: utils_generateStyling_index.mergeStyles(
975
- { ["--teddy-viewport-wrapper-height"]: viewPortHeight }
976
- ),
977
- className: styles[`${rootClassName}__viewport-wrapper`],
978
- "data-state": showMenu ? "open" : "closed",
979
- children: /* @__PURE__ */ jsxRuntime.jsx(
980
- NavigationMenu.Viewport,
981
- {
982
- onFocus: resetAndShowMenu,
983
- ref: viewPortRef,
984
- ...typeof window === "undefined" ? { "data-state": "closed" } : {},
985
- className: styles[`${rootClassName}__viewport`]
986
- }
987
- )
988
- }
989
- )
964
+ ] }, subLink.name);
965
+ }
966
+ ),
967
+ /* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { ml: "auto" }),
968
+ /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(ShoppingCart, {}) }),
969
+ /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Search, {}) }),
970
+ /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(MyPages, {}) })
971
+ ]
972
+ },
973
+ link.name
974
+ );
975
+ })
990
976
  ] });
991
977
  });
992
978
  Desktop.displayName = "Desktop";
993
- const HightlightedLinksDesktop = ({ links, listName }) => {
979
+ const HightlightedLinksDesktop = ({ links, listName, setShowMenu }) => {
994
980
  const rootContext = React.useContext(RootContext);
995
981
  if (!rootContext)
996
982
  return null;
997
- const { linkComponent: Link2, setSpecifiedLink, setSelectedMenuItem, setShowMenu } = rootContext;
983
+ const { linkComponent: Link2, setSpecifiedLink, setSelectedMenuItem } = rootContext;
998
984
  const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
999
985
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1000
986
  /* @__PURE__ */ jsxRuntime.jsx(components_heading_heading.Heading, { pl: "100", pb: "100", variant: "title-200", as: "h2", children: listName }),
@@ -1205,7 +1191,6 @@ function Root({
1205
1191
  const [selectedDomainItem, setSelectedDomainItem] = React.useState(getInitialDomain(currentPath));
1206
1192
  const [pathname, setPathname] = React.useState(currentPath || "");
1207
1193
  const [specifiedLink, setSpecifiedLink] = React.useState(getInitialMenuItem(currentPath));
1208
- const [showMenu, setShowMenu] = React.useState(false);
1209
1194
  const classes = clsx([styles[`${rootClassName}`]], className);
1210
1195
  React.useEffect(() => {
1211
1196
  setPathname(currentPath || "");
@@ -1244,9 +1229,7 @@ function Root({
1244
1229
  onCartOpenChange,
1245
1230
  drawerSize,
1246
1231
  specifiedLink,
1247
- setSpecifiedLink,
1248
- showMenu,
1249
- setShowMenu
1232
+ setSpecifiedLink
1250
1233
  },
1251
1234
  children: /* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { ...props, className: classes, children: /* @__PURE__ */ jsxRuntime.jsxs(
1252
1235
  NavigationMenu,
@@ -1259,8 +1242,6 @@ function Root({
1259
1242
  return;
1260
1243
  setSelectedMenuItem(v);
1261
1244
  },
1262
- onMouseEnter: () => setShowMenu(true),
1263
- onMouseLeave: () => setShowMenu(false),
1264
1245
  children: [
1265
1246
  /* @__PURE__ */ jsxRuntime.jsxs(components_box_box.Box, { display: { sm: "none", lg: "block" }, children: [
1266
1247
  isSimplified && /* @__PURE__ */ jsxRuntime.jsx(DesktopSimplified, {}),
package/dist/components/radio-card-group/radio-card-group-item-title.js CHANGED
@@ -389,10 +389,7 @@ const TopMenuTrigger = React__default.forwardRef(
389
389
  const context = React__default.useContext(NavigationMenuContext);
390
390
  const innerRef = React__default.useRef(null);
391
391
  const ref = useComposedRefs(innerRef, forwardRef);
392
- let isOpen = context.selectedTopMenu === props.value && props.value !== null && props.value !== "" && typeof props.value !== "undefined";
393
- if (typeof window === "undefined") {
394
- isOpen = false;
395
- }
392
+ const isOpen = context.selectedTopMenu === props.value;
396
393
  return /* @__PURE__ */ jsxs(Fragment, { children: [
397
394
  /* @__PURE__ */ jsx(
398
395
  Comp,
@@ -521,9 +518,6 @@ const Trigger = React__default.forwardRef(
521
518
  );
522
519
  const innerRef = React__default.useRef(null);
523
520
  const ref = useComposedRefs(forwardRef, innerRef);
524
- if (typeof window === "undefined") {
525
- active = false;
526
- }
527
521
  return /* @__PURE__ */ jsx(
528
522
  NavigationMenuPrimitive.Trigger,
529
523
  {
@@ -666,23 +660,23 @@ const NavigationMenu = Object.assign(Root$1, {
666
660
  TopMenuTrigger
667
661
  });
668
662
  const styles = {
669
- "teddy-global-navigation": "_teddy-global-navigation_1587l_1",
670
- "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1587l_6",
671
- "teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_1587l_26",
672
- "teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_1587l_31",
673
- "teddy-global-navigation__link": "_teddy-global-navigation__link_1587l_35",
674
- "teddy-global-navigation__header": "_teddy-global-navigation__header_1587l_48",
675
- "teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_1587l_51",
676
- "teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_1587l_54",
677
- "teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_1587l_58",
678
- "teddy-global-navigation__list": "_teddy-global-navigation__list_1587l_64",
679
- "teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_1587l_69",
680
- "teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_1587l_72",
681
- "teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_1587l_76",
682
- "teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_1587l_83",
683
- "close-viewport": "_close-viewport_1587l_1",
684
- "teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_1587l_99",
685
- "teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_1587l_102"
663
+ "teddy-global-navigation": "_teddy-global-navigation_16lml_1",
664
+ "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_16lml_6",
665
+ "teddy-global-navigation__top-icon-wrapper": "_teddy-global-navigation__top-icon-wrapper_16lml_26",
666
+ "teddy-global-navigation__top-menu-icons": "_teddy-global-navigation__top-menu-icons_16lml_31",
667
+ "teddy-global-navigation__link": "_teddy-global-navigation__link_16lml_35",
668
+ "teddy-global-navigation__header": "_teddy-global-navigation__header_16lml_48",
669
+ "teddy-global-navigation__colored-box": "_teddy-global-navigation__colored-box_16lml_51",
670
+ "teddy-global-navigation__colored-box--mobile": "_teddy-global-navigation__colored-box--mobile_16lml_54",
671
+ "teddy-global-navigation__sublink-button--mobile": "_teddy-global-navigation__sublink-button--mobile_16lml_58",
672
+ "teddy-global-navigation__list": "_teddy-global-navigation__list_16lml_64",
673
+ "teddy-global-navigation__viewport": "_teddy-global-navigation__viewport_16lml_69",
674
+ "teddy-global-navigation__item-wrapper": "_teddy-global-navigation__item-wrapper_16lml_72",
675
+ "teddy-global-navigation__item-count": "_teddy-global-navigation__item-count_16lml_76",
676
+ "teddy-global-navigation__viewport-wrapper": "_teddy-global-navigation__viewport-wrapper_16lml_83",
677
+ "close-viewport": "_close-viewport_16lml_1",
678
+ "teddy-global-navigation__top-menu-color": "_teddy-global-navigation__top-menu-color_16lml_99",
679
+ "teddy-global-navigation__top-menu-wrapper": "_teddy-global-navigation__top-menu-wrapper_16lml_102"
686
680
  };
687
681
  function MyPages(props) {
688
682
  var _a, _b;
@@ -841,11 +835,8 @@ const ShoppingCart = React__default.forwardRef(() => {
841
835
  ShoppingCart.displayName = "ShoppingCart";
842
836
  const Desktop = React__default.forwardRef(() => {
843
837
  const rootContext = React__default.useContext(RootContext);
844
- const lastScrollDirection = React__default.useRef();
845
- const scrollStartPos = React__default.useRef(0);
846
- const lastScrollPos = React__default.useRef(0);
838
+ const [showMenu, setShowMenu] = React__default.useState(false);
847
839
  const topMenuRef = React__default.useRef(null);
848
- const viewPortRef = React__default.useRef(null);
849
840
  const shouldShowViewport = [...PRIVATE_LINKS.links, ...BUSINESS_LINKS.links, ...MDU_LINKS.links].some(
850
841
  (link) => {
851
842
  const sameParent = link.link.split("/")[1] === (rootContext == null ? void 0 : rootContext.pathname.split("/")[1]) || !link.link && (rootContext == null ? void 0 : rootContext.pathname) === "/";
@@ -856,12 +847,7 @@ const Desktop = React__default.forwardRef(() => {
856
847
  const topMenuHeight = (topMenuSize == null ? void 0 : topMenuSize.height) ? `${topMenuSize.height}px` : void 0;
857
848
  if (!rootContext)
858
849
  return null;
859
- function resetAndShowMenu() {
860
- lastScrollDirection.current = null;
861
- scrollStartPos.current = window.scrollY;
862
- lastScrollPos.current = window.scrollY;
863
- }
864
- const { showMenu, selectedMenuItem, setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
850
+ const { selectedMenuItem, setSelectedMenuItem, linkComponent: Link2, specifiedLink, setSpecifiedLink } = rootContext;
865
851
  const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
866
852
  const handleInteractions = (linkName) => {
867
853
  setSpecifiedLink(linkName || "");
@@ -876,7 +862,7 @@ const Desktop = React__default.forwardRef(() => {
876
862
  { ["--teddy-top-menu-height"]: topMenuHeight }
877
863
  ),
878
864
  className: styles[`${rootClassName}__top-menu-wrapper`],
879
- children: /* @__PURE__ */ jsx(NavigationMenu.TopMenuList, { onFocus: resetAndShowMenu, ref: topMenuRef, children: LINKS.map((link) => /* @__PURE__ */ jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsx(
865
+ children: /* @__PURE__ */ jsx(NavigationMenu.TopMenuList, { ref: topMenuRef, children: LINKS.map((link) => /* @__PURE__ */ jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsx(
880
866
  NavigationMenu.TopMenuTrigger,
881
867
  {
882
868
  value: link.name,
@@ -892,88 +878,88 @@ const Desktop = React__default.forwardRef(() => {
892
878
  ) }),
893
879
  LINKS.map((link) => {
894
880
  var _a;
895
- return /* @__PURE__ */ jsxs(NavigationMenu.List, { onFocus: resetAndShowMenu, value: link.name, children: [
896
- (_a = link.links) == null ? void 0 : _a.map(
897
- (subLink) => {
898
- var _a2, _b, _c;
899
- return /* @__PURE__ */ jsxs(NavigationMenu.Item, { value: subLink.name, children: [
900
- 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, onMouseEnter: () => handleInteractions(), onClick: () => handleInteractions(), children: /* @__PURE__ */ jsx(
901
- "img",
902
- {
903
- src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
904
- draggable: "false",
905
- alt: "Telia logo"
906
- }
907
- ) }) : /* @__PURE__ */ jsx(
908
- "a",
909
- {
910
- href: subLink.link,
911
- onMouseEnter: () => handleInteractions(),
912
- onClick: () => handleInteractions(),
913
- children: /* @__PURE__ */ jsx(
881
+ return /* @__PURE__ */ jsxs(
882
+ NavigationMenu.List,
883
+ {
884
+ onMouseEnter: () => setShowMenu(true),
885
+ onMouseLeave: () => setShowMenu(false),
886
+ value: link.name,
887
+ children: [
888
+ (_a = link.links) == null ? void 0 : _a.map(
889
+ (subLink) => {
890
+ var _a2, _b, _c;
891
+ return /* @__PURE__ */ jsxs(NavigationMenu.Item, { value: subLink.name, children: [
892
+ 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, onMouseEnter: () => handleInteractions(), onClick: () => handleInteractions(), children: /* @__PURE__ */ jsx(
914
893
  "img",
915
894
  {
916
895
  src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
917
896
  draggable: "false",
918
897
  alt: "Telia logo"
919
898
  }
899
+ ) }) : /* @__PURE__ */ jsx(
900
+ "a",
901
+ {
902
+ href: subLink.link,
903
+ onMouseEnter: () => handleInteractions(),
904
+ onClick: () => handleInteractions(),
905
+ children: /* @__PURE__ */ jsx(
906
+ "img",
907
+ {
908
+ src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
909
+ draggable: "false",
910
+ alt: "Telia logo"
911
+ }
912
+ )
913
+ }
914
+ ) }) : ((_a2 = subLink.links) == null ? void 0 : _a2.length) ? /* @__PURE__ */ jsx(
915
+ NavigationMenu.Trigger,
916
+ {
917
+ asChild: true,
918
+ active: currentLocation === subLink.link,
919
+ children: /* @__PURE__ */ jsx(Button, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), children: subLink.name })
920
+ }
921
+ ) : /* @__PURE__ */ jsx(
922
+ NavigationMenu.Link,
923
+ {
924
+ asChild: true,
925
+ active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
926
+ children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsx("a", { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name })
927
+ }
928
+ ),
929
+ typeof window !== "undefined" && /* @__PURE__ */ jsx(
930
+ "div",
931
+ {
932
+ style: mergeStyles(
933
+ { ["--teddy-viewport-wrapper-height"]: viewPortHeight }
934
+ ),
935
+ className: styles[`${rootClassName}__viewport-wrapper`],
936
+ "data-state": showMenu ? "open" : "closed",
937
+ children: /* @__PURE__ */ jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && /* @__PURE__ */ jsxs(Fragment, { children: [
938
+ ((_b = subLink.links) == null ? void 0 : _b.length) > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", pt: "400", pl: "150", pb: "250", children: /* @__PURE__ */ jsx(HightlightedLinksDesktop, { listName: subLink.name, setShowMenu, links: subLink.links }) }),
939
+ ((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "250", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", setShowMenu, links: subLink.highlightedLinks }) })
940
+ ] }) })
941
+ }
920
942
  )
921
- }
922
- ) }) : ((_a2 = subLink.links) == null ? void 0 : _a2.length) ? /* @__PURE__ */ jsx(
923
- NavigationMenu.Trigger,
924
- {
925
- asChild: true,
926
- active: currentLocation === subLink.link,
927
- children: /* @__PURE__ */ jsx(Button, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), children: subLink.name })
928
- }
929
- ) : /* @__PURE__ */ jsx(
930
- NavigationMenu.Link,
931
- {
932
- asChild: true,
933
- active: selectedMenuItem === subLink.name && currentLocation === subLink.link,
934
- children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsx("a", { onMouseEnter: () => handleInteractions(subLink.name), onClick: () => handleInteractions(subLink.name), href: subLink.link, children: subLink.name })
935
- }
936
- ),
937
- /* @__PURE__ */ jsx(NavigationMenu.Content, { children: !!specifiedLink && subLink.name === specifiedLink && typeof window !== "undefined" && /* @__PURE__ */ jsxs(Fragment, { children: [
938
- ((_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, links: subLink.links }) }),
939
- ((_c = subLink.highlightedLinks) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", pt: "400", pl: "400", pr: "400", pb: "250", className: styles[`${rootClassName}__colored-box`], children: /* @__PURE__ */ jsx(HightlightedLinksDesktop, { listName: "Nyttige snarveier", links: subLink.highlightedLinks }) })
940
- ] }) })
941
- ] }, subLink.name);
942
- }
943
- ),
944
- /* @__PURE__ */ jsx(Box, { ml: "auto" }),
945
- /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(ShoppingCart, {}) }),
946
- /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(Search, {}) }),
947
- /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(MyPages, {}) })
948
- ] }, link.name);
949
- }),
950
- /* @__PURE__ */ jsx(
951
- "div",
952
- {
953
- style: mergeStyles(
954
- { ["--teddy-viewport-wrapper-height"]: viewPortHeight }
955
- ),
956
- className: styles[`${rootClassName}__viewport-wrapper`],
957
- "data-state": showMenu ? "open" : "closed",
958
- children: /* @__PURE__ */ jsx(
959
- NavigationMenu.Viewport,
960
- {
961
- onFocus: resetAndShowMenu,
962
- ref: viewPortRef,
963
- ...typeof window === "undefined" ? { "data-state": "closed" } : {},
964
- className: styles[`${rootClassName}__viewport`]
965
- }
966
- )
967
- }
968
- )
943
+ ] }, subLink.name);
944
+ }
945
+ ),
946
+ /* @__PURE__ */ jsx(Box, { ml: "auto" }),
947
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(ShoppingCart, {}) }),
948
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(Search, {}) }),
949
+ /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(MyPages, {}) })
950
+ ]
951
+ },
952
+ link.name
953
+ );
954
+ })
969
955
  ] });
970
956
  });
971
957
  Desktop.displayName = "Desktop";
972
- const HightlightedLinksDesktop = ({ links, listName }) => {
958
+ const HightlightedLinksDesktop = ({ links, listName, setShowMenu }) => {
973
959
  const rootContext = React__default.useContext(RootContext);
974
960
  if (!rootContext)
975
961
  return null;
976
- const { linkComponent: Link2, setSpecifiedLink, setSelectedMenuItem, setShowMenu } = rootContext;
962
+ const { linkComponent: Link2, setSpecifiedLink, setSelectedMenuItem } = rootContext;
977
963
  const currentLocation = rootContext.pathname.endsWith("/") ? rootContext.pathname : `${rootContext.pathname}/`;
978
964
  return /* @__PURE__ */ jsxs(Fragment, { children: [
979
965
  /* @__PURE__ */ jsx(Heading, { pl: "100", pb: "100", variant: "title-200", as: "h2", children: listName }),
@@ -1184,7 +1170,6 @@ function Root({
1184
1170
  const [selectedDomainItem, setSelectedDomainItem] = React__default.useState(getInitialDomain(currentPath));
1185
1171
  const [pathname, setPathname] = React__default.useState(currentPath || "");
1186
1172
  const [specifiedLink, setSpecifiedLink] = React__default.useState(getInitialMenuItem(currentPath));
1187
- const [showMenu, setShowMenu] = React__default.useState(false);
1188
1173
  const classes = clsx([styles[`${rootClassName}`]], className);
1189
1174
  useEffect(() => {
1190
1175
  setPathname(currentPath || "");
@@ -1223,9 +1208,7 @@ function Root({
1223
1208
  onCartOpenChange,
1224
1209
  drawerSize,
1225
1210
  specifiedLink,
1226
- setSpecifiedLink,
1227
- showMenu,
1228
- setShowMenu
1211
+ setSpecifiedLink
1229
1212
  },
1230
1213
  children: /* @__PURE__ */ jsx(Box, { ...props, className: classes, children: /* @__PURE__ */ jsxs(
1231
1214
  NavigationMenu,
@@ -1238,8 +1221,6 @@ function Root({
1238
1221
  return;
1239
1222
  setSelectedMenuItem(v);
1240
1223
  },
1241
- onMouseEnter: () => setShowMenu(true),
1242
- onMouseLeave: () => setShowMenu(false),
1243
1224
  children: [
1244
1225
  /* @__PURE__ */ jsxs(Box, { display: { sm: "none", lg: "block" }, children: [
1245
1226
  isSimplified && /* @__PURE__ */ jsx(DesktopSimplified, {}),
package/dist/style.css CHANGED
@@ -5117,41 +5117,41 @@
5117
5117
  height: var(--radix-navigation-menu-viewport-height);
5118
5118
  transform-origin: top left;
5119
5119
  overflow: clip;
5120
- }._teddy-global-navigation_1587l_1 {
5120
+ }._teddy-global-navigation_16lml_1 {
5121
5121
  position: sticky;
5122
5122
  inset: 0 0 auto 0;
5123
5123
  z-index: 39;
5124
5124
  }
5125
- ._teddy-global-navigation__mobile_1587l_6 {
5125
+ ._teddy-global-navigation__mobile_16lml_6 {
5126
5126
  padding: var(--teddy-spacing-25) var(--teddy-spacing-200);
5127
5127
  border-bottom: var(--teddy-border-width-sm) solid var(--teddy-color-border-weak);
5128
5128
  }
5129
5129
  @media screen and (max-width: 335px) {
5130
- ._teddy-global-navigation__mobile_1587l_6 {
5130
+ ._teddy-global-navigation__mobile_16lml_6 {
5131
5131
  padding: var(--teddy-spacing-25) 0;
5132
5132
  }
5133
5133
  }
5134
- ._teddy-global-navigation__mobile_1587l_6::before {
5134
+ ._teddy-global-navigation__mobile_16lml_6::before {
5135
5135
  content: "";
5136
5136
  display: block;
5137
5137
  width: var(--width-for-centering-element);
5138
5138
  }
5139
- ._teddy-global-navigation__mobile_1587l_6::after {
5139
+ ._teddy-global-navigation__mobile_16lml_6::after {
5140
5140
  content: "";
5141
5141
  display: block;
5142
5142
  width: var(--width-for-centering-element);
5143
5143
  }
5144
5144
  @media screen and (max-width: 335px) {
5145
- ._teddy-global-navigation__top-icon-wrapper_1587l_26 {
5145
+ ._teddy-global-navigation__top-icon-wrapper_16lml_26 {
5146
5146
  gap: 0;
5147
5147
  }
5148
5148
  }
5149
5149
  @media screen and (max-width: 335px) {
5150
- ._teddy-global-navigation__top-menu-icons_1587l_31 {
5150
+ ._teddy-global-navigation__top-menu-icons_16lml_31 {
5151
5151
  gap: 0;
5152
5152
  }
5153
5153
  }
5154
- ._teddy-global-navigation__link_1587l_35 {
5154
+ ._teddy-global-navigation__link_16lml_35 {
5155
5155
  text-decoration: none;
5156
5156
  display: flex;
5157
5157
  justify-content: space-between;
@@ -5161,81 +5161,81 @@
5161
5161
  font-weight: var(--teddy-typography-weight-bold);
5162
5162
  font-size: var(--teddy-typography-scale-400);
5163
5163
  }
5164
- ._teddy-global-navigation__link_1587l_35:hover {
5164
+ ._teddy-global-navigation__link_16lml_35:hover {
5165
5165
  background-color: var(--teddy-color-background-interactive-transparent-hover);
5166
5166
  }
5167
- ._teddy-global-navigation__header_1587l_48 {
5167
+ ._teddy-global-navigation__header_16lml_48 {
5168
5168
  color: var(--teddy-color-text-interactive-primary);
5169
5169
  }
5170
- ._teddy-global-navigation__colored-box_1587l_51 {
5170
+ ._teddy-global-navigation__colored-box_16lml_51 {
5171
5171
  background-color: var(--teddy-color-background-secondary);
5172
5172
  }
5173
- ._teddy-global-navigation__colored-box--mobile_1587l_54 {
5173
+ ._teddy-global-navigation__colored-box--mobile_16lml_54 {
5174
5174
  margin: 0 -1.5rem;
5175
5175
  background-color: var(--teddy-color-background-secondary);
5176
5176
  }
5177
- ._teddy-global-navigation__sublink-button--mobile_1587l_58 {
5177
+ ._teddy-global-navigation__sublink-button--mobile_16lml_58 {
5178
5178
  background-color: transparent;
5179
5179
  padding: 0;
5180
5180
  color: var(--teddy-color-text-interactive-primary);
5181
5181
  border-radius: unset;
5182
5182
  }
5183
- ._teddy-global-navigation__list_1587l_64 {
5183
+ ._teddy-global-navigation__list_16lml_64 {
5184
5184
  column-count: 2;
5185
5185
  max-height: 13rem;
5186
5186
  column-gap: var(--teddy-spacing-300);
5187
5187
  }
5188
- ._teddy-global-navigation__viewport_1587l_69._teddy-global-navigation__viewport_1587l_69 {
5188
+ ._teddy-global-navigation__viewport_16lml_69._teddy-global-navigation__viewport_16lml_69 {
5189
5189
  height: var(--teddy-viewport-wrapper-height);
5190
5190
  }
5191
- ._teddy-global-navigation__item-wrapper_1587l_72 {
5191
+ ._teddy-global-navigation__item-wrapper_16lml_72 {
5192
5192
  position: relative;
5193
5193
  display: flex;
5194
5194
  }
5195
- ._teddy-global-navigation__item-count_1587l_76 {
5195
+ ._teddy-global-navigation__item-count_16lml_76 {
5196
5196
  display: flex;
5197
5197
  justify-content: center;
5198
5198
  align-items: center;
5199
5199
  position: absolute;
5200
5200
  transform: translate(calc(var(--teddy-spacing-150) + var(--teddy-spacing-25)), calc(-1 * var(--teddy-spacing-100) + var(--teddy-spacing-10)));
5201
5201
  }
5202
- ._teddy-global-navigation__viewport-wrapper_1587l_83 {
5202
+ ._teddy-global-navigation__viewport-wrapper_16lml_83 {
5203
5203
  position: absolute;
5204
- top: 112px;
5205
5204
  left: 0;
5206
5205
  width: 100%;
5207
5206
  overflow: hidden;
5208
5207
  transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
5209
5208
  box-shadow: var(--teddy-shadow-md);
5209
+ background-color: var(--teddy-color-background-primary);
5210
5210
  }
5211
- ._teddy-global-navigation__viewport-wrapper_1587l_83[data-state=open] {
5211
+ ._teddy-global-navigation__viewport-wrapper_16lml_83[data-state=open] {
5212
5212
  max-height: var(--teddy-viewport-wrapper-height);
5213
5213
  }
5214
- ._teddy-global-navigation__viewport-wrapper_1587l_83[data-state=closed] {
5214
+ ._teddy-global-navigation__viewport-wrapper_16lml_83[data-state=closed] {
5215
5215
  max-height: 0;
5216
- animation: _close-viewport_1587l_1 var(--teddy-motion-duration-controlled, 0) ease;
5216
+ animation: _close-viewport_16lml_1 var(--teddy-motion-duration-controlled, 0) ease;
5217
5217
  }
5218
- ._teddy-global-navigation__top-menu-color_1587l_99 {
5218
+ ._teddy-global-navigation__top-menu-color_16lml_99 {
5219
5219
  background-color: var(--teddy-color-background-secondary);
5220
5220
  }
5221
- ._teddy-global-navigation__top-menu-wrapper_1587l_102 {
5221
+ ._teddy-global-navigation__top-menu-wrapper_16lml_102 {
5222
5222
  overflow: hidden;
5223
5223
  max-width: 84rem;
5224
5224
  transition: max-height var(--teddy-motion-duration-controlled, 0) ease;
5225
5225
  margin: 0 var(--teddy-spacing-600);
5226
5226
  }
5227
5227
  @media (min-width: 1440px) {
5228
- ._teddy-global-navigation__top-menu-wrapper_1587l_102 {
5228
+ ._teddy-global-navigation__top-menu-wrapper_16lml_102 {
5229
5229
  margin: 0 auto;
5230
5230
  }
5231
5231
  }
5232
- ._teddy-global-navigation__top-menu-wrapper_1587l_102[data-state=open] {
5232
+ ._teddy-global-navigation__top-menu-wrapper_16lml_102[data-state=open] {
5233
5233
  max-height: var(--teddy-top-menu-height, 47px);
5234
5234
  }
5235
- ._teddy-global-navigation__top-menu-wrapper_1587l_102[data-state=closed] {
5235
+ ._teddy-global-navigation__top-menu-wrapper_16lml_102[data-state=closed] {
5236
5236
  max-height: 0;
5237
5237
  }
5238
- @keyframes _close-viewport_1587l_1 {
5238
+ @keyframes _close-viewport_16lml_1 {
5239
5239
  0% {
5240
5240
  max-height: var(--teddy-viewport-wrapper-height);
5241
5241
  }
package/package.json CHANGED
@@ -20,7 +20,7 @@
20
20
  "pnpm": ">=9"
21
21
  },
22
22
  "private": false,
23
- "version": "0.1.34",
23
+ "version": "0.1.36",
24
24
  "sideEffects": [
25
25
  "**/*.css",
26
26
  "**/*.svg"