@telia/teddy 0.0.27 → 0.0.28

package/dist/components/navigation-menu/global-navigation/global-navigation-my-pages.js

@@ -0,0 +1,369 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import React__default from "react";
+import clsx from "clsx";
+import { MY_PAGE_LINKS, LOGGED_IN_LINKS_BUSINESS, LINKS, PRIVATE_LINKS, BUSINESS_LINKS, MDU_LINKS } from "./utils.js";
+import { NavigationMenu } from "../navigation-menu.js";
+import { Box } from "../../box/box.js";
+import { Drawer } from "../../drawer/index.js";
+import "../../../assets/sprite.269ba410-teddy.svg";
+import { Icon } from "../../icon/icon.js";
+import { Button } from "../../button/button.js";
+import { Grid } from "../../grid/grid.js";
+import { Heading } from "../../heading/heading.js";
+import { TextSpacing } from "../../text-spacing/text-spacing.js";
+import { Tabs } from "../../tabs/index.js";
+import { SearchField } from "./global-navigation-search-field.js";
+import { Flex } from "../../flex/flex.js";
+import { Accordion } from "../../accordion/index.js";
+import { VisuallyHidden } from "../../visually-hidden/visually-hidden.js";
+import { Link } from "../../link/link.js";
+import { List } from "../../list/index.js";
+const styles = {
+  "teddy-global-navigation": "_teddy-global-navigation_1b1i5_1",
+  "teddy-global-navigation__mobile": "_teddy-global-navigation__mobile_1b1i5_5",
+  "teddy-global-navigation__link": "_teddy-global-navigation__link_1b1i5_19"
+};
+function MyPages(props) {
+  var _a, _b;
+  const rootContext = React__default.useContext(RootContext);
+  const isLoggedIn = (((_a = rootContext == null ? void 0 : rootContext.loggedInUser) == null ? void 0 : _a.name.length) || 0) > 0;
+  return /* @__PURE__ */ jsxs(Drawer, { ...props, children: [
+    /* @__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", { children: [
+      /* @__PURE__ */ jsx(Icon, { name: "end-user", size: "sm" }),
+      rootContext.loggedInUser.name
+    ] }) : /* @__PURE__ */ jsxs("button", { children: [
+      /* @__PURE__ */ jsx(Icon, { name: "login", size: "sm" }),
+      "Logg inn"
+    ] }) }) }),
+    /* @__PURE__ */ jsxs(Drawer.Content, { asChild: true, children: [
+      /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
+      isLoggedIn ? /* @__PURE__ */ jsx(LoggedInContent, {}) : /* @__PURE__ */ jsx(LoggedOutContent, {}),
+      /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { children: "Lukk" }) }) })
+    ] })
+  ] });
+}
+function LoggedOutContent() {
+  return /* @__PURE__ */ jsxs(Grid, { gap: "400", children: [
+    /* @__PURE__ */ jsx(Drawer.Title, { children: "Logg inn" }),
+    /* @__PURE__ */ jsxs(TextSpacing, { children: [
+      /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", children: "Privat" }),
+      /* @__PURE__ */ jsx(Button, { variant: "secondary", asChild: true, children: /* @__PURE__ */ jsxs("a", { href: MY_PAGE_LINKS.link, children: [
+        MY_PAGE_LINKS.name,
+        " ",
+        /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs(TextSpacing, { children: [
+      /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", children: "Bedrift" }),
+      /* @__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: [
+        link.name,
+        " ",
+        /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
+      ] }) })) })
+    ] })
+  ] });
+}
+function LoggedInContent() {
+  const rootContext = React__default.useContext(RootContext);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Drawer.Title, { mb: "200", children: "Dine sider" }),
+    /* @__PURE__ */ jsxs(Tabs, { defaultValue: "private", children: [
+      /* @__PURE__ */ jsxs(Tabs.List, { children: [
+        /* @__PURE__ */ jsx(Tabs.Trigger, { value: "private", children: "Privat" }),
+        /* @__PURE__ */ jsx(Tabs.Trigger, { value: "business", children: "Bedrift" })
+      ] }),
+      /* @__PURE__ */ jsxs(TextSpacing, { children: [
+        /* @__PURE__ */ jsxs(Tabs.Content, { value: "private", children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", mb: "100", mt: "400", children: "Privat" }),
+          MY_PAGE_LINKS.links.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))
+        ] }),
+        /* @__PURE__ */ jsxs(Tabs.Content, { value: "business", children: [
+          /* @__PURE__ */ jsx(Heading, { variant: "title-100", as: "h3", mb: "100", mt: "400", children: "Bedrift" }),
+          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))
+        ] }),
+        /* @__PURE__ */ jsx(Button, { mt: "200", onClick: () => rootContext == null ? void 0 : rootContext.onLogoutClick, variant: "secondary", children: /* @__PURE__ */ jsx(Icon, { name: "logout", children: "Logg ut" }) })
+      ] })
+    ] })
+  ] });
+}
+MyPages.displayName = "MyPages";
+function Search(props) {
+  const searchFieldRef = React__default.useRef(null);
+  return /* @__PURE__ */ jsxs(Drawer, { ...props, children: [
+    /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
+      /* @__PURE__ */ jsx(Icon, { name: "search", size: "sm" }),
+      " Søk"
+    ] }) }) }),
+    /* @__PURE__ */ jsxs(
+      Drawer.Content,
+      {
+        onOpenAutoFocus: (e) => {
+          var _a;
+          e.preventDefault();
+          (_a = searchFieldRef.current) == null ? void 0 : _a.focus();
+        },
+        children: [
+          /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
+          /* @__PURE__ */ jsx(Drawer.Title, { children: "Hva leter du etter?" }),
+          /* @__PURE__ */ jsx(SearchField, { ref: searchFieldRef }),
+          /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { children: "Lukk" }) }) })
+        ]
+      }
+    )
+  ] });
+}
+Search.displayName = "Search";
+const ShoppingCart = React__default.forwardRef(() => {
+  const rootContext = React__default.useContext(RootContext);
+  const shoppingCartContent = rootContext == null ? void 0 : rootContext.shoppingCart;
+  return /* @__PURE__ */ jsxs(Drawer, { children: [
+    /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
+      /* @__PURE__ */ jsx(Icon, { name: "cart", size: "sm" }),
+      " Handlekurv"
+    ] }) }) }),
+    /* @__PURE__ */ jsxs(Drawer.Content, { children: [
+      /* @__PURE__ */ jsx(Drawer.Close, { slot: "floating", "aria-label": "Lukk" }),
+      /* @__PURE__ */ jsx(Drawer.Title, { children: "Handlekurv" }),
+      shoppingCartContent ? shoppingCartContent : null,
+      /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { children: "Lukk" }) }) })
+    ] })
+  ] });
+});
+ShoppingCart.displayName = "ShoppingCart";
+const Desktop = React__default.forwardRef(() => {
+  const rootContext = React__default.useContext(RootContext);
+  if (!rootContext)
+    return null;
+  const { setSelectedMenuItem, linkComponent: Link2 } = rootContext;
+  const currentLocation = rootContext.pathname;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(NavigationMenu.TopMenuList, { children: LINKS.map((link) => /* @__PURE__ */ jsx(NavigationMenu.TopMenuItem, { children: /* @__PURE__ */ jsx(NavigationMenu.TopMenuTrigger, { value: link.name, asChild: true, children: /* @__PURE__ */ jsx(Link2, { children: link.name }) }) }, link.name)) }),
+    LINKS.map((link) => /* @__PURE__ */ jsxs(NavigationMenu.List, { value: link.name, children: [
+      link.links.map((subLink) => /* @__PURE__ */ jsxs(NavigationMenu.Item, { value: subLink.name, children: [
+        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(
+          "img",
+          {
+            src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
+            draggable: "false",
+            alt: "Telia logo"
+          }
+        ) }) : /* @__PURE__ */ jsx("a", { href: subLink.link, onClick: () => setSelectedMenuItem(""), children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: "https://cdn.voca.teliacompany.com/logo/Telia-primary-default-v2.svg",
+            draggable: "false",
+            alt: "Telia logo"
+          }
+        ) }) }) : /* @__PURE__ */ jsx(
+          NavigationMenu.Trigger,
+          {
+            asChild: true,
+            active: currentLocation === subLink.link,
+            onClick: () => {
+              rootContext.setPathname(subLink.link);
+            },
+            children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsx("a", { href: subLink.link, children: subLink.name })
+          }
+        ),
+        /* @__PURE__ */ jsx(NavigationMenu.Content, { children: /* @__PURE__ */ jsx("ul", { children: subLink.links.map((subSubLink) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          NavigationMenu.Link,
+          {
+            asChild: true,
+            active: currentLocation === subSubLink.link,
+            onClick: () => {
+              rootContext.setPathname(subSubLink.link);
+            },
+            variant: "small",
+            children: subSubLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(Link2, { href: subSubLink.link, children: subSubLink.name }) : /* @__PURE__ */ jsx("a", { href: subSubLink.link, children: subSubLink.name })
+          }
+        ) }, subSubLink.name)) }) })
+      ] }, subLink.name)),
+      /* @__PURE__ */ jsx(Box, { ml: "auto" }),
+      /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(Search, {}) }),
+      /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(ShoppingCart, {}) }),
+      /* @__PURE__ */ jsx(NavigationMenu.Item, { children: /* @__PURE__ */ jsx(MyPages, {}) })
+    ] }, link.name)),
+    /* @__PURE__ */ jsx(NavigationMenu.Viewport, {})
+  ] });
+});
+Desktop.displayName = "Desktop";
+const Mobile = React__default.forwardRef(({ className }) => {
+  const rootContext = React__default.useContext(RootContext);
+  const drawerRef = React__default.useRef(null);
+  if (!rootContext)
+    return null;
+  const { linkComponent: NavLink } = rootContext;
+  const classes = clsx([styles[`${rootClassName}__mobile`]], className);
+  const linkClasses = clsx([styles[`${rootClassName}__link`]]);
+  const currentLocation = rootContext.pathname;
+  return /* @__PURE__ */ jsx(Flex, { className: classes, children: /* @__PURE__ */ jsxs(Flex, { flexGrow: "1", justify: "between", align: "center", gap: "200", children: [
+    /* @__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" }) }) }) }),
+    /* @__PURE__ */ jsxs(Flex, { flexBasis: "0", gap: { sm: "100", md: "200" }, children: [
+      /* @__PURE__ */ jsx(ShoppingCart, {}),
+      /* @__PURE__ */ jsx(MyPages, {}),
+      /* @__PURE__ */ jsxs(Drawer, { children: [
+        /* @__PURE__ */ jsx(NavigationMenu.Link, { asChild: true, variant: "button", children: /* @__PURE__ */ jsx(Drawer.Trigger, { children: /* @__PURE__ */ jsxs("button", { children: [
+          /* @__PURE__ */ jsx(Icon, { name: "menu", size: "sm" }),
+          " Meny"
+        ] }) }) }),
+        /* @__PURE__ */ jsxs(Drawer.Content, { gap: "400", children: [
+          /* @__PURE__ */ jsx(Drawer.Close, { ref: drawerRef, slot: "floating", "aria-label": "Lukk" }),
+          /* @__PURE__ */ jsx(Drawer.Title, { children: "Meny" }),
+          /* @__PURE__ */ jsx(SearchField, {}),
+          /* @__PURE__ */ jsxs(Tabs, { value: rootContext.selectedDomainItem, onValueChange: rootContext.setSelectedDomainItem, children: [
+            /* @__PURE__ */ jsx(Tabs.List, { children: LINKS.map((link) => /* @__PURE__ */ jsx(Tabs.Trigger, { value: link.name, children: link.name }, link.name)) }),
+            /* @__PURE__ */ jsx(Box, { mt: "400", children: LINKS.map((link) => /* @__PURE__ */ jsx(Tabs.Content, { value: link.name, children: /* @__PURE__ */ jsx(
+              Accordion,
+              {
+                type: "single",
+                collapsible: true,
+                value: rootContext.selectedMenuItem,
+                onValueChange: rootContext.setSelectedMenuItem,
+                children: link.links.filter((l) => l.name !== "Logo").map((subLink) => /* @__PURE__ */ jsxs(Accordion.Item, { value: subLink.name, children: [
+                  /* @__PURE__ */ jsxs(Accordion.Header, { children: [
+                    /* @__PURE__ */ jsx(
+                      Link,
+                      {
+                        className: linkClasses,
+                        href: "#",
+                        variant: "standalone",
+                        asChild: true,
+                        onClick: () => {
+                          var _a;
+                          (_a = drawerRef.current) == null ? void 0 : _a.click();
+                          rootContext.setSelectedMenuItem(subLink.name);
+                          rootContext.setPathname(subLink.link);
+                        },
+                        children: subLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(NavLink, { href: subLink.link, children: subLink.name }) : /* @__PURE__ */ jsx("a", { href: subLink.link, children: subLink.name })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(Accordion.Trigger, { children: /* @__PURE__ */ jsxs(VisuallyHidden, { children: [
+                      subLink.name,
+                      " linker"
+                    ] }) })
+                  ] }),
+                  /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(List, { gap: "10", pl: "25", children: subLink.links.map((subSubLink) => /* @__PURE__ */ jsx(List.Item, { children: /* @__PURE__ */ jsx(
+                    NavigationMenu.Link,
+                    {
+                      asChild: true,
+                      variant: "small",
+                      active: currentLocation === subSubLink.link,
+                      onClick: () => {
+                        var _a;
+                        (_a = drawerRef.current) == null ? void 0 : _a.click();
+                        rootContext.setPathname(subSubLink.link);
+                      },
+                      children: subSubLink.appKey === rootContext.appKey || rootContext.appKey === "storybook" ? /* @__PURE__ */ jsx(NavLink, { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", children: [
+                        subSubLink.name,
+                        " ",
+                        /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
+                      ] }) }) : /* @__PURE__ */ jsx("a", { href: subSubLink.link, children: /* @__PURE__ */ jsxs(Flex, { as: "span", gap: "100", children: [
+                        subSubLink.name,
+                        " ",
+                        /* @__PURE__ */ jsx(Icon, { name: "arrow-right" })
+                      ] }) })
+                    }
+                  ) }, subSubLink.name)) }) })
+                ] }, subLink.name))
+              }
+            ) }, link.name)) })
+          ] }),
+          /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsx(Drawer.Close, { slot: "content", children: /* @__PURE__ */ jsx(Button, { children: "Lukk" }) }) })
+        ] })
+      ] })
+    ] })
+  ] }) });
+});
+Mobile.displayName = "Mobile";
+const rootClassName = "teddy-global-navigation";
+const RootContext = React__default.createContext(null);
+function Root({
+  className,
+  appKey,
+  loggedInUser,
+  linkComponent,
+  onLogoutClick,
+  shoppingCart,
+  ...props
+}) {
+  const [selectedMenuItem, setSelectedMenuItem] = React__default.useState(getInitialMenuItem());
+  const [selectedDomainItem, setSelectedDomainItem] = React__default.useState(getInitialDomain());
+  const [pathname, setPathname] = React__default.useState(typeof window !== "undefined" ? window.location.pathname : "");
+  const classes = clsx([styles[`${rootClassName}`]], className);
+  return /* @__PURE__ */ jsx(
+    RootContext.Provider,
+    {
+      value: {
+        appKey,
+        loggedInUser,
+        selectedMenuItem,
+        setSelectedMenuItem,
+        linkComponent,
+        selectedDomainItem,
+        setSelectedDomainItem,
+        pathname,
+        setPathname,
+        onLogoutClick,
+        shoppingCart
+      },
+      children: /* @__PURE__ */ jsx(Box, { ...props, className: classes, children: /* @__PURE__ */ jsxs(
+        NavigationMenu,
+        {
+          topMenuValue: selectedDomainItem,
+          onTopMenuValueChange: setSelectedDomainItem,
+          value: selectedMenuItem,
+          onValueChange: (v) => {
+            if (v === "")
+              return;
+            setSelectedMenuItem(v);
+          },
+          children: [
+            /* @__PURE__ */ jsx(Box, { display: { sm: "none", lg: "block" }, children: /* @__PURE__ */ jsx(Desktop, {}) }),
+            /* @__PURE__ */ jsx(Box, { display: { lg: "none" }, children: /* @__PURE__ */ jsx(Mobile, {}) })
+          ]
+        }
+      ) })
+    }
+  );
+}
+Root.displayName = "Root";
+function getInitialDomain() {
+  const currentLocation = typeof window !== "undefined" ? window.location.pathname : null;
+  if (!currentLocation)
+    return PRIVATE_LINKS.name;
+  const locationArray = currentLocation ? currentLocation.split("/") : [];
+  const domainPartOfLocation = `/${locationArray[1]}`;
+  const initDomain = domainPartOfLocation === BUSINESS_LINKS.link ? BUSINESS_LINKS.name : domainPartOfLocation === MDU_LINKS.link ? MDU_LINKS.name : PRIVATE_LINKS.name;
+  return initDomain;
+}
+function getInitialMenuItem() {
+  var _a, _b, _c;
+  const currentLocation = typeof window !== "undefined" ? window.location.pathname : null;
+  if (!currentLocation)
+    return;
+  const locationArray = currentLocation ? currentLocation.split("/") : [];
+  const initialDomain = getInitialDomain();
+  if (initialDomain === "Bedrift") {
+    const mainMenuPartOfLocation2 = locationArray[2];
+    return (_a = BUSINESS_LINKS.links.find((link) => link.link === `/${initialDomain.toLowerCase()}/${mainMenuPartOfLocation2}`)) == null ? void 0 : _a.name;
+  }
+  if (initialDomain === "Borettslag") {
+    const mainMenuPartOfLocation2 = locationArray[2];
+    return (_b = MDU_LINKS.links.find((link) => link.link === `/${initialDomain.toLowerCase()}/${mainMenuPartOfLocation2}`)) == null ? void 0 : _b.name;
+  }
+  const mainMenuPartOfLocation = locationArray[1];
+  return (_c = PRIVATE_LINKS.links.find((link) => link.link === `/${mainMenuPartOfLocation}`)) == null ? void 0 : _c.name;
+}
+Root.displayName = "GlobalNavigation";
+const GlobalNavigation = Root;
+export {
+  Desktop as D,
+  GlobalNavigation as G,
+  Mobile as M,
+  MyPages,
+  RootContext as R,
+  Search as S,
+  ShoppingCart as a,
+  Root as b,
+  rootClassName as r
+};

package/dist/components/navigation-menu/global-navigation/global-navigation-root.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("react/jsx-runtime");
+require("react");
+require("clsx");
+const components_navigationMenu_globalNavigation_globalNavigationMyPages = require("./global-navigation-my-pages.cjs");
+require("./utils.cjs");
+require("../../box/box.cjs");
+require("../navigation-menu.cjs");
+exports.Root = components_navigationMenu_globalNavigation_globalNavigationMyPages.Root;
+exports.RootContext = components_navigationMenu_globalNavigation_globalNavigationMyPages.RootContext;
+exports.rootClassName = components_navigationMenu_globalNavigation_globalNavigationMyPages.rootClassName;

package/dist/components/navigation-menu/global-navigation/global-navigation-root.d.ts

@@ -0,0 +1,33 @@
+import { default as React } from 'react';
+import { AppKey } from './utils';
+
+export declare const rootClassName = "teddy-global-navigation";
+type User = {
+    name: string;
+};
+export type RootProps = React.ComponentPropsWithoutRef<'div'> & {
+    appKey: AppKey;
+    loggedInUser?: User;
+    linkComponent: React.ForwardRefExoticComponent<React.AnchorHTMLAttributes<HTMLAnchorElement> & React.RefAttributes<HTMLAnchorElement>>;
+    onLogoutClick(): void;
+    shoppingCart?: React.ReactNode;
+};
+type RootContext = {
+    appKey: RootProps['appKey'];
+    loggedInUser: RootProps['loggedInUser'];
+    selectedMenuItem: string | undefined;
+    setSelectedMenuItem: (v: string | undefined) => void;
+    selectedDomainItem: string;
+    setSelectedDomainItem: (v: string) => void;
+    linkComponent: RootProps['linkComponent'];
+    pathname: string;
+    setPathname: (v: string) => void;
+    onLogoutClick: RootProps['onLogoutClick'];
+    shoppingCart?: React.ReactNode;
+};
+export declare const RootContext: React.Context<RootContext | null>;
+export declare function Root({ className, appKey, loggedInUser, linkComponent, onLogoutClick, shoppingCart, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Root {
+    var displayName: string;
+}
+export {};

package/dist/components/navigation-menu/global-navigation/global-navigation-root.js

@@ -0,0 +1,12 @@
+import "react/jsx-runtime";
+import "react";
+import "clsx";
+import { b, R, r } from "./global-navigation-my-pages.js";
+import "./utils.js";
+import "../../box/box.js";
+import "../navigation-menu.js";
+export {
+  b as Root,
+  R as RootContext,
+  r as rootClassName
+};

package/dist/components/navigation-menu/global-navigation/global-navigation-search-field.cjs

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+require("../../../assets/sprite.269ba410-teddy.svg");
+const components_icon_icon = require("../../icon/icon.cjs");
+const components_textField_index = require("../../text-field/index.cjs");
+const utils_composeRefs = require("../../../utils/composeRefs.cjs");
+const SearchField = React.forwardRef(
+  (props, forwardRef) => {
+    const ref = React.useRef(null);
+    const composedRef = utils_composeRefs.useComposedRefs(forwardRef, ref);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "form",
+      {
+        onSubmit: (e) => {
+          var _a;
+          if (!window || e.isDefaultPrevented())
+            return;
+          e.preventDefault();
+          window.location.href = `/sok?q=${encodeURIComponent(((_a = ref.current) == null ? void 0 : _a.value) || "")}`;
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsxs(components_textField_index.TextField, { ...props, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(components_textField_index.TextField.Label, { children: "Søk i innhold" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(components_textField_index.TextField.InputGroup, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(components_icon_icon.Icon, { name: "search" }),
+            /* @__PURE__ */ jsxRuntime.jsx(components_textField_index.TextField.Input, { ref: composedRef, placeholder: "Søk her" }),
+            /* @__PURE__ */ jsxRuntime.jsx(components_textField_index.TextField.ClearButton, {})
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(components_textField_index.TextField.Button, { variant: "separated", children: "Søk" })
+        ] })
+      }
+    );
+  }
+);
+SearchField.displayName = "SearchField";
+exports.SearchField = SearchField;

package/dist/components/navigation-menu/global-navigation/global-navigation-search-field.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { TextField } from '../../text-field';
+
+export type SearchFieldProps = React.ComponentPropsWithoutRef<typeof TextField>;
+export declare const SearchField: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import('../../input/input-indicator').InputIndicatorProps, "isLoading" | "isValid"> & {
+    disabled?: boolean | undefined;
+    readOnly?: boolean | undefined;
+    errors?: (string | null | undefined)[] | null | undefined;
+    isRequired?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/components/navigation-menu/global-navigation/global-navigation-search-field.js

@@ -0,0 +1,37 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React__default from "react";
+import "../../../assets/sprite.269ba410-teddy.svg";
+import { Icon } from "../../icon/icon.js";
+import { TextField } from "../../text-field/index.js";
+import { useComposedRefs } from "../../../utils/composeRefs.js";
+const SearchField = React__default.forwardRef(
+  (props, forwardRef) => {
+    const ref = React__default.useRef(null);
+    const composedRef = useComposedRefs(forwardRef, ref);
+    return /* @__PURE__ */ jsx(
+      "form",
+      {
+        onSubmit: (e) => {
+          var _a;
+          if (!window || e.isDefaultPrevented())
+            return;
+          e.preventDefault();
+          window.location.href = `/sok?q=${encodeURIComponent(((_a = ref.current) == null ? void 0 : _a.value) || "")}`;
+        },
+        children: /* @__PURE__ */ jsxs(TextField, { ...props, children: [
+          /* @__PURE__ */ jsx(TextField.Label, { children: "Søk i innhold" }),
+          /* @__PURE__ */ jsxs(TextField.InputGroup, { children: [
+            /* @__PURE__ */ jsx(Icon, { name: "search" }),
+            /* @__PURE__ */ jsx(TextField.Input, { ref: composedRef, placeholder: "Søk her" }),
+            /* @__PURE__ */ jsx(TextField.ClearButton, {})
+          ] }),
+          /* @__PURE__ */ jsx(TextField.Button, { variant: "separated", children: "Søk" })
+        ] })
+      }
+    );
+  }
+);
+SearchField.displayName = "SearchField";
+export {
+  SearchField
+};

package/dist/components/navigation-menu/global-navigation/global-navigation-search.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("react/jsx-runtime");
+require("react");
+require("../../drawer/index.cjs");
+require("../navigation-menu.cjs");
+const components_navigationMenu_globalNavigation_globalNavigationMyPages = require("./global-navigation-my-pages.cjs");
+require("../../../assets/sprite.269ba410-teddy.svg");
+require("../../icon/icon.cjs");
+require("./global-navigation-search-field.cjs");
+require("../../button/button.cjs");
+exports.Search = components_navigationMenu_globalNavigation_globalNavigationMyPages.Search;

package/dist/components/navigation-menu/global-navigation/global-navigation-search.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { Drawer } from '../../drawer';
+
+export type SearchProps = React.ComponentPropsWithoutRef<typeof Drawer>;
+export declare function Search(props: SearchProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Search {
+    var displayName: string;
+}

package/dist/components/navigation-menu/global-navigation/global-navigation-search.js

@@ -0,0 +1,12 @@
+import "react/jsx-runtime";
+import "react";
+import "../../drawer/index.js";
+import "../navigation-menu.js";
+import { S } from "./global-navigation-my-pages.js";
+import "../../../assets/sprite.269ba410-teddy.svg";
+import "../../icon/icon.js";
+import "./global-navigation-search-field.js";
+import "../../button/button.js";
+export {
+  S as Search
+};

package/dist/components/navigation-menu/global-navigation/global-navigation-shopping-cart.cjs

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("react/jsx-runtime");
+require("react");
+require("../../drawer/index.cjs");
+require("../navigation-menu.cjs");
+const components_navigationMenu_globalNavigation_globalNavigationMyPages = require("./global-navigation-my-pages.cjs");
+require("../../../assets/sprite.269ba410-teddy.svg");
+require("../../icon/icon.cjs");
+require("../../button/button.cjs");
+exports.ShoppingCart = components_navigationMenu_globalNavigation_globalNavigationMyPages.ShoppingCart;

package/dist/components/navigation-menu/global-navigation/global-navigation-shopping-cart.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+export type ShoppingCartProps = React.ComponentPropsWithoutRef<'div'>;
+export declare const ShoppingCart: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/navigation-menu/global-navigation/global-navigation-shopping-cart.js

@@ -0,0 +1,11 @@
+import "react/jsx-runtime";
+import "react";
+import "../../drawer/index.js";
+import "../navigation-menu.js";
+import { a } from "./global-navigation-my-pages.js";
+import "../../../assets/sprite.269ba410-teddy.svg";
+import "../../icon/icon.js";
+import "../../button/button.js";
+export {
+  a as ShoppingCart
+};

package/dist/components/navigation-menu/global-navigation/index.cjs

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const components_navigationMenu_globalNavigation_globalNavigationMyPages = require("./global-navigation-my-pages.cjs");
+exports.GlobalNavigation = components_navigationMenu_globalNavigation_globalNavigationMyPages.GlobalNavigation;

package/dist/components/navigation-menu/global-navigation/index.d.ts

@@ -0,0 +1,6 @@
+import { Root, RootProps } from './global-navigation-root';
+
+export declare const GlobalNavigation: typeof Root;
+export type GlobalNavigationProps = {
+    Root: RootProps;
+};

package/dist/components/navigation-menu/global-navigation/index.js

@@ -0,0 +1,4 @@
+import { G } from "./global-navigation-my-pages.js";
+export {
+  G as GlobalNavigation
+};